@cratis/components 3.6.0 → 4.0.0

package/dist/esm/Common/normalizeIconClass.js.map

@@ -1 +1 @@
-{"version":3,"file":"normalizeIconClass.js","sources":["../../../Common/normalizeIconClass.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AAeA;;;;;;;;;;;;;;;;;AAiBG;AACG,SAAU,kBAAkB,CAAC,IAAY,EAAA;AAC3C,IAAA,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE;AAC3B,IAAA,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE;AACtB,QAAA,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE;IAC5B;;AAGA,IAAA,IAAI,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;AACvB,QAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE;IACjC;;AAGA,IAAA,IAAI,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE;AAC3B,QAAA,OAAO,EAAE,SAAS,EAAE,CAAA,MAAA,EAAS,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA,CAAE,EAAE;IAChE;;;IAIA,IAAI,OAAO,KAAK,IAAI,IAAI,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;QACvD,OAAO;AACH,YAAA,SAAS,EAAE,OAAO;AAClB,YAAA,OAAO,EAAE,CAAA,sBAAA,EAAyB,OAAO,CAAA,qIAAA,EAAwI,OAAO,CAAA,wBAAA,CAA0B;SACrN;IACL;AAEA,IAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE;AACjC;;"}
+{"version":3,"file":"normalizeIconClass.js","sources":["../../../Common/normalizeIconClass.ts"],"sourcesContent":[null],"names":[],"mappings":"AAkBM,SAAU,kBAAkB,CAAC,IAAY,EAAA;IAC3C,OAAO,EAAE,SAAS,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE;AACrC;;"}

package/dist/esm/Common/reactAriaProps.d.ts

@@ -0,0 +1,7 @@
+import type { ButtonHTMLAttributes, HTMLAttributes } from 'react';
+import type { ButtonProps } from 'react-aria-components/Button';
+import type { ListBoxItemProps, ListBoxProps } from 'react-aria-components/Select';
+export declare const asReactAriaButtonProps: (attributes: ButtonHTMLAttributes<HTMLButtonElement> | undefined) => ButtonProps | undefined;
+export declare const asReactAriaListBoxProps: <T>(attributes: HTMLAttributes<HTMLDivElement> | undefined) => ListBoxProps<T> | undefined;
+export declare const asReactAriaListBoxItemProps: <T>(attributes: HTMLAttributes<HTMLDivElement> | undefined) => ListBoxItemProps<T> | undefined;
+//# sourceMappingURL=reactAriaProps.d.ts.map

package/dist/esm/Common/reactAriaProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactAriaProps.d.ts","sourceRoot":"","sources":["../../../Common/reactAriaProps.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAChE,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAWnF,eAAO,MAAM,sBAAsB,GAC/B,YAAY,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,SAAS,KAChE,WAAW,GAAG,SAGmC,CAAC;AAErD,eAAO,MAAM,uBAAuB,GAAI,CAAC,EACrC,YAAY,cAAc,CAAC,cAAc,CAAC,GAAG,SAAS,KACvD,YAAY,CAAC,CAAC,CAAC,GAAG,SAGmC,CAAC;AAEzD,eAAO,MAAM,2BAA2B,GAAI,CAAC,EACzC,YAAY,cAAc,CAAC,cAAc,CAAC,GAAG,SAAS,KACvD,gBAAgB,CAAC,CAAC,CAAC,GAAG,SAGmC,CAAC"}

package/dist/esm/Common/reactAriaProps.js

@@ -0,0 +1,6 @@
+const asReactAriaButtonProps = (attributes) => attributes;
+const asReactAriaListBoxProps = (attributes) => attributes;
+const asReactAriaListBoxItemProps = (attributes) => attributes;
+
+export { asReactAriaButtonProps, asReactAriaListBoxItemProps, asReactAriaListBoxProps };
+//# sourceMappingURL=reactAriaProps.js.map

package/dist/esm/Common/reactAriaProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactAriaProps.js","sources":["../../../Common/reactAriaProps.ts"],"sourcesContent":[null],"names":[],"mappings":"AAgBO,MAAM,sBAAsB,GAAG,CAClC,UAA+D,KAI/D;AAEG,MAAM,uBAAuB,GAAG,CACnC,UAAsD,KAItD;AAEG,MAAM,2BAA2B,GAAG,CACvC,UAAsD,KAItD;;"}

package/dist/esm/Common/useNativeCheckedState.d.ts

@@ -0,0 +1,8 @@
+import { type ForwardedRef } from 'react';
+/** Keeps canonical state attributes aligned with an uncontrolled native checkable input. */
+export declare const useNativeCheckedState: (checked: boolean | undefined, defaultChecked: boolean | undefined, forwardedRef: ForwardedRef<HTMLInputElement>, observeRadioGroup?: boolean) => {
+    ref: (input: HTMLInputElement | null) => void;
+    selected: boolean;
+    synchronize: (nextChecked: boolean) => void;
+};
+//# sourceMappingURL=useNativeCheckedState.d.ts.map

package/dist/esm/Common/useNativeCheckedState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNativeCheckedState.d.ts","sourceRoot":"","sources":["../../../Common/useNativeCheckedState.ts"],"names":[],"mappings":"AAGA,OAAO,EAA4C,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAOpF,4FAA4F;AAC5F,eAAO,MAAM,qBAAqB,GAC9B,SAAS,OAAO,GAAG,SAAS,EAC5B,gBAAgB,OAAO,GAAG,SAAS,EACnC,cAAc,YAAY,CAAC,gBAAgB,CAAC,EAC5C,2BAAyB;iBASb,gBAAgB,GAAG,IAAI;;+BAyBJ,OAAO;CAIzC,CAAC"}

package/dist/esm/Common/useNativeCheckedState.js

@@ -0,0 +1,43 @@
+import { useRef, useState, useCallback, useEffect } from 'react';
+
+const assignRef = (ref, value) => {
+    if (typeof ref === 'function')
+        ref(value);
+    else if (ref)
+        ref.current = value;
+};
+const useNativeCheckedState = (checked, defaultChecked, forwardedRef, observeRadioGroup = false) => {
+    const inputRef = useRef(null);
+    const [uncontrolledChecked, setUncontrolledChecked] = useState(Boolean(defaultChecked));
+    const controlled = checked !== undefined;
+    const ref = useCallback((input) => {
+        inputRef.current = input;
+        assignRef(forwardedRef, input);
+    }, [forwardedRef]);
+    useEffect(() => {
+        const input = inputRef.current;
+        if (!input || controlled)
+            return;
+        const synchronize = () => queueMicrotask(() => setUncontrolledChecked(input.checked));
+        const form = input.form;
+        form?.addEventListener('reset', synchronize);
+        if (observeRadioGroup)
+            input.ownerDocument.addEventListener('change', synchronize);
+        return () => {
+            form?.removeEventListener('reset', synchronize);
+            if (observeRadioGroup)
+                input.ownerDocument.removeEventListener('change', synchronize);
+        };
+    }, [controlled, observeRadioGroup]);
+    return {
+        ref,
+        selected: checked ?? uncontrolledChecked,
+        synchronize: (nextChecked) => {
+            if (!controlled)
+                setUncontrolledChecked(nextChecked);
+        },
+    };
+};
+
+export { useNativeCheckedState };
+//# sourceMappingURL=useNativeCheckedState.js.map

package/dist/esm/Common/useNativeCheckedState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNativeCheckedState.js","sources":["../../../Common/useNativeCheckedState.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAKA,MAAM,SAAS,GAAG,CAAK,GAAoB,EAAE,KAAe,KAAI;IAC5D,IAAI,OAAO,GAAG,KAAK,UAAU;QAAE,GAAG,CAAC,KAAK,CAAC;AACpC,SAAA,IAAI,GAAG;AAAE,QAAA,GAAG,CAAC,OAAO,GAAG,KAAK;AACrC,CAAC;AAGM,MAAM,qBAAqB,GAAG,CACjC,OAA4B,EAC5B,cAAmC,EACnC,YAA4C,EAC5C,iBAAiB,GAAG,KAAK,KACzB;AACA,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC;AAC/C,IAAA,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,QAAQ,CAC1D,OAAO,CAAC,cAAc,CAAC,CAC1B;AACD,IAAA,MAAM,UAAU,GAAG,OAAO,KAAK,SAAS;AAExC,IAAA,MAAM,GAAG,GAAG,WAAW,CACnB,CAAC,KAA8B,KAAI;AAC/B,QAAA,QAAQ,CAAC,OAAO,GAAG,KAAK;AACxB,QAAA,SAAS,CAAC,YAAY,EAAE,KAAK,CAAC;AAClC,IAAA,CAAC,EACD,CAAC,YAAY,CAAC,CACjB;IAED,SAAS,CAAC,MAAK;AACX,QAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO;QAC9B,IAAI,CAAC,KAAK,IAAI,UAAU;YAAE;AAC1B,QAAA,MAAM,WAAW,GAAG,MAAM,cAAc,CAAC,MAAM,sBAAsB,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AACrF,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI;AACvB,QAAA,IAAI,EAAE,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC;AAC5C,QAAA,IAAI,iBAAiB;YACjB,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,QAAQ,EAAE,WAAW,CAAC;AAC/D,QAAA,OAAO,MAAK;AACR,YAAA,IAAI,EAAE,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC;AAC/C,YAAA,IAAI,iBAAiB;gBACjB,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC,QAAQ,EAAE,WAAW,CAAC;AACtE,QAAA,CAAC;AACL,IAAA,CAAC,EAAE,CAAC,UAAU,EAAE,iBAAiB,CAAC,CAAC;IAEnC,OAAO;QACH,GAAG;QACH,QAAQ,EAAE,OAAO,IAAI,mBAAmB;AACxC,QAAA,WAAW,EAAE,CAAC,WAAoB,KAAI;AAClC,YAAA,IAAI,CAAC,UAAU;gBAAE,sBAAsB,CAAC,WAAW,CAAC;QACxD,CAAC;KACJ;AACL;;"}

package/dist/esm/DataPage/DataPage.d.ts

@@ -1,61 +1,310 @@
 import { type ReactNode } from 'react';
 import React from 'react';
-import type { ButtonProps } from '@primereact/types/primitive/button';
+import type { ButtonParts } from '../Common/Button.js';
 import { type IObservableQueryFor, type IQueryFor } from '@cratis/arc/queries';
-import type { DataTableRootProps } from '@primereact/types/primitive/datatable';
-import type { DataTableFilterMeta } from '../DataTables/DataTableFilterMeta';
-import type { DataTableSelectionChangeEvent } from '../DataTables/DataTableSelectionChangeEvent';
+import type { DataTableParts } from '../DataTables/DataTableCore.js';
+import type { TablePaginatorParts, TablePaginatorProps } from '../DataTables/TablePaginator.js';
+import type { DataTableFilterMeta } from '../DataTables/DataTableFilterMeta.js';
+import type { DataTableSelectionChangeEvent } from '../DataTables/DataTableSelectionChangeEvent.js';
 import type { Constructor } from '@cratis/fundamentals';
+/**
+ * Props for {@link MenuItem} — a single action in a {@link DataPage}'s
+ * action bar.
+ */
 export interface MenuItemProps {
+    /** Icon component rendered before the label (e.g. a react-icons icon). */
     icon?: React.ComponentType<{
         className?: string;
     }>;
+    /** The visible label. */
     label?: string;
+    /** Invoked when the item is activated. */
     command?: () => void;
+    /** When true, the item is greyed out regardless of selection. */
     disabled?: boolean;
+    /**
+     * When true, the menu item is disabled while no row is selected in the
+     * surrounding {@link DataPage}. Use it for context-sensitive actions like
+     * "Edit" or "Delete" that require a selection.
+     */
     disableOnUnselected?: boolean;
 }
+/**
+ * Declarative menu item for use inside `<DataPage.MenuItems>`. Renders nothing
+ * directly; the surrounding {@link MenuItems} component reads its props and
+ * forwards them to the action menubar.
+ */
 export declare const MenuItem: (_props: MenuItemProps) => null;
+/**
+ * Props for {@link MenuItems}.
+ */
 export interface MenuItemsProps {
+    /** One or more `<DataPage.MenuItem>` elements. */
     children: ReactNode;
 }
+/**
+ * Props for {@link Columns}.
+ */
 export interface ColumnProps {
+    /** Cratis-owned `<Column>` markers describing each visible column. */
     children: ReactNode;
 }
+/**
+ * Renders an action menubar at the top of a {@link DataPage}, populated from
+ * `<DataPage.MenuItem>` children. Each menu item's `disableOnUnselected` flag
+ * is automatically honored against the current row selection.
+ *
+ * Use as `<DataPage.MenuItems>` inside a `<DataPage>`.
+ */
 export declare const MenuItems: ({ children }: MenuItemsProps) => React.JSX.Element;
+/**
+ * Renders the data table at the body of a {@link DataPage}. Automatically
+ * selects between {@link DataTableForQuery} (snapshot query) and
+ * {@link DataTableForObservableQuery} (real-time observable) based on the
+ * `query` type provided to the surrounding `<DataPage>`.
+ *
+ * Use as `<DataPage.Columns>` inside a `<DataPage>`, with Cratis-owned `<Column>`
+ * children defining the table columns.
+ */
 export declare const Columns: ({ children }: ColumnProps) => React.JSX.Element;
+/**
+ * Props passed to the optional details component rendered on the right pane
+ * of a {@link DataPage} when a row is selected.
+ *
+ * @typeParam TDataType - The type of the selected item.
+ */
 export interface IDetailsComponentProps<TDataType> {
+    /** The currently-selected row. */
     item: TDataType;
+    /**
+     * Callback the details component can invoke to ask the surrounding page to
+     * refresh its data — for example after the details panel has performed a
+     * mutating action.
+     */
     onRefresh?: () => void;
 }
-export interface DataPageProps<TQuery extends IQueryFor<TDataType> | IObservableQueryFor<TDataType>, TDataType extends object, TArguments> {
+/**
+ * Props for {@link DataPage}.
+ *
+ * @typeParam TQuery - The query class — either a snapshot `IQueryFor` or a real-time `IObservableQueryFor`.
+ * @typeParam TDataType - The row type returned by the query.
+ * @typeParam TArguments - The query's argument object type, or `object` if the query takes none.
+ */
+export interface DataPageProps<TQuery extends IQueryFor<TDataType, TArguments> | IQueryFor<TDataType[], TArguments> | IObservableQueryFor<TDataType, TArguments> | IObservableQueryFor<TDataType[], TArguments>, TDataType extends object, TArguments extends object> {
+    /**
+     * The title of the page
+     */
     title: string;
+    /**
+     * Children to render, for this it means menu items and columns. Use <DataPage.MenuItems> and <DataPage.Columns> for this.
+     */
     children: ReactNode;
-    detailsComponent?: React.FC<IDetailsComponentProps<any>>;
+    /**
+     * Component to render when the selection changes
+     */
+    detailsComponent?: React.FC<IDetailsComponentProps<TDataType>>;
+    /**
+     * The type of query to use
+     */
     query: Constructor<TQuery>;
+    /**
+     * Optional arguments to pass to the query
+     */
     queryArguments?: TArguments;
+    /**
+     * The message to show when there is no data
+     */
     emptyMessage: string;
+    /**
+     * The key to use for the data
+     */
     dataKey?: string | undefined;
-    selection?: any | undefined | null;
-    onSelectionChange?(event: DataTableSelectionChangeEvent<any>): void;
+    /**
+     * The current selection.
+     */
+    selection?: TDataType | undefined | null;
+    /**
+     * Callback for when the selection changes
+     */
+    onSelectionChange?(event: DataTableSelectionChangeEvent<TDataType>): void;
+    /**
+     * Fields to use for global filtering
+     */
     globalFilterFields?: string[] | undefined;
+    /** Placeholder for the loaded-page search input. */
+    globalSearchPlaceholder?: string;
+    /** Accessible name for the loaded-page search input. */
+    globalSearchAriaLabel?: string;
+    /**
+     * Default filters to use
+     */
     defaultFilters?: DataTableFilterMeta;
+    /**
+     * @deprecated Filtering is always applied to the currently loaded page.
+     * This compatibility prop no longer toggles behavior and does not change
+     * server-reported pagination totals. Retained for source compatibility only.
+     */
     clientFiltering?: boolean;
+    /**
+     * Callback triggered to signal data refresh
+     */
     onRefresh?(): void;
+    /**
+     * Extra CSS class name forwarded to the inner DataTable root.
+     */
     tableClassName?: string;
-    tablePt?: DataTableRootProps['pt'];
-    tablePtOptions?: DataTableRootProps['ptOptions'];
+    /** Cratis-owned per-part attributes applied to the inner table. */
+    tablePt?: DataTableParts;
+    /**
+     * @deprecated Cratis table parts always merge. Remove this renderer-era option.
+     */
+    tablePtOptions?: object;
+    /**
+     * @deprecated Components always uses consumer-owned CSS. Customize through `tablePt` and CSS instead.
+     */
     tableUnstyled?: boolean;
+    /** Extra CSS class name forwarded to the query table paginator. */
+    paginatorClassName?: string;
+    /** Cratis-owned attributes applied to the query table paginator. */
+    paginatorPt?: TablePaginatorParts;
+    /**
+     * @deprecated Cratis paginator parts always merge. Remove this renderer-era option.
+     */
+    paginatorPtOptions?: object;
+    /** Accessible paginator labels. Override any value to localize it. */
+    paginatorAriaLabels?: TablePaginatorProps['ariaLabels'];
+    /**
+     * Extra CSS class name forwarded to the action menubar root.
+     */
     menubarClassName?: string;
-    menubarPt?: ButtonProps['pt'];
-    menubarPtOptions?: ButtonProps['ptOptions'];
+    /** Cratis-owned part attributes applied to the action menubar's buttons. */
+    menubarPt?: ButtonParts;
+    /**
+     * @deprecated Cratis menubar parts always merge. Remove this renderer-era option.
+     */
+    menubarPtOptions?: object;
+    /**
+     * @deprecated Components always uses consumer-owned CSS. Customize through `menubarPt` and CSS instead.
+     */
     menubarUnstyled?: boolean;
+    /**
+     * Accessible name for the action menubar (toolbar). Override to localize.
+     * Defaults to `'Actions'`.
+     */
     actionsAriaLabel?: string;
 }
+/**
+ * A page primitive that combines an action menubar, a query-backed data
+ * table, and an optional details pane into one layout. Designed as the
+ * default rendering for "list view" pages in an Arc app.
+ *
+ * ## What `TQuery` is
+ *
+ * `TQuery` is the auto-generated TypeScript class produced by the Arc proxy
+ * generator from a C# read model query. Two flavors are accepted and
+ * **selected automatically at runtime** based on the class hierarchy:
+ *
+ * - **`IQueryFor<TDataType, TArguments>`** — a snapshot query. Re-fetched
+ *   when `queryArguments` change or when the page is mounted. Rendered
+ *   through {@link DataTableForQuery} internally.
+ * - **`IObservableQueryFor<TDataType, TArguments>`** — a real-time
+ *   subscription. Connects to the backend over WebSocket and re-renders
+ *   automatically whenever the underlying read model changes server-side.
+ *   Rendered through {@link DataTableForObservableQuery} internally.
+ *
+ * You don't pick which inner table to use — `DataPage` inspects the
+ * prototype chain (`context.query.prototype instanceof QueryFor`) and
+ * mounts the correct one.
+ *
+ * ## Declarative composition
+ *
+ * Three children build up the page:
+ *
+ * - **`<DataPage.MenuItems>`** wraps `<DataPage.MenuItem>` elements that
+ *   become the action `Menubar` at the top. Each item declares its `icon`,
+ *   `label`, and `command` (an `onClick` handler). Items can be marked
+ *   `disableOnUnselected` so they automatically grey out until the user
+ *   picks a row — useful for Edit / Delete actions that need a target.
+ *
+ * - **`<DataPage.Columns>`** wraps Cratis-owned `<Column>` markers that
+ *   describe the visible columns. The columns themselves are
+ *   Cratis-owned — the documented `ColumnProps` surface is
+ *   supported here (sorting, filtering, custom body templates, …).
+ *
+ * - **`detailsComponent`** (optional) is a React component rendered in a
+ *   right-hand pane via Allotment when a row is selected. It receives the
+ *   selected item as `item` and an `onRefresh` callback the parent can
+ *   invoke to ask the page to refetch.
+ *
+ * ## Selection lifecycle
+ *
+ * `DataPage` keeps the current selection in local state and threads it to
+ * the inner table, the menubar (`disableOnUnselected` items follow it),
+ * and the optional details pane. The `onSelectionChange` prop is invoked
+ * after every change if the consumer also needs to react to it.
+ *
+ * ```tsx
+ * <DataPage<AllAuthors, Author, never>
+ *     title="Authors"
+ *     query={AllAuthors}                          // proxy from C#
+ *     detailsComponent={AuthorDetails}>
+ *     <DataPage.MenuItems>
+ *         <DataPage.MenuItem icon={FaPlus}   label="Add"    command={onAdd} />
+ *         <DataPage.MenuItem icon={FaPencil} label="Edit"   command={onEdit}
+ *                            disableOnUnselected />
+ *         <DataPage.MenuItem icon={FaTrash}  label="Delete" command={onDelete}
+ *                            disableOnUnselected />
+ *     </DataPage.MenuItems>
+ *     <DataPage.Columns>
+ *         <Column field="name"  header="Name" sortable />
+ *         <Column field="email" header="Email" />
+ *     </DataPage.Columns>
+ * </DataPage>
+ * ```
+ *
+ * ## Height — `DataPage` needs a bounded ancestor
+ *
+ * `DataPage` fills the height it is given and divides it between the action
+ * bar and the table region, so the table's paginator always sits at the
+ * bottom of the page rather than below its edge. It cannot invent that height:
+ * every element from the page root down sizes as a percentage of its parent,
+ * so **some ancestor has to have a definite height**.
+ *
+ * ```tsx
+ * // ✅ the router outlet, a sized container, or a flex child with min-height
+ * <div style={{ height: '100vh' }}>
+ *     <DataPage … />
+ * </div>
+ *
+ * // ❌ nothing above resolves to a height — the table grows to its content
+ * <div>
+ *     <DataPage … />
+ * </div>
+ * ```
+ *
+ * Without one, the page falls back to a small fixed height so it stays
+ * usable instead of collapsing to nothing.
+ *
+ * ## Styling
+ *
+ * The inner DataTable and action toolbar each have their own per-slot props:
+ * `tablePt` / `tableUnstyled` / `tableClassName` for the table;
+ * `paginatorPt` / `paginatorClassName` / `paginatorAriaLabels` for paging;
+ * `menubarPt` / `menubarPtOptions` / `menubarUnstyled` / `menubarClassName` for
+ * the action toolbar's stable button parts (the action bar is implemented as
+ * a button toolbar, so `menubarPt` targets the stable Cratis button parts). See the
+ * [pass-through cheat sheet](../../Documentation/Styling/pass-through.md) for
+ * the full slot reference.
+ *
+ * @typeParam TQuery - The query class (proxy generated from a C# read model query).
+ * @typeParam TDataType - The row type returned by the query.
+ * @typeParam TArguments - The query's argument object type.
+ * @param props - {@link DataPageProps}.
+ */
 declare const DataPage: {
-    <TQuery extends IQueryFor<TDataType> | IObservableQueryFor<TDataType, TArguments>, TDataType extends object, TArguments extends object>(props: DataPageProps<TQuery, TDataType, TArguments>): React.JSX.Element;
+    <TQuery extends IQueryFor<TDataType, TArguments> | IQueryFor<TDataType[], TArguments> | IObservableQueryFor<TDataType, TArguments> | IObservableQueryFor<TDataType[], TArguments>, TDataType extends object, TArguments extends object>(props: DataPageProps<TQuery, TDataType, TArguments>): React.JSX.Element;
+    MenuItem: (_props: MenuItemProps) => null;
     MenuItems: ({ children }: MenuItemsProps) => React.JSX.Element;
     Columns: ({ children }: ColumnProps) => React.JSX.Element;
 };
 export { DataPage };
-//# sourceMappingURL=DataPage.d.ts.map

package/dist/esm/DataPage/DataPage.js

@@ -8,41 +8,12 @@ import { DataTableForQuery } from '../DataTables/DataTableForQuery.js';
 import { Allotment } from 'allotment';
 import { DataPageLayout } from './DataPageLayout.js';
 
-/**
- * Declarative menu item for use inside `<DataPage.MenuItems>`. Renders nothing
- * directly; the surrounding {@link MenuItems} component reads its props and
- * forwards them to the action menubar.
- */
 const MenuItem = (_props) => {
     return null;
 };
-/**
- * The action bar is an intrinsically sized item in the page's layout column —
- * it takes the height its menubar needs and never gives any of it up, so the
- * table region below it is the only part that has to adapt to the space left.
- */
 const actionsStyle = { flexShrink: 0 };
-/**
- * The table region takes every pixel the action bar leaves and no more.
- * `minHeight: 0` is the load-bearing half: without it the region's automatic
- * minimum keeps it at content height, the column grows past the page, and the
- * table's paginator ends up below the clipped edge.
- */
 const tableRegionStyle = { flexGrow: 1, flexBasis: 0, minHeight: 0 };
-/**
- * The floor a `DataPage` falls back to when its ancestors give it no height at
- * all. A page that renders as an empty sliver is indistinguishable from a
- * broken one, so a contract-violating consumer gets a small but usable page
- * instead of nothing.
- */
 const pageStyle = { minHeight: '20rem' };
-/**
- * Renders an action menubar at the top of a {@link DataPage}, populated from
- * `<DataPage.MenuItem>` children. Each menu item's `disableOnUnselected` flag
- * is automatically honored against the current row selection.
- *
- * Use as `<DataPage.MenuItems>` inside a `<DataPage>`.
- */
 const MenuItems = ({ children }) => {
     const context = useDataPageContext();
     const isDisabled = !context.selectedItem;
@@ -54,7 +25,7 @@ const MenuItems = ({ children }) => {
                 menuItems.push({
                     label: child.props.label,
                     command: child.props.command,
-                    icon: Icon ? jsx(Icon, { className: 'mr-2' }) : undefined,
+                    icon: Icon ? jsx(Icon, { className: 'cratis:mr-2' }) : undefined,
                     disabled: (child.props.disabled ?? false) ||
                         (isDisabled && (child.props.disableOnUnselected ?? false)),
                 });
@@ -62,21 +33,14 @@ const MenuItems = ({ children }) => {
         });
         return menuItems;
     }, [children, isDisabled]);
-    return (jsx("div", { className: 'cratis-data-page-actions px-4 py-2', style: actionsStyle, children: jsx(ActionMenubar, { "aria-label": context.actionsAriaLabel ?? 'Actions', model: items, className: context.menubarClassName, pt: context.menubarPt, ptOptions: context.menubarPtOptions, unstyled: context.menubarUnstyled }) }));
+    return (jsx("div", { className: 'cratis-data-page-actions cratis:px-4 cratis:py-2', style: actionsStyle, children: jsx(ActionMenubar, { "aria-label": context.actionsAriaLabel ?? 'Actions', model: items, className: context.menubarClassName, pt: context.menubarPt, ptOptions: context.menubarPtOptions, unstyled: context.menubarUnstyled }) }));
 };
-/**
- * Renders the data table at the body of a {@link DataPage}. Automatically
- * selects between {@link DataTableForQuery} (snapshot query) and
- * {@link DataTableForObservableQuery} (real-time observable) based on the
- * `query` type provided to the surrounding `<DataPage>`.
- *
- * Use as `<DataPage.Columns>` inside a `<DataPage>`, with PrimeReact `<Column>`
- * children defining the table columns.
- */
 const Columns = ({ children }) => {
     const context = useDataPageContext();
     const isSnapshotQuery = context.query.prototype instanceof QueryFor;
-    return (jsx("div", { className: 'cratis-data-page-table', style: tableRegionStyle, children: isSnapshotQuery ? (jsx(DataTableForQuery, { ...context, selection: context.selectedItem, onSelectionChange: context.onSelectionChanged, className: context.tableClassName, pt: context.tablePt, ptOptions: context.tablePtOptions, unstyled: context.tableUnstyled, children: children })) : (jsx(DataTableForObservableQuery, { ...context, selection: context.selectedItem, onSelectionChange: context.onSelectionChanged, className: context.tableClassName, pt: context.tablePt, ptOptions: context.tablePtOptions, unstyled: context.tableUnstyled, children: children })) }));
+    const snapshotQuery = context.query;
+    const observableQuery = context.query;
+    return (jsx("div", { className: 'cratis-data-page-table', style: tableRegionStyle, children: isSnapshotQuery ? (jsx(DataTableForQuery, { ...context, query: snapshotQuery, selection: context.selectedItem, onSelectionChange: context.onSelectionChanged, className: context.tableClassName, pt: context.tablePt, ptOptions: context.tablePtOptions, unstyled: context.tableUnstyled, children: children })) : (jsx(DataTableForObservableQuery, { ...context, query: observableQuery, selection: context.selectedItem, onSelectionChange: context.onSelectionChanged, className: context.tableClassName, pt: context.tablePt, ptOptions: context.tablePtOptions, unstyled: context.tableUnstyled, children: children })) }));
 };
 const DataPageContext = React.createContext(null);
 function useDataPageContext() {
@@ -86,124 +50,22 @@ function useDataPageContext() {
     }
     return context;
 }
-/**
- * A page primitive that combines an action menubar, a query-backed data
- * table, and an optional details pane into one layout. Designed as the
- * default rendering for "list view" pages in an Arc app.
- *
- * ## What `TQuery` is
- *
- * `TQuery` is the auto-generated TypeScript class produced by the Arc proxy
- * generator from a C# read model query. Two flavors are accepted and
- * **selected automatically at runtime** based on the class hierarchy:
- *
- * - **`IQueryFor<TDataType, TArguments>`** — a snapshot query. Re-fetched
- *   when `queryArguments` change or when the page is mounted. Rendered
- *   through {@link DataTableForQuery} internally.
- * - **`IObservableQueryFor<TDataType, TArguments>`** — a real-time
- *   subscription. Connects to the backend over WebSocket and re-renders
- *   automatically whenever the underlying read model changes server-side.
- *   Rendered through {@link DataTableForObservableQuery} internally.
- *
- * You don't pick which inner table to use — `DataPage` inspects the
- * prototype chain (`context.query.prototype instanceof QueryFor`) and
- * mounts the correct one.
- *
- * ## Declarative composition
- *
- * Three children build up the page:
- *
- * - **`<DataPage.MenuItems>`** wraps `<DataPage.MenuItem>` elements that
- *   become the action `Menubar` at the top. Each item declares its `icon`,
- *   `label`, and `command` (an `onClick` handler). Items can be marked
- *   `disableOnUnselected` so they automatically grey out until the user
- *   picks a row — useful for Edit / Delete actions that need a target.
- *
- * - **`<DataPage.Columns>`** wraps PrimeReact `<Column>` elements that
- *   describe the visible columns. The columns themselves are
- *   PrimeReact's — anything supported by their `DataTable` `<Column>` is
- *   supported here (sorting, filtering, custom body templates, …).
- *
- * - **`detailsComponent`** (optional) is a React component rendered in a
- *   right-hand pane via Allotment when a row is selected. It receives the
- *   selected item as `item` and an `onRefresh` callback the parent can
- *   invoke to ask the page to refetch.
- *
- * ## Selection lifecycle
- *
- * `DataPage` keeps the current selection in local state and threads it to
- * the inner table, the menubar (`disableOnUnselected` items follow it),
- * and the optional details pane. The `onSelectionChange` prop is invoked
- * after every change if the consumer also needs to react to it.
- *
- * ```tsx
- * <DataPage<AllAuthors, Author, never>
- *     title="Authors"
- *     query={AllAuthors}                          // proxy from C#
- *     detailsComponent={AuthorDetails}>
- *     <DataPage.MenuItems>
- *         <DataPage.MenuItem icon={FaPlus}   label="Add"    command={onAdd} />
- *         <DataPage.MenuItem icon={FaPencil} label="Edit"   command={onEdit}
- *                            disableOnUnselected />
- *         <DataPage.MenuItem icon={FaTrash}  label="Delete" command={onDelete}
- *                            disableOnUnselected />
- *     </DataPage.MenuItems>
- *     <DataPage.Columns>
- *         <Column field="name"  header="Name" sortable />
- *         <Column field="email" header="Email" />
- *     </DataPage.Columns>
- * </DataPage>
- * ```
- *
- * ## Height — `DataPage` needs a bounded ancestor
- *
- * `DataPage` fills the height it is given and divides it between the action
- * bar and the table region, so the table's paginator always sits at the
- * bottom of the page rather than below its edge. It cannot invent that height:
- * every element from the page root down sizes as a percentage of its parent,
- * so **some ancestor has to have a definite height**.
- *
- * ```tsx
- * // ✅ the router outlet, a sized container, or a flex child with min-height
- * <div style={{ height: '100vh' }}>
- *     <DataPage … />
- * </div>
- *
- * // ❌ nothing above resolves to a height — the table grows to its content
- * <div>
- *     <DataPage … />
- * </div>
- * ```
- *
- * Without one, the page falls back to a small fixed height so it stays
- * usable instead of collapsing to nothing.
- *
- * ## Styling
- *
- * The inner DataTable and action toolbar each have their own per-slot props:
- * `tablePt` / `tableUnstyled` / `tableClassName` for the table;
- * `menubarPt` / `menubarPtOptions` / `menubarUnstyled` / `menubarClassName` for
- * the action toolbar's buttons (in PrimeReact 11 the v10 Menubar is replaced by
- * a button toolbar, so `menubarPt` targets those buttons). See the
- * [pass-through cheat sheet](../../Documentation/Styling/pass-through.md) for
- * the full slot reference.
- *
- * @typeParam TQuery - The query class (proxy generated from a C# read model query).
- * @typeParam TDataType - The row type returned by the query.
- * @typeParam TArguments - The query's argument object type.
- * @param props - {@link DataPageProps}.
- */
 const DataPage = (props) => {
-    const [selectedItem, setSelectedItem] = React.useState(undefined);
-    const selectionChanged = (e) => {
-        setSelectedItem(e.value);
-        if (props.onSelectionChange) {
-            props.onSelectionChange(e);
-        }
+    const [internalSelection, setInternalSelection] = React.useState(props.selection);
+    const selectedItem = props.selection === undefined ? internalSelection : props.selection;
+    const selectionChanged = (event) => {
+        if (props.selection === undefined)
+            setInternalSelection(event.value);
+        props.onSelectionChange?.(event);
     };
-    const context = { ...props, selectedItem, onSelectionChanged: selectionChanged };
-    return (jsx(DataPageContext.Provider, { value: context, children: jsx(Page, { title: props.title, panel: true, style: pageStyle, children: props.detailsComponent ? (jsxs(Allotment, { className: 'h-full', proportionalLayout: false, children: [jsx(Allotment.Pane, { children: jsx(DataPageLayout, { children: props.children }) }), selectedItem && (jsx(Allotment.Pane, { preferredSize: '450px', children: jsx(props.detailsComponent, { item: selectedItem, onRefresh: props.onRefresh }) }))] })) : (jsx(DataPageLayout, { children: props.children })) }) }));
+    const context = {
+        ...props,
+        selectedItem,
+        onSelectionChanged: selectionChanged,
+    };
+    return (jsx(DataPageContext.Provider, { value: context, children: jsx(Page, { title: props.title, panel: true, style: pageStyle, children: props.detailsComponent ? (jsxs(Allotment, { className: 'cratis:h-full', proportionalLayout: false, children: [jsx(Allotment.Pane, { children: jsx(DataPageLayout, { children: props.children }) }), selectedItem && (jsx(Allotment.Pane, { preferredSize: '450px', children: jsx(props.detailsComponent, { item: selectedItem, onRefresh: props.onRefresh }) }))] })) : (jsx(DataPageLayout, { children: props.children })) }) }));
 };
+DataPage.MenuItem = MenuItem;
 DataPage.MenuItems = MenuItems;
 DataPage.Columns = Columns;
 

package/dist/esm/DataPage/DataPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataPage.js","sources":["../../../DataPage/DataPage.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"DataPage.js","sources":["../../../DataPage/DataPage.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":"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"}