@x-plat/design-system 0.2.3 → 0.2.4

package/dist/{colors-BNxEsOY3.d.cts → colors-cxE7RsuF.d.cts}

@@ -149,10 +149,18 @@ type MergedNamespaceColors<N extends keyof AllNamespaces> = N extends keyof Defa
 type ColorNamespace = keyof AllNamespaces;
 type ColorName<C extends ColorNamespace> = keyof MergedNamespaceColors<C>;
 type ColorDepth<C extends ColorNamespace, K extends ColorName<C>> = K extends keyof MergedNamespaceColors<C> ? MergedNamespaceColors<C>[K] extends string ? undefined : keyof MergedNamespaceColors<C>[K] : undefined;
+type BuildTokenStrings<N extends ColorNamespace> = {
+    [C in ColorName<N>]: ColorDepth<N, C> extends undefined ? `${N & string}-${C & string}` : `${N & string}-${C & string}-${ColorDepth<N, C> & (string | number)}`;
+}[ColorName<N>];
+type ColorToken = {
+    [N in ColorNamespace]: BuildTokenStrings<N>;
+}[ColorNamespace];
 interface ColorProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> {
+    /** 축약형: "xplat-blue-500" 형태로 한번에 지정 */
+    colorToken?: ColorToken;
     colorNamespace?: N;
     color?: C;
     colorDepth?: ColorDepth<N, C>;
 }
 
-export { type CustomColors as C, type CustomNamespaces as a, type ColorNamespace as b, colors as c, type ColorName as d, type ColorDepth as e, type ColorProps as f };
+export { type CustomColors as C, type CustomNamespaces as a, type ColorNamespace as b, colors as c, type ColorName as d, type ColorDepth as e, type ColorToken as f, type ColorProps as g };

package/dist/{colors-BNxEsOY3.d.ts → colors-cxE7RsuF.d.ts}

@@ -149,10 +149,18 @@ type MergedNamespaceColors<N extends keyof AllNamespaces> = N extends keyof Defa
 type ColorNamespace = keyof AllNamespaces;
 type ColorName<C extends ColorNamespace> = keyof MergedNamespaceColors<C>;
 type ColorDepth<C extends ColorNamespace, K extends ColorName<C>> = K extends keyof MergedNamespaceColors<C> ? MergedNamespaceColors<C>[K] extends string ? undefined : keyof MergedNamespaceColors<C>[K] : undefined;
+type BuildTokenStrings<N extends ColorNamespace> = {
+    [C in ColorName<N>]: ColorDepth<N, C> extends undefined ? `${N & string}-${C & string}` : `${N & string}-${C & string}-${ColorDepth<N, C> & (string | number)}`;
+}[ColorName<N>];
+type ColorToken = {
+    [N in ColorNamespace]: BuildTokenStrings<N>;
+}[ColorNamespace];
 interface ColorProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> {
+    /** 축약형: "xplat-blue-500" 형태로 한번에 지정 */
+    colorToken?: ColorToken;
     colorNamespace?: N;
     color?: C;
     colorDepth?: ColorDepth<N, C>;
 }
 
-export { type CustomColors as C, type CustomNamespaces as a, type ColorNamespace as b, colors as c, type ColorName as d, type ColorDepth as e, type ColorProps as f };
+export { type CustomColors as C, type CustomNamespaces as a, type ColorNamespace as b, colors as c, type ColorName as d, type ColorDepth as e, type ColorToken as f, type ColorProps as g };

package/dist/components/Avatar/index.cjs

@@ -56,9 +56,10 @@ var Avatar = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Avatar/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 type AvatarSize = "sm" | "md" | "lg";
 interface AvatarProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Avatar/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 
 type AvatarSize = "sm" | "md" | "lg";
 interface AvatarProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Avatar/index.js

@@ -30,9 +30,10 @@ var Avatar = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Badge/index.cjs

@@ -57,9 +57,10 @@ var Badge = (props) => {
     colorNamespace = "xplat",
     color = "red",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Badge/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 import React from 'react';
 
 type BadgeSize = "sm" | "md" | "lg";

package/dist/components/Badge/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 import React from 'react';
 
 type BadgeSize = "sm" | "md" | "lg";

package/dist/components/Badge/index.js

@@ -31,9 +31,10 @@ var Badge = (props) => {
     colorNamespace = "xplat",
     color = "red",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Button/index.cjs

@@ -55,11 +55,12 @@ var Button = (props) => {
     colorNamespace = "xplat",
     color = "black",
     colorDepth,
+    colorToken,
     disabled,
     className,
     ...rest
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Button/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 import React from 'react';
 import { B as ButtonAttributes } from '../../attributes-DJIWir_0.cjs';
 

package/dist/components/Button/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 import React from 'react';
 import { B as ButtonAttributes } from '../../attributes-DJIWir_0.js';
 

package/dist/components/Button/index.js

@@ -29,11 +29,12 @@ var Button = (props) => {
     colorNamespace = "xplat",
     color = "black",
     colorDepth,
+    colorToken,
     disabled,
     className,
     ...rest
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/CheckBox/index.cjs

@@ -952,6 +952,7 @@ var CheckBox = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     checked,
     label,
     onChange,
@@ -963,7 +964,7 @@ var CheckBox = (props) => {
   const handleChange = (e) => {
     if (onChange) onChange(e);
   };
-  const mainColor = getColorClass(
+  const mainColor = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/CheckBox/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 import { I as InputAttributes } from '../../attributes-DJIWir_0.cjs';
 import 'react';
 

package/dist/components/CheckBox/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 import { I as InputAttributes } from '../../attributes-DJIWir_0.js';
 import 'react';
 

package/dist/components/CheckBox/index.js

@@ -926,6 +926,7 @@ var CheckBox = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     checked,
     label,
     onChange,
@@ -937,7 +938,7 @@ var CheckBox = (props) => {
   const handleChange = (e) => {
     if (onChange) onChange(e);
   };
-  const mainColor = getColorClass(
+  const mainColor = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Chip/index.cjs

@@ -53,11 +53,12 @@ var Chip = (props) => {
     colorNamespace = "xplat",
     color = "black",
     colorDepth,
+    colorToken,
     type = "primary",
     size = "md",
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Chip/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 import React from 'react';
 
 type ChipType = "primary" | "secondary";

package/dist/components/Chip/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 import React from 'react';
 
 type ChipType = "primary" | "secondary";

package/dist/components/Chip/index.js

@@ -27,11 +27,12 @@ var Chip = (props) => {
     colorNamespace = "xplat",
     color = "black",
     colorDepth,
+    colorToken,
     type = "primary",
     size = "md",
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/DatePicker/index.cjs

@@ -12062,11 +12062,12 @@ var Button = (props) => {
     colorNamespace = "xplat",
     color = "black",
     colorDepth,
+    colorToken,
     disabled,
     className,
     ...rest
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/DatePicker/index.d.cts

@@ -1,6 +1,6 @@
 import React from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 interface InputDatePickerProps {
     value: Date;

package/dist/components/DatePicker/index.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 
 interface InputDatePickerProps {
     value: Date;

package/dist/components/DatePicker/index.js

@@ -12031,11 +12031,12 @@ var Button = (props) => {
     colorNamespace = "xplat",
     color = "black",
     colorDepth,
+    colorToken,
     disabled,
     className,
     ...rest
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Pagination/index.cjs

@@ -989,9 +989,10 @@ var Pagination = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Pagination/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 type PaginationSize = "sm" | "md" | "lg";
 interface PaginationProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Pagination/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 
 type PaginationSize = "sm" | "md" | "lg";
 interface PaginationProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Pagination/index.js

@@ -963,9 +963,10 @@ var Pagination = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Progress/index.cjs

@@ -56,9 +56,10 @@ var Progress = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Progress/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 type ProgressSize = "sm" | "md" | "lg";
 interface ProgressProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Progress/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 
 type ProgressSize = "sm" | "md" | "lg";
 interface ProgressProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Progress/index.js

@@ -30,9 +30,10 @@ var Progress = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Radio/index.cjs

@@ -76,6 +76,7 @@ var Radio = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     size: sizeProp,
     ...rest
   } = props;
@@ -88,7 +89,7 @@ var Radio = (props) => {
     value,
     onChange: rest.onChange
   };
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Radio/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 import { I as InputAttributes } from '../../attributes-DJIWir_0.cjs';
 import React from 'react';
 

package/dist/components/Radio/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 import { I as InputAttributes } from '../../attributes-DJIWir_0.js';
 import React from 'react';
 

package/dist/components/Radio/index.js

@@ -39,6 +39,7 @@ var Radio = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     size: sizeProp,
     ...rest
   } = props;
@@ -51,7 +52,7 @@ var Radio = (props) => {
     value,
     onChange: rest.onChange
   };
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Spinner/index.cjs

@@ -53,9 +53,10 @@ var Spinner = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Spinner/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 type SpinnerSize = "sm" | "md" | "lg";
 interface SpinnerProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Spinner/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 
 type SpinnerSize = "sm" | "md" | "lg";
 interface SpinnerProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Spinner/index.js

@@ -27,9 +27,10 @@ var Spinner = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Steps/index.cjs

@@ -954,9 +954,10 @@ var Steps = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Steps/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 interface StepItem {
     title: string;

package/dist/components/Steps/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 
 interface StepItem {
     title: string;

package/dist/components/Steps/index.js

@@ -928,9 +928,10 @@ var Steps = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Switch/index.cjs

@@ -70,6 +70,7 @@ var Switch = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
   const [isAnimating, setIsAnimating] = import_react.default.useState(false);
@@ -89,7 +90,7 @@ var Switch = (props) => {
       timeoutRef.current = null;
     }, KNOB_TRANSITION_MS);
   };
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Switch/index.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 type SwitchSize = "sm" | "md" | "lg";
 interface SwitchProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Switch/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.js';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.js';
 
 type SwitchSize = "sm" | "md" | "lg";
 interface SwitchProps<N extends ColorNamespace, C extends ColorName<N> = ColorName<N>> extends ColorProps<N, C> {

package/dist/components/Switch/index.js

@@ -34,6 +34,7 @@ var Switch = (props) => {
     colorNamespace = "xplat",
     color = "blue",
     colorDepth,
+    colorToken,
     className
   } = props;
   const [isAnimating, setIsAnimating] = React.useState(false);
@@ -53,7 +54,7 @@ var Switch = (props) => {
       timeoutRef.current = null;
     }, KNOB_TRANSITION_MS);
   };
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Table/index.cjs

@@ -217,6 +217,7 @@ var TableRow = (props) => {
     colorNamespace = "xplat",
     color = "black",
     colorDepth,
+    colorToken,
     type = "secondary",
     isHover,
     onClick
@@ -229,7 +230,7 @@ var TableRow = (props) => {
       return [...prev, ref];
     });
   };
-  const colorClass = getColorClass(
+  const colorClass = colorToken ?? getColorClass(
     colorNamespace,
     color,
     colorDepth ?? 500

package/dist/components/Table/index.d.cts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React from 'react';
-import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, f as ColorProps } from '../../colors-BNxEsOY3.cjs';
+import { b as ColorNamespace, d as ColorName, a as CustomNamespaces, C as CustomColors, g as ColorProps } from '../../colors-cxE7RsuF.cjs';
 
 interface TableProps {
     className?: string;