@nxgt/material 3.57.0 → 3.59.0

package/dist/lib/components/ui/actions/load-more-footer/index.d.ts

@@ -0,0 +1 @@
+export * from './load-more-footer.js';

package/dist/lib/components/ui/actions/load-more-footer/load-more-footer.d.ts

@@ -0,0 +1,24 @@
+import { ComponentProps } from 'react';
+export type LoadMoreFooterProps = Omit<ComponentProps<'div'>, 'children'> & {
+    /** How many items the list shows now. */
+    shown: number;
+    /** How many items the list holds in all; leave it out when it is not known. */
+    total?: number;
+    /** Whether a next page exists. When it does not, the footer renders nothing. */
+    hasMore: boolean;
+    /** The next page is being fetched: the button spins and ignores clicks. */
+    loading?: boolean;
+    /** The next page failed: an error alert with a retry replaces the button. */
+    failed?: boolean;
+    /** The load button's label (translated "Load more" by default). */
+    label?: string;
+    /** Loads the next page; the retry button calls it too. */
+    onLoad: () => void;
+};
+/**
+ * The footer of a paged list: a "Showing N of M" line (a polite live region),
+ * the load button and, when the next page failed, an error alert whose
+ * "Try again" calls `onLoad`. The rows already shown stay; the footer only
+ * says what is left to do. It renders nothing when there is no next page.
+ */
+export declare function LoadMoreFooter({ shown, total, hasMore, loading, failed, label, onLoad, className, ...props }: LoadMoreFooterProps): import("react").JSX.Element | null;

package/dist/lib/components/ui/actions/toolbar/use-toolbar-state.d.ts

@@ -0,0 +1,22 @@
+import { RefObject } from 'react';
+import { ToolbarEntry } from './toolbar-context.js';
+/** The value the toolbar's items read from `ToolbarContext`. */
+export declare function useToolbarState(root: RefObject<HTMLElement | null>, live: {
+    spilled: ReadonlySet<string>;
+    dir: 'ltr' | 'rtl';
+    orientation: 'horizontal' | 'vertical';
+    overflowing: boolean;
+}): {
+    inside: boolean;
+    spilled: ReadonlySet<string>;
+    entries: Map<string, ToolbarEntry>;
+    dir: "ltr" | "rtl";
+    orientation: "horizontal" | "vertical";
+    overflowing: boolean;
+    moreAnchor: {
+        current: HTMLElement | null;
+    };
+    focusLost: {
+        current: null;
+    };
+};

package/dist/lib/components/ui/collections/data-grid/columns/column-check.d.ts

@@ -0,0 +1,15 @@
+import { GridValidation } from '@nxgt/material-core/data-grid';
+import { RowData } from '@tanstack/react-table';
+import { GridColumn } from '../use-grid-model.js';
+/** How long an asynchronous check may take by default (`checkTimeout`), in ms. */
+export declare const CHECK_TIMEOUT_MS = 10000;
+/**
+ * A column's check once it is settled: a synchronous answer as it is; an
+ * asynchronous one that rejects (a schema that throws) read as the column's
+ * invalid value; one still pending after `timeout` ms (the grid's
+ * `checkTimeout`, default 10 s; `0` or `Infinity`: never) as "Check timed
+ * out". The one place that rule lives; the promise it returns never rejects
+ * and always settles, unless the timeout is switched off.
+ */
+export declare function settledCheck<TData extends RowData>(column: GridColumn<TData>, result: Promise<GridValidation<unknown>>, timeout?: number): Promise<GridValidation<unknown>>;
+export declare function settledCheck<TData extends RowData>(column: GridColumn<TData>, result: GridValidation<unknown> | Promise<GridValidation<unknown>>, timeout?: number): GridValidation<unknown> | Promise<GridValidation<unknown>>;

package/dist/lib/components/ui/collections/data-grid/columns/column-edit.d.ts

@@ -4,6 +4,7 @@ import { DataTableFeatures } from '../../data-table/features.js';
 import { DataGridEditor, DataGridEditorName } from '../editors/editor-types.js';
 import { DataGridFormatContext } from '../grid-meta.js';
 import { GridColumn } from '../use-grid-model.js';
+export { CHECK_TIMEOUT_MS, settledCheck } from './column-check.js';
 export { metaFor, type RowMeta } from './row-meta.js';
 /** The kind of editor a column has: a name, `'custom'` (a component), or `null` (none). */
 export type ColumnEditorKind = DataGridEditorName | 'custom' | null;
@@ -34,17 +35,5 @@ export declare function validateValue<TData extends RowData>(column: GridColumn<
  * ("Check timed out").
  */
 export declare function errorAnnouncement(error: GridMsg, label: string): GridMsg;
-/** How long an asynchronous check may take by default (`checkTimeout`), in ms. */
-export declare const CHECK_TIMEOUT_MS = 10000;
-/**
- * A column's check once it is settled: a synchronous answer as it is; an
- * asynchronous one that rejects (a schema that throws) read as the column's
- * invalid value; one still pending after `timeout` ms (the grid's
- * `checkTimeout`, default 10 s; `0` or `Infinity`: never) as "Check timed
- * out". The one place that rule lives; the promise it returns never rejects
- * and always settles, unless the timeout is switched off.
- */
-export declare function settledCheck<TData extends RowData>(column: GridColumn<TData>, result: Promise<GridValidation<unknown>>, timeout?: number): Promise<GridValidation<unknown>>;
-export declare function settledCheck<TData extends RowData>(column: GridColumn<TData>, result: GridValidation<unknown> | Promise<GridValidation<unknown>>, timeout?: number): GridValidation<unknown> | Promise<GridValidation<unknown>>;
 /** The value Delete leaves: unchecked for a checkbox, else what the empty text parses to (`null` if it does not). */
 export declare function clearedValue<TData extends RowData>(column: GridColumn<TData>, row: TData, ctx: DataGridFormatContext): unknown;

package/dist/lib/components/ui/collections/data-grid/editors/editor-props.d.ts

@@ -0,0 +1,20 @@
+import { RowData } from '@tanstack/react-table';
+import { MutableRefObject, RefObject } from 'react';
+import { DataGridContextValue } from '../data-grid-context.js';
+import { GridCellData } from '../grid-cell-data.js';
+import { DataGridEditorProps } from './editor-types.js';
+/**
+ * The props `CellEditorHost` hands the column's editor: the draft, the
+ * commit and cancel actions (each marks the edit as closing, so the blur of
+ * the editor's removal commits nothing) and `inputProps` for its control.
+ */
+export declare function editorProps<TData extends RowData>({ grid, data, inputRef, closing, edit, }: {
+    grid: DataGridContextValue<TData>;
+    data: GridCellData<TData>;
+    inputRef: RefObject<HTMLInputElement | null>;
+    closing: MutableRefObject<boolean>;
+    /** The edit in progress (not idle). */
+    edit: Exclude<DataGridContextValue['chrome']['edit'], {
+        status: 'idle';
+    }>;
+}): DataGridEditorProps<TData>;

package/dist/lib/components/ui/collections/data-grid/editors/editor-route-key.d.ts

@@ -0,0 +1,11 @@
+import { GridPos } from '@nxgt/material-core/data-grid';
+import { KeyboardEvent } from 'react';
+import { DataGridContextValue } from '../data-grid-context.js';
+/**
+ * The edit-mode keys, once the editor has had them: Enter and Tab commit
+ * and move, Ctrl/Cmd+Enter fills the range, Escape cancels, and the browser's back and forward (core's
+ * `swallow`) do nothing. The menu keys (ContextMenu, Shift+F10) commit,
+ * then open the cell's menu. A key the editor prevented, an IME
+ * composition, the caret's keys and the input's own undo pass through.
+ */
+export declare function routeKey(grid: DataGridContextValue, pos: GridPos, event: KeyboardEvent<HTMLElement>, close: () => void): void;

package/dist/lib/components/ui/collections/data-grid/partials/grid-cell-access.d.ts

@@ -0,0 +1,26 @@
+import { GridPos } from '@nxgt/material-core/data-grid';
+import { Cell, RowData } from '@tanstack/react-table';
+import { DataTableFeatures } from '../../data-table/features.js';
+import { DataGridContextValue } from '../data-grid-context.js';
+/**
+ * What the cell at `pos` allows, and whether it says so (`said`, with the
+ * shared description's id). A row header with no editor is the row's name,
+ * not a field: it says nothing (its row's tag tells the row's state).
+ */
+export declare function describedBy<TData extends RowData>(grid: DataGridContextValue<TData>, pos: GridPos): {
+    access: import('@nxgt/material-core/data-grid').GridAccess;
+    said: boolean;
+    id: undefined;
+} | {
+    access: "locked" | "readonly" | "computed";
+    said: boolean;
+    id: string;
+};
+/** Whether Escape on the active cell is the grid's: a range to collapse, the paste problems to close. */
+export declare function keepsEscape<TData extends RowData>(grid: DataGridContextValue<TData>, pos: GridPos): boolean;
+/** The classes of a body cell: the grid's, the virtual one, the row header's, the control and selected ones, the column's own. */
+export declare function cellClassName<TData extends RowData>(grid: DataGridContextValue<TData>, cell: Cell<DataTableFeatures, TData, unknown>, flags: {
+    header: boolean;
+    control: boolean;
+    selected?: boolean;
+}): string;

package/dist/lib/components/ui/collections/data-grid/partials/grid-header-name.d.ts

@@ -0,0 +1,15 @@
+import { Column, Header, RowData } from '@tanstack/react-table';
+import { DataTableFeatures } from '../../data-table/features.js';
+/** The classes of a header cell: the virtual and sortable ones, the menu's and grip's room, the column's own. */
+export declare function headerClassName<TData extends RowData>(column: Column<DataTableFeatures, TData, unknown>, flags: {
+    fixed: boolean;
+    cut: boolean;
+    hasMenu: boolean;
+    canResize: boolean;
+}): string;
+/** A header's name (its `labelId` is what the cell is labelled by) and its sort arrow. */
+export declare function GridHeaderName<TData extends RowData>({ header, labelId, sorted, }: {
+    header: Header<DataTableFeatures, TData, unknown>;
+    labelId: string;
+    sorted: false | 'asc' | 'desc';
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-grid/partials/header-menu-button.d.ts

@@ -0,0 +1,17 @@
+import { Ref } from 'react';
+/**
+ * The button of a header's menu: a plain one with the menu button's ARIA
+ * (`aria-haspopup`, `aria-expanded`, `aria-controls` once open). A press
+ * opens it (`onShow(true)`), a second press closes it (`onClose`); Enter,
+ * Space and ArrowDown open it from the keyboard. Its clicks never sort.
+ */
+export declare function HeaderMenuButton({ ref, id, menuId, isOpen, label, onShow, onClose, }: {
+    ref: Ref<HTMLButtonElement>;
+    id: string;
+    menuId: string;
+    isOpen: boolean;
+    /** The column's label, which the button's name carries. */
+    label: string;
+    onShow: (pointer?: boolean) => void;
+    onClose: () => void;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-grid/partials/open-header-menu.d.ts

@@ -0,0 +1,14 @@
+import { RowData } from '@tanstack/react-table';
+import { DataGridContextValue } from '../data-grid-context.js';
+import { GridColumn } from '../use-grid-model.js';
+/** The open menu, anchored over its header's button, which names it. */
+export declare function OpenHeaderMenu<TData extends RowData>({ grid, column, buttonId, menuId, byKeyboard, onClose, afterMenu, openWidth, }: {
+    grid: DataGridContextValue<TData>;
+    column: GridColumn<TData>;
+    buttonId: string;
+    menuId: string;
+    byKeyboard: boolean;
+    onClose: () => void;
+    afterMenu: (event: Event) => void;
+    openWidth: () => void;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-grid/partials/width-field.d.ts

@@ -0,0 +1,18 @@
+/**
+ * The width field of `WidthStepper`: a plain spinbutton `<input>` and its
+ * unit, isolated left to right so a right-to-left page reads "144 px".
+ */
+export declare function WidthField({ titleId, bounds, width, draft, onDraft, onStep, onType, onDone, onLeave, }: {
+    titleId: string;
+    bounds: {
+        min: number;
+        max: number;
+    };
+    width: number;
+    draft: string | null;
+    onDraft: (draft: string | null) => void;
+    onStep: (up: boolean, shift: boolean) => void;
+    onType: (width: number) => void;
+    onDone: () => void;
+    onLeave: () => void;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-grid/phone/phone-item.d.ts

@@ -7,8 +7,8 @@ export declare function PhoneBadges({ state }: {
 /**
  * One row of the phone list: a button at least 44px tall with the row's
  * label and its badges, its summary under them (the app's `renderPhoneItem`,
- * else the cells' values), and a locked or read-only row's reason. Opens
- * the row panel.
+ * else the cells' values), and a locked or read-only row's reason. Its
+ * accessible name is all of that text, label first. Opens the row panel.
  */
 export declare function PhoneItem({ id, label, state, summary, onOpen, }: {
     id: string;

package/dist/lib/components/ui/collections/data-table/partials/layouts/data-table-card-list.d.ts

@@ -0,0 +1,17 @@
+import { RowData } from '@tanstack/react-table';
+import { HTMLAttributes } from 'react';
+import { DataTableProps, DataTableTable } from '../../types.js';
+/**
+ * The `<ul>` of `DataTableCards`: one card (or tile) per row of the table,
+ * or, while loading with nothing to show, placeholder cards.
+ */
+export declare function DataTableCardList<TData extends RowData>({ layout, table, props, listProps, selectable, }: {
+    layout: 'cards' | 'tiles';
+    table: DataTableTable<TData>;
+    props: DataTableProps<TData>;
+    /** The list's own attributes (role, ref, density, busy), built by the parent. */
+    listProps: HTMLAttributes<HTMLUListElement> & {
+        ref?: React.Ref<HTMLUListElement>;
+    };
+    selectable: boolean;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/partials/layouts/list-bar-clear.d.ts

@@ -0,0 +1,10 @@
+import { RowData } from '@tanstack/react-table';
+import { RefObject } from 'react';
+import { DataTableTable } from '../../types.js';
+/** The list bar's "Clear selection": an icon on a narrow list, still named and with a tooltip. */
+export declare function ListBarClear<TData extends RowData>({ table, rootRef, label, }: {
+    table: DataTableTable<TData>;
+    /** The list's root, where the focus goes once the button is gone. */
+    rootRef?: RefObject<HTMLElement | null>;
+    label: string;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/partials/layouts/list-bar-in-row.d.ts

@@ -0,0 +1,18 @@
+import { RowData } from '@tanstack/react-table';
+import { ReactNode } from 'react';
+import { DataTableListSlots } from '../../data-table-list-slots.js';
+import { DataTableTable } from '../../types.js';
+/**
+ * The list bar on a phone, when the host gives the list a row of its own:
+ * its start group (the select-all box, with a short visible label the count
+ * replaces in place, and "Clear selection") goes to the host's start slot,
+ * the sort to its sort slot.
+ */
+export declare function ListBarInRow<TData extends RowData>({ table, slots, count, countText, selectAll, clear, }: {
+    table: DataTableTable<TData>;
+    slots: DataTableListSlots;
+    count: number;
+    countText: string;
+    selectAll: (visibleLabel?: string) => ReactNode;
+    clear: ReactNode;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/partials/page-button.d.ts

@@ -0,0 +1,12 @@
+/**
+ * One of the pager's four icon buttons: a tonal `IconButton` in a tooltip
+ * that says `label`, which a screen reader gets as well. `wide` (first and
+ * last page) hides it below the `lg` breakpoint.
+ */
+export declare function PageButton({ label, icon, wide, onClick, disabled, }: {
+    label: string;
+    icon: 'chevrons-left' | 'chevron-left' | 'chevron-right' | 'chevrons-right';
+    wide?: boolean;
+    onClick: () => void;
+    disabled: boolean;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/partials/page-icon-control.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { DataTableLinkComponent, DataTablePageTarget } from '../types.js';
+/** What an inert control looks like: it takes no pointer and is dimmed, as
+ * the sort headers' are while loading. */
+export declare const INERT = "aria-disabled:pointer-events-none aria-disabled:opacity-50";
+/**
+ * The icon-only "Previous" or "Next" of the server footer
+ * (`pageControls: 'icon'`): a tonal icon button with a tooltip and a name
+ * that says the page, a link when the target is an href, else a button.
+ */
+export declare function PageIconControl({ previous, target, Link, glyph, slot, inert, gone, }: {
+    previous: boolean;
+    target?: DataTablePageTarget | null;
+    Link: DataTableLinkComponent;
+    glyph: ReactNode;
+    slot: string;
+    /** `true` while the table is loading. */
+    inert: true | undefined;
+    /** `true` when the page is not there, or the table is loading. */
+    gone: true | undefined;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/partials/pager-buttons.d.ts

@@ -0,0 +1,7 @@
+import { RowData, Table } from '@tanstack/react-table';
+import { DataTableFeatures } from '../features.js';
+/** The pager's first, previous, next and last page buttons (first and last from the `lg` breakpoint). */
+export declare function PagerButtons<TData extends RowData>({ table, disabled, }: {
+    table: Table<DataTableFeatures, TData>;
+    disabled: boolean;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/use-data-table-setup.d.ts

@@ -0,0 +1,36 @@
+import { RowData } from '@tanstack/react-table';
+import { DataTableProps } from './types.js';
+/**
+ * What `DataTable` decides before it renders: its layout (a list of cards
+ * is neither virtualized nor given an expanded row), the virtual option,
+ * the TanStack table, the focus it records and whether the data is filtered.
+ */
+export declare function useDataTableSetup<TData extends RowData>(props: DataTableProps<TData>): {
+    layout: import('./layout-types.js').DataTableLayout;
+    list: boolean;
+    virtual: import('./virtual-option.js').DataTableVirtualOptions | undefined;
+    unpaged: boolean;
+    table: import('@tanstack/react-table').ReactTable<{
+        columnFilteringFeature: import('@tanstack/table-core').TableFeature;
+        columnVisibilityFeature: import('@tanstack/table-core').TableFeature;
+        columnOrderingFeature: import('@tanstack/table-core').TableFeature;
+        columnSizingFeature: import('@tanstack/table-core').TableFeature;
+        columnResizingFeature: import('@tanstack/table-core').TableFeature;
+        rowSelectionFeature: import('@tanstack/table-core').TableFeature;
+        rowSortingFeature: import('@tanstack/table-core').TableFeature;
+        rowExpandingFeature: import('@tanstack/table-core').TableFeature;
+        rowPaginationFeature: import('@tanstack/table-core').TableFeature;
+        filteredRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+        sortedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+        paginatedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+        expandedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+    }, TData, import('@tanstack/table-core').TableState_ColumnFiltering & import('@tanstack/table-core').TableState_ColumnOrdering & import('@tanstack/table-core').TableState_ColumnResizing & import('@tanstack/table-core').TableState_ColumnSizing & import('@tanstack/table-core').TableState_ColumnVisibility & import('@tanstack/table-core').TableState_RowExpanding & import('@tanstack/table-core').TableState_RowPagination & import('@tanstack/table-core').TableState_RowSelection & import('@tanstack/table-core').TableState_RowSorting>;
+    focusable: boolean;
+    focus: {
+        ref: import('react').RefCallback<HTMLTableElement>;
+        listRef: import('react').RefCallback<HTMLElement>;
+        onFocus: (event: import('react').FocusEvent) => void;
+        controls: import('./slots.js').DataTableControls;
+    };
+    filtered: boolean;
+};

package/dist/lib/components/ui/collections/facet-group/partials/facet-group-header.d.ts

@@ -0,0 +1,11 @@
+import { ElementType, Ref } from 'react';
+import { FacetGroupProps } from '../types.js';
+type FacetGroupHeaderProps = Pick<FacetGroupProps, 'title' | 'hint' | 'activeCount' | 'onClear'> & {
+    Heading: ElementType;
+    shown: boolean;
+    toggle: Ref<HTMLButtonElement>;
+    clear: () => void;
+};
+/** The header row: the disclosure toggle (title, hint, count, chevron) and Clear beside it. */
+export declare function FacetGroupHeader({ title, hint, activeCount, onClear, Heading, shown, toggle, clear, }: FacetGroupHeaderProps): import("react").JSX.Element;
+export {};

package/dist/lib/components/ui/collections/filter/filter-field-config-base.utils.d.ts

@@ -0,0 +1,13 @@
+import { FilterField } from './types.js';
+/** What every generic field built from a filter field carries. */
+export declare function baseFieldConfig(field: FilterField, error?: string, disabled?: boolean): {
+    id: string;
+    name: string;
+    label: string;
+    placeholder: string | undefined;
+    disabled: boolean | undefined;
+    error: boolean;
+    helperText: string | undefined;
+    className: string | undefined;
+};
+export type BaseFieldConfig = ReturnType<typeof baseFieldConfig>;

package/dist/lib/components/ui/collections/filter/filter-field-config-choice.utils.d.ts

@@ -0,0 +1,5 @@
+import { FieldConfig } from '../../fields/field/types.js';
+import { BaseFieldConfig } from './filter-field-config-base.utils.js';
+import { FilterField } from './types.js';
+/** The choice fields (select, multi-select, chips, radio and checkbox groups) as generic fields. */
+export declare function choiceFieldConfig(field: FilterField, baseConfig: BaseFieldConfig, value: any, onChange: (value: any) => void): FieldConfig | null;

package/dist/lib/components/ui/collections/filter/filter-field-config-value.utils.d.ts

@@ -0,0 +1,5 @@
+import { FieldConfig } from '../../fields/field/types.js';
+import { BaseFieldConfig } from './filter-field-config-base.utils.js';
+import { FilterField } from './types.js';
+/** The value fields (text, number, switch, date, date range, slider) as generic fields. */
+export declare function valueFieldConfig(field: FilterField, baseConfig: BaseFieldConfig, value: any, onChange: (value: any) => void): FieldConfig | null;

package/dist/lib/components/ui/collections/filter/filter-field-config.utils.d.ts

@@ -0,0 +1,6 @@
+import { FieldConfig } from '../../fields/field/types.js';
+import { FilterField } from './types.js';
+/**
+ * Map a FilterField to FieldConfig for use with generic Field component
+ */
+export declare function mapFilterFieldToFieldConfig(field: FilterField, value: any, onChange: (value: any) => void, error?: string, disabled?: boolean): FieldConfig | null;

package/dist/lib/components/ui/collections/filter/filter-legacy.d.ts

@@ -59,4 +59,4 @@ export type FilterProps = Omit<FilterProviderProps, 'children'> & {
  * />
  * ```
  */
-export declare function FilterLegacy({ variant, schema, values, defaultValues, onChange, onApply, onReset, persistence, presetConfig, liveUpdate, disabled, showActions, contentClassName, actionsClassName, trigger, title, description, triggerLabel, showTriggerCount, side, direction, align, popoverSide, className, }: FilterProps): import("react").JSX.Element;
+export declare function FilterLegacy(props: FilterProps): import("react").JSX.Element;

package/dist/lib/components/ui/collections/filter/filter-persistence-url-value.utils.d.ts

@@ -0,0 +1,9 @@
+import { FilterField, FilterValue } from './types.js';
+/**
+ * Serialize filter value to URL param string
+ */
+export declare function serializeFilterValue(field: FilterField, value: FilterValue): string | null;
+/**
+ * Parse URL param string to filter value
+ */
+export declare function parseFilterValue(field: FilterField, paramValue: string): FilterValue;

package/dist/lib/components/ui/collections/filter/filter-schema.utils.d.ts

@@ -1,4 +1,3 @@
-import { FieldConfig } from '../../fields/field/types.js';
 import { FilterField, FilterGroup, FilterSchema, FilterValues } from './types.js';
 /**
  * Get a filter field by ID from schema
@@ -28,7 +27,4 @@ export declare function isFieldVisible(field: FilterField, values: FilterValues)
  * Get all visible fields from schema
  */
 export declare function getVisibleFields(schema: FilterSchema, values: FilterValues): FilterField[];
-/**
- * Map a FilterField to FieldConfig for use with generic Field component
- */
-export declare function mapFilterFieldToFieldConfig(field: FilterField, value: any, onChange: (value: any) => void, error?: string, disabled?: boolean): FieldConfig | null;
+export { mapFilterFieldToFieldConfig } from './filter-field-config.utils.js';

package/dist/lib/components/ui/collections/filter/filter-validation-presets.utils.d.ts

@@ -0,0 +1,24 @@
+import { FilterValidationRule } from './types.js';
+/**
+ * Common validation patterns
+ */
+export declare const VALIDATION_PATTERNS: {
+    readonly EMAIL: RegExp;
+    readonly URL: RegExp;
+    readonly PHONE: RegExp;
+    readonly ZIP_CODE: RegExp;
+    readonly ALPHANUMERIC: RegExp;
+    readonly NUMERIC: RegExp;
+};
+/**
+ * Common validation rule presets
+ */
+export declare const VALIDATION_PRESETS: {
+    readonly required: () => FilterValidationRule;
+    readonly email: () => FilterValidationRule;
+    readonly url: () => FilterValidationRule;
+    readonly phone: () => FilterValidationRule;
+    readonly positiveNumber: () => FilterValidationRule;
+    readonly percentage: () => FilterValidationRule;
+    readonly range: (min: number, max: number) => FilterValidationRule;
+};

package/dist/lib/components/ui/collections/filter/filter-validation-rules.utils.d.ts

@@ -0,0 +1,11 @@
+import { FilterField, FilterValidationRule, FilterValue } from './types.js';
+type FilterRules = FilterValidationRule;
+/** A text field: minimum and maximum length, pattern. */
+export declare function validateTextValue(field: FilterField, value: FilterValue, rules: FilterRules): string | null;
+/** A number field: minimum and maximum. */
+export declare function validateNumberValue(field: FilterField, value: FilterValue, rules: FilterRules): string | null;
+/** A number range: required ends, min less than max, and the field limits. */
+export declare function validateNumberRangeValue(field: FilterField, value: FilterValue, rules: FilterRules): string | null;
+/** A multi-select or checkbox group: minimum and maximum count. */
+export declare function validateArrayValue(value: FilterValue, rules: FilterRules): string | null;
+export {};

package/dist/lib/components/ui/collections/filter/filter-validation.utils.d.ts

@@ -23,26 +23,4 @@ export declare function getValidationError(errors: FilterValidationErrors, field
  * Create a validation rule helper
  */
 export declare function createValidationRule(rule: Partial<FilterValidationRule>): FilterValidationRule;
-/**
- * Common validation patterns
- */
-export declare const VALIDATION_PATTERNS: {
-    readonly EMAIL: RegExp;
-    readonly URL: RegExp;
-    readonly PHONE: RegExp;
-    readonly ZIP_CODE: RegExp;
-    readonly ALPHANUMERIC: RegExp;
-    readonly NUMERIC: RegExp;
-};
-/**
- * Common validation rule presets
- */
-export declare const VALIDATION_PRESETS: {
-    readonly required: () => FilterValidationRule;
-    readonly email: () => FilterValidationRule;
-    readonly url: () => FilterValidationRule;
-    readonly phone: () => FilterValidationRule;
-    readonly positiveNumber: () => FilterValidationRule;
-    readonly percentage: () => FilterValidationRule;
-    readonly range: (min: number, max: number) => FilterValidationRule;
-};
+export { VALIDATION_PATTERNS, VALIDATION_PRESETS, } from './filter-validation-presets.utils.js';

package/dist/lib/components/ui/collections/filter/partials/filter-field-special.d.ts

@@ -0,0 +1,8 @@
+import { FilterFieldProps } from '../filter-field.js';
+import { useFilterFieldConfig } from '../use-filter-field-config.js';
+type FilterFieldSpecialProps = Pick<FilterFieldProps, 'field' | 'value' | 'onChange' | 'onBlur' | 'error' | 'disabled' | 'className'> & {
+    commonProps: ReturnType<typeof useFilterFieldConfig>['commonProps'];
+};
+/** The types the generic `Field` does not render: a range slider, a number range. */
+export declare function FilterFieldSpecial({ field, value, onChange, onBlur, error, disabled, className, commonProps, }: FilterFieldSpecialProps): import("react").JSX.Element;
+export {};

package/dist/lib/components/ui/collections/filter/partials/filter-form-field-variant.d.ts

@@ -0,0 +1,10 @@
+import { ComponentProps } from 'react';
+import { FilterFormFieldProps } from '../filter-form-field.js';
+import { FilterInline } from '../filter-inline.js';
+type FilterFormFieldVariantProps = Pick<FilterFormFieldProps<Record<string, any>>, 'variant' | 'showActions' | 'contentClassName' | 'actionsClassName' | 'trigger' | 'title' | 'description' | 'triggerLabel' | 'showTriggerCount' | 'side'> & {
+    /** The props every variant takes, from the form controller. */
+    common: Pick<ComponentProps<typeof FilterInline>, 'schema' | 'values' | 'onChange' | 'onApply' | 'liveUpdate' | 'disabled' | 'className'>;
+};
+/** The variant of the filter (inline, dialog, sheet, drawer, popover) the form field renders. */
+export declare function FilterFormFieldVariant({ variant, common: commonProps, showActions, contentClassName, actionsClassName, trigger, title, description, triggerLabel, showTriggerCount, side, }: FilterFormFieldVariantProps): import("react").JSX.Element;
+export {};

package/dist/lib/components/ui/collections/filter/partials/filter-group-fields.d.ts

@@ -0,0 +1,5 @@
+import { FilterField as FilterFieldType } from '../types.js';
+/** The responsive grid of a group's visible fields, wired to the filter context. */
+export declare function FilterGroupFields({ fields }: {
+    fields: FilterFieldType[];
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/filter/partials/filter-legacy-variant.d.ts

@@ -0,0 +1,3 @@
+import { FilterProps } from '../filter-legacy.js';
+/** The variant (dialog, sheet, drawer, popover or inline) `FilterLegacy` renders. */
+export declare function FilterLegacyVariant(props: FilterProps): import("react").JSX.Element;

package/dist/lib/components/ui/collections/filter/partials/filter-preset-fields.d.ts

@@ -0,0 +1,9 @@
+/** The two fields of the save dialog: the preset's name (with its usage count) and description. */
+export declare function FilterPresetFields({ name, description, onName, onDescription, count, max, }: {
+    name: string;
+    description: string;
+    onName: (value: string) => void;
+    onDescription: (value: string) => void;
+    count: number;
+    max: number;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/filter/partials/filter-presets-menu-items.d.ts

@@ -0,0 +1,13 @@
+import { FilterPreset, FilterPresetsProps } from '../types.js';
+/** A preset row of the menu: its icon, name, description, default star and current check. */
+export declare function FilterPresetLoadItem({ preset, current, onLoad, }: {
+    preset: FilterPreset;
+    current: boolean;
+    onLoad: FilterPresetsProps['onLoad'];
+}): import("react").JSX.Element;
+/** A row of the menu's Manage section: set or unset the default, or delete. */
+export declare function FilterPresetManageItem({ preset, onDelete, onSetDefault, }: {
+    preset: FilterPreset;
+    onDelete: FilterPresetsProps['onDelete'];
+    onSetDefault: FilterPresetsProps['onSetDefault'];
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/filter/partials/filter-presets-menu.d.ts

@@ -0,0 +1,5 @@
+import { FilterPresetsProps } from '../types.js';
+type FilterPresetsMenuProps = Pick<FilterPresetsProps, 'presets' | 'currentPresetId' | 'onLoad' | 'onDelete' | 'onSetDefault' | 'disabled'>;
+/** The dropdown that loads a saved preset and manages them (default, delete). */
+export declare function FilterPresetsMenu({ presets, currentPresetId, onLoad, onDelete, onSetDefault, disabled, }: FilterPresetsMenuProps): import("react").JSX.Element;
+export {};

package/dist/lib/components/ui/collections/filter/partials/filter-presets-save-dialog.d.ts

@@ -0,0 +1,7 @@
+import { FilterPresetsProps } from '../types.js';
+type FilterPresetsSaveDialogProps = Pick<FilterPresetsProps, 'onSave' | 'maxPresets' | 'disabled' | 'cancelVariant'> & {
+    count: number;
+};
+/** The "+" button and its dialog that names and saves the current filters as a preset. */
+export declare function FilterPresetsSaveDialog({ onSave, count, maxPresets, disabled, cancelVariant, }: FilterPresetsSaveDialogProps): import("react").JSX.Element;
+export {};

package/dist/lib/components/ui/collections/filter/partials/filter-presets-save-trigger.d.ts

@@ -0,0 +1,7 @@
+import { ComponentProps } from 'react';
+import { IconButton } from '../../../actions/icon-button/icon-button.js';
+/** The "+" button that opens the save dialog, titled with the preset limit when it is reached. */
+export declare function FilterPresetsSaveTrigger({ canSave, max, ...props }: ComponentProps<typeof IconButton> & {
+    canSave: boolean;
+    max: number;
+}): import("react").JSX.Element;