import * as react_jsx_runtime from 'react/jsx-runtime'; import React__default, { ReactNode } from 'react'; interface UsePaginationOptions { data: T[]; pageSize?: number; storageKey?: string; } interface UsePaginationResult { paginatedData: T[]; page: number; pageSize: number; totalPages: number; totalItems: number; setPage: (page: number) => void; setPageSize: (size: number) => void; nextPage: () => void; prevPage: () => void; firstPage: () => void; lastPage: () => void; startIndex: number; endIndex: number; canGoNext: boolean; canGoPrev: boolean; pageSizeOptions: number[]; } declare function usePagination({ data, pageSize: initialPageSize, storageKey, }: UsePaginationOptions): UsePaginationResult; interface ColumnConfig$1 { id: string; label: string; defaultVisible?: boolean; locked?: boolean; } interface ColumnVisibilityState { [key: string]: boolean; } interface UseColumnVisibilityOptions { columns: ColumnConfig$1[]; storageKey: string; } interface UseColumnVisibilityReturn { visibleColumns: ColumnVisibilityState; isColumnVisible: (columnId: string) => boolean; toggleColumn: (columnId: string) => void; showAllColumns: () => void; hideAllColumns: () => void; columns: ColumnConfig$1[]; } declare function useColumnVisibility({ columns, storageKey, }: UseColumnVisibilityOptions): UseColumnVisibilityReturn; interface ColumnConfig { key: string; minWidth?: number; maxWidth?: number; defaultWidth?: number; } interface UseResizableColumnsOptions { tableId: string; columns: ColumnConfig[]; storageKey?: string; } interface ResizableColumnResult { widths: Record; isResizing: boolean; totalWidth: number; getResizeHandleProps: (columnKey: string) => { onPointerDown: (e: React.PointerEvent) => void; onMouseDown: (e: React.MouseEvent) => void; draggable: boolean; onDragStart: (e: React.DragEvent) => void; className: string; 'data-resizing': boolean; }; getColumnStyle: (columnKey: string) => React.CSSProperties; getTableStyle: () => React.CSSProperties; resetToDefaults: () => void; } declare function useResizableColumns({ tableId, columns, storageKey, }: UseResizableColumnsOptions): ResizableColumnResult; interface ColumnOrderConfig { id: string; label: string; locked?: boolean; } interface UseColumnOrderOptions { storageKey: string; defaultOrder: string[]; } interface UseColumnOrderReturn { columnOrder: string[]; moveColumn: (fromIndex: number, toIndex: number) => void; moveColumnById: (columnId: string, direction: 'left' | 'right') => void; resetOrder: () => void; getOrderedColumns: (columns: T[]) => T[]; } /** * Hook for managing column order with localStorage persistence */ declare function useColumnOrder({ storageKey, defaultOrder, }: UseColumnOrderOptions): UseColumnOrderReturn; /** * Drag and drop helpers for column reordering */ interface DragState { isDragging: boolean; draggedId: string | null; dropIndex: number | null; } declare function useColumnDragDrop(columnOrder: string[], moveColumn: (from: number, to: number) => void, lockedColumns?: string[]): { dragState: DragState; getDragHandleProps: (columnId: string) => { draggable: boolean; onDragStart: (e: React.DragEvent) => void; onDragOver: (e: React.DragEvent) => void; onDrop: (e: React.DragEvent) => void; onDragEnd: () => void; }; showDropIndicator: (columnId: string) => boolean; }; /** * Column width configuration */ interface ColumnWidth { default: number; min: number; max?: number; } /** * Column visibility configuration */ interface ColumnVisibility$1 { default: boolean; locked?: boolean; } /** * Props passed to header cell render function */ interface HeaderCellProps { columnId: string; isSorted: boolean; sortDirection?: 'asc' | 'desc'; } /** * Props passed to cell render function */ interface CellProps { columnId: string; isDragging: boolean; } /** * Column definition for DataTable */ interface ColumnDef { /** Unique column identifier */ id: string; /** Header content - string or render function */ header: string | ((props: HeaderCellProps) => ReactNode); /** Cell content render function */ cell: (item: T, props: CellProps) => ReactNode; /** Key to use for sorting (if sortable) */ sortKey?: string; /** Width configuration */ width?: ColumnWidth; /** Visibility configuration */ visibility?: ColumnVisibility$1; /** Additional CSS class for cells */ className?: string; /** Whether this column should use column style from resize hook */ resizable?: boolean; } /** * External pagination state (from usePagination hook) */ interface ExternalPaginationState { paginatedData: T[]; page: number; pageSize: number; totalPages: number; totalItems: number; startIndex: number; endIndex: number; canGoNext: boolean; canGoPrev: boolean; pageSizeOptions: number[]; setPage: (page: number) => void; setPageSize: (size: number) => void; nextPage: () => void; prevPage: () => void; } /** * DataTable props */ interface DataTableProps { /** Data array to display */ data: T[]; /** Column definitions */ columns: ColumnDef[]; /** Storage key for persisting table state (column widths, order, visibility) */ storageKey: string; /** Function to get unique ID from item */ getRowId: (item: T) => string; /** Enable row selection with checkboxes */ selectable?: boolean; /** Set of selected row IDs */ selectedIds?: Set; /** Callback when selection changes */ onSelectionChange?: (ids: Set) => void; /** Callback when row is clicked */ onRowClick?: (item: T) => void; /** Callback when row is right-clicked (for context menu) */ onRowContextMenu?: (item: T, position: { x: number; y: number; }) => void; /** Current sort field */ sortField?: string; /** Current sort order */ sortOrder?: 'asc' | 'desc'; /** Callback when sort changes */ onSort?: (field: string) => void; /** Render function for actions column (always last, sticky) */ actionsColumn?: (item: T) => ReactNode; /** Width for actions column */ actionsColumnWidth?: number; /** Page size for pagination (used when no external pagination provided) */ pageSize?: number; /** External pagination state from usePagination hook (overrides internal pagination) */ pagination?: ExternalPaginationState; /** Hide the built-in pagination controls (use when pagination is shown elsewhere) */ hidePagination?: boolean; /** Additional CSS class for table container */ className?: string; /** Function to compute row CSS class */ rowClassName?: (item: T) => string; /** Enable header right-click for column visibility menu */ enableHeaderContextMenu?: boolean; /** Columns that cannot be reordered */ lockedColumns?: string[]; /** Default column order (if not persisted) */ defaultColumnOrder?: string[]; /** Show loading indicator */ loading?: boolean; /** Content to show when no data */ emptyState?: ReactNode; } /** * Column config for visibility hook (for compatibility) */ interface ColumnConfigCompat { id: string; label: string; defaultVisible?: boolean; locked?: boolean; } /** * Column config for resize hook (for compatibility) */ interface ColumnSizeConfig { key: string; defaultWidth: number; minWidth: number; maxWidth?: number; } /** * DataTable - Generic data table with full feature set * * Features: * - Column resizing (drag handles) * - Column reordering (drag-drop) * - Column visibility toggle * - Row selection with checkboxes * - Sorting * - Pagination * - Sticky actions column * - Context menu support * - Header context menu for column visibility */ declare function DataTable({ data, columns, storageKey, getRowId, selectable, selectedIds, onSelectionChange, onRowClick, onRowContextMenu, sortField, sortOrder, onSort, actionsColumn, actionsColumnWidth, pageSize, pagination: externalPagination, hidePagination, className, rowClassName, enableHeaderContextMenu, lockedColumns, defaultColumnOrder, loading, emptyState, }: DataTableProps): react_jsx_runtime.JSX.Element; /** * PaginationControls - Compact inline pagination for table headers * * A condensed version of pagination controls designed to sit alongside * search/filter controls in a table header bar. */ interface PaginationControlsProps { page: number; pageSize: number; totalPages: number; totalItems: number; startIndex: number; endIndex: number; canGoNext: boolean; canGoPrev: boolean; pageSizeOptions: number[]; setPage: (page: number) => void; setPageSize: (size: number) => void; nextPage: () => void; prevPage: () => void; className?: string; } declare function PaginationControls({ page, pageSize, totalPages, totalItems, startIndex, endIndex, canGoNext, canGoPrev, pageSizeOptions, setPage: _setPage, setPageSize, nextPage, prevPage, className, }: PaginationControlsProps): react_jsx_runtime.JSX.Element | null; interface FilterOption$1 { id: string; label: string; render: () => React__default.ReactNode; } interface DataTablePageProps { /** Page title */ title: string; /** Page description */ description?: string; /** Search term */ search?: string; /** Search change handler */ onSearchChange?: (value: string) => void; /** Search placeholder text */ searchPlaceholder?: string; /** Filter options for popover */ filters?: FilterOption$1[]; /** Number of active filters */ activeFilterCount?: number; /** Clear all filters handler */ onClearFilters?: () => void; /** Pagination props from usePagination hook */ pagination?: PaginationControlsProps; /** Extra content to render next to the title (e.g. HelpTooltip) */ titleExtra?: React__default.ReactNode; /** Action buttons to show in the header */ actions?: React__default.ReactNode; /** Content before the table (e.g., BatchActionsBar) */ beforeTable?: React__default.ReactNode; /** The DataTable component */ children: React__default.ReactNode; /** Additional class for the container */ className?: string; /** Whether to show a loading state */ loading?: boolean; /** Loading component to show */ loadingComponent?: React__default.ReactNode; } declare function DataTablePage({ title, description, titleExtra, search, onSearchChange, searchPlaceholder, filters, activeFilterCount, onClearFilters, pagination, actions, beforeTable, children, className, loading, loadingComponent, }: DataTablePageProps): react_jsx_runtime.JSX.Element; interface PaginationProps { page: number; pageSize: number; totalPages: number; totalItems: number; startIndex: number; endIndex: number; canGoNext: boolean; canGoPrev: boolean; pageSizeOptions: number[]; onPageChange: (page: number) => void; onPageSizeChange: (size: number) => void; onNextPage: () => void; onPrevPage: () => void; onFirstPage: () => void; onLastPage: () => void; className?: string; } declare function Pagination({ page, pageSize, totalPages, totalItems, startIndex, endIndex, canGoNext, canGoPrev, pageSizeOptions, onPageChange, onPageSizeChange, onNextPage, onPrevPage, onFirstPage, onLastPage, className, }: PaginationProps): react_jsx_runtime.JSX.Element | null; interface BatchActionsBarProps { /** Number of selected items */ selectedCount: number; /** Callback to clear selection */ onClear: () => void; /** Action buttons to display on the right side */ children: ReactNode; /** Label for the selected items (default: "item"/"items") */ itemLabel?: string; /** Additional CSS classes */ className?: string; } /** * A horizontal bar that appears when items are selected, * showing the count and providing batch action buttons. */ declare function BatchActionsBar({ selectedCount, onClear, children, itemLabel, className, }: BatchActionsBarProps): react_jsx_runtime.JSX.Element | null; interface ColumnVisibilityProps { columns: ColumnConfig$1[]; isColumnVisible: (columnId: string) => boolean; toggleColumn: (columnId: string) => void; showAllColumns: () => void; hideAllColumns: () => void; } declare function ColumnVisibility({ columns, isColumnVisible, toggleColumn, showAllColumns, hideAllColumns, }: ColumnVisibilityProps): react_jsx_runtime.JSX.Element; interface FilterOption { id: string; label: string; render: () => React__default.ReactNode; /** Filter type - 'multi' filters get more horizontal space */ type?: 'single' | 'multi'; } interface TableFiltersProps { search?: string; onSearchChange?: (value: string) => void; searchPlaceholder?: string; filters?: FilterOption[]; activeFilterCount?: number; onClearFilters?: () => void; className?: string; children?: React__default.ReactNode; } /** * TableFilters - Compact filter controls for data tables * * Features: * - Search input * - Popover filter menu with badge showing active count * - Clear all filters button * - Custom filter components via render prop * - Children slot for additional action buttons */ declare function TableFilters({ search, onSearchChange, searchPlaceholder, filters, activeFilterCount, onClearFilters, className, children, }: TableFiltersProps): react_jsx_runtime.JSX.Element; interface MultiSelectOption { /** Unique value for this option */ value: T; /** Display label */ label: string; /** Optional custom render for the label (e.g., with icon/flag) */ render?: () => React__default.ReactNode; } interface MultiSelectFilterProps { /** Available options to select from */ options: MultiSelectOption[]; /** Currently selected values */ selected: Set; /** Called when selection changes */ onChange: (selected: Set) => void; /** Maximum height before scrolling (default: 200px) */ maxHeight?: number; /** Number of columns for grid layout (default: 2) */ columns?: 1 | 2 | 3; /** Show select all / clear buttons */ showBulkActions?: boolean; /** Optional className for the container */ className?: string; } /** * MultiSelectFilter - A checkbox-based multi-select filter component * * Designed to work with the TableFilters popover for filtering data tables. * Supports custom rendering per option (for flags, badges, icons, etc.) */ declare function MultiSelectFilter({ options, selected, onChange, maxHeight, columns, showBulkActions, className, }: MultiSelectFilterProps): react_jsx_runtime.JSX.Element; export { BatchActionsBar, type BatchActionsBarProps, type CellProps, type ColumnConfig$1 as ColumnConfig, type ColumnConfigCompat, type ColumnDef, type ColumnOrderConfig, type ColumnSizeConfig, ColumnVisibility, type ColumnVisibility$1 as ColumnVisibilityConfig, type ColumnVisibilityState, type ColumnWidth, DataTable, DataTablePage, type DataTablePageProps, type DataTableProps, type DragState, type ExternalPaginationState, type FilterOption$1 as FilterOption, type HeaderCellProps, MultiSelectFilter, type MultiSelectFilterProps, type MultiSelectOption, Pagination, PaginationControls, type PaginationControlsProps, type ResizableColumnResult, type FilterOption as TableFilterOption, TableFilters, type TableFiltersProps, useColumnDragDrop, useColumnOrder, useColumnVisibility, usePagination, useResizableColumns };