diff --git a/types/react-bootstrap-table-next/index.d.ts b/types/react-bootstrap-table-next/index.d.ts index 539c335f82..3c1fe3f596 100644 --- a/types/react-bootstrap-table-next/index.d.ts +++ b/types/react-bootstrap-table-next/index.d.ts @@ -60,7 +60,7 @@ export type ColumnSortFunc = ( a: T[E], b: T[E], order: 'asc' | 'desc', - dataField: string, + dataField: any, rowA: T, rowB: T, ) => number; @@ -74,7 +74,7 @@ export interface TableChangeState { data: T[]; cellEdit: { rowId: string; - dataField: string; + dataField: any; newValue: any; }; } @@ -100,7 +100,7 @@ export interface ColumnDescription { * If set the column will not use cell values */ isDummyField?: boolean; - dataField: T[keyof T] | string; + dataField: any; formatter?: ColumnFormatter; hidden?: boolean; /** @@ -192,7 +192,7 @@ export type PaginationOptions = Partial<{ /** * A numeric array is also available: [5, 10]. the purpose of above example is custom the text */ - sizePerPageList: Array | Array<{ text: string; value: number }>; + sizePerPageList: number[] | Array<{ text: string; value: number }>; /** * hide the going to first and last page button */ @@ -320,7 +320,7 @@ export interface BootstrapTableRef { }; } -export interface BootstrapTableProps { +export interface BootstrapTableProps { /** * Tells react-bootstrap-table2 which column is unique. */ @@ -355,14 +355,14 @@ export interface BootstrapTableProps { expandRow?: ExpandRowProps; parentClassName?: string | ((isExpand: boolean, row: T, rowIndex: number) => string); rowStyle?: ((row: T, rowIndex: number) => CSSProperties) | CSSProperties; - rowEvents?: RowEventHandlerProps; + rowEvents?: RowEventHandlerProps; rowClasses?: ((row: T, rowIndex: number) => string) | string; filtersClasses?: string; filterPosition?: FilterPosition; footerClasses?: string; - defaultSorted?: [{ dataField: string; order: SortOrder }]; + defaultSorted?: [{ dataField: any; order: SortOrder }]; sort?: { - dataField?: string; + dataField?: any; order: SortOrder; sortFunc?: any; sortCaret?: any; @@ -408,10 +408,10 @@ export interface ExpandHeaderColumnRenderer { export interface ExpandRowProps { renderer: (row: T, rowIndex: number) => JSX.Element; - expanded?: Array; + expanded?: number[]; onExpand?: (row: T, isExpand: boolean, rowIndex: number, e: SyntheticEvent) => void; - onExpandAll: (isExpandAll: boolean, results: Array, e: SyntheticEvent) => void; - nonExpandable: Array; + onExpandAll: (isExpandAll: boolean, results: number[], e: SyntheticEvent) => void; + nonExpandable: number[]; showExpandColumn?: boolean; onlyOneExpanding?: boolean; expandByColumnOnly?: boolean; diff --git a/types/react-bootstrap-table2-filter/index.d.ts b/types/react-bootstrap-table2-filter/index.d.ts index c38e234d1d..5b7a5cf655 100644 --- a/types/react-bootstrap-table2-filter/index.d.ts +++ b/types/react-bootstrap-table2-filter/index.d.ts @@ -9,6 +9,14 @@ import { TableColumnFilterProps, ColumnDescription } from 'react-bootstrap-table-next'; import { CSSProperties, SyntheticEvent } from 'react'; +export enum FILTER_TYPES { + TEXT = 'TEXT', + SELECT = 'SELECT', + MULTISELECT = 'MULTISELECT', + NUMBER = 'NUMBER', + DATE = 'DATE', +} + /** * Filter comparators used for table filters */ @@ -88,8 +96,8 @@ export function multiSelectFilter(props: Partial): Table * Number filter configuration options */ export type NumberFilterProps = TableColumnFilterProps & { - options?: Array; - comparators?: Array; + options?: number[]; + comparators?: Comparator[]; /** * When set to true comparator dropdown does not show a "no selection" option */ @@ -104,6 +112,35 @@ export type NumberFilterProps = TableColumnFilterProps): TableColumnFilterProps; +/** + * Date filter options + */ +export interface DateFilter extends TableColumnFilterProps { + withoutEmptyComparatorOption?: boolean; + defaultValue?: { + date: Date; + comparator: Comparator; + }; + comparator?: Comparator[]; + comparatorClassName?: string; + dateClassName?: string; + comparatorStyle?: CSSProperties; + dateStyle?: CSSProperties; +} + +export function dateFilter(props: DateFilter): TableColumnFilterProps; + +/** + * Custom filter + */ +export interface CustomFilterProps { + type?: string | FILTER_TYPES; + comparator?: Comparator; + caseSensitive?: boolean; +} + +export function customFilter(props: CustomFilterProps): TableColumnFilterProps; + /** * declaration for table filter sub module */ diff --git a/types/react-bootstrap-table2-paginator/index.d.ts b/types/react-bootstrap-table2-paginator/index.d.ts index b1fe5a026d..8b7e77849d 100644 --- a/types/react-bootstrap-table2-paginator/index.d.ts +++ b/types/react-bootstrap-table2-paginator/index.d.ts @@ -6,10 +6,44 @@ // documentation taken from https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/table-props.html -import { PaginationOptions } from 'react-bootstrap-table-next'; +import { PaginationOptions, BootstrapTableProps } from 'react-bootstrap-table-next'; + +export interface PaginationCtxOptions { + options?: PaginationOptions; +} /** * declaration for table pagination sub module and factory */ -declare function paginationFactory(options: PaginationOptions): { options?: PaginationOptions }; +declare function paginationFactory(options: PaginationOptions): PaginationCtxOptions; + export default paginationFactory; + +interface PaginationChildProps extends PaginationOptions { + tableId?: string; + bootstrap4?: boolean; +} + +/** + * Pagination context provider + */ +export function PaginationProvider(props: { + pagination?: PaginationOptions; + children: (childProps: { + paginationProps: PaginationChildProps; + paginationTableProps: BootstrapTableProps; + }) => React.ReactElement | null; +}): React.ReactElement | null; + +export const PaginationTotalStandalone: React.FC; +export const PaginationListStandalone: React.FC; + +export interface SizePerPageDropdownStandaloneProps extends PaginationChildProps { + open?: boolean; + hidden?: boolean; + btnContextual?: boolean; + variation?: 'dropdown' | 'dropup'; + className?: string; +} + +export const SizePerPageDropdownStandalone: React.FC; diff --git a/types/react-bootstrap-table2-toolkit/index.d.ts b/types/react-bootstrap-table2-toolkit/index.d.ts index bfaf0da2b6..f24c26db2e 100644 --- a/types/react-bootstrap-table2-toolkit/index.d.ts +++ b/types/react-bootstrap-table2-toolkit/index.d.ts @@ -6,7 +6,8 @@ // documentation taken from https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/table-props.html -import { ColumnDescription, BootstrapTableProps } from 'react-bootstrap-table-next'; +import { CSSProperties, ReactNode } from 'react'; +import { ColumnDescription } from 'react-bootstrap-table-next'; /** * declaration for table toolkit sub module @@ -39,8 +40,81 @@ export interface TableToolkitProps { data: T[]; ref?: any; columns: Array>; - children: (props: { baseProps: BootstrapTableProps; searchProps: InjectedSearchProps }) => JSX.Element; + children: (props: ToolkitContextType) => JSX.Element; } -declare function ToolkitProvider(props: TableToolkitProps): JSX.Element; +export interface ToolkitContextType { + searchProps: InjectedSearchProps; + csvProps: { + onExport: () => void; + }; + columnToggleProps: { + columns: ColumnDescription[]; + /** + * array of toggled columns + */ + toggles: boolean[]; + onColumnToggle: (dataField: string) => void; + }; + baseProps: { + /** + * table key field + */ + keyField: any; + columns: ColumnDescription[]; + data: any[]; + bootstrap4?: boolean; + }; +} + +export interface ToggleListProps { + columns: ColumnDescription[]; + /** + * array of toggled columns + */ + toggles: boolean[]; + onColumnToggle: (dataField: string) => void; + btnClassName?: string; + className?: string; + contextual?: string; +} + +export namespace ColumnToggle { + function ToggleList(props: ToggleListProps): React.ReactElement | null; +} + +export interface ExportCSVButtonProps { + children: ReactNode; + onExport: () => void; + style?: CSSProperties; + className?: string; +} + +export namespace CSVExport { + function ToggleList(props: ExportCSVButtonProps): React.ReactElement | null; +} + +export interface SearchBarProps { + onSearch: (searchText: string) => void; + className?: string; + placeholder?: string; + style?: CSSProperties; + delay?: number; + searchText?: string; + tableId?: string; +} +export interface ClearSearchButtonProps { + onClear?: () => void; + className?: string; + text?: string; +} + +export namespace Search { + function SearchBar(props: SearchBarProps): React.ReactElement | null; + function ClearSearchButton(props: ExportCSVButtonProps): React.ReactElement | null; +} + +export const ToolkitContext: React.Context; + +declare function ToolkitProvider(props: TableToolkitProps): React.ReactElement | null; export default ToolkitProvider;