@impulse-ui-native/theme 3.0.0 → 5.0.0

package/dist/theme/create-button-tokens.js

@@ -3,7 +3,6 @@ function createButtonTokens(tokens) {
   const primaryContrast = tokens.colors.primary.contrast;
   const secondary = tokens.colors.secondary.value;
   const secondaryContrast = tokens.colors.secondary.contrast;
-  const neutral = tokens.colors.neutral;
   const disabledColor = tokens.colors.text.disabled;
   return {
     borderWidth: tokens.borderSize.sm,
@@ -30,44 +29,72 @@ function createButtonTokens(tokens) {
     },
     variants: {
       filled: {
-        backgroundColor: primary,
-        borderColor: primary,
-        color: primaryContrast,
-        disabledBackgroundColor: neutral["5"],
-        disabledBorderColor: neutral["5"],
-        disabledColor
+        default: {
+          backgroundColor: primary,
+          borderColor: primary,
+          color: primaryContrast
+        },
+        loading: {
+          backgroundColor: primary,
+          borderColor: primary,
+          color: primaryContrast
+        },
+        disabled: {
+          backgroundColor: tokens.colors.surface.primary.value,
+          borderColor: tokens.colors.border.default.value,
+          color: disabledColor
+        }
       },
       outlined: {
-        backgroundColor: "transparent",
-        borderColor: primary,
-        color: primary,
-        disabledBackgroundColor: "transparent",
-        disabledBorderColor: neutral["5"],
-        disabledColor
+        default: {
+          backgroundColor: "transparent",
+          borderColor: primary,
+          color: primary
+        },
+        loading: {
+          backgroundColor: "transparent",
+          borderColor: primary,
+          color: primary
+        },
+        disabled: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.default.value,
+          color: disabledColor
+        }
       },
       soft: {
-        backgroundColor: secondary,
-        borderColor: secondary,
-        color: secondaryContrast,
-        disabledBackgroundColor: neutral["3"],
-        disabledBorderColor: neutral["3"],
-        disabledColor
+        default: {
+          backgroundColor: secondary,
+          borderColor: secondary,
+          color: secondaryContrast
+        },
+        loading: {
+          backgroundColor: secondary,
+          borderColor: secondary,
+          color: secondaryContrast
+        },
+        disabled: {
+          backgroundColor: tokens.colors.surface.primary.value,
+          borderColor: tokens.colors.border.subtle.value,
+          color: disabledColor
+        }
       },
       ghost: {
-        backgroundColor: "transparent",
-        borderColor: "transparent",
-        color: primary,
-        disabledBackgroundColor: "transparent",
-        disabledBorderColor: "transparent",
-        disabledColor
-      },
-      plain: {
-        backgroundColor: "transparent",
-        borderColor: "transparent",
-        color: primary,
-        disabledBackgroundColor: "transparent",
-        disabledBorderColor: "transparent",
-        disabledColor
+        default: {
+          backgroundColor: "transparent",
+          borderColor: "transparent",
+          color: primary
+        },
+        loading: {
+          backgroundColor: "transparent",
+          borderColor: "transparent",
+          color: primary
+        },
+        disabled: {
+          backgroundColor: "transparent",
+          borderColor: "transparent",
+          color: disabledColor
+        }
       }
     }
   };

package/dist/theme/create-button-tokens.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/theme/create-button-tokens.ts"],"sourcesContent":["import { ButtonTokens, PrimitiveThemeTokens } from \"../types\";\r\n\r\nexport function createButtonTokens(tokens: PrimitiveThemeTokens): ButtonTokens {\r\n  const primary = tokens.colors.primary.value;\r\n  const primaryContrast = tokens.colors.primary.contrast;\r\n\r\n  const secondary = tokens.colors.secondary.value;\r\n  const secondaryContrast = tokens.colors.secondary.contrast;\r\n\r\n  const neutral = tokens.colors.neutral;\r\n  const disabledColor = tokens.colors.text.disabled;\r\n\r\n  return {\r\n    borderWidth: tokens.borderSize.sm,\r\n    borderRadius: tokens.radii.md,\r\n\r\n    sizes: {\r\n      small: {\r\n        height: 32,\r\n        paddingVertical: 6,\r\n        paddingHorizontal: 12,\r\n        fontSize: tokens.fontSize.xsm,\r\n      },\r\n      medium: {\r\n        height: 40,\r\n        paddingVertical: 8,\r\n        paddingHorizontal: 16,\r\n        fontSize: tokens.fontSize.sm,\r\n      },\r\n      large: {\r\n        height: 48,\r\n        paddingVertical: 10,\r\n        paddingHorizontal: 20,\r\n        fontSize: tokens.fontSize.sm,\r\n      },\r\n    },\r\n\r\n    variants: {\r\n      filled: {\r\n        backgroundColor: primary,\r\n        borderColor: primary,\r\n        color: primaryContrast,\r\n\r\n        disabledBackgroundColor: neutral[\"5\"],\r\n        disabledBorderColor: neutral[\"5\"],\r\n        disabledColor,\r\n      },\r\n\r\n      outlined: {\r\n        backgroundColor: \"transparent\",\r\n        borderColor: primary,\r\n        color: primary,\r\n\r\n        disabledBackgroundColor: \"transparent\",\r\n        disabledBorderColor: neutral[\"5\"],\r\n        disabledColor,\r\n      },\r\n\r\n      soft: {\r\n        backgroundColor: secondary,\r\n        borderColor: secondary,\r\n        color: secondaryContrast,\r\n\r\n        disabledBackgroundColor: neutral[\"3\"],\r\n        disabledBorderColor: neutral[\"3\"],\r\n        disabledColor,\r\n      },\r\n\r\n      ghost: {\r\n        backgroundColor: \"transparent\",\r\n        borderColor: \"transparent\",\r\n        color: primary,\r\n\r\n        disabledBackgroundColor: \"transparent\",\r\n        disabledBorderColor: \"transparent\",\r\n        disabledColor,\r\n      },\r\n\r\n      plain: {\r\n        backgroundColor: \"transparent\",\r\n        borderColor: \"transparent\",\r\n        color: primary,\r\n\r\n        disabledBackgroundColor: \"transparent\",\r\n        disabledBorderColor: \"transparent\",\r\n        disabledColor,\r\n      },\r\n    },\r\n  };\r\n}\r\n"],"mappings":"AAEO,SAAS,mBAAmB,QAA4C;AAC7E,QAAM,UAAU,OAAO,OAAO,QAAQ;AACtC,QAAM,kBAAkB,OAAO,OAAO,QAAQ;AAE9C,QAAM,YAAY,OAAO,OAAO,UAAU;AAC1C,QAAM,oBAAoB,OAAO,OAAO,UAAU;AAElD,QAAM,UAAU,OAAO,OAAO;AAC9B,QAAM,gBAAgB,OAAO,OAAO,KAAK;AAEzC,SAAO;AAAA,IACL,aAAa,OAAO,WAAW;AAAA,IAC/B,cAAc,OAAO,MAAM;AAAA,IAE3B,OAAO;AAAA,MACL,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,MACA,QAAQ;AAAA,QACN,QAAQ;AAAA,QACR,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,MACA,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,IACF;AAAA,IAEA,UAAU;AAAA,MACR,QAAQ;AAAA,QACN,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,QAEP,yBAAyB,QAAQ,GAAG;AAAA,QACpC,qBAAqB,QAAQ,GAAG;AAAA,QAChC;AAAA,MACF;AAAA,MAEA,UAAU;AAAA,QACR,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,QAEP,yBAAyB;AAAA,QACzB,qBAAqB,QAAQ,GAAG;AAAA,QAChC;AAAA,MACF;AAAA,MAEA,MAAM;AAAA,QACJ,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,QAEP,yBAAyB,QAAQ,GAAG;AAAA,QACpC,qBAAqB,QAAQ,GAAG;AAAA,QAChC;AAAA,MACF;AAAA,MAEA,OAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,QAEP,yBAAyB;AAAA,QACzB,qBAAqB;AAAA,QACrB;AAAA,MACF;AAAA,MAEA,OAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,QAEP,yBAAyB;AAAA,QACzB,qBAAqB;AAAA,QACrB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../src/theme/create-button-tokens.ts"],"sourcesContent":["import { ButtonTokens, PrimitiveThemeTokens } from \"../types\";\n\nexport function createButtonTokens(tokens: PrimitiveThemeTokens): ButtonTokens {\n  const primary = tokens.colors.primary.value;\n  const primaryContrast = tokens.colors.primary.contrast;\n\n  const secondary = tokens.colors.secondary.value;\n  const secondaryContrast = tokens.colors.secondary.contrast;\n\n  const disabledColor = tokens.colors.text.disabled;\n\n  return {\n    borderWidth: tokens.borderSize.sm,\n    borderRadius: tokens.radii.md,\n\n    sizes: {\n      small: {\n        height: 32,\n        paddingVertical: 6,\n        paddingHorizontal: 12,\n        fontSize: tokens.fontSize.xsm,\n      },\n      medium: {\n        height: 40,\n        paddingVertical: 8,\n        paddingHorizontal: 16,\n        fontSize: tokens.fontSize.sm,\n      },\n      large: {\n        height: 48,\n        paddingVertical: 10,\n        paddingHorizontal: 20,\n        fontSize: tokens.fontSize.sm,\n      },\n    },\n\n    variants: {\n      filled: {\n        default: {\n          backgroundColor: primary,\n          borderColor: primary,\n          color: primaryContrast,\n        },\n        loading: {\n          backgroundColor: primary,\n          borderColor: primary,\n          color: primaryContrast,\n        },\n        disabled: {\n          backgroundColor: tokens.colors.surface.primary.value,\n          borderColor: tokens.colors.border.default.value,\n          color: disabledColor,\n        },\n      },\n\n      outlined: {\n        default: {\n          backgroundColor: \"transparent\",\n          borderColor: primary,\n          color: primary,\n        },\n        loading: {\n          backgroundColor: \"transparent\",\n          borderColor: primary,\n          color: primary,\n        },\n        disabled: {\n          backgroundColor: \"transparent\",\n          borderColor: tokens.colors.border.default.value,\n          color: disabledColor,\n        },\n      },\n\n      soft: {\n        default: {\n          backgroundColor: secondary,\n          borderColor: secondary,\n          color: secondaryContrast,\n        },\n        loading: {\n          backgroundColor: secondary,\n          borderColor: secondary,\n          color: secondaryContrast,\n        },\n        disabled: {\n          backgroundColor: tokens.colors.surface.primary.value,\n          borderColor: tokens.colors.border.subtle.value,\n          color: disabledColor,\n        },\n      },\n\n      ghost: {\n        default: {\n          backgroundColor: \"transparent\",\n          borderColor: \"transparent\",\n          color: primary,\n        },\n        loading: {\n          backgroundColor: \"transparent\",\n          borderColor: \"transparent\",\n          color: primary,\n        },\n        disabled: {\n          backgroundColor: \"transparent\",\n          borderColor: \"transparent\",\n          color: disabledColor,\n        },\n      },\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,mBAAmB,QAA4C;AAC7E,QAAM,UAAU,OAAO,OAAO,QAAQ;AACtC,QAAM,kBAAkB,OAAO,OAAO,QAAQ;AAE9C,QAAM,YAAY,OAAO,OAAO,UAAU;AAC1C,QAAM,oBAAoB,OAAO,OAAO,UAAU;AAElD,QAAM,gBAAgB,OAAO,OAAO,KAAK;AAEzC,SAAO;AAAA,IACL,aAAa,OAAO,WAAW;AAAA,IAC/B,cAAc,OAAO,MAAM;AAAA,IAE3B,OAAO;AAAA,MACL,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,MACA,QAAQ;AAAA,QACN,QAAQ;AAAA,QACR,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,MACA,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,iBAAiB;AAAA,QACjB,mBAAmB;AAAA,QACnB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,IACF;AAAA,IAEA,UAAU;AAAA,MACR,QAAQ;AAAA,QACN,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,UAAU;AAAA,UACR,iBAAiB,OAAO,OAAO,QAAQ,QAAQ;AAAA,UAC/C,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO;AAAA,QACT;AAAA,MACF;AAAA,MAEA,UAAU;AAAA,QACR,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,UAAU;AAAA,UACR,iBAAiB;AAAA,UACjB,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO;AAAA,QACT;AAAA,MACF;AAAA,MAEA,MAAM;AAAA,QACJ,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,UAAU;AAAA,UACR,iBAAiB,OAAO,OAAO,QAAQ,QAAQ;AAAA,UAC/C,aAAa,OAAO,OAAO,OAAO,OAAO;AAAA,UACzC,OAAO;AAAA,QACT;AAAA,MACF;AAAA,MAEA,OAAO;AAAA,QACL,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,SAAS;AAAA,UACP,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,UAAU;AAAA,UACR,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/theme/create-card-tokens.d.mts

@@ -2,20 +2,24 @@ import { PrimitiveThemeTokens } from '../types/theme-provider.types.mjs';
 import { CardTokens } from '../types/card-tokens.types.mjs';
 import '../types/badge-tokens.types.mjs';
 import '../types/components.types.mjs';
+import '../types/carousel-tokens.types.mjs';
 import '../types/checkbox-tokens.types.mjs';
+import '../types/list-tokens.types.mjs';
 import '../types/radio-tokens.types.mjs';
 import '../types/accordion-tokens.types.mjs';
 import '../types/avatar-tokens.types.mjs';
 import '../types/buttons-tokens.types.mjs';
-import '../types/control-tokes.types.mjs';
+import '../types/control-tokens.types.mjs';
 import '../types/data-state-tokens.types.mjs';
 import '../types/datetime-picker-tokens.types.mjs';
 import '../types/divider-tokens.types.mjs';
 import '../types/flyout-tokens.types.mjs';
 import '../types/icon-tokens.types.mjs';
+import '../types/pagination-tokens.types.mjs';
 import '../types/pressable-tokens.types.mjs';
 import '../types/progress-tokens.types.mjs';
 import '../types/spinner-tokens.types.mjs';
+import '../types/segmented-control-tokens.types.mjs';
 import '../types/select-tokens.types.mjs';
 import '../types/skeleton-tokens.types.mjs';
 import '../types/slider-tokens.types.mjs';

package/dist/theme/create-carousel-tokens.d.mts

@@ -0,0 +1,35 @@
+import { PrimitiveThemeTokens } from '../types/theme-provider.types.mjs';
+import { CarouselTokens } from '../types/carousel-tokens.types.mjs';
+import '../types/badge-tokens.types.mjs';
+import '../types/components.types.mjs';
+import '../types/checkbox-tokens.types.mjs';
+import '../types/list-tokens.types.mjs';
+import '../types/radio-tokens.types.mjs';
+import '../types/accordion-tokens.types.mjs';
+import '../types/avatar-tokens.types.mjs';
+import '../types/buttons-tokens.types.mjs';
+import '../types/card-tokens.types.mjs';
+import '../types/control-tokens.types.mjs';
+import '../types/data-state-tokens.types.mjs';
+import '../types/datetime-picker-tokens.types.mjs';
+import '../types/divider-tokens.types.mjs';
+import '../types/flyout-tokens.types.mjs';
+import '../types/icon-tokens.types.mjs';
+import '../types/pagination-tokens.types.mjs';
+import '../types/pressable-tokens.types.mjs';
+import '../types/progress-tokens.types.mjs';
+import '../types/spinner-tokens.types.mjs';
+import '../types/segmented-control-tokens.types.mjs';
+import '../types/select-tokens.types.mjs';
+import '../types/skeleton-tokens.types.mjs';
+import '../types/slider-tokens.types.mjs';
+import '../types/stepper-tokens.types.mjs';
+import '../types/switch-tokens.types.mjs';
+import '../types/tag-tokens.types.mjs';
+import '../types/textarea-tokens.types.mjs';
+import '../types/time-picker-token.types.mjs';
+import '../types/tokens.types.mjs';
+
+declare function createCarouselTokens(tokens: PrimitiveThemeTokens): CarouselTokens;
+
+export { createCarouselTokens };

package/dist/theme/create-carousel-tokens.js

@@ -0,0 +1,32 @@
+function createCarouselTokens(tokens) {
+  return {
+    gap: tokens.space.sm,
+    slideGap: tokens.space.mxs,
+    borderRadius: tokens.radii.lg,
+    indicatorGap: tokens.space.xs,
+    indicator: {
+      borderRadius: tokens.radii.round,
+      targetSize: tokens.space.lg,
+      variants: {
+        dots: { width: tokens.space.xs, height: tokens.space.xs },
+        segments: { width: tokens.space.md, height: tokens.space.xxs }
+      },
+      states: {
+        unselected: { backgroundColor: tokens.colors.border.strong.value },
+        selected: { backgroundColor: tokens.colors.primary.value },
+        disabledUnselected: { backgroundColor: tokens.colors.text.disabled },
+        disabledSelected: { backgroundColor: tokens.colors.text.secondary }
+      }
+    },
+    counter: {
+      states: {
+        default: { color: tokens.colors.text.primary },
+        disabled: { color: tokens.colors.text.disabled }
+      }
+    }
+  };
+}
+export {
+  createCarouselTokens
+};
+//# sourceMappingURL=create-carousel-tokens.js.map

package/dist/theme/create-carousel-tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/theme/create-carousel-tokens.ts"],"sourcesContent":["import type { CarouselTokens, PrimitiveThemeTokens } from \"../types\";\n\nexport function createCarouselTokens(\n  tokens: PrimitiveThemeTokens,\n): CarouselTokens {\n  return {\n    gap: tokens.space.sm,\n    slideGap: tokens.space.mxs,\n    borderRadius: tokens.radii.lg,\n    indicatorGap: tokens.space.xs,\n    indicator: {\n      borderRadius: tokens.radii.round,\n      targetSize: tokens.space.lg,\n      variants: {\n        dots: { width: tokens.space.xs, height: tokens.space.xs },\n        segments: { width: tokens.space.md, height: tokens.space.xxs },\n      },\n      states: {\n        unselected: { backgroundColor: tokens.colors.border.strong.value },\n        selected: { backgroundColor: tokens.colors.primary.value },\n        disabledUnselected: { backgroundColor: tokens.colors.text.disabled },\n        disabledSelected: { backgroundColor: tokens.colors.text.secondary },\n      },\n    },\n    counter: {\n      states: {\n        default: { color: tokens.colors.text.primary },\n        disabled: { color: tokens.colors.text.disabled },\n      },\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,qBACd,QACgB;AAChB,SAAO;AAAA,IACL,KAAK,OAAO,MAAM;AAAA,IAClB,UAAU,OAAO,MAAM;AAAA,IACvB,cAAc,OAAO,MAAM;AAAA,IAC3B,cAAc,OAAO,MAAM;AAAA,IAC3B,WAAW;AAAA,MACT,cAAc,OAAO,MAAM;AAAA,MAC3B,YAAY,OAAO,MAAM;AAAA,MACzB,UAAU;AAAA,QACR,MAAM,EAAE,OAAO,OAAO,MAAM,IAAI,QAAQ,OAAO,MAAM,GAAG;AAAA,QACxD,UAAU,EAAE,OAAO,OAAO,MAAM,IAAI,QAAQ,OAAO,MAAM,IAAI;AAAA,MAC/D;AAAA,MACA,QAAQ;AAAA,QACN,YAAY,EAAE,iBAAiB,OAAO,OAAO,OAAO,OAAO,MAAM;AAAA,QACjE,UAAU,EAAE,iBAAiB,OAAO,OAAO,QAAQ,MAAM;AAAA,QACzD,oBAAoB,EAAE,iBAAiB,OAAO,OAAO,KAAK,SAAS;AAAA,QACnE,kBAAkB,EAAE,iBAAiB,OAAO,OAAO,KAAK,UAAU;AAAA,MACpE;AAAA,IACF;AAAA,IACA,SAAS;AAAA,MACP,QAAQ;AAAA,QACN,SAAS,EAAE,OAAO,OAAO,OAAO,KAAK,QAAQ;AAAA,QAC7C,UAAU,EAAE,OAAO,OAAO,OAAO,KAAK,SAAS;AAAA,MACjD;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/theme/create-checkbox-tokens.d.mts

@@ -2,20 +2,24 @@ import { PrimitiveThemeTokens } from '../types/theme-provider.types.mjs';
 import { CheckboxTokens } from '../types/checkbox-tokens.types.mjs';
 import '../types/badge-tokens.types.mjs';
 import '../types/components.types.mjs';
+import '../types/carousel-tokens.types.mjs';
+import '../types/list-tokens.types.mjs';
 import '../types/radio-tokens.types.mjs';
 import '../types/accordion-tokens.types.mjs';
 import '../types/avatar-tokens.types.mjs';
 import '../types/buttons-tokens.types.mjs';
 import '../types/card-tokens.types.mjs';
-import '../types/control-tokes.types.mjs';
+import '../types/control-tokens.types.mjs';
 import '../types/data-state-tokens.types.mjs';
 import '../types/datetime-picker-tokens.types.mjs';
 import '../types/divider-tokens.types.mjs';
 import '../types/flyout-tokens.types.mjs';
 import '../types/icon-tokens.types.mjs';
+import '../types/pagination-tokens.types.mjs';
 import '../types/pressable-tokens.types.mjs';
 import '../types/progress-tokens.types.mjs';
 import '../types/spinner-tokens.types.mjs';
+import '../types/segmented-control-tokens.types.mjs';
 import '../types/select-tokens.types.mjs';
 import '../types/skeleton-tokens.types.mjs';
 import '../types/slider-tokens.types.mjs';

package/dist/theme/create-checkbox-tokens.js

@@ -6,11 +6,6 @@ function createCheckboxTokens(tokens) {
   return {
     borderWidth: tokens.borderSize.md,
     borderRadius: tokens.radii.sm,
-    uncheckedBackgroundColor: "transparent",
-    uncheckedBorderColor: tokens.colors.border.strong.value,
-    disabledBackgroundColor: tokens.colors.neutral["3"],
-    disabledBorderColor: tokens.colors.neutral["5"],
-    disabledColor: tokens.colors.text.disabled,
     sizes: {
       small: {
         size: 20,
@@ -30,29 +25,70 @@ function createCheckboxTokens(tokens) {
     },
     variants: {
       filled: {
-        backgroundColor: primary,
-        borderColor: primary,
-        color: primaryContrast
+        unselected: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.strong.value,
+          color: primaryContrast
+        },
+        selected: {
+          backgroundColor: primary,
+          borderColor: primary,
+          color: primaryContrast
+        },
+        disabledUnselected: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.default.value,
+          color: tokens.colors.text.disabled
+        },
+        disabledSelected: {
+          backgroundColor: tokens.colors.surface.primary.value,
+          borderColor: tokens.colors.border.default.value,
+          color: tokens.colors.text.disabled
+        }
       },
       outlined: {
-        backgroundColor: "transparent",
-        borderColor: primary,
-        color: primary
+        unselected: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.strong.value,
+          color: primary
+        },
+        selected: {
+          backgroundColor: "transparent",
+          borderColor: primary,
+          color: primary
+        },
+        disabledUnselected: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.default.value,
+          color: tokens.colors.text.disabled
+        },
+        disabledSelected: {
+          backgroundColor: tokens.colors.surface.primary.value,
+          borderColor: tokens.colors.border.default.value,
+          color: tokens.colors.text.disabled
+        }
       },
       soft: {
-        backgroundColor: secondary,
-        borderColor: secondary,
-        color: secondaryContrast
-      },
-      ghost: {
-        backgroundColor: "transparent",
-        borderColor: "transparent",
-        color: primary
-      },
-      plain: {
-        backgroundColor: "transparent",
-        borderColor: "transparent",
-        color: primary
+        unselected: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.strong.value,
+          color: secondaryContrast
+        },
+        selected: {
+          backgroundColor: secondary,
+          borderColor: secondary,
+          color: secondaryContrast
+        },
+        disabledUnselected: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.default.value,
+          color: tokens.colors.text.disabled
+        },
+        disabledSelected: {
+          backgroundColor: tokens.colors.surface.primary.value,
+          borderColor: tokens.colors.border.default.value,
+          color: tokens.colors.text.disabled
+        }
       }
     }
   };

package/dist/theme/create-checkbox-tokens.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/theme/create-checkbox-tokens.ts"],"sourcesContent":["import type { CheckboxTokens, PrimitiveThemeTokens } from \"../types\";\n\nexport function createCheckboxTokens(\n  tokens: PrimitiveThemeTokens,\n): CheckboxTokens {\n  const primary = tokens.colors.primary.value;\n  const primaryContrast = tokens.colors.primary.contrast;\n  const secondary = tokens.colors.secondary.value;\n  const secondaryContrast = tokens.colors.secondary.contrast;\n\n  return {\n    borderWidth: tokens.borderSize.md,\n    borderRadius: tokens.radii.sm,\n    uncheckedBackgroundColor: \"transparent\",\n    uncheckedBorderColor: tokens.colors.border.strong.value,\n    disabledBackgroundColor: tokens.colors.neutral[\"3\"],\n    disabledBorderColor: tokens.colors.neutral[\"5\"],\n    disabledColor: tokens.colors.text.disabled,\n\n    sizes: {\n      small: {\n        size: 20,\n        iconSize: 14,\n        hitSlop: 12,\n      },\n      medium: {\n        size: 24,\n        iconSize: 18,\n        hitSlop: 10,\n      },\n      large: {\n        size: 28,\n        iconSize: 22,\n        hitSlop: 8,\n      },\n    },\n\n    variants: {\n      filled: {\n        backgroundColor: primary,\n        borderColor: primary,\n        color: primaryContrast,\n      },\n      outlined: {\n        backgroundColor: \"transparent\",\n        borderColor: primary,\n        color: primary,\n      },\n      soft: {\n        backgroundColor: secondary,\n        borderColor: secondary,\n        color: secondaryContrast,\n      },\n      ghost: {\n        backgroundColor: \"transparent\",\n        borderColor: \"transparent\",\n        color: primary,\n      },\n      plain: {\n        backgroundColor: \"transparent\",\n        borderColor: \"transparent\",\n        color: primary,\n      },\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,qBACd,QACgB;AAChB,QAAM,UAAU,OAAO,OAAO,QAAQ;AACtC,QAAM,kBAAkB,OAAO,OAAO,QAAQ;AAC9C,QAAM,YAAY,OAAO,OAAO,UAAU;AAC1C,QAAM,oBAAoB,OAAO,OAAO,UAAU;AAElD,SAAO;AAAA,IACL,aAAa,OAAO,WAAW;AAAA,IAC/B,cAAc,OAAO,MAAM;AAAA,IAC3B,0BAA0B;AAAA,IAC1B,sBAAsB,OAAO,OAAO,OAAO,OAAO;AAAA,IAClD,yBAAyB,OAAO,OAAO,QAAQ,GAAG;AAAA,IAClD,qBAAqB,OAAO,OAAO,QAAQ,GAAG;AAAA,IAC9C,eAAe,OAAO,OAAO,KAAK;AAAA,IAElC,OAAO;AAAA,MACL,OAAO;AAAA,QACL,MAAM;AAAA,QACN,UAAU;AAAA,QACV,SAAS;AAAA,MACX;AAAA,MACA,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,UAAU;AAAA,QACV,SAAS;AAAA,MACX;AAAA,MACA,OAAO;AAAA,QACL,MAAM;AAAA,QACN,UAAU;AAAA,QACV,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IAEA,UAAU;AAAA,MACR,QAAQ;AAAA,QACN,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,MACT;AAAA,MACA,UAAU;AAAA,QACR,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,MACT;AAAA,MACA,MAAM;AAAA,QACJ,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,MACT;AAAA,MACA,OAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,MACT;AAAA,MACA,OAAO;AAAA,QACL,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,OAAO;AAAA,MACT;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../src/theme/create-checkbox-tokens.ts"],"sourcesContent":["import type { CheckboxTokens, PrimitiveThemeTokens } from \"../types\";\n\nexport function createCheckboxTokens(\n  tokens: PrimitiveThemeTokens,\n): CheckboxTokens {\n  const primary = tokens.colors.primary.value;\n  const primaryContrast = tokens.colors.primary.contrast;\n  const secondary = tokens.colors.secondary.value;\n  const secondaryContrast = tokens.colors.secondary.contrast;\n\n  return {\n    borderWidth: tokens.borderSize.md,\n    borderRadius: tokens.radii.sm,\n\n    sizes: {\n      small: {\n        size: 20,\n        iconSize: 14,\n        hitSlop: 12,\n      },\n      medium: {\n        size: 24,\n        iconSize: 18,\n        hitSlop: 10,\n      },\n      large: {\n        size: 28,\n        iconSize: 22,\n        hitSlop: 8,\n      },\n    },\n\n    variants: {\n      filled: {\n        unselected: {\n          backgroundColor: \"transparent\",\n          borderColor: tokens.colors.border.strong.value,\n          color: primaryContrast,\n        },\n        selected: {\n          backgroundColor: primary,\n          borderColor: primary,\n          color: primaryContrast,\n        },\n        disabledUnselected: {\n          backgroundColor: \"transparent\",\n          borderColor: tokens.colors.border.default.value,\n          color: tokens.colors.text.disabled,\n        },\n        disabledSelected: {\n          backgroundColor: tokens.colors.surface.primary.value,\n          borderColor: tokens.colors.border.default.value,\n          color: tokens.colors.text.disabled,\n        },\n      },\n      outlined: {\n        unselected: {\n          backgroundColor: \"transparent\",\n          borderColor: tokens.colors.border.strong.value,\n          color: primary,\n        },\n        selected: {\n          backgroundColor: \"transparent\",\n          borderColor: primary,\n          color: primary,\n        },\n        disabledUnselected: {\n          backgroundColor: \"transparent\",\n          borderColor: tokens.colors.border.default.value,\n          color: tokens.colors.text.disabled,\n        },\n        disabledSelected: {\n          backgroundColor: tokens.colors.surface.primary.value,\n          borderColor: tokens.colors.border.default.value,\n          color: tokens.colors.text.disabled,\n        },\n      },\n      soft: {\n        unselected: {\n          backgroundColor: \"transparent\",\n          borderColor: tokens.colors.border.strong.value,\n          color: secondaryContrast,\n        },\n        selected: {\n          backgroundColor: secondary,\n          borderColor: secondary,\n          color: secondaryContrast,\n        },\n        disabledUnselected: {\n          backgroundColor: \"transparent\",\n          borderColor: tokens.colors.border.default.value,\n          color: tokens.colors.text.disabled,\n        },\n        disabledSelected: {\n          backgroundColor: tokens.colors.surface.primary.value,\n          borderColor: tokens.colors.border.default.value,\n          color: tokens.colors.text.disabled,\n        },\n      },\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,qBACd,QACgB;AAChB,QAAM,UAAU,OAAO,OAAO,QAAQ;AACtC,QAAM,kBAAkB,OAAO,OAAO,QAAQ;AAC9C,QAAM,YAAY,OAAO,OAAO,UAAU;AAC1C,QAAM,oBAAoB,OAAO,OAAO,UAAU;AAElD,SAAO;AAAA,IACL,aAAa,OAAO,WAAW;AAAA,IAC/B,cAAc,OAAO,MAAM;AAAA,IAE3B,OAAO;AAAA,MACL,OAAO;AAAA,QACL,MAAM;AAAA,QACN,UAAU;AAAA,QACV,SAAS;AAAA,MACX;AAAA,MACA,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,UAAU;AAAA,QACV,SAAS;AAAA,MACX;AAAA,MACA,OAAO;AAAA,QACL,MAAM;AAAA,QACN,UAAU;AAAA,QACV,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IAEA,UAAU;AAAA,MACR,QAAQ;AAAA,QACN,YAAY;AAAA,UACV,iBAAiB;AAAA,UACjB,aAAa,OAAO,OAAO,OAAO,OAAO;AAAA,UACzC,OAAO;AAAA,QACT;AAAA,QACA,UAAU;AAAA,UACR,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,oBAAoB;AAAA,UAClB,iBAAiB;AAAA,UACjB,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO,OAAO,OAAO,KAAK;AAAA,QAC5B;AAAA,QACA,kBAAkB;AAAA,UAChB,iBAAiB,OAAO,OAAO,QAAQ,QAAQ;AAAA,UAC/C,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO,OAAO,OAAO,KAAK;AAAA,QAC5B;AAAA,MACF;AAAA,MACA,UAAU;AAAA,QACR,YAAY;AAAA,UACV,iBAAiB;AAAA,UACjB,aAAa,OAAO,OAAO,OAAO,OAAO;AAAA,UACzC,OAAO;AAAA,QACT;AAAA,QACA,UAAU;AAAA,UACR,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,oBAAoB;AAAA,UAClB,iBAAiB;AAAA,UACjB,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO,OAAO,OAAO,KAAK;AAAA,QAC5B;AAAA,QACA,kBAAkB;AAAA,UAChB,iBAAiB,OAAO,OAAO,QAAQ,QAAQ;AAAA,UAC/C,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO,OAAO,OAAO,KAAK;AAAA,QAC5B;AAAA,MACF;AAAA,MACA,MAAM;AAAA,QACJ,YAAY;AAAA,UACV,iBAAiB;AAAA,UACjB,aAAa,OAAO,OAAO,OAAO,OAAO;AAAA,UACzC,OAAO;AAAA,QACT;AAAA,QACA,UAAU;AAAA,UACR,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,OAAO;AAAA,QACT;AAAA,QACA,oBAAoB;AAAA,UAClB,iBAAiB;AAAA,UACjB,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO,OAAO,OAAO,KAAK;AAAA,QAC5B;AAAA,QACA,kBAAkB;AAAA,UAChB,iBAAiB,OAAO,OAAO,QAAQ,QAAQ;AAAA,UAC/C,aAAa,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC1C,OAAO,OAAO,OAAO,KAAK;AAAA,QAC5B;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/theme/create-control-tokens.d.mts

@@ -1,8 +1,10 @@
 import { PrimitiveThemeTokens } from '../types/theme-provider.types.mjs';
-import { ControlAddonTokens, ControlContainerTokens, ControlErrorTokens, ControlInputTokens, ControlLabelTokens } from '../types/control-tokes.types.mjs';
+import { ControlAddonTokens, ControlContainerTokens, ControlErrorTokens, ControlInputTokens, ControlLabelTokens } from '../types/control-tokens.types.mjs';
 import '../types/badge-tokens.types.mjs';
 import '../types/components.types.mjs';
+import '../types/carousel-tokens.types.mjs';
 import '../types/checkbox-tokens.types.mjs';
+import '../types/list-tokens.types.mjs';
 import '../types/radio-tokens.types.mjs';
 import '../types/accordion-tokens.types.mjs';
 import '../types/avatar-tokens.types.mjs';
@@ -13,9 +15,11 @@ import '../types/datetime-picker-tokens.types.mjs';
 import '../types/divider-tokens.types.mjs';
 import '../types/flyout-tokens.types.mjs';
 import '../types/icon-tokens.types.mjs';
+import '../types/pagination-tokens.types.mjs';
 import '../types/pressable-tokens.types.mjs';
 import '../types/progress-tokens.types.mjs';
 import '../types/spinner-tokens.types.mjs';
+import '../types/segmented-control-tokens.types.mjs';
 import '../types/select-tokens.types.mjs';
 import '../types/skeleton-tokens.types.mjs';
 import '../types/slider-tokens.types.mjs';

package/dist/theme/create-control-tokens.js

@@ -1,46 +1,27 @@
 function createControlAddonTokens(tokens) {
-  const DefaultIconColor = tokens.colors.text.primary;
-  const DisabledIconColor = tokens.colors.text.disabled;
-  const SoftIconColor = tokens.colors.accent.contrast;
   return {
     marginHorizontal: tokens.space.xxs,
     hitSlop: tokens.space.sm,
     variants: {
       filled: {
-        iconColor: DefaultIconColor,
-        errorIconColor: DefaultIconColor,
-        disabledIconColor: DisabledIconColor
+        default: { iconColor: tokens.colors.text.primary },
+        error: { iconColor: tokens.colors.text.primary },
+        disabled: { iconColor: tokens.colors.text.disabled },
+        disabledError: { iconColor: tokens.colors.text.disabled }
       },
       outlined: {
-        iconColor: DefaultIconColor,
-        errorIconColor: DefaultIconColor,
-        disabledIconColor: DisabledIconColor
-      },
-      soft: {
-        iconColor: SoftIconColor,
-        errorIconColor: SoftIconColor,
-        disabledIconColor: DisabledIconColor
-      },
-      ghost: {
-        iconColor: DefaultIconColor,
-        errorIconColor: DefaultIconColor,
-        disabledIconColor: DisabledIconColor
-      },
-      plain: {
-        iconColor: DefaultIconColor,
-        errorIconColor: DefaultIconColor,
-        disabledIconColor: DisabledIconColor
+        default: { iconColor: tokens.colors.text.primary },
+        error: { iconColor: tokens.colors.text.primary },
+        disabled: { iconColor: tokens.colors.text.disabled },
+        disabledError: { iconColor: tokens.colors.text.disabled }
       }
     }
   };
 }
 function createControlContainerTokens(tokens) {
-  const ErrorColor = tokens.colors.feedback.error.value;
-  const TransparentColor = "transparent";
   return {
     borderWidth: tokens.borderSize.sm,
     borderRadius: tokens.radii.sm,
-    disabledOpacity: 0.7,
     sizes: {
       small: {
         height: 32,
@@ -57,39 +38,48 @@ function createControlContainerTokens(tokens) {
     },
     variants: {
       filled: {
-        backgroundColor: tokens.colors.surface.secondary.value,
-        borderColor: TransparentColor,
-        errorBorderColor: ErrorColor,
-        disabledBackgroundColor: tokens.colors.neutral["2"],
-        disabledBorderColor: TransparentColor
+        default: {
+          backgroundColor: tokens.colors.surface.secondary.value,
+          borderColor: "transparent",
+          opacity: 1
+        },
+        error: {
+          backgroundColor: tokens.colors.surface.secondary.value,
+          borderColor: tokens.colors.feedback.error.value,
+          opacity: 1
+        },
+        disabled: {
+          backgroundColor: tokens.colors.surface.primary.value,
+          borderColor: "transparent",
+          opacity: 0.7
+        },
+        disabledError: {
+          backgroundColor: tokens.colors.surface.primary.value,
+          borderColor: tokens.colors.feedback.error.value,
+          opacity: 0.7
+        }
       },
       outlined: {
-        backgroundColor: TransparentColor,
-        borderColor: tokens.colors.neutral["5"],
-        errorBorderColor: ErrorColor,
-        disabledBackgroundColor: TransparentColor,
-        disabledBorderColor: tokens.colors.neutral["5"]
-      },
-      soft: {
-        backgroundColor: tokens.colors.accent.value,
-        borderColor: TransparentColor,
-        errorBorderColor: ErrorColor,
-        disabledBackgroundColor: tokens.colors.neutral["2"],
-        disabledBorderColor: TransparentColor
-      },
-      ghost: {
-        backgroundColor: TransparentColor,
-        borderColor: TransparentColor,
-        errorBorderColor: ErrorColor,
-        disabledBackgroundColor: TransparentColor,
-        disabledBorderColor: TransparentColor
-      },
-      plain: {
-        backgroundColor: TransparentColor,
-        borderColor: TransparentColor,
-        errorBorderColor: ErrorColor,
-        disabledBackgroundColor: TransparentColor,
-        disabledBorderColor: TransparentColor
+        default: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.default.value,
+          opacity: 1
+        },
+        error: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.feedback.error.value,
+          opacity: 1
+        },
+        disabled: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.border.default.value,
+          opacity: 0.7
+        },
+        disabledError: {
+          backgroundColor: "transparent",
+          borderColor: tokens.colors.feedback.error.value,
+          opacity: 0.7
+        }
       }
     }
   };
@@ -119,44 +109,40 @@ function createControlInputTokens(tokens) {
     },
     variants: {
       filled: {
-        color: tokens.colors.text.primary,
-        placeholderColor: tokens.colors.text.disabled,
-        disabledColor: tokens.colors.text.disabled,
-        disabledPlaceholderColor: tokens.colors.text.disabled,
-        errorColor: tokens.colors.text.primary,
-        errorPlaceholderColor: tokens.colors.feedback.error.value
+        default: {
+          color: tokens.colors.text.primary,
+          placeholderColor: tokens.colors.text.tertiary
+        },
+        error: {
+          color: tokens.colors.text.primary,
+          placeholderColor: tokens.colors.feedback.error.value
+        },
+        disabled: {
+          color: tokens.colors.text.disabled,
+          placeholderColor: tokens.colors.text.disabled
+        },
+        disabledError: {
+          color: tokens.colors.text.disabled,
+          placeholderColor: tokens.colors.text.disabled
+        }
       },
       outlined: {
-        color: tokens.colors.text.primary,
-        placeholderColor: tokens.colors.text.disabled,
-        disabledColor: tokens.colors.text.disabled,
-        disabledPlaceholderColor: tokens.colors.text.disabled,
-        errorColor: tokens.colors.text.primary,
-        errorPlaceholderColor: tokens.colors.feedback.error.value
-      },
-      soft: {
-        color: tokens.colors.accent.contrast,
-        placeholderColor: tokens.colors.accent.contrast,
-        disabledColor: tokens.colors.text.disabled,
-        disabledPlaceholderColor: tokens.colors.text.disabled,
-        errorColor: tokens.colors.accent.contrast,
-        errorPlaceholderColor: tokens.colors.feedback.error.value
-      },
-      ghost: {
-        color: tokens.colors.text.primary,
-        placeholderColor: tokens.colors.text.disabled,
-        disabledColor: tokens.colors.text.disabled,
-        disabledPlaceholderColor: tokens.colors.text.disabled,
-        errorColor: tokens.colors.text.primary,
-        errorPlaceholderColor: tokens.colors.feedback.error.value
-      },
-      plain: {
-        color: tokens.colors.text.primary,
-        placeholderColor: tokens.colors.text.disabled,
-        disabledColor: tokens.colors.text.disabled,
-        disabledPlaceholderColor: tokens.colors.text.disabled,
-        errorColor: tokens.colors.text.primary,
-        errorPlaceholderColor: tokens.colors.feedback.error.value
+        default: {
+          color: tokens.colors.text.primary,
+          placeholderColor: tokens.colors.text.tertiary
+        },
+        error: {
+          color: tokens.colors.text.primary,
+          placeholderColor: tokens.colors.feedback.error.value
+        },
+        disabled: {
+          color: tokens.colors.text.disabled,
+          placeholderColor: tokens.colors.text.disabled
+        },
+        disabledError: {
+          color: tokens.colors.text.disabled,
+          placeholderColor: tokens.colors.text.disabled
+        }
       }
     }
   };
@@ -165,9 +151,12 @@ function createControlLabelTokens(tokens) {
   return {
     marginBottom: tokens.space.xxs,
     fontSize: tokens.fontSize.xsm,
-    color: tokens.colors.text.secondary,
-    disabledColor: tokens.colors.text.disabled,
-    errorColor: tokens.colors.feedback.error.value
+    states: {
+      default: { color: tokens.colors.text.secondary },
+      error: { color: tokens.colors.feedback.error.value },
+      disabled: { color: tokens.colors.text.disabled },
+      disabledError: { color: tokens.colors.text.disabled }
+    }
   };
 }
 export {