@ecoma-io/loom 0.5.0 → 0.6.0

package/dist/packages/layouts/split-layout/src/SplitLayout.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SplitLayout.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * SplitLayout — full-page two-panel layout with intrinsic collapse.\n *\n * A SplitLayout extends the Split composition primitive's intrinsic collapse\n * into a full-page application shell: a side panel and a main content area,\n * with an optional full-width header above. It is the layout a two-column\n * application reaches for — a settings page with a nav rail, a documentation\n * site with a sidebar, a chat interface with a contact list.\n *\n * The intrinsic collapse from the Split composition primitive is reused\n * directly — `flex-wrap` plus a `min-width: 50%` guard on the content panel —\n * so the layout derives its own breakpoint from the container's width rather\n * than a viewport media query. Below the collapse width the panels stack\n * vertically; the side panel sits above the content when `side` is `\"left\"`,\n * below it when `side` is `\"right\"`.\n *\n * The header slot spans the full width, above the split row, so an application\n * header bar stays visible regardless of collapse state. Both panels carry\n * gutters that widen at wider breakpoints, so ultrawide viewports add\n * whitespace rails rather than stretching lines of text.\n */\nexport type SplitLayoutGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<SplitLayoutGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which side the primary panel sits on. Controls stacking order when collapsed: \"left\" stacks the side panel above, \"right\" stacks it below. */\n    side?: \"left\" | \"right\";\n    /** Minimum width for the side panel (e.g. \"16rem\"). The content area takes the rest. */\n    minSideWidth?: string;\n    /** Gap between panels. Tightens one notch below sm (except \"none\"). */\n    gap?: SplitLayoutGap;\n  }>(),\n  { side: \"left\", minSideWidth: \"16rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    The root is a full-height column so the header can span the top while the\n    split row fills the rest. `min-h-dvh` makes the layout at least one\n    viewport tall even when content is short, so the side panel background\n    fills the screen rather than stopping at the content's natural height.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header spans the full width, above the split row. It is not sticky\n      here — that is the host's decision, because whether an application\n      header pins depends on the content below it.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel cannot honour its `min-width: 50%`, both panels wrap to full-width\n      — the side panel stacks above or below the content depending on `side`.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :class=\"cn('flex flex-1 flex-row', gap !== 'none' ? gapClass[gap] : undefined)\"\n      :style=\"{ flexWrap: 'wrap' }\"\n    >\n      <!--\n        Document order follows `side`, so screen-reader order matches the\n        visual one and the wrapped stack never contradicts the row: content\n        first when `side=\"right\"` (stack: content above, panel below), side\n        first when `side=\"left\"`. flex-row (never reverse) plus this ordering\n        is what makes the wrap produce content-above-panel for `side=\"right\"`.\n      -->\n      <template v-if=\"side === 'right'\">\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n      </template>\n      <template v-else>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n      </template>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;AAwBA,IAAM,WAA4D;CAChE,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;GA4BE,OAAA,UAAA,GAAA,mBAyFM,OAAA,EAzFA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAMCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBAuEM,OAAA;IAtEH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wBAAyB,QAAA,QAAG,SAAc,SAAS,QAAA,OAAO,KAAA,CAAS,CAAA;IAC5E,OAAO,EAAA,UAAA,OAAA;GASQ,GAAA,CAAA,QAAA,SAAI,WAApB,UAAA,GAAA,mBA6BW,UAAA,EAAA,KAAA,EAAA,GAAA,CAzBT,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,GAKV,mBAUM,OAAA;IATH,OAAK,eAAA;KAA2B,WAAA,QAAA;;;KAAwF,UAAA,QAAA;;IAMxH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wCAAA,CAAA;GAEV,GAAA,CAAA,WAAoB,KAAA,QAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,MAGxB,UAAA,GAAA,mBA6BW,UAAA,EAAA,KAAA,EAAA,GAAA,CAzBT,mBAUM,OAAA;IATH,OAAK,eAAA;KAA2B,WAAA,QAAA;;;KAAwF,UAAA,QAAA;;IAMxH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wCAAA,CAAA;GAEV,GAAA,CAAA,WAAoB,KAAA,QAAA,MAAA,CAAA,GAAA,CAAA,GAKtB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/packages/primitives/accordion/src/Accordion.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Accordion.js","names":[],"sources":["../../../../../packages/primitives/accordion/src/Accordion.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * One collapsible section of the accordion. The list is data rather than markup\n * because the primitive stays free of structure logic — toggling a section emits\n * its `value` and the host decides what that open state means.\n */\nexport interface AccordionItem {\n  /** Unique key for the item. */\n  value: string;\n  /** The heading text shown on the trigger. */\n  label: string;\n  /** Inert: announced as disabled, and toggling it does nothing. */\n  disabled?: boolean;\n}\n\n/**\n * Whether the accordion allows one open item or many. The members mirror Reka's\n * own `AccordionType`, and the template binding is what enforces that.\n */\nexport type AccordionType = \"single\" | \"multiple\";\n\n/**\n * Vertical gap between items, tightening below the `sm` breakpoint where the\n * accordion is more likely inside a narrow panel.\n */\nexport type AccordionGap = \"sm\" | \"md\" | \"lg\";\n</script>\n\n<script setup lang=\"ts\">\nimport {\n  AccordionRoot,\n  AccordionItem as RekaAccordionItem,\n  AccordionTrigger,\n  AccordionContent,\n} from \"reka-ui\";\nimport { ChevronDown } from \"@lucide/vue\";\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { optional } from \"@ecoma-io/loom-core\";\n\n/**\n * Accordion — vertically stacked, expandable sections: each trigger reveals\n * its panel and collapses the rest (single mode) or lets several panels stay\n * open at once (multiple mode). Built on Reka UI's Accordion, which supplies\n * the `accordion`/`accordion-item`/`button`/`region` semantics and the\n * arrow-key navigation between triggers.\n *\n * Items are data rather than markup. A scoped default slot receives each item\n * so the host can render arbitrary content inside a panel — the primitive\n * owns the open/close mechanics and the trigger chrome, not what is inside the\n * panel.\n *\n * `collapsible` only matters in single mode: it governs whether the one open\n * item can be closed again. A non-collapsible single accordion always has\n * exactly one panel open. In multiple mode the prop is ignored — every item\n * can close independently.\n */\nwithDefaults(\n  defineProps<{\n    /** The sections, in order. Each needs a unique `value`. */\n    items: AccordionItem[];\n    /** Whether one or many items can be open at once. */\n    type?: AccordionType;\n    /** In single mode, whether the open item can be closed. Ignored in multiple mode. */\n    collapsible?: boolean;\n    /** Drive the open state from the host with `v-model`; omit it and the accordion owns its own state. */\n    modelValue?: string | string[] | undefined;\n    /** Vertical gap between items. */\n    gap?: AccordionGap;\n  }>(),\n  {\n    type: \"single\",\n    collapsible: true,\n    modelValue: undefined,\n    gap: \"md\",\n  },\n);\n\n// `modelValue: undefined` is load-bearing, not a redundant default — it is\n// what keeps the uncontrolled third state reachable past Vue's absent-Boolean\n// casting. `optional()` in the template is the other half; its docblock\n// carries the reasoning for both.\n\ndefineEmits<{ \"update:modelValue\": [value: string | string[]] }>();\n\nconst GAP_CLASSES: Record<AccordionGap, string> = {\n  sm: \"gap-1 sm:gap-2\",\n  md: \"gap-2 sm:gap-3\",\n  lg: \"gap-3 sm:gap-4\",\n};\n</script>\n\n<template>\n  <AccordionRoot\n    :type=\"type\"\n    :collapsible=\"collapsible\"\n    v-bind=\"optional({ modelValue })\"\n    :class=\"cn('flex flex-col', GAP_CLASSES[gap])\"\n    @update:model-value=\"$emit('update:modelValue', $event)\"\n  >\n    <RekaAccordionItem\n      v-for=\"item in items\"\n      :key=\"item.value\"\n      :value=\"item.value\"\n      :disabled=\"item.disabled ?? false\"\n      class=\"border-b border-border last:border-b-0\"\n    >\n      <AccordionTrigger\n        :class=\"\n          cn(\n            'flex items-center justify-between w-full px-4 py-3 text-sm font-medium text-foreground transition-colors duration-fast ease-out hover:bg-subtle rounded-md',\n            // A disabled trigger must still be reachable by arrow key, so the\n            // pointer is silenced but the element stays in the tab order.\n            'data-[disabled]:pointer-events-none data-[disabled]:text-muted-foreground',\n          )\n        \"\n      >\n        {{ item.label }}\n        <!-- The chevron rotates 180deg when the item opens, matching the\n             `data-[state=open]` attribute Reka sets on the trigger. A\n             transition rather than an animation, because the rotation has no\n             entrance/exit split — it just flips. -->\n        <ChevronDown\n          class=\"h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-fast ease-out data-[state=open]:rotate-180\"\n        />\n      </AccordionTrigger>\n      <!-- Scoped to the open/closed state, never unconditional. Reka's\n           Presence keeps closed content mounted until an animationend arrives,\n           and a mount-only animation never fires a second one — so an\n           unconditional animation class strands invisible content over the\n           page. Scoped, the closed element computes `animation-name: none` and\n           Presence unmounts it at once.\n\n           The rise/fall pair is the existing vocabulary — a height animation\n           keyed to Reka's `--reka-accordion-content-height` would need its own\n           keyframe and utility registration, which belongs in `global.css` and\n           `theme.css` rather than in a single component. -->\n      <AccordionContent\n        class=\"overflow-hidden data-[state=closed]:animate-fade-fall data-[state=open]:animate-fade-rise\"\n      >\n        <div class=\"px-4 pb-3 text-sm text-muted-foreground\">\n          <!-- @slot The content of each panel. Receives the item as a slot prop. -->\n          <slot :item=\"item\" :index=\"items.indexOf(item)\" />\n        </div>\n      </AccordionContent>\n    </RekaAccordionItem>\n  </AccordionRoot>\n</template>\n"],"mappings":""}

package/dist/packages/primitives/accordion/src/Accordion.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Accordion.vue_vue_type_script_setup_true_lang.js","names":["$emit"],"sources":["../../../../../packages/primitives/accordion/src/Accordion.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * One collapsible section of the accordion. The list is data rather than markup\n * because the primitive stays free of structure logic — toggling a section emits\n * its `value` and the host decides what that open state means.\n */\nexport interface AccordionItem {\n  /** Unique key for the item. */\n  value: string;\n  /** The heading text shown on the trigger. */\n  label: string;\n  /** Inert: announced as disabled, and toggling it does nothing. */\n  disabled?: boolean;\n}\n\n/**\n * Whether the accordion allows one open item or many. The members mirror Reka's\n * own `AccordionType`, and the template binding is what enforces that.\n */\nexport type AccordionType = \"single\" | \"multiple\";\n\n/**\n * Vertical gap between items, tightening below the `sm` breakpoint where the\n * accordion is more likely inside a narrow panel.\n */\nexport type AccordionGap = \"sm\" | \"md\" | \"lg\";\n</script>\n\n<script setup lang=\"ts\">\nimport {\n  AccordionRoot,\n  AccordionItem as RekaAccordionItem,\n  AccordionTrigger,\n  AccordionContent,\n} from \"reka-ui\";\nimport { ChevronDown } from \"@lucide/vue\";\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { optional } from \"@ecoma-io/loom-core\";\n\n/**\n * Accordion — vertically stacked, expandable sections: each trigger reveals\n * its panel and collapses the rest (single mode) or lets several panels stay\n * open at once (multiple mode). Built on Reka UI's Accordion, which supplies\n * the `accordion`/`accordion-item`/`button`/`region` semantics and the\n * arrow-key navigation between triggers.\n *\n * Items are data rather than markup. A scoped default slot receives each item\n * so the host can render arbitrary content inside a panel — the primitive\n * owns the open/close mechanics and the trigger chrome, not what is inside the\n * panel.\n *\n * `collapsible` only matters in single mode: it governs whether the one open\n * item can be closed again. A non-collapsible single accordion always has\n * exactly one panel open. In multiple mode the prop is ignored — every item\n * can close independently.\n */\nwithDefaults(\n  defineProps<{\n    /** The sections, in order. Each needs a unique `value`. */\n    items: AccordionItem[];\n    /** Whether one or many items can be open at once. */\n    type?: AccordionType;\n    /** In single mode, whether the open item can be closed. Ignored in multiple mode. */\n    collapsible?: boolean;\n    /** Drive the open state from the host with `v-model`; omit it and the accordion owns its own state. */\n    modelValue?: string | string[] | undefined;\n    /** Vertical gap between items. */\n    gap?: AccordionGap;\n  }>(),\n  {\n    type: \"single\",\n    collapsible: true,\n    modelValue: undefined,\n    gap: \"md\",\n  },\n);\n\n// `modelValue: undefined` is load-bearing, not a redundant default — it is\n// what keeps the uncontrolled third state reachable past Vue's absent-Boolean\n// casting. `optional()` in the template is the other half; its docblock\n// carries the reasoning for both.\n\ndefineEmits<{ \"update:modelValue\": [value: string | string[]] }>();\n\nconst GAP_CLASSES: Record<AccordionGap, string> = {\n  sm: \"gap-1 sm:gap-2\",\n  md: \"gap-2 sm:gap-3\",\n  lg: \"gap-3 sm:gap-4\",\n};\n</script>\n\n<template>\n  <AccordionRoot\n    :type=\"type\"\n    :collapsible=\"collapsible\"\n    v-bind=\"optional({ modelValue })\"\n    :class=\"cn('flex flex-col', GAP_CLASSES[gap])\"\n    @update:model-value=\"$emit('update:modelValue', $event)\"\n  >\n    <RekaAccordionItem\n      v-for=\"item in items\"\n      :key=\"item.value\"\n      :value=\"item.value\"\n      :disabled=\"item.disabled ?? false\"\n      class=\"border-b border-border last:border-b-0\"\n    >\n      <AccordionTrigger\n        :class=\"\n          cn(\n            'flex items-center justify-between w-full px-4 py-3 text-sm font-medium text-foreground transition-colors duration-fast ease-out hover:bg-subtle rounded-md',\n            // A disabled trigger must still be reachable by arrow key, so the\n            // pointer is silenced but the element stays in the tab order.\n            'data-[disabled]:pointer-events-none data-[disabled]:text-muted-foreground',\n          )\n        \"\n      >\n        {{ item.label }}\n        <!-- The chevron rotates 180deg when the item opens, matching the\n             `data-[state=open]` attribute Reka sets on the trigger. A\n             transition rather than an animation, because the rotation has no\n             entrance/exit split — it just flips. -->\n        <ChevronDown\n          class=\"h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-fast ease-out data-[state=open]:rotate-180\"\n        />\n      </AccordionTrigger>\n      <!-- Scoped to the open/closed state, never unconditional. Reka's\n           Presence keeps closed content mounted until an animationend arrives,\n           and a mount-only animation never fires a second one — so an\n           unconditional animation class strands invisible content over the\n           page. Scoped, the closed element computes `animation-name: none` and\n           Presence unmounts it at once.\n\n           The rise/fall pair is the existing vocabulary — a height animation\n           keyed to Reka's `--reka-accordion-content-height` would need its own\n           keyframe and utility registration, which belongs in `global.css` and\n           `theme.css` rather than in a single component. -->\n      <AccordionContent\n        class=\"overflow-hidden data-[state=closed]:animate-fade-fall data-[state=open]:animate-fade-rise\"\n      >\n        <div class=\"px-4 pb-3 text-sm text-muted-foreground\">\n          <!-- @slot The content of each panel. Receives the item as a slot prop. -->\n          <slot :item=\"item\" :index=\"items.indexOf(item)\" />\n        </div>\n      </AccordionContent>\n    </RekaAccordionItem>\n  </AccordionRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAoFA,MAAM,cAA4C;GAChD,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;;GAIE,OAAA,UAAA,GAAA,YAqDgB,MAAA,aAAA,GArDhB,WAqDgB;IApDb,MAAM,QAAA;IACN,aAAa,QAAA;GACN,GAAA,MAAA,QAAA,CAAQ,CAAA,EAAA,YAAG,QAAA,WAAU,CAAA,GAAA;IAC5B,OAAO,MAAA,EAAA,CAAE,CAAA,iBAAkB,YAAY,QAAA,IAAG;IAC1C,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,qBAAsB,MAAM;;IAGpD,SAAA,cAAqB,EADvB,UAAA,IAAA,GAAA,mBA6CoB,UAAA,MAAA,WA5CH,QAAA,QAAR,SAAI;KADb,OAAA,UAAA,GAAA,YA6CoB,MAAA,aAAA,GAAA;MA3CjB,KAAK,KAAK;MACV,OAAO,KAAK;MACZ,UAAU,KAAK,YAAQ;MACxB,OAAM;;MAEN,SAAA,cAkBmB,CAlBnB,YAkBmB,MAAA,gBAAA,GAAA,EAjBhB,OAAK,eAAa,MAAA,EAAA,CAAE,CAAA,8JAAA,2EAAA,CAAA,EAAA,GAAA;OASrB,SAAA,cAAgB,CAAb,gBAAA,gBAAA,KAAK,KAAK,IAAG,KAKhB,CAAA,GAAA,YAEE,MAAA,WAAA,GAAA,EADA,OAAM,kHAAiH,CAAA,CAAA,CAAA;;MAc3H,GAAA,MAAA,CAAA,OAAA,CAAA,GAAA,YAOmB,MAAA,gBAAA,GAAA,EANjB,OAAM,4FAA2F,GAAA;OAEjG,SAAA,cAGM,CAHN,mBAGM,OAHN,YAGM,CADJ,WAAkD,KAAA,QAAA,WAAA;QAArC;QAAO,OAAO,QAAA,MAAM,QAAQ,IAAI"}

package/dist/packages/primitives/alert/src/Alert.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Alert.js","names":[],"sources":["../../../../../packages/primitives/alert/src/Alert.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AlertLabels } from \"@ecoma-io/loom-labels\";\n\n/**\n * The feedback tones, matching Toast and Badge so one functional hue means\n * one thing everywhere. `neutral` is the default because an alert's first\n * job is to be seen at all, not to alarm.\n */\nexport type AlertVariant = \"neutral\" | \"info\" | \"success\" | \"warning\" | \"destructive\";\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it,\n * and exported so a host can build a partial vocabulary against the real\n * thing rather than a transcription of it.\n */\nexport const ALERT_LABELS: AlertLabels = {\n  dismiss: \"Dismiss\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { Info, CircleCheck, TriangleAlert, CircleX, X } from \"@lucide/vue\";\nimport IconButton from \"@ecoma-io/loom-icon-button\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\nimport { cn } from \"@ecoma-io/loom-core\";\n\nconst props = withDefaults(\n  defineProps<{\n    /** Selects the tinted wash and the default icon. */\n    variant?: AlertVariant;\n    /** The headline. Optional — a one-line alert can speak through its body alone. */\n    title?: string;\n    /** The detail line below the title. Longer content belongs in the default slot. */\n    description?: string;\n    /** Shows the dismiss control and lets the alert leave; pair with `v-model:open`. */\n    dismissible?: boolean;\n    /**\n     * Controls visibility. Omit it and the alert owns its own state until\n     * dismissed; pass bindings through `v-model:open` to own it yourself.\n     * Pick one mode per instance and stay there: while the prop is bound the\n     * internal state never moves, so removing the binding later brings back\n     * whatever the host last left visible.\n     */\n    open?: boolean | undefined;\n    /** Names for what the alert says on its own account, as any subset of `AlertLabels`. */\n    labels?: LabelOverrides<AlertLabels>;\n    /**\n     * How assertively the alert announces itself, overriding the per-tone\n     * default. Destructive and warning news are assertive `role=\"alert\"`\n     * interruptions; neutral, info and success are polite `role=\"status\"` —\n     * a \"Saved\" note should not cut off what is being read. `\"off\"` removes\n     * the live semantics for surfaces that are not interruptions at all,\n     * such as a static wall of notices.\n     */\n    live?: \"assertive\" | \"polite\" | \"off\";\n  }>(),\n  {\n    // `undefined` is the uncontrolled state, and only an explicit default\n    // keeps it reachable past Vue's Boolean casting.\n    open: undefined,\n    variant: \"neutral\",\n    dismissible: false,\n  },\n);\n\nconst emit = defineEmits<{ \"update:open\": [value: boolean] }>();\n\n// `<Transition>` cannot pass fallthrough attributes through to its child —\n// a `class` or `@click` on the caller's `<Alert>` would land on the\n// Transition node and vanish. Opting out and forwarding by hand is what\n// keeps this component ordinary from the outside.\ndefineOptions({ inheritAttrs: false });\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"alert\", ALERT_LABELS, () => props.labels);\n\n/**\n * Per-tone accent icon and measured wash. The tinted pairs are the same ones\n * Badge paints (`bg-*-muted text-*-text`) because those are the tokens mixed\n * to hold their contrast in both themes; `-text`, never the bare `warning`,\n * for the failure Badge records. `neutral` carries no icon of its own — an\n * unremarkable note does not need one, and the slot remains available.\n */\nconst TONE_ACCENTS = {\n  // Badge's own neutral pair: the recessed well, not a borrowed status hue.\n  neutral: { icon: undefined, wash: \"bg-subtle text-subtle-foreground\" },\n  info: { icon: Info, wash: \"bg-info-muted text-info-text\" },\n  success: { icon: CircleCheck, wash: \"bg-success-muted text-success-text\" },\n  warning: { icon: TriangleAlert, wash: \"bg-warning-muted text-warning-text\" },\n  destructive: { icon: CircleX, wash: \"bg-destructive-muted text-destructive-text\" },\n} satisfies Record<AlertVariant, { icon: typeof Info | undefined; wash: string }>;\n\n// Controlled/uncontrolled split by hand — there is no Reka root to lean on,\n// and `optional()` exists for exactly the prop-forwarding case this is not.\nconst innerOpen = ref(true);\nconst isOpen = computed(() => props.open ?? innerOpen.value);\n\nfunction dismiss(): void {\n  if (props.open === undefined) innerOpen.value = false;\n  emit(\"update:open\", false);\n}\n\nconst accent = computed(() => TONE_ACCENTS[props.variant]);\n\n// The interruption an alert makes follows its stakes: failure and warning\n// news is the assertive role, the rest polite. A live region that says\n// \"Saved\" on every save should not be cutting off whatever is being read.\nconst live = computed<\"assertive\" | \"polite\" | \"off\">(\n  () =>\n    props.live ??\n    (props.variant === \"destructive\" || props.variant === \"warning\" ? \"assertive\" : \"polite\"),\n);\n</script>\n\n<template>\n  <!-- Enter rises like every revealed surface; exit falls back down it. Vue\n       holds the leaving element itself, so no Presence machinery is needed\n       the way it is under Reka, and the global reduced-motion collapse still\n       ends both phases instantly — dismissal stays immediate for readers who\n       asked for less motion. -->\n  <Transition enter-active-class=\"animate-fade-rise\" leave-active-class=\"animate-fade-fall\">\n    <div\n      v-if=\"isOpen\"\n      v-bind=\"$attrs\"\n      :role=\"live === 'off' ? undefined : live === 'assertive' ? 'alert' : 'status'\"\n      :class=\"cn('flex items-start gap-3 rounded-md border border-transparent p-3', accent?.wash)\"\n    >\n      <slot name=\"icon\">\n        <component\n          :is=\"accent.icon\"\n          v-if=\"accent?.icon\"\n          class=\"mt-0.5 h-4 w-4 shrink-0\"\n          aria-hidden=\"true\"\n        />\n      </slot>\n\n      <div class=\"min-w-0 flex-1 break-words\">\n        <p v-if=\"title\" class=\"text-sm font-medium\">{{ title }}</p>\n        <p v-if=\"description\" :class=\"cn('text-small', title && 'mt-0.5')\">\n          {{ description }}\n        </p>\n        <!-- @slot Anything beyond a title and one line of detail — a list of\n             what failed, a link out. Rendered after the description, inside\n             the tone's measured text colour. -->\n        <div v-if=\"$slots.default\" :class=\"cn((title || description) && 'mt-1')\">\n          <slot />\n        </div>\n      </div>\n\n      <!-- In the flow, not overlaid: an absolutely-positioned close control\n           collides with long titles at narrow widths, which is exactly where\n           alerts wrap. -->\n      <IconButton\n        v-if=\"dismissible\"\n        variant=\"ghost\"\n        size=\"sm\"\n        :label=\"text.dismiss\"\n        class=\"-mr-1 -mt-1 shrink-0\"\n        @click=\"dismiss()\"\n      >\n        <X class=\"h-4 w-4\" aria-hidden=\"true\" />\n      </IconButton>\n    </div>\n  </Transition>\n</template>\n"],"mappings":""}

package/dist/packages/primitives/alert/src/Alert.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Alert.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots"],"sources":["../../../../../packages/primitives/alert/src/Alert.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AlertLabels } from \"@ecoma-io/loom-labels\";\n\n/**\n * The feedback tones, matching Toast and Badge so one functional hue means\n * one thing everywhere. `neutral` is the default because an alert's first\n * job is to be seen at all, not to alarm.\n */\nexport type AlertVariant = \"neutral\" | \"info\" | \"success\" | \"warning\" | \"destructive\";\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it,\n * and exported so a host can build a partial vocabulary against the real\n * thing rather than a transcription of it.\n */\nexport const ALERT_LABELS: AlertLabels = {\n  dismiss: \"Dismiss\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref } from \"vue\";\nimport { Info, CircleCheck, TriangleAlert, CircleX, X } from \"@lucide/vue\";\nimport IconButton from \"@ecoma-io/loom-icon-button\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\nimport { cn } from \"@ecoma-io/loom-core\";\n\nconst props = withDefaults(\n  defineProps<{\n    /** Selects the tinted wash and the default icon. */\n    variant?: AlertVariant;\n    /** The headline. Optional — a one-line alert can speak through its body alone. */\n    title?: string;\n    /** The detail line below the title. Longer content belongs in the default slot. */\n    description?: string;\n    /** Shows the dismiss control and lets the alert leave; pair with `v-model:open`. */\n    dismissible?: boolean;\n    /**\n     * Controls visibility. Omit it and the alert owns its own state until\n     * dismissed; pass bindings through `v-model:open` to own it yourself.\n     * Pick one mode per instance and stay there: while the prop is bound the\n     * internal state never moves, so removing the binding later brings back\n     * whatever the host last left visible.\n     */\n    open?: boolean | undefined;\n    /** Names for what the alert says on its own account, as any subset of `AlertLabels`. */\n    labels?: LabelOverrides<AlertLabels>;\n    /**\n     * How assertively the alert announces itself, overriding the per-tone\n     * default. Destructive and warning news are assertive `role=\"alert\"`\n     * interruptions; neutral, info and success are polite `role=\"status\"` —\n     * a \"Saved\" note should not cut off what is being read. `\"off\"` removes\n     * the live semantics for surfaces that are not interruptions at all,\n     * such as a static wall of notices.\n     */\n    live?: \"assertive\" | \"polite\" | \"off\";\n  }>(),\n  {\n    // `undefined` is the uncontrolled state, and only an explicit default\n    // keeps it reachable past Vue's Boolean casting.\n    open: undefined,\n    variant: \"neutral\",\n    dismissible: false,\n  },\n);\n\nconst emit = defineEmits<{ \"update:open\": [value: boolean] }>();\n\n// `<Transition>` cannot pass fallthrough attributes through to its child —\n// a `class` or `@click` on the caller's `<Alert>` would land on the\n// Transition node and vanish. Opting out and forwarding by hand is what\n// keeps this component ordinary from the outside.\ndefineOptions({ inheritAttrs: false });\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"alert\", ALERT_LABELS, () => props.labels);\n\n/**\n * Per-tone accent icon and measured wash. The tinted pairs are the same ones\n * Badge paints (`bg-*-muted text-*-text`) because those are the tokens mixed\n * to hold their contrast in both themes; `-text`, never the bare `warning`,\n * for the failure Badge records. `neutral` carries no icon of its own — an\n * unremarkable note does not need one, and the slot remains available.\n */\nconst TONE_ACCENTS = {\n  // Badge's own neutral pair: the recessed well, not a borrowed status hue.\n  neutral: { icon: undefined, wash: \"bg-subtle text-subtle-foreground\" },\n  info: { icon: Info, wash: \"bg-info-muted text-info-text\" },\n  success: { icon: CircleCheck, wash: \"bg-success-muted text-success-text\" },\n  warning: { icon: TriangleAlert, wash: \"bg-warning-muted text-warning-text\" },\n  destructive: { icon: CircleX, wash: \"bg-destructive-muted text-destructive-text\" },\n} satisfies Record<AlertVariant, { icon: typeof Info | undefined; wash: string }>;\n\n// Controlled/uncontrolled split by hand — there is no Reka root to lean on,\n// and `optional()` exists for exactly the prop-forwarding case this is not.\nconst innerOpen = ref(true);\nconst isOpen = computed(() => props.open ?? innerOpen.value);\n\nfunction dismiss(): void {\n  if (props.open === undefined) innerOpen.value = false;\n  emit(\"update:open\", false);\n}\n\nconst accent = computed(() => TONE_ACCENTS[props.variant]);\n\n// The interruption an alert makes follows its stakes: failure and warning\n// news is the assertive role, the rest polite. A live region that says\n// \"Saved\" on every save should not be cutting off whatever is being read.\nconst live = computed<\"assertive\" | \"polite\" | \"off\">(\n  () =>\n    props.live ??\n    (props.variant === \"destructive\" || props.variant === \"warning\" ? \"assertive\" : \"polite\"),\n);\n</script>\n\n<template>\n  <!-- Enter rises like every revealed surface; exit falls back down it. Vue\n       holds the leaving element itself, so no Presence machinery is needed\n       the way it is under Reka, and the global reduced-motion collapse still\n       ends both phases instantly — dismissal stays immediate for readers who\n       asked for less motion. -->\n  <Transition enter-active-class=\"animate-fade-rise\" leave-active-class=\"animate-fade-fall\">\n    <div\n      v-if=\"isOpen\"\n      v-bind=\"$attrs\"\n      :role=\"live === 'off' ? undefined : live === 'assertive' ? 'alert' : 'status'\"\n      :class=\"cn('flex items-start gap-3 rounded-md border border-transparent p-3', accent?.wash)\"\n    >\n      <slot name=\"icon\">\n        <component\n          :is=\"accent.icon\"\n          v-if=\"accent?.icon\"\n          class=\"mt-0.5 h-4 w-4 shrink-0\"\n          aria-hidden=\"true\"\n        />\n      </slot>\n\n      <div class=\"min-w-0 flex-1 break-words\">\n        <p v-if=\"title\" class=\"text-sm font-medium\">{{ title }}</p>\n        <p v-if=\"description\" :class=\"cn('text-small', title && 'mt-0.5')\">\n          {{ description }}\n        </p>\n        <!-- @slot Anything beyond a title and one line of detail — a list of\n             what failed, a link out. Rendered after the description, inside\n             the tone's measured text colour. -->\n        <div v-if=\"$slots.default\" :class=\"cn((title || description) && 'mt-1')\">\n          <slot />\n        </div>\n      </div>\n\n      <!-- In the flow, not overlaid: an absolutely-positioned close control\n           collides with long titles at narrow widths, which is exactly where\n           alerts wrap. -->\n      <IconButton\n        v-if=\"dismissible\"\n        variant=\"ghost\"\n        size=\"sm\"\n        :label=\"text.dismiss\"\n        class=\"-mr-1 -mt-1 shrink-0\"\n        @click=\"dismiss()\"\n      >\n        <X class=\"h-4 w-4\" aria-hidden=\"true\" />\n      </IconButton>\n    </div>\n  </Transition>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAeA,IAAa,eAA4B,EACvC,SAAS,UACX;;;;;;;;;;;;;;;;;;;;;EAUA,MAAM,QAAQ;EAuCd,MAAM,OAAO;EAWb,MAAM,OAAO,UAAU,SAAS,oBAAoB,MAAM,MAAM;;;;;;;;EAShE,MAAM,eAAe;GAEnB,SAAS;IAAE,MAAM,KAAA;IAAW,MAAM;GAAmC;GACrE,MAAM;IAAE,MAAM;IAAM,MAAM;GAA+B;GACzD,SAAS;IAAE,MAAM;IAAa,MAAM;GAAqC;GACzE,SAAS;IAAE,MAAM;IAAe,MAAM;GAAqC;GAC3E,aAAa;IAAE,MAAM;IAAS,MAAM;GAA6C;EACnF;EAIA,MAAM,YAAY,IAAI,IAAI;EAC1B,MAAM,SAAS,eAAe,MAAM,QAAQ,UAAU,KAAK;EAE3D,SAAS,UAAgB;GACvB,IAAI,MAAM,SAAS,KAAA,GAAW,UAAU,QAAQ;GAChD,KAAK,eAAe,KAAK;EAC3B;EAEA,MAAM,SAAS,eAAe,aAAa,MAAM,QAAQ;EAKzD,MAAM,OAAO,eAET,MAAM,SACL,MAAM,YAAY,iBAAiB,MAAM,YAAY,YAAY,cAAc,SACpF;;GASE,OAAA,UAAA,GAAA,YA2Ca,YAAA;IA3CD,sBAAmB;IAAoB,sBAAmB;;IACpE,SAAA,cAyCM,CAxCE,OAAA,SADR,UAAA,GAAA,mBAyCM,OAzCN,WAyCM,EAAA,KAAA,EAAA,GAvCIA,KAAAA,QAAM;KACb,MAAM,KAAA,UAAI,QAAa,KAAA,IAAY,KAAA,UAAI,cAAA,UAAA;KACvC,OAAO,MAAA,EAAA,CAAE,CAAA,mEAAoE,OAAA,OAAQ,IAAI;;KAE1F,WAOO,KAAA,QAAA,QAAA,CAAA,SAAA,CAJG,OAAA,OAAQ,QAFhB,UAAA,GAAA,YAKE,wBAJK,OAAA,MAAO,IAAI,GAAA;;MAEhB,OAAM;MACN,eAAY;;KAIhB,mBAWM,OAXN,YAWM;MAVK,QAAA,SAAT,UAAA,GAAA,mBAA2D,KAA3D,YAA2D,gBAAZ,QAAA,KAAK,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;MAC3C,QAAA,eAAT,UAAA,GAAA,mBAEI,KAAA;;OAFmB,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,cAAe,QAAA,SAAK,QAAA,CAAA;MAC/C,GAAA,gBAAA,QAAA,WAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;MAKLC,KAAAA,OAAO,WAAlB,UAAA,GAAA,mBAEM,OAAA;;OAFsB,OAAK,eAAE,MAAA,EAAA,CAAE,EAAE,QAAA,SAAS,QAAA,gBAAW,MAAA,CAAA;MACzD,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;;KAQJ,QAAA,eADR,UAAA,GAAA,YASa,MAAA,kBAAA,GAAA;;MAPX,SAAQ;MACR,MAAK;MACJ,OAAO,MAAA,IAAA,CAAI,CAAC;MACb,OAAM;MACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAO;;MAEf,SAAA,cAAwC,CAAxC,YAAwC,MAAA,CAAA,GAAA;OAArC,OAAM;OAAU,eAAY"}

package/dist/packages/primitives/alert-dialog/src/AlertDialog.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AlertDialog.js","names":[],"sources":["../../../../../packages/primitives/alert-dialog/src/AlertDialog.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AlertDialogLabels } from \"@ecoma-io/loom-labels\";\n/**\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it, and\n * exported so a host can build a partial vocabulary against the real thing.\n */\nexport const ALERT_DIALOG_LABELS: AlertDialogLabels = {\n  confirm: \"Confirm\",\n  cancel: \"Cancel\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport {\n  AlertDialogRoot,\n  AlertDialogTrigger,\n  AlertDialogPortal,\n  AlertDialogOverlay,\n  AlertDialogContent,\n  AlertDialogTitle,\n  AlertDialogDescription,\n  AlertDialogAction,\n  AlertDialogCancel,\n} from \"reka-ui\";\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { optional } from \"@ecoma-io/loom-core\";\nimport { useSplitAttrs } from \"@ecoma-io/loom-core\";\nimport { buttonVariants } from \"@ecoma-io/loom-button\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\n\n/**\n * AlertDialog — the modal that demands a decision before anything else\n * happens: \"Delete this permanently?\", \"Discard unsaved changes?\".\n *\n * It is `Dialog` with the exits removed, and that is the whole of the\n * difference. A `Dialog` is dismissible: Esc, a click on the overlay and the\n * close glyph all mean \"not now\", which is right for a task surface. An\n * AlertDialog has no such exit — a click outside does nothing, there is no\n * close glyph, and the only ways out are the two buttons. It carries\n * `role=\"alertdialog\"`, so its description is announced with its name rather\n * than waiting to be navigated to.\n *\n * Reach for it only when dismissing by accident would lose work or destroy\n * something. Reach for `Dialog` for everything else — an AlertDialog used for\n * an ordinary form is a control that traps a reader for no reason.\n *\n * There is deliberately no body slot. A question that needs body content is a\n * task, and a task is a `Dialog`; keeping the surface to a title, a\n * consequence line and two buttons is what stops this component from becoming\n * an undismissible form.\n *\n * Initial focus lands on **Cancel**, never on the action. A destructive\n * confirm that focuses \"Delete\" turns a reflexive Enter — from a reader who\n * has not finished the sentence — into a deletion. Reka does this in\n * `AlertDialogContent`; the test pins it, because it is the single behaviour\n * this component exists to guarantee.\n */\nconst props = withDefaults(\n  defineProps<{\n    /** Drive the alert from the host with `v-model:open`; omit it and the alert owns its own state. */\n    open?: boolean | undefined;\n    /** The accessible name, and the decision being asked for. State the consequence (\"Delete scene?\"), not \"Are you sure?\". */\n    title: string;\n    /** The consequence line, announced with the title rather than found later. Omit it only when the title already says everything. */\n    description?: string;\n    /** Paints the action in the destructive language. The verb in `labels.confirm` is what carries the meaning; this only adds emphasis to it. */\n    destructive?: boolean;\n    /**\n     * The two button names, as any subset of `AlertDialogLabels` — what it\n     * leaves out stays as the host's `provideLoomLabels` vocabulary left it,\n     * and then as Loom's English.\n     *\n     * **`confirm` is meant to be set here on all but the rarest alert**, since\n     * the verb is what tells a reader what the button does; `cancel` belongs in\n     * the application's vocabulary, where it is written once.\n     */\n    labels?: LabelOverrides<AlertDialogLabels>;\n  }>(),\n  // `open: undefined` is load-bearing, not a redundant default — it is what\n  // keeps the uncontrolled third state reachable past Vue's absent-Boolean\n  // casting, and `optional()` in the template is the other half. Its docblock\n  // carries the reasoning for both.\n  {\n    open: undefined,\n    destructive: false,\n  },\n);\n\ndefineEmits<{\n  /** The reader chose the action. The alert does not close itself — the host decides, so a failed save can keep it open. */\n  confirm: [];\n  /** The reader backed out, by the cancel button or by Esc. */\n  cancel: [];\n  /** A close was requested. Fires alongside `confirm` and `cancel`, so a host driving `v-model:open` needs only this one. */\n  \"update:open\": [value: boolean];\n}>();\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"alertDialog\", ALERT_DIALOG_LABELS, () => props.labels);\n\n// The root renders no DOM node at all, so fallthrough attributes would be\n// dropped on the floor rather than landing anywhere. They go to the panel,\n// which is the only element this component reliably renders — there may be no\n// trigger at all when the host drives `open` itself.\n//\n// `class` is pulled out of that spread and merged through `cn()` instead:\n// spreading it alongside the panel's own `:class` only concatenates the two\n// lists, so a caller's width silently wins or loses depending on which utility\n// Tailwind happened to emit last.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest: panelAttrs } = useSplitAttrs();\n\n// Reka wires `aria-describedby` to its own description id unconditionally, so\n// a panel rendered without a description ships a reference to an element that\n// does not exist. That is not cosmetic here: `role=\"alertdialog\"` earns its\n// keep by having the description announced with the name, and a dangling IDREF\n// announces nothing. Clearing the attribute is what removes it — fallthrough\n// attributes are merged after Reka's own, and Vue drops an attribute bound to\n// `undefined`. A caller's own `aria-describedby` still wins, because\n// `panelAttrs` is spread last.\nconst panelBindings = computed(() => ({\n  ...(props.description ? {} : { \"aria-describedby\": undefined }),\n  ...panelAttrs.value,\n}));\n</script>\n\n<template>\n  <AlertDialogRoot v-bind=\"optional({ open })\" @update:open=\"$emit('update:open', $event)\">\n    <!-- @slot The control that opens the alert. Optional — omit it and drive\n         the alert entirely from the host with `v-model:open`. -->\n    <AlertDialogTrigger v-if=\"$slots.trigger\" as-child>\n      <slot name=\"trigger\" />\n    </AlertDialogTrigger>\n\n    <AlertDialogPortal>\n      <!-- The scrim token Dialog uses, and its paired exit, so a dismissed\n           alert fades rather than cuts. It is inert here: Reka's\n           AlertDialogContent prevents both `pointerDownOutside` and\n           `interactOutside`, so a click lands on nothing. That is the point —\n           an accidental click at the edge of the screen must not be able to\n           answer the question. -->\n      <AlertDialogOverlay\n        class=\"fixed inset-0 z-overlay bg-foreground/scrim data-[state=open]:animate-fade data-[state=closed]:animate-fade-out\"\n      />\n      <AlertDialogContent\n        v-bind=\"panelBindings\"\n        :data-destructive=\"destructive || undefined\"\n        :class=\"\n          cn(\n            'fixed left-1/2 top-1/2 z-overlay -translate-x-1/2 -translate-y-1/2',\n            // One width, and no `size` prop to vary it. A decision has one\n            // shape; the wider panels exist on Dialog because an authoring\n            // surface needs them, and there is no authoring surface here.\n            'w-[min(92vw,32rem)]',\n            'rounded-lg border border-border bg-popover p-6 text-popover-foreground shadow-lg outline-none',\n            // Both states scoped, never unconditional. Reka's Presence keeps\n            // closed content mounted until an animationend arrives, and a\n            // mount-only animation never fires a second one — which here would\n            // strand a full-screen, input-blocking overlay over a page with no\n            // alert on it. The paired exit answers the entrance as Dialog's\n            // does, and stays safe under `prefers-reduced-motion`: the 0.01ms\n            // collapse still fires `animationend`, so Presence still unmounts.\n            'data-[state=open]:animate-scale-in data-[state=closed]:animate-scale-out',\n            attrs.class as string,\n          )\n        \"\n        @escape-key-down=\"$emit('cancel')\"\n      >\n        <AlertDialogTitle class=\"text-base font-semibold\">{{ title }}</AlertDialogTitle>\n        <AlertDialogDescription v-if=\"description\" class=\"mt-1 text-sm text-muted-foreground\">\n          {{ description }}\n        </AlertDialogDescription>\n\n        <div class=\"mt-6 flex items-center justify-end gap-2\">\n          <!-- Cancel is first in the DOM as well as first visually, so the\n               order a screen reader reads matches the order the eye does. It is\n               also the element Reka focuses on open. -->\n          <AlertDialogCancel\n            :class=\"buttonVariants({ variant: 'subtle' })\"\n            @click=\"$emit('cancel')\"\n          >\n            {{ text.cancel }}\n          </AlertDialogCancel>\n          <!-- The destructive paint is emphasis, not the signal. What tells a\n               reader this button destroys something is the verb in its label,\n               which is why `labels.confirm` is meant to be replaced rather than\n               left as \"Confirm\". -->\n          <AlertDialogAction\n            :class=\"buttonVariants({ variant: destructive ? 'destructive' : 'primary' })\"\n            @click=\"$emit('confirm')\"\n          >\n            {{ text.confirm }}\n          </AlertDialogAction>\n        </div>\n      </AlertDialogContent>\n    </AlertDialogPortal>\n  </AlertDialogRoot>\n</template>\n"],"mappings":""}

package/dist/packages/primitives/alert-dialog/src/AlertDialog.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AlertDialog.vue_vue_type_script_setup_true_lang.js","names":["$emit","$slots"],"sources":["../../../../../packages/primitives/alert-dialog/src/AlertDialog.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AlertDialogLabels } from \"@ecoma-io/loom-labels\";\n/**\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it, and\n * exported so a host can build a partial vocabulary against the real thing.\n */\nexport const ALERT_DIALOG_LABELS: AlertDialogLabels = {\n  confirm: \"Confirm\",\n  cancel: \"Cancel\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport {\n  AlertDialogRoot,\n  AlertDialogTrigger,\n  AlertDialogPortal,\n  AlertDialogOverlay,\n  AlertDialogContent,\n  AlertDialogTitle,\n  AlertDialogDescription,\n  AlertDialogAction,\n  AlertDialogCancel,\n} from \"reka-ui\";\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { optional } from \"@ecoma-io/loom-core\";\nimport { useSplitAttrs } from \"@ecoma-io/loom-core\";\nimport { buttonVariants } from \"@ecoma-io/loom-button\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\n\n/**\n * AlertDialog — the modal that demands a decision before anything else\n * happens: \"Delete this permanently?\", \"Discard unsaved changes?\".\n *\n * It is `Dialog` with the exits removed, and that is the whole of the\n * difference. A `Dialog` is dismissible: Esc, a click on the overlay and the\n * close glyph all mean \"not now\", which is right for a task surface. An\n * AlertDialog has no such exit — a click outside does nothing, there is no\n * close glyph, and the only ways out are the two buttons. It carries\n * `role=\"alertdialog\"`, so its description is announced with its name rather\n * than waiting to be navigated to.\n *\n * Reach for it only when dismissing by accident would lose work or destroy\n * something. Reach for `Dialog` for everything else — an AlertDialog used for\n * an ordinary form is a control that traps a reader for no reason.\n *\n * There is deliberately no body slot. A question that needs body content is a\n * task, and a task is a `Dialog`; keeping the surface to a title, a\n * consequence line and two buttons is what stops this component from becoming\n * an undismissible form.\n *\n * Initial focus lands on **Cancel**, never on the action. A destructive\n * confirm that focuses \"Delete\" turns a reflexive Enter — from a reader who\n * has not finished the sentence — into a deletion. Reka does this in\n * `AlertDialogContent`; the test pins it, because it is the single behaviour\n * this component exists to guarantee.\n */\nconst props = withDefaults(\n  defineProps<{\n    /** Drive the alert from the host with `v-model:open`; omit it and the alert owns its own state. */\n    open?: boolean | undefined;\n    /** The accessible name, and the decision being asked for. State the consequence (\"Delete scene?\"), not \"Are you sure?\". */\n    title: string;\n    /** The consequence line, announced with the title rather than found later. Omit it only when the title already says everything. */\n    description?: string;\n    /** Paints the action in the destructive language. The verb in `labels.confirm` is what carries the meaning; this only adds emphasis to it. */\n    destructive?: boolean;\n    /**\n     * The two button names, as any subset of `AlertDialogLabels` — what it\n     * leaves out stays as the host's `provideLoomLabels` vocabulary left it,\n     * and then as Loom's English.\n     *\n     * **`confirm` is meant to be set here on all but the rarest alert**, since\n     * the verb is what tells a reader what the button does; `cancel` belongs in\n     * the application's vocabulary, where it is written once.\n     */\n    labels?: LabelOverrides<AlertDialogLabels>;\n  }>(),\n  // `open: undefined` is load-bearing, not a redundant default — it is what\n  // keeps the uncontrolled third state reachable past Vue's absent-Boolean\n  // casting, and `optional()` in the template is the other half. Its docblock\n  // carries the reasoning for both.\n  {\n    open: undefined,\n    destructive: false,\n  },\n);\n\ndefineEmits<{\n  /** The reader chose the action. The alert does not close itself — the host decides, so a failed save can keep it open. */\n  confirm: [];\n  /** The reader backed out, by the cancel button or by Esc. */\n  cancel: [];\n  /** A close was requested. Fires alongside `confirm` and `cancel`, so a host driving `v-model:open` needs only this one. */\n  \"update:open\": [value: boolean];\n}>();\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"alertDialog\", ALERT_DIALOG_LABELS, () => props.labels);\n\n// The root renders no DOM node at all, so fallthrough attributes would be\n// dropped on the floor rather than landing anywhere. They go to the panel,\n// which is the only element this component reliably renders — there may be no\n// trigger at all when the host drives `open` itself.\n//\n// `class` is pulled out of that spread and merged through `cn()` instead:\n// spreading it alongside the panel's own `:class` only concatenates the two\n// lists, so a caller's width silently wins or loses depending on which utility\n// Tailwind happened to emit last.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest: panelAttrs } = useSplitAttrs();\n\n// Reka wires `aria-describedby` to its own description id unconditionally, so\n// a panel rendered without a description ships a reference to an element that\n// does not exist. That is not cosmetic here: `role=\"alertdialog\"` earns its\n// keep by having the description announced with the name, and a dangling IDREF\n// announces nothing. Clearing the attribute is what removes it — fallthrough\n// attributes are merged after Reka's own, and Vue drops an attribute bound to\n// `undefined`. A caller's own `aria-describedby` still wins, because\n// `panelAttrs` is spread last.\nconst panelBindings = computed(() => ({\n  ...(props.description ? {} : { \"aria-describedby\": undefined }),\n  ...panelAttrs.value,\n}));\n</script>\n\n<template>\n  <AlertDialogRoot v-bind=\"optional({ open })\" @update:open=\"$emit('update:open', $event)\">\n    <!-- @slot The control that opens the alert. Optional — omit it and drive\n         the alert entirely from the host with `v-model:open`. -->\n    <AlertDialogTrigger v-if=\"$slots.trigger\" as-child>\n      <slot name=\"trigger\" />\n    </AlertDialogTrigger>\n\n    <AlertDialogPortal>\n      <!-- The scrim token Dialog uses, and its paired exit, so a dismissed\n           alert fades rather than cuts. It is inert here: Reka's\n           AlertDialogContent prevents both `pointerDownOutside` and\n           `interactOutside`, so a click lands on nothing. That is the point —\n           an accidental click at the edge of the screen must not be able to\n           answer the question. -->\n      <AlertDialogOverlay\n        class=\"fixed inset-0 z-overlay bg-foreground/scrim data-[state=open]:animate-fade data-[state=closed]:animate-fade-out\"\n      />\n      <AlertDialogContent\n        v-bind=\"panelBindings\"\n        :data-destructive=\"destructive || undefined\"\n        :class=\"\n          cn(\n            'fixed left-1/2 top-1/2 z-overlay -translate-x-1/2 -translate-y-1/2',\n            // One width, and no `size` prop to vary it. A decision has one\n            // shape; the wider panels exist on Dialog because an authoring\n            // surface needs them, and there is no authoring surface here.\n            'w-[min(92vw,32rem)]',\n            'rounded-lg border border-border bg-popover p-6 text-popover-foreground shadow-lg outline-none',\n            // Both states scoped, never unconditional. Reka's Presence keeps\n            // closed content mounted until an animationend arrives, and a\n            // mount-only animation never fires a second one — which here would\n            // strand a full-screen, input-blocking overlay over a page with no\n            // alert on it. The paired exit answers the entrance as Dialog's\n            // does, and stays safe under `prefers-reduced-motion`: the 0.01ms\n            // collapse still fires `animationend`, so Presence still unmounts.\n            'data-[state=open]:animate-scale-in data-[state=closed]:animate-scale-out',\n            attrs.class as string,\n          )\n        \"\n        @escape-key-down=\"$emit('cancel')\"\n      >\n        <AlertDialogTitle class=\"text-base font-semibold\">{{ title }}</AlertDialogTitle>\n        <AlertDialogDescription v-if=\"description\" class=\"mt-1 text-sm text-muted-foreground\">\n          {{ description }}\n        </AlertDialogDescription>\n\n        <div class=\"mt-6 flex items-center justify-end gap-2\">\n          <!-- Cancel is first in the DOM as well as first visually, so the\n               order a screen reader reads matches the order the eye does. It is\n               also the element Reka focuses on open. -->\n          <AlertDialogCancel\n            :class=\"buttonVariants({ variant: 'subtle' })\"\n            @click=\"$emit('cancel')\"\n          >\n            {{ text.cancel }}\n          </AlertDialogCancel>\n          <!-- The destructive paint is emphasis, not the signal. What tells a\n               reader this button destroys something is the verb in its label,\n               which is why `labels.confirm` is meant to be replaced rather than\n               left as \"Confirm\". -->\n          <AlertDialogAction\n            :class=\"buttonVariants({ variant: destructive ? 'destructive' : 'primary' })\"\n            @click=\"$emit('confirm')\"\n          >\n            {{ text.confirm }}\n          </AlertDialogAction>\n        </div>\n      </AlertDialogContent>\n    </AlertDialogPortal>\n  </AlertDialogRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;AAQA,IAAa,sBAAyC;CACpD,SAAS;CACT,QAAQ;AACV;;;;;;;;;;;;;;;;;;;;;;;EAiDA,MAAM,QAAQ;EA2Cd,MAAM,OAAO,UAAU,eAAe,2BAA2B,MAAM,MAAM;EAY7E,MAAM,EAAE,OAAO,MAAM,eAAe,cAAc;EAUlD,MAAM,gBAAgB,gBAAgB;GACpC,GAAI,MAAM,cAAc,CAAC,IAAI,EAAE,oBAAoB,KAAA,EAAU;GAC7D,GAAG,WAAW;EAChB,EAAE;;GAIA,OAAA,UAAA,GAAA,YAqEkB,MAAA,eAAA,GArElB,WAAyB,MAqEP,QAAA,CArEe,CAAA,EAAA,MAAG,QAAA,KAAI,CAAA,GAAA,EAAM,iBAAW,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,eAAgB,MAAM,GAAA,CAAA,GAAA;IAGpF,SAAA,cAEqB,CAFKC,KAAAA,OAAO,WAAjC,UAAA,GAAA,YAEqB,MAAA,kBAAA,GAAA;;KAFqB,YAAA;;KACxC,SAAA,cAAuB,CAAvB,WAAuB,KAAA,QAAA,SAAA,CAAA,CAAA;;IAGzB,CAAA,KAAA,mBAAA,IAAA,IAAA,GAAA,YA6DoB,MAAA,iBAAA,GAAA,MAAA;KAtDlB,SAAA,cAEE,CAFF,YAEE,MAAA,kBAAA,GAAA,EADA,OAAM,kHAAiH,CAAA,GAEzH,YAkDqB,MAAA,kBAAA,GAlDrB,WACU,cAiDW,OAjDE;MACpB,oBAAkB,QAAA,eAAe,KAAA;MACjC,OAAkB,MAAA,EAAA,CAAE,CAAA,sEAAA,uBAAA,iGAAA,4EAAglC,MAAA,KAAA,CAAK,CAAC,KAAA;MAmB1mC,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAED,KAAAA,MAAK,QAAA;;MAEvB,SAAA,cAAgF;OAAhF,YAAgF,MAAA,gBAAA,GAAA,EAA9D,OAAM,0BAAyB,GAAA;QAAC,SAAA,cAAW,CAAR,gBAAA,gBAAA,QAAA,KAAK,GAAA,CAAA,CAAA,CAAA;;;OAC5B,QAAA,eAA9B,UAAA,GAAA,YAEyB,MAAA,sBAAA,GAAA;;QAFkB,OAAM;;QAC/C,SAAA,cAAiB,CAAd,gBAAA,gBAAA,QAAA,WAAW,GAAA,CAAA,CAAA,CAAA;;;OAGhB,mBAoBM,OApBN,YAoBM,CAhBJ,YAKoB,MAAA,iBAAA,GAAA;QAJjB,OAAK,eAAE,MAAA,cAAA,CAAc,CAAA,EAAA,SAAA,SAAA,CAAA,CAAA;QACrB,SAAK,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,QAAA;;QAEb,SAAA,cAAiB,CAAd,gBAAA,gBAAA,MAAA,IAAA,CAAI,CAAC,MAAM,GAAA,CAAA,CAAA,CAAA;;OAMhB,GAAA,GAAA,CAAA,OAAA,CAAA,GAAA,YAKoB,MAAA,iBAAA,GAAA;QAJjB,OAAK,eAAE,MAAA,cAAA,CAAc,CAAA,EAAA,SAAY,QAAA,cAAW,gBAAA,UAAA,CAAA,CAAA;QAC5C,SAAK,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,SAAA;;QAEb,SAAA,cAAkB,CAAf,gBAAA,gBAAA,MAAA,IAAA,CAAI,CAAC,OAAO,GAAA,CAAA,CAAA,CAAA"}

package/dist/packages/primitives/avatar/src/Avatar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Avatar.js","names":[],"sources":["../../../../../packages/primitives/avatar/src/Avatar.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/** Control height, and the text size the initials fallback prints at. */\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n\n/** A circle, or a rounded square tile. */\nexport type AvatarShape = \"circle\" | \"square\";\n\n/**\n * Which visual treatment the avatar receives. `accent` applies the accent\n * colour as a rim, signalling a second semantic category distinct from the\n * default — a different role, origin, or mode.\n */\nexport type AvatarVariant = \"default\" | \"accent\";\n\nexport const avatarVariants = cva(\n  \"relative inline-flex shrink-0 items-center justify-center overflow-hidden select-none\",\n  {\n    // `satisfies` keeps the two halves honest: the unions above are the names a\n    // consumer imports and the documentation prints, the maps below are the\n    // classes. Adding a member to one and not the other stops compiling — which\n    // is what the three inline `size === '…' &&` conditionals this replaced\n    // could not do, and the reason five sizes could not stay written that way.\n    variants: {\n      size: {\n        // `text-xs` twice, deliberately. It is the smallest step Tailwind's own\n        // scale has, and the step below it — Loom's `text-micro` — is a name\n        // tailwind-merge classifies as a text *colour* rather than a size, so\n        // `cn()` drops it the moment the force map adds `text-muted-foreground`\n        // after it. Two initials at 12px still fit inside 24px.\n        xs: \"h-6 w-6 text-xs\",\n        sm: \"h-8 w-8 text-xs\",\n        md: \"h-10 w-10 text-sm\",\n        lg: \"h-12 w-12 text-base\",\n        xl: \"h-16 w-16 text-lg\",\n      } satisfies Record<AvatarSize, string>,\n      force: {\n        default: \"bg-muted text-muted-foreground\",\n        // The accent rim. Two signals, not one: the rim's *presence* is what a\n        // reader who cannot resolve the hue still sees — a default avatar has no\n        // edge at all — and the hidden `accentLabel` is what a reader who sees\n        // no avatar hears. The corner is left alone on purpose, because the\n        // corner is Indicator's: a presence dot pinned there would land on top\n        // of anything this component drew.\n        accent: \"border-2 border-accent bg-accent-muted text-accent-text\",\n      } satisfies Record<AvatarVariant, string>,\n    },\n    defaultVariants: { size: \"md\", force: \"default\" },\n  },\n);\n\n/**\n * A square avatar's corner radius, one value per size rather than the control\n * radius throughout. `rounded-md` is calibrated against a ~36px control; on a\n * 24px tile it is a third of the side, where a milled fillet stops reading as\n * a corner and starts reading as a blob, and on a 64px one it has almost\n * disappeared. Stepping it holds the corner between a sixth and a quarter of\n * the side at every size — the band the control radius already sits in — which\n * is the nesting law applied to a tile whose \"padding\" is its own edge.\n */\nconst SQUARE_RADIUS = {\n  xs: \"rounded-sm\",\n  sm: \"rounded-md\",\n  md: \"rounded-md\",\n  lg: \"rounded-lg\",\n  xl: \"rounded-xl\",\n} satisfies Record<AvatarSize, string>;\n\n/**\n * The rounding for one size and shape. A circle is one value at every size; a\n * square is not, which is why the radius cannot live in the `cva` map beside\n * the heights. Kept off the public surface deliberately: a consumer wanting an\n * avatar-shaped tile should render an `Avatar`, not reassemble one.\n */\nfunction avatarRadius(size: AvatarSize, shape: AvatarShape): string {\n  return shape === \"circle\" ? \"rounded-full\" : SQUARE_RADIUS[size];\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { AvatarRoot, AvatarImage, AvatarFallback } from \"reka-ui\";\nimport { cn, useSplitAttrs } from \"@ecoma-io/loom-core\";\n\n/**\n * Avatar — a user'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 *\n * Two neighbours are worth naming. Several faces standing for one thing — the\n * people on a task, the agents on a run — are an `AvatarGroup`, which owns the\n * overlap, the stacking order and the \"+3\" so a row of them is one object to a\n * screen reader rather than N unrelated images. Anything pinned onto the\n * avatar's corner — a presence dot, an unread count — is an `Indicator`\n * wrapped around it; this component deliberately draws nothing there.\n */\nconst props = withDefaults(\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    /** A circle, or a rounded square tile. Square suits a subject a circle would misdescribe — an organisation, a project, a repository — and takes a radius that steps with the size rather than one fixed value. */\n    shape?: AvatarShape;\n    /** Which visual treatment the avatar receives. `accent` applies the accent rim and `accentLabel` for a screen reader, so the distinction never rests on the hue alone. */\n    variant?: AvatarVariant;\n    /** What a screen reader announces after the name of an `accent` avatar — \"Accent\" by default, so the accent never rests on the hue alone. Localise it. Set it empty when something outside already says so — `AvatarGroup` does, because each row item composes its own name — and nothing is added for a `default` avatar either way. */\n    accentLabel?: string;\n  }>(),\n  {\n    alt: \"\",\n    size: \"md\",\n    shape: \"circle\",\n    variant: \"default\",\n    accentLabel: \"Accent\",\n  },\n);\n\n// One rendered node, and it is the right home for every fallthrough attribute\n// — but `class` still goes the long way round, through `cn()`. Vue's own merge\n// only concatenates, so the `bg-subtle` an AvatarGroup paints its overflow tile\n// with would win or lose against this root's `bg-muted` depending on the order\n// Tailwind happened to emit the two rules in, rather than on intent.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest } = useSplitAttrs();\n\nconst radius = computed(() => avatarRadius(props.size, props.shape));\n</script>\n\n<template>\n  <AvatarRoot\n    v-bind=\"rest\"\n    :data-variant=\"variant\"\n    :class=\"cn(avatarVariants({ size, force: variant }), radius, attrs.class as string)\"\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    <!-- The half of the accent signal a rim cannot carry. It sits after the\n         image so it is announced as a qualifier on the name rather than in\n         place of it, and it is dropped entirely for an empty `accentLabel`: a\n         wrapper that has already worked the qualifier into its own name would\n         otherwise leave a second copy of it in the tree. -->\n    <span v-if=\"variant === 'accent' && accentLabel\" class=\"sr-only\">{{ accentLabel }}</span>\n  </AvatarRoot>\n</template>\n"],"mappings":""}

package/dist/packages/primitives/avatar/src/Avatar.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Avatar.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../packages/primitives/avatar/src/Avatar.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/** Control height, and the text size the initials fallback prints at. */\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n\n/** A circle, or a rounded square tile. */\nexport type AvatarShape = \"circle\" | \"square\";\n\n/**\n * Which visual treatment the avatar receives. `accent` applies the accent\n * colour as a rim, signalling a second semantic category distinct from the\n * default — a different role, origin, or mode.\n */\nexport type AvatarVariant = \"default\" | \"accent\";\n\nexport const avatarVariants = cva(\n  \"relative inline-flex shrink-0 items-center justify-center overflow-hidden select-none\",\n  {\n    // `satisfies` keeps the two halves honest: the unions above are the names a\n    // consumer imports and the documentation prints, the maps below are the\n    // classes. Adding a member to one and not the other stops compiling — which\n    // is what the three inline `size === '…' &&` conditionals this replaced\n    // could not do, and the reason five sizes could not stay written that way.\n    variants: {\n      size: {\n        // `text-xs` twice, deliberately. It is the smallest step Tailwind's own\n        // scale has, and the step below it — Loom's `text-micro` — is a name\n        // tailwind-merge classifies as a text *colour* rather than a size, so\n        // `cn()` drops it the moment the force map adds `text-muted-foreground`\n        // after it. Two initials at 12px still fit inside 24px.\n        xs: \"h-6 w-6 text-xs\",\n        sm: \"h-8 w-8 text-xs\",\n        md: \"h-10 w-10 text-sm\",\n        lg: \"h-12 w-12 text-base\",\n        xl: \"h-16 w-16 text-lg\",\n      } satisfies Record<AvatarSize, string>,\n      force: {\n        default: \"bg-muted text-muted-foreground\",\n        // The accent rim. Two signals, not one: the rim's *presence* is what a\n        // reader who cannot resolve the hue still sees — a default avatar has no\n        // edge at all — and the hidden `accentLabel` is what a reader who sees\n        // no avatar hears. The corner is left alone on purpose, because the\n        // corner is Indicator's: a presence dot pinned there would land on top\n        // of anything this component drew.\n        accent: \"border-2 border-accent bg-accent-muted text-accent-text\",\n      } satisfies Record<AvatarVariant, string>,\n    },\n    defaultVariants: { size: \"md\", force: \"default\" },\n  },\n);\n\n/**\n * A square avatar's corner radius, one value per size rather than the control\n * radius throughout. `rounded-md` is calibrated against a ~36px control; on a\n * 24px tile it is a third of the side, where a milled fillet stops reading as\n * a corner and starts reading as a blob, and on a 64px one it has almost\n * disappeared. Stepping it holds the corner between a sixth and a quarter of\n * the side at every size — the band the control radius already sits in — which\n * is the nesting law applied to a tile whose \"padding\" is its own edge.\n */\nconst SQUARE_RADIUS = {\n  xs: \"rounded-sm\",\n  sm: \"rounded-md\",\n  md: \"rounded-md\",\n  lg: \"rounded-lg\",\n  xl: \"rounded-xl\",\n} satisfies Record<AvatarSize, string>;\n\n/**\n * The rounding for one size and shape. A circle is one value at every size; a\n * square is not, which is why the radius cannot live in the `cva` map beside\n * the heights. Kept off the public surface deliberately: a consumer wanting an\n * avatar-shaped tile should render an `Avatar`, not reassemble one.\n */\nfunction avatarRadius(size: AvatarSize, shape: AvatarShape): string {\n  return shape === \"circle\" ? \"rounded-full\" : SQUARE_RADIUS[size];\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { AvatarRoot, AvatarImage, AvatarFallback } from \"reka-ui\";\nimport { cn, useSplitAttrs } from \"@ecoma-io/loom-core\";\n\n/**\n * Avatar — a user'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 *\n * Two neighbours are worth naming. Several faces standing for one thing — the\n * people on a task, the agents on a run — are an `AvatarGroup`, which owns the\n * overlap, the stacking order and the \"+3\" so a row of them is one object to a\n * screen reader rather than N unrelated images. Anything pinned onto the\n * avatar's corner — a presence dot, an unread count — is an `Indicator`\n * wrapped around it; this component deliberately draws nothing there.\n */\nconst props = withDefaults(\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    /** A circle, or a rounded square tile. Square suits a subject a circle would misdescribe — an organisation, a project, a repository — and takes a radius that steps with the size rather than one fixed value. */\n    shape?: AvatarShape;\n    /** Which visual treatment the avatar receives. `accent` applies the accent rim and `accentLabel` for a screen reader, so the distinction never rests on the hue alone. */\n    variant?: AvatarVariant;\n    /** What a screen reader announces after the name of an `accent` avatar — \"Accent\" by default, so the accent never rests on the hue alone. Localise it. Set it empty when something outside already says so — `AvatarGroup` does, because each row item composes its own name — and nothing is added for a `default` avatar either way. */\n    accentLabel?: string;\n  }>(),\n  {\n    alt: \"\",\n    size: \"md\",\n    shape: \"circle\",\n    variant: \"default\",\n    accentLabel: \"Accent\",\n  },\n);\n\n// One rendered node, and it is the right home for every fallthrough attribute\n// — but `class` still goes the long way round, through `cn()`. Vue's own merge\n// only concatenates, so the `bg-subtle` an AvatarGroup paints its overflow tile\n// with would win or lose against this root's `bg-muted` depending on the order\n// Tailwind happened to emit the two rules in, rather than on intent.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest } = useSplitAttrs();\n\nconst radius = computed(() => avatarRadius(props.size, props.shape));\n</script>\n\n<template>\n  <AvatarRoot\n    v-bind=\"rest\"\n    :data-variant=\"variant\"\n    :class=\"cn(avatarVariants({ size, force: variant }), radius, attrs.class as string)\"\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    <!-- The half of the accent signal a rim cannot carry. It sits after the\n         image so it is announced as a qualifier on the name rather than in\n         place of it, and it is dropped entirely for an empty `accentLabel`: a\n         wrapper that has already worked the qualifier into its own name would\n         otherwise leave a second copy of it in the tree. -->\n    <span v-if=\"variant === 'accent' && accentLabel\" class=\"sr-only\">{{ accentLabel }}</span>\n  </AvatarRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,IAAa,iBAAiB,IAC5B,yFACA;CAME,UAAU;EACR,MAAM;GAMJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EACA,OAAO;GACL,SAAS;GAOT,QAAQ;EACV;CACF;CACA,iBAAiB;EAAE,MAAM;EAAM,OAAO;CAAU;AAClD,CACF;;;;;;;;;;AAWA,IAAM,gBAAgB;CACpB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;AAQA,SAAS,aAAa,MAAkB,OAA4B;CAClE,OAAO,UAAU,WAAW,iBAAiB,cAAc;AAC7D;;;;;;;;;;;;;;EAsBA,MAAM,QAAQ;EAgCd,MAAM,EAAE,OAAO,SAAS,cAAc;EAEtC,MAAM,SAAS,eAAe,aAAa,MAAM,MAAM,MAAM,KAAK,CAAC;;GAIjE,OAAA,UAAA,GAAA,YAoBa,MAAA,UAAA,GApBb,WACU,MAmBG,IAAA,GAnBC;IACX,gBAAc,QAAA;IACd,OAAO,MAAA,EAAA,CAAE,CAAC,MAAA,cAAA,CAAc,CAAA;KAAA,MAAG,QAAA;KAAI,OAAS,QAAA;IAAO,CAAA,GAAK,OAAA,OAAQ,MAAA,KAAA,CAAK,CAAC,KAAK;;IAIxE,SAAA,cAKE;KAJM,QAAA,OADR,UAAA,GAAA,YAKE,MAAA,WAAA,GAAA;;MAHC,KAAK,QAAA;MACL,KAAK,QAAA;MACN,OAAM;;KAER,YAAmE,MAAA,cAAA,GAAA,EAAnD,OAAM,cAAa,GAAA;MAAC,SAAA,cAAc,CAAX,gBAAA,gBAAA,QAAA,QAAQ,GAAA,CAAA,CAAA,CAAA;;;KAMnC,QAAA,YAAO,YAAiB,QAAA,eAApC,UAAA,GAAA,mBAAyF,QAAzF,YAAyF,gBAArB,QAAA,WAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA"}

package/dist/packages/primitives/avatar-group/src/AvatarGroup.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AvatarGroup.js","names":[],"sources":["../../../../../packages/primitives/avatar-group/src/AvatarGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AvatarGroupLabels } from \"@ecoma-io/loom-labels\";\nimport type { AvatarShape, AvatarSize, AvatarVariant } from \"@ecoma-io/loom-avatar\";\n\n/** One face in the row. */\nexport interface AvatarGroupItem {\n  /** Image URL. Omit it and this face renders `fallback` instead. */\n  src?: string;\n  /** Who this face is. It is what a screen reader reads for this member, whether or not the image ever loads — so it is the field to fill in even when there is no photo. */\n  alt?: string;\n  /** Initials shown while there is no image, or once one has failed. */\n  fallback?: string;\n  /** Which variant this member uses. Defaults to the group's own `variant`, so a row that mixes members states it per member and a row of one kind states it once. */\n  variant?: AvatarVariant;\n}\n\n/** The surface the row sits on, which the separating ring matches. */\nexport type AvatarGroupSurface = \"background\" | \"card\" | \"sunken\" | \"popover\";\n\n/**\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it, and\n * exported so a host can build a partial vocabulary against the real thing.\n */\nexport const AVATAR_GROUP_LABELS: AvatarGroupLabels = {\n  overflow: ({ count }) => `${String(count)} more`,\n  accent: ({ name }) => (name ? `${name}, Accent` : \"Accent\"),\n};\n\n/**\n * How far each face tucks under the one before it — a quarter of its own width\n * at every size, so a row of `xs` avatars reads at the same density as a row of\n * `xl` ones. A fixed offset would look like a badly spaced flex row at the top\n * of the scale and swallow the initials at the bottom of it.\n */\nconst OVERLAP = {\n  xs: \"-ml-1.5\",\n  sm: \"-ml-2\",\n  md: \"-ml-2.5\",\n  lg: \"-ml-3\",\n  xl: \"-ml-4\",\n} satisfies Record<AvatarSize, string>;\n\n/**\n * The ring that cuts each face out of the one it overlaps. Without it two\n * portraits of similar tone merge into one shape, so it is structural rather\n * than decorative — which is also why it has to be the colour of whatever\n * surrounds the row, something only the caller knows. The names are\n * Indicator's, for the same reason and with the same meaning.\n */\nconst SURFACE_RING = {\n  background: \"ring-background\",\n  card: \"ring-card\",\n  sunken: \"ring-sunken\",\n  popover: \"ring-popover\",\n} satisfies Record<AvatarGroupSurface, string>;\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport Avatar from \"@ecoma-io/loom-avatar\";\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { optional } from \"@ecoma-io/loom-core\";\nimport { useSplitAttrs } from \"@ecoma-io/loom-core\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\n\n/**\n * AvatarGroup — the faces on one thing, overlapped into a single row: the\n * people assigned to a task, the agents on a run, the members of a workspace.\n * Past `max` of them the rest collapse into a counter, so the row's width is\n * bounded by the layout rather than by how many people happen to be involved.\n *\n * Reach for a plain `Avatar` when there is one subject, and for a real list of\n * rows when the reader needs to *act* on the members — a stack of overlapping\n * portraits is an at-a-glance summary, not a control. Nothing here is\n * focusable or clickable on purpose: the moment a face has to be pressable it\n * wants a row, a menu or a set of chips, each of which can carry a name and a\n * keyboard path that a 40px circle cannot.\n *\n * To a screen reader the row is one object — a labelled list of members ending\n * in \"3 more\" — rather than N unrelated images. Each face is announced by its\n * `alt` and nothing else: the portrait itself is hidden from assistive\n * technology and the name supplied beside it, which is what keeps the reading\n * identical whether the photo loaded, failed, or was never given.\n */\nconst props = withDefaults(\n  defineProps<{\n    /** The members, in the order they are shown. The first is the one painted on top. */\n    avatars: AvatarGroupItem[];\n    /** How many faces render before the rest collapse into the counter. Values below 1 are treated as 1 — a row of nothing but \"+5\" identifies nobody. */\n    max?: number;\n    /** Height of every face in the row, and of the counter — one of `Avatar`'s five sizes, `xs` through `xl`. */\n    size?: AvatarSize;\n    /** `circle` or `square`, forwarded to every face so the row reads as one shape. */\n    shape?: AvatarShape;\n    /** `default` or `accent`, for members that do not name their own — set it to `accent` for a row where every member uses the accent variant. */\n    variant?: AvatarVariant;\n    /** The group's accessible name: \"Assignees\", \"Reviewers\", \"Members\". */\n    label?: string;\n    /** The surface the row sits on, so the ring separating the faces matches what surrounds them. */\n    surface?: AvatarGroupSurface;\n    /**\n     * Names for the counter and for an accent member, as any subset of\n     * `AvatarGroupLabels` — the rest stay as the host's `provideLoomLabels`\n     * vocabulary left them, and then as Loom's English.\n     *\n     * The per-instance case is a row where \"more\" is the wrong word for what\n     * was left out: three reviewers, three members, three files.\n     */\n    labels?: LabelOverrides<AvatarGroupLabels>;\n  }>(),\n  {\n    max: 4,\n    size: \"md\",\n    shape: \"circle\",\n    variant: \"default\",\n    surface: \"background\",\n  },\n);\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"avatarGroup\", AVATAR_GROUP_LABELS, () => props.labels);\n\n// One rendered node, and it takes every fallthrough attribute — but `class`\n// goes through `cn()`, so a caller's `gap-1` can beat the row's own layout\n// utilities instead of tying with them on stylesheet order.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest } = useSplitAttrs();\n\n/**\n * At least one face always renders. `max = 0` is the boundary that decides\n * this: a group collapsed to nothing but \"+5\" has spent an avatar row saying\n * only that some people exist, which is strictly less than one face and a\n * count would have said.\n */\nconst shown = computed(() => props.avatars.slice(0, Math.max(1, Math.trunc(props.max))));\n\n/** How many members the row did not have room for. Zero renders no counter at all. */\nconst hidden = computed(() => props.avatars.length - shown.value.length);\n\n/** What the counter prints. `+3` is the layout; the sentence below is the information. */\nconst printed = computed(() => `+${String(hidden.value)}`);\n\nconst overlap = computed(() => OVERLAP[props.size]);\n\n/** `ring-2` in the surface colour, on every face including the counter. */\nconst ring = computed(() => cn(\"ring-2\", SURFACE_RING[props.surface]));\n\n/**\n * What a screen reader reads for one member. The accent qualifier is composed\n * here rather than left to `Avatar`'s own hidden label, because the portrait\n * inside each item is `aria-hidden` — the item says the name once, in one\n * voice, whichever state the image is in.\n */\nfunction memberName(item: AvatarGroupItem): string {\n  const who = (item.alt ?? item.fallback ?? \"\").trim();\n  if ((item.variant ?? props.variant) !== \"accent\") return who;\n  return text.value.accent({ name: who });\n}\n</script>\n\n<template>\n  <!-- `role=\"list\"` on a div rather than a real `<ul>`, and the reason is the\n       page this is documented on. VitePress styles `.vp-doc li + li` with a top\n       margin and `.vp-doc ul` with a disc marker and a left indent, unlayered —\n       and unlayered CSS beats every Tailwind utility, which all live in\n       `@layer utilities`. A genuine list element here arrives bulleted, indented\n       and stepping 8px downhill per face. The roles are the semantics; the\n       elements were only ever carrying them.\n\n       The explicit attributes sit before `v-bind`, so a caller who names the\n       group with `aria-labelledby` instead of `label` keeps their own value\n       rather than having an unset prop overwrite it. -->\n  <div\n    v-if=\"avatars.length > 0\"\n    role=\"list\"\n    :aria-label=\"label\"\n    v-bind=\"rest\"\n    :class=\"cn('flex items-center', attrs.class as string)\"\n  >\n    <!-- The first face on top, each later one tucked under it. `z-index` is not\n         automatic on a flex row — painting order alone puts the *last* sibling\n         over its neighbours, which reads as a stack dealt backwards — and it\n         needs the positioned parent this span provides. -->\n    <span\n      v-for=\"(item, index) in shown\"\n      :key=\"`${String(index)}-${item.src ?? item.fallback ?? ''}`\"\n      role=\"listitem\"\n      :style=\"{ zIndex: shown.length - index }\"\n      :class=\"cn('relative', index > 0 && overlap)\"\n    >\n      <!-- `accent-label` is cleared because the item beside it has already\n           worked the qualifier into one name; left at its default the row would\n           carry two copies of the accent label per accent member. -->\n      <Avatar\n        aria-hidden=\"true\"\n        accent-label=\"\"\n        v-bind=\"optional({ src: item.src, alt: item.alt, fallback: item.fallback })\"\n        :size=\"size\"\n        :shape=\"shape\"\n        :variant=\"item.variant ?? variant\"\n        :class=\"ring\"\n      />\n      <span class=\"sr-only\">{{ memberName(item) }}</span>\n    </span>\n\n    <!-- The counter is a face-shaped tile rather than a shape of its own, so\n         the row keeps one rhythm: same size, same corner, same ring, and the\n         neutral well instead of a portrait's fill so it never reads as a\n         person. It sits under everything, at the back of the stack. -->\n    <span v-if=\"hidden > 0\" role=\"listitem\" :style=\"{ zIndex: 0 }\" :class=\"cn('relative', overlap)\">\n      <Avatar\n        aria-hidden=\"true\"\n        :fallback=\"printed\"\n        :size=\"size\"\n        :shape=\"shape\"\n        :class=\"cn(ring, 'bg-subtle text-subtle-foreground tabular')\"\n      />\n      <span class=\"sr-only\">{{ text.overflow({ count: hidden }) }}</span>\n    </span>\n  </div>\n</template>\n"],"mappings":""}

package/dist/packages/primitives/avatar-group/src/AvatarGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AvatarGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../packages/primitives/avatar-group/src/AvatarGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AvatarGroupLabels } from \"@ecoma-io/loom-labels\";\nimport type { AvatarShape, AvatarSize, AvatarVariant } from \"@ecoma-io/loom-avatar\";\n\n/** One face in the row. */\nexport interface AvatarGroupItem {\n  /** Image URL. Omit it and this face renders `fallback` instead. */\n  src?: string;\n  /** Who this face is. It is what a screen reader reads for this member, whether or not the image ever loads — so it is the field to fill in even when there is no photo. */\n  alt?: string;\n  /** Initials shown while there is no image, or once one has failed. */\n  fallback?: string;\n  /** Which variant this member uses. Defaults to the group's own `variant`, so a row that mixes members states it per member and a row of one kind states it once. */\n  variant?: AvatarVariant;\n}\n\n/** The surface the row sits on, which the separating ring matches. */\nexport type AvatarGroupSurface = \"background\" | \"card\" | \"sunken\" | \"popover\";\n\n/**\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it, and\n * exported so a host can build a partial vocabulary against the real thing.\n */\nexport const AVATAR_GROUP_LABELS: AvatarGroupLabels = {\n  overflow: ({ count }) => `${String(count)} more`,\n  accent: ({ name }) => (name ? `${name}, Accent` : \"Accent\"),\n};\n\n/**\n * How far each face tucks under the one before it — a quarter of its own width\n * at every size, so a row of `xs` avatars reads at the same density as a row of\n * `xl` ones. A fixed offset would look like a badly spaced flex row at the top\n * of the scale and swallow the initials at the bottom of it.\n */\nconst OVERLAP = {\n  xs: \"-ml-1.5\",\n  sm: \"-ml-2\",\n  md: \"-ml-2.5\",\n  lg: \"-ml-3\",\n  xl: \"-ml-4\",\n} satisfies Record<AvatarSize, string>;\n\n/**\n * The ring that cuts each face out of the one it overlaps. Without it two\n * portraits of similar tone merge into one shape, so it is structural rather\n * than decorative — which is also why it has to be the colour of whatever\n * surrounds the row, something only the caller knows. The names are\n * Indicator's, for the same reason and with the same meaning.\n */\nconst SURFACE_RING = {\n  background: \"ring-background\",\n  card: \"ring-card\",\n  sunken: \"ring-sunken\",\n  popover: \"ring-popover\",\n} satisfies Record<AvatarGroupSurface, string>;\n</script>\n\n<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport Avatar from \"@ecoma-io/loom-avatar\";\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { optional } from \"@ecoma-io/loom-core\";\nimport { useSplitAttrs } from \"@ecoma-io/loom-core\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\n\n/**\n * AvatarGroup — the faces on one thing, overlapped into a single row: the\n * people assigned to a task, the agents on a run, the members of a workspace.\n * Past `max` of them the rest collapse into a counter, so the row's width is\n * bounded by the layout rather than by how many people happen to be involved.\n *\n * Reach for a plain `Avatar` when there is one subject, and for a real list of\n * rows when the reader needs to *act* on the members — a stack of overlapping\n * portraits is an at-a-glance summary, not a control. Nothing here is\n * focusable or clickable on purpose: the moment a face has to be pressable it\n * wants a row, a menu or a set of chips, each of which can carry a name and a\n * keyboard path that a 40px circle cannot.\n *\n * To a screen reader the row is one object — a labelled list of members ending\n * in \"3 more\" — rather than N unrelated images. Each face is announced by its\n * `alt` and nothing else: the portrait itself is hidden from assistive\n * technology and the name supplied beside it, which is what keeps the reading\n * identical whether the photo loaded, failed, or was never given.\n */\nconst props = withDefaults(\n  defineProps<{\n    /** The members, in the order they are shown. The first is the one painted on top. */\n    avatars: AvatarGroupItem[];\n    /** How many faces render before the rest collapse into the counter. Values below 1 are treated as 1 — a row of nothing but \"+5\" identifies nobody. */\n    max?: number;\n    /** Height of every face in the row, and of the counter — one of `Avatar`'s five sizes, `xs` through `xl`. */\n    size?: AvatarSize;\n    /** `circle` or `square`, forwarded to every face so the row reads as one shape. */\n    shape?: AvatarShape;\n    /** `default` or `accent`, for members that do not name their own — set it to `accent` for a row where every member uses the accent variant. */\n    variant?: AvatarVariant;\n    /** The group's accessible name: \"Assignees\", \"Reviewers\", \"Members\". */\n    label?: string;\n    /** The surface the row sits on, so the ring separating the faces matches what surrounds them. */\n    surface?: AvatarGroupSurface;\n    /**\n     * Names for the counter and for an accent member, as any subset of\n     * `AvatarGroupLabels` — the rest stay as the host's `provideLoomLabels`\n     * vocabulary left them, and then as Loom's English.\n     *\n     * The per-instance case is a row where \"more\" is the wrong word for what\n     * was left out: three reviewers, three members, three files.\n     */\n    labels?: LabelOverrides<AvatarGroupLabels>;\n  }>(),\n  {\n    max: 4,\n    size: \"md\",\n    shape: \"circle\",\n    variant: \"default\",\n    surface: \"background\",\n  },\n);\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"avatarGroup\", AVATAR_GROUP_LABELS, () => props.labels);\n\n// One rendered node, and it takes every fallthrough attribute — but `class`\n// goes through `cn()`, so a caller's `gap-1` can beat the row's own layout\n// utilities instead of tying with them on stylesheet order.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest } = useSplitAttrs();\n\n/**\n * At least one face always renders. `max = 0` is the boundary that decides\n * this: a group collapsed to nothing but \"+5\" has spent an avatar row saying\n * only that some people exist, which is strictly less than one face and a\n * count would have said.\n */\nconst shown = computed(() => props.avatars.slice(0, Math.max(1, Math.trunc(props.max))));\n\n/** How many members the row did not have room for. Zero renders no counter at all. */\nconst hidden = computed(() => props.avatars.length - shown.value.length);\n\n/** What the counter prints. `+3` is the layout; the sentence below is the information. */\nconst printed = computed(() => `+${String(hidden.value)}`);\n\nconst overlap = computed(() => OVERLAP[props.size]);\n\n/** `ring-2` in the surface colour, on every face including the counter. */\nconst ring = computed(() => cn(\"ring-2\", SURFACE_RING[props.surface]));\n\n/**\n * What a screen reader reads for one member. The accent qualifier is composed\n * here rather than left to `Avatar`'s own hidden label, because the portrait\n * inside each item is `aria-hidden` — the item says the name once, in one\n * voice, whichever state the image is in.\n */\nfunction memberName(item: AvatarGroupItem): string {\n  const who = (item.alt ?? item.fallback ?? \"\").trim();\n  if ((item.variant ?? props.variant) !== \"accent\") return who;\n  return text.value.accent({ name: who });\n}\n</script>\n\n<template>\n  <!-- `role=\"list\"` on a div rather than a real `<ul>`, and the reason is the\n       page this is documented on. VitePress styles `.vp-doc li + li` with a top\n       margin and `.vp-doc ul` with a disc marker and a left indent, unlayered —\n       and unlayered CSS beats every Tailwind utility, which all live in\n       `@layer utilities`. A genuine list element here arrives bulleted, indented\n       and stepping 8px downhill per face. The roles are the semantics; the\n       elements were only ever carrying them.\n\n       The explicit attributes sit before `v-bind`, so a caller who names the\n       group with `aria-labelledby` instead of `label` keeps their own value\n       rather than having an unset prop overwrite it. -->\n  <div\n    v-if=\"avatars.length > 0\"\n    role=\"list\"\n    :aria-label=\"label\"\n    v-bind=\"rest\"\n    :class=\"cn('flex items-center', attrs.class as string)\"\n  >\n    <!-- The first face on top, each later one tucked under it. `z-index` is not\n         automatic on a flex row — painting order alone puts the *last* sibling\n         over its neighbours, which reads as a stack dealt backwards — and it\n         needs the positioned parent this span provides. -->\n    <span\n      v-for=\"(item, index) in shown\"\n      :key=\"`${String(index)}-${item.src ?? item.fallback ?? ''}`\"\n      role=\"listitem\"\n      :style=\"{ zIndex: shown.length - index }\"\n      :class=\"cn('relative', index > 0 && overlap)\"\n    >\n      <!-- `accent-label` is cleared because the item beside it has already\n           worked the qualifier into one name; left at its default the row would\n           carry two copies of the accent label per accent member. -->\n      <Avatar\n        aria-hidden=\"true\"\n        accent-label=\"\"\n        v-bind=\"optional({ src: item.src, alt: item.alt, fallback: item.fallback })\"\n        :size=\"size\"\n        :shape=\"shape\"\n        :variant=\"item.variant ?? variant\"\n        :class=\"ring\"\n      />\n      <span class=\"sr-only\">{{ memberName(item) }}</span>\n    </span>\n\n    <!-- The counter is a face-shaped tile rather than a shape of its own, so\n         the row keeps one rhythm: same size, same corner, same ring, and the\n         neutral well instead of a portrait's fill so it never reads as a\n         person. It sits under everything, at the back of the stack. -->\n    <span v-if=\"hidden > 0\" role=\"listitem\" :style=\"{ zIndex: 0 }\" :class=\"cn('relative', overlap)\">\n      <Avatar\n        aria-hidden=\"true\"\n        :fallback=\"printed\"\n        :size=\"size\"\n        :shape=\"shape\"\n        :class=\"cn(ring, 'bg-subtle text-subtle-foreground tabular')\"\n      />\n      <span class=\"sr-only\">{{ text.overflow({ count: hidden }) }}</span>\n    </span>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAyBA,IAAa,sBAAyC;CACpD,WAAW,EAAE,YAAY,GAAG,OAAO,KAAK,EAAE;CAC1C,SAAS,EAAE,WAAY,OAAO,GAAG,KAAK,YAAY;AACpD;;;;;;;AAQA,IAAM,UAAU;CACd,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;AASA,IAAM,eAAe;CACnB,YAAY;CACZ,MAAM;CACN,QAAQ;CACR,SAAS;AACX;;;;;;;;;;;;;;;EA8BA,MAAM,QAAQ;EAsCd,MAAM,OAAO,UAAU,eAAe,2BAA2B,MAAM,MAAM;EAM7E,MAAM,EAAE,OAAO,SAAS,cAAc;;;;;;;EAQtC,MAAM,QAAQ,eAAe,MAAM,QAAQ,MAAM,GAAG,KAAK,IAAI,GAAG,KAAK,MAAM,MAAM,GAAG,CAAC,CAAC,CAAC;;EAGvF,MAAM,SAAS,eAAe,MAAM,QAAQ,SAAS,MAAM,MAAM,MAAM;;EAGvE,MAAM,UAAU,eAAe,IAAI,OAAO,OAAO,KAAK,GAAG;EAEzD,MAAM,UAAU,eAAe,QAAQ,MAAM,KAAK;;EAGlD,MAAM,OAAO,eAAe,GAAG,UAAU,aAAa,MAAM,QAAQ,CAAC;;;;;;;EAQrE,SAAS,WAAW,MAA+B;GACjD,MAAM,OAAO,KAAK,OAAO,KAAK,YAAY,GAAA,CAAI,KAAK;GACnD,KAAK,KAAK,WAAW,MAAM,aAAa,UAAU,OAAO;GACzD,OAAO,KAAK,MAAM,OAAO,EAAE,MAAM,IAAI,CAAC;EACxC;;GAgBU,OAAA,QAAA,QAAQ,SAAM,KADtB,UAAA,GAAA,mBA+CM,OA/CN,WA+CM;;IA7CJ,MAAK;IACJ,cAAY,QAAA;GACL,GAAA,MAAA,IAAA,GAAI,EACX,OAAO,MAAA,EAAA,CAAE,CAAA,qBAAsB,MAAA,KAAA,CAAK,CAAC,KAAK,EAAA,CAAA,GAAA,EAM3C,UAAA,IAAA,GAAA,mBAoBO,UAAA,MAAA,WAnBmB,MAAA,QAAhB,MAAM,UAAK;IADrB,OAAA,UAAA,GAAA,mBAoBO,QAAA;KAlBJ,KAAG,GAAK,OAAO,KAAK,EAAA,GAAK,KAAK,OAAO,KAAK,YAAQ;KACnD,MAAK;KACJ,OAAK,eAAA,EAAA,QAAY,MAAA,MAAM,SAAS,MAAK,CAAA;KACrC,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,YAAa,QAAK,KAAQ,QAAA,KAAO,CAAA;IAK3C,GAAA,CAAA,YAQE,MAAA,cAAA,GARF,WAQE;KAPA,eAAY;KACZ,gBAAa;IACL,GAAA,EAAA,SAAA,KAAA,GAAA,MAAA,QAAA,CAAQ,CAAA;KAAA,KAAQ,KAAK;KAAG,KAAO,KAAK;KAAG,UAAY,KAAK;IAAQ,CAAA,GAAA;KACvE,MAAM,QAAA;KACN,OAAO,QAAA;KACP,SAAS,KAAK,WAAW,QAAA;KACzB,OAAO,KAAA;;;;;;IAEV,CAAA,GAAA,mBAAmD,QAAnD,YAAmD,gBAA1B,WAAW,IAAI,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA;GAO9B,CAAA,GAAA,GAAA,IAAA,OAAA,QAAM,KAAlB,UAAA,GAAA,mBASO,QAAA;;IATiB,MAAK;IAAY,OAAO,EAAA,QAAA,EAAA;IAAgB,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,YAAa,QAAA,KAAO,CAAA;GAC3F,GAAA,CAAA,YAME,MAAA,cAAA,GAAA;IALA,eAAY;IACX,UAAU,QAAA;IACV,MAAM,QAAA;IACN,OAAO,QAAA;IACP,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,KAAA,OAAI,0CAAA,CAAA;;;;;;GAEjB,CAAA,GAAA,mBAAmE,QAAnE,YAAmE,gBAA1C,MAAA,IAAA,CAAI,CAAC,SAAQ,EAAA,OAAU,OAAA,MAAM,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,IAAA,UAAA,KAAA,mBAAA,IAAA,IAAA"}

package/dist/packages/primitives/badge/src/Badge.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Badge.js","names":[],"sources":["../../../../../packages/primitives/badge/src/Badge.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * Badge — small status / meta chip. The `accent` variant wears the accent\n * colour used to signal a second semantic category distinct from primary.\n */\nexport type BadgeVariant =\n  \"neutral\" | \"outline\" | \"primary\" | \"success\" | \"warning\" | \"info\" | \"destructive\" | \"accent\";\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        // The tinted washes use the opaque `*-muted` tokens, not an alpha of\n        // the base hue: `bg-*-/12` composites against the surface behind it, so\n        // the same badge renders at 4.46:1 on `bg-card` and differently on\n        // `bg-sunken` — under the AA floor and inconsistent. `*-muted` is mixed\n        // to hold ≥4.5:1 against its own `*-text` in both themes (see\n        // theme.css), which is what these variants were named for.\n        primary: \"border-transparent bg-primary-muted text-primary-text\",\n        success: \"border-transparent bg-success-muted text-success-text\",\n        // `-text`, not the bare `warning`: the tinted washes are mixed to hold\n        // their contrast against the `*-text` rung in both themes, and the\n        // base hue is not — on the dark `--color-warning` dropped to a\n        // mid-amber that washed out against its own muted fill.\n        warning: \"border-transparent bg-warning-muted text-warning-text\",\n        info: \"border-transparent bg-info-muted text-info-text\",\n        destructive: \"border-transparent bg-destructive-muted text-destructive-text\",\n        accent: \"border-accent/40 bg-accent-muted text-accent-text\",\n      } satisfies Record<BadgeVariant, string>,\n    },\n    defaultVariants: { variant: \"neutral\" },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which status or meta this chip carries. `accent` is for signalling a second semantic category distinct from primary. */\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/packages/primitives/badge/src/Badge.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Badge.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../packages/primitives/badge/src/Badge.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * Badge — small status / meta chip. The `accent` variant wears the accent\n * colour used to signal a second semantic category distinct from primary.\n */\nexport type BadgeVariant =\n  \"neutral\" | \"outline\" | \"primary\" | \"success\" | \"warning\" | \"info\" | \"destructive\" | \"accent\";\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        // The tinted washes use the opaque `*-muted` tokens, not an alpha of\n        // the base hue: `bg-*-/12` composites against the surface behind it, so\n        // the same badge renders at 4.46:1 on `bg-card` and differently on\n        // `bg-sunken` — under the AA floor and inconsistent. `*-muted` is mixed\n        // to hold ≥4.5:1 against its own `*-text` in both themes (see\n        // theme.css), which is what these variants were named for.\n        primary: \"border-transparent bg-primary-muted text-primary-text\",\n        success: \"border-transparent bg-success-muted text-success-text\",\n        // `-text`, not the bare `warning`: the tinted washes are mixed to hold\n        // their contrast against the `*-text` rung in both themes, and the\n        // base hue is not — on the dark `--color-warning` dropped to a\n        // mid-amber that washed out against its own muted fill.\n        warning: \"border-transparent bg-warning-muted text-warning-text\",\n        info: \"border-transparent bg-info-muted text-info-text\",\n        destructive: \"border-transparent bg-destructive-muted text-destructive-text\",\n        accent: \"border-accent/40 bg-accent-muted text-accent-text\",\n      } satisfies Record<BadgeVariant, string>,\n    },\n    defaultVariants: { variant: \"neutral\" },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which status or meta this chip carries. `accent` is for signalling a second semantic category distinct from primary. */\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;EAOT,SAAS;EACT,SAAS;EAKT,SAAS;EACT,MAAM;EACN,aAAa;EACb,QAAQ;CACV,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/packages/primitives/breadcrumb/src/Breadcrumb.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Breadcrumb.js","names":[],"sources":["../../../../../packages/primitives/breadcrumb/src/Breadcrumb.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { BreadcrumbLabels } from \"@ecoma-io/loom-labels\";\n\n/** The visible label text and optional link target for one step in the trail. */\nexport interface BreadcrumbItem {\n  /** The visible label text. */\n  label: string;\n  /** The link target. Omit for the current (last) item. */\n  href?: string;\n}\n\n/** Visual separators between breadcrumb steps. `chevron` renders an inline SVG. */\nexport type BreadcrumbSeparator = \"/\" | \"\\\\\" | \">\" | \"→\" | \"chevron\";\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it,\n * and exported so a host can build a partial vocabulary against the real\n * thing rather than a transcription of it.\n */\nexport const BREADCRUMB_LABELS: BreadcrumbLabels = {\n  label: \"Breadcrumb\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\n\n/**\n * Breadcrumb — a navigation trail showing the page's position in the site\n * hierarchy. The last item is always the current page (no href,\n * `aria-current=\"page\"`); items with an href render as links. Built without\n * Reka UI, which has no Breadcrumb primitive.\n */\nconst props = withDefaults(\n  defineProps<{\n    /** The breadcrumb trail, last item is the current page. */\n    items: BreadcrumbItem[];\n    /** Visual separator between items. `chevron` renders an inline SVG arrow. */\n    separator?: BreadcrumbSeparator;\n    /**\n     * Names for what this component says out loud, as any subset of\n     * `BreadcrumbLabels` — the rest stay as the host's `provideLoomLabels`\n     * vocabulary left them, and then as Loom's English.\n     *\n     * This is the per-instance correction: a page that carries two trails —\n     * above and below an article, say — names each one for where it stands,\n     * which an application-wide vocabulary alone cannot do.\n     */\n    labels?: LabelOverrides<BreadcrumbLabels>;\n  }>(),\n  { separator: \"/\" },\n);\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"breadcrumb\", BREADCRUMB_LABELS, () => props.labels);\n</script>\n\n<template>\n  <nav :aria-label=\"text.label\">\n    <ol class=\"flex items-center gap-1.5 text-sm\">\n      <template v-for=\"(item, index) in items\" :key=\"index\">\n        <li v-if=\"index > 0\" aria-hidden=\"true\" :class=\"cn('text-muted-foreground/50')\">\n          <svg\n            v-if=\"separator === 'chevron'\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          >\n            <path d=\"m9 18 6-6-6-6\" />\n          </svg>\n          <template v-else>{{ separator }}</template>\n        </li>\n\n        <!-- The last item is always the current page, regardless of href -->\n        <li v-if=\"index === items.length - 1\">\n          <span aria-current=\"page\" :class=\"cn('text-foreground font-medium')\">\n            {{ item.label }}\n          </span>\n        </li>\n        <li v-else>\n          <a\n            :href=\"item.href\"\n            :class=\"\n              cn(\n                'inline-flex min-h-6 items-center text-muted-foreground hover:text-foreground transition-colors duration-fast',\n              )\n            \"\n          >\n            {{ item.label }}\n          </a>\n        </li>\n      </template>\n    </ol>\n  </nav>\n</template>\n"],"mappings":""}

package/dist/packages/primitives/breadcrumb/src/Breadcrumb.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Breadcrumb.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../packages/primitives/breadcrumb/src/Breadcrumb.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { BreadcrumbLabels } from \"@ecoma-io/loom-labels\";\n\n/** The visible label text and optional link target for one step in the trail. */\nexport interface BreadcrumbItem {\n  /** The visible label text. */\n  label: string;\n  /** The link target. Omit for the current (last) item. */\n  href?: string;\n}\n\n/** Visual separators between breadcrumb steps. `chevron` renders an inline SVG. */\nexport type BreadcrumbSeparator = \"/\" | \"\\\\\" | \">\" | \"→\" | \"chevron\";\n\n/**\n * Loom's English, co-located with the component so it tree-shakes with it,\n * and exported so a host can build a partial vocabulary against the real\n * thing rather than a transcription of it.\n */\nexport const BREADCRUMB_LABELS: BreadcrumbLabels = {\n  label: \"Breadcrumb\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\n\n/**\n * Breadcrumb — a navigation trail showing the page's position in the site\n * hierarchy. The last item is always the current page (no href,\n * `aria-current=\"page\"`); items with an href render as links. Built without\n * Reka UI, which has no Breadcrumb primitive.\n */\nconst props = withDefaults(\n  defineProps<{\n    /** The breadcrumb trail, last item is the current page. */\n    items: BreadcrumbItem[];\n    /** Visual separator between items. `chevron` renders an inline SVG arrow. */\n    separator?: BreadcrumbSeparator;\n    /**\n     * Names for what this component says out loud, as any subset of\n     * `BreadcrumbLabels` — the rest stay as the host's `provideLoomLabels`\n     * vocabulary left them, and then as Loom's English.\n     *\n     * This is the per-instance correction: a page that carries two trails —\n     * above and below an article, say — names each one for where it stands,\n     * which an application-wide vocabulary alone cannot do.\n     */\n    labels?: LabelOverrides<BreadcrumbLabels>;\n  }>(),\n  { separator: \"/\" },\n);\n\n// `text`, not `labels`: the prop of that name is one of the three sources this\n// resolves, and a template reading the raw prop would be reading the overrides\n// rather than the answer.\nconst text = useLabels(\"breadcrumb\", BREADCRUMB_LABELS, () => props.labels);\n</script>\n\n<template>\n  <nav :aria-label=\"text.label\">\n    <ol class=\"flex items-center gap-1.5 text-sm\">\n      <template v-for=\"(item, index) in items\" :key=\"index\">\n        <li v-if=\"index > 0\" aria-hidden=\"true\" :class=\"cn('text-muted-foreground/50')\">\n          <svg\n            v-if=\"separator === 'chevron'\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          >\n            <path d=\"m9 18 6-6-6-6\" />\n          </svg>\n          <template v-else>{{ separator }}</template>\n        </li>\n\n        <!-- The last item is always the current page, regardless of href -->\n        <li v-if=\"index === items.length - 1\">\n          <span aria-current=\"page\" :class=\"cn('text-foreground font-medium')\">\n            {{ item.label }}\n          </span>\n        </li>\n        <li v-else>\n          <a\n            :href=\"item.href\"\n            :class=\"\n              cn(\n                'inline-flex min-h-6 items-center text-muted-foreground hover:text-foreground transition-colors duration-fast',\n              )\n            \"\n          >\n            {{ item.label }}\n          </a>\n        </li>\n      </template>\n    </ol>\n  </nav>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,IAAa,oBAAsC,EACjD,OAAO,aACT;;;;;;;;;EAaA,MAAM,QAAQ;EAuBd,MAAM,OAAO,UAAU,cAAc,yBAAyB,MAAM,MAAM;;GAIxE,OAAA,UAAA,GAAA,mBAyCM,OAAA,EAzCA,cAAY,MAAA,IAAA,CAAI,CAAC,MAAA,GAAA,CACrB,mBAuCK,MAvCL,YAuCK,EAtCH,UAAA,IAAA,GAAA,mBAqCW,UAAA,MAAA,WArCuB,QAAA,QAAhB,MAAM,UAAK;IAAkB,OAAA,UAAA,GAAA,mBAAA,UAAA,EAAA,KAAA,MAAK,GAAA,CACxC,QAAK,KAAf,UAAA,GAAA,mBAgBK,MAAA;;KAhBgB,eAAY;KAAQ,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,0BAAA,CAAA;IAExC,GAAA,CAAA,QAAA,cAAS,aADjB,UAAA,GAAA,mBAaM,OAbN,YAaM,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CADJ,mBAA0B,QAAA,EAApB,GAAE,gBAAe,GAAA,MAAA,EAAA,CAAA,EAAA,CAAA,MAEzB,UAAA,GAAA,mBAA2C,UAAA,EAAA,KAAA,EAAA,GAAA,CAAvB,gBAAA,gBAAA,QAAA,SAAS,GAAA,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAIrB,UAAU,QAAA,MAAM,SAAM,KAAhC,UAAA,GAAA,mBAIK,MAAA,YAAA,CAHH,mBAEO,QAAA;KAFD,gBAAa;KAAQ,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,6BAAA,CAAA;IAC/B,GAAA,gBAAA,KAAK,KAAK,GAAA,CAAA,CAAA,CAAA,MAGjB,UAAA,GAAA,mBAWK,MAAA,YAAA,CAVH,mBASI,KAAA;KARD,MAAM,KAAK;KACX,OAAK,eAAiB,MAAA,EAAA,CAAE,CAAA,8GAAA,CAAA;IAMtB,GAAA,gBAAA,KAAK,KAAK,GAAA,IAAA,UAAA,CAAA,CAAA,EAAA,GAAA,EAAA"}

package/dist/packages/primitives/button/src/Button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.js","names":[],"sources":["../../../../../packages/primitives/button/src/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 * One row per rest-state variant, naming the fill and the label token the\n * variant paints. Kept separate from the `cva` call because it is also the\n * contract `Button.contrast.test.ts` reads: that file derives every variant's\n * pairing from here, so a variant added to the map is measured on arrival\n * rather than when someone remembers to add a row to a test. The two halves\n * — this map and the `cva` call consuming it — cannot drift apart, because\n * `cva` is handed this very object.\n *\n * `satisfies` is what keeps this map and the union honest. The union above is\n * the 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, so\n * neither can be the stale copy of the other.\n */\nexport const buttonVariantClasses = {\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\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 primary 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 * Unavailable is painted in colours rather than dimmed, and it is keyed off the\n * `disabled` prop rather than off the DOM disabled state — a loading button is\n * also DOM-disabled yet has to read as \"working\", not \"unavailable\". See the\n * drained treatment on the root element for the measurements that removed the\n * dim.\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-press 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    variants: {\n      variant: buttonVariantClasses,\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 \"@ecoma-io/loom-core\";\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 — drains the button to the neutral well 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=\"\n      cn(\n        buttonVariants({ variant, size }),\n        'group',\n        // Drained, not dimmed. `opacity-50` here was the library's most visible\n        // instance of the mistake, because a button is nothing but a label on a\n        // fill and the dim took both together: measured on the built site, a\n        // disabled `primary` label came out at 1.62:1 against its own faded fill\n        // and a disabled `outline` at 3.14:1 on the page ground. Neither is\n        // reachable by recolouring the label, since the fade multiplied whatever\n        // colour it was given.\n        //\n        // One neutral treatment for all six variants rather than six drained\n        // pairs: the fill is what carries a variant's emphasis, and an\n        // unavailable button has no emphasis to carry. It is the same well Chip\n        // and Stepper drain to, so an unavailable control looks the same\n        // wherever it appears. Every variant still changes visibly on the way\n        // in — the two filled ones give up their hue, the three transparent ones\n        // gain a fill — and the native `disabled` attribute carries the fact to\n        // assistive tech, so none of it rests on colour alone.\n        //\n        // `border-border` and not the strong weight, which is what `outline`\n        // used to take here. `theme.css` reserves the strong hairline for a\n        // block that must *assert* its edge, and an unavailable control is the\n        // one thing that must not; slackening from `input` to the lighter\n        // `border` is also the same step every other unavailable control in the\n        // library now makes, so a disabled Button beside a disabled TextField\n        // wears the same rim rather than a heavier one.\n        disabled && 'border-border bg-muted text-muted-foreground shadow-none',\n      )\n    \"\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\n             The raw 100ms/75ms pair is deliberate: the motion tokens bracket\n             this beat without landing on it — `fast` (140ms) is beat 1's own\n             exit duration, so sharing it would flatten the stagger into one\n             simultaneous move, and `instant` (80ms) reads as a flicker. The\n             choreography only makes sense between the two rungs, which no\n             token expresses; if a delay token ever lands in theme.css, this\n             is the first candidate to move onto it. -->\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":""}

package/dist/packages/primitives/button/src/Button.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../packages/primitives/button/src/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 * One row per rest-state variant, naming the fill and the label token the\n * variant paints. Kept separate from the `cva` call because it is also the\n * contract `Button.contrast.test.ts` reads: that file derives every variant's\n * pairing from here, so a variant added to the map is measured on arrival\n * rather than when someone remembers to add a row to a test. The two halves\n * — this map and the `cva` call consuming it — cannot drift apart, because\n * `cva` is handed this very object.\n *\n * `satisfies` is what keeps this map and the union honest. The union above is\n * the 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, so\n * neither can be the stale copy of the other.\n */\nexport const buttonVariantClasses = {\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\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 primary 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 * Unavailable is painted in colours rather than dimmed, and it is keyed off the\n * `disabled` prop rather than off the DOM disabled state — a loading button is\n * also DOM-disabled yet has to read as \"working\", not \"unavailable\". See the\n * drained treatment on the root element for the measurements that removed the\n * dim.\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-press 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    variants: {\n      variant: buttonVariantClasses,\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 \"@ecoma-io/loom-core\";\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 — drains the button to the neutral well 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=\"\n      cn(\n        buttonVariants({ variant, size }),\n        'group',\n        // Drained, not dimmed. `opacity-50` here was the library's most visible\n        // instance of the mistake, because a button is nothing but a label on a\n        // fill and the dim took both together: measured on the built site, a\n        // disabled `primary` label came out at 1.62:1 against its own faded fill\n        // and a disabled `outline` at 3.14:1 on the page ground. Neither is\n        // reachable by recolouring the label, since the fade multiplied whatever\n        // colour it was given.\n        //\n        // One neutral treatment for all six variants rather than six drained\n        // pairs: the fill is what carries a variant's emphasis, and an\n        // unavailable button has no emphasis to carry. It is the same well Chip\n        // and Stepper drain to, so an unavailable control looks the same\n        // wherever it appears. Every variant still changes visibly on the way\n        // in — the two filled ones give up their hue, the three transparent ones\n        // gain a fill — and the native `disabled` attribute carries the fact to\n        // assistive tech, so none of it rests on colour alone.\n        //\n        // `border-border` and not the strong weight, which is what `outline`\n        // used to take here. `theme.css` reserves the strong hairline for a\n        // block that must *assert* its edge, and an unavailable control is the\n        // one thing that must not; slackening from `input` to the lighter\n        // `border` is also the same step every other unavailable control in the\n        // library now makes, so a disabled Button beside a disabled TextField\n        // wears the same rim rather than a heavier one.\n        disabled && 'border-border bg-muted text-muted-foreground shadow-none',\n      )\n    \"\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\n             The raw 100ms/75ms pair is deliberate: the motion tokens bracket\n             this beat without landing on it — `fast` (140ms) is beat 1's own\n             exit duration, so sharing it would flatten the stagger into one\n             simultaneous move, and `instant` (80ms) reads as a flicker. The\n             choreography only makes sense between the two rungs, which no\n             token expresses; if a delay token ever lands in theme.css, this\n             is the first candidate to move onto it. -->\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,IAAa,uBAAuB;CAClC,SAAS;CACT,WAAW;CACX,QAAQ;CACR,SAAS;CACT,OAAO;CACP,aAAa;AACf;;;;;;;;;;;;;;;;;;AAmBA,IAAa,iBAAiB,IAC5B;CACE;CACA;CACA;CACA;CACA;AACF,GACA;CACE,UAAU;EACR,SAAS;EACT,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,MAAM;GAQN,WAAW;EACb;CACF;CACA,iBAAiB;EAAE,SAAS;EAAW,MAAM;CAAK;AACpD,CACF;;;;;;;;;;;;;;;;;;;GA0BE,OAAA,UAAA,GAAA,mBAkGS,UAAA;IAjGN,MAAM,QAAA;IACN,UAAU,QAAA,YAAY,QAAA;IACtB,gBAAc,QAAA,WAAW,KAAA;IACzB,aAAW,QAAA,WAAW,KAAA;IACtB,OAAK,eAAS,MAAA,EAAA,CAAE,CAAU,MAAA,cAAA,CAAc,CAAA;KAAA,SAAG,QAAA;KAAO,MAAE,QAAA;IAAI,CAAA,GAAA,SAAuqD,QAAA,YAAQ,0DAAA,CAAA;GAkChuD,GAAA,CAAA,QAAA,WADR,UAAA,GAAA,mBAIE,QAJF,UAIE,KAAA,mBAAA,IAAA,IAAA,GAMF,mBAiDO,QAjDP,YAiDO,CA/CL,mBAKO,QAAA;IAJJ,eAAa,QAAA,WAAW,KAAA;IACzB,OAAM;GAEN,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,GAAA,UAAA,GAEV,mBAwCO,QAAA;IAvCJ,eAAW,CAAG,QAAA,WAAW,KAAA;IAC1B,OAAM;GASN,GAAA,CAAA,OAAA,OAAA,OAAA,KAAA,mBAUO,QAAA,EATL,OAAM,+LAA8L,GAAA,CAEpM,mBAMM,OAAA;IAND,OAAM;IAAuB,SAAQ;IAAY,MAAK;IAAO,eAAY;GAC5E,GAAA,CAAA,mBAAoF,UAAA;IAA5E,OAAM;IAA4B,IAAG;IAAK,IAAG;IAAK,GAAE;IAAK,gBAAa;GAC9E,CAAA,GAAA,mBAGE,QAAA;IAFA,OAAM;IACN,GAAE;GAiBA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,IAAA,QAAA,eADR,UAAA,GAAA,mBAKO,QALP,YAKO,gBADF,QAAA,WAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,GAAA,UAAA,CAAA,CAAA,CAAA,GAAA,IAAA,UAAA"}

package/dist/packages/primitives/calendar/src/Calendar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Calendar.js","names":[],"sources":["../../../../../packages/primitives/calendar/src/Calendar.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { CalendarLabels } from \"@ecoma-io/loom-labels\";\n\n/**\n * Loom's English for what this surface speaks of its own account — the two\n * pager names and the selection line — co-located so it tree-shakes with the\n * component that renders it, and exported so a host can build a partial\n * vocabulary against the real thing.\n */\nexport const CALENDAR_LABELS: CalendarLabels = {\n  previousMonth: \"Previous month\",\n  nextMonth: \"Next month\",\n  chosen: ({ date }) => `${date} chosen.`,\n  cleared: \"No date chosen.\",\n};\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useId } from \"vue\";\nimport {\n  CalendarRoot,\n  CalendarHeader,\n  CalendarHeading,\n  CalendarPrev,\n  CalendarNext,\n  CalendarGrid,\n  CalendarGridHead,\n  CalendarGridRow,\n  CalendarHeadCell,\n  CalendarGridBody,\n  CalendarCell,\n  CalendarCellTrigger,\n} from \"reka-ui\";\nimport { ChevronLeft, ChevronRight } from \"@lucide/vue\";\nimport {\n  getLocalTimeZone,\n  isToday,\n  parseDate,\n  toCalendarDate,\n  type DateValue,\n} from \"@internationalized/date\";\nimport { cn } from \"@ecoma-io/loom-core\";\nimport { optional } from \"@ecoma-io/loom-core\";\nimport { useSplitAttrs } from \"@ecoma-io/loom-core\";\nimport { useLabels, type LabelOverrides } from \"@ecoma-io/loom-labels\";\nimport { CALENDAR_PANEL_LABELS } from \"@ecoma-io/loom-labels\";\nimport { formatFullDay } from \"@ecoma-io/loom-labels\";\n\n/**\n * Calendar — a month on a page: a heading naming it, a row of weekday names,\n * and a grid of days a reader browses and picks from directly.\n *\n * **This is not a date picker, and the difference is the whole point.**\n * DatePicker is a field first — a segmented input a reader types into, with a\n * popover calendar as its second path. This is the calendar alone: no field,\n * no trigger, no open state, nothing to close, and no value echoed anywhere.\n * Reach for it wherever the temporal surface *is* the interface — a booking\n * board's availability grid, a dashboard filter showing the month at all\n * times, a scheduling view a host embeds beside other content.\n *\n * The engine underneath is the same one the four pickers wrap — Reka UI's\n * standalone `CalendarRoot` family — so the month arithmetic, the locale\n * handling and the roving-focus keyboard model are Reka's, not hand-written\n * here. What Loom adds is the value boundary, the label seam and the\n * accessibility decisions documented below.\n *\n * **The model value is a plain ISO date string, `\"YYYY-MM-DD\"`** — parsed on\n * the way in, re-serialised on the way out, exactly as DatePicker draws the\n * same boundary. A value that does not parse is read as *no date chosen*\n * rather than thrown on; a component library cannot decide that a host's bad\n * data is fatal.\n *\n * Three states live on this surface and each has exactly one owner:\n *\n * - **Selected** — the host's, through `modelValue`. Clicking (or pressing\n *   Enter on) an already-chosen day clears it; there is no field here whose\n *   clearing could be a surprise, and a browsing surface that cannot be\n *   un-picked is worse than one that can.\n * - **Focused** — Reka's, through a roving tabindex across the cell triggers.\n *   It is not a prop: the whole grid is exactly one Tab stop, and the arrow\n *   keys walk it.\n * - **Visible month** — internal, deliberately uncontrolled in this release.\n *   Paging buttons move it; selecting a day does not navigate anything, close\n *   anything or move focus. A host that needs to drive the view gets a\n *   placeholder prop when a use case asks for one, not before.\n *\n * **Timezone assumptions:** everything here operates on bare calendar dates.\n * There are no instants and no conversions — \"today\" resolves against the\n * host's local timezone via `getLocalTimeZone()`, which is the only timezone\n * reading this component ever makes.\n *\n * **Range selection is out of scope here by design.** A future\n * `RangeCalendar` lands as its own sibling primitive — the house precedent is\n * DatePicker and DateRangePicker, separate components sharing an engine,\n * because a span has a different model from a point and pretending otherwise\n * produces a control wrong at both ends.\n */\nconst props = withDefaults(\n  defineProps<{\n    /**\n     * The chosen date as ISO `YYYY-MM-DD`. Unset, empty or unparseable means\n     * no date is chosen. The explicit `| undefined` is what lets `v-model`\n     * bind a ref that clears — clicking the chosen day again emits\n     * `undefined`, and a plain optional prop refuses to take it back.\n     */\n    modelValue?: string | undefined;\n    /** The earliest choosable date, same ISO format. Days before it are announced disabled and skipped by the keyboard. */\n    min?: string;\n    /** The latest choosable date, same ISO format. Days after it are announced disabled and skipped by the keyboard. */\n    max?: string;\n    /** BCP 47 tag driving the month and weekday names, each cell's full-date name, and which day a week starts on. */\n    locale?: string;\n    /**\n     * Writing direction of the whole surface: mirrors the pager chevrons and\n     * flips which arrow key moves backwards.\n     *\n     * Absent, it is seeded from the document's own direction — because Reka\n     * never reads the document itself. Left to its own devices it resolves\n     * `dir` through its ConfigProvider context, defaulting `\"ltr\"`, so under\n     * `<html dir=\"rtl\">` with nothing forwarded the `rtl:` chevron classes\n     * still fire off the CSS cascade while the arrow-key sign stays LTR:\n     * visuals and semantics disagreeing on one surface. An explicit prop\n     * wins over the seed, and a host driving direction through Reka's own\n     * ConfigProvider keeps that where the document declares nothing.\n     */\n    dir?: \"ltr\" | \"rtl\";\n    /**\n     * Names for everything this control says out loud, as any subset of\n     * `CalendarLabels` — the rest stay as the host's `provideLoomLabels`\n     * vocabulary left them, and then as Loom's English.\n     *\n     * This is the per-instance correction, not the place to localise an\n     * application: both keys name controls every calendar in the library\n     * pages with, and a language is set once with `provideLoomLabels`.\n     */\n    labels?: LabelOverrides<CalendarLabels>;\n  }>(),\n  { locale: \"en\" },\n);\n\nconst emit = defineEmits<{\n  /** The chosen date as ISO `YYYY-MM-DD`, or `undefined` once the choice has been cleared. */\n  \"update:modelValue\": [value: string | undefined];\n}>();\n\n// Two slots resolved, one of them behind the prop. `text` is this control's\n// own pager vocabulary; the panel slice answers only for the surface's own\n// name (`calendar`), which Reka publishes twice — as the container's\n// `aria-label` and inside a visually-hidden live region a fallthrough\n// attribute could not reach — and which defaults to `\"Event Date\"`, a name\n// for somebody else's application. The per-instance `labels` prop stays\n// exactly `CalendarLabels`: a standalone surface renders no open button, so\n// the rest of that shared slice would be keys nothing on it could say.\nconst text = useLabels(\"calendar\", CALENDAR_LABELS, () => props.labels);\nconst chromeText = useLabels(\"calendarPanel\", CALENDAR_PANEL_LABELS);\n\n// The root is the whole surface, so every fallthrough attribute belongs on it\n// — there is no second node they could sensibly describe. `class` is pulled\n// out of that spread and merged through `cn()` instead: spreading it alongside\n// the root's own `:class` only concatenates the two lists, so a caller's\n// `w-full` would win or lose depending on which utility Tailwind emitted last.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest: rootAttrs } = useSplitAttrs();\n\nfunction fromIso(value: string | undefined): DateValue | undefined {\n  if (!value) return undefined;\n  try {\n    return parseDate(value);\n  } catch {\n    return undefined;\n  }\n}\n\n// `toString()` already normalises to the Gregorian ISO form whatever calendar\n// the value carries — a locale such as `th-TH` gives Reka a Buddhist\n// placeholder whose year reads 2569, and it still prints `2026-08-11`. What\n// `toCalendarDate` adds is dropping a time component if one ever arrives.\nfunction toIso(date: DateValue): string {\n  return toCalendarDate(date).toString();\n}\n\n// Reka resolves direction through its ConfigProvider context and defaults\n// `\"ltr\"` — it never reads the document (its `useDirection` is literally\n// `dir || context.dir || \"ltr\"`). Seeding the forwarded direction from the\n// document closes the half-behaviour that leaves behind: chevrons mirrored by\n// CSS, arrows still LTR. Only `\"rtl\"` is ever injected rather than a resolved\n// `\"ltr\"` too — forwarding `\"ltr\"` unconditionally would clobber a\n// ConfigProvider context the host set on purpose, and absence lets Reka's own\n// chain answer. `typeof document` guards the server-side pass that builds the\n// documentation site, where there is no document to read.\nconst resolvedDir = computed(() => {\n  if (props.dir) return props.dir;\n  if (typeof document === \"undefined\") return undefined;\n  return document.documentElement.dir === \"rtl\" ? \"rtl\" : undefined;\n});\n\n// `optional()` rather than four separate bindings: an absent bound forwarded\n// as an explicit `undefined` is still a key Reka sees, and an absent\n// `modelValue` forwarded that way is what turns an uncontrolled surface into\n// a permanently empty one. Dropping the key says what is true — including\n// for `dir`, whose absence defers to Reka's own resolution wherever neither\n// the prop nor the document speaks.\nconst rootValue = computed(() =>\n  optional({\n    modelValue: fromIso(props.modelValue),\n    minValue: fromIso(props.min),\n    maxValue: fromIso(props.max),\n    dir: resolvedDir.value,\n  }),\n);\n\n// The status line below announces by changing, but a live region also\n// announces its content the moment it enters the document — so a calendar\n// mounted with a preselected value would read the chosen date out as if the\n// user had just picked it. `announced` stays false until the first real\n// selection event, and the line is aria-hidden meanwhile: hidden, it says\n// nothing at mount; revealed on the first change, it announces exactly that\n// change. Programmatic `modelValue` sets never fire this handler (a host\n// prop write is not an interaction), so before the first user action they\n// stay silent too — after it, the region is an ordinary live region and\n// speaks real changes from either side, which is correct.\nconst announced = ref(false);\n\nfunction onDateChange(date: DateValue | undefined) {\n  announced.value = true;\n  emit(\"update:modelValue\", date ? toIso(date) : undefined);\n}\n\n// Today is a state, and it may not be carried by the marker dot alone — a\n// reader who cannot see the dot gets `aria-current=\"date\"`, which is the one\n// attribute screen readers already announce for \"this is the current one\".\n// Reka publishes today only as a `data-` attribute and a slot prop, neither of\n// which can reach an attribute binding on the cell itself.\nfunction isDateToday(date: DateValue): boolean {\n  return isToday(date, getLocalTimeZone());\n}\n\n// The month-and-year heading names the grid, so the two are wired together\n// rather than the grid being an unnamed table of numbers.\nconst headingId = useId();\n\n// Each cell's accessible name is formatted here rather than read off Reka,\n// replacing Reka's own — the same mechanism DateRangePicker's cells rely on:\n// the binding reaches the node as a fallthrough attribute, which Vue merges\n// last, so it replaces rather than competes. A standalone calendar has no\n// input echoing the chosen value back, so the full date is the only thing a\n// screen reader ever says for a day, and it comes from the shared cached\n// formatter rather than a second `Intl` path built for this one component.\nfunction dayLabel(day: DateValue): string {\n  return formatFullDay(props.locale, day);\n}\n\n// A choice announces itself through no attribute of this engine: Reka\n// publishes a selection only as `aria-selected` flipping on a cell under an\n// unmoved focus point, and a flipped attribute announces nothing — there is\n// no field here whose value change would speak instead. DateRangePicker met\n// the identical fieldless-announcement problem with a `role=\"status\"` line,\n// and this mirrors that precedent. It changes exactly when the selection\n// changes, which is what makes it announceable rather than noise.\n//\n// It reads the selection off Reka's own slot rather than off `modelValue`:\n// the two agree once a host binds one, but this surface is usable unbound,\n// and a line wired to the prop would stay silent about exactly the clicks it\n// exists to announce.\nfunction selectionStatus(selected: DateValue | DateValue[] | undefined): string {\n  const value = Array.isArray(selected) ? undefined : selected;\n  return value ? text.value.chosen({ date: dayLabel(value) }) : text.value.cleared;\n}\n</script>\n\n<template>\n  <CalendarRoot\n    v-slot=\"{ grid, weekDays, modelValue: selected }\"\n    v-bind=\"{ ...rootAttrs, ...rootValue }\"\n    :locale=\"locale\"\n    :calendar-label=\"chromeText.calendar\"\n    :class=\"\n      cn(\n        'flex w-fit flex-col gap-3 rounded-md border border-border bg-popover p-3 text-popover-foreground',\n        attrs.class as string,\n      )\n    \"\n    @update:model-value=\"onDateChange\"\n  >\n    <CalendarHeader class=\"flex items-center justify-between gap-2\">\n      <!-- The two pagers keep `data-[disabled]:opacity-50` where the cells\n           gave it up, and the difference is what is inside them: a chevron and\n           nothing else. Fading a glyph costs a reader nothing, and the buttons\n           carry their name in `aria-label` rather than in dimmed text. -->\n      <CalendarPrev\n        :aria-label=\"text.previousMonth\"\n        class=\"inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-sm text-muted-foreground transition-colors duration-fast ease-out hover:bg-subtle hover:text-foreground focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring data-[disabled]:pointer-events-none data-[disabled]:opacity-50\"\n      >\n        <ChevronLeft class=\"h-4 w-4 rtl:-scale-x-100\" aria-hidden=\"true\" />\n      </CalendarPrev>\n\n      <!-- Paging the calendar changes nothing a reader is looking at except\n           this line, and nothing moves focus — so without the live region the\n           month silently becomes a different month. -->\n      <CalendarHeading\n        :id=\"headingId\"\n        aria-live=\"polite\"\n        class=\"text-sm font-medium text-foreground\"\n      />\n\n      <CalendarNext\n        :aria-label=\"text.nextMonth\"\n        class=\"inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-sm text-muted-foreground transition-colors duration-fast ease-out hover:bg-subtle hover:text-foreground focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring data-[disabled]:pointer-events-none data-[disabled]:opacity-50\"\n      >\n        <ChevronRight class=\"h-4 w-4 rtl:-scale-x-100\" aria-hidden=\"true\" />\n      </CalendarNext>\n    </CalendarHeader>\n\n    <!-- Visually subordinate on purpose — the grid is the interface, and this\n         is its spoken half: what a picker's field would have echoed. -->\n    <p\n      role=\"status\"\n      :aria-hidden=\"announced ? undefined : 'true'\"\n      class=\"text-xs text-muted-foreground\"\n    >\n      {{ selectionStatus(selected) }}\n    </p>\n\n    <CalendarGrid\n      v-for=\"month in grid\"\n      :key=\"month.value.toString()\"\n      role=\"grid\"\n      :aria-labelledby=\"headingId\"\n      class=\"border-collapse select-none\"\n    >\n      <!-- Reka renders `role=\"application\"` here, which hands every key\n            straight to the page and takes the table's own semantics away\n            with it. A calendar is a grid: `role=\"grid\"` is what makes the\n            cells rows and columns to a screen reader rather than 42\n            unrelated buttons, and the arrow-key handling Reka installs on\n            the cells is what a grid promises anyway.\n\n            The rows and cells below are laid out by the table itself\n            rather than by flex, and that is load-bearing: `display: flex`\n            on a `tr` drops its implicit `row` mapping in Chromium and\n            WebKit, which leaves `role=\"gridcell\"` inside a grid with no\n            row between them — a broken grid that looks identical. -->\n      <CalendarGridHead>\n        <CalendarGridRow>\n          <CalendarHeadCell\n            v-for=\"(day, index) in weekDays\"\n            :key=\"index\"\n            class=\"w-9 text-xs font-normal text-muted-foreground\"\n          >\n            {{ day }}\n          </CalendarHeadCell>\n        </CalendarGridRow>\n      </CalendarGridHead>\n\n      <CalendarGridBody>\n        <CalendarGridRow v-for=\"(week, weekIndex) in month.rows\" :key=\"weekIndex\">\n          <CalendarCell\n            v-for=\"day in week\"\n            :key=\"day.toString()\"\n            :date=\"day\"\n            class=\"p-0 text-center\"\n          >\n            <!-- The `:aria-label` below replaces one Reka writes inside its\n                  own render function, reaching the DOM node as a fallthrough\n                  attribute that Vue merges last. Removing it falls back not\n                  to English but to the engine's own locale-formatted cell\n                  names. -->\n            <CalendarCellTrigger\n              v-slot=\"{ dayValue, today }\"\n              :day=\"day\"\n              :month=\"month.value\"\n              :aria-label=\"dayLabel(day)\"\n              :aria-current=\"isDateToday(day) ? 'date' : undefined\"\n              class=\"group relative inline-flex h-9 w-9 items-center justify-center rounded-sm text-sm text-foreground transition-colors duration-fast ease-out hover:bg-subtle focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring focus-visible:shadow-halo data-[outside-view]:text-muted-foreground data-[selected]:bg-primary data-[selected]:text-primary-foreground data-[disabled]:pointer-events-none data-[disabled]:line-through [&[data-disabled]:not([data-selected])]:text-muted-foreground\"\n            >\n              {{ dayValue }}\n              <!-- Today's second cue. The dot is decoration to a screen\n                   reader — `aria-current` on the cell is what it reads — but\n                   it is the whole cue for a reader who is looking at the\n                   grid, and it is a shape rather than a hue so it survives a\n                   colour deficiency and forced-colors both. -->\n              <span\n                v-if=\"today\"\n                aria-hidden=\"true\"\n                class=\"absolute bottom-1 h-1 w-1 rounded-full bg-primary group-data-[selected]:bg-primary-foreground\"\n              />\n            </CalendarCellTrigger>\n          </CalendarCell>\n        </CalendarGridRow>\n      </CalendarGridBody>\n    </CalendarGrid>\n  </CalendarRoot>\n</template>\n"],"mappings":""}