@datalayer/icons-react 1.0.14 → 1.0.15

package/data1/esm/JupyterTraitletIcon.js

@@ -6,30 +6,88 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const JupyterTraitletIcon = ({
+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 JupyterTraitletIcon({
   title,
+  titleId,
   size,
   colored,
   themed,
-  titleId,
+  colormode,
   ...props
-}, ref) => /*#__PURE__*/React.createElement("svg", Object.assign({
-  xmlns: "http://www.w3.org/2000/svg",
-  fill: "none",
-  "aria-hidden": "true",
+}, svgRef) {
+  const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 21 21",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-  viewBox: "0 0 21 21",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  fill: colored ? "#F37726" : (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))))")),
-  d: "M10.536 17.147c-4.067 0-7.64-1.46-9.488-3.614a10.116 10.116 0 0 0 18.976 0c-1.844 2.155-5.404 3.614-9.488 3.614m0-14.014c4.066 0 7.64 1.46 9.488 3.614a10.117 10.117 0 0 0-18.976 0c1.848-2.16 5.403-3.614 9.488-3.614"
-}), /*#__PURE__*/React.createElement("path", {
-  fill: colored ? "#4E4E4E" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 42%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 92%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 42%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 92%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 42%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-  d: "m9.526 14.383-.22-1.384a3 3 0 0 1-.44-.209 3 3 0 0 1-.405-.274l-1.296.593-1.02-1.8 1.185-.868a1.3 1.3 0 0 1-.028-.225 5 5 0 0 1 0-.45 1.3 1.3 0 0 1 .028-.225l-1.186-.868 1.021-1.8 1.296.593q.175-.143.406-.275.23-.132.44-.197l.219-1.395h2.02l.22 1.384q.209.075.444.203.236.126.4.28l1.296-.593 1.021 1.8-1.185.846q.021.11.027.236a5 5 0 0 1 0 .466 2 2 0 0 1-.027.231l1.185.856-1.02 1.8-1.296-.592q-.175.142-.4.28-.227.137-.446.203l-.22 1.383h-2.02zm1.01-2.965q.593 0 1.01-.417t.417-1.01c0-.593-.139-.732-.417-1.01a1.38 1.38 0 0 0-1.01-.417q-.594 0-1.01.417a1.38 1.38 0 0 0-.418 1.01q0 .593.418 1.01.416.417 1.01.417"
-}));
-const ForwardRef = forwardRef(JupyterTraitletIcon);
+    "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 ? "#F37726" : (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))))")),
+    d: "M10.536 17.147c-4.067 0-7.64-1.46-9.488-3.614a10.116 10.116 0 0018.976 0c-1.844 2.155-5.404 3.614-9.488 3.614zm0-14.014c4.066 0 7.64 1.46 9.488 3.614a10.117 10.117 0 00-18.976 0c1.848-2.16 5.403-3.614 9.488-3.614z"
+  }), /*#__PURE__*/React.createElement("path", {
+    fill: colored ? "#4E4E4E" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 42%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 92%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 42%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 92%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 42%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+    d: "M9.526 14.383l-.22-1.384a2.932 2.932 0 01-.44-.209 3.019 3.019 0 01-.405-.274l-1.296.593-1.02-1.8 1.185-.868a1.305 1.305 0 01-.028-.225 5.241 5.241 0 010-.45 1.29 1.29 0 01.028-.225l-1.186-.868 1.021-1.8 1.296.593c.117-.096.252-.187.406-.275.154-.088.3-.154.44-.197l.219-1.395h2.02l.22 1.384c.139.05.287.118.444.203.157.084.291.177.4.28l1.296-.593 1.021 1.8-1.185.846c.014.073.023.152.027.236a5.391 5.391 0 010 .466 1.68 1.68 0 01-.027.231l1.185.856-1.02 1.8-1.296-.592c-.117.095-.25.188-.4.28-.151.091-.3.16-.446.203l-.22 1.383h-2.02zm1.01-2.965c.395 0 .732-.139 1.01-.417.278-.278.417-.615.417-1.01s-.139-.732-.417-1.01a1.376 1.376 0 00-1.01-.417c-.396 0-.732.139-1.01.417a1.376 1.376 0 00-.418 1.01c0 .395.14.732.418 1.01.278.278.614.417 1.01.417z"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(JupyterTraitletIcon);
 export default ForwardRef;

package/data1/esm/KafkaIcon.js

@@ -6,31 +6,89 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const KafkaIcon = ({
+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 KafkaIcon({
   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 100 100",
+    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))))")),
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-  viewBox: "0 0 100 100",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  d: "M31.93 98.597c-9.177-4.376-8.896-18.66.45-22.873 2.668-1.203 3.004-1.77 3.022-5.1.018-3.287-.295-3.852-2.557-4.614-3.525-1.189-8.384-5.28-10.114-8.516-1.842-3.445-1.842-11.518 0-14.962 1.73-3.237 6.589-7.328 10.114-8.516 2.262-.763 2.575-1.327 2.557-4.615-.018-3.329-.354-3.896-3.022-5.099-9.425-4.248-9.613-18.633-.3-22.908 10.741-4.93 22.21 3.972 19.172 14.882-.963 3.462-6.393 8.928-8.867 8.928-.994 0-1.366 1.087-1.366 3.99 0 3.703.218 4.06 3.038 4.96 1.671.533 4.174 1.988 5.563 3.233l2.524 2.264 3.053-1.796c2.773-1.631 3.062-2.214 3.15-6.366.158-7.348 5.44-12.714 12.618-12.819 10.67-.156 16.988 9.421 12.392 18.788-3.123 6.365-11.985 8.603-18.99 4.795-3.243-1.763-3.63-1.257-6.467-.634-3.843.844-4.903-1.083-2.115 6.66 1.07 2.974-.748 6.653-.867 7.837-.133 1.342 1 1.68 3.182 2.162 2.836.627 3.024 1.257 6.267-.505 7.005-3.808 15.867-1.57 18.99 4.795 4.596 9.367-1.721 18.943-12.392 18.787-7.178-.105-12.46-5.47-12.617-12.818-.09-4.153-.378-4.735-3.151-6.367l-3.053-1.796-2.524 2.264c-1.389 1.246-3.892 2.7-5.563 3.234-2.82.9-3.038 1.257-3.038 4.96 0 2.903.372 3.99 1.366 3.99 2.474 0 7.904 5.466 8.867 8.927 1.658 5.955-1.553 12.848-7.011 15.054-4.118 1.664-8.544 1.59-12.31-.206zm10.66-6.792c4.516-4.104 1.683-10.97-4.527-10.97-5.972 0-8.62 7.481-3.914 11.061 3.15 2.398 5.734 2.37 8.442-.091zm33.835-18.958c5.626-5.84-3.457-14.494-9.29-8.851-2.282 2.206-2.446 6.906-.323 9.176 2.17 2.319 7.23 2.148 9.613-.325m-34.18-14.37c3.433-1.697 5.261-4.64 5.261-8.464 0-8.807-10.372-12.492-16.224-5.764-3.516 4.041-3.244 8.274.783 12.169 3.35 3.24 6.504 3.878 10.18 2.06zm33.923-22.605c4.284-3.892 1.384-10.668-4.566-10.668-3.928 0-6.333 2.28-6.333 6.004 0 5.93 6.463 8.695 10.899 4.664M43.118 17.29c3.628-3.081.409-11.03-4.468-11.03-3.05 0-6.958 3.365-6.958 5.989 0 6.454 6.424 9.289 11.425 5.041z"
-}), /*#__PURE__*/React.createElement("path", {
-  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))))")),
-  stroke: 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))))")),
-  strokeWidth: 0.248,
-  d: "M36.568 59.122c-2.539-.836-5.75-3.708-6.87-6.144-.936-2.037-.929-4.173.02-6.113 1.017-2.08 2.868-3.974 4.82-4.935 1.512-.744 1.843-.811 4.008-.811 2.035 0 2.553.09 3.76.656 4.514 2.116 6.404 7.968 4.066 12.584-.766 1.51-2.785 3.37-4.52 4.166-1.481.678-4.13.977-5.284.597zm-.557-40.303c-2.347-.9-3.876-3.029-4.09-5.692-.15-1.878.352-3.021 1.995-4.535 1.295-1.194 2.157-1.676 3.692-2.062 1.71-.43 3.017.022 4.565 1.582 2.697 2.717 3.126 6.931.915 8.987-1.841 1.711-5.06 2.494-7.077 1.72zm-.14 73.971c-4.34-2.17-5.32-6.818-2.114-10.025 2.48-2.48 6.398-2.446 9 .077.894.867 1.3 1.506 1.596 2.51.486 1.654.488 1.848.025 3.406-.727 2.447-3.642 4.791-5.96 4.791-.65 0-1.585-.279-2.547-.76zm33.172-18.447c-2.273-.74-3.544-2.756-3.544-5.625 0-5.612 5.788-8.35 10.13-4.792 2.008 1.645 2.906 4.733 2.004 6.886-1.234 2.944-5.28 4.608-8.59 3.531zm1.378-36.856c-4.508-.673-6.646-6.742-3.595-10.208 2.874-3.265 9.064-2.189 10.757 1.87.473 1.135.498 3.408.05 4.479-1.12 2.674-4.18 4.311-7.212 3.859z"
-}));
-const ForwardRef = forwardRef(KafkaIcon);
+    "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: "M31.93 98.597c-9.177-4.376-8.896-18.66.45-22.873 2.668-1.203 3.004-1.77 3.022-5.1.018-3.287-.295-3.852-2.557-4.614-3.525-1.189-8.384-5.28-10.114-8.516-1.842-3.445-1.842-11.518 0-14.962 1.73-3.237 6.589-7.328 10.114-8.516 2.262-.763 2.575-1.327 2.557-4.615-.018-3.329-.354-3.896-3.022-5.099-9.425-4.248-9.613-18.633-.3-22.908 10.741-4.93 22.21 3.972 19.172 14.882-.963 3.462-6.393 8.928-8.867 8.928-.994 0-1.366 1.087-1.366 3.99 0 3.703.218 4.06 3.038 4.96 1.671.533 4.174 1.988 5.563 3.233l2.524 2.264 3.053-1.796c2.773-1.631 3.062-2.214 3.15-6.366.158-7.348 5.44-12.714 12.618-12.819 10.67-.156 16.988 9.421 12.392 18.788-3.123 6.365-11.985 8.603-18.99 4.795-3.243-1.763-3.63-1.257-6.467-.634-3.843.844-4.903-1.083-2.115 6.66 1.07 2.974-.748 6.653-.867 7.837-.133 1.342 1 1.68 3.182 2.162 2.836.627 3.024 1.257 6.267-.505 7.005-3.808 15.867-1.57 18.99 4.795 4.596 9.367-1.721 18.943-12.392 18.787-7.178-.105-12.46-5.47-12.617-12.818-.09-4.153-.378-4.735-3.151-6.367l-3.053-1.796-2.524 2.264c-1.389 1.246-3.892 2.7-5.563 3.234-2.82.9-3.038 1.257-3.038 4.96 0 2.903.372 3.99 1.366 3.99 2.474 0 7.904 5.466 8.867 8.927 1.658 5.955-1.553 12.848-7.011 15.054-4.118 1.664-8.544 1.59-12.31-.206zm10.66-6.792c4.516-4.104 1.683-10.97-4.527-10.97-5.972 0-8.62 7.481-3.914 11.061 3.15 2.398 5.734 2.37 8.442-.091zm33.835-18.958c5.626-5.84-3.457-14.494-9.29-8.851-2.282 2.206-2.446 6.906-.323 9.176 2.17 2.319 7.23 2.148 9.613-.325zm-34.18-14.37c3.433-1.697 5.261-4.64 5.261-8.464 0-8.807-10.372-12.492-16.224-5.764-3.516 4.041-3.244 8.274.783 12.169 3.35 3.24 6.504 3.878 10.18 2.06zm33.923-22.605c4.284-3.892 1.384-10.668-4.566-10.668-3.928 0-6.333 2.28-6.333 6.004 0 5.93 6.463 8.695 10.899 4.664zM43.118 17.29c3.628-3.081.409-11.03-4.468-11.03-3.05 0-6.958 3.365-6.958 5.989 0 6.454 6.424 9.289 11.425 5.041z"
+  }), /*#__PURE__*/React.createElement("path", {
+    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))))")),
+    stroke: 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))))")),
+    strokeWidth: 0.248,
+    d: "M36.568 59.122c-2.539-.836-5.75-3.708-6.87-6.144-.936-2.037-.929-4.173.02-6.113 1.017-2.08 2.868-3.974 4.82-4.935 1.512-.744 1.843-.811 4.008-.811 2.035 0 2.553.09 3.76.656 4.514 2.116 6.404 7.968 4.066 12.584-.766 1.51-2.785 3.37-4.52 4.166-1.481.678-4.13.977-5.284.597zm-.557-40.303c-2.347-.9-3.876-3.029-4.09-5.692-.15-1.878.352-3.021 1.995-4.535 1.295-1.194 2.157-1.676 3.692-2.062 1.71-.43 3.017.022 4.565 1.582 2.697 2.717 3.126 6.931.915 8.987-1.841 1.711-5.06 2.494-7.077 1.72zm-.14 73.971c-4.34-2.17-5.32-6.818-2.114-10.025 2.48-2.48 6.398-2.446 9 .077.894.867 1.3 1.506 1.596 2.51.486 1.654.488 1.848.025 3.406-.727 2.447-3.642 4.791-5.96 4.791-.65 0-1.585-.279-2.547-.76zm33.172-18.447c-2.273-.74-3.544-2.756-3.544-5.625 0-5.612 5.788-8.35 10.13-4.792 2.008 1.645 2.906 4.733 2.004 6.886-1.234 2.944-5.28 4.608-8.59 3.531zm1.378-36.856c-4.508-.673-6.646-6.742-3.595-10.208 2.874-3.265 9.064-2.189 10.757 1.87.473 1.135.498 3.408.05 4.479-1.12 2.674-4.18 4.311-7.212 3.859z"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(KafkaIcon);
 export default ForwardRef;

package/data1/esm/KaggleIcon.js

@@ -6,28 +6,86 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const KaggleIcon = ({
+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 KaggleIcon({
   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",
+    "aria-label": "Kaggle",
+    viewBox: "0 0 512 512",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-  "aria-label": "Kaggle",
-  viewBox: "0 0 512 512",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  fill: colored ? "#20BEFF" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 70%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
-  d: "M363 401.5c-.33 1.65-1.65 2.2-4.4 2.2h-44c-2.75 0-4.95-1.1-7.15-3.3l-72.347-92.246L215 327.277v71.5q0 4.95-4.95 4.95h-33.836q-4.95 0-4.95-4.95V77q0-4.95 4.95-4.95h33.55q4.95 0 4.95 4.95v198l86.306-87.285c2.288-2.283 4.576-3.432 6.864-3.432h45.122c1.958 0 3.262.82 3.922 2.447.654 2.2.55 3.3-.55 4.4L264 280.5c99 115.5 99 121 99 121"
-}));
-const ForwardRef = forwardRef(KaggleIcon);
+    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",
+    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 ? "#20BEFF" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 70%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
+    d: "M363 401.5c-.33 1.65-1.65 2.2-4.4 2.2h-44c-2.75 0-4.95-1.1-7.15-3.3l-72.347-92.246L215 327.277v71.5c0 3.3-1.65 4.95-4.95 4.95h-33.836c-3.3 0-4.95-1.65-4.95-4.95V77c0-3.3 1.65-4.95 4.95-4.95h33.55c3.3 0 4.95 1.65 4.95 4.95v198l86.306-87.285c2.288-2.283 4.576-3.432 6.864-3.432h45.122c1.958 0 3.262.82 3.922 2.447.654 2.2.55 3.3-.55 4.4L264 280.5c99 115.5 99 121 99 121"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(KaggleIcon);
 export default ForwardRef;

package/data1/esm/KerberosIcon.js

@@ -6,26 +6,84 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const KerberosIcon = ({
+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 KerberosIcon({
   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 455 455",
+    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 455 455",
-  ref: ref,
-  "aria-labelledby": titleId
-}, props), title ? /*#__PURE__*/React.createElement("title", {
-  id: titleId
-}, title) : null, /*#__PURE__*/React.createElement("path", {
-  d: "M186.27 66c.657.13-40.214.84-37.479 41.384-19.646-3.536-50.598 1.1-72.566 18.451-22.292 17.607-59.911 23.325-76.223 31.98 0 0 8.902 12.128 17.268 15.399 2.173.85 4.467 1.332 6.82 1.54l7.259 9.211.797-8.936 4.95 6.242.687-7.865c.268-.064.529-.097.798-.165l4.262 5.335.577-6.71c11.697-3.634 23.598-9.414 33.272-10.778 17.313-2.442 28.795 2.52 24.445 32.282-33.214-15.73-57.895-12.118-79.275-3.08 0 0-5.505 9.43 3.602 13.419 38.001-13.974 38.191 7.171 66.681 8.607q.361-.274.715-.55c21.45-16.942 50.037-22.217 70.916-19.963.494-18.471 10.33-29.446 20.266-34.784 8.186-4.32 15.02-6.505 22.438-5.967 1.649.311 2.59 2.444 3.547 3.904 0 0-.234.436-.302.578l.302.027c-.419 9.684-2.853 19.104-3.024 27.332-.038 1.8.017 3.514.192 5.17 12.057-12.72 24.907-23.9 37.562-31.402-16.632-17.772-34.72-32.671-50.898-38.69-17.446-14.158-8.37-33.936-7.59-51.97zm81.008 36.242c.781 18.034 9.857 37.811-7.59 51.97-16.326 6.073-34.608 21.193-51.364 39.184 1.245 3.643 3.518 7.008 7.424 10.257 21.795 8.495 45.14 30.492 64.812 54.418 15.988-12.306 37.853-18.644 65.169-10.477 45.05 7.018 38.389-23.802 82.327-7.644 9.107-3.988 3.63-13.42 3.63-13.42-21.381-9.037-46.061-12.648-79.275 3.08-4.35-29.76 7.132-34.696 24.445-32.255 9.674 1.365 21.574 7.117 33.272 10.752l.577 6.71 4.262-5.335c.269.068.53.101.798.165l.687 7.865 4.95-6.215.797 8.937 7.26-9.212c2.352-.208 4.646-.718 6.819-1.567 8.366-3.271 17.268-15.4 17.268-15.4-16.312-8.653-53.958-14.344-76.25-31.951-21.968-17.351-52.893-22.014-72.538-18.478 2.735-40.544-38.136-41.254-37.48-41.384m-140.29 19.083.852 3.932s-8.52 3.69-14.684 5.5a5.95 5.95 0 0 1 1.045 3.464 6.02 6.02 0 0 1-6.104 5.94 6.02 6.02 0 0 1-5.94-6.105c.01-.57.12-1.13.275-1.65-5.213.366-10.284.413-10.284.413l-.852-3.932s12.391-.138 18.368-1.402c5.977-1.265 17.323-6.16 17.323-6.16zm78.67 34.042c.657.13-40.241.84-37.507 41.384-19.646-3.536-50.57 1.128-72.538 18.478-22.292 17.607-59.938 23.298-76.25 31.952 0 0 8.902 12.128 17.268 15.399 2.173.85 4.467 1.36 6.82 1.567l7.259 9.212.825-8.937 4.95 6.215.687-7.865c.268-.064.528-.097.797-.165l4.235 5.335.577-6.71c11.697-3.634 23.598-9.387 33.272-10.751 17.313-2.442 28.795 2.52 24.445 32.282-33.214-15.73-57.895-12.145-79.275-3.108 0 0-5.477 9.431 3.63 13.42 43.938-16.159 37.278 14.661 82.327 7.644 66.196-19.792 100.45 45.624 96.35 74.71l95.747-36.461c7.521-16.878-57.83-113.69-106.06-131.63-17.446-14.16-8.343-33.937-7.562-51.97zm120.91 2.2s11.346 4.922 17.323 6.187 18.341 1.402 18.341 1.402l-.825 3.905s-5.07-.047-10.284-.413c.155.52.239 1.08.248 1.65a6.02 6.02 0 0 1-5.94 6.104c-3.328.05-6.028-2.61-6.077-5.94a5.95 5.95 0 0 1 1.045-3.464c-6.163-1.81-14.684-5.5-14.684-5.5l.852-3.931zm-180.22 53.125.852 3.932s-8.493 3.69-14.656 5.5a6.02 6.02 0 0 1-5.06 9.404 6.02 6.02 0 0 1-5.938-6.105 6.1 6.1 0 0 1 .247-1.65c-5.214.366-10.257.413-10.257.413l-.852-3.905s12.39-.137 18.368-1.402 17.296-6.187 17.296-6.187"
-}));
-const ForwardRef = forwardRef(KerberosIcon);
+    "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: "M186.27 66c.657.13-40.214.84-37.479 41.384-19.646-3.536-50.598 1.1-72.566 18.451-22.292 17.607-59.911 23.325-76.223 31.98 0 0 8.902 12.128 17.268 15.399 2.173.85 4.467 1.332 6.82 1.54l7.259 9.211.797-8.936 4.95 6.242.687-7.865c.268-.064.529-.097.798-.165l4.262 5.335.577-6.71c11.697-3.634 23.598-9.414 33.272-10.778 17.313-2.442 28.795 2.52 24.445 32.282-33.214-15.73-57.895-12.118-79.275-3.08 0 0-5.505 9.43 3.602 13.419 38.001-13.974 38.191 7.171 66.681 8.607.24-.184.48-.365.715-.55 21.45-16.942 50.037-22.217 70.916-19.963.494-18.471 10.33-29.446 20.266-34.784 8.186-4.32 15.02-6.505 22.438-5.967 1.649.311 2.59 2.444 3.547 3.904 0 0-.234.436-.302.578l.302.027c-.419 9.684-2.853 19.104-3.024 27.332-.038 1.8.017 3.514.192 5.17 12.057-12.72 24.907-23.9 37.562-31.402-16.632-17.772-34.72-32.671-50.898-38.69-17.446-14.158-8.37-33.936-7.59-51.97zm81.008 36.242c.781 18.034 9.857 37.811-7.59 51.97-16.326 6.073-34.608 21.193-51.364 39.184 1.245 3.643 3.518 7.008 7.424 10.257 21.795 8.495 45.14 30.492 64.812 54.418 15.988-12.306 37.853-18.644 65.169-10.477 45.05 7.018 38.389-23.802 82.327-7.644 9.107-3.988 3.63-13.42 3.63-13.42-21.381-9.037-46.061-12.648-79.275 3.08-4.35-29.76 7.132-34.696 24.445-32.255 9.674 1.365 21.574 7.117 33.272 10.752l.577 6.71 4.262-5.335c.269.068.53.101.798.165l.687 7.865 4.95-6.215.797 8.937 7.26-9.212c2.352-.208 4.646-.718 6.819-1.567 8.366-3.271 17.268-15.4 17.268-15.4-16.312-8.653-53.958-14.344-76.25-31.951-21.968-17.351-52.893-22.014-72.538-18.478 2.735-40.544-38.136-41.254-37.48-41.384zm-140.29 19.083l.852 3.932s-8.52 3.69-14.684 5.5a5.948 5.948 0 011.045 3.464 6.02 6.02 0 01-6.104 5.94 6.02 6.02 0 01-5.94-6.105c.01-.57.12-1.13.275-1.65-5.213.366-10.284.413-10.284.413l-.852-3.932s12.391-.138 18.368-1.402c5.977-1.265 17.323-6.16 17.323-6.16zm78.67 34.042c.657.13-40.241.84-37.507 41.384-19.646-3.536-50.57 1.128-72.538 18.478-22.292 17.607-59.938 23.298-76.25 31.952 0 0 8.902 12.128 17.268 15.399 2.173.85 4.467 1.36 6.82 1.567l7.259 9.212.825-8.937 4.95 6.215.687-7.865c.268-.064.528-.097.797-.165l4.235 5.335.577-6.71c11.697-3.634 23.598-9.387 33.272-10.751 17.313-2.442 28.795 2.52 24.445 32.282-33.214-15.73-57.895-12.145-79.275-3.108 0 0-5.477 9.431 3.63 13.42 43.938-16.159 37.278 14.661 82.327 7.644 66.196-19.792 100.45 45.624 96.35 74.71l95.747-36.461c7.521-16.878-57.83-113.69-106.06-131.63-17.446-14.16-8.343-33.937-7.562-51.97zm120.91 2.2s11.346 4.922 17.323 6.187c5.977 1.265 18.341 1.402 18.341 1.402l-.825 3.905s-5.07-.047-10.284-.413c.155.52.239 1.08.248 1.65a6.02 6.02 0 01-5.94 6.104c-3.328.05-6.028-2.61-6.077-5.94a5.948 5.948 0 011.045-3.464c-6.163-1.81-14.684-5.5-14.684-5.5l.852-3.931zm-180.22 53.125l.852 3.932s-8.493 3.69-14.656 5.5a6.02 6.02 0 01-5.06 9.404 6.02 6.02 0 01-5.938-6.105 6.14 6.14 0 01.247-1.65c-5.214.366-10.257.413-10.257.413l-.852-3.905s12.39-.137 18.368-1.402c5.977-1.265 17.296-6.187 17.296-6.187z"
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(KerberosIcon);
 export default ForwardRef;

package/data1/esm/KeyOutlineIcon.js

@@ -6,35 +6,93 @@ const sizeMap = {
   "large": 64
 };
 
-import { forwardRef } from "react";
-const KeyOutlineIcon = ({
+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 KeyOutlineIcon({
   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-key-round",
-  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 18v3c0 .6.4 1 1 1h4v-3h3v-3h2l1.4-1.4a6.5 6.5 0 1 0-4-4z"
-}), /*#__PURE__*/React.createElement("circle", {
-  cx: 16.5,
-  cy: 7.5,
-  r: 0.5
-}));
-const ForwardRef = forwardRef(KeyOutlineIcon);
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: 2,
+    className: "prefix__lucide prefix__lucide-key-round",
+    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: "M2 18v3c0 .6.4 1 1 1h4v-3h3v-3h2l1.4-1.4a6.5 6.5 0 10-4-4z"
+  }), /*#__PURE__*/React.createElement("circle", {
+    cx: 16.5,
+    cy: 7.5,
+    r: 0.5
+  }));
+  if (!colormode) return _svgEl;
+  return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {
+    mode: typeof colormode === "string" ? colormode : undefined
+  }, _svgEl);
+}
+const ForwardRef = React.forwardRef(KeyOutlineIcon);
 export default ForwardRef;