@ecoma-io/loom 0.1.0 → 0.2.0

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

@@ -0,0 +1,68 @@
+/**
+ * Which edge of the trigger the card prefers, before collision flipping. The
+ * members mirror Reka's own `Side`, and the template binding is what enforces
+ * that: a member Reka does not accept stops `:side="side"` type-checking.
+ * Declared here rather than aliased so the generated props table prints the
+ * four values instead of a name that tells the reader nothing.
+ */
+export type HoverCardSide = "top" | "right" | "bottom" | "left";
+/**
+ * How the card aligns against the trigger along the cross-axis, before
+ * collision flipping. Same rationale as `HoverCardSide`.
+ */
+export type HoverCardAlign = "start" | "center" | "end";
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** The edge of the trigger to anchor against, before collision flipping. */
+    side?: HoverCardSide;
+    /** Gap in pixels between the trigger and the card. */
+    sideOffset?: number;
+    /** Alignment against the trigger along the cross-axis, before collision flipping. */
+    align?: HoverCardAlign;
+    /** Alignment offset in pixels from the chosen alignment position. */
+    alignOffset?: number;
+    /** Milliseconds of hover before the card appears. */
+    openDelay?: number;
+    /** Milliseconds before the card disappears after the pointer leaves both trigger and content. */
+    closeDelay?: number;
+    /** Drive the card from the host with `v-model:open`. Omit for hover alone. */
+    open?: boolean | undefined;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    /** The edge of the trigger to anchor against, before collision flipping. */
+    side?: HoverCardSide;
+    /** Gap in pixels between the trigger and the card. */
+    sideOffset?: number;
+    /** Alignment against the trigger along the cross-axis, before collision flipping. */
+    align?: HoverCardAlign;
+    /** Alignment offset in pixels from the chosen alignment position. */
+    alignOffset?: number;
+    /** Milliseconds of hover before the card appears. */
+    openDelay?: number;
+    /** Milliseconds before the card disappears after the pointer leaves both trigger and content. */
+    closeDelay?: number;
+    /** Drive the card from the host with `v-model:open`. Omit for hover alone. */
+    open?: boolean | undefined;
+}> & Readonly<{
+    "onUpdate:open"?: (value: boolean) => any;
+}>, {
+    open: boolean | undefined;
+    side: HoverCardSide;
+    sideOffset: number;
+    align: HoverCardAlign;
+    alignOffset: number;
+    openDelay: number;
+    closeDelay: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    trigger?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=HoverCard.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"HoverCard.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/HoverCard/HoverCard.vue"],"names":[],"mappings":"AAqIA;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAEhE;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;wBACnC,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAgBd,4EAA4E;WACrE,aAAa;IACpB,sDAAsD;iBACzC,MAAM;IACnB,qFAAqF;YAC7E,cAAc;IACtB,qEAAqE;kBACvD,MAAM;IACpB,qDAAqD;gBACzC,MAAM;IAClB,iGAAiG;iBACpF,MAAM;IACnB,8EAA8E;WACvE,OAAO,GAAG,SAAS;;;;IAb1B,4EAA4E;WACrE,aAAa;IACpB,sDAAsD;iBACzC,MAAM;IACnB,qFAAqF;YAC7E,cAAc;IACtB,qEAAqE;kBACvD,MAAM;IACpB,qDAAqD;gBACzC,MAAM;IAClB,iGAAiG;iBACpF,MAAM;IACnB,8EAA8E;WACvE,OAAO,GAAG,SAAS;;;;UAAnB,OAAO,GAAG,SAAS;UAZnB,aAAa;gBAEP,MAAM;WAEX,cAAc;iBAER,MAAM;eAER,MAAM;gBAEL,MAAM;;cAuLT,CAAC,KAAK,IAAiB,KAAK,GAAG;;cAC/B,CAAC,KAAK,IAAiB,KAAK,GAAG;EAWzC,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/HoverCard/HoverCard.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,62 @@
+import { cn } from "../../lib/cn.js";
+import { optional } from "../../lib/props.js";
+import { createBlock, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
+import { HoverCardArrow, HoverCardContent, HoverCardPortal, HoverCardRoot, HoverCardTrigger } from "reka-ui";
+//#region src/primitives/HoverCard/HoverCard.vue?vue&type=script&setup=true&lang.ts
+var HoverCard_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "HoverCard",
+	props: {
+		side: { default: "bottom" },
+		sideOffset: { default: 6 },
+		align: { default: "start" },
+		alignOffset: { default: 0 },
+		openDelay: { default: 300 },
+		closeDelay: { default: 300 },
+		open: {
+			type: Boolean,
+			default: void 0
+		}
+	},
+	emits: ["update:open"],
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(HoverCardRoot), mergeProps({
+				"open-delay": __props.openDelay,
+				"close-delay": __props.closeDelay
+			}, unref(optional)({ open: __props.open }), { "onUpdate:open": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:open", $event)) }), {
+				default: withCtx(() => [createVNode(unref(HoverCardTrigger), { "as-child": "" }, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "trigger")]),
+					_: 3
+				}), createVNode(unref(HoverCardPortal), null, {
+					default: withCtx(() => [createVNode(unref(HoverCardContent), {
+						side: __props.side,
+						"side-offset": __props.sideOffset,
+						align: __props.align,
+						"align-offset": __props.alignOffset,
+						class: normalizeClass(unref(cn)("z-50 w-64 rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md outline-none", "data-[state=open]:animate-scale-in")),
+						style: { "transform-origin": "var(--reka-popper-transform-origin)" }
+					}, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "default"), createVNode(unref(HoverCardArrow), {
+							class: "fill-popover",
+							width: 10,
+							height: 5
+						})]),
+						_: 3
+					}, 8, [
+						"side",
+						"side-offset",
+						"align",
+						"align-offset",
+						"class"
+					])]),
+					_: 3
+				})]),
+				_: 3
+			}, 16, ["open-delay", "close-delay"]);
+		};
+	}
+});
+//#endregion
+export { HoverCard_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=HoverCard.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"HoverCard.vue_vue_type_script_setup_true_lang.js","names":["$emit"],"sources":["../../../src/primitives/HoverCard/HoverCard.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Which edge of the trigger the card prefers, before collision flipping. The\n * members mirror Reka's own `Side`, and the template binding is what enforces\n * that: a member Reka does not accept stops `:side=\"side\"` type-checking.\n * Declared here rather than aliased so the generated props table prints the\n * four values instead of a name that tells the reader nothing.\n */\nexport type HoverCardSide = \"top\" | \"right\" | \"bottom\" | \"left\";\n\n/**\n * How the card aligns against the trigger along the cross-axis, before\n * collision flipping. Same rationale as `HoverCardSide`.\n */\nexport type HoverCardAlign = \"start\" | \"center\" | \"end\";\n</script>\n\n<script setup lang=\"ts\">\nimport {\n  HoverCardRoot,\n  HoverCardTrigger,\n  HoverCardPortal,\n  HoverCardContent,\n  HoverCardArrow,\n} from \"reka-ui\";\nimport { cn } from \"../../lib/cn\";\nimport { optional } from \"../../lib/props\";\n\n/**\n * HoverCard — a quick preview surface on hover, whose content IS interactive.\n *\n * Unlike a Tooltip, the user can move their pointer into the card and interact\n * with it: click a link, press a button, select text. The close delay is long\n * enough for the pointer to travel from trigger to content without the card\n * vanishing mid-transit. This is the difference that makes a hover card a\n * complementary surface and a tooltip a non-interactive hint.\n *\n * The content is NOT wired as `aria-describedby` — it is a supplementary panel,\n * not an accessible name supplement. A screen reader user who never hovers\n * should still have the trigger's own accessible name, and the card is extra\n * rather than essential.\n */\nwithDefaults(\n  defineProps<{\n    /** The edge of the trigger to anchor against, before collision flipping. */\n    side?: HoverCardSide;\n    /** Gap in pixels between the trigger and the card. */\n    sideOffset?: number;\n    /** Alignment against the trigger along the cross-axis, before collision flipping. */\n    align?: HoverCardAlign;\n    /** Alignment offset in pixels from the chosen alignment position. */\n    alignOffset?: number;\n    /** Milliseconds of hover before the card appears. */\n    openDelay?: number;\n    /** Milliseconds before the card disappears after the pointer leaves both trigger and content. */\n    closeDelay?: number;\n    /** Drive the card from the host with `v-model:open`. Omit for hover alone. */\n    open?: boolean | undefined;\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. `optional()` in the template is the other half; its docblock\n  // carries the reasoning for both.\n  {\n    side: \"bottom\",\n    sideOffset: 6,\n    align: \"start\",\n    alignOffset: 0,\n    openDelay: 300,\n    closeDelay: 300,\n    open: undefined,\n  },\n);\n\ndefineEmits<{ \"update:open\": [value: boolean] }>();\n</script>\n\n<template>\n  <HoverCardRoot\n    :open-delay=\"openDelay\"\n    :close-delay=\"closeDelay\"\n    v-bind=\"optional({ open })\"\n    @update:open=\"$emit('update:open', $event)\"\n  >\n    <!-- @slot The element that opens the card on hover. Rendered `as-child`, so\n         the caller's own element *is* the trigger and keeps its own accessible\n         name. -->\n    <HoverCardTrigger as-child>\n      <slot name=\"trigger\" />\n    </HoverCardTrigger>\n\n    <HoverCardPortal>\n      <HoverCardContent\n        :side=\"side\"\n        :side-offset=\"sideOffset\"\n        :align=\"align\"\n        :align-offset=\"alignOffset\"\n        :class=\"\n          cn(\n            'z-50 w-64 rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md outline-none',\n            // Scoped to the open state, never unconditional. Reka's Presence\n            // keeps closed content mounted until an animationend arrives, and\n            // a mount-only animation never fires a second one — so an\n            // unconditional animation class leaves a stray card in the page.\n            // Scoped, the closed element computes `animation-name: none` and\n            // Presence unmounts it at once.\n            'data-[state=open]:animate-scale-in',\n          )\n        \"\n        style=\"transform-origin: var(--reka-popper-transform-origin)\"\n      >\n        <!-- @slot The card content. Unlike a tooltip, this CAN contain\n             interactive elements — links, buttons, any focusable control. -->\n        <slot />\n        <HoverCardArrow class=\"fill-popover\" :width=\"10\" :height=\"5\" />\n      </HoverCardContent>\n    </HoverCardPortal>\n  </HoverCardRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;GA8EE,OAAA,UAAA,GAAA,YAuCgB,MAAA,aAAA,GAvChB,WAuCgB;IAtCb,cAAY,QAAA;IACZ,eAAa,QAAA;GACN,GAAA,MAAA,QAAA,CAAQ,CAAA,EAAA,MAAG,QAAA,KAAI,CAAA,GAAA,EACtB,iBAAW,OAAA,OAAA,OAAA,MAAA,WAAEA,KAAAA,MAAK,eAAgB,MAAM,GAAA,CAAA,GAAA;IAKzC,SAAA,cAEmB,CAFnB,YAEmB,MAAA,gBAAA,GAAA,EAFD,YAAA,GAAQ,GAAA;KACxB,SAAA,cAAuB,CAAvB,WAAuB,KAAA,QAAA,SAAA,CAAA,CAAA;;IAGzB,CAAA,GAAA,YAyBkB,MAAA,eAAA,GAAA,MAAA;KAxBhB,SAAA,cAuBmB,CAvBnB,YAuBmB,MAAA,gBAAA,GAAA;MAtBhB,MAAM,QAAA;MACN,eAAa,QAAA;MACb,OAAO,QAAA;MACP,gBAAc,QAAA;MACd,OAAK,eAAa,MAAA,EAAA,CAAE,CAAA,2GAAA,oCAAA,CAAA;MAYrB,OAAA,EAAA,oBAAA,sCAAA;;MAIA,SAAA,cAAQ,CAAR,WAAQ,KAAA,QAAA,SAAA,GACR,YAA+D,MAAA,cAAA,GAAA;OAA/C,OAAM;OAAgB,OAAO;OAAK,QAAQ"}

package/dist/primitives/IconButton/IconButton.js

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

package/dist/primitives/IconButton/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.js","names":[],"sources":["../../../src/primitives/IconButton/IconButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\nexport type IconButtonVariant = \"default\" | \"secondary\" | \"ghost\" | \"destructive\";\n\nexport type IconButtonSize = \"sm\" | \"md\" | \"lg\";\n\n/**\n * An icon-only button is a square, so every size is height-equals-width and has\n * no horizontal padding. The four variants match Button's press language — hover\n * lifts by fill — but `default` here names what Button calls `primary`, because\n * an icon button is never the screen's primary action and the word would mislead.\n */\nexport const iconButtonVariants = cva(\n  \"inline-flex items-center justify-center rounded-md transition-colors duration-fast ease-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90 active:bg-primary/80\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-secondary/80 active:bg-secondary/70\",\n        ghost: \"hover:bg-subtle text-foreground\",\n        destructive:\n          \"bg-destructive text-destructive-foreground hover:bg-destructive/90 active:bg-destructive/80\",\n      } satisfies Record<IconButtonVariant, string>,\n      size: {\n        sm: \"h-8 w-8\",\n        md: \"h-9 w-9\",\n        lg: \"h-10 w-10\",\n      } satisfies Record<IconButtonSize, string>,\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"md\",\n    },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** Visual weight, matching Button's press language but without the `primary` name — an icon button is never the action a screen is asking for. */\n    variant?: IconButtonVariant;\n    /** Square hit area. Every size is 24px or above (WCAG 2.2 SC 2.5.8). */\n    size?: IconButtonSize;\n    /** The accessible name. An icon-only button without one is a WCAG failure, so this prop is required. */\n    label: string;\n    /** Unavailable — blocks pointer events and dims the icon. */\n    disabled?: boolean;\n  }>(),\n  { variant: \"default\", size: \"md\", disabled: false },\n);\n</script>\n\n<template>\n  <button\n    :class=\"cn(iconButtonVariants({ variant, size }), $attrs.class)\"\n    :aria-label=\"label\"\n    :disabled=\"disabled\"\n  >\n    <slot />\n  </button>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,45 @@
+export type IconButtonVariant = "default" | "secondary" | "ghost" | "destructive";
+export type IconButtonSize = "sm" | "md" | "lg";
+/**
+ * An icon-only button is a square, so every size is height-equals-width and has
+ * no horizontal padding. The four variants match Button's press language — hover
+ * lifts by fill — but `default` here names what Button calls `primary`, because
+ * an icon button is never the screen's primary action and the word would mislead.
+ */
+export declare const iconButtonVariants: (props?: ({
+    variant?: "default" | "destructive" | "secondary" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | 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<{
+    /** Visual weight, matching Button's press language but without the `primary` name — an icon button is never the action a screen is asking for. */
+    variant?: IconButtonVariant;
+    /** Square hit area. Every size is 24px or above (WCAG 2.2 SC 2.5.8). */
+    size?: IconButtonSize;
+    /** The accessible name. An icon-only button without one is a WCAG failure, so this prop is required. */
+    label: string;
+    /** Unavailable — blocks pointer events and dims the icon. */
+    disabled?: boolean;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** Visual weight, matching Button's press language but without the `primary` name — an icon button is never the action a screen is asking for. */
+    variant?: IconButtonVariant;
+    /** Square hit area. Every size is 24px or above (WCAG 2.2 SC 2.5.8). */
+    size?: IconButtonSize;
+    /** The accessible name. An icon-only button without one is a WCAG failure, so this prop is required. */
+    label: string;
+    /** Unavailable — blocks pointer events and dims the icon. */
+    disabled?: boolean;
+}> & Readonly<{}>, {
+    size: IconButtonSize;
+    disabled: boolean;
+    variant: IconButtonVariant;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=IconButton.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/IconButton/IconButton.vue"],"names":[],"mappings":"AA0EA,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,aAAa,CAAC;AAElF,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhD;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB;;;8EAuB9B,CAAC;wBACmB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,kJAAkJ;cACxI,iBAAiB;IAC3B,wEAAwE;WACjE,cAAc;IACrB,wGAAwG;WACjG,MAAM;IACb,6DAA6D;eAClD,OAAO;;IAPlB,kJAAkJ;cACxI,iBAAiB;IAC3B,wEAAwE;WACjE,cAAc;IACrB,wGAAwG;WACjG,MAAM;IACb,6DAA6D;eAClD,OAAO;;UAJX,cAAc;cAIV,OAAO;aANR,iBAAiB;;cA0CjB,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/IconButton/IconButton.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,58 @@
+import { cn } from "../../lib/cn.js";
+import { createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot, unref } from "vue";
+import { cva } from "class-variance-authority";
+//#region src/primitives/IconButton/IconButton.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label", "disabled"];
+/**
+* An icon-only button is a square, so every size is height-equals-width and has
+* no horizontal padding. The four variants match Button's press language — hover
+* lifts by fill — but `default` here names what Button calls `primary`, because
+* an icon button is never the screen's primary action and the word would mislead.
+*/
+var iconButtonVariants = cva("inline-flex items-center justify-center rounded-md transition-colors duration-fast ease-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50", {
+	variants: {
+		variant: {
+			default: "bg-primary text-primary-foreground hover:bg-primary/90 active:bg-primary/80",
+			secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 active:bg-secondary/70",
+			ghost: "hover:bg-subtle text-foreground",
+			destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90 active:bg-destructive/80"
+		},
+		size: {
+			sm: "h-8 w-8",
+			md: "h-9 w-9",
+			lg: "h-10 w-10"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "md"
+	}
+});
+var IconButton_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "IconButton",
+	props: {
+		variant: { default: "default" },
+		size: { default: "md" },
+		label: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		}
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("button", {
+				class: normalizeClass(unref(cn)(unref(iconButtonVariants)({
+					variant: __props.variant,
+					size: __props.size
+				}), _ctx.$attrs.class)),
+				"aria-label": __props.label,
+				disabled: __props.disabled
+			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { IconButton_vue_vue_type_script_setup_true_lang_default as default, iconButtonVariants };
+
+//# sourceMappingURL=IconButton.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../src/primitives/IconButton/IconButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\n\nexport type IconButtonVariant = \"default\" | \"secondary\" | \"ghost\" | \"destructive\";\n\nexport type IconButtonSize = \"sm\" | \"md\" | \"lg\";\n\n/**\n * An icon-only button is a square, so every size is height-equals-width and has\n * no horizontal padding. The four variants match Button's press language — hover\n * lifts by fill — but `default` here names what Button calls `primary`, because\n * an icon button is never the screen's primary action and the word would mislead.\n */\nexport const iconButtonVariants = cva(\n  \"inline-flex items-center justify-center rounded-md transition-colors duration-fast ease-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90 active:bg-primary/80\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-secondary/80 active:bg-secondary/70\",\n        ghost: \"hover:bg-subtle text-foreground\",\n        destructive:\n          \"bg-destructive text-destructive-foreground hover:bg-destructive/90 active:bg-destructive/80\",\n      } satisfies Record<IconButtonVariant, string>,\n      size: {\n        sm: \"h-8 w-8\",\n        md: \"h-9 w-9\",\n        lg: \"h-10 w-10\",\n      } satisfies Record<IconButtonSize, string>,\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"md\",\n    },\n  },\n);\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"../../lib/cn\";\n\nwithDefaults(\n  defineProps<{\n    /** Visual weight, matching Button's press language but without the `primary` name — an icon button is never the action a screen is asking for. */\n    variant?: IconButtonVariant;\n    /** Square hit area. Every size is 24px or above (WCAG 2.2 SC 2.5.8). */\n    size?: IconButtonSize;\n    /** The accessible name. An icon-only button without one is a WCAG failure, so this prop is required. */\n    label: string;\n    /** Unavailable — blocks pointer events and dims the icon. */\n    disabled?: boolean;\n  }>(),\n  { variant: \"default\", size: \"md\", disabled: false },\n);\n</script>\n\n<template>\n  <button\n    :class=\"cn(iconButtonVariants({ variant, size }), $attrs.class)\"\n    :aria-label=\"label\"\n    :disabled=\"disabled\"\n  >\n    <slot />\n  </button>\n</template>\n"],"mappings":";;;;;;;;;;;AAaA,IAAa,qBAAqB,IAChC,yRACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,WACE;GACF,OAAO;GACP,aACE;EACJ;EACA,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF;;;;;;;;;;;;;;GAsBE,OAAA,UAAA,GAAA,mBAMS,UAAA;IALN,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,MAAA,kBAAA,CAAkB,CAAA;KAAA,SAAG,QAAA;KAAO,MAAE,QAAA;IAAI,CAAA,GAAKA,KAAAA,OAAO,KAAK,CAAA;IAC7D,cAAY,QAAA;IACZ,UAAU,QAAA;GAEX,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,IAAA,UAAA"}

package/dist/primitives/Indicator/Indicator.js

@@ -0,0 +1,7 @@
+import Indicator_vue_vue_type_script_setup_true_lang_default, { INDICATOR_LABELS, indicatorToneVariants, indicatorVariants } from "./Indicator.vue_vue_type_script_setup_true_lang.js";
+//#region src/primitives/Indicator/Indicator.vue
+var Indicator_default = Indicator_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { INDICATOR_LABELS, Indicator_default as default, indicatorToneVariants, indicatorVariants };
+
+//# sourceMappingURL=Indicator.js.map

package/dist/primitives/Indicator/Indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Indicator.js","names":[],"sources":["../../../src/primitives/Indicator/Indicator.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { cva } from \"class-variance-authority\";\nimport type { LabelOf } from \"../../lib/labels\";\n\n/** A presence dot, or a number. */\nexport type IndicatorVariant = \"dot\" | \"count\";\n\n/** The four presence states a dot can report. */\nexport type IndicatorStatus = \"online\" | \"offline\" | \"busy\" | \"away\";\n\n/** Which corner of the marked element the marker straddles. */\nexport type IndicatorPlacement = \"top-right\" | \"top-left\" | \"bottom-right\" | \"bottom-left\";\n\n/**\n * The colour vocabulary, deliberately Badge's own names rather than a second\n * set — `accent` included, and it means here exactly what it means there:\n * a second semantic category distinct from primary, never decoration.\n */\nexport type IndicatorTone =\n  \"neutral\" | \"primary\" | \"success\" | \"warning\" | \"info\" | \"destructive\" | \"accent\";\n\n/** The surface the marked element sits on, which the separating ring matches. */\nexport type IndicatorSurface = \"background\" | \"card\" | \"sunken\" | \"popover\";\n\nexport const indicatorVariants = cva(\n  // `pointer-events-none` is load-bearing rather than tidy: the marker\n  // overhangs the corner of whatever it marks, so without it the top-right\n  // few pixels of a bell button stop being clickable.\n  \"pointer-events-none absolute z-10 flex items-center justify-center select-none ring-2\",\n  {\n    variants: {\n      variant: {\n        // 12px leaves room for the status glyphs below to read as shapes\n        // rather than as noise.\n        dot: \"h-3 w-3 rounded-full\",\n        // `min-w-5` and the padding together are what make one digit a circle\n        // and three a pill, with no branch: \"1\" is narrower than the minimum\n        // and lands on it, \"99+\" outgrows it and the radius turns the ends.\n        count: \"h-5 min-w-5 rounded-full px-1.5 text-micro font-medium tabular\",\n      } satisfies Record<IndicatorVariant, string>,\n      placement: {\n        \"top-right\": \"top-0 right-0 -translate-y-1/2 translate-x-1/2\",\n        \"top-left\": \"top-0 left-0 -translate-y-1/2 -translate-x-1/2\",\n        \"bottom-right\": \"right-0 bottom-0 translate-x-1/2 translate-y-1/2\",\n        \"bottom-left\": \"bottom-0 left-0 -translate-x-1/2 translate-y-1/2\",\n      } satisfies Record<IndicatorPlacement, string>,\n      // The ring is what separates the marker from the photo, avatar or icon\n      // underneath, the way a presence dot is punched out of a portrait. It\n      // has to be the colour of what surrounds the pair, which only the caller\n      // knows — hence a prop rather than a guess.\n      surface: {\n        background: \"ring-background\",\n        card: \"ring-card\",\n        sunken: \"ring-sunken\",\n        popover: \"ring-popover\",\n      } satisfies Record<IndicatorSurface, string>,\n    },\n    defaultVariants: { variant: \"dot\", placement: \"top-right\", surface: \"background\" },\n  },\n);\n\n/**\n * The fill, keyed by Badge's colour names so a success dot and a success badge\n * are the same green. These are the solid tokens where Badge uses a 12% wash:\n * a wash reads fine across a chip and carries no signal at all across 12px.\n *\n * The paired `text-*` is what the count prints in and what the status glyph is\n * punched out in, so one entry drives both layers.\n */\nexport const indicatorToneVariants = cva(\"\", {\n  variants: {\n    tone: {\n      neutral: \"bg-muted-foreground text-background\",\n      primary: \"bg-primary text-primary-foreground\",\n      success: \"bg-success text-success-foreground\",\n      warning: \"bg-warning text-warning-foreground\",\n      info: \"bg-info text-info-foreground\",\n      destructive: \"bg-destructive text-destructive-foreground\",\n      accent: \"bg-accent text-accent-foreground\",\n    } satisfies Record<IndicatorTone, string>,\n  },\n  defaultVariants: { tone: \"primary\" },\n});\n\n/** Which colour each presence state means, so `status` alone is enough. */\nconst STATUS_TONES = {\n  online: \"success\",\n  offline: \"neutral\",\n  busy: \"destructive\",\n  away: \"warning\",\n} satisfies Record<IndicatorStatus, IndicatorTone>;\n\n/**\n * What a screen reader is told when the caller passes no `label` — which is\n * every string this component can utter, because a marker that renders nothing\n * but a coloured circle has no text of its own to fall back on.\n *\n * The four presence keys are named for the four `IndicatorStatus` members and\n * resolved by lookup, so a status added to the union without a name for it is a\n * compile error rather than an unnamed dot.\n *\n * `count` takes the number and not a formatted string: \"3 unread\" is a plural\n * category in most languages and a digit shape in several, and a component\n * whose whole job is to show a small integer has no business deciding either.\n * It also reports the *real* figure rather than the clamped `99+` — see the\n * comment on `name` below.\n */\nexport interface IndicatorLabels {\n  /** The `online` dot. */\n  readonly online: string;\n  /** The `offline` dot. */\n  readonly offline: string;\n  /** The `busy` dot. */\n  readonly busy: string;\n  /** The `away` dot. */\n  readonly away: string;\n  /** The `count` pill, named for how many things it counts. */\n  readonly count: LabelOf<{ count: number }>;\n  /** A dot with no `status`: something changed here, and nothing more specific. */\n  readonly attention: 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 INDICATOR_LABELS: IndicatorLabels = {\n  online: \"Online\",\n  offline: \"Offline\",\n  busy: \"Busy\",\n  away: \"Away\",\n  count: ({ count }) => `${String(count)} unread`,\n  attention: \"Needs attention\",\n};\n\n/**\n * The shape layer, and it exists for the sighted reader the `sr-only` string\n * below cannot help. Three of the four states are saturated — green, amber,\n * red — which is the exact triple a red/green deficiency collapses, so `busy`\n * wears a bar and `away` a hole and no two of them differ by hue alone.\n * `offline` needs none: grey against any of the three is a saturation\n * difference, not a hue one.\n */\nconst STATUS_GLYPHS = {\n  online: \"\",\n  offline: \"\",\n  busy: \"h-0.5 w-1.5 rounded-full bg-current\",\n  away: \"h-1 w-1 rounded-full bg-current\",\n} satisfies Record<IndicatorStatus, string>;\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, useId } from \"vue\";\nimport { cn } from \"../../lib/cn\";\nimport { useSplitAttrs } from \"../../lib/attrs\";\nimport { useLabels, type LabelOverrides } from \"../../lib/labels\";\n\n/**\n * Indicator — the small marker pinned onto the corner of something else: a\n * presence dot on an avatar, an unread count on a bell, a \"needs attention\"\n * dot on a tab. The default slot is the thing being marked, and the marker\n * positions itself over that child's corner.\n *\n * The boundary with Badge is the whole of the decision between them: **Badge\n * sits in the flow beside content; Indicator is pinned onto content.** A count\n * chip in a table cell is a Badge. The same count floating over a bell icon is\n * an Indicator. Reach for Badge whenever the marker would take up room of its\n * own, and for this whenever it would overhang something.\n *\n * What this component is by default is a bare colour, which is the one thing\n * Loom's accessibility bar forbids outright. A green dot says nothing to a\n * reader who cannot see it. So every marker that renders carries a visually\n * hidden string — `label`, or a default derived from `status` or `count` — and\n * a blank `label` falls back to that default rather than replacing it, which\n * is what makes an unnamed indicator unreachable rather than merely\n * discouraged. The shape layer in `STATUS_GLYPHS` covers the sighted reader\n * the hidden string cannot.\n *\n * There is deliberately **no `aria-live` region here**, and the reason is that\n * this component cannot know whether a change is news. An unread counter is\n * usually fed by a poll, so a live region announces every tick over whatever\n * the reader was doing; the same count is commonly pinned in two places at\n * once, so it announces twice; and a polite region speaks on first render in\n * several screen reader and browser pairs, which turns every page load into a\n * recitation of the inbox. The marker is therefore static text a reader\n * reaches on demand, and announcing a *change* stays with the consumer, who\n * knows whether it followed something the reader just did.\n *\n * One consequence to design around: when the marked child is interactive, its\n * accessible name is computed from the child, and this marker's text sits\n * outside it — a bell button announces \"Notifications, button\" on focus and\n * never mentions the three unread. The default slot exposes `labelId` for\n * exactly that: bind it to the control's `aria-describedby` and the count is\n * announced straight after the name, once, without being duplicated into it.\n */\nconst props = withDefaults(\n  defineProps<{\n    /** A presence dot, or a number in a pill. */\n    variant?: IndicatorVariant;\n    /** The number the pill prints, when `variant` is `count`. Zero hides the marker unless `showZero` is set. */\n    count?: number;\n    /** The highest number printed in full; anything above it prints as `<max>+`. The accessible text still carries the real figure. */\n    max?: number;\n    /** Presence, for a dot: it picks the colour and the shape, and names the dot for a screen reader. Omit it for a plain \"something changed\" dot. */\n    status?: IndicatorStatus;\n    /** The marker's colour, in Badge's own vocabulary. Defaults to whatever `status` implies, or to `primary` when there is no status. */\n    tone?: IndicatorTone;\n    /** Which corner of the marked element the marker straddles. */\n    placement?: IndicatorPlacement;\n    /** What a screen reader announces for the marker. Leave it unset for the derived default — \"Online\", \"3 unread\" — and set it whenever the count is not of unread things. Blank or whitespace falls back to the default rather than clearing it. */\n    label?: string;\n    /** Render the pill when the count is zero. Off by default, because a count of nothing is not news. */\n    showZero?: boolean;\n    /** The surface the marked element sits on, so the ring separating the marker from it matches what surrounds them. */\n    surface?: IndicatorSurface;\n    /**\n     * Names for the markers this component derives on its own, as any subset\n     * of `IndicatorLabels` — the rest stay as the host's `provideLoomLabels`\n     * vocabulary left them, and then as Loom's English.\n     *\n     * This is the vocabulary, not the instance's name: `label` still beats it\n     * and is what one bell counting drafts rather than unread mail reaches for.\n     */\n    labels?: LabelOverrides<IndicatorLabels>;\n  }>(),\n  {\n    variant: \"dot\",\n    count: 0,\n    max: 99,\n    placement: \"top-right\",\n    showZero: false,\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(\"indicator\", INDICATOR_LABELS, () => props.labels);\n\n// One rendered node, and every fallthrough attribute belongs on it — but\n// `class` still has to go the long way round. A consumer replacing the root's\n// `inline-flex` with `block` cannot win by concatenation, because the winner\n// there is decided by the order of the two rules in the stylesheet rather than\n// by the order of the two names in the attribute; `cn()` is what resolves it.\ndefineOptions({ inheritAttrs: false });\nconst { attrs, rest } = useSplitAttrs();\n\n// Bound to the hidden label so an interactive child can point its\n// `aria-describedby` at it through the slot prop.\nconst labelId = useId();\n\n/**\n * The count as a whole, non-negative number. A negative count is a defect in\n * the caller's data, and a pill reading \"-1 unread\" reports that defect to the\n * reader rather than to the caller — falling back to \"nothing to report\" is\n * the honest rendering of it.\n */\nconst total = computed(() => Math.max(0, Math.trunc(props.count)));\n\nconst visible = computed(() => props.variant === \"dot\" || total.value > 0 || props.showZero);\n\n/** What the pill prints — the real figure up to `max`, then `<max>+`. */\nconst printed = computed(() =>\n  total.value > props.max ? `${String(props.max)}+` : String(total.value),\n);\n\nconst tone = computed<IndicatorTone>(\n  () => props.tone ?? (props.status ? STATUS_TONES[props.status] : \"primary\"),\n);\n\nconst glyph = computed(() => (props.status ? STATUS_GLYPHS[props.status] : \"\"));\n\n/**\n * The accessible name, and it is never empty by construction. The count case\n * reports `total` rather than `printed`: clamping at `max` is a decision about\n * how wide the pill is allowed to get, and a reader who cannot see the pill\n * has no reason to inherit it — \"132 unread\" is the fact, \"99+\" is the layout.\n */\nconst name = computed(() => {\n  const given = props.label?.trim();\n  if (given) return given;\n  if (props.variant === \"count\") return text.value.count({ count: total.value });\n  // Keyed by the status itself rather than through a lookup table of its own:\n  // `IndicatorLabels` names its four presence keys after the four members of\n  // `IndicatorStatus`, so a state added to the union with no name for it stops\n  // compiling here instead of rendering an unnamed dot.\n  return props.status ? text.value[props.status] : text.value.attention;\n});\n</script>\n\n<template>\n  <span v-bind=\"rest\" :class=\"cn('relative inline-flex align-middle', attrs.class as string)\">\n    <!-- A multi-line `@slot` comment comes back from vue-docgen with no description at all, so this one stays on one line. -->\n    <!-- @slot The element being marked. `labelId` is the id of the marker's own hidden text — bind it to an interactive child's `aria-describedby` so the count is announced after that control's name. -->\n    <slot :label-id=\"labelId\" />\n\n    <!-- Keyed on what is printed rather than on the count, so `animate-scale-in`\n         replays when a number a reader can see actually changes and stays put\n         when 100 becomes 132 behind the same \"99+\". A dot's key never moves, so\n         a dot never animates: presence settles into place on load, it does not\n         arrive as news, and it must not pulse. -->\n    <span\n      v-if=\"visible\"\n      :key=\"printed\"\n      :data-placement=\"placement\"\n      :class=\"\n        cn(\n          indicatorVariants({ variant, placement, surface }),\n          indicatorToneVariants({ tone }),\n          variant === 'count' && 'animate-scale-in',\n        )\n      \"\n    >\n      <!-- Hidden from assistive tech because the label below carries the real\n           figure; left visible the pair would read as \"99+ 132 unread\". -->\n      <span v-if=\"variant === 'count'\" aria-hidden=\"true\">{{ printed }}</span>\n      <span v-else-if=\"glyph\" :class=\"glyph\" />\n\n      <span :id=\"labelId\" class=\"sr-only\">{{ name }}</span>\n    </span>\n  </span>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,144 @@
+import { type LabelOverrides } from "../../lib/labels";
+import type { LabelOf } from "../../lib/labels";
+/** A presence dot, or a number. */
+export type IndicatorVariant = "dot" | "count";
+/** The four presence states a dot can report. */
+export type IndicatorStatus = "online" | "offline" | "busy" | "away";
+/** Which corner of the marked element the marker straddles. */
+export type IndicatorPlacement = "top-right" | "top-left" | "bottom-right" | "bottom-left";
+/**
+ * The colour vocabulary, deliberately Badge's own names rather than a second
+ * set — `accent` included, and it means here exactly what it means there:
+ * a second semantic category distinct from primary, never decoration.
+ */
+export type IndicatorTone = "neutral" | "primary" | "success" | "warning" | "info" | "destructive" | "accent";
+/** The surface the marked element sits on, which the separating ring matches. */
+export type IndicatorSurface = "background" | "card" | "sunken" | "popover";
+export declare const indicatorVariants: (props?: ({
+    variant?: "count" | "dot" | null | undefined;
+    placement?: "top-right" | "top-left" | "bottom-right" | "bottom-left" | null | undefined;
+    surface?: "background" | "card" | "sunken" | "popover" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * The fill, keyed by Badge's colour names so a success dot and a success badge
+ * are the same green. These are the solid tokens where Badge uses a 12% wash:
+ * a wash reads fine across a chip and carries no signal at all across 12px.
+ *
+ * The paired `text-*` is what the count prints in and what the status glyph is
+ * punched out in, so one entry drives both layers.
+ */
+export declare const indicatorToneVariants: (props?: ({
+    tone?: "accent" | "neutral" | "primary" | "success" | "warning" | "info" | "destructive" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * What a screen reader is told when the caller passes no `label` — which is
+ * every string this component can utter, because a marker that renders nothing
+ * but a coloured circle has no text of its own to fall back on.
+ *
+ * The four presence keys are named for the four `IndicatorStatus` members and
+ * resolved by lookup, so a status added to the union without a name for it is a
+ * compile error rather than an unnamed dot.
+ *
+ * `count` takes the number and not a formatted string: "3 unread" is a plural
+ * category in most languages and a digit shape in several, and a component
+ * whose whole job is to show a small integer has no business deciding either.
+ * It also reports the *real* figure rather than the clamped `99+` — see the
+ * comment on `name` below.
+ */
+export interface IndicatorLabels {
+    /** The `online` dot. */
+    readonly online: string;
+    /** The `offline` dot. */
+    readonly offline: string;
+    /** The `busy` dot. */
+    readonly busy: string;
+    /** The `away` dot. */
+    readonly away: string;
+    /** The `count` pill, named for how many things it counts. */
+    readonly count: LabelOf<{
+        count: number;
+    }>;
+    /** A dot with no `status`: something changed here, and nothing more specific. */
+    readonly attention: 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 INDICATOR_LABELS: IndicatorLabels;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** A presence dot, or a number in a pill. */
+    variant?: IndicatorVariant;
+    /** The number the pill prints, when `variant` is `count`. Zero hides the marker unless `showZero` is set. */
+    count?: number;
+    /** The highest number printed in full; anything above it prints as `<max>+`. The accessible text still carries the real figure. */
+    max?: number;
+    /** Presence, for a dot: it picks the colour and the shape, and names the dot for a screen reader. Omit it for a plain "something changed" dot. */
+    status?: IndicatorStatus;
+    /** The marker's colour, in Badge's own vocabulary. Defaults to whatever `status` implies, or to `primary` when there is no status. */
+    tone?: IndicatorTone;
+    /** Which corner of the marked element the marker straddles. */
+    placement?: IndicatorPlacement;
+    /** What a screen reader announces for the marker. Leave it unset for the derived default — "Online", "3 unread" — and set it whenever the count is not of unread things. Blank or whitespace falls back to the default rather than clearing it. */
+    label?: string;
+    /** Render the pill when the count is zero. Off by default, because a count of nothing is not news. */
+    showZero?: boolean;
+    /** The surface the marked element sits on, so the ring separating the marker from it matches what surrounds them. */
+    surface?: IndicatorSurface;
+    /**
+     * Names for the markers this component derives on its own, as any subset
+     * of `IndicatorLabels` — the rest stay as the host's `provideLoomLabels`
+     * vocabulary left them, and then as Loom's English.
+     *
+     * This is the vocabulary, not the instance's name: `label` still beats it
+     * and is what one bell counting drafts rather than unread mail reaches for.
+     */
+    labels?: LabelOverrides<IndicatorLabels>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** A presence dot, or a number in a pill. */
+    variant?: IndicatorVariant;
+    /** The number the pill prints, when `variant` is `count`. Zero hides the marker unless `showZero` is set. */
+    count?: number;
+    /** The highest number printed in full; anything above it prints as `<max>+`. The accessible text still carries the real figure. */
+    max?: number;
+    /** Presence, for a dot: it picks the colour and the shape, and names the dot for a screen reader. Omit it for a plain "something changed" dot. */
+    status?: IndicatorStatus;
+    /** The marker's colour, in Badge's own vocabulary. Defaults to whatever `status` implies, or to `primary` when there is no status. */
+    tone?: IndicatorTone;
+    /** Which corner of the marked element the marker straddles. */
+    placement?: IndicatorPlacement;
+    /** What a screen reader announces for the marker. Leave it unset for the derived default — "Online", "3 unread" — and set it whenever the count is not of unread things. Blank or whitespace falls back to the default rather than clearing it. */
+    label?: string;
+    /** Render the pill when the count is zero. Off by default, because a count of nothing is not news. */
+    showZero?: boolean;
+    /** The surface the marked element sits on, so the ring separating the marker from it matches what surrounds them. */
+    surface?: IndicatorSurface;
+    /**
+     * Names for the markers this component derives on its own, as any subset
+     * of `IndicatorLabels` — the rest stay as the host's `provideLoomLabels`
+     * vocabulary left them, and then as Loom's English.
+     *
+     * This is the vocabulary, not the instance's name: `label` still beats it
+     * and is what one bell counting drafts rather than unread mail reaches for.
+     */
+    labels?: LabelOverrides<IndicatorLabels>;
+}> & Readonly<{}>, {
+    max: number;
+    count: number;
+    variant: IndicatorVariant;
+    surface: IndicatorSurface;
+    placement: IndicatorPlacement;
+    showZero: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {
+        labelId: string;
+    }) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=Indicator.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Indicator.vue.d.ts","sourceRoot":"","sources":["../../../src/primitives/Indicator/Indicator.vue"],"names":[],"mappings":"AAyUA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAIlE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAEhD,mCAAmC;AACnC,MAAM,MAAM,gBAAgB,GAAG,KAAK,GAAG,OAAO,CAAC;AAE/C,iDAAiD;AACjD,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAErE,+DAA+D;AAC/D,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa,CAAC;AAE3F;;;;GAIG;AACH,MAAM,MAAM,aAAa,GACvB,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,aAAa,GAAG,QAAQ,CAAC;AAEpF,iFAAiF;AACjF,MAAM,MAAM,gBAAgB,GAAG,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE5E,eAAO,MAAM,iBAAiB;;;;8EAmC7B,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,qBAAqB;;8EAahC,CAAC;AAUH;;;;;;;;;;;;;;GAcG;AACH,MAAM,WAAW,eAAe;IAC9B,wBAAwB;IACxB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,yBAAyB;IACzB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,sBAAsB;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,sBAAsB;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,6DAA6D;IAC7D,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC3C,iFAAiF;IACjF,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,eAO9B,CAAC;wBAgBmB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAwCd,6CAA6C;cACnC,gBAAgB;IAC1B,6GAA6G;YACrG,MAAM;IACd,mIAAmI;UAC7H,MAAM;IACZ,kJAAkJ;aACzI,eAAe;IACxB,sIAAsI;WAC/H,aAAa;IACpB,+DAA+D;gBACnD,kBAAkB;IAC9B,mPAAmP;YAC3O,MAAM;IACd,sGAAsG;eAC3F,OAAO;IAClB,qHAAqH;cAC3G,gBAAgB;IAC1B;;;;;;;OAOG;aACM,cAAc,CAAC,eAAe,CAAC;;IA1BxC,6CAA6C;cACnC,gBAAgB;IAC1B,6GAA6G;YACrG,MAAM;IACd,mIAAmI;UAC7H,MAAM;IACZ,kJAAkJ;aACzI,eAAe;IACxB,sIAAsI;WAC/H,aAAa;IACpB,+DAA+D;gBACnD,kBAAkB;IAC9B,mPAAmP;YAC3O,MAAM;IACd,sGAAsG;eAC3F,OAAO;IAClB,qHAAqH;cAC3G,gBAAgB;IAC1B;;;;;;;OAOG;aACM,cAAc,CAAC,eAAe,CAAC;;SArBlC,MAAM;WAFJ,MAAM;aAFJ,gBAAgB;aAgBhB,gBAAgB;eANd,kBAAkB;cAInB,OAAO;;cA2JR,CAAC,KAAK;;KAAgB,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"}