import { ComputedRef } from 'vue'; import { getCellText, getCellValue, getColumnField, getFieldValue, getRowKey, DataTableDataKey } from './utils/field'; import { pageCount, paginateRows, buildPageOptions } from './utils/pagination'; import { nextMultiSort, nextSort, sortRows } from './utils/sort'; export type DataTableRow = Record; export type DataTableAlign = 'start' | 'center' | 'end'; export type DataTableSortOrder = 1 | -1 | null; export type DataTableSortMode = 'single' | 'multiple'; export type DataTableSelectionMode = 'single' | 'multiple'; export type DataTableSelection = DataTableRow | DataTableRow[] | null; export type { DataTableDataKey }; export type { DataTablePaginatorPosition } from './composables/useDataTablePagination'; export type { DataTablePageEvent, DataTablePageOption, DataTablePageRange, } from './utils/pagination'; export interface DataTableColumn { /** * Stable id used as the Vue key and as the `#cell-{key}` slot name. */ key: string; /** * Visible header label. */ header: string; /** * Dot-path into the row. Defaults to `key`. */ field?: string; /** * Horizontal alignment of the header and body cells. */ align?: DataTableAlign; /** * When true, the header is a button that toggles this column's sort. */ sortable?: boolean; /** * Footer cell copy. A `#footer-{key}` slot overrides this. */ footer?: string; /** * Minimum column width (CSS length). Use with horizontal overflow so columns * do not squeeze. Required for a reliable frozen-column offset. */ minWidth?: string; /** * Pins the column during horizontal scroll. */ frozen?: boolean; /** * Edge to pin a frozen column. Defaults to `left`. */ alignFrozen?: 'left' | 'right'; } export interface DataTableSortMeta { field: string; order: 1 | -1; } export interface DataTableSortPayload { field: string | undefined; order: DataTableSortOrder; multiSortMeta?: DataTableSortMeta[]; } export interface DataTableRowSelectPayload { row: DataTableRow; index: number; } export type DataTableRowExpandPayload = DataTableRowSelectPayload; export interface UseDataTableOptions { value?: DataTableRow[] | null; dataKey?: DataTableDataKey; sortField?: string; sortOrder?: DataTableSortOrder; sortMode?: DataTableSortMode; multiSortMeta?: DataTableSortMeta[]; lazy?: boolean; removableSort?: boolean; defaultSortOrder?: 1 | -1; nullSortOrder?: 1 | -1; sortLabel?: string; selectionMode?: DataTableSelectionMode; selection?: DataTableSelection; paginator?: boolean; first?: number; rows?: number; totalRecords?: number; alwaysShowPaginator?: boolean; paginatorPosition?: import('./composables/useDataTablePagination').DataTablePaginatorPosition; rowsPerPageOptions?: number[]; pageMessage?: string; expandable?: boolean; expandedRows?: DataTableRow[]; } export type DataTableEmit = { (event: 'update:sortField', field: string | undefined): void; (event: 'update:sortOrder', order: DataTableSortOrder): void; (event: 'update:multiSortMeta', meta: DataTableSortMeta[]): void; (event: 'sort', payload: DataTableSortPayload): void; (event: 'update:selection', selection: DataTableSelection): void; (event: 'row-select', payload: DataTableRowSelectPayload): void; (event: 'row-unselect', payload: DataTableRowSelectPayload): void; (event: 'update:first', first: number): void; (event: 'update:rows', rows: number): void; (event: 'page', payload: import('./utils/pagination').DataTablePageEvent): void; (event: 'select-all-in-table'): void; (event: 'clear-selection'): void; (event: 'update:expandedRows', rows: DataTableRow[]): void; (event: 'row-expand', payload: DataTableRowExpandPayload): void; (event: 'row-collapse', payload: DataTableRowExpandPayload): void; }; export { getCellText, getCellValue, getColumnField, getFieldValue, getRowKey, buildPageOptions, pageCount, paginateRows, nextMultiSort, nextSort, sortRows, }; export type DataTableFrozenSide = 'left' | 'right'; export type DataTableFrozenOffset = { side: DataTableFrozenSide; offset: string; }; export declare const SELECTION_COLUMN_WIDTH = "2.5rem"; export declare const EXPANSION_COLUMN_WIDTH = "2.5rem"; export declare const columnFrozenOffsets: (columns: DataTableColumn[], hasSelection?: boolean, hasExpansion?: boolean) => Record; export declare const columnCellStyle: (column: DataTableColumn, frozen?: DataTableFrozenOffset) => Record | undefined; export declare const selectionFrozenStyle: (hasFrozenColumns: boolean) => Record | undefined; export declare const expansionFrozenStyle: (hasFrozenColumns: boolean, hasSelection: boolean) => Record | undefined; export declare const isSameRow: (left: DataTableRow, right: DataTableRow, dataKey?: DataTableDataKey) => boolean; export declare const isRowSelected: (row: DataTableRow, selection: DataTableSelection | undefined, selectionMode?: DataTableSelectionMode, dataKey?: DataTableDataKey) => boolean; export declare const isRowExpanded: (row: DataTableRow, expandedRows: DataTableRow[] | undefined, dataKey?: DataTableDataKey) => boolean; export declare const nextExpandedRows: (row: DataTableRow, expandedRows: DataTableRow[] | undefined, dataKey?: DataTableDataKey) => DataTableRow[]; export declare const nextSelection: (row: DataTableRow, selection: DataTableSelection | undefined, selectionMode: DataTableSelectionMode, dataKey?: DataTableDataKey) => DataTableSelection; export declare const useDataTable: (props: UseDataTableOptions, emit: DataTableEmit, columns: ComputedRef) => { displayedRows: ComputedRef; isEmpty: ComputedRef; columns: ComputedRef; getRowKey: (row: DataTableRow, index: number) => string; getCellValue: (row: DataTableRow, column: DataTableColumn) => unknown; getCellText: (row: DataTableRow, column: DataTableColumn) => string; isColumnSorted: (column: DataTableColumn) => boolean; columnSortOrder: (column: DataTableColumn) => DataTableSortOrder; ariaSort: (column: DataTableColumn) => "ascending" | "descending" | "none" | undefined; sortAriaLabel: (column: DataTableColumn) => string; toggleSort: (column: DataTableColumn) => void; cellSlotName: (column: DataTableColumn) => `cell-${string}`; headerSlotName: (column: DataTableColumn) => `header-${string}`; footerSlotName: (column: DataTableColumn) => `footer-${string}`; hasSelection: ComputedRef; hasExpansion: ComputedRef; columnCount: ComputedRef; isRowSelected: (row: DataTableRow) => boolean; isRowExpanded: (row: DataTableRow) => boolean; allSelected: ComputedRef; someSelected: ComputedRef; selectionCount: ComputedRef; allInTableSelected: ComputedRef; toggleRowSelection: (row: DataTableRow) => void; toggleRowExpansion: (row: DataTableRow) => void; toggleSelectAll: () => void; selectAllInTable: () => void; clearSelection: () => void; selectRange: (fromIndex: number, toIndex: number) => void; currentAzPage: ComputedRef; pageOptions: ComputedRef; setAzPage: (azPage: number) => void; setRows: (next: number) => void; displayRange: ComputedRef; showTopPaginator: ComputedRef; showBottomPaginator: ComputedRef; resolvedRows: ComputedRef; totalRecords: ComputedRef; }; //# sourceMappingURL=useDataTable.d.ts.map