@datalayer/icons-react 1.0.12 → 1.0.13

package/data2/TrademarkIcon.js

@@ -6,91 +6,33 @@ const sizeMap = {
   "large": 64
 };
 
-function _DlIconInverseColormode({
-  mode,
-  children
-}) {
-  const ref = React.useRef(null);
-  const [appearance, setAppearance] = React.useState({
-    mode: typeof mode === "string" ? mode : null,
-    lightTheme: null,
-    darkTheme: null
-  });
-  React.useLayoutEffect(() => {
-    if (typeof document === "undefined") return;
-    let currentMode = null;
-    let lightTheme = null;
-    let darkTheme = null;
-    let el = ref.current && ref.current.parentElement;
-    while (el && (!currentMode || !lightTheme || !darkTheme)) {
-      if (el.getAttribute) {
-        currentMode = currentMode || el.getAttribute("data-color-mode");
-        lightTheme = lightTheme || el.getAttribute("data-light-theme");
-        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
-      }
-      el = el.parentElement;
-    }
-    if (!currentMode || currentMode === "auto") {
-      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
-    }
-    setAppearance({
-      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
-      lightTheme,
-      darkTheme
-    });
-  }, [mode]);
-  return /*#__PURE__*/React.createElement("span", {
-    ref: ref,
-    "data-color-mode": appearance.mode || "light",
-    "data-light-theme": appearance.lightTheme || undefined,
-    "data-dark-theme": appearance.darkTheme || undefined,
-    style: {
-      display: "inline-flex",
-      lineHeight: 0,
-      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
-    }
-  }, children);
-}
-
-function TrademarkIcon({
+import { forwardRef } from "react";
+const TrademarkIcon = ({
   title,
-  titleId,
   size,
   colored,
   themed,
-  colormode,
+  titleId,
   ...props
-}, svgRef) {
-  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 72 72",
-    fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
+  xmlns: "http://www.w3.org/2000/svg",
+  fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  "aria-hidden": "true",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-    "aria-hidden": "true",
-    ref: svgRef,
-    "aria-labelledby": titleId
-  }, props, {
-    "data-datalayer-icon": "",
-    style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-color": props.color,
-      color: props.color
-    }) : props && props.style
-  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
-    id: titleId
-  }, title) : null, /*#__PURE__*/React.createElement("path", {
-    d: "M57.68 47.79V24.22l-10.1 20.2-10.1-20.2v23.57M14.32 24.21h13.47m-6.74 0v23.57",
-    fill: "none",
-    stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeMiterlimit: 10,
-    strokeWidth: 6.735,
-    clipRule: "evenodd"
-  }));
-  if (!colormode) return _svgEl;
-  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
-    mode: typeof colormode === "string" ? colormode : undefined
-  }, _svgEl);
-}
-const ForwardRef = React.forwardRef(TrademarkIcon);
+  viewBox: "0 0 72 72",
+  ref: ref,
+  "aria-labelledby": titleId
+}, props), title ? /*#__PURE__*/React.createElement("title", {
+  id: titleId
+}, title) : null, /*#__PURE__*/React.createElement("path", {
+  fill: "none",
+  stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeMiterlimit: 10,
+  strokeWidth: 6.735,
+  d: "M57.68 47.79V24.22l-10.1 20.2-10.1-20.2v23.57M14.32 24.21h13.47m-6.74 0v23.57",
+  clipRule: "evenodd"
+}));
+const ForwardRef = forwardRef(TrademarkIcon);
 module.exports = ForwardRef;

package/data2/TreeDeciduousIcon.js

@@ -6,99 +6,41 @@ const sizeMap = {
   "large": 64
 };
 
-function _DlIconInverseColormode({
-  mode,
-  children
-}) {
-  const ref = React.useRef(null);
-  const [appearance, setAppearance] = React.useState({
-    mode: typeof mode === "string" ? mode : null,
-    lightTheme: null,
-    darkTheme: null
-  });
-  React.useLayoutEffect(() => {
-    if (typeof document === "undefined") return;
-    let currentMode = null;
-    let lightTheme = null;
-    let darkTheme = null;
-    let el = ref.current && ref.current.parentElement;
-    while (el && (!currentMode || !lightTheme || !darkTheme)) {
-      if (el.getAttribute) {
-        currentMode = currentMode || el.getAttribute("data-color-mode");
-        lightTheme = lightTheme || el.getAttribute("data-light-theme");
-        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
-      }
-      el = el.parentElement;
-    }
-    if (!currentMode || currentMode === "auto") {
-      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
-    }
-    setAppearance({
-      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
-      lightTheme,
-      darkTheme
-    });
-  }, [mode]);
-  return /*#__PURE__*/React.createElement("span", {
-    ref: ref,
-    "data-color-mode": appearance.mode || "light",
-    "data-light-theme": appearance.lightTheme || undefined,
-    "data-dark-theme": appearance.darkTheme || undefined,
-    style: {
-      display: "inline-flex",
-      lineHeight: 0,
-      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
-    }
-  }, children);
-}
-
-function TreeDeciduousIcon({
+import { forwardRef } from "react";
+const TreeDeciduousIcon = ({
   title,
-  titleId,
   size,
   colored,
   themed,
-  colormode,
+  titleId,
   ...props
-}, svgRef) {
-  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 72 72",
-    fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
+  xmlns: "http://www.w3.org/2000/svg",
+  fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  "aria-hidden": "true",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-    "aria-hidden": "true",
-    ref: svgRef,
-    "aria-labelledby": titleId
-  }, props, {
-    "data-datalayer-icon": "",
-    style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-color": props.color,
-      color: props.color
-    }) : props && props.style
-  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
-    id: titleId
-  }, title) : null, /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#b1cc33" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    d: "M51.56 17.73c-.509.003-1.018.034-1.524.091l-.673.072-.317-.6c-2.673-5.047-8.5-8.308-14.854-8.308-9.026 0-16.369 6.4-16.369 14.268.002.517.035 1.032.1 1.544l.1.824-.792.251c-4.015 1.272-6.608 4.186-6.608 7.421 0 4.445 4.851 8.061 10.813 8.061a13.17 13.17 0 006.584-1.688l.591-.34.19.15.343.275c2.714 2.167 7.082 3.462 11.683 3.462 7.763 0 14.32-3.69 14.32-8.06a4.411 4.411 0 00-.077-.806l-.139-.75-.021-.118.842-.266c4.021-1.27 6.621-4.185 6.621-7.425.002-4.439-4.85-8.058-10.813-8.058z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#5c9e31" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 56%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    d: "M39.468 27.997s4.917 7.331 15.443 5.488l.891 3.572-4 4.922-9.214 2.032-12.13-2.555-1.846-2.126A17.56 17.56 0 0039.47 27.997z"
-  }), /*#__PURE__*/React.createElement("g", {
-    fill: "none",
-    stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    strokeLinecap: "round",
-    strokeWidth: 2
-  }, /*#__PURE__*/React.createElement("path", {
-    strokeLinejoin: "round",
-    d: "M35.79 63.943V52.776l-7.631-7.516m7.63 7.516l4.368-4.546"
-  }), /*#__PURE__*/React.createElement("path", {
-    strokeMiterlimit: 10,
-    d: "M63.374 25.773c0-5-5.289-9.06-11.813-9.06a15.38 15.38 0 00-1.63.1c-2.764-5.217-8.763-8.84-15.739-8.84-9.593 0-17.369 6.836-17.369 15.268.002.558.038 1.114.108 1.667-4.288 1.36-7.306 4.595-7.306 8.374 0 5 5.29 9.061 11.813 9.061 2.48.021 4.922-.607 7.084-1.822 2.791 2.23 7.257 3.681 12.307 3.681 8.461 0 15.32-4.057 15.32-9.06a5.464 5.464 0 00-.094-.987c4.294-1.36 7.32-4.598 7.32-8.382z"
-  })));
-  if (!colormode) return _svgEl;
-  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
-    mode: typeof colormode === "string" ? colormode : undefined
-  }, _svgEl);
-}
-const ForwardRef = React.forwardRef(TreeDeciduousIcon);
+  viewBox: "0 0 72 72",
+  ref: ref,
+  "aria-labelledby": titleId
+}, props), title ? /*#__PURE__*/React.createElement("title", {
+  id: titleId
+}, title) : null, /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#b1cc33" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  d: "M51.56 17.73q-.764.005-1.524.091l-.673.072-.317-.6c-2.673-5.047-8.5-8.308-14.854-8.308-9.026 0-16.369 6.4-16.369 14.268q.003.776.1 1.544l.1.824-.792.251c-4.015 1.272-6.608 4.186-6.608 7.421 0 4.445 4.851 8.061 10.813 8.061a13.17 13.17 0 0 0 6.584-1.688l.591-.34.19.15.343.275c2.714 2.167 7.082 3.462 11.683 3.462 7.763 0 14.32-3.69 14.32-8.06a4.4 4.4 0 0 0-.077-.806l-.139-.75-.021-.118.842-.266c4.021-1.27 6.621-4.185 6.621-7.425.002-4.439-4.85-8.058-10.813-8.058"
+}), /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#5c9e31" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 56%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  d: "M39.468 27.997s4.917 7.331 15.443 5.488l.891 3.572-4 4.922-9.214 2.032-12.13-2.555-1.846-2.126A17.56 17.56 0 0 0 39.47 27.997z"
+}), /*#__PURE__*/React.createElement("g", {
+  fill: "none",
+  stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  strokeLinecap: "round",
+  strokeWidth: 2
+}, /*#__PURE__*/React.createElement("path", {
+  strokeLinejoin: "round",
+  d: "M35.79 63.943V52.776l-7.631-7.516m7.63 7.516 4.368-4.546"
+}), /*#__PURE__*/React.createElement("path", {
+  strokeMiterlimit: 10,
+  d: "M63.374 25.773c0-5-5.289-9.06-11.813-9.06a15 15 0 0 0-1.63.1c-2.764-5.217-8.763-8.84-15.739-8.84-9.593 0-17.369 6.836-17.369 15.268q.003.837.108 1.667c-4.288 1.36-7.306 4.595-7.306 8.374 0 5 5.29 9.061 11.813 9.061 2.48.021 4.922-.607 7.084-1.822 2.791 2.23 7.257 3.681 12.307 3.681 8.461 0 15.32-4.057 15.32-9.06a5.5 5.5 0 0 0-.094-.987c4.294-1.36 7.32-4.598 7.32-8.382z"
+})));
+const ForwardRef = forwardRef(TreeDeciduousIcon);
 module.exports = ForwardRef;

package/data2/UnlockedIcon.js

@@ -6,103 +6,45 @@ const sizeMap = {
   "large": 64
 };
 
-function _DlIconInverseColormode({
-  mode,
-  children
-}) {
-  const ref = React.useRef(null);
-  const [appearance, setAppearance] = React.useState({
-    mode: typeof mode === "string" ? mode : null,
-    lightTheme: null,
-    darkTheme: null
-  });
-  React.useLayoutEffect(() => {
-    if (typeof document === "undefined") return;
-    let currentMode = null;
-    let lightTheme = null;
-    let darkTheme = null;
-    let el = ref.current && ref.current.parentElement;
-    while (el && (!currentMode || !lightTheme || !darkTheme)) {
-      if (el.getAttribute) {
-        currentMode = currentMode || el.getAttribute("data-color-mode");
-        lightTheme = lightTheme || el.getAttribute("data-light-theme");
-        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
-      }
-      el = el.parentElement;
-    }
-    if (!currentMode || currentMode === "auto") {
-      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
-    }
-    setAppearance({
-      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
-      lightTheme,
-      darkTheme
-    });
-  }, [mode]);
-  return /*#__PURE__*/React.createElement("span", {
-    ref: ref,
-    "data-color-mode": appearance.mode || "light",
-    "data-light-theme": appearance.lightTheme || undefined,
-    "data-dark-theme": appearance.darkTheme || undefined,
-    style: {
-      display: "inline-flex",
-      lineHeight: 0,
-      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
-    }
-  }, children);
-}
-
-function UnlockedIcon({
+import { forwardRef } from "react";
+const UnlockedIcon = ({
   title,
-  titleId,
   size,
   colored,
   themed,
-  colormode,
+  titleId,
   ...props
-}, svgRef) {
-  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 72 72",
-    fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
+  xmlns: "http://www.w3.org/2000/svg",
+  fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  "aria-hidden": "true",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-    "aria-hidden": "true",
-    ref: svgRef,
-    "aria-labelledby": titleId
-  }, props, {
-    "data-datalayer-icon": "",
-    style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-color": props.color,
-      color: props.color
-    }) : props && props.style
-  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
-    id: titleId
-  }, title) : null, /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#FCEA2B" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    d: "M53 32.297h1.875v26.875h-38V32.297h1.875z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#F1B31C" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 73%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 61%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 73%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 61%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 73%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    d: "M54.43 32.493L35.66 58.994h19.308z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#D0CFCE" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    stroke: colored ? "#D0CFCE" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    strokeLinejoin: "round",
-    strokeMiterlimit: 10,
-    strokeWidth: 2,
-    d: "M46.064 31.817l.21-2.902c.477-6.985-4.83-12.683-10.514-12.494-4.672.156-8.616 4.285-9.828 9.301l-4.05-.902c1.661-6.692 7.218-12.221 13.811-12.428 7.97-.251 15.41 7.284 14.742 16.523l-.243 2.902"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M53 32.25h1.875v26.875h-38V32.25h1.875zm-6.726-3.335c.477-6.986-4.83-12.683-10.514-12.494-4.672.156-8.616 4.285-9.828 9.301l-4.05-.902c1.661-6.692 7.218-12.221 13.811-12.428 7.97-.251 15.41 7.284 14.742 16.523",
-    fill: "none",
-    stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeMiterlimit: 10,
-    strokeWidth: 2
-  }));
-  if (!colormode) return _svgEl;
-  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
-    mode: typeof colormode === "string" ? colormode : undefined
-  }, _svgEl);
-}
-const ForwardRef = React.forwardRef(UnlockedIcon);
+  viewBox: "0 0 72 72",
+  ref: ref,
+  "aria-labelledby": titleId
+}, props), title ? /*#__PURE__*/React.createElement("title", {
+  id: titleId
+}, title) : null, /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#FCEA2B" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  d: "M53 32.297h1.875v26.875h-38V32.297h1.875z"
+}), /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#F1B31C" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 73%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 61%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 73%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 61%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 73%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  d: "M54.43 32.493 35.66 58.994h19.308z"
+}), /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#D0CFCE" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  stroke: colored ? "#D0CFCE" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  strokeLinejoin: "round",
+  strokeMiterlimit: 10,
+  strokeWidth: 2,
+  d: "m46.064 31.817.21-2.902c.477-6.985-4.83-12.683-10.514-12.494-4.672.156-8.616 4.285-9.828 9.301l-4.05-.902c1.661-6.692 7.218-12.221 13.811-12.428 7.97-.251 15.41 7.284 14.742 16.523l-.243 2.902"
+}), /*#__PURE__*/React.createElement("path", {
+  fill: "none",
+  stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeMiterlimit: 10,
+  strokeWidth: 2,
+  d: "M53 32.25h1.875v26.875h-38V32.25h1.875zm-6.726-3.335c.477-6.986-4.83-12.683-10.514-12.494-4.672.156-8.616 4.285-9.828 9.301l-4.05-.902c1.661-6.692 7.218-12.221 13.811-12.428 7.97-.251 15.41 7.284 14.742 16.523"
+}));
+const ForwardRef = forwardRef(UnlockedIcon);
 module.exports = ForwardRef;

package/data2/VsIcon.js

@@ -6,96 +6,38 @@ const sizeMap = {
   "large": 64
 };
 
-function _DlIconInverseColormode({
-  mode,
-  children
-}) {
-  const ref = React.useRef(null);
-  const [appearance, setAppearance] = React.useState({
-    mode: typeof mode === "string" ? mode : null,
-    lightTheme: null,
-    darkTheme: null
-  });
-  React.useLayoutEffect(() => {
-    if (typeof document === "undefined") return;
-    let currentMode = null;
-    let lightTheme = null;
-    let darkTheme = null;
-    let el = ref.current && ref.current.parentElement;
-    while (el && (!currentMode || !lightTheme || !darkTheme)) {
-      if (el.getAttribute) {
-        currentMode = currentMode || el.getAttribute("data-color-mode");
-        lightTheme = lightTheme || el.getAttribute("data-light-theme");
-        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
-      }
-      el = el.parentElement;
-    }
-    if (!currentMode || currentMode === "auto") {
-      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
-    }
-    setAppearance({
-      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
-      lightTheme,
-      darkTheme
-    });
-  }, [mode]);
-  return /*#__PURE__*/React.createElement("span", {
-    ref: ref,
-    "data-color-mode": appearance.mode || "light",
-    "data-light-theme": appearance.lightTheme || undefined,
-    "data-dark-theme": appearance.darkTheme || undefined,
-    style: {
-      display: "inline-flex",
-      lineHeight: 0,
-      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
-    }
-  }, children);
-}
-
-function VsIcon({
+import { forwardRef } from "react";
+const VsIcon = ({
   title,
-  titleId,
   size,
   colored,
   themed,
-  colormode,
+  titleId,
   ...props
-}, svgRef) {
-  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 72 72",
-    fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
+  xmlns: "http://www.w3.org/2000/svg",
+  fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  "aria-hidden": "true",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-    "aria-hidden": "true",
-    ref: svgRef,
-    "aria-labelledby": titleId
-  }, props, {
-    "data-datalayer-icon": "",
-    style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-color": props.color,
-      color: props.color
-    }) : props && props.style
-  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
-    id: titleId
-  }, title) : null, /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#d0cfce" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    d: "M59.035 60h-46.07a.968.968 0 01-.965-.965v-46.07c0-.53.434-.965.965-.965h46.07c.53 0 .965.434.965.965v46.07c0 .53-.434.965-.965.965z"
-  }), /*#__PURE__*/React.createElement("g", {
-    fill: "none",
-    stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    strokeLinejoin: "round",
-    strokeMiterlimit: 10,
-    strokeWidth: 2
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M59.035 60h-46.07a.968.968 0 01-.965-.965v-46.07c0-.53.434-.965.965-.965h46.07c.53 0 .965.434.965.965v46.07c0 .53-.434.965-.965.965z"
-  }), /*#__PURE__*/React.createElement("path", {
-    strokeLinecap: "round",
-    d: "M44.168 33.244c-.293-1.138-1.557-1.994-3.073-1.994h0c-1.733 0-3.137 1.118-3.137 2.497s1.404 2.498 3.137 2.498l-.064.01c1.733 0 3.137 1.117 3.137 2.497s-1.404 2.498-3.137 2.498h0c-1.516 0-2.78-.856-3.073-1.995m-2.726-7.996l-2.854 9.99-2.855-9.99"
-  })));
-  if (!colormode) return _svgEl;
-  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
-    mode: typeof colormode === "string" ? colormode : undefined
-  }, _svgEl);
-}
-const ForwardRef = React.forwardRef(VsIcon);
+  viewBox: "0 0 72 72",
+  ref: ref,
+  "aria-labelledby": titleId
+}, props), title ? /*#__PURE__*/React.createElement("title", {
+  id: titleId
+}, title) : null, /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#d0cfce" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  d: "M59.035 60h-46.07a.97.97 0 0 1-.965-.965v-46.07c0-.53.434-.965.965-.965h46.07c.53 0 .965.434.965.965v46.07c0 .53-.434.965-.965.965"
+}), /*#__PURE__*/React.createElement("g", {
+  fill: "none",
+  stroke: colored ? "#000" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 96%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 38%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  strokeLinejoin: "round",
+  strokeMiterlimit: 10,
+  strokeWidth: 2
+}, /*#__PURE__*/React.createElement("path", {
+  d: "M59.035 60h-46.07a.97.97 0 0 1-.965-.965v-46.07c0-.53.434-.965.965-.965h46.07c.53 0 .965.434.965.965v46.07c0 .53-.434.965-.965.965z"
+}), /*#__PURE__*/React.createElement("path", {
+  strokeLinecap: "round",
+  d: "M44.168 33.244c-.293-1.138-1.557-1.994-3.073-1.994h0c-1.733 0-3.137 1.118-3.137 2.497s1.404 2.498 3.137 2.498l-.064.01c1.733 0 3.137 1.117 3.137 2.497s-1.404 2.498-3.137 2.498h0c-1.516 0-2.78-.856-3.073-1.995m-2.726-7.996-2.854 9.99-2.855-9.99"
+})));
+const ForwardRef = forwardRef(VsIcon);
 module.exports = ForwardRef;