@mpfrontend/ui 0.0.0-stage → 1.0.0

package/LICENSE

@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

package/README.md

@@ -1,3 +1,66 @@
-# Temporary Holding Version
+# @mpfrontend/ui
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Part of [MP Frontend](https://github.com/panahister/mpfrontend), released to the public npm registry as one cohort: every `@mpfrontend`
+package at the same exact version. Runtime: client. Install it through a workspace that `mpfrontend init`
+created, which pins the cohort and binds the scope to the registry in `.npmrc`. [Versioning](https://github.com/panahister/mpfrontend#versioning)
+states the compatibility policy and [Implementation status](https://github.com/panahister/mpfrontend/blob/main/docs/IMPLEMENTATION-STATUS.md) the
+evidence.
+
+Import `@mpfrontend/ui/tailwind.css` from the consumer's Tailwind v4 entry so its compiler scans the
+published JavaScript for structural utility classes. Import `@mpfrontend/ui/styles.css` for semantic
+token-driven state and color rules. Product values, icons, typography and DLS composition remain in the
+consumer adapter/theme. The application frame (skip link, header, navigation, page frame) is the separate
+package `@mpfrontend/app-layout`.
+
+## Dialog and one-time code
+
+`Dialog` is a modal dialog on the native `dialog` element: `aria-modal`, labelled by its `title` and described
+by its `description`, Escape and the browser's cancel call `onClose`, a focus guard keeps Tab and Shift+Tab
+inside it, and focus returns to the element that opened it. Every text is a prop (`closeLabel` names the
+close button), and it uses logical properties only.
+
+`OneTimeCodeField` accepts digits only, up to a configured `length` (4 to 10, 6 by default), with
+`autocomplete="one-time-code"` and a numeric keyboard; a pasted code keeps its digits and drops spaces,
+dashes and other characters, and a decimal digit of any script becomes its ASCII digit (`codeDigits`). It
+has an error state and never logs or stores the value.
+
+`ConfirmWithCode` confirms a sensitive action in a `Dialog`: `onConfirm(code, signal)` sends the code to
+the server through the BFF (a same-origin request with the CSRF token and an idempotency key), the browser
+never checks the code, and the code is cleared on close and on failure and never written to browser
+storage, a URL or a log. DOM behaviour (keyboard, focus, names, clearing) is tested with happy-dom 20.14.5,
+a test-only dependency chosen because the tests need focus and keyboard events without a browser.
+
+## Tree
+
+`Tree` is a controlled tree view on the WAI-ARIA tree pattern; with `columns` it is a tree table
+(`treegrid`). The consumer owns `expanded` (`onExpandedChange`) and the per-node `states`, a set it defines,
+with `stateLabels` for their visible text. Arrows move, open and close (the horizontal arrows swap in a
+right-to-left context), Home and End jump, and Enter and Space call `onActivate`, where the consumer's own
+rule decides what changes; `descendantIds(node)` helps a rule over the current children. The component has
+no access decision and no inheritance between states, and never changes the nodes it receives. Rows are
+virtualized at a fixed `rowHeight` inside a `height` viewport: ten thousand nodes render only the rows in
+view, and the focused row stays rendered. Each item carries `aria-level`, `aria-setsize`, `aria-posinset`
+and `aria-expanded`, and its accessible name includes its state label.
+
+
+## Field access in tables and forms
+
+`ResourceTable` and `ResourceForm` take `access`, a reader of `@mpfrontend/access-core` (from `useAccess()` of
+`@mpfrontend/access-react`). A column whose field may not be viewed is removed with its header. A form field that
+may not be viewed is not rendered, with its label, `helpers` text and `errors` text, and leaves validation and the
+submitted values; a field that may not be edited is disabled; a save passes `onSubmit` only the changed fields that
+may be edited, compared with `original` (`dirtyPatch`), and a changed field that may not be edited throws
+`FORBIDDEN_FIELD` instead of being sent. With `access`, `ResourceForm` requires `original`, in its type and at run time
+(`RESOURCE_FORM_ORIGINAL_REQUIRED`): without it every shown field would count as changed and be sent. A form for a new
+record passes an empty `original`. Without `access` both components behave as before. A hidden field is a
+presentation; the server still refuses a field the person may not write.
+
+## Paging, sorting and filtering
+
+`ResourceTable` takes `control`, a declared `mode` with controlled `page`, `size`, `sort` and `filters` and their
+change events, with the visible text of its controls from the consumer's catalog. In `server` mode it shows the rows
+the server returned and never sorts, filters or pages them itself; in `client` mode it filters, sorts and pages the
+rows it is given. The mode is never switched by the data. Sortable headers carry `aria-sort`; filters submit
+together; the pagination is a labelled navigation. A sort or a filter on a column the person may not view is
+ignored. `useTableUrlState` of `@mpfrontend/data-react` binds the controlled values to the URL. Without `control`,
+the table renders exactly as before.

package/dist/core.d.ts

@@ -0,0 +1,115 @@
+import { type ButtonHTMLAttributes, type InputHTMLAttributes, type SelectHTMLAttributes, type ReactNode, type Key } from 'react';
+import type { AccessReader } from '@mpfrontend/access-core';
+export type DisplayField = Readonly<{
+    key: string;
+    type: string;
+    required: boolean;
+    editable: boolean;
+    nullable: boolean;
+}>;
+export type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    tone?: 'primary' | 'secondary' | 'ghost' | 'danger';
+    loading?: boolean;
+    loadingLabel?: ReactNode;
+    restricted?: boolean;
+    leadingIcon?: ReactNode;
+    trailingIcon?: ReactNode;
+};
+export type FieldProps = InputHTMLAttributes<HTMLInputElement> & {
+    label: string;
+    helper?: string;
+    error?: string;
+};
+export type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & {
+    label: string;
+    icon?: ReactNode;
+};
+export declare function Button({ tone, loading, loadingLabel, restricted, leadingIcon, trailingIcon, children, disabled, ...props }: ButtonProps): import("react").JSX.Element;
+export declare function Field({ label, helper, error, ...props }: FieldProps): import("react").JSX.Element;
+export declare function Select({ label, children, icon, ...props }: SelectProps): import("react").JSX.Element;
+export declare function Card({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+export type TableSort = Readonly<{
+    field: string;
+    direction: 'asc' | 'desc';
+}>;
+/** The visible text of the table's controls, from the consumer's catalog. */
+export type TableText = Readonly<{
+    pagination: string;
+    previous: string;
+    next: string;
+    /** The current page and the page count, when the count is known. */
+    page: (page: number, count: number | undefined) => string;
+    size?: string;
+    apply?: string;
+    filters?: string;
+}>;
+/**
+ * The controlled state of a table and its change events. The mode is declared, never inferred: in `client` mode the
+ * table filters, sorts and pages the rows it is given; in `server` mode it shows them as the server returned them and
+ * never sorts, filters or pages them itself.
+ */
+export type TableControl = Readonly<{
+    mode: 'client' | 'server';
+    page: number;
+    size: number;
+    sort?: TableSort | undefined;
+    filters?: Readonly<Record<string, string>>;
+    /** The total number of rows the server reports (server mode). */
+    total?: number | undefined;
+    /** Whether a next page exists, when the server reports no total (server mode). */
+    hasMore?: boolean;
+    sortable?: readonly string[];
+    filterable?: readonly string[];
+    sizes?: readonly number[];
+    onPageChange: (page: number) => void;
+    onSizeChange?: (size: number) => void;
+    onSortChange?: (sort: TableSort | undefined) => void;
+    onFiltersChange?: (filters: Readonly<Record<string, string>>) => void;
+    text: TableText;
+}>;
+/**
+ * With `access`, a column whose field may not be viewed is removed with its header. Without it, every field shows.
+ * With `control`, the table has sortable headers, filters and paging bound to the controlled values; a sort or a
+ * filter on a column the person may not view is ignored. Without it, the table renders the rows as before.
+ */
+export declare function ResourceTable({ fields, rows, caption, format, labels, detail, rowKey, access, control }: {
+    fields: readonly DisplayField[];
+    rows: readonly Record<string, unknown>[];
+    caption: string;
+    format: (value: unknown) => string;
+    labels?: Readonly<Record<string, string>>;
+    detail?: (row: Record<string, unknown>) => ReactNode;
+    rowKey?: (row: Record<string, unknown>, index: number) => Key;
+    access?: AccessReader;
+    control?: TableControl;
+}): import("react").JSX.Element;
+/**
+ * With `access`, a field that may not be viewed is not rendered (its label, helper and error with it) and leaves
+ * validation and the submitted values; a field that may not be edited is disabled; a save passes `onSubmit` only the
+ * changed fields that may be edited, compared with `original` (dirtyPatch); `original` is required with `access`, in the
+ * type and at run time (`RESOURCE_FORM_ORIGINAL_REQUIRED`), because without it every shown field would count as changed
+ * and be sent; a new record passes an empty one. Without `access`, every editable field shows and `onSubmit` receives
+ * nothing, as before.
+ */
+export declare function ResourceForm({ fields, values, onChange, onSubmit, labels, saveLabel, disabled, access, original, helpers, errors }: {
+    fields: readonly DisplayField[];
+    values: Readonly<Record<string, unknown>>;
+    onChange: (key: string, value: unknown) => void;
+    onSubmit: (patch?: Record<string, unknown>) => void;
+    labels?: Readonly<Record<string, string>>;
+    saveLabel: string;
+    disabled?: boolean;
+    helpers?: Readonly<Record<string, string>>;
+    errors?: Readonly<Record<string, string>>;
+} & (Readonly<{
+    access?: undefined;
+    original?: Readonly<Record<string, unknown>>;
+}> | Readonly<{
+    access: AccessReader;
+    original: Readonly<Record<string, unknown>>;
+}>)): import("react").JSX.Element;
+export { Dialog, nextFocus, type DialogProps } from './dialog.js';
+export { OneTimeCodeField, ConfirmWithCode, codeDigits, type OneTimeCodeFieldProps, type ConfirmWithCodeProps } from './one-time-code.js';
+export { Tree, visibleRows, descendantIds, treeKey, type TreeNode, type TreeRow, type TreeColumn, type TreeMove, type TreeProps } from './tree.js';

package/dist/core.js

@@ -0,0 +1,103 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId } from 'react';
+import { buttonState, fieldState, isControlUnavailable } from '@mpfrontend/primitives/internal';
+export function Button({ tone = 'primary', loading = false, loadingLabel, restricted = false, leadingIcon, trailingIcon, children, disabled, ...props }) {
+    const state = buttonState({ disabled: disabled ?? false, loading, restricted });
+    return _jsxs("button", { ...props, disabled: isControlUnavailable(state), "aria-busy": state === 'loading' || undefined, "aria-disabled": state === 'restricted' || undefined, "data-state": state, "data-tone": tone, className: ['mp-button', 'inline-flex h-[var(--mp-control-height)] items-center justify-center gap-2 whitespace-nowrap rounded-[var(--mp-radius-control)] border-0 px-[var(--mp-control-padding)]', props.className].filter(Boolean).join(' '), children: [loading ? _jsx("span", { className: "mp-button-spinner", "aria-hidden": "true" }) : leadingIcon, _jsx("span", { children: loading ? (loadingLabel ?? children) : children }), !loading && trailingIcon] });
+}
+export function Field({ label, helper, error, ...props }) {
+    const generated = useId(), id = props.id ?? generated, description = id + '-description';
+    const state = fieldState({ disabled: props.disabled ?? false, readOnly: props.readOnly ?? false, invalid: !!error });
+    return _jsxs("label", { className: "mp-field flex max-w-full flex-col gap-[var(--mp-field-gap)]", "data-state": state, htmlFor: id, children: [_jsx("span", { className: "mp-field-label text-sm font-medium", children: label }), _jsx("input", { ...props, id: id, className: ['mp-input', 'h-[var(--mp-control-height)] w-full rounded-[var(--mp-radius-control)] border px-3', props.className].filter(Boolean).join(' '), "aria-invalid": !!error, "aria-describedby": error || helper ? description : props['aria-describedby'] }), (helper || error) && _jsx("span", { id: description, className: error ? 'mp-field-helper mp-field-error text-xs' : 'mp-field-helper text-xs', children: error ?? helper })] });
+}
+export function Select({ label, children, icon, ...props }) {
+    const generated = useId(), id = props.id ?? generated;
+    const state = fieldState({ disabled: props.disabled ?? false });
+    return _jsxs("label", { className: "mp-field flex max-w-full flex-col gap-[var(--mp-field-gap)]", "data-state": state, htmlFor: id, children: [_jsx("span", { className: "mp-field-label text-sm font-medium", children: label }), _jsxs("span", { className: "mp-select-wrap relative w-full", "data-custom-icon": icon ? 'true' : undefined, children: [_jsx("select", { ...props, id: id, className: ['mp-select', 'h-[var(--mp-control-height)] w-full rounded-[var(--mp-radius-control)] border px-3', props.className].filter(Boolean).join(' '), children: children }), icon && _jsx("span", { className: "mp-select-icon pointer-events-none absolute end-3 top-1/2 -translate-y-1/2", "aria-hidden": "true", children: icon })] })] });
+}
+export function Card({ children }) { return _jsx("section", { className: "mp-card rounded-[var(--mp-radius-surface)] border p-6", children: children }); }
+function compareValues(a, b) {
+    if (a === b)
+        return 0;
+    if (a === null || a === undefined)
+        return 1;
+    if (b === null || b === undefined)
+        return -1;
+    if (typeof a === 'number' && typeof b === 'number')
+        return a - b;
+    if (typeof a === 'boolean' && typeof b === 'boolean')
+        return a === b ? 0 : a ? 1 : -1;
+    return String(a).localeCompare(String(b));
+}
+const nextSort = (sort, field) => sort?.field !== field ? { field, direction: 'asc' } : sort.direction === 'asc' ? { field, direction: 'desc' } : undefined;
+/**
+ * With `access`, a column whose field may not be viewed is removed with its header. Without it, every field shows.
+ * With `control`, the table has sortable headers, filters and paging bound to the controlled values; a sort or a
+ * filter on a column the person may not view is ignored. Without it, the table renders the rows as before.
+ */
+export function ResourceTable({ fields, rows, caption, format, labels = {}, detail, rowKey, access, control }) {
+    const columns = access ? fields.filter(field => access.field(field.key).view) : fields;
+    const visible = new Set(columns.map(field => field.key)), hiddenField = (key) => fields.some(field => field.key === key) && !visible.has(key);
+    let shown = rows, total;
+    if (control?.mode === 'client') {
+        const filters = Object.entries(control.filters ?? {}).filter(([key, value]) => value !== '' && visible.has(key));
+        let selected = rows.filter(row => filters.every(([key, value]) => format(row[key]).toLocaleLowerCase().includes(value.toLocaleLowerCase())));
+        const sort = control.sort && visible.has(control.sort.field) ? control.sort : undefined;
+        if (sort)
+            selected = [...selected].sort((a, b) => compareValues(a[sort.field], b[sort.field]) * (sort.direction === 'asc' ? 1 : -1));
+        total = selected.length;
+        shown = selected.slice((control.page - 1) * control.size, control.page * control.size);
+    }
+    else if (control)
+        total = control.total;
+    const count = control && total !== undefined ? Math.max(1, Math.ceil(total / control.size)) : undefined;
+    const header = (field) => {
+        const label = labels[field.key] ?? field.key;
+        if (!control?.onSortChange || !control.sortable?.includes(field.key))
+            return _jsx("th", { className: "border-b p-3 text-start", scope: "col", children: label }, field.key);
+        const direction = control.sort?.field === field.key ? control.sort.direction : undefined;
+        const onSortChange = control.onSortChange;
+        return _jsx("th", { className: "border-b p-3 text-start", scope: "col", "aria-sort": direction === 'asc' ? 'ascending' : direction === 'desc' ? 'descending' : 'none', children: _jsx("button", { type: "button", className: "mp-table-sort inline-flex items-center gap-1", onClick: () => onSortChange(nextSort(control.sort, field.key)), children: label }) }, field.key);
+    };
+    const filterable = control?.onFiltersChange ? (control.filterable ?? []).filter(name => !hiddenField(name)) : [];
+    const table = _jsx("div", { className: "mp-table-wrap overflow-auto", children: _jsxs("table", { className: "w-full border-collapse", children: [_jsx("caption", { children: caption }), _jsx("thead", { children: _jsxs("tr", { children: [columns.map(header), detail && _jsx("th", { className: "border-b p-3 text-start", scope: "col", children: labels.detail ?? 'Details' })] }) }), _jsx("tbody", { children: shown.map((row, index) => _jsxs("tr", { children: [columns.map(field => _jsx("td", { className: "border-b p-3 text-start", children: format(row[field.key]) }, field.key)), detail && _jsx("td", { className: "border-b p-3 text-start", children: detail(row) })] }, rowKey ? rowKey(row, index) : index)) })] }) });
+    if (!control)
+        return table;
+    const { page, size, sizes, onSizeChange, onFiltersChange, text } = control;
+    return _jsxs("div", { className: "mp-table grid gap-4", children: [filterable.length > 0 && onFiltersChange && _jsxs("form", { role: "search", "aria-label": text.filters, className: "flex flex-wrap items-end gap-4", onSubmit: event => { event.preventDefault(); const data = new FormData(event.currentTarget); onFiltersChange(Object.fromEntries(filterable.map(name => [name, String(data.get(name) ?? '')]))); }, children: [filterable.map(name => _jsx(Field, { name: name, label: labels[name] ?? name, defaultValue: control.filters?.[name] ?? '' }, name)), _jsx(Button, { type: "submit", tone: "secondary", children: text.apply })] }, JSON.stringify(control.filters ?? {})), table, _jsxs("nav", { "aria-label": text.pagination, className: "flex flex-wrap items-center gap-4", children: [_jsx(Button, { type: "button", tone: "ghost", disabled: page <= 1, onClick: () => control.onPageChange(page - 1), children: text.previous }), _jsx("span", { children: text.page(page, count) }), _jsx(Button, { type: "button", tone: "ghost", disabled: count !== undefined ? page >= count : control.hasMore !== true, onClick: () => control.onPageChange(page + 1), children: text.next }), sizes && onSizeChange && _jsx(Select, { label: text.size ?? '', value: String(size), onChange: event => onSizeChange(Number(event.target.value)), children: sizes.map(option => _jsx("option", { value: option, children: option }, option)) })] })] });
+}
+/**
+ * With `access`, a field that may not be viewed is not rendered (its label, helper and error with it) and leaves
+ * validation and the submitted values; a field that may not be edited is disabled; a save passes `onSubmit` only the
+ * changed fields that may be edited, compared with `original` (dirtyPatch); `original` is required with `access`, in the
+ * type and at run time (`RESOURCE_FORM_ORIGINAL_REQUIRED`), because without it every shown field would count as changed
+ * and be sent; a new record passes an empty one. Without `access`, every editable field shows and `onSubmit` receives
+ * nothing, as before.
+ */
+export function ResourceForm({ fields, values, onChange, onSubmit, labels = {}, saveLabel, disabled = false, access, original, helpers = {}, errors = {} }) {
+    if (access && original === undefined)
+        throw new Error('RESOURCE_FORM_ORIGINAL_REQUIRED');
+    const editable = fields.filter(field => field.editable);
+    if (editable.some(field => !['string', 'boolean', 'number', 'integer'].includes(field.type)))
+        throw new Error('UNSUPPORTED_FORM_FIELD');
+    const shown = access ? editable.filter(field => access.field(field.key).view) : editable;
+    const locked = (field) => disabled || (access ? !access.field(field.key).edit : false);
+    const unavailable = disabled || shown.length === 0 || shown.every(locked);
+    const submit = () => {
+        if (unavailable)
+            return;
+        if (!access) {
+            onSubmit();
+            return;
+        }
+        // Only the fields shown are compared, so a hidden field never leaves; a changed field that may not be edited
+        // throws FORBIDDEN_FIELD instead of being sent.
+        onSubmit(access.patch(original ?? {}, Object.fromEntries(shown.filter(field => Object.hasOwn(values, field.key)).map(field => [field.key, values[field.key]]))));
+    };
+    return _jsxs("form", { className: "mp-form grid gap-4", onSubmit: event => { event.preventDefault(); submit(); }, children: [shown.map(field => _jsx(Field, { label: labels[field.key] ?? field.key, name: field.key, required: field.required && field.type !== 'boolean', disabled: locked(field), ...(helpers[field.key] !== undefined ? { helper: helpers[field.key] } : {}), ...(errors[field.key] !== undefined ? { error: errors[field.key] } : {}), type: field.type === 'boolean' ? 'checkbox' : field.type === 'number' || field.type === 'integer' ? 'number' : 'text', step: field.type === 'number' ? 'any' : field.type === 'integer' ? 1 : undefined, checked: field.type === 'boolean' ? values[field.key] === true : undefined, value: field.type === 'boolean' ? undefined : String(values[field.key] ?? ''), onChange: event => onChange(field.key, field.type === 'boolean' ? event.target.checked : field.type === 'number' || field.type === 'integer' ? event.target.valueAsNumber : event.target.value) }, field.key)), _jsx(Button, { disabled: unavailable, type: "submit", tone: "secondary", children: saveLabel })] });
+}
+export { Dialog, nextFocus } from './dialog.js';
+export { OneTimeCodeField, ConfirmWithCode, codeDigits } from './one-time-code.js';
+export { Tree, visibleRows, descendantIds, treeKey } from './tree.js';
+//# sourceMappingURL=core.js.map

package/dist/core.js.map

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

package/dist/dialog.d.ts

@@ -0,0 +1,19 @@
+import { type ReactNode } from 'react';
+/** The next element of a Tab or Shift+Tab press inside a trap: the ends wrap around. */
+export declare function nextFocus<T>(elements: readonly T[], current: T | null, backwards: boolean): T | undefined;
+export type DialogProps = {
+    open: boolean;
+    title: ReactNode;
+    /** Called on Escape, on the close button and on the browser's own cancel; the parent closes the dialog. */
+    onClose: () => void;
+    /** The accessible name of the close button; every visible text is the consumer's. */
+    closeLabel: string;
+    children: ReactNode;
+    description?: ReactNode;
+};
+/**
+ * A modal dialog on the native dialog element: aria-modal, labelled by its title (and described by its
+ * description), Escape closes it, a focus guard keeps Tab inside it, and focus returns to the element that
+ * opened it. It uses logical properties only, so it reads the same in both directions.
+ */
+export declare function Dialog({ open, title, onClose, closeLabel, children, description }: DialogProps): import("react").JSX.Element;

package/dist/dialog.js

@@ -0,0 +1,66 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef } from 'react';
+const focusable = 'a[href],button:not([disabled]),input:not([disabled]):not([type="hidden"]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex="-1"])';
+/** The next element of a Tab or Shift+Tab press inside a trap: the ends wrap around. */
+export function nextFocus(elements, current, backwards) {
+    if (!elements.length)
+        return undefined;
+    const index = current === null ? -1 : elements.indexOf(current);
+    if (backwards)
+        return index <= 0 ? elements[elements.length - 1] : elements[index - 1];
+    return index < 0 || index === elements.length - 1 ? elements[0] : elements[index + 1];
+}
+/**
+ * A modal dialog on the native dialog element: aria-modal, labelled by its title (and described by its
+ * description), Escape closes it, a focus guard keeps Tab inside it, and focus returns to the element that
+ * opened it. It uses logical properties only, so it reads the same in both directions.
+ */
+export function Dialog({ open, title, onClose, closeLabel, children, description }) {
+    const ref = useRef(null), opener = useRef(null);
+    const titleId = useId(), descriptionId = useId();
+    useEffect(() => {
+        const dialog = ref.current;
+        if (!dialog)
+            return;
+        if (open) {
+            opener.current = document.activeElement;
+            if (!dialog.open) {
+                if (typeof dialog.showModal === 'function')
+                    dialog.showModal();
+                else
+                    dialog.setAttribute('open', '');
+            }
+            const first = dialog.querySelector('[data-autofocus]') ?? dialog.querySelector(focusable);
+            (first ?? dialog).focus();
+            return;
+        }
+        if (dialog.open) {
+            if (typeof dialog.close === 'function')
+                dialog.close();
+            else
+                dialog.removeAttribute('open');
+        }
+        const previous = opener.current;
+        opener.current = null;
+        if (previous && typeof previous.focus === 'function' && previous.isConnected)
+            previous.focus();
+    }, [open]);
+    function keyDown(event) {
+        if (event.key === 'Escape') {
+            event.preventDefault();
+            onClose();
+            return;
+        }
+        if (event.key !== 'Tab')
+            return;
+        const elements = [...event.currentTarget.querySelectorAll(focusable)];
+        const target = nextFocus(elements, document.activeElement, event.shiftKey);
+        if (target) {
+            event.preventDefault();
+            target.focus();
+        }
+    }
+    return _jsx("dialog", { ref: ref, "aria-modal": "true", "aria-labelledby": titleId, "aria-describedby": description === undefined ? undefined : descriptionId, onKeyDown: keyDown, onCancel: event => { event.preventDefault(); onClose(); }, className: "mp-dialog m-auto w-[min(100%-2rem,32rem)] rounded-[var(--mp-radius-surface)] border p-6", children: open && _jsxs("div", { className: "grid gap-4", children: [_jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsx("h2", { id: titleId, className: "m-0 text-start text-xl font-semibold", children: title }), _jsx("button", { type: "button", className: "mp-dialog-close rounded-[var(--mp-radius-control)] px-2", "aria-label": closeLabel, onClick: onClose, children: "\u00D7" })] }), description !== undefined && _jsx("p", { id: descriptionId, className: "m-0", children: description }), children] }) });
+}
+//# sourceMappingURL=dialog.js.map

package/dist/dialog.js.map

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

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { Button, type ButtonProps, Card, codeDigits, ConfirmWithCode, type ConfirmWithCodeProps, descendantIds, Dialog, type DialogProps, type DisplayField, Field, type FieldProps, OneTimeCodeField, type OneTimeCodeFieldProps, ResourceForm, ResourceTable, Select, type SelectProps, type TableControl, type TableSort, type TableText, Tree, type TreeColumn, type TreeMove, type TreeNode, type TreeProps, type TreeRow, } from './core.js';

package/dist/index.js

@@ -0,0 +1,2 @@
+export { Button, Card, codeDigits, ConfirmWithCode, descendantIds, Dialog, Field, OneTimeCodeField, ResourceForm, ResourceTable, Select, Tree, } from './core.js';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,EAEN,IAAI,EACJ,UAAU,EACV,eAAe,EAEf,aAAa,EACb,MAAM,EAGN,KAAK,EAEL,gBAAgB,EAEhB,YAAY,EACZ,aAAa,EACb,MAAM,EAKN,IAAI,GAML,MAAM,WAAW,CAAC"}

package/dist/internal.d.ts

@@ -0,0 +1 @@
+export { nextFocus, treeKey, visibleRows } from './core.js';

package/dist/internal.js

@@ -0,0 +1,3 @@
+// For the cohort's own packages: outside the compatibility guarantee (README "Versioning").
+export { nextFocus, treeKey, visibleRows } from './core.js';
+//# sourceMappingURL=internal.js.map

package/dist/internal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../src/internal.ts"],"names":[],"mappings":"AAAA,4FAA4F;AAC5F,OAAO,EAAC,SAAS,EAAC,OAAO,EAAC,WAAW,EAAC,MAAM,WAAW,CAAC"}

package/dist/one-time-code.d.ts

@@ -0,0 +1,49 @@
+import { type ReactNode } from 'react';
+/**
+ * The digits of typed or pasted input, at most `length` of them: every Unicode decimal digit, of any script,
+ * becomes its ASCII digit, and every other character (spaces, dashes, letters, other numerals) is dropped.
+ * The value is never checked here.
+ */
+export declare function codeDigits(input: string, length: number): string;
+export type OneTimeCodeFieldProps = {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    /** Digits in a code; 4 to 10, 6 by default. */
+    length?: number;
+    helper?: string;
+    error?: string;
+    disabled?: boolean;
+    name?: string;
+};
+/**
+ * A one-time-code field: one input that accepts digits only, of a configured length, with
+ * autocomplete="one-time-code" so that the platform can offer a received code, paste of a formatted code,
+ * and an error state. It never logs or stores the value.
+ */
+export declare function OneTimeCodeField({ label, value, onChange, length, helper, error, disabled, name }: OneTimeCodeFieldProps): import("react").JSX.Element;
+export type ConfirmWithCodeProps = {
+    open: boolean;
+    title: ReactNode;
+    description?: ReactNode;
+    length?: number;
+    labels: Readonly<{
+        code: string;
+        confirm: string;
+        cancel: string;
+        close: string;
+        failed: string;
+        sending?: string;
+    }>;
+    /**
+     * Sends the code to the server through the BFF (a same-origin request with the CSRF token and an
+     * idempotency key) and resolves when the server accepted it. The browser never checks the code.
+     */
+    onConfirm: (code: string, signal: AbortSignal) => Promise<void>;
+    onClose: () => void;
+};
+/**
+ * Confirms a sensitive action with a code sent to the person. The code lives in component state only: it
+ * is cleared on close and on failure, and never written to browser storage, a URL or a log.
+ */
+export declare function ConfirmWithCode({ open, title, description, length, labels, onConfirm, onClose }: ConfirmWithCodeProps): import("react").JSX.Element;

package/dist/one-time-code.js

@@ -0,0 +1,86 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef, useState } from 'react';
+import { Button } from './core.js';
+import { Dialog } from './dialog.js';
+const decimalDigit = /^\p{Nd}$/u;
+/**
+ * The value of a Unicode decimal digit (general category Nd), or `undefined` for any other character.
+ * Unicode encodes decimal digits in contiguous runs of ten, zero first, so a digit's value is its distance
+ * from the start of its run of digits, modulo ten.
+ */
+function digitValue(point) {
+    if (!decimalDigit.test(String.fromCodePoint(point)))
+        return undefined;
+    let start = point;
+    while (start > 0 && decimalDigit.test(String.fromCodePoint(start - 1)))
+        start--;
+    return (point - start) % 10;
+}
+/**
+ * The digits of typed or pasted input, at most `length` of them: every Unicode decimal digit, of any script,
+ * becomes its ASCII digit, and every other character (spaces, dashes, letters, other numerals) is dropped.
+ * The value is never checked here.
+ */
+export function codeDigits(input, length) {
+    let digits = '';
+    for (const character of input) {
+        const value = digitValue(character.codePointAt(0));
+        if (value !== undefined)
+            digits += String(value);
+        if (digits.length === length)
+            break;
+    }
+    return digits;
+}
+/**
+ * A one-time-code field: one input that accepts digits only, of a configured length, with
+ * autocomplete="one-time-code" so that the platform can offer a received code, paste of a formatted code,
+ * and an error state. It never logs or stores the value.
+ */
+export function OneTimeCodeField({ label, value, onChange, length = 6, helper, error, disabled = false, name }) {
+    if (!Number.isSafeInteger(length) || length < 4 || length > 10)
+        throw new Error('INVALID_CODE_LENGTH');
+    const id = useId(), description = id + '-description';
+    return _jsxs("label", { className: "mp-field flex max-w-full flex-col gap-[var(--mp-field-gap)]", "data-state": disabled ? 'disabled' : error ? 'error' : 'default', htmlFor: id, children: [_jsx("span", { className: "mp-field-label text-sm font-medium", children: label }), _jsx("input", { id: id, name: name, className: "mp-input mp-code-input h-[var(--mp-control-height)] w-full rounded-[var(--mp-radius-control)] border px-3 tracking-[0.3em]", type: "text", inputMode: "numeric", autoComplete: "one-time-code", pattern: '[0-9]{' + length + '}', maxLength: length * 3, dir: "ltr", spellCheck: false, disabled: disabled, required: true, value: value, "aria-invalid": error !== undefined, "aria-describedby": error || helper ? description : undefined, onChange: event => onChange(codeDigits(event.target.value, length)) }), (helper || error) && _jsx("span", { id: description, className: error ? 'mp-field-helper mp-field-error text-xs' : 'mp-field-helper text-xs', children: error ?? helper })] });
+}
+/**
+ * Confirms a sensitive action with a code sent to the person. The code lives in component state only: it
+ * is cleared on close and on failure, and never written to browser storage, a URL or a log.
+ */
+export function ConfirmWithCode({ open, title, description, length = 6, labels, onConfirm, onClose }) {
+    const [code, setCode] = useState(''), [status, setStatus] = useState('idle');
+    const active = useRef(null);
+    useEffect(() => { if (!open) {
+        active.current?.abort();
+        active.current = null;
+        setCode('');
+        setStatus('idle');
+    } }, [open]);
+    useEffect(() => () => active.current?.abort(), []);
+    async function submit(event) {
+        event.preventDefault();
+        if (code.length !== length || status === 'sending')
+            return;
+        const controller = new AbortController();
+        active.current = controller;
+        setStatus('sending');
+        try {
+            await onConfirm(code, controller.signal);
+            if (!controller.signal.aborted) {
+                setCode('');
+                setStatus('idle');
+            }
+        }
+        catch {
+            if (!controller.signal.aborted) {
+                setCode('');
+                setStatus('failed');
+            }
+        }
+    }
+    function close() { active.current?.abort(); setCode(''); setStatus('idle'); onClose(); }
+    return _jsx(Dialog, { open: open, title: title, description: description, onClose: close, closeLabel: labels.close, children: _jsxs("form", { className: "grid gap-4", onSubmit: submit, children: [_jsx(OneTimeCodeField, { label: labels.code, value: code, onChange: value => { setCode(value); if (status === 'failed')
+                        setStatus('idle'); }, length: length, disabled: status === 'sending', ...(status === 'failed' ? { error: labels.failed } : {}) }), _jsxs("div", { className: "flex flex-wrap justify-end gap-2", children: [_jsx(Button, { type: "button", tone: "ghost", onClick: close, children: labels.cancel }), _jsx(Button, { type: "submit", disabled: code.length !== length, loading: status === 'sending', ...(labels.sending ? { loadingLabel: labels.sending } : {}), children: labels.confirm })] })] }) });
+}
+//# sourceMappingURL=one-time-code.js.map

package/dist/one-time-code.js.map

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

package/dist/tree.d.ts

@@ -0,0 +1,64 @@
+import { type ReactNode } from 'react';
+/** A node of a hierarchy; the component reads it and never changes it. */
+export type TreeNode<T = unknown> = Readonly<{
+    id: string;
+    label: string;
+    children?: readonly TreeNode<T>[];
+    data?: T;
+}>;
+/** A visible row: the node with its position in the WAI-ARIA tree structure. */
+export type TreeRow<T = unknown> = Readonly<{
+    node: TreeNode<T>;
+    level: number;
+    setSize: number;
+    position: number;
+    parentId?: string;
+    expandable: boolean;
+    expanded: boolean;
+}>;
+export type TreeColumn<T = unknown> = Readonly<{
+    key: string;
+    header: ReactNode;
+    cell: (node: TreeNode<T>) => ReactNode;
+}>;
+/** The rows a person can see: depth first, children only under expanded nodes. */
+export declare function visibleRows<T>(nodes: readonly TreeNode<T>[], expanded: ReadonlySet<string>): TreeRow<T>[];
+/** Every descendant id of a node, for a consumer's bulk rule over the current children; read only. */
+export declare function descendantIds<T>(node: TreeNode<T>): string[];
+export type TreeMove = Readonly<{
+    focus?: string;
+    expand?: string;
+    collapse?: string;
+    activate?: string;
+}>;
+/**
+ * The WAI-ARIA tree keyboard model for one key press. In a right-to-left context the horizontal arrows swap,
+ * so that the arrow toward the start of the line always closes and moves to the parent.
+ */
+export declare function treeKey<T>(rows: readonly TreeRow<T>[], current: string | undefined, key: string, direction: 'ltr' | 'rtl'): TreeMove | undefined;
+export type TreeProps<T, S extends string> = {
+    /** The accessible name of the tree. */
+    label: string;
+    nodes: readonly TreeNode<T>[];
+    /** Controlled: the ids of expanded nodes. */
+    expanded: ReadonlySet<string>;
+    onExpandedChange: (next: ReadonlySet<string>) => void;
+    /** Controlled: the consumer-defined state of each node, and the visible text of each state. */
+    states?: Readonly<Record<string, S | undefined>>;
+    stateLabels?: Readonly<Record<S, string>>;
+    /** Enter or Space on a node; the consumer's rule decides what changes, the component decides nothing. */
+    onActivate?: (node: TreeNode<T>) => void;
+    /** Columns make it a tree table (role treegrid); the first column is the node label. */
+    columns?: readonly TreeColumn<T>[];
+    labelHeader?: ReactNode;
+    /** Rows are virtualized: a fixed row height and the viewport height in pixels. */
+    rowHeight?: number;
+    height?: number;
+    direction?: 'ltr' | 'rtl';
+};
+/**
+ * A controlled tree view, or a tree table with columns, on the WAI-ARIA tree pattern: arrows move, open and
+ * close, Home and End jump, Enter and Space activate, with roving focus. Only the rows in view are rendered,
+ * so that thousands of nodes stay responsive. It holds no access rule and no inheritance between states.
+ */
+export declare function Tree<T, S extends string = string>({ label, nodes, expanded, onExpandedChange, states, stateLabels, onActivate, columns, labelHeader, rowHeight, height, direction }: TreeProps<T, S>): import("react").JSX.Element;

package/dist/tree.js

@@ -0,0 +1,127 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, useMemo, useRef, useState } from 'react';
+/** The rows a person can see: depth first, children only under expanded nodes. */
+export function visibleRows(nodes, expanded) {
+    const rows = [];
+    const visit = (list, level, parentId) => {
+        list.forEach((node, index) => {
+            const expandable = (node.children?.length ?? 0) > 0, open = expandable && expanded.has(node.id);
+            rows.push({ node, level, setSize: list.length, position: index + 1, ...(parentId === undefined ? {} : { parentId }), expandable, expanded: open });
+            if (open)
+                visit(node.children, level + 1, node.id);
+        });
+    };
+    visit(nodes, 1);
+    return rows;
+}
+/** Every descendant id of a node, for a consumer's bulk rule over the current children; read only. */
+export function descendantIds(node) {
+    const ids = [];
+    const visit = (list) => { for (const child of list ?? []) {
+        ids.push(child.id);
+        visit(child.children);
+    } };
+    visit(node.children);
+    return ids;
+}
+/**
+ * The WAI-ARIA tree keyboard model for one key press. In a right-to-left context the horizontal arrows swap,
+ * so that the arrow toward the start of the line always closes and moves to the parent.
+ */
+export function treeKey(rows, current, key, direction) {
+    const index = Math.max(0, rows.findIndex(row => row.node.id === current)), row = rows[index];
+    if (!row)
+        return undefined;
+    const inward = direction === 'rtl' ? 'ArrowLeft' : 'ArrowRight', outward = direction === 'rtl' ? 'ArrowRight' : 'ArrowLeft';
+    switch (key) {
+        case 'ArrowDown': return { focus: rows[Math.min(rows.length - 1, index + 1)].node.id };
+        case 'ArrowUp': return { focus: rows[Math.max(0, index - 1)].node.id };
+        case 'Home': return { focus: rows[0].node.id };
+        case 'End': return { focus: rows[rows.length - 1].node.id };
+        case 'Enter':
+        case ' ': return { activate: row.node.id };
+        case inward:
+            if (row.expandable && !row.expanded)
+                return { expand: row.node.id };
+            if (row.expanded)
+                return { focus: rows[index + 1].node.id };
+            return {};
+        case outward:
+            if (row.expanded)
+                return { collapse: row.node.id };
+            return row.parentId === undefined ? {} : { focus: row.parentId };
+        default: return undefined;
+    }
+}
+/**
+ * A controlled tree view, or a tree table with columns, on the WAI-ARIA tree pattern: arrows move, open and
+ * close, Home and End jump, Enter and Space activate, with roving focus. Only the rows in view are rendered,
+ * so that thousands of nodes stay responsive. It holds no access rule and no inheritance between states.
+ */
+export function Tree({ label, nodes, expanded, onExpandedChange, states, stateLabels, onActivate, columns, labelHeader, rowHeight = 40, height = 480, direction }) {
+    const rows = useMemo(() => visibleRows(nodes, expanded), [nodes, expanded]);
+    const [active, setActive] = useState(undefined), [scroll, setScroll] = useState(0);
+    const viewport = useRef(null), base = useId();
+    const current = rows.some(row => row.node.id === active) ? active : rows[0]?.node.id;
+    const overscan = 4, first = Math.max(0, Math.floor(scroll / rowHeight) - overscan);
+    const last = Math.min(rows.length, Math.ceil((scroll + height) / rowHeight) + overscan);
+    const currentIndex = rows.findIndex(row => row.node.id === current);
+    // The focused row stays rendered when it is scrolled out of view, so that focus is never lost.
+    const indexes = [...Array.from({ length: Math.max(0, last - first) }, (_, i) => first + i)];
+    if (currentIndex >= 0 && (currentIndex < first || currentIndex >= last))
+        indexes.push(currentIndex);
+    const grid = columns !== undefined && columns.length > 0;
+    const id = (nodeId) => base + '-' + encodeURIComponent(nodeId);
+    function move(target) {
+        if (target === undefined)
+            return;
+        setActive(target);
+        const index = rows.findIndex(row => row.node.id === target), element = viewport.current;
+        if (element && index >= 0) {
+            if (index * rowHeight < element.scrollTop)
+                element.scrollTop = index * rowHeight;
+            else if ((index + 1) * rowHeight > element.scrollTop + height)
+                element.scrollTop = (index + 1) * rowHeight - height;
+            setScroll(element.scrollTop);
+        }
+        queueMicrotask(() => document.getElementById(id(target))?.focus());
+    }
+    function keyDown(event) {
+        const resolved = direction ?? ((event.currentTarget.closest('[dir]')?.getAttribute('dir') === 'rtl') ? 'rtl' : 'ltr');
+        const result = treeKey(rows, current, event.key, resolved);
+        if (!result)
+            return;
+        event.preventDefault();
+        if (result.expand)
+            onExpandedChange(new Set([...expanded, result.expand]));
+        if (result.collapse) {
+            const next = new Set(expanded);
+            next.delete(result.collapse);
+            onExpandedChange(next);
+        }
+        if (result.activate) {
+            const row = rows.find(entry => entry.node.id === result.activate);
+            if (row)
+                onActivate?.(row.node);
+        }
+        move(result.focus);
+    }
+    const label_ = (row) => {
+        const state = states?.[row.node.id], stateLabel = state === undefined ? undefined : stateLabels?.[state];
+        return _jsxs("span", { className: "flex min-w-0 items-center gap-2 ps-[calc(var(--mp-tree-level)*1.25rem)]", children: [_jsx("span", { "aria-hidden": "true", className: 'mp-tree-toggle inline-block w-4 text-center' + (row.expanded ? '' : ' rtl:-scale-x-100'), children: row.expandable ? (row.expanded ? '▾' : '▸') : '' }), _jsx("span", { id: id(row.node.id) + '-name', className: "truncate", children: row.node.label }), stateLabel !== undefined && _jsx("span", { id: id(row.node.id) + '-state', className: "mp-tree-state ms-auto text-xs", "data-state": state, children: stateLabel })] });
+    };
+    return _jsxs("div", { ref: viewport, role: grid ? 'treegrid' : 'tree', "aria-label": label, "aria-rowcount": grid ? rows.length + 1 : undefined, className: "mp-tree relative overflow-auto rounded-[var(--mp-radius-control)] border h-[var(--mp-tree-height)]", style: { '--mp-tree-height': height + 'px' }, onKeyDown: keyDown, onScroll: (event) => setScroll(event.currentTarget.scrollTop), children: [grid && _jsxs("div", { role: "row", "aria-rowindex": 1, className: "mp-tree-header sticky top-0 z-10 flex border-b", children: [_jsx("span", { role: "columnheader", className: "flex-1 p-2 text-start", children: labelHeader }), columns.map(column => _jsx("span", { role: "columnheader", className: "w-40 p-2 text-start", children: column.header }, column.key))] }), _jsx("div", { className: "relative h-[var(--mp-tree-total)]", style: { '--mp-tree-total': rows.length * rowHeight + 'px' }, role: grid ? 'rowgroup' : 'none', children: indexes.map(index => {
+                    const row = rows[index], focused = row.node.id === current, state = states?.[row.node.id];
+                    const shared = { id: id(row.node.id), tabIndex: focused ? 0 : -1, 'aria-level': row.level, 'aria-setsize': row.setSize, 'aria-posinset': row.position,
+                        ...(row.expandable ? { 'aria-expanded': row.expanded } : {}),
+                        'aria-labelledby': id(row.node.id) + '-name' + (state !== undefined && stateLabels?.[state] !== undefined ? ' ' + id(row.node.id) + '-state' : ''),
+                        'data-focused': focused || undefined, onFocus: () => setActive(row.node.id), onClick: () => { setActive(row.node.id); onActivate?.(row.node); },
+                        className: 'mp-tree-item absolute inset-x-0 flex h-[var(--mp-tree-row)] translate-y-[var(--mp-tree-offset)] cursor-pointer items-center',
+                        style: { '--mp-tree-row': rowHeight + 'px', '--mp-tree-offset': index * rowHeight + 'px', '--mp-tree-level': row.level - 1 } };
+                    return grid
+                        ? _jsxs("div", { role: "row", "aria-rowindex": index + 2, ...shared, children: [_jsx("span", { role: "gridcell", className: "flex-1 p-2 text-start", children: label_(row) }), columns.map(column => _jsx("span", { role: "gridcell", className: "w-40 p-2 text-start", children: column.cell(row.node) }, column.key))] }, row.node.id)
+                        : _jsx("div", { role: "treeitem", ...shared, children: _jsx("span", { className: "flex-1 px-2", children: label_(row) }) }, row.node.id);
+                }) })] });
+}
+//# sourceMappingURL=tree.js.map

package/dist/tree.js.map

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

package/package.json

@@ -1,6 +1,48 @@
 {
   "name": "@mpfrontend/ui",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "1.0.0",
+  "license": "Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/panahister/mpfrontend.git",
+    "directory": "packages/ui"
+  },
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./src/styles.css",
+    "./tailwind.css": "./src/tailwind.css",
+    "./internal": {
+      "types": "./dist/internal.d.ts",
+      "import": "./dist/internal.js"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "src/styles.css",
+    "src/tailwind.css"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
+  "dependencies": {
+    "@mpfrontend/access-core": "1.0.0",
+    "@mpfrontend/primitives": "1.0.0"
+  },
+  "devDependencies": {
+    "@happy-dom/global-registrator": "20.14.5",
+    "happy-dom": "20.14.5"
+  },
+  "peerDependencies": {
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
+    "tailwindcss": ">=4 <5"
+  }
 }

package/src/styles.css

@@ -0,0 +1,36 @@
+.mp-button { font:inherit; background:var(--mp-action-primary); color:var(--mp-on-primary); cursor:pointer; }
+.mp-button:not(:disabled):hover { background:var(--mp-action-primaryhover); }
+.mp-button:not(:disabled):active { background:var(--mp-action-primarypressed); }
+.mp-button:focus-visible { outline:2px solid var(--mp-focus-ring); outline-offset:2px; }
+.mp-button[data-tone="secondary"] { background:var(--mp-action-secondary); color:var(--mp-foreground-primary); border:1px solid var(--mp-border-subtle); }
+.mp-button[data-tone="secondary"]:not(:disabled):hover { background:var(--mp-action-secondaryhover); }
+.mp-button[data-tone="ghost"] { background:transparent; color:var(--mp-foreground-primary); }
+.mp-button[data-tone="ghost"]:not(:disabled):hover { background:var(--mp-surface-subtle); }
+.mp-button[data-tone="danger"] { background:var(--mp-action-danger); color:var(--mp-foreground-inverse,var(--mp-on-primary)); }
+.mp-button[data-tone="danger"]:not(:disabled):hover { filter:brightness(0.92); }
+.mp-button:disabled { color:var(--mp-foreground-disabled); background:var(--mp-surface-subtle); cursor:not-allowed; }
+.mp-button-spinner { width:1rem; height:1rem; border:1.5px solid currentColor; border-inline-end-color:transparent; border-radius:50%; animation:mp-spin .8s linear infinite; }
+@keyframes mp-spin { to { transform:rotate(360deg); } }
+@media (prefers-reduced-motion:reduce) { .mp-button-spinner { animation-duration:1.8s; } }
+.mp-field { font-family:var(--mp-font-family); }
+.mp-field-label { color:var(--mp-foreground-primary); }
+.mp-input,.mp-select { box-sizing:border-box; border-color:var(--mp-border-default); background:var(--mp-surface-panel); color:var(--mp-foreground-primary); font:inherit; }
+.mp-input::placeholder { color:var(--mp-foreground-muted); }
+.mp-input:disabled,.mp-select:disabled { color:var(--mp-foreground-disabled); background:var(--mp-surface-subtle); }
+.mp-input[aria-invalid="true"] { border-color:var(--mp-status-error); }
+.mp-field-helper { color:var(--mp-foreground-secondary); }
+.mp-field-error { color:var(--mp-status-error); }
+.mp-select-wrap[data-custom-icon="true"]>.mp-select { appearance:none; padding-inline-end:2.75rem; }
+.mp-card { background:var(--mp-surface-panel); border-color:var(--mp-border-default); }
+.mp-table-wrap th,.mp-table-wrap td { border-color:var(--mp-border-default); }
+.mp-table-wrap th { color:var(--mp-foreground-secondary); }
+.mp-table-wrap caption { text-align:start; padding-block:1rem; }
+.mp-dialog { background:var(--mp-surface-panel); color:var(--mp-foreground-primary); border-color:var(--mp-border-default); }
+.mp-dialog::backdrop { background:color-mix(in srgb, var(--mp-surface-canvas) 70%, transparent); }
+.mp-dialog-close { background:transparent; color:var(--mp-foreground-secondary); border:0; cursor:pointer; font:inherit; }
+.mp-dialog-close:focus-visible { outline:2px solid var(--mp-focus-ring); outline-offset:2px; }
+.mp-tree { border-color:var(--mp-border-default); background:var(--mp-surface-panel); }
+.mp-tree-header { background:var(--mp-surface-panel); border-color:var(--mp-border-default); color:var(--mp-foreground-secondary); }
+.mp-tree-item:hover { background:var(--mp-surface-subtle); }
+.mp-tree-item:focus-visible { outline:2px solid var(--mp-focus-ring); outline-offset:-2px; }
+.mp-tree-state { color:var(--mp-foreground-secondary); }

package/src/tailwind.css

@@ -0,0 +1,2 @@
+/* Registers the compiled package output as a Tailwind v4 source in consuming applications. */
+@source "../dist/**/*.js";