@graview/primitives 0.1.0

package/dist/places.js

@@ -0,0 +1,227 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { aggregateId, withFocus, withOverview, withWithin } from "@graview/layout";
+import { useGraview, useNavigation } from "@graview/react";
+import { useLayoutEffect, useRef, useState } from "react";
+/**
+ * THE NAMED PLACES, as pills.
+ *
+ * A group view registered with a title is somewhere to go: "Who tends what"
+ * over the gardeners, "What grows where" over the plots. Each pill is the
+ * stop that shows it — the group in focus, on the ground — and is pressed
+ * while you are there. Nothing renders for an app with no named places, so
+ * the bar of an app that never registered a lens is exactly as it was.
+ *
+ * This exists because a lens was only reachable by focusing the group it
+ * was registered on: click into one member and the picture was gone, with
+ * nothing on the screen to say it had ever been there.
+ */
+/**
+ * The named pictures over the graph, as pills — or, `compact`, as one
+ * select. Eight pills wrapped to four rows on a phone-width embed and took
+ * half its height before the picture began; a select says the same eight
+ * places in one row and opens to the same stops.
+ */
+export function Places({ compact = false } = {}) {
+    const { views, hiddenKinds } = useGraview();
+    const { view, go } = useNavigation();
+    /*
+     * A PLACE OVER A KIND THIS SEAT CANNOT SEE IS A DOOR TO AN EMPTY ROOM.
+     *
+     * The reach lens registered over the people is "Who may do what" — a
+     * picture of the installation, named on the bar. A member may not
+     * administer the installation, so its kinds are not drawn for them
+     * anywhere; the pill was drawn anyway, and pressing it focused a district
+     * that is not there. The kinds a seat is kept from are already worked out
+     * once, for the scene and the shelf; the bar reads the same answer.
+     */
+    const places = views.places().filter((place) => !hiddenKinds.has(place.kind));
+    /* Hooks first, before any early return: a bar whose places arrive a
+       render later must not change how many hooks it calls. */
+    const row = useRef(null);
+    // The pills, measured each time the row is fitted (their widths change when the font arrives).
+    const pills = useRef([]);
+    const more = useRef(null);
+    const [shown, setShown] = useState(places.length);
+    const MORE = 92;
+    /* Which place you are on, so the menu keeps room for its name when it holds it. */
+    const current = places.findIndex((place) => !view.overview &&
+        view.focusId === aggregateId(place.kind) &&
+        (view.within?.["view"] === undefined
+            ? places.filter((other) => other.kind === place.kind).at(-1)?.as === place.as
+            : view.within["view"] === place.as));
+    useLayoutEffect(() => {
+        const element = row.current;
+        if (!element || typeof ResizeObserver === "undefined")
+            return;
+        const measure = () => {
+            // The ROOM is the region the row stands in, not the row's own width:
+            // the row shrinks to what it shows, and measuring it could only ever
+            // agree with what was already shown.
+            const room = (element.parentElement ?? element).getBoundingClientRect().width - 8;
+            /*
+             * READ NOW, NOT WHEN THE PILL MOUNTED. The widths were taken in each
+             * pill's ref as it mounted — in the fallback face, before the brand's
+             * font arrived — and the font made every pill wider without making the
+             * row fit again: seedbed's places ran seven pixels past their edge on
+             * every screen measured early, and a fix to the reserve below did not
+             * touch it. The pills are measured on each fit, and watched.
+             */
+            const sizes = pills.current.map((pill) => pill?.getBoundingClientRect().width ?? 0);
+            /*
+             * AND THE MENU AS IT IS DRAWN. Standing on a place the menu holds, the
+             * menu shows that place's name in a select's padding and chevron —
+             * 144 pixels for "The rotation", whose pill is 106 — and the 14 kept
+             * for it was a guess that ran the row seven pixels past its edge. Where
+             * the menu is showing a held place, what it adds to that place's pill
+             * is measured; until then, forty.
+             */
+            const menu = more.current;
+            const showing = menu ? places.findIndex((place) => `${place.kind}:${place.as}` === menu.value) : -1;
+            const chrome = menu && showing >= 0 && sizes[showing] ? Math.max(14, menu.getBoundingClientRect().width - sizes[showing]) : 40;
+            if (pills.current.filter(Boolean).length < places.length)
+                return;
+            let used = 0;
+            let fit = 0;
+            for (let i = 0; i < places.length; i += 1) {
+                const next = used + (sizes[i] ?? 0) + (i > 0 ? 2 : 0);
+                /*
+                 * THE MORE MENU IS AS WIDE AS WHAT IT SAYS. Standing on a place it
+                 * holds, the select shows that place's name, not "+2 more" — and
+                 * "The rotation" is wider than the 92 pixels kept for it, so the
+                 * row ran seven pixels past its own edge. Keep room for the name of
+                 * the place you are on when it would be in the menu; otherwise the
+                 * menu says "+N more", and 92 holds that.
+                 */
+                const reserve = i < places.length - 1 ? Math.max(MORE, current > i ? (sizes[current] ?? 0) + chrome : 0) : 0;
+                if (next + reserve > room)
+                    break;
+                used = next;
+                fit = i + 1;
+            }
+            setShown((was) => (was === fit ? was : fit));
+        };
+        measure();
+        const watch = new ResizeObserver(measure);
+        watch.observe(element.parentElement ?? element);
+        for (const pill of pills.current)
+            if (pill)
+                watch.observe(pill);
+        if (more.current)
+            watch.observe(more.current);
+        return () => watch.disconnect();
+    }, [places.length, current]);
+    if (places.length === 0)
+        return null;
+    /*
+     * Which picture a group draws when the address names none: the LAST
+     * registration for the cell, because that is what the registry resolves
+     * to and a pill must agree with what is actually on screen.
+     */
+    const isDefault = (all, place) => all.filter((other) => other.kind === place.kind).at(-1)?.as === place.as;
+    const showing = view.within?.["view"];
+    const isHere = (place) => !view.overview &&
+        view.focusId === aggregateId(place.kind) &&
+        (showing === undefined ? isDefault(places, place) : showing === place.as);
+    const goTo = (place) => go(withWithin(withOverview(withFocus(view, aggregateId(place.kind)), false), "view", place.as));
+    if (compact) {
+        const here = places.find(isHere);
+        return (_jsxs("select", { "aria-label": "Places", "data-testid": "places", value: here ? `${here.kind}:${here.as}` : "", onChange: (event) => {
+                const place = places.find((candidate) => `${candidate.kind}:${candidate.as}` === event.target.value);
+                if (place)
+                    goTo(place);
+            }, style: {
+                minHeight: 28,
+                maxWidth: "100%",
+                padding: "3px 8px",
+                borderRadius: 999,
+                fontSize: "0.875rem",
+                borderWidth: 1,
+                borderStyle: "solid",
+                borderColor: here ? "var(--graview-accent)" : "var(--graview-edge)",
+                color: here ? "var(--graview-accent)" : "var(--graview-ink-muted)",
+                backgroundColor: "var(--graview-panel)",
+                // WebKit ignores the floor on a native select (W-121): the look off, a chevron drawn.
+                paddingRight: 24,
+                appearance: "none",
+                WebkitAppearance: "none",
+                backgroundImage: "linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%)",
+                backgroundPosition: "calc(100% - 13px) 55%, calc(100% - 9px) 55%",
+                backgroundSize: "4px 4px, 4px 4px",
+                backgroundRepeat: "no-repeat",
+            }, children: [_jsx("option", { value: "", children: "Places\u2026" }), places.map((place) => (_jsx("option", { value: `${place.kind}:${place.as}`, "data-place-kind": place.kind, children: place.title }, `${place.kind}:${place.as}`)))] }));
+    }
+    /*
+     * ONE ROW, WHATEVER THE WIDTH. The places are the app's own navigation
+     * and read as one control — a segmented row with the current picture
+     * filled — rather than a run of loose pills. What the row cannot hold
+     * goes into a "More" menu at its end instead of wrapping the bar into a
+     * second line: the bar is one line, and the picture starts under it.
+     */
+    const rest = places.slice(shown);
+    const restHere = rest.find(isHere);
+    return (_jsxs("nav", { ref: row, "aria-label": "Places", "data-testid": "places", style: {
+            position: "relative",
+            display: "flex",
+            alignItems: "center",
+            gap: 2,
+            padding: 3,
+            minWidth: 0,
+            maxWidth: "100%",
+            borderRadius: 999,
+            border: "1px solid var(--graview-edge)",
+            background: "var(--graview-panel-muted)",
+            overflow: "hidden",
+        }, children: [places.map((place, index) => {
+                const here = isHere(place);
+                return (_jsx("button", { ref: (el) => {
+                        pills.current[index] = el;
+                    }, type: "button", "aria-pressed": here, "data-testid": `place-${place.as}`, "data-place-kind": place.kind, title: `${place.title} — a picture over the ${place.kind}s`, onClick: () => goTo(place), style: {
+                        // A full fingertip whatever the brand's line height: Groundskeeper's
+                        // pills measured 22px and its audit counted every one.
+                        minHeight: 28,
+                        padding: "3px 13px",
+                        borderRadius: 999,
+                        fontSize: "0.875rem",
+                        fontWeight: here ? 600 : 500,
+                        borderWidth: 1,
+                        borderStyle: "solid",
+                        boxShadow: "none",
+                        whiteSpace: "nowrap",
+                        flex: "0 0 auto",
+                        color: here ? "var(--graview-ink)" : "var(--graview-ink-muted)",
+                        background: here ? "var(--graview-panel)" : "transparent",
+                        borderColor: here ? "var(--graview-edge)" : "transparent",
+                        // Measured at full width, then parked off the row's left edge
+                        // if the row cannot hold it: still measurable, never part of
+                        // anything's scrollable overflow (which only extends rightward),
+                        // so no box on the bar reads as cut.
+                        ...(index >= shown ? { position: "absolute", left: -9999, top: 0, visibility: "hidden" } : {}),
+                    }, children: place.title }, `${place.kind}:${place.as}`));
+            }), rest.length > 0 ? (_jsxs("select", { ref: more, "aria-label": "More places", "data-testid": "places-more", value: restHere ? `${restHere.kind}:${restHere.as}` : "", onChange: (event) => {
+                    const place = rest.find((candidate) => `${candidate.kind}:${candidate.as}` === event.target.value);
+                    if (place)
+                        goTo(place);
+                }, style: {
+                    minHeight: 28,
+                    padding: "3px 22px 3px 12px",
+                    borderRadius: 999,
+                    fontSize: "0.875rem",
+                    fontWeight: restHere ? 600 : 500,
+                    borderWidth: 1,
+                    borderStyle: "solid",
+                    flex: "0 0 auto",
+                    color: restHere ? "var(--graview-ink)" : "var(--graview-ink-muted)",
+                    // backgroundColor, not background: the shorthand beside the chevron's
+                    // backgroundImage and friends is overwritten by them on every change of place.
+                    backgroundColor: restHere ? "var(--graview-panel)" : "transparent",
+                    // The browser's own arrow is wide and grey; a small chevron of the text's colour instead.
+                    appearance: "none",
+                    WebkitAppearance: "none",
+                    backgroundImage: "linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%)",
+                    backgroundPosition: "calc(100% - 13px) 55%, calc(100% - 9px) 55%",
+                    backgroundSize: "4px 4px, 4px 4px",
+                    backgroundRepeat: "no-repeat",
+                    borderColor: restHere ? "var(--graview-edge)" : "transparent",
+                }, children: [_jsx("option", { value: "", children: restHere ? restHere.title : `+${rest.length} more` }), rest.map((place) => (_jsx("option", { value: `${place.kind}:${place.as}`, children: place.title }, `${place.kind}:${place.as}`)))] })) : null] }));
+}
+//# sourceMappingURL=places.js.map

package/dist/places.js.map

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

package/dist/popover.d.ts

@@ -0,0 +1,28 @@
+/**
+ * CLOSE A POPOVER AND GIVE THE KEYBOARD BACK TO WHAT OPENED IT.
+ *
+ * Every popover on the bar closes on Escape, and every one of them left the
+ * keyboard where it was — on a control inside the pane it had just taken
+ * away. A removed or hidden element takes focus to <body>, so pressing
+ * Escape after "undo" in the activity list put somebody working from the
+ * keyboard at the top of the document, and in WebKit the next Tab went
+ * nowhere at all. The button that opened the popover is where the keyboard
+ * came from, and it is still there.
+ *
+ * `anchor` holds the trigger (the element with `aria-expanded`) and the
+ * pane; the keyboard is moved only when it was inside the pane, so a press
+ * that opened the popover and closed it again stays exactly where it was.
+ */
+export declare function closeToTrigger(anchor: HTMLElement | null, close: () => void): void;
+/**
+ * A POPOVER STAYS IN THE BOX IT OPENED IN.
+ *
+ * On somebody else's page the app is one element with `overflow: hidden`,
+ * and a pane anchored to its button's right edge, 280 pixels wide, opened
+ * from a button near the element's left side ran off it: the profile's
+ * settings were cut in half at 1280 and began off the screen at 390. When
+ * the pane is inside an embed, it is slid back inside the embed's box and
+ * no taller than the room under its top — nudged, never re-laid out.
+ */
+export declare function keepInside(pane: HTMLElement | null): void;
+//# sourceMappingURL=popover.d.ts.map

package/dist/popover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../src/popover.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,cAAc,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,IAAI,GAAG,IAAI,CAMlF;AAED;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,IAAI,CAkBzD"}

package/dist/popover.js

@@ -0,0 +1,59 @@
+/**
+ * CLOSE A POPOVER AND GIVE THE KEYBOARD BACK TO WHAT OPENED IT.
+ *
+ * Every popover on the bar closes on Escape, and every one of them left the
+ * keyboard where it was — on a control inside the pane it had just taken
+ * away. A removed or hidden element takes focus to <body>, so pressing
+ * Escape after "undo" in the activity list put somebody working from the
+ * keyboard at the top of the document, and in WebKit the next Tab went
+ * nowhere at all. The button that opened the popover is where the keyboard
+ * came from, and it is still there.
+ *
+ * `anchor` holds the trigger (the element with `aria-expanded`) and the
+ * pane; the keyboard is moved only when it was inside the pane, so a press
+ * that opened the popover and closed it again stays exactly where it was.
+ */
+export function closeToTrigger(anchor, close) {
+    const at = typeof document === "undefined" ? null : document.activeElement;
+    const trigger = anchor?.querySelector("[aria-expanded]") ?? null;
+    const inside = at instanceof HTMLElement && anchor !== null && anchor.contains(at) && at !== trigger;
+    close();
+    if (inside)
+        trigger?.focus();
+}
+/**
+ * A POPOVER STAYS IN THE BOX IT OPENED IN.
+ *
+ * On somebody else's page the app is one element with `overflow: hidden`,
+ * and a pane anchored to its button's right edge, 280 pixels wide, opened
+ * from a button near the element's left side ran off it: the profile's
+ * settings were cut in half at 1280 and began off the screen at 390. When
+ * the pane is inside an embed, it is slid back inside the embed's box and
+ * no taller than the room under its top — nudged, never re-laid out.
+ */
+export function keepInside(pane) {
+    if (!pane)
+        return;
+    pane.style.translate = "";
+    const box = pane.closest("[data-graview-embed]")?.getBoundingClientRect();
+    if (!box)
+        return;
+    const at = pane.getBoundingClientRect();
+    if (at.width === 0)
+        return;
+    const GAP = 8;
+    let dx = 0;
+    if (at.left < box.left + GAP)
+        dx = box.left + GAP - at.left;
+    else if (at.right > box.right - GAP)
+        dx = box.right - GAP - at.right;
+    if (dx !== 0)
+        pane.style.translate = `${Math.round(dx)}px 0`;
+    const room = box.bottom - GAP - at.top;
+    if (at.height > room) {
+        // `max-height` is the content box's: the pane's own padding and border come on top of it.
+        const frame = at.height - parseFloat(getComputedStyle(pane).height || "0");
+        pane.style.maxHeight = `${Math.max(120, Math.floor(room - (Number.isFinite(frame) ? frame : 0)))}px`;
+    }
+}
+//# sourceMappingURL=popover.js.map

package/dist/popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.js","sourceRoot":"","sources":["../src/popover.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,cAAc,CAAC,MAA0B,EAAE,KAAiB;IAC1E,MAAM,EAAE,GAAG,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC;IAC3E,MAAM,OAAO,GAAG,MAAM,EAAE,aAAa,CAAc,iBAAiB,CAAC,IAAI,IAAI,CAAC;IAC9E,MAAM,MAAM,GAAG,EAAE,YAAY,WAAW,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,OAAO,CAAC;IACrG,KAAK,EAAE,CAAC;IACR,IAAI,MAAM;QAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AAC/B,CAAC;AAED;;;;;;;;;GASG;AACH,MAAM,UAAU,UAAU,CAAC,IAAwB;IACjD,IAAI,CAAC,IAAI;QAAE,OAAO;IAClB,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;IAC1B,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAc,sBAAsB,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACvF,IAAI,CAAC,GAAG;QAAE,OAAO;IACjB,MAAM,EAAE,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;IACxC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC;QAAE,OAAO;IAC3B,MAAM,GAAG,GAAG,CAAC,CAAC;IACd,IAAI,EAAE,GAAG,CAAC,CAAC;IACX,IAAI,EAAE,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI,GAAG,GAAG;QAAE,EAAE,GAAG,GAAG,CAAC,IAAI,GAAG,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC;SACvD,IAAI,EAAE,CAAC,KAAK,GAAG,GAAG,CAAC,KAAK,GAAG,GAAG;QAAE,EAAE,GAAG,GAAG,CAAC,KAAK,GAAG,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC;IACrE,IAAI,EAAE,KAAK,CAAC;QAAE,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,MAAM,CAAC;IAC7D,MAAM,IAAI,GAAG,GAAG,CAAC,MAAM,GAAG,GAAG,GAAG,EAAE,CAAC,GAAG,CAAC;IACvC,IAAI,EAAE,CAAC,MAAM,GAAG,IAAI,EAAE,CAAC;QACrB,0FAA0F;QAC1F,MAAM,KAAK,GAAG,EAAE,CAAC,MAAM,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,GAAG,CAAC,CAAC;QAC3E,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IACvG,CAAC;AACH,CAAC"}

package/dist/primitives/index.d.ts

@@ -0,0 +1,214 @@
+import { type CSSProperties, type ReactNode } from "react";
+/**
+ * A rich primitive set, not a visualization library.
+ *
+ * These cover the common cases so a new node kind renders sensibly before
+ * anyone writes a custom view. Everything is an ordinary component with
+ * ordinary props — the timeline lens is built from exactly these, which makes
+ * it the worked example of the authoring API rather than a privileged
+ * insider.
+ */
+export interface PanelProps {
+    readonly title?: ReactNode;
+    readonly subtitle?: ReactNode;
+    /** Dimmed trailing text: counts, times, status. */
+    readonly meta?: ReactNode;
+    readonly selected?: boolean;
+    readonly tone?: "default" | "muted" | "warning";
+    readonly children?: ReactNode;
+    readonly style?: CSSProperties;
+    /**
+     * Size to the content rather than filling the box the scene gave it.
+     *
+     * A focused single node was drawn as a 500-pixel white rectangle with four
+     * lines of text in the top corner — an empty page with a debug dump in it.
+     * A week's calendar genuinely wants the whole box; one nap does not. The
+     * scene centres a fitted panel in its band, so a short one reads as
+     * deliberate rather than as a rendering that failed halfway.
+     */
+    readonly fit?: boolean;
+    /**
+     * The title as a HEADING of this level, where the panel is what a page is
+     * about. A panel's title is drawn as a heading and was never one to a
+     * screen reader: the routed face's first screen — the way in, alone on a
+     * page — had no level-one heading at all, and axe said so.
+     */
+    readonly heading?: 1 | 2 | 3 | 4;
+    /**
+     * A card in the scene; a DOCUMENT on a page.
+     *
+     * The same component renders in both places — that is the two-mode contract
+     * — but a card is a thing with edges sitting on a ground, and a full page is
+     * not. Lifting a short record out of the scene drew a bordered box 250
+     * pixels tall floating in six hundred pixels of nothing, which reads as a
+     * rendering that stopped rather than as a document that is short.
+     *
+     * `page` drops the border, the shadow, the fill and the fixed height, and
+     * lets the title be a heading rather than a card's label. Nothing else
+     * changes, so a view does not fork.
+     */
+    readonly variant?: "card" | "page";
+}
+/**
+ * Secondary text: a COLOUR, never an opacity.
+ *
+ * `opacity: 0.7` on small text reads as "quieter" and computes as whatever
+ * the background happens to be — which is how four elements here landed at
+ * 3.32:1 against a 4.5:1 requirement without anyone choosing an unreadable
+ * colour. A token composites against a known ground and can be checked.
+ * axe-core checks it on every run of `scripts/run-a11y.mjs`.
+ */
+export declare const MUTED_TEXT: CSSProperties;
+/** Even quieter, still above 4.5:1 on both panel grounds. */
+export declare const FAINT_TEXT: CSSProperties;
+/**
+ * THE ROOM A VIEW HAS, in pixels, or null before the first measurement.
+ *
+ * A lens is drawn into whatever box the layout gives it — the focus card
+ * in a 360px embed, a billboard, a page's column — and the ones that laid
+ * themselves out for a desk (a 316px label column, seven day columns) were
+ * unreadable in half of them. The width is the fact they need to choose a
+ * shape by; this is the one place it is read.
+ */
+export declare function useWidth(ref: {
+    current: HTMLElement | null;
+}): number | null;
+export declare function Panel({ title, subtitle, meta, selected, tone, children, style, fit, variant, heading, }: PanelProps): import("react").JSX.Element;
+/**
+ * A PARAGRAPH WHOSE LINKS ARE TARGETS TOO.
+ *
+ * An inline link in a sentence is a link however it reads, and a harness
+ * measuring every control found one at 194x17 in a product's own prose — the
+ * text is sized in rem, the fingertip floor is not, and a line of body copy
+ * is shorter than a fingertip. Every app that ran the audit found this, and
+ * each one fixed it in its own stylesheet.
+ *
+ * `inline-flex` with the floor, so a link in a paragraph is as pressable as
+ * a button without the sentence changing shape around it.
+ */
+export declare function Prose({ children, style }: {
+    readonly children: ReactNode;
+    readonly style?: CSSProperties;
+}): import("react").JSX.Element;
+/**
+ * Present to a screen reader, absent to the eye — the one idiom, written
+ * once.
+ *
+ * Written out by hand in two places, which meant two shapes for the same
+ * decision and no way for a harness to tell either of them from a caption
+ * that had genuinely been cut off. `scripts/survey-ui.mjs` reported both as
+ * "overflowing" on every screen of every app, twenty lines of noise that a
+ * real clipped caption would have hidden behind.
+ */
+export declare const VISUALLY_HIDDEN: {
+    readonly position: "absolute";
+    readonly width: 1;
+    readonly height: 1;
+    readonly overflow: "hidden";
+    readonly clip: "rect(0 0 0 0)";
+    readonly clipPath: "inset(50%)";
+    readonly whiteSpace: "nowrap";
+};
+export interface ChipProps {
+    readonly label: ReactNode;
+    /** Degrees around the colour wheel, as `hueFor` gives them. Kind-derived, so it is stable per kind. */
+    readonly hue?: number;
+    readonly selected?: boolean;
+    readonly title?: string;
+    /**
+     * The node this chip stands for. Set it and the chip becomes a target:
+     * clicking it travels to that node. Opt-in on purpose — a chip showing a
+     * field value stands for nothing you can navigate to.
+     */
+    readonly pickId?: string;
+    /**
+     * What this mark CLAIMS about the current selection, said rather than
+     * painted: "lit" when the selection reaches it, "dimmed" when it does not,
+     * "plain" when nothing is selected.
+     *
+     * Every lens the framework ships says this on its own marks, and the skill
+     * asks an app's lens to say it too — while the primitive an app would
+     * naturally reach for could not. A lens built out of `Roster` therefore had
+     * pick targets that were emphasised by opacity alone, which is a claim
+     * about a picture that nothing can check: not a test, not `audit-ui`'s
+     * `halfSaid`, and not a person reading the tree.
+     */
+    readonly emphasis?: "lit" | "dimmed" | "plain";
+}
+/** One small labelled thing. The glyph-fidelity workhorse. */
+export declare function Chip({ label, hue, selected, title, pickId, emphasis }: ChipProps): import("react").JSX.Element;
+export interface RosterProps {
+    readonly items: readonly {
+        id: string;
+        label: ReactNode;
+        hue?: number;
+        /** What this mark claims about the selection. See `ChipProps.emphasis`. */
+        emphasis?: "lit" | "dimmed" | "plain";
+    }[];
+    readonly max?: number;
+    readonly selectedIds?: readonly string[];
+    /** True when the item ids are real node ids, so each chip can be a target. */
+    readonly pick?: boolean;
+}
+/**
+ * A list of chips that degrades honestly: past `max` it says how many more
+ * rather than truncating silently, because "and 9 more" is information and a
+ * clipped list is a lie.
+ */
+export declare function Roster({ items, max, selectedIds, pick }: RosterProps): import("react").JSX.Element;
+export interface AggregateProps {
+    readonly label: ReactNode;
+    readonly count: number;
+    readonly items?: readonly {
+        id: string;
+        label: ReactNode;
+        hue?: number;
+    }[];
+    readonly onExpand?: () => void;
+    /** Something inside is implicated in a current problem. */
+    readonly flagged?: boolean;
+}
+/**
+ * A group standing in for a kind.
+ *
+ * First-class, not a scale fallback: "People" is a legitimate view of a kind,
+ * which is why expanding it is the same mechanism as collapsing back.
+ */
+export declare function Aggregate({ label, count, items, onExpand, flagged }: AggregateProps): import("react").JSX.Element;
+export interface AxisProps {
+    readonly ticks: readonly {
+        at: number;
+        label: ReactNode;
+    }[];
+    readonly orientation?: "horizontal" | "vertical";
+    /** Total extent in the same units as `at`. */
+    readonly extent: number;
+}
+/** Labelled ticks along one dimension. The timeline's hours and days. */
+export declare function Axis({ ticks, orientation, extent }: AxisProps): import("react").JSX.Element;
+export interface GridProps {
+    readonly columns: readonly {
+        id: string;
+        label: ReactNode;
+    }[];
+    /** Extent of the cross axis, in the caller's own units. */
+    readonly extent: number;
+    readonly gutter?: number;
+    /** Absolutely positioned children, placed by the caller inside a column. */
+    readonly children?: ReactNode;
+}
+/** Named columns over a continuous cross axis. A week over hours. */
+export declare function Grid({ columns, extent, gutter, children }: GridProps): import("react").JSX.Element;
+export interface ConnectorProps {
+    readonly x1: number;
+    readonly y1: number;
+    readonly x2: number;
+    readonly y2: number;
+    readonly kind?: string;
+    readonly pattern?: "solid" | "dashed" | "dotted";
+    readonly hue?: number;
+    readonly width?: number;
+}
+/** One drawn relationship. Stroke treatment carries the edge's meaning. */
+export declare function Connector({ x1, y1, x2, y2, kind, pattern, hue, width, }: ConnectorProps): import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/primitives/index.d.ts.map

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