@impulse-ui-native/theme 3.0.0 → 5.0.0

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

@@ -1,48 +1,4 @@
 function createTagTokens(tokens) {
-  const neutral = tokens.colors.neutral;
-  const disabledColor = tokens.colors.text.disabled;
-  const createVariants = (value, contrast) => ({
-    filled: {
-      backgroundColor: value,
-      borderColor: value,
-      color: contrast,
-      disabledBackgroundColor: neutral["4"],
-      disabledBorderColor: neutral["6"],
-      disabledColor
-    },
-    outlined: {
-      backgroundColor: "transparent",
-      borderColor: value,
-      color: value,
-      disabledBackgroundColor: "transparent",
-      disabledBorderColor: neutral["6"],
-      disabledColor
-    },
-    soft: {
-      backgroundColor: contrast,
-      borderColor: contrast,
-      color: value,
-      disabledBackgroundColor: neutral["3"],
-      disabledBorderColor: neutral["3"],
-      disabledColor
-    },
-    ghost: {
-      backgroundColor: "transparent",
-      borderColor: "transparent",
-      color: value,
-      disabledBackgroundColor: "transparent",
-      disabledBorderColor: "transparent",
-      disabledColor
-    },
-    plain: {
-      backgroundColor: "transparent",
-      borderColor: "transparent",
-      color: value,
-      disabledBackgroundColor: "transparent",
-      disabledBorderColor: "transparent",
-      disabledColor
-    }
-  });
   return {
     borderWidth: tokens.borderSize.sm,
     borderRadius: tokens.radii.round,
@@ -70,30 +26,234 @@ function createTagTokens(tokens) {
       }
     },
     colors: {
-      primary: createVariants(
-        tokens.colors.primary.value,
-        tokens.colors.primary.contrast
-      ),
-      secondary: createVariants(
-        tokens.colors.secondary.value,
-        tokens.colors.secondary.contrast
-      ),
-      error: createVariants(
-        tokens.colors.feedback.error.value,
-        tokens.colors.feedback.error.contrast
-      ),
-      warning: createVariants(
-        tokens.colors.feedback.warning.value,
-        tokens.colors.feedback.warning.contrast
-      ),
-      success: createVariants(
-        tokens.colors.feedback.success.value,
-        tokens.colors.feedback.success.contrast
-      ),
-      info: createVariants(
-        tokens.colors.feedback.info.value,
-        tokens.colors.feedback.info.contrast
-      )
+      primary: {
+        filled: {
+          default: {
+            backgroundColor: tokens.colors.primary.value,
+            borderColor: tokens.colors.primary.value,
+            color: tokens.colors.primary.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        outlined: {
+          default: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.primary.value,
+            color: tokens.colors.primary.value
+          },
+          disabled: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        soft: {
+          default: {
+            backgroundColor: tokens.colors.secondary.value,
+            borderColor: tokens.colors.secondary.value,
+            color: tokens.colors.secondary.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.subtle.value,
+            color: tokens.colors.text.disabled
+          }
+        }
+      },
+      secondary: {
+        filled: {
+          default: {
+            backgroundColor: tokens.colors.secondary.value,
+            borderColor: tokens.colors.secondary.value,
+            color: tokens.colors.secondary.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        outlined: {
+          default: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.secondary.contrast,
+            color: tokens.colors.secondary.contrast
+          },
+          disabled: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        soft: {
+          default: {
+            backgroundColor: tokens.colors.secondary.value,
+            borderColor: tokens.colors.secondary.value,
+            color: tokens.colors.secondary.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.subtle.value,
+            color: tokens.colors.text.disabled
+          }
+        }
+      },
+      error: {
+        filled: {
+          default: {
+            backgroundColor: tokens.colors.feedback.error.value,
+            borderColor: tokens.colors.feedback.error.value,
+            color: tokens.colors.feedback.error.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        outlined: {
+          default: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.feedback.error.value,
+            color: tokens.colors.feedback.error.value
+          },
+          disabled: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        soft: {
+          default: {
+            backgroundColor: tokens.colors.feedback.error.contrast,
+            borderColor: tokens.colors.feedback.error.contrast,
+            color: tokens.colors.feedback.error.value
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.subtle.value,
+            color: tokens.colors.text.disabled
+          }
+        }
+      },
+      warning: {
+        filled: {
+          default: {
+            backgroundColor: tokens.colors.feedback.warning.value,
+            borderColor: tokens.colors.feedback.warning.value,
+            color: tokens.colors.feedback.warning.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        outlined: {
+          default: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.feedback.warning.value,
+            color: tokens.colors.feedback.warning.value
+          },
+          disabled: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        soft: {
+          default: {
+            backgroundColor: tokens.colors.feedback.warning.contrast,
+            borderColor: tokens.colors.feedback.warning.contrast,
+            color: tokens.colors.feedback.warning.value
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.subtle.value,
+            color: tokens.colors.text.disabled
+          }
+        }
+      },
+      success: {
+        filled: {
+          default: {
+            backgroundColor: tokens.colors.feedback.success.value,
+            borderColor: tokens.colors.feedback.success.value,
+            color: tokens.colors.feedback.success.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        outlined: {
+          default: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.feedback.success.value,
+            color: tokens.colors.feedback.success.value
+          },
+          disabled: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        soft: {
+          default: {
+            backgroundColor: tokens.colors.feedback.success.contrast,
+            borderColor: tokens.colors.feedback.success.contrast,
+            color: tokens.colors.feedback.success.value
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.subtle.value,
+            color: tokens.colors.text.disabled
+          }
+        }
+      },
+      info: {
+        filled: {
+          default: {
+            backgroundColor: tokens.colors.feedback.info.value,
+            borderColor: tokens.colors.feedback.info.value,
+            color: tokens.colors.feedback.info.contrast
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        outlined: {
+          default: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.feedback.info.value,
+            color: tokens.colors.feedback.info.value
+          },
+          disabled: {
+            backgroundColor: "transparent",
+            borderColor: tokens.colors.border.strong.value,
+            color: tokens.colors.text.disabled
+          }
+        },
+        soft: {
+          default: {
+            backgroundColor: tokens.colors.feedback.info.contrast,
+            borderColor: tokens.colors.feedback.info.contrast,
+            color: tokens.colors.feedback.info.value
+          },
+          disabled: {
+            backgroundColor: tokens.colors.surface.primary.value,
+            borderColor: tokens.colors.border.subtle.value,
+            color: tokens.colors.text.disabled
+          }
+        }
+      }
     }
   };
 }

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/theme/create-tag-tokens.ts"],"sourcesContent":["import { PrimitiveThemeTokens, TagTokens } from \"../types\";\n\nexport function createTagTokens(tokens: PrimitiveThemeTokens): TagTokens {\n  const neutral = tokens.colors.neutral;\n  const disabledColor = tokens.colors.text.disabled;\n\n  const createVariants = (value: string, contrast: string) => ({\n    filled: {\n      backgroundColor: value,\n      borderColor: value,\n      color: contrast,\n\n      disabledBackgroundColor: neutral[\"4\"],\n      disabledBorderColor: neutral[\"6\"],\n      disabledColor,\n    },\n\n    outlined: {\n      backgroundColor: \"transparent\",\n      borderColor: value,\n      color: value,\n\n      disabledBackgroundColor: \"transparent\",\n      disabledBorderColor: neutral[\"6\"],\n      disabledColor,\n    },\n\n    soft: {\n      backgroundColor: contrast,\n      borderColor: contrast,\n      color: value,\n\n      disabledBackgroundColor: neutral[\"3\"],\n      disabledBorderColor: neutral[\"3\"],\n      disabledColor,\n    },\n\n    ghost: {\n      backgroundColor: \"transparent\",\n      borderColor: \"transparent\",\n      color: value,\n\n      disabledBackgroundColor: \"transparent\",\n      disabledBorderColor: \"transparent\",\n      disabledColor,\n    },\n\n    plain: {\n      backgroundColor: \"transparent\",\n      borderColor: \"transparent\",\n      color: value,\n\n      disabledBackgroundColor: \"transparent\",\n      disabledBorderColor: \"transparent\",\n      disabledColor,\n    },\n  });\n\n  return {\n    borderWidth: tokens.borderSize.sm,\n    borderRadius: tokens.radii.round,\n    gap: tokens.space.xxs,\n    closeHitSlop: 10,\n    iconMarginLeft: tokens.borderSize.md,\n\n    sizes: {\n      small: {\n        height: 24,\n        paddingHorizontal: tokens.space.xs,\n        minWidth: tokens.space.xl,\n        fontSize: tokens.fontSize.xs,\n      },\n\n      medium: {\n        height: 28,\n        paddingHorizontal: tokens.space.xs,\n        minWidth: tokens.space.xxl,\n        fontSize: tokens.fontSize.xsm,\n      },\n\n      large: {\n        height: 32,\n        paddingHorizontal: tokens.space.mxs,\n        minWidth: tokens.space.xxl,\n        fontSize: tokens.fontSize.xsm,\n      },\n    },\n\n    colors: {\n      primary: createVariants(\n        tokens.colors.primary.value,\n        tokens.colors.primary.contrast,\n      ),\n\n      secondary: createVariants(\n        tokens.colors.secondary.value,\n        tokens.colors.secondary.contrast,\n      ),\n\n      error: createVariants(\n        tokens.colors.feedback.error.value,\n        tokens.colors.feedback.error.contrast,\n      ),\n\n      warning: createVariants(\n        tokens.colors.feedback.warning.value,\n        tokens.colors.feedback.warning.contrast,\n      ),\n\n      success: createVariants(\n        tokens.colors.feedback.success.value,\n        tokens.colors.feedback.success.contrast,\n      ),\n\n      info: createVariants(\n        tokens.colors.feedback.info.value,\n        tokens.colors.feedback.info.contrast,\n      ),\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,gBAAgB,QAAyC;AACvE,QAAM,UAAU,OAAO,OAAO;AAC9B,QAAM,gBAAgB,OAAO,OAAO,KAAK;AAEzC,QAAM,iBAAiB,CAAC,OAAe,cAAsB;AAAA,IAC3D,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,MAEP,yBAAyB,QAAQ,GAAG;AAAA,MACpC,qBAAqB,QAAQ,GAAG;AAAA,MAChC;AAAA,IACF;AAAA,IAEA,UAAU;AAAA,MACR,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,MAEP,yBAAyB;AAAA,MACzB,qBAAqB,QAAQ,GAAG;AAAA,MAChC;AAAA,IACF;AAAA,IAEA,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,MAEP,yBAAyB,QAAQ,GAAG;AAAA,MACpC,qBAAqB,QAAQ,GAAG;AAAA,MAChC;AAAA,IACF;AAAA,IAEA,OAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,MAEP,yBAAyB;AAAA,MACzB,qBAAqB;AAAA,MACrB;AAAA,IACF;AAAA,IAEA,OAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,MAEP,yBAAyB;AAAA,MACzB,qBAAqB;AAAA,MACrB;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL,aAAa,OAAO,WAAW;AAAA,IAC/B,cAAc,OAAO,MAAM;AAAA,IAC3B,KAAK,OAAO,MAAM;AAAA,IAClB,cAAc;AAAA,IACd,gBAAgB,OAAO,WAAW;AAAA,IAElC,OAAO;AAAA,MACL,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,mBAAmB,OAAO,MAAM;AAAA,QAChC,UAAU,OAAO,MAAM;AAAA,QACvB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,MAEA,QAAQ;AAAA,QACN,QAAQ;AAAA,QACR,mBAAmB,OAAO,MAAM;AAAA,QAChC,UAAU,OAAO,MAAM;AAAA,QACvB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,MAEA,OAAO;AAAA,QACL,QAAQ;AAAA,QACR,mBAAmB,OAAO,MAAM;AAAA,QAChC,UAAU,OAAO,MAAM;AAAA,QACvB,UAAU,OAAO,SAAS;AAAA,MAC5B;AAAA,IACF;AAAA,IAEA,QAAQ;AAAA,MACN,SAAS;AAAA,QACP,OAAO,OAAO,QAAQ;AAAA,QACtB,OAAO,OAAO,QAAQ;AAAA,MACxB;AAAA,MAEA,WAAW;AAAA,QACT,OAAO,OAAO,UAAU;AAAA,QACxB,OAAO,OAAO,UAAU;AAAA,MAC1B;AAAA,MAEA,OAAO;AAAA,QACL,OAAO,OAAO,SAAS,MAAM;AAAA,QAC7B,OAAO,OAAO,SAAS,MAAM;AAAA,MAC/B;AAAA,MAEA,SAAS;AAAA,QACP,OAAO,OAAO,SAAS,QAAQ;AAAA,QAC/B,OAAO,OAAO,SAAS,QAAQ;AAAA,MACjC;AAAA,MAEA,SAAS;AAAA,QACP,OAAO,OAAO,SAAS,QAAQ;AAAA,QAC/B,OAAO,OAAO,SAAS,QAAQ;AAAA,MACjC;AAAA,MAEA,MAAM;AAAA,QACJ,OAAO,OAAO,SAAS,KAAK;AAAA,QAC5B,OAAO,OAAO,SAAS,KAAK;AAAA,MAC9B;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../src/theme/create-tag-tokens.ts"],"sourcesContent":["import { PrimitiveThemeTokens, TagTokens } from \"../types\";\n\nexport function createTagTokens(tokens: PrimitiveThemeTokens): TagTokens {\n  return {\n    borderWidth: tokens.borderSize.sm,\n    borderRadius: tokens.radii.round,\n    gap: tokens.space.xxs,\n    closeHitSlop: 10,\n    iconMarginLeft: tokens.borderSize.md,\n\n    sizes: {\n      small: {\n        height: 24,\n        paddingHorizontal: tokens.space.xs,\n        minWidth: tokens.space.xl,\n        fontSize: tokens.fontSize.xs,\n      },\n\n      medium: {\n        height: 28,\n        paddingHorizontal: tokens.space.xs,\n        minWidth: tokens.space.xxl,\n        fontSize: tokens.fontSize.xsm,\n      },\n\n      large: {\n        height: 32,\n        paddingHorizontal: tokens.space.mxs,\n        minWidth: tokens.space.xxl,\n        fontSize: tokens.fontSize.xsm,\n      },\n    },\n\n    colors: {\n      primary: {\n        filled: {\n          default: {\n            backgroundColor: tokens.colors.primary.value,\n            borderColor: tokens.colors.primary.value,\n            color: tokens.colors.primary.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        outlined: {\n          default: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.primary.value,\n            color: tokens.colors.primary.value,\n          },\n          disabled: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        soft: {\n          default: {\n            backgroundColor: tokens.colors.secondary.value,\n            borderColor: tokens.colors.secondary.value,\n            color: tokens.colors.secondary.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.subtle.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n      },\n      secondary: {\n        filled: {\n          default: {\n            backgroundColor: tokens.colors.secondary.value,\n            borderColor: tokens.colors.secondary.value,\n            color: tokens.colors.secondary.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        outlined: {\n          default: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.secondary.contrast,\n            color: tokens.colors.secondary.contrast,\n          },\n          disabled: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        soft: {\n          default: {\n            backgroundColor: tokens.colors.secondary.value,\n            borderColor: tokens.colors.secondary.value,\n            color: tokens.colors.secondary.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.subtle.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n      },\n      error: {\n        filled: {\n          default: {\n            backgroundColor: tokens.colors.feedback.error.value,\n            borderColor: tokens.colors.feedback.error.value,\n            color: tokens.colors.feedback.error.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        outlined: {\n          default: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.feedback.error.value,\n            color: tokens.colors.feedback.error.value,\n          },\n          disabled: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        soft: {\n          default: {\n            backgroundColor: tokens.colors.feedback.error.contrast,\n            borderColor: tokens.colors.feedback.error.contrast,\n            color: tokens.colors.feedback.error.value,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.subtle.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n      },\n      warning: {\n        filled: {\n          default: {\n            backgroundColor: tokens.colors.feedback.warning.value,\n            borderColor: tokens.colors.feedback.warning.value,\n            color: tokens.colors.feedback.warning.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        outlined: {\n          default: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.feedback.warning.value,\n            color: tokens.colors.feedback.warning.value,\n          },\n          disabled: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        soft: {\n          default: {\n            backgroundColor: tokens.colors.feedback.warning.contrast,\n            borderColor: tokens.colors.feedback.warning.contrast,\n            color: tokens.colors.feedback.warning.value,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.subtle.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n      },\n      success: {\n        filled: {\n          default: {\n            backgroundColor: tokens.colors.feedback.success.value,\n            borderColor: tokens.colors.feedback.success.value,\n            color: tokens.colors.feedback.success.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        outlined: {\n          default: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.feedback.success.value,\n            color: tokens.colors.feedback.success.value,\n          },\n          disabled: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        soft: {\n          default: {\n            backgroundColor: tokens.colors.feedback.success.contrast,\n            borderColor: tokens.colors.feedback.success.contrast,\n            color: tokens.colors.feedback.success.value,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.subtle.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n      },\n      info: {\n        filled: {\n          default: {\n            backgroundColor: tokens.colors.feedback.info.value,\n            borderColor: tokens.colors.feedback.info.value,\n            color: tokens.colors.feedback.info.contrast,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        outlined: {\n          default: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.feedback.info.value,\n            color: tokens.colors.feedback.info.value,\n          },\n          disabled: {\n            backgroundColor: \"transparent\",\n            borderColor: tokens.colors.border.strong.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n        soft: {\n          default: {\n            backgroundColor: tokens.colors.feedback.info.contrast,\n            borderColor: tokens.colors.feedback.info.contrast,\n            color: tokens.colors.feedback.info.value,\n          },\n          disabled: {\n            backgroundColor: tokens.colors.surface.primary.value,\n            borderColor: tokens.colors.border.subtle.value,\n            color: tokens.colors.text.disabled,\n          },\n        },\n      },\n    },\n  };\n}\n"],"mappings":"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","names":[]}

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

@@ -2,21 +2,25 @@ import { PrimitiveThemeTokens } from '../types/theme-provider.types.mjs';
 import { TextareaTokens } from '../types/textarea-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/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-textarea-tokens.js

@@ -1,9 +1,6 @@
 function createTextareaTokens(tokens) {
   return {
-    counterColor: tokens.colors.text.tertiary,
     counterFontSize: tokens.fontSize.xs,
-    disabledCounterColor: tokens.colors.text.disabled,
-    errorCounterColor: tokens.colors.feedback.error.value,
     footerGap: tokens.space.xs,
     footerMarginTop: tokens.space.xxs,
     sizes: {
@@ -19,6 +16,12 @@ function createTextareaTokens(tokens) {
         lineHeight: tokens.lineHeight.sm,
         paddingVertical: tokens.space.xs
       }
+    },
+    states: {
+      default: { counterColor: tokens.colors.text.tertiary },
+      error: { counterColor: tokens.colors.feedback.error.value },
+      disabled: { counterColor: tokens.colors.text.disabled },
+      disabledError: { counterColor: tokens.colors.text.disabled }
     }
   };
 }

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/theme/create-textarea-tokens.ts"],"sourcesContent":["import type { PrimitiveThemeTokens, TextareaTokens } from \"../types\";\n\nexport function createTextareaTokens(\n  tokens: PrimitiveThemeTokens,\n): TextareaTokens {\n  return {\n    counterColor: tokens.colors.text.tertiary,\n    counterFontSize: tokens.fontSize.xs,\n    disabledCounterColor: tokens.colors.text.disabled,\n    errorCounterColor: tokens.colors.feedback.error.value,\n    footerGap: tokens.space.xs,\n    footerMarginTop: tokens.space.xxs,\n    sizes: {\n      small: {\n        lineHeight: tokens.lineHeight.xs,\n        paddingVertical: tokens.space.xs,\n      },\n      medium: {\n        lineHeight: tokens.lineHeight.xsm,\n        paddingVertical: tokens.space.xs,\n      },\n      large: {\n        lineHeight: tokens.lineHeight.sm,\n        paddingVertical: tokens.space.xs,\n      },\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,qBACd,QACgB;AAChB,SAAO;AAAA,IACL,cAAc,OAAO,OAAO,KAAK;AAAA,IACjC,iBAAiB,OAAO,SAAS;AAAA,IACjC,sBAAsB,OAAO,OAAO,KAAK;AAAA,IACzC,mBAAmB,OAAO,OAAO,SAAS,MAAM;AAAA,IAChD,WAAW,OAAO,MAAM;AAAA,IACxB,iBAAiB,OAAO,MAAM;AAAA,IAC9B,OAAO;AAAA,MACL,OAAO;AAAA,QACL,YAAY,OAAO,WAAW;AAAA,QAC9B,iBAAiB,OAAO,MAAM;AAAA,MAChC;AAAA,MACA,QAAQ;AAAA,QACN,YAAY,OAAO,WAAW;AAAA,QAC9B,iBAAiB,OAAO,MAAM;AAAA,MAChC;AAAA,MACA,OAAO;AAAA,QACL,YAAY,OAAO,WAAW;AAAA,QAC9B,iBAAiB,OAAO,MAAM;AAAA,MAChC;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../src/theme/create-textarea-tokens.ts"],"sourcesContent":["import type { PrimitiveThemeTokens, TextareaTokens } from \"../types\";\n\nexport function createTextareaTokens(\n  tokens: PrimitiveThemeTokens,\n): TextareaTokens {\n  return {\n    counterFontSize: tokens.fontSize.xs,\n    footerGap: tokens.space.xs,\n    footerMarginTop: tokens.space.xxs,\n    sizes: {\n      small: {\n        lineHeight: tokens.lineHeight.xs,\n        paddingVertical: tokens.space.xs,\n      },\n      medium: {\n        lineHeight: tokens.lineHeight.xsm,\n        paddingVertical: tokens.space.xs,\n      },\n      large: {\n        lineHeight: tokens.lineHeight.sm,\n        paddingVertical: tokens.space.xs,\n      },\n    },\n    states: {\n      default: { counterColor: tokens.colors.text.tertiary },\n      error: { counterColor: tokens.colors.feedback.error.value },\n      disabled: { counterColor: tokens.colors.text.disabled },\n      disabledError: { counterColor: tokens.colors.text.disabled },\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,qBACd,QACgB;AAChB,SAAO;AAAA,IACL,iBAAiB,OAAO,SAAS;AAAA,IACjC,WAAW,OAAO,MAAM;AAAA,IACxB,iBAAiB,OAAO,MAAM;AAAA,IAC9B,OAAO;AAAA,MACL,OAAO;AAAA,QACL,YAAY,OAAO,WAAW;AAAA,QAC9B,iBAAiB,OAAO,MAAM;AAAA,MAChC;AAAA,MACA,QAAQ;AAAA,QACN,YAAY,OAAO,WAAW;AAAA,QAC9B,iBAAiB,OAAO,MAAM;AAAA,MAChC;AAAA,MACA,OAAO;AAAA,QACL,YAAY,OAAO,WAAW;AAAA,QAC9B,iBAAiB,OAAO,MAAM;AAAA,MAChC;AAAA,IACF;AAAA,IACA,QAAQ;AAAA,MACN,SAAS,EAAE,cAAc,OAAO,OAAO,KAAK,SAAS;AAAA,MACrD,OAAO,EAAE,cAAc,OAAO,OAAO,SAAS,MAAM,MAAM;AAAA,MAC1D,UAAU,EAAE,cAAc,OAAO,OAAO,KAAK,SAAS;AAAA,MACtD,eAAe,EAAE,cAAc,OAAO,OAAO,KAAK,SAAS;AAAA,IAC7D;AAAA,EACF;AACF;","names":[]}

package/dist/theme/create-time-picker-tokens.d.mts

@@ -2,21 +2,25 @@ import { PrimitiveThemeTokens } from '../types/theme-provider.types.mjs';
 import { TimePickerTokens } from '../types/time-picker-token.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/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-time-picker-tokens.js

@@ -15,10 +15,16 @@ function createTimePickerTokens(tokens) {
       verticalPadding: VerticalPadding,
       initialScrollIndexViewOffset: -VerticalPadding,
       fontSize: tokens.fontSize.xl,
-      selectedColor: tokens.colors.primary.value,
-      color: tokens.colors.text.primary,
-      selectedFontWeight: tokens.fontWeight.semiBold,
-      fontWeight: tokens.fontWeight.regular
+      states: {
+        default: {
+          color: tokens.colors.text.primary,
+          fontWeight: tokens.fontWeight.regular
+        },
+        selected: {
+          color: tokens.colors.primary.value,
+          fontWeight: tokens.fontWeight.semiBold
+        }
+      }
     },
     flyout: {
       gap: tokens.space.msm

package/dist/theme/create-time-picker-tokens.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/theme/create-time-picker-tokens.ts"],"sourcesContent":["import { PrimitiveThemeTokens, TimePickerTokens } from \"../types\";\r\n\r\nexport function createTimePickerTokens(\r\n  tokens: PrimitiveThemeTokens,\r\n): TimePickerTokens {\r\n  const ItemHeight = 50;\r\n  const VisibleItems = 5;\r\n  const ContainerHeight = ItemHeight * VisibleItems;\r\n  const VerticalPadding = ContainerHeight / 2 - ItemHeight / 2;\r\n  const ColumnWidth = 70;\r\n\r\n  return {\r\n    column: {\r\n      width: ColumnWidth,\r\n      height: ContainerHeight,\r\n      gap: tokens.space.xxs,\r\n\r\n      listWidth: 30,\r\n      itemHeight: ItemHeight,\r\n      visibleItems: VisibleItems,\r\n      verticalPadding: VerticalPadding,\r\n      initialScrollIndexViewOffset: -VerticalPadding,\r\n\r\n      fontSize: tokens.fontSize.xl,\r\n      selectedColor: tokens.colors.primary.value,\r\n      color: tokens.colors.text.primary,\r\n      selectedFontWeight: tokens.fontWeight.semiBold,\r\n      fontWeight: tokens.fontWeight.regular,\r\n    },\r\n\r\n    flyout: {\r\n      gap: tokens.space.msm,\r\n    },\r\n\r\n    columns: {\r\n      height: ContainerHeight,\r\n      gap: tokens.space.xs,\r\n      indicatorHeight: ItemHeight,\r\n      indicatorWidth: ColumnWidth * 3 + 70,\r\n      indicatorTop: VerticalPadding,\r\n      indicatorBorderRadius: tokens.radii.round,\r\n      indicatorBackgroundColor: tokens.colors.surface.primary.value,\r\n    },\r\n  };\r\n}\r\n"],"mappings":"AAEO,SAAS,uBACd,QACkB;AAClB,QAAM,aAAa;AACnB,QAAM,eAAe;AACrB,QAAM,kBAAkB,aAAa;AACrC,QAAM,kBAAkB,kBAAkB,IAAI,aAAa;AAC3D,QAAM,cAAc;AAEpB,SAAO;AAAA,IACL,QAAQ;AAAA,MACN,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,KAAK,OAAO,MAAM;AAAA,MAElB,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,cAAc;AAAA,MACd,iBAAiB;AAAA,MACjB,8BAA8B,CAAC;AAAA,MAE/B,UAAU,OAAO,SAAS;AAAA,MAC1B,eAAe,OAAO,OAAO,QAAQ;AAAA,MACrC,OAAO,OAAO,OAAO,KAAK;AAAA,MAC1B,oBAAoB,OAAO,WAAW;AAAA,MACtC,YAAY,OAAO,WAAW;AAAA,IAChC;AAAA,IAEA,QAAQ;AAAA,MACN,KAAK,OAAO,MAAM;AAAA,IACpB;AAAA,IAEA,SAAS;AAAA,MACP,QAAQ;AAAA,MACR,KAAK,OAAO,MAAM;AAAA,MAClB,iBAAiB;AAAA,MACjB,gBAAgB,cAAc,IAAI;AAAA,MAClC,cAAc;AAAA,MACd,uBAAuB,OAAO,MAAM;AAAA,MACpC,0BAA0B,OAAO,OAAO,QAAQ,QAAQ;AAAA,IAC1D;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../src/theme/create-time-picker-tokens.ts"],"sourcesContent":["import { PrimitiveThemeTokens, TimePickerTokens } from \"../types\";\n\nexport function createTimePickerTokens(\n  tokens: PrimitiveThemeTokens,\n): TimePickerTokens {\n  const ItemHeight = 50;\n  const VisibleItems = 5;\n  const ContainerHeight = ItemHeight * VisibleItems;\n  const VerticalPadding = ContainerHeight / 2 - ItemHeight / 2;\n  const ColumnWidth = 70;\n\n  return {\n    column: {\n      width: ColumnWidth,\n      height: ContainerHeight,\n      gap: tokens.space.xxs,\n\n      listWidth: 30,\n      itemHeight: ItemHeight,\n      visibleItems: VisibleItems,\n      verticalPadding: VerticalPadding,\n      initialScrollIndexViewOffset: -VerticalPadding,\n\n      fontSize: tokens.fontSize.xl,\n      states: {\n        default: {\n          color: tokens.colors.text.primary,\n          fontWeight: tokens.fontWeight.regular,\n        },\n        selected: {\n          color: tokens.colors.primary.value,\n          fontWeight: tokens.fontWeight.semiBold,\n        },\n      },\n    },\n\n    flyout: {\n      gap: tokens.space.msm,\n    },\n\n    columns: {\n      height: ContainerHeight,\n      gap: tokens.space.xs,\n      indicatorHeight: ItemHeight,\n      indicatorWidth: ColumnWidth * 3 + 70,\n      indicatorTop: VerticalPadding,\n      indicatorBorderRadius: tokens.radii.round,\n      indicatorBackgroundColor: tokens.colors.surface.primary.value,\n    },\n  };\n}\n"],"mappings":"AAEO,SAAS,uBACd,QACkB;AAClB,QAAM,aAAa;AACnB,QAAM,eAAe;AACrB,QAAM,kBAAkB,aAAa;AACrC,QAAM,kBAAkB,kBAAkB,IAAI,aAAa;AAC3D,QAAM,cAAc;AAEpB,SAAO;AAAA,IACL,QAAQ;AAAA,MACN,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,KAAK,OAAO,MAAM;AAAA,MAElB,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,cAAc;AAAA,MACd,iBAAiB;AAAA,MACjB,8BAA8B,CAAC;AAAA,MAE/B,UAAU,OAAO,SAAS;AAAA,MAC1B,QAAQ;AAAA,QACN,SAAS;AAAA,UACP,OAAO,OAAO,OAAO,KAAK;AAAA,UAC1B,YAAY,OAAO,WAAW;AAAA,QAChC;AAAA,QACA,UAAU;AAAA,UACR,OAAO,OAAO,OAAO,QAAQ;AAAA,UAC7B,YAAY,OAAO,WAAW;AAAA,QAChC;AAAA,MACF;AAAA,IACF;AAAA,IAEA,QAAQ;AAAA,MACN,KAAK,OAAO,MAAM;AAAA,IACpB;AAAA,IAEA,SAAS;AAAA,MACP,QAAQ;AAAA,MACR,KAAK,OAAO,MAAM;AAAA,MAClB,iBAAiB;AAAA,MACjB,gBAAgB,cAAc,IAAI;AAAA,MAClC,cAAc;AAAA,MACd,uBAAuB,OAAO,MAAM;AAAA,MACpC,0BAA0B,OAAO,OAAO,QAAQ,QAAQ;AAAA,IAC1D;AAAA,EACF;AACF;","names":[]}

package/dist/theme/dark.theme.d.mts

@@ -1,21 +1,25 @@
 import { PrimitiveThemeTokens } from '../types/theme-provider.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/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/dark.theme.js

@@ -1,16 +1,16 @@
 import {
   BorderSizeTokens,
+  DarkColors,
   FontFamilyTokens,
   FontSizeTokens,
   FontWeightTokens,
   LetterSpacingTokens,
-  LightColors,
   LineHeightTokens,
   RadiiTokens,
   SpaceTokens
 } from "./tokens.theme";
 const DarkTheme = {
-  colors: LightColors,
+  colors: DarkColors,
   space: SpaceTokens,
   radii: RadiiTokens,
   fontFamily: FontFamilyTokens,

package/dist/theme/dark.theme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/theme/dark.theme.ts"],"sourcesContent":["import { PrimitiveThemeTokens } from \"../types\";\nimport {\n  BorderSizeTokens,\n  FontFamilyTokens,\n  FontSizeTokens,\n  FontWeightTokens,\n  LetterSpacingTokens,\n  LightColors,\n  LineHeightTokens,\n  RadiiTokens,\n  SpaceTokens,\n} from \"./tokens.theme\";\n\nexport const DarkTheme: PrimitiveThemeTokens = {\n  colors: LightColors,\n  space: SpaceTokens,\n  radii: RadiiTokens,\n  fontFamily: FontFamilyTokens,\n  borderSize: BorderSizeTokens,\n  fontSize: FontSizeTokens,\n  fontWeight: FontWeightTokens,\n  lineHeight: LineHeightTokens,\n  letterSpacing: LetterSpacingTokens,\n};\n"],"mappings":"AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,YAAkC;AAAA,EAC7C,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,eAAe;AACjB;","names":[]}
+{"version":3,"sources":["../../src/theme/dark.theme.ts"],"sourcesContent":["import { PrimitiveThemeTokens } from \"../types\";\nimport {\n  BorderSizeTokens,\n  DarkColors,\n  FontFamilyTokens,\n  FontSizeTokens,\n  FontWeightTokens,\n  LetterSpacingTokens,\n  LineHeightTokens,\n  RadiiTokens,\n  SpaceTokens,\n} from \"./tokens.theme\";\n\nexport const DarkTheme: PrimitiveThemeTokens = {\n  colors: DarkColors,\n  space: SpaceTokens,\n  radii: RadiiTokens,\n  fontFamily: FontFamilyTokens,\n  borderSize: BorderSizeTokens,\n  fontSize: FontSizeTokens,\n  fontWeight: FontWeightTokens,\n  lineHeight: LineHeightTokens,\n  letterSpacing: LetterSpacingTokens,\n};\n"],"mappings":"AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,YAAkC;AAAA,EAC7C,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,eAAe;AACjB;","names":[]}

package/dist/theme/index.d.mts

@@ -1,25 +1,32 @@
 export { DarkTheme } from './dark.theme.mjs';
 export { LightTheme } from './light.theme.mjs';
-export { BorderSizeTokens, ChartColorTokens, FontFamilyTokens, FontFamilyWeightsItalicTokens, FontFamilyWeightsNormalTokens, FontSizeTokens, FontWeightTokens, LetterSpacingTokens, LightColors, LineHeightTokens, NeutralColorTokens, RadiiTokens, SpaceTokens, createComponentsTokens } from './tokens.theme.mjs';
+export { BorderSizeTokens, ChartColorTokens, DarkColors, FontFamilyTokens, FontFamilyWeightsItalicTokens, FontFamilyWeightsNormalTokens, FontSizeTokens, FontWeightTokens, LetterSpacingTokens, LightColors, LineHeightTokens, NeutralColorTokens, RadiiTokens, SpaceTokens, createComponentsTokens } from './tokens.theme.mjs';
+export { createPaginationTokens } from './create-pagination-tokens.mjs';
 export { createSliderTokens } from './create-slider-tokens.mjs';
+export { createSegmentedControlTokens } from './create-segmented-control-tokens.mjs';
+export { createCarouselTokens } from './create-carousel-tokens.mjs';
 import '../types/theme-provider.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/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/index.js

@@ -1,7 +1,10 @@
 import { DarkTheme } from "./dark.theme";
 import { LightTheme } from "./light.theme";
 export * from "./tokens.theme";
+export * from "./create-pagination-tokens";
 export * from "./create-slider-tokens";
+export * from "./create-segmented-control-tokens";
+export * from "./create-carousel-tokens";
 export {
   DarkTheme,
   LightTheme

package/dist/theme/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/theme/index.ts"],"sourcesContent":["export { DarkTheme } from \"./dark.theme\";\nexport { LightTheme } from \"./light.theme\";\nexport * from \"./tokens.theme\";\nexport * from \"./create-slider-tokens\";\n"],"mappings":"AAAA,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,cAAc;AACd,cAAc;","names":[]}
+{"version":3,"sources":["../../src/theme/index.ts"],"sourcesContent":["export { DarkTheme } from \"./dark.theme\";\nexport { LightTheme } from \"./light.theme\";\nexport * from \"./tokens.theme\";\nexport * from \"./create-pagination-tokens\";\nexport * from \"./create-slider-tokens\";\nexport * from \"./create-segmented-control-tokens\";\nexport * from \"./create-carousel-tokens\";\n"],"mappings":"AAAA,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/theme/light.theme.d.mts

@@ -1,21 +1,25 @@
 import { PrimitiveThemeTokens } from '../types/theme-provider.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/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';