@upbound/monarch-blocks 0.1.0

package/dist/data-table.d.ts

@@ -0,0 +1,505 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { RowData, ColumnFilter, Cell, Column, ColumnOrderState, Row, ColumnDef, CellContext, HeaderGroup, TableOptions, TableState, InitialTableState, SortingFn, FilterFn, ExpandedState, ColumnFiltersState, PaginationState, SortingState, VisibilityState, ColumnPinningState, GroupingState, OnChangeFn, ColumnSizingState } from '@tanstack/react-table';
+import * as React$1 from 'react';
+import { ReactNode, Dispatch, SetStateAction, ComponentType } from 'react';
+import { f as CelFilterSchema, g as CelFilterTree, k as CompileResult, i as CelRestrictedOptionSelectPayload } from './types-BULiU2qC.js';
+import { IconName } from '@upbound/monarch-core';
+
+/** A single entry (or nested submenu) in a cell's contextual right-click menu, alongside the built-in "Filter by this value" item. */
+type ContextualMenuAction<TData extends RowData = RowData, TValue = unknown> = {
+    id: string;
+    label: React.ReactNode;
+    disabled?: boolean | ((cell: Cell<TData, TValue>) => boolean);
+    onSelect?: (cell: Cell<TData, TValue>) => void;
+    items?: ContextualMenuAction<TData, TValue>[];
+    className?: string;
+};
+type CellContextualFilterProps<TData extends RowData, TValue> = {
+    filter?: ColumnFilter;
+    globalSearch?: string;
+    cell: Cell<TData, TValue>;
+    onContextCell: (filter: ColumnFilter, cell: Cell<TData, TValue>) => void;
+    onContextSearch?: (searchTerm: string, cell: Cell<TData, TValue>) => void;
+    contextualMenuActions?: ContextualMenuAction<TData, TValue>[];
+};
+/**
+ * The right-click cell menu content: an always-present "Filter by this value"
+ * item (disabled, never hidden, when nothing is derivable) plus any
+ * `contextualMenuActions`. Renders only the `ContextMenuContent` — the
+ * `ContextMenu`/`ContextMenuTrigger` wrapping the cell lives in the caller.
+ */
+declare function CellContextualFilter<TData extends RowData, TValue>({ filter, globalSearch, cell, onContextCell, onContextSearch, contextualMenuActions, }: CellContextualFilterProps<TData, TValue>): react_jsx_runtime.JSX.Element;
+
+type ColumnOptionsProps<TData extends RowData> = {
+    columns: Column<TData, unknown>[];
+    columnOrdering: ColumnOrderState;
+    onColumnOrderingChange: React$1.Dispatch<React$1.SetStateAction<ColumnOrderState>>;
+    disableColumnOrdering?: boolean;
+};
+/**
+ * The "Columns" dropdown: per-column visibility toggle + native HTML5
+ * drag-and-drop reordering (the source uses the browser's own drag/drop API,
+ * not a DnD library). Pinned/actions/filter-only columns are excluded from
+ * dragging and from the draggable list respectively; reordering only ever
+ * touches the unpinned slots (`mergeUnpinnedColumnOrder`), so pinned columns
+ * never jump position.
+ */
+declare function ColumnOptions<TData extends RowData>({ columns: rawColumns, columnOrdering, onColumnOrderingChange, disableColumnOrdering, }: ColumnOptionsProps<TData>): react_jsx_runtime.JSX.Element;
+
+declare function RowActions({ align, children, contentClassName, }: {
+    align?: 'start' | 'end';
+    children: React$1.ReactNode;
+    contentClassName?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function RowActionItem({ disabled, className, tooltip, children, onClick, }: {
+    disabled?: boolean;
+    className?: string;
+    tooltip?: string;
+    children: React$1.ReactNode;
+    onClick?: () => void;
+}): react_jsx_runtime.JSX.Element;
+/** A ready-made right-pinned, non-sortable/filterable/hideable "Actions" column. */
+declare function getActionsColumnDefinition<TData extends RowData, TValue = unknown>({ cell, }: Pick<ColumnDef<TData, TValue>, 'cell'>): ColumnDef<TData, TValue>;
+declare function ExpandButton<TData extends RowData>({ row }: {
+    row: Row<TData>;
+}): react_jsx_runtime.JSX.Element | null;
+/** A ready-made right-pinned, fixed-width (28px) "Expand" column. Defaults to an `ExpandButton` cell. */
+declare function getExpandColumnDefinition<TData extends RowData, TValue = unknown>(options?: {
+    cell?: (context: CellContext<TData, TValue>) => React$1.ReactNode;
+}): ColumnDef<TData, TValue>;
+type DataTableValueCellProps = {
+    content?: React$1.ReactNode;
+    /** Shown as a tooltip; also becomes the link's native title when `href` is set. */
+    title?: string;
+    className?: string;
+    href?: string;
+    onClick?: () => void;
+};
+/**
+ * A generic cell renderer: a link (when `href` is set), a dashed-underline
+ * value with a hover tooltip (when `title` is set), or plain content — with
+ * an em-dash placeholder when `content` is empty. Legacy injected its router
+ * `Link` via a DI hook (`useLink()`); Monarch has no such layer, so the link
+ * branch renders a plain `<a>`.
+ */
+declare function DataTableValueCell({ content, title, className, href, onClick }: DataTableValueCellProps): react_jsx_runtime.JSX.Element;
+/** A timestamp cell — relative time in the cell, absolute time on hover (via Monarch's `RelativeTime`); an em-dash when absent. */
+declare function TimestampCell({ timestamp }: {
+    timestamp?: Date | string | number;
+}): react_jsx_runtime.JSX.Element;
+
+/**
+ * Non-CEL column filter definitions — the `meta.filter` vocabulary consumed by
+ * contextual (right-click cell) filtering and by the plain filter bar.
+ * Mirrors TableWrapper's `Filters/types.ts` shapes; `id` is omitted here since
+ * it comes from the owning `ColumnDef.id`, not the filter definition itself.
+ */
+type ColumnFilterType = 'checkbox' | 'radio' | 'dateRange' | 'scrollableCheckbox' | 'scrollableRadio' | 'text' | 'multiText';
+type ColumnFilterOption = {
+    label: string;
+    value: string;
+    disabled?: boolean;
+    children?: ColumnFilterOption[];
+};
+type FetchColumnFilterOptionsArgs = {
+    query: string;
+    page: number;
+    signal: AbortSignal;
+};
+type FetchColumnFilterOptionsResult = {
+    items: ColumnFilterOption[];
+    hasMore: boolean;
+};
+type FetchColumnFilterOptions = (args: FetchColumnFilterOptionsArgs) => Promise<FetchColumnFilterOptionsResult>;
+type ColumnFilterBase = {
+    title: string;
+    type: ColumnFilterType;
+    order?: number;
+};
+type StaticCheckboxColumnFilter = ColumnFilterBase & {
+    type: 'checkbox' | 'scrollableCheckbox';
+    options: string[] | ColumnFilterOption[];
+    fetchFilterOptions?: never;
+};
+type AsyncCheckboxColumnFilter = ColumnFilterBase & {
+    type: 'checkbox' | 'scrollableCheckbox';
+    fetchFilterOptions: FetchColumnFilterOptions;
+    options?: never;
+};
+type CheckboxColumnFilter = StaticCheckboxColumnFilter | AsyncCheckboxColumnFilter;
+type RadioColumnFilter = ColumnFilterBase & {
+    type: 'radio' | 'scrollableRadio';
+    options: string[] | ColumnFilterOption[];
+};
+type DateRangeColumnFilter = ColumnFilterBase & {
+    type: 'dateRange';
+    /** When true, always show time inputs. When false, never show them. When omitted, auto-detect from value. */
+    includeTime?: boolean;
+};
+type TextColumnFilter = ColumnFilterBase & {
+    type: 'text';
+    placeholder?: string;
+};
+type MultiTextColumnFilter = ColumnFilterBase & {
+    type: 'multiText';
+    /** Defaults to comma (`,`) when omitted. */
+    delimiter?: string;
+    description?: string;
+    placeholder?: string;
+};
+type ColumnFilterDefinition = CheckboxColumnFilter | DateRangeColumnFilter | RadioColumnFilter | TextColumnFilter | MultiTextColumnFilter;
+type CheckboxColumnFilterValue = string[] | undefined;
+type RadioColumnFilterValue = string | undefined;
+type DateRangeColumnFilterValue = {
+    startDate: Date | null;
+    endDate: Date | null;
+} | undefined;
+type TextColumnFilterValue = string | undefined;
+type MultiTextColumnFilterValue = string[] | undefined;
+type ColumnFilterValue = CheckboxColumnFilterValue | RadioColumnFilterValue | DateRangeColumnFilterValue | TextColumnFilterValue | MultiTextColumnFilterValue;
+
+/** Derives a contextual (right-click cell) column-filter value from a cell. */
+type ContextualFilterValueParser<TData extends RowData, TValue> = (cell: Cell<TData, TValue>) => ColumnFilterValue | undefined;
+/** Derives a contextual (right-click cell) global-search term from a cell. */
+type ContextualGlobalSearchValueParser<TData extends RowData, TValue> = (cell: Cell<TData, TValue>) => string | undefined;
+/** A fixed-width grid track: sizes to content or an explicit CSS length. */
+type GridColumnFixed = {
+    fixed: string;
+    flex?: never;
+};
+type GridColumnFlexContentMin = {
+    min: 'max-content' | 'min-content';
+    minCap?: string;
+};
+type GridColumnFlexFixedMin = {
+    min?: string;
+    minCap?: never;
+};
+/** A proportional grid track: shares space by weight, with optional min/max. */
+type GridColumnFlex = {
+    flex: number;
+    max?: string;
+    fixed?: never;
+} & (GridColumnFlexContentMin | GridColumnFlexFixedMin);
+/**
+ * Column sizing for grid layout mode.
+ *
+ * Fixed column (sizes to content or explicit value):
+ *   { fixed: 'max-content' }
+ *   { fixed: '200px' }
+ *
+ * Proportional column (shares space by weight, with optional min/max):
+ *   { flex: 2, min: '100px' }
+ *   { flex: 0.5, min: 'max-content' }
+ *   { flex: 0.5, min: 'max-content', minCap: '200px' }
+ *   { flex: 1, min: '80px', max: '500px' }
+ */
+type GridColumnSizing = GridColumnFixed | GridColumnFlex;
+/**
+ * Column-def metadata `DataTable` reads — a straight port of TableWrapper's
+ * `ColumnMeta` module augmentation. Import this file for its side effect
+ * (`import '@/lib/data-table/table-meta'`) wherever a `ColumnDef` is authored
+ * with any of these fields.
+ */
+declare module '@tanstack/react-table' {
+    interface ColumnMeta<TData extends RowData, TValue> {
+        /** Pins the column left or right. Pinned columns are excluded from column reordering. */
+        pinning?: 'left' | 'right';
+        /** Marks an actions column — hides its header label and excludes it from contextual filtering. */
+        actions?: boolean;
+        /** The column's non-CEL filter definition, read by the plain filter bar and contextual filtering. */
+        filter?: ColumnFilterDefinition;
+        /** Parses a cell into a filter value for contextual (right-click) cell filtering. */
+        contextualFilterValue?: ContextualFilterValueParser<TData, TValue>;
+        /** Parses a cell into a search term for contextual (right-click) global search. */
+        contextualGlobalSearchValue?: ContextualGlobalSearchValueParser<TData, TValue>;
+        /** When true, the column is used only for filtering and is never rendered in the table. */
+        filterOnly?: boolean;
+        /** Column sizing for `layout="grid"` mode — see `GridColumnSizing`. */
+        grid?: GridColumnSizing;
+    }
+}
+
+type TableDataState = 'empty' | 'loading' | 'error' | 'success';
+
+/**
+ * Monarch-native equivalent of TableWrapper's `EmptyConfig` — same four
+ * states (error / empty / filtered-empty), rebuilt on Monarch's `Empty`
+ * compound API instead of a single props-driven component. Two deliberate
+ * adaptations: `icon` takes a Monarch `IconName` (no FontAwesome dependency),
+ * and `action` is a rendered node rather than a `ComponentType` reference.
+ * `details` has no native `Empty` slot — it composes `Alert` instead.
+ */
+type DataTableEmptyConfig = {
+    icon?: IconName;
+    header?: React$1.ReactNode;
+    subheader?: React$1.ReactNode;
+    details?: React$1.ReactNode;
+    action?: React$1.ReactNode;
+    className?: string;
+    wrapperClassName?: string;
+};
+declare const defaultErrorConfig: DataTableEmptyConfig;
+declare const defaultEmptyConfig: DataTableEmptyConfig;
+declare const defaultNoFilterFoundConfig: DataTableEmptyConfig;
+type DataTableEmptyView = {
+    empty?: DataTableEmptyConfig;
+    error?: DataTableEmptyConfig;
+    filter?: DataTableEmptyConfig;
+};
+declare function DataTableEmptyView({ emptyView, tableState, filterCount, resetFilters, className, }: {
+    emptyView?: DataTableEmptyView;
+    /** `'success'`/`'loading'` render nothing here — the table body handles those. */
+    tableState: TableDataState;
+    filterCount: number;
+    resetFilters: () => void;
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
+type RowCountRelation = 'eq' | 'gt';
+/** Pass `true` for defaults, `false` to disable the footer entirely (handled by the caller, not this component), or an object to toggle individual parts. */
+type DataTablePaginationConfig = boolean | {
+    /** Shows "Showing 1 to 20 of 25 results". @default true */
+    summary?: boolean;
+    /** Shows the first/previous/next/last icon buttons. @default true */
+    arrows?: boolean;
+    /** Shows numeric page buttons alongside the arrows. @default false */
+    numbers?: boolean;
+    /** Shows the rows-per-page selector. @default true */
+    pageSizeSelector?: boolean;
+    /** Options offered in the rows-per-page selector. @default [10, 20, 30, 40, 50, 60, 70, 80, 90, 100] */
+    pageSizeOptions?: number[];
+};
+/** Dedupes/sorts `pageSizeOptions`, and snaps `pageSize` to the nearest option when it isn't one (ties go to the lower value). */
+declare function normalizePageSizeOptions(pageSize: number, pageSizeOptions: number[]): {
+    normalizedPageSizeOptions: number[];
+    effectivePageSize: number;
+};
+type DataTablePaginationProps = {
+    pageIndex: number;
+    pageSize: number;
+    rowCount: number;
+    /** `'gt'` renders "N+ results" with an explanatory tooltip, for an inexact/server-estimated count. @default 'eq' */
+    rowCountRelation?: RowCountRelation;
+    paginationConfig?: DataTablePaginationConfig;
+    /** Called with the 1-based page number the user navigated to. */
+    onPageChange: (page: number) => void;
+    onPageSizeChange: (pageSize: number) => void;
+};
+declare function DataTablePagination({ pageIndex, pageSize, rowCount, rowCountRelation, paginationConfig, onPageChange, onPageSizeChange, }: DataTablePaginationProps): react_jsx_runtime.JSX.Element;
+
+declare function DataTableHeader<TData extends RowData>({ headerGroups, onAutosizeAll, onAutosizeColumn, onResetColumnSize, stickyHeader, layout, }: {
+    headerGroups: HeaderGroup<TData>[];
+    onAutosizeAll: () => void;
+    onAutosizeColumn: (columnId: string) => void;
+    /** Called when the user double-clicks the resize separator to reset a column to its default size. */
+    onResetColumnSize: (columnId: string) => void;
+    stickyHeader?: StickyHeaderConfig;
+    layout?: TableLayout;
+}): react_jsx_runtime.JSX.Element;
+type DataTableRowProps = React$1.HTMLAttributes<HTMLElement> & {
+    hoverable?: boolean;
+    disabled?: boolean;
+    layout?: TableLayout;
+};
+declare const DataTableRow: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLElement> & {
+    hoverable?: boolean;
+    disabled?: boolean;
+    layout?: TableLayout;
+} & React$1.RefAttributes<HTMLElement>>;
+declare function DataTableCell<TData extends RowData, TValue>({ cell, className, showContextualFilter, onContextCell, onContextSearch, contextualMenuActions, layout, }: {
+    cell: Cell<TData, TValue>;
+    className?: string;
+    showContextualFilter?: boolean;
+    onContextCell?: (filter: ColumnFilter, cell: Cell<TData, TValue>) => void;
+    onContextSearch?: (searchTerm: string, cell: Cell<TData, TValue>) => void;
+    contextualMenuActions?: ContextualMenuAction<TData, TValue>[];
+    layout?: TableLayout;
+}): react_jsx_runtime.JSX.Element;
+declare function DataTableGroupRow({ groupLabel, colSpan, layout, }: {
+    groupLabel: string;
+    colSpan: number;
+    layout?: TableLayout;
+}): react_jsx_runtime.JSX.Element;
+type SkeletonColumn = {
+    id: string;
+    size?: number;
+    minSize?: number;
+    maxSize?: number;
+};
+declare function DataTableSkeletonBody({ rowCount, columns, renderCell, layout, }: {
+    rowCount?: number;
+    columns: SkeletonColumn[];
+    renderCell?: (columnId: string) => React$1.ReactNode | undefined;
+    layout?: TableLayout;
+}): react_jsx_runtime.JSX.Element;
+declare function DataTableExpandedRow({ colSpan, show, children, layout, }: {
+    colSpan: number;
+    show?: boolean;
+    children: React$1.ReactNode;
+    layout?: TableLayout;
+}): react_jsx_runtime.JSX.Element | null;
+declare function DataTableBody<TData extends RowData>({ tableRows, tableState, columns, skeletonRowCount, renderSkeletonCell, onRowRender, renderExpandedRow, showContextualFilter, onContextCell, onContextSearch, contextualMenuActions, layout, }: {
+    tableRows: Row<TData>[];
+    tableState: TableDataState;
+    columns: Column<TData, unknown>[];
+    skeletonRowCount?: number;
+    renderSkeletonCell?: (columnId: string) => React$1.ReactNode | undefined;
+    onRowRender?: (row: TData) => DataTableRowProps;
+    renderExpandedRow?: (row: TData) => React$1.ReactNode;
+    showContextualFilter?: boolean;
+    onContextCell?: (filter: ColumnFilter, cell: Cell<TData, unknown>) => void;
+    onContextSearch?: (searchTerm: string, cell: Cell<TData, unknown>) => void;
+    contextualMenuActions?: ContextualMenuAction<TData, unknown>[];
+    layout?: TableLayout;
+}): react_jsx_runtime.JSX.Element;
+
+/**
+ * Table rendering mode. `'auto'` uses a native `<table>`. `'grid'` renders
+ * CSS Grid + subgrid `<div role="...">` markup instead, with column widths
+ * driven by each column's `meta.grid` (`table-meta.ts`) rather than
+ * `size`/`minSize`/`maxSize`. Column pinning is unavailable in `'grid'` mode.
+ */
+type TableLayout = 'auto' | 'grid';
+/** Enables sticky column headers. Pass `true` for defaults, or an object to customize offset/row height. */
+type StickyHeaderConfig = boolean | {
+    /** Pixels from the top of the scroll container (e.g. space for a fixed bar). */
+    offset?: number;
+    /** Assumed header-row height in px, used to stack multiple header groups. @default 48 */
+    rowHeight?: number;
+};
+/** The `useReactTable` config `DataTable` forwards. A near-exact `TableOptions` port — see the orchestrator's `config` merge for exactly which fields are honored. */
+interface TableHookOptions<TData extends RowData> extends Omit<TableOptions<TData>, 'getCoreRowModel' | 'getSortedRowModel' | 'getFilteredRowModel'> {
+    data: TData[];
+    state?: Partial<TableState>;
+    initialState?: InitialTableState;
+    sortingFns?: Record<string, SortingFn<TData>>;
+    filterFns?: Record<string, FilterFn<TData>>;
+    globalFilterFn?: FilterFn<TData>;
+    enableSortingRemoval?: boolean;
+    enablePagination?: boolean;
+    rowCountRelation?: RowCountRelation;
+}
+/** Wires the CEL filter builder into the filter row in place of plain column filters. */
+type DataTableCelFilterConfig<TData extends RowData> = {
+    schema: CelFilterSchema;
+    tree: CelFilterTree;
+    onTreeChange: (tree: CelFilterTree) => void;
+    onCompileResultChange?: (result: CompileResult) => void;
+    onContextualFilter?: (payload: {
+        columnId: string;
+        values: string[];
+        cell: Cell<TData, unknown>;
+    }) => void;
+    /** Invoked when the user clicks a disabled CEL filter option. */
+    onRestrictedOptionSelect?: (payload: CelRestrictedOptionSelectPayload) => void;
+    activeFilterCount: number;
+    showClearButton?: boolean;
+};
+/**
+ * `DataTable`'s public prop surface — an exact-name port of legacy
+ * `TableWrapperProps<T>`. The only intended differences are internal
+ * (Monarch primitives instead of hand-rolled ones); every prop name, shape,
+ * and default here must match the source.
+ */
+interface DataTableProps<TData extends RowData> {
+    id: string;
+    config: TableHookOptions<TData>;
+    title?: ReactNode;
+    description?: ReactNode;
+    loading?: boolean;
+    renderSkeletonCell?: (columnId: string) => ReactNode | undefined;
+    showError?: boolean;
+    emptyView?: DataTableEmptyView;
+    className?: string;
+    /** Table layout mode. 'auto' uses native HTML table layout, 'grid' uses CSS Grid with div elements. @default 'auto' */
+    layout?: TableLayout;
+    /** When true, table height fits content instead of using viewport-based height constraints. @default false */
+    fitContent?: boolean;
+    serverSidePagination?: boolean;
+    onRowRender?(row: TData): DataTableRowProps;
+    renderExpandedRow?: (row: TData) => ReactNode;
+    /** Controlled expanded state (optional). When omitted, `DataTable` uses internal state. */
+    expanded?: ExpandedState;
+    onExpandedChange?: Dispatch<SetStateAction<ExpandedState>>;
+    ActionsComponent?: ComponentType<{
+        state: TableDataState;
+    }>;
+    disableSearch?: boolean;
+    disableFilters?: boolean;
+    disableSorting?: boolean;
+    /**
+     * Configure the pagination UI. Pass `false` to disable pagination, `true` for defaults,
+     * or an object to control individual pagination parts.
+     */
+    paginationConfig?: DataTablePaginationConfig;
+    disableColumnReordering?: boolean;
+    disableColumnVisibility?: boolean;
+    disableColumnResizing?: boolean;
+    /**
+     * When true, disables column pinning (sticky left pin and Pin/Unpin menu).
+     * @default false
+     * Column pinning is always unavailable in `layout="grid"`, regardless of this flag.
+     */
+    disableColumnPinning?: boolean;
+    searchTerm?: string;
+    onSearchTermChange?: Dispatch<SetStateAction<string>>;
+    filters?: ColumnFiltersState;
+    onFiltersChange?: Dispatch<SetStateAction<ColumnFiltersState>>;
+    pagination?: PaginationState;
+    onPaginationChange?: Dispatch<SetStateAction<PaginationState>>;
+    sorting?: SortingState;
+    onSortingChange?: Dispatch<SetStateAction<SortingState>>;
+    columnOrdering?: ColumnOrderState;
+    onColumnOrderingChange?: Dispatch<SetStateAction<ColumnOrderState>>;
+    columnVisibility?: VisibilityState;
+    onColumnVisibilityChange?: Dispatch<SetStateAction<VisibilityState>>;
+    columnPinning?: ColumnPinningState;
+    onColumnPinningChange?: Dispatch<SetStateAction<ColumnPinningState>>;
+    grouping?: GroupingState;
+    onGroupingChange?: OnChangeFn<GroupingState>;
+    /** Additional className applied to the CEL filter builder wrapper inside the filter bar. */
+    celFilterClassName?: string;
+    showContextualFilter?: boolean;
+    onContextCell?: (filter: ColumnFilter, cell: Cell<TData, unknown>) => void;
+    contextualMenuActions?: ContextualMenuAction<TData, unknown>[];
+    /** Initial column sizing state. Seed from a sync adapter or other persistence source. */
+    initialColumnSizing?: ColumnSizingState;
+    /** Called whenever column sizing changes, allowing the consumer to persist the new sizing. */
+    onColumnSizingPersist?: (sizing: ColumnSizingState) => void;
+    /**
+     * Enable sticky column headers within the table scroll area.
+     * Pass `true` for defaults, or an object to customise offset / row height.
+     */
+    stickyHeader?: StickyHeaderConfig;
+    /** When set, renders the CEL filter builder in the filter row instead of column filters. */
+    celFilterConfig?: DataTableCelFilterConfig<TData>;
+}
+
+/**
+ * Full port of legacy `TableWrapper` — same prop surface
+ * (`DataTableProps<T>` mirrors `TableWrapperProps<T>` name-for-name), same
+ * controlled/uncontrolled state merges, same behavior. The only intended
+ * difference is that columns, headers, rows, cells, and menus render through
+ * Monarch's own primitives instead of legacy's hand-rolled ones.
+ */
+declare function DataTable<TData extends RowData>({ id, config, title, description, emptyView, showError, className, fitContent, loading, renderSkeletonCell, serverSidePagination, ActionsComponent: Actions, onRowRender, renderExpandedRow, expanded: parentExpanded, onExpandedChange: parentOnExpandedChange, disableSearch, disableFilters, disableSorting, paginationConfig, disableColumnReordering, disableColumnVisibility, disableColumnResizing, disableColumnPinning, searchTerm: parentGlobalFilter, onSearchTermChange: parentSetGlobalFilter, filters: parentColumnFilters, onFiltersChange: parentSetColumnFilters, pagination: parentPagination, onPaginationChange: parentSetPagination, sorting: parentSorting, onSortingChange: parentSetSorting, columnOrdering: parentColumnOrdering, onColumnOrderingChange: parentSetColumnOrdering, columnVisibility: parentColumnVisibility, onColumnVisibilityChange: parentSetColumnVisibility, columnPinning: parentColumnPinning, onColumnPinningChange: parentSetColumnPinning, grouping: parentGrouping, onGroupingChange: parentSetGrouping, celFilterClassName, showContextualFilter, onContextCell, contextualMenuActions, layout, initialColumnSizing, onColumnSizingPersist, stickyHeader, celFilterConfig, }: DataTableProps<TData>): react_jsx_runtime.JSX.Element;
+
+type ViewFilterProps<TData extends RowData> = {
+    columns: Column<TData, unknown>[];
+    columnFilters: ColumnFiltersState;
+    onColumnFiltersChange: React$1.Dispatch<React$1.SetStateAction<ColumnFiltersState>>;
+    className?: string;
+};
+/**
+ * The plain (non-CEL) filter row — a thin state adapter over Monarch's
+ * `FilterBar`, mirroring TableWrapper's own `ViewFilter` (itself just a
+ * `FilterBar` adapter, not a hand-rolled UI). Every `meta.filter` shape
+ * (checkbox/scrollableCheckbox, radio/scrollableRadio, dateRange, text,
+ * multiText) gets a chip here, mapped onto the matching `FilterBar` chip
+ * type. CEL-based filtering (`celFilterConfig`) is the richer, operator-driven
+ * tier this is not meant to replace.
+ */
+declare function ViewFilter<TData extends RowData>({ columns, columnFilters, onColumnFiltersChange, className, }: ViewFilterProps<TData>): react_jsx_runtime.JSX.Element;
+
+export { CellContextualFilter, type CellContextualFilterProps, ColumnOptions, type ColumnOptionsProps, type ContextualMenuAction, DataTable, DataTableBody, type DataTableCelFilterConfig, DataTableCell, type DataTableEmptyConfig, DataTableEmptyView, DataTableExpandedRow, DataTableGroupRow, DataTableHeader, DataTablePagination, type DataTablePaginationConfig, type DataTablePaginationProps, type DataTableProps, DataTableRow, type DataTableRowProps, DataTableSkeletonBody, DataTableValueCell, type DataTableValueCellProps, ExpandButton, RowActionItem, RowActions, type RowCountRelation, type StickyHeaderConfig, type TableHookOptions, type TableLayout, TimestampCell, ViewFilter, type ViewFilterProps, defaultEmptyConfig, defaultErrorConfig, defaultNoFilterFoundConfig, getActionsColumnDefinition, getExpandColumnDefinition, normalizePageSizeOptions };