@bsol-oss/react-datatable5 1.0.62 → 1.0.64
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +123 -91
- package/dist/index.js +218 -205
- package/dist/index.mjs +136 -123
- package/dist/types/components/DataTable/DataTableContext.d.ts +1 -0
- package/dist/types/components/DataTable/DataTableServer.d.ts +1 -6
- package/dist/types/components/DataTable/TableFilter.d.ts +0 -18
- package/dist/types/components/DataTable/useDataTable.d.ts +1 -0
- package/dist/types/index.d.ts +58 -5
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,11 +1,69 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
2
|
import { RowData, OnChangeFn, Updater, FilterFn, ColumnDef, RowSelectionState, ColumnFiltersState, SortingState, VisibilityState, Row, Table as Table$1, Column } from '@tanstack/react-table';
|
|
4
|
-
import
|
|
3
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
5
4
|
import React$1, { ReactNode } from 'react';
|
|
6
|
-
import
|
|
5
|
+
import { RankingInfo } from '@tanstack/match-sorter-utils';
|
|
7
6
|
import { TableProps as TableProps$1, GridProps, TextProps, TooltipProps } from '@chakra-ui/react';
|
|
8
7
|
import * as _tanstack_table_core from '@tanstack/table-core';
|
|
8
|
+
import * as react_icons_lib from 'react-icons/lib';
|
|
9
|
+
|
|
10
|
+
interface DensityToggleButtonProps {
|
|
11
|
+
icon?: React$1.ReactElement;
|
|
12
|
+
text?: string;
|
|
13
|
+
}
|
|
14
|
+
declare const DensityToggleButton: ({ text, icon, }: DensityToggleButtonProps) => react_jsx_runtime.JSX.Element;
|
|
15
|
+
|
|
16
|
+
interface EditFilterButtonProps {
|
|
17
|
+
text?: string;
|
|
18
|
+
title?: string;
|
|
19
|
+
closeText?: string;
|
|
20
|
+
resetText?: string;
|
|
21
|
+
icon?: React.ReactElement;
|
|
22
|
+
}
|
|
23
|
+
declare const EditFilterButton: ({ text, title, closeText, resetText, icon, ...props }: EditFilterButtonProps) => react_jsx_runtime.JSX.Element;
|
|
24
|
+
|
|
25
|
+
interface EditOrderButtonProps {
|
|
26
|
+
title?: string;
|
|
27
|
+
icon?: React$1.ReactElement;
|
|
28
|
+
text?: string;
|
|
29
|
+
}
|
|
30
|
+
declare const EditOrderButton: ({ text, icon, title, }: EditOrderButtonProps) => react_jsx_runtime.JSX.Element;
|
|
31
|
+
|
|
32
|
+
interface EditSortingButtonProps {
|
|
33
|
+
title?: string;
|
|
34
|
+
icon?: React.ReactElement;
|
|
35
|
+
text?: string;
|
|
36
|
+
}
|
|
37
|
+
declare const EditSortingButton: ({ text, icon, title, }: EditSortingButtonProps) => react_jsx_runtime.JSX.Element;
|
|
38
|
+
|
|
39
|
+
interface EditViewButtonProps {
|
|
40
|
+
text?: string;
|
|
41
|
+
icon?: React$1.ReactElement;
|
|
42
|
+
title?: string;
|
|
43
|
+
}
|
|
44
|
+
declare const EditViewButton: ({ text, icon, title, }: EditViewButtonProps) => react_jsx_runtime.JSX.Element;
|
|
45
|
+
|
|
46
|
+
interface PageSizeControlProps {
|
|
47
|
+
pageSizes?: number[];
|
|
48
|
+
}
|
|
49
|
+
declare const PageSizeControl: ({ pageSizes, }: PageSizeControlProps) => react_jsx_runtime.JSX.Element;
|
|
50
|
+
|
|
51
|
+
interface ResetFilteringButtonProps {
|
|
52
|
+
text?: string;
|
|
53
|
+
}
|
|
54
|
+
declare const ResetFilteringButton: ({ text, }: ResetFilteringButtonProps) => react_jsx_runtime.JSX.Element;
|
|
55
|
+
|
|
56
|
+
interface ResetSelectionButtonProps {
|
|
57
|
+
text?: string;
|
|
58
|
+
}
|
|
59
|
+
declare const ResetSelectionButton: ({ text, }: ResetSelectionButtonProps) => react_jsx_runtime.JSX.Element;
|
|
60
|
+
|
|
61
|
+
interface ResetSortingButtonProps {
|
|
62
|
+
text?: string;
|
|
63
|
+
}
|
|
64
|
+
declare const ResetSortingButton: ({ text, }: ResetSortingButtonProps) => react_jsx_runtime.JSX.Element;
|
|
65
|
+
|
|
66
|
+
declare const RowCountText: () => react_jsx_runtime.JSX.Element;
|
|
9
67
|
|
|
10
68
|
type DensityState = "sm" | "md" | "lg";
|
|
11
69
|
interface DensityTableState {
|
|
@@ -88,11 +146,6 @@ interface DataResponse<T> extends Result<T> {
|
|
|
88
146
|
count: number;
|
|
89
147
|
filterCount: number;
|
|
90
148
|
}
|
|
91
|
-
declare module "@tanstack/react-table" {
|
|
92
|
-
interface ColumnMeta<TData extends RowData, TValue> {
|
|
93
|
-
displayName?: string;
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
149
|
declare const DataTableServer: <TData>({ columns, url, enableRowSelection, enableMultiRowSelection, enableSubRowSelection, onRowSelect, columnOrder: defaultColumnOrder, columnFilters: defaultColumnFilter, density, globalFilter: defaultGlobalFilter, pagination: defaultPagination, sorting: defaultSorting, rowSelection: defaultRowSelection, columnVisibility: defaultColumnVisibility, children, }: DataTableServerProps<TData>) => react_jsx_runtime.JSX.Element;
|
|
97
150
|
|
|
98
151
|
interface TableControlsProps {
|
|
@@ -113,73 +166,6 @@ interface DefaultTableProps extends TableControlsProps {
|
|
|
113
166
|
}
|
|
114
167
|
declare const DefaultTable: ({ totalText, showFilter, showFooter, fitTableWidth, fitTableHeight, isMobile, filterOptions, showFilterTags, showFilterName, }: DefaultTableProps) => react_jsx_runtime.JSX.Element;
|
|
115
168
|
|
|
116
|
-
interface DensityToggleButtonProps {
|
|
117
|
-
icon?: React$1.ReactElement;
|
|
118
|
-
text?: string;
|
|
119
|
-
}
|
|
120
|
-
declare const DensityToggleButton: ({ text, icon, }: DensityToggleButtonProps) => react_jsx_runtime.JSX.Element;
|
|
121
|
-
|
|
122
|
-
interface EditFilterButtonProps {
|
|
123
|
-
text?: string;
|
|
124
|
-
title?: string;
|
|
125
|
-
closeText?: string;
|
|
126
|
-
resetText?: string;
|
|
127
|
-
icon?: React.ReactElement;
|
|
128
|
-
}
|
|
129
|
-
declare const EditFilterButton: ({ text, title, closeText, resetText, icon, ...props }: EditFilterButtonProps) => react_jsx_runtime.JSX.Element;
|
|
130
|
-
|
|
131
|
-
interface EditOrderButtonProps {
|
|
132
|
-
title?: string;
|
|
133
|
-
icon?: React$1.ReactElement;
|
|
134
|
-
text?: string;
|
|
135
|
-
}
|
|
136
|
-
declare const EditOrderButton: ({ text, icon, title, }: EditOrderButtonProps) => react_jsx_runtime.JSX.Element;
|
|
137
|
-
|
|
138
|
-
interface EditSortingButtonProps {
|
|
139
|
-
title?: string;
|
|
140
|
-
icon?: React.ReactElement;
|
|
141
|
-
text?: string;
|
|
142
|
-
}
|
|
143
|
-
declare const EditSortingButton: ({ text, icon, title, }: EditSortingButtonProps) => react_jsx_runtime.JSX.Element;
|
|
144
|
-
|
|
145
|
-
interface EditViewButtonProps {
|
|
146
|
-
text?: string;
|
|
147
|
-
icon?: React$1.ReactElement;
|
|
148
|
-
title?: string;
|
|
149
|
-
}
|
|
150
|
-
declare const EditViewButton: ({ text, icon, title, }: EditViewButtonProps) => react_jsx_runtime.JSX.Element;
|
|
151
|
-
|
|
152
|
-
interface FilterOptionsProps {
|
|
153
|
-
column: string;
|
|
154
|
-
}
|
|
155
|
-
declare const FilterOptions: ({ column }: FilterOptionsProps) => react_jsx_runtime.JSX.Element;
|
|
156
|
-
|
|
157
|
-
declare const GlobalFilter: ({ icon }: {
|
|
158
|
-
icon?: react_icons_lib.IconType | undefined;
|
|
159
|
-
}) => react_jsx_runtime.JSX.Element;
|
|
160
|
-
|
|
161
|
-
interface PageSizeControlProps {
|
|
162
|
-
pageSizes?: number[];
|
|
163
|
-
}
|
|
164
|
-
declare const PageSizeControl: ({ pageSizes, }: PageSizeControlProps) => react_jsx_runtime.JSX.Element;
|
|
165
|
-
|
|
166
|
-
interface ResetFilteringButtonProps {
|
|
167
|
-
text?: string;
|
|
168
|
-
}
|
|
169
|
-
declare const ResetFilteringButton: ({ text, }: ResetFilteringButtonProps) => react_jsx_runtime.JSX.Element;
|
|
170
|
-
|
|
171
|
-
interface ResetSelectionButtonProps {
|
|
172
|
-
text?: string;
|
|
173
|
-
}
|
|
174
|
-
declare const ResetSelectionButton: ({ text, }: ResetSelectionButtonProps) => react_jsx_runtime.JSX.Element;
|
|
175
|
-
|
|
176
|
-
interface ResetSortingButtonProps {
|
|
177
|
-
text?: string;
|
|
178
|
-
}
|
|
179
|
-
declare const ResetSortingButton: ({ text, }: ResetSortingButtonProps) => react_jsx_runtime.JSX.Element;
|
|
180
|
-
|
|
181
|
-
declare const RowCountText: () => react_jsx_runtime.JSX.Element;
|
|
182
|
-
|
|
183
169
|
interface TableProps extends TableProps$1 {
|
|
184
170
|
showLoading?: boolean;
|
|
185
171
|
loadingComponent?: JSX.Element;
|
|
@@ -219,22 +205,6 @@ interface TableRendererProps<TData> {
|
|
|
219
205
|
}
|
|
220
206
|
declare const TableComponent: <TData>({ render, }: TableRendererProps<TData>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>>;
|
|
221
207
|
|
|
222
|
-
declare module "@tanstack/react-table" {
|
|
223
|
-
interface ColumnMeta<TData extends RowData, TValue> {
|
|
224
|
-
/**
|
|
225
|
-
* @note you should provide a proper `filterfn` to handle the filtering when choosing `boolean`, `dateRange` and `custom`
|
|
226
|
-
*/
|
|
227
|
-
filterVariant?: "text" | "range" | "select" | "tag" | "boolean" | "dateRange" | "custom";
|
|
228
|
-
filterOptions?: string[];
|
|
229
|
-
filterRangeConfig?: {
|
|
230
|
-
min: number;
|
|
231
|
-
max: number;
|
|
232
|
-
step: number;
|
|
233
|
-
defaultValue: [number, number];
|
|
234
|
-
};
|
|
235
|
-
renderFilter?: (column: Column<TData>) => JSX.Element;
|
|
236
|
-
}
|
|
237
|
-
}
|
|
238
208
|
declare const TableFilter: () => react_jsx_runtime.JSX.Element;
|
|
239
209
|
|
|
240
210
|
declare const TableFilterTags: () => react_jsx_runtime.JSX.Element;
|
|
@@ -308,6 +278,68 @@ declare const useDataTable: () => {
|
|
|
308
278
|
globalFilter: string;
|
|
309
279
|
setGlobalFilter: (filter: string) => void;
|
|
310
280
|
loading: boolean;
|
|
281
|
+
hasError: boolean;
|
|
311
282
|
};
|
|
312
283
|
|
|
284
|
+
interface FilterOptionsProps {
|
|
285
|
+
column: string;
|
|
286
|
+
}
|
|
287
|
+
declare const FilterOptions: ({ column }: FilterOptionsProps) => react_jsx_runtime.JSX.Element;
|
|
288
|
+
|
|
289
|
+
declare const GlobalFilter: ({ icon }: {
|
|
290
|
+
icon?: react_icons_lib.IconType | undefined;
|
|
291
|
+
}) => react_jsx_runtime.JSX.Element;
|
|
292
|
+
|
|
293
|
+
declare module "@tanstack/react-table" {
|
|
294
|
+
interface ColumnMeta<TData extends RowData, TValue> {
|
|
295
|
+
/**
|
|
296
|
+
* The display name of the column, used for rendering headers.
|
|
297
|
+
*/
|
|
298
|
+
displayName?: string;
|
|
299
|
+
/**
|
|
300
|
+
* Specifies the type of filter to be used for the column.
|
|
301
|
+
*
|
|
302
|
+
* @remarks You should provide a proper `filterfn` to handle filtering when choosing `boolean`, `dateRange`, and `custom`.
|
|
303
|
+
*
|
|
304
|
+
* @remarks You should decide `renderFilter` to display filter ui when choosing `custom`.
|
|
305
|
+
*
|
|
306
|
+
* Possible values:
|
|
307
|
+
* - "text": A text input filter.
|
|
308
|
+
* - "range": A numerical range filter.
|
|
309
|
+
* - "select": A dropdown select filter.
|
|
310
|
+
* - "tag": A tag-based filter.
|
|
311
|
+
* - "boolean": A true/false filter.
|
|
312
|
+
* - "dateRange": A date range filter.
|
|
313
|
+
* - "custom": A custom filter function.
|
|
314
|
+
*/
|
|
315
|
+
filterVariant?: "text" | "range" | "select" | "tag" | "boolean" | "dateRange" | "custom";
|
|
316
|
+
/**
|
|
317
|
+
* Options for the select filter variant, if applicable.
|
|
318
|
+
*/
|
|
319
|
+
filterOptions?: string[];
|
|
320
|
+
/**
|
|
321
|
+
* Configuration for the range filter variant, if applicable.
|
|
322
|
+
*
|
|
323
|
+
* Properties:
|
|
324
|
+
* - `min`: Minimum value for the range.
|
|
325
|
+
* - `max`: Maximum value for the range.
|
|
326
|
+
* - `step`: Step increment for the range.
|
|
327
|
+
* - `defaultValue`: Default range values for the filter.
|
|
328
|
+
*/
|
|
329
|
+
filterRangeConfig?: {
|
|
330
|
+
min: number;
|
|
331
|
+
max: number;
|
|
332
|
+
step: number;
|
|
333
|
+
defaultValue: [number, number];
|
|
334
|
+
};
|
|
335
|
+
/**
|
|
336
|
+
* A function that renders the filter component for the column.
|
|
337
|
+
*
|
|
338
|
+
* @param column - The column for which the filter is being rendered.
|
|
339
|
+
* @returns A JSX element representing the filter UI.
|
|
340
|
+
*/
|
|
341
|
+
renderFilter?: (column: Column<TData>) => JSX.Element;
|
|
342
|
+
}
|
|
343
|
+
}
|
|
344
|
+
|
|
313
345
|
export { type DataResponse, DataTable, type DataTableProps, DataTableServer, type DataTableServerProps, DefaultTable, type DefaultTableProps, DensityToggleButton, type DensityToggleButtonProps, EditFilterButton, type EditFilterButtonProps, EditOrderButton, type EditOrderButtonProps, EditSortingButton, type EditSortingButtonProps, EditViewButton, type EditViewButtonProps, FilterOptions, type FilterOptionsProps, GlobalFilter, PageSizeControl, type PageSizeControlProps, type PaginationProps, ReloadButton, type ReloadButtonProps, ResetFilteringButton, type ResetFilteringButtonProps, ResetSelectionButton, type ResetSelectionButtonProps, ResetSortingButton, type ResetSortingButtonProps, type Result, RowCountText, Table, TableBody, type TableBodyProps, TableCardContainer, type TableCardContainerProps, TableCards, type TableCardsProps, TableComponent, TableControls, type TableControlsProps, TableFilter, TableFilterTags, TableFooter, type TableFooterProps, TableHeader, type TableHeaderProps, TableLoadingComponent, type TableLoadingComponentProps, TableOrderer, TablePagination, type TableProps, type TableRendererProps, type TableRowSelectorProps, TableSelector, TableSorter, TableViewer, TextCell, type TextCellProps, useDataFromUrl, type useDataFromUrlProps, type useDataFromUrlReturn, useDataTable };
|