@particle-network/icons 0.3.1 → 0.4.0-beta.0

package/dist/web/ListCopyUpIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const ListCopyUpIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const ListCopyUpIcon = ({ size = 16, width = size, height = size, color = 'curre
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M19.18 2C19.9279 2 20.6452 2.29711 21.174 2.82596C21.7029 3.35481 22 4.07209 22 4.82V15.0767C22.0001 15.4471 21.9273 15.8139 21.7857 16.1562C21.644 16.4984 21.4363 16.8094 21.1744 17.0714C20.9126 17.3334 20.6016 17.5412 20.2594 17.683C19.9172 17.8248 19.5504 17.8978 19.18 17.8978L17.8967 17.8967V19.3256C17.8967 20.7433 16.7944 21.9033 15.3989 21.9944L15.2233 22H5.84556C4.86205 21.9998 3.91599 21.6229 3.2018 20.9467C2.4876 20.2705 2.05953 19.3465 2.00556 18.3644L2 18.1533V8.77556C2 7.35889 3.10333 6.19778 4.49778 6.10889L4.67444 6.10222H6.10222V4.82C6.10222 4.44958 6.1752 4.08279 6.31699 3.74058C6.45878 3.39837 6.66659 3.08744 6.92857 2.82557C7.19055 2.56369 7.50156 2.35599 7.84382 2.21434C8.18609 2.07269 8.55291 1.99985 8.92333 2H19.1789H19.18ZM6.10222 7.64H4.67444C4.08889 7.64 3.60778 8.08444 3.54556 8.65333L3.53889 8.77556V18.1533C3.53889 19.3733 4.48333 20.3711 5.68111 20.4556L5.84667 20.4611H15.2244C15.8089 20.4611 16.2911 20.0189 16.3522 19.45L16.3589 19.3256V17.8967H8.92333C8.55291 17.8968 8.18609 17.824 7.84382 17.6823C7.50156 17.5407 7.19055 17.333 6.92857 17.0711C6.66659 16.8092 6.45878 16.4983 6.31699 16.1561C6.1752 15.8139 6.10222 15.4471 6.10222 15.0767V7.64ZM19.18 3.53889H8.92222C8.21444 3.53889 7.64 4.11222 7.64 4.82V15.0767C7.64 15.7844 8.21444 16.3589 8.92222 16.3589H19.1778C19.8867 16.3589 20.46 15.7844 20.46 15.0767V4.82222C20.46 4.11333 19.8867 3.54 19.1789 3.54L19.18 3.53889ZM11.4867 11.2311H16.6156C16.811 11.2302 16.9995 11.3038 17.1426 11.4369C17.2858 11.57 17.3728 11.7527 17.3861 11.9477C17.3994 12.1427 17.338 12.3354 17.2142 12.4867C17.0905 12.6381 16.9138 12.7366 16.72 12.7622L16.6156 12.7689H11.4867C11.2913 12.7695 11.103 12.6957 10.9601 12.5625C10.8172 12.4293 10.7303 12.2467 10.7172 12.0518C10.704 11.8569 10.7656 11.6642 10.8893 11.5131C11.013 11.3619 11.1897 11.2634 11.3833 11.2378L11.4867 11.2311ZM16.6156 7.12778C16.8196 7.12778 17.0153 7.20884 17.1596 7.35314C17.3039 7.49744 17.385 7.69315 17.385 7.89722C17.385 8.10129 17.3039 8.297 17.1596 8.4413C17.0153 8.5856 16.8196 8.66667 16.6156 8.66667H11.4867C11.2826 8.66667 11.0869 8.5856 10.9426 8.4413C10.7983 8.297 10.7172 8.10129 10.7172 7.89722C10.7172 7.69315 10.7983 7.49744 10.9426 7.35314C11.0869 7.20884 11.2826 7.12778 11.4867 7.12778H16.6156Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/ListHistoryIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const ListHistoryIcon_ListHistoryIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const ListHistoryIcon_ListHistoryIcon = ({ size = 16, width = size, height = siz
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M16.6924 9.97852C19.6483 10.1284 21.9989 12.5732 21.999 15.5664L21.9922 15.8545C21.8423 18.8105 19.3976 21.1611 16.4043 21.1611L16.1162 21.1543C13.2558 21.009 10.9615 18.7149 10.8164 15.8545L10.8096 15.5664C10.8097 12.4768 13.3147 9.97193 16.4043 9.97168L16.6924 9.97852ZM15.6416 2.83887C16.7501 2.83887 17.6176 3.7289 17.666 4.86621V8.09766C17.666 8.49685 17.3425 8.8211 16.9434 8.82129C16.5441 8.82129 16.2197 8.49696 16.2197 8.09766V4.86621C16.2195 4.52021 15.9307 4.27345 15.6416 4.27344H4.02539C3.68812 4.27344 3.44746 4.56959 3.44727 4.86621V18.6152C3.44727 18.9614 3.73619 19.209 4.02539 19.209H10.1162C10.5394 19.2092 10.8828 19.5523 10.8828 19.9756C10.8827 20.3988 10.5394 20.742 10.1162 20.7422H4.02539C2.91684 20.7422 2.00109 19.8024 2.00098 18.665V4.91602C2.00098 3.77853 2.91678 2.83887 4.02539 2.83887H15.6416ZM16.4043 11.4268C14.1181 11.427 12.2648 13.2801 12.2646 15.5664C12.2646 17.8528 14.118 19.7058 16.4043 19.7061C18.6908 19.7061 20.5439 17.8529 20.5439 15.5664C20.5438 13.28 18.6907 11.4268 16.4043 11.4268ZM16.4795 13.0625C16.8193 13.0625 17.0946 13.3379 17.0947 13.6777V15.2998H18.7178L18.8418 15.3125C19.122 15.37 19.3329 15.6188 19.333 15.916C19.3328 16.2131 19.1219 16.4611 18.8418 16.5186L18.7178 16.5312H16.4795C16.1399 16.531 15.8645 16.2556 15.8643 15.916V13.6777C15.8643 13.3381 16.1399 13.0627 16.4795 13.0625ZM8.46289 14.5586C8.8725 14.5586 9.20493 14.8902 9.20508 15.2998C9.20508 15.7095 8.87259 16.042 8.46289 16.042H6.43555C6.03633 16.0419 5.71289 15.7094 5.71289 15.2998C5.71303 14.8903 6.03642 14.5587 6.43555 14.5586H8.46289ZM9.57812 10.9482C9.98779 10.9482 10.3202 11.2808 10.3203 11.6904C10.3203 12.1001 9.98783 12.4326 9.57812 12.4326H6.28711C5.88798 12.4324 5.56445 12.1 5.56445 11.6904C5.56452 11.2809 5.88802 10.9485 6.28711 10.9482H9.57812ZM13.4209 7.33594C13.8202 7.33594 14.1445 7.66844 14.1445 8.07812C14.1445 8.48783 13.8202 8.82031 13.4209 8.82031H6.28711C5.88798 8.8201 5.56445 8.4877 5.56445 8.07812C5.56447 7.66857 5.88799 7.33615 6.28711 7.33594H13.4209Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/ListIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const ListIcon_ListIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const ListIcon_ListIcon = ({ size = 16, width = size, height = size, color = 'cu
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M18.3555 2C19.5685 2 20.5183 2.99419 20.5713 4.26465V19.6787C20.5713 20.9494 19.5686 21.999 18.3555 21.999H5.64453C4.4314 21.999 3.42871 20.9494 3.42871 19.6787V4.32031C3.42873 3.04966 4.43141 2 5.64453 2H18.3555ZM5.64453 3.60254C5.27548 3.60254 5.01196 3.93332 5.01172 4.26465V19.624C5.01197 20.0105 5.32818 20.2861 5.64453 20.2861H18.3027C18.6718 20.2861 18.9353 19.9553 18.9355 19.624H18.9883V4.26465C18.988 3.87816 18.6718 3.60254 18.3555 3.60254H5.64453ZM12.0781 15.0908C12.5149 15.091 12.8691 15.4624 12.8691 15.9199C12.8691 16.3774 12.5149 16.7478 12.0781 16.748H8.28027C7.84337 16.748 7.48935 16.3775 7.48926 15.9199C7.48926 15.4622 7.84332 15.0908 8.28027 15.0908H12.0781ZM15.9277 11.0576C16.3647 11.0576 16.7197 11.4291 16.7197 11.8867C16.7197 12.3444 16.3647 12.7158 15.9277 12.7158H8.12207C7.68512 12.7158 7.33105 12.3444 7.33105 11.8867C7.33108 11.4291 7.68513 11.0576 8.12207 11.0576H15.9277ZM15.9277 7.02539C16.3646 7.02539 16.7196 7.39597 16.7197 7.85352C16.7197 8.31119 16.3647 8.68262 15.9277 8.68262H8.12207C7.68512 8.68262 7.33105 8.31119 7.33105 7.85352C7.3312 7.39597 7.6852 7.02539 8.12207 7.02539H15.9277Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/ListSettingIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const ListSettingIcon_ListSettingIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const ListSettingIcon_ListSettingIcon = ({ size = 16, width = size, height = siz
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M13.5957 7.60059C13.5958 5.66868 15.1618 4.10254 17.0937 4.10254C19.0256 4.10261 20.5917 5.66872 20.5918 7.60059C20.5918 9.5325 19.0256 11.0986 17.0937 11.0986C15.1618 11.0986 13.5957 9.53254 13.5957 7.60059ZM12.7031 14.6787C12.7031 13.9345 13.3076 13.3303 14.0518 13.3301L19.0254 13.3301C19.7697 13.3301 20.374 13.9344 20.374 14.6787L20.374 19.6523C20.3737 20.3964 19.7695 21 19.0254 21L14.0518 21C13.3078 20.9998 12.7035 20.3963 12.7031 19.6523L12.7031 14.6787ZM14.9951 7.60059C14.9951 8.75976 15.9346 9.69922 17.0937 9.69922C18.2529 9.69915 19.1924 8.75972 19.1924 7.60059C19.1923 6.4415 18.2528 5.50202 17.0937 5.50195C15.9346 5.50195 14.9952 6.44146 14.9951 7.60059ZM18.9199 19.5469L18.9199 14.7832L14.1562 14.7832L14.1562 19.5469L18.9199 19.5469ZM4 14.6787C4 13.9346 4.60362 13.3304 5.34766 13.3301L10.3213 13.3301C11.0656 13.3301 11.6699 13.9344 11.6699 14.6787L11.6699 19.6523C11.6696 20.3964 11.0654 21 10.3213 21L5.34766 21C4.60382 20.9997 4.00033 20.3962 4 19.6523L4 14.6787ZM4 5.34766C4.00017 4.60369 4.60372 4.00033 5.34766 4L10.3213 4C11.0655 4 11.6697 4.60349 11.6699 5.34766L11.6699 10.3213C11.6697 11.0654 11.0655 11.6699 10.3213 11.6699L5.34766 11.6699C4.60374 11.6696 4.0002 11.0652 4 10.3213L4 5.34766ZM10.2168 19.5469L10.2168 14.7832L5.45312 14.7832L5.45312 19.5469L10.2168 19.5469ZM10.2168 10.2168L10.2168 5.45312L5.45312 5.45312L5.45312 10.2168L10.2168 10.2168Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/ListSettingsIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const ListSettingsIcon_ListSettingsIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const ListSettingsIcon_ListSettingsIcon = ({ size = 16, width = size, height = s
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M15.1592 11.3975C15.4266 11.3975 15.6917 11.5102 15.8701 11.709C15.9254 11.7702 16.0607 11.9014 16.2217 12.0146C16.394 12.1358 16.5413 12.1971 16.6309 12.1973C16.7198 12.1972 16.8659 12.1364 17.0371 12.0176C17.1966 11.9069 17.3314 11.779 17.3867 11.7188L17.457 11.6494C17.6299 11.4974 17.8604 11.4122 18.0918 11.4121C18.2222 11.4121 18.3497 11.439 18.4678 11.4932L18.4844 11.501L18.4971 11.5068L18.5088 11.5137L19.7402 12.2373L19.7529 12.2451L19.7656 12.2539L19.7803 12.2646C20.128 12.5217 20.2501 13.0075 20.085 13.4053V13.4072C20.0845 13.4084 20.084 13.4106 20.083 13.4131C20.0808 13.4188 20.0773 13.428 20.0732 13.4395C20.0649 13.463 20.0532 13.4974 20.042 13.5371C20.0186 13.6204 20 13.7147 20 13.793C20.0001 14.3645 20.4364 14.8024 20.9395 14.8027H20.9902C21.4186 14.8029 21.6699 15.1827 21.7383 15.5645C21.7423 15.587 21.8467 16.1719 21.8467 16.6426C21.8467 16.8827 21.8199 17.1513 21.793 17.3604L21.7383 17.7207C21.6742 18.079 21.4487 18.4346 21.0674 18.4775L20.9893 18.4814H20.9395C20.4363 18.4818 20.0001 18.9206 20 19.4922C20 19.5697 20.0184 19.6641 20.042 19.748C20.0607 19.8147 20.08 19.8642 20.085 19.877L20.1338 20.0303C20.2052 20.342 20.1173 20.6815 19.8984 20.9141L19.7783 21.0205L19.7637 21.0312L19.752 21.04L19.7393 21.0479L18.4746 21.7871L18.4619 21.793L18.4463 21.8008C18.33 21.8538 18.2043 21.8798 18.0762 21.8799C17.8035 21.8796 17.5346 21.7606 17.3574 21.5537C17.3001 21.4875 17.1616 21.3484 16.998 21.2285C16.8214 21.0991 16.6707 21.0332 16.5791 21.0332C16.4975 21.0336 16.3555 21.0909 16.1826 21.2119C16.0207 21.3252 15.8779 21.4611 15.8066 21.543C15.6295 21.7466 15.3638 21.8642 15.0938 21.8643C14.996 21.8642 14.8992 21.849 14.8076 21.8184L14.7168 21.7822L14.7012 21.7744L14.6885 21.7695L14.6768 21.7617L13.4688 21.0469L13.457 21.04L13.4453 21.0312L13.4316 21.0215L13.4307 21.0205C13.0825 20.7623 12.9589 20.2741 13.126 19.876C13.1299 19.8659 13.1488 19.816 13.168 19.748C13.1914 19.6648 13.21 19.5707 13.21 19.4922C13.2099 18.9204 12.7739 18.4814 12.2705 18.4814H12.2373C12.2325 18.4816 12.2263 18.4824 12.2207 18.4824C11.7924 18.4822 11.54 18.1024 11.4717 17.7207C11.4674 17.6969 11.3643 17.1107 11.3643 16.6426C11.3643 16.1744 11.4675 15.5882 11.4717 15.5645L11.5059 15.4219C11.6056 15.0938 11.8452 14.8031 12.2197 14.8027H12.2705C12.7738 14.8027 13.2098 14.3647 13.21 13.793C13.21 13.7136 13.1914 13.6191 13.168 13.5361C13.1463 13.4595 13.125 13.4063 13.125 13.4062C12.9596 13.0081 13.0839 12.5204 13.4326 12.2637L13.4482 12.2529L13.46 12.2441L13.4727 12.2363L14.748 11.4951L14.7607 11.4883L14.7734 11.4824L14.7891 11.4756C14.9054 11.4231 15.0312 11.3975 15.1592 11.3975ZM16.375 3C17.5433 3 18.4579 3.93806 18.5088 5.13672V8.54199C18.5088 8.96272 18.1678 9.30455 17.7471 9.30469C17.3264 9.30449 16.9854 8.96268 16.9854 8.54199V5.13672C16.9853 4.77197 16.6797 4.51172 16.375 4.51172H4.13379C3.77847 4.51193 3.52353 4.82417 3.52344 5.13672V19.626C3.52344 19.9907 3.82913 20.2508 4.13379 20.251H10.5518C10.9979 20.251 11.3604 20.6134 11.3604 21.0596C11.3602 21.5056 10.9978 21.8672 10.5518 21.8672H4.13379C2.96564 21.867 2 20.8764 2 19.6777V5.18945C2 3.99084 2.96564 3.00021 4.13379 3H16.375ZM14.3701 13.1943C14.4144 13.3563 14.46 13.5699 14.46 13.793C14.4598 14.9066 13.7005 15.8594 12.6631 16.0557C12.6396 16.2295 12.6133 16.4571 12.6133 16.6426C12.6133 16.828 12.6397 17.0549 12.6631 17.2285C13.7006 17.4248 14.4599 18.3785 14.46 19.4922C14.46 19.716 14.4146 19.9304 14.3701 20.0928L15.0537 20.498C15.1336 20.421 15.2377 20.3273 15.3574 20.2344C15.7561 19.9252 16.1687 19.7434 16.5791 19.7432C16.9938 19.7432 17.4104 19.929 17.8115 20.2441C17.9328 20.3395 18.0372 20.4345 18.1172 20.5127L18.8389 20.0908C18.7947 19.9288 18.75 19.715 18.75 19.4922C18.7501 18.3788 19.5097 17.425 20.5469 17.2285C20.5703 17.0549 20.5967 16.8279 20.5967 16.6426C20.5967 16.4576 20.5703 16.2298 20.5469 16.0557C19.5098 15.8591 18.7501 14.9063 18.75 13.793C18.75 13.5694 18.7945 13.3546 18.8389 13.1924L18.125 12.7725C18.0458 12.8458 17.943 12.9362 17.8232 13.0254C17.4317 13.3168 17.0288 13.4883 16.6309 13.4883C16.2289 13.4882 15.8226 13.3137 15.4287 13.0166C15.3074 12.9251 15.2028 12.8328 15.123 12.7578L14.3701 13.1943ZM16.584 14.499C17.7205 14.4992 18.6182 15.4721 18.6182 16.6357C18.6182 17.7993 17.7205 18.7723 16.584 18.7725C15.4475 18.7722 14.5488 17.7993 14.5488 16.6357C14.5488 15.4722 15.4475 14.4993 16.584 14.499ZM7.89844 16C8.33011 16.0001 8.67969 16.3505 8.67969 16.7822C8.67945 17.2137 8.32996 17.5634 7.89844 17.5635H5.76172C5.34132 17.5631 5.00023 17.2136 5 16.7822C5 16.3507 5.34118 16.0003 5.76172 16H7.89844ZM16.584 15.7891C16.166 15.7893 15.7988 16.1543 15.7988 16.6357C15.7988 17.1172 16.1661 17.4822 16.584 17.4824C17.002 17.4822 17.3691 17.1173 17.3691 16.6357C17.3691 16.1543 17.002 15.7893 16.584 15.7891ZM9.22949 12C9.66126 12 10.0117 12.3505 10.0117 12.7822C10.0115 13.2138 9.66112 13.5635 9.22949 13.5635H5.76172C5.34132 13.5631 5.00023 13.2136 5 12.7822C5 12.3507 5.34118 12.0003 5.76172 12H9.22949ZM13.2793 8C13.7001 8 14.042 8.35046 14.042 8.78223C14.0418 9.2138 13.7 9.56348 13.2793 9.56348H5.76172C5.34132 9.56315 5.00023 9.21359 5 8.78223C5 8.35066 5.34118 8.00033 5.76172 8H13.2793Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/Lock2Icon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const Lock2Icon_Lock2Icon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const Lock2Icon_Lock2Icon = ({ size = 16, width = size, height = size, color = '
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M11.9785 2.29688C15 2.29699 17.4492 4.74605 17.4492 7.76758V9.62695H19.1973C19.5086 9.62695 19.8072 9.75062 20.0273 9.9707C20.2475 10.1908 20.371 10.4895 20.3711 10.8008V20.5293C20.3711 20.8407 20.2476 21.1392 20.0273 21.3594C19.8071 21.5796 19.5087 21.7031 19.1973 21.7031H4.80273C4.49131 21.7031 4.19286 21.5796 3.97266 21.3594C3.75245 21.1392 3.62891 20.8407 3.62891 20.5293V10.8008C3.62901 10.4895 3.75254 10.1908 3.97266 9.9707C4.19285 9.75062 4.4914 9.62695 4.80273 9.62695H6.50684V7.76758C6.50684 4.74598 8.95692 2.29688 11.9785 2.29688ZM5.44727 11.1113C5.35983 11.1113 5.2757 11.1462 5.21387 11.208C5.15204 11.2698 5.11719 11.354 5.11719 11.4414V19.8848C5.11719 19.9722 5.15204 20.0563 5.21387 20.1182C5.2757 20.18 5.35983 20.2148 5.44727 20.2148H18.5527C18.6402 20.2148 18.7243 20.18 18.7861 20.1182C18.848 20.0563 18.8828 19.9722 18.8828 19.8848V11.4414C18.8828 11.354 18.848 11.2698 18.7861 11.208C18.7243 11.1462 18.6402 11.1113 18.5527 11.1113H5.44727ZM12 13.748C12.1975 13.748 12.3867 13.8262 12.5264 13.9658C12.666 14.1054 12.7441 14.2947 12.7441 14.4922V16.834C12.7441 17.0314 12.666 17.2207 12.5264 17.3604C12.3867 17.5 12.1975 17.5781 12 17.5781C11.8025 17.5781 11.6133 17.5 11.4736 17.3604C11.334 17.2207 11.2559 17.0314 11.2559 16.834V14.4922C11.2559 14.2947 11.334 14.1054 11.4736 13.9658C11.6133 13.8262 11.8025 13.748 12 13.748ZM11.9785 3.78516C9.7793 3.78516 7.99609 5.56837 7.99609 7.76758V9.62695H15.96V7.76758C15.96 5.56844 14.1776 3.78527 11.9785 3.78516Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/LockIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const LockIcon_LockIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const LockIcon_LockIcon = ({ size = 16, width = size, height = size, color = 'cu
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M12.0001 2C13.3169 1.99937 14.4397 2.46412 15.3692 3.39356C16.2987 4.32304 16.763 5.44561 16.7618 6.76172V8.66699H17.714C18.2376 8.66699 18.6864 8.85344 19.0597 9.22656C19.433 9.59986 19.6198 10.0482 19.6192 10.5713V20.0957C19.6191 20.6193 19.4323 21.0682 19.0597 21.4414C18.6871 21.8144 18.2382 22.0006 17.714 22H6.28622C5.76267 22 5.31408 21.8138 4.9415 21.4414C4.56894 21.0688 4.3817 20.6199 4.38095 20.0957V10.5713C4.38098 10.0476 4.56823 9.59922 4.9415 9.22656C5.31475 8.85407 5.76322 8.66765 6.28622 8.66699H7.23837V6.76172C7.23842 5.44436 7.70311 4.32176 8.63193 3.39356C9.56078 2.46539 10.6834 2.00066 12.0001 2ZM5.90439 20.4766H18.0948V10.1914H5.90439V20.4766ZM12.002 13.6191C12.4766 13.6203 12.8774 13.7875 13.214 14.124C13.5503 14.4605 13.7163 14.8603 13.7169 15.334C13.7174 15.8074 13.5517 16.2078 13.214 16.5449C12.8761 16.8821 12.4758 17.0478 12.003 17.0479C11.5337 17.0501 11.133 16.8848 10.7931 16.5449C10.453 16.2049 10.2865 15.8042 10.2882 15.334C10.29 14.8629 10.4566 14.4624 10.7931 14.123C11.1287 13.7845 11.5284 13.6181 12.002 13.6191ZM11.9991 3.52441C11.1057 3.5245 10.3339 3.842 9.70615 4.46973C9.07856 5.09748 8.76083 5.86933 8.76083 6.7627V8.66699H15.2374V6.7627C15.2374 5.86933 14.9197 5.09747 14.2921 4.46973C13.6644 3.84204 12.8925 3.52448 11.9991 3.52441Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/MailHeartIcon.js

@@ -1,11 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MailHeartIcon_MailHeartIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
-    const stroke = props.stroke || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsxs("svg", {
         width: width,
         height: height,
@@ -15,11 +13,11 @@ const MailHeartIcon_MailHeartIcon = ({ size = 16, width = size, height = size, c
         children: [
             /*#__PURE__*/ jsx("path", {
                 d: "M6.09459 19.997C5.81836 19.9961 5.54501 19.9407 5.29019 19.8341C5.03537 19.7274 4.80408 19.5716 4.60954 19.3754C4.415 19.1793 4.26103 18.9468 4.15645 18.6911C4.05186 18.4354 3.99871 18.1616 4.00002 17.8854V11.1734C4.00023 10.6253 4.21336 10.0987 4.59445 9.7047C4.97553 9.31074 5.49475 9.08022 6.04256 9.0618V5.87541C6.04096 5.38013 6.23597 4.90446 6.58478 4.55284C6.93359 4.20121 7.40768 4.00238 7.90295 4H16.1091C16.6042 4.00291 17.078 4.20191 17.4267 4.55342C17.7754 4.90492 17.9706 5.38029 17.9695 5.87541V9.0618C18.5175 9.07973 19.037 9.31009 19.4182 9.70416C19.7994 10.0982 20.0123 10.6251 20.012 11.1734V17.8884C20.0133 18.1647 19.9602 18.4384 19.8556 18.6941C19.751 18.9498 19.5971 19.1823 19.4025 19.3785C19.208 19.5746 18.9767 19.7304 18.7219 19.8371C18.467 19.9437 18.1937 19.9991 17.9175 20H6.09459V19.997ZM5.0328 17.8854C5.03173 18.1683 5.14294 18.44 5.34201 18.6409C5.54108 18.8419 5.81174 18.9556 6.09459 18.9572H17.9175C18.2003 18.9556 18.471 18.8419 18.67 18.6409C18.8691 18.44 18.9803 18.1683 18.9793 17.8854V12.06L17.9685 12.5944L18 12.5L17.8154 12.6755L11.956 15.7708L5.0318 12.1111L5.0328 17.8854ZM11.957 14.5979L16.9367 11.966V5.87441C16.9375 5.65374 16.8509 5.44173 16.6958 5.28476C16.5407 5.12779 16.3298 5.03863 16.1091 5.03678H7.90295C7.68221 5.03837 7.4711 5.12744 7.31595 5.28447C7.1608 5.4415 7.07426 5.65366 7.07533 5.87441V12.018L11.957 14.5979ZM6.04256 11.4736V10.1046C5.80725 10.1165 5.58273 10.2069 5.40493 10.3615C5.22713 10.5161 5.10631 10.7259 5.06182 10.9572L6.04256 11.4736ZM17.9695 11.4196L18.9402 10.9072C18.8858 10.6868 18.7622 10.4896 18.5875 10.3446C18.4128 10.1996 18.1962 10.1144 17.9695 10.1016V11.4196ZM9.45111 10.2047C9.23403 10.0196 9.05989 9.78937 8.94081 9.53013C8.82173 9.27089 8.76057 8.98881 8.76159 8.70353C8.75679 8.19177 8.95508 7.69898 9.313 7.33317C9.67093 6.96737 10.1593 6.7584 10.671 6.75206C10.9201 6.75148 11.1667 6.80067 11.3965 6.89674C11.6263 6.9928 11.8345 7.13381 12.009 7.31148C12.1838 7.13408 12.392 6.99325 12.6218 6.89721C12.8515 6.80116 13.098 6.75182 13.347 6.75206C13.8588 6.7584 14.3471 6.96737 14.7051 7.33317C15.063 7.69898 15.2613 8.19177 15.2565 8.70353C15.2588 9.20947 15.0655 9.69674 14.7171 10.0635L12.009 12.6235L9.45111 10.2047ZM10.668 7.91293C10.462 7.91636 10.2656 8.00124 10.122 8.14902C9.97833 8.2968 9.89904 8.49545 9.90145 8.70153C9.90113 8.81775 9.92612 8.93265 9.97468 9.03824C10.0232 9.14383 10.0942 9.23759 10.1827 9.31298L10.2027 9.33L12.004 11.0373L13.9055 9.23593C14.0362 9.08882 14.1076 8.89833 14.1056 8.70153C14.1083 8.49537 14.0291 8.29657 13.8854 8.14873C13.7417 8.0009 13.5452 7.9161 13.339 7.91293C13.2253 7.91318 13.113 7.93904 13.0107 7.98858C12.9083 8.03813 12.8184 8.1101 12.7476 8.19915L12.003 9.12584L11.2565 8.19715C11.1854 8.10929 11.0958 8.03824 10.9941 7.9891C10.8924 7.93996 10.781 7.91395 10.668 7.91293Z",
-                fill: fill
+                fill: _color
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M17.9685 12.5944L18.9793 12.06V17.8854C18.9803 18.1683 18.8691 18.44 18.67 18.6409C18.471 18.8419 18.2003 18.9556 17.9175 18.9572H6.09459C5.81174 18.9556 5.54108 18.8419 5.34201 18.6409C5.14294 18.44 5.03173 18.1683 5.0328 17.8854L5.0318 12.1111L11.956 15.7708L17.8154 12.6755M17.9685 12.5944L18 12.5L17.8154 12.6755M17.9685 12.5944L17.8154 12.6755M6.09459 19.997C5.81836 19.9961 5.54501 19.9407 5.29019 19.8341C5.03537 19.7274 4.80408 19.5716 4.60954 19.3754C4.415 19.1793 4.26103 18.9468 4.15645 18.6911C4.05186 18.4354 3.99871 18.1616 4.00002 17.8854V11.1734C4.00023 10.6253 4.21336 10.0987 4.59445 9.7047C4.97553 9.31074 5.49475 9.08022 6.04256 9.0618V5.87541C6.04096 5.38013 6.23597 4.90446 6.58478 4.55284C6.93359 4.20121 7.40768 4.00238 7.90295 4H16.1091C16.6042 4.00291 17.078 4.20191 17.4267 4.55342C17.7754 4.90492 17.9706 5.38029 17.9695 5.87541V9.0618C18.5175 9.07973 19.037 9.31009 19.4182 9.70416C19.7994 10.0982 20.0123 10.6251 20.012 11.1734V17.8884C20.0134 18.1647 19.9602 18.4384 19.8556 18.6941C19.751 18.9498 19.5971 19.1823 19.4025 19.3785C19.208 19.5746 18.9767 19.7304 18.7219 19.8371C18.467 19.9437 18.1937 19.9991 17.9175 20H6.09459V19.997ZM11.957 14.5979L16.9367 11.966V5.87441C16.9375 5.65374 16.8509 5.44173 16.6958 5.28476C16.5407 5.12779 16.3298 5.03863 16.1091 5.03678H7.90295C7.68221 5.03837 7.4711 5.12744 7.31595 5.28447C7.1608 5.4415 7.07426 5.65366 7.07533 5.87441V12.018L11.957 14.5979ZM6.04256 11.4736V10.1046C5.80725 10.1165 5.58273 10.2069 5.40493 10.3615C5.22713 10.5161 5.10631 10.7259 5.06182 10.9572L6.04256 11.4736ZM17.9695 11.4196L18.9402 10.9072C18.8858 10.6868 18.7622 10.4896 18.5875 10.3446C18.4128 10.1996 18.1962 10.1144 17.9695 10.1016V11.4196ZM9.45111 10.2047C9.23403 10.0196 9.05989 9.78937 8.94081 9.53013C8.82173 9.27089 8.76057 8.98881 8.76159 8.70353C8.75679 8.19177 8.95508 7.69898 9.313 7.33317C9.67093 6.96737 10.1593 6.7584 10.671 6.75206C10.9201 6.75148 11.1667 6.80067 11.3965 6.89674C11.6263 6.9928 11.8345 7.13381 12.009 7.31148C12.1838 7.13408 12.392 6.99325 12.6218 6.89721C12.8515 6.80116 13.098 6.75182 13.347 6.75206C13.8588 6.7584 14.3471 6.96737 14.7051 7.33317C15.063 7.69898 15.2613 8.19177 15.2565 8.70353C15.2588 9.20947 15.0655 9.69674 14.7171 10.0635L12.009 12.6235L9.45111 10.2047ZM10.668 7.91293C10.462 7.91636 10.2656 8.00124 10.122 8.14902C9.97833 8.2968 9.89904 8.49545 9.90145 8.70153C9.90113 8.81775 9.92612 8.93265 9.97468 9.03824C10.0232 9.14383 10.0942 9.23759 10.1827 9.31298L10.2027 9.33L12.004 11.0373L13.9055 9.23593C14.0362 9.08882 14.1076 8.89833 14.1056 8.70153C14.1083 8.49537 14.0291 8.29657 13.8854 8.14873C13.7417 8.0009 13.5452 7.9161 13.339 7.91293C13.2253 7.91318 13.113 7.93904 13.0107 7.98858C12.9083 8.03813 12.8184 8.1101 12.7476 8.19915L12.003 9.12584L11.2565 8.19715C11.1854 8.10929 11.0958 8.03824 10.9941 7.9891C10.8924 7.93996 10.781 7.91395 10.668 7.91293Z",
-                stroke: stroke,
+                stroke: _color,
                 strokeWidth: 0.2
             })
         ]

package/dist/web/MailIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MailIcon_MailIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const MailIcon_MailIcon = ({ size = 16, width = size, height = size, color = 'cu
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M12.0014 20.4999C14.3529 20.4999 16.7043 20.5001 19.0559 20.4999C20.4154 20.4999 21.5543 19.5942 21.8494 18.269C21.8932 18.0726 21.9146 17.867 21.9147 17.6657C21.9185 13.8882 21.9187 10.1108 21.9168 6.33324C21.9161 4.93159 20.9035 3.75391 19.5132 3.53348C19.3692 3.51067 19.2218 3.5016 19.076 3.50146C14.366 3.4999 9.65584 3.49962 4.94585 3.50047C3.58358 3.50075 2.44798 4.4053 2.15232 5.73116C2.10854 5.92751 2.08729 6.13306 2.08701 6.33437C2.08319 10.1119 2.08319 13.8893 2.08474 17.6669C2.08531 19.0677 3.09922 20.2475 4.48855 20.4666C4.63701 20.49 4.7893 20.4985 4.9399 20.4986C7.29383 20.5005 9.64762 20.4999 12.0014 20.4999ZM3.66603 5.67151C3.69025 5.69461 3.71065 5.71331 3.7302 5.73286C4.61349 6.61601 5.49679 7.49916 6.37994 8.38231C7.58382 9.58605 8.78374 10.7935 9.99287 11.9918C10.7079 12.7006 11.5727 12.9596 12.5624 12.7792C13.1393 12.6741 13.6258 12.3929 14.0393 11.9791C16.114 9.90338 18.1898 7.82853 20.2648 5.75311C20.2881 5.72988 20.3066 5.70197 20.3344 5.66741C20.4476 5.88671 20.5007 6.10147 20.5007 6.32899C20.501 10.1092 20.5009 13.8893 20.5009 17.6694C20.5009 17.8434 20.4688 18.0117 20.4067 18.1742C20.1929 18.7326 19.6701 19.0831 19.0493 19.0831C14.4286 19.0833 9.80799 19.0831 5.18725 19.0831C5.09049 19.0831 4.99288 19.0909 4.89697 19.081C4.76168 19.067 4.62299 19.0549 4.49393 19.0154C3.88887 18.83 3.50084 18.2855 3.50084 17.635C3.5007 13.8784 3.5007 10.122 3.50084 6.3654C3.50084 6.33466 3.50028 6.30392 3.50184 6.27331C3.51274 6.06393 3.56233 5.86489 3.66603 5.67151ZM19.0926 4.91926C19.0686 4.94462 19.0533 4.96176 19.0372 4.97806C17.0355 6.97938 15.0341 8.98071 13.0322 10.9818C12.4472 11.5664 11.5717 11.5685 10.9867 10.9842C8.98264 8.98198 6.9799 6.97867 4.97673 4.97579C4.96115 4.96021 4.94755 4.94278 4.92686 4.91941C9.65202 4.91926 14.3654 4.91926 19.0926 4.91926Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/ManualIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const ManualIcon_ManualIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const ManualIcon_ManualIcon = ({ size = 16, width = size, height = size, color =
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M16.9218 2.35095C17.2102 2.34774 17.4928 2.43199 17.7333 2.59119C17.895 2.69712 18.0339 2.83515 18.1405 2.99646C18.2446 3.15714 18.3168 3.33766 18.3524 3.52576C18.356 3.54585 18.3579 3.5855 18.3593 3.62537C18.3607 3.67016 18.3621 3.72999 18.3632 3.79822C18.3653 3.93486 18.3671 4.11084 18.368 4.28845C18.3688 4.42579 18.3678 4.56471 18.368 4.68787L18.4647 4.70935C18.6671 4.7624 18.8631 4.83832 19.0497 4.93396H19.0536L19.0751 4.94568C19.2675 5.04567 19.4478 5.16721 19.6122 5.30798L19.7714 5.45544L19.9178 5.61462C20.0586 5.77911 20.1809 5.95931 20.2811 6.15173L20.2919 6.17322V6.17615C20.4193 6.4282 20.5112 6.69655 20.5643 6.974L20.5653 6.97498C20.601 7.16655 20.6187 7.36116 20.619 7.55603V18.8021C20.619 18.9004 20.6146 18.9985 20.6053 19.0961C20.5733 19.4755 20.466 19.8446 20.2919 20.183V20.1859L20.2811 20.2074C20.057 20.6362 19.727 21.0015 19.3231 21.2679L19.3221 21.2689C18.9964 21.4785 18.6332 21.6243 18.2528 21.6976H18.2518C18.0601 21.7334 17.8649 21.7511 17.6698 21.7513H6.42371C6.22842 21.7518 6.03263 21.7347 5.8407 21.6986C5.5538 21.6457 5.27589 21.5498 5.01746 21.4144C4.76085 21.2815 4.52636 21.1092 4.32214 20.9047C4.11819 20.6998 3.9461 20.4647 3.81238 20.2084L3.80066 20.1869V20.181C3.67403 19.9296 3.58182 19.6618 3.52917 19.3851C3.49336 19.1933 3.4747 18.9982 3.47449 18.8031V7.55701C3.47413 7.36163 3.49277 7.16595 3.52917 6.974C3.52946 6.97242 3.52888 6.97069 3.52917 6.96912L3.51355 6.97302L3.49695 6.70349C3.49409 6.48982 3.49039 6.21126 3.48718 5.94177C3.4845 5.71655 3.48244 5.49717 3.48132 5.32947C3.48077 5.24596 3.48021 5.17464 3.48035 5.12146C3.48048 5.07163 3.48067 5.03028 3.4823 5.01306C3.4824 4.51533 3.72848 4.05036 3.80652 3.89978C3.85054 3.81487 3.89897 3.73094 3.95203 3.64978C4.16582 3.32604 4.44427 3.04849 4.76843 2.83533L4.76941 2.83435C5.09596 2.62422 5.46026 2.47859 5.84167 2.40564C6.03377 2.3698 6.22927 2.35119 6.42468 2.35095H16.9218ZM6.5321 6.07068C6.17558 6.11514 5.84472 6.18036 5.54382 6.25623C5.50075 6.28415 5.45866 6.3136 5.41882 6.34607L5.41394 6.34998C5.34814 6.40389 5.28735 6.46388 5.2323 6.52869L5.21179 6.5531C5.18103 6.59103 5.15167 6.63051 5.12488 6.67126L5.05066 6.79822C4.98036 6.935 4.93012 7.08173 4.90125 7.23279C4.88217 7.3394 4.87258 7.44772 4.87292 7.55603V18.8051C4.87025 18.9639 4.89156 19.1221 4.9364 19.2738L4.98914 19.4232L4.99011 19.4242C5.04448 19.5623 5.11929 19.6917 5.21277 19.807L5.22156 19.8177C5.27527 19.8826 5.33495 19.9422 5.39929 19.9965L5.4198 20.014C5.45735 20.0446 5.49652 20.0734 5.53699 20.1L5.63367 20.1576C5.73281 20.2118 5.83836 20.2551 5.94714 20.2865L5.96863 20.2924C6.01182 20.3044 6.05546 20.3161 6.09949 20.3246L6.26062 20.3461C6.31439 20.3508 6.36869 20.3531 6.42273 20.3529H17.6718C17.7921 20.3543 17.9126 20.3425 18.0302 20.3177L18.1473 20.2865C18.4348 20.2056 18.6909 20.0385 18.8807 19.808L18.9677 19.6888C19.0492 19.5624 19.1114 19.4242 19.1532 19.2797L19.1639 19.2416C19.2007 19.0984 19.2208 18.951 19.2206 18.8031V7.55603C19.2209 7.44797 19.2104 7.33995 19.1903 7.23376L19.1884 7.22498V7.224C19.18 7.1815 19.1692 7.13985 19.1581 7.099L19.1532 7.08044C19.1391 7.031 19.1222 6.98264 19.1034 6.93591V6.93494C19.0495 6.79687 18.9744 6.66797 18.8807 6.5531L18.8719 6.54236C18.7485 6.39516 18.5978 6.27315 18.4276 6.18396V6.18298C18.2911 6.11347 18.1446 6.06485 17.994 6.0365C17.8871 6.01684 17.7785 6.00633 17.6698 6.00623H7.08875C6.89753 6.02771 6.71159 6.04829 6.5321 6.07068ZM13.5419 12.4808C13.7273 12.4808 13.9059 12.5548 14.037 12.6859C14.1679 12.8169 14.241 12.9948 14.2411 13.1801C14.241 13.3651 14.1677 13.5432 14.037 13.6742C13.9059 13.8051 13.7271 13.8793 13.5419 13.8793H7.54382C7.35862 13.8791 7.18065 13.8052 7.04968 13.6742C6.91882 13.5432 6.84468 13.3652 6.8446 13.1801C6.84468 12.9949 6.91885 12.8169 7.04968 12.6859C7.18065 12.555 7.35864 12.481 7.54382 12.4808H13.5419ZM16.5721 9.48181C16.7575 9.48182 16.9352 9.55586 17.0663 9.68689C17.1973 9.81793 17.2713 9.99571 17.2714 10.181C17.2713 10.3663 17.1972 10.5442 17.0663 10.6752C16.9352 10.8061 16.7574 10.8802 16.5721 10.8802H7.54382C7.35862 10.8801 7.18065 10.8061 7.04968 10.6752C6.9188 10.5442 6.84468 10.3662 6.8446 10.181C6.84466 9.99586 6.91883 9.8179 7.04968 9.68689C7.18065 9.55592 7.35862 9.48195 7.54382 9.48181H16.5721ZM6.42761 3.65759C6.20232 3.65369 5.97788 3.69513 5.76941 3.78064C5.62168 3.83836 5.48414 3.91969 5.36121 4.0199H5.35925C5.27892 4.08526 5.20488 4.1583 5.13953 4.23865V4.2406C5.07347 4.32199 5.01615 4.41036 4.96765 4.5033C4.89296 4.64854 4.83915 4.80382 4.80847 4.96423C4.80179 5.00139 4.79734 5.03906 4.79285 5.07654C5.11301 4.87425 5.46861 4.7337 5.8407 4.66248H5.84167C6.03321 4.62675 6.22789 4.60805 6.42273 4.60779H17.2802V4.25134C17.2799 3.86013 16.9096 3.69289 16.7909 3.65759H6.42761Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/MarketStatsIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MarketStatsIcon_MarketStatsIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const MarketStatsIcon_MarketStatsIcon = ({ size = 16, width = size, height = siz
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M11.5107 2.1604C11.7725 1.94738 12.1431 1.94666 12.4062 2.15845L21.7226 9.67212C22.0365 9.92552 22.0919 10.3923 21.8456 10.7151C21.7027 10.902 21.4907 11.0002 21.2763 11.0002C21.1201 11.0002 20.9625 10.948 20.83 10.8411L11.9608 3.6897L5.77725 8.71899C5.81098 8.80529 5.83028 8.89959 5.82999 8.99829C5.81714 12.9219 5.80507 18.5637 5.81631 20.5139H17.9989V11.5549C17.999 11.1446 18.3224 10.8118 18.7216 10.8118C19.1207 10.8118 19.4442 11.1446 19.4442 11.5549V21.2571C19.444 21.6672 19.1206 22.0002 18.7216 22.0002H5.10733C4.91536 22.0002 4.72998 21.9205 4.59464 21.7805C4.38714 21.5661 4.38225 21.3331 4.37784 21.1282C4.37583 21.034 4.37416 20.8969 4.37296 20.7239C4.37055 20.4019 4.36888 19.9308 4.36807 19.3245C4.36647 18.3048 4.36721 16.8862 4.37003 15.1086C4.37303 13.0521 4.37847 10.9798 4.38174 9.85376L3.17081 10.8401C2.85796 11.0946 2.40251 11.04 2.15518 10.718C1.90797 10.396 1.96114 9.92833 2.27432 9.67407L11.5107 2.1604ZM8.96378 13.7004C9.36286 13.7004 9.68631 14.0334 9.68643 14.4436V18.7786C9.68623 19.1887 9.36281 19.5208 8.96378 19.5208C8.56486 19.5206 8.24132 19.1886 8.24112 18.7786V14.4436C8.24124 14.0335 8.56481 13.7006 8.96378 13.7004ZM11.9755 13.7004C12.3746 13.7004 12.698 14.0334 12.6982 14.4436V18.7786C12.6979 19.1887 12.3745 19.5208 11.9755 19.5208C11.5766 19.5206 11.253 19.1886 11.2528 18.7786V14.4436C11.253 14.0335 11.5765 13.7006 11.9755 13.7004ZM15.1483 12.4622C15.5474 12.4623 15.8709 12.7951 15.871 13.2053V18.7786C15.8708 19.1886 15.5473 19.5206 15.1483 19.5208C14.7493 19.5208 14.4259 19.1887 14.4257 18.7786V13.2053C14.4258 12.7951 14.7492 12.4622 15.1483 12.4622ZM15.3173 8.18579C15.6189 7.91706 16.0754 7.95098 16.3368 8.26099C16.5982 8.571 16.5661 9.04013 16.2646 9.30884L13.2528 11.9915C12.9641 12.2486 12.5296 12.2311 12.2626 11.9504L10.8407 10.4563L8.24991 12.2903C8.12962 12.3755 7.98683 12.421 7.84073 12.4211C7.61103 12.4211 7.3842 12.3086 7.24405 12.0989C7.01795 11.7609 7.101 11.298 7.4296 11.0657L10.5224 8.87817C10.8119 8.67354 11.2024 8.71258 11.4482 8.97095L12.8202 10.4104L15.3173 8.18579Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/MarketTrendIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MarketTrendIcon_MarketTrendIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const MarketTrendIcon_MarketTrendIcon = ({ size = 16, width = size, height = siz
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M19.1572 3.24658C20.173 3.24666 20.9999 4.07347 21 5.08936V15.6313C20.9998 16.647 20.1729 17.474 19.1572 17.4741H12.7031V19.3472H16.5098C16.8979 19.3472 17.2128 19.6622 17.2129 20.0503C17.2129 20.4384 16.8979 20.7534 16.5098 20.7534H7.49023C7.10205 20.7534 6.78711 20.4384 6.78711 20.0503C6.78725 19.6622 7.10213 19.3472 7.49023 19.3472H11.2969V17.4741H4.84277C3.82699 17.474 3.00023 16.647 3 15.6313V5.08936C3.00007 4.07346 3.82688 3.24665 4.84277 3.24658H19.1572ZM4.84375 4.65283C4.60446 4.65283 4.4064 4.8501 4.40625 5.08936V15.6313C4.40637 15.8706 4.60444 16.0679 4.84375 16.0679H19.1582C19.3973 16.0677 19.5946 15.8705 19.5947 15.6313V5.08936C19.5946 4.85022 19.3973 4.65304 19.1582 4.65283H4.84375ZM16.5078 7.23975C16.749 6.99912 17.1399 6.99878 17.3809 7.23975C17.6216 7.48073 17.6214 7.8717 17.3809 8.11279L13.6758 11.8179C13.4879 12.0057 13.2005 12.0518 12.9629 11.9331L10.8906 10.897L7.50098 14.2876C7.25988 14.5286 6.86906 14.5286 6.62793 14.2876C6.38681 14.0465 6.38685 13.6557 6.62793 13.4146L10.333 9.70947L10.4072 9.646C10.5913 9.51291 10.837 9.49039 11.0449 9.59424L13.1172 10.6294L16.5078 7.23975Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/MenuIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MenuIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const MenuIcon = ({ size = 16, width = size, height = size, color = 'currentColo
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M4.66667 17.5H19.3333C19.8375 17.5 20.25 17.0875 20.25 16.5833C20.25 16.0792 19.8375 15.6667 19.3333 15.6667H4.66667C4.1625 15.6667 3.75 16.0792 3.75 16.5833C3.75 17.0875 4.1625 17.5 4.66667 17.5ZM4.66667 12.9167H19.3333C19.8375 12.9167 20.25 12.5042 20.25 12C20.25 11.4958 19.8375 11.0833 19.3333 11.0833H4.66667C4.1625 11.0833 3.75 11.4958 3.75 12C3.75 12.5042 4.1625 12.9167 4.66667 12.9167ZM3.75 7.41667C3.75 7.92083 4.1625 8.33333 4.66667 8.33333H19.3333C19.8375 8.33333 20.25 7.92083 20.25 7.41667C20.25 6.9125 19.8375 6.5 19.3333 6.5H4.66667C4.1625 6.5 3.75 6.9125 3.75 7.41667Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/MoonIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MoonIcon_MoonIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const MoonIcon_MoonIcon = ({ size = 16, width = size, height = size, color = 'cu
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M12.709 21.8015C12.5548 21.8015 12.4006 21.8015 12.242 21.7927C7.13653 21.5637 2.87239 17.4537 2.51558 12.4407C2.20722 8.13691 4.69611 4.11505 8.70475 2.4323C9.84567 1.95655 10.4448 2.32217 10.7003 2.58648C10.9558 2.84197 11.3126 3.43226 10.8368 4.52032C10.4183 5.48503 10.2069 6.51583 10.2157 7.57305C10.2333 11.6125 13.59 15.0397 17.6824 15.2027C18.277 15.2291 18.8585 15.1851 19.4224 15.0838C20.625 14.8635 21.1271 15.3481 21.3166 15.6564C21.506 15.9648 21.7262 16.6299 20.9994 17.6167C19.07 20.2598 15.9996 21.8015 12.709 21.8015ZM3.87235 12.3394C4.18071 16.6784 7.8854 20.2333 12.2949 20.4271C15.2948 20.5725 18.1405 19.2069 19.8893 16.815C20.0259 16.6255 20.0919 16.4846 20.1184 16.4141C20.0347 16.4053 19.8893 16.3965 19.6646 16.4405C18.9995 16.5595 18.3079 16.6035 17.6207 16.5771C12.8059 16.3877 8.86774 12.3482 8.84131 7.58627C8.84131 6.32641 9.088 5.11501 9.59018 3.97408C9.68268 3.77145 9.7003 3.63489 9.70912 3.56441C9.62542 3.56441 9.48005 3.58203 9.24217 3.68335C5.77095 5.14584 3.61686 8.62587 3.87235 12.3394Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/MoveUpRightIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MoveUpRightIcon_MoveUpRightIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const MoveUpRightIcon_MoveUpRightIcon = ({ size = 16, width = size, height = siz
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M17.4564 4.29443C18.7784 4.18634 19.8811 5.33631 19.6907 6.67139L18.7581 13.1978C18.5146 14.9017 16.4303 15.5965 15.2132 14.3794L13.1917 12.3579L6.06085 19.4897C5.63137 19.9191 4.93574 19.919 4.50616 19.4897C4.07659 19.0602 4.07662 18.3637 4.50616 17.9341L11.637 10.8032L9.61945 8.78564C8.40261 7.56852 9.09731 5.48426 10.8011 5.24072L17.3275 4.30811L17.4564 4.29443Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/MusicIcon.js

@@ -1,10 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const MusicIcon_MusicIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsxs("svg", {
         width: width,
         height: height,
@@ -14,11 +13,11 @@ const MusicIcon_MusicIcon = ({ size = 16, width = size, height = size, color = '
         children: [
             /*#__PURE__*/ jsx("path", {
                 d: "M16.9121 4.20681C18.2246 3.94439 19.5373 4.76935 19.7998 6.08181C19.8373 6.26903 19.874 6.41896 19.874 6.60623L19.8379 16.9949C19.8602 17.128 19.875 17.2645 19.875 17.4041C19.8374 18.7539 18.7499 19.8416 17.4375 19.8416C16.0876 19.8416 15.0002 18.7539 15 17.4041C15 16.0541 16.0875 14.9666 17.4375 14.9666C17.9059 14.9666 18.3412 15.0996 18.7119 15.3269V8.95095L8.99902 10.9656V17.2937H8.99414C8.99575 17.3303 9 17.3671 9 17.4041C8.99984 18.7539 7.9124 19.8416 6.5625 19.8416C5.25009 19.8416 4.12516 18.7539 4.125 17.4041C4.125 16.0541 5.2125 14.9666 6.5625 14.9666C7.04647 14.9666 7.49554 15.1079 7.87402 15.3494V8.06912C7.87402 6.90666 8.69928 5.93127 9.82422 5.66873L16.9121 4.20681ZM6.5625 16.0916C5.85 16.0916 5.25 16.6916 5.25 17.4041C5.25016 18.1164 5.8501 18.7166 6.5625 18.7166C7.2749 18.7166 7.87484 18.1164 7.875 17.4041C7.875 16.6916 7.3125 16.0916 6.5625 16.0916ZM17.4375 16.0916C16.725 16.0916 16.125 16.6916 16.125 17.4041C16.1252 18.1164 16.7251 18.7166 17.4375 18.7166C18.1499 18.7166 18.7498 18.1164 18.75 17.4041C18.75 17.367 18.7473 17.3301 18.7441 17.2937H18.7119V17.1013C18.5714 16.5295 18.0462 16.0916 17.4375 16.0916ZM17.3994 5.29373C17.3244 5.29373 17.2117 5.29431 17.1367 5.33181L10.0498 6.79373C9.4498 6.90623 8.99902 7.46912 8.99902 8.06912V9.81521L18.7119 7.80154V6.60623C18.7118 5.8938 18.1118 5.29374 17.3994 5.29373Z",
-                fill: fill
+                fill: _color
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M16.9121 4.20681L16.8974 4.13327L16.897 4.13336L16.9121 4.20681ZM19.7998 6.08181L19.7263 6.09652L19.7263 6.09652L19.7998 6.08181ZM19.874 6.60623L19.949 6.60649V6.60622L19.874 6.60623ZM19.8379 16.9949L19.7618 16.9946L19.7639 17.0073L19.8379 16.9949ZM19.875 17.4041L19.95 17.4062V17.4041H19.875ZM17.4375 19.8416V19.9166V19.8416ZM15 17.4041H14.925V17.4041L15 17.4041ZM17.4375 14.9666V14.8916V14.9666ZM18.7119 15.3269L18.6727 15.3909L18.7869 15.4609V15.3269H18.7119ZM18.7119 8.95095H18.7869V8.8588L18.6967 8.87751L18.7119 8.95095ZM8.99902 10.9656L8.98379 10.8922L8.92402 10.9046V10.9656H8.99902ZM8.99902 17.2937V17.3687H9.07402V17.2937H8.99902ZM8.99414 17.2937V17.2187H8.91576L8.91921 17.297L8.99414 17.2937ZM9 17.4041L9.075 17.4041V17.4041H9ZM6.5625 19.8416V19.9166V19.8416ZM4.125 17.4041H4.05V17.4041L4.125 17.4041ZM6.5625 14.9666V14.8916V14.9666ZM7.87402 15.3494L7.83368 15.4126L7.94902 15.4862V15.3494H7.87402ZM9.82422 5.66873L9.80906 5.59525L9.80717 5.59569L9.82422 5.66873ZM6.5625 16.0916V16.0166V16.0916ZM5.25 17.4041H5.175V17.4041L5.25 17.4041ZM6.5625 18.7166V18.7916V18.7166ZM7.875 17.4041L7.95 17.4041V17.4041H7.875ZM17.4375 16.0916V16.0166V16.0916ZM16.125 17.4041H16.05V17.4041L16.125 17.4041ZM17.4375 18.7166V18.7916V18.7166ZM18.75 17.4041L18.825 17.4041V17.4041H18.75ZM18.7441 17.2937L18.8189 17.2872L18.8129 17.2187H18.7441V17.2937ZM18.7119 17.2937H18.6369V17.3687H18.7119V17.2937ZM18.7119 17.1013H18.7869V17.0923L18.7847 17.0834L18.7119 17.1013ZM17.3994 5.29373L17.3994 5.21873H17.3994V5.29373ZM17.1367 5.33181L17.1519 5.40526L17.1615 5.40328L17.1703 5.39889L17.1367 5.33181ZM10.0498 6.79373L10.0636 6.86745L10.065 6.86718L10.0498 6.79373ZM8.99902 8.06912H8.92402H8.99902ZM8.99902 9.81521H8.92402V9.90735L9.01425 9.88865L8.99902 9.81521ZM18.7119 7.80154L18.7271 7.87498L18.7869 7.86258V7.80154H18.7119ZM18.7119 6.60623H18.7869V6.60622L18.7119 6.60623ZM16.9121 4.20681L16.9268 4.28036C18.201 4.02559 19.4724 4.82698 19.7263 6.09652L19.7998 6.08181L19.8733 6.0671C19.6023 4.71173 18.2481 3.86319 16.8974 4.13327L16.9121 4.20681ZM19.7998 6.08181L19.7263 6.09652C19.7644 6.28729 19.799 6.42827 19.799 6.60623L19.874 6.60623L19.949 6.60622C19.949 6.40966 19.9101 6.25077 19.8733 6.0671L19.7998 6.08181ZM19.874 6.60623L19.799 6.60596L19.7629 16.9946L19.8379 16.9949L19.9129 16.9952L19.949 6.60649L19.874 6.60623ZM19.8379 16.9949L19.7639 17.0073C19.7858 17.1375 19.8 17.2697 19.8 17.4041H19.875H19.95C19.95 17.2592 19.9347 17.1184 19.9119 16.9825L19.8379 16.9949ZM19.875 17.4041L19.8 17.402C19.7635 18.7132 18.7074 19.7666 17.4375 19.7666V19.8416V19.9166C18.7924 19.9166 19.9112 18.7947 19.95 17.4062L19.875 17.4041ZM17.4375 19.8416V19.7666C16.129 19.7666 15.0752 18.7125 15.075 17.4041L15 17.4041L14.925 17.4041C14.9252 18.7954 16.0462 19.9166 17.4375 19.9166V19.8416ZM15 17.4041H15.075C15.075 16.0955 16.1289 15.0416 17.4375 15.0416V14.9666V14.8916C16.0461 14.8916 14.925 16.0127 14.925 17.4041H15ZM17.4375 14.9666V15.0416C17.8914 15.0416 18.3133 15.1704 18.6727 15.3909L18.7119 15.3269L18.7511 15.263C18.3691 15.0287 17.9203 14.8916 17.4375 14.8916V14.9666ZM18.7119 15.3269H18.7869V8.95095H18.7119H18.6369V15.3269H18.7119ZM18.7119 8.95095L18.6967 8.87751L8.98379 10.8922L8.99902 10.9656L9.01426 11.039L18.7271 9.02439L18.7119 8.95095ZM8.99902 10.9656H8.92402V17.2937H8.99902H9.07402V10.9656H8.99902ZM8.99902 17.2937V17.2187H8.99414V17.2937V17.3687H8.99902V17.2937ZM8.99414 17.2937L8.91921 17.297C8.9212 17.342 8.925 17.368 8.925 17.4041H9H9.075C9.075 17.3663 9.07031 17.3185 9.06907 17.2904L8.99414 17.2937ZM9 17.4041L8.925 17.4041C8.92485 18.7125 7.87097 19.7666 6.5625 19.7666V19.8416V19.9166C7.95383 19.9166 9.07484 18.7954 9.075 17.4041L9 17.4041ZM6.5625 19.8416V19.7666C5.29077 19.7666 4.20016 18.7118 4.2 17.4041L4.125 17.4041L4.05 17.4041C4.05017 18.7961 5.20941 19.9166 6.5625 19.9166V19.8416ZM4.125 17.4041H4.2C4.2 16.0955 5.25392 15.0416 6.5625 15.0416V14.9666V14.8916C5.17108 14.8916 4.05 16.0127 4.05 17.4041H4.125ZM6.5625 14.9666V15.0416C7.03162 15.0416 7.46677 15.1785 7.83368 15.4126L7.87402 15.3494L7.91437 15.2862C7.52431 15.0373 7.06132 14.8916 6.5625 14.8916V14.9666ZM7.87402 15.3494H7.94902V8.06912H7.87402H7.79902V15.3494H7.87402ZM7.87402 8.06912H7.94902C7.94902 6.94371 8.74809 5.99689 9.84126 5.74176L9.82422 5.66873L9.80717 5.59569C8.65048 5.86564 7.79902 6.86961 7.79902 8.06912H7.87402ZM9.82422 5.66873L9.83937 5.74218L16.9273 4.28027L16.9121 4.20681L16.897 4.13336L9.80907 5.59527L9.82422 5.66873ZM6.5625 16.0916V16.0166C5.80858 16.0166 5.175 16.6502 5.175 17.4041H5.25H5.325C5.325 16.733 5.89142 16.1666 6.5625 16.1666V16.0916ZM5.25 17.4041L5.175 17.4041C5.17517 18.1579 5.80866 18.7916 6.5625 18.7916V18.7166V18.6416C5.89154 18.6416 5.32515 18.075 5.325 17.4041L5.25 17.4041ZM6.5625 18.7166V18.7916C7.31634 18.7916 7.94983 18.1579 7.95 17.4041L7.875 17.4041L7.8 17.4041C7.79985 18.075 7.23346 18.6416 6.5625 18.6416V18.7166ZM7.875 17.4041H7.95C7.95 16.6516 7.35531 16.0166 6.5625 16.0166V16.0916V16.1666C7.26969 16.1666 7.8 16.7316 7.8 17.4041H7.875ZM17.4375 16.0916V16.0166C16.6836 16.0166 16.05 16.6502 16.05 17.4041H16.125H16.2C16.2 16.733 16.7664 16.1666 17.4375 16.1666V16.0916ZM16.125 17.4041L16.05 17.4041C16.0502 18.1579 16.6837 18.7916 17.4375 18.7916V18.7166V18.6416C16.7665 18.6416 16.2002 18.075 16.2 17.4041L16.125 17.4041ZM17.4375 18.7166V18.7916C18.1913 18.7916 18.8248 18.1579 18.825 17.4041L18.75 17.4041L18.675 17.4041C18.6748 18.075 18.1085 18.6416 17.4375 18.6416V18.7166ZM18.75 17.4041H18.825C18.825 17.3637 18.8221 17.3241 18.8189 17.2872L18.7441 17.2937L18.6694 17.3002C18.6726 17.3361 18.675 17.3704 18.675 17.4041H18.75ZM18.7441 17.2937V17.2187H18.7119V17.2937V17.3687H18.7441V17.2937ZM18.7119 17.2937H18.7869V17.1013H18.7119H18.6369V17.2937H18.7119ZM18.7119 17.1013L18.7847 17.0834C18.6364 16.4796 18.0823 16.0166 17.4375 16.0166V16.0916V16.1666C18.0101 16.1666 18.5064 16.5794 18.6391 17.1192L18.7119 17.1013ZM17.3994 5.29373V5.21873C17.3621 5.21873 17.3116 5.21882 17.2604 5.2241C17.21 5.22929 17.1526 5.24002 17.1032 5.26473L17.1367 5.33181L17.1703 5.39889C17.1958 5.3861 17.2323 5.37779 17.2758 5.37331C17.3184 5.36892 17.3617 5.36873 17.3994 5.36873V5.29373ZM17.1367 5.33181L17.1216 5.25836L10.0347 6.72027L10.0498 6.79373L10.065 6.86718L17.1519 5.40526L17.1367 5.33181ZM10.0498 6.79373L10.036 6.72001C9.39952 6.83935 8.92402 7.43404 8.92402 8.06912H8.99902H9.07402C9.07402 7.50419 9.50009 6.9731 10.0636 6.86744L10.0498 6.79373ZM8.99902 8.06912H8.92402V9.81521H8.99902H9.07402V8.06912H8.99902ZM8.99902 9.81521L9.01425 9.88865L18.7271 7.87498L18.7119 7.80154L18.6967 7.7281L8.9838 9.74177L8.99902 9.81521ZM18.7119 7.80154H18.7869V6.60623H18.7119H18.6369V7.80154H18.7119ZM18.7119 6.60623L18.7869 6.60622C18.7868 5.85239 18.1533 5.21874 17.3994 5.21873L17.3994 5.29373L17.3994 5.36873C18.0704 5.36874 18.6368 5.93522 18.6369 6.60623L18.7119 6.60623Z",
-                fill: fill
+                fill: _color
             })
         ]
     });

package/dist/web/NavAccountUxIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const NavAccountUxIcon_NavAccountUxIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const NavAccountUxIcon_NavAccountUxIcon = ({ size = 16, width = size, height = s
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M12.7385 3.75C13.6558 3.74997 14.5507 4.03394 15.3002 4.56291C16.0497 5.09189 16.617 5.83992 16.9243 6.70429C17.2316 7.56865 17.2637 8.50695 17.0163 9.39032C16.7689 10.2737 16.2541 11.0588 15.5426 11.6378C16.8961 12.0413 18.0832 12.871 18.9273 14.0035C19.7713 15.136 20.2271 16.5107 20.2269 17.9231C20.2269 18.5402 19.9818 19.1321 19.5454 19.5685C19.109 20.0048 18.5171 20.25 17.9 20.25H7.57692C6.98611 20.2487 6.4178 20.0233 5.98681 19.6191C5.55583 19.215 5.29431 18.6624 5.25508 18.0728L5.25 17.9231C5.24987 16.5105 5.70569 15.1356 6.54967 14.0029C7.39365 12.8701 8.58071 12.0401 9.93431 11.6362C9.22345 11.0569 8.70925 10.2719 8.46226 9.38888C8.21527 8.50582 8.24759 7.56796 8.5548 6.704C8.86201 5.84004 9.42904 5.09231 10.1781 4.56342C10.9271 4.03453 11.8215 3.7504 12.7385 3.75ZM13.6692 12.6346H11.8077C8.88677 12.6346 6.51923 15.0022 6.51923 17.8994L6.52177 18.0026C6.54183 18.2687 6.66172 18.5173 6.8574 18.6987C7.05308 18.8801 7.3101 18.9809 7.57692 18.9808H17.9C18.4838 18.9808 18.9577 18.5069 18.9577 17.9231C18.9577 16.5205 18.4005 15.1753 17.4087 14.1836C16.417 13.1918 15.0718 12.6346 13.6692 12.6346ZM12.7385 5.01923C11.8969 5.01923 11.0898 5.35354 10.4948 5.9486C9.89969 6.54367 9.56538 7.35076 9.56538 8.19231C9.56538 9.03386 9.89969 9.84094 10.4948 10.436C11.0898 11.0311 11.8969 11.3654 12.7385 11.3654C13.58 11.3654 14.3871 11.0311 14.9822 10.436C15.5772 9.84094 15.9115 9.03386 15.9115 8.19231C15.9115 7.35076 15.5772 6.54367 14.9822 5.9486C14.3871 5.35354 13.58 5.01923 12.7385 5.01923Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/NavCryptoUxIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const NavCryptoUxIcon_NavCryptoUxIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const NavCryptoUxIcon_NavCryptoUxIcon = ({ size = 16, width = size, height = siz
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M19.2003 6.68914L13.4448 3.81971L13.4433 3.81908C13.1496 3.67459 12.8267 3.5995 12.4993 3.59961C12.172 3.59972 11.8491 3.67502 11.5555 3.81971L5.80147 6.6883C5.44771 6.86167 5.14982 7.13101 4.94181 7.46557C4.73379 7.80014 4.62403 8.18644 4.62505 8.5804V15.4075C4.62043 16.2156 5.0671 16.9434 5.79265 17.308L11.5479 20.1774C11.8426 20.3239 12.1673 20.4 12.4965 20.3996C12.8255 20.3999 13.1502 20.3239 13.4448 20.1774L19.1988 17.3088C19.5525 17.1354 19.8504 16.8661 20.0584 16.5315C20.2664 16.197 20.3761 15.8107 20.375 15.4167V8.58019C20.3761 8.1866 20.2665 7.80063 20.0588 7.46631C19.8511 7.13199 19.5536 6.86277 19.2003 6.68935V6.68914ZM19.0136 15.4167C19.0136 15.7053 18.8523 15.9646 18.5915 16.0938L12.8356 18.9634C12.7301 19.0157 12.614 19.043 12.4962 19.043C12.3785 19.043 12.2624 19.0157 12.1569 18.9634L6.40354 16.0946C6.27713 16.0318 6.17097 15.9347 6.09721 15.8143C6.02345 15.694 5.98507 15.5553 5.98648 15.4142V8.58082C5.98648 8.29186 6.14797 8.03272 6.40879 7.90336L12.1628 5.03477C12.2677 4.983 12.3831 4.95613 12.5 4.95623C12.6169 4.95608 12.7322 4.98288 12.8371 5.03456L18.593 7.9042C18.7194 7.96616 18.8259 8.06241 18.9002 8.18197C18.9746 8.30153 19.0139 8.43959 19.0136 8.5804V15.4163V15.4167ZM20.073 7.50205C19.9919 7.34087 19.8502 7.21841 19.679 7.16153C19.5078 7.10465 19.321 7.11798 19.1595 7.1986L12.5 10.5187L5.84053 7.19881C5.67913 7.11826 5.49237 7.10496 5.32119 7.16184C5.15 7.21872 5.00834 7.34113 4.92724 7.50226C4.88731 7.58202 4.86351 7.66887 4.8572 7.75784C4.8509 7.84681 4.86221 7.93615 4.8905 8.02074C4.91879 8.10533 4.96349 8.1835 5.02205 8.25078C5.0806 8.31806 5.15186 8.37313 5.23174 8.41282L12.1955 11.8847C12.2901 11.9319 12.3943 11.9564 12.4999 11.9564C12.6056 11.9564 12.7098 11.9319 12.8043 11.8847L19.7683 8.41261C19.8482 8.37292 19.9195 8.31785 19.978 8.25057C20.0366 8.18329 20.0813 8.10512 20.1096 8.02053C20.1378 7.93594 20.1492 7.8466 20.1429 7.75763C20.1366 7.66866 20.1128 7.58181 20.0728 7.50205H20.073ZM12.5 10.5989C12.3198 10.5987 12.1468 10.6701 12.0192 10.7973C11.8916 10.9246 11.8197 11.0974 11.8194 11.2776V19.7137C11.8197 19.894 11.8916 20.0667 12.0192 20.194C12.1468 20.3213 12.3198 20.3927 12.5 20.3924C12.5893 20.3926 12.6777 20.3751 12.7602 20.3411C12.8428 20.3071 12.9178 20.2571 12.981 20.1941C13.0442 20.1311 13.0944 20.0562 13.1287 19.9738C13.163 19.8914 13.1807 19.803 13.1808 19.7137V11.2776C13.1807 11.1884 13.163 11.1 13.1287 11.0176C13.0944 10.9352 13.0442 10.8603 12.981 10.7973C12.9178 10.7342 12.8428 10.6843 12.7602 10.6503C12.6777 10.6162 12.5893 10.5988 12.5 10.5989Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/NavEarnIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const NavEarnIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const NavEarnIcon = ({ size = 16, width = size, height = size, color = 'currentC
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M10.9769 4.80424H7.56313C7.32688 4.80424 7.14563 4.75667 7.01938 4.66208C6.89251 4.56599 6.80048 4.44021 6.75437 4.29991C6.70138 4.13948 6.67569 3.97323 6.67812 3.8064C6.67812 3.62369 6.695 3.45234 6.72937 3.29126C6.74562 3.13018 6.77938 2.9545 6.83 2.76477C6.87174 2.59498 6.94453 2.43203 7.04562 2.28207C7.13812 2.15017 7.26062 2.06207 7.41187 2.01882C7.56375 1.97558 7.74937 2.0118 7.96812 2.12801C8.22187 2.2599 8.50812 2.40207 8.82875 2.55558C9.14937 2.7091 9.46062 2.86261 9.76437 3.01612C10.0675 3.16964 10.3494 3.30802 10.6112 3.43288C10.8725 3.55721 11.0706 3.65613 11.205 3.7291C11.3737 3.8318 11.5006 3.94478 11.5844 4.06856C11.6687 4.19289 11.7025 4.30964 11.6856 4.41992C11.6764 4.47544 11.6536 4.52862 11.6186 4.57588C11.5837 4.62315 11.5375 4.66341 11.4831 4.69397C11.365 4.76694 11.1969 4.8037 10.9775 4.8037L10.9769 4.80424ZM12.9487 4.78262H16.3369C16.5731 4.78262 16.7544 4.73505 16.8806 4.63992C17.0069 4.54532 17.0956 4.42424 17.1462 4.27775C17.1969 4.13181 17.2225 3.96694 17.2225 3.78478C17.2225 3.60207 17.2138 3.43018 17.1975 3.26964C17.161 3.09766 17.1229 2.92594 17.0831 2.7545C17.0481 2.58817 16.9795 2.42845 16.8806 2.28261C16.7998 2.15913 16.6695 2.06549 16.5144 2.01936C16.3625 1.97612 16.1769 2.00531 15.9581 2.10693C15.6742 2.25379 15.3872 2.39634 15.0975 2.5345C14.7775 2.68801 14.4613 2.84153 14.1494 2.99504C13.8375 3.14856 13.5506 3.28694 13.2894 3.4118C13.0937 3.50157 12.9039 3.60045 12.7206 3.70802C12.535 3.81072 12.4 3.92424 12.3162 4.04748C12.2319 4.17181 12.1975 4.28856 12.215 4.39883C12.2241 4.45431 12.2469 4.50746 12.2817 4.55472C12.3165 4.60199 12.3626 4.64227 12.4169 4.67289C12.5356 4.74586 12.7119 4.78262 12.9481 4.78262H12.9487ZM10.6225 6.22965H3.29C2.75 6.22965 2.40062 6.30641 2.24 6.45992C2.08 6.61344 2 6.8583 2 7.19506V9.1248C2 9.49021 2.08875 9.76048 2.26562 9.93616C2.4425 10.1118 2.79188 10.1994 3.315 10.1994H10.6212V6.22965H10.6225ZM13.3787 6.22965H20.61C21.1494 6.22965 21.5163 6.32155 21.71 6.50425C21.9038 6.68695 22 6.94641 22 7.28263V9.16913C22 9.51994 21.9113 9.7794 21.7344 9.94751C21.5575 10.1151 21.2081 10.1994 20.685 10.1994H13.3787V6.22965ZM10.6225 11.3621H2.86V19.653C2.86 20.3989 3.10437 20.9768 3.59312 21.3859C4.08187 21.7951 4.84063 22 5.86938 22H10.6225V11.3621ZM13.3787 11.3621H21.1162V19.587C21.0987 20.333 20.8544 20.9216 20.3825 21.353C19.9106 21.7843 19.1606 22 18.1325 22H13.3794V11.3632L13.3781 11.3621H13.3787Z",
-            fill: fill
+            fill: _color
         })
     });
 };

package/dist/web/NavHomeIcon.js

@@ -1,10 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor, useIconsContext } from "../core/index.js";
+import { isThemeColor } from "../core/index.js";
+import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
 const NavHomeIcon_NavHomeIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const { getColor } = useIconsContext();
-    const _color = isThemeColor(color) ? getColor(color) : color;
-    const fill = props.fill || _color;
+    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -13,7 +12,7 @@ const NavHomeIcon_NavHomeIcon = ({ size = 16, width = size, height = size, color
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M10.9004 2.4C11.6003 2.00013 12.3997 2.00013 13.0996 2.4L21.0996 7.69981C21.6996 8.09981 22 8.7 22 9.4V20.9C21.9999 21.4998 21.5999 21.9 21 21.9H3C2.4001 21.9 2.00014 21.4998 2 20.9V9.4C2 8.7 2.30039 8.09981 2.90039 7.69981L10.9004 2.4ZM11 17.9H13V11.9H11V17.9Z",
-            fill: fill
+            fill: _color
         })
     });
 };