@ecoma-io/loom 0.2.0 → 0.4.0

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

@@ -1,104 +0,0 @@
-import { type LabelOverrides } from "../../lib/labels";
-import type { AvatarShape, AvatarSize, AvatarVariant } from "../Avatar/Avatar.vue";
-import type { LabelOf } from "../../lib/labels";
-/** One face in the row. */
-export interface AvatarGroupItem {
-    /** Image URL. Omit it and this face renders `fallback` instead. */
-    src?: string;
-    /** 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. */
-    alt?: string;
-    /** Initials shown while there is no image, or once one has failed. */
-    fallback?: string;
-    /** 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. */
-    variant?: AvatarVariant;
-}
-/** The surface the row sits on, which the separating ring matches. */
-export type AvatarGroupSurface = "background" | "card" | "sunken" | "popover";
-/**
- * The two sentences the row says that are not a member's own name.
- *
- * **`accent` is one key and not a name, a comma and a qualifier.** Where the
- * qualifier sits relative to the name, and whether a comma is what separates
- * them at all, is a property of the language — Loom joining `${who}, ${what}`
- * has already answered both, in English, for every host that translates the
- * two halves. The name arrives raw because it is the caller's own data rather
- * than anything Loom formatted, and the empty case arrives too: a face with no
- * `alt` and no `fallback` still carries the accent variant, and the accent
- * label alone is the honest reading of it.
- *
- * `overflow` takes the count for the reason every counted message here does —
- * "3 more" is a plural category English collapses and Russian does not.
- */
-export interface AvatarGroupLabels {
-    /** The counter tile at the end of the row, named for how many faces it stands in for. */
-    readonly overflow: LabelOf<{
-        count: number;
-    }>;
-    /** One member's whole name, with the accent qualifier already worked into it. `name` is empty when the member gave neither an `alt` nor a `fallback`. */
-    readonly accent: LabelOf<{
-        name: string;
-    }>;
-}
-/**
- * Loom's English, co-located with the component so it tree-shakes with it, and
- * exported so a host can build a partial vocabulary against the real thing.
- */
-export declare const AVATAR_GROUP_LABELS: AvatarGroupLabels;
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: import("vue").DefineComponent<{
-    /** The members, in the order they are shown. The first is the one painted on top. */
-    avatars: AvatarGroupItem[];
-    /** 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. */
-    max?: number;
-    /** Height of every face in the row, and of the counter — one of `Avatar`'s five sizes, `xs` through `xl`. */
-    size?: AvatarSize;
-    /** `circle` or `square`, forwarded to every face so the row reads as one shape. */
-    shape?: AvatarShape;
-    /** `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. */
-    variant?: AvatarVariant;
-    /** The group's accessible name: "Assignees", "Reviewers", "Members". */
-    label?: string;
-    /** The surface the row sits on, so the ring separating the faces matches what surrounds them. */
-    surface?: AvatarGroupSurface;
-    /**
-     * Names for the counter and for an accent member, as any subset of
-     * `AvatarGroupLabels` — the rest stay as the host's `provideLoomLabels`
-     * vocabulary left them, and then as Loom's English.
-     *
-     * The per-instance case is a row where "more" is the wrong word for what
-     * was left out: three reviewers, three members, three files.
-     */
-    labels?: LabelOverrides<AvatarGroupLabels>;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-    /** The members, in the order they are shown. The first is the one painted on top. */
-    avatars: AvatarGroupItem[];
-    /** 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. */
-    max?: number;
-    /** Height of every face in the row, and of the counter — one of `Avatar`'s five sizes, `xs` through `xl`. */
-    size?: AvatarSize;
-    /** `circle` or `square`, forwarded to every face so the row reads as one shape. */
-    shape?: AvatarShape;
-    /** `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. */
-    variant?: AvatarVariant;
-    /** The group's accessible name: "Assignees", "Reviewers", "Members". */
-    label?: string;
-    /** The surface the row sits on, so the ring separating the faces matches what surrounds them. */
-    surface?: AvatarGroupSurface;
-    /**
-     * Names for the counter and for an accent member, as any subset of
-     * `AvatarGroupLabels` — the rest stay as the host's `provideLoomLabels`
-     * vocabulary left them, and then as Loom's English.
-     *
-     * The per-instance case is a row where "more" is the wrong word for what
-     * was left out: three reviewers, three members, three files.
-     */
-    labels?: LabelOverrides<AvatarGroupLabels>;
-}> & Readonly<{}>, {
-    size: AvatarSize;
-    max: number;
-    shape: AvatarShape;
-    variant: AvatarVariant;
-    surface: AvatarGroupSurface;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-//# sourceMappingURL=AvatarGroup.vue.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"AvatarGroup.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/AvatarGroup/AvatarGroup.vue"],"names":[],"mappings":"AA6PA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlE,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACnF,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAEhD,2BAA2B;AAC3B,MAAM,WAAW,eAAe;IAC9B,mEAAmE;IACnE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,2KAA2K;IAC3K,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,sEAAsE;IACtE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oKAAoK;IACpK,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,sEAAsE;AACtE,MAAM,MAAM,kBAAkB,GAAG,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE9E;;;;;;;;;;;;;;GAcG;AACH,MAAM,WAAW,iBAAiB;IAChC,yFAAyF;IACzF,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC9C,yJAAyJ;IACzJ,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAC;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAC5C;AAED;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,iBAGjC,CAAC;wBA6BmB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAqBd,qFAAqF;aAC5E,eAAe,EAAE;IAC1B,sJAAsJ;UAChJ,MAAM;IACZ,6GAA6G;WACtG,UAAU;IACjB,mFAAmF;YAC3E,WAAW;IACnB,+IAA+I;cACrI,aAAa;IACvB,wEAAwE;YAChE,MAAM;IACd,iGAAiG;cACvF,kBAAkB;IAC5B;;;;;;;OAOG;aACM,cAAc,CAAC,iBAAiB,CAAC;;IAtB1C,qFAAqF;aAC5E,eAAe,EAAE;IAC1B,sJAAsJ;UAChJ,MAAM;IACZ,6GAA6G;WACtG,UAAU;IACjB,mFAAmF;YAC3E,WAAW;IACnB,+IAA+I;cACrI,aAAa;IACvB,wEAAwE;YAChE,MAAM;IACd,iGAAiG;cACvF,kBAAkB;IAC5B;;;;;;;OAOG;aACM,cAAc,CAAC,iBAAiB,CAAC;;UAjBnC,UAAU;SAFX,MAAM;WAIJ,WAAW;aAET,aAAa;aAIb,kBAAkB;6EAiL5B,CAAC"}

package/dist/primitives/AvatarGroup/AvatarGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,139 +0,0 @@
-import { cn } from "../../lib/cn.js";
-import { optional } from "../../lib/props.js";
-import { useLabels } from "../../lib/labels.js";
-import { useSplitAttrs } from "../../lib/attrs.js";
-import Avatar_default from "../Avatar/Avatar.js";
-import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, openBlock, renderList, toDisplayString, unref } from "vue";
-//#region src/primitives/AvatarGroup/AvatarGroup.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = ["aria-label"];
-var _hoisted_2 = { class: "sr-only" };
-var _hoisted_3 = { class: "sr-only" };
-/**
-* Loom's English, co-located with the component so it tree-shakes with it, and
-* exported so a host can build a partial vocabulary against the real thing.
-*/
-var AVATAR_GROUP_LABELS = {
-	overflow: ({ count }) => `${String(count)} more`,
-	accent: ({ name }) => name ? `${name}, Accent` : "Accent"
-};
-/**
-* How far each face tucks under the one before it — a quarter of its own width
-* at every size, so a row of `xs` avatars reads at the same density as a row of
-* `xl` ones. A fixed offset would look like a badly spaced flex row at the top
-* of the scale and swallow the initials at the bottom of it.
-*/
-var OVERLAP = {
-	xs: "-ml-1.5",
-	sm: "-ml-2",
-	md: "-ml-2.5",
-	lg: "-ml-3",
-	xl: "-ml-4"
-};
-/**
-* The ring that cuts each face out of the one it overlaps. Without it two
-* portraits of similar tone merge into one shape, so it is structural rather
-* than decorative — which is also why it has to be the colour of whatever
-* surrounds the row, something only the caller knows. The names are
-* Indicator's, for the same reason and with the same meaning.
-*/
-var SURFACE_RING = {
-	background: "ring-background",
-	card: "ring-card",
-	sunken: "ring-sunken",
-	popover: "ring-popover"
-};
-var AvatarGroup_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
-	inheritAttrs: false,
-	__name: "AvatarGroup",
-	props: {
-		avatars: {},
-		max: { default: 4 },
-		size: { default: "md" },
-		shape: { default: "circle" },
-		variant: { default: "default" },
-		label: {},
-		surface: { default: "background" },
-		labels: {}
-	},
-	setup(__props) {
-		const props = __props;
-		const text = useLabels("avatarGroup", AVATAR_GROUP_LABELS, () => props.labels);
-		const { attrs, rest } = useSplitAttrs();
-		/**
-		* At least one face always renders. `max = 0` is the boundary that decides
-		* this: a group collapsed to nothing but "+5" has spent an avatar row saying
-		* only that some people exist, which is strictly less than one face and a
-		* count would have said.
-		*/
-		const shown = computed(() => props.avatars.slice(0, Math.max(1, Math.trunc(props.max))));
-		/** How many members the row did not have room for. Zero renders no counter at all. */
-		const hidden = computed(() => props.avatars.length - shown.value.length);
-		/** What the counter prints. `+3` is the layout; the sentence below is the information. */
-		const printed = computed(() => `+${String(hidden.value)}`);
-		const overlap = computed(() => OVERLAP[props.size]);
-		/** `ring-2` in the surface colour, on every face including the counter. */
-		const ring = computed(() => cn("ring-2", SURFACE_RING[props.surface]));
-		/**
-		* What a screen reader reads for one member. The accent qualifier is composed
-		* here rather than left to `Avatar`'s own hidden label, because the portrait
-		* inside each item is `aria-hidden` — the item says the name once, in one
-		* voice, whichever state the image is in.
-		*/
-		function memberName(item) {
-			const who = (item.alt ?? item.fallback ?? "").trim();
-			if ((item.variant ?? props.variant) !== "accent") return who;
-			return text.value.accent({ name: who });
-		}
-		return (_ctx, _cache) => {
-			return __props.avatars.length > 0 ? (openBlock(), createElementBlock("div", mergeProps({
-				key: 0,
-				role: "list",
-				"aria-label": __props.label
-			}, unref(rest), { class: unref(cn)("flex items-center", unref(attrs).class) }), [(openBlock(true), createElementBlock(Fragment, null, renderList(shown.value, (item, index) => {
-				return openBlock(), createElementBlock("span", {
-					key: `${String(index)}-${item.src ?? item.fallback ?? ""}`,
-					role: "listitem",
-					style: normalizeStyle({ zIndex: shown.value.length - index }),
-					class: normalizeClass(unref(cn)("relative", index > 0 && overlap.value))
-				}, [createVNode(Avatar_default, mergeProps({
-					"aria-hidden": "true",
-					"accent-label": ""
-				}, { ref_for: true }, unref(optional)({
-					src: item.src,
-					alt: item.alt,
-					fallback: item.fallback
-				}), {
-					size: __props.size,
-					shape: __props.shape,
-					variant: item.variant ?? __props.variant,
-					class: ring.value
-				}), null, 16, [
-					"size",
-					"shape",
-					"variant",
-					"class"
-				]), createElementVNode("span", _hoisted_2, toDisplayString(memberName(item)), 1)], 6);
-			}), 128)), hidden.value > 0 ? (openBlock(), createElementBlock("span", {
-				key: 0,
-				role: "listitem",
-				style: { zIndex: 0 },
-				class: normalizeClass(unref(cn)("relative", overlap.value))
-			}, [createVNode(Avatar_default, {
-				"aria-hidden": "true",
-				fallback: printed.value,
-				size: __props.size,
-				shape: __props.shape,
-				class: normalizeClass(unref(cn)(ring.value, "bg-subtle text-subtle-foreground tabular"))
-			}, null, 8, [
-				"fallback",
-				"size",
-				"shape",
-				"class"
-			]), createElementVNode("span", _hoisted_3, toDisplayString(unref(text).overflow({ count: hidden.value })), 1)], 2)) : createCommentVNode("", true)], 16, _hoisted_1)) : createCommentVNode("", true);
-		};
-	}
-});
-//#endregion
-export { AVATAR_GROUP_LABELS, AvatarGroup_vue_vue_type_script_setup_true_lang_default as default };
-
-//# sourceMappingURL=AvatarGroup.vue_vue_type_script_setup_true_lang.js.map

package/dist/primitives/AvatarGroup/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":["../../../src/primitives/AvatarGroup/AvatarGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AvatarShape, AvatarSize, AvatarVariant } from \"../Avatar/Avatar.vue\";\nimport type { LabelOf } from \"../../lib/labels\";\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 * The two sentences the row says that are not a member's own name.\n *\n * **`accent` is one key and not a name, a comma and a qualifier.** Where the\n * qualifier sits relative to the name, and whether a comma is what separates\n * them at all, is a property of the language — Loom joining `${who}, ${what}`\n * has already answered both, in English, for every host that translates the\n * two halves. The name arrives raw because it is the caller's own data rather\n * than anything Loom formatted, and the empty case arrives too: a face with no\n * `alt` and no `fallback` still carries the accent variant, and the accent\n * label alone is the honest reading of it.\n *\n * `overflow` takes the count for the reason every counted message here does —\n * \"3 more\" is a plural category English collapses and Russian does not.\n */\nexport interface AvatarGroupLabels {\n  /** The counter tile at the end of the row, named for how many faces it stands in for. */\n  readonly overflow: LabelOf<{ count: number }>;\n  /** One member's whole name, with the accent qualifier already worked into it. `name` is empty when the member gave neither an `alt` nor a `fallback`. */\n  readonly accent: LabelOf<{ name: string }>;\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 \"../Avatar/Avatar.vue\";\nimport { cn } from \"../../lib/cn\";\nimport { optional } from \"../../lib/props\";\nimport { useSplitAttrs } from \"../../lib/attrs\";\nimport { useLabels, type LabelOverrides } from \"../../lib/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":";;;;;;;;;;;;;;AA6CA,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,gBARF,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,gBAAA;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/primitives/Badge/Badge.js

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

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

@@ -1 +0,0 @@
-{"version":3,"file":"Badge.js","names":[],"sources":["../../../src/primitives/Badge/Badge.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * Badge — small status / meta chip. The `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        primary: \"border-transparent bg-primary/12 text-primary\",\n        success: \"border-transparent bg-success/12 text-success\",\n        warning: \"border-transparent bg-warning/12 text-warning\",\n        info: \"border-transparent bg-info/12 text-info\",\n        destructive: \"border-transparent bg-destructive/12 text-destructive\",\n        accent: \"border-accent/40 bg-accent-muted text-accent\",\n      } satisfies Record<BadgeVariant, string>,\n    },\n    defaultVariants: { variant: \"neutral\" },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** Which status or meta this chip carries. `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/primitives/Badge/Badge.vue.d.ts.map

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

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

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

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

@@ -1 +0,0 @@
-{"version":3,"file":"Badge.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/primitives/Badge/Badge.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * Badge — small status / meta chip. The `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        primary: \"border-transparent bg-primary/12 text-primary\",\n        success: \"border-transparent bg-success/12 text-success\",\n        warning: \"border-transparent bg-warning/12 text-warning\",\n        info: \"border-transparent bg-info/12 text-info\",\n        destructive: \"border-transparent bg-destructive/12 text-destructive\",\n        accent: \"border-accent/40 bg-accent-muted text-accent\",\n      } satisfies Record<BadgeVariant, string>,\n    },\n    defaultVariants: { variant: \"neutral\" },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** Which status or meta this chip carries. `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;EACT,SAAS;EACT,SAAS;EACT,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/primitives/Breadcrumb/Breadcrumb.js

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

package/dist/primitives/Breadcrumb/Breadcrumb.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Breadcrumb.js","names":[],"sources":["../../../src/primitives/Breadcrumb/Breadcrumb.vue"],"sourcesContent":["<script lang=\"ts\">\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</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\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 */\nwithDefaults(\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  { separator: \"/\" },\n);\n</script>\n\n<template>\n  <nav aria-label=\"Breadcrumb\">\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('text-muted-foreground hover:text-foreground transition-colors duration-fast')\n            \"\n          >\n            {{ item.label }}\n          </a>\n        </li>\n      </template>\n    </ol>\n  </nav>\n</template>\n"],"mappings":""}

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

@@ -1,25 +0,0 @@
-/** The visible label text and optional link target for one step in the trail. */
-export interface BreadcrumbItem {
-    /** The visible label text. */
-    label: string;
-    /** The link target. Omit for the current (last) item. */
-    href?: string;
-}
-/** Visual separators between breadcrumb steps. `chevron` renders an inline SVG. */
-export type BreadcrumbSeparator = "/" | "\\" | ">" | "→" | "chevron";
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: import("vue").DefineComponent<{
-    /** The breadcrumb trail, last item is the current page. */
-    items: BreadcrumbItem[];
-    /** Visual separator between items. `chevron` renders an inline SVG arrow. */
-    separator?: BreadcrumbSeparator;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-    /** The breadcrumb trail, last item is the current page. */
-    items: BreadcrumbItem[];
-    /** Visual separator between items. `chevron` renders an inline SVG arrow. */
-    separator?: BreadcrumbSeparator;
-}> & Readonly<{}>, {
-    separator: BreadcrumbSeparator;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-//# sourceMappingURL=Breadcrumb.vue.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Breadcrumb.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/Breadcrumb/Breadcrumb.vue"],"names":[],"mappings":"AAiFA,iFAAiF;AACjF,MAAM,WAAW,cAAc;IAC7B,8BAA8B;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,mFAAmF;AACnF,MAAM,MAAM,mBAAmB,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,SAAS,CAAC;wBAChD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAQd,2DAA2D;WACpD,cAAc,EAAE;IACvB,6EAA6E;gBACjE,mBAAmB;;IAH/B,2DAA2D;WACpD,cAAc,EAAE;IACvB,6EAA6E;gBACjE,mBAAmB;;eAAnB,mBAAmB;6EA+F/B,CAAC"}

package/dist/primitives/Breadcrumb/Breadcrumb.vue_vue_type_script_setup_true_lang.js

@@ -1,48 +0,0 @@
-import { cn } from "../../lib/cn.js";
-import { Fragment, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString, unref } from "vue";
-//#region src/primitives/Breadcrumb/Breadcrumb.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { "aria-label": "Breadcrumb" };
-var _hoisted_2 = { class: "flex items-center gap-1.5 text-sm" };
-var _hoisted_3 = {
-	key: 0,
-	xmlns: "http://www.w3.org/2000/svg",
-	width: "16",
-	height: "16",
-	viewBox: "0 0 24 24",
-	fill: "none",
-	stroke: "currentColor",
-	"stroke-width": "2",
-	"stroke-linecap": "round",
-	"stroke-linejoin": "round"
-};
-var _hoisted_4 = { key: 1 };
-var _hoisted_5 = { key: 2 };
-var _hoisted_6 = ["href"];
-var Breadcrumb_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
-	__name: "Breadcrumb",
-	props: {
-		items: {},
-		separator: { default: "/" }
-	},
-	setup(__props) {
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("nav", _hoisted_1, [createElementVNode("ol", _hoisted_2, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item, index) => {
-				return openBlock(), createElementBlock(Fragment, { key: index }, [index > 0 ? (openBlock(), createElementBlock("li", {
-					key: 0,
-					"aria-hidden": "true",
-					class: normalizeClass(unref(cn)("text-muted-foreground/50"))
-				}, [__props.separator === "chevron" ? (openBlock(), createElementBlock("svg", _hoisted_3, [..._cache[0] || (_cache[0] = [createElementVNode("path", { d: "m9 18 6-6-6-6" }, null, -1)])])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(__props.separator), 1)], 64))], 2)) : createCommentVNode("", true), index === __props.items.length - 1 ? (openBlock(), createElementBlock("li", _hoisted_4, [createElementVNode("span", {
-					"aria-current": "page",
-					class: normalizeClass(unref(cn)("text-foreground font-medium"))
-				}, toDisplayString(item.label), 3)])) : (openBlock(), createElementBlock("li", _hoisted_5, [createElementVNode("a", {
-					href: item.href,
-					class: normalizeClass(unref(cn)("text-muted-foreground hover:text-foreground transition-colors duration-fast"))
-				}, toDisplayString(item.label), 11, _hoisted_6)]))], 64);
-			}), 128))])]);
-		};
-	}
-});
-//#endregion
-export { Breadcrumb_vue_vue_type_script_setup_true_lang_default as default };
-
-//# sourceMappingURL=Breadcrumb.vue_vue_type_script_setup_true_lang.js.map

package/dist/primitives/Breadcrumb/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":["../../../src/primitives/Breadcrumb/Breadcrumb.vue"],"sourcesContent":["<script lang=\"ts\">\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</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\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 */\nwithDefaults(\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  { separator: \"/\" },\n);\n</script>\n\n<template>\n  <nav aria-label=\"Breadcrumb\">\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('text-muted-foreground hover:text-foreground transition-colors duration-fast')\n            \"\n          >\n            {{ item.label }}\n          </a>\n        </li>\n      </template>\n    </ol>\n  </nav>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCE,OAAA,UAAA,GAAA,mBAuCM,OAvCN,YAuCM,CAtCJ,mBAqCK,MArCL,YAqCK,EApCH,UAAA,IAAA,GAAA,mBAmCW,UAAA,MAAA,WAnCuB,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,mBASK,MAAA,YAAA,CARH,mBAOI,KAAA;KAND,MAAM,KAAK;KACX,OAAK,eAAiB,MAAA,EAAA,CAAE,CAAA,6EAAA,CAAA;IAItB,GAAA,gBAAA,KAAK,KAAK,GAAA,IAAA,UAAA,CAAA,CAAA,EAAA,GAAA,EAAA"}

package/dist/primitives/Button/Button.js

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

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

@@ -1 +0,0 @@
-{"version":3,"file":"Button.js","names":[],"sources":["../../../src/primitives/Button/Button.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\n/**\n * The six weights, and the choice between them is about emphasis rather than\n * colour: `primary` is the one action a screen is asking for, `destructive` is\n * the one it is warning about, and the four between them step down.\n */\nexport type ButtonVariant =\n  \"primary\" | \"secondary\" | \"subtle\" | \"outline\" | \"ghost\" | \"destructive\";\n\nexport type ButtonSize = \"sm\" | \"md\" | \"lg\" | \"icon\" | \"icon-sm\";\n\n/**\n * 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 \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** How much emphasis the action carries. */\n    variant?: ButtonVariant;\n    /** Control height. `icon` and `icon-sm` are square, for a glyph alone. */\n    size?: ButtonSize;\n    /** Locks the button and plays the kinetic swap (label → arc + loadingText). */\n    loading?: boolean;\n    /** Text shown beside the progress arc while loading, e.g. \"Saving…\". */\n    loadingText?: string;\n    /** Unavailable rather than busy — 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        <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/primitives/Button/Button.vue.d.ts

@@ -1,93 +0,0 @@
-/**
- * The six weights, and the choice between them is about emphasis rather than
- * colour: `primary` is the one action a screen is asking for, `destructive` is
- * the one it is warning about, and the four between them step down.
- */
-export type ButtonVariant = "primary" | "secondary" | "subtle" | "outline" | "ghost" | "destructive";
-export type ButtonSize = "sm" | "md" | "lg" | "icon" | "icon-sm";
-/**
- * One row per rest-state variant, naming the fill and the label token the
- * variant paints. Kept separate from the `cva` call because it is also the
- * contract `Button.contrast.test.ts` reads: that file derives every variant's
- * pairing from here, so a variant added to the map is measured on arrival
- * rather than when someone remembers to add a row to a test. The two halves
- * — this map and the `cva` call consuming it — cannot drift apart, because
- * `cva` is handed this very object.
- *
- * `satisfies` is what keeps this map and the union honest. The union above is
- * the name a consumer imports and the documentation prints; the map below is
- * the classes. Adding a member to one and not the other stops compiling, so
- * neither can be the stale copy of the other.
- */
-export declare const buttonVariantClasses: {
-    primary: string;
-    secondary: string;
-    subtle: string;
-    outline: string;
-    ghost: string;
-    destructive: string;
-};
-/**
- * Button — the workhorse, and the primitive that encodes Loom's press
- * language:
- *
- *   • hover lifts by fill, not by shadow
- *   • active presses down (scale 0.97) — physical, causal feedback
- *   • focus blooms the primary ring
- *   • loading plays a kinetic swap under a shimmer sweep: the label rolls up
- *     and out, a progress arc springs in, the loading text rises last — and
- *     both layers share one grid cell, so the width never jumps mid-film
- *
- * Unavailable is painted in colours rather than dimmed, and it is keyed off the
- * `disabled` prop rather than off the DOM disabled state — a loading button is
- * also DOM-disabled yet has to read as "working", not "unavailable". See the
- * drained treatment on the root element for the measurements that removed the
- * dim.
- */
-export declare const buttonVariants: (props?: ({
-    variant?: "outline" | "primary" | "destructive" | "secondary" | "subtle" | "ghost" | null | undefined;
-    size?: "sm" | "md" | "lg" | "icon" | "icon-sm" | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
-    /** How much emphasis the action carries. */
-    variant?: ButtonVariant;
-    /** Control height. `icon` and `icon-sm` are square, for a glyph alone. */
-    size?: ButtonSize;
-    /** Locks the button and plays the kinetic swap (label → arc + loadingText). */
-    loading?: boolean;
-    /** Text shown beside the progress arc while loading, e.g. "Saving…". */
-    loadingText?: string;
-    /** Unavailable rather than busy — drains the button to the neutral well and blocks pointer events. */
-    disabled?: boolean;
-    /** The native button type. Defaults to `button`, never an accidental submit. */
-    type?: "button" | "submit" | "reset";
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-    /** How much emphasis the action carries. */
-    variant?: ButtonVariant;
-    /** Control height. `icon` and `icon-sm` are square, for a glyph alone. */
-    size?: ButtonSize;
-    /** Locks the button and plays the kinetic swap (label → arc + loadingText). */
-    loading?: boolean;
-    /** Text shown beside the progress arc while loading, e.g. "Saving…". */
-    loadingText?: string;
-    /** Unavailable rather than busy — drains the button to the neutral well and blocks pointer events. */
-    disabled?: boolean;
-    /** The native button type. Defaults to `button`, never an accidental submit. */
-    type?: "button" | "submit" | "reset";
-}> & Readonly<{}>, {
-    size: ButtonSize;
-    disabled: boolean;
-    type: "button" | "submit" | "reset";
-    variant: ButtonVariant;
-    loading: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: (props: {}) => any;
-}>;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
-//# sourceMappingURL=Button.vue.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Button.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/Button/Button.vue"],"names":[],"mappings":"AA+MA;;;;GAIG;AACH,MAAM,MAAM,aAAa,GACvB,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,aAAa,CAAC;AAE3E,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;AAEjE;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,oBAAoB;;;;;;;CAOQ,CAAC;AAE1C;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,cAAc;;;8EA4B1B,CAAC;wBACmB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,4CAA4C;cAClC,aAAa;IACvB,0EAA0E;WACnE,UAAU;IACjB,+EAA+E;cACrE,OAAO;IACjB,wEAAwE;kBAC1D,MAAM;IACpB,sGAAsG;eAC3F,OAAO;IAClB,gFAAgF;WACzE,QAAQ,GAAG,QAAQ,GAAG,OAAO;;IAXpC,4CAA4C;cAClC,aAAa;IACvB,0EAA0E;WACnE,UAAU;IACjB,+EAA+E;cACrE,OAAO;IACjB,wEAAwE;kBAC1D,MAAM;IACpB,sGAAsG;eAC3F,OAAO;IAClB,gFAAgF;WACzE,QAAQ,GAAG,QAAQ,GAAG,OAAO;;UAR7B,UAAU;cAMN,OAAO;UAEX,QAAQ,GAAG,QAAQ,GAAG,OAAO;aAV1B,aAAa;aAIb,OAAO;;cAqKP,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}