@nationaldesignstudio/react 0.3.0 → 0.5.1

package/dist/lib/form-control.d.ts

@@ -14,11 +14,12 @@
 export declare const formControlBase: string[];
 /**
  * Size variants shared by form controls
+ * Uses spatial tokens for consistent sizing across form controls
  */
 export declare const formControlSizes: {
-    readonly sm: "h-36 px-12 py-8 text-14";
-    readonly default: "h-48 px-16 py-10";
-    readonly lg: "h-56 px-20 py-12 text-18";
+    readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+    readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+    readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
 };
 /**
  * Error state styles shared by form controls
@@ -33,9 +34,9 @@ export declare const formControlError: {
  */
 export declare const formControlVariants: import('tailwind-variants').TVReturnType<{
     size: {
-        readonly sm: "h-36 px-12 py-8 text-14";
-        readonly default: "h-48 px-16 py-10";
-        readonly lg: "h-56 px-20 py-12 text-18";
+        readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+        readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+        readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
     };
     error: {
         readonly true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color";
@@ -43,9 +44,9 @@ export declare const formControlVariants: import('tailwind-variants').TVReturnTy
     };
 }, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
     size: {
-        readonly sm: "h-36 px-12 py-8 text-14";
-        readonly default: "h-48 px-16 py-10";
-        readonly lg: "h-56 px-20 py-12 text-18";
+        readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+        readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+        readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
     };
     error: {
         readonly true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color";
@@ -53,9 +54,9 @@ export declare const formControlVariants: import('tailwind-variants').TVReturnTy
     };
 }, {
     size: {
-        readonly sm: "h-36 px-12 py-8 text-14";
-        readonly default: "h-48 px-16 py-10";
-        readonly lg: "h-56 px-20 py-12 text-18";
+        readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+        readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+        readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
     };
     error: {
         readonly true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color";
@@ -63,9 +64,9 @@ export declare const formControlVariants: import('tailwind-variants').TVReturnTy
     };
 }>, {
     size: {
-        readonly sm: "h-36 px-12 py-8 text-14";
-        readonly default: "h-48 px-16 py-10";
-        readonly lg: "h-56 px-20 py-12 text-18";
+        readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+        readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+        readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
     };
     error: {
         readonly true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color";
@@ -73,9 +74,9 @@ export declare const formControlVariants: import('tailwind-variants').TVReturnTy
     };
 }, undefined, import('tailwind-variants').TVReturnType<{
     size: {
-        readonly sm: "h-36 px-12 py-8 text-14";
-        readonly default: "h-48 px-16 py-10";
-        readonly lg: "h-56 px-20 py-12 text-18";
+        readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+        readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+        readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
     };
     error: {
         readonly true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color";
@@ -83,9 +84,9 @@ export declare const formControlVariants: import('tailwind-variants').TVReturnTy
     };
 }, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
     size: {
-        readonly sm: "h-36 px-12 py-8 text-14";
-        readonly default: "h-48 px-16 py-10";
-        readonly lg: "h-56 px-20 py-12 text-18";
+        readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+        readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+        readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
     };
     error: {
         readonly true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color";
@@ -93,9 +94,9 @@ export declare const formControlVariants: import('tailwind-variants').TVReturnTy
     };
 }, {
     size: {
-        readonly sm: "h-36 px-12 py-8 text-14";
-        readonly default: "h-48 px-16 py-10";
-        readonly lg: "h-56 px-20 py-12 text-18";
+        readonly sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14";
+        readonly default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium";
+        readonly lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18";
     };
     error: {
         readonly true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color";

package/dist/lib/form-control.js

@@ -0,0 +1,43 @@
+import { tv as o } from "../node_modules/.bun/tailwind-variants@0.3.1_b0c4767bcd570450/node_modules/tailwind-variants/dist/index.js";
+const r = [
+  // Layout
+  "flex w-full items-center",
+  // Typography
+  "text-16 font-medium leading-14",
+  // Border and radius - uses surface ui radius for theming support
+  "border border-solid border-ui-color-border rounded-surface-ui-medium",
+  // Background
+  "bg-ui-control-background",
+  // Transitions
+  "transition-[background-color,border-color,box-shadow] duration-150",
+  // Focus state
+  "outline-none focus-visible:border-border-focus focus-visible:ring-4 focus-visible:ring-ui-color-focus",
+  // Hover state (when not focused or disabled)
+  "hover:bg-ui-control-background-hover hover:focus-visible:bg-ui-control-background",
+  // Disabled state
+  "disabled:bg-ui-control-background-disabled disabled:cursor-not-allowed disabled:opacity-50"
+], i = {
+  sm: "h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14",
+  default: "h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium",
+  lg: "h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18"
+}, e = {
+  true: "border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color",
+  false: ""
+};
+o({
+  base: r,
+  variants: {
+    size: i,
+    error: e
+  },
+  defaultVariants: {
+    size: "default",
+    error: !1
+  }
+});
+export {
+  r as formControlBase,
+  e as formControlError,
+  i as formControlSizes
+};
+//# sourceMappingURL=form-control.js.map

package/dist/lib/form-control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-control.js","sources":["../../src/lib/form-control.ts"],"sourcesContent":["import { tv } from \"tailwind-variants\";\n\n/**\n * Shared form control styles for Input, Select, and similar components.\n *\n * These base styles ensure consistent appearance across all form controls:\n * - Consistent height and padding\n * - Unified focus ring and border treatment\n * - Shared hover/disabled states\n *\n * Based on Figma BaseKit / Interface / Input & Dropdown designs.\n */\n\n/**\n * Base styles shared by all form controls (input, select, etc.)\n */\nexport const formControlBase = [\n\t// Layout\n\t\"flex w-full items-center\",\n\t// Typography\n\t\"text-16 font-medium leading-14\",\n\t// Border and radius - uses surface ui radius for theming support\n\t\"border border-solid border-ui-color-border rounded-surface-ui-medium\",\n\t// Background\n\t\"bg-ui-control-background\",\n\t// Transitions\n\t\"transition-[background-color,border-color,box-shadow] duration-150\",\n\t// Focus state\n\t\"outline-none focus-visible:border-border-focus focus-visible:ring-4 focus-visible:ring-ui-color-focus\",\n\t// Hover state (when not focused or disabled)\n\t\"hover:bg-ui-control-background-hover hover:focus-visible:bg-ui-control-background\",\n\t// Disabled state\n\t\"disabled:bg-ui-control-background-disabled disabled:cursor-not-allowed disabled:opacity-50\",\n];\n\n/**\n * Size variants shared by form controls\n * Uses spatial tokens for consistent sizing across form controls\n */\nexport const formControlSizes = {\n\tsm: \"h-spatial-ui-control-height-small px-spatial-ui-control-padding-x-small py-spatial-ui-control-padding-y-small text-14\",\n\tdefault:\n\t\t\"h-spatial-ui-control-height-medium px-spatial-ui-control-padding-x-medium py-spatial-ui-control-padding-y-medium\",\n\tlg: \"h-spatial-ui-control-height-large px-spatial-ui-control-padding-x-large py-spatial-ui-control-padding-y-large text-18\",\n} as const;\n\n/**\n * Error state styles shared by form controls\n */\nexport const formControlError = {\n\ttrue: \"border-ui-error-color focus-visible:border-ui-error-color focus-visible:ring-ui-error-color/20 text-ui-error-color\",\n\tfalse: \"\",\n} as const;\n\n/**\n * Form control variants using tailwind-variants\n * Can be composed with other variants for specific components\n */\nexport const formControlVariants = tv({\n\tbase: formControlBase,\n\tvariants: {\n\t\tsize: formControlSizes,\n\t\terror: formControlError,\n\t},\n\tdefaultVariants: {\n\t\tsize: \"default\",\n\t\terror: false,\n\t},\n});\n\nexport type FormControlSize = keyof typeof formControlSizes;\n"],"names":["formControlBase","formControlSizes","formControlError","tv"],"mappings":";AAgBO,MAAMA,IAAkB;AAAA;AAAA,EAE9B;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AACD,GAMaC,IAAmB;AAAA,EAC/B,IAAI;AAAA,EACJ,SACC;AAAA,EACD,IAAI;AACL,GAKaC,IAAmB;AAAA,EAC/B,MAAM;AAAA,EACN,OAAO;AACR;AAMmCC,EAAG;AAAA,EACrC,MAAMH;AAAA,EACN,UAAU;AAAA,IACT,MAAMC;AAAA,IACN,OAAOC;AAAA,EAAA;AAAA,EAER,iBAAiB;AAAA,IAChB,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAET,CAAC;"}

package/dist/lib/theme.js

@@ -0,0 +1,100 @@
+const o = [
+  9,
+  11,
+  12,
+  14,
+  16,
+  18,
+  21,
+  24,
+  28,
+  32,
+  36,
+  42,
+  48,
+  56,
+  64,
+  72,
+  84,
+  88,
+  96,
+  112,
+  128,
+  148,
+  168,
+  192,
+  224,
+  256,
+  280
+];
+function d(t) {
+  return `text-${t} leading-${t} tracking-${t}`;
+}
+function g(t, e, r) {
+  return [
+    d(t),
+    `md:${d(e).split(" ").join(" md:")}`,
+    `xl:${d(r).split(" ").join(" xl:")}`
+  ].join(" ");
+}
+function i(t) {
+  return `var(--color-${t})`;
+}
+function a(t) {
+  return `var(--${t})`;
+}
+function n(t) {
+  return `var(--${t})`;
+}
+function c(t) {
+  if (!t) return {};
+  const e = {};
+  if (t.colors) {
+    const { colors: r } = t;
+    r.bgSection && (e["--theme-bg-section"] = i(r.bgSection)), r.cardBackground && (e["--theme-card-background"] = i(r.cardBackground)), r.bgMuted && (e["--theme-bg-muted"] = i(r.bgMuted)), r.textPrimary && (e["--theme-text-primary"] = i(r.textPrimary)), r.textSecondary && (e["--theme-text-secondary"] = i(r.textSecondary)), r.textMuted && (e["--theme-text-muted"] = i(r.textMuted)), r.textInverted && (e["--theme-text-inverted"] = i(r.textInverted)), r.textLink && (e["--theme-text-link"] = i(r.textLink)), r.textLinkHover && (e["--theme-text-link-hover"] = i(r.textLinkHover)), r.accentBrand && (e["--theme-accent-brand"] = i(r.accentBrand)), r.accentBrandSoft && (e["--theme-accent-brand-soft"] = i(r.accentBrandSoft)), r.borderSubtle && (e["--theme-border-subtle"] = i(r.borderSubtle)), r.borderStrong && (e["--theme-border-strong"] = i(r.borderStrong)), r.borderFocus && (e["--theme-border-focus"] = i(r.borderFocus)), r.borderDivider && (e["--theme-border-divider"] = i(r.borderDivider)), r.buttonPrimaryBg && (e["--theme-button-primary-bg"] = i(r.buttonPrimaryBg)), r.buttonPrimaryBgHover && (e["--theme-button-primary-bg-hover"] = i(
+      r.buttonPrimaryBgHover
+    )), r.buttonSecondaryBg && (e["--theme-button-secondary-bg"] = i(
+      r.buttonSecondaryBg
+    )), r.buttonSecondaryBgHover && (e["--theme-button-secondary-bg-hover"] = i(
+      r.buttonSecondaryBgHover
+    ));
+  }
+  if (t.spatial) {
+    const { spatial: r } = t;
+    r.gridLargeMargin && (e["--theme-grid-large-margin"] = a(r.gridLargeMargin)), r.gridLargeGutter && (e["--theme-grid-large-gutter"] = a(r.gridLargeGutter)), r.gridLargeColumns && (e["--theme-grid-large-columns"] = String(r.gridLargeColumns)), r.gridMediumMargin && (e["--theme-grid-medium-margin"] = a(
+      r.gridMediumMargin
+    )), r.gridMediumGutter && (e["--theme-grid-medium-gutter"] = a(
+      r.gridMediumGutter
+    )), r.gridMediumColumns && (e["--theme-grid-medium-columns"] = String(r.gridMediumColumns)), r.gridSmallMargin && (e["--theme-grid-small-margin"] = a(r.gridSmallMargin)), r.gridSmallGutter && (e["--theme-grid-small-gutter"] = a(r.gridSmallGutter)), r.gridSmallColumns && (e["--theme-grid-small-columns"] = String(r.gridSmallColumns)), r.sectionLargeGap && (e["--theme-section-large-gap"] = a(r.sectionLargeGap)), r.sectionLargePadding && (e["--theme-section-large-padding"] = a(
+      r.sectionLargePadding
+    )), r.sectionMediumGap && (e["--theme-section-medium-gap"] = a(
+      r.sectionMediumGap
+    )), r.sectionMediumPadding && (e["--theme-section-medium-padding"] = a(
+      r.sectionMediumPadding
+    )), r.sectionSmallGap && (e["--theme-section-small-gap"] = a(r.sectionSmallGap)), r.sectionSmallPadding && (e["--theme-section-small-padding"] = a(
+      r.sectionSmallPadding
+    )), r.cardLargeGap && (e["--theme-card-large-gap"] = a(r.cardLargeGap)), r.cardLargePadding && (e["--theme-card-large-padding"] = a(
+      r.cardLargePadding
+    )), r.cardSmallGap && (e["--theme-card-small-gap"] = a(r.cardSmallGap)), r.cardSmallPadding && (e["--theme-card-small-padding"] = a(
+      r.cardSmallPadding
+    ));
+  }
+  if (t.surface) {
+    const { surface: r } = t;
+    r.cardRadius && (e["--theme-card-radius"] = n(r.cardRadius)), r.cardStroke && (e["--theme-card-stroke"] = `${r.cardStroke}px`), r.buttonRadius && (e["--theme-button-radius"] = n(r.buttonRadius)), r.buttonStrokeWeight && (e["--theme-button-stroke-weight"] = `${r.buttonStrokeWeight}px`);
+  }
+  return e;
+}
+function u(t) {
+  if (!t) return {};
+  const e = {};
+  return t.bg && (e["--btn-bg"] = i(t.bg)), t.bgHover && (e["--btn-bg-hover"] = i(t.bgHover)), t.bgActive && (e["--btn-bg-active"] = i(t.bgActive)), t.text && (e["--btn-text"] = i(t.text)), t.borderColor && (e["--btn-border-color"] = i(t.borderColor)), t.borderWidth !== void 0 && (e["--btn-border-width"] = `${t.borderWidth}px`), t.radius && (e["--btn-radius"] = n(t.radius)), e;
+}
+export {
+  o as FONT_SIZES,
+  u as buttonThemeToStyleVars,
+  d as fontSizeToClass,
+  g as responsiveTypographyClass,
+  c as themeToStyleVars
+};
+//# sourceMappingURL=theme.js.map

package/dist/lib/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sources":["../../src/lib/theme.ts"],"sourcesContent":["/**\n * Component-level theming interface\n *\n * This interface defines all the customizable design tokens that can be\n * overridden at the component level. Components accepting a `theme` prop\n * will apply these values as CSS custom properties, allowing fine-grained\n * control over appearance without creating new variants.\n *\n * All values use primitive token names (e.g., \"gray-100\", \"spacing-40\")\n * which are converted to CSS variable references internally.\n */\n\n// =============================================================================\n// Token Name Types\n// =============================================================================\n\n/**\n * Color token names - maps to `--color-{name}` CSS variables\n * @example \"gray-100\", \"ember-v300\", \"alpha-black-10\"\n */\nexport type ColorToken =\n\t// Grayscale\n\t| \"gray-50\"\n\t| \"gray-100\"\n\t| \"gray-200\"\n\t| \"gray-300\"\n\t| \"gray-400\"\n\t| \"gray-500\"\n\t| \"gray-600\"\n\t| \"gray-700\"\n\t| \"gray-800\"\n\t| \"gray-900\"\n\t| \"gray-1000\"\n\t| \"gray-1100\"\n\t| \"gray-1200\"\n\t// Steel\n\t| \"steel-50\"\n\t| \"steel-100\"\n\t| \"steel-200\"\n\t| \"steel-300\"\n\t| \"steel-400\"\n\t| \"steel-500\"\n\t| \"steel-600\"\n\t| \"steel-700\"\n\t| \"steel-800\"\n\t| \"steel-900\"\n\t| \"steel-1000\"\n\t| \"steel-1100\"\n\t| \"steel-1200\"\n\t// Brown\n\t| \"brown-50\"\n\t| \"brown-100\"\n\t| \"brown-200\"\n\t| \"brown-300\"\n\t| \"brown-400\"\n\t| \"brown-500\"\n\t| \"brown-600\"\n\t| \"brown-700\"\n\t| \"brown-800\"\n\t| \"brown-900\"\n\t| \"brown-1000\"\n\t| \"brown-1100\"\n\t| \"brown-1200\"\n\t// Ember\n\t| \"ember-50\"\n\t| \"ember-100\"\n\t| \"ember-200\"\n\t| \"ember-300\"\n\t| \"ember-400\"\n\t| \"ember-500\"\n\t| \"ember-600\"\n\t| \"ember-700\"\n\t| \"ember-800\"\n\t| \"ember-900\"\n\t| \"ember-v100\"\n\t| \"ember-v200\"\n\t| \"ember-v300\"\n\t| \"ember-v400\"\n\t// Orange\n\t| \"orange-50\"\n\t| \"orange-100\"\n\t| \"orange-200\"\n\t| \"orange-300\"\n\t| \"orange-400\"\n\t| \"orange-500\"\n\t| \"orange-600\"\n\t| \"orange-700\"\n\t| \"orange-800\"\n\t| \"orange-900\"\n\t| \"orange-v100\"\n\t| \"orange-v200\"\n\t| \"orange-v300\"\n\t| \"orange-v400\"\n\t// Amber\n\t| \"amber-50\"\n\t| \"amber-100\"\n\t| \"amber-200\"\n\t| \"amber-300\"\n\t| \"amber-400\"\n\t| \"amber-500\"\n\t| \"amber-600\"\n\t| \"amber-700\"\n\t| \"amber-800\"\n\t| \"amber-900\"\n\t| \"amber-v100\"\n\t| \"amber-v200\"\n\t| \"amber-v300\"\n\t| \"amber-v400\"\n\t// Yellow\n\t| \"yellow-50\"\n\t| \"yellow-100\"\n\t| \"yellow-200\"\n\t| \"yellow-300\"\n\t| \"yellow-400\"\n\t| \"yellow-500\"\n\t| \"yellow-600\"\n\t| \"yellow-700\"\n\t| \"yellow-800\"\n\t| \"yellow-900\"\n\t| \"yellow-v100\"\n\t| \"yellow-v200\"\n\t| \"yellow-v300\"\n\t| \"yellow-v400\"\n\t// Lime\n\t| \"lime-50\"\n\t| \"lime-100\"\n\t| \"lime-200\"\n\t| \"lime-300\"\n\t| \"lime-400\"\n\t| \"lime-500\"\n\t| \"lime-600\"\n\t| \"lime-700\"\n\t| \"lime-800\"\n\t| \"lime-900\"\n\t| \"lime-v100\"\n\t| \"lime-v200\"\n\t| \"lime-v300\"\n\t| \"lime-v400\"\n\t// Green\n\t| \"green-50\"\n\t| \"green-100\"\n\t| \"green-200\"\n\t| \"green-300\"\n\t| \"green-400\"\n\t| \"green-500\"\n\t| \"green-600\"\n\t| \"green-700\"\n\t| \"green-800\"\n\t| \"green-900\"\n\t| \"green-v100\"\n\t| \"green-v200\"\n\t| \"green-v300\"\n\t| \"green-v400\"\n\t// Sage\n\t| \"sage-50\"\n\t| \"sage-100\"\n\t| \"sage-200\"\n\t| \"sage-300\"\n\t| \"sage-400\"\n\t| \"sage-500\"\n\t| \"sage-600\"\n\t| \"sage-700\"\n\t| \"sage-800\"\n\t| \"sage-900\"\n\t| \"sage-v100\"\n\t| \"sage-v200\"\n\t| \"sage-v300\"\n\t| \"sage-v400\"\n\t// Teal\n\t| \"teal-50\"\n\t| \"teal-100\"\n\t| \"teal-200\"\n\t| \"teal-300\"\n\t| \"teal-400\"\n\t| \"teal-500\"\n\t| \"teal-600\"\n\t| \"teal-700\"\n\t| \"teal-800\"\n\t| \"teal-900\"\n\t| \"teal-v100\"\n\t| \"teal-v200\"\n\t| \"teal-v300\"\n\t| \"teal-v400\"\n\t// Cyan\n\t| \"cyan-50\"\n\t| \"cyan-100\"\n\t| \"cyan-200\"\n\t| \"cyan-300\"\n\t| \"cyan-400\"\n\t| \"cyan-500\"\n\t| \"cyan-600\"\n\t| \"cyan-700\"\n\t| \"cyan-800\"\n\t| \"cyan-900\"\n\t| \"cyan-v100\"\n\t| \"cyan-v200\"\n\t| \"cyan-v300\"\n\t| \"cyan-v400\"\n\t// Ice\n\t| \"ice-50\"\n\t| \"ice-100\"\n\t| \"ice-200\"\n\t| \"ice-300\"\n\t| \"ice-400\"\n\t| \"ice-500\"\n\t| \"ice-600\"\n\t| \"ice-700\"\n\t| \"ice-800\"\n\t| \"ice-900\"\n\t| \"ice-v100\"\n\t| \"ice-v200\"\n\t| \"ice-v300\"\n\t| \"ice-v400\"\n\t// Blue\n\t| \"blue-50\"\n\t| \"blue-100\"\n\t| \"blue-200\"\n\t| \"blue-300\"\n\t| \"blue-400\"\n\t| \"blue-500\"\n\t| \"blue-600\"\n\t| \"blue-700\"\n\t| \"blue-800\"\n\t| \"blue-900\"\n\t| \"blue-v100\"\n\t| \"blue-v200\"\n\t| \"blue-v300\"\n\t| \"blue-v400\"\n\t// Indigo\n\t| \"indigo-50\"\n\t| \"indigo-100\"\n\t| \"indigo-200\"\n\t| \"indigo-300\"\n\t| \"indigo-400\"\n\t| \"indigo-500\"\n\t| \"indigo-600\"\n\t| \"indigo-700\"\n\t| \"indigo-800\"\n\t| \"indigo-900\"\n\t| \"indigo-v100\"\n\t| \"indigo-v200\"\n\t| \"indigo-v300\"\n\t| \"indigo-v400\"\n\t// Iris\n\t| \"iris-50\"\n\t| \"iris-100\"\n\t| \"iris-200\"\n\t| \"iris-300\"\n\t| \"iris-400\"\n\t| \"iris-500\"\n\t| \"iris-600\"\n\t| \"iris-700\"\n\t| \"iris-800\"\n\t| \"iris-900\"\n\t| \"iris-v100\"\n\t| \"iris-v200\"\n\t| \"iris-v300\"\n\t| \"iris-v400\"\n\t// Purple\n\t| \"purple-50\"\n\t| \"purple-100\"\n\t| \"purple-200\"\n\t| \"purple-300\"\n\t| \"purple-400\"\n\t| \"purple-500\"\n\t| \"purple-600\"\n\t| \"purple-700\"\n\t| \"purple-800\"\n\t| \"purple-900\"\n\t| \"purple-v100\"\n\t| \"purple-v200\"\n\t| \"purple-v300\"\n\t| \"purple-v400\"\n\t// Pink\n\t| \"pink-50\"\n\t| \"pink-100\"\n\t| \"pink-200\"\n\t| \"pink-300\"\n\t| \"pink-400\"\n\t| \"pink-500\"\n\t| \"pink-600\"\n\t| \"pink-700\"\n\t| \"pink-800\"\n\t| \"pink-900\"\n\t| \"pink-v100\"\n\t| \"pink-v200\"\n\t| \"pink-v300\"\n\t| \"pink-v400\"\n\t// Red\n\t| \"red-50\"\n\t| \"red-100\"\n\t| \"red-200\"\n\t| \"red-300\"\n\t| \"red-400\"\n\t| \"red-500\"\n\t| \"red-600\"\n\t| \"red-700\"\n\t| \"red-800\"\n\t| \"red-900\"\n\t| \"red-v100\"\n\t| \"red-v200\"\n\t| \"red-v300\"\n\t| \"red-v400\"\n\t// Alpha\n\t| \"alpha-black-5\"\n\t| \"alpha-black-10\"\n\t| \"alpha-black-20\"\n\t| \"alpha-black-30\"\n\t| \"alpha-black-40\"\n\t| \"alpha-black-50\"\n\t| \"alpha-black-60\"\n\t| \"alpha-black-70\"\n\t| \"alpha-black-80\"\n\t| \"alpha-black-90\"\n\t| \"alpha-black-95\"\n\t| \"alpha-white-5\"\n\t| \"alpha-white-10\"\n\t| \"alpha-white-20\"\n\t| \"alpha-white-30\"\n\t| \"alpha-white-40\"\n\t| \"alpha-white-50\"\n\t| \"alpha-white-60\"\n\t| \"alpha-white-70\"\n\t| \"alpha-white-80\"\n\t| \"alpha-white-90\"\n\t| \"alpha-white-95\"\n\t// Special\n\t| \"white\"\n\t| \"black\";\n\n/**\n * Spacing token names - maps to `--spacing-{name}` CSS variables\n * @example \"spacing-40\", \"spacing-72\"\n */\nexport type SpacingToken =\n\t| \"spacing-0\"\n\t| \"spacing-2\"\n\t| \"spacing-4\"\n\t| \"spacing-6\"\n\t| \"spacing-8\"\n\t| \"spacing-10\"\n\t| \"spacing-11\"\n\t| \"spacing-12\"\n\t| \"spacing-16\"\n\t| \"spacing-20\"\n\t| \"spacing-24\"\n\t| \"spacing-28\"\n\t| \"spacing-32\"\n\t| \"spacing-36\"\n\t| \"spacing-40\"\n\t| \"spacing-48\"\n\t| \"spacing-56\"\n\t| \"spacing-64\"\n\t| \"spacing-72\"\n\t| \"spacing-80\"\n\t| \"spacing-96\"\n\t| \"spacing-112\"\n\t| \"spacing-128\"\n\t| \"spacing-144\"\n\t| \"spacing-160\"\n\t| \"spacing-176\"\n\t| \"spacing-192\"\n\t| \"spacing-208\"\n\t| \"spacing-224\"\n\t| \"spacing-240\"\n\t| \"spacing-256\"\n\t| \"spacing-288\"\n\t| \"spacing-320\"\n\t| \"spacing-352\"\n\t| \"spacing-384\"\n\t| \"spacing-400\";\n\n/**\n * Radius token names - maps to `--radii-{name}` CSS variables\n * @example \"radii-4\", \"radii-6\"\n */\nexport type RadiusToken =\n\t| \"radii-0\"\n\t| \"radii-2\"\n\t| \"radii-4\"\n\t| \"radii-6\"\n\t| \"radii-8\"\n\t| \"radii-10\"\n\t| \"radii-11\"\n\t| \"radii-12\"\n\t| \"radii-16\"\n\t| \"radii-20\"\n\t| \"radii-24\"\n\t| \"radii-28\"\n\t| \"radii-32\"\n\t| \"radii-36\"\n\t| \"radii-40\"\n\t| \"radii-48\"\n\t| \"radii-56\"\n\t| \"radii-64\"\n\t| \"radii-72\"\n\t| \"radii-80\"\n\t| \"radii-96\"\n\t| \"radii-112\"\n\t| \"radii-128\"\n\t| \"radii-144\"\n\t| \"radii-160\"\n\t| \"radii-176\"\n\t| \"radii-192\"\n\t| \"radii-208\"\n\t| \"radii-224\"\n\t| \"radii-240\"\n\t| \"radii-256\"\n\t| \"radii-288\"\n\t| \"radii-320\"\n\t| \"radii-352\"\n\t| \"radii-384\"\n\t| \"radii-400\";\n\n/**\n * Font size token values - primitive font sizes available in the design system\n * These correspond to Tailwind classes like `text-64`, `text-128`, etc.\n * @example 64, 128, 192\n */\nexport type FontSizeToken =\n\t| 9\n\t| 11\n\t| 12\n\t| 14\n\t| 16\n\t| 18\n\t| 21\n\t| 24\n\t| 28\n\t| 32\n\t| 36\n\t| 42\n\t| 48\n\t| 56\n\t| 64\n\t| 72\n\t| 84\n\t| 88\n\t| 96\n\t| 112\n\t| 128\n\t| 148\n\t| 168\n\t| 192\n\t| 224\n\t| 256\n\t| 280;\n\n/**\n * Array of all available font sizes for use in UI selectors/dropdowns\n */\nexport const FONT_SIZES: FontSizeToken[] = [\n\t9, 11, 12, 14, 16, 18, 21, 24, 28, 32, 36, 42, 48, 56, 64, 72, 84, 88, 96,\n\t112, 128, 148, 168, 192, 224, 256, 280,\n];\n\n/**\n * Helper to generate typography class string from font size\n * @example fontSizeToClass(128) => \"text-128 leading-128 tracking-128\"\n */\nexport function fontSizeToClass(size: FontSizeToken): string {\n\treturn `text-${size} leading-${size} tracking-${size}`;\n}\n\n/**\n * Helper to generate responsive typography class string\n * @example responsiveTypographyClass(64, 128, 192) => \"text-64 leading-64 tracking-64 md:text-128 md:leading-128 md:tracking-128 xl:text-192 xl:leading-192 xl:tracking-192\"\n */\nexport function responsiveTypographyClass(\n\tmobile: FontSizeToken,\n\ttablet: FontSizeToken,\n\tdesktop: FontSizeToken,\n): string {\n\treturn [\n\t\tfontSizeToClass(mobile),\n\t\t`md:${fontSizeToClass(tablet).split(\" \").join(\" md:\")}`,\n\t\t`xl:${fontSizeToClass(desktop).split(\" \").join(\" xl:\")}`,\n\t].join(\" \");\n}\n\n// =============================================================================\n// Color Tokens\n// =============================================================================\n\nexport interface ComponentThemeColors {\n\t/**\n\t * Background color for sections\n\t * @example \"gray-100\"\n\t */\n\tbgSection?: ColorToken;\n\n\t/**\n\t * Background color for cards\n\t * @example \"white\"\n\t */\n\tcardBackground?: ColorToken;\n\n\t/**\n\t * Muted background color\n\t * @example \"gray-50\"\n\t */\n\tbgMuted?: ColorToken;\n\n\t/**\n\t * Primary text color\n\t * @example \"gray-1100\"\n\t */\n\ttextPrimary?: ColorToken;\n\n\t/**\n\t * Secondary text color\n\t * @example \"gray-800\"\n\t */\n\ttextSecondary?: ColorToken;\n\n\t/**\n\t * Muted text color\n\t * @example \"gray-600\"\n\t */\n\ttextMuted?: ColorToken;\n\n\t/**\n\t * Inverted text color (for dark backgrounds)\n\t * @example \"gray-100\"\n\t */\n\ttextInverted?: ColorToken;\n\n\t/**\n\t * Link text color\n\t * @example \"gray-1100\"\n\t */\n\ttextLink?: ColorToken;\n\n\t/**\n\t * Link hover text color\n\t * @example \"gray-700\"\n\t */\n\ttextLinkHover?: ColorToken;\n\n\t/**\n\t * Brand accent color\n\t * @example \"ember-v300\"\n\t */\n\taccentBrand?: ColorToken;\n\n\t/**\n\t * Soft brand accent color\n\t * @example \"ember-100\"\n\t */\n\taccentBrandSoft?: ColorToken;\n\n\t/**\n\t * Subtle border color\n\t * @example \"alpha-black-10\"\n\t */\n\tborderSubtle?: ColorToken;\n\n\t/**\n\t * Strong border color\n\t * @example \"alpha-black-20\"\n\t */\n\tborderStrong?: ColorToken;\n\n\t/**\n\t * Focus border color (uses accentBrand by default)\n\t * @example \"ember-v300\"\n\t */\n\tborderFocus?: ColorToken;\n\n\t/**\n\t * Divider border color\n\t * @example \"alpha-black-10\"\n\t */\n\tborderDivider?: ColorToken;\n\n\t/**\n\t * Primary button background color\n\t * @example \"gray-1100\"\n\t */\n\tbuttonPrimaryBg?: ColorToken;\n\n\t/**\n\t * Primary button hover background color\n\t * @example \"gray-600\"\n\t */\n\tbuttonPrimaryBgHover?: ColorToken;\n\n\t/**\n\t * Secondary button background color\n\t * @example \"white\"\n\t */\n\tbuttonSecondaryBg?: ColorToken;\n\n\t/**\n\t * Secondary button hover background color\n\t * @example \"gray-100\"\n\t */\n\tbuttonSecondaryBgHover?: ColorToken;\n}\n\n// =============================================================================\n// Spatial Tokens\n// =============================================================================\n\nexport interface ComponentThemeSpatial {\n\t/**\n\t * Grid margin for large breakpoint\n\t * @example \"spacing-72\"\n\t */\n\tgridLargeMargin?: SpacingToken;\n\n\t/**\n\t * Grid gutter for large breakpoint\n\t * @example \"spacing-24\"\n\t */\n\tgridLargeGutter?: SpacingToken;\n\n\t/**\n\t * Number of grid columns for large breakpoint\n\t */\n\tgridLargeColumns?: number;\n\n\t/**\n\t * Grid margin for medium breakpoint\n\t * @example \"spacing-56\"\n\t */\n\tgridMediumMargin?: SpacingToken;\n\n\t/**\n\t * Grid gutter for medium breakpoint\n\t * @example \"spacing-20\"\n\t */\n\tgridMediumGutter?: SpacingToken;\n\n\t/**\n\t * Number of grid columns for medium breakpoint\n\t */\n\tgridMediumColumns?: number;\n\n\t/**\n\t * Grid margin for small breakpoint\n\t * @example \"spacing-24\"\n\t */\n\tgridSmallMargin?: SpacingToken;\n\n\t/**\n\t * Grid gutter for small breakpoint\n\t * @example \"spacing-12\"\n\t */\n\tgridSmallGutter?: SpacingToken;\n\n\t/**\n\t * Number of grid columns for small breakpoint\n\t */\n\tgridSmallColumns?: number;\n\n\t/**\n\t * Section gap for large breakpoint\n\t * @example \"spacing-64\"\n\t */\n\tsectionLargeGap?: SpacingToken;\n\n\t/**\n\t * Section padding for large breakpoint\n\t * @example \"spacing-128\"\n\t */\n\tsectionLargePadding?: SpacingToken;\n\n\t/**\n\t * Section gap for medium breakpoint\n\t * @example \"spacing-56\"\n\t */\n\tsectionMediumGap?: SpacingToken;\n\n\t/**\n\t * Section padding for medium breakpoint\n\t * @example \"spacing-96\"\n\t */\n\tsectionMediumPadding?: SpacingToken;\n\n\t/**\n\t * Section gap for small breakpoint\n\t * @example \"spacing-32\"\n\t */\n\tsectionSmallGap?: SpacingToken;\n\n\t/**\n\t * Section padding for small breakpoint\n\t * @example \"spacing-64\"\n\t */\n\tsectionSmallPadding?: SpacingToken;\n\n\t/**\n\t * Card gap for large size\n\t * @example \"spacing-10\"\n\t */\n\tcardLargeGap?: SpacingToken;\n\n\t/**\n\t * Card padding for large size\n\t * @example \"spacing-24\"\n\t */\n\tcardLargePadding?: SpacingToken;\n\n\t/**\n\t * Card gap for small size\n\t * @example \"spacing-12\"\n\t */\n\tcardSmallGap?: SpacingToken;\n\n\t/**\n\t * Card padding for small size\n\t * @example \"spacing-16\"\n\t */\n\tcardSmallPadding?: SpacingToken;\n}\n\n// =============================================================================\n// Surface Tokens\n// =============================================================================\n\nexport interface ComponentThemeSurface {\n\t/**\n\t * Card border radius\n\t * @example \"radii-4\"\n\t */\n\tcardRadius?: RadiusToken;\n\n\t/**\n\t * Card stroke/border width in pixels\n\t * @example 1\n\t */\n\tcardStroke?: number;\n\n\t/**\n\t * Button border radius\n\t * @example \"radii-6\"\n\t */\n\tbuttonRadius?: RadiusToken;\n\n\t/**\n\t * Button stroke/border weight in pixels\n\t * @example 1\n\t */\n\tbuttonStrokeWeight?: number;\n}\n\n// =============================================================================\n// Combined Theme Interface\n// =============================================================================\n\n/**\n * Complete component theme interface combining colors, spatial, and surface tokens.\n *\n * @example\n * ```tsx\n * const customTheme: ComponentTheme = {\n *   colors: {\n *     textPrimary: \"gray-100\",\n *     accentBrand: \"ember-500\",\n *   },\n *   spatial: {\n *     sectionLargePadding: \"spacing-96\",\n *   },\n *   surface: {\n *     cardRadius: \"radii-8\",\n *   },\n * };\n *\n * <Tout theme={customTheme} ... />\n * ```\n */\nexport interface ComponentTheme {\n\tcolors?: ComponentThemeColors;\n\tspatial?: ComponentThemeSpatial;\n\tsurface?: ComponentThemeSurface;\n}\n\n// =============================================================================\n// Button Theme Interface\n// =============================================================================\n\n/**\n * Button-specific theme interface for customizing individual button appearance.\n *\n * @example\n * ```tsx\n * const buttonTheme: ButtonTheme = {\n *   bg: \"ember-500\",\n *   bgHover: \"ember-600\",\n *   text: \"white\",\n *   radius: \"radii-8\",\n * };\n *\n * <Button theme={buttonTheme}>Themed Button</Button>\n * ```\n */\nexport interface ButtonTheme {\n\t/** Background color */\n\tbg?: ColorToken;\n\t/** Background color on hover */\n\tbgHover?: ColorToken;\n\t/** Background color on active/press */\n\tbgActive?: ColorToken;\n\t/** Text color */\n\ttext?: ColorToken;\n\t/** Border color (if using border) */\n\tborderColor?: ColorToken;\n\t/** Border width in pixels (0 for no border) */\n\tborderWidth?: number;\n\t/** Border radius */\n\tradius?: RadiusToken;\n}\n\n// =============================================================================\n// Utility Functions\n// =============================================================================\n\n/**\n * Converts a color token name to a CSS variable reference\n */\nfunction colorToVar(token: ColorToken): string {\n\treturn `var(--color-${token})`;\n}\n\n/**\n * Converts a spacing token name to a CSS variable reference\n */\nfunction spacingToVar(token: SpacingToken): string {\n\treturn `var(--${token})`;\n}\n\n/**\n * Converts a radius token name to a CSS variable reference\n */\nfunction radiusToVar(token: RadiusToken): string {\n\treturn `var(--${token})`;\n}\n\n/**\n * Converts a ComponentTheme object to CSS custom properties (inline style object)\n *\n * @param theme - The theme object to convert\n * @returns An object suitable for use as React inline styles\n */\nexport function themeToStyleVars(\n\ttheme: ComponentTheme | undefined,\n): React.CSSProperties {\n\tif (!theme) return {};\n\n\tconst vars: Record<string, string> = {};\n\n\t// Colors\n\tif (theme.colors) {\n\t\tconst { colors } = theme;\n\t\tif (colors.bgSection)\n\t\t\tvars[\"--theme-bg-section\"] = colorToVar(colors.bgSection);\n\t\tif (colors.cardBackground)\n\t\t\tvars[\"--theme-card-background\"] = colorToVar(colors.cardBackground);\n\t\tif (colors.bgMuted) vars[\"--theme-bg-muted\"] = colorToVar(colors.bgMuted);\n\t\tif (colors.textPrimary)\n\t\t\tvars[\"--theme-text-primary\"] = colorToVar(colors.textPrimary);\n\t\tif (colors.textSecondary)\n\t\t\tvars[\"--theme-text-secondary\"] = colorToVar(colors.textSecondary);\n\t\tif (colors.textMuted)\n\t\t\tvars[\"--theme-text-muted\"] = colorToVar(colors.textMuted);\n\t\tif (colors.textInverted)\n\t\t\tvars[\"--theme-text-inverted\"] = colorToVar(colors.textInverted);\n\t\tif (colors.textLink)\n\t\t\tvars[\"--theme-text-link\"] = colorToVar(colors.textLink);\n\t\tif (colors.textLinkHover)\n\t\t\tvars[\"--theme-text-link-hover\"] = colorToVar(colors.textLinkHover);\n\t\tif (colors.accentBrand)\n\t\t\tvars[\"--theme-accent-brand\"] = colorToVar(colors.accentBrand);\n\t\tif (colors.accentBrandSoft)\n\t\t\tvars[\"--theme-accent-brand-soft\"] = colorToVar(colors.accentBrandSoft);\n\t\tif (colors.borderSubtle)\n\t\t\tvars[\"--theme-border-subtle\"] = colorToVar(colors.borderSubtle);\n\t\tif (colors.borderStrong)\n\t\t\tvars[\"--theme-border-strong\"] = colorToVar(colors.borderStrong);\n\t\tif (colors.borderFocus)\n\t\t\tvars[\"--theme-border-focus\"] = colorToVar(colors.borderFocus);\n\t\tif (colors.borderDivider)\n\t\t\tvars[\"--theme-border-divider\"] = colorToVar(colors.borderDivider);\n\t\tif (colors.buttonPrimaryBg)\n\t\t\tvars[\"--theme-button-primary-bg\"] = colorToVar(colors.buttonPrimaryBg);\n\t\tif (colors.buttonPrimaryBgHover)\n\t\t\tvars[\"--theme-button-primary-bg-hover\"] = colorToVar(\n\t\t\t\tcolors.buttonPrimaryBgHover,\n\t\t\t);\n\t\tif (colors.buttonSecondaryBg)\n\t\t\tvars[\"--theme-button-secondary-bg\"] = colorToVar(\n\t\t\t\tcolors.buttonSecondaryBg,\n\t\t\t);\n\t\tif (colors.buttonSecondaryBgHover)\n\t\t\tvars[\"--theme-button-secondary-bg-hover\"] = colorToVar(\n\t\t\t\tcolors.buttonSecondaryBgHover,\n\t\t\t);\n\t}\n\n\t// Spatial\n\tif (theme.spatial) {\n\t\tconst { spatial } = theme;\n\t\tif (spatial.gridLargeMargin)\n\t\t\tvars[\"--theme-grid-large-margin\"] = spacingToVar(spatial.gridLargeMargin);\n\t\tif (spatial.gridLargeGutter)\n\t\t\tvars[\"--theme-grid-large-gutter\"] = spacingToVar(spatial.gridLargeGutter);\n\t\tif (spatial.gridLargeColumns)\n\t\t\tvars[\"--theme-grid-large-columns\"] = String(spatial.gridLargeColumns);\n\t\tif (spatial.gridMediumMargin)\n\t\t\tvars[\"--theme-grid-medium-margin\"] = spacingToVar(\n\t\t\t\tspatial.gridMediumMargin,\n\t\t\t);\n\t\tif (spatial.gridMediumGutter)\n\t\t\tvars[\"--theme-grid-medium-gutter\"] = spacingToVar(\n\t\t\t\tspatial.gridMediumGutter,\n\t\t\t);\n\t\tif (spatial.gridMediumColumns)\n\t\t\tvars[\"--theme-grid-medium-columns\"] = String(spatial.gridMediumColumns);\n\t\tif (spatial.gridSmallMargin)\n\t\t\tvars[\"--theme-grid-small-margin\"] = spacingToVar(spatial.gridSmallMargin);\n\t\tif (spatial.gridSmallGutter)\n\t\t\tvars[\"--theme-grid-small-gutter\"] = spacingToVar(spatial.gridSmallGutter);\n\t\tif (spatial.gridSmallColumns)\n\t\t\tvars[\"--theme-grid-small-columns\"] = String(spatial.gridSmallColumns);\n\t\tif (spatial.sectionLargeGap)\n\t\t\tvars[\"--theme-section-large-gap\"] = spacingToVar(spatial.sectionLargeGap);\n\t\tif (spatial.sectionLargePadding)\n\t\t\tvars[\"--theme-section-large-padding\"] = spacingToVar(\n\t\t\t\tspatial.sectionLargePadding,\n\t\t\t);\n\t\tif (spatial.sectionMediumGap)\n\t\t\tvars[\"--theme-section-medium-gap\"] = spacingToVar(\n\t\t\t\tspatial.sectionMediumGap,\n\t\t\t);\n\t\tif (spatial.sectionMediumPadding)\n\t\t\tvars[\"--theme-section-medium-padding\"] = spacingToVar(\n\t\t\t\tspatial.sectionMediumPadding,\n\t\t\t);\n\t\tif (spatial.sectionSmallGap)\n\t\t\tvars[\"--theme-section-small-gap\"] = spacingToVar(spatial.sectionSmallGap);\n\t\tif (spatial.sectionSmallPadding)\n\t\t\tvars[\"--theme-section-small-padding\"] = spacingToVar(\n\t\t\t\tspatial.sectionSmallPadding,\n\t\t\t);\n\t\tif (spatial.cardLargeGap)\n\t\t\tvars[\"--theme-card-large-gap\"] = spacingToVar(spatial.cardLargeGap);\n\t\tif (spatial.cardLargePadding)\n\t\t\tvars[\"--theme-card-large-padding\"] = spacingToVar(\n\t\t\t\tspatial.cardLargePadding,\n\t\t\t);\n\t\tif (spatial.cardSmallGap)\n\t\t\tvars[\"--theme-card-small-gap\"] = spacingToVar(spatial.cardSmallGap);\n\t\tif (spatial.cardSmallPadding)\n\t\t\tvars[\"--theme-card-small-padding\"] = spacingToVar(\n\t\t\t\tspatial.cardSmallPadding,\n\t\t\t);\n\t}\n\n\t// Surface\n\tif (theme.surface) {\n\t\tconst { surface } = theme;\n\t\tif (surface.cardRadius)\n\t\t\tvars[\"--theme-card-radius\"] = radiusToVar(surface.cardRadius);\n\t\tif (surface.cardStroke)\n\t\t\tvars[\"--theme-card-stroke\"] = `${surface.cardStroke}px`;\n\t\tif (surface.buttonRadius)\n\t\t\tvars[\"--theme-button-radius\"] = radiusToVar(surface.buttonRadius);\n\t\tif (surface.buttonStrokeWeight)\n\t\t\tvars[\"--theme-button-stroke-weight\"] = `${surface.buttonStrokeWeight}px`;\n\t}\n\n\treturn vars as React.CSSProperties;\n}\n\n/**\n * Converts a ButtonTheme object to CSS custom properties (inline style object)\n *\n * @param theme - The button theme object to convert\n * @returns An object suitable for use as React inline styles\n */\nexport function buttonThemeToStyleVars(\n\ttheme: ButtonTheme | undefined,\n): React.CSSProperties {\n\tif (!theme) return {};\n\n\tconst vars: Record<string, string> = {};\n\n\tif (theme.bg) vars[\"--btn-bg\"] = colorToVar(theme.bg);\n\tif (theme.bgHover) vars[\"--btn-bg-hover\"] = colorToVar(theme.bgHover);\n\tif (theme.bgActive) vars[\"--btn-bg-active\"] = colorToVar(theme.bgActive);\n\tif (theme.text) vars[\"--btn-text\"] = colorToVar(theme.text);\n\tif (theme.borderColor)\n\t\tvars[\"--btn-border-color\"] = colorToVar(theme.borderColor);\n\tif (theme.borderWidth !== undefined)\n\t\tvars[\"--btn-border-width\"] = `${theme.borderWidth}px`;\n\tif (theme.radius) vars[\"--btn-radius\"] = radiusToVar(theme.radius);\n\n\treturn vars as React.CSSProperties;\n}\n"],"names":["FONT_SIZES","fontSizeToClass","size","responsiveTypographyClass","mobile","tablet","desktop","colorToVar","token","spacingToVar","radiusToVar","themeToStyleVars","theme","vars","colors","spatial","surface","buttonThemeToStyleVars"],"mappings":"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"}

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/header/AccordionHeader.js

@@ -0,0 +1,24 @@
+import * as n from "react";
+import { useRenderElement as c } from "../../utils/useRenderElement.js";
+import { useAccordionItemContext as i } from "../item/AccordionItemContext.js";
+import { accordionStateAttributesMapping as s } from "../item/stateAttributesMapping.js";
+const a = /* @__PURE__ */ n.forwardRef(function(e, t) {
+  const {
+    render: d,
+    className: p,
+    ...r
+  } = e, {
+    state: o
+  } = i();
+  return c("h3", e, {
+    state: o,
+    ref: t,
+    props: r,
+    stateAttributesMapping: s
+  });
+});
+process.env.NODE_ENV !== "production" && (a.displayName = "AccordionHeader");
+export {
+  a as AccordionHeader
+};
+//# sourceMappingURL=AccordionHeader.js.map

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/header/AccordionHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHeader.js","sources":["../../../../../../../../../../../../node_modules/.bun/@base-ui-components+react@1.0.0-rc.0+6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/header/AccordionHeader.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useRenderElement } from \"../../utils/useRenderElement.js\";\nimport { useAccordionItemContext } from \"../item/AccordionItemContext.js\";\nimport { accordionStateAttributesMapping } from \"../item/stateAttributesMapping.js\";\n\n/**\n * A heading that labels the corresponding panel.\n * Renders an `<h3>` element.\n *\n * Documentation: [Base UI Accordion](https://base-ui.com/react/components/accordion)\n */\nexport const AccordionHeader = /*#__PURE__*/React.forwardRef(function AccordionHeader(componentProps, forwardedRef) {\n  const {\n    render,\n    className,\n    ...elementProps\n  } = componentProps;\n  const {\n    state\n  } = useAccordionItemContext();\n  const element = useRenderElement('h3', componentProps, {\n    state,\n    ref: forwardedRef,\n    props: elementProps,\n    stateAttributesMapping: accordionStateAttributesMapping\n  });\n  return element;\n});\nif (process.env.NODE_ENV !== \"production\") AccordionHeader.displayName = \"AccordionHeader\";"],"names":["AccordionHeader","React","componentProps","forwardedRef","render","className","elementProps","state","useAccordionItemContext","useRenderElement","accordionStateAttributesMapping"],"mappings":";;;;AAaY,MAACA,IAA+B,gBAAAC,EAAM,WAAW,SAAyBC,GAAgBC,GAAc;AAClH,QAAM;AAAA,IACJ,QAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EACP,IAAMJ,GACE;AAAA,IACJ,OAAAK;AAAA,EACJ,IAAMC,EAAuB;AAO3B,SANgBC,EAAiB,MAAMP,GAAgB;AAAA,IACrD,OAAAK;AAAA,IACA,KAAKJ;AAAA,IACL,OAAOG;AAAA,IACP,wBAAwBI;AAAA,EAC5B,CAAG;AAEH,CAAC;AACG,QAAQ,IAAI,aAAa,iBAAcV,EAAgB,cAAc;","x_google_ignoreList":[0]}

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItem.js

@@ -0,0 +1,79 @@
+import * as o from "react";
+import { useStableCallback as k } from "../../../../../../../@base-ui-components_utils@0.2.2_6526322f93af6249/node_modules/@base-ui-components/utils/esm/useStableCallback.js";
+import { useMergedRefs as j } from "../../../../../../../@base-ui-components_utils@0.2.2_6526322f93af6249/node_modules/@base-ui-components/utils/esm/useMergedRefs.js";
+import { useBaseUiId as C } from "../../utils/useBaseUiId.js";
+import { useCollapsibleRoot as w } from "../../collapsible/root/useCollapsibleRoot.js";
+import { CollapsibleRootContext as y } from "../../collapsible/root/CollapsibleRootContext.js";
+import { useCompositeListItem as B } from "../../composite/list/useCompositeListItem.js";
+import { useAccordionRootContext as D } from "../root/AccordionRootContext.js";
+import { AccordionItemContext as L } from "./AccordionItemContext.js";
+import { accordionStateAttributesMapping as T } from "./stateAttributesMapping.js";
+import { useRenderElement as U } from "../../utils/useRenderElement.js";
+import { jsx as g } from "react/jsx-runtime";
+const _ = /* @__PURE__ */ o.forwardRef(function(c, I) {
+  const {
+    className: z,
+    disabled: h = !1,
+    onOpenChange: v,
+    render: F,
+    value: R,
+    ...x
+  } = c, {
+    ref: M,
+    index: d
+  } = B(), S = j(I, M), {
+    disabled: A,
+    handleValueChange: P,
+    state: m,
+    value: n
+  } = D(), N = C(), s = R ?? N, i = h || A, r = o.useMemo(() => {
+    if (!n)
+      return !1;
+    for (let t = 0; t < n.length; t += 1)
+      if (n[t] === s)
+        return !0;
+    return !1;
+  }, [n, s]), a = k((t, b) => {
+    v?.(t, b), !b.isCanceled && P(s, t);
+  }), e = w({
+    open: r,
+    onOpenChange: a,
+    disabled: i
+  }), p = o.useMemo(() => ({
+    open: e.open,
+    disabled: e.disabled,
+    hidden: !e.mounted,
+    transitionStatus: e.transitionStatus
+  }), [e.open, e.disabled, e.mounted, e.transitionStatus]), O = o.useMemo(() => ({
+    ...e,
+    onOpenChange: a,
+    state: p
+  }), [e, p, a]), l = o.useMemo(() => ({
+    ...m,
+    index: d,
+    disabled: i,
+    open: r
+  }), [i, d, r, m]), [u, f] = o.useState(C()), V = o.useMemo(() => ({
+    open: r,
+    state: l,
+    setTriggerId: f,
+    triggerId: u
+  }), [r, l, f, u]), E = U("div", c, {
+    state: l,
+    ref: S,
+    props: x,
+    stateAttributesMapping: T
+  });
+  return /* @__PURE__ */ g(y.Provider, {
+    value: O,
+    children: /* @__PURE__ */ g(L.Provider, {
+      value: V,
+      children: E
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (_.displayName = "AccordionItem");
+export {
+  _ as AccordionItem
+};
+//# sourceMappingURL=AccordionItem.js.map

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.js","sources":["../../../../../../../../../../../../node_modules/.bun/@base-ui-components+react@1.0.0-rc.0+6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItem.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useStableCallback } from '@base-ui-components/utils/useStableCallback';\nimport { useMergedRefs } from '@base-ui-components/utils/useMergedRefs';\nimport { useBaseUiId } from \"../../utils/useBaseUiId.js\";\nimport { useCollapsibleRoot } from \"../../collapsible/root/useCollapsibleRoot.js\";\nimport { CollapsibleRootContext } from \"../../collapsible/root/CollapsibleRootContext.js\";\nimport { useCompositeListItem } from \"../../composite/list/useCompositeListItem.js\";\nimport { useAccordionRootContext } from \"../root/AccordionRootContext.js\";\nimport { AccordionItemContext } from \"./AccordionItemContext.js\";\nimport { accordionStateAttributesMapping } from \"./stateAttributesMapping.js\";\nimport { useRenderElement } from \"../../utils/useRenderElement.js\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * Groups an accordion header with the corresponding panel.\n * Renders a `<div>` element.\n *\n * Documentation: [Base UI Accordion](https://base-ui.com/react/components/accordion)\n */\nexport const AccordionItem = /*#__PURE__*/React.forwardRef(function AccordionItem(componentProps, forwardedRef) {\n  const {\n    className,\n    disabled: disabledProp = false,\n    onOpenChange: onOpenChangeProp,\n    render,\n    value: valueProp,\n    ...elementProps\n  } = componentProps;\n  const {\n    ref: listItemRef,\n    index\n  } = useCompositeListItem();\n  const mergedRef = useMergedRefs(forwardedRef, listItemRef);\n  const {\n    disabled: contextDisabled,\n    handleValueChange,\n    state: rootState,\n    value: openValues\n  } = useAccordionRootContext();\n  const fallbackValue = useBaseUiId();\n  const value = valueProp ?? fallbackValue;\n  const disabled = disabledProp || contextDisabled;\n  const isOpen = React.useMemo(() => {\n    if (!openValues) {\n      return false;\n    }\n    for (let i = 0; i < openValues.length; i += 1) {\n      if (openValues[i] === value) {\n        return true;\n      }\n    }\n    return false;\n  }, [openValues, value]);\n  const onOpenChange = useStableCallback((nextOpen, eventDetails) => {\n    onOpenChangeProp?.(nextOpen, eventDetails);\n    if (eventDetails.isCanceled) {\n      return;\n    }\n    handleValueChange(value, nextOpen);\n  });\n  const collapsible = useCollapsibleRoot({\n    open: isOpen,\n    onOpenChange,\n    disabled\n  });\n  const collapsibleState = React.useMemo(() => ({\n    open: collapsible.open,\n    disabled: collapsible.disabled,\n    hidden: !collapsible.mounted,\n    transitionStatus: collapsible.transitionStatus\n  }), [collapsible.open, collapsible.disabled, collapsible.mounted, collapsible.transitionStatus]);\n  const collapsibleContext = React.useMemo(() => ({\n    ...collapsible,\n    onOpenChange,\n    state: collapsibleState\n  }), [collapsible, collapsibleState, onOpenChange]);\n  const state = React.useMemo(() => ({\n    ...rootState,\n    index,\n    disabled,\n    open: isOpen\n  }), [disabled, index, isOpen, rootState]);\n  const [triggerId, setTriggerId] = React.useState(useBaseUiId());\n  const accordionItemContext = React.useMemo(() => ({\n    open: isOpen,\n    state,\n    setTriggerId,\n    triggerId\n  }), [isOpen, state, setTriggerId, triggerId]);\n  const element = useRenderElement('div', componentProps, {\n    state,\n    ref: mergedRef,\n    props: elementProps,\n    stateAttributesMapping: accordionStateAttributesMapping\n  });\n  return /*#__PURE__*/_jsx(CollapsibleRootContext.Provider, {\n    value: collapsibleContext,\n    children: /*#__PURE__*/_jsx(AccordionItemContext.Provider, {\n      value: accordionItemContext,\n      children: element\n    })\n  });\n});\nif (process.env.NODE_ENV !== \"production\") AccordionItem.displayName = \"AccordionItem\";"],"names":["AccordionItem","React","componentProps","forwardedRef","className","disabledProp","onOpenChangeProp","render","valueProp","elementProps","listItemRef","index","useCompositeListItem","mergedRef","useMergedRefs","contextDisabled","handleValueChange","rootState","openValues","useAccordionRootContext","fallbackValue","useBaseUiId","value","disabled","isOpen","i","onOpenChange","useStableCallback","nextOpen","eventDetails","collapsible","useCollapsibleRoot","collapsibleState","collapsibleContext","state","triggerId","setTriggerId","accordionItemContext","element","useRenderElement","accordionStateAttributesMapping","_jsx","CollapsibleRootContext","AccordionItemContext"],"mappings":";;;;;;;;;;;;AAoBY,MAACA,IAA6B,gBAAAC,EAAM,WAAW,SAAuBC,GAAgBC,GAAc;AAC9G,QAAM;AAAA,IACJ,WAAAC;AAAA,IACA,UAAUC,IAAe;AAAA,IACzB,cAAcC;AAAA,IACd,QAAAC;AAAA,IACA,OAAOC;AAAA,IACP,GAAGC;AAAA,EACP,IAAMP,GACE;AAAA,IACJ,KAAKQ;AAAA,IACL,OAAAC;AAAA,EACJ,IAAMC,EAAoB,GAClBC,IAAYC,EAAcX,GAAcO,CAAW,GACnD;AAAA,IACJ,UAAUK;AAAA,IACV,mBAAAC;AAAA,IACA,OAAOC;AAAA,IACP,OAAOC;AAAA,EACX,IAAMC,EAAuB,GACrBC,IAAgBC,EAAW,GAC3BC,IAAQd,KAAaY,GACrBG,IAAWlB,KAAgBU,GAC3BS,IAASvB,EAAM,QAAQ,MAAM;AACjC,QAAI,CAACiB;AACH,aAAO;AAET,aAASO,IAAI,GAAGA,IAAIP,EAAW,QAAQO,KAAK;AAC1C,UAAIP,EAAWO,CAAC,MAAMH;AACpB,eAAO;AAGX,WAAO;AAAA,EACT,GAAG,CAACJ,GAAYI,CAAK,CAAC,GAChBI,IAAeC,EAAkB,CAACC,GAAUC,MAAiB;AAEjE,IADAvB,IAAmBsB,GAAUC,CAAY,GACrC,CAAAA,EAAa,cAGjBb,EAAkBM,GAAOM,CAAQ;AAAA,EACnC,CAAC,GACKE,IAAcC,EAAmB;AAAA,IACrC,MAAMP;AAAA,IACN,cAAAE;AAAA,IACA,UAAAH;AAAA,EACJ,CAAG,GACKS,IAAmB/B,EAAM,QAAQ,OAAO;AAAA,IAC5C,MAAM6B,EAAY;AAAA,IAClB,UAAUA,EAAY;AAAA,IACtB,QAAQ,CAACA,EAAY;AAAA,IACrB,kBAAkBA,EAAY;AAAA,EAClC,IAAM,CAACA,EAAY,MAAMA,EAAY,UAAUA,EAAY,SAASA,EAAY,gBAAgB,CAAC,GACzFG,IAAqBhC,EAAM,QAAQ,OAAO;AAAA,IAC9C,GAAG6B;AAAA,IACH,cAAAJ;AAAA,IACA,OAAOM;AAAA,EACX,IAAM,CAACF,GAAaE,GAAkBN,CAAY,CAAC,GAC3CQ,IAAQjC,EAAM,QAAQ,OAAO;AAAA,IACjC,GAAGgB;AAAA,IACH,OAAAN;AAAA,IACA,UAAAY;AAAA,IACA,MAAMC;AAAA,EACV,IAAM,CAACD,GAAUZ,GAAOa,GAAQP,CAAS,CAAC,GAClC,CAACkB,GAAWC,CAAY,IAAInC,EAAM,SAASoB,GAAa,GACxDgB,IAAuBpC,EAAM,QAAQ,OAAO;AAAA,IAChD,MAAMuB;AAAA,IACN,OAAAU;AAAA,IACA,cAAAE;AAAA,IACA,WAAAD;AAAA,EACJ,IAAM,CAACX,GAAQU,GAAOE,GAAcD,CAAS,CAAC,GACtCG,IAAUC,EAAiB,OAAOrC,GAAgB;AAAA,IACtD,OAAAgC;AAAA,IACA,KAAKrB;AAAA,IACL,OAAOJ;AAAA,IACP,wBAAwB+B;AAAA,EAC5B,CAAG;AACD,SAAoBC,gBAAAA,EAAKC,EAAuB,UAAU;AAAA,IACxD,OAAOT;AAAA,IACP,UAAuBQ,gBAAAA,EAAKE,EAAqB,UAAU;AAAA,MACzD,OAAON;AAAA,MACP,UAAUC;AAAA,IAChB,CAAK;AAAA,EACL,CAAG;AACH,CAAC;AACG,QAAQ,IAAI,aAAa,iBAActC,EAAc,cAAc;","x_google_ignoreList":[0]}

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItemContext.js

@@ -0,0 +1,15 @@
+import n from "../../../../../../../@base-ui-components_utils@0.2.2_6526322f93af6249/node_modules/@base-ui-components/utils/esm/formatErrorMessage.js";
+import * as t from "react";
+const e = /* @__PURE__ */ t.createContext(void 0);
+process.env.NODE_ENV !== "production" && (e.displayName = "AccordionItemContext");
+function c() {
+  const o = t.useContext(e);
+  if (o === void 0)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: AccordionItemContext is missing. Accordion parts must be placed within <Accordion.Item>." : n(9));
+  return o;
+}
+export {
+  e as AccordionItemContext,
+  c as useAccordionItemContext
+};
+//# sourceMappingURL=AccordionItemContext.js.map

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItemContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItemContext.js","sources":["../../../../../../../../../../../../node_modules/.bun/@base-ui-components+react@1.0.0-rc.0+6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItemContext.js"],"sourcesContent":["'use client';\n\nimport _formatErrorMessage from \"@base-ui-components/utils/formatErrorMessage\";\nimport * as React from 'react';\nexport const AccordionItemContext = /*#__PURE__*/React.createContext(undefined);\nif (process.env.NODE_ENV !== \"production\") AccordionItemContext.displayName = \"AccordionItemContext\";\nexport function useAccordionItemContext() {\n  const context = React.useContext(AccordionItemContext);\n  if (context === undefined) {\n    throw new Error(process.env.NODE_ENV !== \"production\" ? 'Base UI: AccordionItemContext is missing. Accordion parts must be placed within <Accordion.Item>.' : _formatErrorMessage(9));\n  }\n  return context;\n}"],"names":["AccordionItemContext","React","useAccordionItemContext","context","_formatErrorMessage"],"mappings":";;AAIY,MAACA,IAAoC,gBAAAC,EAAM,cAAc,MAAS;AAC1E,QAAQ,IAAI,aAAa,iBAAcD,EAAqB,cAAc;AACvE,SAASE,IAA0B;AACxC,QAAMC,IAAUF,EAAM,WAAWD,CAAoB;AACrD,MAAIG,MAAY;AACd,UAAM,IAAI,MAAM,QAAQ,IAAI,aAAa,eAAe,sGAAsGC,EAAoB,CAAC,CAAC;AAEtL,SAAOD;AACT;","x_google_ignoreList":[0]}

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItemDataAttributes.js

@@ -0,0 +1,7 @@
+let e = /* @__PURE__ */ (function(d) {
+  return d.index = "data-index", d.disabled = "data-disabled", d.open = "data-open", d;
+})({});
+export {
+  e as AccordionItemDataAttributes
+};
+//# sourceMappingURL=AccordionItemDataAttributes.js.map

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItemDataAttributes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItemDataAttributes.js","sources":["../../../../../../../../../../../../node_modules/.bun/@base-ui-components+react@1.0.0-rc.0+6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/AccordionItemDataAttributes.js"],"sourcesContent":["export let AccordionItemDataAttributes = /*#__PURE__*/function (AccordionItemDataAttributes) {\n  /**\n   * Indicates the index of the accordion item.\n   * @type {number}\n   */\n  AccordionItemDataAttributes[\"index\"] = \"data-index\";\n  /**\n   * Present when the accordion item is disabled.\n   */\n  AccordionItemDataAttributes[\"disabled\"] = \"data-disabled\";\n  /**\n   * Present when the accordion item is open.\n   */\n  AccordionItemDataAttributes[\"open\"] = \"data-open\";\n  return AccordionItemDataAttributes;\n}({});"],"names":["AccordionItemDataAttributes"],"mappings":"AAAU,IAACA,IAA2C,0BAAUA,GAA6B;AAK3F,SAAAA,EAA4B,QAAW,cAIvCA,EAA4B,WAAc,iBAI1CA,EAA4B,OAAU,aAC/BA;AACT,GAAE,CAAA,CAAE;","x_google_ignoreList":[0]}

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/stateAttributesMapping.js

@@ -0,0 +1,15 @@
+import { collapsibleOpenStateMapping as i } from "../../utils/collapsibleOpenStateMapping.js";
+import { transitionStatusMapping as r } from "../../utils/stateAttributesMapping.js";
+import { AccordionItemDataAttributes as n } from "./AccordionItemDataAttributes.js";
+const a = {
+  ...i,
+  index: (t) => Number.isInteger(t) ? {
+    [n.index]: String(t)
+  } : null,
+  ...r,
+  value: () => null
+};
+export {
+  a as accordionStateAttributesMapping
+};
+//# sourceMappingURL=stateAttributesMapping.js.map

package/dist/node_modules/.bun/@base-ui-components_react@1.0.0-rc.0_6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/stateAttributesMapping.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stateAttributesMapping.js","sources":["../../../../../../../../../../../../node_modules/.bun/@base-ui-components+react@1.0.0-rc.0+6526322f93af6249/node_modules/@base-ui-components/react/esm/accordion/item/stateAttributesMapping.js"],"sourcesContent":["import { collapsibleOpenStateMapping as baseMapping } from \"../../utils/collapsibleOpenStateMapping.js\";\nimport { transitionStatusMapping } from \"../../utils/stateAttributesMapping.js\";\nimport { AccordionItemDataAttributes } from \"./AccordionItemDataAttributes.js\";\nexport const accordionStateAttributesMapping = {\n  ...baseMapping,\n  index: value => {\n    return Number.isInteger(value) ? {\n      [AccordionItemDataAttributes.index]: String(value)\n    } : null;\n  },\n  ...transitionStatusMapping,\n  value: () => null\n};"],"names":["accordionStateAttributesMapping","baseMapping","value","AccordionItemDataAttributes","transitionStatusMapping"],"mappings":";;;AAGY,MAACA,IAAkC;AAAA,EAC7C,GAAGC;AAAAA,EACH,OAAO,CAAAC,MACE,OAAO,UAAUA,CAAK,IAAI;AAAA,IAC/B,CAACC,EAA4B,KAAK,GAAG,OAAOD,CAAK;AAAA,EACvD,IAAQ;AAAA,EAEN,GAAGE;AAAA,EACH,OAAO,MAAM;AACf;","x_google_ignoreList":[0]}