@datalayer/icons-react 1.0.9 → 1.0.10

package/data1/ApacheIcon.js

@@ -11,31 +11,44 @@ function _DlIconInverseColormode({
   children
 }) {
   const ref = React.useRef(null);
-  const [resolved, setResolved] = React.useState(typeof mode === "string" ? mode : null);
+  const [appearance, setAppearance] = React.useState({
+    mode: typeof mode === "string" ? mode : null,
+    lightTheme: null,
+    darkTheme: null
+  });
   React.useLayoutEffect(() => {
-    if (typeof mode === "string") {
-      setResolved(mode);
-      return;
-    }
     if (typeof document === "undefined") return;
-    let cur = null;
+    let currentMode = null;
+    let lightTheme = null;
+    let darkTheme = null;
     let el = ref.current && ref.current.parentElement;
-    while (el) {
-      const m = el.getAttribute && el.getAttribute("data-color-mode");
-      if (m) { cur = m; break; }
+    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 (!cur || cur === "auto") {
-      cur = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+    if (!currentMode || currentMode === "auto") {
+      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
-    setResolved(cur === "dark" ? "light" : "dark");
+    setAppearance({
+      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
+      lightTheme,
+      darkTheme
+    });
   }, [mode]);
   return /*#__PURE__*/React.createElement("span", {
     ref: ref,
-    "data-color-mode": resolved || "light",
-    "data-light-theme": "light",
-    "data-dark-theme": "dark",
-    style: { display: "inline-flex", lineHeight: 0 }
+    "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);
 }
 
@@ -51,26 +64,28 @@ function ApacheIcon({
   const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 939 939",
-    fill: themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor',
+    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",
     "aria-hidden": "true",
     ref: svgRef,
     "aria-labelledby": titleId
   }, props, {
+    "data-datalayer-icon": "",
     style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-fg": props.color
+      "--datalayer-icon-color": props.color,
+      color: props.color
     }) : props && props.style
-  }), title ? /*#__PURE__*/React.createElement("title", {
+  }), /*#__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: "M251.895 294.282v21.009h-2.755v-21.009h-7.692v-2.64h18.138v2.64zm37.769 21.008v-10.446h-14.235v10.447h-2.755v-23.65h2.755v10.677h14.235v-10.676h2.755v23.649zm21.582-21.008v7.807h11.94v2.64h-11.94v8.15h13.776v2.526h-16.53v-23.648h16.071v2.64h-13.317z",
-    fill: "#6d6e71"
+    fill: colored ? "#6d6e71" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }), /*#__PURE__*/React.createElement("path", {
     d: "M220.784 477.618l56.596-135.235h10.906l56.597 135.235h-14.235l-17.565-42.247H252.24l-17.335 42.247zm62.107-119.622l-27.782 66.814h54.875zm76.457 119.622V342.383h56.022c23.19 0 39.95 21.468 39.95 42.476 0 22.042-15.613 42.82-38.802 42.82H372.55v49.939zm13.202-61.763h43.28c15.956 0 26.288-14.694 26.288-30.996 0-16.99-12.513-30.651-27.437-30.651H372.55zm75.423 61.763l56.596-135.235h10.906l56.597 135.235h-14.465l-17.564-42.247h-60.73l-17.334 42.247zm62.107-119.622l-27.782 66.814h54.875zM635.9 341.58c23.994 0 41.558 12.168 49.938 29.503l-10.676 6.43c-8.61-17.91-25.37-23.994-39.95-23.994-32.374 0-50.053 28.93-50.053 56.137 0 29.848 21.927 56.94 50.627 56.94 15.268 0 33.177-7.576 41.672-25.14l11.02 5.74c-8.724 20.204-32.717 31.455-53.496 31.455-37.08 0-63.255-35.473-63.255-69.684 0-32.488 23.42-67.387 64.173-67.387zm177.825.803v135.235H800.41v-63.255h-80.13v63.255h-13.09V342.383h13.087v60.155h80.13v-60.155zm121.344 123.41v11.825h-90.807V342.383h89.085v11.825h-75.998v48.79h66.24v11.25h-66.24v51.545z",
-    fill: "#d22128"
+    fill: colored ? "#d22128" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 53%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 81%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 53%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 81%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 53%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }), /*#__PURE__*/React.createElement("path", {
     d: "M233.412 506.203c1.607.459 2.985 1.148 4.248 1.951l-1.378 3.1a17.273 17.273 0 00-3.903-1.837c-1.378-.344-2.755-.574-3.903-.574-1.837 0-3.33.345-4.363 1.033-1.148.69-1.607 1.608-1.607 2.756 0 1.033.344 1.836.918 2.525.574.689 1.378 1.148 2.296 1.607a48.01 48.01 0 003.789 1.263c1.951.574 3.559 1.263 4.707 1.722 1.148.574 2.18 1.378 3.1 2.41.803 1.034 1.262 2.412 1.262 4.249 0 1.607-.46 2.984-1.263 4.132-.803 1.148-2.066 2.067-3.673 2.756-1.608.688-3.33 1.033-5.396 1.033s-4.018-.345-5.97-1.148c-1.951-.804-3.558-1.837-4.936-3.215l1.492-2.87c1.263 1.263 2.756 2.296 4.478 2.985 1.722.689 3.329 1.033 4.936 1.033 2.066 0 3.674-.344 4.936-1.148 1.148-.803 1.837-1.836 1.837-3.214 0-1.033-.344-1.952-.918-2.64a5.546 5.546 0 00-2.296-1.608 48.01 48.01 0 00-3.789-1.262c-1.951-.574-3.444-1.148-4.706-1.608-1.148-.574-2.182-1.262-3.1-2.41-.804-1.034-1.263-2.411-1.263-4.133 0-1.493.46-2.755 1.263-3.903.804-1.148 1.952-1.952 3.444-2.64 1.492-.575 3.214-.92 5.166-.92 1.378-.114 2.985.116 4.592.575zm42.361 1.263c2.296 1.262 4.133 2.984 5.396 5.166 1.377 2.18 1.951 4.592 1.951 7.232 0 2.64-.688 5.051-1.951 7.232-1.378 2.182-3.1 3.904-5.396 5.281-2.296 1.263-4.821 1.952-7.462 1.952-2.755 0-5.28-.69-7.577-1.952-2.296-1.263-4.132-2.985-5.395-5.28-1.378-2.182-1.952-4.593-1.952-7.233 0-2.64.689-5.051 1.952-7.232 1.377-2.182 3.1-3.904 5.395-5.166a15.506 15.506 0 017.577-1.952c2.64 0 5.166.689 7.462 1.952zm-13.317 2.64c-1.722 1.033-3.214 2.41-4.247 4.133-1.033 1.722-1.607 3.559-1.607 5.625s.574 4.018 1.607 5.74c1.033 1.722 2.525 3.1 4.247 4.133s3.674 1.492 5.855 1.492c2.067 0 4.018-.46 5.74-1.492 1.722-1.033 3.215-2.411 4.248-4.133a11.091 11.091 0 001.607-5.74c0-2.066-.574-3.903-1.607-5.625s-2.411-3.1-4.248-4.018c-1.722-1.033-3.673-1.493-5.74-1.493-2.066-.114-4.018.345-5.855 1.378zm41.328-1.378v9.988h13.317v3.1h-13.317v12.168h-3.329V505.4h18.139v3.1h-14.81zm41.328 0V534.1h-3.214v-25.37h-9.299v-3.1h21.812v3.1zm51.545 25.372l-7.691-23.994-7.807 23.993h-3.329l-9.528-28.585h3.559l7.806 24.797 7.692-24.682h3.214l7.806 24.797 7.692-24.797h3.33l-9.53 28.585h-3.214zm29.16-7.118l-3.215 7.232h-3.444l12.743-28.585h3.33l12.742 28.585h-3.559l-3.214-7.232zm7.806-17.68l-6.314 14.465h12.743zm42.82 15.728c-.803 0-1.492.115-1.951.115h-7.577v9.069h-3.214v-28.585h10.79c3.56 0 6.315.803 8.266 2.525 1.952 1.722 2.985 4.018 2.985 7.118 0 2.296-.574 4.248-1.607 5.855-1.148 1.607-2.64 2.755-4.707 3.444l6.659 9.643h-3.674zm4.133-4.707c1.378-1.148 2.067-2.87 2.067-5.051s-.69-3.788-2.067-4.822c-1.377-1.148-3.444-1.607-5.97-1.607h-7.576v13.202h7.577c2.525 0 4.592-.574 5.97-1.722zm26.749-11.595v9.414h14.35v3.1h-14.35V531h16.646v3.1h-19.86v-28.586h19.4v3.1h-16.186zm62.106 0v9.988h13.317v3.1h-13.317v12.168h-3.214V505.4h18.138v3.1h-14.924zm50.971-1.262c2.296 1.262 4.133 2.984 5.396 5.166 1.378 2.18 1.952 4.592 1.952 7.232 0 2.64-.69 5.051-1.952 7.232-1.378 2.182-3.1 3.904-5.396 5.281-2.296 1.263-4.821 1.952-7.462 1.952-2.755 0-5.28-.69-7.576-1.952-2.296-1.263-4.133-2.985-5.396-5.28-1.378-2.182-1.952-4.593-1.952-7.233 0-2.64.69-5.051 1.952-7.232 1.378-2.182 3.1-3.904 5.396-5.166a15.506 15.506 0 017.576-1.952c2.756 0 5.281.689 7.462 1.952zm-13.202 2.64c-1.722 1.033-3.214 2.41-4.247 4.133-1.033 1.722-1.607 3.559-1.607 5.625s.574 4.018 1.607 5.74c1.033 1.722 2.525 3.1 4.247 4.133s3.674 1.492 5.855 1.492c2.067 0 4.018-.46 5.74-1.492 1.722-1.033 3.215-2.411 4.248-4.133a11.091 11.091 0 001.607-5.74c0-2.066-.574-3.903-1.607-5.625s-2.41-3.1-4.248-4.018c-1.722-1.033-3.673-1.493-5.74-1.493-2.18-.114-4.133.345-5.855 1.378zm58.204 21.008c-2.066 2.067-5.051 3.1-8.725 3.1-3.788 0-6.658-1.033-8.84-3.1-2.18-2.066-3.214-5.05-3.214-8.724v-16.761h3.215v16.76c0 2.756.803 4.937 2.296 6.43 1.607 1.492 3.673 2.295 6.428 2.295 2.756 0 4.822-.803 6.43-2.296 1.492-1.492 2.295-3.673 2.295-6.428v-16.761h3.215v16.76c0 3.789-1.034 6.659-3.1 8.725zm42.591 2.986l-17.105-22.96v22.96h-3.215v-28.586h3.33l17.105 22.96v-22.96h3.214v28.585zm41.902-26.634c2.18 1.262 4.018 2.984 5.28 5.166a14.22 14.22 0 011.952 7.232c0 2.64-.689 5.051-1.951 7.232-1.263 2.182-3.1 3.904-5.281 5.166-2.296 1.263-4.822 1.837-7.577 1.837h-11.48v-28.585h11.595c2.755.115 5.28.689 7.462 1.952zM734.169 531h8.266c2.066 0 4.018-.46 5.74-1.493 1.722-.918 3.1-2.296 4.133-4.018s1.492-3.559 1.492-5.74c0-2.066-.46-4.018-1.492-5.625-1.034-1.722-2.411-2.985-4.133-4.018s-3.674-1.492-5.74-1.492h-8.151V531zm41.443-4.018l-3.214 7.232h-3.444l12.742-28.585h3.33l12.742 28.585h-3.558l-3.215-7.232zm7.806-17.68l-6.314 14.465h12.743zm35.932-.574V534.1h-3.214v-25.37h-9.299v-3.1h21.927v3.1zm25.027 25.372v-28.586h3.214v28.585zm43.165-26.634c2.296 1.262 4.133 2.984 5.395 5.166 1.378 2.18 1.952 4.592 1.952 7.232 0 2.64-.689 5.051-1.952 7.232-1.377 2.182-3.1 3.904-5.395 5.281-2.296 1.263-4.822 1.952-7.462 1.952-2.755 0-5.281-.69-7.577-1.952-2.296-1.263-4.133-2.985-5.396-5.28-1.377-2.182-1.951-4.593-1.951-7.233 0-2.64.689-5.051 1.951-7.232 1.378-2.182 3.1-3.904 5.396-5.166a15.506 15.506 0 017.577-1.952c2.64 0 5.166.689 7.462 1.952zm-13.317 2.64c-1.722 1.033-3.214 2.41-4.248 4.133-1.033 1.722-1.607 3.559-1.607 5.625s.574 4.018 1.607 5.74c1.034 1.722 2.526 3.1 4.248 4.133 1.722 1.033 3.674 1.492 5.855 1.492 2.066 0 4.018-.46 5.74-1.492 1.722-1.033 3.214-2.411 4.247-4.133a11.091 11.091 0 001.608-5.74c0-2.066-.574-3.903-1.608-5.625-1.033-1.722-2.41-3.1-4.247-4.018-1.722-1.033-3.674-1.493-5.74-1.493-2.181-.114-4.133.345-5.855 1.378zm58.318 23.994l-17.105-22.96v22.96h-3.214v-28.586h3.329l17.105 22.96v-22.96h3.215v28.585z",
-    fill: "#6d6e71"
+    fill: colored ? "#6d6e71" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }), /*#__PURE__*/React.createElement("g", {
     transform: "translate(-46.24 159.277) scale(1.148)"
   }, /*#__PURE__*/React.createElement("linearGradient", {
@@ -91,23 +106,23 @@ function ApacheIcon({
     offset: 0.838,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__a)",
+    fill: colored ? "url(#prefix__a)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 66%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 68%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 66%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 68%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 66%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M192 60.2c-5.4 3.2-14.2 12.1-24.9 25.1l9.8 18.4c6.8-9.8 13.8-18.6 20.8-26.1.5-.6.8-.9.8-.9-.3.3-.5.6-.8.9-2.3 2.5-9.2 10.5-19.5 26.5 10-.5 25.4-2.5 37.9-4.7 3.7-20.9-3.7-30.5-3.7-30.5S203 53.7 192 60.2z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? 'none' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: "none",
     d: "M175.5 165.2h.2l-1.4.2c-.1 0-.2.1-.2.1.4-.2.9-.2 1.4-.3zm-10 33c-.8.2-1.6.3-2.4.4.8-.1 1.6-.3 2.4-.4zm-67.6 73.9c.1-.3.2-.6.3-.8 2.1-5.7 4.3-11.2 6.4-16.5 2.4-6 4.7-11.9 7-17.5 2.4-6 4.8-11.7 7.2-17.3 2.5-5.8 4.9-11.5 7.3-16.9 2-4.4 3.9-8.7 5.8-12.8.6-1.4 1.3-2.7 1.9-4.1 1.2-2.7 2.5-5.3 3.7-7.9 1.1-2.4 2.2-4.7 3.3-6.9.4-.8.7-1.5 1.1-2.3.1-.1.1-.2.2-.4l-1.2.1-.9-1.9c-.1.2-.2.4-.3.5-1.7 3.4-3.4 6.8-5.1 10.3-1 2-1.9 4-2.9 6-2.7 5.6-5.3 11.2-7.9 16.9-2.6 5.7-5.2 11.5-7.7 17.3-2.5 5.7-4.9 11.4-7.2 17-2.4 5.7-4.7 11.3-6.9 16.9-2.3 5.8-4.6 11.6-6.8 17.4l-1.5 3.9c-1.8 4.6-3.5 9.2-5.2 13.7l1.5 3 1.3-.1c0-.1.1-.3.1-.4 2.2-5.8 4.3-11.6 6.5-17.2zm64.6-73.4z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M159.2 214.8c-1.2.2-2.5.4-3.8.7.7-.1 1.3-.2 2-.3.6-.2 1.2-.3 1.8-.4z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M159.2 214.8c-1.2.2-2.5.4-3.8.7.7-.1 1.3-.2 2-.3.6-.2 1.2-.3 1.8-.4z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4 0 .6-.1.8-.1 1.6-.3 2.4-.4-1 .1-2 .3-3 .5z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4 0 .6-.1.8-.1 1.6-.3 2.4-.4-1 .1-2 .3-3 .5z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("linearGradient", {
@@ -131,7 +146,7 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__b)",
+    fill: colored ? "url(#prefix__b)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M148.1 151.2c3-5.5 6-11 9-16.2 3.2-5.5 6.3-10.8 9.6-15.9l.6-.9c3.2-5 6.4-9.9 9.6-14.5l-9.8-18.4c-.7.9-1.5 1.8-2.2 2.7-2.8 3.5-5.7 7.3-8.7 11.3-3.4 4.5-6.8 9.3-10.4 14.4-3.3 4.7-6.6 9.5-9.9 14.6-2.8 4.3-5.6 8.7-8.4 13.3-.1.2-.2.3-.3.5l12.7 25.1c2.7-5.5 5.4-10.8 8.2-16z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__c",
@@ -154,7 +169,7 @@ function ApacheIcon({
     offset: 0.949,
     stopColor: "#cd2032"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__c)",
+    fill: colored ? "url(#prefix__c)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M90.3 292.4c-1.7 4.6-3.4 9.3-5.1 14.1 0 .1 0 .1-.1.2-.2.7-.5 1.4-.7 2-1.1 3.2-2.1 6.1-4.4 12.8 3.7 1.7 6.7 6.2 9.6 11.3-.3-5.3-2.5-10.2-6.6-14.1 18.4.8 34.3-3.8 42.5-17.3.7-1.2 1.4-2.5 2-3.8-3.7 4.7-8.4 6.7-17.1 6.3h-.1.1c12.8-5.7 19.2-11.2 24.9-20.4 1.3-2.2 2.7-4.5 4-7.1-11.2 11.5-24.2 14.8-37.9 12.3l-10.3 1.1c-.1.9-.5 1.8-.8 2.6z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__d",
@@ -177,7 +192,7 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__d)",
+    fill: colored ? "url(#prefix__d)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M95.1 269.5c2.2-5.7 4.5-11.5 6.8-17.4 2.2-5.6 4.5-11.2 6.9-16.9 2.4-5.7 4.8-11.3 7.2-17 2.5-5.8 5.1-11.6 7.7-17.3 2.6-5.7 5.2-11.3 7.9-16.9 1-2 1.9-4 2.9-6 1.7-3.5 3.4-6.9 5.1-10.3.1-.2.2-.4.3-.5L127.2 142c-.2.3-.4.7-.6 1-3 4.8-5.9 9.8-8.8 14.8-2.9 5.1-5.8 10.3-8.6 15.5-2.4 4.4-4.7 8.9-6.9 13.4-.5.9-.9 1.8-1.3 2.7-2.8 5.7-5.3 11.2-7.5 16.5-2.6 6-4.8 11.7-6.8 17.1-1.3 3.6-2.5 7-3.6 10.3-.9 2.8-1.7 5.7-2.5 8.5-1.9 6.6-3.5 13.3-4.9 19.9L88.4 287c1.7-4.5 3.4-9.1 5.2-13.7.5-1.2 1-2.5 1.5-3.8z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__e",
@@ -200,7 +215,7 @@ function ApacheIcon({
     offset: 0.949,
     stopColor: "#cd2032"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__e)",
+    fill: colored ? "url(#prefix__e)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M75.5 262.7c-1.6 8.1-2.7 16.1-3.3 24.1 0 .3 0 .6-.1.8-4-6.4-14.6-12.6-14.6-12.5 7.6 11.1 13.4 22 14.3 32.8-4.1.8-9.7-.4-16.1-2.7 6.7 6.2 11.8 7.9 13.8 8.4-6.2.4-12.6 4.6-19.1 9.5 9.5-3.9 17.2-5.4 22.7-4.2-8.7 24.7-17.5 51.9-26.2 80.9 2.7-.8 4.3-2.6 5.2-5 1.6-5.2 11.9-39.6 28.1-84.8.5-1.3.9-2.6 1.4-3.9.1-.4.3-.7.4-1.1 1.7-4.7 3.5-9.6 5.3-14.5.4-1.1.8-2.2 1.3-3.4v-.1l-12.7-25.2c-.3.4-.3.7-.4.9z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__f",
@@ -223,7 +238,7 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__f)",
+    fill: colored ? "url(#prefix__f)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M141.9 169.2c-.4.7-.7 1.5-1.1 2.3l-3.3 6.9c-1.2 2.6-2.4 5.2-3.7 7.9-.6 1.3-1.3 2.7-1.9 4.1-1.9 4.1-3.8 8.4-5.8 12.8-2.4 5.4-4.8 11-7.3 16.9-2.4 5.6-4.8 11.3-7.2 17.3-2.3 5.7-4.6 11.5-7 17.5-2.1 5.4-4.2 10.9-6.4 16.5-.1.3-.2.5-.3.8-2.1 5.6-4.3 11.4-6.4 17.3 0 .1-.1.3-.1.4l10.3-1.1c-.2 0-.4-.1-.6-.1 12.3-1.5 28.6-10.7 39.1-22 4.9-5.2 9.3-11.4 13.3-18.6 3-5.4 5.9-11.3 8.6-17.9 2.4-5.8 4.6-12 6.8-18.7-2.8 1.5-6 2.6-9.6 3.3-.6.1-1.3.3-1.9.4-.6.1-1.3.2-2 .3 11.4-4.4 18.7-12.9 23.9-23.3-3 2.1-7.9 4.7-13.8 6-.8.2-1.6.3-2.4.4-.2 0-.4.1-.6.1 4-1.7 7.3-3.5 10.2-5.7l1.8-1.5c.9-.8 1.7-1.6 2.5-2.4.5-.5 1-1.1 1.5-1.7 1.1-1.4 2.2-2.8 3.2-4.4l.9-1.5c.4-.7.7-1.5 1.1-2.2 1.6-3.2 2.9-6.1 3.9-8.6.5-1.3 1-2.4 1.3-3.5.2-.4.3-.8.4-1.3.4-1.2.7-2.3 1-3.2.4-1.4.6-2.5.8-3.3-.4.3-.8.6-1.3.9-3.5 2.1-9.4 3.9-14.2 4.8l9.4-1-9.4 1h-.2c-.5.1-1 .2-1.4.2.1 0 .2-.1.2-.1l-32.2 3.5c0 .3-.1.4-.1.5z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__g",
@@ -246,13 +261,13 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__g)",
+    fill: colored ? "url(#prefix__g)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M178.1 104c-2.9 4.4-6 9.4-9.4 15.1-.2.3-.4.6-.5.9-2.9 4.9-6 10.3-9.2 16.2-2.8 5.1-5.7 10.5-8.8 16.4-2.6 5.1-5.4 10.5-8.2 16.3l32.2-3.5c9.4-4.3 13.6-8.2 17.7-13.9 1.1-1.6 2.2-3.2 3.3-4.9 3.3-5.2 6.6-10.9 9.5-16.5 2.8-5.5 5.3-10.9 7.2-15.8 1.2-3.1 2.2-6 2.8-8.5.6-2.2 1-4.4 1.4-6.4-12.6 2.1-28 4.1-38 4.6z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M157.3 215.1c-.6.1-1.3.2-2 .3.7 0 1.4-.1 2-.3z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M157.3 215.1c-.6.1-1.3.2-2 .3.7 0 1.4-.1 2-.3z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("linearGradient", {
@@ -276,13 +291,13 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__h)",
+    fill: colored ? "url(#prefix__h)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M157.3 215.1c-.6.1-1.3.2-2 .3.7 0 1.4-.1 2-.3z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4-.1.6-.1-.2 0-.4.1-.6.1z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4-.1.6-.1-.2 0-.4.1-.6.1z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("linearGradient", {
@@ -306,20 +321,20 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__i)",
+    fill: colored ? "url(#prefix__i)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4-.1.6-.1-.2 0-.4.1-.6.1z"
   })), /*#__PURE__*/React.createElement("path", {
     d: "M952.633 344.564v9.529h-2.64v-9.529h-3.33v-2.296h9.414v2.296zm15.957 2.066l-3.214 6.43h-1.607l-3.214-6.43v7.463h-2.64v-11.825h3.558l3.1 6.544 3.1-6.544h3.558v11.825h-2.64z",
-    fill: "#b0afb0"
+    fill: colored ? "#b0afb0" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 60%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 74%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 60%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 74%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 60%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }), /*#__PURE__*/React.createElement("path", {
     d: "M251.895 294.282v21.009h-2.755v-21.009h-7.692v-2.64h18.138v2.64zm37.769 21.008v-10.446h-14.235v10.447h-2.755v-23.65h2.755v10.677h14.235v-10.676h2.755v23.649zm21.582-21.008v7.807h11.94v2.64h-11.94v8.15h13.776v2.526h-16.53v-23.648h16.071v2.64h-13.317z",
-    fill: "#6d6e71"
+    fill: colored ? "#6d6e71" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }), /*#__PURE__*/React.createElement("path", {
     d: "M220.784 477.618l56.596-135.235h10.906l56.597 135.235h-14.235l-17.565-42.247H252.24l-17.335 42.247zm62.107-119.622l-27.782 66.814h54.875zm76.457 119.622V342.383h56.022c23.19 0 39.95 21.468 39.95 42.476 0 22.042-15.613 42.82-38.802 42.82H372.55v49.939zm13.202-61.763h43.28c15.956 0 26.288-14.694 26.288-30.996 0-16.99-12.513-30.651-27.437-30.651H372.55zm75.423 61.763l56.596-135.235h10.906l56.597 135.235h-14.465l-17.564-42.247h-60.73l-17.334 42.247zm62.107-119.622l-27.782 66.814h54.875zM635.9 341.58c23.994 0 41.558 12.168 49.938 29.503l-10.676 6.43c-8.61-17.91-25.37-23.994-39.95-23.994-32.374 0-50.053 28.93-50.053 56.137 0 29.848 21.927 56.94 50.627 56.94 15.268 0 33.177-7.576 41.672-25.14l11.02 5.74c-8.724 20.204-32.717 31.455-53.496 31.455-37.08 0-63.255-35.473-63.255-69.684 0-32.488 23.42-67.387 64.173-67.387zm177.825.803v135.235H800.41v-63.255h-80.13v63.255h-13.09V342.383h13.087v60.155h80.13v-60.155zm121.344 123.41v11.825h-90.807V342.383h89.085v11.825h-75.998v48.79h66.24v11.25h-66.24v51.545z",
-    fill: "#d22128"
+    fill: colored ? "#d22128" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 53%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 81%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 53%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 81%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 53%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }), /*#__PURE__*/React.createElement("path", {
     d: "M233.412 506.203c1.607.459 2.985 1.148 4.248 1.951l-1.378 3.1a17.273 17.273 0 00-3.903-1.837c-1.378-.344-2.755-.574-3.903-.574-1.837 0-3.33.345-4.363 1.033-1.148.69-1.607 1.608-1.607 2.756 0 1.033.344 1.836.918 2.525.574.689 1.378 1.148 2.296 1.607a48.01 48.01 0 003.789 1.263c1.951.574 3.559 1.263 4.707 1.722 1.148.574 2.18 1.378 3.1 2.41.803 1.034 1.262 2.412 1.262 4.249 0 1.607-.46 2.984-1.263 4.132-.803 1.148-2.066 2.067-3.673 2.756-1.608.688-3.33 1.033-5.396 1.033s-4.018-.345-5.97-1.148c-1.951-.804-3.558-1.837-4.936-3.215l1.492-2.87c1.263 1.263 2.756 2.296 4.478 2.985 1.722.689 3.329 1.033 4.936 1.033 2.066 0 3.674-.344 4.936-1.148 1.148-.803 1.837-1.836 1.837-3.214 0-1.033-.344-1.952-.918-2.64a5.546 5.546 0 00-2.296-1.608 48.01 48.01 0 00-3.789-1.262c-1.951-.574-3.444-1.148-4.706-1.608-1.148-.574-2.182-1.262-3.1-2.41-.804-1.034-1.263-2.411-1.263-4.133 0-1.493.46-2.755 1.263-3.903.804-1.148 1.952-1.952 3.444-2.64 1.492-.575 3.214-.92 5.166-.92 1.378-.114 2.985.116 4.592.575zm42.361 1.263c2.296 1.262 4.133 2.984 5.396 5.166 1.377 2.18 1.951 4.592 1.951 7.232 0 2.64-.688 5.051-1.951 7.232-1.378 2.182-3.1 3.904-5.396 5.281-2.296 1.263-4.821 1.952-7.462 1.952-2.755 0-5.28-.69-7.577-1.952-2.296-1.263-4.132-2.985-5.395-5.28-1.378-2.182-1.952-4.593-1.952-7.233 0-2.64.689-5.051 1.952-7.232 1.377-2.182 3.1-3.904 5.395-5.166a15.506 15.506 0 017.577-1.952c2.64 0 5.166.689 7.462 1.952zm-13.317 2.64c-1.722 1.033-3.214 2.41-4.247 4.133-1.033 1.722-1.607 3.559-1.607 5.625s.574 4.018 1.607 5.74c1.033 1.722 2.525 3.1 4.247 4.133s3.674 1.492 5.855 1.492c2.067 0 4.018-.46 5.74-1.492 1.722-1.033 3.215-2.411 4.248-4.133a11.091 11.091 0 001.607-5.74c0-2.066-.574-3.903-1.607-5.625s-2.411-3.1-4.248-4.018c-1.722-1.033-3.673-1.493-5.74-1.493-2.066-.114-4.018.345-5.855 1.378zm41.328-1.378v9.988h13.317v3.1h-13.317v12.168h-3.329V505.4h18.139v3.1h-14.81zm41.328 0V534.1h-3.214v-25.37h-9.299v-3.1h21.812v3.1zm51.545 25.372l-7.691-23.994-7.807 23.993h-3.329l-9.528-28.585h3.559l7.806 24.797 7.692-24.682h3.214l7.806 24.797 7.692-24.797h3.33l-9.53 28.585h-3.214zm29.16-7.118l-3.215 7.232h-3.444l12.743-28.585h3.33l12.742 28.585h-3.559l-3.214-7.232zm7.806-17.68l-6.314 14.465h12.743zm42.82 15.728c-.803 0-1.492.115-1.951.115h-7.577v9.069h-3.214v-28.585h10.79c3.56 0 6.315.803 8.266 2.525 1.952 1.722 2.985 4.018 2.985 7.118 0 2.296-.574 4.248-1.607 5.855-1.148 1.607-2.64 2.755-4.707 3.444l6.659 9.643h-3.674zm4.133-4.707c1.378-1.148 2.067-2.87 2.067-5.051s-.69-3.788-2.067-4.822c-1.377-1.148-3.444-1.607-5.97-1.607h-7.576v13.202h7.577c2.525 0 4.592-.574 5.97-1.722zm26.749-11.595v9.414h14.35v3.1h-14.35V531h16.646v3.1h-19.86v-28.586h19.4v3.1h-16.186zm62.106 0v9.988h13.317v3.1h-13.317v12.168h-3.214V505.4h18.138v3.1h-14.924zm50.971-1.262c2.296 1.262 4.133 2.984 5.396 5.166 1.378 2.18 1.952 4.592 1.952 7.232 0 2.64-.69 5.051-1.952 7.232-1.378 2.182-3.1 3.904-5.396 5.281-2.296 1.263-4.821 1.952-7.462 1.952-2.755 0-5.28-.69-7.576-1.952-2.296-1.263-4.133-2.985-5.396-5.28-1.378-2.182-1.952-4.593-1.952-7.233 0-2.64.69-5.051 1.952-7.232 1.378-2.182 3.1-3.904 5.396-5.166a15.506 15.506 0 017.576-1.952c2.756 0 5.281.689 7.462 1.952zm-13.202 2.64c-1.722 1.033-3.214 2.41-4.247 4.133-1.033 1.722-1.607 3.559-1.607 5.625s.574 4.018 1.607 5.74c1.033 1.722 2.525 3.1 4.247 4.133s3.674 1.492 5.855 1.492c2.067 0 4.018-.46 5.74-1.492 1.722-1.033 3.215-2.411 4.248-4.133a11.091 11.091 0 001.607-5.74c0-2.066-.574-3.903-1.607-5.625s-2.41-3.1-4.248-4.018c-1.722-1.033-3.673-1.493-5.74-1.493-2.18-.114-4.133.345-5.855 1.378zm58.204 21.008c-2.066 2.067-5.051 3.1-8.725 3.1-3.788 0-6.658-1.033-8.84-3.1-2.18-2.066-3.214-5.05-3.214-8.724v-16.761h3.215v16.76c0 2.756.803 4.937 2.296 6.43 1.607 1.492 3.673 2.295 6.428 2.295 2.756 0 4.822-.803 6.43-2.296 1.492-1.492 2.295-3.673 2.295-6.428v-16.761h3.215v16.76c0 3.789-1.034 6.659-3.1 8.725zm42.591 2.986l-17.105-22.96v22.96h-3.215v-28.586h3.33l17.105 22.96v-22.96h3.214v28.585zm41.902-26.634c2.18 1.262 4.018 2.984 5.28 5.166a14.22 14.22 0 011.952 7.232c0 2.64-.689 5.051-1.951 7.232-1.263 2.182-3.1 3.904-5.281 5.166-2.296 1.263-4.822 1.837-7.577 1.837h-11.48v-28.585h11.595c2.755.115 5.28.689 7.462 1.952zM734.169 531h8.266c2.066 0 4.018-.46 5.74-1.493 1.722-.918 3.1-2.296 4.133-4.018s1.492-3.559 1.492-5.74c0-2.066-.46-4.018-1.492-5.625-1.034-1.722-2.411-2.985-4.133-4.018s-3.674-1.492-5.74-1.492h-8.151V531zm41.443-4.018l-3.214 7.232h-3.444l12.742-28.585h3.33l12.742 28.585h-3.558l-3.215-7.232zm7.806-17.68l-6.314 14.465h12.743zm35.932-.574V534.1h-3.214v-25.37h-9.299v-3.1h21.927v3.1zm25.027 25.372v-28.586h3.214v28.585zm43.165-26.634c2.296 1.262 4.133 2.984 5.395 5.166 1.378 2.18 1.952 4.592 1.952 7.232 0 2.64-.689 5.051-1.952 7.232-1.377 2.182-3.1 3.904-5.395 5.281-2.296 1.263-4.822 1.952-7.462 1.952-2.755 0-5.281-.69-7.577-1.952-2.296-1.263-4.133-2.985-5.396-5.28-1.377-2.182-1.951-4.593-1.951-7.233 0-2.64.689-5.051 1.951-7.232 1.378-2.182 3.1-3.904 5.396-5.166a15.506 15.506 0 017.577-1.952c2.64 0 5.166.689 7.462 1.952zm-13.317 2.64c-1.722 1.033-3.214 2.41-4.248 4.133-1.033 1.722-1.607 3.559-1.607 5.625s.574 4.018 1.607 5.74c1.034 1.722 2.526 3.1 4.248 4.133 1.722 1.033 3.674 1.492 5.855 1.492 2.066 0 4.018-.46 5.74-1.492 1.722-1.033 3.214-2.411 4.247-4.133a11.091 11.091 0 001.608-5.74c0-2.066-.574-3.903-1.608-5.625-1.033-1.722-2.41-3.1-4.247-4.018-1.722-1.033-3.674-1.493-5.74-1.493-2.181-.114-4.133.345-5.855 1.378zm58.318 23.994l-17.105-22.96v22.96h-3.214v-28.586h3.329l17.105 22.96v-22.96h3.215v28.585z",
-    fill: "#6d6e71"
+    fill: colored ? "#6d6e71" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 88%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 46%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }), /*#__PURE__*/React.createElement("g", {
     transform: "translate(-46.24 159.277) scale(1.148)"
   }, /*#__PURE__*/React.createElement("linearGradient", {
@@ -340,23 +355,23 @@ function ApacheIcon({
     offset: 0.838,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__j)",
+    fill: colored ? "url(#prefix__j)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M192 60.2c-5.4 3.2-14.2 12.1-24.9 25.1l9.8 18.4c6.8-9.8 13.8-18.6 20.8-26.1.5-.6.8-.9.8-.9-.3.3-.5.6-.8.9-2.3 2.5-9.2 10.5-19.5 26.5 10-.5 25.4-2.5 37.9-4.7 3.7-20.9-3.7-30.5-3.7-30.5S203 53.7 192 60.2z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? 'none' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: "none",
     d: "M175.5 165.2h.2l-1.4.2c-.1 0-.2.1-.2.1.4-.2.9-.2 1.4-.3zm-10 33c-.8.2-1.6.3-2.4.4.8-.1 1.6-.3 2.4-.4zm-67.6 73.9c.1-.3.2-.6.3-.8 2.1-5.7 4.3-11.2 6.4-16.5 2.4-6 4.7-11.9 7-17.5 2.4-6 4.8-11.7 7.2-17.3 2.5-5.8 4.9-11.5 7.3-16.9 2-4.4 3.9-8.7 5.8-12.8.6-1.4 1.3-2.7 1.9-4.1 1.2-2.7 2.5-5.3 3.7-7.9 1.1-2.4 2.2-4.7 3.3-6.9.4-.8.7-1.5 1.1-2.3.1-.1.1-.2.2-.4l-1.2.1-.9-1.9c-.1.2-.2.4-.3.5-1.7 3.4-3.4 6.8-5.1 10.3-1 2-1.9 4-2.9 6-2.7 5.6-5.3 11.2-7.9 16.9-2.6 5.7-5.2 11.5-7.7 17.3-2.5 5.7-4.9 11.4-7.2 17-2.4 5.7-4.7 11.3-6.9 16.9-2.3 5.8-4.6 11.6-6.8 17.4l-1.5 3.9c-1.8 4.6-3.5 9.2-5.2 13.7l1.5 3 1.3-.1c0-.1.1-.3.1-.4 2.2-5.8 4.3-11.6 6.5-17.2zm64.6-73.4z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M159.2 214.8c-1.2.2-2.5.4-3.8.7.7-.1 1.3-.2 2-.3.6-.2 1.2-.3 1.8-.4z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M159.2 214.8c-1.2.2-2.5.4-3.8.7.7-.1 1.3-.2 2-.3.6-.2 1.2-.3 1.8-.4z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4 0 .6-.1.8-.1 1.6-.3 2.4-.4-1 .1-2 .3-3 .5z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4 0 .6-.1.8-.1 1.6-.3 2.4-.4-1 .1-2 .3-3 .5z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("linearGradient", {
@@ -380,7 +395,7 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__k)",
+    fill: colored ? "url(#prefix__k)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 66%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 68%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 66%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 68%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 66%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M148.1 151.2c3-5.5 6-11 9-16.2 3.2-5.5 6.3-10.8 9.6-15.9l.6-.9c3.2-5 6.4-9.9 9.6-14.5l-9.8-18.4c-.7.9-1.5 1.8-2.2 2.7-2.8 3.5-5.7 7.3-8.7 11.3-3.4 4.5-6.8 9.3-10.4 14.4-3.3 4.7-6.6 9.5-9.9 14.6-2.8 4.3-5.6 8.7-8.4 13.3-.1.2-.2.3-.3.5l12.7 25.1c2.7-5.5 5.4-10.8 8.2-16z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__l",
@@ -403,7 +418,7 @@ function ApacheIcon({
     offset: 0.949,
     stopColor: "#cd2032"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__l)",
+    fill: colored ? "url(#prefix__l)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M90.3 292.4c-1.7 4.6-3.4 9.3-5.1 14.1 0 .1 0 .1-.1.2-.2.7-.5 1.4-.7 2-1.1 3.2-2.1 6.1-4.4 12.8 3.7 1.7 6.7 6.2 9.6 11.3-.3-5.3-2.5-10.2-6.6-14.1 18.4.8 34.3-3.8 42.5-17.3.7-1.2 1.4-2.5 2-3.8-3.7 4.7-8.4 6.7-17.1 6.3h-.1.1c12.8-5.7 19.2-11.2 24.9-20.4 1.3-2.2 2.7-4.5 4-7.1-11.2 11.5-24.2 14.8-37.9 12.3l-10.3 1.1c-.1.9-.5 1.8-.8 2.6z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__m",
@@ -426,7 +441,7 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__m)",
+    fill: colored ? "url(#prefix__m)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M95.1 269.5c2.2-5.7 4.5-11.5 6.8-17.4 2.2-5.6 4.5-11.2 6.9-16.9 2.4-5.7 4.8-11.3 7.2-17 2.5-5.8 5.1-11.6 7.7-17.3 2.6-5.7 5.2-11.3 7.9-16.9 1-2 1.9-4 2.9-6 1.7-3.5 3.4-6.9 5.1-10.3.1-.2.2-.4.3-.5L127.2 142c-.2.3-.4.7-.6 1-3 4.8-5.9 9.8-8.8 14.8-2.9 5.1-5.8 10.3-8.6 15.5-2.4 4.4-4.7 8.9-6.9 13.4-.5.9-.9 1.8-1.3 2.7-2.8 5.7-5.3 11.2-7.5 16.5-2.6 6-4.8 11.7-6.8 17.1-1.3 3.6-2.5 7-3.6 10.3-.9 2.8-1.7 5.7-2.5 8.5-1.9 6.6-3.5 13.3-4.9 19.9L88.4 287c1.7-4.5 3.4-9.1 5.2-13.7.5-1.2 1-2.5 1.5-3.8z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__n",
@@ -449,7 +464,7 @@ function ApacheIcon({
     offset: 0.949,
     stopColor: "#cd2032"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__n)",
+    fill: colored ? "url(#prefix__n)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M75.5 262.7c-1.6 8.1-2.7 16.1-3.3 24.1 0 .3 0 .6-.1.8-4-6.4-14.6-12.6-14.6-12.5 7.6 11.1 13.4 22 14.3 32.8-4.1.8-9.7-.4-16.1-2.7 6.7 6.2 11.8 7.9 13.8 8.4-6.2.4-12.6 4.6-19.1 9.5 9.5-3.9 17.2-5.4 22.7-4.2-8.7 24.7-17.5 51.9-26.2 80.9 2.7-.8 4.3-2.6 5.2-5 1.6-5.2 11.9-39.6 28.1-84.8.5-1.3.9-2.6 1.4-3.9.1-.4.3-.7.4-1.1 1.7-4.7 3.5-9.6 5.3-14.5.4-1.1.8-2.2 1.3-3.4v-.1l-12.7-25.2c-.3.4-.3.7-.4.9z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__o",
@@ -472,7 +487,7 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__o)",
+    fill: colored ? "url(#prefix__o)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 89%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 45%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M141.9 169.2c-.4.7-.7 1.5-1.1 2.3l-3.3 6.9c-1.2 2.6-2.4 5.2-3.7 7.9-.6 1.3-1.3 2.7-1.9 4.1-1.9 4.1-3.8 8.4-5.8 12.8-2.4 5.4-4.8 11-7.3 16.9-2.4 5.6-4.8 11.3-7.2 17.3-2.3 5.7-4.6 11.5-7 17.5-2.1 5.4-4.2 10.9-6.4 16.5-.1.3-.2.5-.3.8-2.1 5.6-4.3 11.4-6.4 17.3 0 .1-.1.3-.1.4l10.3-1.1c-.2 0-.4-.1-.6-.1 12.3-1.5 28.6-10.7 39.1-22 4.9-5.2 9.3-11.4 13.3-18.6 3-5.4 5.9-11.3 8.6-17.9 2.4-5.8 4.6-12 6.8-18.7-2.8 1.5-6 2.6-9.6 3.3-.6.1-1.3.3-1.9.4-.6.1-1.3.2-2 .3 11.4-4.4 18.7-12.9 23.9-23.3-3 2.1-7.9 4.7-13.8 6-.8.2-1.6.3-2.4.4-.2 0-.4.1-.6.1 4-1.7 7.3-3.5 10.2-5.7l1.8-1.5c.9-.8 1.7-1.6 2.5-2.4.5-.5 1-1.1 1.5-1.7 1.1-1.4 2.2-2.8 3.2-4.4l.9-1.5c.4-.7.7-1.5 1.1-2.2 1.6-3.2 2.9-6.1 3.9-8.6.5-1.3 1-2.4 1.3-3.5.2-.4.3-.8.4-1.3.4-1.2.7-2.3 1-3.2.4-1.4.6-2.5.8-3.3-.4.3-.8.6-1.3.9-3.5 2.1-9.4 3.9-14.2 4.8l9.4-1-9.4 1h-.2c-.5.1-1 .2-1.4.2.1 0 .2-.1.2-.1l-32.2 3.5c0 .3-.1.4-.1.5z"
   }), /*#__PURE__*/React.createElement("linearGradient", {
     id: "prefix__p",
@@ -495,13 +510,13 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__p)",
+    fill: colored ? "url(#prefix__p)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M178.1 104c-2.9 4.4-6 9.4-9.4 15.1-.2.3-.4.6-.5.9-2.9 4.9-6 10.3-9.2 16.2-2.8 5.1-5.7 10.5-8.8 16.4-2.6 5.1-5.4 10.5-8.2 16.3l32.2-3.5c9.4-4.3 13.6-8.2 17.7-13.9 1.1-1.6 2.2-3.2 3.3-4.9 3.3-5.2 6.6-10.9 9.5-16.5 2.8-5.5 5.3-10.9 7.2-15.8 1.2-3.1 2.2-6 2.8-8.5.6-2.2 1-4.4 1.4-6.4-12.6 2.1-28 4.1-38 4.6z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M157.3 215.1c-.6.1-1.3.2-2 .3.7 0 1.4-.1 2-.3z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M157.3 215.1c-.6.1-1.3.2-2 .3.7 0 1.4-.1 2-.3z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("linearGradient", {
@@ -525,13 +540,13 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__q)",
+    fill: colored ? "url(#prefix__q)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M157.3 215.1c-.6.1-1.3.2-2 .3.7 0 1.4-.1 2-.3z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4-.1.6-.1-.2 0-.4.1-.6.1z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#be202e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#be202e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 83%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 51%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4-.1.6-.1-.2 0-.4.1-.6.1z",
     opacity: 0.35
   }), /*#__PURE__*/React.createElement("linearGradient", {
@@ -555,11 +570,11 @@ function ApacheIcon({
     offset: 1,
     stopColor: "#e97826"
   })), /*#__PURE__*/React.createElement("path", {
-    fill: "url(#prefix__r)",
+    fill: colored ? "url(#prefix__r)" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 82%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 52%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M162.5 198.7c.2 0 .4-.1.6-.1-.2 0-.4.1-.6.1z"
   })), /*#__PURE__*/React.createElement("path", {
     d: "M952.633 344.564v9.529h-2.64v-9.529h-3.33v-2.296h9.414v2.296zm15.957 2.066l-3.214 6.43h-1.607l-3.214-6.43v7.463h-2.64v-11.825h3.558l3.1 6.544 3.1-6.544h3.558v11.825h-2.64z",
-    fill: "#b0afb0"
+    fill: colored ? "#b0afb0" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 60%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 74%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 60%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 74%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 60%, var(--bgColor-default, var(--color-canvas-default, Canvas))))"))
   }));
   if (!colormode) return _svgEl;
   return /*#__PURE__*/React.createElement(_DlIconInverseColormode, {

package/data1/ApacheSparkIcon.js

@@ -11,31 +11,44 @@ function _DlIconInverseColormode({
   children
 }) {
   const ref = React.useRef(null);
-  const [resolved, setResolved] = React.useState(typeof mode === "string" ? mode : null);
+  const [appearance, setAppearance] = React.useState({
+    mode: typeof mode === "string" ? mode : null,
+    lightTheme: null,
+    darkTheme: null
+  });
   React.useLayoutEffect(() => {
-    if (typeof mode === "string") {
-      setResolved(mode);
-      return;
-    }
     if (typeof document === "undefined") return;
-    let cur = null;
+    let currentMode = null;
+    let lightTheme = null;
+    let darkTheme = null;
     let el = ref.current && ref.current.parentElement;
-    while (el) {
-      const m = el.getAttribute && el.getAttribute("data-color-mode");
-      if (m) { cur = m; break; }
+    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 (!cur || cur === "auto") {
-      cur = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+    if (!currentMode || currentMode === "auto") {
+      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
-    setResolved(cur === "dark" ? "light" : "dark");
+    setAppearance({
+      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
+      lightTheme,
+      darkTheme
+    });
   }, [mode]);
   return /*#__PURE__*/React.createElement("span", {
     ref: ref,
-    "data-color-mode": resolved || "light",
-    "data-light-theme": "light",
-    "data-dark-theme": "dark",
-    style: { display: "inline-flex", lineHeight: 0 }
+    "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);
 }
 
@@ -51,27 +64,29 @@ function ApacheSparkIcon({
   const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 388.112 201.85",
-    fill: themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor',
+    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",
     "aria-hidden": "true",
     ref: svgRef,
     "aria-labelledby": titleId
   }, props, {
+    "data-datalayer-icon": "",
     style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-fg": props.color
+      "--datalayer-icon-color": props.color,
+      color: props.color
     }) : props && props.style
-  }), title ? /*#__PURE__*/React.createElement("title", {
+  }), /*#__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 ? '#e25a1c' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#e25a1c" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 58%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 76%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 58%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 76%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 58%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     fillRule: "evenodd",
     d: "M355.027 101.84c-.335-.715-.486-1.076-.668-1.422-4.863-9.245-9.714-18.496-14.62-27.718-.495-.926-.434-1.478.244-2.269 7.733-9.035 15.427-18.106 23.13-27.169.27-.317.513-.657.617-1.222-2.253.589-4.505 1.17-6.755 1.766-9.345 2.476-18.693 4.945-28.029 7.455-.871.234-1.266-.021-1.699-.742-5.306-8.864-10.642-17.709-15.972-26.558-.276-.46-.573-.906-1.159-1.292-.429 2.361-.865 4.721-1.285 7.083-1.485 8.34-2.965 16.683-4.445 25.024-.161.9-.384 1.796-.46 2.704-.075.861-.516 1.179-1.295 1.424-11.014 3.457-22.016 6.948-33.019 10.436-.483.152-.955.35-1.473.821l27.142 10.787c-.332.264-.549.467-.792.626-5.628 3.641-11.264 7.268-16.878 10.928-.671.437-1.205.5-1.96.16-6.721-3.027-13.469-5.997-20.2-9.003-3.022-1.35-5.741-3.143-7.859-5.732-4.786-5.856-3.84-12.517 2.537-16.586 2.087-1.331 4.456-2.33 6.82-3.101 10.786-3.514 21.613-6.902 32.436-10.303.906-.283 1.327-.69 1.496-1.672a3379.11 3379.11 0 014.441-25.025c.805-4.457 1.233-9.03 3.403-13.115.832-1.57 1.831-3.109 3.019-4.425 4.295-4.767 10.291-4.952 14.833-.41 1.533 1.533 2.852 3.341 3.99 5.196 5.005 8.159 9.928 16.37 14.824 24.595.579.973 1.101 1.169 2.173.881 12.067-3.235 24.147-6.42 36.227-9.61 2.491-.658 5.011-.9 7.569-.422 5.567 1.042 8.001 5.281 6.117 10.659-.857 2.451-2.336 4.52-4 6.475-8.428 9.912-16.843 19.836-25.3 29.723-.692.808-.707 1.393-.228 2.295 5.045 9.51 10.046 19.043 15.066 28.566 1.201 2.28 2.118 4.645 2.145 7.263.06 5.954-4.294 10.826-10.21 11.693-3.314.487-6.393-.221-9.498-1.18a3100.033 3100.033 0 00-22.73-6.92c-.702-.21-.97-.485-1.095-1.242-.872-5.337-1.823-10.663-2.743-15.992-.027-.147.017-.305.04-.631l26.104 7.201"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#3c3a3e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#3c3a3e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 40%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 94%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 40%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 94%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 40%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     fillRule: "evenodd",
     d: "M340.275 179.571c-6.824-.012-13.648-.043-20.473-.016-.9.002-1.41-.26-1.913-1.026-8.079-12.305-16.194-24.587-24.303-36.873-.259-.391-.534-.768-.992-1.426-1.747 13.27-3.453 26.244-5.163 39.25h-17.87c.209-1.741.393-3.424.613-5.1 1.745-13.324 3.496-26.648 5.247-39.97 1.673-12.73 3.34-25.46 5.038-38.188.05-.38.302-.859.612-1.06 6.149-4.01 12.319-7.984 18.489-11.962.09-.059.215-.065.534-.156l-5.572 42.48.22.151 29.25-32.421c.287 1.65.534 3.062.777 4.475.693 4.046 1.358 8.098 2.101 12.135.15.814-.066 1.32-.609 1.886-6.26 6.551-12.496 13.125-18.737 19.692-.273.287-.534.584-.844.924.199.319.369.625.57.909a95397.154 95397.154 0 0032.307 45.325c.195.274.477.489.718.732v.24m-211.82-39.283c-.273-1.393-.468-3.438-1.086-5.348-2.992-9.234-12.467-14.297-22.274-12.014-10.758 2.503-18.446 10.96-19.558 21.938-.823 8.12 3.55 15.942 11.68 18.878 6.55 2.367 12.855 1.377 18.71-2.134 7.761-4.656 11.97-11.569 12.528-21.32zm-47.242 34.32c-.53 3.973-1.037 7.717-1.53 11.464a2756.23 2756.23 0 00-1.934 14.943c-.073.582-.25.838-.874.834-4.909-.02-9.817-.015-14.726-.022-.111 0-.223-.062-.49-.137.297-2.35.586-4.709.895-7.065 1.083-8.26 2.163-16.521 3.262-24.78 1.257-9.443 2.253-18.932 3.862-28.315 2.85-16.614 16.945-30.932 33.485-34.497 9.589-2.068 18.766-1.111 27.137 4.284 8.349 5.381 13.137 13.19 14.229 23.012 1.543 13.888-3.568 25.416-13.433 34.954-6.474 6.26-14.225 10.24-23.166 11.585-9.21 1.389-17.869-.148-25.638-5.578-.286-.198-.59-.372-1.08-.681m-7.998-78.949l-16.142 12.016c-.86-1.355-1.629-2.705-2.527-3.962-2.313-3.231-5.185-5.646-9.362-5.939-3.474-.243-6.445.901-8.81 3.463-2.115 2.29-2.391 5.547-.415 8.134 2.176 2.848 4.557 5.55 6.989 8.185 4.03 4.37 8.244 8.573 12.249 12.967 3.644 3.996 6.549 8.481 7.446 13.946 1.067 6.497-.23 12.684-3.303 18.394-5.687 10.566-14.642 16.696-26.465 18.615-5.221.846-10.428.678-15.523-.822-6.761-1.99-11.467-6.422-14.494-12.68C1.788 165.767.97 163.433 0 161.062l17.504-9.367c.203.486.346.89.535 1.27.995 1.991 1.81 4.106 3.042 5.939 3.654 5.433 9.557 7.087 15.546 4.4a17.137 17.137 0 004.28-2.782c3.86-3.425 4.583-8.193 1.727-12.503-1.641-2.477-3.694-4.697-5.692-6.915-4.776-5.304-9.745-10.438-14.41-15.837-3.216-3.721-5.401-8.061-6.093-13.045-.755-5.442.333-10.577 3.165-15.16 7.041-11.387 17.272-17.312 30.804-16.82 7.715.279 13.858 3.886 18.627 9.88 1.41 1.773 2.733 3.617 4.179 5.54M203.93 156.8c-.897 6.86-1.744 13.38-2.624 19.895-.045.33-.304.779-.585.91-13.32 6.169-30.86 5.308-41.799-7.115-5.877-6.674-8.343-14.595-7.974-23.408.852-20.4 17.766-38.208 37.992-40.696 11.818-1.454 22.181 1.737 30.188 10.917 5.452 6.254 7.975 13.722 7.602 21.963-.245 5.444-1.099 10.864-1.776 16.283-.96 7.675-2.009 15.34-3.023 23.009-.036.272-.091.542-.152.888h-15.935c.212-1.762.406-3.487.63-5.208 1.154-8.858 2.422-17.702 3.434-26.575.63-5.527.233-11.012-2.294-16.13-2.689-5.44-7.196-8.318-13.125-8.947-12.27-1.298-23.944 7.228-26.561 19.303-1.73 7.97.996 15.61 7.343 19.835 6.188 4.116 12.814 4.13 19.557 1.46 3.418-1.352 6.33-3.494 9.102-6.384m67.099-48.866l-2.176 16.523c-3.37 0-6.673-.02-9.975.007-2.677.02-5.12 1.748-5.923 4.247-.315.978-.431 2.024-.566 3.05-1.677 12.685-3.34 25.372-5.004 38.06-.42 3.198-.829 6.4-1.249 9.647H229.55c.31-2.44.602-4.8.911-7.158a14570.69 14570.69 0 013.25-24.661c.944-7.113 1.785-14.241 2.896-21.328 1.49-9.5 10.942-17.935 20.528-18.352 4.574-.2 9.164-.034 13.894-.034"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#3c3a3e' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#3c3a3e" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 40%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 94%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 40%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 94%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 40%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M359.829 179.468v-7.002h-.04l-2.748 7.002h-.876l-2.748-7.002h-.04v7.002h-1.385v-8.386h2.137l2.503 6.37 2.464-6.37h2.118v8.386h-1.385zm-12.173-7.265v7.265h-1.384v-7.265h-2.626v-1.122h6.636v1.121h-2.626M95.432 83.885h4.112l-.97-6.226-3.142 6.226zm4.758 4.023h-6.842l-2.173 4.257H86.33l10.687-19.966h4.671l3.64 19.966h-4.493l-.645-4.257m24.479-11.688h-2.438l-.82 4.61h2.436c1.47 0 2.644-.968 2.644-2.79 0-1.204-.736-1.82-1.822-1.82zm-5.902-4.021h6.403c3.347 0 5.695 1.996 5.695 5.43 0 4.317-3.054 7.223-7.4 7.223h-2.759l-1.293 7.313h-4.168l3.522-19.966m26.261 11.686h4.112l-.97-6.226-3.142 6.226zm4.757 4.023h-6.841l-2.174 4.257h-4.845l10.687-19.966h4.67l3.64 19.966h-4.49l-.647-4.257m27.049 3.552c-1.409.645-2.964 1.029-4.521 1.029-5.284 0-8.604-3.966-8.604-8.928 0-6.343 5.344-11.687 11.687-11.687 1.585 0 3.025.381 4.199 1.027l-.588 4.788c-.88-.97-2.29-1.645-4.052-1.645-3.64 0-6.87 3.29-6.87 7.106 0 2.906 1.82 5.17 4.699 5.17 1.762 0 3.463-.676 4.608-1.616l-.558 4.755m25.481-7.34h-8.691l-1.411 8.046h-4.168l3.523-19.966h4.17l-1.41 7.898h8.692l1.407-7.898h4.17l-3.52 19.966h-4.17l1.408-8.046m15.291 8.046l3.521-19.966H232.2l-.705 4.021h-6.902l-.702 3.877h6.34l-.703 4.022h-6.343l-.705 4.023h6.901l-.705 4.023h-11.069"
   }));
   if (!colormode) return _svgEl;