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

package/dist/web/TicketIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TicketIcon_TicketIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TicketIcon_TicketIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M9.01778 22C9.20955 21.3435 9.60334 20.7677 10.1406 20.3584C10.6779 19.949 11.33 19.7279 12 19.7279C12.67 19.7279 13.3221 19.949 13.8594 20.3584C14.3967 20.7677 14.7905 21.3435 14.9822 22L19.1111 22C19.3469 22 19.573 21.9042 19.7397 21.7337C19.9064 21.5632 20 21.332 20 21.0909L20 2.90909C20 2.66798 19.9064 2.43676 19.7397 2.26627C19.573 2.09578 19.3469 2 19.1111 2H15.528L14.9822 2.00045C14.7905 2.65699 14.3967 3.23273 13.8594 3.64207C13.3221 4.05141 12.67 4.27251 12 4.27251C11.33 4.27251 10.6779 4.05141 10.1406 3.64207C9.60334 3.23273 9.20955 2.65699 9.01778 2.00045H8.472L4.88889 2C4.65314 2 4.42705 2.09578 4.26035 2.26627C4.09365 2.43676 4 2.66798 4 2.90909L4 21.0909C4 21.332 4.09365 21.5632 4.26035 21.7337C4.42705 21.9042 4.65314 22 4.88889 22H9.01778ZM18.6667 20.6364L15.8493 20.6355C15.4592 19.9445 14.8981 19.3707 14.2224 18.9719C13.5467 18.5731 12.7802 18.3633 12 18.3636C10.3556 18.3636 8.91911 19.2773 8.15067 20.6355L5.33333 20.6364L5.33333 10.6364H6.66667V9.27273H5.33333L5.33333 3.36364H8.15022C8.91911 4.72273 10.3547 5.63636 12 5.63636C12.7803 5.63669 13.547 5.4268 14.2228 5.02783C14.8986 4.62886 15.4598 4.05487 15.8498 3.36364H18.6667L18.6667 9.27273H17.3333V10.6364H18.6667V20.6364ZM11.1111 10.6364V9.27273L8.44444 9.27273V10.6364L11.1111 10.6364ZM15.5556 10.6364V9.27273H12.8889V10.6364H15.5556Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TiktokIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TiktokIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TiktokIcon;

package/dist/web/TiktokIcon.js

@@ -1,35 +1,36 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TiktokIcon_TiktokIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TiktokIcon_TiktokIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsxs("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: [
             /*#__PURE__*/ jsx("path", {
                 d: "M10.2681 10.0835V9.38005C10.028 9.34139 9.7855 9.3202 9.54247 9.31666C7.18952 9.31155 5.1064 10.8625 4.3998 13.1452C3.69321 15.428 4.52726 17.913 6.4586 19.2798C5.75037 18.5089 5.27666 17.5459 5.09465 16.5071C4.91265 15.4684 5.03011 14.3983 5.43288 13.4259C5.83565 12.4536 6.5065 11.6206 7.36445 11.0275C8.22241 10.4344 9.23079 10.1066 10.2679 10.0836L10.2681 10.0835Z",
-                fill: _color
+                fill: "currentColor"
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M10.3984 18.0517C11.7139 18.0499 12.7953 16.9957 12.8529 15.6589V3.7297H14.9955C14.9518 3.48043 14.9309 3.22756 14.9332 2.97437L12.0025 2.97437V14.8921C11.9538 16.2357 10.8698 17.3 9.54801 17.3021C9.153 17.2987 8.76443 17.1999 8.41431 17.0139C8.64123 17.3336 8.93923 17.5943 9.28403 17.7747C9.62883 17.955 10.0107 18.05 10.3984 18.0517ZM18.9976 7.77716V7.1141C18.209 7.11442 17.4379 6.87775 16.7812 6.43381C17.3569 7.11458 18.1349 7.58614 18.9976 7.77716Z",
-                fill: _color
+                fill: "currentColor"
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M16.7829 6.43234C16.1359 5.683 15.7792 4.7197 15.7796 3.72241H14.9972C15.0983 4.2738 15.3087 4.79847 15.6157 5.26439C15.9227 5.73031 16.3199 6.12771 16.7829 6.43234ZM9.54408 12.2961C8.9954 12.2989 8.4634 12.4882 8.03266 12.8339C7.60192 13.1796 7.29716 13.6619 7.16684 14.204C7.03652 14.7461 7.08811 15.317 7.31342 15.8258C7.53873 16.3347 7.92482 16.7524 8.4103 17.0124C8.14487 16.6396 7.98591 16.1995 7.951 15.7406C7.91608 15.2817 8.00657 14.8219 8.21247 14.412C8.41836 14.0021 8.73165 13.6581 9.11771 13.418C9.50377 13.1779 9.94758 13.051 10.4001 13.0513C10.6461 13.0546 10.8904 13.0935 11.1256 13.167V10.1339C10.8854 10.0973 10.643 10.078 10.4001 10.0763H10.2697V12.3825C10.0332 12.318 9.78879 12.2889 9.54408 12.2961Z",
-                fill: _color
+                fill: "currentColor"
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M18.9988 7.7771V10.0834C17.539 10.0805 16.117 9.61053 14.9344 8.73999V14.7998C14.9281 17.8235 12.5164 20.2714 9.54359 20.2714C8.4395 20.2735 7.362 19.927 6.45972 19.2797C7.19547 20.0846 8.15249 20.6455 9.20611 20.8894C10.2597 21.1332 11.3611 21.0486 12.3668 20.6467C13.3725 20.2448 14.2359 19.5441 14.8446 18.636C15.4532 17.7278 15.7788 16.6543 15.7791 15.5553V9.51265C16.9657 10.3775 18.3893 10.8413 19.8491 10.8388V7.86914C19.5633 7.86828 19.2784 7.83743 18.9988 7.7771Z",
-                fill: _color
+                fill: "currentColor"
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M14.9349 14.7984V8.73858C16.1211 9.60417 17.5451 10.0681 19.005 10.0647V7.75845C18.1425 7.57319 17.3626 7.10777 16.7829 6.43234C16.3199 6.12771 15.9228 5.73031 15.6158 5.26439C15.3088 4.79847 15.0983 4.2738 14.9973 3.72241H12.8546V15.6576C12.8338 16.1771 12.6543 16.6771 12.3412 17.0882C12.0281 17.4992 11.5969 17.8008 11.1075 17.951C10.6182 18.1013 10.0949 18.0928 9.6105 17.9266C9.1261 17.7605 8.70461 17.445 8.4046 17.024C7.91903 16.7641 7.53286 16.3464 7.30749 15.8375C7.08213 15.3286 7.0305 14.7577 7.16083 14.2155C7.29116 13.6733 7.59597 13.191 8.02677 12.8453C8.45757 12.4996 8.98964 12.3103 9.53838 12.3075C9.78448 12.3098 10.0289 12.3486 10.264 12.4229V10.1166C9.22129 10.1346 8.20628 10.4607 7.3427 11.0553C6.47912 11.6499 5.80428 12.4872 5.40046 13.4651C4.99665 14.4431 4.8813 15.5194 5.06849 16.5629C5.25567 17.6063 5.73731 18.5718 6.45467 19.3417C7.36581 19.9676 8.44484 20.2918 9.54411 20.27C12.5169 20.27 14.9287 17.8221 14.9349 14.7984Z",
-                fill: getHexColorFromCSSVariable('bg-default')
+                fill: "currentColor",
+                className: "text-background"
             })
         ]
     });

package/dist/web/TimeEndIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TimeEndIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TimeEndIcon;

package/dist/web/TimeEndIcon.js

@@ -1,23 +1,23 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TimeEndIcon_TimeEndIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TimeEndIcon_TimeEndIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsxs("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: [
             /*#__PURE__*/ jsx("path", {
                 d: "M6.78684 1.45312H17.3397C17.3378 1.8288 17.3357 2.20246 17.3357 2.57813C15.7888 2.58014 14.244 2.57611 12.6971 2.58014C12.6931 3.37366 12.6911 4.16919 12.7031 4.96473C15.2203 5.13549 17.6311 6.45535 19.0936 8.51452C20.8433 10.9011 21.1687 14.1837 20.1302 16.9279C18.9247 20.1523 15.6804 22.4685 12.233 22.5468H11.7629C9.45871 22.4746 7.2067 21.4581 5.64979 19.7585C4.15112 18.1714 3.32143 16.0138 3.26117 13.8402V13.5629C3.31339 11.6826 3.94621 9.8183 5.11541 8.33772C6.61608 6.38103 8.96852 5.13348 11.4255 4.96272C11.4295 4.16719 11.4295 3.37166 11.4255 2.57813C9.87857 2.57813 8.3317 2.58214 6.78483 2.57611C6.78483 2.20044 6.78684 1.82679 6.78684 1.45312ZM10.196 6.60804C8.05246 7.15246 6.19822 8.71942 5.30624 10.7444C4.49465 12.5424 4.47656 14.6719 5.23795 16.49C6.10781 18.6394 8.02032 20.3491 10.2743 20.9177C12.0844 21.3917 14.0752 21.0763 15.6663 20.0979C18.1252 18.6254 19.6198 15.6703 19.2502 12.8156C18.9871 10.6118 17.653 8.57678 15.7547 7.43371C14.1134 6.42523 12.0603 6.12187 10.196 6.60804Z",
-                fill: _color
+                fill: "currentColor"
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M11.4296 9.60938H12.5526C12.5546 11.5781 12.5546 13.5469 12.5546 15.5156H11.4296C11.4276 13.5469 11.4296 11.5781 11.4296 9.60938Z",
-                fill: _color
+                fill: "currentColor"
             })
         ]
     });

package/dist/web/TokenExchangeIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TokenExchangeIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TokenExchangeIcon;

package/dist/web/TokenExchangeIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TokenExchangeIcon_TokenExchangeIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TokenExchangeIcon_TokenExchangeIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M7.39751 2.176C8.67033 1.88383 9.99975 1.95672 11.2335 2.38498C12.4672 2.81329 13.5561 3.57982 14.3741 4.59787C15.192 5.61588 15.7068 6.84387 15.8594 8.14084C17.1564 8.29348 18.3844 8.80822 19.4024 9.62619C20.4204 10.4442 21.187 11.5331 21.6153 12.7668C22.0435 14.0005 22.1164 15.33 21.8243 16.6028C21.5321 17.8756 20.8873 19.0407 19.9639 19.9641C19.0405 20.8875 17.8754 21.5322 16.6026 21.8244C15.3298 22.1166 14.0003 22.0437 12.7667 21.6154C11.5329 21.1871 10.4441 20.4206 9.62603 19.4026C8.80804 18.3846 8.29331 17.1566 8.14068 15.8596C6.8437 15.707 5.61572 15.1922 4.59771 14.3742C3.57967 13.5562 2.81312 12.4674 2.38482 11.2336C1.95658 9.99992 1.88368 8.67049 2.17583 7.39768C2.46802 6.12485 3.11276 4.95979 4.03619 4.03635C4.95962 3.11291 6.12469 2.46818 7.39751 2.176ZM15.9112 9.01877C15.9031 9.94847 15.707 10.8568 15.3477 11.6955L15.4727 11.4895L17.8243 15.4045L15.4727 16.801L13.1133 15.4143L14.3721 13.3186C14.2167 13.5116 14.0519 13.6983 13.8751 13.8752C12.5859 15.1644 10.8417 15.8955 9.01861 15.9113C9.22763 17.3595 9.9516 18.684 11.0577 19.6418C12.1639 20.5996 13.5787 21.1266 15.042 21.1262C16.5822 21.129 18.0661 20.5476 19.1944 19.4992C20.3225 18.4509 21.0119 17.0138 21.1221 15.4778C21.2323 13.9417 20.7551 12.4205 19.7881 11.2219C18.8212 10.0234 17.4357 9.23599 15.9112 9.01877ZM3.82818 15.4856C3.91248 15.5018 3.9907 15.5424 4.05181 15.6028L4.92095 16.4719C4.96134 16.5123 4.99279 16.5607 5.0147 16.6135C5.0366 16.6664 5.04787 16.7233 5.0479 16.7805C5.0479 16.8378 5.03661 16.8946 5.0147 16.9475C4.99283 17.0003 4.96132 17.0486 4.92095 17.0891C4.88053 17.1295 4.83214 17.1619 4.77935 17.1838C4.72653 17.2057 4.66952 17.217 4.61236 17.217C4.55517 17.217 4.49822 17.2057 4.44537 17.1838C4.39246 17.1619 4.34427 17.1296 4.30376 17.0891L4.17779 16.9592V18.0842C4.17779 18.3147 4.26869 18.5364 4.43169 18.6994C4.59469 18.8624 4.81643 18.9533 5.04693 18.9533H7.21978C7.33492 18.9534 7.44499 18.9999 7.52642 19.0813C7.60783 19.1627 7.65425 19.2728 7.65435 19.3879C7.65435 19.5032 7.60792 19.614 7.52642 19.6955C7.445 19.7769 7.33486 19.8224 7.21978 19.8225H5.04693C4.81864 19.8225 4.59182 19.778 4.38091 19.6906C4.17014 19.6033 3.97877 19.475 3.81744 19.3137C3.65611 19.1524 3.52784 18.961 3.44048 18.7502C3.35312 18.5393 3.30865 18.3125 3.30865 18.0842V16.9592L3.18169 17.0891C3.1412 17.1295 3.09298 17.1619 3.04009 17.1838C2.98741 17.2056 2.93107 17.2169 2.87408 17.217C2.81691 17.217 2.75992 17.2056 2.70708 17.1838C2.6542 17.1619 2.60598 17.1295 2.56548 17.0891C2.52496 17.0486 2.49269 17.0004 2.47076 16.9475C2.44885 16.8946 2.43755 16.8378 2.43755 16.7805C2.43758 16.7233 2.44886 16.6664 2.47076 16.6135C2.49268 16.5607 2.52504 16.5123 2.56548 16.4719C3.5026 15.5348 3.46477 15.5552 3.5772 15.5119C3.65631 15.4787 3.74391 15.4694 3.82818 15.4856ZM15.4727 19.174L13.1133 15.8576L15.4727 17.2531L17.8331 15.8537L15.4727 19.174ZM11.4854 3.42502C10.4246 2.94063 9.24616 2.77082 8.09185 2.93674C6.93783 3.10267 5.85595 3.59727 4.97466 4.36057C4.09322 5.12412 3.44899 6.12549 3.12017 7.24435C2.79146 8.3631 2.79107 9.55316 3.11919 10.6721C3.44738 11.791 4.09081 12.7919 4.97173 13.5559C5.85271 14.3199 6.93475 14.8151 8.08892 14.9817C8.95247 15.1063 9.83274 15.0436 10.67 14.7981C11.5072 14.5525 12.282 14.13 12.9415 13.5588C13.601 12.9875 14.1298 12.2803 14.4922 11.4865C14.8546 10.6929 15.0422 9.83069 15.042 8.95822C15.0417 7.79207 14.7068 6.6501 14.0762 5.66916C13.4457 4.6883 12.5461 3.90942 11.4854 3.42502ZM10.1368 5.33322C10.259 5.33322 10.3764 5.37733 10.4629 5.45529C10.5495 5.53343 10.5987 5.63971 10.5987 5.75021V6.18771C10.896 6.22654 11.1755 6.33931 11.4053 6.51389C11.6352 6.68854 11.8063 6.91812 11.8995 7.176C11.9926 7.4339 12.0043 7.71041 11.9327 7.97385C11.861 8.23724 11.7091 8.47763 11.4942 8.66721C11.7158 8.85584 11.8736 9.0972 11.9493 9.3635C12.025 9.6299 12.0156 9.91038 11.9219 10.1721C11.8282 10.4339 11.6542 10.667 11.42 10.843C11.1858 11.019 10.9008 11.1314 10.5987 11.1672V11.5832C10.5987 11.6937 10.5495 11.8 10.4629 11.8781C10.3764 11.9562 10.2591 12.0002 10.1368 12.0002C10.0144 12.0002 9.89711 11.9562 9.8106 11.8781C9.72404 11.8 9.67583 11.6937 9.67583 11.5832V11.1672H8.75201V11.5832C8.75201 11.6937 8.70374 11.8 8.61724 11.8781C8.53077 11.9562 8.41335 12.0001 8.29107 12.0002C8.16865 12.0002 8.05048 11.9563 7.96392 11.8781C7.87749 11.8 7.82915 11.6936 7.82915 11.5832V11.1672H6.9063C6.78389 11.1672 6.66572 11.1233 6.57915 11.0451C6.49264 10.967 6.4444 10.8607 6.44439 10.7502C6.44439 10.6397 6.49266 10.5334 6.57915 10.4553C6.66572 10.3772 6.78389 10.3332 6.9063 10.3332H7.36724V7.00021H6.9063C6.78389 7.00021 6.66572 6.95629 6.57915 6.87814C6.49271 6.80002 6.44439 6.69365 6.44439 6.58322C6.44445 6.47299 6.49294 6.36733 6.57915 6.28928C6.66572 6.21114 6.78389 6.16721 6.9063 6.16721H7.82915V5.75021C7.82915 5.63976 7.87744 5.53342 7.96392 5.45529C8.05048 5.37715 8.16865 5.33322 8.29107 5.33322C8.41335 5.33332 8.53077 5.37723 8.61724 5.45529C8.70379 5.53343 8.75201 5.63971 8.75201 5.75021V6.16721H9.67583V5.75021C9.67583 5.63971 9.72404 5.53343 9.8106 5.45529C9.89711 5.37724 10.0145 5.33327 10.1368 5.33322ZM8.29107 10.3332H10.3682C10.5517 10.3331 10.7277 10.2677 10.8575 10.1506C10.9873 10.0334 11.0606 9.87399 11.0606 9.70822C11.0605 9.54265 10.9871 9.38395 10.8575 9.26682C10.7277 9.1497 10.5517 9.08333 10.3682 9.08322H8.29107V10.3332ZM18.9532 4.17795C19.1813 4.17795 19.4074 4.22253 19.6182 4.30978C19.8291 4.39715 20.0212 4.52531 20.1827 4.68674C20.344 4.84807 20.4723 5.03945 20.5596 5.25021C20.647 5.46112 20.6915 5.68794 20.6915 5.91623V7.04123L20.8174 6.91135C20.8579 6.87091 20.9062 6.83855 20.959 6.81662C21.0119 6.79473 21.0688 6.78346 21.126 6.78342C21.1832 6.78342 21.2402 6.79476 21.293 6.81662C21.346 6.83854 21.3941 6.87084 21.4346 6.91135C21.4751 6.95187 21.5074 7.00001 21.5294 7.05295C21.5512 7.10584 21.5626 7.1627 21.5626 7.21994C21.5625 7.27715 21.5512 7.33407 21.5294 7.38693C21.5074 7.43976 21.4751 7.48809 21.4346 7.52853C20.4962 8.46694 20.5349 8.44504 20.4219 8.4885C20.3701 8.51194 20.3138 8.52463 20.2569 8.52463C20.2 8.52459 20.1436 8.51198 20.0919 8.4885C19.9748 8.44077 19.9868 8.43188 19.0792 7.52853C18.9974 7.44676 18.9513 7.33557 18.9512 7.21994C18.9512 7.10434 18.9975 6.99316 19.0792 6.91135C19.1609 6.82957 19.2721 6.78349 19.3877 6.78342C19.5035 6.78342 19.6145 6.82951 19.6963 6.91135L19.8223 7.04123V5.91623C19.8223 5.68573 19.7314 5.46399 19.5684 5.301C19.4054 5.13799 19.1837 5.04709 18.9532 5.04709H16.7803C16.6651 5.04705 16.5542 5.00063 16.4727 4.91916C16.3915 4.83779 16.3459 4.72746 16.3458 4.61252C16.3458 4.49739 16.3914 4.38638 16.4727 4.3049C16.5542 4.22343 16.6651 4.17799 16.7803 4.17795H18.9532ZM8.29107 8.25021H10.3682C10.5517 8.25011 10.7277 8.18374 10.8575 8.06662C10.9871 7.94946 11.0606 7.79082 11.0606 7.62521C11.0606 7.45945 10.9873 7.30004 10.8575 7.18283C10.7277 7.06577 10.5516 7.00032 10.3682 7.00021H8.29107V8.25021Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/Top10HoldersIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const Top10HoldersIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default Top10HoldersIcon;

package/dist/web/Top10HoldersIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const Top10HoldersIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const Top10HoldersIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M11.5188 2.58008C11.8209 2.47326 12.1512 2.47326 12.4534 2.58008C12.6081 2.65572 12.7431 2.76664 12.8479 2.90332H12.884L16.0803 7.6084H16.1526L19.4211 5.09473H19.4934C19.6776 4.98755 19.894 4.9496 20.1038 4.9873C20.3041 4.98825 20.4971 5.06462 20.6428 5.20215C20.8269 5.30423 20.9672 5.47053 21.0374 5.66895C21.1132 5.85028 21.1386 6.04973 21.1096 6.24414L20.1428 17.376C20.2617 17.4582 20.3734 17.5523 20.4758 17.6572C20.6872 17.8614 20.8548 18.1079 20.9661 18.3799C21.0773 18.6518 21.131 18.9446 21.1233 19.2383C21.1288 19.5315 21.0741 19.8233 20.9631 20.0947C20.852 20.3664 20.6855 20.613 20.4758 20.8184C20.0595 21.2449 19.4917 21.4906 18.8958 21.501H5.13892C4.8429 21.5019 4.54936 21.4416 4.27759 21.3242C4.0059 21.2068 3.7611 21.0344 3.55884 20.8184C3.3444 20.6147 3.17318 20.3691 3.05591 20.0977C2.93881 19.8263 2.87745 19.5338 2.87622 19.2383C2.87527 18.9423 2.9357 18.6487 3.05298 18.377C3.17036 18.1051 3.34269 17.8596 3.55884 17.6572C3.67043 17.538 3.7961 17.4334 3.93091 17.3428L2.93481 6.24414C2.88865 6.05031 2.91373 5.84549 3.0061 5.66895C3.06116 5.47303 3.19026 5.30566 3.36548 5.20215C3.52577 5.06505 3.72976 4.98942 3.94067 4.9873C4.13888 4.95201 4.34294 4.99003 4.51489 5.09473H4.58716L7.85571 7.6084H7.927L11.1604 2.90332V2.86719C11.2633 2.75258 11.3844 2.65528 11.5188 2.58008ZM5.13892 18.0527C4.82469 18.0528 4.52322 18.1782 4.30103 18.4004C4.07904 18.6226 3.95435 18.9241 3.95435 19.2383C3.9545 19.5524 4.07892 19.854 4.30103 20.0762C4.52321 20.2983 4.82477 20.4237 5.13892 20.4238H18.8958C19.2067 20.4138 19.5024 20.2848 19.7219 20.0645C19.9288 19.8393 20.044 19.544 20.0442 19.2383C20.0442 18.9324 19.9288 18.6374 19.7219 18.4121C19.5024 18.1915 19.2068 18.0628 18.8958 18.0527H5.13892ZM8.82544 8.25586C8.72702 8.37228 8.61865 8.48071 8.5022 8.5791L8.07056 8.72266C7.91448 8.74746 7.75419 8.73499 7.60376 8.68652C7.4555 8.65093 7.31941 8.57609 7.20923 8.4707L4.01196 6.06445H3.97681L4.95239 16.9844C5.01435 16.9792 5.07652 16.9754 5.13892 16.9756H18.8958C18.9599 16.9767 19.0238 16.9808 19.0872 16.9873L20.0676 6.10059L16.8352 8.5791C16.7474 8.645 16.6492 8.69557 16.5452 8.72949L16.3342 8.78613C16.2275 8.80833 16.1173 8.81142 16.009 8.79395L15.5784 8.65039C15.4456 8.57117 15.3344 8.45984 15.2551 8.32715L12.0217 3.62207L8.82544 8.25586ZM14.137 9.56152C14.6284 9.56157 15.0517 9.67993 15.4055 9.91699C15.7613 10.1542 16.0355 10.4989 16.2268 10.9502C16.418 11.3996 16.5128 11.9454 16.511 12.5859C16.511 13.2304 16.415 13.7821 16.2239 14.2393C16.0345 14.6964 15.7622 15.046 15.4084 15.2871C15.0546 15.5281 14.6304 15.6484 14.137 15.6484C13.6434 15.6465 13.2184 15.5252 12.8625 15.2842C12.5087 15.0431 12.2364 14.6935 12.0452 14.2363C11.8559 13.7791 11.762 13.2286 11.7639 12.5859C11.764 11.9454 11.8588 11.3986 12.0481 10.9473C12.2394 10.4962 12.5118 10.1522 12.8655 9.91699C13.2212 9.67996 13.6455 9.56156 14.137 9.56152ZM10.4358 15.5195H9.1936V10.8213H9.15845L7.81274 11.665V10.5635L9.26782 9.6416H10.4358V15.5195ZM14.137 10.5801C13.8024 10.5802 13.5341 10.7486 13.3333 11.083C13.1327 11.4177 13.0315 11.919 13.0295 12.5859C13.0295 13.0372 13.0745 13.4146 13.1643 13.7168C13.2561 14.0171 13.3856 14.2434 13.552 14.3945C13.7183 14.5436 13.9133 14.6181 14.137 14.6182C14.4735 14.6181 14.7428 14.4488 14.9436 14.1104C15.1443 13.7717 15.2443 13.2629 15.2424 12.5859C15.2424 12.1405 15.1965 11.769 15.1047 11.4727C15.0148 11.1763 14.8864 10.9529 14.72 10.8037C14.5555 10.6546 14.3606 10.5801 14.137 10.5801Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TrackIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TrackIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TrackIcon;

package/dist/web/TrackIcon.js

@@ -1,21 +1,21 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TrackIcon_TrackIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TrackIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M12 2.7998C12.9014 2.79981 13.7728 2.92998 14.5967 3.17188L14.9199 3.2666L13.8652 4.32129L13.7578 4.29688C13.1926 4.16831 12.6045 4.09962 12 4.09961C7.63687 4.09961 4.09961 7.63695 4.09961 12C4.09969 16.3628 7.63692 19.8994 12 19.8994C16.3632 19.8994 19.9003 16.3627 19.9004 12C19.9004 11.3957 19.8318 10.8072 19.7031 10.2422L19.6787 10.1348L20.7334 9.08008L20.8281 9.40332C21.0696 10.2269 21.2002 11.0985 21.2002 12C21.2001 17.0809 17.081 21.2001 12 21.2002C6.91874 21.2002 2.79988 17.0809 2.7998 12C2.7998 6.91898 6.9187 2.7998 12 2.7998ZM12.4893 20.9854C12.6295 20.9778 12.7688 20.967 12.9072 20.9531C12.7688 20.967 12.6295 20.9778 12.4893 20.9854ZM10.6689 20.9014C10.7483 20.9131 10.8282 20.922 10.9082 20.9316C10.8282 20.922 10.7483 20.9131 10.6689 20.9014ZM13.0986 20.9297C13.1806 20.9197 13.2625 20.9116 13.3438 20.8994C13.2625 20.9116 13.1806 20.9197 13.0986 20.9297ZM10.2246 20.8242C10.2997 20.8392 10.3754 20.8511 10.4512 20.8643C10.3754 20.8511 10.2997 20.8392 10.2246 20.8242ZM13.585 20.8574C13.6502 20.8458 13.7156 20.8362 13.7803 20.8232C13.7156 20.8362 13.6502 20.8458 13.585 20.8574ZM9.79883 20.7275C9.88162 20.7484 9.96514 20.7667 10.0488 20.7852C9.96514 20.7667 9.88162 20.7484 9.79883 20.7275ZM14.0312 20.7666C14.0896 20.7531 14.1482 20.7412 14.2061 20.7266C14.1482 20.7412 14.0896 20.7531 14.0312 20.7666ZM9.38867 20.6133C9.46727 20.6371 9.54649 20.659 9.62598 20.6807C9.54649 20.659 9.46727 20.6371 9.38867 20.6133ZM14.4141 20.6689C14.4898 20.6479 14.5657 20.6284 14.6406 20.6055C14.5657 20.6284 14.4898 20.6479 14.4141 20.6689ZM8.9834 20.4805C9.05548 20.5061 9.12826 20.5299 9.20117 20.5537C9.12826 20.5299 9.05548 20.5061 8.9834 20.4805ZM14.8418 20.5391C14.9081 20.517 14.9744 20.4952 15.04 20.4717C14.9744 20.4952 14.9081 20.517 14.8418 20.5391ZM8.59863 20.333C8.6569 20.3568 8.71554 20.3797 8.77441 20.4023C8.71554 20.3797 8.6569 20.3568 8.59863 20.333ZM15.248 20.3926C15.3176 20.3656 15.3873 20.3392 15.4561 20.3105C15.3873 20.3392 15.3176 20.3656 15.248 20.3926ZM8.17871 20.1484C8.2521 20.1829 8.32594 20.2165 8.40039 20.249C8.32594 20.2165 8.2521 20.1829 8.17871 20.1484ZM15.624 20.2373C15.7017 20.2031 15.7789 20.1682 15.8555 20.1318C15.7789 20.1682 15.7017 20.2031 15.624 20.2373ZM7.79883 19.959C7.87573 19.9997 7.95304 20.0396 8.03125 20.0781C7.95304 20.0396 7.87573 19.9997 7.79883 19.959ZM16.0244 20.0488C16.0927 20.0146 16.1612 19.9812 16.2285 19.9453C16.1612 19.9812 16.0927 20.0146 16.0244 20.0488ZM7.43652 19.7568C7.5057 19.7976 7.57516 19.838 7.64551 19.877C7.57516 19.838 7.5057 19.7976 7.43652 19.7568ZM16.4277 19.835C16.4854 19.8023 16.5427 19.7692 16.5996 19.7354C16.5427 19.7692 16.4854 19.8023 16.4277 19.835ZM7.0918 19.542C7.15349 19.5822 7.21461 19.6234 7.27734 19.6621C7.21461 19.6234 7.15349 19.5822 7.0918 19.542ZM16.7832 19.6221C16.8425 19.5848 16.9016 19.5474 16.96 19.5088C16.9016 19.5474 16.8425 19.5848 16.7832 19.6221ZM6.70898 19.2783C6.77462 19.3261 6.84027 19.3739 6.90723 19.4199C6.84027 19.3739 6.77462 19.3261 6.70898 19.2783ZM17.1602 19.3721C17.2104 19.3368 17.2601 19.3009 17.3096 19.2646C17.2601 19.3009 17.2104 19.3368 17.1602 19.3721ZM6.27832 18.9463C6.37773 19.0283 6.47911 19.1078 6.58203 19.1855C6.47911 19.1078 6.37773 19.0283 6.27832 18.9463ZM17.4697 19.1445C17.536 19.0937 17.6012 19.0418 17.666 18.9893C17.6012 19.0418 17.536 19.0937 17.4697 19.1445ZM6.05664 18.7559C6.12506 18.8161 6.19343 18.8764 6.26367 18.9346C6.19343 18.8764 6.12506 18.8161 6.05664 18.7559ZM17.8008 18.8779C17.8578 18.8298 17.914 18.7809 17.9697 18.7314C17.914 18.7809 17.8578 18.8298 17.8008 18.8779ZM18.1348 18.582C18.1838 18.5363 18.2323 18.4901 18.2803 18.4434C18.2323 18.4901 18.1838 18.5363 18.1348 18.582ZM18.4434 18.2803C18.4876 18.2349 18.531 18.1889 18.5742 18.1426C18.531 18.1889 18.4876 18.2349 18.4434 18.2803ZM18.7256 17.9785C18.7801 17.9173 18.8329 17.8547 18.8857 17.792C18.8329 17.8547 18.7801 17.9173 18.7256 17.9785ZM5.0752 17.749C5.10307 17.7826 5.13278 17.8145 5.16113 17.8477C5.13278 17.8145 5.10307 17.7826 5.0752 17.749ZM18.9844 17.6729C19.0404 17.604 19.0954 17.5344 19.1494 17.4639C19.0954 17.5344 19.0404 17.604 18.9844 17.6729ZM4.81445 17.4189C4.85722 17.4756 4.90223 17.5304 4.94629 17.5859C4.90223 17.5304 4.85722 17.4756 4.81445 17.4189ZM19.2637 17.3115C19.3022 17.259 19.3396 17.2057 19.377 17.1523C19.3396 17.2057 19.3022 17.259 19.2637 17.3115ZM4.57422 17.085C4.61067 17.1381 4.64897 17.1899 4.68652 17.2422C4.64897 17.1899 4.61067 17.1381 4.57422 17.085ZM12.3691 6.86328L12.7305 6.90137L12.8779 6.92188L13.043 8.00781L13.0859 8.29395L12.8037 8.23438C12.5442 8.17942 12.276 8.1504 12 8.15039C9.87347 8.15039 8.15039 9.87369 8.15039 12C8.15047 14.126 9.87355 15.8496 12 15.8496C14.1262 15.8496 15.8495 14.126 15.8496 12C15.8496 11.7243 15.8208 11.4555 15.7656 11.1963L15.7061 10.9131L15.9912 10.957L16.9307 11.0996L17.0771 11.1221L17.0986 11.2695C17.1326 11.508 17.1504 11.7522 17.1504 12C17.1503 14.8442 14.8442 17.1494 12 17.1494C9.15574 17.1494 6.84969 14.8442 6.84961 12C6.84961 9.15576 9.15569 6.84961 12 6.84961C12.1242 6.84961 12.2473 6.85455 12.3691 6.86328ZM19.5156 16.9492C19.5464 16.9026 19.5766 16.8558 19.6064 16.8086C19.5766 16.8558 19.5464 16.9026 19.5156 16.9492ZM11.252 16.8926C11.4139 16.9171 11.5784 16.9349 11.7451 16.9434C11.5784 16.9349 11.4139 16.9171 11.252 16.8926ZM4.33691 16.7217C4.37256 16.7794 4.41036 16.8357 4.44727 16.8926C4.41036 16.8357 4.37256 16.7794 4.33691 16.7217ZM11.0107 16.8496C11.0777 16.8632 11.145 16.8759 11.2129 16.8867C11.145 16.8759 11.0777 16.8632 11.0107 16.8496ZM12.8955 16.8662C12.9239 16.861 12.9523 16.8563 12.9805 16.8506C12.9523 16.8563 12.9239 16.861 12.8955 16.8662ZM10.7959 16.8008C10.8483 16.8139 10.9011 16.8255 10.9541 16.8369C10.9011 16.8255 10.8483 16.8139 10.7959 16.8008ZM13.1309 16.8174C13.1563 16.8114 13.1818 16.8061 13.207 16.7998C13.1818 16.8061 13.1563 16.8114 13.1309 16.8174ZM10.5723 16.7393C10.6044 16.7489 10.6365 16.7586 10.6689 16.7676C10.6365 16.7586 10.6044 16.7489 10.5723 16.7393ZM13.375 16.7539C13.3967 16.7476 13.4188 16.7429 13.4404 16.7363C13.4188 16.7429 13.3967 16.7476 13.375 16.7539ZM10.3486 16.666C10.3801 16.6771 10.4117 16.6877 10.4434 16.6982C10.4117 16.6877 10.3801 16.6771 10.3486 16.666ZM13.6133 16.6797C13.6313 16.6735 13.6491 16.6666 13.667 16.6602C13.6491 16.6666 13.6313 16.6735 13.6133 16.6797ZM10.1182 16.5781C10.1548 16.5932 10.1915 16.6079 10.2285 16.6221C10.1915 16.6079 10.1547 16.5932 10.1182 16.5781ZM13.833 16.5967C13.8493 16.5902 13.8656 16.5838 13.8818 16.5771C13.8656 16.5838 13.8493 16.5902 13.833 16.5967ZM19.7393 16.5928C19.7742 16.534 19.8082 16.4747 19.8418 16.415C19.8082 16.4747 19.7742 16.534 19.7393 16.5928ZM9.90918 16.4863C9.94797 16.5044 9.98704 16.5219 10.0264 16.5391C9.98704 16.5219 9.94797 16.5044 9.90918 16.4863ZM4.12207 16.3525C4.1548 16.4116 4.18865 16.47 4.22266 16.5283C4.18865 16.47 4.1548 16.4116 4.12207 16.3525ZM14.0381 16.5098C14.0583 16.5006 14.0786 16.4918 14.0986 16.4824C14.0786 16.4918 14.0583 16.5006 14.0381 16.5098ZM9.70508 16.3857C9.73614 16.402 9.76739 16.418 9.79883 16.4336C9.76738 16.418 9.73614 16.402 9.70508 16.3857ZM9.52441 16.2852C9.54499 16.2971 9.56517 16.3097 9.58594 16.3213C9.56517 16.3097 9.54499 16.2971 9.52441 16.2852ZM14.4707 16.2871C14.4837 16.2796 14.4968 16.2723 14.5098 16.2646C14.4968 16.2723 14.4837 16.2796 14.4707 16.2871ZM19.9434 16.2305C19.9835 16.1553 20.0225 16.0794 20.0605 16.0029C20.0225 16.0794 19.9835 16.1553 19.9434 16.2305ZM9.26758 16.127C9.30917 16.1545 9.35109 16.1817 9.39355 16.208C9.35109 16.1817 9.30917 16.1545 9.26758 16.127ZM3.90723 15.9395C3.94697 16.0209 3.98817 16.1016 4.03027 16.1816C3.98817 16.1016 3.94697 16.0209 3.90723 15.9395ZM14.6455 16.1816C14.6744 16.1633 14.7039 16.1459 14.7324 16.127C14.7039 16.1459 14.6744 16.1633 14.6455 16.1816ZM9.07129 15.9893C9.11828 16.0238 9.16563 16.0579 9.21387 16.0908C9.16562 16.0579 9.11829 16.0238 9.07129 15.9893ZM14.8242 16.0635C14.8599 16.0386 14.8957 16.014 14.9307 15.9883C14.8957 16.014 14.8599 16.0386 14.8242 16.0635ZM12.2666 16.04C12.1784 16.0458 12.0896 16.0498 12 16.0498C12.0896 16.0498 12.1784 16.0458 12.2666 16.04ZM8.68359 15.6738C8.79287 15.7725 8.90662 15.8663 9.02441 15.9551C8.90661 15.8663 8.79289 15.7725 8.68359 15.6738ZM15.0078 15.9287C15.0411 15.9032 15.0738 15.8769 15.1064 15.8506C15.0738 15.8769 15.0411 15.9032 15.0078 15.9287ZM20.1357 15.8496C20.1729 15.7712 20.2082 15.6919 20.2432 15.6123C20.2082 15.6919 20.1729 15.7712 20.1357 15.8496ZM3.74902 15.5957C3.78065 15.6682 3.81322 15.7401 3.84668 15.8115C3.81322 15.7401 3.78065 15.6682 3.74902 15.5957ZM15.2129 15.7637C15.2353 15.7445 15.2572 15.7247 15.2793 15.7051C15.2572 15.7247 15.2353 15.7445 15.2129 15.7637ZM15.373 15.6201C15.4012 15.5939 15.4295 15.5679 15.457 15.541C15.4295 15.5679 15.4012 15.5939 15.373 15.6201ZM8.33301 15.3252C8.38717 15.3849 8.44302 15.443 8.5 15.5L8.33594 15.3281C8.33501 15.3271 8.33393 15.3262 8.33301 15.3252ZM20.3096 15.459C20.342 15.3811 20.373 15.3026 20.4033 15.2236C20.373 15.3026 20.342 15.3811 20.3096 15.459ZM15.541 15.457C15.5727 15.4246 15.604 15.3917 15.6348 15.3584C15.604 15.3917 15.5727 15.4246 15.541 15.457ZM3.59668 15.2236C3.61739 15.2776 3.63844 15.3313 3.66016 15.3848C3.63844 15.3313 3.61739 15.2776 3.59668 15.2236ZM8.04102 14.9707C8.11992 15.0757 8.20321 15.1771 8.29004 15.2754C8.2032 15.1771 8.11993 15.0757 8.04102 14.9707ZM15.71 15.2754C15.7341 15.2481 15.7577 15.2202 15.7812 15.1924C15.7577 15.2202 15.7341 15.2481 15.71 15.2754ZM15.8555 15.1016C15.8729 15.0799 15.8901 15.0581 15.9072 15.0361C15.8901 15.0581 15.8729 15.0799 15.8555 15.1016ZM20.4668 15.0576C20.4956 14.9779 20.5213 14.8971 20.5479 14.8164C20.5213 14.8971 20.4956 14.9779 20.4668 15.0576ZM9.27637 14.998C9.29583 15.0157 9.31613 15.0325 9.33594 15.0498C9.31302 15.0298 9.29004 15.0098 9.26758 14.9893L9.27637 14.998ZM3.43555 14.7676C3.46251 14.8511 3.49021 14.9342 3.51953 15.0166C3.49021 14.9342 3.46251 14.8511 3.43555 14.7676ZM15.9971 14.9189C16.0182 14.8901 16.0381 14.8604 16.0586 14.8311C16.0381 14.8604 16.0182 14.8901 15.9971 14.9189ZM7.91699 14.7979C7.92901 14.8154 7.94186 14.8323 7.9541 14.8496C7.94186 14.8323 7.92901 14.8154 7.91699 14.7979ZM16.1309 14.7256C16.1594 14.6824 16.1876 14.6389 16.2148 14.5947C16.1876 14.6389 16.1594 14.6824 16.1309 14.7256ZM7.78027 14.5879C7.80275 14.6245 7.82622 14.6604 7.84961 14.6963C7.82621 14.6604 7.80275 14.6245 7.78027 14.5879ZM20.6084 14.6299C20.6293 14.5614 20.6477 14.4921 20.667 14.4229C20.6477 14.4921 20.6293 14.5614 20.6084 14.6299ZM3.31641 14.3682C3.33706 14.4441 3.35829 14.5196 3.38086 14.5947C3.35829 14.5196 3.33706 14.4441 3.31641 14.3682ZM16.25 14.5361C16.2703 14.5022 16.2901 14.468 16.3096 14.4336C16.2901 14.468 16.2703 14.5022 16.25 14.5361ZM7.67578 14.4082C7.68452 14.4239 7.69324 14.4395 7.70215 14.4551C7.69324 14.4395 7.68452 14.4239 7.67578 14.4082ZM16.3809 14.3047C16.3977 14.2728 16.4135 14.2403 16.4297 14.208C16.4135 14.2403 16.3977 14.2728 16.3809 14.3047ZM7.55957 14.1885C7.57628 14.2223 7.59387 14.2557 7.61133 14.2891C7.59387 14.2557 7.57628 14.2223 7.55957 14.1885ZM20.7266 14.208C20.7444 14.1372 20.7592 14.0656 20.7754 13.9941C20.7592 14.0656 20.7444 14.1372 20.7266 14.208ZM3.20898 13.9268C3.22861 14.0167 3.24822 14.1064 3.27051 14.1953C3.24822 14.1064 3.22861 14.0167 3.20898 13.9268ZM16.4756 14.1133C16.4895 14.0838 16.5032 14.0542 16.5166 14.0244C16.5032 14.0542 16.4895 14.0838 16.4756 14.1133ZM7.46094 13.9756C7.47795 14.0146 7.49569 14.0533 7.51367 14.0918C7.49568 14.0533 7.47796 14.0146 7.46094 13.9756ZM7.37793 13.7725C7.38595 13.7934 7.39405 13.8142 7.40234 13.835C7.39405 13.8142 7.38595 13.7934 7.37793 13.7725ZM20.8223 13.7832C20.8361 13.7146 20.8471 13.6454 20.8594 13.5762C20.8471 13.6454 20.8361 13.7146 20.8223 13.7832ZM3.13184 13.5303C3.14605 13.6132 3.15931 13.6962 3.17578 13.7783C3.15931 13.6962 3.14605 13.6132 3.13184 13.5303ZM16.6621 13.666C16.6748 13.6305 16.6863 13.5945 16.6982 13.5586C16.6863 13.5945 16.6748 13.6305 16.6621 13.666ZM7.30078 13.5557C7.31127 13.5874 7.3219 13.619 7.33301 13.6504C7.32189 13.619 7.31127 13.5874 7.30078 13.5557ZM16.7344 13.4463C16.7469 13.4052 16.7581 13.3638 16.7695 13.3223C16.758 13.3638 16.7469 13.4052 16.7344 13.4463ZM7.23047 13.3223C7.24013 13.3572 7.24936 13.3922 7.25977 13.4268C7.24936 13.3922 7.24013 13.3572 7.23047 13.3223ZM20.9883 12.4629C20.9736 12.7535 20.945 13.0405 20.9033 13.3232C20.945 13.0405 20.9736 12.7535 20.9883 12.4629ZM3.05371 12.9746C3.0663 13.0915 3.08063 13.2077 3.09766 13.3232C3.08063 13.2077 3.0663 13.0915 3.05371 12.9746ZM16.8008 13.209C16.8097 13.1734 16.817 13.1374 16.8252 13.1016C16.817 13.1374 16.8097 13.1734 16.8008 13.209ZM7.1582 13.0293C7.16915 13.081 7.18081 13.1325 7.19336 13.1836C7.18081 13.1325 7.16915 13.081 7.1582 13.0293ZM17.8613 6.13672L21.0303 6.62109L21.4209 6.67969L21.1416 6.95996L17.8877 10.2129L17.7881 10.1982L15.2412 9.80957L13.0967 11.9551C13.0973 11.9699 13.1006 11.9849 13.1006 12C13.1005 12.6075 12.6071 13.0996 12 13.0996C11.9888 13.0996 11.9916 13.1004 11.9746 13.1016C11.9643 13.1023 11.9515 13.1022 11.9365 13.1016C11.925 13.1011 11.9137 13.1 11.9023 13.0986L11.8643 13.0977L11.7861 13.0947L11.7627 13.0713C11.3407 12.9833 10.9827 12.6973 10.9111 12.2295L10.9092 12.2188L10.9023 12.1475L10.8936 12.0537L10.9023 12.0439C10.9017 12.0295 10.8994 12.0149 10.8994 12C10.8994 11.3924 11.393 10.8994 12 10.8994C12.0148 10.8994 12.0294 10.9017 12.0439 10.9023L14.1895 8.75586L13.8018 6.21191L13.7871 6.1123L13.8584 6.04004L17.04 2.8584L17.3203 2.5791L17.8613 6.13672ZM8.06738 12.9717C8.06252 12.9519 8.05829 12.932 8.05371 12.9121C8.05829 12.932 8.06252 12.9519 8.06738 12.9717ZM7.12988 12.8818C7.13498 12.9102 7.13896 12.9386 7.14453 12.9668C7.13896 12.9386 7.13498 12.9102 7.12988 12.8818ZM20.041 12.9629C20.0463 12.918 20.054 12.8733 20.0586 12.8281L20.0596 12.8154C20.0546 12.8648 20.0468 12.9138 20.041 12.9629ZM12.0918 12.8955L12 12.9004C12.0588 12.9004 12.1162 12.8936 12.1719 12.8828C12.1455 12.8879 12.1189 12.8928 12.0918 12.8955ZM3.01172 12.4629C3.01909 12.6084 3.03072 12.7529 3.04492 12.8965C3.03072 12.7529 3.01909 12.6084 3.01172 12.4629ZM12.2168 12.8721C12.2319 12.8683 12.2469 12.8649 12.2617 12.8604C12.2469 12.8648 12.2319 12.8683 12.2168 12.8721ZM12.2812 12.8535C12.3007 12.8471 12.32 12.8407 12.3389 12.833C12.32 12.8407 12.3007 12.8471 12.2812 12.8535ZM12.4551 12.7744C12.4663 12.7678 12.4774 12.761 12.4883 12.7539C12.4774 12.761 12.4663 12.7678 12.4551 12.7744ZM12.5947 12.6729C12.6004 12.6678 12.6067 12.6634 12.6123 12.6582C12.6067 12.6634 12.6004 12.6678 12.5947 12.6729ZM12.7061 12.5557C12.7118 12.5483 12.7171 12.5407 12.7227 12.5332C12.7171 12.5407 12.7118 12.5483 12.7061 12.5557ZM7.9707 12.4141C7.97237 12.4304 7.97568 12.4466 7.97754 12.4629C7.9752 12.4424 7.97175 12.422 7.96973 12.4014L7.9707 12.4141ZM12.8301 12.3467C12.8499 12.2994 12.8654 12.2502 12.877 12.1992C12.8654 12.2502 12.8499 12.2994 12.8301 12.3467ZM11.7324 11.1396C11.7042 11.1484 11.6764 11.1585 11.6494 11.1699C11.7032 11.1472 11.7599 11.1301 11.8184 11.1182L11.7324 11.1396ZM8.26855 10.4238C8.21731 10.545 8.17128 10.669 8.13184 10.7959C8.17128 10.669 8.21731 10.545 8.26855 10.4238ZM4.2959 9.49609C4.26675 9.58585 4.23994 9.67647 4.21387 9.76758C4.23995 9.67647 4.26674 9.58585 4.2959 9.49609ZM14.9961 6.46191L15.3115 8.66895L17.4717 8.92188L19.0068 7.5L16.9512 7.21973L16.8066 7.2002L16.4365 5.08984L14.9961 6.46191ZM11.791 7.95508C11.8602 7.95156 11.9299 7.9502 12 7.9502C11.9299 7.9502 11.8602 7.95156 11.791 7.95508ZM9.59082 4.26367C9.33709 4.34259 9.08904 4.43459 8.84668 4.53711C9.08903 4.43461 9.3371 4.34258 9.59082 4.26367ZM11.583 3.91016C11.7211 3.90316 11.8602 3.90039 12 3.90039C11.8602 3.90039 11.7211 3.90315 11.583 3.91016ZM14.5225 3.3584C14.429 3.33117 14.3349 3.3055 14.2402 3.28125C14.3349 3.30551 14.429 3.33117 14.5225 3.3584ZM13.9297 3.20703C13.8355 3.18647 13.7407 3.16798 13.6455 3.15039C13.7407 3.16799 13.8355 3.18646 13.9297 3.20703ZM13.5635 3.13574C13.498 3.12427 13.4322 3.11356 13.3662 3.10352C13.4322 3.11357 13.498 3.12426 13.5635 3.13574ZM13.249 3.08594C13.1728 3.07537 13.0963 3.06627 13.0195 3.05762C13.0963 3.06628 13.1728 3.07535 13.249 3.08594ZM12.9609 3.05078C12.8754 3.0417 12.7894 3.03401 12.7031 3.02734C12.7894 3.03402 12.8754 3.04169 12.9609 3.05078ZM12.6416 3.02246C12.5379 3.01516 12.4337 3.00962 12.3291 3.00586C12.4337 3.00962 12.5379 3.01515 12.6416 3.02246ZM15.8564 13.2373C15.8628 13.2175 15.869 13.1977 15.875 13.1777C15.8689 13.1977 15.8628 13.2175 15.8564 13.2373ZM15.8975 13.0967C15.9073 13.0616 15.9178 13.0267 15.9268 12.9912C15.9178 13.0267 15.9073 13.0616 15.8975 13.0967ZM14.2188 3.27637C14.1229 3.25207 14.0267 3.22822 13.9297 3.20703C14.0267 3.22824 14.1229 3.25206 14.2188 3.27637Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };
-TrackIcon_TrackIcon.displayName = 'TrackIcon|track';
-const TrackIcon = TrackIcon_TrackIcon;
-export { TrackIcon as default };
+TrackIcon.displayName = 'TrackIcon|track';
+const web_TrackIcon = TrackIcon;
+export { web_TrackIcon as default };

package/dist/web/TradeIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TradeIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TradeIcon;

package/dist/web/TradeIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TradeIcon_TradeIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TradeIcon_TradeIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M11.0555 21.0256H2.97246V12.9426H11.0555V21.0256ZM20.5389 13.0989V15.9915C20.5389 17.2701 20.0309 18.4965 19.1268 19.4006C18.2227 20.3046 16.9961 20.8127 15.7176 20.8127H12.825V18.884H15.7176C16.4847 18.884 17.221 18.5788 17.7635 18.0364C18.3058 17.4939 18.6102 16.7585 18.6102 15.9915V13.0989H20.5389ZM4.58965 19.4084H9.43828V14.5598H4.58965V19.4084ZM16.6824 2.97485C17.8329 2.97492 18.9362 3.43193 19.7498 4.24536C20.5635 5.05906 21.0213 6.16298 21.0213 7.31372C21.0213 8.46445 20.5635 9.56839 19.7498 10.3821C18.9362 11.1955 17.8329 11.6525 16.6824 11.6526C15.5317 11.6526 14.4277 11.1957 13.6141 10.3821C12.8004 9.56839 12.3436 8.46445 12.3436 7.31372C12.3436 6.16298 12.8004 5.05906 13.6141 4.24536C14.4277 3.43173 15.5317 2.97485 16.6824 2.97485ZM10.8973 5.38501H8.00468C7.23752 5.38501 6.50125 5.6902 5.95879 6.23267C5.41651 6.77505 5.11218 7.51062 5.11211 8.27759V11.1702H3.1834V8.27759C3.18347 6.99918 3.69158 5.77341 4.5955 4.86938C5.49962 3.96527 6.72608 3.45728 8.00468 3.45728H10.8973V5.38501ZM16.6824 4.90356C16.0432 4.90363 15.4303 5.15761 14.9783 5.60962C14.5263 6.06167 14.2723 6.67446 14.2723 7.31372C14.2723 7.95296 14.5263 8.56579 14.9783 9.01782C15.4303 9.4698 16.0432 9.72381 16.6824 9.72388C16.9988 9.72387 17.3119 9.66133 17.6043 9.54028C17.8968 9.41916 18.1627 9.24166 18.3865 9.01782C18.6102 8.79412 18.7878 8.52882 18.909 8.23657C19.0301 7.94412 19.0926 7.63027 19.0926 7.31372C19.0926 6.99715 19.0301 6.68334 18.909 6.39087C18.7878 6.09855 18.6103 5.83238 18.3865 5.60864C18.1627 5.38498 17.8966 5.20724 17.6043 5.08618C17.312 4.96522 16.9987 4.90357 16.6824 4.90356Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TradeMainIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TradeMainIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TradeMainIcon;

package/dist/web/TradeMainIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TradeMainIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TradeMainIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M20.1943 13.2549C20.5958 13.2552 20.9496 13.622 20.9482 14.0713V20.2852C20.9482 20.7318 20.6235 21.0996 20.1924 21.0996H13.7002C13.2681 21.0994 12.9434 20.7319 12.9434 20.2852V14.0713C12.9434 13.6248 13.2679 13.255 13.7002 13.2549H20.1943ZM4.49316 12.584L6.46289 15.5166H5.14648C5.20603 16.6762 5.63581 17.6044 6.3125 18.2705C7.00995 18.957 7.97373 19.3712 9.07129 19.4697H9.07715C9.26392 19.4989 9.43468 19.5948 9.55664 19.7393C9.67835 19.8835 9.74352 20.0672 9.74121 20.2559L9.7373 20.3398C9.69316 20.7559 9.32583 21.0738 8.92383 21.043H8.92188C6.03944 20.7547 3.77919 18.6957 3.68262 15.5166H2.35645L4.32715 12.584L4.41016 12.4609L4.49316 12.584ZM14.4316 19.4971H19.4619V14.8574H14.4316V19.4971ZM15.0752 2.92969H15.0771C17.7472 3.18825 19.8735 4.99051 20.2549 7.76855H21.6436L19.6719 10.7012L19.5889 10.8242L19.5059 10.7012L17.6396 7.92383L17.5342 7.76855H18.7578C18.3846 5.83073 16.8499 4.69609 14.9258 4.50293C14.5463 4.46704 14.2858 4.09952 14.2588 3.72363V3.71582C14.2589 3.25981 14.646 2.89534 15.0752 2.92969ZM10.3242 2.90039C10.7551 2.90044 11.081 3.26791 11.0811 3.71582V9.90039C11.0811 10.3484 10.7552 10.7167 10.3242 10.7168H3.83203C3.40105 10.7168 3.0752 10.3484 3.0752 9.90039V3.71582C3.0753 3.26788 3.40111 2.90041 3.83203 2.90039H10.3242ZM4.56348 9.14258H9.59473V4.47461H4.56348V9.14258Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TrainIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TrainIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TrainIcon;

package/dist/web/TrainIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TrainIcon_TrainIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TrainIcon_TrainIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M17.6147 2C18.6058 2.00365 19.555 2.39935 20.2554 3.10059C20.9557 3.80175 21.3505 4.75122 21.353 5.74219V15.4717C21.3498 16.3505 21.042 17.2008 20.4829 17.8789C19.9238 18.5569 19.1477 19.0208 18.2856 19.1914L20.6411 20.5781C20.7387 20.6185 20.8268 20.6797 20.8989 20.7568C20.9711 20.8341 21.0265 20.9261 21.0601 21.0264C21.0936 21.1267 21.1053 21.2337 21.0942 21.3389C21.0831 21.4439 21.0493 21.5457 20.9956 21.6367C20.942 21.7276 20.8692 21.8057 20.7827 21.8662C20.696 21.9268 20.5967 21.9682 20.4927 21.9873C20.3887 22.0064 20.2817 22.0033 20.1792 21.9775C20.0767 21.9518 19.9806 21.9039 19.8979 21.8379L15.3667 19.2188H8.6333L4.14307 21.7705C4.0607 21.8241 3.96758 21.8593 3.87061 21.875C3.77368 21.8907 3.67462 21.886 3.57959 21.8613C3.48456 21.8366 3.39583 21.7924 3.31885 21.7314C3.261 21.6856 3.21026 21.6314 3.16943 21.5703L3.09521 21.4434C3.06193 21.3781 3.03864 21.3079 3.02686 21.2354C3.01113 21.1385 3.01587 21.0393 3.04053 20.9443C3.06521 20.8495 3.10961 20.7605 3.17041 20.6836C3.23137 20.6066 3.30819 20.5429 3.39502 20.4971L5.75146 19.1377C4.88555 18.9895 4.09947 18.5405 3.53174 17.8701C2.96403 17.1996 2.65041 16.3502 2.64697 15.4717V5.74219C2.64949 4.75129 3.04443 3.80174 3.74463 3.10059C4.44507 2.3993 5.39507 2.00359 6.38623 2H17.6147ZM4.14307 12.875V15.4717C4.14308 16.0686 4.37843 16.6412 4.79834 17.0654C5.21835 17.4897 5.78927 17.7313 6.38623 17.7373H17.5923C18.193 17.7372 18.769 17.498 19.1938 17.0732C19.6186 16.6484 19.8579 16.0725 19.8579 15.4717V12.875H4.14307ZM7.354 13.8154C7.60887 13.7099 7.88911 13.6816 8.15967 13.7354C8.43031 13.7892 8.67935 13.9221 8.87451 14.1172C9.06967 14.3123 9.20248 14.5613 9.25635 14.832C9.3102 15.1028 9.28288 15.3836 9.17725 15.6387C9.07161 15.8937 8.89209 16.1113 8.6626 16.2646C8.43313 16.4179 8.16316 16.5 7.88721 16.5C7.51722 16.4999 7.16251 16.3525 6.90088 16.0908C6.63928 15.8291 6.49172 15.4745 6.4917 15.1045C6.4917 14.8285 6.57375 14.5586 6.72705 14.3291C6.88041 14.0996 7.09898 13.9211 7.354 13.8154ZM15.5884 13.8125C15.8434 13.7083 16.124 13.6816 16.394 13.7363C16.6642 13.7912 16.9127 13.9256 17.1069 14.1211C17.301 14.3166 17.4327 14.5656 17.4858 14.8359C17.5388 15.1063 17.5106 15.3863 17.4048 15.6406C17.2989 15.895 17.1204 16.1127 16.8911 16.2656C16.6618 16.4186 16.3923 16.5 16.1167 16.5C15.9327 16.5 15.7505 16.4633 15.5806 16.3926C15.4107 16.3219 15.2562 16.2184 15.1265 16.0879C14.9968 15.9574 14.8943 15.8022 14.8247 15.6318C14.7552 15.4617 14.72 15.2795 14.7212 15.0957C14.723 14.8201 14.806 14.5506 14.9604 14.3223C15.1148 14.0941 15.3334 13.9168 15.5884 13.8125ZM6.38623 3.47656C5.7893 3.48253 5.21835 3.72422 4.79834 4.14844C4.37844 4.57258 4.14316 5.14537 4.14307 5.74219V10.9805H19.8579L19.8804 5.74219C19.8802 5.14146 19.6411 4.56541 19.2163 4.14062C18.7915 3.71586 18.2155 3.47662 17.6147 3.47656H6.38623Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TranslateIcon.d.ts

@@ -0,0 +1,7 @@
+import { type IconColor } from '../core';
+import { type IconProps } from './types';
+declare const TranslateIcon: {
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default TranslateIcon;

package/dist/web/TranslateIcon.js

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { useWebColor } from "../core/index.js";
+const TranslateIcon_TranslateIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
+    return /*#__PURE__*/ jsx("svg", {
+        width: width,
+        height: height,
+        className: clsx,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        ...props,
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M7.18058 2.82324C6.99825 2.82324 6.82338 2.89567 6.69445 3.02461C6.56552 3.15354 6.49308 3.32841 6.49308 3.51074V4.21887H3.51208C3.32975 4.21887 3.15488 4.2913 3.02595 4.42023C2.89702 4.54916 2.82458 4.72403 2.82458 4.90637C2.82458 5.0887 2.89702 5.26357 3.02595 5.3925C3.15488 5.52143 3.32975 5.59387 3.51208 5.59387H4.58183C4.60292 6.78828 5.02092 7.92495 5.83583 9.00387C5.93392 9.13403 6.03658 9.26008 6.14383 9.38199C5.39217 9.88158 4.47779 10.2207 3.40071 10.3995H3.39933C3.31022 10.4143 3.2249 10.4465 3.14824 10.4943C3.07158 10.5421 3.00508 10.6045 2.95254 10.678C2.9 10.7514 2.86245 10.8346 2.84203 10.9225C2.82161 11.0105 2.81872 11.1017 2.83352 11.1908C2.84833 11.2799 2.88054 11.3652 2.92832 11.4419C2.9761 11.5186 3.03851 11.5851 3.11199 11.6376C3.18547 11.6901 3.26858 11.7277 3.35658 11.7481C3.44457 11.7685 3.53572 11.7714 3.62483 11.7566C5.03192 11.522 6.21717 11.049 7.18058 10.3376C8.144 11.049 9.32879 11.522 10.735 11.7566C10.8334 11.7727 10.9342 11.7673 11.0304 11.7407C11.1266 11.7141 11.2158 11.6669 11.292 11.6025C11.3682 11.538 11.4296 11.4579 11.4718 11.3674C11.514 11.277 11.5361 11.1785 11.5366 11.0787C11.5365 10.916 11.4787 10.7586 11.3735 10.6344C11.2682 10.5103 11.1224 10.4276 10.9618 10.4009C9.88567 10.2212 8.97129 9.88203 8.21871 9.38337C8.32504 9.26145 8.42725 9.13541 8.52533 9.00524C9.34025 7.92633 9.75825 6.7892 9.77933 5.59387H10.8518C11.0342 5.59387 11.209 5.52143 11.338 5.3925C11.4669 5.26357 11.5393 5.0887 11.5393 4.90637C11.5393 4.72403 11.4669 4.54916 11.338 4.42023C11.209 4.2913 11.0342 4.21887 10.8518 4.21887H7.86808V3.51074C7.86808 3.32841 7.79565 3.15354 7.66672 3.02461C7.53779 2.89567 7.36292 2.82324 7.18058 2.82324ZM18.4418 3.06249H14.2178C14.0355 3.06249 13.8606 3.13493 13.7317 3.26386C13.6028 3.39279 13.5303 3.56766 13.5303 3.74999C13.5303 3.93233 13.6028 4.1072 13.7317 4.23613C13.8606 4.36506 14.0355 4.43749 14.2178 4.43749H18.4391C18.7489 4.43749 19.0134 4.54703 19.2325 4.76612C19.4515 4.9852 19.5611 5.24966 19.5611 5.55949V9.78074C19.5611 9.96308 19.6335 10.1379 19.7624 10.2669C19.8914 10.3958 20.0662 10.4682 20.2486 10.4682C20.4309 10.4682 20.6058 10.3958 20.7347 10.2669C20.8637 10.1379 20.9361 9.96308 20.9361 9.78074V5.55949C20.9361 4.87016 20.6923 4.28166 20.2046 3.79399C19.7169 3.30633 19.1289 3.06249 18.4405 3.06249H18.4418ZM5.95683 5.59249H8.40433C8.38233 6.48166 8.05692 7.34333 7.42808 8.17749C7.34925 8.28108 7.26675 8.38191 7.18058 8.47999C7.09442 8.38191 7.01192 8.28016 6.93308 8.17474C6.30425 7.34241 5.97883 6.48212 5.95683 5.59387V5.59249ZM19.8718 20.8577L18.6096 18.259H15.0305L13.7696 20.8577C13.7302 20.939 13.6752 21.0117 13.6078 21.0717C13.5403 21.1317 13.4617 21.1778 13.3764 21.2075C13.2911 21.2371 13.2008 21.2496 13.1107 21.2444C13.0206 21.2391 12.9323 21.2161 12.8511 21.1767C12.7698 21.1374 12.6971 21.0824 12.6371 21.0149C12.5771 20.9475 12.531 20.8689 12.5014 20.7836C12.4717 20.6983 12.4592 20.608 12.4645 20.5178C12.4697 20.4277 12.4927 20.3395 12.5321 20.2582L15.9503 13.2127C16.1263 12.8488 16.416 12.6669 16.8193 12.6669C17.2227 12.6669 17.5128 12.8488 17.6897 13.2127L21.108 20.2582C21.1473 20.3395 21.1703 20.4277 21.1756 20.5178C21.1808 20.608 21.1683 20.6983 21.1387 20.7836C21.1091 20.8689 21.0629 20.9475 21.0029 21.0149C20.9429 21.0824 20.8702 21.1374 20.789 21.1767C20.7077 21.2161 20.6195 21.2391 20.5294 21.2444C20.4392 21.2496 20.3489 21.2371 20.2636 21.2075C20.1784 21.1778 20.0997 21.1317 20.0323 21.0717C19.9648 21.0117 19.9098 20.939 19.8705 20.8577H19.8718ZM4.34946 18.5271V14.3059C4.34946 14.1235 4.27703 13.9487 4.1481 13.8197C4.01916 13.6908 3.8443 13.6184 3.66196 13.6184C3.47962 13.6184 3.30476 13.6908 3.17582 13.8197C3.04689 13.9487 2.97446 14.1235 2.97446 14.3059V18.5271C2.97446 19.2165 3.21829 19.805 3.70596 20.2926C4.19363 20.7794 4.78213 21.0227 5.47146 21.0227H9.69271C9.87505 21.0227 10.0499 20.9503 10.1788 20.8214C10.3078 20.6924 10.3802 20.5176 10.3802 20.3352C10.3802 20.1529 10.3078 19.978 10.1788 19.8491C10.0499 19.7202 9.87505 19.6477 9.69271 19.6477H5.47146C5.16163 19.6477 4.89717 19.5387 4.67808 19.3205C4.459 19.1005 4.34946 18.836 4.34946 18.5271ZM16.818 14.5699L15.696 16.884H17.9413L16.818 14.5699Z",
+            fill: "currentColor"
+        })
+    });
+};
+TranslateIcon_TranslateIcon.displayName = 'TranslateIcon|translate';
+const TranslateIcon = TranslateIcon_TranslateIcon;
+export { TranslateIcon as default };

package/dist/web/TrashAllIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TrashAllIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TrashAllIcon;

package/dist/web/TrashAllIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TrashAllIcon_TrashAllIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TrashAllIcon_TrashAllIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M20.25 4.49951C20.4488 4.49951 20.6396 4.57874 20.7803 4.71924C20.9208 4.85977 20.9999 5.0508 21 5.24951C21 5.44839 20.9209 5.64013 20.7803 5.78076C20.6396 5.92123 20.4488 5.99951 20.25 5.99951H6.25V19.2495C6.25001 19.4135 6.28204 19.5765 6.34473 19.728C6.38039 19.8141 6.42691 19.8955 6.48047 19.9712V21.8022C5.46696 21.397 4.75004 20.4077 4.75 19.2495V5.99951H3.75C3.55123 5.99951 3.36035 5.92123 3.21973 5.78076C3.0791 5.64013 3.00003 5.44839 3 5.24951C3.00013 5.0508 3.07922 4.85977 3.21973 4.71924C3.36036 4.57874 3.5512 4.49951 3.75 4.49951H20.25ZM13.4434 21.5991H11.707L11.3096 19.9448H9.27832L8.88086 21.5991H7.2002L9.33398 14.3999H11.3096L13.4434 21.5991ZM15.8164 20.1479H17.2861V21.5991H14.1631V14.3999H15.8164V20.1479ZM20.1309 20.1479H21.5996V21.5991H18.4775V14.3999H20.1309V20.1479ZM10.2656 15.687C10.0995 16.4419 9.91459 17.2835 9.73926 17.9995L9.5918 18.6089H10.9961L10.8477 17.9995C10.6631 17.2835 10.4873 16.4223 10.3027 15.687H10.2656ZM18.5 7.49951C18.6988 7.49951 18.8896 7.57874 19.0303 7.71924C19.1708 7.85977 19.2499 8.0508 19.25 8.24951V13.1997H17.75V8.24951C17.7501 8.0508 17.8292 7.85977 17.9697 7.71924C18.1104 7.57874 18.3012 7.49951 18.5 7.49951ZM12.7998 9.49951C12.9986 9.49951 13.1895 9.5788 13.3301 9.71924C13.4706 9.85977 13.5497 10.0508 13.5498 10.2495V12.0005H12.0498V10.2495C12.0499 10.0508 12.129 9.85977 12.2695 9.71924C12.4101 9.57872 12.601 9.49956 12.7998 9.49951ZM14 1.99951C14.1988 1.99951 14.3896 2.07874 14.5303 2.21924C14.6708 2.35977 14.7499 2.5508 14.75 2.74951C14.75 2.94839 14.6709 3.14013 14.5303 3.28076C14.3896 3.42123 14.1988 3.49951 14 3.49951H10C9.80123 3.49951 9.61035 3.42123 9.46973 3.28076C9.3291 3.14013 9.25003 2.94839 9.25 2.74951C9.25013 2.5508 9.32922 2.35977 9.46973 2.21924C9.61036 2.07874 9.8012 1.99951 10 1.99951H14Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TrashIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TrashIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TrashIcon;

package/dist/web/TrashIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TrashIcon_TrashIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TrashIcon_TrashIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M4.75 6.00012H3.75C3.55109 6.00012 3.36032 5.9211 3.21967 5.78045C3.07902 5.6398 3 5.44903 3 5.25012C3 5.05121 3.07902 4.86044 3.21967 4.71979C3.36032 4.57914 3.55109 4.50012 3.75 4.50012H20.25C20.4489 4.50012 20.6397 4.57914 20.7803 4.71979C20.921 4.86044 21 5.05121 21 5.25012C21 5.44903 20.921 5.6398 20.7803 5.78045C20.6397 5.9211 20.4489 6.00012 20.25 6.00012H6.25V19.2501C6.25 19.4143 6.28233 19.5768 6.34515 19.7285C6.40797 19.8801 6.50004 20.0179 6.61612 20.134C6.73219 20.2501 6.86999 20.3422 7.02165 20.405C7.1733 20.4678 7.33585 20.5001 7.5 20.5001H16.5C16.6642 20.5001 16.8267 20.4678 16.9784 20.405C17.13 20.3422 17.2678 20.2501 17.3839 20.134C17.5 20.0179 17.592 19.8801 17.6548 19.7285C17.7177 19.5768 17.75 19.4143 17.75 19.2501V8.25012C17.75 8.05121 17.829 7.86044 17.9697 7.71979C18.1103 7.57914 18.3011 7.50012 18.5 7.50012C18.6989 7.50012 18.8897 7.57914 19.0303 7.71979C19.171 7.86044 19.25 8.05121 19.25 8.25012V19.2501C19.25 20.7689 18.0188 22.0001 16.5 22.0001H7.5C5.98125 22.0001 4.75 20.7689 4.75 19.2501V6.00012ZM10 3.50012C9.80109 3.50012 9.61032 3.4211 9.46967 3.28045C9.32902 3.1398 9.25 2.94903 9.25 2.75012C9.25 2.55121 9.32902 2.36044 9.46967 2.21979C9.61032 2.07914 9.80109 2.00012 10 2.00012H14C14.1989 2.00012 14.3897 2.07914 14.5303 2.21979C14.671 2.36044 14.75 2.55121 14.75 2.75012C14.75 2.94903 14.671 3.1398 14.5303 3.28045C14.3897 3.4211 14.1989 3.50012 14 3.50012H10ZM9.25 10.2501C9.25 10.0512 9.32902 9.86044 9.46967 9.71979C9.61032 9.57914 9.80109 9.50012 10 9.50012C10.1989 9.50012 10.3897 9.57914 10.5303 9.71979C10.671 9.86044 10.75 10.0512 10.75 10.2501V16.2501C10.75 16.449 10.671 16.6398 10.5303 16.7805C10.3897 16.9211 10.1989 17.0001 10 17.0001C9.80109 17.0001 9.61032 16.9211 9.46967 16.7805C9.32902 16.6398 9.25 16.449 9.25 16.2501V10.2501ZM13.25 10.2501C13.25 10.0512 13.329 9.86044 13.4697 9.71979C13.6103 9.57914 13.8011 9.50012 14 9.50012C14.1989 9.50012 14.3897 9.57914 14.5303 9.71979C14.671 9.86044 14.75 10.0512 14.75 10.2501V16.2501C14.75 16.449 14.671 16.6398 14.5303 16.7805C14.3897 16.9211 14.1989 17.0001 14 17.0001C13.8011 17.0001 13.6103 16.9211 13.4697 16.7805C13.329 16.6398 13.25 16.449 13.25 16.2501V10.2501Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TreeIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TreeIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TreeIcon;

package/dist/web/TreeIcon.js

@@ -1,18 +1,18 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-import { isThemeColor } from "../core/index.js";
-import { getHexColorFromCSSVariable } from "@particle-network/ui-shared";
-const TreeIcon_TreeIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const _color = isThemeColor(color) ? getHexColorFromCSSVariable(color) : color;
+import { useWebColor } from "../core/index.js";
+const TreeIcon_TreeIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
+        className: clsx,
         viewBox: "0 0 24 24",
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
             d: "M15.8512 2.00488C15.8452 2.02411 14.9273 4.95904 12.7477 6.62793C11.6251 7.48466 10.332 7.61908 9.48105 7.5918C9.98904 8.88634 10.6781 11.269 11.1852 13.5039C11.3549 14.2517 11.5318 15.0366 11.7008 15.8242C13.2282 14.6489 13.7464 14.2581 14.8346 13.042C15.2875 12.5357 15.6827 11.9812 16.0152 11.3896C15.7423 11.2555 15.3316 10.9702 15.1861 10.4199C14.9466 9.51432 15.274 8.63769 15.274 8.63769C15.274 8.63769 16.1096 9.21689 16.4185 10.0752C16.542 10.4182 16.5148 10.7513 16.4537 11.0088C16.8345 10.635 17.5539 10.1125 18.5533 10.1914C20.1719 10.3192 21.4066 11.3533 21.4254 11.3691C21.4084 11.3813 19.9664 12.4143 18.3824 12.4258C17.4337 12.4344 16.7182 11.9113 16.3727 11.5967C16.1038 12.2462 15.4697 13.4643 14.7008 14.3936C14.5961 14.5203 14.4859 14.6456 14.3746 14.7705C14.7935 14.5965 15.4976 14.422 16.2291 14.7617C17.4587 15.3333 18.0973 16.5039 18.0973 16.5039C18.0973 16.5039 16.6407 16.8921 15.3961 16.4395C14.5835 16.1467 14.1874 15.4405 14.0465 15.127C13.3385 15.8743 12.5622 16.5574 11.9557 17.0576C12.2835 18.7036 12.537 20.2826 12.5592 21.4746C12.5612 21.6434 11.982 21.7554 11.3473 21.9268C10.7118 22.0983 9.61322 22.005 9.71835 21.2393C9.73755 18.7896 9.6857 16.8582 9.59628 15.2139C9.00686 14.8167 8.26767 14.2735 7.6666 13.6904C7.03975 13.0837 6.48727 12.2543 6.25449 11.8242C6.07232 12.1896 5.69036 12.7294 4.96249 12.9219C3.74831 13.2428 2.57708 12.8046 2.5748 12.8037C2.5901 12.7817 3.36055 11.6814 4.49765 11.2715C5.00218 11.0899 5.49136 11.1479 5.84726 11.2461C5.71677 11.0381 5.61252 10.7641 5.63242 10.4297C5.68273 9.54975 6.23691 8.87012 6.23691 8.87012C6.25031 8.88807 6.81507 9.64993 6.84042 10.498C6.85294 10.9902 6.59831 11.3706 6.43124 11.5674C6.72891 12.0004 7.07488 12.3981 7.4664 12.749C8.23418 13.4372 8.63252 13.6983 9.53671 14.249C9.44921 12.955 9.34099 11.8311 9.22519 10.7402C9.06624 9.24288 8.7726 8.22648 8.55038 7.625C8.02104 7.75204 6.97262 7.86935 6.04648 7.13867C4.65789 6.04541 4.16074 4.35449 4.16074 4.35449C4.17951 4.35378 6.07912 4.28463 7.50937 5.22266C8.08181 5.59824 8.42072 6.12667 8.6207 6.58203C8.77419 5.66602 9.24453 4.26001 10.6607 3.36133C13.0363 1.85122 15.8263 2.00349 15.8512 2.00488Z",
-            fill: _color
+            fill: "currentColor"
         })
     });
 };

package/dist/web/TrenchIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const TrenchIcon: {
-    <T extends string = IconColor>({ size, width, height, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends string = IconColor>({ size, width, height, className, color, ...props }: IconProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default TrenchIcon;