@particle-network/icons 0.4.0-beta.1 → 0.4.0-beta.11

package/dist/web/CabalLeaderIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CabalLeaderIcon: {
-    <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 CabalLeaderIcon;

package/dist/web/CabalLeaderIcon.js

@@ -1,7 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-const CabalLeaderIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CabalLeaderIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsxs("svg", {
         width: width,
         height: height,

package/dist/web/CalendarCheckIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CalendarCheckIcon: {
-    <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 CalendarCheckIcon;

package/dist/web/CalendarCheckIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CalendarCheckIcon_CalendarCheckIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CalendarCheckIcon_CalendarCheckIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/CalendarIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CalendarIcon: {
-    <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 CalendarIcon;

package/dist/web/CalendarIcon.js

@@ -1,7 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-const CalendarIcon_CalendarIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CalendarIcon_CalendarIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsxs("svg", {
         width: width,
         height: height,

package/dist/web/CameraIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CameraIcon: {
-    <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 CameraIcon;

package/dist/web/CameraIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CameraIcon_CameraIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CameraIcon_CameraIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/Candle2Icon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const Candle2Icon: {
-    <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 Candle2Icon;

package/dist/web/Candle2Icon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const Candle2Icon_Candle2Icon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const Candle2Icon_Candle2Icon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/CandleIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CandleIcon: {
-    <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 CandleIcon;

package/dist/web/CandleIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CandleIcon_CandleIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CandleIcon_CandleIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/CarIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CarIcon: {
-    <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 CarIcon;

package/dist/web/CarIcon.js

@@ -1,7 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-const CarIcon_CarIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CarIcon_CarIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsxs("svg", {
         width: width,
         height: height,

package/dist/web/CashBagIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CashBagIcon: {
-    <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 CashBagIcon;

package/dist/web/CashBagIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CashBagIcon_CashBagIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CashBagIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -15,6 +16,6 @@ const CashBagIcon_CashBagIcon = ({ size = 16, width = size, height = size, color
         })
     });
 };
-CashBagIcon_CashBagIcon.displayName = 'CashBagIcon|cash-bag';
-const CashBagIcon = CashBagIcon_CashBagIcon;
-export { CashBagIcon as default };
+CashBagIcon.displayName = 'CashBagIcon|cash-bag';
+const web_CashBagIcon = CashBagIcon;
+export { web_CashBagIcon as default };

package/dist/web/CashInIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CashInIcon: {
-    <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 CashInIcon;

package/dist/web/CashInIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CashInIcon_CashInIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CashInIcon_CashInIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/CashOutIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CashOutIcon: {
-    <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 CashOutIcon;

package/dist/web/CashOutIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CashOutIcon_CashOutIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CashOutIcon_CashOutIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/CashRewardsIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CashRewardsIcon: {
-    <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 CashRewardsIcon;

package/dist/web/CashRewardsIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CashRewardsIcon_CashRewardsIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CashRewardsIcon_CashRewardsIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/CatIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CatIcon: {
-    <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 CatIcon;

package/dist/web/CatIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CatIcon_CatIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CatIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -15,6 +16,6 @@ const CatIcon_CatIcon = ({ size = 16, width = size, height = size, color = 'curr
         })
     });
 };
-CatIcon_CatIcon.displayName = 'CatIcon|cat';
-const CatIcon = CatIcon_CatIcon;
-export { CatIcon as default };
+CatIcon.displayName = 'CatIcon|cat';
+const web_CatIcon = CatIcon;
+export { web_CatIcon as default };

package/dist/web/CexWalletIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CexWalletIcon: {
-    <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 CexWalletIcon;

package/dist/web/CexWalletIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CexWalletIcon_CexWalletIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CexWalletIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -17,6 +18,6 @@ const CexWalletIcon_CexWalletIcon = ({ size = 16, width = size, height = size, c
         })
     });
 };
-CexWalletIcon_CexWalletIcon.displayName = 'CexWalletIcon|cex-wallet';
-const CexWalletIcon = CexWalletIcon_CexWalletIcon;
-export { CexWalletIcon as default };
+CexWalletIcon.displayName = 'CexWalletIcon|cex-wallet';
+const web_CexWalletIcon = CexWalletIcon;
+export { web_CexWalletIcon as default };

package/dist/web/ChartColorSwitchIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChartColorSwitchIcon: {
-    <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 ChartColorSwitchIcon;

package/dist/web/ChartColorSwitchIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChartColorSwitchIcon_ChartColorSwitchIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChartColorSwitchIcon_ChartColorSwitchIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChartLine2Icon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChartLine2Icon: {
-    <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 ChartLine2Icon;

package/dist/web/ChartLine2Icon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChartLine2Icon_ChartLine2Icon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChartLine2Icon_ChartLine2Icon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChartLineCheckedIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChartLineCheckedIcon: {
-    <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 ChartLineCheckedIcon;

package/dist/web/ChartLineCheckedIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChartLineCheckedIcon_ChartLineCheckedIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChartLineCheckedIcon_ChartLineCheckedIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChartLineIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChartLineIcon: {
-    <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 ChartLineIcon;

package/dist/web/ChartLineIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChartLineIcon_ChartLineIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChartLineIcon_ChartLineIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChartPieIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChartPieIcon: {
-    <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 ChartPieIcon;

package/dist/web/ChartPieIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChartPieIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChartPieIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChartUpIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChartUpIcon: {
-    <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 ChartUpIcon;

package/dist/web/ChartUpIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChartUpIcon_ChartUpIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChartUpIcon_ChartUpIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/CheckIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const CheckIcon: {
-    <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 CheckIcon;

package/dist/web/CheckIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const CheckIcon_CheckIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const CheckIcon_CheckIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChefIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChefIcon: {
-    <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 ChefIcon;

package/dist/web/ChefIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChefIcon_ChefIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChefIcon_ChefIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChefOffIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChefOffIcon: {
-    <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 ChefOffIcon;

package/dist/web/ChefOffIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChefOffIcon_ChefOffIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChefOffIcon_ChefOffIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChevronDownIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChevronDownIcon: {
-    <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 ChevronDownIcon;

package/dist/web/ChevronDownIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChevronDownIcon_ChevronDownIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChevronDownIcon_ChevronDownIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChevronDownSmallIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChevronDownSmallIcon: {
-    <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 ChevronDownSmallIcon;

package/dist/web/ChevronDownSmallIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChevronDownSmallIcon_ChevronDownSmallIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChevronDownSmallIcon_ChevronDownSmallIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,

package/dist/web/ChevronLeftIcon.d.ts

@@ -1,7 +1,7 @@
 import { type IconColor } from '../core';
 import { type IconProps } from './types';
 declare const ChevronLeftIcon: {
-    <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 ChevronLeftIcon;

package/dist/web/ChevronLeftIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ChevronLeftIcon_ChevronLeftIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ChevronLeftIcon_ChevronLeftIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,