intergalactic 15.98.2 → 15.99.0-prerelease.1

package/illustration/PieChart/index.js

@@ -26,84 +26,90 @@ module.exports = __toCommonJS(stdin_exports);
 var import_react = __toESM(require("react"));
 var import_core = require("intergalactic/core");
 var import_flex_box = require("intergalactic/flex-box");
-const PieChart = ({ fill = "none", width = "80", height = "80", viewBox = "0 0 80 80", ...props }, ref) => /* @__PURE__ */ import_react.default.createElement(import_flex_box.Box, {
-  ref,
-  width,
-  height,
-  viewBox,
-  fill,
-  tag: "svg",
-  ...props
-}, /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M14.905 65.163c6.418 6.424 15.304 10.46 25.177 10.46v2.471c0 .494.412.906.905.906C61.804 78.506 78.507 61.786 79 40.947a.914.914 0 0 0-.905-.906h-2.468C75.627 20.356 59.665 4.377 40 4.377V1.906A.914.914 0 0 0 39.095 1c-10.038.247-19.17 4.283-26 10.79a.896.896 0 0 0 0 1.235l1.728 1.73c-6.418 6.425-10.45 15.32-10.45 25.204H1.905a.914.914 0 0 0-.905.906c.247 10.048 4.278 19.191 10.778 26.027.33.33.905.33 1.235 0l1.892-1.73Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M65.925 57.607s.086-.054.119-.087l6.495-4.323-3.134-1.696-3.134.756-8.3-31.677a5.705 5.705 0 0 0-6.68-4.15l-39.588 8.073-1.394-3.123-3.415 5.88a6.51 6.51 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l10.44 36.648a2.587 2.587 0 0 0 3.177 1.794l45.273-12.342a2.94 2.94 0 0 0 .746-.346l.054-.032.01-.011Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M65.438 18.818 11.054 30.761l-1.34-4.69c-.962-3.373 1.156-6.853 4.593-7.555l42.885-8.744c3.134-.637 6.225 1.286 7.024 4.377l1.222 4.67Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M18.39 23.419a1.873 1.873 0 0 1-1.415 2.366c-1.092.238-2.227-.454-2.53-1.523a1.868 1.868 0 0 1 1.427-2.367c1.092-.227 2.216.464 2.519 1.534v-.01Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M25.372 21.938c.292 1.06-.324 2.108-1.394 2.335-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.08-.227 2.172.464 2.464 1.523v.011Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M11.087 30.842s.324-3.155.605-6.387l-1.372-3.08-3.416 5.88a6.504 6.504 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l1.395 4.906 3.458-5.965v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329v0Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m50.014 34.399 14.05 3.653c.703-2.194.81-4.56.173-6.895-1.891-6.982-9.716-11.262-17.778-9.684L50.002 34.4h.011Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m46.459 21.478-2.367 3.156 3.556 12.926 2.367-3.156-3.556-12.926Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m64.066 38.054-2.367 3.156-14.05-3.653 2.367-3.156 14.05 3.653ZM55.582 51.398c.237-.291.453-.583.67-.886l2.118-2.799L46 43.5l-4.447-5.308-2.107-7.663a17.044 17.044 0 0 0-6.139 2.994l-.497-.281-1.891 2.572c-.378.443-.714.919-1.027 1.394l-.065.087v.032c-1.913 2.994-2.605 6.571-1.621 10.116 2.064 7.414 10.646 11.553 18.967 9.305 3.502-.94 6.387-2.864 8.398-5.306l.021-.033-.01-.01Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M45.509 40.804 41.812 27.37c-8.192 2.107-13.282 9.608-11.25 16.903 2.032 7.295 10.645 11.553 18.967 9.305 5.144-1.383 8.981-4.885 10.624-9.046l-14.644-3.728Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m46.654 26.846 3.953-5.757M47.7 33.051l7.589-11.05M51.31 35.526l7.84-11.419M54.92 38.001l7.392-10.767M64.386 31.949l-5.098 7.425",
-  stroke: "#6C6E79",
-  strokeMiterlimit: "10",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M57.918 22.32c-3.469-1.643-7.9-1.996-11.715-1.283l-3.253 3.664",
-  stroke: "#fff",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+var import_useColorResolver = require("intergalactic/utils/lib/use/useColorResolver");
+const PieChart = ({ fill = "none", width = "80", height = "80", viewBox = "0 0 80 80", primaryColor = "#E0E1E9", secondaryColor = "#6C6E79", ...props }, ref) => {
+  const colorResolver = (0, import_useColorResolver.useColorResolver)();
+  const resolvedPrimaryColor = colorResolver(primaryColor);
+  const resolvedSecondaryColor = colorResolver(secondaryColor);
+  return /* @__PURE__ */ import_react.default.createElement(import_flex_box.Box, {
+    ref,
+    width,
+    height,
+    viewBox,
+    fill,
+    tag: "svg",
+    ...props
+  }, /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M14.905 65.163c6.418 6.424 15.304 10.46 25.177 10.46v2.471c0 .494.412.906.905.906C61.804 78.506 78.507 61.786 79 40.947a.914.914 0 0 0-.905-.906h-2.468C75.627 20.356 59.665 4.377 40 4.377V1.906A.914.914 0 0 0 39.095 1c-10.038.247-19.17 4.283-26 10.79a.896.896 0 0 0 0 1.235l1.728 1.73c-6.418 6.425-10.45 15.32-10.45 25.204H1.905a.914.914 0 0 0-.905.906c.247 10.048 4.278 19.191 10.778 26.027.33.33.905.33 1.235 0l1.892-1.73Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M65.925 57.607s.086-.054.119-.087l6.495-4.323-3.134-1.696-3.134.756-8.3-31.677a5.705 5.705 0 0 0-6.68-4.15l-39.588 8.073-1.394-3.123-3.415 5.88a6.51 6.51 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l10.44 36.648a2.587 2.587 0 0 0 3.177 1.794l45.273-12.342a2.94 2.94 0 0 0 .746-.346l.054-.032.01-.011Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M65.438 18.818 11.054 30.761l-1.34-4.69c-.962-3.373 1.156-6.853 4.593-7.555l42.885-8.744c3.134-.637 6.225 1.286 7.024 4.377l1.222 4.67Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M18.39 23.419a1.873 1.873 0 0 1-1.415 2.366c-1.092.238-2.227-.454-2.53-1.523a1.868 1.868 0 0 1 1.427-2.367c1.092-.227 2.216.464 2.519 1.534v-.01Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M25.372 21.938c.292 1.06-.324 2.108-1.394 2.335-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.08-.227 2.172.464 2.464 1.523v.011Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M11.087 30.842s.324-3.155.605-6.387l-1.372-3.08-3.416 5.88a6.504 6.504 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l1.395 4.906 3.458-5.965v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329v0Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m50.014 34.399 14.05 3.653c.703-2.194.81-4.56.173-6.895-1.891-6.982-9.716-11.262-17.778-9.684L50.002 34.4h.011Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m46.459 21.478-2.367 3.156 3.556 12.926 2.367-3.156-3.556-12.926Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m64.066 38.054-2.367 3.156-14.05-3.653 2.367-3.156 14.05 3.653ZM55.582 51.398c.237-.291.453-.583.67-.886l2.118-2.799L46 43.5l-4.447-5.308-2.107-7.663a17.044 17.044 0 0 0-6.139 2.994l-.497-.281-1.891 2.572c-.378.443-.714.919-1.027 1.394l-.065.087v.032c-1.913 2.994-2.605 6.571-1.621 10.116 2.064 7.414 10.646 11.553 18.967 9.305 3.502-.94 6.387-2.864 8.398-5.306l.021-.033-.01-.01Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M45.509 40.804 41.812 27.37c-8.192 2.107-13.282 9.608-11.25 16.903 2.032 7.295 10.645 11.553 18.967 9.305 5.144-1.383 8.981-4.885 10.624-9.046l-14.644-3.728Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m46.654 26.846 3.953-5.757M47.7 33.051l7.589-11.05M51.31 35.526l7.84-11.419M54.92 38.001l7.392-10.767M64.386 31.949l-5.098 7.425",
+    stroke: resolvedSecondaryColor,
+    strokeMiterlimit: "10",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M57.918 22.32c-3.469-1.643-7.9-1.996-11.715-1.283l-3.253 3.664",
+    stroke: "#fff",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 PieChart.displayName = "PieChart";
 var stdin_default = (0, import_core.createBaseComponent)(PieChart);

package/illustration/PieChart/index.mjs

@@ -1,85 +1,91 @@
 import React from "react";
 import { createBaseComponent } from 'intergalactic/core';
 import { Box } from 'intergalactic/flex-box';
-const PieChart = ({ fill = "none", width = "80", height = "80", viewBox = "0 0 80 80", ...props }, ref) => /* @__PURE__ */ React.createElement(Box, {
-  ref,
-  width,
-  height,
-  viewBox,
-  fill,
-  tag: "svg",
-  ...props
-}, /* @__PURE__ */ React.createElement("path", {
-  d: "M14.905 65.163c6.418 6.424 15.304 10.46 25.177 10.46v2.471c0 .494.412.906.905.906C61.804 78.506 78.507 61.786 79 40.947a.914.914 0 0 0-.905-.906h-2.468C75.627 20.356 59.665 4.377 40 4.377V1.906A.914.914 0 0 0 39.095 1c-10.038.247-19.17 4.283-26 10.79a.896.896 0 0 0 0 1.235l1.728 1.73c-6.418 6.425-10.45 15.32-10.45 25.204H1.905a.914.914 0 0 0-.905.906c.247 10.048 4.278 19.191 10.778 26.027.33.33.905.33 1.235 0l1.892-1.73Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M65.925 57.607s.086-.054.119-.087l6.495-4.323-3.134-1.696-3.134.756-8.3-31.677a5.705 5.705 0 0 0-6.68-4.15l-39.588 8.073-1.394-3.123-3.415 5.88a6.51 6.51 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l10.44 36.648a2.587 2.587 0 0 0 3.177 1.794l45.273-12.342a2.94 2.94 0 0 0 .746-.346l.054-.032.01-.011Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329Z",
-  fill: "#fff"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M65.438 18.818 11.054 30.761l-1.34-4.69c-.962-3.373 1.156-6.853 4.593-7.555l42.885-8.744c3.134-.637 6.225 1.286 7.024 4.377l1.222 4.67Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M18.39 23.419a1.873 1.873 0 0 1-1.415 2.366c-1.092.238-2.227-.454-2.53-1.523a1.868 1.868 0 0 1 1.427-2.367c1.092-.227 2.216.464 2.519 1.534v-.01Z",
-  fill: "#fff"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M25.372 21.938c.292 1.06-.324 2.108-1.394 2.335-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.08-.227 2.172.464 2.464 1.523v.011Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M11.087 30.842s.324-3.155.605-6.387l-1.372-3.08-3.416 5.88a6.504 6.504 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l1.395 4.906 3.458-5.965v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329v0Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m50.014 34.399 14.05 3.653c.703-2.194.81-4.56.173-6.895-1.891-6.982-9.716-11.262-17.778-9.684L50.002 34.4h.011Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m46.459 21.478-2.367 3.156 3.556 12.926 2.367-3.156-3.556-12.926Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m64.066 38.054-2.367 3.156-14.05-3.653 2.367-3.156 14.05 3.653ZM55.582 51.398c.237-.291.453-.583.67-.886l2.118-2.799L46 43.5l-4.447-5.308-2.107-7.663a17.044 17.044 0 0 0-6.139 2.994l-.497-.281-1.891 2.572c-.378.443-.714.919-1.027 1.394l-.065.087v.032c-1.913 2.994-2.605 6.571-1.621 10.116 2.064 7.414 10.646 11.553 18.967 9.305 3.502-.94 6.387-2.864 8.398-5.306l.021-.033-.01-.01Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M45.509 40.804 41.812 27.37c-8.192 2.107-13.282 9.608-11.25 16.903 2.032 7.295 10.645 11.553 18.967 9.305 5.144-1.383 8.981-4.885 10.624-9.046l-14.644-3.728Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m46.654 26.846 3.953-5.757M47.7 33.051l7.589-11.05M51.31 35.526l7.84-11.419M54.92 38.001l7.392-10.767M64.386 31.949l-5.098 7.425",
-  stroke: "#6C6E79",
-  strokeMiterlimit: "10",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M57.918 22.32c-3.469-1.643-7.9-1.996-11.715-1.283l-3.253 3.664",
-  stroke: "#fff",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+import { useColorResolver } from 'intergalactic/utils/lib/use/useColorResolver';
+const PieChart = ({ fill = "none", width = "80", height = "80", viewBox = "0 0 80 80", primaryColor = "#E0E1E9", secondaryColor = "#6C6E79", ...props }, ref) => {
+  const colorResolver = useColorResolver();
+  const resolvedPrimaryColor = colorResolver(primaryColor);
+  const resolvedSecondaryColor = colorResolver(secondaryColor);
+  return /* @__PURE__ */ React.createElement(Box, {
+    ref,
+    width,
+    height,
+    viewBox,
+    fill,
+    tag: "svg",
+    ...props
+  }, /* @__PURE__ */ React.createElement("path", {
+    d: "M14.905 65.163c6.418 6.424 15.304 10.46 25.177 10.46v2.471c0 .494.412.906.905.906C61.804 78.506 78.507 61.786 79 40.947a.914.914 0 0 0-.905-.906h-2.468C75.627 20.356 59.665 4.377 40 4.377V1.906A.914.914 0 0 0 39.095 1c-10.038.247-19.17 4.283-26 10.79a.896.896 0 0 0 0 1.235l1.728 1.73c-6.418 6.425-10.45 15.32-10.45 25.204H1.905a.914.914 0 0 0-.905.906c.247 10.048 4.278 19.191 10.778 26.027.33.33.905.33 1.235 0l1.892-1.73Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M65.925 57.607s.086-.054.119-.087l6.495-4.323-3.134-1.696-3.134.756-8.3-31.677a5.705 5.705 0 0 0-6.68-4.15l-39.588 8.073-1.394-3.123-3.415 5.88a6.51 6.51 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l10.44 36.648a2.587 2.587 0 0 0 3.177 1.794l45.273-12.342a2.94 2.94 0 0 0 .746-.346l.054-.032.01-.011Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M65.438 18.818 11.054 30.761l-1.34-4.69c-.962-3.373 1.156-6.853 4.593-7.555l42.885-8.744c3.134-.637 6.225 1.286 7.024 4.377l1.222 4.67Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M18.39 23.419a1.873 1.873 0 0 1-1.415 2.366c-1.092.238-2.227-.454-2.53-1.523a1.868 1.868 0 0 1 1.427-2.367c1.092-.227 2.216.464 2.519 1.534v-.01Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M25.372 21.938c.292 1.06-.324 2.108-1.394 2.335-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.08-.227 2.172.464 2.464 1.523v.011Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M11.087 30.842s.324-3.155.605-6.387l-1.372-3.08-3.416 5.88a6.504 6.504 0 0 0-.216.367v.021a5.637 5.637 0 0 0-.454 4.248l1.395 4.906 3.458-5.965v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M71.759 53.554 24.087 66.555a2.734 2.734 0 0 1-3.35-1.891L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.554l42.874-8.744c3.134-.637 6.225 1.286 7.025 4.377l9.445 36.076a2.73 2.73 0 0 1-1.923 3.329v0Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m50.014 34.399 14.05 3.653c.703-2.194.81-4.56.173-6.895-1.891-6.982-9.716-11.262-17.778-9.684L50.002 34.4h.011Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m46.459 21.478-2.367 3.156 3.556 12.926 2.367-3.156-3.556-12.926Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m64.066 38.054-2.367 3.156-14.05-3.653 2.367-3.156 14.05 3.653ZM55.582 51.398c.237-.291.453-.583.67-.886l2.118-2.799L46 43.5l-4.447-5.308-2.107-7.663a17.044 17.044 0 0 0-6.139 2.994l-.497-.281-1.891 2.572c-.378.443-.714.919-1.027 1.394l-.065.087v.032c-1.913 2.994-2.605 6.571-1.621 10.116 2.064 7.414 10.646 11.553 18.967 9.305 3.502-.94 6.387-2.864 8.398-5.306l.021-.033-.01-.01Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M45.509 40.804 41.812 27.37c-8.192 2.107-13.282 9.608-11.25 16.903 2.032 7.295 10.645 11.553 18.967 9.305 5.144-1.383 8.981-4.885 10.624-9.046l-14.644-3.728Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m46.654 26.846 3.953-5.757M47.7 33.051l7.589-11.05M51.31 35.526l7.84-11.419M54.92 38.001l7.392-10.767M64.386 31.949l-5.098 7.425",
+    stroke: resolvedSecondaryColor,
+    strokeMiterlimit: "10",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M57.918 22.32c-3.469-1.643-7.9-1.996-11.715-1.283l-3.253 3.664",
+    stroke: "#fff",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 PieChart.displayName = "PieChart";
 var stdin_default = createBaseComponent(PieChart);
 export {

package/illustration/Processing/index.d.ts

@@ -1,4 +1,28 @@
 
-import { Box } from 'intergalactic/flex-box';
-declare const _default: typeof Box;
-export default _default;    
+import { BoxProps } from 'intergalactic/flex-box';
+import { Intergalactic } from 'intergalactic/core';
+
+type IllustrationProps = BoxProps & {
+    /**
+     * Main color of the illustration
+     **/
+    primaryColor?: string;
+    /**
+     * Secondary color of the illustration
+     **/
+    secondaryColor?: string;
+    /**
+     * Changes background fill of the illustration
+     **/
+    fill?: string;
+    /**
+     * Width of the illustration
+     **/
+    width?: string | number;
+    /**
+     * Height of the illustration
+     **/
+    height?: string | number;
+}
+declare const Illustration: Intergalactic.Component<'svg', IllustrationProps>;
+export default Illustration;    

package/illustration/Processing/index.js

@@ -26,64 +26,70 @@ module.exports = __toCommonJS(stdin_exports);
 var import_react = __toESM(require("react"));
 var import_core = require("intergalactic/core");
 var import_flex_box = require("intergalactic/flex-box");
-const Processing = ({ fill = "none", width = "80", height = "80", viewBox = "0 0 80 80", ...props }, ref) => /* @__PURE__ */ import_react.default.createElement(import_flex_box.Box, {
-  ref,
-  width,
-  height,
-  viewBox,
-  fill,
-  tag: "svg",
-  ...props
-}, /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M72.024 26.685a48.67 48.67 0 0 0-1.78-16.191 1.055 1.055 0 0 0-.738-.738 48.39 48.39 0 0 0-16.19-1.78l-4.2-4.2c-5.036-5.035-13.196-5.035-18.232 0l-4.2 4.2a48.397 48.397 0 0 0-16.19 1.79c-.358.098-.64.38-.738.739a48.39 48.39 0 0 0-1.78 16.19l-4.2 4.2c-5.035 5.036-5.035 13.196 0 18.231l4.2 4.2a48.575 48.575 0 0 0 1.78 16.18c.098.358.38.64.738.738a48.39 48.39 0 0 0 16.19 1.78l4.2 4.2c5.036 5.035 13.196 5.035 18.232 0l4.2-4.2a48.67 48.67 0 0 0 16.19-1.78c.358-.097.64-.38.738-.738a48.39 48.39 0 0 0 1.78-16.19l4.2-4.2c5.035-5.036 5.035-13.196 0-18.232l-4.2-4.2Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M66.16 57.374s.087-.054.12-.087l6.521-4.323-3.147-1.697-3.147.756-8.334-31.681a5.73 5.73 0 0 0-6.707-4.15l-39.74 8.063-1.4-3.124-3.428 5.88a6.507 6.507 0 0 0-.217.368v.021a5.618 5.618 0 0 0-.456 4.248l10.472 36.654a2.599 2.599 0 0 0 3.19 1.794l45.459-12.344c.271-.076.52-.205.749-.346l.054-.032h.01Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M72.02 53.31 24.152 66.313a2.747 2.747 0 0 1-3.364-1.892L9.752 25.822c-.966-3.372 1.16-6.853 4.612-7.556l43.05-8.744c3.146-.638 6.25 1.286 7.053 4.377L73.95 49.98a2.729 2.729 0 0 1-1.931 3.33Z",
-  fill: "#fff",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M65.682 18.569 11.076 30.513 9.73 25.822c-.966-3.372 1.161-6.853 4.612-7.556l43.05-8.733c3.146-.638 6.25 1.286 7.053 4.377l1.226 4.67.011-.011Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M18.433 23.174a1.873 1.873 0 0 1-1.421 2.367c-1.097.238-2.236-.454-2.54-1.524a1.868 1.868 0 0 1 1.433-2.367c1.096-.227 2.224.464 2.528 1.535v-.011Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M25.443 21.693c.293 1.06-.325 2.108-1.4 2.335-1.074.227-2.192-.454-2.485-1.524-.293-1.07.326-2.12 1.411-2.346 1.085-.227 2.181.465 2.474 1.524v.01Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M11.097 30.6s.326-3.157.608-6.389l-1.378-3.08-3.43 5.88a6.507 6.507 0 0 0-.216.367v.022a5.619 5.619 0 0 0-.456 4.248l1.4 4.908 3.472-5.967v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M33.658 33.852a14.135 14.135 0 0 0-1.671 12.35c.217.672.488 1.324.814 1.953a13.22 13.22 0 0 0 1.291 2.073 14.156 14.156 0 0 0 3.473 3.288c6.5 4.351 15.312 2.615 19.663-3.896 4.352-6.5 2.616-15.312-3.895-19.664a14.152 14.152 0 0 0-13.24-1.345 14.146 14.146 0 0 0-6.424 5.241h-.01Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m52.693 39.159-7.26 2.582-3.31-8.28",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: "1.2"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m40.528 51.92-6.447-2.463 2.301 6.272M31.738 44.65c-1.476-5.252.217-10.45 3.928-13.663",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M36.48 30.336c1.476-1.085 3.223-1.877 5.176-2.29 7.564-1.584 15.388 3.256 17.483 10.798 2.094 7.531-2.312 14.943-9.854 16.56-5.806 1.248-11.774-1.291-15.203-5.958",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+var import_useColorResolver = require("intergalactic/utils/lib/use/useColorResolver");
+const Processing = ({ fill = "none", width = "80", height = "80", viewBox = "0 0 80 80", primaryColor = "#E0E1E9", secondaryColor = "#6C6E79", ...props }, ref) => {
+  const colorResolver = (0, import_useColorResolver.useColorResolver)();
+  const resolvedPrimaryColor = colorResolver(primaryColor);
+  const resolvedSecondaryColor = colorResolver(secondaryColor);
+  return /* @__PURE__ */ import_react.default.createElement(import_flex_box.Box, {
+    ref,
+    width,
+    height,
+    viewBox,
+    fill,
+    tag: "svg",
+    ...props
+  }, /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M72.024 26.685a48.67 48.67 0 0 0-1.78-16.191 1.055 1.055 0 0 0-.738-.738 48.39 48.39 0 0 0-16.19-1.78l-4.2-4.2c-5.036-5.035-13.196-5.035-18.232 0l-4.2 4.2a48.397 48.397 0 0 0-16.19 1.79c-.358.098-.64.38-.738.739a48.39 48.39 0 0 0-1.78 16.19l-4.2 4.2c-5.035 5.036-5.035 13.196 0 18.231l4.2 4.2a48.575 48.575 0 0 0 1.78 16.18c.098.358.38.64.738.738a48.39 48.39 0 0 0 16.19 1.78l4.2 4.2c5.036 5.035 13.196 5.035 18.232 0l4.2-4.2a48.67 48.67 0 0 0 16.19-1.78c.358-.097.64-.38.738-.738a48.39 48.39 0 0 0 1.78-16.19l4.2-4.2c5.035-5.036 5.035-13.196 0-18.232l-4.2-4.2Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M66.16 57.374s.087-.054.12-.087l6.521-4.323-3.147-1.697-3.147.756-8.334-31.681a5.73 5.73 0 0 0-6.707-4.15l-39.74 8.063-1.4-3.124-3.428 5.88a6.507 6.507 0 0 0-.217.368v.021a5.618 5.618 0 0 0-.456 4.248l10.472 36.654a2.599 2.599 0 0 0 3.19 1.794l45.459-12.344c.271-.076.52-.205.749-.346l.054-.032h.01Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M72.02 53.31 24.152 66.313a2.747 2.747 0 0 1-3.364-1.892L9.752 25.822c-.966-3.372 1.16-6.853 4.612-7.556l43.05-8.744c3.146-.638 6.25 1.286 7.053 4.377L73.95 49.98a2.729 2.729 0 0 1-1.931 3.33Z",
+    fill: "#fff",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M65.682 18.569 11.076 30.513 9.73 25.822c-.966-3.372 1.161-6.853 4.612-7.556l43.05-8.733c3.146-.638 6.25 1.286 7.053 4.377l1.226 4.67.011-.011Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M18.433 23.174a1.873 1.873 0 0 1-1.421 2.367c-1.097.238-2.236-.454-2.54-1.524a1.868 1.868 0 0 1 1.433-2.367c1.096-.227 2.224.464 2.528 1.535v-.011Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M25.443 21.693c.293 1.06-.325 2.108-1.4 2.335-1.074.227-2.192-.454-2.485-1.524-.293-1.07.326-2.12 1.411-2.346 1.085-.227 2.181.465 2.474 1.524v.01Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M11.097 30.6s.326-3.157.608-6.389l-1.378-3.08-3.43 5.88a6.507 6.507 0 0 0-.216.367v.022a5.619 5.619 0 0 0-.456 4.248l1.4 4.908 3.472-5.967v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M33.658 33.852a14.135 14.135 0 0 0-1.671 12.35c.217.672.488 1.324.814 1.953a13.22 13.22 0 0 0 1.291 2.073 14.156 14.156 0 0 0 3.473 3.288c6.5 4.351 15.312 2.615 19.663-3.896 4.352-6.5 2.616-15.312-3.895-19.664a14.152 14.152 0 0 0-13.24-1.345 14.146 14.146 0 0 0-6.424 5.241h-.01Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m52.693 39.159-7.26 2.582-3.31-8.28",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: "1.2"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m40.528 51.92-6.447-2.463 2.301 6.272M31.738 44.65c-1.476-5.252.217-10.45 3.928-13.663",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M36.48 30.336c1.476-1.085 3.223-1.877 5.176-2.29 7.564-1.584 15.388 3.256 17.483 10.798 2.094 7.531-2.312 14.943-9.854 16.56-5.806 1.248-11.774-1.291-15.203-5.958",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 Processing.displayName = "Processing";
 var stdin_default = (0, import_core.createBaseComponent)(Processing);