@datalayer/icons-react 1.0.13 → 1.0.15

package/data1/GrafanaIcon.js

@@ -6,47 +6,103 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const GrafanaIcon = ({
+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 GrafanaIcon({
   title,
+  titleId,
   size,
   colored,
   themed,
-  titleId,
+  colormode,
   ...props
-}, 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",
+}, svgRef) {
+  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 142.5 145.6",
+    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))))")),
     height: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-  viewBox: "0 0 142.5 145.6",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  d: "M28.7 131.5c-.3 7.9-6.6 14.1-14.4 14.1C6.1 145.6 0 139 0 130.9s6.6-14.7 14.7-14.7c3.6 0 7.2 1.6 10.2 4.4l-2.3 2.9c-2.3-2-5.1-3.4-7.9-3.4-5.9 0-10.8 4.8-10.8 10.8 0 6.1 4.6 10.8 10.4 10.8 5.2 0 9.3-3.8 10.2-8.8H12.6v-3.5h16.1zm13.6-2h-2.2c-2.4 0-4.4 2-4.4 4.4v11.4h-3.9v-19.6H35v1.6c1.1-1.1 2.7-1.6 4.6-1.6h4.2zm21.4 15.8h-3.4v-2.5c-2.6 2.5-6.6 3.7-10.7 1.9-3-1.3-5.3-4.1-5.9-7.4-1.2-6.3 3.7-11.9 9.9-11.9 2.6 0 5 1.1 6.7 2.8v-2.5h3.4zm-4-8.3c.9-4-2.1-7.6-6-7.6-3.4 0-6.1 2.8-6.1 6.1 0 3.8 3.3 6.7 7.2 6.1 2.3-.4 4.3-2.3 4.9-4.6m11.8-12.3v1.1h6.2v3.4h-6.2v16.1h-3.8v-20.5c0-4.3 3.1-6.8 7-6.8h4.7l-1.6 3.7h-3.1c-1.8-.1-3.2 1.3-3.2 3m27 20.6h-3.3v-2.5c-2.6 2.5-6.6 3.7-10.7 1.9-3-1.3-5.3-4.1-5.9-7.4-1.2-6.3 3.7-11.9 9.9-11.9 2.6 0 5 1.1 6.7 2.8v-2.5h3.4v19.6zm-4-8.3c.9-4-2.1-7.6-6-7.6-3.4 0-6.1 2.8-6.1 6.1 0 3.8 3.3 6.7 7.2 6.1 2.4-.4 4.3-2.3 4.9-4.6m24.9-3.2v11.5h-3.9v-11.6c0-2.4-2-4.4-4.4-4.4-2.5 0-4.4 2-4.4 4.4v11.6h-3.9v-19.6h3.2v1.7c1.4-1.3 3.3-2 5.2-2 4.6.1 8.2 3.8 8.2 8.4m23 11.5h-3.3v-2.5c-2.6 2.5-6.6 3.7-10.7 1.9-3-1.3-5.3-4.1-5.9-7.4-1.2-6.3 3.7-11.9 9.9-11.9 2.6 0 5 1.1 6.7 2.8v-2.5h3.4v19.6zm-4-8.3c.9-4-2.1-7.6-6-7.6-3.4 0-6.1 2.8-6.1 6.1 0 3.8 3.3 6.7 7.2 6.1 2.4-.4 4.3-2.3 4.9-4.6",
-  className: "prefix__st0",
-  style: {
+    "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.7 131.5c-.3 7.9-6.6 14.1-14.4 14.1C6.1 145.6 0 139 0 130.9s6.6-14.7 14.7-14.7c3.6 0 7.2 1.6 10.2 4.4l-2.3 2.9c-2.3-2-5.1-3.4-7.9-3.4-5.9 0-10.8 4.8-10.8 10.8 0 6.1 4.6 10.8 10.4 10.8 5.2 0 9.3-3.8 10.2-8.8H12.6v-3.5h16.1v2.1zm13.6-2h-2.2c-2.4 0-4.4 2-4.4 4.4v11.4h-3.9v-19.6H35v1.6c1.1-1.1 2.7-1.6 4.6-1.6h4.2l-1.5 3.8zm21.4 15.8h-3.4v-2.5c-2.6 2.5-6.6 3.7-10.7 1.9-3-1.3-5.3-4.1-5.9-7.4-1.2-6.3 3.7-11.9 9.9-11.9 2.6 0 5 1.1 6.7 2.8v-2.5h3.4v19.6zm-4-8.3c.9-4-2.1-7.6-6-7.6-3.4 0-6.1 2.8-6.1 6.1 0 3.8 3.3 6.7 7.2 6.1 2.3-.4 4.3-2.3 4.9-4.6zm11.8-12.3v1.1h6.2v3.4h-6.2v16.1h-3.8v-20.5c0-4.3 3.1-6.8 7-6.8h4.7l-1.6 3.7h-3.1c-1.8-.1-3.2 1.3-3.2 3zm27 20.6h-3.3v-2.5c-2.6 2.5-6.6 3.7-10.7 1.9-3-1.3-5.3-4.1-5.9-7.4-1.2-6.3 3.7-11.9 9.9-11.9 2.6 0 5 1.1 6.7 2.8v-2.5h3.4v19.6h-.1zm-4-8.3c.9-4-2.1-7.6-6-7.6-3.4 0-6.1 2.8-6.1 6.1 0 3.8 3.3 6.7 7.2 6.1 2.4-.4 4.3-2.3 4.9-4.6zm24.9-3.2v11.5h-3.9v-11.6c0-2.4-2-4.4-4.4-4.4-2.5 0-4.4 2-4.4 4.4v11.6h-3.9v-19.6h3.2v1.7c1.4-1.3 3.3-2 5.2-2 4.6.1 8.2 3.8 8.2 8.4zm23 11.5h-3.3v-2.5c-2.6 2.5-6.6 3.7-10.7 1.9-3-1.3-5.3-4.1-5.9-7.4-1.2-6.3 3.7-11.9 9.9-11.9 2.6 0 5 1.1 6.7 2.8v-2.5h3.4v19.6h-.1zm-4-8.3c.9-4-2.1-7.6-6-7.6-3.4 0-6.1 2.8-6.1 6.1 0 3.8 3.3 6.7 7.2 6.1 2.4-.4 4.3-2.3 4.9-4.6z",
+    className: "prefix__st0",
     fill: colored ? "#565656" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 43%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 91%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 43%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 91%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 43%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
-  }
-}), /*#__PURE__*/React.createElement("linearGradient", {
-  id: "prefix__a",
-  x1: 71.25,
-  x2: 71.25,
-  y1: 10.489,
-  y2: 113.341,
-  gradientTransform: "matrix(1 0 0 -1 0 148.6)",
-  gradientUnits: "userSpaceOnUse"
-}, /*#__PURE__*/React.createElement("stop", {
-  offset: 0,
-  stopColor: "#fcee1f"
-}), /*#__PURE__*/React.createElement("stop", {
-  offset: 1,
-  stopColor: "#f15b2a"
-})), /*#__PURE__*/React.createElement("path", {
-  fill: colored ? "url(#prefix__a)" : (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))))")),
-  d: "M122.9 49.9c-.2-1.9-.5-4.1-1.1-6.5s-1.6-5-2.9-7.8c-1.4-2.7-3.1-5.6-5.4-8.3-.9-1.1-1.9-2.1-2.9-3.2 1.6-6.3-1.9-11.8-1.9-11.8-6.1-.4-9.9 1.9-11.3 2.9-.2-.1-.5-.2-.7-.3-1-.4-2.1-.8-3.2-1.2-1.1-.3-2.2-.7-3.3-.9-1.1-.3-2.3-.5-3.5-.7-.2 0-.4-.1-.6-.1C83.5 3.6 75.9 0 75.9 0c-8.7 5.6-10.4 13.1-10.4 13.1s0 .2-.1.4c-.5.1-.9.3-1.4.4-.6.2-1.3.4-1.9.7s-1.3.5-1.9.8c-1.3.6-2.5 1.2-3.8 1.9-1.2.7-2.4 1.4-3.5 2.2-.2-.1-.3-.2-.3-.2-11.7-4.5-22.1.9-22.1.9-.9 12.5 4.7 20.3 5.8 21.7-.3.8-.5 1.5-.8 2.3-.9 2.8-1.5 5.7-1.9 8.7-.1.4-.1.9-.2 1.3-10.8 5.3-14 16.3-14 16.3 9 10.4 19.6 11 19.6 11 1.3 2.4 2.9 4.7 4.6 6.8.7.9 1.5 1.7 2.3 2.6-3.3 9.4.5 17.3.5 17.3 10.1.4 16.7-4.4 18.1-5.5l3 .9c3.1.8 6.3 1.3 9.4 1.4H81c4.7 6.8 13.1 7.7 13.1 7.7 5.9-6.3 6.3-12.4 6.3-13.8v-.6c1.2-.9 2.4-1.8 3.6-2.8 2.4-2.1 4.4-4.6 6.2-7.2.2-.2.3-.5.5-.7 6.7.4 11.4-4.2 11.4-4.2-1.1-7-5.1-10.4-5.9-11l-.1-.1-.1-.1-.1-.1c0-.4.1-.8.1-1.3.1-.8.1-1.5.1-2.3v-2.9c0-.2 0-.4-.1-.6l-.1-.6-.1-.6c-.1-.8-.3-1.5-.4-2.3-.7-3-1.9-5.9-3.4-8.4-1.6-2.6-3.5-4.8-5.7-6.8-2.2-1.9-4.6-3.5-7.2-4.6-2.6-1.2-5.2-1.9-7.9-2.2-1.3-.2-2.7-.2-4-.2h-2c-.7.1-1.4.2-2 .3-2.7.5-5.2 1.5-7.4 2.8s-4.1 3-5.7 4.9-2.8 3.9-3.6 6.1c-.8 2.1-1.3 4.4-1.4 6.5v2.4c0 .3 0 .5.1.8.1 1.1.3 2.1.6 3.1q.9 3 2.7 5.4c1.8 2.4 2.5 2.8 4 3.8s3 1.7 4.6 2.2q2.4.75 4.5.6h2.1c.2 0 .4-.1.5-.1.2 0 .3-.1.5-.1.3-.1.7-.2 1-.3.6-.2 1.2-.5 1.8-.7q.9-.45 1.5-.9c.1-.1.3-.2.4-.3.5-.4.6-1.1.2-1.6-.4-.4-1-.5-1.5-.3-.1.1-.2.1-.4.2-.4.2-.9.4-1.3.5-.5.1-1 .3-1.5.4-.3 0-.5.1-.8.1h-1.7s-.1 0 0 0H82c-.1 0-.3 0-.4-.1-1.1-.2-2.3-.5-3.4-1s-2.2-1.2-3.1-2.1c-1-.9-1.8-1.9-2.5-3.1s-1.1-2.5-1.3-3.8c-.1-.7-.2-1.4-.1-2.1v-.6c0 .1 0 0 0 0v-.5c0-.4.1-.7.2-1.1.5-3 2-5.9 4.3-8.1.6-.6 1.2-1.1 1.9-1.5q1.05-.75 2.1-1.2c.7-.3 1.5-.6 2.3-.8s1.6-.4 2.4-.4c.4 0 .8-.1 1.2-.1h.8c.1 0 0 0 0 0h.4c.9.1 1.8.2 2.6.4 1.7.4 3.4 1 5 1.9 3.2 1.8 5.9 4.5 7.5 7.8.8 1.6 1.4 3.4 1.7 5.3.1.5.1.9.2 1.4V68c0 .5-.1 1-.1 1.5-.1.5-.1 1-.2 1.5l-.3 1.5c-.2 1-.6 1.9-.9 2.9-.7 1.9-1.7 3.7-2.9 5.3-2.4 3.3-5.7 6-9.4 7.7-1.9.8-3.8 1.5-5.8 1.8q-1.5.3-3 .3h-1.5c.1 0 0 0 0 0h-.1c-.5 0-1.1 0-1.6-.1-2.2-.2-4.3-.6-6.4-1.2q-3.15-.9-6-2.4c-3.8-2-7.2-4.9-9.9-8.2-1.3-1.7-2.5-3.5-3.5-5.4s-1.7-3.9-2.3-5.9-.9-4.1-1-6.2V58c0-1 .1-2.1.3-3.2.1-1.1.3-2.1.5-3.2s.5-2.1.8-3.2c.6-2.1 1.3-4.1 2.2-6 1.8-3.8 4.1-7.2 6.8-9.9.7-.7 1.4-1.3 2.2-1.9.3-.3 1-.9 1.8-1.4s1.6-1 2.5-1.4c.4-.2.8-.4 1.3-.6.2-.1.4-.2.7-.3.2-.1.4-.2.7-.3.9-.4 1.8-.7 2.7-1 .2-.1.5-.1.7-.2s.5-.1.7-.2c.5-.1.9-.2 1.4-.4.2-.1.5-.1.7-.2.2 0 .5-.1.7-.1s.5-.1.7-.1l.4-.1.4-.1c.2 0 .5-.1.7-.1.3 0 .5-.1.8-.1.2 0 .6-.1.8-.1s.3 0 .5-.1h.7c.3 0 .5 0 .8-.1h.4s.1 0 0 0h3.7c1.8.1 3.6.3 5.3.6 3.4.6 6.7 1.7 9.6 3.2 2.9 1.4 5.6 3.2 7.8 5.1.1.1.3.2.4.4.1.1.3.2.4.4.3.2.5.5.8.7s.5.5.8.7c.2.3.5.5.7.8 1 1 1.9 2.1 2.7 3.1 1.6 2.1 2.9 4.2 3.9 6.2.1.1.1.2.2.4.1.1.1.2.2.4s.2.5.4.7c.1.2.2.5.3.7s.2.5.3.7c.4.9.7 1.8 1 2.7.5 1.4.8 2.6 1.1 3.6.1.4.5.7.9.7.5 0 .8-.4.8-.9-.1-1.2-.1-2.5-.2-4"
-}));
-const ForwardRef = forwardRef(GrafanaIcon);
+  }), /*#__PURE__*/React.createElement("linearGradient", {
+    id: "prefix__a",
+    x1: 71.25,
+    x2: 71.25,
+    y1: 10.489,
+    y2: 113.341,
+    gradientTransform: "matrix(1 0 0 -1 0 148.6)",
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    offset: 0,
+    stopColor: "#fcee1f"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: "#f15b2a"
+  })), /*#__PURE__*/React.createElement("path", {
+    fill: colored ? "url(#prefix__a)" : (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))))")),
+    d: "M122.9 49.9c-.2-1.9-.5-4.1-1.1-6.5-.6-2.4-1.6-5-2.9-7.8-1.4-2.7-3.1-5.6-5.4-8.3-.9-1.1-1.9-2.1-2.9-3.2 1.6-6.3-1.9-11.8-1.9-11.8-6.1-.4-9.9 1.9-11.3 2.9-.2-.1-.5-.2-.7-.3-1-.4-2.1-.8-3.2-1.2-1.1-.3-2.2-.7-3.3-.9-1.1-.3-2.3-.5-3.5-.7-.2 0-.4-.1-.6-.1C83.5 3.6 75.9 0 75.9 0c-8.7 5.6-10.4 13.1-10.4 13.1s0 .2-.1.4c-.5.1-.9.3-1.4.4-.6.2-1.3.4-1.9.7-.6.3-1.3.5-1.9.8-1.3.6-2.5 1.2-3.8 1.9-1.2.7-2.4 1.4-3.5 2.2-.2-.1-.3-.2-.3-.2-11.7-4.5-22.1.9-22.1.9-.9 12.5 4.7 20.3 5.8 21.7-.3.8-.5 1.5-.8 2.3-.9 2.8-1.5 5.7-1.9 8.7-.1.4-.1.9-.2 1.3-10.8 5.3-14 16.3-14 16.3 9 10.4 19.6 11 19.6 11 1.3 2.4 2.9 4.7 4.6 6.8.7.9 1.5 1.7 2.3 2.6-3.3 9.4.5 17.3.5 17.3 10.1.4 16.7-4.4 18.1-5.5l3 .9c3.1.8 6.3 1.3 9.4 1.4H81c4.7 6.8 13.1 7.7 13.1 7.7 5.9-6.3 6.3-12.4 6.3-13.8V98.3c1.2-.9 2.4-1.8 3.6-2.8 2.4-2.1 4.4-4.6 6.2-7.2.2-.2.3-.5.5-.7 6.7.4 11.4-4.2 11.4-4.2-1.1-7-5.1-10.4-5.9-11l-.1-.1-.1-.1-.1-.1c0-.4.1-.8.1-1.3.1-.8.1-1.5.1-2.3v-2.9c0-.2 0-.4-.1-.6l-.1-.6-.1-.6c-.1-.8-.3-1.5-.4-2.3-.7-3-1.9-5.9-3.4-8.4-1.6-2.6-3.5-4.8-5.7-6.8-2.2-1.9-4.6-3.5-7.2-4.6-2.6-1.2-5.2-1.9-7.9-2.2-1.3-.2-2.7-.2-4-.2h-2c-.7.1-1.4.2-2 .3-2.7.5-5.2 1.5-7.4 2.8-2.2 1.3-4.1 3-5.7 4.9s-2.8 3.9-3.6 6.1c-.8 2.1-1.3 4.4-1.4 6.5v2.4c0 .3 0 .5.1.8.1 1.1.3 2.1.6 3.1.6 2 1.5 3.8 2.7 5.4s2.5 2.8 4 3.8 3 1.7 4.6 2.2c1.6.5 3.1.7 4.5.6h2.1c.2 0 .4-.1.5-.1.2 0 .3-.1.5-.1.3-.1.7-.2 1-.3.6-.2 1.2-.5 1.8-.7.6-.3 1.1-.6 1.5-.9.1-.1.3-.2.4-.3.5-.4.6-1.1.2-1.6-.4-.4-1-.5-1.5-.3-.1.1-.2.1-.4.2-.4.2-.9.4-1.3.5-.5.1-1 .3-1.5.4-.3 0-.5.1-.8.1h-1.7s-.1 0 0 0H82c-.1 0-.3 0-.4-.1-1.1-.2-2.3-.5-3.4-1s-2.2-1.2-3.1-2.1c-1-.9-1.8-1.9-2.5-3.1-.7-1.2-1.1-2.5-1.3-3.8-.1-.7-.2-1.4-.1-2.1v-.6c0 .1 0 0 0 0v-.5c0-.4.1-.7.2-1.1.5-3 2-5.9 4.3-8.1.6-.6 1.2-1.1 1.9-1.5.7-.5 1.4-.9 2.1-1.2.7-.3 1.5-.6 2.3-.8s1.6-.4 2.4-.4c.4 0 .8-.1 1.2-.1h.8c.1 0 0 0 0 0h.4c.9.1 1.8.2 2.6.4 1.7.4 3.4 1 5 1.9 3.2 1.8 5.9 4.5 7.5 7.8.8 1.6 1.4 3.4 1.7 5.3.1.5.1.9.2 1.4V68c0 .5-.1 1-.1 1.5-.1.5-.1 1-.2 1.5l-.3 1.5c-.2 1-.6 1.9-.9 2.9-.7 1.9-1.7 3.7-2.9 5.3-2.4 3.3-5.7 6-9.4 7.7-1.9.8-3.8 1.5-5.8 1.8-1 .2-2 .3-3 .3h-1.5c.1 0 0 0 0 0h-.1c-.5 0-1.1 0-1.6-.1-2.2-.2-4.3-.6-6.4-1.2-2.1-.6-4.1-1.4-6-2.4-3.8-2-7.2-4.9-9.9-8.2-1.3-1.7-2.5-3.5-3.5-5.4s-1.7-3.9-2.3-5.9c-.6-2-.9-4.1-1-6.2V58c0-1 .1-2.1.3-3.2.1-1.1.3-2.1.5-3.2s.5-2.1.8-3.2c.6-2.1 1.3-4.1 2.2-6 1.8-3.8 4.1-7.2 6.8-9.9.7-.7 1.4-1.3 2.2-1.9.3-.3 1-.9 1.8-1.4.8-.5 1.6-1 2.5-1.4.4-.2.8-.4 1.3-.6.2-.1.4-.2.7-.3.2-.1.4-.2.7-.3.9-.4 1.8-.7 2.7-1 .2-.1.5-.1.7-.2.2-.1.5-.1.7-.2.5-.1.9-.2 1.4-.4.2-.1.5-.1.7-.2.2 0 .5-.1.7-.1.2 0 .5-.1.7-.1l.4-.1.4-.1c.2 0 .5-.1.7-.1.3 0 .5-.1.8-.1.2 0 .6-.1.8-.1.2 0 .3 0 .5-.1h.7c.3 0 .5 0 .8-.1h.4s.1 0 0 0h3.7c1.8.1 3.6.3 5.3.6 3.4.6 6.7 1.7 9.6 3.2 2.9 1.4 5.6 3.2 7.8 5.1.1.1.3.2.4.4.1.1.3.2.4.4.3.2.5.5.8.7.3.2.5.5.8.7.2.3.5.5.7.8 1 1 1.9 2.1 2.7 3.1 1.6 2.1 2.9 4.2 3.9 6.2.1.1.1.2.2.4.1.1.1.2.2.4s.2.5.4.7c.1.2.2.5.3.7.1.2.2.5.3.7.4.9.7 1.8 1 2.7.5 1.4.8 2.6 1.1 3.6.1.4.5.7.9.7.5 0 .8-.4.8-.9-.1-1.2-.1-2.5-.2-4z"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(GrafanaIcon);
 module.exports = ForwardRef;

package/data1/GraphIcon.js

@@ -6,28 +6,86 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const GraphIcon = ({
+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 GraphIcon({
   title,
+  titleId,
   size,
   colored,
   themed,
-  titleId,
+  colormode,
   ...props
-}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
-  xmlns: "http://www.w3.org/2000/svg",
-  fill: (themed ? "var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor))" : "var(--datalayer-icon-color, currentColor)"),
-  "aria-hidden": "true",
+}, svgRef) {
+  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    fill: (themed ? "var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor))" : "var(--datalayer-icon-color, currentColor)"),
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-  viewBox: "0 0 24 24",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  d: "M2.5 2.75a.75.75 0 0 0-1.5 0v18.5c0 .414.336.75.75.75H20a.75.75 0 0 0 0-1.5H2.5z"
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M22.28 7.78a.75.75 0 0 0-1.06-1.06l-5.72 5.72-3.72-3.72a.75.75 0 0 0-1.06 0l-6 6a.75.75 0 1 0 1.06 1.06l5.47-5.47 3.72 3.72a.75.75 0 0 0 1.06 0z"
-}));
-const ForwardRef = forwardRef(GraphIcon);
+    "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: "M2.5 2.75a.75.75 0 00-1.5 0v18.5c0 .414.336.75.75.75H20a.75.75 0 000-1.5H2.5V2.75z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M22.28 7.78a.75.75 0 00-1.06-1.06l-5.72 5.72-3.72-3.72a.75.75 0 00-1.06 0l-6 6a.75.75 0 101.06 1.06l5.47-5.47 3.72 3.72a.75.75 0 001.06 0l6.25-6.25z"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(GraphIcon);
 module.exports = ForwardRef;

package/data1/HardDriveIcon.js

@@ -6,31 +6,89 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const HardDriveIcon = ({
+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 HardDriveIcon({
   title,
+  titleId,
   size,
   colored,
   themed,
-  titleId,
+  colormode,
   ...props
-}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
-  xmlns: "http://www.w3.org/2000/svg",
-  fill: "none",
-  stroke: (themed ? "var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor))" : "var(--datalayer-icon-color, currentColor)"),
+}, svgRef) {
+  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    stroke: (themed ? "var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor))" : "var(--datalayer-icon-color, currentColor)"),
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: 2,
-  "aria-hidden": "true",
-  className: "prefix__lucide prefix__lucide-hard-drive",
-  viewBox: "0 0 24 24",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  d: "M22 12H2m3.45-6.89L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11M6 16h.01M10 16h.01"
-}));
-const ForwardRef = forwardRef(HardDriveIcon);
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: 2,
+    className: "prefix__lucide prefix__lucide-hard-drive",
+    viewBox: "0 0 24 24",
+    "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: "M22 12H2m3.45-6.89L2 12v6a2 2 0 002 2h16a2 2 0 002-2v-6l-3.45-6.89A2 2 0 0016.76 4H7.24a2 2 0 00-1.79 1.11zM6 16h.01M10 16h.01"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(HardDriveIcon);
 module.exports = ForwardRef;

package/data1/HardDriveRetroIcon.js

@@ -6,28 +6,86 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const HardDriveRetroIcon = ({
+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 HardDriveRetroIcon({
   title,
+  titleId,
   size,
   colored,
   themed,
-  titleId,
+  colormode,
   ...props
-}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
-  xmlns: "http://www.w3.org/2000/svg",
-  fill: (themed ? "var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor))" : "var(--datalayer-icon-color, currentColor)"),
-  "aria-hidden": "true",
+}, svgRef) {
+  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
+    xmlns: "http://www.w3.org/2000/svg",
+    preserveAspectRatio: "xMidYMid",
+    viewBox: "0 0 470 470",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-  preserveAspectRatio: "xMidYMid",
-  viewBox: "0 0 470 470",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  fillRule: "evenodd",
-  d: "M419.5 470h-360a7.5 7.5 0 0 1-7.5-7.5V7.5A7.5 7.5 0 0 1 59.5 0h360a7.5 7.5 0 0 1 7.5 7.5v455a7.5 7.5 0 0 1-7.5 7.5M67.001 455h160v-80.423a188 188 0 0 1-27.481-3.877c-19.324 24.134-19.65 24.463-19.864 24.677-7.082 7.083-16.499 10.983-26.517 10.983-10.017-.001-19.434-3.901-26.516-10.983-14.621-14.621-14.621-38.412 0-53.033.106-.106.244-.243 3.299-2.71C112.803 327.306 98.026 312.343 85.88 295H67.001zm226.611-202.025c-25.93 32.466-45.927 57.493-61.373 76.817 2.424.124 4.848.208 7.261.208 78.575 0 142.5-63.925 142.5-142.5S318.075 45 239.5 45 97 108.925 97 187.5c0 50.413 26.619 96.927 69.798 122.578a189333 189333 0 0 1 102.225-81.688 17.55 17.55 0 0 1 10.912-3.817c4.672 0 9.064 1.82 12.368 5.124a17.48 17.48 0 0 1 1.309 23.278m-11.724-9.359a2.49 2.49 0 0 0-.192-3.313 2.48 2.48 0 0 0-1.762-.73c-.4 0-.995.094-1.553.54a218047 218047 0 0 0-106.185 84.857l-.065.052c-19.115 15.29-33.076 26.472-35.116 28.144-8.559 8.79-8.488 22.903.213 31.604a22.36 22.36 0 0 0 15.913 6.59 22.34 22.34 0 0 0 15.691-6.376c4.421-5.388 75.517-94.367 113.056-141.368M412 15H67v265h22.835a7.5 7.5 0 0 1 6.232 3.328c12.333 18.422 27.804 34.049 46.028 46.527 3.318-2.66 7.358-5.896 12.275-9.832C109.468 291.149 82 241.338 82 187.5 82 100.654 152.654 30 239.5 30S397 100.654 397 187.5 326.346 345 239.5 345c-6.162 0-12.375-.385-18.532-1.109l-10.862 13.581a173 173 0 0 0 24.599 2.451A7.5 7.5 0 0 1 242 367.42V455h170zM264.5 425h95a7.5 7.5 0 0 1 0 15h-95a7.5 7.5 0 0 1 0-15m125 0a7.5 7.5 0 1 1 0 15 7.5 7.5 0 0 1 0-15m0-380a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15m-300 0a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15m150 180c-20.678 0-37.5-16.822-37.5-37.5s16.822-37.5 37.5-37.5 37.5 16.822 37.5 37.5-16.822 37.5-37.5 37.5m0-60c-12.407 0-22.5 10.093-22.5 22.5s10.093 22.5 22.5 22.5 22.5-10.093 22.5-22.5-10.093-22.5-22.5-22.5M97 432.5a7.5 7.5 0 1 1-15 0 7.5 7.5 0 0 1 15 0"
-}));
-const ForwardRef = forwardRef(HardDriveRetroIcon);
+    fill: (themed ? "var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor))" : "var(--datalayer-icon-color, currentColor)"),
+    "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", {
+    fillRule: "evenodd",
+    d: "M419.5 470h-360a7.5 7.5 0 01-7.5-7.5V7.5A7.5 7.5 0 0159.5 0h360a7.5 7.5 0 017.5 7.5v455a7.5 7.5 0 01-7.5 7.5zM67.001 455h160v-80.423a188.16 188.16 0 01-27.481-3.877c-19.324 24.134-19.65 24.463-19.864 24.677-7.082 7.083-16.499 10.983-26.517 10.983-10.017-.001-19.434-3.901-26.516-10.983-14.621-14.621-14.621-38.412 0-53.033.106-.106.244-.243 3.299-2.71C112.803 327.306 98.026 312.343 85.88 295H67.001zm226.611-202.025c-25.93 32.466-45.927 57.493-61.373 76.817 2.424.124 4.848.208 7.261.208 78.575 0 142.5-63.925 142.5-142.5S318.075 45 239.5 45 97 108.925 97 187.5c0 50.413 26.619 96.927 69.798 122.578a189333.28 189333.28 0 01102.225-81.688 17.554 17.554 0 0110.912-3.817c4.672 0 9.064 1.82 12.368 5.124a17.478 17.478 0 011.309 23.278zm-11.724-9.359a2.489 2.489 0 00-.192-3.313 2.484 2.484 0 00-1.762-.73c-.4 0-.995.094-1.553.54a218046.791 218046.791 0 00-106.185 84.857l-.065.052c-19.115 15.29-33.076 26.472-35.116 28.144-8.559 8.79-8.488 22.903.213 31.604a22.356 22.356 0 0015.913 6.59 22.343 22.343 0 0015.691-6.376c4.421-5.388 75.517-94.367 113.056-141.368zM412 15H67v265h22.835a7.5 7.5 0 016.232 3.328c12.333 18.422 27.804 34.049 46.028 46.527 3.318-2.66 7.358-5.896 12.275-9.832C109.468 291.149 82 241.338 82 187.5 82 100.654 152.654 30 239.5 30S397 100.654 397 187.5 326.346 345 239.5 345c-6.162 0-12.375-.385-18.532-1.109l-10.862 13.581a173.275 173.275 0 0024.599 2.451A7.5 7.5 0 01242 367.42V455h170zM264.5 425h95a7.5 7.5 0 010 15h-95a7.5 7.5 0 010-15zm125 0a7.5 7.5 0 110 15 7.5 7.5 0 010-15zm0-380a7.5 7.5 0 110-15 7.5 7.5 0 010 15zm-300 0a7.5 7.5 0 110-15 7.5 7.5 0 010 15zm150 180c-20.678 0-37.5-16.822-37.5-37.5s16.822-37.5 37.5-37.5 37.5 16.822 37.5 37.5-16.822 37.5-37.5 37.5zm0-60c-12.407 0-22.5 10.093-22.5 22.5s10.093 22.5 22.5 22.5 22.5-10.093 22.5-22.5-10.093-22.5-22.5-22.5zM97 432.5a7.5 7.5 0 11-15 0 7.5 7.5 0 0115 0z"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(HardDriveRetroIcon);
 module.exports = ForwardRef;