@handamade/psi-react 0.19.0 → 0.21.0

package/README.md

@@ -1,6 +1,6 @@
 # @handamade/psi-react
 
-34 React 19 components consuming @handamade/psi-tokens. Zero runtime dependencies, CSS Modules, full TypeScript support.
+46 React 19 components consuming @handamade/psi-tokens. Zero runtime dependencies, CSS Modules, full TypeScript support.
 
 ## Installation
 

package/dist/AppShell/AppShell.d.ts

@@ -0,0 +1,51 @@
+import type { HTMLAttributes, ReactNode, Ref } from "react";
+export interface AppShellProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    /** A `SkipLink` (D88), rendered first so it is the first tab stop. Point its
+     * `href` at `#` plus `mainId`. */
+    skipLink?: ReactNode;
+    /** The header row, usually a `NavBar` (D88). It sits in a row of its own
+     * above the sidebar and `main`, so nothing scrolls under it. */
+    header?: ReactNode;
+    /** The sidebar's content, usually a `NavTree` (D88). The shell wraps it in a
+     * `<div>`, not an `<aside>`: a `NavTree` is already the landmark. */
+    sidebar?: ReactNode;
+    /** The page, rendered inside `<main>` (D88). */
+    children?: ReactNode;
+    /** Whether the sidebar is shown. Controlled: wire your Menu toggle's
+     * `aria-expanded` and this to one piece of state. Closed, the sidebar is
+     * `hidden`, so it leaves the layout and the accessibility tree, and stays in
+     * the DOM so the toggle's `aria-controls` keeps naming an element (D88).
+     * @default true */
+    sidebarOpen?: boolean;
+    /** A theme name for the sidebar alone, such as `"dark"`: sets
+     * `data-psi-theme` on the sidebar element, so every token inside re-resolves
+     * under that theme while the rest of the page keeps its own (D88). The
+     * sidebar paints `--psi-bg-primary` itself; a theme paints no background. */
+    sidebarTheme?: string;
+    /** `id` of the sidebar element, which a toggle names with `aria-controls`
+     * (D88). @default "sidebar" */
+    sidebarId?: string;
+    /** `id` of `<main>`, which a `SkipLink`'s `href` names (D88). @default "main" */
+    mainId?: string;
+    className?: string;
+    /** Forwarded ref to the root `<div>`. */
+    ref?: Ref<HTMLDivElement>;
+}
+/** The frame of an application (D88): a header row over a sidebar and a
+ * `<main>` that each scroll on their own, filling the viewport (`100dvh`).
+ * Because the header has a row of its own and `main` is its own scroller,
+ * nothing scrolls under the header, so a focused element is never obscured by
+ * it (WCAG 2.2 *Focus Not Obscured*) without `scroll-padding`.
+ *
+ * `main` carries `id={mainId}` and `tabIndex={-1}`: the target of a `SkipLink`,
+ * not a tab stop; focused by the skip link it draws the shared focus ring
+ * inside its box. A closed sidebar is `hidden`, not narrowed to icons; there is
+ * no responsive drawer and no stored open state, so this is a desktop frame.
+ * A page whose document must scroll as a whole does not use `AppShell`. Mount it
+ * at the root of the page with no margin or padding around it: it is `100dvh`
+ * tall, so anything around it makes the document scroll and slides the frame.
+ *
+ * Do not place a `ToastRegion` at `top-start` in an app with a skip link: the
+ * native top layer paints over the focused link. */
+export declare function AppShell({ skipLink, header, sidebar, children, sidebarOpen, sidebarTheme, sidebarId, mainId, className, ref, ...rest }: AppShellProps): import("react").JSX.Element;
+//# sourceMappingURL=AppShell.d.ts.map

package/dist/AppShell/AppShell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/AppShell/AppShell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACrF;sCACkC;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;oEACgE;IAChE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;yEACqE;IACrE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;uBAImB;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;iFAG6E;IAC7E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;mCAC+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iFAAiF;IACjF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;oDAeoD;AACpD,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAM,EACN,OAAO,EACP,QAAQ,EACR,WAAkB,EAClB,YAAY,EACZ,SAAqB,EACrB,MAAe,EACf,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,+BAgBf"}

package/dist/Banner/Banner.d.ts

@@ -0,0 +1,35 @@
+import type { HTMLAttributes, ReactNode, Ref } from "react";
+import type { StatusVariant } from "../Toast/status.js";
+/** Banner's variants are the shared status axis (see Toast/status.ts). */
+export type BannerVariant = StatusVariant;
+export interface BannerProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Status variant. @default "neutral" */
+    variant?: BannerVariant;
+    /** A short heading, rendered before the body in the medium weight. */
+    title?: ReactNode;
+    /** The message. */
+    children: ReactNode;
+    /** Trailing affordance — a ghost Button (Review, Retry, Learn more). */
+    action?: ReactNode;
+    /** When provided, renders the dismiss button and calls this. Banner does not
+     * remove itself; the owner disposes. */
+    onDismiss?: () => void;
+    /** The visually hidden status word (D83). A string replaces the default
+     * ("Success:", "Warning:", "Error:") — pass the translated word; `null`
+     * drops it. Unset keeps the default, and `neutral` has none. */
+    statusLabel?: string | null;
+    className?: string;
+    /** Forwarded ref to the underlying `<div>`. */
+    ref?: Ref<HTMLDivElement>;
+}
+/** A full-width, page-level status message (D86). It is not a live region:
+ * it renders no `role` and no `aria-live`, so mounting one announces nothing,
+ * and announcing stays the application's — route the same event through a
+ * `ToastRegion` or an `Announcement` if it must be spoken.
+ *
+ * Controlled and presentational: it holds no state and never removes itself;
+ * `onDismiss` reports and the owner disposes. A tinted strip with no radius
+ * and no border, it is meant to span the page edge to edge, above the
+ * content. For the same message inside content, use `InlineAlert`. */
+export declare function Banner({ variant, title, children, action, onDismiss, statusLabel, className, ref, ...rest }: BannerProps): import("react").JSX.Element;
+//# sourceMappingURL=Banner.d.ts.map

package/dist/Banner/Banner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAI5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGxD,0EAA0E;AAC1E,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC;AAE1C,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAChF,yCAAyC;IACzC,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,sEAAsE;IACtE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;4CACwC;IACxC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;oEAEgE;IAChE,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AASD;;;;;;;;sEAQsE;AACtE,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,WAAW,EACX,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,WAAW,+BAuBb"}

package/dist/Button/Button.d.ts

@@ -8,6 +8,10 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: Variant;
     /** Height in px (24 | 32 | 40 | 48). @default 32 */
     size?: Size;
+    /** Button type. Declared so the manifest lists it and a pattern can say
+     * `submit` (D87). No default is set: the platform's applies — `submit`
+     * inside a form, a plain button elsewhere. */
+    type?: "button" | "submit" | "reset";
     /** Render as an anchor with this href (D33). disabled → aria-disabled,
      * no href attribute, pointer-events: none. */
     href?: string;

package/dist/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,oBAAoB,EAEpB,GAAG,EACH,SAAS,EACV,MAAM,OAAO,CAAC;AAGf,KAAK,OAAO,GACR,QAAQ,GACR,eAAe,GACf,SAAS,GACT,gBAAgB,GAChB,OAAO,GACP,QAAQ,GACR,eAAe,GACf,SAAS,CAAC;AAEd,KAAK,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAE9B,MAAM,WAAW,WAAY,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC1E,qBAAqB;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ;kDAC8C;IAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0CAA0C;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uCAAuC;IACvC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;CAClD;AAoBD;8CAC8C;AAC9C,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,IAAS,EACT,IAAI,EACJ,MAAM,EACN,GAAG,EACH,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,EACH,GAAG,IAAI,EACR,EAAE,WAAW,+BA0Cb"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,oBAAoB,EAEpB,GAAG,EACH,SAAS,EACV,MAAM,OAAO,CAAC;AAGf,KAAK,OAAO,GACR,QAAQ,GACR,eAAe,GACf,SAAS,GACT,gBAAgB,GAChB,OAAO,GACP,QAAQ,GACR,eAAe,GACf,SAAS,CAAC;AAEd,KAAK,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAE9B,MAAM,WAAW,WAAY,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC1E,qBAAqB;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ;;kDAE8C;IAC9C,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC;kDAC8C;IAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0CAA0C;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uCAAuC;IACvC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;CAClD;AAoBD;8CAC8C;AAC9C,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,IAAS,EACT,IAAI,EACJ,MAAM,EACN,GAAG,EACH,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,EACH,GAAG,IAAI,EACR,EAAE,WAAW,+BA0Cb"}

package/dist/CopyButton/CopyButton.d.ts

@@ -0,0 +1,23 @@
+import type { ButtonProps } from "../Button/Button.js";
+export interface CopyButtonProps {
+    /** The text written to the clipboard. */
+    value: string;
+    /** Visible text of the button. @default "Copy" */
+    label?: string;
+    /** Button height in px. @default 32 */
+    size?: 24 | 32 | 40 | 48;
+    /** Button variant. @default "ghost" */
+    variant?: ButtonProps["variant"];
+    /** Called with the outcome once the clipboard write settles. `"failed"` covers
+     * a rejected write and an environment with no clipboard API. */
+    onCopy?: (result: "copied" | "failed") => void;
+    className?: string;
+}
+/** Not a live region: it renders no role and no `aria-live`, never changes its
+ * label or icon after a copy, and announces nothing. The application speaks
+ * the result — route `onCopy` through its announcer or a Toast (D86).
+ *
+ * Copies `value` to the clipboard when pressed. A `Button` with a leading
+ * `IconCopy` and a visible label; the icon only reinforces the word. */
+export declare function CopyButton({ value, label, size, variant, onCopy, className, }: CopyButtonProps): import("react").JSX.Element;
+//# sourceMappingURL=CopyButton.d.ts.map

package/dist/CopyButton/CopyButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopyButton.d.ts","sourceRoot":"","sources":["../../src/CopyButton/CopyButton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAGvD,MAAM,WAAW,eAAe;IAC9B,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uCAAuC;IACvC,IAAI,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;IACzB,uCAAuC;IACvC,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC;oEACgE;IAChE,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,GAAG,QAAQ,KAAK,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;wEAKwE;AACxE,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,KAAc,EACd,IAAS,EACT,OAAiB,EACjB,MAAM,EACN,SAAS,GACV,EAAE,eAAe,+BAuBjB"}

package/dist/CursorPagination/CursorPagination.d.ts

@@ -0,0 +1,29 @@
+export interface CursorPaginationProps {
+    /** Whether a previous page exists — the consumer knows, from its tokens. */
+    hasPrevious: boolean;
+    /** Whether a next page exists. */
+    hasNext: boolean;
+    /** Called when the user asks for the previous page. */
+    onPrevious: () => void;
+    /** Called when the user asks for the next page. */
+    onNext: () => void;
+    /** Visible text of the previous button. @default "Previous" */
+    previousLabel?: string;
+    /** Visible text of the next button. @default "Next" */
+    nextLabel?: string;
+    /** Button height in px. @default 32 */
+    size?: 32 | 40;
+    /** Accessible name for the nav landmark. @default "Pagination" */
+    "aria-label"?: string;
+    className?: string;
+}
+/** A pager for a list that pages by cursor (D85): a backend that returns a
+ * `nextPageToken` and no page count. Two `ghost` Buttons with visible words in
+ * a `<nav>`; the chevrons only reinforce them. A direction that is not
+ * available is disabled. It holds no state and knows nothing about pages —
+ * the consumer holds the tokens and answers `hasPrevious` / `hasNext`.
+ *
+ * A sibling of `Pagination`, not a mode of it: `Pagination`'s contract is a
+ * page count and numbers, and this one has neither. */
+export declare function CursorPagination({ hasPrevious, hasNext, onPrevious, onNext, previousLabel, nextLabel, size, "aria-label": ariaLabel, className, }: CursorPaginationProps): import("react").JSX.Element;
+//# sourceMappingURL=CursorPagination.d.ts.map

package/dist/CursorPagination/CursorPagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CursorPagination.d.ts","sourceRoot":"","sources":["../../src/CursorPagination/CursorPagination.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,qBAAqB;IACpC,4EAA4E;IAC5E,WAAW,EAAE,OAAO,CAAC;IACrB,kCAAkC;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,uDAAuD;IACvD,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,mDAAmD;IACnD,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,IAAI,CAAC,EAAE,EAAE,GAAG,EAAE,CAAC;IACf,kEAAkE;IAClE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;uDAOuD;AACvD,wBAAgB,gBAAgB,CAAC,EAC/B,WAAW,EACX,OAAO,EACP,UAAU,EACV,MAAM,EACN,aAA0B,EAC1B,SAAkB,EAClB,IAAS,EACT,YAAY,EAAE,SAAwB,EACtC,SAAS,GACV,EAAE,qBAAqB,+BAgBvB"}

package/dist/Field/Field.d.ts

@@ -3,6 +3,10 @@ import type { HTMLAttributes, ReactNode, Ref } from "react";
 export interface FieldContextValue {
     /** Generated (or htmlFor-overridden) id the label points at. */
     id: string;
+    /** id of the rendered <label>, when there is one and the Field is not a
+     * group. A <label for> names only a labelable element, so a control that is
+     * not one (a combobox div, say) names itself with aria-labelledby (D84). */
+    labelId?: string;
     /** id of the rendered message line, if any — joins aria-describedby. */
     describedBy?: string;
     /** True when the Field carries an error. */
@@ -23,16 +27,27 @@ export interface FieldProps extends HTMLAttributes<HTMLElement> {
     error?: ReactNode;
     /** Renders the required marker and flows `required` to the control. @default false */
     required?: boolean;
+    /** With `required`, the label shows this text — "(Required)", say — instead
+     * of the asterisk, so the requirement is stated in words and not by a glyph
+     * alone (D84). Visible and aria-hidden: the control carries the programmatic
+     * signal (`required` / `aria-required`), and a screen reader that heard both
+     * would say it twice. Without `required` it renders nothing. */
+    requiredText?: string;
     /** Group mode: fieldset/legend wrapping several self-labeled controls
      * (Checkbox/Switch); the message describes the whole group. @default false */
     group?: boolean;
     /** Override the generated control id (pair it with the same id on the control). */
     htmlFor?: string;
+    /** When false, the message line is not a live region: an application that
+     * routes every announcement through one announcer of its own sets this and
+     * announces field errors itself. The message still describes the control
+     * (aria-describedby). @default true (D81) */
+    announce?: boolean;
     /** Forwarded ref to the root element. */
     ref?: Ref<HTMLDivElement | HTMLFieldSetElement>;
 }
 /** Labeled form-row wrapper: label above, control, one message line below —
- * description normally, error when set (aria-live). Auto-wires
- * id/aria-describedby/aria-invalid into Input and Select (D49). */
-export declare function Field({ label, description, error, required, group, htmlFor, className, children, ref, ...rest }: FieldProps): import("react").JSX.Element;
+ * description normally, error when set (aria-live unless `announce={false}`).
+ * Auto-wires id/aria-describedby/aria-invalid into Input and Select (D49). */
+export declare function Field({ label, description, error, required, requiredText, group, htmlFor, announce, className, children, ref, ...rest }: FieldProps): import("react").JSX.Element;
 //# sourceMappingURL=Field.d.ts.map

package/dist/Field/Field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/Field/Field.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,6EAA6E;AAC7E,MAAM,WAAW,iBAAiB;IAChC,gEAAgE;IAChE,EAAE,EAAE,MAAM,CAAC;IACX,wEAAwE;IACxE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4CAA4C;IAC5C,OAAO,EAAE,OAAO,CAAC;IACjB,sDAAsD;IACtD,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,YAAY,mDAAgD,CAAC;AAE1E,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC7D,qCAAqC;IACrC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oEAAoE;IACpE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0EAA0E;IAC1E,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;8DAC0D;IAC1D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sFAAsF;IACtF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;kFAC8E;IAC9E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,mFAAmF;IACnF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,GAAG,mBAAmB,CAAC,CAAC;CACjD;AAED;;mEAEmE;AACnE,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAgB,EAChB,KAAa,EACb,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,+BAwDZ"}
+{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/Field/Field.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,6EAA6E;AAC7E,MAAM,WAAW,iBAAiB;IAChC,gEAAgE;IAChE,EAAE,EAAE,MAAM,CAAC;IACX;;gFAE4E;IAC5E,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wEAAwE;IACxE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4CAA4C;IAC5C,OAAO,EAAE,OAAO,CAAC;IACjB,sDAAsD;IACtD,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,YAAY,mDAAgD,CAAC;AAE1E,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC7D,qCAAqC;IACrC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,oEAAoE;IACpE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0EAA0E;IAC1E,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;8DAC0D;IAC1D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sFAAsF;IACtF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;oEAIgE;IAChE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;kFAC8E;IAC9E,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,mFAAmF;IACnF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;iDAG6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,GAAG,mBAAmB,CAAC,CAAC;CACjD;AAED;;8EAE8E;AAC9E,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAgB,EAChB,YAAY,EACZ,KAAa,EACb,OAAO,EACP,QAAe,EACf,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,+BA+DZ"}

package/dist/Field/useFieldControl.d.ts

@@ -0,0 +1,40 @@
+/** What a control spreads onto its focusable element to join a Field (D84).
+ * Each key is present only when the Field supplies it: the flags are `true`
+ * or absent, never `false`. */
+export interface FieldControlProps {
+    /** The id the Field's label points at. */
+    id?: string;
+    /** The Field's label. A `<label for>` names only a labelable element (input,
+     * select, textarea, button), and a custom control is usually a div, so the
+     * label is handed over by reference as well. */
+    "aria-labelledby"?: string;
+    /** The Field's message line — its description, or its error when set. */
+    "aria-describedby"?: string;
+    /** Present while the Field carries an error. */
+    "aria-invalid"?: true;
+    /** Present while the Field is required. */
+    "aria-required"?: true;
+    /** Present while the Field is required, for a native form control. */
+    required?: true;
+}
+/** The wiring a Field gives its control, as props, for a control Psi did not
+ * write (D84) — a combo box or date-time picker built on another library, say.
+ * Spread the result onto the element that takes focus:
+ *
+ *     const field = useFieldControl();
+ *     <div role="combobox" {...field} />
+ *
+ * Inside a Field it returns the `id` the label points at, `aria-labelledby`
+ * for the label itself (a `<label for>` names only a labelable element, and a
+ * div is not one), `aria-describedby` for the message line, and
+ * `aria-invalid`, `aria-required` and `required` when the Field sets them —
+ * the wiring Input and Select do for themselves, plus the name they get from
+ * `<label for>` for free.
+ * Outside a Field it returns an empty object, so a control can be used with
+ * or without one.
+ *
+ * The element must carry a role that admits `aria-required` (combobox,
+ * textbox, listbox, spinbutton, …). If it also merges its own
+ * `aria-describedby`, join the two ids with a space. */
+export declare function useFieldControl(): FieldControlProps;
+//# sourceMappingURL=useFieldControl.d.ts.map

package/dist/Field/useFieldControl.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFieldControl.d.ts","sourceRoot":"","sources":["../../src/Field/useFieldControl.ts"],"names":[],"mappings":"AAGA;;+BAE+B;AAC/B,MAAM,WAAW,iBAAiB;IAChC,0CAA0C;IAC1C,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;oDAEgD;IAChD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,yEAAyE;IACzE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gDAAgD;IAChD,cAAc,CAAC,EAAE,IAAI,CAAC;IACtB,2CAA2C;IAC3C,eAAe,CAAC,EAAE,IAAI,CAAC;IACvB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,IAAI,CAAC;CACjB;AAED;;;;;;;;;;;;;;;;;;wDAkBwD;AACxD,wBAAgB,eAAe,IAAI,iBAAiB,CAUnD"}

package/dist/InlineAlert/InlineAlert.d.ts

@@ -0,0 +1,32 @@
+import type { HTMLAttributes, ReactNode, Ref } from "react";
+import type { StatusVariant } from "../Toast/status.js";
+/** InlineAlert's variants are the shared status axis (see Toast/status.ts). */
+export type InlineAlertVariant = StatusVariant;
+export interface InlineAlertProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Status variant. @default "neutral" */
+    variant?: InlineAlertVariant;
+    /** A short heading, rendered before the body in the medium weight. */
+    title?: ReactNode;
+    /** The message. */
+    children: ReactNode;
+    /** Trailing affordance — a ghost Button (Review, Retry, Learn more). */
+    action?: ReactNode;
+    /** The visually hidden status word (D83). A string replaces the default
+     * ("Success:", "Warning:", "Error:") — pass the translated word; `null`
+     * drops it. Unset keeps the default, and `neutral` has none. */
+    statusLabel?: string | null;
+    className?: string;
+    /** Forwarded ref to the underlying `<div>`. */
+    ref?: Ref<HTMLDivElement>;
+}
+/** Not `role="alert"`, despite its name. It is not a live region: it renders
+ * no `role` and no `aria-live`, so mounting one announces nothing, and
+ * announcing stays the application's — route the same event through a
+ * `ToastRegion` or an `Announcement` if it must be spoken.
+ *
+ * A status message that sits inside content (D86): above a form, in a panel.
+ * A tinted surface with a 1px border in the variant's colour and a radius; it
+ * fills the width of its container rather than setting its own. Presentational
+ * and stateless, with no dismiss button. For a page-wide strip, use `Banner`. */
+export declare function InlineAlert({ variant, title, children, action, statusLabel, className, ref, ...rest }: InlineAlertProps): import("react").JSX.Element;
+//# sourceMappingURL=InlineAlert.d.ts.map

package/dist/InlineAlert/InlineAlert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineAlert.d.ts","sourceRoot":"","sources":["../../src/InlineAlert/InlineAlert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGxD,+EAA+E;AAC/E,MAAM,MAAM,kBAAkB,GAAG,aAAa,CAAC;AAE/C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACrF,yCAAyC;IACzC,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,sEAAsE;IACtE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;oEAEgE;IAChE,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AASD;;;;;;;;iFAQiF;AACjF,wBAAgB,WAAW,CAAC,EAC1B,OAAmB,EACnB,KAAK,EACL,QAAQ,EACR,MAAM,EACN,WAAW,EACX,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,gBAAgB,+BAkBlB"}

package/dist/NavBar/NavBar.d.ts

@@ -4,11 +4,19 @@ export interface NavBarProps extends HTMLAttributes<HTMLElement> {
     brand?: ReactNode;
     /** Trailing actions slot (theme switch, CTA). */
     actions?: ReactNode;
-    /** Nav links. */
+    /** Nav links. The `<nav>` renders only when there are children, so a bar with
+     * a brand and actions and no links has no empty landmark (D88). */
     children?: ReactNode;
+    /** Accessible name of the links' `<nav>` (its `aria-label`). Rest props land
+     * on the `<header>`, so this is the only way to label the `<nav>` (D88). */
+    navLabel?: string;
+    /** Lay the row out at full width: it drops `psi-container` (the centred
+     * max-width column) and keeps the `--psi-gutter` side padding. For an
+     * application header over a full-width frame (D88). @default false */
+    fluid?: boolean;
     /** Forwarded ref to the header element. */
     ref?: Ref<HTMLElement>;
 }
 /** Top navigation bar with brand, nav-link, and trailing-action slots. */
-export declare function NavBar({ brand, actions, children, className, ref, ...rest }: NavBarProps): import("react").JSX.Element;
+export declare function NavBar({ brand, actions, children, navLabel, fluid, className, ref, ...rest }: NavBarProps): import("react").JSX.Element;
 //# sourceMappingURL=NavBar.d.ts.map

package/dist/NavBar/NavBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavBar.d.ts","sourceRoot":"","sources":["../../src/NavBar/NavBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC9D,uDAAuD;IACvD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,iDAAiD;IACjD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,iBAAiB;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,0EAA0E;AAC1E,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,EAAE,WAAW,+BAWxF"}
+{"version":3,"file":"NavBar.d.ts","sourceRoot":"","sources":["../../src/NavBar/NavBar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC9D,uDAAuD;IACvD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,iDAAiD;IACjD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;uEACmE;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;gFAC4E;IAC5E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;0EAEsE;IACtE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,0EAA0E;AAC1E,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAa,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,EAAE,WAAW,+BAgBjH"}

package/dist/NavTree/NavGroup.d.ts

@@ -0,0 +1,22 @@
+import type { ReactNode } from "react";
+export interface NavGroupProps {
+    /** The group's visible label, such as "Reports". */
+    label: ReactNode;
+    /** Whether the group's items are shown. Controlled. */
+    open: boolean;
+    /** Called with the next state when the button is pressed. The group never
+     * changes `open` itself. */
+    onOpenChange: (open: boolean) => void;
+    /** `NavItem`s of the group. */
+    children: ReactNode;
+    className?: string;
+}
+/** A collapsible group of `NavItem`s in a `NavTree` (D88). Controlled-only,
+ * like `Tabs` (D67): `open` and `onOpenChange` are required and nothing is
+ * remembered. Renders a native `<button aria-expanded aria-controls>` over a
+ * `<ul>` that is `hidden` when closed, so the items leave the layout and the
+ * accessibility tree while `aria-controls` keeps naming an element. The
+ * chevron turns with the state and is `aria-hidden`: the label and
+ * `aria-expanded` carry the meaning. */
+export declare function NavGroup({ label, open, onOpenChange, children, className }: NavGroupProps): import("react").JSX.Element;
+//# sourceMappingURL=NavGroup.d.ts.map

package/dist/NavTree/NavGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavGroup.d.ts","sourceRoot":"","sources":["../../src/NavTree/NavGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,aAAa;IAC5B,oDAAoD;IACpD,KAAK,EAAE,SAAS,CAAC;IACjB,uDAAuD;IACvD,IAAI,EAAE,OAAO,CAAC;IACd;gCAC4B;IAC5B,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;wCAMwC;AACxC,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,aAAa,+BAoBzF"}

package/dist/NavTree/NavItem.d.ts

@@ -0,0 +1,25 @@
+import type { HTMLAttributes, ReactNode, Ref } from "react";
+export interface NavItemProps extends Omit<HTMLAttributes<HTMLLIElement>, "children"> {
+    /** Without `href`: one anchor, your router's link — put `aria-current="page"`
+     * on the current one. With `href`: the link's text. */
+    children: ReactNode;
+    /** Render the anchor yourself (D88), for a plain link or a preset: the
+     * `<li>` holds `<a href>` with `children` as its text. Router apps leave it
+     * out and pass their own link as the child, so the link keeps its own
+     * handlers. */
+    href?: string;
+    /** Mark the link as the current page (`aria-current="page"`). Only with
+     * `href`; a link you pass as a child carries its own `aria-current`. */
+    current?: boolean;
+    className?: string;
+    /** Forwarded ref to the `<li>`. */
+    ref?: Ref<HTMLLIElement>;
+}
+/** One entry of a `NavTree` (D88): an `<li>` that styles the single anchor
+ * inside it. Router apps pass their own link as the child, so it keeps its
+ * `href`, `aria-current` and handlers; `href` is for plain links and for
+ * presets, where the compose tree can hold only manifest components and a raw
+ * `<a>` is not one. The current page is never marked by colour alone: medium
+ * weight, a raised surface and a bar at the inline start. */
+export declare function NavItem({ children, href, current, className, ref, ...rest }: NavItemProps): import("react").JSX.Element;
+//# sourceMappingURL=NavItem.d.ts.map

package/dist/NavTree/NavItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavItem.d.ts","sourceRoot":"","sources":["../../src/NavTree/NavItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC;IACnF;2DACuD;IACvD,QAAQ,EAAE,SAAS,CAAC;IACpB;;;mBAGe;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;4EACwE;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;CAC1B;AAED;;;;;6DAK6D;AAC7D,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,EAAE,YAAY,+BAazF"}

package/dist/NavTree/NavTree.d.ts

@@ -0,0 +1,23 @@
+import type { HTMLAttributes, ReactNode, Ref } from "react";
+export interface NavTreeProps extends Omit<HTMLAttributes<HTMLElement>, "aria-label" | "children"> {
+    /**
+     * Accessible name of the navigation landmark, such as "Main". Required: an
+     * app has more than one `<nav>` (a header's, a sidebar's), and an unnamed
+     * one is indistinguishable from the rest. Declared here rather than
+     * inherited so docgen keeps it in the manifest (D60).
+     */
+    "aria-label": string;
+    /** `NavItem`s and `NavGroup`s — each renders an `<li>`. */
+    children: ReactNode;
+    className?: string;
+    /** Forwarded ref to the `<nav>`. */
+    ref?: Ref<HTMLElement>;
+}
+/** A navigation tree (D88): a `<nav aria-label>` around a `<ul>` of `NavItem`s
+ * and `NavGroup`s. Native elements only — *Tab* moves through the group
+ * buttons and the links of open groups; there is no roving focus and no
+ * `role="menu"` or `role="tree"`, because site navigation is a list of links,
+ * not a widget. Router-agnostic: pass your router's link inside each
+ * `NavItem`, with `aria-current="page"` on the current one. */
+export declare function NavTree({ children, className, ref, ...rest }: NavTreeProps): import("react").JSX.Element;
+//# sourceMappingURL=NavTree.d.ts.map

package/dist/NavTree/NavTree.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavTree.d.ts","sourceRoot":"","sources":["../../src/NavTree/NavTree.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IAChG;;;;;OAKG;IACH,YAAY,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED;;;;;+DAK+D;AAC/D,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,EAAE,YAAY,+BAO1E"}

package/dist/Skeleton/Skeleton.d.ts

@@ -0,0 +1,22 @@
+import type { HTMLAttributes, Ref } from "react";
+export interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
+    /** `text` renders `lines` stacked bars; `block` one box. @default "text" */
+    variant?: "text" | "block";
+    /** Number of text lines; the last of several is shorter. Text only. @default 1 */
+    lines?: number;
+    /** Height of a block, from the size scale. Block only. @default 40 */
+    size?: 24 | 32 | 40 | 48;
+    className?: string;
+    /** Forwarded ref to the underlying `<div>`. */
+    ref?: Ref<HTMLDivElement>;
+}
+/** A loading placeholder. It is not a live region: it renders no `role` and
+ * no `aria-live`, and it is always `aria-hidden="true"`, so assistive tech
+ * skips it entirely. Put `aria-busy` on the region the skeleton stands for —
+ * that is what tells a screen reader the content is coming.
+ *
+ * Its width fills the container; size the container, not the skeleton. The
+ * pulse is an opacity animation that stops under
+ * `prefers-reduced-motion: reduce` (D86). */
+export declare function Skeleton({ variant, lines, size, className, ref, ...rest }: SkeletonProps): import("react").JSX.Element;
+//# sourceMappingURL=Skeleton.d.ts.map

package/dist/Skeleton/Skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../src/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGjD,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,cAAc,CAAC;IACnE,4EAA4E;IAC5E,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B,kFAAkF;IAClF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sEAAsE;IACtE,IAAI,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED;;;;;;;6CAO6C;AAC7C,wBAAgB,QAAQ,CAAC,EACvB,OAAgB,EAChB,KAAS,EACT,IAAS,EACT,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,+BAiBf"}

package/dist/SkipLink/SkipLink.d.ts

@@ -0,0 +1,25 @@
+import type { AnchorHTMLAttributes, ReactNode, Ref } from "react";
+export interface SkipLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    /** Fragment of the element to skip to, such as `"#main"`. The target must be
+     * focusable (`tabIndex={-1}` is enough), or focus does not move. */
+    href: string;
+    /** Visible text, such as "Skip to content". */
+    children: ReactNode;
+    /** Forwarded ref to the anchor. */
+    ref?: Ref<HTMLAnchorElement>;
+}
+/** A link to the page's main content, invisible until it takes keyboard focus
+ * and then fixed at the inline-start top corner on a surface, drawing the
+ * shared focus ring (D88). Render it first in the document.
+ *
+ * No script: native fragment navigation moves focus to a target that is
+ * focusable, so the next *Tab* continues from inside it. `AppShell`'s `main`
+ * is one (`tabIndex={-1}`); a bare `<main>` is not, so give it one.
+ *
+ * A modal `Dialog` makes the rest of the document inert, so the link never
+ * needs to beat one. A `ToastRegion` is on the native top layer, which paints
+ * above everything whatever its `z-index`: do not place one at `top-start`
+ * (its default is `bottom-end`) in an app with a skip link, or it covers the
+ * focused link. */
+export declare function SkipLink({ className, ref, children, ...rest }: SkipLinkProps): import("react").JSX.Element;
+//# sourceMappingURL=SkipLink.d.ts.map

package/dist/SkipLink/SkipLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkipLink.d.ts","sourceRoot":"","sources":["../../src/SkipLink/SkipLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGlE,MAAM,WAAW,aAAc,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC5E;wEACoE;IACpE,IAAI,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,mCAAmC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED;;;;;;;;;;;;mBAYmB;AACnB,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,+BAO5E"}

package/dist/Table/Table.d.ts

@@ -1,11 +1,14 @@
-import type { ReactNode, Ref } from "react";
+import type { ReactNode, Ref, TableHTMLAttributes } from "react";
 export type TableSize = 32 | 40 | 48;
 /** Controlled sort state. `null` means no column is sorted. */
 export interface TableSortState {
     key: string;
     direction: "asc" | "desc";
 }
-export interface TableProps {
+/** Remaining HTML attributes land on the `<table>` (D85): `aria-label`,
+ * `aria-busy` while a page loads, `id`, `data-*`. The table's own attributes
+ * (`data-size`) win. */
+export interface TableProps extends Omit<TableHTMLAttributes<HTMLTableElement>, "children"> {
     /** Row height in px. @default 40 */
     size?: TableSize;
     /** Pins the header while the body scrolls. */
@@ -38,5 +41,5 @@ export interface TableProps {
 }
 /** Data table on native table semantics. Holds no state: sorting, selection
  * and pagination are the consumer's (D62, extending D50/D53). */
-export declare function Table({ size, stickyHeader, sortable, sort, onSortChange, selectable, selected, onSelectionChange, children, className, ref, }: TableProps): import("react").JSX.Element;
+export declare function Table({ size, stickyHeader, sortable, sort, onSortChange, selectable, selected, onSelectionChange, children, className, ref, ...rest }: TableProps): import("react").JSX.Element;
 //# sourceMappingURL=Table.d.ts.map

package/dist/Table/Table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAK5C,MAAM,MAAM,SAAS,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAErC,+DAA+D;AAC/D,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC3B;AAiDD,MAAM,WAAW,UAAU;IACzB,oCAAoC;IACpC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4DAA4D;IAC5D,IAAI,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IAC7B;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC9C,iDAAiD;IACjD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,gFAAgF;IAChF,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IAC5D,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yDAAyD;IACzD,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED;iEACiE;AACjE,wBAAgB,KAAK,CAAC,EACpB,IAAS,EACT,YAAY,EACZ,QAAgB,EAChB,IAAW,EACX,YAAY,EACZ,UAAkB,EAClB,QAA0B,EAC1B,iBAAiB,EACjB,QAAQ,EACR,SAAS,EACT,GAAG,GACJ,EAAE,UAAU,+BAkBZ"}
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table/Table.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAKjE,MAAM,MAAM,SAAS,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAErC,+DAA+D;AAC/D,MAAM,WAAW,cAAc;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC3B;AAiDD;;wBAEwB;AACxB,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC;IACzF,oCAAoC;IACpC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4DAA4D;IAC5D,IAAI,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IAC7B;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC9C,iDAAiD;IACjD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,gFAAgF;IAChF,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IAC5D,+BAA+B;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yDAAyD;IACzD,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED;iEACiE;AACjE,wBAAgB,KAAK,CAAC,EACpB,IAAS,EACT,YAAY,EACZ,QAAgB,EAChB,IAAW,EACX,YAAY,EACZ,UAAkB,EAClB,QAA0B,EAC1B,iBAAiB,EACjB,QAAQ,EACR,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,+BAkBZ"}

package/dist/Table/TableBody.d.ts

@@ -1,9 +1,12 @@
-import type { ReactNode } from "react";
-export interface TableBodyProps {
+import type { HTMLAttributes, ReactNode, Ref } from "react";
+export interface TableBodyProps extends Omit<HTMLAttributes<HTMLTableSectionElement>, "children"> {
     /** The body TableRows. */
     children: ReactNode;
     className?: string;
+    /** Forwarded ref to the `<tbody>`. */
+    ref?: Ref<HTMLTableSectionElement>;
 }
-/** `<tbody>` wrapper. */
-export declare function TableBody({ children, className }: TableBodyProps): import("react").JSX.Element;
+/** `<tbody>` wrapper. Remaining attributes land on it (D85) — `aria-busy`
+ * while a page of rows loads, say. */
+export declare function TableBody({ children, className, ref, ...rest }: TableBodyProps): import("react").JSX.Element;
 //# sourceMappingURL=TableBody.d.ts.map

package/dist/Table/TableBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.d.ts","sourceRoot":"","sources":["../../src/Table/TableBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,WAAW,cAAc;IAC7B,0BAA0B;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,yBAAyB;AACzB,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,cAAc,+BAEhE"}
+{"version":3,"file":"TableBody.d.ts","sourceRoot":"","sources":["../../src/Table/TableBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,cAAc,CAAC,uBAAuB,CAAC,EAAE,UAAU,CAAC;IAC/F,0BAA0B;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,GAAG,CAAC,EAAE,GAAG,CAAC,uBAAuB,CAAC,CAAC;CACpC;AAED;sCACsC;AACtC,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,+BAM9E"}

package/dist/Table/TableCaption.d.ts

@@ -0,0 +1,21 @@
+import type { HTMLAttributes, ReactNode, Ref } from "react";
+export interface TableCaptionProps extends Omit<HTMLAttributes<HTMLTableCaptionElement>, "children"> {
+    /** The name line — what the table lists. Also the table's accessible name. */
+    children: ReactNode;
+    /** An optional second line: the range shown, say — "Rows 51–100 of more
+     * than 100,000". */
+    detail?: ReactNode;
+    className?: string;
+    /** Forwarded ref to the `<caption>`, so focus can be moved to it. */
+    ref?: Ref<HTMLTableCaptionElement>;
+}
+/** `<caption>` — the table's name, above it, and an optional detail line
+ * (D85). It names the table for assistive tech, which an `aria-label` on the
+ * `Table` would also do, but a caption is visible.
+ *
+ * A token-paged list has no page numbers to land on, so after a page change
+ * the consumer moves focus here: give it `tabIndex={-1}`, put the range in
+ * `detail`, and call `focus()` on the ref. The ring is the shared one (D82),
+ * drawn inside the caption's box. Remaining attributes land on the element. */
+export declare function TableCaption({ children, detail, className, ref, ...rest }: TableCaptionProps): import("react").JSX.Element;
+//# sourceMappingURL=TableCaption.d.ts.map

package/dist/Table/TableCaption.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCaption.d.ts","sourceRoot":"","sources":["../../src/Table/TableCaption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5D,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,uBAAuB,CAAC,EAAE,UAAU,CAAC;IAClG,8EAA8E;IAC9E,QAAQ,EAAE,SAAS,CAAC;IACpB;wBACoB;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,GAAG,CAAC,EAAE,GAAG,CAAC,uBAAuB,CAAC,CAAC;CACpC;AAED;;;;;;;+EAO+E;AAC/E,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,+BAO5F"}

package/dist/Table/TableCell.d.ts

@@ -1,12 +1,22 @@
-import type { ReactNode } from "react";
-export interface TableCellProps {
+import type { ReactNode, Ref, TdHTMLAttributes } from "react";
+export interface TableCellProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, "children"> {
     /** Right-aligns and renders tabular figures (D62). */
     numeric?: boolean;
+    /** Columns the cell spans — an empty-state row spanning the table (D85). */
+    colSpan?: number;
+    /** Renders `<th scope="row">` instead of `<td>`: the cell that names its
+     * row, an identifier say, so a screen reader reads it with every cell in
+     * the row (D85). Styled as a cell, at medium weight. */
+    rowHeader?: boolean;
     /** Cell content. */
     children?: ReactNode;
     className?: string;
+    /** Forwarded ref to the cell element. */
+    ref?: Ref<HTMLTableCellElement>;
 }
-/** `<td>`. `numeric` means right-aligned *and* tabular — a column that aligns
- * but whose digits jitter between rows defeats the purpose. */
-export declare function TableCell({ numeric, children, className }: TableCellProps): import("react").JSX.Element;
+/** `<td>`, or `<th scope="row">` with `rowHeader`. `numeric` means
+ * right-aligned *and* tabular — a column that aligns but whose digits jitter
+ * between rows defeats the purpose. Remaining attributes land on the cell
+ * (D85). */
+export declare function TableCell({ numeric, colSpan, rowHeader, children, className, ref, ...rest }: TableCellProps): import("react").JSX.Element;
 //# sourceMappingURL=TableCell.d.ts.map