@nanisoft/prism-ui 0.16.0 → 1.0.0

package/dist/blocks/card-index-01/card-index.js

@@ -0,0 +1,154 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { XIcon } from 'lucide-react';
+import { useEffect, useId, useRef, useState } from 'react';
+import { Button } from '../../components/ui/button.js';
+import { Checkbox } from '../../components/ui/checkbox.js';
+import { LiveRegion } from '../../components/ui/live-region.js';
+import { Pagination, PaginationContent, PaginationItem } from '../../components/ui/pagination.js';
+import { headingSizeClass } from '../../components/ui/section.js';
+import { cn } from '../../lib/utils.js';
+/** The page numbers to show, with `ellipsis` where a run is held back. */
+function pageWindow(page, pageCount) {
+    if (pageCount <= 7) {
+        return Array.from({ length: pageCount }, (_, index) => index + 1);
+    }
+    const pages = [1];
+    const start = Math.max(2, page - 1);
+    const end = Math.min(pageCount - 1, page + 1);
+    if (start > 2)
+        pages.push('ellipsis');
+    for (let value = start; value <= end; value += 1)
+        pages.push(value);
+    if (end < pageCount - 1)
+        pages.push('ellipsis');
+    pages.push(pageCount);
+    return pages;
+}
+/** The grid track count at the widest width, as the one static class per arm. */
+function gridClass(columnsPerRow) {
+    if (columnsPerRow === 2)
+        return 'grid grid-cols-1 gap-4 sm:grid-cols-2';
+    if (columnsPerRow === 4)
+        return 'grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4';
+    return 'grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3';
+}
+/**
+ * The record index as a grid of picture cards a reader compares and acts on.
+ *
+ * **It is the record index's second arrangement, and the job-identity test is
+ * what settles it.** A reader here is doing the index's job, deciding which
+ * record to act on, and the difference from `DataTable01` is the arrangement
+ * rather than the content: records are compared as pictures rather than
+ * across columns, so a screen that wants this has not found the index with one
+ * more prop, it has found the picture arrangement. `DESIGN.md` names it as an
+ * arrangement that forces a second Item, and this is that Item. A card carries
+ * the caller's own picture, name and price through `renderCard`, and per card
+ * actions through `renderCardActions`.
+ *
+ * **It shares the record index's selection and announcement contract.** The
+ * same `selectable` union, the same held set, the same three-state header
+ * control, the same polite `LiveRegion` carrying a count, the same batch bar
+ * that mounts only while the set is non-empty, and the same `selectionScope`
+ * that distinguishes a page-wide selection from a filter-wide one, all because
+ * ticket 166 made one contract the law for the index family. The count is
+ * announced once, politely, and never assertively; when the set empties the
+ * region speaks its own sentence rather than a count of zero; and the visible
+ * summary and the announced count are the same string.
+ *
+ * **It draws the page of cards it was handed, and it fetches nothing.** It sorts
+ * nothing, filters nothing and slices nothing, and every control in the footer
+ * is a report. It owns no action, batch or per card, so it owns no confirmation
+ * dialog, no toast and no undo; the batch bar is the Block's region and the
+ * caller's controls, and the dismiss is the Block's one control because its
+ * whole body is a call on the set the Block already holds.
+ *
+ * **The card is the caller's composition, and the arrangement is the Block's.**
+ * A picture, a name and a price are three different value shapes, and the read
+ * vocabulary this package publishes (`ColumnSpec` and `ColumnKind`) describes a
+ * value a reader reads in a table rather than the anatomy of a card. So the card
+ * body is one node per record and the picture, the name and the price are the
+ * caller's own composition, exactly as a per card action is. The Block owns the
+ * grid, the selection set, the count, the batch bar and the page boundary, which
+ * is the whole of what makes this an index rather than a list of pictures.
+ */
+export function CardIndex01(props) {
+    const { title, description, headingLevel = 'h2', rows, getRowId, renderCard, renderCardActions, columnsPerRow = 3, page: pageProp, defaultPage = 1, pageCount, onPageChange, emptyMessage, labels, className, } = props;
+    const Heading = headingLevel;
+    const headingId = useId();
+    const isSelectable = props.selectable === true;
+    const [internalSelected, setInternalSelected] = useState(() => [
+        ...(props.defaultSelectedIds ?? []),
+    ]);
+    const [internalPage, setInternalPage] = useState(defaultPage);
+    const selected = isSelectable
+        ? props.selectedIds === undefined
+            ? internalSelected
+            : [...props.selectedIds]
+        : [];
+    const page = pageProp ?? internalPage;
+    const clampPage = (value) => Math.min(Math.max(1, value), Math.max(1, pageCount));
+    const currentPage = clampPage(page);
+    const hasCardActions = renderCardActions !== undefined;
+    const scope = isSelectable ? props.selectionScope : undefined;
+    const filterScope = scope?.scope === 'filter' ? scope : undefined;
+    // A filter-wide selection is a selection even though its keys are not on
+    // screen, so the bar mounts and the region speaks from the scope rather than
+    // from the page's keys. The number is the caller's and is never the rows on
+    // screen.
+    const selectionActive = isSelectable && (filterScope !== undefined || selected.length > 0);
+    const selectionSummary = filterScope !== undefined
+        ? labels.selectedAllMatching(filterScope.count)
+        : labels.selectedCount(selected.length);
+    const rowIds = rows.map(getRowId);
+    const allSelected = filterScope !== undefined || (rowIds.length > 0 && rowIds.every((id) => selected.includes(id)));
+    const someSelected = filterScope !== undefined || rowIds.some((id) => selected.includes(id));
+    // The emptying sentence. A live region speaks when its text changes, and the
+    // sequence where the selection falls to nothing is the one the reader has to
+    // be told about because the batch bar they were about to use disappears with
+    // it. The previous presence is ref-held, so the render that reaches nothing
+    // still knows there was a selection and can speak the sentence rather than the
+    // absence of one.
+    const previousActive = useRef(selectionActive);
+    useEffect(() => {
+        previousActive.current = selectionActive;
+    }, [selectionActive]);
+    const announcement = selectionActive
+        ? selectionSummary
+        : previousActive.current
+            ? labels.clearedSelection
+            : null;
+    function changeSelection(ids) {
+        if (isSelectable === false)
+            return;
+        if (props.selectedIds === undefined)
+            setInternalSelected(ids);
+        props.onSelectedIdsChange?.(ids);
+    }
+    function clearSelection() {
+        changeSelection([]);
+    }
+    function toggleAll(checked) {
+        if (checked) {
+            changeSelection([...new Set([...selected, ...rowIds])]);
+        }
+        else {
+            changeSelection(selected.filter((id) => !rowIds.includes(id)));
+        }
+    }
+    function toggleRow(id, checked) {
+        changeSelection(checked ? [...selected, id] : selected.filter((item) => item !== id));
+    }
+    function changePage(next) {
+        const clamped = clampPage(next);
+        if (pageProp === undefined)
+            setInternalPage(clamped);
+        onPageChange?.(clamped);
+    }
+    return (_jsxs("div", { "data-slot": "card-index-01", className: cn('flex flex-col gap-4', className), children: [title || description ? (_jsxs("div", { "data-slot": "card-index-01-header", className: "flex flex-col gap-1", children: [title ? (_jsx(Heading, { id: headingId, className: cn('font-semibold tracking-tight text-balance', headingSizeClass(Heading)), children: title })) : null, description ? (_jsx("p", { className: "text-muted-foreground text-sm", children: description })) : null] })) : null, selectionActive ? (_jsxs("div", { "data-slot": "card-index-01-batch-bar", role: "toolbar", "aria-label": selectionSummary, className: "bg-card flex w-full items-center gap-1 rounded-md border p-1", children: [_jsx("span", { className: "text-muted-foreground px-2 text-sm font-medium", children: selectionSummary }), _jsx("div", { className: "flex flex-1 flex-wrap items-center gap-2", children: props.selectable === true ? props.batchActions : null }), _jsx(Button, { "data-slot": "card-index-01-dismiss", type: "button", variant: "ghost", size: "sm", "aria-label": labels.dismissSelection, onClick: clearSelection, children: _jsx(XIcon, { "aria-hidden": "true" }) })] })) : null, _jsx(LiveRegion, { "data-slot": "card-index-01-announcement", politeness: "polite", className: "sr-only", children: announcement }), isSelectable ? (_jsx("div", { "data-slot": "card-index-01-select-all", className: "flex items-center gap-2", children: _jsx(Checkbox, { checked: allSelected, indeterminate: !allSelected && someSelected, onCheckedChange: toggleAll, "aria-label": labels.selectAll }) })) : null, rows.length ? (_jsx("ul", { "data-slot": "card-index-01-grid", className: gridClass(columnsPerRow), children: rows.map((row) => {
+                    const id = getRowId(row);
+                    const isSelected = selected.includes(id);
+                    return (_jsxs("li", { "data-slot": "card-index-01-card", "data-state": isSelected ? 'selected' : undefined, className: "bg-card flex flex-col gap-3 rounded-xl border p-3", children: [isSelectable || hasCardActions ? (_jsxs("div", { className: "flex items-start justify-between gap-2", children: [isSelectable ? (_jsx(Checkbox, { checked: isSelected, onCheckedChange: (checked) => toggleRow(id, checked), "aria-label": labels.selectCard(row) })) : (_jsx("span", {})), hasCardActions ? (_jsx("div", { role: "group", "aria-label": labels.cardActions, className: "flex items-center gap-1", children: renderCardActions?.(row) })) : null] })) : null, _jsx("div", { className: "min-w-0 flex-1", children: renderCard(row) })] }, id));
+                }) })) : (_jsx("div", { "data-slot": "card-index-01-empty", className: "text-muted-foreground border-border flex h-24 items-center justify-center rounded-xl border text-center text-sm", children: emptyMessage ?? labels.empty })), _jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [selectionActive ? (_jsx("span", { className: "text-muted-foreground text-sm", children: selectionSummary })) : (_jsx("span", {})), _jsx(Pagination, { className: "mx-0 w-auto justify-end", children: _jsxs(PaginationContent, { children: [_jsx(PaginationItem, { children: _jsx(Button, { type: "button", variant: "ghost", size: "sm", disabled: currentPage <= 1, "aria-label": labels.previous, onClick: () => changePage(currentPage - 1), children: labels.previous }) }), pageWindow(currentPage, Math.max(1, pageCount)).map((item, index) => item === 'ellipsis' ? (_jsx(PaginationItem, { children: _jsx("span", { "aria-hidden": "true", className: "text-muted-foreground px-2", children: "..." }) }, `ellipsis-${index}`)) : (_jsx(PaginationItem, { children: _jsx(Button, { type: "button", variant: item === currentPage ? 'outline' : 'ghost', size: "icon", "aria-label": labels.page(item), "aria-current": item === currentPage ? 'page' : undefined, onClick: () => changePage(item), children: item }) }, item))), _jsx(PaginationItem, { children: _jsx(Button, { type: "button", variant: "ghost", size: "sm", disabled: currentPage >= Math.max(1, pageCount), "aria-label": labels.next, onClick: () => changePage(currentPage + 1), children: labels.next }) })] }) })] })] }));
+}
+export default CardIndex01;

package/dist/blocks/card-index-01/index.d.ts

@@ -0,0 +1,3 @@
+export { CardIndex01, default } from './card-index.js';
+export type { CardIndex01Labels, CardIndex01Props, CardIndex01Row, CardIndex01SelectionScope, } from './card-index.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/blocks/card-index-01/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/card-index-01/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACnD,YAAY,EACV,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,yBAAyB,GAC1B,MAAM,cAAc,CAAA"}

package/dist/blocks/card-index-01/index.js

@@ -0,0 +1 @@
+export { CardIndex01, default } from './card-index.js';

package/dist/blocks/chart-card-01/chart-card-01.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react';
 import { type HeadingLevel } from '../../components/ui/section.js';
+import type { MetricSpec } from '../../lib/spec.js';
 /**
  * How much of a six-track grid one card takes.
  *
@@ -18,25 +19,6 @@ import { type HeadingLevel } from '../../components/ui/section.js';
  * grid the caller composed them into.
  */
 export type ChartCard01Span = 'full' | 'half' | 'third';
-/**
- * One figure the card states about what the figure shows.
- *
- * A node and not a number for the reason `Metric` gives: a caller's figure is often a
- * value it formatted itself, and a number prop would make it either ship that as a
- * string outside the Component or lose the unit it belongs to. `deltaFormat` is here
- * for the same reason: Prism formats the delta and nothing else, and a delta of `0.12`
- * is twelve percent, twelve cents or twelve milliseconds.
- */
-export type ChartCard01Reading = {
-    /** What the figure measures, read under the figure rather than above it. */
-    label: string;
-    /** The figure itself, in the caller's own units and the caller's own formatting. */
-    value: ReactNode;
-    /** The change against the previous reading, where the sign is the direction. */
-    delta?: number;
-    /** The words for the delta, given the number. See the note on this type. */
-    deltaFormat?: (value: number) => string;
-};
 /**
  * The props a ChartCard01 takes. Every string is a prop and the Block ships none.
  */
@@ -69,8 +51,19 @@ export type ChartCard01Props = {
      * here, which is the only reason the swatch and the mark cannot disagree.
      */
     legend?: ReactNode;
-    /** The figures this card states about what the figure shows. */
-    reading?: ChartCard01Reading[];
+    /**
+     * The figures this card states about what the figure shows, as the shared
+     * `MetricSpec` typed data.
+     *
+     * **The shared specification and not a shape of this Block's own.** `key`,
+     * `label` and `value` are required on each reading, `delta` is a number whose sign
+     * is the direction, `deltaFormat` is the caller's own words for that change,
+     * `hint` carries the period or the caveat, and a `series` and an `href` each travel
+     * with the label or the words they cannot be read without. The type is published as
+     * `@nanisoft/prism-ui/spec`, so the words a caller learns on a summary are the
+     * words on this card.
+     */
+    reading?: MetricSpec[];
     /** The controls that act on the figure: a range, a segment, a download. */
     actions?: ReactNode;
     /** The band under the figure, for the line that qualifies it. */
@@ -123,6 +116,15 @@ export type ChartCard01Props = {
  * so a card composed one level deeper carries its outline with it instead of
  * announcing three siblings of the section that introduces them.
  *
+ * **The readings are the shared `MetricSpec` and not a shape of this Block's own, so
+ * a figure declared for a summary is the same figure here.** Each reading carries a
+ * stable `key` that is never the words of the label, a required `label` and `value`,
+ * a `delta` whose sign is the direction, an optional `deltaFormat` carrying the
+ * caller's own words for the change, an optional `hint` for the period or the
+ * caveat, and an optional `series` and `href` with their names. A delta with no
+ * formatter prints the number the caller passed and one with a formatter prints the
+ * caller's words, which is the disagreement this migration closes.
+ *
  * **The readings sit in a flex row that wraps, and they share the width rather than
  * holding a fixed one.** The measurement that decides it: a `third` card at the
  * 72rem container is about 22rem wide, so three readings across it are about 7rem

package/dist/blocks/chart-card-01/chart-card-01.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-card-01.d.ts","sourceRoot":"","sources":["../../../src/blocks/chart-card-01/chart-card-01.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAWtC,OAAO,EAAc,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAG3E;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAA;AAEvD;;;;;;;;GAQG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAA;IACb,oFAAoF;IACpF,KAAK,EAAE,SAAS,CAAA;IAChB,gFAAgF;IAChF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4EAA4E;IAC5E,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACxC,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,KAAK,EAAE,SAAS,CAAA;IAChB,qEAAqE;IACrE,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB;;;;;;;;OAQG;IACH,MAAM,EAAE,SAAS,CAAA;IACjB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,gEAAgE;IAChE,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAA;IAC9B,2EAA2E;IAC3E,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,iEAAiE;IACjE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,0EAA0E;IAC1E,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAgBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,WAAW,EACX,MAAM,EACN,MAAM,EACN,OAAY,EACZ,OAAO,EACP,MAAM,EACN,IAAa,EACb,YAAmB,EACnB,SAAS,GACV,EAAE,gBAAgB,+BAmElB;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"chart-card-01.d.ts","sourceRoot":"","sources":["../../../src/blocks/chart-card-01/chart-card-01.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAYtC,OAAO,EAAc,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAE3E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAGhD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAA;AAEvD;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;OAGG;IACH,KAAK,EAAE,SAAS,CAAA;IAChB,qEAAqE;IACrE,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB;;;;;;;;OAQG;IACH,MAAM,EAAE,SAAS,CAAA;IACjB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EAAE,UAAU,EAAE,CAAA;IACtB,2EAA2E;IAC3E,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,iEAAiE;IACjE,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,0EAA0E;IAC1E,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AA+CD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,WAAW,EACX,MAAM,EACN,MAAM,EACN,OAAY,EACZ,OAAO,EACP,MAAM,EACN,IAAa,EACb,YAAmB,EACnB,SAAS,GACV,EAAE,gBAAgB,+BA+FlB;AAED,eAAe,WAAW,CAAA"}

package/dist/blocks/chart-card-01/chart-card-01.js

@@ -1,7 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from '../../components/ui/card.js';
+import { CtaLink } from '../../components/ui/cta-link.js';
 import { Metric } from '../../components/ui/metric.js';
 import { childLevel } from '../../components/ui/section.js';
+import { Sparkline } from '../../components/ui/sparkline.js';
 import { cn } from '../../lib/utils.js';
 /**
  * What each named span takes of a six-track grid, at the breakpoint the grid appears.
@@ -16,6 +18,32 @@ const SPAN = {
     half: 'lg:col-span-3',
     third: 'lg:col-span-2',
 };
+/**
+ * The refusals, as checks, so a reading that would render a link nobody can name is
+ * a diagnostic in a console rather than a rendered link.
+ *
+ * **The type already holds both pairs, and these checks exist for the caller the
+ * type never saw.** `MetricSpec` requires a destination's words wherever it has a
+ * destination and a series name wherever it has a series, so a typed caller cannot
+ * reach either diagnostic. A JavaScript caller can, and the cost of reaching one is
+ * a reading that draws a link with no words or a shape no reader can announce, so
+ * the same rule is stated once more where a runtime value can be read: the pair rule
+ * is the one `Dashboard01` makes.
+ */
+function assertMetrics(metrics) {
+    for (const metric of metrics) {
+        if ((metric.href === undefined) !== (metric.hrefLabel === undefined)) {
+            throw new Error(`ChartCard01: the reading "${metric.key}" declares one of href and hrefLabel without the other, so the ` +
+                'reading would carry a link with no words on it, or a name with no link beside it. Pass the words that say ' +
+                'what following it does, or omit the href.');
+        }
+        if ((metric.series === undefined) !== (metric.seriesLabel === undefined)) {
+            throw new Error(`ChartCard01: the reading "${metric.key}" declares one of series and seriesLabel without the other, so the ` +
+                'figure would be a picture with no name, which a screen reader cannot announce and two shapes in one row ' +
+                'cannot be told apart. Pass the series name in the words the product uses, or omit the series.');
+        }
+    }
+}
 /**
  * A titled panel holding one figure, the key for it, the controls that act on it, and
  * the figures the card states about it.
@@ -51,6 +79,15 @@ const SPAN = {
  * so a card composed one level deeper carries its outline with it instead of
  * announcing three siblings of the section that introduces them.
  *
+ * **The readings are the shared `MetricSpec` and not a shape of this Block's own, so
+ * a figure declared for a summary is the same figure here.** Each reading carries a
+ * stable `key` that is never the words of the label, a required `label` and `value`,
+ * a `delta` whose sign is the direction, an optional `deltaFormat` carrying the
+ * caller's own words for the change, an optional `hint` for the period or the
+ * caveat, and an optional `series` and `href` with their names. A delta with no
+ * formatter prints the number the caller passed and one with a formatter prints the
+ * caller's words, which is the disagreement this migration closes.
+ *
  * **The readings sit in a flex row that wraps, and they share the width rather than
  * holding a fixed one.** The measurement that decides it: a `third` card at the
  * 72rem container is about 22rem wide, so three readings across it are about 7rem
@@ -76,6 +113,14 @@ export function ChartCard01({ title, description, figure, legend, reading = [],
     // One step below the heading that introduces this card, so the card's own title
     // nests under the section rather than beside it.
     const Title = childLevel(headingLevel);
-    return (_jsx("div", { "data-slot": "chart-card-01", "data-span": span, className: cn(SPAN[span], className), children: _jsxs(Card, { className: "h-full gap-4 py-5", children: [_jsxs(CardHeader, { className: "grid-cols-[minmax(0,1fr)_auto] gap-x-3", children: [_jsxs("div", { "data-slot": "chart-card-01-head", className: "flex min-w-0 flex-col gap-1.5", children: [_jsx(CardTitle, { as: Title, className: "text-base", children: title }), description === undefined ? null : (_jsx(CardDescription, { className: "text-pretty", children: description }))] }), actions === undefined ? null : (_jsx("div", { "data-slot": "chart-card-01-actions", className: "flex shrink-0 items-center gap-2", children: actions }))] }), _jsxs(CardContent, { className: "flex flex-col gap-3", children: [_jsx("div", { "data-slot": "chart-card-01-figure", className: "min-w-0", children: figure }), legend === undefined ? null : (_jsx("div", { "data-slot": "chart-card-01-legend", className: "min-w-0", children: legend })), reading.length === 0 ? null : (_jsx("div", { "data-slot": "chart-card-01-reading", className: "border-border flex flex-wrap items-end gap-x-6 gap-y-3 border-t pt-4", children: reading.map((entry) => (_jsx("div", { className: "min-w-0 flex-1", children: _jsx(Metric, { value: entry.value, label: entry.label, delta: entry.delta, deltaFormat: entry.deltaFormat }) }, entry.label))) }))] }), footer === undefined ? null : (_jsx(CardFooter, { "data-slot": "chart-card-01-footer", children: footer }))] }) }));
+    if (reading.length > 0)
+        assertMetrics(reading);
+    return (_jsx("div", { "data-slot": "chart-card-01", "data-span": span, className: cn(SPAN[span], className), children: _jsxs(Card, { className: "h-full gap-4 py-5", children: [_jsxs(CardHeader, { className: "grid-cols-[minmax(0,1fr)_auto] gap-x-3", children: [_jsxs("div", { "data-slot": "chart-card-01-head", className: "flex min-w-0 flex-col gap-1.5", children: [_jsx(CardTitle, { as: Title, className: "text-base", children: title }), description === undefined ? null : (_jsx(CardDescription, { className: "text-pretty", children: description }))] }), actions === undefined ? null : (_jsx("div", { "data-slot": "chart-card-01-actions", className: "flex shrink-0 items-center gap-2", children: actions }))] }), _jsxs(CardContent, { className: "flex flex-col gap-3", children: [_jsx("div", { "data-slot": "chart-card-01-figure", className: "min-w-0", children: figure }), legend === undefined ? null : (_jsx("div", { "data-slot": "chart-card-01-legend", className: "min-w-0", children: legend })), reading.length === 0 ? null : (_jsx("div", { "data-slot": "chart-card-01-reading", className: "border-border flex flex-wrap items-end gap-x-6 gap-y-3 border-t pt-4", children: reading.map((metric) => {
+                                // The delta's words are the caller's own node, and `Metric` takes a
+                                // formatter, so the node is placed through one. A delta with no words
+                                // is left to `Metric`, which prints the number the caller passed.
+                                const deltaWords = metric.deltaFormat;
+                                return (_jsxs("div", { "data-slot": "chart-card-01-reading-item", "data-metric": metric.key, className: "flex min-w-0 flex-1 flex-col gap-3", children: [_jsx(Metric, { value: metric.value, label: metric.label, delta: metric.delta, deltaFormat: deltaWords === undefined ? undefined : () => deltaWords, hint: metric.hint }), metric.series === undefined ? null : (_jsx("div", { "data-slot": "chart-card-01-reading-sparkline", className: "flex", children: _jsx(Sparkline, { values: metric.series, label: metric.seriesLabel, className: "ms-auto" }) })), metric.href === undefined ? null : (_jsx(CtaLink, { href: metric.href, variant: "ghost", size: "sm", children: metric.hrefLabel }))] }, metric.key));
+                            }) }))] }), footer === undefined ? null : (_jsx(CardFooter, { "data-slot": "chart-card-01-footer", children: footer }))] }) }));
 }
 export default ChartCard01;

package/dist/blocks/chart-card-01/index.d.ts

@@ -1,3 +1,3 @@
 export { ChartCard01, default } from './chart-card-01.js';
-export type { ChartCard01Props, ChartCard01Reading, ChartCard01Span, } from './chart-card-01.js';
+export type { ChartCard01Props, ChartCard01Span } from './chart-card-01.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/blocks/chart-card-01/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/chart-card-01/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAKtD,YAAY,EACV,gBAAgB,EAChB,kBAAkB,EAClB,eAAe,GAChB,MAAM,iBAAiB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/blocks/chart-card-01/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAItD,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA"}

package/dist/blocks/chart-group-01/chart-group-01.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import { type HeadingLevel } from '../../components/ui/section.js';
-import { type ChartCard01Reading } from '../chart-card-01/chart-card-01.js';
+import type { MetricSpec } from '../../lib/spec.js';
 /**
  * One card in the grid: a title, a figure, and everything the card carries around it.
  *
@@ -32,8 +32,8 @@ export type ChartGroup01Card = {
     figure: ReactNode;
     /** The key for the figure, wherever the caller wants it. */
     legend?: ReactNode;
-    /** The figures this card states about what the figure shows. */
-    reading?: ChartCard01Reading[];
+    /** The figures this card states about what the figure shows. See `MetricSpec`. */
+    reading?: MetricSpec[];
     /** The controls that act on the figure: a range, a segment, a download. */
     actions?: ReactNode;
 };

package/dist/blocks/chart-group-01/chart-group-01.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-group-01.d.ts","sourceRoot":"","sources":["../../../src/blocks/chart-group-01/chart-group-01.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAA2B,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAExF,OAAO,EAAe,KAAK,kBAAkB,EAAE,MAAM,gCAAgC,CAAA;AAErF;;;;;;;GAOG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;;;OAMG;IACH,EAAE,EAAE,MAAM,CAAA;IACV,0EAA0E;IAC1E,KAAK,EAAE,SAAS,CAAA;IAChB,qEAAqE;IACrE,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB;;;;;;OAMG;IACH,MAAM,EAAE,SAAS,CAAA;IACjB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,gEAAgE;IAChE,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAA;IAC9B,2EAA2E;IAC3E,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,+EAA+E;IAC/E,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;;OAMG;IACH,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;IACf;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAeD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,KAAK,EACL,WAAW,EACX,KAAK,EACL,OAAW,EACX,KAAK,EACL,YAAmB,EACnB,SAAS,GACV,EAAE,iBAAiB,+BA2CnB;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"chart-group-01.d.ts","sourceRoot":"","sources":["../../../src/blocks/chart-group-01/chart-group-01.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAA2B,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AACxF,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAIhD;;;;;;;GAOG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;;;OAMG;IACH,EAAE,EAAE,MAAM,CAAA;IACV,0EAA0E;IAC1E,KAAK,EAAE,SAAS,CAAA;IAChB,qEAAqE;IACrE,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB;;;;;;OAMG;IACH,MAAM,EAAE,SAAS,CAAA;IACjB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,kFAAkF;IAClF,OAAO,CAAC,EAAE,UAAU,EAAE,CAAA;IACtB,2EAA2E;IAC3E,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,+EAA+E;IAC/E,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4CAA4C;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;;OAMG;IACH,KAAK,EAAE,gBAAgB,EAAE,CAAA;IACzB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;IACf;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAeD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,KAAK,EACL,WAAW,EACX,KAAK,EACL,OAAW,EACX,KAAK,EACL,YAAmB,EACnB,SAAS,GACV,EAAE,iBAAiB,+BA2CnB;AAED,eAAe,YAAY,CAAA"}

package/dist/blocks/contact-01/contact.d.ts

@@ -1,81 +1,21 @@
 import type { ReactNode } from 'react';
 import { type HeadingLevel } from '../../components/ui/section.js';
+import type { FieldSpecGroup } from '../../lib/spec.js';
 /**
- * One choice in a `select` field, and nothing else.
+ * One thing wrong with the form, in the caller's own words.
  *
- * A native `<option>` holds text and nothing more, which is the whole reason a
- * contact form's select is a `NativeSelect` rather than the Base UI one. The two
- * values are a string and its label, so a caller who needs a description beside an
- * option, a count, or anything nested is reaching for a control the platform
- * cannot render, and `Contact01` does not pretend otherwise: it names
- * `NativeSelect`'s own argument in its JSDoc and stops there.
+ * `field` is the `key` of the field the message belongs to, and the key rather
+ * than the label because it is what the caller's values and the form's own
+ * `FormData` are keyed by: a message matched by a label's words breaks the moment
+ * the label is translated. The shape is the one the dialog, the wizard and the
+ * write form already publish, so this Block mints no fifth spelling of an issue.
  */
-export type Contact01Option = {
-    /** What the form submits for this choice, which is a key and not a sentence. */
-    value: string;
-    /** The words the reader sees, in the product's own language. */
-    label: string;
+export type Contact01Issue = {
+    /** The `key` of the field this message belongs to. */
+    field: string;
+    /** The message, in the product's own words. */
+    message: string;
 };
-/**
- * What every contact field carries, whichever control it draws.
- *
- * `required` is a boolean rather than an optional prop because there is no third
- * state worth having: a field is one the reader must fill or one they may leave,
- * and a `required?: boolean` leaves a caller who passed nothing unable to say which
- * of the two they meant. A field is a data declaration and nothing else, and the
- * two arms below differ only in which control is drawn and in the one property
- * that control needs and the other has no use for.
- */
-type ContactFieldBase = {
-    /** The caller's key for this field, and the key the value arrives under. */
-    id: string;
-    /** The field's visible name, and the accessible name its control announces. */
-    label: string;
-    /** Whether the reader may submit the form without filling it. */
-    required: boolean;
-    /**
-     * A line under the control, announced with it.
-     *
-     * A node, because the honest line is sometimes not one sentence: a caller's
-     * hint, a link to the thing being asked about, a piece of the page's own copy.
-     * It is wired to the control through `aria-describedby` rather than drawn as a
-     * footnote, so a screen reader hears what this field is for as they reach it.
-     */
-    description?: ReactNode;
-    /** What the control shows while it is empty. A hint, not a name. */
-    placeholder?: string;
-    /** The platform's own autofill hint for this field. */
-    autoComplete?: string;
-};
-/**
- * One field of the caller's form, and the control it draws.
- *
- * **A union and not one type with an optional `options`, and that is the shape of
- * the whole argument in this Block.** A contact form's fields are the caller's
- * declaration, not this package's opinion about what a reader may be asked, and
- * the one place that shows is the select: a select with no options is a control
- * with nothing in it, which is a question no reader can answer, so `options` is
- * required inside the select arm and forbidden beside the other four. A
- * `options?: string[]` on one type would typecheck the defect and only the
- * diagnostic at run time would catch it, which is one gate too late. The union is
- * the same mechanism `HeroAction` uses for the same reason: the shape that
- * requires something declares it, and the shape that forbids it says so in the
- * type rather than in prose.
- *
- * The cost of the union is that a caller who wants to build a field list
- * generically, from data, has to narrow before it can type the result, and the
- * answer to that is a narrowing function in the caller's own code rather than a
- * looser type here.
- */
-export type ContactField = (ContactFieldBase & {
-    type: 'select';
-    /** The choices, in the order the reader should meet them. */
-    options: Contact01Option[];
-}) | (ContactFieldBase & {
-    type: 'text' | 'email' | 'tel' | 'textarea';
-    /** A select with no options is a question nobody can answer, so it is not one here. */
-    options?: never;
-});
 /**
  * Where a reader can reach a person, and the one address this Block links.
  *
@@ -155,7 +95,7 @@ export type Contact01Props = {
      */
     onSubmit: (value: ContactValue) => void;
     /**
-     * The fields, in the order the reader should meet them.
+     * The fields, grouped and ordered, as the shared field specification.
      *
      * **Required, and this list is the whole design rather than a convenience.** A
      * contact form Component with a fixed set of fields is a Component that decides
@@ -165,15 +105,23 @@ export type Contact01Props = {
      * be abandoned and retried through a support channel, a form that cannot ask for
      * a company size sends a one-line hello to a sales team that then spends a week
      * on discovery calls, and a form that cannot ask for a budget guarantees the
-     * reply nobody wanted. So Prism names the five control types it can draw and
-     * supplies no fields: a contact desk that asks for a tax number, a preferred
-     * contact window and three product interests is three fields of the caller's own
-     * vocabulary and a select, and Prism composes all of them. The cost is stated
-     * rather than hidden: a consumer that wants a second column for a subset of its
-     * fields composes two `Contact01`s or reaches for a `Page`, because this Block
-     * draws one column in the order the list gives.
+     * reply nobody wanted. The fields arrive as `FieldSpecGroup`, which is the same
+     * type a record write form takes, so the vocabulary a consumer learns on one
+     * screen is the vocabulary here, and a control this package does not ship is the
+     * `slot` arm rather than a second Block. The cost is stated rather than hidden: a
+     * consumer that wants a second column for a subset of its fields composes two
+     * `Contact01`s or reaches for a `Page`, because this Block draws one column in
+     * the order the list gives.
+     */
+    groups: readonly FieldSpecGroup[];
+    /**
+     * The issues to draw, keyed by field. Drawn under the control that owns them.
+     *
+     * An entry names a field's `key` and a message in the product's own words, and
+     * a control's issue is drawn under that control. A message about the submission
+     * rather than about a control is the caller's `status`, which names no field.
      */
-    fields: ContactField[];
+    issues?: readonly Contact01Issue[];
     /** The label on the one control that submits. */
     submitLabel: string;
     /**
@@ -314,6 +262,6 @@ export type Contact01Props = {
  * nothing. The rest of the rendering is a section and five controls, which is the
  * price of the argument above and not a claim about what else this Block might do.
  */
-export declare function Contact01({ eyebrow, title, description, onSubmit, fields, submitLabel, consent, address, variant, status, headingLevel, className, }: Contact01Props): import("react").JSX.Element;
+export declare function Contact01({ eyebrow, title, description, onSubmit, groups, issues, submitLabel, consent, address, variant, status, headingLevel, className, }: Contact01Props): import("react").JSX.Element;
 export default Contact01;
 //# sourceMappingURL=contact.d.ts.map

package/dist/blocks/contact-01/contact.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"contact.d.ts","sourceRoot":"","sources":["../../../src/blocks/contact-01/contact.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"contact.d.ts","sourceRoot":"","sources":["../../../src/blocks/contact-01/contact.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAa,SAAS,EAAE,MAAM,OAAO,CAAA;AAQjD,OAAO,EAA2B,KAAK,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAUxF,OAAO,KAAK,EAAwB,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAG1E;;;;;;;;GAQG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAA;IACb,+CAA+C;IAC/C,OAAO,EAAE,MAAM,CAAA;CAChB,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,yEAAyE;IACzE,KAAK,EAAE,MAAM,EAAE,CAAA;IACf;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,GAAG,CACA;IACE,6CAA6C;IAC7C,KAAK,EAAE,MAAM,CAAA;IACb,2DAA2D;IAC3D,UAAU,EAAE,MAAM,CAAA;CACnB,GACD;IACE,6CAA6C;IAC7C,KAAK,CAAC,EAAE,KAAK,CAAA;IACb,UAAU,CAAC,EAAE,KAAK,CAAA;CACnB,CACJ,CAAA;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAEjD;;;;;;;;GAQG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B,kFAAkF;IAClF,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAA;IAC5C,4DAA4D;IAC5D,OAAO,EAAE,SAAS,CAAA;CACnB,CAAA;AAED,8EAA8E;AAC9E,MAAM,MAAM,cAAc,GAAG;IAC3B,uEAAuE;IACvE,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,iFAAiF;IACjF,KAAK,EAAE,SAAS,CAAA;IAChB,kFAAkF;IAClF,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB;;;;;;;;;OASG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAA;IACvC;;;;;;;;;;;;;;;;;;OAkBG;IACH,MAAM,EAAE,SAAS,cAAc,EAAE,CAAA;IACjC;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,SAAS,cAAc,EAAE,CAAA;IAClC,iDAAiD;IACjD,WAAW,EAAE,MAAM,CAAA;IACnB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,oFAAoF;IACpF,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,eAAe,CAAA;IACxB,iEAAiE;IACjE,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B,mFAAmF;IACnF,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAkED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmGG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,MAAM,EACN,WAAW,EACX,OAAO,EACP,OAAO,EACP,OAAiB,EACjB,MAAM,EACN,YAAmB,EACnB,SAAS,GACV,EAAE,cAAc,+BAiOhB;AAED,eAAe,SAAS,CAAA"}