@semcore/illustration 2.29.0 → 2.30.0-prerelease.0

package/CHANGELOG.md

@@ -2,6 +2,16 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
+## [2.30.0] - 2024-07-09
+
+### Added
+
+- `primaryColor` and `secondaryColor` prop that allow to change primary color of illustrations.
+
+### Fixed
+
+- Illustration components typings.
+
 ## [2.29.0] - 2024-06-26
 
 ### Changed
@@ -524,7 +534,7 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 
 ### Added
 
-- Added available for export function `getIllustrationPath` to get url of illustrations.
+- Added available for export function `getIllustrationPath` to get URL of illustrations.
 
 ## [1.1.0] - 2022-09-21
 

package/ChoroplethMapChart/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/ChoroplethMapChart/index.js

@@ -26,79 +26,85 @@ 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 ChoroplethMapChart = ({ 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.959 1C18.46 1 1 15.865 1 37.502 1 58.89 21.838 68.305 39.465 78.876c.33.165.74.165 1.07 0C58.573 68.636 79 58.891 79 37.502 78.918 15.948 61.539 1 39.959 1Z",
-  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.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 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.452 18.818 11.07 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.394 23.427a1.873 1.873 0 0 1-1.416 2.367c-1.08.238-2.226-.454-2.529-1.524a1.868 1.868 0 0 1 1.427-2.366c1.091-.227 2.215.464 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-.292-1.07.324-2.118 1.405-2.345 1.08-.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.415 5.879a6.51 6.51 0 0 0-.217.367v.022a5.638 5.638 0 0 0-.453 4.247l1.394 4.907 3.458-5.966v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M71.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33v0Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m19.636 37.994-.519 3.264 3.123-.746 2.184 2.605.55 3.069 2.378 2.205 3.967.151 1.426.303-1.361-.843-2.551-1.578.378-.487 1.297.033 2.432-3.242 2.064-1.74-2.55-1.881-.8.227-.227 1.783-.865.022-1.513-1.178 2.054-2.032-1.049-1.21-.637.108-1.081.918-7.328-1.232-1.372 1.48Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m33.017 33.731 3.977-2.799 1.913.735-.086 4.301-2.897 2.832-.713-.227-1.037-4.323-1.038-.065-.119-.454ZM32.086 50.378l1.502-2.713 5.112 1.46.919.032.076 2.29-2.843 3.621.627 1.719-.573.497-1.902-1.157-.983-4.312-1.935-1.437Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m41.384 46.005 1.697 1.264 2.69-1.08.606.205.875 3.393.681 1.06 1.08.529 1.017-.281.659-.908 1.654-6.29-4.183-2.745-2.097.54-1.815-.032-2.627 1.783-.237 2.562Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m40.928 40.382.065 1.156.66.238 2.16-1.708 2.087.4 2.204-.54.249.195-.313 1.026 2.799 1.762 1.361-.562-.162-.605-1.577-.843.497-.487 2.312.508 1.114 1.103.994.68.627-.161.151-1.233.757-.734.886.626 1.07.108.454-.41-.195-.757.249-.313.853.043.638-.8.346-.497-.367-.508-.865-.756 1.33-1.557.172-.93-.108-1.318-.065-.237-1.07.043-.432-.238-.216-.8 1.275-.68.162-.465.638-.778.843.724.68.432.552-.173-.951-3.61-1.221-.605-7.674 2.507-1.07.627-.346-.389.249-.692-.27-.28-1.794.41-1.362 3.837-2.518 1.718-2.562-.562-1.729 2.54.919 1.21-2.486 2.335Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "m61.98 45.577 2.302-2.13 1.394-.356.908.097.162.627 1.243 1.027-.519 2.431-1.426.379-1.016-.822-2.41.627-.638-1.88Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+var import_useColorResolver = require("@semcore/utils/lib/use/useColorResolver");
+const ChoroplethMapChart = ({ 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.959 1C18.46 1 1 15.865 1 37.502 1 58.89 21.838 68.305 39.465 78.876c.33.165.74.165 1.07 0C58.573 68.636 79 58.891 79 37.502 78.918 15.948 61.539 1 39.959 1Z",
+    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.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 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.452 18.818 11.07 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.394 23.427a1.873 1.873 0 0 1-1.416 2.367c-1.08.238-2.226-.454-2.529-1.524a1.868 1.868 0 0 1 1.427-2.366c1.091-.227 2.215.464 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-.292-1.07.324-2.118 1.405-2.345 1.08-.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.415 5.879a6.51 6.51 0 0 0-.217.367v.022a5.638 5.638 0 0 0-.453 4.247l1.394 4.907 3.458-5.966v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M71.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33v0Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m19.636 37.994-.519 3.264 3.123-.746 2.184 2.605.55 3.069 2.378 2.205 3.967.151 1.426.303-1.361-.843-2.551-1.578.378-.487 1.297.033 2.432-3.242 2.064-1.74-2.55-1.881-.8.227-.227 1.783-.865.022-1.513-1.178 2.054-2.032-1.049-1.21-.637.108-1.081.918-7.328-1.232-1.372 1.48Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m33.017 33.731 3.977-2.799 1.913.735-.086 4.301-2.897 2.832-.713-.227-1.037-4.323-1.038-.065-.119-.454ZM32.086 50.378l1.502-2.713 5.112 1.46.919.032.076 2.29-2.843 3.621.627 1.719-.573.497-1.902-1.157-.983-4.312-1.935-1.437Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m41.384 46.005 1.697 1.264 2.69-1.08.606.205.875 3.393.681 1.06 1.08.529 1.017-.281.659-.908 1.654-6.29-4.183-2.745-2.097.54-1.815-.032-2.627 1.783-.237 2.562Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m40.928 40.382.065 1.156.66.238 2.16-1.708 2.087.4 2.204-.54.249.195-.313 1.026 2.799 1.762 1.361-.562-.162-.605-1.577-.843.497-.487 2.312.508 1.114 1.103.994.68.627-.161.151-1.233.757-.734.886.626 1.07.108.454-.41-.195-.757.249-.313.853.043.638-.8.346-.497-.367-.508-.865-.756 1.33-1.557.172-.93-.108-1.318-.065-.237-1.07.043-.432-.238-.216-.8 1.275-.68.162-.465.638-.778.843.724.68.432.552-.173-.951-3.61-1.221-.605-7.674 2.507-1.07.627-.346-.389.249-.692-.27-.28-1.794.41-1.362 3.837-2.518 1.718-2.562-.562-1.729 2.54.919 1.21-2.486 2.335Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "m61.98 45.577 2.302-2.13 1.394-.356.908.097.162.627 1.243 1.027-.519 2.431-1.426.379-1.016-.822-2.41.627-.638-1.88Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 ChoroplethMapChart.displayName = "ChoroplethMapChart";
 var stdin_default = (0, import_core.createBaseComponent)(ChoroplethMapChart);

package/ChoroplethMapChart/index.mjs

@@ -1,80 +1,86 @@
 import React from "react";
 import { createBaseComponent } from "@semcore/core";
 import { Box } from "@semcore/flex-box";
-const ChoroplethMapChart = ({ 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.959 1C18.46 1 1 15.865 1 37.502 1 58.89 21.838 68.305 39.465 78.876c.33.165.74.165 1.07 0C58.573 68.636 79 58.891 79 37.502 78.918 15.948 61.539 1 39.959 1Z",
-  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.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33Z",
-  fill: "#fff"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M65.452 18.818 11.07 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.394 23.427a1.873 1.873 0 0 1-1.416 2.367c-1.08.238-2.226-.454-2.529-1.524a1.868 1.868 0 0 1 1.427-2.366c1.091-.227 2.215.464 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.415 5.879a6.51 6.51 0 0 0-.217.367v.022a5.638 5.638 0 0 0-.453 4.247l1.394 4.907 3.458-5.966v.01Z",
-  fill: "#6C6E79"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "M71.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33v0Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m19.636 37.994-.519 3.264 3.123-.746 2.184 2.605.55 3.069 2.378 2.205 3.967.151 1.426.303-1.361-.843-2.551-1.578.378-.487 1.297.033 2.432-3.242 2.064-1.74-2.55-1.881-.8.227-.227 1.783-.865.022-1.513-1.178 2.054-2.032-1.049-1.21-.637.108-1.081.918-7.328-1.232-1.372 1.48Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m33.017 33.731 3.977-2.799 1.913.735-.086 4.301-2.897 2.832-.713-.227-1.037-4.323-1.038-.065-.119-.454ZM32.086 50.378l1.502-2.713 5.112 1.46.919.032.076 2.29-2.843 3.621.627 1.719-.573.497-1.902-1.157-.983-4.312-1.935-1.437Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m41.384 46.005 1.697 1.264 2.69-1.08.606.205.875 3.393.681 1.06 1.08.529 1.017-.281.659-.908 1.654-6.29-4.183-2.745-2.097.54-1.815-.032-2.627 1.783-.237 2.562Z",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m40.928 40.382.065 1.156.66.238 2.16-1.708 2.087.4 2.204-.54.249.195-.313 1.026 2.799 1.762 1.361-.562-.162-.605-1.577-.843.497-.487 2.312.508 1.114 1.103.994.68.627-.161.151-1.233.757-.734.886.626 1.07.108.454-.41-.195-.757.249-.313.853.043.638-.8.346-.497-.367-.508-.865-.756 1.33-1.557.172-.93-.108-1.318-.065-.237-1.07.043-.432-.238-.216-.8 1.275-.68.162-.465.638-.778.843.724.68.432.552-.173-.951-3.61-1.221-.605-7.674 2.507-1.07.627-.346-.389.249-.692-.27-.28-1.794.41-1.362 3.837-2.518 1.718-2.562-.562-1.729 2.54.919 1.21-2.486 2.335Z",
-  fill: "#E0E1E9",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ React.createElement("path", {
-  d: "m61.98 45.577 2.302-2.13 1.394-.356.908.097.162.627 1.243 1.027-.519 2.431-1.426.379-1.016-.822-2.41.627-.638-1.88Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+import { useColorResolver } from "@semcore/utils/lib/use/useColorResolver";
+const ChoroplethMapChart = ({ 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.959 1C18.46 1 1 15.865 1 37.502 1 58.89 21.838 68.305 39.465 78.876c.33.165.74.165 1.07 0C58.573 68.636 79 58.891 79 37.502 78.918 15.948 61.539 1 39.959 1Z",
+    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.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33Z",
+    fill: "#fff"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M65.452 18.818 11.07 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.394 23.427a1.873 1.873 0 0 1-1.416 2.367c-1.08.238-2.226-.454-2.529-1.524a1.868 1.868 0 0 1 1.427-2.366c1.091-.227 2.215.464 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.415 5.879a6.51 6.51 0 0 0-.217.367v.022a5.638 5.638 0 0 0-.453 4.247l1.394 4.907 3.458-5.966v.01Z",
+    fill: resolvedSecondaryColor
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "M71.763 53.553 24.091 66.555a2.734 2.734 0 0 1-3.35-1.892L9.749 26.07c-.961-3.372 1.157-6.852 4.594-7.555l42.873-8.743c3.134-.638 6.225 1.286 7.025 4.377l9.446 36.075a2.73 2.73 0 0 1-1.924 3.33v0Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m19.636 37.994-.519 3.264 3.123-.746 2.184 2.605.55 3.069 2.378 2.205 3.967.151 1.426.303-1.361-.843-2.551-1.578.378-.487 1.297.033 2.432-3.242 2.064-1.74-2.55-1.881-.8.227-.227 1.783-.865.022-1.513-1.178 2.054-2.032-1.049-1.21-.637.108-1.081.918-7.328-1.232-1.372 1.48Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m33.017 33.731 3.977-2.799 1.913.735-.086 4.301-2.897 2.832-.713-.227-1.037-4.323-1.038-.065-.119-.454ZM32.086 50.378l1.502-2.713 5.112 1.46.919.032.076 2.29-2.843 3.621.627 1.719-.573.497-1.902-1.157-.983-4.312-1.935-1.437Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m41.384 46.005 1.697 1.264 2.69-1.08.606.205.875 3.393.681 1.06 1.08.529 1.017-.281.659-.908 1.654-6.29-4.183-2.745-2.097.54-1.815-.032-2.627 1.783-.237 2.562Z",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m40.928 40.382.065 1.156.66.238 2.16-1.708 2.087.4 2.204-.54.249.195-.313 1.026 2.799 1.762 1.361-.562-.162-.605-1.577-.843.497-.487 2.312.508 1.114 1.103.994.68.627-.161.151-1.233.757-.734.886.626 1.07.108.454-.41-.195-.757.249-.313.853.043.638-.8.346-.497-.367-.508-.865-.756 1.33-1.557.172-.93-.108-1.318-.065-.237-1.07.043-.432-.238-.216-.8 1.275-.68.162-.465.638-.778.843.724.68.432.552-.173-.951-3.61-1.221-.605-7.674 2.507-1.07.627-.346-.389.249-.692-.27-.28-1.794.41-1.362 3.837-2.518 1.718-2.562-.562-1.729 2.54.919 1.21-2.486 2.335Z",
+    fill: resolvedPrimaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ React.createElement("path", {
+    d: "m61.98 45.577 2.302-2.13 1.394-.356.908.097.162.627 1.243 1.027-.519 2.431-1.426.379-1.016-.822-2.41.627-.638-1.88Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 ChoroplethMapChart.displayName = "ChoroplethMapChart";
 var stdin_default = createBaseComponent(ChoroplethMapChart);
 export {

package/Coffee/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/Coffee/index.js

@@ -26,64 +26,70 @@ 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 Coffee = ({ 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: "M57.811 4.702c-7.315 0-13.78 3.558-17.813 9.006C35.93 8.216 29.4 4.647 22.03 4.702 10.184 4.779.46 14.095.018 25.93c-.928 24.576 34.687 50.08 39.46 53.384.321.22.73.22 1.04 0C45.19 75.954 80 50.14 80 26.89c0-12.255-9.934-22.178-22.178-22.178",
-  fill: "#E0E1E9"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M43.678 64.804c14.64 0 26.51-2.939 26.51-6.564s-11.87-6.564-26.51-6.564c-14.641 0-26.51 2.94-26.51 6.564 0 3.625 11.869 6.564 26.51 6.564Z",
-  fill: "#fff",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M43.678 64.815c-13.493 0-24.62-2.497-26.29-5.724.94 2.796 4.034 5.945 6.532 7.67.331.264.762.53 1.26.773.077.044.165.088.231.121 3.47 1.614 10.332 2.719 18.245 2.719 7.912 0 14.774-1.105 18.244-2.719.077-.033.154-.088.232-.121a6.89 6.89 0 0 0 1.26-.774c2.508-1.724 5.59-4.873 6.53-7.669-1.668 3.227-12.796 5.724-26.289 5.724h.045Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M61.645 41.555c2.42-.597 3.78-.265 4.851.784 2.73 2.697-.928 10.41-8.188 12.476M26.472 60.66c-.42-.375-.64-.762-.64-1.17 0-2.443 7.989-4.42 17.834-4.42 4.863 0 9.272.486 12.498 1.26",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M43.678 43.875c10.167 0 18.41-2.622 18.41-5.856 0-3.235-8.243-5.857-18.41-5.857-10.168 0-18.41 2.622-18.41 5.857 0 3.234 8.242 5.856 18.41 5.856Z",
-  fill: "#fff",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M43.678 43.876c5.978 0 11.271-.907 14.63-2.321-1.779-2.044-7.647-3.547-14.63-3.547-6.984 0-12.852 1.503-14.63 3.547 3.358 1.403 8.652 2.32 14.63 2.32Z",
-  fill: "#6C6E79",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M62.088 38.019c0 3.237-8.244 5.856-18.41 5.856s-18.41-2.619-18.41-5.856c-1.249 10.575 3.713 19.404 8.442 22.819 1.536 1.27 5.415 2.176 9.957 2.176 4.541 0 8.42-.906 9.956-2.177 4.73-3.414 9.702-12.243 8.443-22.818h.022Z",
-  fill: "#fff",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}), /* @__PURE__ */ import_react.default.createElement("path", {
-  d: "M32.981 49.323c.64-1.569 2.133-2.52 3.624-2.387 1.57.144 2.454 1.415 2.575 1.603M56.165 49.323c-.641-1.57-2.133-2.52-3.625-2.387-1.57.144-2.453 1.415-2.575 1.602M40.252 50.97c-.332 2.818 2.155 5.039 4.564 4.917 2.276-.11 4.398-2.287 4.066-4.917h-8.63ZM51.877 1c1.636 1.249 4.83 3.68 5.315 7.636 1.116 8.984-12.63 12.343-10.31 18.575M44.097 8.735c5.868 7.514-10.288 15.526-8.254 25.007.364 1.724 1.624 4.288 4.376 6.056",
-  stroke: "#6C6E79",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  strokeWidth: ".7"
-}));
+var import_useColorResolver = require("@semcore/utils/lib/use/useColorResolver");
+const Coffee = ({ 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: "M57.811 4.702c-7.315 0-13.78 3.558-17.813 9.006C35.93 8.216 29.4 4.647 22.03 4.702 10.184 4.779.46 14.095.018 25.93c-.928 24.576 34.687 50.08 39.46 53.384.321.22.73.22 1.04 0C45.19 75.954 80 50.14 80 26.89c0-12.255-9.934-22.178-22.178-22.178",
+    fill: resolvedPrimaryColor
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M43.678 64.804c14.64 0 26.51-2.939 26.51-6.564s-11.87-6.564-26.51-6.564c-14.641 0-26.51 2.94-26.51 6.564 0 3.625 11.869 6.564 26.51 6.564Z",
+    fill: "#fff",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M43.678 64.815c-13.493 0-24.62-2.497-26.29-5.724.94 2.796 4.034 5.945 6.532 7.67.331.264.762.53 1.26.773.077.044.165.088.231.121 3.47 1.614 10.332 2.719 18.245 2.719 7.912 0 14.774-1.105 18.244-2.719.077-.033.154-.088.232-.121a6.89 6.89 0 0 0 1.26-.774c2.508-1.724 5.59-4.873 6.53-7.669-1.668 3.227-12.796 5.724-26.289 5.724h.045Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M61.645 41.555c2.42-.597 3.78-.265 4.851.784 2.73 2.697-.928 10.41-8.188 12.476M26.472 60.66c-.42-.375-.64-.762-.64-1.17 0-2.443 7.989-4.42 17.834-4.42 4.863 0 9.272.486 12.498 1.26",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M43.678 43.875c10.167 0 18.41-2.622 18.41-5.856 0-3.235-8.243-5.857-18.41-5.857-10.168 0-18.41 2.622-18.41 5.857 0 3.234 8.242 5.856 18.41 5.856Z",
+    fill: "#fff",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M43.678 43.876c5.978 0 11.271-.907 14.63-2.321-1.779-2.044-7.647-3.547-14.63-3.547-6.984 0-12.852 1.503-14.63 3.547 3.358 1.403 8.652 2.32 14.63 2.32Z",
+    fill: resolvedSecondaryColor,
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M62.088 38.019c0 3.237-8.244 5.856-18.41 5.856s-18.41-2.619-18.41-5.856c-1.249 10.575 3.713 19.404 8.442 22.819 1.536 1.27 5.415 2.176 9.957 2.176 4.541 0 8.42-.906 9.956-2.177 4.73-3.414 9.702-12.243 8.443-22.818h.022Z",
+    fill: "#fff",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }), /* @__PURE__ */ import_react.default.createElement("path", {
+    d: "M32.981 49.323c.64-1.569 2.133-2.52 3.624-2.387 1.57.144 2.454 1.415 2.575 1.603M56.165 49.323c-.641-1.57-2.133-2.52-3.625-2.387-1.57.144-2.453 1.415-2.575 1.602M40.252 50.97c-.332 2.818 2.155 5.039 4.564 4.917 2.276-.11 4.398-2.287 4.066-4.917h-8.63ZM51.877 1c1.636 1.249 4.83 3.68 5.315 7.636 1.116 8.984-12.63 12.343-10.31 18.575M44.097 8.735c5.868 7.514-10.288 15.526-8.254 25.007.364 1.724 1.624 4.288 4.376 6.056",
+    stroke: resolvedSecondaryColor,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: ".7"
+  }));
+};
 Coffee.displayName = "Coffee";
 var stdin_default = (0, import_core.createBaseComponent)(Coffee);