@m3-baseui/react-tailwind 1.4.0 → 3.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m3-baseui/react-tailwind",
-  "version": "1.4.0",
+  "version": "3.0.0",
   "description": "M3 components implemented with tailwind-variants over the shared @m3-baseui/core factories. Ships the Tailwind v4 @theme preset.",
   "type": "module",
   "license": "MIT",
@@ -22,195 +22,195 @@
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
     },
-    "./button": {
-      "@m3/source": "./src/button.ts",
-      "types": "./dist/button.d.ts",
-      "default": "./dist/button.js"
-    },
-    "./icon-button": {
-      "@m3/source": "./src/icon-button.ts",
-      "types": "./dist/icon-button.d.ts",
-      "default": "./dist/icon-button.js"
-    },
-    "./switch": {
-      "@m3/source": "./src/switch.ts",
-      "types": "./dist/switch.d.ts",
-      "default": "./dist/switch.js"
+    "./badge": {
+      "@m3/source": "./src/components/badge/index.ts",
+      "types": "./dist/components/badge/index.d.ts",
+      "default": "./dist/components/badge/index.js"
     },
-    "./checkbox": {
-      "@m3/source": "./src/checkbox.ts",
-      "types": "./dist/checkbox.d.ts",
-      "default": "./dist/checkbox.js"
+    "./bottom-app-bar": {
+      "@m3/source": "./src/components/bottom-app-bar/index.ts",
+      "types": "./dist/components/bottom-app-bar/index.d.ts",
+      "default": "./dist/components/bottom-app-bar/index.js"
     },
-    "./radio": {
-      "@m3/source": "./src/radio.ts",
-      "types": "./dist/radio.d.ts",
-      "default": "./dist/radio.js"
+    "./bottom-sheet": {
+      "@m3/source": "./src/components/bottom-sheet/index.ts",
+      "types": "./dist/components/bottom-sheet/index.d.ts",
+      "default": "./dist/components/bottom-sheet/index.js"
     },
-    "./chip": {
-      "@m3/source": "./src/chip.ts",
-      "types": "./dist/chip.d.ts",
-      "default": "./dist/chip.js"
+    "./button": {
+      "@m3/source": "./src/components/button/index.ts",
+      "types": "./dist/components/button/index.d.ts",
+      "default": "./dist/components/button/index.js"
     },
-    "./tooltip": {
-      "@m3/source": "./src/tooltip.ts",
-      "types": "./dist/tooltip.d.ts",
-      "default": "./dist/tooltip.js"
+    "./button-group": {
+      "@m3/source": "./src/components/button-group/index.ts",
+      "types": "./dist/components/button-group/index.d.ts",
+      "default": "./dist/components/button-group/index.js"
     },
-    "./dialog": {
-      "@m3/source": "./src/dialog.ts",
-      "types": "./dist/dialog.d.ts",
-      "default": "./dist/dialog.js"
+    "./card": {
+      "@m3/source": "./src/components/card/index.ts",
+      "types": "./dist/components/card/index.d.ts",
+      "default": "./dist/components/card/index.js"
     },
-    "./menu": {
-      "@m3/source": "./src/menu.ts",
-      "types": "./dist/menu.d.ts",
-      "default": "./dist/menu.js"
+    "./carousel": {
+      "@m3/source": "./src/components/carousel/index.ts",
+      "types": "./dist/components/carousel/index.d.ts",
+      "default": "./dist/components/carousel/index.js"
     },
-    "./tabs": {
-      "@m3/source": "./src/tabs.ts",
-      "types": "./dist/tabs.d.ts",
-      "default": "./dist/tabs.js"
+    "./checkbox": {
+      "@m3/source": "./src/components/checkbox/index.ts",
+      "types": "./dist/components/checkbox/index.d.ts",
+      "default": "./dist/components/checkbox/index.js"
     },
-    "./slider": {
-      "@m3/source": "./src/slider.ts",
-      "types": "./dist/slider.d.ts",
-      "default": "./dist/slider.js"
+    "./chip": {
+      "@m3/source": "./src/components/chip/index.ts",
+      "types": "./dist/components/chip/index.d.ts",
+      "default": "./dist/components/chip/index.js"
     },
-    "./select": {
-      "@m3/source": "./src/select.ts",
-      "types": "./dist/select.d.ts",
-      "default": "./dist/select.js"
+    "./date-picker": {
+      "@m3/source": "./src/components/date-picker/index.ts",
+      "types": "./dist/components/date-picker/index.d.ts",
+      "default": "./dist/components/date-picker/index.js"
     },
-    "./textfield": {
-      "@m3/source": "./src/textfield.ts",
-      "types": "./dist/textfield.d.ts",
-      "default": "./dist/textfield.js"
+    "./dialog": {
+      "@m3/source": "./src/components/dialog/index.ts",
+      "types": "./dist/components/dialog/index.d.ts",
+      "default": "./dist/components/dialog/index.js"
     },
-    "./navigation-bar": {
-      "@m3/source": "./src/navigation-bar.ts",
-      "types": "./dist/navigation-bar.d.ts",
-      "default": "./dist/navigation-bar.js"
+    "./divider": {
+      "@m3/source": "./src/components/divider/index.ts",
+      "types": "./dist/components/divider/index.d.ts",
+      "default": "./dist/components/divider/index.js"
     },
     "./fab": {
-      "@m3/source": "./src/fab.ts",
-      "types": "./dist/fab.d.ts",
-      "default": "./dist/fab.js"
+      "@m3/source": "./src/components/fab/index.ts",
+      "types": "./dist/components/fab/index.d.ts",
+      "default": "./dist/components/fab/index.js"
     },
     "./fab-menu": {
-      "@m3/source": "./src/fab-menu.ts",
-      "types": "./dist/fab-menu.d.ts",
-      "default": "./dist/fab-menu.js"
+      "@m3/source": "./src/components/fab-menu/index.ts",
+      "types": "./dist/components/fab-menu/index.d.ts",
+      "default": "./dist/components/fab-menu/index.js"
     },
-    "./divider": {
-      "@m3/source": "./src/divider.ts",
-      "types": "./dist/divider.d.ts",
-      "default": "./dist/divider.js"
+    "./icon-button": {
+      "@m3/source": "./src/components/icon-button/index.ts",
+      "types": "./dist/components/icon-button/index.d.ts",
+      "default": "./dist/components/icon-button/index.js"
     },
-    "./progress": {
-      "@m3/source": "./src/progress.ts",
-      "types": "./dist/progress.d.ts",
-      "default": "./dist/progress.js"
+    "./item": {
+      "@m3/source": "./src/components/item/index.ts",
+      "types": "./dist/components/item/index.d.ts",
+      "default": "./dist/components/item/index.js"
+    },
+    "./list": {
+      "@m3/source": "./src/components/list/index.ts",
+      "types": "./dist/components/list/index.d.ts",
+      "default": "./dist/components/list/index.js"
     },
     "./loading-indicator": {
-      "@m3/source": "./src/loading-indicator.ts",
-      "types": "./dist/loading-indicator.d.ts",
-      "default": "./dist/loading-indicator.js"
+      "@m3/source": "./src/components/loading-indicator/index.ts",
+      "types": "./dist/components/loading-indicator/index.d.ts",
+      "default": "./dist/components/loading-indicator/index.js"
     },
-    "./list": {
-      "@m3/source": "./src/list.ts",
-      "types": "./dist/list.d.ts",
-      "default": "./dist/list.js"
+    "./menu": {
+      "@m3/source": "./src/components/menu/index.ts",
+      "types": "./dist/components/menu/index.d.ts",
+      "default": "./dist/components/menu/index.js"
     },
-    "./snackbar": {
-      "@m3/source": "./src/snackbar.ts",
-      "types": "./dist/snackbar.d.ts",
-      "default": "./dist/snackbar.js"
+    "./navigation-bar": {
+      "@m3/source": "./src/components/navigation-bar/index.ts",
+      "types": "./dist/components/navigation-bar/index.d.ts",
+      "default": "./dist/components/navigation-bar/index.js"
     },
-    "./item": {
-      "@m3/source": "./src/item.ts",
-      "types": "./dist/item.d.ts",
-      "default": "./dist/item.js"
+    "./navigation-drawer": {
+      "@m3/source": "./src/components/navigation-drawer/index.ts",
+      "types": "./dist/components/navigation-drawer/index.d.ts",
+      "default": "./dist/components/navigation-drawer/index.js"
     },
-    "./badge": {
-      "@m3/source": "./src/badge.ts",
-      "types": "./dist/badge.d.ts",
-      "default": "./dist/badge.js"
+    "./navigation-rail": {
+      "@m3/source": "./src/components/navigation-rail/index.ts",
+      "types": "./dist/components/navigation-rail/index.d.ts",
+      "default": "./dist/components/navigation-rail/index.js"
     },
-    "./card": {
-      "@m3/source": "./src/card.ts",
-      "types": "./dist/card.d.ts",
-      "default": "./dist/card.js"
+    "./progress": {
+      "@m3/source": "./src/components/progress/index.ts",
+      "types": "./dist/components/progress/index.d.ts",
+      "default": "./dist/components/progress/index.js"
     },
-    "./segmented-button": {
-      "@m3/source": "./src/segmented-button.ts",
-      "types": "./dist/segmented-button.d.ts",
-      "default": "./dist/segmented-button.js"
+    "./radio": {
+      "@m3/source": "./src/components/radio/index.ts",
+      "types": "./dist/components/radio/index.d.ts",
+      "default": "./dist/components/radio/index.js"
     },
-    "./button-group": {
-      "@m3/source": "./src/button-group.ts",
-      "types": "./dist/button-group.d.ts",
-      "default": "./dist/button-group.js"
+    "./search": {
+      "@m3/source": "./src/components/search/index.ts",
+      "types": "./dist/components/search/index.d.ts",
+      "default": "./dist/components/search/index.js"
     },
-    "./split-button": {
-      "@m3/source": "./src/split-button.ts",
-      "types": "./dist/split-button.d.ts",
-      "default": "./dist/split-button.js"
+    "./segmented-button": {
+      "@m3/source": "./src/components/segmented-button/index.ts",
+      "types": "./dist/components/segmented-button/index.d.ts",
+      "default": "./dist/components/segmented-button/index.js"
     },
-    "./navigation-drawer": {
-      "@m3/source": "./src/navigation-drawer.ts",
-      "types": "./dist/navigation-drawer.d.ts",
-      "default": "./dist/navigation-drawer.js"
+    "./select": {
+      "@m3/source": "./src/components/select/index.ts",
+      "types": "./dist/components/select/index.d.ts",
+      "default": "./dist/components/select/index.js"
     },
-    "./top-app-bar": {
-      "@m3/source": "./src/top-app-bar.ts",
-      "types": "./dist/top-app-bar.d.ts",
-      "default": "./dist/top-app-bar.js"
+    "./side-sheet": {
+      "@m3/source": "./src/components/side-sheet/index.ts",
+      "types": "./dist/components/side-sheet/index.d.ts",
+      "default": "./dist/components/side-sheet/index.js"
     },
-    "./bottom-app-bar": {
-      "@m3/source": "./src/bottom-app-bar.ts",
-      "types": "./dist/bottom-app-bar.d.ts",
-      "default": "./dist/bottom-app-bar.js"
+    "./slider": {
+      "@m3/source": "./src/components/slider/index.ts",
+      "types": "./dist/components/slider/index.d.ts",
+      "default": "./dist/components/slider/index.js"
     },
-    "./navigation-rail": {
-      "@m3/source": "./src/navigation-rail.ts",
-      "types": "./dist/navigation-rail.d.ts",
-      "default": "./dist/navigation-rail.js"
+    "./snackbar": {
+      "@m3/source": "./src/components/snackbar/index.ts",
+      "types": "./dist/components/snackbar/index.d.ts",
+      "default": "./dist/components/snackbar/index.js"
     },
-    "./bottom-sheet": {
-      "@m3/source": "./src/bottom-sheet.ts",
-      "types": "./dist/bottom-sheet.d.ts",
-      "default": "./dist/bottom-sheet.js"
+    "./split-button": {
+      "@m3/source": "./src/components/split-button/index.ts",
+      "types": "./dist/components/split-button/index.d.ts",
+      "default": "./dist/components/split-button/index.js"
     },
-    "./side-sheet": {
-      "@m3/source": "./src/side-sheet.ts",
-      "types": "./dist/side-sheet.d.ts",
-      "default": "./dist/side-sheet.js"
+    "./switch": {
+      "@m3/source": "./src/components/switch/index.ts",
+      "types": "./dist/components/switch/index.d.ts",
+      "default": "./dist/components/switch/index.js"
     },
-    "./search": {
-      "@m3/source": "./src/search.ts",
-      "types": "./dist/search.d.ts",
-      "default": "./dist/search.js"
+    "./tabs": {
+      "@m3/source": "./src/components/tabs/index.ts",
+      "types": "./dist/components/tabs/index.d.ts",
+      "default": "./dist/components/tabs/index.js"
     },
-    "./date-picker": {
-      "@m3/source": "./src/date-picker.ts",
-      "types": "./dist/date-picker.d.ts",
-      "default": "./dist/date-picker.js"
+    "./textfield": {
+      "@m3/source": "./src/components/textfield/index.ts",
+      "types": "./dist/components/textfield/index.d.ts",
+      "default": "./dist/components/textfield/index.js"
     },
     "./time-picker": {
-      "@m3/source": "./src/time-picker.ts",
-      "types": "./dist/time-picker.d.ts",
-      "default": "./dist/time-picker.js"
+      "@m3/source": "./src/components/time-picker/index.ts",
+      "types": "./dist/components/time-picker/index.d.ts",
+      "default": "./dist/components/time-picker/index.js"
     },
     "./toolbar": {
-      "@m3/source": "./src/toolbar.ts",
-      "types": "./dist/toolbar.d.ts",
-      "default": "./dist/toolbar.js"
+      "@m3/source": "./src/components/toolbar/index.ts",
+      "types": "./dist/components/toolbar/index.d.ts",
+      "default": "./dist/components/toolbar/index.js"
     },
-    "./carousel": {
-      "@m3/source": "./src/carousel.ts",
-      "types": "./dist/carousel.d.ts",
-      "default": "./dist/carousel.js"
+    "./tooltip": {
+      "@m3/source": "./src/components/tooltip/index.ts",
+      "types": "./dist/components/tooltip/index.d.ts",
+      "default": "./dist/components/tooltip/index.js"
+    },
+    "./top-app-bar": {
+      "@m3/source": "./src/components/top-app-bar/index.ts",
+      "types": "./dist/components/top-app-bar/index.d.ts",
+      "default": "./dist/components/top-app-bar/index.js"
     },
     "./preset.css": "./styles/preset.css",
     "./tokens.css": "./styles/tokens.css",
@@ -221,7 +221,7 @@
     "styles"
   ],
   "scripts": {
-    "build": "tsup && bun run scripts/copy-token-css.ts",
+    "build": "NODE_OPTIONS=--max-old-space-size=8192 tsup && bun run scripts/copy-token-css.ts",
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {

package/styles/preset.css

@@ -13,23 +13,91 @@
 
 /*
  * Component keyframes that can't be expressed as utilities. The linear progress
- * indeterminate bar slides a 40%-wide indicator across the track; the circular
- * indeterminate spinner reuses Tailwind's built-in `animate-spin` (1s), which the
- * VE build matches.
+ * indeterminate track runs M3's disjoint two-bar motion (`m3-linear-primary` +
+ * `m3-linear-secondary`, each a scale + slide); the circular indeterminate
+ * spinner rotates the ring (`m3-circular-rotate`) while the active arc grows and
+ * shrinks (`m3-circular-dash`, the "advance" motion). The VE build matches every
+ * period below.
  */
 @theme {
-  --animate-m3-linear-indeterminate: m3-linear-indeterminate 2s ease-in-out infinite;
+  --animate-m3-linear-primary: m3-linear-primary 2s linear infinite;
+  --animate-m3-linear-secondary: m3-linear-secondary 2s linear infinite;
+  --animate-m3-wave-flow: m3-wave-flow 1s linear infinite;
+  --animate-m3-circular-rotate: m3-circular-rotate 1.4s linear infinite;
+  --animate-m3-circular-dash: m3-circular-dash 1.4s ease-in-out infinite;
   /* M3 Expressive loading indicator: the active shape rotates while it morphs
    * (approximated as a rotate + scale pulse). The VE build matches this period. */
   --animate-m3-loading: m3-loading 1.2s ease-in-out infinite;
 }
 
-@keyframes m3-linear-indeterminate {
+/* Disjoint linear indeterminate: two primary-colored bars scale + slide across
+ * the track out of phase (origin at the start edge; % is of the bar's own width). */
+@keyframes m3-linear-primary {
   0% {
-    transform: translateX(-100%);
+    transform: translateX(0) scaleX(0.08);
+  }
+  36% {
+    transform: translateX(0) scaleX(0.08);
+  }
+  55% {
+    transform: translateX(50%) scaleX(0.5);
+  }
+  69% {
+    transform: translateX(84%) scaleX(0.66);
+  }
+  100% {
+    transform: translateX(201%) scaleX(0.08);
+  }
+}
+
+@keyframes m3-linear-secondary {
+  0% {
+    transform: translateX(0) scaleX(0.08);
+  }
+  19% {
+    transform: translateX(0) scaleX(0.08);
+  }
+  25% {
+    transform: translateX(38%) scaleX(0.4);
+  }
+  44% {
+    transform: translateX(84%) scaleX(0.46);
+  }
+  100% {
+    transform: translateX(160%) scaleX(0.08);
+  }
+}
+
+/* Wavy linear: scroll the sine mask tile by one wavelength (40px) for a seamless
+ * flowing wave. */
+@keyframes m3-wave-flow {
+  to {
+    -webkit-mask-position-x: 40px;
+    mask-position-x: 40px;
+  }
+}
+
+/* Circular indeterminate: continuous rotation of the whole ring. */
+@keyframes m3-circular-rotate {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* Circular indeterminate: the arc length (dasharray) grows then shrinks while the
+ * dashoffset sweeps it around — normalized against `pathLength="100"`. */
+@keyframes m3-circular-dash {
+  0% {
+    stroke-dasharray: 1 100;
+    stroke-dashoffset: 0;
+  }
+  50% {
+    stroke-dasharray: 60 100;
+    stroke-dashoffset: -8;
   }
   100% {
-    transform: translateX(400%);
+    stroke-dasharray: 60 100;
+    stroke-dashoffset: -58;
   }
 }
 

package/styles/theme.css

@@ -64,7 +64,9 @@
   --radius-small: var(--md-sys-shape-small);
   --radius-medium: var(--md-sys-shape-medium);
   --radius-large: var(--md-sys-shape-large);
+  --radius-large-increased: var(--md-sys-shape-large-increased);
   --radius-extra-large: var(--md-sys-shape-extra-large);
+  --radius-extra-large-increased: var(--md-sys-shape-extra-large-increased);
   --radius-full: var(--md-sys-shape-full);
 
   /* ---- Elevation / shadow ---- */

package/styles/tokens.css

@@ -56,7 +56,9 @@
   --md-sys-shape-small: 8px;
   --md-sys-shape-medium: 12px;
   --md-sys-shape-large: 16px;
+  --md-sys-shape-large-increased: 20px;
   --md-sys-shape-extra-large: 28px;
+  --md-sys-shape-extra-large-increased: 32px;
   --md-sys-shape-full: 9999px;
   --md-sys-elevation-level0: none;
   --md-sys-elevation-level1: 0px 1px 2px 0px rgb(0 0 0 / 0.30), 0px 1px 3px 1px rgb(0 0 0 / 0.15);

package/dist/badge.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tv.ts","../src/badge.ts"],"names":["baseTv"],"mappings":";;;;;AAeA,IAAM,SAAA,GAAY;AAAA,EAChB,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA;AAEO,IAAM,EAAA,GAAS,CAAC,OAAA,EAAS,MAAA,KAC9BA,KAAO,OAAA,EAAS;AAAA,EACd,GAAG,MAAA;AAAA,EACH,aAAA,EAAe;AAAA,IACb,MAAA,EAAQ;AAAA,MACN,WAAA,EAAa;AAAA,QACX,WAAA,EAAa,CAAC,EAAE,IAAA,EAAM,CAAC,GAAG,SAAS,GAAG;AAAA;AACxC;AACF;AAEJ,CAAC,CAAA;;;ACjCI,IAAM,UAAU,EAAA,CAAG;AAAA,EACxB,IAAA,EAAM,gGAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO,8CAAA;AAAA,MACP,KAAA,EACE;AAAA;AACJ;AAEJ,CAAC;AAEM,IAAM,QAAQ,WAAA,CAAY;AAAA,EAC/B,IAAA,EAAM,CAAC,EAAE,IAAA,OAAW,OAAA,CAAQ,EAAE,MAAM;AACtC,CAAC","file":"badge.js","sourcesContent":["/**\n * tv.ts — a tailwind-variants factory pre-configured for the M3 typescale.\n *\n * The Tailwind v4 preset exposes the 15 typescale roles as `text-<role>`\n * font-size utilities (e.g. `text-body-small`, `text-label-large`). Stock\n * tailwind-merge does not know these custom names, so it groups them with the\n * `text-<color>` utilities and drops one when a slot sets both a color *and* a\n * typescale (the common M3 case). That silently strips either the color or the\n * type, breaking token compliance.\n *\n * Teaching tailwind-merge that the typescale names belong to the `font-size`\n * group keeps color and type independent, so both survive the merge.\n */\nimport { type TV, tv as baseTv } from 'tailwind-variants';\n\nconst TYPESCALE = [\n  'display-large',\n  'display-medium',\n  'display-small',\n  'headline-large',\n  'headline-medium',\n  'headline-small',\n  'title-large',\n  'title-medium',\n  'title-small',\n  'body-large',\n  'body-medium',\n  'body-small',\n  'label-large',\n  'label-medium',\n  'label-small',\n] as const;\n\nexport const tv: TV = (options, config) =>\n  baseTv(options, {\n    ...config,\n    twMergeConfig: {\n      extend: {\n        classGroups: {\n          'font-size': [{ text: [...TYPESCALE] }],\n        },\n      },\n    },\n  });\n","/**\n * badge.ts — tailwind-variants slots for the M3 Badge.\n *\n * error/on-error marker that anchors to the top-right of a positioned parent.\n * `small` is a 6dp dot; `large` is a 16dp pill carrying a `label-small` number.\n * Same DOM + `data-size` as the VE build.\n */\nimport { createBadge } from '@m3-baseui/core';\nimport { tv } from './tv';\n\nexport const badgeTv = tv({\n  base: 'pointer-events-none select-none inline-flex items-center justify-center bg-error text-on-error',\n  variants: {\n    size: {\n      small: 'absolute top-1 right-1 size-1.5 rounded-full',\n      large:\n        'absolute -top-1 -right-1 min-w-4 h-4 px-1 rounded-full text-label-small leading-none tabular-nums',\n    },\n  },\n});\n\nexport const Badge = createBadge({\n  root: ({ size }) => badgeTv({ size }),\n});\nexport type { BadgeProps, BadgeSize } from '@m3-baseui/core';\n"]}

package/dist/bottom-app-bar.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tv.ts","../src/bottom-app-bar.ts"],"names":["baseTv"],"mappings":";;;;;AAeA,IAAM,SAAA,GAAY;AAAA,EAChB,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA;AAEO,IAAM,EAAA,GAAS,CAAC,OAAA,EAAS,MAAA,KAC9BA,KAAO,OAAA,EAAS;AAAA,EACd,GAAG,MAAA;AAAA,EACH,aAAA,EAAe;AAAA,IACb,MAAA,EAAQ;AAAA,MACN,WAAA,EAAa;AAAA,QACX,WAAA,EAAa,CAAC,EAAE,IAAA,EAAM,CAAC,GAAG,SAAS,GAAG;AAAA;AACxC;AACF;AAEJ,CAAC,CAAA;;;AClCI,IAAM,iBAAiB,EAAA,CAAG;AAAA,EAC/B,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,4GAAA;AAAA,IACN,OAAA,EAAS,6CAAA;AAAA,IACT,GAAA,EAAK;AAAA;AAET,CAAC;AAED,IAAM,IAAI,cAAA,EAAe;AAClB,IAAM,eAAe,kBAAA,CAAmB;AAAA,EAC7C,IAAA,EAAM,EAAE,IAAA,EAAK;AAAA,EACb,OAAA,EAAS,EAAE,OAAA,EAAQ;AAAA,EACnB,GAAA,EAAK,EAAE,GAAA;AACT,CAAC","file":"bottom-app-bar.js","sourcesContent":["/**\n * tv.ts — a tailwind-variants factory pre-configured for the M3 typescale.\n *\n * The Tailwind v4 preset exposes the 15 typescale roles as `text-<role>`\n * font-size utilities (e.g. `text-body-small`, `text-label-large`). Stock\n * tailwind-merge does not know these custom names, so it groups them with the\n * `text-<color>` utilities and drops one when a slot sets both a color *and* a\n * typescale (the common M3 case). That silently strips either the color or the\n * type, breaking token compliance.\n *\n * Teaching tailwind-merge that the typescale names belong to the `font-size`\n * group keeps color and type independent, so both survive the merge.\n */\nimport { type TV, tv as baseTv } from 'tailwind-variants';\n\nconst TYPESCALE = [\n  'display-large',\n  'display-medium',\n  'display-small',\n  'headline-large',\n  'headline-medium',\n  'headline-small',\n  'title-large',\n  'title-medium',\n  'title-small',\n  'body-large',\n  'body-medium',\n  'body-small',\n  'label-large',\n  'label-medium',\n  'label-small',\n] as const;\n\nexport const tv: TV = (options, config) =>\n  baseTv(options, {\n    ...config,\n    twMergeConfig: {\n      extend: {\n        classGroups: {\n          'font-size': [{ text: [...TYPESCALE] }],\n        },\n      },\n    },\n  });\n","/**\n * bottom-app-bar.ts — tailwind-variants slots for the M3 BottomAppBar.\n *\n * An 80dp `surface-container` `role=\"toolbar\"`: leading action icons + an\n * optional trailing FAB. Same DOM as the VE build.\n */\nimport { createBottomAppBar } from '@m3-baseui/core';\nimport { tv } from './tv';\n\nexport const bottomAppBarTv = tv({\n  slots: {\n    root: 'flex items-center justify-between w-full box-border h-20 px-1 bg-surface-container text-on-surface-variant',\n    actions: 'flex items-center gap-1 pl-2 [&_svg]:size-6',\n    fab: 'flex items-center pr-3',\n  },\n});\n\nconst s = bottomAppBarTv();\nexport const BottomAppBar = createBottomAppBar({\n  root: s.root(),\n  actions: s.actions(),\n  fab: s.fab(),\n});\nexport type { BottomAppBarProps } from '@m3-baseui/core';\n"]}

package/dist/bottom-sheet.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tv.ts","../src/bottom-sheet.ts"],"names":["baseTv"],"mappings":";;;;;AAeA,IAAM,SAAA,GAAY;AAAA,EAChB,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA;AAEO,IAAM,EAAA,GAAS,CAAC,OAAA,EAAS,MAAA,KAC9BA,KAAO,OAAA,EAAS;AAAA,EACd,GAAG,MAAA;AAAA,EACH,aAAA,EAAe;AAAA,IACb,MAAA,EAAQ;AAAA,MACN,WAAA,EAAa;AAAA,QACX,WAAA,EAAa,CAAC,EAAE,IAAA,EAAM,CAAC,GAAG,SAAS,GAAG;AAAA;AACxC;AACF;AAEJ,CAAC,CAAA;;;AC/BI,IAAM,gBAAgB,EAAA,CAAG;AAAA,EAC9B,KAAA,EAAO;AAAA,IACL,QAAA,EAAU;AAAA,MACR,gCAAA;AAAA,MACA,iDAAA;AAAA,MACA,gCAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,QAAA,EAAU,kDAAA;AAAA,IACV,KAAA,EAAO;AAAA,MACL,2DAAA;AAAA,MACA,4DAAA;AAAA,MACA,mFAAA;AAAA,MACA,8FAAA;AAAA,MACA,mDAAA;AAAA,MACA,4BAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,MAAA,EAAQ,0EAAA;AAAA,IACR,KAAA,EAAO,CAAC,gDAAgD,CAAA;AAAA,IACxD,WAAA,EAAa,CAAC,wDAAwD;AAAA;AAE1E,CAAC;AAED,IAAM,IAAI,aAAA,EAAc;AACjB,IAAM,cAAc,iBAAA,CAAkB;AAAA,EAC3C,QAAA,EAAU,EAAE,QAAA,EAAS;AAAA,EACrB,QAAA,EAAU,EAAE,QAAA,EAAS;AAAA,EACrB,KAAA,EAAO,EAAE,KAAA,EAAM;AAAA,EACf,MAAA,EAAQ,EAAE,MAAA,EAAO;AAAA,EACjB,KAAA,EAAO,EAAE,KAAA,EAAM;AAAA,EACf,WAAA,EAAa,EAAE,WAAA;AACjB,CAAC","file":"bottom-sheet.js","sourcesContent":["/**\n * tv.ts — a tailwind-variants factory pre-configured for the M3 typescale.\n *\n * The Tailwind v4 preset exposes the 15 typescale roles as `text-<role>`\n * font-size utilities (e.g. `text-body-small`, `text-label-large`). Stock\n * tailwind-merge does not know these custom names, so it groups them with the\n * `text-<color>` utilities and drops one when a slot sets both a color *and* a\n * typescale (the common M3 case). That silently strips either the color or the\n * type, breaking token compliance.\n *\n * Teaching tailwind-merge that the typescale names belong to the `font-size`\n * group keeps color and type independent, so both survive the merge.\n */\nimport { type TV, tv as baseTv } from 'tailwind-variants';\n\nconst TYPESCALE = [\n  'display-large',\n  'display-medium',\n  'display-small',\n  'headline-large',\n  'headline-medium',\n  'headline-small',\n  'title-large',\n  'title-medium',\n  'title-small',\n  'body-large',\n  'body-medium',\n  'body-small',\n  'label-large',\n  'label-medium',\n  'label-small',\n] as const;\n\nexport const tv: TV = (options, config) =>\n  baseTv(options, {\n    ...config,\n    twMergeConfig: {\n      extend: {\n        classGroups: {\n          'font-size': [{ text: [...TYPESCALE] }],\n        },\n      },\n    },\n  });\n","/**\n * bottom-sheet.ts — tailwind-variants slots for the M3 Bottom sheet.\n *\n * A `surface-container-low` surface docked to the bottom edge with extra-large\n * (28dp) top corners, elevation 1, and a 32×4dp drag handle. The scrim fades on\n * Base UI's data-[starting-style] / data-[ending-style]; the popup slides via the\n * drawer's `--drawer-swipe-movement-y` so the swipe gesture tracks the finger.\n * Same DOM + `data-*` as the VE build.\n */\nimport { createBottomSheet } from '@m3-baseui/core';\nimport { tv } from './tv';\n\nexport const bottomSheetTv = tv({\n  slots: {\n    backdrop: [\n      'fixed inset-0 z-40 bg-scrim/32',\n      'transition-opacity duration-300 ease-emphasized',\n      'data-[swiping]:transition-none',\n      'data-[starting-style]:opacity-0 data-[ending-style]:opacity-0',\n    ],\n    viewport: 'fixed inset-0 z-50 flex items-end justify-center',\n    popup: [\n      'box-border w-full max-w-[640px] max-h-[calc(100dvh-56px)]',\n      'overflow-y-auto overscroll-contain touch-auto outline-none',\n      'pb-6 bg-surface-container-low text-on-surface rounded-t-extra-large shadow-level1',\n      '[transform:translateY(calc(var(--drawer-snap-point-offset)+var(--drawer-swipe-movement-y)))]',\n      'transition-transform duration-300 ease-emphasized',\n      'data-[swiping]:select-none',\n      'data-[starting-style]:[transform:translateY(100%)] data-[ending-style]:[transform:translateY(100%)]',\n    ],\n    handle: 'mx-auto mt-4 mb-2 h-1 w-8 shrink-0 rounded-full bg-on-surface-variant/40',\n    title: ['m-0 px-6 pt-2 text-title-large text-on-surface'],\n    description: ['m-0 px-6 pt-1 text-body-medium text-on-surface-variant'],\n  },\n});\n\nconst s = bottomSheetTv();\nexport const BottomSheet = createBottomSheet({\n  backdrop: s.backdrop(),\n  viewport: s.viewport(),\n  popup: s.popup(),\n  handle: s.handle(),\n  title: s.title(),\n  description: s.description(),\n});\nexport type { BottomSheetVariant } from '@m3-baseui/core';\n"]}

package/dist/button-group.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tv.ts","../src/button-group.ts"],"names":["baseTv"],"mappings":";;;;;AAeA,IAAM,SAAA,GAAY;AAAA,EAChB,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA;AAEO,IAAM,EAAA,GAAS,CAAC,OAAA,EAAS,MAAA,KAC9BA,KAAO,OAAA,EAAS;AAAA,EACd,GAAG,MAAA;AAAA,EACH,aAAA,EAAe;AAAA,IACb,MAAA,EAAQ;AAAA,MACN,WAAA,EAAa;AAAA,QACX,WAAA,EAAa,CAAC,EAAE,IAAA,EAAM,CAAC,GAAG,SAAS,GAAG;AAAA;AACxC;AACF;AAEJ,CAAC,CAAA;;;AC/BI,IAAM,cAAc,EAAA,CAAG;AAAA,EAC5B,IAAA,EAAM,0BAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,QAAA,EAAU,OAAA;AAAA,MACV,SAAA,EAAW;AAAA,QACT,SAAA;AAAA,QACA,wDAAA;AAAA;AAAA;AAAA,QAGA,oDAAA;AAAA,QACA;AAAA;AACF;AACF,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS;AAAA;AAEb,CAAC;AAEM,IAAM,WAAA,GAAc,iBAAA,CAAkB,CAAC,EAAE,OAAA,OAAc,WAAA,CAAY,EAAE,OAAA,EAAS,CAAC","file":"button-group.js","sourcesContent":["/**\n * tv.ts — a tailwind-variants factory pre-configured for the M3 typescale.\n *\n * The Tailwind v4 preset exposes the 15 typescale roles as `text-<role>`\n * font-size utilities (e.g. `text-body-small`, `text-label-large`). Stock\n * tailwind-merge does not know these custom names, so it groups them with the\n * `text-<color>` utilities and drops one when a slot sets both a color *and* a\n * typescale (the common M3 case). That silently strips either the color or the\n * type, breaking token compliance.\n *\n * Teaching tailwind-merge that the typescale names belong to the `font-size`\n * group keeps color and type independent, so both survive the merge.\n */\nimport { type TV, tv as baseTv } from 'tailwind-variants';\n\nconst TYPESCALE = [\n  'display-large',\n  'display-medium',\n  'display-small',\n  'headline-large',\n  'headline-medium',\n  'headline-small',\n  'title-large',\n  'title-medium',\n  'title-small',\n  'body-large',\n  'body-medium',\n  'body-small',\n  'label-large',\n  'label-medium',\n  'label-small',\n] as const;\n\nexport const tv: TV = (options, config) =>\n  baseTv(options, {\n    ...config,\n    twMergeConfig: {\n      extend: {\n        classGroups: {\n          'font-size': [{ text: [...TYPESCALE] }],\n        },\n      },\n    },\n  });\n","/**\n * button-group.ts — tailwind-variants resolver for the M3 ButtonGroup.\n *\n * `standard` lays the buttons out with an 8dp gap; `connected` tightens the gap\n * to 2dp and reduces the children's inner-facing corners to the `small` shape\n * token so the row reads as one connected unit (outer corners stay full). The\n * child selectors carry enough specificity to win over each button's own\n * `rounded-full`. Same DOM + `role=\"group\"` as the VE build.\n */\nimport { createButtonGroup } from '@m3-baseui/core';\nimport { tv } from './tv';\n\nexport const buttonGroup = tv({\n  base: 'inline-flex items-center',\n  variants: {\n    variant: {\n      standard: 'gap-2',\n      connected: [\n        'gap-0.5',\n        '[&>*:not(:first-child):not(:last-child)]:rounded-small',\n        // Guard against a lone child (it is both first *and* last) — only morph\n        // the inner-facing corner when there is actually a sibling to face.\n        '[&>*:first-child:not(:last-child)]:rounded-e-small',\n        '[&>*:last-child:not(:first-child)]:rounded-s-small',\n      ],\n    },\n  },\n  defaultVariants: {\n    variant: 'standard',\n  },\n});\n\nexport const ButtonGroup = createButtonGroup(({ variant }) => buttonGroup({ variant }));\nexport type { ButtonGroupProps, ButtonGroupVariant } from '@m3-baseui/core';\n"]}

package/dist/button.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/button.ts"],"names":[],"mappings":";;;;;AAcO,IAAM,SAAS,EAAA,CAAG;AAAA,EACvB,IAAA,EAAM;AAAA,IACJ,wDAAA;AAAA,IACA,4EAAA;AAAA,IACA,kBAAA;AAAA;AAAA,IAEA,uDAAA;AAAA;AAAA,IAEA,6HAAA;AAAA,IACA,6CAAA;AAAA,IACA,sHAAA;AAAA;AAAA,IAEA,uHAAA;AAAA,IACA,+CAAA;AAAA,IACA,kDAAA;AAAA,IACA,0DAAA;AAAA,IACA,qDAAA;AAAA,IACA,6DAAA;AAAA;AAAA,IAEA,4FAAA;AAAA;AAAA;AAAA,IAGA,6EAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA,QAAA,EAAU;AAAA;AAAA;AAAA;AAAA,IAIR,OAAA,EAAS;AAAA,MACP,MAAA,EAAQ;AAAA,QACN,4BAAA;AAAA,QACA,6FAAA;AAAA,QACA,uDAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAA,EAAO;AAAA,QACL,oDAAA;AAAA,QACA,6FAAA;AAAA,QACA,uDAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,QAAA,EAAU;AAAA,QACR,mDAAA;AAAA,QACA,2DAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,QAAA,EAAU;AAAA,QACR,qDAAA;AAAA,QACA,mGAAA;AAAA,QACA,uDAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,kCAAA;AAAA,QACA,6BAAA;AAAA,QACA;AAAA;AACF;AACF,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS;AAAA;AAEb,CAAC;AAEM,IAAM,MAAA,GAAS,YAAA,CAAa,CAAC,EAAE,OAAA,OAAc,MAAA,CAAO,EAAE,OAAA,EAAS,CAAC","file":"button.js","sourcesContent":["/**\n * button.ts — tailwind-variants resolver wired into the shared factory.\n *\n * Emits the same DOM and `data-*` state as the vanilla-extract build; only the\n * class strings differ. Utilities such as `bg-primary`, `text-on-primary`,\n * `rounded-full`, `shadow-level1`, and `text-label-large` are produced by the\n * Tailwind v4 `@theme` preset shipped in `@m3-baseui/tokens/theme.css`.\n *\n * Opacity modifiers (`before:opacity-[var(--md-sys-state-hover)]`) drive the\n * state layer off the channel-triple colors.\n */\nimport { createButton } from '@m3-baseui/core';\nimport { tv } from 'tailwind-variants';\n\nexport const button = tv({\n  base: [\n    'relative inline-flex items-center justify-center gap-2',\n    'h-10 px-6 rounded-full overflow-hidden cursor-pointer select-none border-0',\n    'text-label-large',\n    // M3 with-icon padding: the icon side trims to 16dp (label side stays 24dp).\n    'data-[with-start-icon]:pl-4 data-[with-end-icon]:pr-4',\n    // Icon slot: 18dp, centered.\n    '[&_[data-slot=button-icon]]:inline-flex [&_[data-slot=button-icon]]:items-center [&_[data-slot=button-icon]]:justify-center',\n    '[&_[data-slot=button-icon]>svg]:size-[18px]',\n    'transition-[box-shadow,background-color,color,border-color] duration-200 ease-[var(--md-sys-motion-easing-standard)]',\n    // State layer overlay\n    'before:absolute before:inset-0 before:rounded-[inherit] before:bg-current before:opacity-0 before:pointer-events-none',\n    'before:transition-opacity before:duration-100',\n    'hover:before:opacity-[var(--md-sys-state-hover)]',\n    'focus-visible:before:opacity-[var(--md-sys-state-focus)]',\n    'active:before:opacity-[var(--md-sys-state-pressed)]',\n    'data-[pressed]:before:opacity-[var(--md-sys-state-pressed)]',\n    // Focus ring (M3: 3px secondary, 2px offset)\n    'focus-visible:outline-[3px] focus-visible:outline-offset-2 focus-visible:outline-secondary',\n    // Disabled: no interaction, no state layer, no elevation. Per-variant\n    // colors (container on-surface/12, label on-surface/38) live on each variant.\n    'disabled:pointer-events-none disabled:shadow-none disabled:before:opacity-0',\n    'data-[disabled]:pointer-events-none data-[disabled]:shadow-none data-[disabled]:before:opacity-0',\n  ],\n  variants: {\n    // M3 elevation per variant: filled/tonal rest level0→hover level1→pressed level0;\n    // elevated rest level1→hover level2→pressed level1. Disabled container is\n    // on-surface/12 and label on-surface/38, matching material-web.\n    variant: {\n      filled: [\n        'bg-primary text-on-primary',\n        'hover:shadow-level1 focus-visible:shadow-none active:shadow-none data-[pressed]:shadow-none',\n        'disabled:bg-on-surface/12 disabled:text-on-surface/38',\n        'data-[disabled]:bg-on-surface/12 data-[disabled]:text-on-surface/38',\n      ],\n      tonal: [\n        'bg-secondary-container text-on-secondary-container',\n        'hover:shadow-level1 focus-visible:shadow-none active:shadow-none data-[pressed]:shadow-none',\n        'disabled:bg-on-surface/12 disabled:text-on-surface/38',\n        'data-[disabled]:bg-on-surface/12 data-[disabled]:text-on-surface/38',\n      ],\n      outlined: [\n        'bg-transparent text-primary border border-outline',\n        'disabled:text-on-surface/38 disabled:border-on-surface/12',\n        'data-[disabled]:text-on-surface/38 data-[disabled]:border-on-surface/12',\n      ],\n      elevated: [\n        'bg-surface-container-low text-primary shadow-level1',\n        'hover:shadow-level2 focus-visible:shadow-level1 active:shadow-level1 data-[pressed]:shadow-level1',\n        'disabled:bg-on-surface/12 disabled:text-on-surface/38',\n        'data-[disabled]:bg-on-surface/12 data-[disabled]:text-on-surface/38',\n      ],\n      text: [\n        'bg-transparent text-primary px-3',\n        'disabled:text-on-surface/38',\n        'data-[disabled]:text-on-surface/38',\n      ],\n    },\n  },\n  defaultVariants: {\n    variant: 'filled',\n  },\n});\n\nexport const Button = createButton(({ variant }) => button({ variant }));\nexport type { ButtonProps, ButtonVariant } from '@m3-baseui/core';\n"]}

package/dist/card.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tv.ts","../src/card.ts"],"names":["baseTv"],"mappings":";;;;;AAeA,IAAM,SAAA,GAAY;AAAA,EAChB,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA;AAEO,IAAM,EAAA,GAAS,CAAC,OAAA,EAAS,MAAA,KAC9BA,KAAO,OAAA,EAAS;AAAA,EACd,GAAG,MAAA;AAAA,EACH,aAAA,EAAe;AAAA,IACb,MAAA,EAAQ;AAAA,MACN,WAAA,EAAa;AAAA,QACX,WAAA,EAAa,CAAC,EAAE,IAAA,EAAM,CAAC,GAAG,SAAS,GAAG;AAAA;AACxC;AACF;AAEJ,CAAC,CAAA;;;AC/BI,IAAM,SAAS,EAAA,CAAG;AAAA,EACvB,IAAA,EAAM,oDAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,QAAA,EAAU,wCAAA;AAAA,MACV,MAAA,EAAQ,8BAAA;AAAA,MACR,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,WAAA,EAAa;AAAA,MACX,IAAA,EAAM;AAAA,QACJ,gFAAA;AAAA;AAAA,QAEA,8CAAA;AAAA,QACA,4IAAA;AAAA,QACA,kDAAA;AAAA,QACA,0DAAA;AAAA,QACA,qDAAA;AAAA,QACA,4FAAA;AAAA;AAAA,QAEA,yGAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,gBAAA,EAAkB;AAAA;AAAA,IAEhB;AAAA,MACE,OAAA,EAAS,UAAA;AAAA,MACT,WAAA,EAAa,IAAA;AAAA,MACb,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS,UAAA;AAAA,IACT,WAAA,EAAa;AAAA;AAEjB,CAAC;AAEM,IAAM,OAAO,UAAA,CAAW;AAAA,EAC7B,IAAA,EAAM,CAAC,EAAE,OAAA,EAAS,WAAA,OAAkB,MAAA,CAAO,EAAE,OAAA,EAAS,WAAA,EAAa;AACrE,CAAC","file":"card.js","sourcesContent":["/**\n * tv.ts — a tailwind-variants factory pre-configured for the M3 typescale.\n *\n * The Tailwind v4 preset exposes the 15 typescale roles as `text-<role>`\n * font-size utilities (e.g. `text-body-small`, `text-label-large`). Stock\n * tailwind-merge does not know these custom names, so it groups them with the\n * `text-<color>` utilities and drops one when a slot sets both a color *and* a\n * typescale (the common M3 case). That silently strips either the color or the\n * type, breaking token compliance.\n *\n * Teaching tailwind-merge that the typescale names belong to the `font-size`\n * group keeps color and type independent, so both survive the merge.\n */\nimport { type TV, tv as baseTv } from 'tailwind-variants';\n\nconst TYPESCALE = [\n  'display-large',\n  'display-medium',\n  'display-small',\n  'headline-large',\n  'headline-medium',\n  'headline-small',\n  'title-large',\n  'title-medium',\n  'title-small',\n  'body-large',\n  'body-medium',\n  'body-small',\n  'label-large',\n  'label-medium',\n  'label-small',\n] as const;\n\nexport const tv: TV = (options, config) =>\n  baseTv(options, {\n    ...config,\n    twMergeConfig: {\n      extend: {\n        classGroups: {\n          'font-size': [{ text: [...TYPESCALE] }],\n        },\n      },\n    },\n  });\n","/**\n * card.ts — tailwind-variants slots for the M3 Card.\n *\n * 12dp corners. `elevated` is surface-container-low + level1, `filled` is\n * surface-container-highest (level0), `outlined` is surface + outline-variant.\n * Interactive cards add the `currentColor` state-layer `::before` (the pointer\n * ripple is added by the factory), a focus ring and per-token disabled dimming.\n * Same DOM + `data-*` as the VE build.\n */\nimport { createCard } from '@m3-baseui/core';\nimport { tv } from './tv';\n\nexport const cardTv = tv({\n  base: 'relative box-border rounded-medium text-on-surface',\n  variants: {\n    variant: {\n      elevated: 'bg-surface-container-low shadow-level1',\n      filled: 'bg-surface-container-highest',\n      outlined: 'bg-surface border border-outline-variant',\n    },\n    interactive: {\n      true: [\n        'group overflow-hidden cursor-pointer select-none text-left w-full outline-none',\n        // Animate the elevation lift/settle to match the VE box-shadow transition.\n        'transition-shadow duration-150 ease-standard',\n        'before:absolute before:inset-0 before:bg-current before:opacity-0 before:pointer-events-none before:transition-opacity before:duration-100',\n        'hover:before:opacity-[var(--md-sys-state-hover)]',\n        'focus-visible:before:opacity-[var(--md-sys-state-focus)]',\n        'active:before:opacity-[var(--md-sys-state-pressed)]',\n        'focus-visible:outline-[3px] focus-visible:outline-offset-2 focus-visible:outline-secondary',\n        // M3 disabled: drop the shadow + state layer, dim the content per-token.\n        'disabled:pointer-events-none disabled:before:opacity-0 disabled:shadow-none disabled:text-on-surface/38',\n        'data-[disabled]:pointer-events-none data-[disabled]:before:opacity-0 data-[disabled]:shadow-none data-[disabled]:text-on-surface/38',\n      ],\n      false: '',\n    },\n  },\n  compoundVariants: [\n    // M3 interactive elevated: lifts to level2 on hover, settles to level1 on press.\n    {\n      variant: 'elevated',\n      interactive: true,\n      class: 'hover:shadow-level2 active:shadow-level1',\n    },\n  ],\n  defaultVariants: {\n    variant: 'elevated',\n    interactive: false,\n  },\n});\n\nexport const Card = createCard({\n  root: ({ variant, interactive }) => cardTv({ variant, interactive }),\n});\nexport type { CardProps, CardVariant } from '@m3-baseui/core';\n"]}

package/dist/carousel.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tv.ts","../src/carousel.ts"],"names":["baseTv"],"mappings":";;;;;AAeA,IAAM,SAAA,GAAY;AAAA,EAChB,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA;AAEO,IAAM,EAAA,GAAS,CAAC,OAAA,EAAS,MAAA,KAC9BA,KAAO,OAAA,EAAS;AAAA,EACd,GAAG,MAAA;AAAA,EACH,aAAA,EAAe;AAAA,IACb,MAAA,EAAQ;AAAA,MACN,WAAA,EAAa;AAAA,QACX,WAAA,EAAa,CAAC,EAAE,IAAA,EAAM,CAAC,GAAG,SAAS,GAAG;AAAA;AACxC;AACF;AAEJ,CAAC,CAAA;;;AChCI,IAAM,aAAa,EAAA,CAAG;AAAA,EAC3B,KAAA,EAAO;AAAA,IACL,IAAA,EAAM;AAAA,MACJ,gEAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,cAAA,EAAgB,EAAE,IAAA,EAAM,WAAA,EAAY;AAAA,MACpC,IAAA,EAAM,EAAE,IAAA,EAAM,uBAAA,EAAwB;AAAA,MACtC,aAAA,EAAe;AAAA;AAAA,QAEb,IAAA,EAAM,gEAAA;AAAA,QACN,IAAA,EAAM;AAAA;AACR;AACF,GACF;AAAA,EACA,eAAA,EAAiB,EAAE,OAAA,EAAS,cAAA;AAC9B,CAAC;AAEM,IAAM,QAAA,GAAW,cAAA,CAAe,CAAC,OAAA,KAAY;AAClD,EAAA,MAAM,CAAA,GAAI,UAAA,CAAW,EAAE,OAAA,EAAS,CAAA;AAChC,EAAA,OAAO,EAAE,MAAM,CAAA,CAAE,IAAA,IAAQ,IAAA,EAAM,CAAA,CAAE,MAAK,EAAE;AAC1C,CAAC","file":"carousel.js","sourcesContent":["/**\n * tv.ts — a tailwind-variants factory pre-configured for the M3 typescale.\n *\n * The Tailwind v4 preset exposes the 15 typescale roles as `text-<role>`\n * font-size utilities (e.g. `text-body-small`, `text-label-large`). Stock\n * tailwind-merge does not know these custom names, so it groups them with the\n * `text-<color>` utilities and drops one when a slot sets both a color *and* a\n * typescale (the common M3 case). That silently strips either the color or the\n * type, breaking token compliance.\n *\n * Teaching tailwind-merge that the typescale names belong to the `font-size`\n * group keeps color and type independent, so both survive the merge.\n */\nimport { type TV, tv as baseTv } from 'tailwind-variants';\n\nconst TYPESCALE = [\n  'display-large',\n  'display-medium',\n  'display-small',\n  'headline-large',\n  'headline-medium',\n  'headline-small',\n  'title-large',\n  'title-medium',\n  'title-small',\n  'body-large',\n  'body-medium',\n  'body-small',\n  'label-large',\n  'label-medium',\n  'label-small',\n] as const;\n\nexport const tv: TV = (options, config) =>\n  baseTv(options, {\n    ...config,\n    twMergeConfig: {\n      extend: {\n        classGroups: {\n          'font-size': [{ text: [...TYPESCALE] }],\n        },\n      },\n    },\n  });\n","/**\n * carousel.ts — tailwind-variants slots for the M3 Carousel.\n *\n * Root is a scroll-snap scroller (hidden scrollbar); items are snap-aligned,\n * `large`-radius cells. `multi-browse` and `hero` scroll horizontally (hero\n * items are wider and centre-snap); `full-screen` stacks full-size items\n * vertically. Same DOM as the VE build.\n */\nimport { createCarousel } from '@m3-baseui/core';\nimport { tv } from './tv';\n\nexport const carouselTv = tv({\n  slots: {\n    root: [\n      'flex gap-2 overflow-x-auto snap-x snap-mandatory scroll-smooth',\n      '[scrollbar-width:none] [&::-webkit-scrollbar]:hidden',\n    ],\n    item: 'snap-start shrink-0 overflow-hidden rounded-large',\n  },\n  variants: {\n    variant: {\n      'multi-browse': { item: 'w-40 h-56' },\n      hero: { item: 'w-72 h-56 snap-center' },\n      'full-screen': {\n        // gap-0: full-screen slides fill the viewport with no inter-slide gap.\n        root: 'flex-col gap-0 overflow-x-hidden overflow-y-auto snap-y h-full',\n        item: 'w-full h-full snap-center',\n      },\n    },\n  },\n  defaultVariants: { variant: 'multi-browse' },\n});\n\nexport const Carousel = createCarousel((variant) => {\n  const s = carouselTv({ variant });\n  return { root: s.root(), item: s.item() };\n});\nexport type { CarouselVariant } from '@m3-baseui/core';\n"]}

package/dist/checkbox.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/checkbox.ts"],"names":[],"mappings":";;;;;AAUO,IAAM,aAAa,EAAA,CAAG;AAAA,EAC3B,KAAA,EAAO;AAAA,IACL,IAAA,EAAM;AAAA,MACJ,4EAAA;AAAA,MACA,kEAAA;AAAA;AAAA;AAAA,MAGA,2CAAA;AAAA,MACA,8CAAA;AAAA,MACA,qFAAA;AAAA,MACA,uGAAA;AAAA;AAAA,MAEA,qBAAA;AAAA,MACA,mFAAA;AAAA;AAAA,MAEA,kFAAA;AAAA,MACA,oKAAA;AAAA,MACA,4LAAA;AAAA,MACA,4FAAA;AAAA,MACA,sEAAA;AAAA;AAAA;AAAA,MAGA,sCAAA;AAAA,MACA,mGAAA;AAAA,MACA,+GAAA;AAAA;AAAA,MAEA,oHAAA;AAAA,MACA,qHAAA;AAAA,MACA,kDAAA;AAAA,MACA,0DAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,SAAA,EAAW;AAAA,MACT,yGAAA;AAAA;AAAA,MAEA,kCAAA;AAAA;AAAA,MAEA,oCAAA;AAAA;AAAA;AAAA,MAGA,uEAAA;AAAA,MACA,+FAAA;AAAA,MACA,2GAAA;AAAA,MACA,uHAAA;AAAA,MACA,6EAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,IAAA,EAAM,CAAC,2DAA2D;AAAA;AAEtE,CAAC;AAED,IAAM,IAAI,UAAA,EAAW;AACd,IAAM,WAAW,cAAA,CAAe;AAAA,EACrC,IAAA,EAAM,EAAE,IAAA,EAAK;AAAA,EACb,SAAA,EAAW,EAAE,SAAA,EAAU;AAAA,EACvB,IAAA,EAAM,EAAE,IAAA;AACV,CAAC","file":"checkbox.js","sourcesContent":["/**\n * checkbox.ts — tailwind-variants slots for the M3 Checkbox.\n *\n * 18dp box with a 40dp circular state layer. Checked/indeterminate fill the box\n * with primary; the indeterminate dash is an `::after` on the indicator and the\n * check SVG is hidden in that state via a group reference.\n */\nimport { createCheckbox } from '@m3-baseui/core';\nimport { tv } from 'tailwind-variants';\n\nexport const checkboxTv = tv({\n  slots: {\n    root: [\n      'group relative inline-flex items-center justify-center shrink-0 box-border',\n      'size-[18px] rounded-[2px] border-2 cursor-pointer bg-transparent',\n      // Outline is on-surface-variant; the state layer (text/currentColor) is\n      // on-surface unselected, primary when selected (material-web).\n      'border-on-surface-variant text-on-surface',\n      'transition-colors duration-150 ease-standard',\n      'data-[checked]:bg-primary data-[checked]:border-primary data-[checked]:text-primary',\n      'data-[indeterminate]:bg-primary data-[indeterminate]:border-primary data-[indeterminate]:text-primary',\n      // M3 pressed state layer inverts: unselected→primary, selected→on-surface\n      'active:text-primary',\n      'data-[checked]:active:text-on-surface data-[indeterminate]:active:text-on-surface',\n      // M3 error: error outline + error-filled box; state layer stays error\n      'data-[error]:border-error data-[error]:text-error data-[error]:active:text-error',\n      'data-[error]:data-[checked]:bg-error data-[error]:data-[checked]:border-error data-[error]:data-[checked]:text-error data-[error]:data-[checked]:active:text-error',\n      'data-[error]:data-[indeterminate]:bg-error data-[error]:data-[indeterminate]:border-error data-[error]:data-[indeterminate]:text-error data-[error]:data-[indeterminate]:active:text-error',\n      'focus-visible:outline-[3px] focus-visible:outline-offset-2 focus-visible:outline-secondary',\n      'data-[disabled]:pointer-events-none data-[disabled]:before:opacity-0',\n      // M3 disabled: unselected outline on-surface/38; selected/indeterminate\n      // box on-surface/38 with no outline (the check turns surface, below).\n      'data-[disabled]:border-on-surface/38',\n      'data-[disabled]:data-[checked]:bg-on-surface/38 data-[disabled]:data-[checked]:border-transparent',\n      'data-[disabled]:data-[indeterminate]:bg-on-surface/38 data-[disabled]:data-[indeterminate]:border-transparent',\n      // 40dp circular state layer\n      'before:content-[\"\"] before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2',\n      'before:size-10 before:rounded-full before:bg-current before:opacity-0 before:transition-opacity before:duration-100',\n      'hover:before:opacity-[var(--md-sys-state-hover)]',\n      'focus-visible:before:opacity-[var(--md-sys-state-focus)]',\n      'active:before:opacity-[var(--md-sys-state-pressed)]',\n    ],\n    indicator: [\n      'group/cb relative inline-flex items-center justify-center size-full pointer-events-none text-on-primary',\n      // M3 error: the check / dash turn on-error on the error-filled box\n      'group-data-[error]:text-on-error',\n      // M3 disabled: the check / dash turn the surface color on the faint box\n      'group-data-[disabled]:text-surface',\n      // M3 asymmetric motion: unselected-exit accelerates out (150ms), the\n      // selected/indeterminate-enter decelerates in (350ms). Token-backed.\n      'opacity-0 data-[checked]:opacity-100 data-[indeterminate]:opacity-100',\n      'transition-opacity ease-emphasized-accelerate duration-[var(--md-sys-motion-duration-short3)]',\n      'data-[checked]:ease-emphasized-decelerate data-[checked]:duration-[var(--md-sys-motion-duration-medium3)]',\n      'data-[indeterminate]:ease-emphasized-decelerate data-[indeterminate]:duration-[var(--md-sys-motion-duration-medium3)]',\n      'data-[indeterminate]:after:content-[\"\"] data-[indeterminate]:after:absolute',\n      'data-[indeterminate]:after:w-[10px] data-[indeterminate]:after:h-[2px] data-[indeterminate]:after:rounded-full data-[indeterminate]:after:bg-current',\n    ],\n    icon: ['w-[18px] h-[18px] group-data-[indeterminate]/cb:opacity-0'],\n  },\n});\n\nconst c = checkboxTv();\nexport const Checkbox = createCheckbox({\n  root: c.root(),\n  indicator: c.indicator(),\n  icon: c.icon(),\n});\n"]}

package/dist/chip.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/chip.ts"],"names":[],"mappings":";;;;;AAUO,IAAM,SAAS,EAAA,CAAG;AAAA,EACvB,KAAA,EAAO;AAAA,IACL,IAAA,EAAM;AAAA,MACJ,yEAAA;AAAA;AAAA;AAAA;AAAA,MAIA,2EAAA;AAAA;AAAA,MAEA,+BAAA;AAAA,MACA,8CAAA;AAAA,MACA,qKAAA;AAAA,MACA,kDAAA;AAAA,MACA,0DAAA;AAAA,MACA,qDAAA;AAAA,MACA,4FAAA;AAAA;AAAA,MAEA,sEAAA;AAAA,MACA,wDAAA;AAAA,MACA,yEAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,8GAAA;AAAA,MACA;AAAA,KACF;AAAA,IACA,KAAA,EAAO;AAAA,MACL,mHAAA;AAAA,MACA,2CAAA;AAAA,MACA;AAAA,KACF;AAAA;AAAA,IAEA,MAAA,EAAQ;AAAA,MACN,4FAAA;AAAA,MACA,gDAAA;AAAA,MACA;AAAA,KACF;AAAA;AAAA,IAEA,IAAA,EAAM;AAAA,MACJ,8DAAA;AAAA,MACA,mBAAA;AAAA,MACA;AAAA;AACF,GACF;AAAA,EACA,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,MAAA,EAAQ;AAAA,QACN,IAAA,EAAM,+CAAA;AAAA,QACN,IAAA,EAAM;AAAA,OACR;AAAA,MACA,UAAA,EAAY;AAAA,QACV,IAAA,EAAM,uDAAA;AAAA,QACN,IAAA,EAAM;AAAA,OACR;AAAA,MACA,KAAA,EAAO;AAAA,QACL,IAAA,EAAM,4DAAA;AAAA,QACN,IAAA,EAAM;AAAA,OACR;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,IAAA,EAAM;AAAA,UACJ,uDAAA;AAAA,UACA,oHAAA;AAAA;AAAA,UAEA;AAAA,SACF;AAAA,QACA,IAAA,EAAM;AAAA;AACR,KACF;AAAA;AAAA;AAAA,IAGA,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,IAAA,EAAM;AAAA,UACJ,2DAAA;AAAA,UACA,0CAAA;AAAA,UACA;AAAA;AACF;AACF;AACF,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS;AAAA;AAEb,CAAC;AAEM,IAAM,OAAO,UAAA,CAAW,CAAC,EAAE,OAAA,EAAS,UAAS,KAAM;AACxD,EAAA,MAAM,CAAA,GAAI,MAAA,CAAO,EAAE,OAAA,EAAS,UAAU,CAAA;AACtC,EAAA,OAAO;AAAA,IACL,IAAA,EAAM,EAAE,IAAA,EAAK;AAAA,IACb,MAAA,EAAQ,EAAE,MAAA,EAAO;AAAA,IACjB,KAAA,EAAO,EAAE,KAAA,EAAM;AAAA,IACf,MAAA,EAAQ,EAAE,MAAA,EAAO;AAAA,IACjB,IAAA,EAAM,EAAE,IAAA;AAAK,GACf;AACF,CAAC","file":"chip.js","sourcesContent":["/**\n * chip.ts — tailwind-variants slots for the M3 Chip.\n *\n * 32dp tall, 8dp corners, label-large. The state layer reacts to hover/focus/\n * press (not the persistent toggle `data-pressed`, which a filter chip uses for\n * its selected fill). Emits the same DOM + ripple as the VE build.\n */\nimport { createChip } from '@m3-baseui/core';\nimport { tv } from 'tailwind-variants';\n\nexport const chipTv = tv({\n  slots: {\n    root: [\n      'group relative inline-flex items-center justify-center gap-2 box-border',\n      // No `overflow-hidden`: it would clip the 48dp touch target. The state\n      // layer is rounded to match instead (before:rounded-[inherit]); the ripple\n      // self-clips.\n      'h-8 px-4 rounded-[8px] select-none border bg-transparent text-label-large',\n      // M3 with-icon padding: the icon side trims to 8dp (label side stays 16dp).\n      'data-[with-leading-icon]:pl-2',\n      'transition-colors duration-150 ease-standard',\n      'before:absolute before:inset-0 before:rounded-[inherit] before:bg-current before:opacity-0 before:pointer-events-none before:transition-opacity before:duration-100',\n      'hover:before:opacity-[var(--md-sys-state-hover)]',\n      'focus-visible:before:opacity-[var(--md-sys-state-focus)]',\n      'active:before:opacity-[var(--md-sys-state-pressed)]',\n      'focus-visible:outline-[3px] focus-visible:outline-offset-2 focus-visible:outline-secondary',\n      // M3 disabled: label on-surface/38, outline on-surface/12; no state layer.\n      'data-[disabled]:pointer-events-none data-[disabled]:before:opacity-0',\n      'disabled:pointer-events-none disabled:before:opacity-0',\n      'data-[disabled]:text-on-surface/38 data-[disabled]:border-on-surface/12',\n      'disabled:text-on-surface/38 disabled:border-on-surface/12',\n    ],\n    remove: [\n      'inline-flex items-center justify-center shrink-0 size-[18px] -mr-1 ml-1 rounded-full border-0 bg-transparent',\n      'text-on-surface-variant cursor-pointer hover:opacity-80',\n    ],\n    check: [\n      'inline-flex items-center justify-center shrink-0 h-[18px] w-0 -ml-2 opacity-0 overflow-hidden pointer-events-none',\n      'transition-all duration-150 ease-standard',\n      'group-data-[pressed]:w-[18px] group-data-[pressed]:ml-0 group-data-[pressed]:opacity-100',\n    ],\n    // M3 leading avatar: 24dp circle; negative margin trims the leading padding to 4dp.\n    avatar: [\n      'inline-flex items-center justify-center shrink-0 size-6 -ml-3 rounded-full overflow-hidden',\n      'bg-primary-container text-on-primary-container',\n      '[&>img]:size-full [&>img]:object-cover',\n    ],\n    // M3 leading icon: 18dp; root `data-with-leading-icon` trims leading padding to 8dp.\n    icon: [\n      'inline-flex items-center justify-center shrink-0 size-[18px]',\n      '[&>svg]:size-full',\n      'group-disabled:text-on-surface/38 group-data-[disabled]:text-on-surface/38',\n    ],\n  },\n  variants: {\n    variant: {\n      assist: {\n        root: 'border-outline text-on-surface cursor-pointer',\n        icon: 'text-primary',\n      },\n      suggestion: {\n        root: 'border-outline text-on-surface-variant cursor-pointer',\n        icon: 'text-on-surface-variant',\n      },\n      input: {\n        root: 'border-outline text-on-surface-variant cursor-default pr-2',\n        icon: 'text-on-surface-variant',\n      },\n      filter: {\n        root: [\n          'border-outline text-on-surface-variant cursor-pointer',\n          'data-[pressed]:bg-secondary-container data-[pressed]:text-on-secondary-container data-[pressed]:border-transparent',\n          // M3 disabled + selected: faint on-surface/12 container\n          'data-[pressed]:data-[disabled]:bg-on-surface/12 data-[pressed]:disabled:bg-on-surface/12',\n        ],\n        icon: 'text-on-surface-variant group-data-[pressed]:hidden',\n      },\n    },\n    // M3 elevated: filled surface-container-low + elevation level1→level2 on hover,\n    // no outline. Disabled drops the shadow.\n    elevated: {\n      true: {\n        root: [\n          'bg-surface-container-low border-transparent shadow-level1',\n          'hover:shadow-level2 active:shadow-level1',\n          'disabled:shadow-none data-[disabled]:shadow-none',\n        ],\n      },\n    },\n  },\n  defaultVariants: {\n    variant: 'assist',\n  },\n});\n\nexport const Chip = createChip(({ variant, elevated }) => {\n  const c = chipTv({ variant, elevated });\n  return {\n    root: c.root(),\n    remove: c.remove(),\n    check: c.check(),\n    avatar: c.avatar(),\n    icon: c.icon(),\n  };\n});\nexport type { ChipProps, ChipVariant } from '@m3-baseui/core';\n"]}