@structyl/data-table 1.0.0

package/dist/index.d.cts

@@ -0,0 +1,703 @@
+import * as React from 'react';
+import { Row, Column, ColumnDef, Table, Cell, PaginationState, SortingState, ColumnFiltersState, RowSelectionState, VisibilityState, ColumnOrderState, ColumnSizingState, ColumnPinningState, GroupingState } from '@tanstack/react-table';
+export { ColumnDef, ColumnFiltersState, ColumnOrderState, ColumnPinningState, ColumnSizingState, ExpandedState, GroupingState, PaginationState, Row, RowSelectionState, SortingState, Table, VisibilityState, createColumnHelper } from '@tanstack/react-table';
+
+type DataTableColumn<TData, TValue = unknown> = ColumnDef<TData, TValue>;
+type DataTableFilterOperator = 'contains' | 'equals' | 'startsWith' | 'endsWith' | 'gt' | 'gte' | 'lt' | 'lte' | 'empty' | 'notEmpty';
+type DataTableFilterLogic = 'and' | 'or';
+type DataTableAggregation = 'sum' | 'avg' | 'min' | 'max' | 'count' | ((values: unknown[], rows: Row<unknown>[]) => React.ReactNode);
+type DataTableLoadingVariant = 'text' | 'skeleton' | 'spinner';
+interface DataTableFilterRule {
+    id: string;
+    columnId: string;
+    operator: DataTableFilterOperator;
+    value?: unknown;
+}
+type DataTableFilterItem = DataTableFilterRule | DataTableFilterGroup;
+interface DataTableFilterGroup {
+    id: string;
+    logic: DataTableFilterLogic;
+    items: DataTableFilterItem[];
+}
+interface ServerDataState {
+    pagination?: PaginationState;
+    sorting?: SortingState;
+    filters?: ColumnFiltersState;
+    globalFilter?: string;
+    advancedFilter?: DataTableFilterGroup;
+    rowSelection?: RowSelectionState;
+}
+interface ServerData<TData> {
+    rows: TData[];
+    total: number;
+}
+interface DataTableLocaleText {
+    searchPlaceholder: string;
+    filters: string;
+    filterColumnLabel: string;
+    filterOperatorLabel: string;
+    filterValueLabel: string;
+    filterLogicLabel: string;
+    addFilter: string;
+    addFilterGroup: string;
+    clearFilters: string;
+    removeFilter: string;
+    removeFilterGroup: string;
+    columns: string;
+    columnMenu: string;
+    sortAsc: string;
+    sortDesc: string;
+    clearSort: string;
+    hideColumn: string;
+    pinLeft: string;
+    pinRight: string;
+    unpin: string;
+    groupBy: string;
+    ungroup: string;
+    selectColumn: string;
+    selectedRows: (selected: number, total: number) => string;
+    page: (page: number, pageCount: number) => string;
+    previous: string;
+    next: string;
+    noResults: string;
+    loading: string;
+    loadingMore: string;
+    error: string;
+    addRow: string;
+    cancel: string;
+    save: string;
+    rowActions: string;
+    rowTotal: string;
+    pinRowTop: string;
+    pinRowBottom: string;
+    total: string;
+    expandRow: string;
+    collapseRow: string;
+    expandAll: string;
+    collapseAll: string;
+    copyRows: string;
+    copyRow: string;
+    copyColumn: string;
+    density: string;
+    densityCompact: string;
+    densityStandard: string;
+    densityComfortable: string;
+    refresh: string;
+    exportCsv: string;
+    exportJson: string;
+    noRows: string;
+    rowsPerPage: string;
+    totalRows: (count: number) => string;
+    goToPage: string;
+    firstPage: string;
+    lastPage: string;
+    bulkActionsTitle: (count: number) => string;
+    clearSelection: string;
+    rowNumberHeader: string;
+    statusBarRows: (count: number) => string;
+    statusBarSelected: (count: number) => string;
+    printTitle: string;
+    enterFullscreen: string;
+    exitFullscreen: string;
+    autoSizeColumn: string;
+    quickFilterPlaceholder: string;
+    lockColumn: string;
+    unlockColumn: string;
+    export?: string;
+    exportCSV?: string;
+    exportJSON?: string;
+    exportSelectedCSV?: string;
+    conditionalFormatting?: string;
+}
+interface DataTableInlineCreate {
+    fields: Array<{
+        id: string;
+        label?: React.ReactNode;
+        type?: 'text' | 'number';
+        placeholder?: string;
+    }>;
+    onAdd: (values: Record<string, string>) => void;
+    label?: React.ReactNode;
+}
+interface DataTableRowTotals<TData> {
+    id?: string;
+    header?: React.ReactNode;
+    columns?: string[];
+    format?: (value: number, row: Row<TData>) => React.ReactNode;
+}
+interface DataTableRowPinningState {
+    top?: string[];
+    bottom?: string[];
+}
+type DataTableColumnType = 'string' | 'number' | 'date' | 'dateTime' | 'boolean' | 'badge' | 'progress' | 'link' | 'avatar' | 'currency' | 'sparkline' | 'rating';
+type DataTableDensity = 'compact' | 'standard' | 'comfortable';
+interface DataTableCellParams<TData, TValue = unknown> {
+    row: Row<TData>;
+    value: TValue;
+    field: string;
+}
+interface DataTableHeaderParams<TData, TValue = unknown> {
+    column: Column<TData, TValue>;
+}
+interface DataTableToolbarAction<TData = unknown> {
+    id: string;
+    icon?: React.ReactNode;
+    label?: React.ReactNode;
+    tooltip?: string;
+    onClick?: (table: Table<TData>) => void;
+    render?: (table: Table<TData>) => React.ReactNode;
+    disabled?: boolean;
+}
+interface DataTableColumnMenuSlotProps<TData> {
+    column: Column<TData, unknown>;
+    table: Table<TData>;
+}
+interface DataTableSearchSlotProps {
+    value: string;
+    onValueChange: (value: string) => void;
+    placeholder: string;
+}
+interface DataTableFilterSlotProps<TData> {
+    table: Table<TData>;
+    filter?: DataTableFilterGroup;
+    onFilterChange: (filter: DataTableFilterGroup | undefined) => void;
+    localeText: DataTableLocaleText;
+    overlayBoundary?: HTMLDivElement | null;
+}
+interface DataTableLoadingSkeletonSlotProps {
+    rows: number;
+    columns: number;
+}
+interface DataTableLoadingOverlaySlotProps {
+    text: string;
+    variant: DataTableLoadingVariant;
+}
+/** Slot overrides — provide a component to replace any built-in sub-component. */
+interface DataTableSlots<TData> {
+    /** Replace the entire toolbar section. Receives the live TanStack table instance. */
+    Toolbar?: React.ComponentType<{
+        table: Table<TData>;
+        localeText: DataTableLocaleText;
+    }>;
+    /** Replace the pagination section. */
+    Pagination?: React.ComponentType<{
+        table: Table<TData>;
+        localeText: DataTableLocaleText;
+        pageSizeOptions: number[];
+    }>;
+    /** Replace the column context menu dropdown. */
+    ColumnMenu?: React.ComponentType<DataTableColumnMenuSlotProps<TData>>;
+    /** Replace the advanced filter button/panel. */
+    Filter?: React.ComponentType<DataTableFilterSlotProps<TData>>;
+    /** Replace the global search input. */
+    Search?: React.ComponentType<DataTableSearchSlotProps>;
+    /** Replace the skeleton loading rows. */
+    LoadingSkeleton?: React.ComponentType<DataTableLoadingSkeletonSlotProps>;
+    /** Replace the loading overlay (spinner / text). */
+    LoadingOverlay?: React.ComponentType<DataTableLoadingOverlaySlotProps>;
+    /** Shown when the data source has no rows (before any filter). */
+    NoRowsOverlay?: React.ComponentType;
+    /** Shown when search / filter produce zero results from a non-empty dataset. */
+    NoResultsOverlay?: React.ComponentType;
+}
+interface DataTableBulkAction<TData = unknown> {
+    id: string;
+    label: React.ReactNode;
+    icon?: React.ReactNode;
+    tooltip?: string;
+    onClick: (selectedRows: Row<TData>[], table: Table<TData>) => void;
+    disabled?: boolean | ((selectedRows: Row<TData>[]) => boolean);
+    variant?: 'default' | 'destructive';
+}
+interface DataTableRowActionItem<TData = unknown> {
+    id: string;
+    label: React.ReactNode;
+    icon?: React.ReactNode;
+    tooltip?: string;
+    onClick: (row: Row<TData>) => void;
+    disabled?: boolean | ((row: Row<TData>) => boolean);
+    /** Hide this item for specific rows. */
+    hidden?: boolean | ((row: Row<TData>) => boolean);
+    variant?: 'default' | 'destructive';
+    /** Insert a visual separator above this item. */
+    separator?: boolean;
+}
+/**
+ * Structyl-extended column definition. All properties are optional so you can use
+ * just `field` + `headerName` without satisfying TanStack's union requirements.
+ * `normalizeColumnDefs` converts this to a proper TanStack `ColumnDef` before
+ * passing it to `useReactTable`.
+ */
+type DataTableColumnDef<TData, TValue = unknown> = {
+    /** Field key on the data object — maps to `accessorKey`. */
+    field?: string;
+    /** Stable DB identifier distinct from the display field. */
+    fieldId?: string;
+    /** Human-readable header label — maps to `header` when a string. */
+    headerName?: string;
+    /** Data type — drives alignment, filter operators, and format. */
+    type?: DataTableColumnType;
+    /** Horizontal alignment for header and cells. */
+    align?: 'left' | 'center' | 'right';
+    /** Flex grow factor; column fills remaining width proportionally. */
+    flex?: number;
+    /** Read value from a row — maps to `accessorFn`. */
+    valueGetter?: (row: TData) => TValue;
+    /** Write an edited value back (used by inline editing). */
+    valueSetter?: (row: TData, value: TValue, rowIndex: number) => void;
+    /** Validation function for inline editing — return an error message string or undefined. */
+    validate?: (value: unknown, row: TData) => string | undefined;
+    /** Validation function applied to display-mode cells — return an error message or undefined. */
+    displayValidate?: (value: unknown, row: TData) => string | undefined;
+    /** Mark column as inline-editable. */
+    editable?: boolean;
+    /** Locale for Intl formatting of this column, e.g. 'en-US', 'de-DE'. Overrides the table-level locale. */
+    locale?: string;
+    /** DateTimeFormat options for date / dateTime columns. */
+    dateFormat?: Intl.DateTimeFormatOptions;
+    /** NumberFormat options for number / currency columns. */
+    numberFormat?: Intl.NumberFormatOptions;
+    /** IANA timezone for dateTime columns, e.g. 'America/New_York'. */
+    timezone?: string;
+    /** Badge map: value → { label?, color?, textColor? }. Used when type='badge'. */
+    badgeMap?: Record<string, {
+        label?: string;
+        color?: string;
+        textColor?: string;
+    }>;
+    /** ISO currency code, e.g. 'USD'. Used when type='currency'. */
+    currencyCode?: string;
+    /** Locale for Intl.NumberFormat, e.g. 'en-US'. Used when type='currency'. */
+    currencyLocale?: string;
+    /** Href for link cells. String = static, function = computed from value+row. */
+    linkHref?: string | ((value: unknown, row: TData) => string);
+    /** Target attribute for link cells. */
+    linkTarget?: '_blank' | '_self';
+    /** Function returning image URL from value+row. Used when type='avatar'. */
+    avatarSrc?: (value: unknown, row: TData) => string;
+    /** Function returning number array for sparkline chart. Used when type='sparkline'. */
+    sparklineData?: (row: TData) => number[];
+    /** Sparkline chart variant. */
+    sparklineType?: 'line' | 'bar' | 'area';
+    /** Max value for progress bar. Default 100. Used when type='progress'. */
+    progressMax?: number;
+    /** Max star count for rating. Default 5. Used when type='rating'. */
+    ratingMax?: number;
+    /** Custom cell renderer — maps to `cell`. */
+    renderCell?: (params: DataTableCellParams<TData, TValue>) => React.ReactNode;
+    /** Custom header renderer — maps to `header`. */
+    renderHeader?: (params: DataTableHeaderParams<TData, TValue>) => React.ReactNode;
+    /** Tooltip shown on the column header. */
+    description?: string;
+    /** Override the default filter operators for this column. */
+    filterOperators?: DataTableFilterOperator[];
+    id?: string;
+    accessorKey?: string;
+    accessorFn?: (originalRow: TData, index: number) => TValue;
+    header?: ColumnDef<TData, TValue>['header'];
+    cell?: ColumnDef<TData, TValue>['cell'];
+    footer?: ColumnDef<TData, TValue>['footer'];
+    columns?: DataTableColumnDef<TData, TValue>[];
+    size?: number;
+    minSize?: number;
+    maxSize?: number;
+    enableSorting?: boolean;
+    enableHiding?: boolean;
+    enableResizing?: boolean;
+    enableColumnFilter?: boolean;
+    enableGlobalFilter?: boolean;
+    enableGrouping?: boolean;
+    enablePinning?: boolean;
+    enableMultiSort?: boolean;
+    sortDescFirst?: boolean;
+    invertSorting?: boolean;
+    meta?: object;
+    getGroupingValue?: (row: TData) => unknown;
+};
+interface DataTableConditionalRule {
+    id: string;
+    columnId: string;
+    operator: 'equals' | 'notEquals' | 'contains' | 'gt' | 'gte' | 'lt' | 'lte' | 'empty' | 'notEmpty';
+    value?: string;
+    backgroundColor?: string;
+    textColor?: string;
+}
+/** Cell selection range for `enableCellSelection`. */
+type DataTableCellSelection = {
+    startRowIndex: number;
+    startColIndex: number;
+    endRowIndex: number;
+    endColIndex: number;
+};
+/** Pivot table configuration. */
+type DataTablePivotConfig = {
+    /** Column whose unique values become row headers. */
+    rowGroupField: string;
+    /** Column whose unique values become column headers. */
+    pivotField: string;
+    /** Column whose values are aggregated in each cell. */
+    valueField: string;
+    /** Aggregation function applied to each pivot cell. */
+    aggregation: 'count' | 'sum' | 'avg' | 'min' | 'max';
+};
+/** A saved snapshot of the table's display state. */
+type DataTableSavedView = {
+    id: string;
+    name: string;
+    /** ISO date string. */
+    createdAt: string;
+    state: {
+        sorting?: SortingState;
+        columnFilters?: ColumnFiltersState;
+        globalFilter?: string;
+        columnVisibility?: VisibilityState;
+        columnOrder?: ColumnOrderState;
+        columnSizing?: ColumnSizingState;
+        columnPinning?: ColumnPinningState;
+        density?: DataTableDensity;
+        grouping?: GroupingState;
+        conditionalFormattingRules?: DataTableConditionalRule[];
+    };
+};
+/** A cell-level validation error produced by `displayValidate`. */
+type DataTableValidationError = {
+    rowId: string;
+    field: string;
+    value: unknown;
+    message: string;
+};
+/** Column statistics computed in the Tool Panel Stats tab. */
+type ColumnStats = {
+    count: number;
+    nullCount: number;
+    uniqueCount: number;
+    min?: number;
+    max?: number;
+    mean?: number;
+    median?: number;
+    sum?: number;
+    minLength?: number;
+    maxLength?: number;
+    avgLength?: number;
+    topValues: Array<{
+        value: string;
+        count: number;
+        pct: number;
+    }>;
+};
+interface DataTableProps<TData, TValue = unknown> {
+    columns: DataTableColumnDef<TData, TValue>[];
+    data: TData[];
+    /** Render rows virtually. Specify estimated row height. */
+    virtual?: boolean | {
+        estimatedRowHeight?: number;
+        overscan?: number;
+    };
+    /** Render leaf columns virtually for wide grids. */
+    virtualColumns?: boolean | {
+        estimatedColumnWidth?: number;
+        overscan?: number;
+    };
+    enableSorting?: boolean;
+    enableFiltering?: boolean;
+    enableAdvancedFiltering?: boolean;
+    enableGlobalSearch?: boolean;
+    enableRowSelection?: boolean | 'single';
+    enableColumnSelection?: boolean;
+    enablePagination?: boolean;
+    enableExpanding?: boolean;
+    enableGrouping?: boolean;
+    enableColumnResizing?: boolean;
+    enableColumnReordering?: boolean;
+    enableRowReordering?: boolean;
+    enableColumnPinning?: boolean;
+    enableRowPinning?: boolean;
+    enableColumnConfiguration?: boolean;
+    pageSize?: number;
+    loading?: boolean;
+    loadingMore?: boolean;
+    loadingVariant?: DataTableLoadingVariant;
+    skeletonRows?: number;
+    error?: React.ReactNode;
+    emptyState?: React.ReactNode;
+    className?: string;
+    tableClassName?: string;
+    toolbar?: React.ReactNode | ((table: Table<TData>) => React.ReactNode);
+    toolbarStart?: React.ReactNode;
+    toolbarEnd?: React.ReactNode;
+    globalFilter?: string;
+    defaultGlobalFilter?: string;
+    onGlobalFilterChange?: (value: string) => void;
+    globalFilterPlaceholder?: string;
+    advancedFilter?: DataTableFilterGroup;
+    defaultAdvancedFilter?: DataTableFilterGroup;
+    onAdvancedFilterChange?: (filter: DataTableFilterGroup | undefined) => void;
+    getAdvancedFilterValue?: (row: TData, columnId: string) => unknown;
+    rowActions?: (row: Row<TData>) => React.ReactNode;
+    inlineCreateRow?: DataTableInlineCreate;
+    aggregations?: Record<string, DataTableAggregation>;
+    showColumnTotals?: boolean;
+    rowTotals?: boolean | DataTableRowTotals<TData>;
+    rowPinning?: DataTableRowPinningState;
+    defaultRowPinning?: DataTableRowPinningState;
+    onRowPinningChange?: (state: DataTableRowPinningState) => void;
+    columnSelection?: string[];
+    defaultColumnSelection?: string[];
+    onColumnSelectionChange?: (columnIds: string[]) => void;
+    renderDetailPanel?: (row: Row<TData>) => React.ReactNode;
+    getCellColSpan?: (cell: Cell<TData, unknown>, row: Row<TData>) => number | undefined;
+    getCellRowSpan?: (cell: Cell<TData, unknown>, row: Row<TData>) => number | undefined;
+    getRowClassName?: (row: Row<TData>) => string | undefined;
+    getRowStyle?: (row: Row<TData>) => React.CSSProperties | undefined;
+    getRowHeight?: (row: Row<TData>) => number | undefined;
+    height?: number | string;
+    maxHeight?: number | string;
+    fullHeight?: boolean;
+    autoHeight?: boolean;
+    onLoadMore?: () => void;
+    hasMore?: boolean;
+    loadMoreThreshold?: number;
+    onRowOrderChange?: (rows: TData[], rowIds: string[]) => void;
+    onColumnOrderChange?: (columnIds: string[]) => void;
+    localeText?: Partial<DataTableLocaleText>;
+    /** Server-side data adapter. When provided, internal sort/filter/pagination is disabled. */
+    serverSide?: {
+        state: ServerDataState;
+        onStateChange: (state: ServerDataState) => void;
+        rowCount: number;
+    };
+    getRowId?: (row: TData, index: number) => string;
+    getSubRows?: (row: TData) => TData[] | undefined;
+    onRowSelectionChange?: (state: RowSelectionState) => void;
+    onSortingChange?: (state: SortingState) => void;
+    /** Imperative ref exposing the underlying TanStack Table instance. */
+    tableRef?: React.MutableRefObject<Table<TData> | null>;
+    /** Override any built-in sub-component with your own. */
+    slots?: DataTableSlots<TData>;
+    /** Page size options shown in the rows-per-page selector. */
+    pageSizeOptions?: number[];
+    /** Show the total row count in the pagination bar. */
+    showTotalRows?: boolean;
+    /** Overlay shown when the data source has no rows (before any filter/search). */
+    noRowsOverlay?: React.ReactNode;
+    /** Overlay shown when filters/search produce no results from a non-empty dataset. */
+    noResultsOverlay?: React.ReactNode;
+    /** Actions shown in the bulk-action bar when one or more rows are selected. */
+    bulkActions?: DataTableBulkAction<TData>[];
+    /** Structured row action items rendered as a 3-dot dropdown menu in the action column. */
+    rowActionMenu?: DataTableRowActionItem<TData>[];
+    /** Structured row action items rendered as inline buttons in the action column. */
+    rowActionButtons?: DataTableRowActionItem<TData>[];
+    /** Ctrl+C on a row also copies that single row (in addition to multi-row copy). */
+    enableRowCopy?: boolean;
+    /** Add a "Copy column" item to the column context menu. */
+    enableColumnCopy?: boolean;
+    /** Row/cell density. */
+    density?: DataTableDensity;
+    defaultDensity?: DataTableDensity;
+    enableDensityToggle?: boolean;
+    onDensityChange?: (density: DataTableDensity) => void;
+    /** Enable tree data — adds visual indentation based on row depth (use with `getSubRows`). */
+    treeData?: boolean;
+    /** Enable Ctrl+C to copy selected rows as TSV. */
+    enableCopyPaste?: boolean;
+    onCopy?: (rows: Row<TData>[], text: string) => void;
+    /** Custom toolbar action buttons rendered in the right toolbar section. */
+    toolbarActions?: DataTableToolbarAction<TData>[];
+    /** Callback for a Refresh toolbar action. */
+    onRefresh?: () => void;
+    /** Return extra CSS class(es) for a specific cell based on its value and row. */
+    getCellClassName?: (cell: Cell<TData, unknown>, row: Row<TData>) => string | undefined;
+    /** Show a fixed row-number column as the first column (1, 2, 3…). */
+    enableRowNumbers?: boolean;
+    /** Alternate row background color for readability. */
+    striped?: boolean;
+    /** Show the full cell value as a tooltip when the cell content is truncated. */
+    enableCellTooltip?: boolean;
+    /**
+     * Persist column order/visibility/sizing, sort, filters, and pagination to
+     * localStorage under this key. Restored on mount.
+     */
+    stateKey?: string;
+    /** Show a status bar below the table with row and selection counts. */
+    enableStatusBar?: boolean;
+    /** Expand the grid to fill the viewport when true (controlled fullscreen). */
+    fullscreen?: boolean;
+    /** Callback when the user toggles fullscreen from the toolbar button. */
+    onFullscreenChange?: (fullscreen: boolean) => void;
+    /** Show a fullscreen toggle button in the toolbar. */
+    enableFullscreen?: boolean;
+    /** Row IDs that show a loading spinner (async row action in progress). */
+    loadingRowIds?: string[];
+    /** Callback for a Print toolbar button / helper — called before window.print(). */
+    onPrint?: () => void;
+    /** Column IDs whose header should show a quick-filter input below the label. */
+    quickFilterColumns?: string[];
+    /** Show a right-click context menu on cells/rows. */
+    onCellContextMenu?: (cell: Cell<TData, unknown>, row: Row<TData>, event: React.MouseEvent) => void;
+    onRowContextMenu?: (row: Row<TData>, event: React.MouseEvent) => void;
+    /** Double-click a column resize handle to auto-size to content. */
+    enableColumnAutoSize?: boolean;
+    /** Column IDs that cannot be hidden, reordered, or resized. */
+    lockedColumns?: string[];
+    /** Fired when the user locks or unlocks a column via the column menu. */
+    onLockedColumnsChange?: (columnIds: string[]) => void;
+    /** Render rows as label/value cards below this Tailwind breakpoint. */
+    mobileBreakpoint?: 'sm' | 'md' | 'lg';
+    /** Built-in Export dropdown (CSV, JSON, and XLSX). Set to true or provide custom options. */
+    enableExport?: boolean | {
+        csv?: boolean;
+        json?: boolean;
+        selectedCsv?: boolean;
+        xlsx?: boolean;
+    };
+    /** Enable the built-in conditional formatting drawer in the toolbar. */
+    enableConditionalFormatting?: boolean;
+    /** Controlled conditional formatting rules. */
+    conditionalFormattingRules?: DataTableConditionalRule[];
+    /** Fired when rules change. */
+    onConditionalFormattingRulesChange?: (rules: DataTableConditionalRule[]) => void;
+    /** Return a status for a row to show a colored left border. */
+    getRowStatus?: (row: Row<TData>) => 'success' | 'warning' | 'error' | 'info' | undefined;
+    /** Fixed row height (px) or a function returning height per row. */
+    rowHeight?: number | ((row: Row<TData>, index: number) => number);
+    /** Show active column-filter chips above the table. */
+    enableFilterChips?: boolean;
+    /** Enable Ctrl+V paste of TSV data into editable cells. */
+    enablePaste?: boolean;
+    /** Text direction for the grid. */
+    dir?: 'ltr' | 'rtl';
+    /** Show a keyboard shortcuts modal when ? is pressed. */
+    enableKeyboardShortcuts?: boolean;
+    /** Interaction mode to start inline editing. */
+    editMode?: 'click' | 'dblclick';
+    /** Callback fired after a cell edit is committed via valueSetter. */
+    onCellEditCommit?: (params: {
+        field: string;
+        row: TData;
+        oldValue: unknown;
+        newValue: unknown;
+    }) => void;
+    /** Enable Ctrl+Z / Ctrl+Y undo-redo for inline edits. */
+    enableUndoRedo?: boolean;
+    /** Controlled set of row IDs with unsaved changes. */
+    dirtyRows?: Set<string>;
+    /** Fired when dirty row set changes. */
+    onDirtyRowsChange?: (dirtyRows: Set<string>) => void;
+    /** Enable cell-range selection. Disables row-selection click behavior on td. */
+    enableCellSelection?: boolean;
+    /** Fired when cell selection changes. */
+    onCellSelectionChange?: (selection: DataTableCellSelection | null) => void;
+    /** Show the collapsible right-side tool panel. */
+    enableToolPanel?: boolean;
+    /** Which tab to open by default in the tool panel. */
+    defaultToolPanelTab?: 'columns' | 'filters' | 'stats';
+    /** Enable real-time cell flash when data changes. */
+    enableLiveData?: boolean;
+    /** Field used as row identity for live-data diffing. Default: 'id'. */
+    liveDataKey?: keyof TData;
+    /** Fired when live-data diff detects updated rows. */
+    onLiveDataUpdate?: (updatedRows: TData[]) => void;
+    /** Async loader for detail panel content. Cached after first load. */
+    loadDetailPanel?: (row: Row<TData>) => Promise<React.ReactNode>;
+    /** Maximum number of cached detail panels (LRU). Default: 20. */
+    detailPanelCacheSize?: number;
+    /** Inject @media print styles that hide toolbar/pagination. */
+    enablePrintStyles?: boolean;
+    /** Enable pivot mode. When true, a Pivot toolbar button appears. */
+    enablePivot?: boolean;
+    /** Controlled pivot configuration. When set alongside enablePivot, renders pivot view. */
+    pivotConfig?: DataTablePivotConfig;
+    /** Fired when pivot config changes from the toolbar panel. */
+    onPivotConfigChange?: (config: DataTablePivotConfig) => void;
+    /** Enable saved views toolbar button. */
+    enableSavedViews?: boolean;
+    /** Controlled saved views list. */
+    savedViews?: DataTableSavedView[];
+    /** Fired when saved views list changes. */
+    onSavedViewsChange?: (views: DataTableSavedView[]) => void;
+    /** Accessible label for the grid root element. */
+    ariaLabel?: string;
+    /** ID of an element that labels the grid. */
+    ariaLabelledBy?: string;
+    /** Show an aggregated stats row pinned below column headers. */
+    enableHeaderStats?: boolean;
+    /** Per-column stat type override. key = columnId, value = stat type. Defaults: sum for number, count for others. */
+    headerStatsConfig?: Partial<Record<string, 'count' | 'sum' | 'avg' | 'min' | 'max' | 'nullCount' | 'unique'>>;
+    /** Enable display-mode cell validation using displayValidate on column defs. */
+    enableValidation?: boolean;
+    /** Fired when validation errors change. */
+    onValidationChange?: (errors: DataTableValidationError[]) => void;
+    /** Default locale for all columns (overridden per-column). e.g. 'en-US', 'de-DE'. */
+    locale?: string;
+}
+declare function DataTable<TData, TValue = unknown>(props: DataTableProps<TData, TValue>): React.JSX.Element;
+interface DataTablePaginationProps<TData> {
+    table: Table<TData>;
+    localeText?: DataTableLocaleText;
+    pageSizeOptions?: number[];
+    showTotalRows?: boolean;
+    overlayBoundary?: HTMLDivElement | null;
+}
+declare function DataTablePagination<TData>({ table, localeText, pageSizeOptions, showTotalRows, overlayBoundary, }: DataTablePaginationProps<TData>): React.JSX.Element;
+interface DataTableToolbarProps<TData> {
+    table: Table<TData>;
+    filterColumnId?: string;
+    filterPlaceholder?: string;
+    globalFilter?: string;
+    onGlobalFilterChange?: (value: string) => void;
+    children?: React.ReactNode;
+}
+declare function DataTableToolbar<TData>({ table, filterColumnId, filterPlaceholder, globalFilter, onGlobalFilterChange, children, }: DataTableToolbarProps<TData>): React.JSX.Element;
+interface DataTableAdvancedFilterProps<TData> {
+    table: Table<TData>;
+    filter?: DataTableFilterGroup;
+    onFilterChange: (filter: DataTableFilterGroup | undefined) => void;
+    localeText?: DataTableLocaleText;
+    overlayBoundary?: HTMLDivElement | null;
+}
+declare function DataTableAdvancedFilter<TData>({ table, filter, onFilterChange, localeText, overlayBoundary, }: DataTableAdvancedFilterProps<TData>): React.JSX.Element;
+interface DataTableColumnFilterProps<TData, TValue = unknown> {
+    column: Column<TData, TValue>;
+    title?: string;
+}
+declare function DataTableColumnFilter<TData, TValue = unknown>({ column, title, }: DataTableColumnFilterProps<TData, TValue>): React.JSX.Element;
+interface DataTableColumnVisibilityProps<TData> {
+    table: Table<TData>;
+}
+declare function DataTableColumnVisibility<TData>({ table }: DataTableColumnVisibilityProps<TData>): React.JSX.Element;
+interface DataTableColumnConfigurationProps<TData> {
+    table: Table<TData>;
+    selectedColumnIds?: string[];
+    onSelectedColumnIdsChange?: (columnIds: string[]) => void;
+    localeText?: DataTableLocaleText;
+    enableColumnSelection?: boolean;
+    enableGrouping?: boolean;
+    enableColumnPinning?: boolean;
+    overlayBoundary?: HTMLDivElement | null;
+}
+declare function DataTableColumnConfiguration<TData>({ table, selectedColumnIds, onSelectedColumnIdsChange, localeText, enableColumnSelection, enableGrouping, enableColumnPinning, overlayBoundary, }: DataTableColumnConfigurationProps<TData>): React.JSX.Element;
+declare function exportToCSV<TData>(table: Table<TData>, filename?: string, options?: {
+    onlySelected?: boolean;
+    includeHidden?: boolean;
+}): void;
+declare function exportToJSON<TData>(table: Table<TData>, filename?: string, options?: {
+    onlySelected?: boolean;
+}): void;
+interface EditableCellProps {
+    value: unknown;
+    onCommit: (next: unknown) => void;
+    type?: 'text' | 'number';
+}
+declare function EditableCell({ value, onCommit, type }: EditableCellProps): React.JSX.Element;
+declare function exportToXLSX<TData>(table: Table<TData>, options?: {
+    filename?: string;
+    onlySelected?: boolean;
+    sheetName?: string;
+}): void;
+interface DataTableToolbarButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'color'> {
+    tooltip?: string;
+}
+declare function DataTableToolbarButton({ tooltip, children, className, ...props }: DataTableToolbarButtonProps): React.JSX.Element;
+
+export { type ColumnStats, DataTable, DataTableAdvancedFilter, type DataTableAdvancedFilterProps, type DataTableAggregation, type DataTableBulkAction, type DataTableCellParams, type DataTableCellSelection, type DataTableColumn, DataTableColumnConfiguration, type DataTableColumnConfigurationProps, type DataTableColumnDef, DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnMenuSlotProps, type DataTableColumnType, DataTableColumnVisibility, type DataTableColumnVisibilityProps, type DataTableConditionalRule, type DataTableDensity, type DataTableFilterGroup, type DataTableFilterItem, type DataTableFilterLogic, type DataTableFilterOperator, type DataTableFilterRule, type DataTableFilterSlotProps, type DataTableHeaderParams, type DataTableInlineCreate, type DataTableLoadingOverlaySlotProps, type DataTableLoadingSkeletonSlotProps, type DataTableLoadingVariant, type DataTableLocaleText, DataTablePagination, type DataTablePivotConfig, type DataTableProps, type DataTableRowActionItem, type DataTableRowPinningState, type DataTableRowTotals, type DataTableSavedView, type DataTableSearchSlotProps, type DataTableSlots, DataTableToolbar, type DataTableToolbarAction, DataTableToolbarButton, type DataTableToolbarButtonProps, type DataTableToolbarProps, type DataTableValidationError, EditableCell, type EditableCellProps, type ServerData, type ServerDataState, exportToCSV, exportToJSON, exportToXLSX };