@datalayer/icons-react 1.0.12 → 1.0.13

package/data2/esm/GraduationCapIcon.js

@@ -6,127 +6,69 @@ 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 GraduationCapIcon({
+import { forwardRef } from "react";
+const GraduationCapIcon = ({
   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 ? "#3f3f3f" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    stroke: colored ? "#3f3f3f" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    strokeMiterlimit: 10,
-    strokeWidth: 2,
-    d: "M56 27.917v17.979H16v-17.98"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "none",
-    stroke: 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))))")),
-    strokeMiterlimit: 10,
-    strokeWidth: 2,
-    d: "M10.043 28.5v8.406"
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: 10.043,
-    cy: 36.906,
-    r: 2,
-    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))))"))
-  }), /*#__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))))")),
-    stroke: 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))))")),
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 1.747,
-    d: "M12.043 45.896H8.25l1.897-8.12h0l1.896 8.12z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#3f3f3f" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    d: "M4 22.875h64v5.042H4zm52 8.042v14.979H16v-14.98"
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: 36,
-    cy: 22.002,
-    r: 3
-  }), /*#__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",
-    strokeWidth: 2,
-    d: "M4 22.875h64v5.042H4z"
-  }), /*#__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",
-    strokeWidth: 1.747,
-    d: "M56 30.917v14.979H16v-14.98"
-  }));
-  if (!colormode) return _svgEl;
-  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
-    mode: typeof colormode === "string" ? colormode : undefined
-  }, _svgEl);
-}
-const ForwardRef = React.forwardRef(GraduationCapIcon);
+  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 ? "#3f3f3f" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  stroke: colored ? "#3f3f3f" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  strokeMiterlimit: 10,
+  strokeWidth: 2,
+  d: "M56 27.917v17.979H16v-17.98"
+}), /*#__PURE__*/React.createElement("path", {
+  fill: "none",
+  stroke: 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))))")),
+  strokeMiterlimit: 10,
+  strokeWidth: 2,
+  d: "M10.043 28.5v8.406"
+}), /*#__PURE__*/React.createElement("circle", {
+  cx: 10.043,
+  cy: 36.906,
+  r: 2,
+  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))))"))
+}), /*#__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))))")),
+  stroke: 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))))")),
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: 1.747,
+  d: "M12.043 45.896H8.25l1.897-8.12h0z"
+}), /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#3f3f3f" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 93%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 41%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  d: "M4 22.875h64v5.042H4zm52 8.042v14.979H16v-14.98"
+}), /*#__PURE__*/React.createElement("circle", {
+  cx: 36,
+  cy: 22.002,
+  r: 3
+}), /*#__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",
+  strokeWidth: 2,
+  d: "M4 22.875h64v5.042H4z"
+}), /*#__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",
+  strokeWidth: 1.747,
+  d: "M56 30.917v14.979H16v-14.98"
+}));
+const ForwardRef = forwardRef(GraduationCapIcon);
 export default ForwardRef;

package/data2/esm/GremlinIcon.js

@@ -6,173 +6,153 @@ 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 GremlinIcon({
+import { forwardRef } from "react";
+const GremlinIcon = ({
   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 80 80",
-    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: "M28.47 14.8A30.26 30.26 0 0128 8.23s5.52 1.49 7.11 3.87v2.69l.16 3-1.73-1.09-3.19-1.29z",
-    className: "prefix__cls-1",
+  viewBox: "0 0 80 80",
+  ref: ref,
+  "aria-labelledby": titleId
+}, props), title ? /*#__PURE__*/React.createElement("title", {
+  id: titleId
+}, title) : null, /*#__PURE__*/React.createElement("path", {
+  d: "M28.47 14.8A30.3 30.3 0 0 1 28 8.23s5.52 1.49 7.11 3.87v2.69l.16 3-1.73-1.09-3.19-1.29z",
+  className: "prefix__cls-1",
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M30 15.25a20.49 20.49 0 01-.59-5s4.71 1.36 5.66 3.46l.29 3.92-.18.09-2.56-1.43z",
-    className: "prefix__cls-2",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M30 15.25a20.5 20.5 0 0 1-.59-5s4.71 1.36 5.66 3.46l.29 3.92-.18.09-2.56-1.43z",
+  className: "prefix__cls-2",
+  style: {
     fill: colored ? "#f8ed30" : (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))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M55.56 12.76a8.5 8.5 0 015.73-3.15s.61 4.26-.54 6.32l-3.24.91L55.07 18l-.41.31.09-2.82z",
-    className: "prefix__cls-1",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M55.56 12.76a8.5 8.5 0 0 1 5.73-3.15s.61 4.26-.54 6.32l-3.24.91L55.07 18l-.41.31.09-2.82z",
+  className: "prefix__cls-1",
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M54.67 15.63a7.11 7.11 0 015.17-4s.23 3.83-.61 4.64l-3.17 1.25-1.4.78z",
-    className: "prefix__cls-2",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M54.67 15.63a7.11 7.11 0 0 1 5.17-4s.23 3.83-.61 4.64l-3.17 1.25-1.4.78z",
+  className: "prefix__cls-2",
+  style: {
     fill: colored ? "#f8ed30" : (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))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? "#a8e54d" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 78%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-    d: "M52.74 78.47a5 5 0 01-1.94-.35c-1.75-.74-1.59-1.86-1.14-3.94.39-1.78.83-3.79-.65-5.63-1.28-1.58-4.77-2.49-9.58-2.49a25.44 25.44 0 00-4.88.4c-2 .45-2.36.75-2.65 1.71a3.79 3.79 0 01-.38.91c-1.1 1.92-2.76 3.63-7.52 3.83h-.14c-2.25 0-4.59-2.2-5.74-3.44a6.06 6.06 0 01-5.7 4 9.1 9.1 0 01-2.49-.38 3.26 3.26 0 01-2.24-2.34 7.42 7.42 0 011.17-6.15c4-4.68 7.72-5.37 9.59-5.37a5.81 5.81 0 013 .72c1.91 1.15.93 3.29.34 4.57a7.24 7.24 0 00-.37.9h.14a2.94 2.94 0 00.9-.2c1.27-1.3 3.76-4.47 3.48-6.13-.2-1.2 1.12-2.52 3.94-3.92 2.66-1.33 3.31-6.86 3.38-7.49v-.66l-6.74-.26-.82.47.78.58c.12.09 2.95 2.23 1.91 5.08a6 6 0 01-5.87 3.82 8 8 0 01-1.94-.24A6.31 6.31 0 0116.35 53c-.92-2.05-.67-4.54.72-7.2 1.3-2.49 3.75-3.75 7.27-3.75a17.17 17.17 0 014.71.7l3.14 1-.19-.41.3-.21a19.49 19.49 0 01-6.3-5.78 10.65 10.65 0 01-2.2-6.53l-1 .47a3.43 3.43 0 01-1.87.53c-4.47 0-9.84-7.1-11.37-9.28a17.14 17.14 0 01-3.15-8.74v-.63h3.63c17.24 0 24 4.27 24.81 4.82l1.27.5-.13-.8a25 25 0 01.25-11.79l.39-1.32 5 8.2.12-1.93c.2-3.1 5.28-7.07 7.45-8.63l1.19-.86-.24 1.45a84.21 84.21 0 00-.79 9.76v1.44l1.06-1a6.4 6.4 0 014.21-1.2h1.07l-.41.86A16.17 16.17 0 0054 18.3v1.16l1-.63c5.26-3.4 15.23-3.77 19.27-3.77h2.26l-.31.81C69.24 34 59.88 34.38 59.78 34.38h-1l.43.87c.24.47.83 2.25-1.62 5-2 2.3-8.4 5-8.46 5.07l-1.63.51 1 1.25c.46.29 2.66 1.67 5.06 3.51a11.22 11.22 0 01.79-4.2 4.36 4.36 0 013.85-2.1 6.25 6.25 0 014.59 2.2A6.55 6.55 0 0163.7 53a5.49 5.49 0 01-4.42 3.71 8.83 8.83 0 01-1 .06c-4 0-8.87-2.26-8.92-2.29l-1.28-.6.45 1.34c.72 2.17-.26 3.29-.46 3.49l-1 .78 1.23.24c4.75 1.06 6.07 5.69 6.21 6.26l.26.66a7.65 7.65 0 014.23-1.5h.39a10.92 10.92 0 014.21 1 2.91 2.91 0 011.53 2.11c.25 1.51-.51 3.42-2 5.12-2.23 2.47-6.92 5.09-10.39 5.09z"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M32.35 66.71s15.76-3.7 14.19-21c0 .04 9.46 18.1-14.19 21z",
-    className: "prefix__cls-4",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  fill: colored ? "#a8e54d" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 78%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 56%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 78%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+  d: "M52.74 78.47a5 5 0 0 1-1.94-.35c-1.75-.74-1.59-1.86-1.14-3.94.39-1.78.83-3.79-.65-5.63-1.28-1.58-4.77-2.49-9.58-2.49a25.4 25.4 0 0 0-4.88.4c-2 .45-2.36.75-2.65 1.71a3.8 3.8 0 0 1-.38.91c-1.1 1.92-2.76 3.63-7.52 3.83h-.14c-2.25 0-4.59-2.2-5.74-3.44a6.06 6.06 0 0 1-5.7 4 9 9 0 0 1-2.49-.38 3.26 3.26 0 0 1-2.24-2.34 7.42 7.42 0 0 1 1.17-6.15c4-4.68 7.72-5.37 9.59-5.37a5.8 5.8 0 0 1 3 .72c1.91 1.15.93 3.29.34 4.57a7 7 0 0 0-.37.9h.14a3 3 0 0 0 .9-.2c1.27-1.3 3.76-4.47 3.48-6.13-.2-1.2 1.12-2.52 3.94-3.92 2.66-1.33 3.31-6.86 3.38-7.49v-.66l-6.74-.26-.82.47.78.58c.12.09 2.95 2.23 1.91 5.08a6 6 0 0 1-5.87 3.82 8 8 0 0 1-1.94-.24A6.31 6.31 0 0 1 16.35 53c-.92-2.05-.67-4.54.72-7.2 1.3-2.49 3.75-3.75 7.27-3.75a17.2 17.2 0 0 1 4.71.7l3.14 1-.19-.41.3-.21a19.5 19.5 0 0 1-6.3-5.78 10.65 10.65 0 0 1-2.2-6.53l-1 .47a3.43 3.43 0 0 1-1.87.53c-4.47 0-9.84-7.1-11.37-9.28a17.14 17.14 0 0 1-3.15-8.74v-.63h3.63c17.24 0 24 4.27 24.81 4.82l1.27.5-.13-.8a25 25 0 0 1 .25-11.79l.39-1.32 5 8.2.12-1.93c.2-3.1 5.28-7.07 7.45-8.63l1.19-.86-.24 1.45a84 84 0 0 0-.79 9.76v1.44l1.06-1a6.4 6.4 0 0 1 4.21-1.2h1.07l-.41.86A16.2 16.2 0 0 0 54 18.3v1.16l1-.63c5.26-3.4 15.23-3.77 19.27-3.77h2.26l-.31.81C69.24 34 59.88 34.38 59.78 34.38h-1l.43.87c.24.47.83 2.25-1.62 5-2 2.3-8.4 5-8.46 5.07l-1.63.51 1 1.25c.46.29 2.66 1.67 5.06 3.51a11.2 11.2 0 0 1 .79-4.2 4.36 4.36 0 0 1 3.85-2.1 6.25 6.25 0 0 1 4.59 2.2A6.55 6.55 0 0 1 63.7 53a5.49 5.49 0 0 1-4.42 3.71 9 9 0 0 1-1 .06c-4 0-8.87-2.26-8.92-2.29l-1.28-.6.45 1.34c.72 2.17-.26 3.29-.46 3.49l-1 .78 1.23.24c4.75 1.06 6.07 5.69 6.21 6.26l.26.66a7.65 7.65 0 0 1 4.23-1.5h.39a10.9 10.9 0 0 1 4.21 1 2.91 2.91 0 0 1 1.53 2.11c.25 1.51-.51 3.42-2 5.12-2.23 2.47-6.92 5.09-10.39 5.09"
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M32.35 66.71s15.76-3.7 14.19-21c0 .04 9.46 18.1-14.19 21",
+  className: "prefix__cls-4",
+  style: {
     fill: colored ? "#67c166" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M77.36 14.53s-15.42-.91-22.7 3.79c0 0 .17-5.38 2.3-6.9 0 0-4.77-.91-7 1.17 0 0 .2-9.16 1.47-12.59 0 0-10 6-10.3 10.81l-4.48-7.36c0-.3-3.17 4.9-1.4 14.19 0 0-7.59-5.91-29.47-5.05A17.14 17.14 0 009 22.89c3.65 5.18 9.85 11.62 14.11 8.88 1 6.22 2.56 7.62 7.57 10.84l-1.47-.49s-9.36-3-12.71 3.35.22 10.66 3.88 11.57 7.31-.61 8.53-4-2.13-5.79-2.13-5.79l5.79.3s-.61 5.79-3 7-4.57 2.81-4.29 4.64S23 63.58 23 63.58s1.44-5.46-5.56-4.75c-4.59.46-6.69 2.11-9.46 5.88-1.37 1.87-2.54 7.84 1.89 9.22 2.73.85 7.37-.37 8.28-3.42 0 0 3 3.66 6.94 3s5.64-2 6.91-4.16c.89-1.54-.1-1.73 2.64-2.34s11.67-.82 13.86 1.88c2.79 3.45-2.26 7.93 2 9.75 3.74 1.58 10.25-1.83 13-4.87s3.09-6.65.35-8.17-7.31-1.47-8.78.36c0 0-1.19-5.57-6.67-6.78a5.37 5.37 0 001.09-3.91s5.51 2.55 9.79 2.06c5.28-.61 7-7.86 3.93-11.21s-7.58-3.05-9.41 0c-1.34 2.23-1.1 3-1 3.43a9.35 9.35 0 00-4.8-3.22l1.39-.39s6.55-2.79 8.68-5.23 2.32-4.5 1.71-5.72c0 .01 10.27.01 17.58-20.46zm-18 19.66A1.61 1.61 0 0158 33.3l-.81.61 1.52 1.62c.4.81.21 2.38-1.53 4.38-1.6 1.83-6.49 4.16-8.24 4.91l-2.47.77.5 1.39a3.41 3.41 0 011.33.45 65.08 65.08 0 015.89 4.45s0-3.88.74-5.11a3.76 3.76 0 013.3-1.77 5.65 5.65 0 014.14 2 5.93 5.93 0 01.76 5.86 4.9 4.9 0 01-3.92 3.32 8.25 8.25 0 01-.94.05c-3.82 0-10.16-3-9.81-2.81l-.12 1.8a10.9 10.9 0 01-2 5.1l1.88.12c4.66 1 5.74 5.8 5.75 5.85l.58 1.46s2.34-2.15 4.83-1.94a10.34 10.34 0 014 .93 2.29 2.29 0 011.22 1.68c.22 1.33-.48 3-1.89 4.61-2.12 2.35-6.6 4.87-9.91 4.87a4.39 4.39 0 01-1.7-.3c-1.24-.52-1.25-1.08-.78-3.25.4-1.82.89-4.08-.78-6.14-1.91-2.36-7.12-2.72-10.06-2.72a26 26 0 00-5 .42c-2 .45-2.7.8-3.1 2.13a3.18 3.18 0 01-.33.78c-1 1.64-2.41 3.33-7 3.52-2.84.12-6.09-4-6.09-4s-1.28 6.1-7.79 4.23c-2.94-.84-2.25-5.84-.78-7.52 5.57-6.36 9.82-5.71 11.77-4.53 2.17 1.32-.67 4.44-.3 5.21s2 .07 2 .07c.5-.5 4.13-4.42 3.74-6.75-.08-.51.27-1.61 3.61-3.28 2.89-1.44 3.6-6.89 3.71-8l.08-1.31a57.8 57.8 0 00-7.54-.29c-1.93.24-1.78 1-1.78 1l1.52 1.14c.1.08 2.59 2 1.7 4.39a5.39 5.39 0 01-5.4 3.4 7.4 7.4 0 01-1.79-.22 5.69 5.69 0 01-3.8-3.16c-.84-1.88-.6-4.18.71-6.67 1.19-2.27 3.45-3.42 6.73-3.42a16.59 16.59 0 014.52.67l4.41 1.39-.48-1.13.37-.53A23 23 0 0126 37a8.91 8.91 0 01-1.46-7.16 24.21 24.21 0 01-3.66 1.41c-3.32 0-7.8-4.66-10.87-9a16.54 16.54 0 01-3-8.42h3c17.9 0 26.6 6 26.6 6l-.05-2.15a24.59 24.59 0 01.29-11.46l4.83 7.67s.41-5.58 7.89-11a85 85 0 00-.8 9.85l-.06 2.88 2.11-2a5.85 5.85 0 013.79-1h.11a16.66 16.66 0 00-1.25 5.84l-.07 2.32 2-1.26c5.12-3.31 15-3.67 18.94-3.67h1.37C68.82 33.41 60.42 34.18 59.4 34.18z",
-    className: "prefix__cls-1",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M77.36 14.53s-15.42-.91-22.7 3.79c0 0 .17-5.38 2.3-6.9 0 0-4.77-.91-7 1.17 0 0 .2-9.16 1.47-12.59 0 0-10 6-10.3 10.81l-4.48-7.36c0-.3-3.17 4.9-1.4 14.19 0 0-7.59-5.91-29.47-5.05A17.14 17.14 0 0 0 9 22.89c3.65 5.18 9.85 11.62 14.11 8.88 1 6.22 2.56 7.62 7.57 10.84l-1.47-.49s-9.36-3-12.71 3.35.22 10.66 3.88 11.57 7.31-.61 8.53-4-2.13-5.79-2.13-5.79l5.79.3s-.61 5.79-3 7-4.57 2.81-4.29 4.64S23 63.58 23 63.58s1.44-5.46-5.56-4.75c-4.59.46-6.69 2.11-9.46 5.88-1.37 1.87-2.54 7.84 1.89 9.22 2.73.85 7.37-.37 8.28-3.42 0 0 3 3.66 6.94 3s5.64-2 6.91-4.16c.89-1.54-.1-1.73 2.64-2.34s11.67-.82 13.86 1.88c2.79 3.45-2.26 7.93 2 9.75 3.74 1.58 10.25-1.83 13-4.87s3.09-6.65.35-8.17-7.31-1.47-8.78.36c0 0-1.19-5.57-6.67-6.78a5.37 5.37 0 0 0 1.09-3.91s5.51 2.55 9.79 2.06c5.28-.61 7-7.86 3.93-11.21s-7.58-3.05-9.41 0c-1.34 2.23-1.1 3-1 3.43a9.35 9.35 0 0 0-4.8-3.22l1.39-.39s6.55-2.79 8.68-5.23 2.32-4.5 1.71-5.72c0 .01 10.27.01 17.58-20.46m-18 19.66A1.61 1.61 0 0 1 58 33.3l-.81.61 1.52 1.62c.4.81.21 2.38-1.53 4.38-1.6 1.83-6.49 4.16-8.24 4.91l-2.47.77.5 1.39a3.4 3.4 0 0 1 1.33.45 65 65 0 0 1 5.89 4.45s0-3.88.74-5.11a3.76 3.76 0 0 1 3.3-1.77 5.65 5.65 0 0 1 4.14 2 5.93 5.93 0 0 1 .76 5.86 4.9 4.9 0 0 1-3.92 3.32 8 8 0 0 1-.94.05c-3.82 0-10.16-3-9.81-2.81l-.12 1.8a10.9 10.9 0 0 1-2 5.1l1.88.12c4.66 1 5.74 5.8 5.75 5.85l.58 1.46s2.34-2.15 4.83-1.94a10.3 10.3 0 0 1 4 .93 2.29 2.29 0 0 1 1.22 1.68c.22 1.33-.48 3-1.89 4.61-2.12 2.35-6.6 4.87-9.91 4.87a4.4 4.4 0 0 1-1.7-.3c-1.24-.52-1.25-1.08-.78-3.25.4-1.82.89-4.08-.78-6.14-1.91-2.36-7.12-2.72-10.06-2.72a26 26 0 0 0-5 .42c-2 .45-2.7.8-3.1 2.13a3.2 3.2 0 0 1-.33.78c-1 1.64-2.41 3.33-7 3.52-2.84.12-6.09-4-6.09-4s-1.28 6.1-7.79 4.23c-2.94-.84-2.25-5.84-.78-7.52 5.57-6.36 9.82-5.71 11.77-4.53 2.17 1.32-.67 4.44-.3 5.21s2 .07 2 .07c.5-.5 4.13-4.42 3.74-6.75-.08-.51.27-1.61 3.61-3.28 2.89-1.44 3.6-6.89 3.71-8l.08-1.31a58 58 0 0 0-7.54-.29c-1.93.24-1.78 1-1.78 1l1.52 1.14c.1.08 2.59 2 1.7 4.39a5.39 5.39 0 0 1-5.4 3.4 7.4 7.4 0 0 1-1.79-.22 5.69 5.69 0 0 1-3.8-3.16c-.84-1.88-.6-4.18.71-6.67 1.19-2.27 3.45-3.42 6.73-3.42a16.6 16.6 0 0 1 4.52.67l4.41 1.39-.48-1.13.37-.53A23 23 0 0 1 26 37a8.9 8.9 0 0 1-1.46-7.16 24 24 0 0 1-3.66 1.41c-3.32 0-7.8-4.66-10.87-9a16.54 16.54 0 0 1-3-8.42h3c17.9 0 26.6 6 26.6 6l-.05-2.15a24.6 24.6 0 0 1 .29-11.46l4.83 7.67s.41-5.58 7.89-11a85 85 0 0 0-.8 9.85l-.06 2.88 2.11-2a5.85 5.85 0 0 1 3.79-1h.11a16.7 16.7 0 0 0-1.25 5.84l-.07 2.32 2-1.26c5.12-3.31 15-3.67 18.94-3.67h1.37C68.82 33.41 60.42 34.18 59.4 34.18z",
+  className: "prefix__cls-1",
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M25.59 26.22s2.25-8.38-16.18-11.8c0 0 6.51 2.21 10.43 5.79a49.28 49.28 0 015.75 6.01z",
-    className: "prefix__cls-4",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M25.59 26.22s2.25-8.38-16.18-11.8c0 0 6.51 2.21 10.43 5.79a49.3 49.3 0 0 1 5.75 6.01",
+  className: "prefix__cls-4",
+  style: {
     fill: colored ? "#67c166" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M31.56 30.9s-.56-6.24 4-8.07c9.21-3.69 11 8.13 11.23 10.47.01.15-7.38 2.32-15.23-2.4z",
-    className: "prefix__cls-1",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M31.56 30.9s-.56-6.24 4-8.07c9.21-3.69 11 8.13 11.23 10.47.01.15-7.38 2.32-15.23-2.4",
+  className: "prefix__cls-1",
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M42.31 32.89a20.85 20.85 0 01-9.8-2.66c0-1.44.35-7 6.31-7.3 4.71-.23 6.64 7.08 7 9.61a20.59 20.59 0 01-3.51.35z",
-    className: "prefix__cls-5",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M42.31 32.89a20.85 20.85 0 0 1-9.8-2.66c0-1.44.35-7 6.31-7.3 4.71-.23 6.64 7.08 7 9.61a20.6 20.6 0 0 1-3.51.35",
+  className: "prefix__cls-5",
+  style: {
     fill: colored ? "#fff" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("ellipse", {
-    cx: 38.61,
-    cy: 28.12,
-    className: "prefix__cls-1",
-    rx: 2.74,
-    ry: 3.2,
+  }
+}), /*#__PURE__*/React.createElement("ellipse", {
+  cx: 38.61,
+  cy: 28.12,
+  className: "prefix__cls-1",
+  rx: 2.74,
+  ry: 3.2,
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M56.49 33.34a25.65 25.65 0 01-3.29-.27l-.36-.07-.12-.35c-1.2-3.51-.74-5.46-.14-6.47a3.4 3.4 0 01.41-.56l.28-.31 1.13.43c4.33 1.6 3.75 5.82 3.47 7.07l-.1.43h-.44a8.19 8.19 0 01-.84.1z",
-    className: "prefix__cls-5",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M56.49 33.34a26 26 0 0 1-3.29-.27l-.36-.07-.12-.35c-1.2-3.51-.74-5.46-.14-6.47a3.4 3.4 0 0 1 .41-.56l.28-.31 1.13.43c4.33 1.6 3.75 5.82 3.47 7.07l-.1.43h-.44a8 8 0 0 1-.84.1",
+  className: "prefix__cls-5",
+  style: {
     fill: colored ? "#fff" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M54.6 25.19s.61-1-.15-1-5 1.6-2.06 9.4c0 0 4.49.76 5.86.15.01-.03 2.21-6.38-3.65-8.55zM57.78 33a12.37 12.37 0 01-4.71-.29c-1.25-3.56-.8-5.47-.19-6.46a6.77 6.77 0 01.84-.83l1.08.58a5.72 5.72 0 012.98 7z",
-    className: "prefix__cls-1",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M54.6 25.19s.61-1-.15-1-5 1.6-2.06 9.4c0 0 4.49.76 5.86.15.01-.03 2.21-6.38-3.65-8.55M57.78 33a12.4 12.4 0 0 1-4.71-.29c-1.25-3.56-.8-5.47-.19-6.46a7 7 0 0 1 .84-.83l1.08.58a5.72 5.72 0 0 1 2.98 7",
+  className: "prefix__cls-1",
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("ellipse", {
-    cx: 39.29,
-    cy: 27.04,
-    className: "prefix__cls-5",
-    rx: 1.31,
-    ry: 1.5,
+  }
+}), /*#__PURE__*/React.createElement("ellipse", {
+  cx: 39.29,
+  cy: 27.04,
+  className: "prefix__cls-5",
+  rx: 1.31,
+  ry: 1.5,
+  style: {
     fill: colored ? "#fff" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("ellipse", {
-    cx: 54.11,
-    cy: 29.44,
-    className: "prefix__cls-1",
-    rx: 2,
-    ry: 2.53,
+  }
+}), /*#__PURE__*/React.createElement("ellipse", {
+  cx: 54.11,
+  cy: 29.44,
+  className: "prefix__cls-1",
+  rx: 2,
+  ry: 2.53,
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("ellipse", {
-    cx: 54.59,
-    cy: 28.36,
-    className: "prefix__cls-5",
-    rx: 0.8,
-    ry: 1.07,
+  }
+}), /*#__PURE__*/React.createElement("ellipse", {
+  cx: 54.59,
+  cy: 28.36,
+  className: "prefix__cls-5",
+  rx: 0.8,
+  ry: 1.07,
+  style: {
     fill: colored ? "#fff" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M58.89 27.61s-2-8.15 14.72-11.12c0 .01-9.04 3.41-14.72 11.12z",
-    className: "prefix__cls-4",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M58.89 27.61s-2-8.15 14.72-11.12c0 .01-9.04 3.41-14.72 11.12",
+  className: "prefix__cls-4",
+  style: {
     fill: colored ? "#67c166" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 71%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 63%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M35.46 38.74l3.99 1.45-2.03 2.26-1.96-3.71z",
-    className: "prefix__cls-5",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "m35.46 38.74 3.99 1.45-2.03 2.26z",
+  className: "prefix__cls-5",
+  style: {
     fill: colored ? "#fff" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 44%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 90%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M32.82 35.11s-1.43 1.81-1 2.19a24.14 24.14 0 0013 3.9c8-.11 9.9-1.41 12.54-3 0 0-.19-.76-.52-.62s-4.86 3.3-13 2.77c-7.59-.5-11.13-3.48-11.13-3.48s1.35-1.96.11-1.76z",
-    className: "prefix__cls-1",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M32.82 35.11s-1.43 1.81-1 2.19a24.14 24.14 0 0 0 13 3.9c8-.11 9.9-1.41 12.54-3 0 0-.19-.76-.52-.62s-4.86 3.3-13 2.77c-7.59-.5-11.13-3.48-11.13-3.48s1.35-1.96.11-1.76",
+  className: "prefix__cls-1",
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M34.75 38.64l2.5 4.39 3.03-2.51-1.14-.38-1.71 1.52-1.39-2.6-1.29-.42zm-2.98-8.7s-1.8-.29-1.8.29 2.14.93 2.14.93z",
-    className: "prefix__cls-1",
+  }
+}), /*#__PURE__*/React.createElement("path", {
+  d: "m34.75 38.64 2.5 4.39 3.03-2.51-1.14-.38-1.71 1.52-1.39-2.6zm-2.98-8.7s-1.8-.29-1.8.29 2.14.93 2.14.93z",
+  className: "prefix__cls-1",
+  style: {
     fill: colored ? "#007315" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }));
-  if (!colormode) return _svgEl;
-  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
-    mode: typeof colormode === "string" ? colormode : undefined
-  }, _svgEl);
-}
-const ForwardRef = React.forwardRef(GremlinIcon);
+  }
+}));
+const ForwardRef = forwardRef(GremlinIcon);
 export default ForwardRef;