@semcore/illustration 2.29.0 → 2.30.0-prerelease.0

package/HorizontalBarChart/index.mjs

@@ -1,71 +1,77 @@
 import React from "react";
 import { createBaseComponent } from "@semcore/core";
 import { Box } from "@semcore/flex-box";
-const HorizontalBarChart = ({ 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: "M26.955 1c-.451 0-.902.18-1.173.541l-13.89 13.89c-14.523 14.523-14.523 38.155 0 52.677 14.522 14.522 38.154 14.522 52.676 0l13.89-13.89c.362-.361.542-.722.542-1.173V1.992c0-.541-.451-.992-.992-.992H26.955Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M65.925 57.617s.086-.054.119-.087l6.495-4.323-3.134-1.697-3.134.757-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.502 6.502 0 0 0-.216.367v.021a5.638 5.638 0 0 0-.454 4.247l10.44 36.649a2.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.77 53.553 24.098 66.555a2.734 2.734 0 0 1-3.35-1.892L9.755 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33Z",
-  fill: "#fff"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M65.448 18.818 11.065 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.884-8.743c3.134-.638 6.225 1.286 7.025 4.377l1.221 4.669Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M18.404 23.428a1.873 1.873 0 0 1-1.416 2.366c-1.08.238-2.226-.454-2.528-1.523a1.868 1.868 0 0 1 1.426-2.367c1.092-.227 2.216.465 2.518 1.534v-.01Z",
-  fill: "#fff"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M25.375 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.183-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.08-.227 2.172.465 2.464 1.524v.01Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M11.087 30.862s.324-3.156.605-6.387l-1.372-3.08-3.416 5.879a6.51 6.51 0 0 0-.216.367v.022a5.638 5.638 0 0 0-.454 4.247l1.395 4.907 3.458-5.966v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M71.77 53.553 24.098 66.555a2.734 2.734 0 0 1-3.35-1.892L9.755 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33ZM21.44 30.445l8.96 31.396",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m39.11 36.056-11.824 2.799-1.697-5.955 11.953-2.723a.793.793 0 0 1 .94.562l1.21 4.344a.794.794 0 0 1-.583.984v-.011Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m62.377 40.292-32.39 8.106-1.675-5.912 32.563-7.867a.804.804 0 0 1 .951.562l1.124 4.139a.789.789 0 0 1-.573.972Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M57.244 51.393 32.69 57.89l-1.665-5.869L55.71 45.71a.795.795 0 0 1 .962.55l1.134 4.162a.795.795 0 0 1-.562.972Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m26.438 35.61 2.356-3.465M34.979 30.83l-5.103 7.442M39.004 32.722l-2.72 3.968",
-  stroke: "#6C6E79",
-  strokeMiterlimit: "10",
-  strokeWidth: ".7"
-}));
+import { useColorResolver } from "@semcore/utils/lib/use/useColorResolver";
+const HorizontalBarChart = ({ 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: "M26.955 1c-.451 0-.902.18-1.173.541l-13.89 13.89c-14.523 14.523-14.523 38.155 0 52.677 14.522 14.522 38.154 14.522 52.676 0l13.89-13.89c.362-.361.542-.722.542-1.173V1.992c0-.541-.451-.992-.992-.992H26.955Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M65.925 57.617s.086-.054.119-.087l6.495-4.323-3.134-1.697-3.134.757-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.502 6.502 0 0 0-.216.367v.021a5.638 5.638 0 0 0-.454 4.247l10.44 36.649a2.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.77 53.553 24.098 66.555a2.734 2.734 0 0 1-3.35-1.892L9.755 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M65.448 18.818 11.065 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.884-8.743c3.134-.638 6.225 1.286 7.025 4.377l1.221 4.669Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M18.404 23.428a1.873 1.873 0 0 1-1.416 2.366c-1.08.238-2.226-.454-2.528-1.523a1.868 1.868 0 0 1 1.426-2.367c1.092-.227 2.216.465 2.518 1.534v-.01Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M25.375 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.183-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.08-.227 2.172.465 2.464 1.524v.01Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M11.087 30.862s.324-3.156.605-6.387l-1.372-3.08-3.416 5.879a6.51 6.51 0 0 0-.216.367v.022a5.638 5.638 0 0 0-.454 4.247l1.395 4.907 3.458-5.966v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M71.77 53.553 24.098 66.555a2.734 2.734 0 0 1-3.35-1.892L9.755 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33ZM21.44 30.445l8.96 31.396",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m39.11 36.056-11.824 2.799-1.697-5.955 11.953-2.723a.793.793 0 0 1 .94.562l1.21 4.344a.794.794 0 0 1-.583.984v-.011Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m62.377 40.292-32.39 8.106-1.675-5.912 32.563-7.867a.804.804 0 0 1 .951.562l1.124 4.139a.789.789 0 0 1-.573.972Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M57.244 51.393 32.69 57.89l-1.665-5.869L55.71 45.71a.795.795 0 0 1 .962.55l1.134 4.162a.795.795 0 0 1-.562.972Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m26.438 35.61 2.356-3.465M34.979 30.83l-5.103 7.442M39.004 32.722l-2.72 3.968",
+    stroke: resolvedSecondaryColor,
+    strokeMiterlimit: "10",
+    strokeWidth: ".7"
+  }));
+};
 HorizontalBarChart.displayName = "HorizontalBarChart";
 var stdin_default = createBaseComponent(HorizontalBarChart);
 export {

package/KagiChart/index.d.ts

@@ -1,4 +1,28 @@
 
-import { Box } from '@semcore/flex-box';
-declare const _default: typeof Box;
-export default _default;    
+import { BoxProps } from '@semcore/flex-box';
+import { Intergalactic } from '@semcore/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/KagiChart/index.js

@@ -26,51 +26,57 @@ module.exports = __toCommonJS(stdin_exports);
 var import_react = __toESM(require("react"));
 var import_core = require("@semcore/core");
 var import_flex_box = require("@semcore/flex-box");
-const KagiChart = ({ 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: "M39.368 3.294 23.005 20.459l-21.5 10.189c-.475.235-.633.705-.396 1.175l11.383 20.77 3.082 23.435c.08.47.554.784 1.028.706L40 72.423l23.398 4.31c.474.079.948-.235 1.027-.705l3.083-23.435 11.383-20.77c.237-.392.08-.94-.395-1.175l-21.5-10.19L40.631 3.294c-.316-.392-.87-.392-1.264 0Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M65.925 57.617s.086-.054.119-.086l6.495-4.324-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.638 5.638 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.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M65.438 18.818 11.054 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.885-8.743c3.134-.638 6.225 1.286 7.024 4.377l1.222 4.669Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M18.39 23.427a1.873 1.873 0 0 1-1.415 2.367c-1.081.238-2.227-.454-2.53-1.524a1.868 1.868 0 0 1 1.427-2.366c1.092-.227 2.216.464 2.519 1.534v-.01Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M25.372 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.07-.227 2.172.465 2.464 1.524v.01Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M11.087 30.862s.324-3.156.605-6.387l-1.372-3.08-3.416 5.879a6.504 6.504 0 0 0-.216.367v.022a5.637 5.637 0 0 0-.454 4.247l1.395 4.907 3.458-5.966v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M71.759 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33v0Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m22.684 54.081 6.744-1.73 1.361 4.843 6.593-1.74-2.972-10.776 6.528-1.61 1.772 6.495 6.377-1.642-4.659-17.174 6.345-1.47 4.571 17.033 6.139-1.578-3.999-15.055 6.106-1.415",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+var import_useColorResolver = require("@semcore/utils/lib/use/useColorResolver");
+const KagiChart = ({ 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: "M39.368 3.294 23.005 20.459l-21.5 10.189c-.475.235-.633.705-.396 1.175l11.383 20.77 3.082 23.435c.08.47.554.784 1.028.706L40 72.423l23.398 4.31c.474.079.948-.235 1.027-.705l3.083-23.435 11.383-20.77c.237-.392.08-.94-.395-1.175l-21.5-10.19L40.631 3.294c-.316-.392-.87-.392-1.264 0Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M65.925 57.617s.086-.054.119-.086l6.495-4.324-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.638 5.638 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.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M65.438 18.818 11.054 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.885-8.743c3.134-.638 6.225 1.286 7.024 4.377l1.222 4.669Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M18.39 23.427a1.873 1.873 0 0 1-1.415 2.367c-1.081.238-2.227-.454-2.53-1.524a1.868 1.868 0 0 1 1.427-2.366c1.092-.227 2.216.464 2.519 1.534v-.01Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M25.372 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.07-.227 2.172.465 2.464 1.524v.01Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M11.087 30.862s.324-3.156.605-6.387l-1.372-3.08-3.416 5.879a6.504 6.504 0 0 0-.216.367v.022a5.637 5.637 0 0 0-.454 4.247l1.395 4.907 3.458-5.966v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M71.759 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33v0Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m22.684 54.081 6.744-1.73 1.361 4.843 6.593-1.74-2.972-10.776 6.528-1.61 1.772 6.495 6.377-1.642-4.659-17.174 6.345-1.47 4.571 17.033 6.139-1.578-3.999-15.055 6.106-1.415",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 KagiChart.displayName = "KagiChart";
 var stdin_default = (0, import_core.createBaseComponent)(KagiChart);

package/KagiChart/index.mjs

@@ -1,52 +1,58 @@
 import React from "react";
 import { createBaseComponent } from "@semcore/core";
 import { Box } from "@semcore/flex-box";
-const KagiChart = ({ 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: "M39.368 3.294 23.005 20.459l-21.5 10.189c-.475.235-.633.705-.396 1.175l11.383 20.77 3.082 23.435c.08.47.554.784 1.028.706L40 72.423l23.398 4.31c.474.079.948-.235 1.027-.705l3.083-23.435 11.383-20.77c.237-.392.08-.94-.395-1.175l-21.5-10.19L40.631 3.294c-.316-.392-.87-.392-1.264 0Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M65.925 57.617s.086-.054.119-.086l6.495-4.324-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.638 5.638 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.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33Z",
-  fill: "#fff"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M65.438 18.818 11.054 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.885-8.743c3.134-.638 6.225 1.286 7.024 4.377l1.222 4.669Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M18.39 23.427a1.873 1.873 0 0 1-1.415 2.367c-1.081.238-2.227-.454-2.53-1.524a1.868 1.868 0 0 1 1.427-2.366c1.092-.227 2.216.464 2.519 1.534v-.01Z",
-  fill: "#fff"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M25.372 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.07-.227 2.172.465 2.464 1.524v.01Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M11.087 30.862s.324-3.156.605-6.387l-1.372-3.08-3.416 5.879a6.504 6.504 0 0 0-.216.367v.022a5.637 5.637 0 0 0-.454 4.247l1.395 4.907 3.458-5.966v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M71.759 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33v0Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m22.684 54.081 6.744-1.73 1.361 4.843 6.593-1.74-2.972-10.776 6.528-1.61 1.772 6.495 6.377-1.642-4.659-17.174 6.345-1.47 4.571 17.033 6.139-1.578-3.999-15.055 6.106-1.415",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+import { useColorResolver } from "@semcore/utils/lib/use/useColorResolver";
+const KagiChart = ({ 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: "M39.368 3.294 23.005 20.459l-21.5 10.189c-.475.235-.633.705-.396 1.175l11.383 20.77 3.082 23.435c.08.47.554.784 1.028.706L40 72.423l23.398 4.31c.474.079.948-.235 1.027-.705l3.083-23.435 11.383-20.77c.237-.392.08-.94-.395-1.175l-21.5-10.19L40.631 3.294c-.316-.392-.87-.392-1.264 0Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M65.925 57.617s.086-.054.119-.086l6.495-4.324-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.638 5.638 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.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M65.438 18.818 11.054 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.885-8.743c3.134-.638 6.225 1.286 7.024 4.377l1.222 4.669Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M18.39 23.427a1.873 1.873 0 0 1-1.415 2.367c-1.081.238-2.227-.454-2.53-1.524a1.868 1.868 0 0 1 1.427-2.366c1.092-.227 2.216.464 2.519 1.534v-.01Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M25.372 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.184-.454-2.475-1.524-.292-1.07.324-2.118 1.405-2.345 1.07-.227 2.172.465 2.464 1.524v.01Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M11.087 30.862s.324-3.156.605-6.387l-1.372-3.08-3.416 5.879a6.504 6.504 0 0 0-.216.367v.022a5.637 5.637 0 0 0-.454 4.247l1.395 4.907 3.458-5.966v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M71.759 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.744 26.07c-.962-3.372 1.157-6.852 4.593-7.555l42.874-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.445 36.075a2.73 2.73 0 0 1-1.923 3.33v0Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m22.684 54.081 6.744-1.73 1.361 4.843 6.593-1.74-2.972-10.776 6.528-1.61 1.772 6.495 6.377-1.642-4.659-17.174 6.345-1.47 4.571 17.033 6.139-1.578-3.999-15.055 6.106-1.415",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 KagiChart.displayName = "KagiChart";
 var stdin_default = createBaseComponent(KagiChart);
 export {

package/LineChart/index.d.ts

@@ -1,4 +1,28 @@
 
-import { Box } from '@semcore/flex-box';
-declare const _default: typeof Box;
-export default _default;    
+import { BoxProps } from '@semcore/flex-box';
+import { Intergalactic } from '@semcore/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/LineChart/index.js

@@ -26,54 +26,60 @@ module.exports = __toCommonJS(stdin_exports);
 var import_react = __toESM(require("react"));
 var import_core = require("@semcore/core");
 var import_flex_box = require("@semcore/flex-box");
-const LineChart = ({ 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: "M71.183 27a46.187 46.187 0 0 0-1.727-15.715c-.083-.33-.412-.658-.74-.74A46.189 46.189 0 0 0 53 8.815l-4.114-4.113a12.515 12.515 0 0 0-17.772 0L27 8.816a46.189 46.189 0 0 0-15.715 1.728c-.33.083-.658.412-.74.74A46.188 46.188 0 0 0 8.815 27l-4.113 4.114a12.515 12.515 0 0 0 0 17.772L8.816 53a46.188 46.188 0 0 0 1.728 15.715c.083.33.412.658.74.74A46.187 46.187 0 0 0 27 71.184l4.114 4.114a12.515 12.515 0 0 0 17.772 0L53 71.183a46.187 46.187 0 0 0 15.715-1.727c.33-.083.658-.412.74-.74A46.187 46.187 0 0 0 71.184 53l4.114-4.114a12.515 12.515 0 0 0 0-17.772L71.183 27Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M65.925 57.617s.086-.054.119-.087l6.495-4.323-3.134-1.697-3.134.757-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.502 6.502 0 0 0-.216.367v.021a5.638 5.638 0 0 0-.454 4.247l10.44 36.649a2.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.76 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.746 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.873-8.743c3.135-.638 6.226 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M65.448 18.818 11.065 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.884-8.743c3.134-.638 6.225 1.286 7.025 4.377l1.221 4.669Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M18.39 23.428a1.873 1.873 0 0 1-1.415 2.366c-1.081.238-2.227-.454-2.53-1.523a1.868 1.868 0 0 1 1.427-2.367c1.092-.227 2.216.465 2.518 1.534v-.01Z",
-  fill: "#fff"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M25.375 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.183-.454-2.475-1.524-.291-1.07.325-2.118 1.405-2.345 1.081-.227 2.172.465 2.464 1.524v.01Z",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M11.087 30.862s.325-3.156.606-6.387l-1.373-3.08-3.415 5.879a6.504 6.504 0 0 0-.216.367v.022a5.637 5.637 0 0 0-.454 4.247l1.394 4.907 3.458-5.966v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M71.76 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.746 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.873-8.743c3.135-.638 6.226 1.286 7.025 4.377l3.059 11.683 6.387 24.392a2.73 2.73 0 0 1-1.924 3.33Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M19.936 61.83c1.502-8.375 3.307-15.357 8.203-16.718 7.209-2.01 13.628 7.608 18.913 4.301 4.442-2.777 3.2-14.763 11.65-21.042 1.676-1.243 4.302-2.151 7.642-2.735.291-.054.594-.097.907-.15",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M61.342 27.857c.443 1.675-.368 3.296-1.816 3.642-1.448.346-3.005-.746-3.458-2.421-.454-1.675.367-3.329 1.837-3.653 1.47-.324 2.994.767 3.447 2.442l-.01-.01ZM30.765 44.517c.444 1.676-.367 3.297-1.815 3.643-1.46.346-3.005-.746-3.459-2.421-.454-1.675.368-3.329 1.838-3.653 1.47-.324 2.993.767 3.447 2.442l-.01-.01ZM49.682 48.814c.443 1.675-.368 3.297-1.816 3.642-1.448.346-3.004-.745-3.458-2.42-.454-1.676.367-3.33 1.837-3.654 1.46-.324 2.994.768 3.448 2.443l-.011-.01Z",
-  fill: "#6C6E79"
-}));
+var import_useColorResolver = require("@semcore/utils/lib/use/useColorResolver");
+const LineChart = ({ 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: "M71.183 27a46.187 46.187 0 0 0-1.727-15.715c-.083-.33-.412-.658-.74-.74A46.189 46.189 0 0 0 53 8.815l-4.114-4.113a12.515 12.515 0 0 0-17.772 0L27 8.816a46.189 46.189 0 0 0-15.715 1.728c-.33.083-.658.412-.74.74A46.188 46.188 0 0 0 8.815 27l-4.113 4.114a12.515 12.515 0 0 0 0 17.772L8.816 53a46.188 46.188 0 0 0 1.728 15.715c.083.33.412.658.74.74A46.187 46.187 0 0 0 27 71.184l4.114 4.114a12.515 12.515 0 0 0 17.772 0L53 71.183a46.187 46.187 0 0 0 15.715-1.727c.33-.083.658-.412.74-.74A46.187 46.187 0 0 0 71.184 53l4.114-4.114a12.515 12.515 0 0 0 0-17.772L71.183 27Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M65.925 57.617s.086-.054.119-.087l6.495-4.323-3.134-1.697-3.134.757-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.502 6.502 0 0 0-.216.367v.021a5.638 5.638 0 0 0-.454 4.247l10.44 36.649a2.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.76 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.746 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.873-8.743c3.135-.638 6.226 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M65.448 18.818 11.065 30.76l-1.34-4.69c-.962-3.372 1.156-6.852 4.593-7.555l42.884-8.743c3.134-.638 6.225 1.286 7.025 4.377l1.221 4.669Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M18.39 23.428a1.873 1.873 0 0 1-1.415 2.366c-1.081.238-2.227-.454-2.53-1.523a1.868 1.868 0 0 1 1.427-2.367c1.092-.227 2.216.465 2.518 1.534v-.01Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M25.375 21.958c.292 1.059-.324 2.107-1.394 2.334-1.07.227-2.183-.454-2.475-1.524-.291-1.07.325-2.118 1.405-2.345 1.081-.227 2.172.465 2.464 1.524v.01Z",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M11.087 30.862s.325-3.156.606-6.387l-1.373-3.08-3.415 5.879a6.504 6.504 0 0 0-.216.367v.022a5.637 5.637 0 0 0-.454 4.247l1.394 4.907 3.458-5.966v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M71.76 53.553 24.087 66.555a2.734 2.734 0 0 1-3.35-1.892L9.746 26.07c-.962-3.372 1.156-6.852 4.593-7.555l42.873-8.743c3.135-.638 6.226 1.286 7.025 4.377l3.059 11.683 6.387 24.392a2.73 2.73 0 0 1-1.924 3.33Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M19.936 61.83c1.502-8.375 3.307-15.357 8.203-16.718 7.209-2.01 13.628 7.608 18.913 4.301 4.442-2.777 3.2-14.763 11.65-21.042 1.676-1.243 4.302-2.151 7.642-2.735.291-.054.594-.097.907-.15",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M61.342 27.857c.443 1.675-.368 3.296-1.816 3.642-1.448.346-3.005-.746-3.458-2.421-.454-1.675.367-3.329 1.837-3.653 1.47-.324 2.994.767 3.447 2.442l-.01-.01ZM30.765 44.517c.444 1.676-.367 3.297-1.815 3.643-1.46.346-3.005-.746-3.459-2.421-.454-1.675.368-3.329 1.838-3.653 1.47-.324 2.993.767 3.447 2.442l-.01-.01ZM49.682 48.814c.443 1.675-.368 3.297-1.816 3.642-1.448.346-3.004-.745-3.458-2.42-.454-1.676.367-3.33 1.837-3.654 1.46-.324 2.994.768 3.448 2.443l-.011-.01Z",
+    fill: resolvedSecondaryColor
+  }));
+};
 LineChart.displayName = "LineChart";
 var stdin_default = (0, import_core.createBaseComponent)(LineChart);