@forgedevstack/grid-table 1.0.0

package/dist/index.d.mts

@@ -0,0 +1,999 @@
+import * as react from 'react';
+import { ReactNode, CSSProperties, RefObject, MouseEvent } from 'react';
+
+type ThemeMode = 'light' | 'dark';
+type Breakpoint = 'mobile' | 'tablet' | 'desktop';
+type ResponsiveValue<T> = T | Partial<Record<Breakpoint, T>>;
+type SortDirection = 'asc' | 'desc' | null;
+type FilterOperator = 'equals' | 'notEquals' | 'contains' | 'notContains' | 'startsWith' | 'endsWith' | 'greaterThan' | 'lessThan' | 'greaterThanOrEqual' | 'lessThanOrEqual' | 'between' | 'isEmpty' | 'isNotEmpty';
+type Alignment = 'left' | 'center' | 'right';
+interface Dimensions {
+    width?: ResponsiveValue<number | string>;
+    height?: ResponsiveValue<number | string>;
+    minWidth?: ResponsiveValue<number | string>;
+    maxWidth?: ResponsiveValue<number | string>;
+    minHeight?: ResponsiveValue<number | string>;
+    maxHeight?: ResponsiveValue<number | string>;
+}
+interface ThemeColors {
+    background: {
+        primary: string;
+        secondary: string;
+        tertiary: string;
+        hover: string;
+    };
+    text: {
+        primary: string;
+        secondary: string;
+        muted: string;
+    };
+    border: {
+        default: string;
+        hover: string;
+    };
+    accent: {
+        primary: string;
+        success: string;
+        warning: string;
+        error: string;
+    };
+}
+interface Theme {
+    mode: ThemeMode;
+    colors: ThemeColors;
+}
+interface Translations {
+    empty: string;
+    loading: string;
+    search: string;
+    filter: string;
+    sort: string;
+    sortAsc: string;
+    sortDesc: string;
+    clearSort: string;
+    clearFilter: string;
+    clearAll: string;
+    apply: string;
+    cancel: string;
+    columns: string;
+    showColumns: string;
+    hideColumn: string;
+    resetColumns: string;
+    rowsPerPage: string;
+    of: string;
+    page: string;
+    first: string;
+    previous: string;
+    next: string;
+    last: string;
+    selected: string;
+    dragToReorder: string;
+    noResults: string;
+    errorLoading: string;
+    retry: string;
+}
+interface ClassNames {
+    root?: string;
+    header?: string;
+    headerCell?: string;
+    body?: string;
+    row?: string;
+    cell?: string;
+    footer?: string;
+    pagination?: string;
+    filter?: string;
+    empty?: string;
+    skeleton?: string;
+    drawer?: string;
+}
+interface Styles {
+    root?: CSSProperties;
+    header?: CSSProperties;
+    headerCell?: CSSProperties;
+    body?: CSSProperties;
+    row?: CSSProperties;
+    cell?: CSSProperties;
+    footer?: CSSProperties;
+    pagination?: CSSProperties;
+    filter?: CSSProperties;
+    empty?: CSSProperties;
+    skeleton?: CSSProperties;
+    drawer?: CSSProperties;
+}
+type RenderFunction<T = unknown> = (value: T, row: Record<string, unknown>, rowIndex: number) => ReactNode;
+
+interface ColumnDefinition<T = unknown> {
+    id: string;
+    accessor: string | ((row: T) => unknown);
+    header: ReactNode | (() => ReactNode);
+    width?: ResponsiveValue<number | string>;
+    minWidth?: number;
+    maxWidth?: number;
+    align?: Alignment;
+    sortable?: boolean;
+    filterable?: boolean;
+    resizable?: boolean;
+    draggable?: boolean;
+    hidden?: boolean;
+    hiddenOnMobile?: boolean;
+    showLabelOnMobile?: boolean;
+    sticky?: 'left' | 'right';
+    className?: string;
+    headerClassName?: string;
+    cellClassName?: string;
+    style?: CSSProperties;
+    headerStyle?: CSSProperties;
+    cellStyle?: CSSProperties;
+    render?: RenderFunction<unknown>;
+    filterType?: 'text' | 'number' | 'date' | 'select' | 'boolean' | 'custom';
+    filterOptions?: FilterOption[];
+    filterOperators?: FilterOperator[];
+    defaultFilterOperator?: FilterOperator;
+    sortFn?: (a: unknown, b: unknown, direction: SortDirection) => number;
+    filterFn?: (value: unknown, filterValue: unknown, operator: FilterOperator) => boolean;
+    meta?: Record<string, unknown>;
+}
+interface FilterOption {
+    value: string | number | boolean;
+    label: string;
+}
+interface ColumnState {
+    id: string;
+    visible: boolean;
+    width: number;
+    order: number;
+    pinned: 'left' | 'right' | null;
+}
+interface ColumnReorderEvent {
+    sourceId: string;
+    targetId: string;
+    sourceIndex: number;
+    targetIndex: number;
+}
+interface ColumnResizeEvent {
+    columnId: string;
+    width: number;
+    previousWidth: number;
+}
+interface ColumnVisibilityEvent {
+    columnId: string;
+    visible: boolean;
+}
+
+interface RowData {
+    id: string | number;
+    [key: string]: unknown;
+}
+interface RowState {
+    id: string | number;
+    selected: boolean;
+    expanded: boolean;
+    disabled: boolean;
+}
+interface RowProps<T extends RowData = RowData> {
+    data: T;
+    index: number;
+    isSelected?: boolean;
+    isExpanded?: boolean;
+    isDisabled?: boolean;
+    isHovered?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    onClick?: (row: T, index: number) => void;
+    onDoubleClick?: (row: T, index: number) => void;
+    onContextMenu?: (row: T, index: number, event: React.MouseEvent) => void;
+    onSelect?: (row: T, selected: boolean) => void;
+    onExpand?: (row: T, expanded: boolean) => void;
+}
+interface RowSelectionState {
+    selectedIds: Set<string | number>;
+    allSelected: boolean;
+    someSelected: boolean;
+}
+interface RowSelectionActions {
+    selectRow: (id: string | number) => void;
+    deselectRow: (id: string | number) => void;
+    toggleRow: (id: string | number) => void;
+    selectAll: () => void;
+    deselectAll: () => void;
+    toggleAll: () => void;
+    isSelected: (id: string | number) => boolean;
+}
+interface RowExpansionState {
+    expandedIds: Set<string | number>;
+}
+interface RowExpansionActions {
+    expandRow: (id: string | number) => void;
+    collapseRow: (id: string | number) => void;
+    toggleRow: (id: string | number) => void;
+    expandAll: () => void;
+    collapseAll: () => void;
+    isExpanded: (id: string | number) => boolean;
+}
+
+interface FilterValue {
+    columnId: string;
+    value: unknown;
+    operator: FilterOperator;
+}
+interface FilterState {
+    filters: FilterValue[];
+    globalFilter: string;
+}
+interface FilterActions {
+    setFilter: (columnId: string, value: unknown, operator?: FilterOperator) => void;
+    removeFilter: (columnId: string) => void;
+    clearFilters: () => void;
+    setGlobalFilter: (value: string) => void;
+    clearGlobalFilter: () => void;
+    getFilterValue: (columnId: string) => FilterValue | undefined;
+    hasFilter: (columnId: string) => boolean;
+    hasAnyFilter: () => boolean;
+}
+interface FilterConfig {
+    debounceMs?: number;
+    caseSensitive?: boolean;
+    globalFilterColumns?: string[];
+    persistFilters?: boolean;
+    filterStorageKey?: string;
+}
+interface FilterPanelProps {
+    columnId: string;
+    filterType: 'text' | 'number' | 'date' | 'select' | 'boolean' | 'custom';
+    filterValue?: FilterValue;
+    filterOptions?: Array<{
+        value: string | number | boolean;
+        label: string;
+    }>;
+    operators?: FilterOperator[];
+    onApply: (value: unknown, operator: FilterOperator) => void;
+    onClear: () => void;
+    onClose: () => void;
+}
+
+interface SortValue {
+    columnId: string;
+    direction: SortDirection;
+}
+interface SortState {
+    sorting: SortValue[];
+    multiSort: boolean;
+}
+interface SortActions {
+    setSorting: (columnId: string, direction: SortDirection) => void;
+    toggleSorting: (columnId: string) => void;
+    clearSorting: () => void;
+    clearColumnSorting: (columnId: string) => void;
+    getSortDirection: (columnId: string) => SortDirection;
+    getSortIndex: (columnId: string) => number;
+    isSorted: (columnId: string) => boolean;
+}
+interface SortConfig {
+    multiSort?: boolean;
+    maxMultiSortColumns?: number;
+    sortDescFirst?: boolean;
+    nullsFirst?: boolean;
+    persistSort?: boolean;
+    sortStorageKey?: string;
+}
+
+interface PaginationState {
+    page: number;
+    pageSize: number;
+    totalItems: number;
+    totalPages: number;
+}
+interface PaginationActions {
+    setPage: (page: number) => void;
+    setPageSize: (pageSize: number) => void;
+    goToFirstPage: () => void;
+    goToLastPage: () => void;
+    goToNextPage: () => void;
+    goToPreviousPage: () => void;
+    canGoToNextPage: () => boolean;
+    canGoToPreviousPage: () => boolean;
+    getPageRange: () => {
+        start: number;
+        end: number;
+    };
+}
+interface PaginationConfig {
+    initialPage?: number;
+    initialPageSize?: number;
+    pageSizeOptions?: readonly number[];
+    showFirstLast?: boolean;
+    showPageNumbers?: boolean;
+    maxPageButtons?: number;
+    persistPagination?: boolean;
+    paginationStorageKey?: string;
+}
+interface PaginationInfo {
+    page: number;
+    pageSize: number;
+    totalItems: number;
+    totalPages: number;
+    startIndex: number;
+    endIndex: number;
+    isFirstPage: boolean;
+    isLastPage: boolean;
+}
+
+interface GridTableProps<T extends RowData = RowData> {
+    data: T[];
+    columns: ColumnDefinition<T>[];
+    loading?: boolean;
+    error?: Error | string | null;
+    emptyContent?: ReactNode;
+    loadingContent?: ReactNode;
+    errorContent?: ReactNode | ((error: Error | string) => ReactNode);
+    theme?: Partial<Theme>;
+    translations?: Partial<Translations>;
+    dimensions?: Dimensions;
+    classNames?: ClassNames;
+    styles?: Styles;
+    mobileBreakpoint?: Breakpoint;
+    showMobileLabels?: boolean;
+    enableDragDrop?: boolean;
+    enableColumnResize?: boolean;
+    enableRowSelection?: boolean;
+    enableMultiSelect?: boolean;
+    enableRowExpansion?: boolean;
+    stickyHeader?: boolean;
+    showPagination?: boolean;
+    showFilter?: boolean;
+    showGlobalFilter?: boolean;
+    showColumnToggle?: boolean;
+    showSortIndicator?: boolean;
+    virtualize?: boolean;
+    virtualizeThreshold?: number;
+    rowHeight?: number;
+    headerHeight?: number;
+    paginationConfig?: PaginationConfig;
+    filterConfig?: FilterConfig;
+    sortConfig?: SortConfig;
+    initialState?: Partial<TableState<T>>;
+    onStateChange?: (state: TableState<T>) => void;
+    onRowClick?: (row: T, index: number) => void;
+    onRowDoubleClick?: (row: T, index: number) => void;
+    onCellClick?: (event: {
+        row: T;
+        rowIndex: number;
+        columnId: string;
+        value: unknown;
+    }) => void;
+    onRowSelect?: (selectedRows: T[]) => void;
+    onRowExpand?: (expandedRows: T[]) => void;
+    onSort?: (sorting: SortState['sorting']) => void;
+    onFilter?: (filters: FilterState) => void;
+    onPageChange?: (page: number, pageSize: number) => void;
+    onColumnReorder?: (columns: ColumnState[]) => void;
+    onColumnResize?: (columnId: string, width: number) => void;
+    onColumnVisibilityChange?: (columnId: string, visible: boolean) => void;
+    onError?: (error: Error) => void;
+    onRetry?: () => void;
+    getRowId?: (row: T) => string | number;
+    getRowClassName?: (row: T, index: number) => string;
+    getRowStyle?: (row: T, index: number) => React.CSSProperties;
+    isRowDisabled?: (row: T) => boolean;
+    isRowSelectable?: (row: T) => boolean;
+    renderRowExpansion?: (row: T) => ReactNode;
+    renderHeader?: () => ReactNode;
+    renderFooter?: () => ReactNode;
+    renderEmpty?: () => ReactNode;
+    renderLoading?: () => ReactNode;
+    renderError?: (error: Error | string) => ReactNode;
+    children?: ReactNode;
+}
+interface TableState<T extends RowData = RowData> {
+    data: T[];
+    columns: ColumnState[];
+    sorting: SortState;
+    filtering: FilterState;
+    pagination: PaginationState;
+    selection: RowSelectionState;
+    expansion: RowExpansionState;
+    loading: boolean;
+    error: Error | string | null;
+}
+interface TableInstance<T extends RowData = RowData> {
+    state: TableState<T>;
+    data: T[];
+    filteredData: T[];
+    sortedData: T[];
+    paginatedData: T[];
+    columns: ColumnDefinition<T>[];
+    visibleColumns: ColumnDefinition<T>[];
+    setData: (data: T[]) => void;
+    refresh: () => void;
+    reset: () => void;
+}
+interface GridTableRef<T extends RowData = RowData> {
+    getInstance: () => TableInstance<T>;
+    scrollToRow: (index: number) => void;
+    scrollToTop: () => void;
+    scrollToBottom: () => void;
+    focusRow: (index: number) => void;
+    selectRow: (id: string | number) => void;
+    deselectRow: (id: string | number) => void;
+    expandRow: (id: string | number) => void;
+    collapseRow: (id: string | number) => void;
+    setFilter: (columnId: string, value: unknown) => void;
+    clearFilters: () => void;
+    setSorting: (columnId: string, direction: 'asc' | 'desc' | null) => void;
+    clearSorting: () => void;
+    goToPage: (page: number) => void;
+    exportData: (format: 'json' | 'csv') => void;
+}
+
+interface GridTableComponentProps<T extends RowData = RowData> {
+    data: T[];
+    columns: ColumnDefinition<T>[];
+    loading?: boolean;
+    error?: Error | string | null;
+    emptyContent?: ReactNode;
+    loadingContent?: ReactNode;
+    errorContent?: ReactNode | ((error: Error | string) => ReactNode);
+    theme?: Partial<Theme>;
+    translations?: Partial<Translations>;
+    dimensions?: Dimensions;
+    classNames?: ClassNames;
+    styles?: Styles;
+    mobileBreakpoint?: Breakpoint;
+    showMobileLabels?: boolean;
+    enableDragDrop?: boolean;
+    enableColumnResize?: boolean;
+    enableRowSelection?: boolean;
+    enableMultiSelect?: boolean;
+    enableRowExpansion?: boolean;
+    stickyHeader?: boolean;
+    showPagination?: boolean;
+    showFilter?: boolean;
+    showGlobalFilter?: boolean;
+    showColumnToggle?: boolean;
+    showSortIndicator?: boolean;
+    paginationConfig?: PaginationConfig;
+    filterConfig?: FilterConfig;
+    sortConfig?: SortConfig;
+    onRowClick?: (row: T, index: number) => void;
+    onRowDoubleClick?: (row: T, index: number) => void;
+    onCellClick?: (event: {
+        row: T;
+        rowIndex: number;
+        columnId: string;
+        value: unknown;
+    }) => void;
+    onRowSelect?: (selectedRows: T[]) => void;
+    onSort?: (sorting: Array<{
+        columnId: string;
+        direction: SortDirection;
+    }>) => void;
+    onFilter?: (filters: Array<{
+        columnId: string;
+        value: unknown;
+    }>) => void;
+    onPageChange?: (page: number, pageSize: number) => void;
+    onError?: (error: Error) => void;
+    onRetry?: () => void;
+    getRowId?: (row: T) => string | number;
+    getRowClassName?: (row: T, index: number) => string;
+    getRowStyle?: (row: T, index: number) => CSSProperties;
+    isRowDisabled?: (row: T) => boolean;
+    renderRowExpansion?: (row: T) => ReactNode;
+    renderHeader?: () => ReactNode;
+    renderFooter?: () => ReactNode;
+    tableRef?: RefObject<GridTableRef<T>>;
+    className?: string;
+    style?: CSSProperties;
+}
+
+declare function GridTable<T extends RowData = RowData>({ data, columns, loading, error, theme, translations, mobileBreakpoint, paginationConfig, filterConfig, sortConfig, enableMultiSelect, getRowId, ...props }: GridTableComponentProps<T>): ReactNode;
+
+interface GridHeaderProps<T extends RowData = RowData> {
+    columns: ColumnDefinition<T>[];
+    columnStates: ColumnState[];
+    className?: string;
+    style?: CSSProperties;
+    sticky?: boolean;
+    enableSort?: boolean;
+    enableFilter?: boolean;
+    enableDragDrop?: boolean;
+    enableResize?: boolean;
+    enableSelection?: boolean;
+    allSelected?: boolean;
+    someSelected?: boolean;
+    onSelectAll?: () => void;
+    onSort?: (columnId: string, direction: SortDirection) => void;
+    onFilterOpen?: (columnId: string) => void;
+    getSortDirection?: (columnId: string) => SortDirection;
+}
+
+declare function GridHeader<T extends RowData = RowData>({ columns, columnStates, className, style, sticky, enableSort, enableFilter, enableDragDrop, enableResize, enableSelection, allSelected, someSelected, onSelectAll, onSort, onFilterOpen, getSortDirection, }: GridHeaderProps<T>): ReactNode;
+
+interface CellClickEvent<T extends RowData = RowData> {
+    row: T;
+    rowIndex: number;
+    columnId: string;
+    value: unknown;
+}
+interface GridCellProps<T extends RowData = RowData> {
+    column: ColumnDefinition<T>;
+    row: T;
+    rowIndex: number;
+    value: unknown;
+    width?: number | string;
+    align?: Alignment;
+    className?: string;
+    style?: CSSProperties;
+    showLabel?: boolean;
+    labelText?: string;
+    sticky?: 'left' | 'right';
+    stickyOffset?: number;
+    onClick?: (event: CellClickEvent<T>) => void;
+}
+
+interface GridBodyProps<T extends RowData = RowData> {
+    data: T[];
+    columns: ColumnDefinition<T>[];
+    columnStates: ColumnState[];
+    className?: string;
+    style?: CSSProperties;
+    isMobile?: boolean;
+    showMobileLabels?: boolean;
+    enableSelection?: boolean;
+    enableExpansion?: boolean;
+    selectedIds?: Set<string | number>;
+    expandedIds?: Set<string | number>;
+    onRowClick?: (row: T, index: number) => void;
+    onRowDoubleClick?: (row: T, index: number) => void;
+    onCellClick?: (event: CellClickEvent<T>) => void;
+    onRowSelect?: (id: string | number, selected: boolean) => void;
+    onRowExpand?: (id: string | number, expanded: boolean) => void;
+    getRowId: (row: T) => string | number;
+    getRowClassName?: (row: T, index: number) => string;
+    getRowStyle?: (row: T, index: number) => CSSProperties;
+    isRowDisabled?: (row: T) => boolean;
+    renderRowExpansion?: (row: T) => ReactNode;
+}
+
+declare function GridBody<T extends RowData = RowData>({ data, columns, columnStates, className, style, isMobile, showMobileLabels, enableSelection, enableExpansion, selectedIds, expandedIds, onRowClick, onRowDoubleClick, onCellClick, onRowSelect, onRowExpand, getRowId, getRowClassName, getRowStyle, isRowDisabled, renderRowExpansion, }: GridBodyProps<T>): ReactNode;
+
+interface GridRowProps<T extends RowData = RowData> {
+    row: T;
+    rowIndex: number;
+    columns: ColumnDefinition<T>[];
+    columnStates: ColumnState[];
+    isSelected?: boolean;
+    isExpanded?: boolean;
+    isDisabled?: boolean;
+    isMobile?: boolean;
+    showMobileLabels?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    onClick?: (row: T, index: number) => void;
+    onDoubleClick?: (row: T, index: number) => void;
+    onContextMenu?: (row: T, index: number, event: MouseEvent) => void;
+    onCellClick?: (event: CellClickEvent<T>) => void;
+    onSelect?: (selected: boolean) => void;
+    onExpand?: (expanded: boolean) => void;
+    enableSelection?: boolean;
+    enableExpansion?: boolean;
+    renderExpansion?: (row: T) => ReactNode;
+    getRowId: (row: T) => string | number;
+}
+
+declare function GridRow<T extends RowData = RowData>({ row, rowIndex, columns, columnStates, isSelected, isExpanded, isDisabled, isMobile, showMobileLabels, className, style, onClick, onDoubleClick, onContextMenu, onCellClick, onSelect, onExpand, enableSelection, enableExpansion, renderExpansion, getRowId, }: GridRowProps<T>): ReactNode;
+
+declare function GridCell<T extends RowData = RowData>({ column, row, rowIndex, value, width, align, className, style, showLabel, labelText, sticky, stickyOffset, onClick, }: GridCellProps<T>): ReactNode;
+
+interface PaginationProps {
+    page: number;
+    pageSize: number;
+    totalItems: number;
+    totalPages: number;
+    pageSizeOptions?: readonly number[];
+    showFirstLast?: boolean;
+    showPageNumbers?: boolean;
+    maxPageButtons?: number;
+    className?: string;
+    style?: CSSProperties;
+    onPageChange: (page: number) => void;
+    onPageSizeChange: (pageSize: number) => void;
+}
+
+declare function Pagination({ page, pageSize, totalItems, totalPages, pageSizeOptions, showFirstLast, showPageNumbers, maxPageButtons, className, style, onPageChange, onPageSizeChange, }: PaginationProps): ReactNode;
+
+interface SkeletonProps {
+    rows?: number;
+    columns?: number;
+    columnWidths?: (number | string)[];
+    rowHeight?: number;
+    className?: string;
+    style?: CSSProperties;
+    showHeader?: boolean;
+    animate?: boolean;
+}
+
+declare function Skeleton({ rows, columns, columnWidths, rowHeight, className, style, showHeader, animate, }: SkeletonProps): ReactNode;
+
+interface EmptyStateProps {
+    title?: string;
+    description?: string;
+    icon?: ReactNode;
+    action?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+
+declare function EmptyState({ title, description, icon, action, className, style, }: EmptyStateProps): ReactNode;
+
+type DrawerContent = 'filter' | 'sort' | 'columns';
+interface MobileDrawerProps {
+    isOpen: boolean;
+    content: DrawerContent | null;
+    onClose: () => void;
+    className?: string;
+    style?: CSSProperties;
+    children?: ReactNode;
+}
+
+declare function MobileDrawer({ isOpen, content, onClose, className, style, }: MobileDrawerProps): ReactNode;
+
+interface TableContextState<T extends RowData = RowData> {
+    data: T[];
+    originalData: T[];
+    columns: ColumnDefinition<T>[];
+    columnStates: ColumnState[];
+    sorting: SortValue[];
+    filters: FilterValue[];
+    globalFilter: string;
+    page: number;
+    pageSize: number;
+    totalItems: number;
+    selectedIds: Set<string | number>;
+    expandedIds: Set<string | number>;
+    loading: boolean;
+    error: Error | string | null;
+    theme: Theme;
+    translations: Translations;
+    currentBreakpoint: Breakpoint;
+    mobileBreakpoint: Breakpoint;
+    draggingColumnId: string | null;
+    resizingColumnId: string | null;
+    activeFilterColumnId: string | null;
+    showMobileDrawer: boolean;
+    mobileDrawerContent: 'filter' | 'sort' | 'columns' | null;
+}
+interface TableContextActions<T extends RowData = RowData> {
+    setData: (data: T[]) => void;
+    setLoading: (loading: boolean) => void;
+    setError: (error: Error | string | null) => void;
+    setSorting: (columnId: string, direction: SortDirection) => void;
+    toggleSorting: (columnId: string) => void;
+    clearSorting: () => void;
+    setFilter: (columnId: string, value: unknown, operator?: FilterOperator) => void;
+    removeFilter: (columnId: string) => void;
+    clearFilters: () => void;
+    setGlobalFilter: (value: string) => void;
+    setPage: (page: number) => void;
+    setPageSize: (pageSize: number) => void;
+    selectRow: (id: string | number) => void;
+    deselectRow: (id: string | number) => void;
+    toggleRow: (id: string | number) => void;
+    selectAll: () => void;
+    deselectAll: () => void;
+    expandRow: (id: string | number) => void;
+    collapseRow: (id: string | number) => void;
+    toggleRowExpansion: (id: string | number) => void;
+    reorderColumn: (sourceId: string, targetId: string) => void;
+    resizeColumn: (columnId: string, width: number) => void;
+    toggleColumnVisibility: (columnId: string) => void;
+    resetColumns: () => void;
+    setDraggingColumn: (columnId: string | null) => void;
+    setResizingColumn: (columnId: string | null) => void;
+    setActiveFilterColumn: (columnId: string | null) => void;
+    openMobileDrawer: (content: 'filter' | 'sort' | 'columns') => void;
+    closeMobileDrawer: () => void;
+    refresh: () => void;
+    reset: () => void;
+}
+interface TableContextValue<T extends RowData = RowData> {
+    state: TableContextState<T>;
+    actions: TableContextActions<T>;
+    computed: {
+        filteredData: T[];
+        sortedData: T[];
+        paginatedData: T[];
+        visibleColumns: ColumnDefinition<T>[];
+        totalPages: number;
+        canGoNext: boolean;
+        canGoPrevious: boolean;
+        allSelected: boolean;
+        someSelected: boolean;
+        isMobile: boolean;
+        isTablet: boolean;
+        isDesktop: boolean;
+    };
+}
+interface TableProviderProps<T extends RowData = RowData> {
+    children: ReactNode;
+    data: T[];
+    columns: ColumnDefinition<T>[];
+    loading?: boolean;
+    error?: Error | string | null;
+    theme?: Partial<Theme>;
+    translations?: Partial<Translations>;
+    mobileBreakpoint?: Breakpoint;
+    paginationConfig?: PaginationConfig;
+    filterConfig?: FilterConfig;
+    sortConfig?: SortConfig;
+    enableMultiSort?: boolean;
+    enableRowSelection?: boolean;
+    enableMultiSelect?: boolean;
+    getRowId?: (row: T) => string | number;
+    onStateChange?: (state: TableContextState<T>) => void;
+}
+
+declare const TableContext: react.Context<TableContextValue<RowData> | null>;
+declare function TableProvider<T extends RowData>({ children, data, columns, loading, error, theme, translations, mobileBreakpoint, paginationConfig, filterConfig: _filterConfig, sortConfig: _sortConfig, enableMultiSort, getRowId, onStateChange, }: TableProviderProps<T>): ReactNode;
+declare function useTableContext<T extends RowData = RowData>(): TableContextValue<T>;
+
+interface UseSortReturn {
+    sorting: SortState['sorting'];
+    getSortDirection: (columnId: string) => SortDirection;
+    getSortIndex: (columnId: string) => number;
+    isSorted: (columnId: string) => boolean;
+    setSorting: SortActions['setSorting'];
+    toggleSorting: SortActions['toggleSorting'];
+    clearSorting: SortActions['clearSorting'];
+    clearColumnSorting: (columnId: string) => void;
+}
+declare function useSort(): UseSortReturn;
+
+interface UseFilterReturn {
+    filters: FilterValue[];
+    globalFilter: string;
+    activeFilterColumnId: string | null;
+    hasAnyFilter: () => boolean;
+    hasFilter: (columnId: string) => boolean;
+    getFilterValue: (columnId: string) => FilterValue | undefined;
+    setFilter: FilterActions['setFilter'];
+    removeFilter: FilterActions['removeFilter'];
+    clearFilters: FilterActions['clearFilters'];
+    setGlobalFilter: FilterActions['setGlobalFilter'];
+    clearGlobalFilter: () => void;
+    openFilterPanel: (columnId: string) => void;
+    closeFilterPanel: () => void;
+}
+interface UseFilterOptions {
+    debounceMs?: number;
+}
+declare function useFilter(options?: UseFilterOptions): UseFilterReturn;
+
+interface UsePaginationReturn extends PaginationInfo, PaginationActions {
+    pageSizeOptions: readonly number[];
+}
+interface UsePaginationOptions {
+    pageSizeOptions?: readonly number[];
+}
+declare function usePagination(options?: UsePaginationOptions): UsePaginationReturn;
+
+interface UseDragDropReturn {
+    isDragging: boolean;
+    draggingColumnId: string | null;
+    dragOverColumnId: string | null;
+    handleDragStart: (columnId: string) => (event: React.DragEvent) => void;
+    handleDragOver: (columnId: string) => (event: React.DragEvent) => void;
+    handleDragEnd: () => void;
+    handleDrop: (targetColumnId: string) => (event: React.DragEvent) => void;
+    handleDragLeave: () => void;
+    getDragHandleProps: (columnId: string) => DragHandleProps;
+    getDropTargetProps: (columnId: string) => DropTargetProps;
+}
+interface DragHandleProps {
+    draggable: boolean;
+    onDragStart: (event: React.DragEvent) => void;
+    onDragEnd: () => void;
+}
+interface DropTargetProps {
+    onDragOver: (event: React.DragEvent) => void;
+    onDragLeave: () => void;
+    onDrop: (event: React.DragEvent) => void;
+}
+interface UseDragDropOptions {
+    onReorder?: (event: ColumnReorderEvent) => void;
+    enabled?: boolean;
+}
+declare function useDragDrop(options?: UseDragDropOptions): UseDragDropReturn;
+
+declare const DEFAULT_PAGE_SIZE = 10;
+declare const DEFAULT_PAGE_SIZES: readonly [10, 20, 50, 100];
+declare const MIN_COLUMN_WIDTH = 50;
+declare const DEFAULT_COLUMN_WIDTH = 150;
+declare const MAX_COLUMN_WIDTH = 500;
+declare const MOBILE_BREAKPOINT = 640;
+declare const TABLET_BREAKPOINT = 768;
+declare const DESKTOP_BREAKPOINT = 1024;
+
+declare const BREAKPOINTS: {
+    readonly mobile: 640;
+    readonly tablet: 768;
+    readonly desktop: 1024;
+};
+declare const BREAKPOINT_KEYS: readonly ["mobile", "tablet", "desktop"];
+declare const RESPONSIVE_MODES: {
+    readonly stack: "stack";
+    readonly scroll: "scroll";
+    readonly hide: "hide";
+};
+
+declare const DEFAULT_TRANSLATIONS: {
+    readonly empty: "No data available";
+    readonly loading: "Loading...";
+    readonly search: "Search...";
+    readonly filter: "Filter";
+    readonly sort: "Sort";
+    readonly sortAsc: "Sort ascending";
+    readonly sortDesc: "Sort descending";
+    readonly clearSort: "Clear sort";
+    readonly clearFilter: "Clear filter";
+    readonly clearAll: "Clear all";
+    readonly apply: "Apply";
+    readonly cancel: "Cancel";
+    readonly columns: "Columns";
+    readonly showColumns: "Show columns";
+    readonly hideColumn: "Hide column";
+    readonly resetColumns: "Reset columns";
+    readonly rowsPerPage: "Rows per page";
+    readonly of: "of";
+    readonly page: "Page";
+    readonly first: "First";
+    readonly previous: "Previous";
+    readonly next: "Next";
+    readonly last: "Last";
+    readonly selected: "selected";
+    readonly dragToReorder: "Drag to reorder";
+    readonly noResults: "No results found";
+    readonly errorLoading: "Error loading data";
+    readonly retry: "Retry";
+};
+declare const DEFAULT_THEME: {
+    mode: "dark";
+    colors: {
+        background: {
+            primary: string;
+            secondary: string;
+            tertiary: string;
+            hover: string;
+        };
+        text: {
+            primary: string;
+            secondary: string;
+            muted: string;
+        };
+        border: {
+            default: string;
+            hover: string;
+        };
+        accent: {
+            primary: string;
+            success: string;
+            warning: string;
+            error: string;
+        };
+    };
+};
+declare const DEFAULT_LIGHT_THEME: {
+    mode: "light";
+    colors: {
+        background: {
+            primary: string;
+            secondary: string;
+            tertiary: string;
+            hover: string;
+        };
+        text: {
+            primary: string;
+            secondary: string;
+            muted: string;
+        };
+        border: {
+            default: string;
+            hover: string;
+        };
+        accent: {
+            primary: string;
+            success: string;
+            warning: string;
+            error: string;
+        };
+    };
+};
+declare const DEFAULT_TABLE_CONFIG: {
+    readonly pageSize: 10;
+    readonly pageSizes: readonly [10, 20, 50, 100];
+    readonly columnWidth: 150;
+    readonly mobileBreakpoint: "tablet";
+    readonly stickyHeader: true;
+    readonly showPagination: true;
+    readonly showFilter: true;
+    readonly showSort: true;
+    readonly enableDragDrop: true;
+    readonly enableColumnResize: true;
+    readonly enableRowSelection: false;
+    readonly enableMultiSelect: false;
+    readonly showColumnToggle: true;
+    readonly showEmptyState: true;
+    readonly showSkeleton: true;
+    readonly skeletonRows: 5;
+    readonly virtualize: false;
+    readonly virtualizeThreshold: 100;
+};
+
+interface UseBreakpointReturn {
+    currentBreakpoint: Breakpoint;
+    isMobile: boolean;
+    isTablet: boolean;
+    isDesktop: boolean;
+    isMobileOrTablet: boolean;
+    isTabletOrDesktop: boolean;
+    breakpointValue: <T>(value: ResponsiveValue<T>, fallback: T) => T;
+    shouldShowMobileView: boolean;
+}
+declare function useBreakpoint(): UseBreakpointReturn;
+
+interface UseTableReturn<T extends RowData = RowData> {
+    data: T[];
+    filteredData: T[];
+    sortedData: T[];
+    paginatedData: T[];
+    columns: ColumnDefinition<T>[];
+    visibleColumns: ColumnDefinition<T>[];
+    loading: boolean;
+    error: Error | string | null;
+    isEmpty: boolean;
+    sort: UseSortReturn;
+    filter: UseFilterReturn;
+    pagination: UsePaginationReturn;
+    dragDrop: UseDragDropReturn;
+    breakpoint: UseBreakpointReturn;
+    selection: {
+        selectedIds: Set<string | number>;
+        allSelected: boolean;
+        someSelected: boolean;
+        selectRow: (id: string | number) => void;
+        deselectRow: (id: string | number) => void;
+        toggleRow: (id: string | number) => void;
+        selectAll: () => void;
+        deselectAll: () => void;
+        isSelected: (id: string | number) => boolean;
+    };
+    expansion: {
+        expandedIds: Set<string | number>;
+        expandRow: (id: string | number) => void;
+        collapseRow: (id: string | number) => void;
+        toggleRow: (id: string | number) => void;
+        isExpanded: (id: string | number) => boolean;
+    };
+    columnApi: {
+        states: ColumnState[];
+        reorder: (sourceId: string, targetId: string) => void;
+        resize: (columnId: string, width: number) => void;
+        toggleVisibility: (columnId: string) => void;
+        reset: () => void;
+        getWidth: (columnId: string) => number;
+        isVisible: (columnId: string) => boolean;
+    };
+    mobile: {
+        showDrawer: boolean;
+        drawerContent: 'filter' | 'sort' | 'columns' | null;
+        openDrawer: (content: 'filter' | 'sort' | 'columns') => void;
+        closeDrawer: () => void;
+    };
+    theme: Theme;
+    translations: Translations;
+    refresh: () => void;
+    reset: () => void;
+}
+declare function useTable<T extends RowData = RowData>(): UseTableReturn<T>;
+
+export { type Alignment, BREAKPOINTS, BREAKPOINT_KEYS, type Breakpoint, type ClassNames, type ColumnDefinition, type ColumnReorderEvent, type ColumnResizeEvent, type ColumnState, type ColumnVisibilityEvent, DEFAULT_COLUMN_WIDTH, DEFAULT_LIGHT_THEME, DEFAULT_PAGE_SIZE, DEFAULT_PAGE_SIZES, DEFAULT_TABLE_CONFIG, DEFAULT_THEME, DEFAULT_TRANSLATIONS, DESKTOP_BREAKPOINT, type Dimensions, EmptyState, type EmptyStateProps, type FilterActions, type FilterConfig, type FilterOperator, type FilterOption, type FilterPanelProps, type FilterState, type FilterValue, GridBody, type GridBodyProps, GridCell, type GridCellProps, GridHeader, type GridHeaderProps, GridRow, type GridRowProps, GridTable, type GridTableComponentProps, type GridTableProps, type GridTableRef, MAX_COLUMN_WIDTH, MIN_COLUMN_WIDTH, MOBILE_BREAKPOINT, MobileDrawer, type MobileDrawerProps, Pagination, type PaginationActions, type PaginationConfig, type PaginationInfo, type PaginationProps, type PaginationState, RESPONSIVE_MODES, type RenderFunction, type ResponsiveValue, type RowData, type RowExpansionActions, type RowExpansionState, type RowProps, type RowSelectionActions, type RowSelectionState, type RowState, Skeleton, type SkeletonProps, type SortActions, type SortConfig, type SortDirection, type SortState, type SortValue, type Styles, TABLET_BREAKPOINT, TableContext, type TableContextActions, type TableContextState, type TableContextValue, type TableInstance, TableProvider, type TableProviderProps, type TableState, type Theme, type ThemeColors, type ThemeMode, type Translations, type UseBreakpointReturn, type UseDragDropReturn, type UseFilterReturn, type UsePaginationReturn, type UseSortReturn, type UseTableReturn, useBreakpoint, useDragDrop, useFilter, usePagination, useSort, useTable, useTableContext };