@charcuterie/ui 0.1.0

package/dist/Tabs/Tabs.d.ts

@@ -0,0 +1,95 @@
+import type { ReactNode } from "react";
+export type TabsActivation = "automatic" | "manual";
+export type TabsOrientation = "horizontal" | "vertical";
+export type TabItem = {
+    content: ReactNode;
+    /**
+     * A disabled tab is simply **not registered** with the roving
+     * group. Registration is membership, so the arrow keys skip it
+     * without any command in `RovingFocus` having to know what
+     * "disabled" means.
+     */
+    isDisabled?: boolean;
+    key: string;
+    label: ReactNode;
+};
+export type TabsProps = {
+    /** **Initial** only. Charcuterie owns it from then on. */
+    activeKey?: string;
+    /**
+     * `automatic` — the ARIA Authoring Practices default — shows a
+     * panel as soon as the arrow keys reach its tab. `manual` moves
+     * focus only, and Enter or Space commits.
+     *
+     * The distinction exists because **focus is not selection**, and
+     * it is the entire reason `RovingFocus` is its own state kind. A
+     * tab whose panel costs a network request wants `manual`, and
+     * the two modes differ by one line below — because two kinds are
+     * composed rather than one kind doing both jobs badly.
+     */
+    activation?: TabsActivation;
+    className?: string;
+    /** The tablist's accessible name. Required. */
+    label: string;
+    onChange?: (activeKey: string | null) => void;
+    orientation?: TabsOrientation;
+    tabs: TabItem[];
+};
+/**
+ * Kept at P0 as the **state layer's falsification test**, not on
+ * duplication grounds — the fifteen ad-hoc tab bars that used to
+ * justify it were in the withdrawn evidence. What it has to prove
+ * is that two kinds compose: one says which tab is **chosen**, the
+ * other says which tab is **tabbable**, and a tab bar needs both
+ * at once *and* needs them to disagree on purpose while a user
+ * arrows around in `manual` mode.
+ *
+ * The composition is two hooks and one decision:
+ *
+ * ```ts
+ * const selection = useSinglePicker({ selectedValue: initialKey })
+ * const focus = useRovingFocus({ activeValue: initialKey })
+ *
+ * // `automatic` is this line, and `manual` is its absence.
+ * if (activation === "automatic") selection.select(focus.activeValue)
+ * ```
+ *
+ * ### Selection, not visibility — and the difference is not cosmetic
+ *
+ * M4 built this on `VisibilityGroup`, and the panels do end up
+ * one-at-a-time either way, because the two cores are the same
+ * shape. But the thing that **registers** here is the tab, not the
+ * panel, and what a tab bar is asking is *which one did you pick*.
+ * `SinglePicker` is the kind that answers that; the panel's
+ * `hidden` is derived from the answer.
+ *
+ * Reading it the other way round cost something concrete: it made
+ * `aria-selected` a report about a *panel's* visibility, so a
+ * consumer wanting a tab bar with no panels at all — a segmented
+ * filter, a view switcher that swaps a route — had to model its
+ * choice as a group of visibilities it did not have. `Alert`'s
+ * sibling `SegmentedControl` is exactly that consumer, and it now
+ * shares this component's core rather than hand-rolling a fourth
+ * one.
+ * [Decision](../../../../docs/decisions/2026-07-30-tab-selection-is-a-single-picker.md).
+ *
+ * ### What it does not use, and why that is the right answer
+ *
+ * The plan expected `createLinkedIds` here as well. It does not
+ * fit, and forcing it would have been the wrong call: that kind
+ * exists for a **dynamic** trigger↔target pair — a `Popover` whose
+ * panel mounts and unmounts, where the multiset is what stops
+ * `aria-controls` pointing at a node React has already removed. A
+ * tab bar's pairing is static and known at render, so the ids come
+ * from one `useUniqueId` and cannot get out of step at all.
+ *
+ * ### Focus is moved deliberately, and only then
+ *
+ * `RovingFocus` is state; something still has to call `.focus()`.
+ * That happens only while the tablist already contains the focused
+ * element — otherwise mounting a tab bar, or any parent re-render
+ * that moved `activeValue`, yanks the caret out of whatever the
+ * user was actually doing.
+ */
+export declare const Tabs: ({ activation, activeKey, className, label, onChange, orientation, tabs, }: TabsProps) => ReactNode;
+//# sourceMappingURL=Tabs.d.ts.map

package/dist/Tabs/Tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../src/Tabs/Tabs.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMtC,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,QAAQ,CAAA;AAEnD,MAAM,MAAM,eAAe,GAAG,YAAY,GAAG,UAAU,CAAA;AAEvD,MAAM,MAAM,OAAO,GAAG;IACpB,OAAO,EAAE,SAAS,CAAA;IAClB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,SAAS,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,SAAS,GAAG;IACtB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;;;;;OAUG;IACH,UAAU,CAAC,EAAE,cAAc,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IAC7C,WAAW,CAAC,EAAE,eAAe,CAAA;IAC7B,IAAI,EAAE,OAAO,EAAE,CAAA;CAChB,CAAA;AAaD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,eAAO,MAAM,IAAI,GAAI,2EAQlB,SAAS,KAAG,SA6Md,CAAA"}

package/dist/Tabs/Tabs.js

@@ -0,0 +1,195 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { selectTabIndex, useRovingFocus, useSinglePicker, useUniqueId, } from "@charcuterie/logic";
+import { useCallback, useEffect, useRef } from "react";
+import { toClassName } from "../toClassName.js";
+import { TabTrigger } from "./TabTrigger.js";
+const ORIENTATION_KEYS = {
+    horizontal: {
+        next: "ArrowRight",
+        previous: "ArrowLeft",
+    },
+    vertical: { next: "ArrowDown", previous: "ArrowUp" },
+};
+/**
+ * Kept at P0 as the **state layer's falsification test**, not on
+ * duplication grounds — the fifteen ad-hoc tab bars that used to
+ * justify it were in the withdrawn evidence. What it has to prove
+ * is that two kinds compose: one says which tab is **chosen**, the
+ * other says which tab is **tabbable**, and a tab bar needs both
+ * at once *and* needs them to disagree on purpose while a user
+ * arrows around in `manual` mode.
+ *
+ * The composition is two hooks and one decision:
+ *
+ * ```ts
+ * const selection = useSinglePicker({ selectedValue: initialKey })
+ * const focus = useRovingFocus({ activeValue: initialKey })
+ *
+ * // `automatic` is this line, and `manual` is its absence.
+ * if (activation === "automatic") selection.select(focus.activeValue)
+ * ```
+ *
+ * ### Selection, not visibility — and the difference is not cosmetic
+ *
+ * M4 built this on `VisibilityGroup`, and the panels do end up
+ * one-at-a-time either way, because the two cores are the same
+ * shape. But the thing that **registers** here is the tab, not the
+ * panel, and what a tab bar is asking is *which one did you pick*.
+ * `SinglePicker` is the kind that answers that; the panel's
+ * `hidden` is derived from the answer.
+ *
+ * Reading it the other way round cost something concrete: it made
+ * `aria-selected` a report about a *panel's* visibility, so a
+ * consumer wanting a tab bar with no panels at all — a segmented
+ * filter, a view switcher that swaps a route — had to model its
+ * choice as a group of visibilities it did not have. `Alert`'s
+ * sibling `SegmentedControl` is exactly that consumer, and it now
+ * shares this component's core rather than hand-rolling a fourth
+ * one.
+ * [Decision](../../../../docs/decisions/2026-07-30-tab-selection-is-a-single-picker.md).
+ *
+ * ### What it does not use, and why that is the right answer
+ *
+ * The plan expected `createLinkedIds` here as well. It does not
+ * fit, and forcing it would have been the wrong call: that kind
+ * exists for a **dynamic** trigger↔target pair — a `Popover` whose
+ * panel mounts and unmounts, where the multiset is what stops
+ * `aria-controls` pointing at a node React has already removed. A
+ * tab bar's pairing is static and known at render, so the ids come
+ * from one `useUniqueId` and cannot get out of step at all.
+ *
+ * ### Focus is moved deliberately, and only then
+ *
+ * `RovingFocus` is state; something still has to call `.focus()`.
+ * That happens only while the tablist already contains the focused
+ * element — otherwise mounting a tab bar, or any parent re-render
+ * that moved `activeValue`, yanks the caret out of whatever the
+ * user was actually doing.
+ */
+export const Tabs = ({ activation = "automatic", activeKey, className, label, onChange, orientation = "horizontal", tabs, }) => {
+    const baseId = useUniqueId();
+    const tablistRef = useRef(null);
+    const tabElements = useRef(new Map());
+    const initialKey = activeKey ??
+        tabs.find((one) => !one.isDisabled)?.key ??
+        null;
+    const selection = useSinglePicker({
+        onChange,
+        selectedValue: initialKey,
+    });
+    const focus = useRovingFocus({
+        activeValue: initialKey,
+    });
+    const { select } = selection;
+    const { activeValue, setActiveValue } = focus;
+    /**
+     * Selected **or** pending, and the fallback is load-bearing.
+     *
+     * Members register from an effect, so on the first paint
+     * `selectedValue` is still null and the intent lives in
+     * `pendingValue` — a tab bar reading only the former renders with
+     * no tab selected and no panel shown, then corrects itself a
+     * frame later. It is a flash on a fast machine and a visible
+     * blank on a kiosk Pi.
+     *
+     * The core distinguishes the two on purpose, which is why this
+     * belongs here rather than in the selector — unlike
+     * `RovingFocus`, where the equivalent first-paint hole was in
+     * `selectTabIndex` itself and got fixed there.
+     */
+    const shownKey = selection.selectedValue ?? selection.pendingValue;
+    const selectTab = useCallback((key) => {
+        // Both, because a pointer press moves focus *and* chooses.
+        // Only selecting would leave `automatic`'s effect below to
+        // put the old panel straight back.
+        setActiveValue(key);
+        select(key);
+    }, [select, setActiveValue]);
+    useEffect(() => {
+        // Automatic activation, and the only behaviour that differs
+        // between the two modes. `select` is idempotent, so this is a
+        // no-op on every render where focus did not actually move.
+        if (activation === "automatic" &&
+            activeValue !== null) {
+            select(activeValue);
+        }
+    }, [activation, activeValue, select]);
+    useEffect(() => {
+        const tablist = tablistRef.current;
+        if (!tablist ||
+            activeValue === null ||
+            !tablist.contains(document.activeElement)) {
+            return;
+        }
+        tabElements.current.get(activeValue)?.focus();
+    }, [activeValue]);
+    const keys = ORIENTATION_KEYS[orientation];
+    return (_jsxs("div", { className: toClassName("flex flex-col gap-3", className), children: [_jsx("div", { "aria-label": label, "aria-orientation": orientation, className: toClassName("flex gap-1 border-border-subtle", 
+                // A tab bar **scrolls**; it does not wrap and it does not
+                // paint outside its container. Without an `overflow`, a
+                // bar narrower than its tabs simply spilled across
+                // whatever sat beside it — visible in the `Responsive`
+                // board since M4, and invisible to a test asserting only
+                // that `scrollWidth > clientWidth`, which is true of a
+                // *spilling* bar too.
+                //
+                // The scrollbar is hidden rather than thin: a classic
+                // scrollbar takes layout space inside the scroll
+                // container, so the narrow bar would grow ~15px taller
+                // than the wide one and the underline would stop lining
+                // up across a board. Keyboard users never need it —
+                // `RovingFocus` calls `.focus()`, and the browser scrolls
+                // a focused tab into view.
+                "[scrollbar-width:none]", 
+                // An `overflow` other than `visible` clips its
+                // descendants' **outlines**, and this component's focus
+                // ring is an outline sitting 2px *outside* the tab. The
+                // tab fills the bar's content box, so the ring would be
+                // clipped away on exactly the axis that now scrolls.
+                // Re-pointing the shared token inward keeps one ring
+                // definition — `FOCUS_RING_CLASS` already reads this
+                // variable — rather than appending a competing
+                // `outline-offset` utility and letting Tailwind's
+                // ordering decide the winner.
+                "[--focus-ring-offset:calc(var(--focus-ring-width)*-1)]", orientation === "horizontal"
+                    ? "flex-row overflow-x-auto border-b"
+                    : "flex-col items-stretch overflow-y-auto border-e"), onKeyDown: (keyEvent) => {
+                    const commands = {
+                        [keys.next]: focus.next,
+                        [keys.previous]: focus.previous,
+                        End: focus.last,
+                        Home: focus.first,
+                    };
+                    const command = commands[keyEvent.key];
+                    if (command) {
+                        // Arrow keys scroll the page by default, and a tab bar
+                        // that scrolls the window while it moves focus is the
+                        // hand-rolled version of this component.
+                        keyEvent.preventDefault();
+                        command();
+                        return;
+                    }
+                    // `manual`'s commit. In `automatic` the panel is showing
+                    // already, so this is the no-op that makes Enter behave
+                    // identically in both modes.
+                    if ((keyEvent.key === "Enter" ||
+                        keyEvent.key === " ") &&
+                        activeValue !== null) {
+                        keyEvent.preventDefault();
+                        select(activeValue);
+                    }
+                }, ref: tablistRef, role: "tablist", children: tabs.map((tab, index) => (_jsx(TabTrigger, { id: `${baseId}-tab-${index}`, isSelected: shownKey === tab.key, onSelect: selectTab, panelId: `${baseId}-panel-${index}`, registerFocus: focus.register, orientation: orientation, registerSelection: selection.register, tab: tab, 
+                    // The roving-tabindex rule read from the core rather
+                    // than restated here: exactly one member is in the tab
+                    // order, so Tab enters and leaves the bar once while
+                    // the arrow keys move inside it.
+                    tabIndex: selectTabIndex(focus, tab.key), trackElement: (key, element) => {
+                        if (element) {
+                            tabElements.current.set(key, element);
+                        }
+                        else {
+                            tabElements.current.delete(key);
+                        }
+                    } }, tab.key))) }), tabs.map((tab, index) => (_jsx("div", { "aria-labelledby": `${baseId}-tab-${index}`, hidden: shownKey !== tab.key, id: `${baseId}-panel-${index}`, role: "tabpanel", children: tab.content }, tab.key)))] }));
+};
+//# sourceMappingURL=Tabs.js.map

package/dist/Tabs/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../src/Tabs/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,cAAc,EACd,cAAc,EACd,eAAe,EACf,WAAW,GACZ,MAAM,oBAAoB,CAAA;AAE3B,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAEtD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAkB,CAAA;AA0C7C,MAAM,gBAAgB,GAGlB;IACF,UAAU,EAAE;QACV,IAAI,EAAE,YAAY;QAClB,QAAQ,EAAE,WAAW;KACtB;IACD,QAAQ,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE;CACrD,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EACnB,UAAU,GAAG,WAAW,EACxB,SAAS,EACT,SAAS,EACT,KAAK,EACL,QAAQ,EACR,WAAW,GAAG,YAAY,EAC1B,IAAI,GACM,EAAa,EAAE;IACzB,MAAM,MAAM,GAAG,WAAW,EAAE,CAAA;IAE5B,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAE/C,MAAM,WAAW,GAAG,MAAM,CACxB,IAAI,GAAG,EAA6B,CACrC,CAAA;IAED,MAAM,UAAU,GACd,SAAS;QACT,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,GAAG;QACxC,IAAI,CAAA;IAEN,MAAM,SAAS,GAAG,eAAe,CAAS;QACxC,QAAQ;QACR,aAAa,EAAE,UAAU;KAC1B,CAAC,CAAA;IAEF,MAAM,KAAK,GAAG,cAAc,CAAS;QACnC,WAAW,EAAE,UAAU;KACxB,CAAC,CAAA;IAEF,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,CAAA;IAE5B,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IAE7C;;;;;;;;;;;;;;OAcG;IACH,MAAM,QAAQ,GACZ,SAAS,CAAC,aAAa,IAAI,SAAS,CAAC,YAAY,CAAA;IAEnD,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,GAAW,EAAE,EAAE;QACd,2DAA2D;QAC3D,2DAA2D;QAC3D,mCAAmC;QACnC,cAAc,CAAC,GAAG,CAAC,CAAA;QAEnB,MAAM,CAAC,GAAG,CAAC,CAAA;IACb,CAAC,EACD,CAAC,MAAM,EAAE,cAAc,CAAC,CACzB,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,4DAA4D;QAC5D,8DAA8D;QAC9D,2DAA2D;QAC3D,IACE,UAAU,KAAK,WAAW;YAC1B,WAAW,KAAK,IAAI,EACpB,CAAC;YACD,MAAM,CAAC,WAAW,CAAC,CAAA;QACrB,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC,CAAA;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;QAElC,IACE,CAAC,OAAO;YACR,WAAW,KAAK,IAAI;YACpB,CAAC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EACzC,CAAC;YACD,OAAM;QACR,CAAC;QAED,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,CAAA;IAC/C,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAA;IAEjB,MAAM,IAAI,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAA;IAE1C,OAAO,CACL,eACE,SAAS,EAAE,WAAW,CACpB,qBAAqB,EACrB,SAAS,CACV,aAED,4BACc,KAAK,sBACC,WAAW,EAC7B,SAAS,EAAE,WAAW,CACpB,iCAAiC;gBACjC,0DAA0D;gBAC1D,wDAAwD;gBACxD,mDAAmD;gBACnD,uDAAuD;gBACvD,yDAAyD;gBACzD,uDAAuD;gBACvD,sBAAsB;gBACtB,EAAE;gBACF,sDAAsD;gBACtD,iDAAiD;gBACjD,uDAAuD;gBACvD,wDAAwD;gBACxD,oDAAoD;gBACpD,0DAA0D;gBAC1D,2BAA2B;gBAC3B,wBAAwB;gBACxB,+CAA+C;gBAC/C,wDAAwD;gBACxD,wDAAwD;gBACxD,wDAAwD;gBACxD,qDAAqD;gBACrD,qDAAqD;gBACrD,qDAAqD;gBACrD,+CAA+C;gBAC/C,kDAAkD;gBAClD,8BAA8B;gBAC9B,wDAAwD,EACxD,WAAW,KAAK,YAAY;oBAC1B,CAAC,CAAC,mCAAmC;oBACrC,CAAC,CAAC,iDAAiD,CACtD,EACD,SAAS,EAAE,CAAC,QAAQ,EAAE,EAAE;oBACtB,MAAM,QAAQ,GAA+B;wBAC3C,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,IAAI;wBACvB,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,QAAQ;wBAC/B,GAAG,EAAE,KAAK,CAAC,IAAI;wBACf,IAAI,EAAE,KAAK,CAAC,KAAK;qBAClB,CAAA;oBAED,MAAM,OAAO,GAAG,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAA;oBAEtC,IAAI,OAAO,EAAE,CAAC;wBACZ,uDAAuD;wBACvD,sDAAsD;wBACtD,yCAAyC;wBACzC,QAAQ,CAAC,cAAc,EAAE,CAAA;wBAEzB,OAAO,EAAE,CAAA;wBAET,OAAM;oBACR,CAAC;oBAED,yDAAyD;oBACzD,wDAAwD;oBACxD,6BAA6B;oBAC7B,IACE,CAAC,QAAQ,CAAC,GAAG,KAAK,OAAO;wBACvB,QAAQ,CAAC,GAAG,KAAK,GAAG,CAAC;wBACvB,WAAW,KAAK,IAAI,EACpB,CAAC;wBACD,QAAQ,CAAC,cAAc,EAAE,CAAA;wBAEzB,MAAM,CAAC,WAAW,CAAC,CAAA;oBACrB,CAAC;gBACH,CAAC,EACD,GAAG,EAAE,UAAU,EACf,IAAI,EAAC,SAAS,YAEb,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,CACxB,KAAC,UAAU,IACT,EAAE,EAAE,GAAG,MAAM,QAAQ,KAAK,EAAE,EAC5B,UAAU,EAAE,QAAQ,KAAK,GAAG,CAAC,GAAG,EAEhC,QAAQ,EAAE,SAAS,EACnB,OAAO,EAAE,GAAG,MAAM,UAAU,KAAK,EAAE,EACnC,aAAa,EAAE,KAAK,CAAC,QAAQ,EAC7B,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,SAAS,CAAC,QAAQ,EACrC,GAAG,EAAE,GAAG;oBACR,qDAAqD;oBACrD,uDAAuD;oBACvD,qDAAqD;oBACrD,iCAAiC;oBACjC,QAAQ,EAAE,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,CAAC,EACxC,YAAY,EAAE,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE;wBAC7B,IAAI,OAAO,EAAE,CAAC;4BACZ,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAA;wBACvC,CAAC;6BAAM,CAAC;4BACN,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAA;wBACjC,CAAC;oBACH,CAAC,IAlBI,GAAG,CAAC,GAAG,CAmBZ,CACH,CAAC,GACE,EAEL,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,CACxB,iCACmB,GAAG,MAAM,QAAQ,KAAK,EAAE,EACzC,MAAM,EAAE,QAAQ,KAAK,GAAG,CAAC,GAAG,EAC5B,EAAE,EAAE,GAAG,MAAM,UAAU,KAAK,EAAE,EAE9B,IAAI,EAAC,UAAU,YAEd,GAAG,CAAC,OAAO,IAHP,GAAG,CAAC,GAAG,CAIR,CACP,CAAC,IACE,CACP,CAAA;AACH,CAAC,CAAA"}

package/dist/VisuallyHidden/VisuallyHidden.d.ts

@@ -0,0 +1,25 @@
+import type { ComponentPropsWithRef, ReactNode } from "react";
+export type VisuallyHiddenProps = ComponentPropsWithRef<"span"> & {
+    children: ReactNode;
+};
+/**
+ * Text for assistive technology and for nobody else.
+ *
+ * A Layer-0 primitive, and the one every other component in M3
+ * leans on: it is how a `Spinner` says "Loading…" without printing
+ * it, how an `IconButton`'s glyph gets a name, and how a
+ * `ProgressBar`'s label stays discoverable when the design does not
+ * show it. Without it the alternative is `aria-label` everywhere,
+ * which silently loses translation and cannot hold markup.
+ *
+ * `sr-only` is Tailwind's own — the clip-rect technique, unchanged
+ * since it was `.visuallyhidden` in HTML5 Boilerplate. There is
+ * nothing to own here, and owning it would mean maintaining a
+ * clip-rect against browsers that have already agreed.
+ *
+ * Never `display: none` and never `visibility: hidden`: both remove
+ * the node from the accessibility tree, which is the exact opposite
+ * of the requirement.
+ */
+export declare const VisuallyHidden: ({ children, className, ...spanProps }: VisuallyHiddenProps) => ReactNode;
+//# sourceMappingURL=VisuallyHidden.d.ts.map

package/dist/VisuallyHidden/VisuallyHidden.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisuallyHidden.d.ts","sourceRoot":"","sources":["../../src/VisuallyHidden/VisuallyHidden.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,qBAAqB,EACrB,SAAS,EACV,MAAM,OAAO,CAAA;AAId,MAAM,MAAM,mBAAmB,GAC7B,qBAAqB,CAAC,MAAM,CAAC,GAAG;IAC9B,QAAQ,EAAE,SAAS,CAAA;CACpB,CAAA;AAEH;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,cAAc,GAAI,uCAI5B,mBAAmB,KAAG,SAOxB,CAAA"}

package/dist/VisuallyHidden/VisuallyHidden.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { toClassName } from "../toClassName.js";
+/**
+ * Text for assistive technology and for nobody else.
+ *
+ * A Layer-0 primitive, and the one every other component in M3
+ * leans on: it is how a `Spinner` says "Loading…" without printing
+ * it, how an `IconButton`'s glyph gets a name, and how a
+ * `ProgressBar`'s label stays discoverable when the design does not
+ * show it. Without it the alternative is `aria-label` everywhere,
+ * which silently loses translation and cannot hold markup.
+ *
+ * `sr-only` is Tailwind's own — the clip-rect technique, unchanged
+ * since it was `.visuallyhidden` in HTML5 Boilerplate. There is
+ * nothing to own here, and owning it would mean maintaining a
+ * clip-rect against browsers that have already agreed.
+ *
+ * Never `display: none` and never `visibility: hidden`: both remove
+ * the node from the accessibility tree, which is the exact opposite
+ * of the requirement.
+ */
+export const VisuallyHidden = ({ children, className, ...spanProps }) => (_jsx("span", { ...spanProps, className: toClassName("sr-only", className), children: children }));
+//# sourceMappingURL=VisuallyHidden.js.map

package/dist/VisuallyHidden/VisuallyHidden.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisuallyHidden.js","sourceRoot":"","sources":["../../src/VisuallyHidden/VisuallyHidden.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAO/C;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,QAAQ,EACR,SAAS,EACT,GAAG,SAAS,EACQ,EAAa,EAAE,CAAC,CACpC,kBACM,SAAS,EACb,SAAS,EAAE,WAAW,CAAC,SAAS,EAAE,SAAS,CAAC,YAE3C,QAAQ,GACJ,CACR,CAAA"}

package/dist/controlStyles.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Control sizing, read from the density axis rather than chosen per
+ * component.
+ *
+ * The values are never in this file — `h-(--control-height-md)`
+ * points at a variable that `[data-density]` rewrites, so the same
+ * `<Button size="md">` is 2.25rem on a desktop, 1.875rem in a
+ * compact bay list, and 3.25rem on the kiosk with no prop change
+ * and no re-render. That is the entire argument for a density axis
+ * over a `size="kiosk"` prop, and it only works because nothing
+ * here hardcodes a length.
+ *
+ * `text-sm`/`text-md`/`text-lg` are ours too, not Tailwind's:
+ * `theme.css` bridges `--text-*` onto `--font-size-*`, which the
+ * density axis also scales. See
+ * `packages/tokens/src/tailwindCollisions.test.ts`.
+ */
+import type { ControlSize } from "@charcuterie/tokens";
+export declare const CONTROL_SIZE_CLASS: Record<ControlSize, string>;
+/**
+ * Square, and sized by the *height* token on both axes so an icon
+ * button lines up with the text button beside it in a toolbar. No
+ * inline padding at all — a glyph centres itself.
+ */
+export declare const ICON_CONTROL_SIZE_CLASS: Record<ControlSize, string>;
+/**
+ * The kiosk floor. `--control-min-touch-target` is 44px in every
+ * density — a finger does not get smaller because the list is
+ * dense — so this is opt-in per control rather than baked into the
+ * size classes, which would make `compact` a lie.
+ */
+export declare const MIN_TOUCH_TARGET_CLASS = "min-h-(--control-min-touch-target) min-w-(--control-min-touch-target)";
+/**
+ * Non-control sizing: badges, indicator dots, spinners. These are
+ * type-relative on purpose — a badge beside `text-sm` prose that
+ * stays 20px tall while the kiosk scales the prose to 1.19x reads
+ * as a rendering bug.
+ */
+export declare const BADGE_SIZE_CLASS: {
+    readonly sm: "gap-1 px-2 py-0.5 text-xs";
+    readonly md: "gap-1.5 px-2.5 py-1 text-sm";
+};
+export type BadgeSize = keyof typeof BADGE_SIZE_CLASS;
+export declare const DOT_SIZE_CLASS: {
+    readonly sm: "size-1.5";
+    readonly md: "size-2";
+    readonly lg: "size-2.5";
+};
+export declare const SPINNER_SIZE_CLASS: Record<ControlSize, string>;
+//# sourceMappingURL=controlStyles.d.ts.map

package/dist/controlStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"controlStyles.d.ts","sourceRoot":"","sources":["../src/controlStyles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEtD,eAAO,MAAM,kBAAkB,EAAE,MAAM,CACrC,WAAW,EACX,MAAM,CAKP,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAC1C,WAAW,EACX,MAAM,CAKP,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB,0EACsC,CAAA;AAEzE;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB;;;CAGnB,CAAA;AAEV,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,gBAAgB,CAAA;AAErD,eAAO,MAAM,cAAc;;;;CAIjB,CAAA;AAEV,eAAO,MAAM,kBAAkB,EAAE,MAAM,CACrC,WAAW,EACX,MAAM,CAKP,CAAA"}

package/dist/controlStyles.js

@@ -0,0 +1,60 @@
+/**
+ * Control sizing, read from the density axis rather than chosen per
+ * component.
+ *
+ * The values are never in this file — `h-(--control-height-md)`
+ * points at a variable that `[data-density]` rewrites, so the same
+ * `<Button size="md">` is 2.25rem on a desktop, 1.875rem in a
+ * compact bay list, and 3.25rem on the kiosk with no prop change
+ * and no re-render. That is the entire argument for a density axis
+ * over a `size="kiosk"` prop, and it only works because nothing
+ * here hardcodes a length.
+ *
+ * `text-sm`/`text-md`/`text-lg` are ours too, not Tailwind's:
+ * `theme.css` bridges `--text-*` onto `--font-size-*`, which the
+ * density axis also scales. See
+ * `packages/tokens/src/tailwindCollisions.test.ts`.
+ */
+export const CONTROL_SIZE_CLASS = {
+    sm: "h-(--control-height-sm) gap-(--control-gap-sm) px-(--control-padding-inline-sm) text-sm",
+    md: "h-(--control-height-md) gap-(--control-gap-md) px-(--control-padding-inline-md) text-md",
+    lg: "h-(--control-height-lg) gap-(--control-gap-lg) px-(--control-padding-inline-lg) text-lg",
+};
+/**
+ * Square, and sized by the *height* token on both axes so an icon
+ * button lines up with the text button beside it in a toolbar. No
+ * inline padding at all — a glyph centres itself.
+ */
+export const ICON_CONTROL_SIZE_CLASS = {
+    sm: "size-(--control-height-sm) px-0 text-sm",
+    md: "size-(--control-height-md) px-0 text-md",
+    lg: "size-(--control-height-lg) px-0 text-lg",
+};
+/**
+ * The kiosk floor. `--control-min-touch-target` is 44px in every
+ * density — a finger does not get smaller because the list is
+ * dense — so this is opt-in per control rather than baked into the
+ * size classes, which would make `compact` a lie.
+ */
+export const MIN_TOUCH_TARGET_CLASS = "min-h-(--control-min-touch-target) min-w-(--control-min-touch-target)";
+/**
+ * Non-control sizing: badges, indicator dots, spinners. These are
+ * type-relative on purpose — a badge beside `text-sm` prose that
+ * stays 20px tall while the kiosk scales the prose to 1.19x reads
+ * as a rendering bug.
+ */
+export const BADGE_SIZE_CLASS = {
+    sm: "gap-1 px-2 py-0.5 text-xs",
+    md: "gap-1.5 px-2.5 py-1 text-sm",
+};
+export const DOT_SIZE_CLASS = {
+    sm: "size-1.5",
+    md: "size-2",
+    lg: "size-2.5",
+};
+export const SPINNER_SIZE_CLASS = {
+    sm: "size-3.5 border-2",
+    md: "size-4 border-2",
+    lg: "size-5 border-2",
+};
+//# sourceMappingURL=controlStyles.js.map

package/dist/controlStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"controlStyles.js","sourceRoot":"","sources":["../src/controlStyles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAIH,MAAM,CAAC,MAAM,kBAAkB,GAG3B;IACF,EAAE,EAAE,yFAAyF;IAC7F,EAAE,EAAE,yFAAyF;IAC7F,EAAE,EAAE,yFAAyF;CAC9F,CAAA;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAGhC;IACF,EAAE,EAAE,yCAAyC;IAC7C,EAAE,EAAE,yCAAyC;IAC7C,EAAE,EAAE,yCAAyC;CAC9C,CAAA;AAED;;;;;GAKG;AACH,MAAM,CAAC,MAAM,sBAAsB,GACjC,uEAAuE,CAAA;AAEzE;;;;;GAKG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,EAAE,EAAE,2BAA2B;IAC/B,EAAE,EAAE,6BAA6B;CACzB,CAAA;AAIV,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,EAAE,EAAE,UAAU;IACd,EAAE,EAAE,QAAQ;IACZ,EAAE,EAAE,UAAU;CACN,CAAA;AAEV,MAAM,CAAC,MAAM,kBAAkB,GAG3B;IACF,EAAE,EAAE,mBAAmB;IACvB,EAAE,EAAE,iBAAiB;IACrB,EAAE,EAAE,iBAAiB;CACtB,CAAA"}

package/dist/expectNoAxeViolations.testHelpers.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Run axe against a subtree, now.
+ *
+ * The a11y addon audits a story **once**, in an `afterEach` that
+ * fires when `run()` resolves — i.e. immediately after the first
+ * paint. That was enough while the assertions lived in `play`,
+ * because the addon's hook ran after the play had finished driving.
+ * With the tests split out, `run()` returns before a test has
+ * clicked anything, so the states that most need auditing — an open
+ * dialog, a shown popover, a selected tab panel — would never be
+ * seen by axe at all.
+ *
+ * So a driven state audits itself explicitly. The rule set is left
+ * at axe's default, matching the addon, except that `region` is
+ * disabled for the same reason the addon disables it: a component
+ * mounted on its own is not a page and owes nobody a landmark.
+ */
+export declare const expectNoAxeViolations: (element: Element) => Promise<void>;
+//# sourceMappingURL=expectNoAxeViolations.testHelpers.d.ts.map

package/dist/expectNoAxeViolations.testHelpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"expectNoAxeViolations.testHelpers.d.ts","sourceRoot":"","sources":["../src/expectNoAxeViolations.testHelpers.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,qBAAqB,GAChC,SAAS,OAAO,KACf,OAAO,CAAC,IAAI,CAmBd,CAAA"}

package/dist/expectNoAxeViolations.testHelpers.js

@@ -0,0 +1,32 @@
+import axe from "axe-core";
+/**
+ * Run axe against a subtree, now.
+ *
+ * The a11y addon audits a story **once**, in an `afterEach` that
+ * fires when `run()` resolves — i.e. immediately after the first
+ * paint. That was enough while the assertions lived in `play`,
+ * because the addon's hook ran after the play had finished driving.
+ * With the tests split out, `run()` returns before a test has
+ * clicked anything, so the states that most need auditing — an open
+ * dialog, a shown popover, a selected tab panel — would never be
+ * seen by axe at all.
+ *
+ * So a driven state audits itself explicitly. The rule set is left
+ * at axe's default, matching the addon, except that `region` is
+ * disabled for the same reason the addon disables it: a component
+ * mounted on its own is not a page and owes nobody a landmark.
+ */
+export const expectNoAxeViolations = async (element) => {
+    const results = await axe.run(element, {
+        rules: { region: { enabled: false } },
+    });
+    if (results.violations.length === 0) {
+        return;
+    }
+    throw new Error(`Expected no accessibility violations, found ${results.violations.length}:\n\n${results.violations
+        .map((violation) => `  ${violation.id} (${violation.impact}) — ${violation.help}\n${violation.nodes
+        .map((node) => `    ${node.html}`)
+        .join("\n")}`)
+        .join("\n\n")}`);
+};
+//# sourceMappingURL=expectNoAxeViolations.testHelpers.js.map

package/dist/expectNoAxeViolations.testHelpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"expectNoAxeViolations.testHelpers.js","sourceRoot":"","sources":["../src/expectNoAxeViolations.testHelpers.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,UAAU,CAAA;AAE1B;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,EACxC,OAAgB,EACD,EAAE;IACjB,MAAM,OAAO,GAAG,MAAM,GAAG,CAAC,GAAG,CAAC,OAAO,EAAE;QACrC,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE;KACtC,CAAC,CAAA;IAEF,IAAI,OAAO,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACpC,OAAM;IACR,CAAC;IAED,MAAM,IAAI,KAAK,CACb,+CAA+C,OAAO,CAAC,UAAU,CAAC,MAAM,QAAQ,OAAO,CAAC,UAAU;SAC/F,GAAG,CACF,CAAC,SAAS,EAAE,EAAE,CACZ,KAAK,SAAS,CAAC,EAAE,KAAK,SAAS,CAAC,MAAM,OAAO,SAAS,CAAC,IAAI,KAAK,SAAS,CAAC,KAAK;SAC5E,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,OAAO,IAAI,CAAC,IAAI,EAAE,CAAC;SACjC,IAAI,CAAC,IAAI,CAAC,EAAE,CAClB;SACA,IAAI,CAAC,MAAM,CAAC,EAAE,CAClB,CAAA;AACH,CAAC,CAAA"}

package/dist/index.d.ts

@@ -0,0 +1,75 @@
+/**
+ * `@charcuterie/ui` — the one sanctioned barrel.
+ *
+ * Components never import each other through this file; they import
+ * the sibling module directly (`../Spinner/Spinner.tsx`). A barrel
+ * that a package's own internals go through turns every component
+ * into a dependency of every other one, which is how a 3 KB
+ * `Spinner` starts pulling in `MediaTile`.
+ *
+ * `"./src/*"` is also in `exports`, for the budget-sensitive
+ * consumers — `castkit/packages/slatecast` has 60 KB gz to spend and
+ * should be able to reach one component without the barrel. Same
+ * arrangement as `mux-magic/packages/tools`.
+ *
+ * The token **types and values** are re-exported at
+ * `@charcuterie/ui/tokens` rather than from here, so a React
+ * consumer's TypeScript never names a second package while Satori
+ * still gets `@charcuterie/tokens` with no React in sight.
+ *
+ * The token **stylesheet** is not, and M5 is why. There was a
+ * `"./tokens.css": "./node_modules/@charcuterie/tokens/dist/theme.css"`
+ * export here, and it resolved to nothing in the first real
+ * consumer: a hoisting linker puts `@charcuterie/tokens` at the
+ * *project* root, not inside this package, so that path exists only
+ * under a nesting one. A CSS `@import` fails silently in Tailwind —
+ * no error, no utilities, an unstyled app — which is exactly the
+ * class of failure `portal:` was chosen to catch
+ * ([decision](../../../docs/decisions/2026-07-29-consumers-link-tokens-by-portal-until-publish.md)).
+ * So a consumer installs both package names and imports
+ * `@charcuterie/tokens/theme.css` by its own name, which is what
+ * this package's README has always told it to do.
+ */
+export type { AlertProps, AlertSize, } from "./Alert/Alert.tsx";
+export { Alert } from "./Alert/Alert.tsx";
+export type { BadgeProps } from "./Badge/Badge.tsx";
+export { Badge } from "./Badge/Badge.tsx";
+export type { ButtonProps } from "./Button/Button.tsx";
+export { Button } from "./Button/Button.tsx";
+export type { CardPadding, CardProps, CardSurface, } from "./Card/Card.tsx";
+export { Card } from "./Card/Card.tsx";
+export type { BadgeSize } from "./controlStyles.ts";
+export { BADGE_SIZE_CLASS, CONTROL_SIZE_CLASS, DOT_SIZE_CLASS, ICON_CONTROL_SIZE_CLASS, MIN_TOUCH_TARGET_CLASS, SPINNER_SIZE_CLASS, } from "./controlStyles.ts";
+export type { EmptyStateProps, EmptyStateSize, } from "./EmptyState/EmptyState.tsx";
+export { EmptyState } from "./EmptyState/EmptyState.tsx";
+export type { IconButtonProps } from "./IconButton/IconButton.tsx";
+export { IconButton } from "./IconButton/IconButton.tsx";
+export type { IntentAppearance } from "./intentStyles.ts";
+export { DISABLED_CLASS, FOCUS_RING_CLASS, INTENT_APPEARANCE_CLASS, INTENT_CONTENT_CLASS, INTENT_HOVER_CLASS, INTENT_SOLID_FILL_CLASS, } from "./intentStyles.ts";
+export type { LiveStatusIndicatorProps, LiveStatusIndicatorSize, } from "./LiveStatusIndicator/LiveStatusIndicator.tsx";
+export { LiveStatusIndicator } from "./LiveStatusIndicator/LiveStatusIndicator.tsx";
+export type { MediaTileProps, MediaTileRatio, } from "./MediaTile/MediaTile.tsx";
+export { MediaTile } from "./MediaTile/MediaTile.tsx";
+export type { MediaStatus } from "./MediaTile/mediaStatus.ts";
+export { mediaTransitions } from "./MediaTile/mediaStatus.ts";
+export type { ModalProps, ModalSize, } from "./Modal/Modal.tsx";
+export { Modal } from "./Modal/Modal.tsx";
+export type { PopoverProps } from "./Popover/Popover.tsx";
+export { Popover } from "./Popover/Popover.tsx";
+export type { ProgressBarProps, ProgressBarSize, } from "./ProgressBar/ProgressBar.tsx";
+export { ProgressBar } from "./ProgressBar/ProgressBar.tsx";
+export type { ProgressThreshold } from "./ProgressBar/progressValue.ts";
+export { getProgressIntent, toProgressPercent, toProgressValue, } from "./ProgressBar/progressValue.ts";
+export type { SegmentedControlProps, SegmentedItem, } from "./SegmentedControl/SegmentedControl.tsx";
+export { SegmentedControl } from "./SegmentedControl/SegmentedControl.tsx";
+export type { SkeletonProps, SkeletonShape, } from "./Skeleton/Skeleton.tsx";
+export { Skeleton } from "./Skeleton/Skeleton.tsx";
+export type { SpinnerProps } from "./Spinner/Spinner.tsx";
+export { Spinner } from "./Spinner/Spinner.tsx";
+export { getAsyncIntent, getAsyncLabel, getConnectionIntent, getConnectionLabel, getIsConnectionBusy, } from "./statusIntent.ts";
+export type { TabItem, TabsActivation, TabsOrientation, TabsProps, } from "./Tabs/Tabs.tsx";
+export { Tabs } from "./Tabs/Tabs.tsx";
+export { toClassName } from "./toClassName.ts";
+export type { VisuallyHiddenProps } from "./VisuallyHidden/VisuallyHidden.tsx";
+export { VisuallyHidden } from "./VisuallyHidden/VisuallyHidden.tsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}