@iconify/tools 3.0.5 → 4.0.0-dev.1

package/lib/colors/detect.d.ts

@@ -3,6 +3,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../icon-set/types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/colors/parse.d.ts

@@ -2,6 +2,7 @@ import { Color } from '@iconify/utils/lib/colors/types';
 import { SVG } from '../svg/index.js';
 import { ColorAttributes } from './attribs.js';
 import { ElementsTreeItem, AnalyseSVGStructureResult, ExtendedTagElement, AnalyseSVGStructureOptions } from '../svg/analyse/types.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/colors/validate.d.ts

@@ -1,5 +1,6 @@
 import { SVG } from '../svg/index.js';
 import { ParseColorsOptions, FindColorsResult, ParseColorsSyncOptions } from './parse.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '@iconify/utils/lib/colors/types';

package/lib/export/directory.d.ts

@@ -4,6 +4,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../icon-set/types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/export/icon-package.d.ts

@@ -5,6 +5,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../icon-set/types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/export/json-package.d.ts

@@ -5,6 +5,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../icon-set/types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/icon-set/index.cjs

@@ -512,7 +512,7 @@ class IconSet {
     return count;
   }
   /**
-   * Remove icon
+   * Rename icon
    */
   rename(oldName, newName) {
     const entries = this.entries;

package/lib/icon-set/index.d.ts

@@ -3,6 +3,7 @@ import { IconifyIconCustomisations } from '@iconify/utils/lib/customisations/def
 import { IconSetIconEntry, IconCategory, IconSetIconType, IconSetAsyncForEachCallback, IconSetSyncForEachCallback, ResolvedIconifyIcon, CommonIconProps, CheckThemeResult } from './types.js';
 import { SVG } from '../svg/index.js';
 import { ParentIconsTree } from '@iconify/utils/lib/icon-set/tree';
+import 'cheerio';
 
 /**
  * Sort theme keys: long keys first
@@ -117,7 +118,7 @@ declare class IconSet {
      */
     remove(name: string, removeDependencies?: boolean | string): number;
     /**
-     * Remove icon
+     * Rename icon
      */
     rename(oldName: string, newName: string): boolean;
     /**

package/lib/icon-set/index.mjs

@@ -510,7 +510,7 @@ class IconSet {
     return count;
   }
   /**
-   * Remove icon
+   * Rename icon
    */
   rename(oldName, newName) {
     const entries = this.entries;

package/lib/icon-set/match.d.ts

@@ -4,6 +4,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import './types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/icon-set/merge.d.ts

@@ -3,6 +3,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import './types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/icon-set/modified.d.ts

@@ -3,6 +3,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import './types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/icon-set/tags.d.ts

@@ -3,6 +3,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import './types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 declare const paletteTags: {

package/lib/import/directory.d.ts

@@ -4,6 +4,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../icon-set/types.js';
 import '../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 import '../svg/cleanup/bad-tags.js';
 

package/lib/import/figma/index.d.ts

@@ -6,6 +6,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../../icon-set/types.js';
 import '../../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 import './types/nodes.js';
 import './types/api.js';

package/lib/import/figma/nodes.d.ts

@@ -6,6 +6,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../../icon-set/types.js';
 import '../../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 import './types/nodes.js';
 

package/lib/import/figma/query.d.ts

@@ -8,6 +8,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../../icon-set/types.js';
 import '../../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 import './types/nodes.js';
 

package/lib/import/figma/types/nodes.d.ts

@@ -5,6 +5,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../../../icon-set/types.js';
 import '../../../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 type FigmaImportParentNodeType = 'CANVAS' | 'FRAME' | 'GROUP' | 'SECTION';

package/lib/import/figma/types/options.d.ts

@@ -5,6 +5,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../../../icon-set/types.js';
 import '../../../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 import './api.js';
 

package/lib/import/figma/types/result.d.ts

@@ -3,6 +3,7 @@ import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../../../icon-set/types.js';
 import '../../../svg/index.js';
+import 'cheerio';
 import '@iconify/utils/lib/icon-set/tree';
 
 /**

package/lib/index.cjs

@@ -32,8 +32,10 @@ const colors_parse = require('./colors/parse.cjs');
 const colors_validate = require('./colors/validate.cjs');
 const colors_detect = require('./colors/detect.cjs');
 const optimise_svgo = require('./optimise/svgo.cjs');
+const optimise_figma = require('./optimise/figma.cjs');
 const optimise_flags = require('./optimise/flags.cjs');
 const optimise_origin = require('./optimise/origin.cjs');
+const optimise_mask = require('./optimise/mask.cjs');
 const optimise_scale = require('./optimise/scale.cjs');
 const optimise_globalStyle = require('./optimise/global-style.cjs');
 const export_directory = require('./export/directory.cjs');
@@ -130,8 +132,10 @@ exports.validateColors = colors_validate.validateColors;
 exports.validateColorsSync = colors_validate.validateColorsSync;
 exports.detectIconSetPalette = colors_detect.detectIconSetPalette;
 exports.runSVGO = optimise_svgo.runSVGO;
+exports.removeFigmaClipPathFromSVG = optimise_figma.removeFigmaClipPathFromSVG;
 exports.deOptimisePaths = optimise_flags.deOptimisePaths;
 exports.resetSVGOrigin = optimise_origin.resetSVGOrigin;
+exports.convertSVGToMask = optimise_mask.convertSVGToMask;
 exports.scaleSVG = optimise_scale.scaleSVG;
 exports.cleanupGlobalStyle = optimise_globalStyle.cleanupGlobalStyle;
 exports.exportToDirectory = export_directory.exportToDirectory;

package/lib/index.d.ts

@@ -30,8 +30,10 @@ export { isEmptyColor, parseColors, parseColorsSync } from './colors/parse.js';
 export { validateColors, validateColorsSync } from './colors/validate.js';
 export { detectIconSetPalette } from './colors/detect.js';
 export { runSVGO } from './optimise/svgo.js';
+export { removeFigmaClipPathFromSVG } from './optimise/figma.js';
 export { deOptimisePaths } from './optimise/flags.js';
 export { resetSVGOrigin } from './optimise/origin.js';
+export { convertSVGToMask } from './optimise/mask.js';
 export { scaleSVG } from './optimise/scale.js';
 export { cleanupGlobalStyle } from './optimise/global-style.js';
 export { exportToDirectory } from './export/directory.js';
@@ -47,6 +49,7 @@ export { execAsync } from './misc/exec.js';
 export { cleanupIconKeyword } from './misc/keyword.js';
 export { bumpVersion } from './misc/bump-version.js';
 export { sendAPIQuery } from './download/api/index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import './misc/cheerio.js';

package/lib/index.mjs

@@ -30,8 +30,10 @@ export { isEmptyColor, parseColors, parseColorsSync } from './colors/parse.mjs';
 export { validateColors, validateColorsSync } from './colors/validate.mjs';
 export { detectIconSetPalette } from './colors/detect.mjs';
 export { runSVGO } from './optimise/svgo.mjs';
+export { removeFigmaClipPathFromSVG } from './optimise/figma.mjs';
 export { deOptimisePaths } from './optimise/flags.mjs';
 export { resetSVGOrigin } from './optimise/origin.mjs';
+export { convertSVGToMask } from './optimise/mask.mjs';
 export { scaleSVG } from './optimise/scale.mjs';
 export { cleanupGlobalStyle } from './optimise/global-style.mjs';
 export { exportToDirectory } from './export/directory.mjs';

package/lib/misc/cheerio.d.ts

@@ -1,7 +1,9 @@
+import * as cheerio from 'cheerio';
+
 /**
  * Shortcuts for Cheerio elements
  */
-type CheerioElement = cheerio.TagElement;
-type WrappedCheerioElement = cheerio.Cheerio;
+type CheerioElement = cheerio.Element;
+type WrappedCheerioElement = cheerio.Cheerio<cheerio.Element>;
 
 export { CheerioElement, WrappedCheerioElement };

package/lib/optimise/figma.cjs

@@ -0,0 +1,175 @@
+'use strict';
+
+const svg_data_tags = require('../svg/data/tags.cjs');
+
+function isTinyNumber(value, limit) {
+  const num = parseInt(value);
+  return !isNaN(num) && Math.abs(num) < limit;
+}
+function checkClipPathNode(clipNode, expectedWidth, expectedHeight) {
+  for (const attr in clipNode.attribs) {
+    if (attr !== "id") {
+      return false;
+    }
+  }
+  const children = clipNode.children.filter((node) => node.type !== "text");
+  if (children.length !== 1) {
+    return false;
+  }
+  const childNode = children[0];
+  if (childNode.type !== "tag" || childNode.children.length) {
+    return false;
+  }
+  const attribs = {
+    ...childNode.attribs
+  };
+  delete attribs["fill"];
+  const fill = (childNode.attribs["fill"] ?? "").toLowerCase();
+  if (fill !== "white" && fill !== "#fff" && fill !== "#ffffff") {
+    console.warn(
+      "Unxepected fill on clip path:",
+      childNode.attribs["fill"]
+    );
+    return false;
+  }
+  switch (childNode.tagName) {
+    case "rect": {
+      const width = parseInt(childNode.attribs["width"]);
+      const height = parseInt(childNode.attribs["height"]);
+      if (width !== expectedWidth || height !== expectedHeight) {
+        console.warn("Invalid size of clip path");
+        return false;
+      }
+      delete attribs["width"];
+      delete attribs["height"];
+      break;
+    }
+    default:
+      console.warn(
+        "Unexpected tag in Figma clip path:",
+        childNode.tagName
+      );
+      return false;
+  }
+  Object.keys(attribs).forEach((attr) => {
+    const value = attribs[attr];
+    switch (attr) {
+      case "transform": {
+        const translateStart = "translate(";
+        const translateEnd = ")";
+        if (value.startsWith(translateStart) && value.endsWith(translateEnd)) {
+          const translateParts = value.slice(translateStart.length, 0 - translateEnd.length).split(/\s+/);
+          const limit = Math.min(expectedWidth, expectedHeight) / 1e3;
+          if (translateParts.length === 2 && isTinyNumber(translateParts[0], limit) && isTinyNumber(translateParts[1], limit)) {
+            delete attribs[attr];
+          }
+        }
+      }
+    }
+  });
+  return {
+    node: clipNode,
+    attribs
+  };
+}
+const urlStart = "url(#";
+const urlEnd = ")";
+function removeFigmaClipPathFromSVG(svg) {
+  const cheerio2 = svg.$svg;
+  const $root = svg.$svg(":root");
+  const children = $root.children();
+  const backup = svg.toString();
+  const shapesToClip = [];
+  let clipID;
+  for (let i = 0; i < children.length; i++) {
+    const node = children[i];
+    if (node.type === "tag") {
+      const tagName = node.tagName;
+      if (!svg_data_tags.defsTag.has(tagName) && !svg_data_tags.maskTags.has(tagName) && !svg_data_tags.symbolTag.has(tagName)) {
+        const clipPath2 = node.attribs["clip-path"];
+        if (!clipPath2 || !clipPath2.startsWith(urlStart) || !clipPath2.endsWith(urlEnd)) {
+          return false;
+        }
+        const id = clipPath2.slice(urlStart.length, 0 - urlEnd.length);
+        if (typeof clipID === "string" && clipID !== id) {
+          return false;
+        }
+        clipID = id;
+        shapesToClip.push(node);
+      }
+    }
+  }
+  if (typeof clipID !== "string") {
+    return false;
+  }
+  const checkClipPath = (node) => {
+    const id = node.attribs["id"];
+    if (id !== clipID) {
+      return;
+    }
+    const result = checkClipPathNode(
+      node,
+      svg.viewBox.width,
+      svg.viewBox.height
+    );
+    cheerio2(node).remove();
+    return result;
+  };
+  const findClipPath = () => {
+    for (let i = 0; i < children.length; i++) {
+      const node = children[i];
+      if (node.type === "tag") {
+        const tagName = node.tagName;
+        if (svg_data_tags.defsTag.has(tagName)) {
+          const defsChildren = node.children;
+          for (let j = 0; j < defsChildren.length; j++) {
+            const childNode = defsChildren[j];
+            if (childNode.type === "tag" && childNode.tagName === "clipPath") {
+              const result = checkClipPath(childNode);
+              if (result !== void 0) {
+                const validChildren = node.children.filter(
+                  (test) => {
+                    if (test.type === "text") {
+                      return false;
+                    }
+                    return true;
+                  }
+                );
+                if (!validChildren.length) {
+                  cheerio2(node).remove();
+                }
+                return result;
+              }
+            }
+          }
+        }
+        if (tagName === "clipPath") {
+          const result = checkClipPath(node);
+          if (result !== void 0) {
+            return result;
+          }
+        }
+      }
+    }
+  };
+  const clipPath = findClipPath();
+  if (!clipPath) {
+    svg.load(backup);
+    return false;
+  }
+  const attribs = clipPath.attribs;
+  for (let i = 0; i < shapesToClip.length; i++) {
+    const node = shapesToClip[i];
+    cheerio2(node).removeAttr("clip-path");
+    for (const attr in attribs) {
+      if (node.attribs[attr] !== void 0) {
+        svg.load(backup);
+        return false;
+      }
+      cheerio2(node).attr(attr, attribs[attr]);
+    }
+  }
+  return true;
+}
+
+exports.removeFigmaClipPathFromSVG = removeFigmaClipPathFromSVG;

package/lib/optimise/figma.d.ts

@@ -0,0 +1,11 @@
+import { SVG } from '../svg/index.js';
+import 'cheerio';
+import '@iconify/types';
+import '@iconify/utils/lib/customisations/defaults';
+
+/**
+ * Removes clip path from SVG, which Figma adds to icons that might have overflowing elements
+ */
+declare function removeFigmaClipPathFromSVG(svg: SVG): boolean;
+
+export { removeFigmaClipPathFromSVG };

package/lib/optimise/figma.mjs

@@ -0,0 +1,173 @@
+import { defsTag, maskTags, symbolTag } from '../svg/data/tags.mjs';
+
+function isTinyNumber(value, limit) {
+  const num = parseInt(value);
+  return !isNaN(num) && Math.abs(num) < limit;
+}
+function checkClipPathNode(clipNode, expectedWidth, expectedHeight) {
+  for (const attr in clipNode.attribs) {
+    if (attr !== "id") {
+      return false;
+    }
+  }
+  const children = clipNode.children.filter((node) => node.type !== "text");
+  if (children.length !== 1) {
+    return false;
+  }
+  const childNode = children[0];
+  if (childNode.type !== "tag" || childNode.children.length) {
+    return false;
+  }
+  const attribs = {
+    ...childNode.attribs
+  };
+  delete attribs["fill"];
+  const fill = (childNode.attribs["fill"] ?? "").toLowerCase();
+  if (fill !== "white" && fill !== "#fff" && fill !== "#ffffff") {
+    console.warn(
+      "Unxepected fill on clip path:",
+      childNode.attribs["fill"]
+    );
+    return false;
+  }
+  switch (childNode.tagName) {
+    case "rect": {
+      const width = parseInt(childNode.attribs["width"]);
+      const height = parseInt(childNode.attribs["height"]);
+      if (width !== expectedWidth || height !== expectedHeight) {
+        console.warn("Invalid size of clip path");
+        return false;
+      }
+      delete attribs["width"];
+      delete attribs["height"];
+      break;
+    }
+    default:
+      console.warn(
+        "Unexpected tag in Figma clip path:",
+        childNode.tagName
+      );
+      return false;
+  }
+  Object.keys(attribs).forEach((attr) => {
+    const value = attribs[attr];
+    switch (attr) {
+      case "transform": {
+        const translateStart = "translate(";
+        const translateEnd = ")";
+        if (value.startsWith(translateStart) && value.endsWith(translateEnd)) {
+          const translateParts = value.slice(translateStart.length, 0 - translateEnd.length).split(/\s+/);
+          const limit = Math.min(expectedWidth, expectedHeight) / 1e3;
+          if (translateParts.length === 2 && isTinyNumber(translateParts[0], limit) && isTinyNumber(translateParts[1], limit)) {
+            delete attribs[attr];
+          }
+        }
+      }
+    }
+  });
+  return {
+    node: clipNode,
+    attribs
+  };
+}
+const urlStart = "url(#";
+const urlEnd = ")";
+function removeFigmaClipPathFromSVG(svg) {
+  const cheerio2 = svg.$svg;
+  const $root = svg.$svg(":root");
+  const children = $root.children();
+  const backup = svg.toString();
+  const shapesToClip = [];
+  let clipID;
+  for (let i = 0; i < children.length; i++) {
+    const node = children[i];
+    if (node.type === "tag") {
+      const tagName = node.tagName;
+      if (!defsTag.has(tagName) && !maskTags.has(tagName) && !symbolTag.has(tagName)) {
+        const clipPath2 = node.attribs["clip-path"];
+        if (!clipPath2 || !clipPath2.startsWith(urlStart) || !clipPath2.endsWith(urlEnd)) {
+          return false;
+        }
+        const id = clipPath2.slice(urlStart.length, 0 - urlEnd.length);
+        if (typeof clipID === "string" && clipID !== id) {
+          return false;
+        }
+        clipID = id;
+        shapesToClip.push(node);
+      }
+    }
+  }
+  if (typeof clipID !== "string") {
+    return false;
+  }
+  const checkClipPath = (node) => {
+    const id = node.attribs["id"];
+    if (id !== clipID) {
+      return;
+    }
+    const result = checkClipPathNode(
+      node,
+      svg.viewBox.width,
+      svg.viewBox.height
+    );
+    cheerio2(node).remove();
+    return result;
+  };
+  const findClipPath = () => {
+    for (let i = 0; i < children.length; i++) {
+      const node = children[i];
+      if (node.type === "tag") {
+        const tagName = node.tagName;
+        if (defsTag.has(tagName)) {
+          const defsChildren = node.children;
+          for (let j = 0; j < defsChildren.length; j++) {
+            const childNode = defsChildren[j];
+            if (childNode.type === "tag" && childNode.tagName === "clipPath") {
+              const result = checkClipPath(childNode);
+              if (result !== void 0) {
+                const validChildren = node.children.filter(
+                  (test) => {
+                    if (test.type === "text") {
+                      return false;
+                    }
+                    return true;
+                  }
+                );
+                if (!validChildren.length) {
+                  cheerio2(node).remove();
+                }
+                return result;
+              }
+            }
+          }
+        }
+        if (tagName === "clipPath") {
+          const result = checkClipPath(node);
+          if (result !== void 0) {
+            return result;
+          }
+        }
+      }
+    }
+  };
+  const clipPath = findClipPath();
+  if (!clipPath) {
+    svg.load(backup);
+    return false;
+  }
+  const attribs = clipPath.attribs;
+  for (let i = 0; i < shapesToClip.length; i++) {
+    const node = shapesToClip[i];
+    cheerio2(node).removeAttr("clip-path");
+    for (const attr in attribs) {
+      if (node.attribs[attr] !== void 0) {
+        svg.load(backup);
+        return false;
+      }
+      cheerio2(node).attr(attr, attribs[attr]);
+    }
+  }
+  return true;
+}
+
+export { removeFigmaClipPathFromSVG };

package/lib/optimise/flags.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../svg/index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/optimise/global-style.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../svg/index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/optimise/mask.cjs

@@ -0,0 +1,110 @@
+'use strict';
+
+const colors_parse = require('../colors/parse.cjs');
+const utils = require('@iconify/utils');
+require('@iconify/utils/lib/colors');
+require('../svg/data/tags.cjs');
+require('../svg/parse-style.cjs');
+require('../css/parse.cjs');
+require('../css/parser/tokens.cjs');
+require('../css/parser/error.cjs');
+require('../css/parser/strings.cjs');
+require('../css/parser/text.cjs');
+require('../css/parser/export.cjs');
+require('../css/parser/tree.cjs');
+require('../svg/parse.cjs');
+require('../colors/attribs.cjs');
+require('../svg/data/attributes.cjs');
+require('../svg/analyse.cjs');
+require('../svg/analyse/error.cjs');
+
+const defaultBlackColors = ["black", "#000", "#000000"];
+const defaultWhiteColors = ["white", "#fff", "#ffffff"];
+const defaultOptions = {
+  color: "currentColor",
+  solid: [...defaultBlackColors, "currentcolor"],
+  transparent: defaultWhiteColors,
+  force: false,
+  id: "mask"
+};
+function convertSVGToMask(svg, options = {}) {
+  const props = {
+    ...defaultOptions,
+    ...options
+  };
+  const check = (test, value, color) => {
+    if (typeof test === "string") {
+      return value.toLowerCase() === test;
+    }
+    if (test instanceof Array) {
+      return test.includes(value.toLowerCase());
+    }
+    return test(value, color);
+  };
+  let foundSolid = false;
+  let foundTransparent = false;
+  let failed = false;
+  let hasCustomValue = false;
+  const backup = svg.toString();
+  colors_parse.parseColorsSync(svg, {
+    callback: (attr, colorStr, color) => {
+      if (!color || colors_parse.isEmptyColor(color)) {
+        return colorStr;
+      }
+      if (props.custom) {
+        let customValue = props.custom(colorStr.toLowerCase(), color);
+        if (typeof customValue === "number") {
+          const num = Math.max(
+            Math.min(Math.round(customValue * 255), 255),
+            0
+          );
+          let str = num.toString(16);
+          if (str.length < 2) {
+            str = "0" + str;
+          }
+          if (str[0] === str[1]) {
+            str = str[0];
+          }
+          customValue = "#" + str + str + str;
+        }
+        if (typeof customValue === "string") {
+          if (defaultBlackColors.includes(customValue)) {
+            foundSolid = true;
+          } else if (defaultWhiteColors.includes(customValue)) {
+            foundTransparent = true;
+          } else {
+            hasCustomValue = true;
+          }
+          return customValue;
+        }
+      }
+      if (check(props.solid, colorStr, color)) {
+        foundSolid = true;
+        return "#fff";
+      }
+      if (check(props.transparent, colorStr, color)) {
+        foundTransparent = true;
+        return "#000";
+      }
+      failed = true;
+      console.warn("Unexpected color:", colorStr);
+      return color;
+    }
+  });
+  const hasColors = hasCustomValue || foundSolid && foundTransparent;
+  if (failed || !hasColors && !props.force) {
+    svg.load(backup);
+    return false;
+  }
+  const parsed = utils.parseSVGContent(svg.toString());
+  if (!parsed) {
+    return false;
+  }
+  const { defs, content } = utils.splitSVGDefs(parsed.body);
+  const newBody = `<defs>${defs}<mask id="${props.id}">${content}</mask></defs><rect mask="url(#${props.id})" ${svg.viewBox.left ? `x=${svg.viewBox.left} ` : ""}${svg.viewBox.top ? `y=${svg.viewBox.top} ` : ""}width="${svg.viewBox.width}" height="${svg.viewBox.height}" fill="${props.color}" />`;
+  const newContent = utils.iconToHTML(newBody, parsed.attribs);
+  svg.load(newContent);
+  return true;
+}
+
+exports.convertSVGToMask = convertSVGToMask;

package/lib/optimise/mask.d.ts

@@ -0,0 +1,24 @@
+import { Color } from '@iconify/utils/lib/colors/types';
+import { SVG } from '../svg/index.js';
+import 'cheerio';
+import '@iconify/types';
+import '@iconify/utils/lib/customisations/defaults';
+
+type ColorCallback = (value: string, color: Color | null) => boolean;
+type ColorCheck = string | string[] | ColorCallback;
+interface SVGToMaskOptions {
+    color?: string;
+    solid?: ColorCheck;
+    transparent?: ColorCheck;
+    custom?: (value: string, color: Color | null) => string | number | undefined;
+    force?: boolean;
+    id?: string;
+}
+/**
+ * Converts SVG to mask
+ *
+ * Fixes badly designed icons, which use white shape where icon supposed to be transparent
+ */
+declare function convertSVGToMask(svg: SVG, options?: SVGToMaskOptions): boolean;
+
+export { convertSVGToMask };

package/lib/optimise/mask.mjs

@@ -0,0 +1,108 @@
+import { parseColorsSync, isEmptyColor } from '../colors/parse.mjs';
+import { parseSVGContent, splitSVGDefs, iconToHTML } from '@iconify/utils';
+import '@iconify/utils/lib/colors';
+import '../svg/data/tags.mjs';
+import '../svg/parse-style.mjs';
+import '../css/parse.mjs';
+import '../css/parser/tokens.mjs';
+import '../css/parser/error.mjs';
+import '../css/parser/strings.mjs';
+import '../css/parser/text.mjs';
+import '../css/parser/export.mjs';
+import '../css/parser/tree.mjs';
+import '../svg/parse.mjs';
+import '../colors/attribs.mjs';
+import '../svg/data/attributes.mjs';
+import '../svg/analyse.mjs';
+import '../svg/analyse/error.mjs';
+
+const defaultBlackColors = ["black", "#000", "#000000"];
+const defaultWhiteColors = ["white", "#fff", "#ffffff"];
+const defaultOptions = {
+  color: "currentColor",
+  solid: [...defaultBlackColors, "currentcolor"],
+  transparent: defaultWhiteColors,
+  force: false,
+  id: "mask"
+};
+function convertSVGToMask(svg, options = {}) {
+  const props = {
+    ...defaultOptions,
+    ...options
+  };
+  const check = (test, value, color) => {
+    if (typeof test === "string") {
+      return value.toLowerCase() === test;
+    }
+    if (test instanceof Array) {
+      return test.includes(value.toLowerCase());
+    }
+    return test(value, color);
+  };
+  let foundSolid = false;
+  let foundTransparent = false;
+  let failed = false;
+  let hasCustomValue = false;
+  const backup = svg.toString();
+  parseColorsSync(svg, {
+    callback: (attr, colorStr, color) => {
+      if (!color || isEmptyColor(color)) {
+        return colorStr;
+      }
+      if (props.custom) {
+        let customValue = props.custom(colorStr.toLowerCase(), color);
+        if (typeof customValue === "number") {
+          const num = Math.max(
+            Math.min(Math.round(customValue * 255), 255),
+            0
+          );
+          let str = num.toString(16);
+          if (str.length < 2) {
+            str = "0" + str;
+          }
+          if (str[0] === str[1]) {
+            str = str[0];
+          }
+          customValue = "#" + str + str + str;
+        }
+        if (typeof customValue === "string") {
+          if (defaultBlackColors.includes(customValue)) {
+            foundSolid = true;
+          } else if (defaultWhiteColors.includes(customValue)) {
+            foundTransparent = true;
+          } else {
+            hasCustomValue = true;
+          }
+          return customValue;
+        }
+      }
+      if (check(props.solid, colorStr, color)) {
+        foundSolid = true;
+        return "#fff";
+      }
+      if (check(props.transparent, colorStr, color)) {
+        foundTransparent = true;
+        return "#000";
+      }
+      failed = true;
+      console.warn("Unexpected color:", colorStr);
+      return color;
+    }
+  });
+  const hasColors = hasCustomValue || foundSolid && foundTransparent;
+  if (failed || !hasColors && !props.force) {
+    svg.load(backup);
+    return false;
+  }
+  const parsed = parseSVGContent(svg.toString());
+  if (!parsed) {
+    return false;
+  }
+  const { defs, content } = splitSVGDefs(parsed.body);
+  const newBody = `<defs>${defs}<mask id="${props.id}">${content}</mask></defs><rect mask="url(#${props.id})" ${svg.viewBox.left ? `x=${svg.viewBox.left} ` : ""}${svg.viewBox.top ? `y=${svg.viewBox.top} ` : ""}width="${svg.viewBox.width}" height="${svg.viewBox.height}" fill="${props.color}" />`;
+  const newContent = iconToHTML(newBody, parsed.attribs);
+  svg.load(newContent);
+  return true;
+}
+
+export { convertSVGToMask };

package/lib/optimise/origin.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../svg/index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/optimise/scale.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../svg/index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/optimise/svgo.d.ts

@@ -1,5 +1,6 @@
 import { PluginConfig } from 'svgo';
 import { SVG } from '../svg/index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

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

@@ -1,4 +1,5 @@
 import { ExtendedTagElement } from './types.js';
+import 'cheerio';
 
 /**
  * Get tag for error message

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

@@ -1,3 +1,5 @@
+import * as cheerio from 'cheerio';
+
 /**
  * Options
  */
@@ -50,7 +52,7 @@ interface ExtendedTagElementRelations {
 /**
  * Extended tag
  */
-interface ExtendedTagElement extends cheerio.TagElement, ExtendedTagElementUses, ExtendedTagElementRelations {
+interface ExtendedTagElement extends cheerio.Element, ExtendedTagElementUses, ExtendedTagElementRelations {
     _index: number;
     _id?: string;
     _belongsTo?: ElementWithID[];

package/lib/svg/analyse.d.ts

@@ -1,5 +1,6 @@
 import { SVG } from './index.js';
 import { AnalyseSVGStructureOptions, AnalyseSVGStructureResult } from './analyse/types.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/cleanup/attribs.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/cleanup/bad-tags.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/cleanup/inline-style.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/cleanup/root-style.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/cleanup/root-svg.cjs

@@ -4,7 +4,7 @@ const svg_data_attributes = require('../data/attributes.cjs');
 const svg_data_tags = require('../data/tags.cjs');
 
 function cleanupSVGRoot(svg) {
-  const cheerio = svg.$svg;
+  const cheerio2 = svg.$svg;
   const $root = svg.$svg(":root");
   const root = $root.get(0);
   const tagName = "svg";
@@ -61,12 +61,12 @@ function cleanupSVGRoot(svg) {
     $root.removeAttr(attr);
   });
   if (Object.keys(moveToChildren).length) {
-    const $wrapper = cheerio("<g />");
+    const $wrapper = cheerio2("<g />");
     for (const key in moveToChildren) {
       $wrapper.attr(key, moveToChildren[key]);
     }
     $root.children().each((_index, child) => {
-      const $child = cheerio(child);
+      const $child = cheerio2(child);
       if (child.type !== "tag") {
         $child.appendTo($wrapper);
         return;

package/lib/svg/cleanup/root-svg.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/cleanup/root-svg.mjs

@@ -2,7 +2,7 @@ import { commonAttributes, badAttributes, junkSVGAttributes, badSoftwareAttribut
 import { reusableElementsWithPalette, maskTags } from '../data/tags.mjs';
 
 function cleanupSVGRoot(svg) {
-  const cheerio = svg.$svg;
+  const cheerio2 = svg.$svg;
   const $root = svg.$svg(":root");
   const root = $root.get(0);
   const tagName = "svg";
@@ -59,12 +59,12 @@ function cleanupSVGRoot(svg) {
     $root.removeAttr(attr);
   });
   if (Object.keys(moveToChildren).length) {
-    const $wrapper = cheerio("<g />");
+    const $wrapper = cheerio2("<g />");
     for (const key in moveToChildren) {
       $wrapper.attr(key, moveToChildren[key]);
     }
     $root.children().each((_index, child) => {
-      const $child = cheerio(child);
+      const $child = cheerio2(child);
       if (child.type !== "tag") {
         $child.appendTo($wrapper);
         return;

package/lib/svg/cleanup/svgo-style.d.ts

@@ -1,4 +1,5 @@
 import { SVG } from '../index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/cleanup.d.ts

@@ -1,5 +1,6 @@
 import { SVG } from './index.js';
 import { CheckBadTagsOptions } from './cleanup/bad-tags.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/index.cjs

@@ -3,9 +3,19 @@
 const cheerio = require('cheerio');
 const utils = require('@iconify/utils');
 
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
+function _interopNamespaceCompat(e) {
+	if (e && typeof e === 'object' && 'default' in e) return e;
+	const n = Object.create(null);
+	if (e) {
+		for (const k in e) {
+			n[k] = e[k];
+		}
+	}
+	n.default = e;
+	return n;
+}
 
-const cheerio__default = /*#__PURE__*/_interopDefaultCompat(cheerio);
+const cheerio__namespace = /*#__PURE__*/_interopNamespaceCompat(cheerio);
 
 class SVG {
   /**
@@ -108,7 +118,7 @@ class SVG {
     );
     remove('xml:space="preserve"', "", "");
     content = content.replace(/<g>\s*<\/g>/g, "");
-    this.$svg = cheerio__default.load(content.trim(), {
+    this.$svg = cheerio__namespace.load(content.trim(), {
       lowerCaseAttributeNames: false,
       xmlMode: true
     });

package/lib/svg/index.d.ts

@@ -1,3 +1,4 @@
+import * as cheerio from 'cheerio';
 import { IconifyIcon } from '@iconify/types';
 export { IconifyIcon } from '@iconify/types';
 import { IconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
@@ -14,7 +15,7 @@ interface ViewBox {
  * SVG class, used to manipulate icon content.
  */
 declare class SVG {
-    $svg: cheerio.Root;
+    $svg: cheerio.CheerioAPI;
     viewBox: ViewBox;
     /**
      * Constructor

package/lib/svg/index.mjs

@@ -1,4 +1,4 @@
-import cheerio from 'cheerio';
+import * as cheerio from 'cheerio';
 import { iconToSVG, trimSVG } from '@iconify/utils';
 
 class SVG {

package/lib/svg/parse-style.d.ts

@@ -1,6 +1,7 @@
 import { SVG } from './index.js';
 import { CSSRuleToken, CSSToken, CSSAtRuleToken } from '../css/parser/types.js';
 import { ParseSVGCallbackItem } from './parse.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 import '../misc/cheerio.js';

package/lib/svg/parse.cjs

@@ -5,7 +5,7 @@ function parse(svg, callback, done) {
     if (element.type !== "tag") {
       return done2();
     }
-    const $element = cheerio(element);
+    const $element = cheerio2(element);
     const tagName = element.tagName;
     const item = {
       tagName,
@@ -37,7 +37,7 @@ function parse(svg, callback, done) {
       next();
     });
   }
-  const cheerio = svg.$svg;
+  const cheerio2 = svg.$svg;
   const $root = svg.$svg(":root");
   checkNode($root.get(0), [], done);
 }

package/lib/svg/parse.d.ts

@@ -1,5 +1,6 @@
 import { CheerioElement, WrappedCheerioElement } from '../misc/cheerio.js';
 import { SVG } from './index.js';
+import 'cheerio';
 import '@iconify/types';
 import '@iconify/utils/lib/customisations/defaults';
 

package/lib/svg/parse.mjs

@@ -3,7 +3,7 @@ function parse(svg, callback, done) {
     if (element.type !== "tag") {
       return done2();
     }
-    const $element = cheerio(element);
+    const $element = cheerio2(element);
     const tagName = element.tagName;
     const item = {
       tagName,
@@ -35,7 +35,7 @@ function parse(svg, callback, done) {
       next();
     });
   }
-  const cheerio = svg.$svg;
+  const cheerio2 = svg.$svg;
   const $root = svg.$svg(":root");
   checkNode($root.get(0), [], done);
 }

package/package.json

@@ -3,7 +3,10 @@
   "type": "module",
   "description": "Collection of functions for cleaning up and parsing SVG for Iconify project",
   "author": "Vjacheslav Trushkin",
-  "version": "3.0.5",
+  "version": "4.0.0-dev.1",
+  "publishConfig": {
+    "tag": "next"
+  },
   "license": "MIT",
   "bugs": "https://github.com/iconify/tools/issues",
   "homepage": "https://github.com/iconify/tools",
@@ -16,32 +19,31 @@
   "types": "./lib/index.d.ts",
   "dependencies": {
     "@iconify/types": "^2.0.0",
-    "@iconify/utils": "^2.1.7",
-    "@types/cheerio": "^0.22.31",
-    "@types/tar": "^6.1.5",
-    "cheerio": "^1.0.0-rc.12",
+    "@iconify/utils": "^2.1.12",
+    "@types/tar": "^6.1.10",
+    "cheerio": "1.0.0-rc.12",
     "extract-zip": "^2.0.1",
     "local-pkg": "^0.4.3",
     "pathe": "^1.1.1",
-    "svgo": "^3.0.2",
-    "tar": "^6.1.15"
+    "svgo": "^3.0.4",
+    "tar": "^6.2.0"
   },
   "devDependencies": {
-    "@types/jest": "^29.5.3",
-    "@types/node": "^18.17.3",
+    "@types/jest": "^29.5.10",
+    "@types/node": "^18.18.13",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
     "cross-env": "^7.0.3",
-    "eslint": "^8.46.0",
+    "eslint": "^8.54.0",
     "eslint-config-prettier": "^8.10.0",
     "eslint-plugin-jasmine": "^4.1.3",
     "eslint-plugin-prettier": "^4.2.1",
     "jasmine": "^5.1.0",
-    "jest": "^29.6.2",
+    "jest": "^29.7.0",
     "prettier": "^2.8.8",
-    "rimraf": "^5.0.1",
+    "rimraf": "^5.0.5",
     "ts-jest": "^29.1.1",
-    "typescript": "^5.1.6",
+    "typescript": "^5.3.2",
     "unbuild": "^1.2.1"
   },
   "exports": {
@@ -411,6 +413,11 @@
       "require": "./lib/misc/write-json.cjs",
       "import": "./lib/misc/write-json.mjs"
     },
+    "./lib/optimise/figma": {
+      "types": "./lib/optimise/figma.d.ts",
+      "require": "./lib/optimise/figma.cjs",
+      "import": "./lib/optimise/figma.mjs"
+    },
     "./lib/optimise/flags": {
       "types": "./lib/optimise/flags.d.ts",
       "require": "./lib/optimise/flags.cjs",
@@ -421,6 +428,11 @@
       "require": "./lib/optimise/global-style.cjs",
       "import": "./lib/optimise/global-style.mjs"
     },
+    "./lib/optimise/mask": {
+      "types": "./lib/optimise/mask.d.ts",
+      "require": "./lib/optimise/mask.cjs",
+      "import": "./lib/optimise/mask.mjs"
+    },
     "./lib/optimise/origin": {
       "types": "./lib/optimise/origin.d.ts",
       "require": "./lib/optimise/origin.cjs",