@iconify/tools 4.0.0-dev.1 → 4.0.0

package/lib/svg/cleanup/svgo-style.mjs

@@ -1,5 +1,5 @@
 import { badAttributes, badSoftwareAttributes, badAttributePrefixes } from '../data/attributes.mjs';
-import { parseSVGStyleSync } from '../parse-style.mjs';
+import { parseSVGStyle } from '../parse-style.mjs';
 import { runSVGO } from '../../optimise/svgo.mjs';
 import '../data/tags.mjs';
 import '../../css/parse.mjs';
@@ -15,7 +15,7 @@ import '@iconify/utils/lib/svg/id';
 
 function convertStyleToAttrs(svg) {
   let hasStyle = false;
-  parseSVGStyleSync(svg, (item) => {
+  parseSVGStyle(svg, (item) => {
     if (item.type !== "inline" && item.type !== "global") {
       return item.value;
     }
@@ -24,7 +24,7 @@ function convertStyleToAttrs(svg) {
       // Attributes / properties now allowed
       badAttributes.has(prop) || badSoftwareAttributes.has(prop) || badAttributePrefixes.has(prop.split("-").shift())
     ) {
-      return void 0;
+      return;
     }
     hasStyle = true;
     return item.value;

package/lib/svg/cleanup.d.cts

@@ -0,0 +1,16 @@
+import { SVG } from './index.cjs';
+import { CheckBadTagsOptions } from './cleanup/bad-tags.cjs';
+import 'cheerio';
+import '@iconify/types';
+import '@iconify/utils/lib/customisations/defaults';
+
+/**
+ * Options
+ */
+type CleanupSVGOptions = CheckBadTagsOptions;
+/**
+ * Clean up SVG before parsing/optimising it
+ */
+declare function cleanupSVG(svg: SVG, options?: CleanupSVGOptions): void;
+
+export { type CleanupSVGOptions, cleanupSVG };

package/lib/svg/cleanup.d.mts

@@ -0,0 +1,16 @@
+import { SVG } from './index.mjs';
+import { CheckBadTagsOptions } from './cleanup/bad-tags.mjs';
+import 'cheerio';
+import '@iconify/types';
+import '@iconify/utils/lib/customisations/defaults';
+
+/**
+ * Options
+ */
+type CleanupSVGOptions = CheckBadTagsOptions;
+/**
+ * Clean up SVG before parsing/optimising it
+ */
+declare function cleanupSVG(svg: SVG, options?: CleanupSVGOptions): void;
+
+export { type CleanupSVGOptions, cleanupSVG };

package/lib/svg/cleanup.d.ts

@@ -13,4 +13,4 @@ type CleanupSVGOptions = CheckBadTagsOptions;
  */
 declare function cleanupSVG(svg: SVG, options?: CleanupSVGOptions): void;
 
-export { CleanupSVGOptions, cleanupSVG };
+export { type CleanupSVGOptions, cleanupSVG };

package/lib/svg/data/attributes.d.cts

@@ -0,0 +1,77 @@
+/**
+ * This list is highly opinionated. It is designed to handle icons that can be safely embedded in HTML and linked as external source.
+ * Icons cannot have anything that requires external resources, anything that renders inconsistently.
+ */
+/***** Attributes that are not part of tag specific stuff *****/
+/**
+ * Attributes that icons should not mess with or that are irrelevant. They should be removed
+ */
+declare const badAttributes: Set<string>;
+/**
+ * Attributes for SVG element that should be removed
+ */
+declare const junkSVGAttributes: Set<string>;
+/**
+ * Attributes and styles often added by bad software to wrong tags, such as Adobe Illustrator and Inkscape
+ */
+declare const badSoftwareAttributes: Set<string>;
+declare const badAttributePrefixes: Set<string>;
+/**
+ * Common attributes that can exist on any element
+ */
+declare const commonAttributes: Set<string>;
+declare const stylingAttributes: Set<string>;
+/**
+ * Attributes that exist only on child elements of <clipPath>
+ */
+declare const insideClipPathAttributes: Set<string>;
+/***** Other attributes, added to tagSpecificAttributes variable below *****/
+/**
+ * Presentational attributes
+ */
+declare const fillPresentationalAttributes: Set<string>;
+declare const strokePresentationalAttributes: Set<string>;
+declare const urlPresentationalAttributes: Set<string>;
+declare const visibilityPresentationalAttributes: Set<string>;
+declare const commonColorPresentationalAttributes: Set<string>;
+declare const otherPresentationalAttributes: Set<string>;
+declare const presentationalAttributes: Set<string>;
+/**
+ * Markers
+ *
+ * Presentational attributes
+ */
+declare const markerAttributes: Set<string>;
+/**
+ * Shapes
+ *
+ * Not presentational
+ */
+declare const otherShapeAttributes: Set<string>;
+/**
+ * Animations
+ */
+declare const animationTimingAttributes: Set<string>;
+declare const animationValueAttributes: Set<string>;
+declare const otherAnimationAttributes: Set<string>;
+/**
+ * Gradients
+ */
+declare const commonGradientAttributes: Set<string>;
+/**
+ * Filters
+ */
+declare const commonFeAttributes: Set<string>;
+declare const feFuncAttributes: Set<string>;
+/**
+ * Tag specific attributes
+ */
+declare const tagSpecificAnimatedAttributes: Record<string, Set<string>>;
+declare const tagSpecificPresentationalAttributes: Record<string, Set<string>>;
+declare const tagSpecificNonPresentationalAttributes: Record<string, Set<string>>;
+/**
+ * Styles to keep in tags
+ */
+declare const tagSpecificInlineStyles: Record<string, Set<string>>;
+
+export { animationTimingAttributes, animationValueAttributes, badAttributePrefixes, badAttributes, badSoftwareAttributes, commonAttributes, commonColorPresentationalAttributes, commonFeAttributes, commonGradientAttributes, feFuncAttributes, fillPresentationalAttributes, insideClipPathAttributes, junkSVGAttributes, markerAttributes, otherAnimationAttributes, otherPresentationalAttributes, otherShapeAttributes, presentationalAttributes, strokePresentationalAttributes, stylingAttributes, tagSpecificAnimatedAttributes, tagSpecificInlineStyles, tagSpecificNonPresentationalAttributes, tagSpecificPresentationalAttributes, urlPresentationalAttributes, visibilityPresentationalAttributes };

package/lib/svg/data/attributes.d.mts

@@ -0,0 +1,77 @@
+/**
+ * This list is highly opinionated. It is designed to handle icons that can be safely embedded in HTML and linked as external source.
+ * Icons cannot have anything that requires external resources, anything that renders inconsistently.
+ */
+/***** Attributes that are not part of tag specific stuff *****/
+/**
+ * Attributes that icons should not mess with or that are irrelevant. They should be removed
+ */
+declare const badAttributes: Set<string>;
+/**
+ * Attributes for SVG element that should be removed
+ */
+declare const junkSVGAttributes: Set<string>;
+/**
+ * Attributes and styles often added by bad software to wrong tags, such as Adobe Illustrator and Inkscape
+ */
+declare const badSoftwareAttributes: Set<string>;
+declare const badAttributePrefixes: Set<string>;
+/**
+ * Common attributes that can exist on any element
+ */
+declare const commonAttributes: Set<string>;
+declare const stylingAttributes: Set<string>;
+/**
+ * Attributes that exist only on child elements of <clipPath>
+ */
+declare const insideClipPathAttributes: Set<string>;
+/***** Other attributes, added to tagSpecificAttributes variable below *****/
+/**
+ * Presentational attributes
+ */
+declare const fillPresentationalAttributes: Set<string>;
+declare const strokePresentationalAttributes: Set<string>;
+declare const urlPresentationalAttributes: Set<string>;
+declare const visibilityPresentationalAttributes: Set<string>;
+declare const commonColorPresentationalAttributes: Set<string>;
+declare const otherPresentationalAttributes: Set<string>;
+declare const presentationalAttributes: Set<string>;
+/**
+ * Markers
+ *
+ * Presentational attributes
+ */
+declare const markerAttributes: Set<string>;
+/**
+ * Shapes
+ *
+ * Not presentational
+ */
+declare const otherShapeAttributes: Set<string>;
+/**
+ * Animations
+ */
+declare const animationTimingAttributes: Set<string>;
+declare const animationValueAttributes: Set<string>;
+declare const otherAnimationAttributes: Set<string>;
+/**
+ * Gradients
+ */
+declare const commonGradientAttributes: Set<string>;
+/**
+ * Filters
+ */
+declare const commonFeAttributes: Set<string>;
+declare const feFuncAttributes: Set<string>;
+/**
+ * Tag specific attributes
+ */
+declare const tagSpecificAnimatedAttributes: Record<string, Set<string>>;
+declare const tagSpecificPresentationalAttributes: Record<string, Set<string>>;
+declare const tagSpecificNonPresentationalAttributes: Record<string, Set<string>>;
+/**
+ * Styles to keep in tags
+ */
+declare const tagSpecificInlineStyles: Record<string, Set<string>>;
+
+export { animationTimingAttributes, animationValueAttributes, badAttributePrefixes, badAttributes, badSoftwareAttributes, commonAttributes, commonColorPresentationalAttributes, commonFeAttributes, commonGradientAttributes, feFuncAttributes, fillPresentationalAttributes, insideClipPathAttributes, junkSVGAttributes, markerAttributes, otherAnimationAttributes, otherPresentationalAttributes, otherShapeAttributes, presentationalAttributes, strokePresentationalAttributes, stylingAttributes, tagSpecificAnimatedAttributes, tagSpecificInlineStyles, tagSpecificNonPresentationalAttributes, tagSpecificPresentationalAttributes, urlPresentationalAttributes, visibilityPresentationalAttributes };

package/lib/svg/data/tags.d.cts

@@ -0,0 +1,95 @@
+/**
+ * This list is highly opinionated. It is designed to handle icons that can be safely embedded in HTML and linked as external source.
+ * Icons cannot have anything that requires external resources, anything that renders inconsistently.
+ */
+/**
+ * Bad tags
+ *
+ * Parser should throw error if one of these tags is found
+ *
+ * List includes text tags because:
+ * - it usuaully uses custom font, which makes things much more complex
+ * - it renders differently on different operating systems and browsers
+ *
+ * View tag is not allowed because it requires targeting view by id from external source, making it unusable in embedded icons.
+ */
+declare const badTags: Set<string>;
+/**
+ * Deprecated or irrelevant tags
+ *
+ * Tags that are quietly removed
+ */
+declare const unsupportedTags: Set<string>;
+/**
+ * Style
+ */
+declare const styleTag: Set<string>;
+/**
+ * Definitions: reusable elements inside
+ */
+declare const defsTag: Set<string>;
+/**
+ * Masks: colors are ignored, elements must have id
+ */
+declare const maskTags: Set<string>;
+/**
+ * Symbol
+ */
+declare const symbolTag: Set<string>;
+/**
+ * SVG shapes
+ */
+declare const shapeTags: Set<string>;
+/**
+ * Use
+ */
+declare const useTag: Set<string>;
+/**
+ * Groups
+ */
+declare const groupTag: Set<string>;
+/**
+ * Marker, should be inside <defs>
+ */
+declare const markerTag: Set<string>;
+/**
+ * SVG animations
+ */
+declare const animateTags: Set<string>;
+declare const animateMotionChildTags: Set<string>;
+/**
+ * Gradients, should be inside <defs>
+ */
+declare const gradientTags: Set<string>;
+/**
+ * Gradient color, must be inside one of gradientTags
+ */
+declare const gradientChildTags: Set<string>;
+/**
+ * Pattern, should be inside <defs>
+ */
+declare const patternTag: Set<string>;
+/**
+ * Filters
+ */
+declare const filterTag: Set<string>;
+declare const feLightningTags: Set<string>;
+declare const filterChildTags: Set<string>;
+declare const feComponentTransferChildTag: Set<string>;
+declare const feLightningChildTags: Set<string>;
+declare const feMergeChildTags: Set<string>;
+/***** Combination of tags *****/
+/**
+ * Reusable elements that use colors
+ *
+ * Most are used via color attributes like `fill`
+ * Some are used via custom attributes like `marker-start`
+ * Filter is used via `filter`
+ */
+declare const reusableElementsWithPalette: Set<string>;
+/**
+ * All supported tags
+ */
+declare const allValidTags: Set<string>;
+
+export { allValidTags, animateMotionChildTags, animateTags, badTags, defsTag, feComponentTransferChildTag, feLightningChildTags, feLightningTags, feMergeChildTags, filterChildTags, filterTag, gradientChildTags, gradientTags, groupTag, markerTag, maskTags, patternTag, reusableElementsWithPalette, shapeTags, styleTag, symbolTag, unsupportedTags, useTag };

package/lib/svg/data/tags.d.mts

@@ -0,0 +1,95 @@
+/**
+ * This list is highly opinionated. It is designed to handle icons that can be safely embedded in HTML and linked as external source.
+ * Icons cannot have anything that requires external resources, anything that renders inconsistently.
+ */
+/**
+ * Bad tags
+ *
+ * Parser should throw error if one of these tags is found
+ *
+ * List includes text tags because:
+ * - it usuaully uses custom font, which makes things much more complex
+ * - it renders differently on different operating systems and browsers
+ *
+ * View tag is not allowed because it requires targeting view by id from external source, making it unusable in embedded icons.
+ */
+declare const badTags: Set<string>;
+/**
+ * Deprecated or irrelevant tags
+ *
+ * Tags that are quietly removed
+ */
+declare const unsupportedTags: Set<string>;
+/**
+ * Style
+ */
+declare const styleTag: Set<string>;
+/**
+ * Definitions: reusable elements inside
+ */
+declare const defsTag: Set<string>;
+/**
+ * Masks: colors are ignored, elements must have id
+ */
+declare const maskTags: Set<string>;
+/**
+ * Symbol
+ */
+declare const symbolTag: Set<string>;
+/**
+ * SVG shapes
+ */
+declare const shapeTags: Set<string>;
+/**
+ * Use
+ */
+declare const useTag: Set<string>;
+/**
+ * Groups
+ */
+declare const groupTag: Set<string>;
+/**
+ * Marker, should be inside <defs>
+ */
+declare const markerTag: Set<string>;
+/**
+ * SVG animations
+ */
+declare const animateTags: Set<string>;
+declare const animateMotionChildTags: Set<string>;
+/**
+ * Gradients, should be inside <defs>
+ */
+declare const gradientTags: Set<string>;
+/**
+ * Gradient color, must be inside one of gradientTags
+ */
+declare const gradientChildTags: Set<string>;
+/**
+ * Pattern, should be inside <defs>
+ */
+declare const patternTag: Set<string>;
+/**
+ * Filters
+ */
+declare const filterTag: Set<string>;
+declare const feLightningTags: Set<string>;
+declare const filterChildTags: Set<string>;
+declare const feComponentTransferChildTag: Set<string>;
+declare const feLightningChildTags: Set<string>;
+declare const feMergeChildTags: Set<string>;
+/***** Combination of tags *****/
+/**
+ * Reusable elements that use colors
+ *
+ * Most are used via color attributes like `fill`
+ * Some are used via custom attributes like `marker-start`
+ * Filter is used via `filter`
+ */
+declare const reusableElementsWithPalette: Set<string>;
+/**
+ * All supported tags
+ */
+declare const allValidTags: Set<string>;
+
+export { allValidTags, animateMotionChildTags, animateTags, badTags, defsTag, feComponentTransferChildTag, feLightningChildTags, feLightningTags, feMergeChildTags, filterChildTags, filterTag, gradientChildTags, gradientTags, groupTag, markerTag, maskTags, patternTag, reusableElementsWithPalette, shapeTags, styleTag, symbolTag, unsupportedTags, useTag };

package/lib/svg/index.cjs

@@ -17,11 +17,21 @@ function _interopNamespaceCompat(e) {
 
 const cheerio__namespace = /*#__PURE__*/_interopNamespaceCompat(cheerio);
 
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
 class SVG {
   /**
    * Constructor
    */
   constructor(content) {
+    // Cheerio tree, initialized in load()
+    __publicField(this, "$svg");
+    // Dimensions, initialized in load()
+    __publicField(this, "viewBox");
     this.load(content);
   }
   /**
@@ -31,7 +41,7 @@ class SVG {
     if (customisations) {
       const data = utils.iconToSVG(this.getIcon(), customisations);
       let svgAttributes = ' xmlns="http://www.w3.org/2000/svg"';
-      if (data.body.indexOf("xlink:") !== -1) {
+      if (data.body.includes("xlink:")) {
         svgAttributes += ' xmlns:xlink="http://www.w3.org/1999/xlink"';
       }
       for (const key in data.attributes) {
@@ -62,6 +72,13 @@ class SVG {
   toMinifiedString(customisations) {
     return utils.trimSVG(this.toString(customisations));
   }
+  /**
+   * Get SVG as string with whitespaces
+   */
+  toPrettyString(customisations) {
+    const str = this.toMinifiedString(customisations);
+    return utils.prettifySVG(str) ?? str;
+  }
   /**
    * Get body
    */

package/lib/svg/index.d.cts

@@ -0,0 +1,52 @@
+import * as cheerio from 'cheerio';
+import { IconifyIcon } from '@iconify/types';
+export { IconifyIcon } from '@iconify/types';
+import { IconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
+export { IconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
+
+interface ViewBox {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}
+
+/**
+ * SVG class, used to manipulate icon content.
+ */
+declare class SVG {
+    $svg: cheerio.CheerioAPI;
+    viewBox: ViewBox;
+    /**
+     * Constructor
+     */
+    constructor(content: string);
+    /**
+     * Get SVG as string
+     */
+    toString(customisations?: IconifyIconCustomisations): string;
+    /**
+     * Get SVG as string without whitespaces
+     */
+    toMinifiedString(customisations?: IconifyIconCustomisations): string;
+    /**
+     * Get SVG as string with whitespaces
+     */
+    toPrettyString(customisations?: IconifyIconCustomisations): string;
+    /**
+     * Get body
+     */
+    getBody(): string;
+    /**
+     * Get icon as IconifyIcon
+     */
+    getIcon(): IconifyIcon;
+    /**
+     * Load SVG
+     *
+     * @param {string} content
+     */
+    load(content: string): void;
+}
+
+export { SVG, type ViewBox };

package/lib/svg/index.d.mts

@@ -0,0 +1,52 @@
+import * as cheerio from 'cheerio';
+import { IconifyIcon } from '@iconify/types';
+export { IconifyIcon } from '@iconify/types';
+import { IconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
+export { IconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
+
+interface ViewBox {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}
+
+/**
+ * SVG class, used to manipulate icon content.
+ */
+declare class SVG {
+    $svg: cheerio.CheerioAPI;
+    viewBox: ViewBox;
+    /**
+     * Constructor
+     */
+    constructor(content: string);
+    /**
+     * Get SVG as string
+     */
+    toString(customisations?: IconifyIconCustomisations): string;
+    /**
+     * Get SVG as string without whitespaces
+     */
+    toMinifiedString(customisations?: IconifyIconCustomisations): string;
+    /**
+     * Get SVG as string with whitespaces
+     */
+    toPrettyString(customisations?: IconifyIconCustomisations): string;
+    /**
+     * Get body
+     */
+    getBody(): string;
+    /**
+     * Get icon as IconifyIcon
+     */
+    getIcon(): IconifyIcon;
+    /**
+     * Load SVG
+     *
+     * @param {string} content
+     */
+    load(content: string): void;
+}
+
+export { SVG, type ViewBox };

package/lib/svg/index.d.ts

@@ -29,6 +29,10 @@ declare class SVG {
      * Get SVG as string without whitespaces
      */
     toMinifiedString(customisations?: IconifyIconCustomisations): string;
+    /**
+     * Get SVG as string with whitespaces
+     */
+    toPrettyString(customisations?: IconifyIconCustomisations): string;
     /**
      * Get body
      */
@@ -45,4 +49,4 @@ declare class SVG {
     load(content: string): void;
 }
 
-export { SVG, ViewBox };
+export { SVG, type ViewBox };

package/lib/svg/index.mjs

@@ -1,11 +1,21 @@
 import * as cheerio from 'cheerio';
-import { iconToSVG, trimSVG } from '@iconify/utils';
+import { iconToSVG, trimSVG, prettifySVG } from '@iconify/utils';
 
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
 class SVG {
   /**
    * Constructor
    */
   constructor(content) {
+    // Cheerio tree, initialized in load()
+    __publicField(this, "$svg");
+    // Dimensions, initialized in load()
+    __publicField(this, "viewBox");
     this.load(content);
   }
   /**
@@ -15,7 +25,7 @@ class SVG {
     if (customisations) {
       const data = iconToSVG(this.getIcon(), customisations);
       let svgAttributes = ' xmlns="http://www.w3.org/2000/svg"';
-      if (data.body.indexOf("xlink:") !== -1) {
+      if (data.body.includes("xlink:")) {
         svgAttributes += ' xmlns:xlink="http://www.w3.org/1999/xlink"';
       }
       for (const key in data.attributes) {
@@ -46,6 +56,13 @@ class SVG {
   toMinifiedString(customisations) {
     return trimSVG(this.toString(customisations));
   }
+  /**
+   * Get SVG as string with whitespaces
+   */
+  toPrettyString(customisations) {
+    const str = this.toMinifiedString(customisations);
+    return prettifySVG(str) ?? str;
+  }
   /**
    * Get body
    */