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

package/dist/web/EllipsisVerticalIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const EllipsisVerticalIcon_EllipsisVerticalIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const EllipsisVerticalIcon_EllipsisVerticalIcon = ({ 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/EmptyIcon.d.ts

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

package/dist/web/EmptyIcon.js

@@ -1,7 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-const EmptyIcon_EmptyIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const EmptyIcon_EmptyIcon = ({ 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/ExpandIcon.d.ts

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

package/dist/web/ExpandIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ExpandIcon_ExpandIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ExpandIcon_ExpandIcon = ({ 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/ExternalLinkIcon.d.ts

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

package/dist/web/ExternalLinkIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const ExternalLinkIcon_ExternalLinkIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const ExternalLinkIcon_ExternalLinkIcon = ({ 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/EyeIcon.d.ts

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

package/dist/web/EyeIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const EyeIcon_EyeIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const EyeIcon_EyeIcon = ({ 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/EyeOffIcon.d.ts

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

package/dist/web/EyeOffIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const EyeOffIcon_EyeOffIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const EyeOffIcon = ({ 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 EyeOffIcon_EyeOffIcon = ({ size = 16, width = size, height = size, color =
         })
     });
 };
-EyeOffIcon_EyeOffIcon.displayName = 'EyeOffIcon|eye-off';
-const EyeOffIcon = EyeOffIcon_EyeOffIcon;
-export { EyeOffIcon as default };
+EyeOffIcon.displayName = 'EyeOffIcon|eye-off';
+const web_EyeOffIcon = EyeOffIcon;
+export { web_EyeOffIcon as default };

package/dist/web/FaceIcon.d.ts

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

package/dist/web/FaceIcon.js

@@ -1,7 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-const FaceIcon_FaceIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FaceIcon_FaceIcon = ({ 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/FaceSadIcon.d.ts

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

package/dist/web/FaceSadIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FaceSadIcon_FaceSadIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FaceSadIcon_FaceSadIcon = ({ 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/FaqIcon.d.ts

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

package/dist/web/FaqIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FaqIcon_FaqIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FaqIcon = ({ 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 FaqIcon_FaqIcon = ({ size = 16, width = size, height = size, color = 'curr
         })
     });
 };
-FaqIcon_FaqIcon.displayName = 'FaqIcon|faq';
-const FaqIcon = FaqIcon_FaqIcon;
-export { FaqIcon as default };
+FaqIcon.displayName = 'FaqIcon|faq';
+const web_FaqIcon = FaqIcon;
+export { web_FaqIcon as default };

package/dist/web/FileTextIcon.d.ts

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

package/dist/web/FileTextIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FileTextIcon_FileTextIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FileTextIcon_FileTextIcon = ({ 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/FilterIcon.d.ts

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

package/dist/web/FilterIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FilterIcon_FilterIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FilterIcon_FilterIcon = ({ 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/FingerprintIcon.d.ts

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

package/dist/web/FingerprintIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FingerprintIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FingerprintIcon = ({ 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/FlagIcon.d.ts

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

package/dist/web/FlagIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FlagIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FlagIcon = ({ 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/FlameFilledIcon.d.ts

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

package/dist/web/FlameFilledIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FlameFilledIcon_FlameFilledIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FlameFilledIcon_FlameFilledIcon = ({ 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/FlameIcon.d.ts

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

package/dist/web/FlameIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FlameIcon_FlameIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FlameIcon_FlameIcon = ({ 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/Flash1Icon.d.ts

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

package/dist/web/Flash1Icon.js

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

package/dist/web/FlashIcon.d.ts

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

package/dist/web/FlashIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FlashIcon_FlashIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FlashIcon_FlashIcon = ({ size = 16, width = size, height = size, className, color = 'currentColor', ...props })=>{
+    const clsx = useWebColor(color, className);
     return /*#__PURE__*/ jsx("svg", {
         width: width,
         height: height,
@@ -10,8 +11,8 @@ const FlashIcon_FlashIcon = ({ size = 16, width = size, height = size, color = '
         fill: "none",
         ...props,
         children: /*#__PURE__*/ jsx("path", {
-            d: "M9.57345 21.5C9.3145 21.4989 9.05921 21.4397 8.82695 21.3268C8.59468 21.2139 8.39155 21.0504 8.23294 20.8486C8.08124 20.6546 7.97774 20.4283 7.93072 20.1878C7.8837 19.9473 7.89448 19.6993 7.96218 19.4637L9.38073 14.111L7.03272 13.1801C6.19007 12.8473 5.78079 11.904 6.1183 11.0735C6.18877 10.9001 6.28912 10.7401 6.41491 10.6005L13.2221 3.05095C13.3715 2.87963 13.5564 2.74183 13.7643 2.6468C13.9722 2.55177 14.1984 2.50172 14.4276 2.5C14.9518 2.50272 15.4459 2.7427 15.7671 3.15139C15.9186 3.34541 16.0221 3.5717 16.0691 3.81218C16.1161 4.05266 16.1054 4.30065 16.0378 4.53631L14.6193 9.88897L16.9673 10.8157C17.8099 11.1485 18.2192 12.0918 17.8817 12.9223C17.8112 13.0956 17.7109 13.2557 17.5851 13.3953L10.7789 20.949C10.6295 21.1203 10.4446 21.2581 10.2367 21.3532C10.0288 21.4482 9.80262 21.4983 9.57345 21.5ZM14.4481 4.12762L7.64299 11.6759L11.3358 13.1326L9.55212 19.8724L16.358 12.3241L12.6652 10.8674L14.4481 4.12762Z",
-            fill: "currentColor"
+            d: "M9.57345 21.5C9.3145 21.4989 9.05921 21.4397 8.82695 21.3268C8.59468 21.2139 8.39155 21.0504 8.23294 20.8486C8.08124 20.6546 7.97774 20.4283 7.93072 20.1878C7.8837 19.9473 7.89448 19.6993 7.96218 19.4637L9.38073 14.111L6.03272 13.1801C5.19007 12.8473 4.78079 11.904 5.1183 11.0735C5.18877 10.9001 5.28912 10.7401 5.41491 10.6005L13.2221 3.05095C13.3715 2.87963 13.5564 2.74183 13.7643 2.6468C13.9722 2.55177 14.1984 2.50172 14.4276 2.5C14.9518 2.50272 15.4459 2.7427 15.7671 3.15139C15.9186 3.34541 16.0221 3.5717 16.0691 3.81218C16.1161 4.05266 16.1054 4.30065 16.0378 4.53631L14.6193 9.88897L17.9673 10.8157C18.8099 11.1485 19.2192 12.0918 18.8817 12.9223C18.8112 13.0956 18.7109 13.2557 18.5851 13.3953L10.7789 20.949C10.6295 21.1203 10.4446 21.2581 10.2367 21.3532C10.0288 21.4482 9.80262 21.4983 9.57345 21.5ZM14.4481 4.12762L6.64299 11.6759L11.3358 13.1326L9.55212 19.8724L17.358 12.3241L12.6652 10.8674L14.4481 4.12762Z",
+            fill: "white"
         })
     });
 };

package/dist/web/FolderIcon.d.ts

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

package/dist/web/FolderIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FolderIcon_FolderIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FolderIcon_FolderIcon = ({ 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/FullscreenIcon.d.ts

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

package/dist/web/FullscreenIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const FullscreenIcon_FullscreenIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const FullscreenIcon = ({ 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 FullscreenIcon_FullscreenIcon = ({ size = 16, width = size, height = size,
         })
     });
 };
-FullscreenIcon_FullscreenIcon.displayName = 'FullscreenIcon|fullscreen';
-const FullscreenIcon = FullscreenIcon_FullscreenIcon;
-export { FullscreenIcon as default };
+FullscreenIcon.displayName = 'FullscreenIcon|fullscreen';
+const web_FullscreenIcon = FullscreenIcon;
+export { web_FullscreenIcon as default };

package/dist/web/GasFeeIcon.d.ts

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

package/dist/web/GasFeeIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const GasFeeIcon_GasFeeIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const GasFeeIcon = ({ 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 GasFeeIcon_GasFeeIcon = ({ size = 16, width = size, height = size, color =
         })
     });
 };
-GasFeeIcon_GasFeeIcon.displayName = 'GasFeeIcon|gas-fee';
-const GasFeeIcon = GasFeeIcon_GasFeeIcon;
-export { GasFeeIcon as default };
+GasFeeIcon.displayName = 'GasFeeIcon|gas-fee';
+const web_GasFeeIcon = GasFeeIcon;
+export { web_GasFeeIcon as default };

package/dist/web/GhostIcon.d.ts

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

package/dist/web/GhostIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const GhostIcon_GhostIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const GhostIcon = ({ 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 GhostIcon_GhostIcon = ({ size = 16, width = size, height = size, color = '
         })
     });
 };
-GhostIcon_GhostIcon.displayName = 'GhostIcon|ghost';
-const GhostIcon = GhostIcon_GhostIcon;
-export { GhostIcon as default };
+GhostIcon.displayName = 'GhostIcon|ghost';
+const web_GhostIcon = GhostIcon;
+export { web_GhostIcon as default };

package/dist/web/GiftIcon.d.ts

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

package/dist/web/GiftIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const GiftIcon_GiftIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const GiftIcon_GiftIcon = ({ 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/GithubIcon.d.ts

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

package/dist/web/GithubIcon.js

@@ -1,7 +1,8 @@
 import { jsx } from "react/jsx-runtime";
 import "react";
-const GithubIcon_GithubIcon = ({ size = 16, width = size, height = size, color = 'currentColor', ...props })=>{
-    const clsx = 'currentColor' === color ? '' : `text-${color}`;
+import { useWebColor } from "../core/index.js";
+const GithubIcon_GithubIcon = ({ 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/GrassIcon.d.ts

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

package/dist/web/GrassIcon.js

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