@iconify/tools 3.0.5 → 3.0.6

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

@@ -117,7 +117,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/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';

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/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 cheerio = 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
+    );
+    cheerio(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) {
+                  cheerio(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];
+    cheerio(node).removeAttr("clip-path");
+    for (const attr in attribs) {
+      if (node.attribs[attr] !== void 0) {
+        svg.load(backup);
+        return false;
+      }
+      cheerio(node).attr(attr, attribs[attr]);
+    }
+  }
+  return true;
+}
+
+exports.removeFigmaClipPathFromSVG = removeFigmaClipPathFromSVG;

package/lib/optimise/figma.d.ts

@@ -0,0 +1,10 @@
+import { SVG } from '../svg/index.js';
+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 cheerio = 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
+    );
+    cheerio(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) {
+                  cheerio(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];
+    cheerio(node).removeAttr("clip-path");
+    for (const attr in attribs) {
+      if (node.attribs[attr] !== void 0) {
+        svg.load(backup);
+        return false;
+      }
+      cheerio(node).attr(attr, attribs[attr]);
+    }
+  }
+  return true;
+}
+
+export { removeFigmaClipPathFromSVG };

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 (check(props.solid, colorStr, color)) {
+        foundSolid = true;
+        return "#fff";
+      }
+      if (check(props.transparent, colorStr, color)) {
+        foundTransparent = true;
+        return "#000";
+      }
+      if (props.custom) {
+        let customValue = props.custom(colorStr, 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;
+        }
+      }
+      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,23 @@
+import { Color } from '@iconify/utils/lib/colors/types';
+import { SVG } from '../svg/index.js';
+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 (check(props.solid, colorStr, color)) {
+        foundSolid = true;
+        return "#fff";
+      }
+      if (check(props.transparent, colorStr, color)) {
+        foundTransparent = true;
+        return "#000";
+      }
+      if (props.custom) {
+        let customValue = props.custom(colorStr, 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;
+        }
+      }
+      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/package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "description": "Collection of functions for cleaning up and parsing SVG for Iconify project",
   "author": "Vjacheslav Trushkin",
-  "version": "3.0.5",
+  "version": "3.0.6",
   "license": "MIT",
   "bugs": "https://github.com/iconify/tools/issues",
   "homepage": "https://github.com/iconify/tools",
@@ -16,32 +16,32 @@
   "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",
+    "@iconify/utils": "^2.1.10",
+    "@types/cheerio": "^0.22.32",
+    "@types/tar": "^6.1.6",
     "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"
+    "tar": "^6.2.0"
   },
   "devDependencies": {
-    "@types/jest": "^29.5.3",
-    "@types/node": "^18.17.3",
+    "@types/jest": "^29.5.5",
+    "@types/node": "^18.18.0",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
     "cross-env": "^7.0.3",
-    "eslint": "^8.46.0",
+    "eslint": "^8.50.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.2.2",
     "unbuild": "^1.2.1"
   },
   "exports": {
@@ -411,6 +411,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 +426,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",