@iconify/tools 2.0.11 → 2.0.12

package/lib/optimise/global-style.js

@@ -0,0 +1,158 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.cleanupGlobalStyle = void 0;
+require("../svg/data/attributes");
+const tags_1 = require("../svg/data/tags");
+const parse_1 = require("../svg/parse");
+const parse_style_1 = require("../svg/parse-style");
+function getClassList(value) {
+    return value === null || value === void 0 ? void 0 : value.split(/\s+/);
+}
+const tempDataAttrbiute = 'data-gstyle-temp';
+/**
+ * Expand global style
+ */
+async function cleanupGlobalStyle(svg) {
+    const backup = svg.toString();
+    let containsTempAttr = false;
+    // Find all animated classes
+    const animatedClasses = new Set();
+    await (0, parse_1.parseSVG)(svg, (item) => {
+        if (!tags_1.animateTags.has(item.tagName)) {
+            return;
+        }
+        const $element = item.$element;
+        if ($element.attr('attributeName') !== 'class') {
+            return;
+        }
+        ['from', 'to', 'values'].forEach((attr) => {
+            const value = $element.attr(attr);
+            if (typeof value !== 'string') {
+                return;
+            }
+            value.split(';').forEach((item) => {
+                getClassList(item).forEach((className) => {
+                    animatedClasses.add(className);
+                });
+            });
+        });
+    });
+    // Parse style
+    try {
+        await (0, parse_style_1.parseSVGStyle)(svg, async (styleItem) => {
+            var _a;
+            const returnValue = styleItem.value;
+            if (styleItem.type !== 'global') {
+                return returnValue;
+            }
+            // Handle only simple selectors
+            if (styleItem.selectors.length !== 1 ||
+                styleItem.selectorTokens.length !== 1) {
+                return returnValue;
+            }
+            // Do not handle media queries
+            const selectorToken = styleItem.selectorTokens[0];
+            if (selectorToken.type !== 'selector') {
+                return returnValue;
+            }
+            // Simple selector and simple rule
+            const selector = styleItem.selectors[0];
+            const firstChar = selector.charAt(0);
+            let matchType;
+            if (firstChar === '.') {
+                matchType = 'class';
+            }
+            else if (firstChar === '#') {
+                matchType = 'id';
+            }
+            else if (tags_1.allValidTags.has(selector)) {
+                matchType = 'tag';
+            }
+            else {
+                return returnValue;
+            }
+            const valueMatch = matchType === 'tag' ? selector : selector.slice(1);
+            if (matchType === 'class' && animatedClasses.has(valueMatch)) {
+                // Class name is used in animations
+                return returnValue;
+            }
+            // Check if element is a match
+            const isMatch = (tagName, $element) => {
+                switch (matchType) {
+                    case 'id':
+                        return $element.attr('id') === valueMatch;
+                    case 'tag':
+                        return tagName === valueMatch;
+                    case 'class': {
+                        const className = $element.attr('class');
+                        if (!className ||
+                            getClassList(className).indexOf(valueMatch) === -1) {
+                            return false;
+                        }
+                    }
+                }
+                return true;
+            };
+            // Parse all elements
+            await (0, parse_1.parseSVG)(svg, (svgItem) => {
+                var _a;
+                const tagName = svgItem.tagName;
+                const $element = svgItem.$element;
+                if (!isMatch(tagName, $element)) {
+                    return;
+                }
+                // Transfer attribute
+                const addedAttributes = new Set((_a = $element.attr(tempDataAttrbiute)) === null || _a === void 0 ? void 0 : _a.split(/\s+/));
+                const prop = styleItem.prop;
+                if ($element.attr(prop) !== void 0) {
+                    // Previously added attribute?
+                    if (addedAttributes.has(prop)) {
+                        // Two CSS rules are applied to same element: abort parsing and restore content from backup.
+                        // This parse is very basic, it does not account for specificity.
+                        throw new Error('Duplicate attribute');
+                    }
+                }
+                $element.attr(prop, styleItem.value);
+                addedAttributes.add(prop);
+                $element.attr(tempDataAttrbiute, Array.from(addedAttributes).join(' '));
+                containsTempAttr = true;
+            });
+            // Remove class attribute
+            if (matchType === 'class' &&
+                ((_a = styleItem.nextTokens[0]) === null || _a === void 0 ? void 0 : _a.type) === 'close') {
+                // Can remove class
+                await (0, parse_1.parseSVG)(svg, (svgItem) => {
+                    const $element = svgItem.$element;
+                    if (!isMatch('', $element)) {
+                        return;
+                    }
+                    // Remove class
+                    const classList = getClassList($element.attr('class'));
+                    if (!classList) {
+                        return;
+                    }
+                    const filtered = classList.filter((item) => item !== valueMatch);
+                    if (!filtered.length) {
+                        $element.removeAttr('class');
+                    }
+                    else {
+                        $element.attr('class', filtered.join(' '));
+                    }
+                });
+            }
+            // Remove rule
+            return;
+        });
+        // Remove temporary attributes
+        if (containsTempAttr) {
+            await (0, parse_1.parseSVG)(svg, (item) => {
+                item.$element.removeAttr(tempDataAttrbiute);
+            });
+        }
+    }
+    catch (err) {
+        // Failed: restore from backup
+        svg.load(backup);
+    }
+}
+exports.cleanupGlobalStyle = cleanupGlobalStyle;

package/lib/optimise/global-style.mjs

@@ -0,0 +1,129 @@
+// src/optimise/global-style.ts
+import "../svg/data/attributes.mjs";
+import { allValidTags, animateTags } from "../svg/data/tags.mjs";
+import { parseSVG } from "../svg/parse.mjs";
+import { parseSVGStyle } from "../svg/parse-style.mjs";
+function getClassList(value) {
+  return value == null ? void 0 : value.split(/\s+/);
+}
+var tempDataAttrbiute = "data-gstyle-temp";
+async function cleanupGlobalStyle(svg) {
+  const backup = svg.toString();
+  let containsTempAttr = false;
+  const animatedClasses = new Set();
+  await parseSVG(svg, (item) => {
+    if (!animateTags.has(item.tagName)) {
+      return;
+    }
+    const $element = item.$element;
+    if ($element.attr("attributeName") !== "class") {
+      return;
+    }
+    ["from", "to", "values"].forEach((attr) => {
+      const value = $element.attr(attr);
+      if (typeof value !== "string") {
+        return;
+      }
+      value.split(";").forEach((item2) => {
+        getClassList(item2).forEach((className) => {
+          animatedClasses.add(className);
+        });
+      });
+    });
+  });
+  try {
+    await parseSVGStyle(svg, async (styleItem) => {
+      var _a;
+      const returnValue = styleItem.value;
+      if (styleItem.type !== "global") {
+        return returnValue;
+      }
+      if (styleItem.selectors.length !== 1 || styleItem.selectorTokens.length !== 1) {
+        return returnValue;
+      }
+      const selectorToken = styleItem.selectorTokens[0];
+      if (selectorToken.type !== "selector") {
+        return returnValue;
+      }
+      const selector = styleItem.selectors[0];
+      const firstChar = selector.charAt(0);
+      let matchType;
+      if (firstChar === ".") {
+        matchType = "class";
+      } else if (firstChar === "#") {
+        matchType = "id";
+      } else if (allValidTags.has(selector)) {
+        matchType = "tag";
+      } else {
+        return returnValue;
+      }
+      const valueMatch = matchType === "tag" ? selector : selector.slice(1);
+      if (matchType === "class" && animatedClasses.has(valueMatch)) {
+        return returnValue;
+      }
+      const isMatch = (tagName, $element) => {
+        switch (matchType) {
+          case "id":
+            return $element.attr("id") === valueMatch;
+          case "tag":
+            return tagName === valueMatch;
+          case "class": {
+            const className = $element.attr("class");
+            if (!className || getClassList(className).indexOf(valueMatch) === -1) {
+              return false;
+            }
+          }
+        }
+        return true;
+      };
+      await parseSVG(svg, (svgItem) => {
+        var _a2;
+        const tagName = svgItem.tagName;
+        const $element = svgItem.$element;
+        if (!isMatch(tagName, $element)) {
+          return;
+        }
+        const addedAttributes = new Set((_a2 = $element.attr(tempDataAttrbiute)) == null ? void 0 : _a2.split(/\s+/));
+        const prop = styleItem.prop;
+        if ($element.attr(prop) !== void 0) {
+          if (addedAttributes.has(prop)) {
+            throw new Error("Duplicate attribute");
+          }
+        }
+        $element.attr(prop, styleItem.value);
+        addedAttributes.add(prop);
+        $element.attr(tempDataAttrbiute, Array.from(addedAttributes).join(" "));
+        containsTempAttr = true;
+      });
+      if (matchType === "class" && ((_a = styleItem.nextTokens[0]) == null ? void 0 : _a.type) === "close") {
+        await parseSVG(svg, (svgItem) => {
+          const $element = svgItem.$element;
+          if (!isMatch("", $element)) {
+            return;
+          }
+          const classList = getClassList($element.attr("class"));
+          if (!classList) {
+            return;
+          }
+          const filtered = classList.filter((item) => item !== valueMatch);
+          if (!filtered.length) {
+            $element.removeAttr("class");
+          } else {
+            $element.attr("class", filtered.join(" "));
+          }
+        });
+      }
+      return;
+    });
+    if (containsTempAttr) {
+      await parseSVG(svg, (item) => {
+        item.$element.removeAttr(tempDataAttrbiute);
+      });
+    }
+  } catch (err) {
+    svg.load(backup);
+  }
+}
+export {
+  cleanupGlobalStyle
+};

package/lib/svg/analyse/error.d.ts

@@ -0,0 +1,5 @@
+import type { ExtendedTagElement } from './types';
+/**
+ * Get tag for error message
+ */
+export declare function analyseTagError(element: ExtendedTagElement): string;

package/lib/svg/analyse/error.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.analyseTagError = void 0;
+/**
+ * Get tag for error message
+ */
+function analyseTagError(element) {
+    let result = '<' + element.tagName;
+    if (element._id) {
+        result += ' id="' + element._id + '"';
+    }
+    const attribs = element.attribs;
+    if (attribs['d']) {
+        const value = attribs['d'];
+        result +=
+            ' d="' +
+                (value.length > 16 ? value.slice(0, 12) + '...' : value) +
+                '"';
+    }
+    return result + '>';
+}
+exports.analyseTagError = analyseTagError;

package/lib/svg/analyse/error.mjs

@@ -0,0 +1,16 @@
+// src/svg/analyse/error.ts
+function analyseTagError(element) {
+  let result = "<" + element.tagName;
+  if (element._id) {
+    result += ' id="' + element._id + '"';
+  }
+  const attribs = element.attribs;
+  if (attribs["d"]) {
+    const value = attribs["d"];
+    result += ' d="' + (value.length > 16 ? value.slice(0, 12) + "..." : value) + '"';
+  }
+  return result + ">";
+}
+export {
+  analyseTagError
+};

package/lib/svg/analyse/types.d.ts

@@ -0,0 +1,89 @@
+/// <reference types="cheerio" />
+/**
+ * Options
+ */
+export interface AnalyseSVGStructureOptions {
+    fixErrors?: boolean;
+}
+/**
+ * Extended properties for element
+ */
+/**
+ * Link to element
+ */
+export interface LinkToElementWithID {
+    id: string;
+    usedAsMask: boolean;
+    usedByIndex: number;
+}
+/**
+ * How element is used by parent elements
+ */
+export interface ExtendedTagElementUses {
+    _usedAsMask: boolean;
+    _usedAsPaint: boolean;
+}
+/**
+ * Definition: mask, clip path, symbol, etc...
+ */
+interface ReusableElement {
+    id: string;
+    isMask: boolean;
+    index: number;
+}
+/**
+ * Element with id
+ *
+ * Similar to ReusableElement, but not necessary a definition - any element with id. Also contains list of child elements
+ */
+export interface ElementWithID {
+    id: string;
+    isMask: boolean;
+    indexes: Set<number>;
+}
+/**
+ * Parent and child elements. Unlike standard tree, this tree is for elements that inherit attributes from parent element
+ */
+interface ExtendedTagElementRelations {
+    _parentElement?: number;
+    _childElements?: number[];
+}
+/**
+ * Extended tag
+ */
+export interface ExtendedTagElement extends cheerio.TagElement, ExtendedTagElementUses, ExtendedTagElementRelations {
+    _index: number;
+    _id?: string;
+    _belongsTo?: ElementWithID[];
+    _reusableElement?: ReusableElement;
+    _linksTo?: LinkToElementWithID[];
+}
+/**
+ * Additional stuff for <svg>
+ */
+export interface ExtendedRootTagElement extends ExtendedTagElement {
+    _parsed?: boolean;
+}
+/**
+ * Tree
+ */
+export interface ElementsTreeItem {
+    index: number;
+    usedAsMask: boolean;
+    parent?: ElementsTreeItem;
+    children: ElementsTreeItem[];
+}
+/**
+ * Elements map
+ */
+export declare type ElementsMap = Map<number, ExtendedTagElement>;
+/**
+ * Result
+ */
+export interface AnalyseSVGStructureResult {
+    elements: ElementsMap;
+    ids: Record<string, number>;
+    links: LinkToElementWithID[];
+    tree: ElementsTreeItem;
+}
+export {};

package/lib/svg/analyse/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/svg/analyse.d.ts

@@ -0,0 +1,8 @@
+import type { SVG } from './index';
+import type { AnalyseSVGStructureResult, AnalyseSVGStructureOptions } from './analyse/types';
+/**
+ * Find all IDs, links, which elements use palette, which items aren't used
+ *
+ * Before running this function run cleanup functions to change inline style to attributes and fix attributes
+ */
+export declare function analyseSVGStructure(svg: SVG, options?: AnalyseSVGStructureOptions): Promise<AnalyseSVGStructureResult>;