///
import { Alignment, Direction, Media } from './constants';
import { CSSObject } from 'styled-components';
export declare enum SortOrder {
ASC = "asc",
DESC = "desc"
}
export type Primitive = string | number | boolean | bigint;
export type ColumnSortFunction = (a: T, b: T) => number;
export type ExpandRowToggled = (expanded: boolean, row: T) => void;
export type Format = (row: T, rowIndex: number) => React.ReactNode;
export type RowState = ((row: T) => boolean) | null;
export type Selector = (row: T, rowIndex?: number) => Primitive;
export type SortFunction = (rows: T[], field: Selector, sortDirection: SortOrder) => T[];
export type TableRow = Record;
export type ComponentProps = Record;
export type ExpanderComponentProps = {
data: T;
};
export type ExpandableRowsComponent = React.ComponentType>;
export type PaginationChangePage = (page: number, totalRows: number) => void;
export type PaginationChangeRowsPerPage = (currentRowsPerPage: number, currentPage: number) => void;
export type PaginationComponentProps = {
rowsPerPage: number;
rowCount: number;
currentPage: number;
onChangePage: PaginationChangePage;
onChangeRowsPerPage: PaginationChangeRowsPerPage;
};
export type PaginationComponent = React.ComponentType;
export type TableProps = {
actions?: React.ReactNode | React.ReactNode[];
className?: string;
clearSelectedRows?: boolean;
columns: TableColumn[];
conditionalRowStyles?: ConditionalStyles[];
contextActions?: React.ReactNode | React.ReactNode[];
contextComponent?: React.ReactNode;
contextMessage?: ContextMessage;
customStyles?: TableStyles;
data: T[];
defaultSortAsc?: boolean;
defaultSortFieldId?: string | number | null | undefined;
dense?: boolean;
direction?: Direction;
disabled?: boolean;
expandableIcon?: ExpandableIcon;
expandableInheritConditionalStyles?: boolean;
expandableRowDisabled?: RowState;
expandableRowExpanded?: RowState;
expandableRows?: boolean;
expandableRowsComponent?: ExpandableRowsComponent;
expandableRowsComponentProps?: ComponentProps;
expandableRowsHideExpander?: boolean;
expandOnRowClicked?: boolean;
expandOnRowDoubleClicked?: boolean;
fixedHeader?: boolean;
fixedHeaderScrollHeight?: string;
highlightOnHover?: boolean;
keyField?: string;
noContextMenu?: boolean;
noDataComponent?: React.ReactNode;
noHeader?: boolean;
noTableHead?: boolean;
onChangePage?: PaginationChangePage;
onChangeRowsPerPage?: PaginationChangeRowsPerPage;
onRowClicked?: (row: T, e: React.MouseEvent) => void;
onRowDoubleClicked?: (row: T, e: React.MouseEvent) => void;
onRowMouseEnter?: (row: T, e: React.MouseEvent) => void;
onRowMouseLeave?: (row: T, e: React.MouseEvent) => void;
onRowExpandToggled?: ExpandRowToggled;
onSelectedRowsChange?: (selected: {
allSelected: boolean;
selectedCount: number;
selectedRows: T[];
}) => void;
onSort?: (selectedColumn: TableColumn, sortDirection: SortOrder, sortedRows: T[]) => void;
onColumnOrderChange?: (nextOrder: TableColumn[]) => void;
pagination?: boolean;
paginationComponent?: PaginationComponent;
paginationComponentOptions?: PaginationOptions;
paginationDefaultPage?: number;
paginationIconFirstPage?: React.ReactNode;
paginationIconLastPage?: React.ReactNode;
paginationIconNext?: React.ReactNode;
paginationIconPrevious?: React.ReactNode;
paginationPerPage?: number;
paginationResetDefaultPage?: boolean;
paginationRowsPerPageOptions?: number[];
paginationServer?: boolean;
paginationServerOptions?: PaginationServerOptions;
paginationTotalRows?: number;
persistTableHead?: boolean;
pointerOnHover?: boolean;
progressComponent?: React.ReactNode;
progressPending?: boolean;
responsive?: boolean;
selectableRowDisabled?: RowState;
selectableRows?: boolean;
selectableRowsComponent?: 'input' | React.ReactNode;
selectableRowsComponentProps?: ComponentProps;
selectableRowSelected?: RowState;
selectableRowsHighlight?: boolean;
selectableRowsNoSelectAll?: boolean;
selectableRowsVisibleOnly?: boolean;
selectableRowsSingle?: boolean;
sortFunction?: SortFunction | null;
sortIcon?: React.ReactNode;
sortServer?: boolean;
striped?: boolean;
style?: CSSObject;
subHeader?: React.ReactNode | React.ReactNode[];
subHeaderAlign?: Alignment;
subHeaderComponent?: React.ReactNode | React.ReactNode[];
subHeaderWrap?: boolean;
theme?: Themes;
/**
* Shows and displays a header with a title
* */
title?: string | React.ReactNode;
};
export type TableColumnBase = {
allowOverflow?: boolean;
button?: boolean;
center?: boolean;
compact?: boolean;
reorder?: boolean;
grow?: number;
hide?: number | ((value: number) => CSSObject) | Media;
id?: string | number;
ignoreRowClick?: boolean;
maxWidth?: string;
minWidth?: string;
name?: string | number | React.ReactNode;
omit?: boolean;
right?: boolean;
sortable?: boolean;
style?: CSSObject;
width?: string;
wrap?: boolean;
};
export interface TableColumn extends TableColumnBase {
name?: string | number | React.ReactNode;
sortField?: string;
cell?: (row: T, rowIndex: number, column: TableColumn, id: string | number) => React.ReactNode;
conditionalCellStyles?: ConditionalStyles[];
format?: Format | undefined;
selector?: Selector;
sortFunction?: ColumnSortFunction;
}
export interface ConditionalStyles {
when: (row: T) => boolean;
style?: CSSObject | ((row: T) => CSSObject);
classNames?: string[];
}
export interface TableStyles {
table?: {
style: CSSObject;
};
tableWrapper?: {
style: CSSObject;
};
responsiveWrapper?: {
style: CSSObject;
};
header?: {
style: CSSObject;
};
subHeader?: {
style: CSSObject;
};
head?: {
style: CSSObject;
};
headRow?: {
style?: CSSObject;
denseStyle?: CSSObject;
};
headCells?: {
style?: CSSObject;
draggingStyle?: CSSObject;
};
contextMenu?: {
style?: CSSObject;
activeStyle?: CSSObject;
};
cells?: {
style: CSSObject;
draggingStyle?: CSSObject;
};
rows?: {
style?: CSSObject;
selectedHighlightStyle?: CSSObject;
denseStyle?: CSSObject;
highlightOnHoverStyle?: CSSObject;
stripedStyle?: CSSObject;
};
expanderRow?: {
style: CSSObject;
};
expanderCell?: {
style: CSSObject;
};
expanderButton?: {
style: CSSObject;
};
pagination?: {
style?: CSSObject;
pageButtonsStyle?: CSSObject;
};
noData?: {
style: CSSObject;
};
progress?: {
style: CSSObject;
};
}
export interface PaginationOptions {
noRowsPerPage?: boolean;
rowsPerPageText?: string;
rangeSeparatorText?: string;
selectAllRowsItem?: boolean;
selectAllRowsItemText?: string;
}
export interface PaginationServerOptions {
persistSelectedOnSort?: boolean;
persistSelectedOnPageChange?: boolean;
}
export interface ExpandableIcon {
collapsed: React.ReactNode;
expanded: React.ReactNode;
}
export interface ContextMessage {
singular: string;
plural: string;
message?: string;
}
export type TableState = {
allSelected: boolean;
contextMessage: ContextMessage;
selectedCount: number;
selectedRows: T[];
selectedColumn: TableColumn;
sortDirection: SortOrder;
currentPage: number;
rowsPerPage: number;
selectedRowsFlag: boolean;
toggleOnSelectedRowsChange: boolean;
};
type ThemeText = {
primary: string;
secondary: string;
disabled: string;
};
type ThemeBackground = {
default: string;
};
type ThemeContext = {
background: string;
text: string;
};
type ThemeDivider = {
default: string;
};
type ThemeButton = {
default: string;
focus: string;
hover: string;
disabled: string;
};
type ThemeSelected = {
default: string;
text: string;
};
type ThemeHighlightOnHover = {
default: string;
text: string;
};
type ThemeStriped = {
default: string;
text: string;
};
export type Themes = string;
export interface Theme {
text: ThemeText;
background: ThemeBackground;
context: ThemeContext;
divider: ThemeDivider;
button: ThemeButton;
selected: ThemeSelected;
highlightOnHover: ThemeHighlightOnHover;
striped: ThemeStriped;
}
export interface AllRowsAction {
type: 'SELECT_ALL_ROWS';
keyField: string;
rows: T[];
rowCount: number;
mergeSelections: boolean;
}
export interface SingleRowAction {
type: 'SELECT_SINGLE_ROW';
keyField: string;
row: T;
isSelected: boolean;
rowCount: number;
singleSelect: boolean;
}
export interface MultiRowAction {
type: 'SELECT_MULTIPLE_ROWS';
keyField: string;
selectedRows: T[];
totalRows: number;
mergeSelections: boolean;
}
export interface SortAction {
type: 'SORT_CHANGE';
sortDirection: SortOrder;
selectedColumn: TableColumn;
clearSelectedOnSort: boolean;
}
export interface PaginationPageAction {
type: 'CHANGE_PAGE';
page: number;
paginationServer: boolean;
visibleOnly: boolean;
persistSelectedOnPageChange: boolean;
}
export interface PaginationRowsPerPageAction {
type: 'CHANGE_ROWS_PER_PAGE';
rowsPerPage: number;
page: number;
}
export interface ClearSelectedRowsAction {
type: 'CLEAR_SELECTED_ROWS';
selectedRowsFlag: boolean;
}
export interface ColumnsAction {
type: 'UPDATE_COLUMNS';
cols: TableColumn[];
}
export type Action = AllRowsAction | SingleRowAction | MultiRowAction | SortAction | PaginationPageAction | PaginationRowsPerPageAction | ClearSelectedRowsAction;
export {};