@ecoma-io/loom 0.1.0

package/dist/lib/a11y-scope.d.ts

@@ -0,0 +1,19 @@
+/**
+ * The WCAG scope Loom holds itself to: the assistive-technology and keyboard
+ * rules, not axe's SEO and document-structure best-practice set. A component
+ * library cannot know what document it will be rendered into, so a rule about
+ * the document is the consumer's to answer, not ours.
+ *
+ * Single source for every axe run against this package, and there is more
+ * than one, in different processes: the documentation site's live
+ * accessibility panel and the end-to-end gate that scans the built site. Both
+ * import this. The list must never be restated, or the panel a contributor
+ * reads and the gate that blocks the merge drift into disagreeing about what
+ * counts as a violation.
+ *
+ * Exported from the narrow `@ecoma-io/loom/a11y` entry so a tool that only
+ * needs this array — a Playwright run, a CI script — can read it without
+ * pulling in a single Vue component.
+ */
+export declare const WCAG_TAGS: readonly ["wcag2a", "wcag2aa", "wcag21a", "wcag21aa"];
+//# sourceMappingURL=a11y-scope.d.ts.map

package/dist/lib/a11y-scope.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"a11y-scope.d.ts","sourceRoot":"","sources":["../../src/lib/a11y-scope.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,SAAS,uDAAwD,CAAC"}

package/dist/lib/a11y-scope.js

@@ -0,0 +1,28 @@
+//#region src/lib/a11y-scope.ts
+/**
+* The WCAG scope Loom holds itself to: the assistive-technology and keyboard
+* rules, not axe's SEO and document-structure best-practice set. A component
+* library cannot know what document it will be rendered into, so a rule about
+* the document is the consumer's to answer, not ours.
+*
+* Single source for every axe run against this package, and there is more
+* than one, in different processes: the documentation site's live
+* accessibility panel and the end-to-end gate that scans the built site. Both
+* import this. The list must never be restated, or the panel a contributor
+* reads and the gate that blocks the merge drift into disagreeing about what
+* counts as a violation.
+*
+* Exported from the narrow `@ecoma-io/loom/a11y` entry so a tool that only
+* needs this array — a Playwright run, a CI script — can read it without
+* pulling in a single Vue component.
+*/
+var WCAG_TAGS = [
+	"wcag2a",
+	"wcag2aa",
+	"wcag21a",
+	"wcag21aa"
+];
+//#endregion
+export { WCAG_TAGS };
+
+//# sourceMappingURL=a11y-scope.js.map

package/dist/lib/a11y-scope.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a11y-scope.js","names":[],"sources":["../../src/lib/a11y-scope.ts"],"sourcesContent":["/**\n * The WCAG scope Loom holds itself to: the assistive-technology and keyboard\n * rules, not axe's SEO and document-structure best-practice set. A component\n * library cannot know what document it will be rendered into, so a rule about\n * the document is the consumer's to answer, not ours.\n *\n * Single source for every axe run against this package, and there is more\n * than one, in different processes: the documentation site's live\n * accessibility panel and the end-to-end gate that scans the built site. Both\n * import this. The list must never be restated, or the panel a contributor\n * reads and the gate that blocks the merge drift into disagreeing about what\n * counts as a violation.\n *\n * Exported from the narrow `@ecoma-io/loom/a11y` entry so a tool that only\n * needs this array — a Playwright run, a CI script — can read it without\n * pulling in a single Vue component.\n */\nexport const WCAG_TAGS = [\"wcag2a\", \"wcag2aa\", \"wcag21a\", \"wcag21aa\"] as const;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,IAAa,YAAY;CAAC;CAAU;CAAW;CAAW;AAAU"}

package/dist/lib/attrs.d.ts

@@ -0,0 +1,18 @@
+import { type ComputedRef } from "vue";
+/**
+ * Split `useAttrs()` into the raw fallthrough attributes — read `.class` off
+ * `attrs` for a `cn()` merge — and the same attributes minus `class` (`rest`,
+ * for `v-bind` onto whichever node is not the `class` target).
+ *
+ * Every caller pairs this with `defineOptions({ inheritAttrs: false })`.
+ * NumberField's input, Slider's thumb and Select's trigger each route `class`
+ * onto one specific rendered node rather than taking Vue's default
+ * single-root fallthrough, because `class` needs a Tailwind-aware merge while
+ * the rest of the fallthrough — aria-*, data-testid — only needs to land
+ * somewhere real.
+ */
+export declare function useSplitAttrs(): {
+    attrs: Record<string, unknown>;
+    rest: ComputedRef<Record<string, unknown>>;
+};
+//# sourceMappingURL=attrs.d.ts.map

package/dist/lib/attrs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"attrs.d.ts","sourceRoot":"","sources":["../../src/lib/attrs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,WAAW,EAAE,MAAM,KAAK,CAAC;AAE3D;;;;;;;;;;;GAWG;AACH,wBAAgB,aAAa,IAAI;IAC/B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CAC5C,CAOA"}

package/dist/lib/attrs.js

@@ -0,0 +1,28 @@
+import { computed, useAttrs } from "vue";
+//#region src/lib/attrs.ts
+/**
+* Split `useAttrs()` into the raw fallthrough attributes — read `.class` off
+* `attrs` for a `cn()` merge — and the same attributes minus `class` (`rest`,
+* for `v-bind` onto whichever node is not the `class` target).
+*
+* Every caller pairs this with `defineOptions({ inheritAttrs: false })`.
+* NumberField's input, Slider's thumb and Select's trigger each route `class`
+* onto one specific rendered node rather than taking Vue's default
+* single-root fallthrough, because `class` needs a Tailwind-aware merge while
+* the rest of the fallthrough — aria-*, data-testid — only needs to land
+* somewhere real.
+*/
+function useSplitAttrs() {
+	const attrs = useAttrs();
+	return {
+		attrs,
+		rest: computed(() => {
+			const { class: _class, ...others } = attrs;
+			return others;
+		})
+	};
+}
+//#endregion
+export { useSplitAttrs };
+
+//# sourceMappingURL=attrs.js.map

package/dist/lib/attrs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"attrs.js","names":[],"sources":["../../src/lib/attrs.ts"],"sourcesContent":["import { computed, useAttrs, type ComputedRef } from \"vue\";\n\n/**\n * Split `useAttrs()` into the raw fallthrough attributes — read `.class` off\n * `attrs` for a `cn()` merge — and the same attributes minus `class` (`rest`,\n * for `v-bind` onto whichever node is not the `class` target).\n *\n * Every caller pairs this with `defineOptions({ inheritAttrs: false })`.\n * NumberField's input, Slider's thumb and Select's trigger each route `class`\n * onto one specific rendered node rather than taking Vue's default\n * single-root fallthrough, because `class` needs a Tailwind-aware merge while\n * the rest of the fallthrough — aria-*, data-testid — only needs to land\n * somewhere real.\n */\nexport function useSplitAttrs(): {\n  attrs: Record<string, unknown>;\n  rest: ComputedRef<Record<string, unknown>>;\n} {\n  const attrs = useAttrs();\n  const rest = computed(() => {\n    const { class: _class, ...others } = attrs;\n    return others;\n  });\n  return { attrs, rest };\n}\n"],"mappings":";;;;;;;;;;;;;;AAcA,SAAgB,gBAGd;CACA,MAAM,QAAQ,SAAS;CAKvB,OAAO;EAAE;EAAO,MAJH,eAAe;GAC1B,MAAM,EAAE,OAAO,QAAQ,GAAG,WAAW;GACrC,OAAO;EACT,CACgB;CAAK;AACvB"}

package/dist/lib/cn.d.ts

@@ -0,0 +1,9 @@
+import { type ClassValue } from "clsx";
+/**
+ * Merge conditional class names, resolving Tailwind conflicts so the last
+ * utility in a group wins. Every component routes its `class` through this,
+ * which is what lets a consumer override any utility from the outside without
+ * reaching for `!important`.
+ */
+export declare function cn(...inputs: ClassValue[]): string;
+//# sourceMappingURL=cn.d.ts.map

package/dist/lib/cn.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cn.d.ts","sourceRoot":"","sources":["../../src/lib/cn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAC;AAG7C;;;;;GAKG;AACH,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,GAAG,MAAM,CAElD"}

package/dist/lib/cn.js

@@ -0,0 +1,16 @@
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+//#region src/lib/cn.ts
+/**
+* Merge conditional class names, resolving Tailwind conflicts so the last
+* utility in a group wins. Every component routes its `class` through this,
+* which is what lets a consumer override any utility from the outside without
+* reaching for `!important`.
+*/
+function cn(...inputs) {
+	return twMerge(clsx(inputs));
+}
+//#endregion
+export { cn };
+
+//# sourceMappingURL=cn.js.map

package/dist/lib/cn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cn.js","names":[],"sources":["../../src/lib/cn.ts"],"sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge conditional class names, resolving Tailwind conflicts so the last\n * utility in a group wins. Every component routes its `class` through this,\n * which is what lets a consumer override any utility from the outside without\n * reaching for `!important`.\n */\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":";;;;;;;;;AASA,SAAgB,GAAG,GAAG,QAA8B;CAClD,OAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B"}

package/dist/lib/icon-defaults.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Apply the Loom icon defaults once at a host's root: size 16, stroke 1.5 —
+ * hairline-first, matching the 1px border language. Every `@lucide/vue` icon
+ * rendered after this call inherits them, so an individual icon declares
+ * `size` or `strokeWidth` only where it deliberately diverges.
+ *
+ * The one standing divergence: a glyph rendered at 12px or below declares
+ * `stroke-width` 2.5 exactly. Stroke lives on the 24 grid and scales with
+ * size, so 1.5 at 12px renders 0.75 device pixels against 1.0 at 16px; 2.5
+ * restores the optical weight.
+ *
+ * The numbers live here, not in each host.
+ *
+ * Call it from the `setup()` of the host's root component — `App.vue`, or the
+ * component a documentation theme wraps its layout in. It resolves to Vue's
+ * `provide()`, so it needs an active component instance: called from a plain
+ * entry module it silently provides nothing, and every icon keeps Lucide's own
+ * 24/2 defaults. There is no app-level alternative, because the injection key
+ * Lucide provides under is not part of its public surface.
+ */
+export declare function applyLoomIconDefaults(): void;
+//# sourceMappingURL=icon-defaults.d.ts.map

package/dist/lib/icon-defaults.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-defaults.d.ts","sourceRoot":"","sources":["../../src/lib/icon-defaults.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,qBAAqB,IAAI,IAAI,CAE5C"}

package/dist/lib/icon-defaults.js

@@ -0,0 +1,32 @@
+import { setLucideProps } from "@lucide/vue";
+//#region src/lib/icon-defaults.ts
+/**
+* Apply the Loom icon defaults once at a host's root: size 16, stroke 1.5 —
+* hairline-first, matching the 1px border language. Every `@lucide/vue` icon
+* rendered after this call inherits them, so an individual icon declares
+* `size` or `strokeWidth` only where it deliberately diverges.
+*
+* The one standing divergence: a glyph rendered at 12px or below declares
+* `stroke-width` 2.5 exactly. Stroke lives on the 24 grid and scales with
+* size, so 1.5 at 12px renders 0.75 device pixels against 1.0 at 16px; 2.5
+* restores the optical weight.
+*
+* The numbers live here, not in each host.
+*
+* Call it from the `setup()` of the host's root component — `App.vue`, or the
+* component a documentation theme wraps its layout in. It resolves to Vue's
+* `provide()`, so it needs an active component instance: called from a plain
+* entry module it silently provides nothing, and every icon keeps Lucide's own
+* 24/2 defaults. There is no app-level alternative, because the injection key
+* Lucide provides under is not part of its public surface.
+*/
+function applyLoomIconDefaults() {
+	setLucideProps({
+		size: 16,
+		strokeWidth: 1.5
+	});
+}
+//#endregion
+export { applyLoomIconDefaults };
+
+//# sourceMappingURL=icon-defaults.js.map

package/dist/lib/icon-defaults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-defaults.js","names":[],"sources":["../../src/lib/icon-defaults.ts"],"sourcesContent":["import { setLucideProps } from \"@lucide/vue\";\n\n/**\n * Apply the Loom icon defaults once at a host's root: size 16, stroke 1.5 —\n * hairline-first, matching the 1px border language. Every `@lucide/vue` icon\n * rendered after this call inherits them, so an individual icon declares\n * `size` or `strokeWidth` only where it deliberately diverges.\n *\n * The one standing divergence: a glyph rendered at 12px or below declares\n * `stroke-width` 2.5 exactly. Stroke lives on the 24 grid and scales with\n * size, so 1.5 at 12px renders 0.75 device pixels against 1.0 at 16px; 2.5\n * restores the optical weight.\n *\n * The numbers live here, not in each host.\n *\n * Call it from the `setup()` of the host's root component — `App.vue`, or the\n * component a documentation theme wraps its layout in. It resolves to Vue's\n * `provide()`, so it needs an active component instance: called from a plain\n * entry module it silently provides nothing, and every icon keeps Lucide's own\n * 24/2 defaults. There is no app-level alternative, because the injection key\n * Lucide provides under is not part of its public surface.\n */\nexport function applyLoomIconDefaults(): void {\n  setLucideProps({ size: 16, strokeWidth: 1.5 });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsBA,SAAgB,wBAA8B;CAC5C,eAAe;EAAE,MAAM;EAAI,aAAa;CAAI,CAAC;AAC/C"}

package/dist/lib/motion.d.ts

@@ -0,0 +1,14 @@
+/**
+ * The list-reveal stagger vocabulary — one source for every overlay that
+ * reveals rows (DropdownMenu, Menubar, Select) and for the Motion
+ * documentation page. Each revealed row is delayed one step after the
+ * previous, capped so a long list does not tail off indefinitely.
+ *
+ * It lives here rather than in each template because it was written into
+ * three of them independently once, which is how the three drifted.
+ */
+export declare const LIST_STAGGER_STEP_MS = 24;
+export declare const LIST_STAGGER_CAP = 5;
+/** The inline `animation-delay` for the i-th revealed row. */
+export declare function listStaggerDelay(i: number): string;
+//# sourceMappingURL=motion.d.ts.map

package/dist/lib/motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../src/lib/motion.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,eAAO,MAAM,oBAAoB,KAAK,CAAC;AACvC,eAAO,MAAM,gBAAgB,IAAI,CAAC;AAElC,8DAA8D;AAC9D,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAElD"}

package/dist/lib/motion.js

@@ -0,0 +1,20 @@
+//#region src/lib/motion.ts
+/**
+* The list-reveal stagger vocabulary — one source for every overlay that
+* reveals rows (DropdownMenu, Menubar, Select) and for the Motion
+* documentation page. Each revealed row is delayed one step after the
+* previous, capped so a long list does not tail off indefinitely.
+*
+* It lives here rather than in each template because it was written into
+* three of them independently once, which is how the three drifted.
+*/
+var LIST_STAGGER_STEP_MS = 24;
+var LIST_STAGGER_CAP = 5;
+/** The inline `animation-delay` for the i-th revealed row. */
+function listStaggerDelay(i) {
+	return `${String(Math.min(i, 5) * 24)}ms`;
+}
+//#endregion
+export { LIST_STAGGER_CAP, LIST_STAGGER_STEP_MS, listStaggerDelay };
+
+//# sourceMappingURL=motion.js.map

package/dist/lib/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.js","names":[],"sources":["../../src/lib/motion.ts"],"sourcesContent":["/**\n * The list-reveal stagger vocabulary — one source for every overlay that\n * reveals rows (DropdownMenu, Menubar, Select) and for the Motion\n * documentation page. Each revealed row is delayed one step after the\n * previous, capped so a long list does not tail off indefinitely.\n *\n * It lives here rather than in each template because it was written into\n * three of them independently once, which is how the three drifted.\n */\nexport const LIST_STAGGER_STEP_MS = 24;\nexport const LIST_STAGGER_CAP = 5;\n\n/** The inline `animation-delay` for the i-th revealed row. */\nexport function listStaggerDelay(i: number): string {\n  return `${String(Math.min(i, LIST_STAGGER_CAP) * LIST_STAGGER_STEP_MS)}ms`;\n}\n"],"mappings":";;;;;;;;;;AASA,IAAa,uBAAuB;AACpC,IAAa,mBAAmB;;AAGhC,SAAgB,iBAAiB,GAAmB;CAClD,OAAO,GAAG,OAAO,KAAK,IAAI,GAAA,CAAmB,IAAA,EAAwB,EAAE;AACzE"}

package/dist/lib/props.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Drops the keys whose value is `undefined`, so a `v-bind` passes only the
+ * props that were actually set.
+ *
+ * Two rules collide to make this necessary, and neither is avoidable.
+ *
+ * Vue treats a prop that is absent and a prop explicitly set to `undefined` as
+ * the same thing — both resolve to the child's default. TypeScript, under
+ * `exactOptionalPropertyTypes`, does not: passing `undefined` to a `foo?: T` is
+ * an error, because the flag exists precisely to tell "missing" apart from
+ * "present and undefined". A Vue template always emits every key it binds, so
+ * forwarding an optional prop straight through (`:open="open"`) hands a child's
+ * `open?: boolean` an explicit `undefined` and fails to compile, while behaving
+ * correctly at run time.
+ *
+ * That distinction is not academic for the components underneath. Reka reads
+ * `undefined` as "no value supplied — manage this yourself", and any concrete
+ * value, `false` included, as "the host owns this". So a control whose
+ * `modelValue` is coerced to `false` on its way through stops being
+ * uncontrolled and becomes permanently, silently off: it still emits its update
+ * event, and its rendered state never moves. That failure has no error and no
+ * warning; it looks like a component that ignores clicks.
+ *
+ * A cast (`open as boolean`) silences the compiler and is the reason to prefer
+ * this: it states that a value is there when the whole point is that one may
+ * not be. Omitting the key says what is true.
+ */
+export declare function optional<T extends Record<string, unknown>>(values: T): {
+    [K in keyof T]?: Exclude<T[K], undefined>;
+};
+//# sourceMappingURL=props.d.ts.map

package/dist/lib/props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/lib/props.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACxD,MAAM,EAAE,CAAC,GACR;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC;CAAE,CAM/C"}

package/dist/lib/props.js

@@ -0,0 +1,37 @@
+//#region src/lib/props.ts
+/**
+* Drops the keys whose value is `undefined`, so a `v-bind` passes only the
+* props that were actually set.
+*
+* Two rules collide to make this necessary, and neither is avoidable.
+*
+* Vue treats a prop that is absent and a prop explicitly set to `undefined` as
+* the same thing — both resolve to the child's default. TypeScript, under
+* `exactOptionalPropertyTypes`, does not: passing `undefined` to a `foo?: T` is
+* an error, because the flag exists precisely to tell "missing" apart from
+* "present and undefined". A Vue template always emits every key it binds, so
+* forwarding an optional prop straight through (`:open="open"`) hands a child's
+* `open?: boolean` an explicit `undefined` and fails to compile, while behaving
+* correctly at run time.
+*
+* That distinction is not academic for the components underneath. Reka reads
+* `undefined` as "no value supplied — manage this yourself", and any concrete
+* value, `false` included, as "the host owns this". So a control whose
+* `modelValue` is coerced to `false` on its way through stops being
+* uncontrolled and becomes permanently, silently off: it still emits its update
+* event, and its rendered state never moves. That failure has no error and no
+* warning; it looks like a component that ignores clicks.
+*
+* A cast (`open as boolean`) silences the compiler and is the reason to prefer
+* this: it states that a value is there when the whole point is that one may
+* not be. Omitting the key says what is true.
+*/
+function optional(values) {
+	const set = {};
+	for (const key of Object.keys(values)) if (values[key] !== void 0) set[key] = values[key];
+	return set;
+}
+//#endregion
+export { optional };
+
+//# sourceMappingURL=props.js.map

package/dist/lib/props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.js","names":[],"sources":["../../src/lib/props.ts"],"sourcesContent":["/**\n * Drops the keys whose value is `undefined`, so a `v-bind` passes only the\n * props that were actually set.\n *\n * Two rules collide to make this necessary, and neither is avoidable.\n *\n * Vue treats a prop that is absent and a prop explicitly set to `undefined` as\n * the same thing — both resolve to the child's default. TypeScript, under\n * `exactOptionalPropertyTypes`, does not: passing `undefined` to a `foo?: T` is\n * an error, because the flag exists precisely to tell \"missing\" apart from\n * \"present and undefined\". A Vue template always emits every key it binds, so\n * forwarding an optional prop straight through (`:open=\"open\"`) hands a child's\n * `open?: boolean` an explicit `undefined` and fails to compile, while behaving\n * correctly at run time.\n *\n * That distinction is not academic for the components underneath. Reka reads\n * `undefined` as \"no value supplied — manage this yourself\", and any concrete\n * value, `false` included, as \"the host owns this\". So a control whose\n * `modelValue` is coerced to `false` on its way through stops being\n * uncontrolled and becomes permanently, silently off: it still emits its update\n * event, and its rendered state never moves. That failure has no error and no\n * warning; it looks like a component that ignores clicks.\n *\n * A cast (`open as boolean`) silences the compiler and is the reason to prefer\n * this: it states that a value is there when the whole point is that one may\n * not be. Omitting the key says what is true.\n */\nexport function optional<T extends Record<string, unknown>>(\n  values: T,\n): { [K in keyof T]?: Exclude<T[K], undefined> } {\n  const set: Record<string, unknown> = {};\n  for (const key of Object.keys(values)) {\n    if (values[key] !== undefined) set[key] = values[key];\n  }\n  return set as { [K in keyof T]?: Exclude<T[K], undefined> };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,SAAgB,SACd,QAC+C;CAC/C,MAAM,MAA+B,CAAC;CACtC,KAAK,MAAM,OAAO,OAAO,KAAK,MAAM,GAClC,IAAI,OAAO,SAAS,KAAA,GAAW,IAAI,OAAO,OAAO;CAEnD,OAAO;AACT"}

package/dist/primitives/Avatar/Avatar.js

@@ -0,0 +1,7 @@
+import Avatar_vue_vue_type_script_setup_true_lang_default from "./Avatar.vue_vue_type_script_setup_true_lang.js";
+//#region src/primitives/Avatar/Avatar.vue
+var Avatar_default = Avatar_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Avatar_default as default };
+
+//# sourceMappingURL=Avatar.js.map

package/dist/primitives/Avatar/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.js","names":[],"sources":["../../../src/primitives/Avatar/Avatar.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Control height, and text size for the initials fallback. */\nexport type AvatarSize = \"sm\" | \"md\" | \"lg\";\n</script>\n\n<script setup lang=\"ts\">\nimport { AvatarRoot, AvatarImage, AvatarFallback } from \"reka-ui\";\nimport { cn } from \"../../lib/cn\";\n\n/**\n * Avatar — a user or agent's picture, with a graceful initials fallback for\n * no `src`, a broken URL, or a still-loading image. Built on Reka UI's\n * Avatar: the image only paints once it has actually finished loading, so\n * the fallback stays visible the whole time until then — first paint is\n * either the real photo or the initials, never a broken-image icon.\n */\nwithDefaults(\n  defineProps<{\n    /** Image URL. Omit it to render the fallback outright. */\n    src?: string;\n    /** Accessible name for the photo — required on `AvatarImage` so a screen reader announces who it is, not just that an image loaded. */\n    alt?: string;\n    /** Initials to show while there is no image, or once one has failed — computed by the caller, never derived from `alt` here. */\n    fallback?: string;\n    /** Control height. */\n    size?: AvatarSize;\n  }>(),\n  {\n    alt: \"\",\n    size: \"md\",\n  },\n);\n</script>\n\n<template>\n  <AvatarRoot\n    :class=\"\n      cn(\n        'relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-muted text-muted-foreground select-none',\n        size === 'sm' && 'h-8 w-8 text-xs',\n        size === 'md' && 'h-10 w-10 text-sm',\n        size === 'lg' && 'h-12 w-12 text-base',\n      )\n    \"\n  >\n    <!-- Reka paints AvatarImage only once the photo has loaded, so scale-in\n         plays exactly on that swap-in — a gentle settle over the fallback. -->\n    <AvatarImage\n      v-if=\"src\"\n      :src=\"src\"\n      :alt=\"alt\"\n      class=\"h-full w-full animate-scale-in object-cover\"\n    />\n    <AvatarFallback class=\"font-medium\">{{ fallback }}</AvatarFallback>\n  </AvatarRoot>\n</template>\n"],"mappings":""}

package/dist/primitives/Avatar/Avatar.vue.d.ts

@@ -0,0 +1,27 @@
+/** Control height, and text size for the initials fallback. */
+export type AvatarSize = "sm" | "md" | "lg";
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{
+    /** Image URL. Omit it to render the fallback outright. */
+    src?: string;
+    /** Accessible name for the photo — required on `AvatarImage` so a screen reader announces who it is, not just that an image loaded. */
+    alt?: string;
+    /** Initials to show while there is no image, or once one has failed — computed by the caller, never derived from `alt` here. */
+    fallback?: string;
+    /** Control height. */
+    size?: AvatarSize;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** Image URL. Omit it to render the fallback outright. */
+    src?: string;
+    /** Accessible name for the photo — required on `AvatarImage` so a screen reader announces who it is, not just that an image loaded. */
+    alt?: string;
+    /** Initials to show while there is no image, or once one has failed — computed by the caller, never derived from `alt` here. */
+    fallback?: string;
+    /** Control height. */
+    size?: AvatarSize;
+}> & Readonly<{}>, {
+    alt: string;
+    size: AvatarSize;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+//# sourceMappingURL=Avatar.vue.d.ts.map

package/dist/primitives/Avatar/Avatar.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/Avatar/Avatar.vue"],"names":[],"mappings":"AA+DA,+DAA+D;AAC/D,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;wBACvB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IASd,0DAA0D;UACpD,MAAM;IACZ,uIAAuI;UACjI,MAAM;IACZ,gIAAgI;eACrH,MAAM;IACjB,sBAAsB;WACf,UAAU;;IAPjB,0DAA0D;UACpD,MAAM;IACZ,uIAAuI;UACjI,MAAM;IACZ,gIAAgI;eACrH,MAAM;IACjB,sBAAsB;WACf,UAAU;;SAJX,MAAM;UAIL,UAAU;6EA2GjB,CAAC"}

package/dist/primitives/Avatar/Avatar.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,33 @@
+import { cn } from "../../lib/cn.js";
+import { createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref, withCtx } from "vue";
+import { AvatarFallback, AvatarImage, AvatarRoot } from "reka-ui";
+//#region src/primitives/Avatar/Avatar.vue?vue&type=script&setup=true&lang.ts
+var Avatar_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "Avatar",
+	props: {
+		src: {},
+		alt: { default: "" },
+		fallback: {},
+		size: { default: "md" }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(AvatarRoot), { class: normalizeClass(unref(cn)("relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-muted text-muted-foreground select-none", __props.size === "sm" && "h-8 w-8 text-xs", __props.size === "md" && "h-10 w-10 text-sm", __props.size === "lg" && "h-12 w-12 text-base")) }, {
+				default: withCtx(() => [__props.src ? (openBlock(), createBlock(unref(AvatarImage), {
+					key: 0,
+					src: __props.src,
+					alt: __props.alt,
+					class: "h-full w-full animate-scale-in object-cover"
+				}, null, 8, ["src", "alt"])) : createCommentVNode("", true), createVNode(unref(AvatarFallback), { class: "font-medium" }, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.fallback), 1)]),
+					_: 1
+				})]),
+				_: 1
+			}, 8, ["class"]);
+		};
+	}
+});
+//#endregion
+export { Avatar_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=Avatar.vue_vue_type_script_setup_true_lang.js.map

package/dist/primitives/Avatar/Avatar.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/primitives/Avatar/Avatar.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Control height, and text size for the initials fallback. */\nexport type AvatarSize = \"sm\" | \"md\" | \"lg\";\n</script>\n\n<script setup lang=\"ts\">\nimport { AvatarRoot, AvatarImage, AvatarFallback } from \"reka-ui\";\nimport { cn } from \"../../lib/cn\";\n\n/**\n * Avatar — a user or agent's picture, with a graceful initials fallback for\n * no `src`, a broken URL, or a still-loading image. Built on Reka UI's\n * Avatar: the image only paints once it has actually finished loading, so\n * the fallback stays visible the whole time until then — first paint is\n * either the real photo or the initials, never a broken-image icon.\n */\nwithDefaults(\n  defineProps<{\n    /** Image URL. Omit it to render the fallback outright. */\n    src?: string;\n    /** Accessible name for the photo — required on `AvatarImage` so a screen reader announces who it is, not just that an image loaded. */\n    alt?: string;\n    /** Initials to show while there is no image, or once one has failed — computed by the caller, never derived from `alt` here. */\n    fallback?: string;\n    /** Control height. */\n    size?: AvatarSize;\n  }>(),\n  {\n    alt: \"\",\n    size: \"md\",\n  },\n);\n</script>\n\n<template>\n  <AvatarRoot\n    :class=\"\n      cn(\n        'relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-muted text-muted-foreground select-none',\n        size === 'sm' && 'h-8 w-8 text-xs',\n        size === 'md' && 'h-10 w-10 text-sm',\n        size === 'lg' && 'h-12 w-12 text-base',\n      )\n    \"\n  >\n    <!-- Reka paints AvatarImage only once the photo has loaded, so scale-in\n         plays exactly on that swap-in — a gentle settle over the fallback. -->\n    <AvatarImage\n      v-if=\"src\"\n      :src=\"src\"\n      :alt=\"alt\"\n      class=\"h-full w-full animate-scale-in object-cover\"\n    />\n    <AvatarFallback class=\"font-medium\">{{ fallback }}</AvatarFallback>\n  </AvatarRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;GAmCE,OAAA,UAAA,GAAA,YAmBa,MAAA,UAAA,GAAA,EAlBV,OAAK,eAAS,MAAA,EAAA,CAAE,CAAA,qIAAuJ,QAAA,SAAI,QAAA,mBAAwC,QAAA,SAAI,QAAA,qBAA0C,QAAA,SAAI,QAAA,qBAAA,CAAA,EAAA,GAAA;IAWtQ,SAAA,cAKE,CAJM,QAAA,OADR,UAAA,GAAA,YAKE,MAAA,WAAA,GAAA;;KAHC,KAAK,QAAA;KACL,KAAK,QAAA;KACN,OAAM;IAER,GAAA,MAAA,GAAA,CAAA,OAAA,KAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAAA,YAAmE,MAAA,cAAA,GAAA,EAAnD,OAAM,cAAa,GAAA;KAAC,SAAA,cAAc,CAAX,gBAAA,gBAAA,QAAA,QAAQ,GAAA,CAAA,CAAA,CAAA"}

package/dist/primitives/Badge/Badge.js

@@ -0,0 +1,7 @@
+import Badge_vue_vue_type_script_setup_true_lang_default, { badgeVariants } from "./Badge.vue_vue_type_script_setup_true_lang.js";
+//#region src/primitives/Badge/Badge.vue
+var Badge_default = Badge_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { badgeVariants, Badge_default as default };
+
+//# sourceMappingURL=Badge.js.map

package/dist/primitives/Badge/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","names":[],"sources":["../../../src/primitives/Badge/Badge.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * Badge — small status / meta chip. The `ai` variant wears the agent weft\n * used to signal AI presence across the product.\n */\nexport type BadgeVariant =\n  \"neutral\" | \"outline\" | \"primary\" | \"success\" | \"warning\" | \"info\" | \"destructive\" | \"ai\";\n\nexport const badgeVariants = cva(\n  \"inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium transition-colors duration-fast\",\n  {\n    variants: {\n      variant: {\n        neutral: \"border-transparent bg-subtle text-subtle-foreground\",\n        outline: \"border-border bg-transparent text-muted-foreground\",\n        primary: \"border-transparent bg-primary/12 text-primary\",\n        success: \"border-transparent bg-success/12 text-success\",\n        warning: \"border-transparent bg-warning/12 text-warning\",\n        info: \"border-transparent bg-info/12 text-info\",\n        destructive: \"border-transparent bg-destructive/12 text-destructive\",\n        ai: \"border-agent/40 bg-agent-muted text-agent\",\n      } satisfies Record<BadgeVariant, string>,\n    },\n    defaultVariants: { variant: \"neutral\" },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** Which status or meta this chip carries. `ai` is reserved for signalling agent-produced or agent-running work. */\n    variant?: BadgeVariant;\n  }>(),\n  { variant: \"neutral\" },\n);\n</script>\n\n<template>\n  <span :class=\"cn(badgeVariants({ variant }))\"><slot /></span>\n</template>\n"],"mappings":""}

package/dist/primitives/Badge/Badge.vue.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Badge — small status / meta chip. The `ai` variant wears the agent weft
+ * used to signal AI presence across the product.
+ */
+export type BadgeVariant = "neutral" | "outline" | "primary" | "success" | "warning" | "info" | "destructive" | "ai";
+export declare const badgeVariants: (props?: ({
+    variant?: "neutral" | "outline" | "primary" | "success" | "warning" | "info" | "destructive" | "ai" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** Which status or meta this chip carries. `ai` is reserved for signalling agent-produced or agent-running work. */
+    variant?: BadgeVariant;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** Which status or meta this chip carries. `ai` is reserved for signalling agent-produced or agent-running work. */
+    variant?: BadgeVariant;
+}> & Readonly<{}>, {
+    variant: BadgeVariant;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=Badge.vue.d.ts.map

package/dist/primitives/Badge/Badge.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/Badge/Badge.vue"],"names":[],"mappings":"AAqDA;;;GAGG;AACH,MAAM,MAAM,YAAY,GACtB,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,aAAa,GAAG,IAAI,CAAC;AAE5F,eAAO,MAAM,aAAa;;8EAiBzB,CAAC;wBACmB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,oHAAoH;cAC1G,YAAY;;IADtB,oHAAoH;cAC1G,YAAY;;aAAZ,YAAY;;cAkCZ,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/primitives/Badge/Badge.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,30 @@
+import { cn } from "../../lib/cn.js";
+import { createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot, unref } from "vue";
+import { cva } from "class-variance-authority";
+//#region src/primitives/Badge/Badge.vue?vue&type=script&setup=true&lang.ts
+var badgeVariants = cva("inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium transition-colors duration-fast", {
+	variants: { variant: {
+		neutral: "border-transparent bg-subtle text-subtle-foreground",
+		outline: "border-border bg-transparent text-muted-foreground",
+		primary: "border-transparent bg-primary/12 text-primary",
+		success: "border-transparent bg-success/12 text-success",
+		warning: "border-transparent bg-warning/12 text-warning",
+		info: "border-transparent bg-info/12 text-info",
+		destructive: "border-transparent bg-destructive/12 text-destructive",
+		ai: "border-agent/40 bg-agent-muted text-agent"
+	} },
+	defaultVariants: { variant: "neutral" }
+});
+var Badge_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "Badge",
+	props: { variant: { default: "neutral" } },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", { class: normalizeClass(unref(cn)(unref(badgeVariants)({ variant: __props.variant }))) }, [renderSlot(_ctx.$slots, "default")], 2);
+		};
+	}
+});
+//#endregion
+export { badgeVariants, Badge_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=Badge.vue_vue_type_script_setup_true_lang.js.map

package/dist/primitives/Badge/Badge.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/primitives/Badge/Badge.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * Badge — small status / meta chip. The `ai` variant wears the agent weft\n * used to signal AI presence across the product.\n */\nexport type BadgeVariant =\n  \"neutral\" | \"outline\" | \"primary\" | \"success\" | \"warning\" | \"info\" | \"destructive\" | \"ai\";\n\nexport const badgeVariants = cva(\n  \"inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium transition-colors duration-fast\",\n  {\n    variants: {\n      variant: {\n        neutral: \"border-transparent bg-subtle text-subtle-foreground\",\n        outline: \"border-border bg-transparent text-muted-foreground\",\n        primary: \"border-transparent bg-primary/12 text-primary\",\n        success: \"border-transparent bg-success/12 text-success\",\n        warning: \"border-transparent bg-warning/12 text-warning\",\n        info: \"border-transparent bg-info/12 text-info\",\n        destructive: \"border-transparent bg-destructive/12 text-destructive\",\n        ai: \"border-agent/40 bg-agent-muted text-agent\",\n      } satisfies Record<BadgeVariant, string>,\n    },\n    defaultVariants: { variant: \"neutral\" },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** Which status or meta this chip carries. `ai` is reserved for signalling agent-produced or agent-running work. */\n    variant?: BadgeVariant;\n  }>(),\n  { variant: \"neutral\" },\n);\n</script>\n\n<template>\n  <span :class=\"cn(badgeVariants({ variant }))\"><slot /></span>\n</template>\n"],"mappings":";;;;AAUA,IAAa,gBAAgB,IAC3B,sHACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,SAAS;EACT,SAAS;EACT,SAAS;EACT,SAAS;EACT,MAAM;EACN,aAAa;EACb,IAAI;CACN,EACF;CACA,iBAAiB,EAAE,SAAS,UAAU;AACxC,CACF;;;;;;GAgBE,OAAA,UAAA,GAAA,mBAA6D,QAAA,EAAtD,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,MAAA,aAAA,CAAa,CAAA,EAAA,SAAG,QAAA,QAAO,CAAA,CAAA,CAAA,EAAA,GAAA,CAAM,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA"}

package/dist/primitives/Button/Button.js

@@ -0,0 +1,7 @@
+import Button_vue_vue_type_script_setup_true_lang_default, { buttonVariants } from "./Button.vue_vue_type_script_setup_true_lang.js";
+//#region src/primitives/Button/Button.vue
+var Button_default = Button_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { buttonVariants, Button_default as default };
+
+//# sourceMappingURL=Button.js.map

package/dist/primitives/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","names":[],"sources":["../../../src/primitives/Button/Button.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * The six weights, and the choice between them is about emphasis rather than\n * colour: `primary` is the one action a screen is asking for, `destructive` is\n * the one it is warning about, and the four between them step down.\n */\nexport type ButtonVariant =\n  \"primary\" | \"secondary\" | \"subtle\" | \"outline\" | \"ghost\" | \"destructive\";\n\nexport type ButtonSize = \"sm\" | \"md\" | \"lg\" | \"icon\" | \"icon-sm\";\n\n/**\n * Button — the workhorse, and the primitive that encodes Loom's press\n * language:\n *\n *   • hover lifts by fill, not by shadow\n *   • active presses down (scale 0.97) — physical, causal feedback\n *   • focus blooms the warp ring\n *   • loading plays a kinetic swap under a shimmer sweep: the label rolls up\n *     and out, a progress arc springs in, the loading text rises last — and\n *     both layers share one grid cell, so the width never jumps mid-film\n *\n * The 50% dim belongs to a *disabled* button only. It is applied off the\n * `disabled` prop rather than off the DOM disabled state, because a loading\n * button is also DOM-disabled yet has to read as \"working\", not\n * \"unavailable\".\n */\nexport const buttonVariants = cva(\n  [\n    \"relative inline-flex items-center justify-center gap-2 whitespace-nowrap select-none\",\n    \"rounded-md text-sm font-medium\",\n    \"[transition:transform_var(--duration-fast)_var(--ease-spring),background-color_var(--duration-fast)_var(--ease-out),color_var(--duration-fast)_var(--ease-out),box-shadow_var(--duration-fast)_var(--ease-out)]\",\n    \"active:scale-[0.97] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring focus-visible:shadow-halo\",\n    \"disabled:pointer-events-none\",\n  ],\n  {\n    // `satisfies` is what keeps the two halves honest. The union above is the\n    // name a consumer imports and the documentation prints; the map below is\n    // the classes. Adding a member to one and not the other stops compiling,\n    // so neither can be the stale copy of the other.\n    variants: {\n      variant: {\n        primary: \"bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm\",\n        secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/70\",\n        subtle: \"bg-transparent text-foreground hover:bg-subtle\",\n        outline: \"border border-input bg-transparent text-foreground hover:bg-subtle\",\n        ghost: \"bg-transparent text-muted-foreground hover:bg-subtle hover:text-foreground\",\n        destructive: \"bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm\",\n      } satisfies Record<ButtonVariant, string>,\n      size: {\n        sm: \"h-8 px-3 text-xs\",\n        md: \"h-9 px-4\",\n        lg: \"h-11 px-6 text-base\",\n        icon: \"h-9 w-9 p-0\",\n        // A square icon button for dense rows, matching `sm`'s height so a row\n        // action lines up with that row's text controls. Still 32px — well\n        // over the 24px minimum target size (WCAG 2.2 SC 2.5.8) — so density\n        // here costs no reachability. It exists because consumers were\n        // reaching for `size=\"icon\"` and then hand-overriding `class=\"h-8 w-8\"`,\n        // which silently re-litigates the target-size question at every call\n        // site.\n        \"icon-sm\": \"h-8 w-8 p-0\",\n      } satisfies Record<ButtonSize, string>,\n    },\n    defaultVariants: { variant: \"primary\", size: \"md\" },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** How much emphasis the action carries. */\n    variant?: ButtonVariant;\n    /** Control height. `icon` and `icon-sm` are square, for a glyph alone. */\n    size?: ButtonSize;\n    /** Locks the button and plays the kinetic swap (label → arc + loadingText). */\n    loading?: boolean;\n    /** Text shown beside the progress arc while loading, e.g. \"Saving…\". */\n    loadingText?: string;\n    /** Unavailable rather than busy — dims to 50% and blocks pointer events. */\n    disabled?: boolean;\n    /** The native button type. Defaults to `button`, never an accidental submit. */\n    type?: \"button\" | \"submit\" | \"reset\";\n  }>(),\n  { variant: \"primary\", size: \"md\", loading: false, disabled: false, type: \"button\" },\n);\n</script>\n\n<template>\n  <button\n    :type=\"type\"\n    :disabled=\"disabled || loading\"\n    :data-loading=\"loading || undefined\"\n    :aria-busy=\"loading || undefined\"\n    :class=\"cn(buttonVariants({ variant, size }), 'group', disabled && 'opacity-50')\"\n  >\n    <!-- The shimmer sweep, while loading. -->\n    <span\n      v-if=\"loading\"\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute inset-0 rounded-md bg-[linear-gradient(110deg,transparent_35%,--alpha(var(--color-primary)/25%)_50%,transparent_65%)] bg-[length:220%_100%] animate-shimmer\"\n    />\n    <!-- The kinetic swap. Both layers live in the same grid cell, so the\n         button keeps the width of the wider one and nothing jumps mid-swap.\n         Only the layer for the current state is exposed to assistive\n         technology; the other is aria-hidden, because opacity alone does not\n         hide anything from a screen reader. -->\n    <span class=\"inline-grid place-items-center\">\n      <!-- Beat 1 — the label rolls up and out. -->\n      <span\n        :aria-hidden=\"loading || undefined\"\n        class=\"[grid-area:1/1] inline-flex items-center gap-2 transition-[opacity,transform] duration-fast ease-out group-data-[loading]:-translate-y-1 group-data-[loading]:opacity-0\"\n      >\n        <slot />\n      </span>\n      <span\n        :aria-hidden=\"!loading || undefined\"\n        class=\"pointer-events-none [grid-area:1/1] inline-flex items-center gap-2\"\n      >\n        <!-- Beat 2 — the progress arc springs in from below. The spinning svg\n             sits inside a wrapper because `animate-spin` owns `transform`: the\n             entry scale and translate have to live on a separate element, or\n             the spin keyframe would overwrite them. It is the same arc the\n             standalone Spinner draws, inlined and aria-hidden — Spinner's\n             role=\"status\" contract is wrong inside an aria-busy button, where\n             it would announce the state twice. -->\n        <span\n          class=\"transition-[opacity,transform] duration-fast ease-spring opacity-0 scale-50 translate-y-1 group-data-[loading]:translate-y-0 group-data-[loading]:scale-100 group-data-[loading]:opacity-100\"\n        >\n          <svg class=\"h-4 w-4 animate-spin\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n            <circle class=\"stroke-current opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke-width=\"4\" />\n            <path\n              class=\"fill-current opacity-75\"\n              d=\"M4 12a8 8 0 0 1 8-8V0C5.373 0 0 5.373 0 12h4z\"\n            />\n          </svg>\n        </span>\n        <!-- Beat 3 — the loading text rises last. The stagger delay applies on\n             entry only (exit keeps delay 0, so the film cuts out clean), and\n             it is cancelled under reduced motion so the instant swap is not\n             lagged by a delay nobody asked for. -->\n        <span\n          v-if=\"loadingText\"\n          class=\"transition-[opacity,transform] duration-100 ease-out opacity-0 translate-y-1 group-data-[loading]:translate-y-0 group-data-[loading]:opacity-100 group-data-[loading]:delay-75 motion-reduce:group-data-[loading]:delay-0\"\n        >\n          {{ loadingText }}\n        </span>\n      </span>\n    </span>\n  </button>\n</template>\n"],"mappings":""}