Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@iconify/vue
Advanced tools
@iconify/vue - npm Package Compare versions
Comparing version 3.1.0-beta.2 to 3.1.0-beta.3
@@ -8,3 +8,4 @@ { | ||
| "@iconify/utils", | ||
| "@cyberalien/redundancy" | ||
| "@cyberalien/redundancy", | ||
| "@iconify/api-redundancy" | ||
| ], | ||
@@ -11,0 +12,0 @@ "compiler": {}, |
| { | ||
| "$schema": "https://developer.microsoft.com/json-schemas/api-extractor/v7/api-extractor.schema.json", | ||
| "extends": "./api-extractor.iconify.json", | ||
| "mainEntryPointFilePath": "lib/offline.d.ts", | ||
| "bundledPackages": [ | ||
| "@iconify/types", | ||
| "@iconify/core", | ||
| "@iconify/utils", | ||
| "@cyberalien/redundancy" | ||
| ], | ||
| "compiler": {}, | ||
| "apiReport": { | ||
| "enabled": false | ||
| }, | ||
| "docModel": { | ||
| "enabled": false | ||
| }, | ||
| "dtsRollup": { | ||
| "enabled": true, | ||
| "untrimmedFilePath": "<projectFolder>/dist/offline.d.ts" | ||
| }, | ||
| "tsdocMetadata": { | ||
| "enabled": false | ||
| }, | ||
| "messages": { | ||
| "compilerMessageReporting": { | ||
| "default": { | ||
| "logLevel": "warning" | ||
| } | ||
| }, | ||
| "extractorMessageReporting": { | ||
| "default": { | ||
| "logLevel": "warning" | ||
| }, | ||
| "ae-missing-release-tag": { | ||
| "logLevel": "none" | ||
| } | ||
| }, | ||
| "tsdocMessageReporting": { | ||
| "default": { | ||
| "logLevel": "warning" | ||
| } | ||
| } | ||
| } | ||
| } |
@@ -1,12 +0,12 @@ | ||
| import { AllowedComponentProps } from 'vue'; | ||
| import { ComponentCustomProps } from 'vue'; | ||
| import { ComponentOptionsMixin } from 'vue'; | ||
| import { DefineComponent } from 'vue'; | ||
| import { EmitsOptions } from 'vue'; | ||
| import { VNodeProps } from 'vue'; | ||
| import type { AllowedComponentProps } from 'vue'; | ||
| import type { ComponentCustomProps } from 'vue'; | ||
| import type { ComponentOptionsMixin } from 'vue'; | ||
| import type { DefineComponent } from 'vue'; | ||
| import type { EmitsOptions } from 'vue'; | ||
| import type { VNodeProps } from 'vue'; | ||
| /** | ||
| * Add API provider | ||
| * Add custom config for provider | ||
| */ | ||
| export declare const addAPIProvider: (provider: string, customConfig: Partial<IconifyAPIConfig>) => boolean; | ||
| export declare function addAPIProvider(provider: string, customConfig: PartialIconifyAPIConfig): boolean; | ||
@@ -16,3 +16,3 @@ /** | ||
| */ | ||
| export declare const addCollection: (data: IconifyJSON, provider?: string) => boolean; | ||
| export declare function addCollection(data: IconifyJSON, provider?: string): boolean; | ||
@@ -22,6 +22,6 @@ /** | ||
| */ | ||
| export declare const addIcon: (name: string, data: IconifyIcon) => boolean; | ||
| export declare function addIcon(name: string, data: IconifyIcon): boolean; | ||
| /** | ||
| * Export internal functions that can be used by third party implementations | ||
| * Internal API | ||
| */ | ||
@@ -46,17 +46,20 @@ export declare const _api: IconifyAPIInternalFunctions; | ||
| /** | ||
| * Build SVG | ||
| * Build icon | ||
| */ | ||
| export declare const buildIcon: (icon: IconifyIcon, customisations: RawIconCustomisations) => IconifyIconBuildResult; | ||
| export declare function buildIcon(icon: IconifyIcon, customisations: RawIconCustomisations): IconifyIconBuildResult; | ||
| /** | ||
| * Calculate icon size | ||
| * Calculate second dimension when only 1 dimension is set | ||
| */ | ||
| export declare const calculateSize: (size: string | number, ratio: number, precision?: number) => string | number; | ||
| export declare function calculateSize(size: string | number, ratio: number, precision?: number): string | number; | ||
| export declare const disableCache: (storage: IconifyBrowserCacheType) => void; | ||
| /** | ||
| * Disable cache | ||
| */ | ||
| export declare function disableCache(storage: IconifyBrowserCacheType): void; | ||
| /** | ||
| * Enable and disable browser cache | ||
| * Enable cache | ||
| */ | ||
| export declare const enableCache: (storage: IconifyBrowserCacheType) => void; | ||
| export declare function enableCache(storage: IconifyBrowserCacheType): void; | ||
@@ -73,5 +76,5 @@ declare interface ExtendedIconifyAlias extends IconifyAlias, APIIconAttributes {} | ||
| /** | ||
| * Get icon data | ||
| * Get icon | ||
| */ | ||
| export declare const getIcon: (name: string) => Required<IconifyIcon>; | ||
| export declare function getIcon(name: string): Required<IconifyIcon> | null; | ||
@@ -102,3 +105,3 @@ /** | ||
| */ | ||
| export declare const iconExists: (name: string) => boolean; | ||
| export declare function iconExists(name: string): boolean; | ||
@@ -150,3 +153,3 @@ /** | ||
| */ | ||
| addAPIProvider: (provider: string, customConfig: Partial<IconifyAPIConfig>) => boolean; | ||
| addAPIProvider: (provider: string, customConfig: PartialIconifyAPIConfig) => boolean; | ||
| } | ||
@@ -436,3 +439,11 @@ | ||
| */ | ||
| export declare interface IconifyJSON extends IconifyOptional, IconifyMetaData { | ||
| export declare interface IconifyJSON extends IconifyJSONIconsData, IconifyMetaData { | ||
| // Optional list of missing icons. Returned by Iconify API when querying for icons that do not exist. | ||
| not_found?: string[]; | ||
| } | ||
| /** | ||
| * JSON structure, contains only icon data | ||
| */ | ||
| declare interface IconifyJSONIconsData extends IconifyOptional { | ||
| // Prefix for icons in JSON file, required. | ||
@@ -450,5 +461,2 @@ prefix: string; | ||
| // Optional list of missing icons. Returned by Iconify API when querying for icons that do not exist. | ||
| not_found?: string[]; | ||
| // IconifyOptional properties that are used as default values for icons when icon is missing value. | ||
@@ -460,2 +468,7 @@ // If property exists in both icon and root, use value from icon. | ||
| /** | ||
| * Function to load icons | ||
| */ | ||
| declare type IconifyLoadIcons = (icons: (IconifyIconName | string)[], callback?: IconifyIconLoaderCallback) => IconifyIconLoaderAbort; | ||
| /** | ||
| * Meta data stored in JSON file, used for browsing icon set. | ||
@@ -567,3 +580,3 @@ */ | ||
| */ | ||
| export declare const listIcons: (provider?: string, prefix?: string) => string[]; | ||
| export declare function listIcons(provider?: string, prefix?: string): string[]; | ||
@@ -573,3 +586,3 @@ /** | ||
| */ | ||
| export declare const loadIcons: (icons: (string | IconifyIconName)[], callback?: IconifyIconLoaderCallback) => IconifyIconLoaderAbort; | ||
| export declare const loadIcons: IconifyLoadIcons; | ||
@@ -581,3 +594,3 @@ /** | ||
| export declare type PartialIconifyAPIConfig = Partial<IconifyAPIConfig>; | ||
| export declare type PartialIconifyAPIConfig = Partial<IconifyAPIConfig> & Pick<IconifyAPIConfig, 'resources'>; | ||
@@ -660,8 +673,9 @@ /** | ||
| */ | ||
| declare type RedundancyResource = unknown; | ||
| declare type RedundancyResource = string; | ||
| /** | ||
| * Replace unique ids in content | ||
| * Replace IDs in SVG output with unique IDs | ||
| * Fast replacement without parsing XML, assuming commonly used patterns and clean XML (icon should have been cleaned up with Iconify Tools or SVGO). | ||
| */ | ||
| export declare const replaceIDs: (body: string, prefix?: string | (() => string)) => string; | ||
| export declare function replaceIDs(body: string, prefix?: string | (() => string)): string; | ||
@@ -668,0 +682,0 @@ /** |
@@ -1,7 +0,7 @@ | ||
| import { AllowedComponentProps } from 'vue'; | ||
| import { ComponentCustomProps } from 'vue'; | ||
| import { ComponentOptionsMixin } from 'vue'; | ||
| import { DefineComponent } from 'vue'; | ||
| import { EmitsOptions } from 'vue'; | ||
| import { VNodeProps } from 'vue'; | ||
| import type { AllowedComponentProps } from 'vue'; | ||
| import type { ComponentCustomProps } from 'vue'; | ||
| import type { ComponentOptionsMixin } from 'vue'; | ||
| import type { DefineComponent } from 'vue'; | ||
| import type { EmitsOptions } from 'vue'; | ||
| import type { VNodeProps } from 'vue'; | ||
@@ -239,3 +239,11 @@ /** | ||
| */ | ||
| export declare interface IconifyJSON extends IconifyOptional, IconifyMetaData { | ||
| export declare interface IconifyJSON extends IconifyJSONIconsData, IconifyMetaData { | ||
| // Optional list of missing icons. Returned by Iconify API when querying for icons that do not exist. | ||
| not_found?: string[]; | ||
| } | ||
| /** | ||
| * JSON structure, contains only icon data | ||
| */ | ||
| declare interface IconifyJSONIconsData extends IconifyOptional { | ||
| // Prefix for icons in JSON file, required. | ||
@@ -253,5 +261,2 @@ prefix: string; | ||
| // Optional list of missing icons. Returned by Iconify API when querying for icons that do not exist. | ||
| not_found?: string[]; | ||
| // IconifyOptional properties that are used as default values for icons when icon is missing value. | ||
@@ -258,0 +263,0 @@ // If property exists in both icon and root, use value from icon. |
1397
dist/offline.js
| (function (global, factory) { | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) : | ||
| typeof define === 'function' && define.amd ? define(['exports', 'vue'], factory) : | ||
| (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Icon = {}, global.Vue)); | ||
| }(this, (function (exports, vue) { 'use strict'; | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) : | ||
| typeof define === 'function' && define.amd ? define(['exports', 'vue'], factory) : | ||
| (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Icon = {}, global.Vue)); | ||
| })(this, (function (exports, vue) { 'use strict'; | ||
| var icon = {}; | ||
| // src/icon/index.ts | ||
| var iconDefaults = Object.freeze({ | ||
| left: 0, | ||
| top: 0, | ||
| width: 16, | ||
| height: 16, | ||
| rotate: 0, | ||
| vFlip: false, | ||
| hFlip: false | ||
| }); | ||
| function fullIcon(data) { | ||
| return { ...iconDefaults, ...data }; | ||
| } | ||
| (function (exports) { | ||
| Object.defineProperty(exports, "__esModule", { value: true }); | ||
| exports.fullIcon = exports.iconDefaults = exports.minifyProps = exports.matchName = void 0; | ||
| /** | ||
| * Expression to test part of icon name. | ||
| */ | ||
| exports.matchName = /^[a-z0-9]+(-[a-z0-9]+)*$/; | ||
| /** | ||
| * Properties that can be minified | ||
| * | ||
| * Values of all these properties are awalys numbers | ||
| */ | ||
| exports.minifyProps = [ | ||
| // All IconifyDimenisons properties | ||
| 'width', | ||
| 'height', | ||
| 'top', | ||
| 'left', | ||
| ]; | ||
| /** | ||
| * Default values for all optional IconifyIcon properties | ||
| */ | ||
| exports.iconDefaults = Object.freeze({ | ||
| left: 0, | ||
| top: 0, | ||
| width: 16, | ||
| height: 16, | ||
| rotate: 0, | ||
| vFlip: false, | ||
| hFlip: false, | ||
| }); | ||
| /** | ||
| * Add optional properties to icon | ||
| */ | ||
| function fullIcon(data) { | ||
| return { ...exports.iconDefaults, ...data }; | ||
| // src/icon/merge.ts | ||
| function mergeIconData(icon, alias) { | ||
| const result = { ...icon }; | ||
| for (const key in iconDefaults) { | ||
| const prop = key; | ||
| if (alias[prop] !== void 0) { | ||
| const value = alias[prop]; | ||
| if (result[prop] === void 0) { | ||
| result[prop] = value; | ||
| continue; | ||
| } | ||
| switch (prop) { | ||
| case "rotate": | ||
| result[prop] = (result[prop] + value) % 4; | ||
| break; | ||
| case "hFlip": | ||
| case "vFlip": | ||
| result[prop] = value !== result[prop]; | ||
| break; | ||
| default: | ||
| result[prop] = value; | ||
| } | ||
| } | ||
| } | ||
| exports.fullIcon = fullIcon; | ||
| }(icon)); | ||
| return result; | ||
| } | ||
| var parse = {}; | ||
| var merge = {}; | ||
| Object.defineProperty(merge, "__esModule", { value: true }); | ||
| merge.mergeIconData = void 0; | ||
| const _1 = icon; | ||
| /** | ||
| * Merge icon and alias | ||
| */ | ||
| function mergeIconData(icon, alias) { | ||
| const result = { ...icon }; | ||
| for (const key in _1.iconDefaults) { | ||
| const prop = key; | ||
| if (alias[prop] !== void 0) { | ||
| const value = alias[prop]; | ||
| if (result[prop] === void 0) { | ||
| // Missing value | ||
| result[prop] = value; | ||
| continue; | ||
| } | ||
| switch (prop) { | ||
| case 'rotate': | ||
| result[prop] = | ||
| (result[prop] + value) % 4; | ||
| break; | ||
| case 'hFlip': | ||
| case 'vFlip': | ||
| result[prop] = value !== result[prop]; | ||
| break; | ||
| default: | ||
| // Overwrite value | ||
| result[prop] = | ||
| value; | ||
| } | ||
| } | ||
| } | ||
| return result; | ||
| // src/icon-set/parse.ts | ||
| var defaultsKeys = Object.keys(iconDefaults); | ||
| function resolveAlias(alias, icons, aliases, level = 0) { | ||
| const parent = alias.parent; | ||
| if (icons[parent] !== void 0) { | ||
| return mergeIconData(icons[parent], alias); | ||
| } | ||
| merge.mergeIconData = mergeIconData; | ||
| Object.defineProperty(parse, "__esModule", { value: true }); | ||
| var parseIconSet_1 = parse.parseIconSet = void 0; | ||
| const icon_1 = icon; | ||
| const merge_1 = merge; | ||
| /** | ||
| * Get list of defaults keys | ||
| */ | ||
| const defaultsKeys = Object.keys(icon_1.iconDefaults); | ||
| /** | ||
| * Resolve alias | ||
| */ | ||
| function resolveAlias(alias, icons, aliases, level = 0) { | ||
| const parent = alias.parent; | ||
| if (icons[parent] !== void 0) { | ||
| return merge_1.mergeIconData(icons[parent], alias); | ||
| } | ||
| if (aliases[parent] !== void 0) { | ||
| if (level > 2) { | ||
| // icon + alias + alias + alias = too much nesting, possibly infinite | ||
| return null; | ||
| } | ||
| const icon = resolveAlias(aliases[parent], icons, aliases, level + 1); | ||
| if (icon) { | ||
| return merge_1.mergeIconData(icon, alias); | ||
| } | ||
| } | ||
| if (aliases[parent] !== void 0) { | ||
| if (level > 2) { | ||
| return null; | ||
| } | ||
| const icon = resolveAlias(aliases[parent], icons, aliases, level + 1); | ||
| if (icon) { | ||
| return mergeIconData(icon, alias); | ||
| } | ||
| } | ||
| /** | ||
| * Extract icons from an icon set | ||
| */ | ||
| function parseIconSet(data, callback, list = 'none') { | ||
| const added = []; | ||
| // Must be an object | ||
| if (typeof data !== 'object') { | ||
| return list === 'none' ? false : added; | ||
| return null; | ||
| } | ||
| function parseIconSet(data, callback, list = "none") { | ||
| const added = []; | ||
| if (typeof data !== "object") { | ||
| return list === "none" ? false : added; | ||
| } | ||
| if (data.not_found instanceof Array) { | ||
| data.not_found.forEach((name) => { | ||
| callback(name, null); | ||
| if (list === "all") { | ||
| added.push(name); | ||
| } | ||
| // Check for missing icons list returned by API | ||
| if (data.not_found instanceof Array) { | ||
| data.not_found.forEach((name) => { | ||
| callback(name, null); | ||
| if (list === 'all') { | ||
| added.push(name); | ||
| } | ||
| }); | ||
| } | ||
| // Must have 'icons' object | ||
| if (typeof data.icons !== 'object') { | ||
| return list === 'none' ? false : added; | ||
| } | ||
| // Get default values | ||
| const defaults = Object.create(null); | ||
| defaultsKeys.forEach((key) => { | ||
| if (data[key] !== void 0 && typeof data[key] !== 'object') { | ||
| defaults[key] = data[key]; | ||
| } | ||
| }); | ||
| // Get icons | ||
| const icons = data.icons; | ||
| Object.keys(icons).forEach((name) => { | ||
| const icon = icons[name]; | ||
| if (typeof icon.body !== 'string') { | ||
| return; | ||
| } | ||
| // Freeze icon to make sure it will not be modified | ||
| callback(name, Object.freeze({ ...icon_1.iconDefaults, ...defaults, ...icon })); | ||
| added.push(name); | ||
| }); | ||
| // Get aliases | ||
| if (typeof data.aliases === 'object') { | ||
| const aliases = data.aliases; | ||
| Object.keys(aliases).forEach((name) => { | ||
| const icon = resolveAlias(aliases[name], icons, aliases, 1); | ||
| if (icon) { | ||
| // Freeze icon to make sure it will not be modified | ||
| callback(name, Object.freeze({ ...icon_1.iconDefaults, ...defaults, ...icon })); | ||
| added.push(name); | ||
| } | ||
| }); | ||
| } | ||
| return list === 'none' ? added.length > 0 : added; | ||
| }); | ||
| } | ||
| parseIconSet_1 = parse.parseIconSet = parseIconSet; | ||
| var customisations = {}; | ||
| Object.defineProperty(customisations, "__esModule", { value: true }); | ||
| var mergeCustomisations_1 = customisations.mergeCustomisations = defaults = customisations.defaults = void 0; | ||
| /** | ||
| * Default icon customisations values | ||
| */ | ||
| var defaults = customisations.defaults = Object.freeze({ | ||
| // Display mode | ||
| inline: false, | ||
| // Dimensions | ||
| width: null, | ||
| height: null, | ||
| // Alignment | ||
| hAlign: 'center', | ||
| vAlign: 'middle', | ||
| slice: false, | ||
| // Transformations | ||
| hFlip: false, | ||
| vFlip: false, | ||
| rotate: 0, | ||
| if (typeof data.icons !== "object") { | ||
| return list === "none" ? false : added; | ||
| } | ||
| const defaults = Object.create(null); | ||
| defaultsKeys.forEach((key) => { | ||
| if (data[key] !== void 0 && typeof data[key] !== "object") { | ||
| defaults[key] = data[key]; | ||
| } | ||
| }); | ||
| /** | ||
| * Convert IconifyIconCustomisations to FullIconCustomisations | ||
| */ | ||
| function mergeCustomisations(defaults, item) { | ||
| const result = {}; | ||
| for (const key in defaults) { | ||
| const attr = key; | ||
| // Copy old value | ||
| result[attr] = defaults[attr]; | ||
| if (item[attr] === void 0) { | ||
| continue; | ||
| } | ||
| // Validate new value | ||
| const value = item[attr]; | ||
| switch (attr) { | ||
| // Boolean attributes that override old value | ||
| case 'inline': | ||
| case 'slice': | ||
| if (typeof value === 'boolean') { | ||
| result[attr] = value; | ||
| } | ||
| break; | ||
| // Boolean attributes that are merged | ||
| case 'hFlip': | ||
| case 'vFlip': | ||
| if (value === true) { | ||
| result[attr] = !result[attr]; | ||
| } | ||
| break; | ||
| // Non-empty string | ||
| case 'hAlign': | ||
| case 'vAlign': | ||
| if (typeof value === 'string' && value !== '') { | ||
| result[attr] = value; | ||
| } | ||
| break; | ||
| // Non-empty string / non-zero number / null | ||
| case 'width': | ||
| case 'height': | ||
| if ((typeof value === 'string' && value !== '') || | ||
| (typeof value === 'number' && value) || | ||
| value === null) { | ||
| result[attr] = value; | ||
| } | ||
| break; | ||
| // Rotation | ||
| case 'rotate': | ||
| if (typeof value === 'number') { | ||
| result[attr] += value; | ||
| } | ||
| break; | ||
| } | ||
| const icons = data.icons; | ||
| Object.keys(icons).forEach((name) => { | ||
| const icon = icons[name]; | ||
| if (typeof icon.body !== "string") { | ||
| return; | ||
| } | ||
| callback(name, Object.freeze({ ...iconDefaults, ...defaults, ...icon })); | ||
| added.push(name); | ||
| }); | ||
| if (typeof data.aliases === "object") { | ||
| const aliases = data.aliases; | ||
| Object.keys(aliases).forEach((name) => { | ||
| const icon = resolveAlias(aliases[name], icons, aliases, 1); | ||
| if (icon) { | ||
| callback(name, Object.freeze({ ...iconDefaults, ...defaults, ...icon })); | ||
| added.push(name); | ||
| } | ||
| return result; | ||
| }); | ||
| } | ||
| mergeCustomisations_1 = customisations.mergeCustomisations = mergeCustomisations; | ||
| return list === "none" ? added.length > 0 : added; | ||
| } | ||
| var shorthand = {}; | ||
| Object.defineProperty(shorthand, "__esModule", { value: true }); | ||
| var alignmentFromString_1 = shorthand.alignmentFromString = flipFromString_1 = shorthand.flipFromString = void 0; | ||
| const separator = /[\s,]+/; | ||
| /** | ||
| * Apply "flip" string to icon customisations | ||
| */ | ||
| function flipFromString(custom, flip) { | ||
| flip.split(separator).forEach((str) => { | ||
| const value = str.trim(); | ||
| switch (value) { | ||
| case 'horizontal': | ||
| custom.hFlip = true; | ||
| break; | ||
| case 'vertical': | ||
| custom.vFlip = true; | ||
| break; | ||
| } | ||
| }); | ||
| // src/customisations/index.ts | ||
| var defaults = Object.freeze({ | ||
| inline: false, | ||
| width: null, | ||
| height: null, | ||
| hAlign: "center", | ||
| vAlign: "middle", | ||
| slice: false, | ||
| hFlip: false, | ||
| vFlip: false, | ||
| rotate: 0 | ||
| }); | ||
| function mergeCustomisations(defaults2, item) { | ||
| const result = {}; | ||
| for (const key in defaults2) { | ||
| const attr = key; | ||
| result[attr] = defaults2[attr]; | ||
| if (item[attr] === void 0) { | ||
| continue; | ||
| } | ||
| const value = item[attr]; | ||
| switch (attr) { | ||
| case "inline": | ||
| case "slice": | ||
| if (typeof value === "boolean") { | ||
| result[attr] = value; | ||
| } | ||
| break; | ||
| case "hFlip": | ||
| case "vFlip": | ||
| if (value === true) { | ||
| result[attr] = !result[attr]; | ||
| } | ||
| break; | ||
| case "hAlign": | ||
| case "vAlign": | ||
| if (typeof value === "string" && value !== "") { | ||
| result[attr] = value; | ||
| } | ||
| break; | ||
| case "width": | ||
| case "height": | ||
| if (typeof value === "string" && value !== "" || typeof value === "number" && value || value === null) { | ||
| result[attr] = value; | ||
| } | ||
| break; | ||
| case "rotate": | ||
| if (typeof value === "number") { | ||
| result[attr] += value; | ||
| } | ||
| break; | ||
| } | ||
| } | ||
| var flipFromString_1 = shorthand.flipFromString = flipFromString; | ||
| /** | ||
| * Apply "align" string to icon customisations | ||
| */ | ||
| function alignmentFromString(custom, align) { | ||
| align.split(separator).forEach((str) => { | ||
| const value = str.trim(); | ||
| switch (value) { | ||
| case 'left': | ||
| case 'center': | ||
| case 'right': | ||
| custom.hAlign = value; | ||
| break; | ||
| case 'top': | ||
| case 'middle': | ||
| case 'bottom': | ||
| custom.vAlign = value; | ||
| break; | ||
| case 'slice': | ||
| case 'crop': | ||
| custom.slice = true; | ||
| break; | ||
| case 'meet': | ||
| custom.slice = false; | ||
| } | ||
| }); | ||
| } | ||
| alignmentFromString_1 = shorthand.alignmentFromString = alignmentFromString; | ||
| return result; | ||
| } | ||
| var rotate = {}; | ||
| // src/customisations/shorthand.ts | ||
| var separator = /[\s,]+/; | ||
| function flipFromString(custom, flip) { | ||
| flip.split(separator).forEach((str) => { | ||
| const value = str.trim(); | ||
| switch (value) { | ||
| case "horizontal": | ||
| custom.hFlip = true; | ||
| break; | ||
| case "vertical": | ||
| custom.vFlip = true; | ||
| break; | ||
| } | ||
| }); | ||
| } | ||
| function alignmentFromString(custom, align) { | ||
| align.split(separator).forEach((str) => { | ||
| const value = str.trim(); | ||
| switch (value) { | ||
| case "left": | ||
| case "center": | ||
| case "right": | ||
| custom.hAlign = value; | ||
| break; | ||
| case "top": | ||
| case "middle": | ||
| case "bottom": | ||
| custom.vAlign = value; | ||
| break; | ||
| case "slice": | ||
| case "crop": | ||
| custom.slice = true; | ||
| break; | ||
| case "meet": | ||
| custom.slice = false; | ||
| } | ||
| }); | ||
| } | ||
| Object.defineProperty(rotate, "__esModule", { value: true }); | ||
| var rotateFromString_1 = rotate.rotateFromString = void 0; | ||
| /** | ||
| * Get rotation value | ||
| */ | ||
| function rotateFromString(value) { | ||
| const units = value.replace(/^-?[0-9.]*/, ''); | ||
| function cleanup(value) { | ||
| while (value < 0) { | ||
| value += 4; | ||
| } | ||
| return value % 4; | ||
| } | ||
| if (units === '') { | ||
| const num = parseInt(value); | ||
| return isNaN(num) ? 0 : cleanup(num); | ||
| } | ||
| else if (units !== value) { | ||
| let split = 0; | ||
| switch (units) { | ||
| case '%': | ||
| // 25% -> 1, 50% -> 2, ... | ||
| split = 25; | ||
| break; | ||
| case 'deg': | ||
| // 90deg -> 1, 180deg -> 2, ... | ||
| split = 90; | ||
| } | ||
| if (split) { | ||
| let num = parseFloat(value.slice(0, value.length - units.length)); | ||
| if (isNaN(num)) { | ||
| return 0; | ||
| } | ||
| num = num / split; | ||
| return num % 1 === 0 ? cleanup(num) : 0; | ||
| } | ||
| } | ||
| return 0; | ||
| // src/customisations/rotate.ts | ||
| function rotateFromString(value) { | ||
| const units = value.replace(/^-?[0-9.]*/, ""); | ||
| function cleanup(value2) { | ||
| while (value2 < 0) { | ||
| value2 += 4; | ||
| } | ||
| return value2 % 4; | ||
| } | ||
| rotateFromString_1 = rotate.rotateFromString = rotateFromString; | ||
| var build = {}; | ||
| var size = {}; | ||
| Object.defineProperty(size, "__esModule", { value: true }); | ||
| size.calculateSize = void 0; | ||
| /** | ||
| * Regular expressions for calculating dimensions | ||
| */ | ||
| const unitsSplit = /(-?[0-9.]*[0-9]+[0-9.]*)/g; | ||
| const unitsTest = /^-?[0-9.]*[0-9]+[0-9.]*$/g; | ||
| /** | ||
| * Calculate second dimension when only 1 dimension is set | ||
| * | ||
| * @param {string|number} size One dimension (such as width) | ||
| * @param {number} ratio Width/height ratio. | ||
| * If size is width, ratio = height/width | ||
| * If size is height, ratio = width/height | ||
| * @param {number} [precision] Floating number precision in result to minimize output. Default = 2 | ||
| * @return {string|number} Another dimension | ||
| */ | ||
| function calculateSize(size, ratio, precision) { | ||
| if (ratio === 1) { | ||
| return size; | ||
| if (units === "") { | ||
| const num = parseInt(value); | ||
| return isNaN(num) ? 0 : cleanup(num); | ||
| } else if (units !== value) { | ||
| let split = 0; | ||
| switch (units) { | ||
| case "%": | ||
| split = 25; | ||
| break; | ||
| case "deg": | ||
| split = 90; | ||
| } | ||
| if (split) { | ||
| let num = parseFloat(value.slice(0, value.length - units.length)); | ||
| if (isNaN(num)) { | ||
| return 0; | ||
| } | ||
| precision = precision === void 0 ? 100 : precision; | ||
| if (typeof size === 'number') { | ||
| return Math.ceil(size * ratio * precision) / precision; | ||
| } | ||
| if (typeof size !== 'string') { | ||
| return size; | ||
| } | ||
| // Split code into sets of strings and numbers | ||
| const oldParts = size.split(unitsSplit); | ||
| if (oldParts === null || !oldParts.length) { | ||
| return size; | ||
| } | ||
| const newParts = []; | ||
| let code = oldParts.shift(); | ||
| let isNumber = unitsTest.test(code); | ||
| // eslint-disable-next-line no-constant-condition | ||
| while (true) { | ||
| if (isNumber) { | ||
| const num = parseFloat(code); | ||
| if (isNaN(num)) { | ||
| newParts.push(code); | ||
| } | ||
| else { | ||
| newParts.push(Math.ceil(num * ratio * precision) / precision); | ||
| } | ||
| } | ||
| else { | ||
| newParts.push(code); | ||
| } | ||
| // next | ||
| code = oldParts.shift(); | ||
| if (code === void 0) { | ||
| return newParts.join(''); | ||
| } | ||
| isNumber = !isNumber; | ||
| } | ||
| num = num / split; | ||
| return num % 1 === 0 ? cleanup(num) : 0; | ||
| } | ||
| } | ||
| size.calculateSize = calculateSize; | ||
| return 0; | ||
| } | ||
| Object.defineProperty(build, "__esModule", { value: true }); | ||
| var iconToSVG_1 = build.iconToSVG = void 0; | ||
| const size_1 = size; | ||
| /** | ||
| * Get preserveAspectRatio value | ||
| */ | ||
| function preserveAspectRatio(props) { | ||
| let result = ''; | ||
| switch (props.hAlign) { | ||
| case 'left': | ||
| result += 'xMin'; | ||
| break; | ||
| case 'right': | ||
| result += 'xMax'; | ||
| break; | ||
| default: | ||
| result += 'xMid'; | ||
| } | ||
| switch (props.vAlign) { | ||
| case 'top': | ||
| result += 'YMin'; | ||
| break; | ||
| case 'bottom': | ||
| result += 'YMax'; | ||
| break; | ||
| default: | ||
| result += 'YMid'; | ||
| } | ||
| result += props.slice ? ' slice' : ' meet'; | ||
| return result; | ||
| // src/svg/size.ts | ||
| var unitsSplit = /(-?[0-9.]*[0-9]+[0-9.]*)/g; | ||
| var unitsTest = /^-?[0-9.]*[0-9]+[0-9.]*$/g; | ||
| function calculateSize(size, ratio, precision) { | ||
| if (ratio === 1) { | ||
| return size; | ||
| } | ||
| /** | ||
| * Get SVG attributes and content from icon + customisations | ||
| * | ||
| * Does not generate style to make it compatible with frameworks that use objects for style, such as React. | ||
| * Instead, it generates 'inline' value. If true, rendering engine should add verticalAlign: -0.125em to icon. | ||
| * | ||
| * Customisations should be normalised by platform specific parser. | ||
| * Result should be converted to <svg> by platform specific parser. | ||
| * Use replaceIDs to generate unique IDs for body. | ||
| */ | ||
| function iconToSVG(icon, customisations) { | ||
| // viewBox | ||
| const box = { | ||
| left: icon.left, | ||
| top: icon.top, | ||
| width: icon.width, | ||
| height: icon.height, | ||
| }; | ||
| // Body | ||
| let body = icon.body; | ||
| // Apply transformations | ||
| [icon, customisations].forEach((props) => { | ||
| const transformations = []; | ||
| const hFlip = props.hFlip; | ||
| const vFlip = props.vFlip; | ||
| let rotation = props.rotate; | ||
| // Icon is flipped first, then rotated | ||
| if (hFlip) { | ||
| if (vFlip) { | ||
| rotation += 2; | ||
| } | ||
| else { | ||
| // Horizontal flip | ||
| transformations.push('translate(' + | ||
| (box.width + box.left) + | ||
| ' ' + | ||
| (0 - box.top) + | ||
| ')'); | ||
| transformations.push('scale(-1 1)'); | ||
| box.top = box.left = 0; | ||
| } | ||
| } | ||
| else if (vFlip) { | ||
| // Vertical flip | ||
| transformations.push('translate(' + | ||
| (0 - box.left) + | ||
| ' ' + | ||
| (box.height + box.top) + | ||
| ')'); | ||
| transformations.push('scale(1 -1)'); | ||
| box.top = box.left = 0; | ||
| } | ||
| let tempValue; | ||
| if (rotation < 0) { | ||
| rotation -= Math.floor(rotation / 4) * 4; | ||
| } | ||
| rotation = rotation % 4; | ||
| switch (rotation) { | ||
| case 1: | ||
| // 90deg | ||
| tempValue = box.height / 2 + box.top; | ||
| transformations.unshift('rotate(90 ' + tempValue + ' ' + tempValue + ')'); | ||
| break; | ||
| case 2: | ||
| // 180deg | ||
| transformations.unshift('rotate(180 ' + | ||
| (box.width / 2 + box.left) + | ||
| ' ' + | ||
| (box.height / 2 + box.top) + | ||
| ')'); | ||
| break; | ||
| case 3: | ||
| // 270deg | ||
| tempValue = box.width / 2 + box.left; | ||
| transformations.unshift('rotate(-90 ' + tempValue + ' ' + tempValue + ')'); | ||
| break; | ||
| } | ||
| if (rotation % 2 === 1) { | ||
| // Swap width/height and x/y for 90deg or 270deg rotation | ||
| if (box.left !== 0 || box.top !== 0) { | ||
| tempValue = box.left; | ||
| box.left = box.top; | ||
| box.top = tempValue; | ||
| } | ||
| if (box.width !== box.height) { | ||
| tempValue = box.width; | ||
| box.width = box.height; | ||
| box.height = tempValue; | ||
| } | ||
| } | ||
| if (transformations.length) { | ||
| body = | ||
| '<g transform="' + | ||
| transformations.join(' ') + | ||
| '">' + | ||
| body + | ||
| '</g>'; | ||
| } | ||
| }); | ||
| // Calculate dimensions | ||
| let width, height; | ||
| if (customisations.width === null && customisations.height === null) { | ||
| // Set height to '1em', calculate width | ||
| height = '1em'; | ||
| width = size_1.calculateSize(height, box.width / box.height); | ||
| precision = precision === void 0 ? 100 : precision; | ||
| if (typeof size === "number") { | ||
| return Math.ceil(size * ratio * precision) / precision; | ||
| } | ||
| if (typeof size !== "string") { | ||
| return size; | ||
| } | ||
| const oldParts = size.split(unitsSplit); | ||
| if (oldParts === null || !oldParts.length) { | ||
| return size; | ||
| } | ||
| const newParts = []; | ||
| let code = oldParts.shift(); | ||
| let isNumber = unitsTest.test(code); | ||
| while (true) { | ||
| if (isNumber) { | ||
| const num = parseFloat(code); | ||
| if (isNaN(num)) { | ||
| newParts.push(code); | ||
| } else { | ||
| newParts.push(Math.ceil(num * ratio * precision) / precision); | ||
| } | ||
| else if (customisations.width !== null && | ||
| customisations.height !== null) { | ||
| // Values are set | ||
| width = customisations.width; | ||
| height = customisations.height; | ||
| } | ||
| else if (customisations.height !== null) { | ||
| // Height is set | ||
| height = customisations.height; | ||
| width = size_1.calculateSize(height, box.width / box.height); | ||
| } | ||
| else { | ||
| // Width is set | ||
| width = customisations.width; | ||
| height = size_1.calculateSize(width, box.height / box.width); | ||
| } | ||
| // Check for 'auto' | ||
| if (width === 'auto') { | ||
| width = box.width; | ||
| } | ||
| if (height === 'auto') { | ||
| height = box.height; | ||
| } | ||
| // Convert to string | ||
| width = typeof width === 'string' ? width : width + ''; | ||
| height = typeof height === 'string' ? height : height + ''; | ||
| // Result | ||
| const result = { | ||
| attributes: { | ||
| width, | ||
| height, | ||
| preserveAspectRatio: preserveAspectRatio(customisations), | ||
| viewBox: box.left + ' ' + box.top + ' ' + box.width + ' ' + box.height, | ||
| }, | ||
| body, | ||
| }; | ||
| if (customisations.inline) { | ||
| result.inline = true; | ||
| } | ||
| return result; | ||
| } else { | ||
| newParts.push(code); | ||
| } | ||
| code = oldParts.shift(); | ||
| if (code === void 0) { | ||
| return newParts.join(""); | ||
| } | ||
| isNumber = !isNumber; | ||
| } | ||
| iconToSVG_1 = build.iconToSVG = iconToSVG; | ||
| } | ||
| var id = {}; | ||
| Object.defineProperty(id, "__esModule", { value: true }); | ||
| var replaceIDs_1 = id.replaceIDs = void 0; | ||
| /** | ||
| * Regular expression for finding ids | ||
| */ | ||
| const regex = /\sid="(\S+)"/g; | ||
| /** | ||
| * Match for allowed characters before and after id in replacement, including () for group | ||
| */ | ||
| const replaceValue = '([^A-Za-z0-9_-])'; | ||
| /** | ||
| * Escape value for 'new RegExp()' | ||
| */ | ||
| function escapeRegExp(str) { | ||
| return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string | ||
| // src/svg/build.ts | ||
| function preserveAspectRatio(props) { | ||
| let result = ""; | ||
| switch (props.hAlign) { | ||
| case "left": | ||
| result += "xMin"; | ||
| break; | ||
| case "right": | ||
| result += "xMax"; | ||
| break; | ||
| default: | ||
| result += "xMid"; | ||
| } | ||
| /** | ||
| * New random-ish prefix for ids | ||
| */ | ||
| const randomPrefix = 'IconifyId-' + | ||
| Date.now().toString(16) + | ||
| '-' + | ||
| ((Math.random() * 0x1000000) | 0).toString(16) + | ||
| '-'; | ||
| /** | ||
| * Counter for ids, increasing with every replacement | ||
| */ | ||
| let counter = 0; | ||
| /** | ||
| * Replace IDs in SVG output with unique IDs | ||
| * Fast replacement without parsing XML, assuming commonly used patterns and clean XML (icon should have been cleaned up with Iconify Tools or SVGO). | ||
| */ | ||
| function replaceIDs(body, prefix = randomPrefix) { | ||
| // Find all IDs | ||
| const ids = []; | ||
| let match; | ||
| while ((match = regex.exec(body))) { | ||
| ids.push(match[1]); | ||
| } | ||
| if (!ids.length) { | ||
| return body; | ||
| } | ||
| // Replace with unique ids | ||
| ids.forEach((id) => { | ||
| const newID = typeof prefix === 'function' ? prefix() : prefix + counter++; | ||
| body = body.replace(new RegExp(replaceValue + '(' + escapeRegExp(id) + ')' + replaceValue, 'g'), '$1' + newID + '$3'); | ||
| }); | ||
| return body; | ||
| switch (props.vAlign) { | ||
| case "top": | ||
| result += "YMin"; | ||
| break; | ||
| case "bottom": | ||
| result += "YMax"; | ||
| break; | ||
| default: | ||
| result += "YMid"; | ||
| } | ||
| replaceIDs_1 = id.replaceIDs = replaceIDs; | ||
| /** | ||
| * Default SVG attributes | ||
| */ | ||
| const svgDefaults = { | ||
| 'xmlns': 'http://www.w3.org/2000/svg', | ||
| 'xmlns:xlink': 'http://www.w3.org/1999/xlink', | ||
| 'aria-hidden': true, | ||
| 'role': 'img', | ||
| result += props.slice ? " slice" : " meet"; | ||
| return result; | ||
| } | ||
| function iconToSVG(icon, customisations) { | ||
| const box = { | ||
| left: icon.left, | ||
| top: icon.top, | ||
| width: icon.width, | ||
| height: icon.height | ||
| }; | ||
| /** | ||
| * Aliases for customisations. | ||
| * In Vue 'v-' properties are reserved, so v-align and v-flip must be renamed | ||
| */ | ||
| let customisationAliases = {}; | ||
| ['horizontal', 'vertical'].forEach(prefix => { | ||
| ['Align', 'Flip'].forEach(suffix => { | ||
| const attr = prefix.slice(0, 1) + suffix; | ||
| const value = { | ||
| attr, | ||
| boolean: suffix === 'Flip', | ||
| }; | ||
| // vertical-align | ||
| customisationAliases[prefix + '-' + suffix.toLowerCase()] = value; | ||
| // v-align | ||
| customisationAliases[prefix.slice(0, 1) + '-' + suffix.toLowerCase()] = value; | ||
| // verticalAlign | ||
| customisationAliases[prefix + suffix] = value; | ||
| }); | ||
| }); | ||
| /** | ||
| * Render icon | ||
| */ | ||
| const render = ( | ||
| // Icon must be validated before calling this function | ||
| icon, | ||
| // Partial properties | ||
| props) => { | ||
| // Split properties | ||
| const customisations = mergeCustomisations_1(defaults, props); | ||
| const componentProps = { ...svgDefaults }; | ||
| // Copy style | ||
| let style = typeof props.style === 'object' && !(props.style instanceof Array) | ||
| ? { ...props.style } | ||
| : {}; | ||
| // Get element properties | ||
| for (let key in props) { | ||
| const value = props[key]; | ||
| if (value === void 0) { | ||
| continue; | ||
| } | ||
| switch (key) { | ||
| // Properties to ignore | ||
| case 'icon': | ||
| case 'style': | ||
| case 'onLoad': | ||
| break; | ||
| // Boolean attributes | ||
| case 'inline': | ||
| case 'hFlip': | ||
| case 'vFlip': | ||
| customisations[key] = | ||
| value === true || value === 'true' || value === 1; | ||
| break; | ||
| // Flip as string: 'horizontal,vertical' | ||
| case 'flip': | ||
| if (typeof value === 'string') { | ||
| flipFromString_1(customisations, value); | ||
| } | ||
| break; | ||
| // Alignment as string | ||
| case 'align': | ||
| if (typeof value === 'string') { | ||
| alignmentFromString_1(customisations, value); | ||
| } | ||
| break; | ||
| // Color: override style | ||
| case 'color': | ||
| style.color = value; | ||
| break; | ||
| // Rotation as string | ||
| case 'rotate': | ||
| if (typeof value === 'string') { | ||
| customisations[key] = rotateFromString_1(value); | ||
| } | ||
| else if (typeof value === 'number') { | ||
| customisations[key] = value; | ||
| } | ||
| break; | ||
| // Remove aria-hidden | ||
| case 'ariaHidden': | ||
| case 'aria-hidden': | ||
| // Vue transforms 'aria-hidden' property to 'ariaHidden' | ||
| if (value !== true && value !== 'true') { | ||
| delete componentProps['aria-hidden']; | ||
| } | ||
| break; | ||
| default: | ||
| if (customisationAliases[key] !== void 0) { | ||
| // Aliases for customisations | ||
| if (customisationAliases[key].boolean && | ||
| (value === true || value === 'true' || value === 1)) { | ||
| // Check for boolean | ||
| customisations[customisationAliases[key].attr] = true; | ||
| } | ||
| else if (!customisationAliases[key].boolean && | ||
| typeof value === 'string' && | ||
| value !== '') { | ||
| // String | ||
| customisations[customisationAliases[key].attr] = value; | ||
| } | ||
| } | ||
| else if (defaults[key] === void 0) { | ||
| // Copy missing property if it does not exist in customisations | ||
| componentProps[key] = value; | ||
| } | ||
| } | ||
| let body = icon.body; | ||
| [icon, customisations].forEach((props) => { | ||
| const transformations = []; | ||
| const hFlip = props.hFlip; | ||
| const vFlip = props.vFlip; | ||
| let rotation = props.rotate; | ||
| if (hFlip) { | ||
| if (vFlip) { | ||
| rotation += 2; | ||
| } else { | ||
| transformations.push("translate(" + (box.width + box.left) + " " + (0 - box.top) + ")"); | ||
| transformations.push("scale(-1 1)"); | ||
| box.top = box.left = 0; | ||
| } | ||
| // Generate icon | ||
| const item = iconToSVG_1(icon, customisations); | ||
| // Add icon stuff | ||
| for (let key in item.attributes) { | ||
| componentProps[key] = item.attributes[key]; | ||
| } else if (vFlip) { | ||
| transformations.push("translate(" + (0 - box.left) + " " + (box.height + box.top) + ")"); | ||
| transformations.push("scale(1 -1)"); | ||
| box.top = box.left = 0; | ||
| } | ||
| let tempValue; | ||
| if (rotation < 0) { | ||
| rotation -= Math.floor(rotation / 4) * 4; | ||
| } | ||
| rotation = rotation % 4; | ||
| switch (rotation) { | ||
| case 1: | ||
| tempValue = box.height / 2 + box.top; | ||
| transformations.unshift("rotate(90 " + tempValue + " " + tempValue + ")"); | ||
| break; | ||
| case 2: | ||
| transformations.unshift("rotate(180 " + (box.width / 2 + box.left) + " " + (box.height / 2 + box.top) + ")"); | ||
| break; | ||
| case 3: | ||
| tempValue = box.width / 2 + box.left; | ||
| transformations.unshift("rotate(-90 " + tempValue + " " + tempValue + ")"); | ||
| break; | ||
| } | ||
| if (rotation % 2 === 1) { | ||
| if (box.left !== 0 || box.top !== 0) { | ||
| tempValue = box.left; | ||
| box.left = box.top; | ||
| box.top = tempValue; | ||
| } | ||
| if (item.inline && | ||
| style.verticalAlign === void 0 && | ||
| style['vertical-align'] === void 0) { | ||
| style.verticalAlign = '-0.125em'; | ||
| if (box.width !== box.height) { | ||
| tempValue = box.width; | ||
| box.width = box.height; | ||
| box.height = tempValue; | ||
| } | ||
| // Counter for ids based on "id" property to render icons consistently on server and client | ||
| let localCounter = 0; | ||
| const id = props.id; | ||
| // Add innerHTML and style to props | ||
| componentProps['innerHTML'] = replaceIDs_1(item.body, id ? () => id + '-' + localCounter++ : 'iconify-vue-'); | ||
| if (Object.keys(style).length > 0) { | ||
| componentProps['style'] = style; | ||
| } | ||
| // Render icon | ||
| return vue.h('svg', componentProps); | ||
| } | ||
| if (transformations.length) { | ||
| body = '<g transform="' + transformations.join(" ") + '">' + body + "</g>"; | ||
| } | ||
| }); | ||
| let width, height; | ||
| if (customisations.width === null && customisations.height === null) { | ||
| height = "1em"; | ||
| width = calculateSize(height, box.width / box.height); | ||
| } else if (customisations.width !== null && customisations.height !== null) { | ||
| width = customisations.width; | ||
| height = customisations.height; | ||
| } else if (customisations.height !== null) { | ||
| height = customisations.height; | ||
| width = calculateSize(height, box.width / box.height); | ||
| } else { | ||
| width = customisations.width; | ||
| height = calculateSize(width, box.height / box.width); | ||
| } | ||
| if (width === "auto") { | ||
| width = box.width; | ||
| } | ||
| if (height === "auto") { | ||
| height = box.height; | ||
| } | ||
| width = typeof width === "string" ? width : width + ""; | ||
| height = typeof height === "string" ? height : height + ""; | ||
| const result = { | ||
| attributes: { | ||
| width, | ||
| height, | ||
| preserveAspectRatio: preserveAspectRatio(customisations), | ||
| viewBox: box.left + " " + box.top + " " + box.width + " " + box.height | ||
| }, | ||
| body | ||
| }; | ||
| if (customisations.inline) { | ||
| result.inline = true; | ||
| } | ||
| return result; | ||
| } | ||
| /** | ||
| * Storage for icons referred by name | ||
| */ | ||
| const storage = Object.create(null); | ||
| /** | ||
| * Add icon to storage, allowing to call it by name | ||
| * | ||
| * @param name | ||
| * @param data | ||
| */ | ||
| function addIcon(name, data) { | ||
| storage[name] = icon.fullIcon(data); | ||
| // src/svg/id.ts | ||
| var regex = /\sid="(\S+)"/g; | ||
| var replaceValue = "([^A-Za-z0-9_-])"; | ||
| function escapeRegExp(str) { | ||
| return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); | ||
| } | ||
| var randomPrefix = "IconifyId-" + Date.now().toString(16) + "-" + (Math.random() * 16777216 | 0).toString(16) + "-"; | ||
| var counter = 0; | ||
| function replaceIDs(body, prefix = randomPrefix) { | ||
| const ids = []; | ||
| let match; | ||
| while (match = regex.exec(body)) { | ||
| ids.push(match[1]); | ||
| } | ||
| /** | ||
| * Add collection to storage, allowing to call icons by name | ||
| * | ||
| * @param data Icon set | ||
| * @param prefix Optional prefix to add to icon names, true (default) if prefix from icon set should be used. | ||
| */ | ||
| function addCollection(data, prefix) { | ||
| const iconPrefix = typeof prefix === 'string' | ||
| ? prefix | ||
| : prefix !== false && typeof data.prefix === 'string' | ||
| ? data.prefix + ':' | ||
| : ''; | ||
| parseIconSet_1(data, (name, icon) => { | ||
| if (icon !== null) { | ||
| storage[iconPrefix + name] = icon; | ||
| } | ||
| }); | ||
| if (!ids.length) { | ||
| return body; | ||
| } | ||
| /** | ||
| * Component | ||
| */ | ||
| const Icon = vue.defineComponent({ | ||
| // Do not inherit other attributes: it is handled by render() | ||
| inheritAttrs: false, | ||
| // Render icon | ||
| render() { | ||
| const props = this.$attrs; | ||
| // Check icon | ||
| const icon$1 = typeof props.icon === 'string' | ||
| ? storage[props.icon] | ||
| : typeof props.icon === 'object' | ||
| ? icon.fullIcon(props.icon) | ||
| : null; | ||
| // Validate icon object | ||
| if (icon$1 === null || | ||
| typeof icon$1 !== 'object' || | ||
| typeof icon$1.body !== 'string') { | ||
| return this.$slots.default ? this.$slots.default() : null; | ||
| } | ||
| // Valid icon: render it | ||
| return render(icon$1, props); | ||
| }, | ||
| ids.forEach((id) => { | ||
| const newID = typeof prefix === "function" ? prefix() : prefix + counter++; | ||
| body = body.replace(new RegExp(replaceValue + "(" + escapeRegExp(id) + ")" + replaceValue, "g"), "$1" + newID + "$3"); | ||
| }); | ||
| return body; | ||
| } | ||
| exports.Icon = Icon; | ||
| exports.addCollection = addCollection; | ||
| exports.addIcon = addIcon; | ||
| /** | ||
| * Default SVG attributes | ||
| */ | ||
| const svgDefaults = { | ||
| 'xmlns': 'http://www.w3.org/2000/svg', | ||
| 'xmlns:xlink': 'http://www.w3.org/1999/xlink', | ||
| 'aria-hidden': true, | ||
| 'role': 'img', | ||
| }; | ||
| /** | ||
| * Aliases for customisations. | ||
| * In Vue 'v-' properties are reserved, so v-align and v-flip must be renamed | ||
| */ | ||
| let customisationAliases = {}; | ||
| ['horizontal', 'vertical'].forEach((prefix) => { | ||
| ['Align', 'Flip'].forEach((suffix) => { | ||
| const attr = prefix.slice(0, 1) + suffix; | ||
| const value = { | ||
| attr, | ||
| boolean: suffix === 'Flip', | ||
| }; | ||
| // vertical-align | ||
| customisationAliases[prefix + '-' + suffix.toLowerCase()] = value; | ||
| // v-align | ||
| customisationAliases[prefix.slice(0, 1) + '-' + suffix.toLowerCase()] = | ||
| value; | ||
| // verticalAlign | ||
| customisationAliases[prefix + suffix] = value; | ||
| }); | ||
| }); | ||
| /** | ||
| * Render icon | ||
| */ | ||
| const render = ( | ||
| // Icon must be validated before calling this function | ||
| icon, | ||
| // Partial properties | ||
| props) => { | ||
| // Split properties | ||
| const customisations = mergeCustomisations(defaults, props); | ||
| const componentProps = { ...svgDefaults }; | ||
| // Copy style | ||
| let style = typeof props.style === 'object' && !(props.style instanceof Array) | ||
| ? { ...props.style } | ||
| : {}; | ||
| // Get element properties | ||
| for (let key in props) { | ||
| const value = props[key]; | ||
| if (value === void 0) { | ||
| continue; | ||
| } | ||
| switch (key) { | ||
| // Properties to ignore | ||
| case 'icon': | ||
| case 'style': | ||
| case 'onLoad': | ||
| break; | ||
| // Boolean attributes | ||
| case 'inline': | ||
| case 'hFlip': | ||
| case 'vFlip': | ||
| customisations[key] = | ||
| value === true || value === 'true' || value === 1; | ||
| break; | ||
| // Flip as string: 'horizontal,vertical' | ||
| case 'flip': | ||
| if (typeof value === 'string') { | ||
| flipFromString(customisations, value); | ||
| } | ||
| break; | ||
| // Alignment as string | ||
| case 'align': | ||
| if (typeof value === 'string') { | ||
| alignmentFromString(customisations, value); | ||
| } | ||
| break; | ||
| // Color: override style | ||
| case 'color': | ||
| style.color = value; | ||
| break; | ||
| // Rotation as string | ||
| case 'rotate': | ||
| if (typeof value === 'string') { | ||
| customisations[key] = rotateFromString(value); | ||
| } | ||
| else if (typeof value === 'number') { | ||
| customisations[key] = value; | ||
| } | ||
| break; | ||
| // Remove aria-hidden | ||
| case 'ariaHidden': | ||
| case 'aria-hidden': | ||
| // Vue transforms 'aria-hidden' property to 'ariaHidden' | ||
| if (value !== true && value !== 'true') { | ||
| delete componentProps['aria-hidden']; | ||
| } | ||
| break; | ||
| default: | ||
| if (customisationAliases[key] !== void 0) { | ||
| // Aliases for customisations | ||
| if (customisationAliases[key].boolean && | ||
| (value === true || value === 'true' || value === 1)) { | ||
| // Check for boolean | ||
| customisations[customisationAliases[key].attr] = true; | ||
| } | ||
| else if (!customisationAliases[key].boolean && | ||
| typeof value === 'string' && | ||
| value !== '') { | ||
| // String | ||
| customisations[customisationAliases[key].attr] = value; | ||
| } | ||
| } | ||
| else if (defaults[key] === void 0) { | ||
| // Copy missing property if it does not exist in customisations | ||
| componentProps[key] = value; | ||
| } | ||
| } | ||
| } | ||
| // Generate icon | ||
| const item = iconToSVG(icon, customisations); | ||
| // Add icon stuff | ||
| for (let key in item.attributes) { | ||
| componentProps[key] = item.attributes[key]; | ||
| } | ||
| if (item.inline && | ||
| style.verticalAlign === void 0 && | ||
| style['vertical-align'] === void 0) { | ||
| style.verticalAlign = '-0.125em'; | ||
| } | ||
| // Counter for ids based on "id" property to render icons consistently on server and client | ||
| let localCounter = 0; | ||
| const id = props.id; | ||
| // Add innerHTML and style to props | ||
| componentProps['innerHTML'] = replaceIDs(item.body, id ? () => id + '-' + localCounter++ : 'iconify-vue-'); | ||
| if (Object.keys(style).length > 0) { | ||
| componentProps['style'] = style; | ||
| } | ||
| // Render icon | ||
| return vue.h('svg', componentProps); | ||
| }; | ||
| Object.defineProperty(exports, '__esModule', { value: true }); | ||
| /** | ||
| * Storage for icons referred by name | ||
| */ | ||
| const storage = Object.create(null); | ||
| /** | ||
| * Add icon to storage, allowing to call it by name | ||
| * | ||
| * @param name | ||
| * @param data | ||
| */ | ||
| function addIcon(name, data) { | ||
| storage[name] = fullIcon(data); | ||
| } | ||
| /** | ||
| * Add collection to storage, allowing to call icons by name | ||
| * | ||
| * @param data Icon set | ||
| * @param prefix Optional prefix to add to icon names, true (default) if prefix from icon set should be used. | ||
| */ | ||
| function addCollection(data, prefix) { | ||
| const iconPrefix = typeof prefix === 'string' | ||
| ? prefix | ||
| : prefix !== false && typeof data.prefix === 'string' | ||
| ? data.prefix + ':' | ||
| : ''; | ||
| parseIconSet(data, (name, icon) => { | ||
| if (icon !== null) { | ||
| storage[iconPrefix + name] = icon; | ||
| } | ||
| }); | ||
| } | ||
| /** | ||
| * Component | ||
| */ | ||
| const Icon = vue.defineComponent({ | ||
| // Do not inherit other attributes: it is handled by render() | ||
| inheritAttrs: false, | ||
| // Render icon | ||
| render() { | ||
| const props = this.$attrs; | ||
| // Check icon | ||
| const icon = typeof props.icon === 'string' | ||
| ? storage[props.icon] | ||
| : typeof props.icon === 'object' | ||
| ? fullIcon(props.icon) | ||
| : null; | ||
| // Validate icon object | ||
| if (icon === null || | ||
| typeof icon !== 'object' || | ||
| typeof icon.body !== 'string') { | ||
| return this.$slots.default ? this.$slots.default() : null; | ||
| } | ||
| // Valid icon: render it | ||
| return render(icon, props); | ||
| }, | ||
| }); | ||
| }))); | ||
| exports.Icon = Icon; | ||
| exports.addCollection = addCollection; | ||
| exports.addIcon = addIcon; | ||
| Object.defineProperty(exports, '__esModule', { value: true }); | ||
| })); |
@@ -5,3 +5,3 @@ { | ||
| "author": "Vjacheslav Trushkin", | ||
| "version": "3.1.0-beta.2", | ||
| "version": "3.1.0-beta.3", | ||
| "license": "MIT", | ||
@@ -22,3 +22,2 @@ "bugs": "https://github.com/iconify/iconify/issues", | ||
| "build:api": "api-extractor run --local --verbose --config api-extractor.iconify.json", | ||
| "pretest": "npm run build", | ||
| "test": "jest" | ||
@@ -29,20 +28,28 @@ }, | ||
| "types": "dist/iconify.d.ts", | ||
| "exports": { | ||
| "./*": "./*", | ||
| ".": { | ||
| "import": "./dist/index.mjs", | ||
| "types": "./dist/index.d.ts", | ||
| "default": "./dist/index.js" | ||
| }, | ||
| "./offline": { | ||
| "import": "./dist/offline.mjs", | ||
| "types": "./dist/offline.d.ts", | ||
| "default": "./dist/offline.js" | ||
| } | ||
| }, | ||
| "devDependencies": { | ||
| "@iconify/core": "^1.2.0-beta.2", | ||
| "@iconify/types": "^1.0.6", | ||
| "@iconify/utils": "^1.0.7", | ||
| "@babel/preset-env": "^7.15.6", | ||
| "@iconify/core": "^1.2.0-beta.3", | ||
| "@microsoft/api-extractor": "^7.15.2", | ||
| "@rollup/plugin-commonjs": "^19.0.0", | ||
| "@rollup/plugin-node-resolve": "^13.0.0", | ||
| "@types/jest": "^26.0.15", | ||
| "@vue/cli-plugin-unit-jest": "^4.5.13", | ||
| "@types/jest": "^27.0.2", | ||
| "@vue/test-utils": "^2.0.0-rc.6", | ||
| "babel-eslint": "^10.1.0", | ||
| "babel-jest": "^26.6.3", | ||
| "babel-preset-env": "^1.7.0", | ||
| "jest": "^24.9.0", | ||
| "rollup": "^2.33.3", | ||
| "typescript": "^4.1.2", | ||
| "vue": "3", | ||
| "vue-jest": "^5.0.0-alpha.9" | ||
| "@vue/vue3-jest": "^27.0.0-alpha.1", | ||
| "babel-jest": "^27.2.2", | ||
| "jest": "^27.2.2", | ||
| "rollup": "^2.57.0", | ||
| "typescript": "^4.4.3", | ||
| "vue": "3" | ||
| }, | ||
@@ -49,0 +56,0 @@ "peerDependencies": { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Dev dependency count
- decreased by-29.41%
12
- Number of package files
- increased by14.29%
16
- Number of medium supply chain risk alerts
- decreased by-50%
2
Worsened metrics
- Total package byte prevSize
- decreased by-33.07%
194498
- Lines of code
- decreased by-30.61%
6081
No dependency changes