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

package/dist/web/ChevronLeftSmallIcon.d.ts

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

package/dist/web/ChevronLeftSmallIcon.js

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

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

package/dist/web/ChevronRightIcon.js

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

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

package/dist/web/ChevronRightSmallIcon.js

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

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

package/dist/web/ChevronUpIcon.js

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

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

package/dist/web/ChevronUpSmallIcon.js

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

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

package/dist/web/ChevronsLeftIcon.js

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

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

package/dist/web/ChevronsUpIcon.js

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

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

package/dist/web/CircleAlertIcon.js

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

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

package/dist/web/CircleCheckFadedIcon.js

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

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

package/dist/web/CircleCheckFilledIcon.js

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

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

package/dist/web/CircleCheckIcon.js

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

package/dist/web/CircleChevronDownIcon.d.ts

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

package/dist/web/CircleChevronDownIcon.js

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

package/dist/web/CircleChevronUpIcon.d.ts

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

package/dist/web/CircleChevronUpIcon.js

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

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

package/dist/web/CircleCloseFadedIcon.js

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

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

package/dist/web/CircleCloseFilledIcon.js

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

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

package/dist/web/CircleCloseIcon.js

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

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

package/dist/web/CircleDollarIcon.js

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

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

package/dist/web/CircleFilledIcon.js

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

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

package/dist/web/CircleFlameIcon.js

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

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

package/dist/web/CircleMinusFadedIcon.js

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

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

package/dist/web/CircleMinusIcon.js

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

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

package/dist/web/CirclePendingIcon.js

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

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

package/dist/web/CirclePlusIcon.js

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

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

package/dist/web/CircleQuestionIcon.js

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

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

package/dist/web/ClipboardListIcon.js

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

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