@hideyukimori/nene2-ui 0.3.0 → 0.6.0

package/README.md

@@ -191,8 +191,22 @@ A slot can hold several steps — four-sided padding is just CSS:
 🔴 **There is no shorthand for this, on purpose.** The kit's tokens are written by tooling,
 not typed by hand, so brevity buys nothing — and a shorthand would need an expander, which is
 one more layer that can quietly drop meaning. Plain `var()` composition has no such layer, and
-it can be checked with a regular expression exactly as written: **every value in a slot is a
-`var(--spacing-*)` or `var(--radius-*)`, and nothing else.**
+it can be checked with a regular expression exactly as written.
+
+### What the rule covers
+
+| namespace                             | slot values                  | why                                                                                                                                                                                   |
+| ------------------------------------- | ---------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `--spacing-*` `--radius-*` `--text-*` | 🔒 **scale references only** | each has a scale, so a literal here is a step the product invented                                                                                                                    |
+| `--color-*`                           | scale (palette) references   | same                                                                                                                                                                                  |
+| `--brightness-*` `--opacity-*`        | literals are fine            | **there is no scale to reference.** A hover darkening of 95% is not a step in a series; inventing a "brightness scale" so the rule could cover it would be a scale with one real user |
+
+🔴 **Check the three namespaces that have scales, not every slot.** Until 0.6.0 this section
+said "and nothing else", while the kit's own theme held `--text-x-slot-field-label-size:
+0.75rem` and `--brightness-x-slot-hover: 95%` — so a product implementing the rule as written
+built a check that failed the kit (nene-vault did exactly that, 2026-08-23). The type scale
+now exists and the text slots reference it; brightness is stated as the exception it always
+was.
 
 That check is what keeps the scale from leaking. `--spacing-x-slot-field-gap: 0.5625rem`
 compiles, looks reasonable, and reintroduces the drift the scale exists to stop — so it fails

package/dist/data/DetailList.d.ts

@@ -5,10 +5,12 @@ export interface DetailRow {
     value: ReactNode;
 }
 export interface DetailListProps {
+    /** Composed after the kit's own classes (design principle 2). */
+    className?: string;
     rows: DetailRow[];
 }
 /**
  * Read-only key/value display for detail screens. Uses a description list so the
  * label/value relationship is conveyed to assistive technology.
  */
-export declare function DetailList({ rows }: DetailListProps): import("react").JSX.Element;
+export declare function DetailList({ rows, className }: DetailListProps): import("react").JSX.Element;

package/dist/data/DetailList.js

@@ -1,9 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cx } from '../lib/cx.js';
 /**
  * Read-only key/value display for detail screens. Uses a description list so the
  * label/value relationship is conveyed to assistive technology.
  */
-export function DetailList({ rows }) {
-    return (_jsx("dl", { className: "flex flex-col gap-x-slot-detail-gap", children: rows.map((row) => (_jsxs("div", { className: "flex flex-col gap-x-slot-detail-row-gap border-b border-border py-x-slot-detail-row-pad-y", children: [_jsx("dt", { className: "font-sans font-medium text-text-muted", children: row.label }), _jsx("dd", { className: "font-sans text-text-primary", children: row.value })] }, row.label))) }));
+export function DetailList({ rows, className }) {
+    return (_jsx("dl", { className: cx('flex flex-col gap-x-slot-detail-gap', className), children: rows.map((row) => (_jsxs("div", { className: "flex flex-col gap-x-slot-detail-row-gap border-b border-border py-x-slot-detail-row-pad-y", children: [_jsx("dt", { className: "font-sans font-medium text-text-muted", children: row.label }), _jsx("dd", { className: "font-sans text-text-primary", children: row.value })] }, row.label))) }));
 }
 //# sourceMappingURL=DetailList.js.map

package/dist/data/DetailList.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailList.js","sourceRoot":"","sources":["../../src/data/DetailList.tsx"],"names":[],"mappings":";AAYA;;;GAGG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,IAAI,EAAmB;IAClD,OAAO,CACL,aAAI,SAAS,EAAC,qCAAqC,YAChD,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACjB,eAEE,SAAS,EAAC,2FAA2F,aAErG,aAAI,SAAS,EAAC,uCAAuC,YAAE,GAAG,CAAC,KAAK,GAAM,EACtE,aAAI,SAAS,EAAC,6BAA6B,YAAE,GAAG,CAAC,KAAK,GAAM,KAJvD,GAAG,CAAC,KAAK,CAKV,CACP,CAAC,GACC,CACN,CAAC;AACJ,CAAC"}
+{"version":3,"file":"DetailList.js","sourceRoot":"","sources":["../../src/data/DetailList.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAclC;;;GAGG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAmB;IAC7D,OAAO,CACL,aAAI,SAAS,EAAE,EAAE,CAAC,qCAAqC,EAAE,SAAS,CAAC,YAChE,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACjB,eAEE,SAAS,EAAC,2FAA2F,aAErG,aAAI,SAAS,EAAC,uCAAuC,YAAE,GAAG,CAAC,KAAK,GAAM,EACtE,aAAI,SAAS,EAAC,6BAA6B,YAAE,GAAG,CAAC,KAAK,GAAM,KAJvD,GAAG,CAAC,KAAK,CAKV,CACP,CAAC,GACC,CACN,CAAC;AACJ,CAAC"}

package/dist/data/Pagination.d.ts

@@ -1,26 +1,57 @@
-export interface PaginationProps {
-    /** 1-based. */
-    page: number;
-    pageCount: number;
-    onPageChange: (page: number) => void;
+interface PaginationBase {
     /** Localized name for the navigation region, e.g. "Invoice pages". */
     label: string;
     previousLabel: string;
     nextLabel: string;
-    /** Localized current position, e.g. "Page 2 of 9". The kit ships no strings. */
+    /**
+     * Localized statement of where the reader is: "Page 2 of 9", or "Showing 21–40 of 384".
+     *
+     * 🔴 Composed by the caller, and it has to be. Across nene-vault's three paginated screens
+     * the sentence is a *range of items*, not a page number — and a range cannot be recovered
+     * from `page` and `pageCount` once the last page is short (measured 2026-08-23). A
+     * component that only knew about pages could not produce the sentence the product needs.
+     */
     status: string;
 }
+interface PagePagination extends PaginationBase {
+    /** 1-based. */
+    page: number;
+    pageCount: number;
+    onPageChange: (page: number) => void;
+    canPrev?: never;
+    canNext?: never;
+    onPrev?: never;
+    onNext?: never;
+}
+interface OffsetPagination extends PaginationBase {
+    canPrev: boolean;
+    canNext: boolean;
+    onPrev: () => void;
+    onNext: () => void;
+    page?: never;
+    pageCount?: never;
+    onPageChange?: never;
+}
+export type PaginationProps = PagePagination | OffsetPagination;
 /**
  * Page-by-page navigation for a list.
  *
+ * 🔴 Two models, because products keep the position in two different ways. All three of
+ * nene-vault's paginated screens hold an **offset**, and none of them holds a page number
+ * (measured 2026-08-23). Converting offset to a page is arithmetic; converting the sentence
+ * "21–40 of 384" back out of a page number is not. So the component takes whichever the
+ * caller already has, rather than making two thirds of the fleet keep a second copy of its
+ * own position.
+ *
+ * A finite choice between two arrangements, which is structure — not a design value that a
+ * caller could invent (design principle 3).
+ *
  * 🔴 The current position is text, and the region is a named `<nav>`. Four ships wrote this
- * component and the recurring shape marks the current page by colour alone — which is
- * invisible to a screen reader and to anyone who cannot distinguish the two shades. The
- * `status` string is required for the same reason: "you are here" has to be readable, not
- * merely visible.
+ * component and the recurring shape marks the current page by colour alone — invisible to a
+ * screen reader and to anyone who cannot distinguish the two shades.
  *
  * The ends are disabled rather than hidden. A control that disappears at the boundary makes
- * the row of controls jump, and moves the next-page button under the cursor that just
- * clicked it.
+ * the row jump, and moves the next-page button under the cursor that just clicked it.
  */
-export declare function Pagination({ page, pageCount, onPageChange, label, previousLabel, nextLabel, status, }: PaginationProps): import("react").JSX.Element;
+export declare function Pagination(props: PaginationProps): import("react").JSX.Element;
+export {};

package/dist/data/Pagination.js

@@ -4,17 +4,29 @@ import { Stack } from '../layout/Stack.js';
 /**
  * Page-by-page navigation for a list.
  *
+ * 🔴 Two models, because products keep the position in two different ways. All three of
+ * nene-vault's paginated screens hold an **offset**, and none of them holds a page number
+ * (measured 2026-08-23). Converting offset to a page is arithmetic; converting the sentence
+ * "21–40 of 384" back out of a page number is not. So the component takes whichever the
+ * caller already has, rather than making two thirds of the fleet keep a second copy of its
+ * own position.
+ *
+ * A finite choice between two arrangements, which is structure — not a design value that a
+ * caller could invent (design principle 3).
+ *
  * 🔴 The current position is text, and the region is a named `<nav>`. Four ships wrote this
- * component and the recurring shape marks the current page by colour alone — which is
- * invisible to a screen reader and to anyone who cannot distinguish the two shades. The
- * `status` string is required for the same reason: "you are here" has to be readable, not
- * merely visible.
+ * component and the recurring shape marks the current page by colour alone — invisible to a
+ * screen reader and to anyone who cannot distinguish the two shades.
  *
  * The ends are disabled rather than hidden. A control that disappears at the boundary makes
- * the row of controls jump, and moves the next-page button under the cursor that just
- * clicked it.
+ * the row jump, and moves the next-page button under the cursor that just clicked it.
  */
-export function Pagination({ page, pageCount, onPageChange, label, previousLabel, nextLabel, status, }) {
-    return (_jsx("nav", { "aria-label": label, children: _jsxs(Stack, { direction: "horizontal", gap: "2xs", align: "center", children: [_jsx(Button, { variant: "secondary", disabled: page <= 1, onClick: () => onPageChange(page - 1), "aria-label": previousLabel, children: previousLabel }), _jsx("span", { "aria-current": "page", className: "font-sans text-text-muted", children: status }), _jsx(Button, { variant: "secondary", disabled: page >= pageCount, onClick: () => onPageChange(page + 1), "aria-label": nextLabel, children: nextLabel })] }) }));
+export function Pagination(props) {
+    const { label, previousLabel, nextLabel, status } = props;
+    const atStart = props.page === undefined ? !props.canPrev : props.page <= 1;
+    const atEnd = props.page === undefined ? !props.canNext : props.page >= props.pageCount;
+    const goPrev = () => props.page === undefined ? props.onPrev() : props.onPageChange(props.page - 1);
+    const goNext = () => props.page === undefined ? props.onNext() : props.onPageChange(props.page + 1);
+    return (_jsx("nav", { "aria-label": label, children: _jsxs(Stack, { direction: "horizontal", gap: "2xs", align: "center", children: [_jsx(Button, { variant: "secondary", disabled: atStart, onClick: goPrev, "aria-label": previousLabel, children: previousLabel }), _jsx("span", { "aria-current": "page", className: "font-sans text-text-muted", children: status }), _jsx(Button, { variant: "secondary", disabled: atEnd, onClick: goNext, "aria-label": nextLabel, children: nextLabel })] }) }));
 }
 //# sourceMappingURL=Pagination.js.map

package/dist/data/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../src/data/Pagination.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAe3C;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,EACJ,SAAS,EACT,YAAY,EACZ,KAAK,EACL,aAAa,EACb,SAAS,EACT,MAAM,GACU;IAChB,OAAO,CACL,4BAAiB,KAAK,YACpB,MAAC,KAAK,IAAC,SAAS,EAAC,YAAY,EAAC,GAAG,EAAC,KAAK,EAAC,KAAK,EAAC,QAAQ,aACpD,KAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,IAAI,CAAC,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,GAAG,CAAC,CAAC,gBACzB,aAAa,YAExB,aAAa,GACP,EACT,+BAAmB,MAAM,EAAC,SAAS,EAAC,2BAA2B,YAC5D,MAAM,GACF,EACP,KAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,IAAI,IAAI,SAAS,EAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,GAAG,CAAC,CAAC,gBACzB,SAAS,YAEpB,SAAS,GACH,IACH,GACJ,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../src/data/Pagination.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAyC3C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,UAAU,UAAU,CAAC,KAAsB;IAC/C,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE1D,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,CAAC;IAC5E,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,SAAS,CAAC;IAExF,MAAM,MAAM,GAAG,GAAG,EAAE,CAClB,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;IACjF,MAAM,MAAM,GAAG,GAAG,EAAE,CAClB,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;IAEjF,OAAO,CACL,4BAAiB,KAAK,YACpB,MAAC,KAAK,IAAC,SAAS,EAAC,YAAY,EAAC,GAAG,EAAC,KAAK,EAAC,KAAK,EAAC,QAAQ,aACpD,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAc,aAAa,YACtF,aAAa,GACP,EACT,+BAAmB,MAAM,EAAC,SAAS,EAAC,2BAA2B,YAC5D,MAAM,GACF,EACP,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,gBAAc,SAAS,YAChF,SAAS,GACH,IACH,GACJ,CACP,CAAC;AACJ,CAAC"}

package/dist/feedback/InlineAlert.d.ts

@@ -1,12 +1,17 @@
 import type { ReactNode } from 'react';
 export interface InlineAlertProps {
     /** What the message means. `danger` is announced assertively; `info` politely. */
-    tone?: 'info' | 'danger';
+    tone?: 'info' | 'warn' | 'danger';
     children: ReactNode;
 }
 /**
  * A message attached to the thing it is about, rather than to the page.
  *
+ * 🔴 Each tone reads its colours from the theme, so a product can tell "warning" from
+ * "failure" by sight. Until it sets them, `warn` and `danger` share this palette's single
+ * alert hue and only the announced urgency differs — and as nene-vault put it, that
+ * difference reaches someone listening and no one looking.
+ *
  * 🔴 The tone decides the ARIA role, not just the colour. `danger` becomes `role="alert"`,
  * which interrupts a screen reader; `info` becomes `role="status"`, which waits its turn.
  * Six ships wrote this component (three as `InlineAlert`, three as `Alert`) and the choice

package/dist/feedback/InlineAlert.js

@@ -1,12 +1,18 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cx } from '../lib/cx.js';
 const TONE_CLASS = {
-    info: 'bg-surface text-text-primary border-border',
-    danger: 'bg-surface text-danger border-danger',
+    info: 'bg-x-slot-alert-info-bg text-x-slot-alert-info-fg border-x-slot-alert-info-border',
+    warn: 'bg-x-slot-alert-warn-bg text-x-slot-alert-warn-fg border-x-slot-alert-warn-border',
+    danger: 'bg-x-slot-alert-danger-bg text-x-slot-alert-danger-fg border-x-slot-alert-danger-border',
 };
 /**
  * A message attached to the thing it is about, rather than to the page.
  *
+ * 🔴 Each tone reads its colours from the theme, so a product can tell "warning" from
+ * "failure" by sight. Until it sets them, `warn` and `danger` share this palette's single
+ * alert hue and only the announced urgency differs — and as nene-vault put it, that
+ * difference reaches someone listening and no one looking.
+ *
  * 🔴 The tone decides the ARIA role, not just the colour. `danger` becomes `role="alert"`,
  * which interrupts a screen reader; `info` becomes `role="status"`, which waits its turn.
  * Six ships wrote this component (three as `InlineAlert`, three as `Alert`) and the choice

package/dist/feedback/InlineAlert.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineAlert.js","sourceRoot":"","sources":["../../src/feedback/InlineAlert.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC,MAAM,UAAU,GAA0D;IACxE,IAAI,EAAE,4CAA4C;IAClD,MAAM,EAAE,sCAAsC;CAC/C,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,IAAI,GAAG,MAAM,EAAE,QAAQ,EAAoB;IACvE,OAAO,CACL,cACE,IAAI,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,EAC5C,SAAS,EAAE,EAAE,CAAC,0DAA0D,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,YAE1F,QAAQ,GACL,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"InlineAlert.js","sourceRoot":"","sources":["../../src/feedback/InlineAlert.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC,MAAM,UAAU,GAA0D;IACxE,IAAI,EAAE,mFAAmF;IACzF,IAAI,EAAE,mFAAmF;IACzF,MAAM,EAAE,yFAAyF;CAClG,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,IAAI,GAAG,MAAM,EAAE,QAAQ,EAAoB;IACvE,OAAO,CACL,cACE,IAAI,EAAE,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,EAC5C,SAAS,EAAE,EAAE,CAAC,0DAA0D,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,YAE1F,QAAQ,GACL,CACP,CAAC;AACJ,CAAC"}

package/dist/feedback/ToastProvider.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { cx } from '../lib/cx.js';
-import { CONTROL_CLASS } from '../lib/states.js';
+import { CLICKABLE_CLASS } from '../lib/states.js';
 import { ToastContext } from './toast-context.js';
 const TONE_CLASS = {
     info: 'bg-surface-raised text-text-primary border-border',
@@ -50,7 +50,7 @@ export function ToastProvider({ regionLabel, dismissLabel, defaultDurationMs = 5
     const api = useMemo(() => ({ show, dismiss }), [show, dismiss]);
     const region = (tone, live) => (_jsx("div", { "aria-live": live, "aria-label": regionLabel, role: "region", className: "flex flex-col gap-x-slot-toast-gap", children: toasts
             .filter((toast) => toast.tone === tone)
-            .map((toast) => (_jsxs("div", { className: cx('flex items-start gap-x-slot-toast-gap rounded-x-slot-toast border p-x-slot-toast-pad font-sans shadow-sm', TONE_CLASS[toast.tone]), children: [_jsx("span", { children: toast.message }), _jsx("button", { type: "button", "aria-label": dismissLabel, onClick: () => dismiss(toast.id), className: cx('rounded-x-slot-toast px-x-slot-toast-dismiss-pad-x', CONTROL_CLASS), children: dismissLabel })] }, toast.id))) }));
+            .map((toast) => (_jsxs("div", { className: cx('flex items-start gap-x-slot-toast-gap rounded-x-slot-toast border p-x-slot-toast-pad font-sans shadow-sm', TONE_CLASS[toast.tone]), children: [_jsx("span", { children: toast.message }), _jsx("button", { type: "button", "aria-label": dismissLabel, onClick: () => dismiss(toast.id), className: cx('rounded-x-slot-toast px-x-slot-toast-dismiss-pad-x', CLICKABLE_CLASS), children: dismissLabel })] }, toast.id))) }));
     return (_jsxs(ToastContext.Provider, { value: api, children: [children, region('info', 'polite'), region('danger', 'assertive')] }));
 }
 //# sourceMappingURL=ToastProvider.js.map

package/dist/feedback/ToastProvider.js.map

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

package/dist/forms/FormField.js

@@ -20,6 +20,6 @@ export function FormField({ id, label, error = null, hint, labelAdornment, requi
     const errorId = error === null ? null : `${id}-error`;
     const hintId = hint === undefined || hint === null ? null : `${id}-hint`;
     const value = useMemo(() => ({ id, errorId, hintId, required }), [id, errorId, hintId, required]);
-    return (_jsx(FieldContext.Provider, { value: value, children: _jsxs("div", { className: "flex flex-col gap-x-slot-field-gap", children: [_jsxs("label", { htmlFor: id, className: "font-sans font-x-slot-field-label text-x-slot-field-label-size text-x-slot-field-label", children: [label, required && requiredMarker !== undefined && requiredMarker !== null ? (_jsx("span", { className: "text-danger", children: requiredMarker })) : null, labelAdornment] }), children, hintId === null ? null : (_jsx("span", { id: hintId, className: "font-sans text-text-muted", children: hint })), errorId === null ? null : (_jsx("p", { id: errorId, role: "alert", className: "font-sans text-danger", children: error }))] }) }));
+    return (_jsx(FieldContext.Provider, { value: value, children: _jsxs("div", { className: "flex flex-col gap-x-slot-field-gap", children: [_jsxs("label", { htmlFor: id, className: "font-sans font-x-slot-field-label text-x-slot-field-label-size text-x-slot-field-label", children: [label, required && requiredMarker !== undefined && requiredMarker !== null ? (_jsx("span", { className: "text-danger", children: requiredMarker })) : null, labelAdornment] }), children, hintId === null ? null : (_jsx("span", { id: hintId, className: "font-sans text-x-slot-field-hint-size text-x-slot-field-hint", children: hint })), errorId === null ? null : (_jsx("p", { id: errorId, role: "alert", className: "font-sans text-x-slot-field-error-size text-x-slot-field-error", children: error }))] }) }));
 }
 //# sourceMappingURL=FormField.js.map

package/dist/forms/FormField.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../src/forms/FormField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAkB,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAiClD;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,KAAK,GAAG,IAAI,EACZ,IAAI,EACJ,cAAc,EACd,QAAQ,GAAG,KAAK,EAChB,cAAc,EACd,QAAQ,GACO;IACf,MAAM,OAAO,GAAG,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC;IACtD,MAAM,MAAM,GAAG,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC;IACzE,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC;IAElG,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YACjC,eAAK,SAAS,EAAC,oCAAoC,aACjD,iBACE,OAAO,EAAE,EAAE,EACX,SAAS,EAAC,wFAAwF,aAEjG,KAAK,EACL,QAAQ,IAAI,cAAc,KAAK,SAAS,IAAI,cAAc,KAAK,IAAI,CAAC,CAAC,CAAC,CACrE,eAAM,SAAS,EAAC,aAAa,YAAE,cAAc,GAAQ,CACtD,CAAC,CAAC,CAAC,IAAI,EACP,cAAc,IACT,EACP,QAAQ,EACR,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACxB,eAAM,EAAE,EAAE,MAAM,EAAE,SAAS,EAAC,2BAA2B,YACpD,IAAI,GACA,CACR,EACA,OAAO,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACzB,YAAG,EAAE,EAAE,OAAO,EAAE,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,uBAAuB,YAC3D,KAAK,GACJ,CACL,IACG,GACgB,CACzB,CAAC;AACJ,CAAC"}
+{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../src/forms/FormField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAkB,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAiClD;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,KAAK,GAAG,IAAI,EACZ,IAAI,EACJ,cAAc,EACd,QAAQ,GAAG,KAAK,EAChB,cAAc,EACd,QAAQ,GACO;IACf,MAAM,OAAO,GAAG,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC;IACtD,MAAM,MAAM,GAAG,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC;IACzE,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC;IAElG,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YACjC,eAAK,SAAS,EAAC,oCAAoC,aACjD,iBACE,OAAO,EAAE,EAAE,EACX,SAAS,EAAC,wFAAwF,aAEjG,KAAK,EACL,QAAQ,IAAI,cAAc,KAAK,SAAS,IAAI,cAAc,KAAK,IAAI,CAAC,CAAC,CAAC,CACrE,eAAM,SAAS,EAAC,aAAa,YAAE,cAAc,GAAQ,CACtD,CAAC,CAAC,CAAC,IAAI,EACP,cAAc,IACT,EACP,QAAQ,EACR,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACxB,eACE,EAAE,EAAE,MAAM,EACV,SAAS,EAAC,8DAA8D,YAEvE,IAAI,GACA,CACR,EACA,OAAO,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACzB,YACE,EAAE,EAAE,OAAO,EACX,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,gEAAgE,YAEzE,KAAK,GACJ,CACL,IACG,GACgB,CACzB,CAAC;AACJ,CAAC"}

package/dist/index.d.ts

@@ -30,5 +30,5 @@ export { DataTable, type DataTableProps, type DataColumn } from './data/DataTabl
 export { Pagination, type PaginationProps } from './data/Pagination.js';
 export { tokens } from './theme/tokens.js';
 export { cx } from './lib/cx.js';
-export { CONTROL_CLASS, DISABLED_CLASS, FOCUS_CLASS } from './lib/states.js';
+export { CLICKABLE_CLASS, CONTROL_CLASS, DISABLED_CLASS, FOCUS_CLASS, HOVER_CLASS, } from './lib/states.js';
 export { SOURCE_PROBE_CLASS } from './lib/source-probe.js';

package/dist/index.js

@@ -41,7 +41,7 @@ export { tokens } from './theme/tokens.js';
 export { cx } from './lib/cx.js';
 // Controls the kit does not ship yet (Textarea has 7 independent implementations in the
 // fleet) can at least carry the same focus and disabled behaviour instead of inventing it.
-export { CONTROL_CLASS, DISABLED_CLASS, FOCUS_CLASS } from './lib/states.js';
+export { CLICKABLE_CLASS, CONTROL_CLASS, DISABLED_CLASS, FOCUS_CLASS, HOVER_CLASS, } from './lib/states.js';
 // Lets a consumer's build prove the kit is in its Tailwind `@source` (#316).
 export { SOURCE_PROBE_CLASS } from './lib/source-probe.js';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,aAAa;AACb,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,KAAK,EAAmB,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,EAAqB,MAAM,yBAAyB,CAAC;AACrE,OAAO,EAAE,IAAI,EAAkB,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAsB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,IAAI,EAAkB,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAsB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,KAAK,EAAmB,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAElE,SAAS;AACT,OAAO,EAAE,UAAU,EAAwB,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAAE,KAAK,EAAmB,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAkB,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,GAAG,EAAiB,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAqB,MAAM,qBAAqB,CAAC;AACjE,OAAO,EAAE,IAAI,EAAkB,MAAM,kBAAkB,CAAC;AAKxD,QAAQ;AACR,OAAO,EAAE,SAAS,EAAuB,MAAM,sBAAsB,CAAC;AAEtE,sFAAsF;AACtF,sDAAsD;AACtD,OAAO,EAAE,YAAY,EAA0B,MAAM,0BAA0B,CAAC;AAChF,OAAO,EAAE,UAAU,EAAwB,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAwB,MAAM,wBAAwB,CAAC;AAE1E,UAAU;AACV,OAAO,EAAE,KAAK,EAAmB,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAA2B,MAAM,4BAA4B,CAAC;AAEpF,WAAW;AACX,OAAO,EAAE,KAAK,EAAmB,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAyB,MAAM,2BAA2B,CAAC;AAC/E,OAAO,EAAE,aAAa,EAA2B,MAAM,6BAA6B,CAAC;AACrF,OAAO,EACL,QAAQ,GAIT,MAAM,6BAA6B,CAAC;AAErC,OAAO;AACP,OAAO,EAAE,UAAU,EAAwC,MAAM,sBAAsB,CAAC;AACxF,OAAO,EAAE,SAAS,EAAwC,MAAM,qBAAqB,CAAC;AACtF,OAAO,EAAE,UAAU,EAAwB,MAAM,sBAAsB,CAAC;AAExE,QAAQ;AACR,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,gFAAgF;AAChF,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,wFAAwF;AACxF,2FAA2F;AAC3F,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC7E,6EAA6E;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,aAAa;AACb,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,KAAK,EAAmB,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,EAAqB,MAAM,yBAAyB,CAAC;AACrE,OAAO,EAAE,IAAI,EAAkB,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAsB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,IAAI,EAAkB,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAsB,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,KAAK,EAAmB,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAoB,MAAM,wBAAwB,CAAC;AAElE,SAAS;AACT,OAAO,EAAE,UAAU,EAAwB,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAAE,KAAK,EAAmB,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAkB,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,GAAG,EAAiB,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAqB,MAAM,qBAAqB,CAAC;AACjE,OAAO,EAAE,IAAI,EAAkB,MAAM,kBAAkB,CAAC;AAKxD,QAAQ;AACR,OAAO,EAAE,SAAS,EAAuB,MAAM,sBAAsB,CAAC;AAEtE,sFAAsF;AACtF,sDAAsD;AACtD,OAAO,EAAE,YAAY,EAA0B,MAAM,0BAA0B,CAAC;AAChF,OAAO,EAAE,UAAU,EAAwB,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAwB,MAAM,wBAAwB,CAAC;AAE1E,UAAU;AACV,OAAO,EAAE,KAAK,EAAmB,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAA2B,MAAM,4BAA4B,CAAC;AAEpF,WAAW;AACX,OAAO,EAAE,KAAK,EAAmB,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAyB,MAAM,2BAA2B,CAAC;AAC/E,OAAO,EAAE,aAAa,EAA2B,MAAM,6BAA6B,CAAC;AACrF,OAAO,EACL,QAAQ,GAIT,MAAM,6BAA6B,CAAC;AAErC,OAAO;AACP,OAAO,EAAE,UAAU,EAAwC,MAAM,sBAAsB,CAAC;AACxF,OAAO,EAAE,SAAS,EAAwC,MAAM,qBAAqB,CAAC;AACtF,OAAO,EAAE,UAAU,EAAwB,MAAM,sBAAsB,CAAC;AAExE,QAAQ;AACR,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,gFAAgF;AAChF,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,wFAAwF;AACxF,2FAA2F;AAC3F,OAAO,EACL,eAAe,EACf,aAAa,EACb,cAAc,EACd,WAAW,EACX,WAAW,GACZ,MAAM,iBAAiB,CAAC;AACzB,6EAA6E;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/layout/PageHeader.d.ts

@@ -1,7 +1,9 @@
 import type { ReactNode } from 'react';
 export interface PageHeaderProps {
+    /** Composed after the kit's own classes (design principle 2). */
+    className?: string;
     /** Localized page title. */
     title: string;
     actions?: ReactNode;
 }
-export declare function PageHeader({ title, actions }: PageHeaderProps): import("react").JSX.Element;
+export declare function PageHeader({ title, actions, className }: PageHeaderProps): import("react").JSX.Element;

package/dist/layout/PageHeader.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function PageHeader({ title, actions }) {
-    return (_jsxs("header", { className: "flex items-center justify-between py-x-slot-page-header-pad-y", children: [_jsx("h1", { className: "font-sans font-medium text-text-primary", children: title }), actions] }));
+import { cx } from '../lib/cx.js';
+export function PageHeader({ title, actions, className }) {
+    return (_jsxs("header", { className: cx('flex items-center justify-between py-x-slot-page-header-pad-y', className), children: [_jsx("h1", { className: "font-sans font-medium text-text-primary", children: title }), actions] }));
 }
 //# sourceMappingURL=PageHeader.js.map

package/dist/layout/PageHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageHeader.js","sourceRoot":"","sources":["../../src/layout/PageHeader.tsx"],"names":[],"mappings":";AAQA,MAAM,UAAU,UAAU,CAAC,EAAE,KAAK,EAAE,OAAO,EAAmB;IAC5D,OAAO,CACL,kBAAQ,SAAS,EAAC,+DAA+D,aAC/E,aAAI,SAAS,EAAC,yCAAyC,YAAE,KAAK,GAAM,EACnE,OAAO,IACD,CACV,CAAC;AACJ,CAAC"}
+{"version":3,"file":"PageHeader.js","sourceRoot":"","sources":["../../src/layout/PageHeader.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAUlC,MAAM,UAAU,UAAU,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAmB;IACvE,OAAO,CACL,kBACE,SAAS,EAAE,EAAE,CAAC,+DAA+D,EAAE,SAAS,CAAC,aAEzF,aAAI,SAAS,EAAC,yCAAyC,YAAE,KAAK,GAAM,EACnE,OAAO,IACD,CACV,CAAC;AACJ,CAAC"}

package/dist/lib/states.d.ts

@@ -50,5 +50,20 @@ export declare const FOCUS_CLASS = "focus-visible:outline-2 focus-visible:outlin
  * literal here would be a design value living outside themes/default.css.
  */
 export declare const DISABLED_CLASS = "disabled:opacity-x-disabled disabled:cursor-not-allowed";
+/**
+ * Pointer feedback for anything clickable.
+ *
+ * 🔴 The third hole of the same shape. v0.1 shipped with no disabled and no focus styling;
+ * 0.4.0 is where the kit stops shipping without hover and press. The fleet writes them
+ * anyway — measured 2026-08-23 across seven products, though only three of them show up if
+ * you grep for Tailwind classes: nene-invoice, nene-deal, nene-profile and nene-serve
+ * declare theirs in CSS (`background` 55 times, `color` 42, `border-color` 17). Counting one
+ * spelling of a thing that has two is how the first two holes stayed open.
+ *
+ * `disabled:` is excluded on purpose: a disabled control must not react to the pointer.
+ */
+export declare const HOVER_CLASS = "hover:brightness-x-slot-hover active:brightness-x-slot-press disabled:hover:brightness-100 disabled:active:brightness-100";
 /** Controls that can be focused and disabled — every interactive primitive in the kit. */
 export declare const CONTROL_CLASS = "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-primary disabled:opacity-x-disabled disabled:cursor-not-allowed";
+/** Controls that are also clicked: buttons, switches, the toast dismiss. */
+export declare const CLICKABLE_CLASS = "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-primary disabled:opacity-x-disabled disabled:cursor-not-allowed hover:brightness-x-slot-hover active:brightness-x-slot-press disabled:hover:brightness-100 disabled:active:brightness-100";

package/dist/lib/states.js

@@ -50,6 +50,21 @@ export const FOCUS_CLASS = 'focus-visible:outline-2 focus-visible:outline-offset
  * literal here would be a design value living outside themes/default.css.
  */
 export const DISABLED_CLASS = 'disabled:opacity-x-disabled disabled:cursor-not-allowed';
+/**
+ * Pointer feedback for anything clickable.
+ *
+ * 🔴 The third hole of the same shape. v0.1 shipped with no disabled and no focus styling;
+ * 0.4.0 is where the kit stops shipping without hover and press. The fleet writes them
+ * anyway — measured 2026-08-23 across seven products, though only three of them show up if
+ * you grep for Tailwind classes: nene-invoice, nene-deal, nene-profile and nene-serve
+ * declare theirs in CSS (`background` 55 times, `color` 42, `border-color` 17). Counting one
+ * spelling of a thing that has two is how the first two holes stayed open.
+ *
+ * `disabled:` is excluded on purpose: a disabled control must not react to the pointer.
+ */
+export const HOVER_CLASS = 'hover:brightness-x-slot-hover active:brightness-x-slot-press disabled:hover:brightness-100 disabled:active:brightness-100';
 /** Controls that can be focused and disabled — every interactive primitive in the kit. */
 export const CONTROL_CLASS = `${FOCUS_CLASS} ${DISABLED_CLASS}`;
+/** Controls that are also clicked: buttons, switches, the toast dismiss. */
+export const CLICKABLE_CLASS = `${CONTROL_CLASS} ${HOVER_CLASS}`;
 //# sourceMappingURL=states.js.map

package/dist/lib/states.js.map

@@ -1 +1 @@
-{"version":3,"file":"states.js","sourceRoot":"","sources":["../../src/lib/states.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAEH,kFAAkF;AAClF,MAAM,CAAC,MAAM,WAAW,GACtB,2FAA2F,CAAC;AAE9F;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,yDAAyD,CAAC;AAExF,0FAA0F;AAC1F,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,WAAW,IAAI,cAAc,EAAE,CAAC"}
+{"version":3,"file":"states.js","sourceRoot":"","sources":["../../src/lib/states.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAEH,kFAAkF;AAClF,MAAM,CAAC,MAAM,WAAW,GACtB,2FAA2F,CAAC;AAE9F;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,yDAAyD,CAAC;AAExF;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,WAAW,GACtB,2HAA2H,CAAC;AAE9H,0FAA0F;AAC1F,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,WAAW,IAAI,cAAc,EAAE,CAAC;AAEhE,4EAA4E;AAC5E,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,aAAa,IAAI,WAAW,EAAE,CAAC"}

package/dist/primitives/Button.d.ts

@@ -1,6 +1,13 @@
 import type { ButtonHTMLAttributes, ReactNode } from 'react';
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: 'primary' | 'secondary' | 'danger';
+    variant?: 'primary' | 'secondary' | 'danger' | 'ghost';
+    /**
+     * Two sizes, not a length. `sm` for dense rows and toolbars.
+     *
+     * Structure, not a design value: the caller picks one of two arrangements and cannot
+     * write a padding of its own (design principle 3).
+     */
+    size?: 'md' | 'sm';
     children: ReactNode;
 }
-export declare function Button({ variant, children, type, className, ...rest }: ButtonProps): import("react").JSX.Element;
+export declare function Button({ variant, size, children, type, className, ...rest }: ButtonProps): import("react").JSX.Element;

package/dist/primitives/Button.js

@@ -1,13 +1,25 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cx } from '../lib/cx.js';
-import { CONTROL_CLASS } from '../lib/states.js';
+import { CLICKABLE_CLASS } from '../lib/states.js';
 const VARIANT_CLASS = {
     primary: 'bg-accent text-on-accent',
-    secondary: 'bg-surface-raised text-text-primary border border-border',
+    secondary: 'bg-surface-raised text-text-primary border-border',
     danger: 'bg-danger text-on-accent',
+    // No fill and no border: for the third action in a row, where two framed buttons would
+    // compete with each other. nene-vault ships this variant already.
+    ghost: 'bg-transparent text-text-primary',
 };
-const BASE_CLASS = `rounded-x-slot-button px-x-slot-button-pad-x py-x-slot-button-pad-y font-sans font-medium ${CONTROL_CLASS}`;
-export function Button({ variant = 'primary', children, type = 'button', className, ...rest }) {
-    return (_jsx("button", { type: type, className: cx(BASE_CLASS, VARIANT_CLASS[variant], className), ...rest, children: children }));
+const SIZE_CLASS = {
+    md: 'px-x-slot-button-pad-x py-x-slot-button-pad-y',
+    sm: 'px-x-slot-button-sm-pad-x py-x-slot-button-sm-pad-y',
+};
+// 🔴 `border border-transparent` is load-bearing. Height comes from the padding, so the
+// `secondary` variant — the only one with a visible border — would otherwise stand 2px
+// taller than the others. nene-vault puts a primary and a secondary side by side in seven
+// modal footers, where that shows up as a step (measured 2026-08-23); its own Button carries
+// the same transparent border for the same reason.
+const BASE_CLASS = `rounded-x-slot-button border border-transparent font-sans font-medium ${CLICKABLE_CLASS}`;
+export function Button({ variant = 'primary', size = 'md', children, type = 'button', className, ...rest }) {
+    return (_jsx("button", { type: type, className: cx(BASE_CLASS, SIZE_CLASS[size], VARIANT_CLASS[variant], className), ...rest, children: children }));
 }
 //# sourceMappingURL=Button.js.map

package/dist/primitives/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/primitives/Button.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAOjD,MAAM,aAAa,GAAwD;IACzE,OAAO,EAAE,0BAA0B;IACnC,SAAS,EAAE,0DAA0D;IACrE,MAAM,EAAE,0BAA0B;CACnC,CAAC;AAEF,MAAM,UAAU,GAAG,6FAA6F,aAAa,EAAE,CAAC;AAEhI,MAAM,UAAU,MAAM,CAAC,EACrB,OAAO,GAAG,SAAS,EACnB,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,GAAG,IAAI,EACK;IACZ,OAAO,CACL,iBAAQ,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,aAAa,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,KAAM,IAAI,YACvF,QAAQ,GACF,CACV,CAAC;AACJ,CAAC"}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/primitives/Button.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAcnD,MAAM,aAAa,GAAwD;IACzE,OAAO,EAAE,0BAA0B;IACnC,SAAS,EAAE,mDAAmD;IAC9D,MAAM,EAAE,0BAA0B;IAClC,uFAAuF;IACvF,kEAAkE;IAClE,KAAK,EAAE,kCAAkC;CAC1C,CAAC;AAEF,MAAM,UAAU,GAAqD;IACnE,EAAE,EAAE,+CAA+C;IACnD,EAAE,EAAE,qDAAqD;CAC1D,CAAC;AAEF,wFAAwF;AACxF,uFAAuF;AACvF,0FAA0F;AAC1F,6FAA6F;AAC7F,mDAAmD;AACnD,MAAM,UAAU,GAAG,yEAAyE,eAAe,EAAE,CAAC;AAE9G,MAAM,UAAU,MAAM,CAAC,EACrB,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACX,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,GAAG,IAAI,EACK;IACZ,OAAO,CACL,iBACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,KAC1E,IAAI,YAEP,QAAQ,GACF,CACV,CAAC;AACJ,CAAC"}

package/dist/primitives/Checkbox.d.ts

@@ -10,5 +10,12 @@ export interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement
  * `<input>` next to a `<label>` whose `htmlFor` is missing or stale — which loses nothing
  * visible, and loses the ability to click the text to toggle the box, plus the name the
  * control is announced by. Making the label a prop means it cannot be forgotten.
+ *
+ * 🔴 `cursor-pointer` and the gap live here rather than being left to the caller, because
+ * the caller cannot reach them: `className` is forwarded to the `<input>`, and both belong
+ * to the `<label>` that wraps it. nene-vault carries them on the label in its own
+ * implementation (measured 2026-08-23, checking Tailwind classes and CSS both), so a
+ * migration that could not set them would lose the pointer cursor on every choice in the
+ * product — visible to a mouse user, invisible in a diff.
  */
 export declare const Checkbox: import("react").ForwardRefExoticComponent<CheckboxProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/primitives/Checkbox.js

@@ -3,7 +3,7 @@ import { forwardRef } from 'react';
 import { cx } from '../lib/cx.js';
 import { CONTROL_CLASS } from '../lib/states.js';
 import { useFieldWiring } from '../forms/field-context.js';
-const BOX_CLASS = `rounded-x-slot-control border border-border accent-accent ${CONTROL_CLASS}`;
+const BOX_CLASS = `size-x-slot-choice-box shrink-0 rounded-x-slot-control border border-border accent-x-slot-choice-accent ${CONTROL_CLASS}`;
 /**
  * A checkbox and its label, as one part.
  *
@@ -11,9 +11,16 @@ const BOX_CLASS = `rounded-x-slot-control border border-border accent-accent ${C
  * `<input>` next to a `<label>` whose `htmlFor` is missing or stale — which loses nothing
  * visible, and loses the ability to click the text to toggle the box, plus the name the
  * control is announced by. Making the label a prop means it cannot be forgotten.
+ *
+ * 🔴 `cursor-pointer` and the gap live here rather than being left to the caller, because
+ * the caller cannot reach them: `className` is forwarded to the `<input>`, and both belong
+ * to the `<label>` that wraps it. nene-vault carries them on the label in its own
+ * implementation (measured 2026-08-23, checking Tailwind classes and CSS both), so a
+ * migration that could not set them would lose the pointer cursor on every choice in the
+ * product — visible to a mouse user, invisible in a diff.
  */
 export const Checkbox = forwardRef(function Checkbox({ label, className, id, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, 'aria-required': ariaRequired, ...rest }, ref) {
     const wiring = useFieldWiring({ id, ariaInvalid, ariaDescribedBy, ariaRequired });
-    return (_jsxs("label", { className: "inline-flex items-center gap-x-slot-choice-gap font-sans text-text-primary", children: [_jsx("input", { ref: ref, type: "checkbox", className: cx(BOX_CLASS, className), ...wiring, ...rest }), label] }));
+    return (_jsxs("label", { className: "inline-flex cursor-pointer items-center gap-x-slot-choice-gap font-sans text-text-primary", children: [_jsx("input", { ref: ref, type: "checkbox", className: cx(BOX_CLASS, className), ...wiring, ...rest }), label] }));
 });
 //# sourceMappingURL=Checkbox.js.map

package/dist/primitives/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/primitives/Checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA4C,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAO3D,MAAM,SAAS,GAAG,6DAA6D,aAAa,EAAE,CAAC;AAE/F;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAkC,SAAS,QAAQ,CACnF,EACE,KAAK,EACL,SAAS,EACT,EAAE,EACF,cAAc,EAAE,WAAW,EAC3B,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,EAC7B,GAAG,IAAI,EACR,EACD,GAAG;IAEH,MAAM,MAAM,GAAG,cAAc,CAAC,EAAE,EAAE,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,CAAC,CAAC;IAElF,OAAO,CACL,iBAAO,SAAS,EAAC,4EAA4E,aAC3F,gBAAO,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,UAAU,EAAC,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,MAAM,KAAM,IAAI,GAAI,EAC7F,KAAK,IACA,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/primitives/Checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA4C,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAO3D,MAAM,SAAS,GAAG,2GAA2G,aAAa,EAAE,CAAC;AAE7I;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAkC,SAAS,QAAQ,CACnF,EACE,KAAK,EACL,SAAS,EACT,EAAE,EACF,cAAc,EAAE,WAAW,EAC3B,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,EAC7B,GAAG,IAAI,EACR,EACD,GAAG;IAEH,MAAM,MAAM,GAAG,cAAc,CAAC,EAAE,EAAE,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,CAAC,CAAC;IAElF,OAAO,CACL,iBAAO,SAAS,EAAC,2FAA2F,aAC1G,gBAAO,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,UAAU,EAAC,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,MAAM,KAAM,IAAI,GAAI,EAC7F,KAAK,IACA,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/primitives/Radio.d.ts

@@ -12,6 +12,10 @@ export interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
  * its own group of one: it can be checked but never unchecked, and arrow keys do not move
  * between the options. Nothing about the rendered page shows this, so it survives review.
  *
+ * 🔴 `cursor-pointer`, the gap and the box size are the component's, for the same reason as
+ * on `Checkbox`: `className` reaches the `<input>`, and those belong to the `<label>`.
+ * nene-vault's radios share one label style with its checkboxes, so the same hole was here.
+ *
  * 🔴 This does not take the `FormField` wiring. A group of radios shares one label and one
  * error, so the id and `aria-describedby` belong on a `<fieldset>` around the group, not on
  * each option — putting them here would give every option the same id.

package/dist/primitives/Radio.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { cx } from '../lib/cx.js';
 import { CONTROL_CLASS } from '../lib/states.js';
-const DOT_CLASS = `border border-border accent-accent ${CONTROL_CLASS}`;
+const DOT_CLASS = `size-x-slot-choice-box shrink-0 border border-border accent-x-slot-choice-accent ${CONTROL_CLASS}`;
 /**
  * One option in a radio group, with its label.
  *
@@ -10,11 +10,15 @@ const DOT_CLASS = `border border-border accent-accent ${CONTROL_CLASS}`;
  * its own group of one: it can be checked but never unchecked, and arrow keys do not move
  * between the options. Nothing about the rendered page shows this, so it survives review.
  *
+ * 🔴 `cursor-pointer`, the gap and the box size are the component's, for the same reason as
+ * on `Checkbox`: `className` reaches the `<input>`, and those belong to the `<label>`.
+ * nene-vault's radios share one label style with its checkboxes, so the same hole was here.
+ *
  * 🔴 This does not take the `FormField` wiring. A group of radios shares one label and one
  * error, so the id and `aria-describedby` belong on a `<fieldset>` around the group, not on
  * each option — putting them here would give every option the same id.
  */
 export const Radio = forwardRef(function Radio({ label, name, className, ...rest }, ref) {
-    return (_jsxs("label", { className: "inline-flex items-center gap-x-slot-choice-gap font-sans text-text-primary", children: [_jsx("input", { ref: ref, type: "radio", name: name, className: cx(DOT_CLASS, className), ...rest }), label] }));
+    return (_jsxs("label", { className: "inline-flex cursor-pointer items-center gap-x-slot-choice-gap font-sans text-text-primary", children: [_jsx("input", { ref: ref, type: "radio", name: name, className: cx(DOT_CLASS, className), ...rest }), label] }));
 });
 //# sourceMappingURL=Radio.js.map

package/dist/primitives/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../src/primitives/Radio.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA4C,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AASjD,MAAM,SAAS,GAAG,sCAAsC,aAAa,EAAE,CAAC;AAExE;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAA+B,SAAS,KAAK,CAC1E,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EACnC,GAAG;IAEH,OAAO,CACL,iBAAO,SAAS,EAAC,4EAA4E,aAC3F,gBAAO,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,IAAI,GAAI,EAC1F,KAAK,IACA,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../src/primitives/Radio.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA4C,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AASjD,MAAM,SAAS,GAAG,oFAAoF,aAAa,EAAE,CAAC;AAEtH;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAA+B,SAAS,KAAK,CAC1E,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EACnC,GAAG;IAEH,OAAO,CACL,iBAAO,SAAS,EAAC,2FAA2F,aAC1G,gBAAO,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,IAAI,GAAI,EAC1F,KAAK,IACA,CACT,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/primitives/Spinner.d.ts

@@ -1,5 +1,7 @@
 export interface SpinnerProps {
+    /** Composed after the kit's own classes (design principle 2). */
+    className?: string;
     /** Localized loading text. The kit never ships strings — see README. */
     label: string;
 }
-export declare function Spinner({ label }: SpinnerProps): import("react").JSX.Element;
+export declare function Spinner({ label, className }: SpinnerProps): import("react").JSX.Element;

package/dist/primitives/Spinner.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-export function Spinner({ label }) {
-    return (_jsx("output", { className: "font-sans text-text-muted", "aria-live": "polite", children: label }));
+import { cx } from '../lib/cx.js';
+export function Spinner({ label, className }) {
+    return (_jsx("output", { className: cx('font-sans text-text-muted', className), "aria-live": "polite", children: label }));
 }
 //# sourceMappingURL=Spinner.js.map

package/dist/primitives/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../src/primitives/Spinner.tsx"],"names":[],"mappings":";AAKA,MAAM,UAAU,OAAO,CAAC,EAAE,KAAK,EAAgB;IAC7C,OAAO,CACL,iBAAQ,SAAS,EAAC,2BAA2B,eAAW,QAAQ,YAC7D,KAAK,GACC,CACV,CAAC;AACJ,CAAC"}
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../src/primitives/Spinner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC,MAAM,UAAU,OAAO,CAAC,EAAE,KAAK,EAAE,SAAS,EAAgB;IACxD,OAAO,CACL,iBAAQ,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE,SAAS,CAAC,eAAY,QAAQ,YAC9E,KAAK,GACC,CACV,CAAC;AACJ,CAAC"}

package/dist/primitives/Switch.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { cx } from '../lib/cx.js';
-import { CONTROL_CLASS } from '../lib/states.js';
+import { CLICKABLE_CLASS } from '../lib/states.js';
 /**
  * An on/off control that takes effect immediately.
  *
@@ -14,6 +14,6 @@ import { CONTROL_CLASS } from '../lib/states.js';
  * `aria-checked` carries the state; the visible track is decoration on top of it.
  */
 export const Switch = forwardRef(function Switch({ checked, onCheckedChange, label, className, ...rest }, ref) {
-    return (_jsx("button", { ref: ref, type: "button", role: "switch", "aria-checked": checked, "aria-label": label, onClick: () => onCheckedChange(!checked), className: cx('inline-flex items-center rounded-x-slot-switch border border-border px-x-slot-switch-pad-x py-x-slot-switch-pad-y font-sans', checked ? 'bg-accent text-on-accent' : 'bg-surface text-text-muted', CONTROL_CLASS, className), ...rest, children: label }));
+    return (_jsx("button", { ref: ref, type: "button", role: "switch", "aria-checked": checked, "aria-label": label, onClick: () => onCheckedChange(!checked), className: cx('inline-flex items-center rounded-x-slot-switch border border-border px-x-slot-switch-pad-x py-x-slot-switch-pad-y font-sans', checked ? 'bg-accent text-on-accent' : 'bg-surface text-text-muted', CLICKABLE_CLASS, className), ...rest, children: label }));
 });
 //# sourceMappingURL=Switch.js.map

package/dist/primitives/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../src/primitives/Switch.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA6B,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAUjD;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAiC,SAAS,MAAM,CAC9E,EAAE,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EACvD,GAAG;IAEH,OAAO,CACL,iBACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,kBACC,OAAO,gBACT,KAAK,EACjB,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxC,SAAS,EAAE,EAAE,CACX,6HAA6H,EAC7H,OAAO,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,4BAA4B,EACnE,aAAa,EACb,SAAS,CACV,KACG,IAAI,YAEP,KAAK,GACC,CACV,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../src/primitives/Switch.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA6B,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAUnD;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAiC,SAAS,MAAM,CAC9E,EAAE,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EACvD,GAAG;IAEH,OAAO,CACL,iBACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,kBACC,OAAO,gBACT,KAAK,EACjB,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,EACxC,SAAS,EAAE,EAAE,CACX,6HAA6H,EAC7H,OAAO,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,4BAA4B,EACnE,eAAe,EACf,SAAS,CACV,KACG,IAAI,YAEP,KAAK,GACC,CACV,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/primitives/Text.d.ts

@@ -1,7 +1,9 @@
 import type { ReactNode } from 'react';
 export interface TextProps {
+    /** Composed after the kit's own classes (design principle 2). */
+    className?: string;
     as?: 'p' | 'span';
     tone?: 'primary' | 'muted';
     children: ReactNode;
 }
-export declare function Text({ as, tone, children }: TextProps): import("react").JSX.Element;
+export declare function Text({ as, tone, children, className }: TextProps): import("react").JSX.Element;

package/dist/primitives/Text.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-export function Text({ as = 'p', tone = 'primary', children }) {
-    const className = `font-sans ${tone === 'muted' ? 'text-text-muted' : 'text-text-primary'}`;
-    return as === 'span' ? (_jsx("span", { className: className, children: children })) : (_jsx("p", { className: className, children: children }));
+import { cx } from '../lib/cx.js';
+export function Text({ as = 'p', tone = 'primary', children, className }) {
+    const merged = cx('font-sans', tone === 'muted' ? 'text-text-muted' : 'text-text-primary', className);
+    return as === 'span' ? (_jsx("span", { className: merged, children: children })) : (_jsx("p", { className: merged, children: children }));
 }
 //# sourceMappingURL=Text.js.map

package/dist/primitives/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/primitives/Text.tsx"],"names":[],"mappings":";AAQA,MAAM,UAAU,IAAI,CAAC,EAAE,EAAE,GAAG,GAAG,EAAE,IAAI,GAAG,SAAS,EAAE,QAAQ,EAAa;IACtE,MAAM,SAAS,GAAG,aAAa,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,mBAAmB,EAAE,CAAC;IAE5F,OAAO,EAAE,KAAK,MAAM,CAAC,CAAC,CAAC,CACrB,eAAM,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAQ,CAC9C,CAAC,CAAC,CAAC,CACF,YAAG,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAK,CACxC,CAAC;AACJ,CAAC"}
+{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/primitives/Text.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAUlC,MAAM,UAAU,IAAI,CAAC,EAAE,EAAE,GAAG,GAAG,EAAE,IAAI,GAAG,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAa;IACjF,MAAM,MAAM,GAAG,EAAE,CACf,WAAW,EACX,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,mBAAmB,EAC1D,SAAS,CACV,CAAC;IAEF,OAAO,EAAE,KAAK,MAAM,CAAC,CAAC,CAAC,CACrB,eAAM,SAAS,EAAE,MAAM,YAAG,QAAQ,GAAQ,CAC3C,CAAC,CAAC,CAAC,CACF,YAAG,SAAS,EAAE,MAAM,YAAG,QAAQ,GAAK,CACrC,CAAC;AACJ,CAAC"}

package/dist/states/EmptyState.d.ts

@@ -1,5 +1,15 @@
 export interface EmptyStateProps {
+    /** Composed after the kit's own classes (design principle 2). */
+    className?: string;
+    /**
+     * Horizontal alignment. Centre by default — measured across the fleet on 2026-08-23,
+     * five of the six products that ship an EmptyState centre it.
+     *
+     * A choice between two arrangements, not a value: `align="start"` is structure, and
+     * design principle 3 bars design *values* from props, not structural options.
+     */
+    align?: 'center' | 'start';
     /** Localized message. The kit never ships strings — see README. */
     message: string;
 }
-export declare function EmptyState({ message }: EmptyStateProps): import("react").JSX.Element;
+export declare function EmptyState({ message, align, className }: EmptyStateProps): import("react").JSX.Element;

package/dist/states/EmptyState.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-export function EmptyState({ message }) {
-    return (_jsx("div", { className: "py-x-slot-state-pad-y font-sans text-text-muted", role: "status", children: message }));
+import { cx } from '../lib/cx.js';
+export function EmptyState({ message, align = 'center', className }) {
+    return (_jsx("div", { className: cx('py-x-slot-state-pad-y font-sans text-text-muted', align === 'center' && 'text-center', className), role: "status", children: message }));
 }
 //# sourceMappingURL=EmptyState.js.map

package/dist/states/EmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../src/states/EmptyState.tsx"],"names":[],"mappings":";AAKA,MAAM,UAAU,UAAU,CAAC,EAAE,OAAO,EAAmB;IACrD,OAAO,CACL,cAAK,SAAS,EAAC,iDAAiD,EAAC,IAAI,EAAC,QAAQ,YAC3E,OAAO,GACJ,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"EmptyState.js","sourceRoot":"","sources":["../../src/states/EmptyState.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAgBlC,MAAM,UAAU,UAAU,CAAC,EAAE,OAAO,EAAE,KAAK,GAAG,QAAQ,EAAE,SAAS,EAAmB;IAClF,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CACX,iDAAiD,EACjD,KAAK,KAAK,QAAQ,IAAI,aAAa,EACnC,SAAS,CACV,EACD,IAAI,EAAC,QAAQ,YAEZ,OAAO,GACJ,CACP,CAAC;AACJ,CAAC"}

package/dist/states/ErrorState.d.ts

@@ -1,8 +1,10 @@
 export interface ErrorStateProps {
+    /** Composed after the kit's own classes (design principle 2). */
+    className?: string;
     /** Localized message. */
     message: string;
     /** Localized label for the retry control. */
     retryLabel: string;
     onRetry: () => void;
 }
-export declare function ErrorState({ message, retryLabel, onRetry }: ErrorStateProps): import("react").JSX.Element;
+export declare function ErrorState({ message, retryLabel, onRetry, className }: ErrorStateProps): import("react").JSX.Element;

package/dist/states/ErrorState.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from '../primitives/Button.js';
-export function ErrorState({ message, retryLabel, onRetry }) {
-    return (_jsxs("div", { className: "py-x-slot-state-pad-y", role: "alert", children: [_jsx("p", { className: "font-sans text-danger", children: message }), _jsx("div", { className: "py-x-slot-state-action-pad-y", children: _jsx(Button, { variant: "secondary", onClick: onRetry, children: retryLabel }) })] }));
+import { cx } from '../lib/cx.js';
+export function ErrorState({ message, retryLabel, onRetry, className }) {
+    return (_jsxs("div", { className: cx('py-x-slot-state-pad-y', className), role: "alert", children: [_jsx("p", { className: "font-sans text-danger", children: message }), _jsx("div", { className: "py-x-slot-state-action-pad-y", children: _jsx(Button, { variant: "secondary", onClick: onRetry, children: retryLabel }) })] }));
 }
 //# sourceMappingURL=ErrorState.js.map

package/dist/states/ErrorState.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorState.js","sourceRoot":"","sources":["../../src/states/ErrorState.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAUjD,MAAM,UAAU,UAAU,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAmB;IAC1E,OAAO,CACL,eAAK,SAAS,EAAC,uBAAuB,EAAC,IAAI,EAAC,OAAO,aACjD,YAAG,SAAS,EAAC,uBAAuB,YAAE,OAAO,GAAK,EAClD,cAAK,SAAS,EAAC,8BAA8B,YAC3C,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,OAAO,EAAE,OAAO,YACzC,UAAU,GACJ,GACL,IACF,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"ErrorState.js","sourceRoot":"","sources":["../../src/states/ErrorState.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAYlC,MAAM,UAAU,UAAU,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAmB;IACrF,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,EAAE,IAAI,EAAC,OAAO,aAClE,YAAG,SAAS,EAAC,uBAAuB,YAAE,OAAO,GAAK,EAClD,cAAK,SAAS,EAAC,8BAA8B,YAC3C,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,OAAO,EAAE,OAAO,YACzC,UAAU,GACJ,GACL,IACF,CACP,CAAC;AACJ,CAAC"}

package/dist/states/LoadingState.d.ts

@@ -1,4 +1,6 @@
 export interface LoadingStateProps {
+    /** Composed after the kit's own classes (design principle 2). */
+    className?: string;
     /** Localized message announced while the work is in flight. */
     label: string;
 }
@@ -15,4 +17,4 @@ export interface LoadingStateProps {
  * and a live region wrapped in another live region is announced twice. `aria-busy` marks
  * the region as in-flight without adding a second announcer.
  */
-export declare function LoadingState({ label }: LoadingStateProps): import("react").JSX.Element;
+export declare function LoadingState({ label, className }: LoadingStateProps): import("react").JSX.Element;

package/dist/states/LoadingState.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Spinner } from '../primitives/Spinner.js';
+import { cx } from '../lib/cx.js';
 /**
  * The third of the three states.
  *
@@ -13,7 +14,7 @@ import { Spinner } from '../primitives/Spinner.js';
  * and a live region wrapped in another live region is announced twice. `aria-busy` marks
  * the region as in-flight without adding a second announcer.
  */
-export function LoadingState({ label }) {
-    return (_jsx("div", { className: "py-x-slot-state-pad-y", "aria-busy": "true", children: _jsx(Spinner, { label: label }) }));
+export function LoadingState({ label, className }) {
+    return (_jsx("div", { className: cx('py-x-slot-state-pad-y', className), "aria-busy": "true", children: _jsx(Spinner, { label: label }) }));
 }
 //# sourceMappingURL=LoadingState.js.map

package/dist/states/LoadingState.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingState.js","sourceRoot":"","sources":["../../src/states/LoadingState.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AAOnD;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,KAAK,EAAqB;IACvD,OAAO,CACL,cAAK,SAAS,EAAC,uBAAuB,eAAW,MAAM,YACrD,KAAC,OAAO,IAAC,KAAK,EAAE,KAAK,GAAI,GACrB,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"LoadingState.js","sourceRoot":"","sources":["../../src/states/LoadingState.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AASlC;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,KAAK,EAAE,SAAS,EAAqB;IAClE,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,eAAY,MAAM,YACtE,KAAC,OAAO,IAAC,KAAK,EAAE,KAAK,GAAI,GACrB,CACP,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hideyukimori/nene2-ui",
-  "version": "0.3.0",
+  "version": "0.6.0",
   "description": "NeNe fleet shared React UI kit — token-driven primitives on Tailwind v4 @theme. Components carry no design of their own; themes do.",
   "type": "module",
   "license": "MIT",

package/themes/default.css

@@ -38,6 +38,22 @@
    * focused input is under 16px, and a product whose body text is 14px would inherit that.
    * Keeping a control readable is the control's job, not the product's. */
 
+  /* The type scale. Six steps, from what the fleet actually writes (measured 2026-08-23):
+   * nene-records uses `sm` 65 times and `xs` 40, nene-field `sm` 59 / `xs` 57 / `base` 21 /
+   * `lg` 13, nene-vault `2xs` 33. Nothing above `xl` recurs.
+   *
+   * 🔴 `--text-x-ios-floor` is not a design step and products should not use it as one. It
+   * is here because iOS Safari zooms the page when a focused control is under 16px, which is
+   * a fact about the device rather than a decision about the product. Slots reference it so
+   * that the rule "a slot contains only scale references" stays true. */
+  --text-x-2xs: 0.6875rem;
+  --text-x-xs: 0.75rem;
+  --text-x-sm: 0.875rem;
+  --text-x-md: 1rem;
+  --text-x-lg: 1.125rem;
+  --text-x-xl: 1.5rem;
+  --text-x-ios-floor: 16px;
+
   /* ─────────────────────────────────────────────────────────────────────────
    * ② SLOTS — a product may redefine these.
    *
@@ -52,10 +68,16 @@
    * ───────────────────────────────────────────────────────────────────────── */
   --spacing-x-slot-button-pad-x: var(--spacing-x-sm);
   --spacing-x-slot-button-pad-y: var(--spacing-x-xs);
+  --spacing-x-slot-button-sm-pad-x: var(--spacing-x-xs);
+  --spacing-x-slot-button-sm-pad-y: var(--spacing-x-3xs);
   --spacing-x-slot-control-pad-x: var(--spacing-x-2xs);
   --spacing-x-slot-control-pad-y: var(--spacing-x-xs);
   --spacing-x-slot-field-gap: var(--spacing-x-2xs);
   --spacing-x-slot-choice-gap: var(--spacing-x-2xs);
+  /* The box itself. 1rem = 16px, which is what every product that ships a checkbox uses
+   * (measured 2026-08-23). Sized from the scale so a product that wants a larger hit area
+   * moves a step rather than inventing a length. */
+  --spacing-x-slot-choice-box: var(--spacing-x-sm);
   --spacing-x-slot-badge-pad-x: var(--spacing-x-2xs);
   --spacing-x-slot-badge-pad-y: var(--spacing-x-3xs);
   --spacing-x-slot-switch-pad-x: var(--spacing-x-2xs);
@@ -83,10 +105,41 @@
   --radius-x-slot-modal: var(--radius-x-md);
   --radius-x-slot-card: var(--radius-x-md);
 
+  /* Pointer feedback. One rule for every variant, rather than a hover colour per fill:
+   * the kit's buttons are filled with three different colours, and a palette entry for each
+   * hover state would be three more values a product has to keep in step. Darkening works on
+   * all of them — including the white `secondary` fill, where the fleet's own
+   * `hover:brightness-105` does nothing at all.
+   *
+   * Tailwind wraps `hover:` in `@media (hover: hover)`, so this does not stick on touch. */
+  --brightness-x-slot-hover: 95%;
+  --brightness-x-slot-press: 90%;
+
+  --color-x-slot-choice-accent: var(--color-accent);
+
+  /* Alert colours. `warn` defaults to the same hue as `danger` because this palette has one
+   * alert colour — a second one is a decision a product makes, not something the kit can
+   * invent. Until a product sets these, "warning" and "failure" look alike, and only the
+   * announced urgency differs: role="status" against role="alert". That difference reaches
+   * someone listening and no one looking (nene-vault, 2026-08-23), which is why the slots
+   * exist rather than the tones being hard-coded. */
+  --color-x-slot-alert-info-bg: var(--color-surface);
+  --color-x-slot-alert-info-fg: var(--color-text-primary);
+  --color-x-slot-alert-info-border: var(--color-border);
+  --color-x-slot-alert-warn-bg: var(--color-surface);
+  --color-x-slot-alert-warn-fg: var(--color-danger);
+  --color-x-slot-alert-warn-border: var(--color-danger);
+  --color-x-slot-alert-danger-bg: var(--color-surface);
+  --color-x-slot-alert-danger-fg: var(--color-danger);
+  --color-x-slot-alert-danger-border: var(--color-danger);
   --color-x-slot-field-label: var(--color-text-muted);
-  --text-x-slot-field-label-size: 0.75rem;
+  --color-x-slot-field-hint: var(--color-text-muted);
+  --text-x-slot-field-hint-size: var(--text-x-2xs);
+  --color-x-slot-field-error: var(--color-danger);
+  --text-x-slot-field-error-size: var(--text-x-2xs);
+  --text-x-slot-field-label-size: var(--text-x-xs);
   --font-weight-x-slot-field-label: 500;
-  --text-x-slot-control-size: max(1rem, 16px);
+  --text-x-slot-control-size: max(var(--text-x-md), var(--text-x-ios-floor));
 
   /* Sentinel for the consumer's build (#316). Zero-width, so applying it does nothing.
    * Its only job is to exist: `p-x-source-probe` appears nowhere except this kit's `dist`,