trio-tanstack-table 1.0.1
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.css +85 -0
- package/dist/index.css.map +1 -0
- package/dist/index.d.mts +613 -0
- package/dist/index.d.ts +613 -0
- package/dist/index.js +5303 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +5280 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +54 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,613 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import react__default, { RefObject, ReactNode, ForwardedRef } from 'react';
|
|
3
|
+
import { GetComponentProps as GetComponentProps$1, ProFormSelectProps, ProFormFieldProps, ProFormDigitProps, ProFieldValueEnumType } from '@ant-design/pro-components';
|
|
4
|
+
import * as _tanstack_react_table from '@tanstack/react-table';
|
|
5
|
+
import { Row, Table, Cell, RowData, RowSelectionState, FilterFn, TableOptions, OnChangeFn, ColumnDef, GroupingState, ColumnFiltersState, SortingState, VisibilityState, Column, Header, TableState } from '@tanstack/react-table';
|
|
6
|
+
import { ButtonProps, TabsProps, DropdownProps, SelectProps, FormInstance, InputNumberProps, PopoverProps, DatePickerProps, DividerProps, InputProps as InputProps$1 } from 'antd';
|
|
7
|
+
import { MenuItemType } from 'antd/es/menu/interface';
|
|
8
|
+
import * as antd_style from 'antd-style';
|
|
9
|
+
import { TextProps } from 'antd/es/typography/Text';
|
|
10
|
+
import { ParagraphProps } from 'antd/es/typography/Paragraph';
|
|
11
|
+
import { TitleProps } from 'antd/es/typography/Title';
|
|
12
|
+
import { LinkProps } from 'antd/es/typography/Link';
|
|
13
|
+
import { InputProps } from 'antd/lib';
|
|
14
|
+
|
|
15
|
+
interface InternalTableProps<T> {
|
|
16
|
+
table: Table<T>;
|
|
17
|
+
loading?: boolean;
|
|
18
|
+
tableLoadingRowCount?: string | number;
|
|
19
|
+
bordered?: boolean;
|
|
20
|
+
onRow?: GetComponentProps$1<T>;
|
|
21
|
+
hasNextPage?: boolean;
|
|
22
|
+
isFetchingNextPage?: boolean;
|
|
23
|
+
onLoadMore?: () => void;
|
|
24
|
+
useViewportHeight?: boolean;
|
|
25
|
+
}
|
|
26
|
+
declare const InternalTable: <T>({ table, loading, tableLoadingRowCount, bordered, onRow, hasNextPage, isFetchingNextPage, onLoadMore, useViewportHeight, }: InternalTableProps<T>) => react.JSX.Element;
|
|
27
|
+
interface TableBodyProps<T> extends InternalTableProps<T> {
|
|
28
|
+
table: Table<T>;
|
|
29
|
+
data?: any[];
|
|
30
|
+
totalSize?: number;
|
|
31
|
+
layoutVersion?: string;
|
|
32
|
+
}
|
|
33
|
+
declare const TableBody: <T>({ table, bordered, onRow, layoutVersion, }: TableBodyProps<T>) => react.JSX.Element;
|
|
34
|
+
declare const VirtualTableBody: <T>({ data, table, bordered, totalSize, onRow, measureElement, layoutVersion, }: TableBodyProps<T> & {
|
|
35
|
+
measureElement: (el: Element | null) => void;
|
|
36
|
+
}) => react.JSX.Element;
|
|
37
|
+
declare const MemoizedTableBody: typeof TableBody;
|
|
38
|
+
declare const MemoizedCell: React.FC<{
|
|
39
|
+
cell: Cell<any, any>;
|
|
40
|
+
token: any;
|
|
41
|
+
table: CustomTable<any>;
|
|
42
|
+
bordered: any;
|
|
43
|
+
isPinning: boolean;
|
|
44
|
+
isRowSelected: boolean;
|
|
45
|
+
layoutVersion?: string;
|
|
46
|
+
}>;
|
|
47
|
+
declare const EditableRow: react.MemoExoticComponent<react.ForwardRefExoticComponent<{
|
|
48
|
+
index: any;
|
|
49
|
+
row: Row<any>;
|
|
50
|
+
isSelected: boolean;
|
|
51
|
+
onRow: any;
|
|
52
|
+
table: Table<any>;
|
|
53
|
+
bordered: any;
|
|
54
|
+
layoutVersion?: string;
|
|
55
|
+
data?: any[];
|
|
56
|
+
height?: number;
|
|
57
|
+
} & react.RefAttributes<HTMLTableRowElement>>>;
|
|
58
|
+
|
|
59
|
+
interface EIconProps extends Omit<react__default.HTMLAttributes<HTMLElement>, "color"> {
|
|
60
|
+
icon: string | any;
|
|
61
|
+
color?: string;
|
|
62
|
+
width?: string | number;
|
|
63
|
+
height?: string | number;
|
|
64
|
+
size?: string | number;
|
|
65
|
+
title?: string;
|
|
66
|
+
style?: react__default.CSSProperties;
|
|
67
|
+
className?: string;
|
|
68
|
+
}
|
|
69
|
+
declare const EIcon: react__default.FC<EIconProps>;
|
|
70
|
+
interface EPrimaryIconProps extends EIconProps {
|
|
71
|
+
child?: boolean;
|
|
72
|
+
isActive?: boolean;
|
|
73
|
+
}
|
|
74
|
+
declare const EPrimaryIcon: react__default.FC<EPrimaryIconProps>;
|
|
75
|
+
|
|
76
|
+
interface EButtonProps extends Omit<ButtonProps, "variant"> {
|
|
77
|
+
ref?: RefObject<any>;
|
|
78
|
+
}
|
|
79
|
+
declare const EButton: React.FC<EButtonProps>;
|
|
80
|
+
interface TableDeleteButtonProps extends ButtonProps {
|
|
81
|
+
indicator?: number;
|
|
82
|
+
}
|
|
83
|
+
declare const TableClearButton: React.FC<TableDeleteButtonProps>;
|
|
84
|
+
|
|
85
|
+
interface ETabProps extends TabsProps {
|
|
86
|
+
enableKeyboardNavigation?: boolean;
|
|
87
|
+
}
|
|
88
|
+
declare const ETab: react__default.FC<ETabProps>;
|
|
89
|
+
|
|
90
|
+
interface EDropdownProps extends DropdownProps {
|
|
91
|
+
width?: string | number;
|
|
92
|
+
}
|
|
93
|
+
declare const EDropdown: react__default.FC<EDropdownProps>;
|
|
94
|
+
|
|
95
|
+
interface ProSelectProps extends ProFormSelectProps {
|
|
96
|
+
isFullWidth?: boolean;
|
|
97
|
+
}
|
|
98
|
+
declare const ProSelect: react__default.FC<ProSelectProps>;
|
|
99
|
+
|
|
100
|
+
interface TextTypographyProps extends TextProps {
|
|
101
|
+
children: ReactNode;
|
|
102
|
+
color?: string;
|
|
103
|
+
fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
|
|
104
|
+
textAlign?: "center" | "left" | "right";
|
|
105
|
+
fontSize?: string;
|
|
106
|
+
}
|
|
107
|
+
declare const EText: react__default.FC<TextTypographyProps>;
|
|
108
|
+
interface ParagraphTypographyProps extends ParagraphProps {
|
|
109
|
+
children: ReactNode;
|
|
110
|
+
color?: string;
|
|
111
|
+
fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
|
|
112
|
+
textAlign?: "center" | "left" | "right";
|
|
113
|
+
}
|
|
114
|
+
declare const EParagraph: react__default.FC<ParagraphTypographyProps>;
|
|
115
|
+
interface TitleTypographyProps extends TitleProps {
|
|
116
|
+
children: ReactNode;
|
|
117
|
+
color?: string;
|
|
118
|
+
fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
|
|
119
|
+
textAlign?: "center" | "left" | "right";
|
|
120
|
+
}
|
|
121
|
+
declare const EHeading: react__default.FC<TitleTypographyProps>;
|
|
122
|
+
interface LinkTypographyProps extends LinkProps {
|
|
123
|
+
children: ReactNode;
|
|
124
|
+
color?: string;
|
|
125
|
+
fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
|
|
126
|
+
textAlign?: "center" | "left" | "right";
|
|
127
|
+
fontSize?: string;
|
|
128
|
+
linkColor?: string;
|
|
129
|
+
}
|
|
130
|
+
declare const ELink: react__default.FC<LinkTypographyProps>;
|
|
131
|
+
|
|
132
|
+
declare const DEFAULT_DATE_FORMAT = "DD-MM-YYYY";
|
|
133
|
+
declare const DEFAULT_BACKEND_DATE_FORMAT = "YYYY-MM-DD";
|
|
134
|
+
declare const DEFAULT_DATE_MONTH_FORMAT = "DD MMM, YYYY";
|
|
135
|
+
declare const DEFAULT_DATE_TIME_FORMAT = "DD-MM-YYYY h:mm A";
|
|
136
|
+
declare const VIEW_DATE_TIME_FORMAT = "DD MMM, YYYY h:mm A";
|
|
137
|
+
declare const FullColumnWIdth: "xl";
|
|
138
|
+
declare const parseDateTime: (str: Date | string) => Date | null;
|
|
139
|
+
declare const ProAmount: react__default.FC<ProFormDigitProps>;
|
|
140
|
+
interface ProDatePickerProps extends ProFormFieldProps<any, DatePickerProps> {
|
|
141
|
+
name?: string | number;
|
|
142
|
+
}
|
|
143
|
+
declare const ProDatePicker: react__default.FC<ProDatePickerProps>;
|
|
144
|
+
declare const ProDateRangePicker: react__default.FC<ProDatePickerProps>;
|
|
145
|
+
type dateFormat = "default" | "DD-MMM-YYYY h:mm A" | "DD MMM, YYYY" | "DD MMM, YYYY h:mm A" | "no_of_hours";
|
|
146
|
+
interface ProDateFieldProps {
|
|
147
|
+
date?: number | string;
|
|
148
|
+
format?: dateFormat;
|
|
149
|
+
iconColor?: string;
|
|
150
|
+
textProps?: TextTypographyProps;
|
|
151
|
+
popoverProps?: PopoverProps;
|
|
152
|
+
info?: react__default.ReactNode;
|
|
153
|
+
infoTitle?: string;
|
|
154
|
+
suffix?: react__default.ReactNode | string;
|
|
155
|
+
}
|
|
156
|
+
declare const ProDateField: react__default.FC<ProDateFieldProps>;
|
|
157
|
+
interface BasePreInputFormFieldProps extends Omit<ProFormFieldProps<any, InputProps>, "addonBefore"> {
|
|
158
|
+
selectProps?: SelectProps;
|
|
159
|
+
form?: FormInstance<any>;
|
|
160
|
+
}
|
|
161
|
+
interface TextPreInputFormFieldProps extends BasePreInputFormFieldProps {
|
|
162
|
+
inputType?: "text";
|
|
163
|
+
inputProps?: InputProps;
|
|
164
|
+
inputNumberProps?: never;
|
|
165
|
+
}
|
|
166
|
+
interface NumberPreInputFormFieldProps extends BasePreInputFormFieldProps {
|
|
167
|
+
inputType: "number";
|
|
168
|
+
inputNumberProps?: InputNumberProps;
|
|
169
|
+
inputProps?: never;
|
|
170
|
+
}
|
|
171
|
+
type PreInputFormFieldProps = TextPreInputFormFieldProps | NumberPreInputFormFieldProps;
|
|
172
|
+
declare const PreInputFormField: react__default.FC<PreInputFormFieldProps>;
|
|
173
|
+
|
|
174
|
+
interface EDividerProps extends DividerProps {
|
|
175
|
+
marginTop?: number;
|
|
176
|
+
marginBottom?: number;
|
|
177
|
+
}
|
|
178
|
+
declare const EDividerWithNoStyle: react__default.FC<EDividerProps>;
|
|
179
|
+
declare const useFilePreview: () => {
|
|
180
|
+
previewFile: (fileId: string) => Promise<any>;
|
|
181
|
+
getDownloadUrl: (fileId: string) => Promise<any>;
|
|
182
|
+
downloadFile: (fileId: string, filename?: string) => Promise<void>;
|
|
183
|
+
loading: boolean;
|
|
184
|
+
};
|
|
185
|
+
|
|
186
|
+
type BaseInputProps = InputProps$1 & ProFormDigitProps & ProSelectProps;
|
|
187
|
+
type TableInputFieldTypes = "select" | "digit" | "text" | "amount" | "quantity" | "date" | "radio" | "date-range" | "multi-select" | "mobile" | "attachment" | "dynamic-select" | "code" | "textarea" | "email" | "password" | "url" | "number" | "percentage" | "weight" | "km" | "pincode" | "datetime" | "time" | "google-location" | "pan" | "gst" | "latitude" | "longitude" | "presigned-upload" | "checkbox" | "modal-table-select" | "nestedEditableTable" | "serial-number-select";
|
|
188
|
+
interface TableInputProps extends BaseInputProps {
|
|
189
|
+
type?: TableInputFieldTypes | string;
|
|
190
|
+
}
|
|
191
|
+
declare const TableInput: react__default.FC<TableInputProps>;
|
|
192
|
+
|
|
193
|
+
interface RHFCardConfig {
|
|
194
|
+
columns?: string[];
|
|
195
|
+
gridColumns?: number;
|
|
196
|
+
hideLabels?: boolean;
|
|
197
|
+
badge?: {
|
|
198
|
+
enabled?: boolean;
|
|
199
|
+
bgColor?: string;
|
|
200
|
+
fgColor?: string;
|
|
201
|
+
size?: number;
|
|
202
|
+
};
|
|
203
|
+
className?: string;
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
type FilterVariantOptions = "search" | "select" | "range" | "multi-select" | "date" | "date-range";
|
|
207
|
+
type GetComponentProps<DataType> = (data: DataType, index?: number) => React.HTMLAttributes<any> & React.TdHTMLAttributes<any>;
|
|
208
|
+
interface TableEditableCellProps extends Record<string, any> {
|
|
209
|
+
valueType?: TableInputFieldTypes;
|
|
210
|
+
inputItemProps?: BaseInputProps;
|
|
211
|
+
}
|
|
212
|
+
interface GroupSummaryEntry {
|
|
213
|
+
count: number;
|
|
214
|
+
total: string;
|
|
215
|
+
}
|
|
216
|
+
interface GroupSummaryResult {
|
|
217
|
+
data: Array<{
|
|
218
|
+
key: unknown[];
|
|
219
|
+
label: string;
|
|
220
|
+
count: number;
|
|
221
|
+
total: string;
|
|
222
|
+
}>;
|
|
223
|
+
grandTotal: {
|
|
224
|
+
count: number;
|
|
225
|
+
total: string;
|
|
226
|
+
};
|
|
227
|
+
}
|
|
228
|
+
interface RequestResponse<T> {
|
|
229
|
+
data: T[];
|
|
230
|
+
total?: number;
|
|
231
|
+
success: boolean;
|
|
232
|
+
nextCursor?: any;
|
|
233
|
+
/** Cursor mode: backend-authoritative "more rows exist" flag */
|
|
234
|
+
hasNextPage?: boolean;
|
|
235
|
+
paginationMetadata?: {
|
|
236
|
+
page: number;
|
|
237
|
+
pageSize: number;
|
|
238
|
+
total: number;
|
|
239
|
+
totalPages: number;
|
|
240
|
+
hasNextPage: boolean;
|
|
241
|
+
hasPrevPage: boolean;
|
|
242
|
+
nextCursor?: any;
|
|
243
|
+
};
|
|
244
|
+
/**
|
|
245
|
+
* Backend-computed grand totals for the FULL filtered set (e.g.
|
|
246
|
+
* { totalDebit, totalCredit }). Rendered in the (sticky) footer so summary
|
|
247
|
+
* rows stay correct no matter how many infinite-scroll pages are loaded —
|
|
248
|
+
* never sum loaded rows on the client for financial totals.
|
|
249
|
+
*/
|
|
250
|
+
summary?: Record<string, unknown>;
|
|
251
|
+
}
|
|
252
|
+
interface DataProps {
|
|
253
|
+
rowIndex: number;
|
|
254
|
+
columnId: string;
|
|
255
|
+
value: unknown;
|
|
256
|
+
}
|
|
257
|
+
interface CustomTableMeta {
|
|
258
|
+
/** Server group summary: key = JSON.stringify(group value path as strings) */
|
|
259
|
+
groupSummary?: Map<string, GroupSummaryEntry>;
|
|
260
|
+
/** Backend grand totals for the full filtered set — read by column footers. */
|
|
261
|
+
footerSummary?: Record<string, unknown>;
|
|
262
|
+
reload: () => void;
|
|
263
|
+
updateData: (rowIndex: number, columnId: string, value: any) => void;
|
|
264
|
+
updateEditRowKey: (keys: React.Key[]) => void;
|
|
265
|
+
updateDensity?: (density: DensityState) => void;
|
|
266
|
+
rowSelection?: {
|
|
267
|
+
selectedRowKeys?: RowSelectionState;
|
|
268
|
+
onChange: (selectedRowKeys: React.Key[], selectedRows: any[]) => void;
|
|
269
|
+
selections?: MenuItemType[] | true;
|
|
270
|
+
};
|
|
271
|
+
rowExpandable?: {
|
|
272
|
+
onExpand: (selectedRowKeys: React.Key[], selectedRows: any[]) => void;
|
|
273
|
+
};
|
|
274
|
+
onSearchParamsChange?: (params: Record<string, unknown>) => void;
|
|
275
|
+
}
|
|
276
|
+
interface CustomTableOptions<T> extends TableOptions<T> {
|
|
277
|
+
meta?: CustomTableMeta;
|
|
278
|
+
onSearchParamsChange?: OnChangeFn<T>;
|
|
279
|
+
}
|
|
280
|
+
interface CustomTable<T> extends Omit<Table<T>, "options"> {
|
|
281
|
+
options: CustomTableOptions<T>;
|
|
282
|
+
}
|
|
283
|
+
interface TanstackToolbarProps {
|
|
284
|
+
options?: OptionConfig;
|
|
285
|
+
actions?: any[];
|
|
286
|
+
menu?: ListToolBarHeaderMenuProps;
|
|
287
|
+
title?: React.ReactNode | string;
|
|
288
|
+
subTitle?: React.ReactNode | string;
|
|
289
|
+
table?: Table<unknown>;
|
|
290
|
+
ref?: ForwardedRef<TableRef | undefined>;
|
|
291
|
+
selectionCount?: number;
|
|
292
|
+
selectionActions?: React.ReactNode;
|
|
293
|
+
columnsStateKey?: string;
|
|
294
|
+
}
|
|
295
|
+
interface Editable {
|
|
296
|
+
editedRowKey?: React.Key[];
|
|
297
|
+
setEditedRowKey?: (keys: React.Key[]) => void;
|
|
298
|
+
onDataSourceChange: ({ record, recordList }: any) => void;
|
|
299
|
+
}
|
|
300
|
+
type OmittedProps = "data" | "columns" | "getFilteredRowModel" | "getSortedRowModel" | "getCoreRowModel" | "getGroupedRowModel" | "getExpandedRowModel" | "getFacetedRowModel" | "getFacetedUniqueValues" | "getFacetedMinMaxValues" | "getPaginationRowModel" | "filterFns";
|
|
301
|
+
type OmittedTableProps<T> = Omit<TableOptions<T>, OmittedProps>;
|
|
302
|
+
interface TableRef {
|
|
303
|
+
reload: () => void;
|
|
304
|
+
focus?: () => void;
|
|
305
|
+
blur?: () => void;
|
|
306
|
+
getTable?: () => Table<any>;
|
|
307
|
+
deleteRow?: (rowIndex: number) => void;
|
|
308
|
+
}
|
|
309
|
+
interface OptionConfig {
|
|
310
|
+
reload?: boolean | {
|
|
311
|
+
icon?: React.ReactNode;
|
|
312
|
+
onClick?: () => void;
|
|
313
|
+
};
|
|
314
|
+
search?: boolean | {
|
|
315
|
+
autoFocus?: boolean;
|
|
316
|
+
placeholder?: string;
|
|
317
|
+
};
|
|
318
|
+
reloadIcon?: React.ReactNode;
|
|
319
|
+
}
|
|
320
|
+
type PaginationType = "virtual" | "pagination" | "cursor";
|
|
321
|
+
type OmittedInternalTableProps<T> = Omit<InternalTableProps<T>, "table">;
|
|
322
|
+
interface ColumnState {
|
|
323
|
+
persistenceType?: "localStorage";
|
|
324
|
+
persistenceKey?: string;
|
|
325
|
+
}
|
|
326
|
+
interface SavedViewsOption {
|
|
327
|
+
/** Stable identifier of this list page (saved views are stored per key per user) */
|
|
328
|
+
listKey: string;
|
|
329
|
+
}
|
|
330
|
+
interface ServerExportOption {
|
|
331
|
+
/** Key registered in the backend list-exports registry */
|
|
332
|
+
listKey: string;
|
|
333
|
+
/** Page-scoped filters always sent with the export (e.g. config.api.defaultParams) */
|
|
334
|
+
extraFilters?: Record<string, unknown>;
|
|
335
|
+
}
|
|
336
|
+
interface TanstackTableProps<T> extends OmittedInternalTableProps<T> {
|
|
337
|
+
paginationType?: PaginationType;
|
|
338
|
+
pagination?: PaginationState;
|
|
339
|
+
/** Enables the per-user Saved Views control in the toolbar */
|
|
340
|
+
savedViews?: SavedViewsOption;
|
|
341
|
+
/** Enables the server-side "Export All" CSV button in the toolbar */
|
|
342
|
+
serverExport?: ServerExportOption;
|
|
343
|
+
displayName?: string;
|
|
344
|
+
bordered?: boolean;
|
|
345
|
+
manualPagination?: boolean;
|
|
346
|
+
manualSorting?: boolean;
|
|
347
|
+
manualFiltering?: boolean;
|
|
348
|
+
manualGrouping?: boolean;
|
|
349
|
+
syncWithUrl?: boolean;
|
|
350
|
+
ref?: RefObject<TableRef | null>;
|
|
351
|
+
tableLoading?: boolean;
|
|
352
|
+
request?: (params: Record<string, unknown>) => Promise<RequestResponse<T>>;
|
|
353
|
+
/**
|
|
354
|
+
* Group summary fetcher (counts + financial totals per group). When grouping
|
|
355
|
+
* is active, called with the current grouping/filters/search; results power
|
|
356
|
+
* the group headers independently of how many detail rows are loaded.
|
|
357
|
+
*/
|
|
358
|
+
groupSummaryRequest?: (params: Record<string, unknown>) => Promise<GroupSummaryResult>;
|
|
359
|
+
dataSource?: T[];
|
|
360
|
+
density?: DensityState;
|
|
361
|
+
refreshDeps?: any[];
|
|
362
|
+
toolbar?: TanstackToolbarProps;
|
|
363
|
+
editable?: Editable;
|
|
364
|
+
tableProps?: OmittedTableProps<T>;
|
|
365
|
+
columns?: Array<ColumnDef<T, any>>;
|
|
366
|
+
columnsState?: ColumnState;
|
|
367
|
+
rowSelection?: {
|
|
368
|
+
selectionType?: "checkbox" | "radio";
|
|
369
|
+
selectedRowKeys?: RowSelectionState;
|
|
370
|
+
onChange: (selectedRowKeys: React.Key[], selectedRows: T[]) => void;
|
|
371
|
+
selections?: MenuItemType[] | true;
|
|
372
|
+
};
|
|
373
|
+
rowExpandable?: {
|
|
374
|
+
onExpand: (selectedRowKeys: React.Key[], selectedRows: T[]) => void;
|
|
375
|
+
};
|
|
376
|
+
options?: OptionConfig | false;
|
|
377
|
+
tableAlertOptionRender?: (selectedRowKeys: React.Key[], selectedRows: T[], onCleanSelected: () => void) => React.ReactNode;
|
|
378
|
+
cardConfig?: RHFCardConfig;
|
|
379
|
+
}
|
|
380
|
+
interface PaginationState {
|
|
381
|
+
pageIndex: number;
|
|
382
|
+
pageSize: number;
|
|
383
|
+
}
|
|
384
|
+
type DensityState = "small" | "middle" | "large" | undefined;
|
|
385
|
+
interface CustomTableState {
|
|
386
|
+
density: DensityState;
|
|
387
|
+
editedRowKey: React.Key[];
|
|
388
|
+
columnPinningVersion: number;
|
|
389
|
+
columnVisibilityVersion: number;
|
|
390
|
+
columnSizingVersion: number;
|
|
391
|
+
groupingVersion: number;
|
|
392
|
+
searchParams: Record<string, unknown>;
|
|
393
|
+
}
|
|
394
|
+
interface _CustomColumnMeta<T, J> {
|
|
395
|
+
filterVariant?: FilterVariantOptions | TableInputFieldTypes;
|
|
396
|
+
editable?: boolean;
|
|
397
|
+
valueType?: TableInputFieldTypes;
|
|
398
|
+
inputItemProps?: BaseInputProps | ((context: any) => BaseInputProps);
|
|
399
|
+
valueEnum?: ProFieldValueEnumType | any;
|
|
400
|
+
render?: (value: J, record: T, index: number) => React.ReactNode;
|
|
401
|
+
hidden?: boolean;
|
|
402
|
+
transform?: (value: any) => Record<string, unknown>;
|
|
403
|
+
align?: "left" | "center" | "right";
|
|
404
|
+
highlight?: boolean | "danger" | "info" | "warning" | "success" | {
|
|
405
|
+
backgroundColor?: string;
|
|
406
|
+
color?: string;
|
|
407
|
+
fontWeight?: number;
|
|
408
|
+
};
|
|
409
|
+
}
|
|
410
|
+
interface CustomColumnMeta<T, J> extends Omit<_CustomColumnMeta<T, J>, "render"> {
|
|
411
|
+
groupable?: boolean;
|
|
412
|
+
}
|
|
413
|
+
declare module "@tanstack/react-table" {
|
|
414
|
+
interface TableState extends CustomTableState {
|
|
415
|
+
}
|
|
416
|
+
interface ColumnMeta<TData extends RowData, TValue> extends CustomColumnMeta<TData, TValue> {
|
|
417
|
+
}
|
|
418
|
+
interface TableMeta<TData extends RowData> extends CustomTableMeta {
|
|
419
|
+
}
|
|
420
|
+
interface FilterFns {
|
|
421
|
+
ISODateFilter: FilterFn<unknown>;
|
|
422
|
+
BooleanFn: FilterFn<unknown>;
|
|
423
|
+
}
|
|
424
|
+
}
|
|
425
|
+
interface ListToolBarMenuItem {
|
|
426
|
+
key: React.Key;
|
|
427
|
+
label: React.ReactNode;
|
|
428
|
+
disabled?: boolean;
|
|
429
|
+
}
|
|
430
|
+
interface ListToolBarHeaderMenuProps {
|
|
431
|
+
type?: "dropdown" | "tab";
|
|
432
|
+
activeKey?: TabsProps["activeKey"];
|
|
433
|
+
defaultActiveKey?: TabsProps["defaultActiveKey"];
|
|
434
|
+
items?: TabsProps["items"];
|
|
435
|
+
onChange?: (activeKey?: React.Key) => void;
|
|
436
|
+
prefixCls?: string;
|
|
437
|
+
}
|
|
438
|
+
interface TanstackTableParams {
|
|
439
|
+
page?: any;
|
|
440
|
+
limit?: any;
|
|
441
|
+
cursor?: any;
|
|
442
|
+
grouping?: GroupingState;
|
|
443
|
+
columnFilters?: ColumnFiltersState;
|
|
444
|
+
sort?: SortingState;
|
|
445
|
+
global_search_text?: string;
|
|
446
|
+
visible_columns?: VisibilityState;
|
|
447
|
+
}
|
|
448
|
+
|
|
449
|
+
declare const NoobTanstackTable: <T>(props: TanstackTableProps<T> & {
|
|
450
|
+
ref?: ForwardedRef<TableRef>;
|
|
451
|
+
}) => JSX.Element;
|
|
452
|
+
|
|
453
|
+
declare const useTableStyles: () => antd_style.ReturnStyles<{
|
|
454
|
+
body: {
|
|
455
|
+
".ant-form-item": {
|
|
456
|
+
marginBottom: string;
|
|
457
|
+
};
|
|
458
|
+
};
|
|
459
|
+
dropDown: {
|
|
460
|
+
".ant-dropdown-menu": {
|
|
461
|
+
padding: number;
|
|
462
|
+
borderRadius: string;
|
|
463
|
+
"&:hover": {
|
|
464
|
+
backgroundColor: "white !important";
|
|
465
|
+
};
|
|
466
|
+
};
|
|
467
|
+
".ant-dropdown-menu-item": {
|
|
468
|
+
padding: string;
|
|
469
|
+
"&:hover": {
|
|
470
|
+
backgroundColor: "white !important";
|
|
471
|
+
};
|
|
472
|
+
};
|
|
473
|
+
};
|
|
474
|
+
tableHead: {
|
|
475
|
+
backgroundColor: any;
|
|
476
|
+
color: any;
|
|
477
|
+
textAlign: "left";
|
|
478
|
+
fontWeight: number;
|
|
479
|
+
margin: number;
|
|
480
|
+
maxWidth: string;
|
|
481
|
+
};
|
|
482
|
+
}>;
|
|
483
|
+
|
|
484
|
+
declare const FilterDropDown: ({ column, table, }: {
|
|
485
|
+
column: Column<any>;
|
|
486
|
+
table: Table<any>;
|
|
487
|
+
}) => react.JSX.Element | undefined;
|
|
488
|
+
interface ColumnDropDownProps<T> {
|
|
489
|
+
column: Table<T>;
|
|
490
|
+
}
|
|
491
|
+
declare const ColumnDropDown: <T>(table: ColumnDropDownProps<T>) => react.JSX.Element;
|
|
492
|
+
declare const SortableHeader: React.FC<{
|
|
493
|
+
header: Header<unknown, unknown>;
|
|
494
|
+
}>;
|
|
495
|
+
declare const EditableCell: React.FC<TableEditableCellProps>;
|
|
496
|
+
declare const SortableColumns: React.FC<{
|
|
497
|
+
children: React.ReactNode;
|
|
498
|
+
id: string | number;
|
|
499
|
+
disabled?: boolean;
|
|
500
|
+
}>;
|
|
501
|
+
interface CheckboxProps {
|
|
502
|
+
indeterminate: boolean;
|
|
503
|
+
className?: string;
|
|
504
|
+
checked: boolean;
|
|
505
|
+
}
|
|
506
|
+
declare const IndeterminateCheckbox: React.FC<CheckboxProps>;
|
|
507
|
+
declare const TanstackTablePagination: <T>({ tableInstance, table, }: {
|
|
508
|
+
table: Table<T>;
|
|
509
|
+
tableInstance: TableState;
|
|
510
|
+
}) => react.JSX.Element;
|
|
511
|
+
declare const TanstackTableCount: <T>({ table, loadedRowCount, }: {
|
|
512
|
+
table: Table<T>;
|
|
513
|
+
loadedRowCount: number;
|
|
514
|
+
}) => react.JSX.Element;
|
|
515
|
+
declare const TanstackTableEmpty: () => react.JSX.Element;
|
|
516
|
+
declare const TanstackToolbar: any;
|
|
517
|
+
declare const TanstackTableRowSelection: React.FC<{
|
|
518
|
+
table: Table<any>;
|
|
519
|
+
render?: React.ReactNode;
|
|
520
|
+
}>;
|
|
521
|
+
interface TanstackGlobalFilterProps {
|
|
522
|
+
table: Table<unknown>;
|
|
523
|
+
options?: OptionConfig["search"];
|
|
524
|
+
}
|
|
525
|
+
declare const TanstackGlobalFilter: react.ForwardRefExoticComponent<TanstackGlobalFilterProps & react.RefAttributes<TableRef | undefined>>;
|
|
526
|
+
declare const TanstackFilter: {
|
|
527
|
+
({ table }: {
|
|
528
|
+
table: Table<any>;
|
|
529
|
+
}): react.JSX.Element;
|
|
530
|
+
displayName: string;
|
|
531
|
+
};
|
|
532
|
+
declare const FilePreviewCell: React.FC<{
|
|
533
|
+
fileId: string;
|
|
534
|
+
filename: string;
|
|
535
|
+
}>;
|
|
536
|
+
|
|
537
|
+
declare const FILTER_PREFIX = "f.";
|
|
538
|
+
declare const SEARCH_KEY = "search";
|
|
539
|
+
declare const ARRAY_OPERATORS: Set<string>;
|
|
540
|
+
interface UrlFilterValue {
|
|
541
|
+
operator: string;
|
|
542
|
+
value: unknown;
|
|
543
|
+
}
|
|
544
|
+
interface NavigationSearchParams {
|
|
545
|
+
filters?: Record<string, UrlFilterValue>;
|
|
546
|
+
search?: string;
|
|
547
|
+
query?: Record<string, string>;
|
|
548
|
+
}
|
|
549
|
+
declare function parseUrlToFilters(searchParams: URLSearchParams): Record<string, UrlFilterValue>;
|
|
550
|
+
declare function filtersToUrlParams(filters: Record<string, UrlFilterValue>): Record<string, string>;
|
|
551
|
+
declare function buildSearchString(navSearchParams: NavigationSearchParams): string;
|
|
552
|
+
|
|
553
|
+
interface UseTableUrlSyncOptions {
|
|
554
|
+
enabled: boolean;
|
|
555
|
+
}
|
|
556
|
+
interface UseTableUrlSyncReturn {
|
|
557
|
+
params: Record<string, unknown>;
|
|
558
|
+
initialFilters: Record<string, UrlFilterValue>;
|
|
559
|
+
initialSearchParams: Record<string, unknown>;
|
|
560
|
+
initialGlobalSearch: string | undefined;
|
|
561
|
+
syncFiltersToUrl: (filters: Record<string, UrlFilterValue>) => void;
|
|
562
|
+
syncGlobalSearchToUrl: (search: string | undefined) => void;
|
|
563
|
+
clearUrlFilters: () => void;
|
|
564
|
+
}
|
|
565
|
+
declare function useTableUrlSync({ enabled, }: UseTableUrlSyncOptions): UseTableUrlSyncReturn;
|
|
566
|
+
|
|
567
|
+
type ComponentType = "VIEW" | "EDIT" | "ADD";
|
|
568
|
+
|
|
569
|
+
declare const useTanstackTable: <T>() => {
|
|
570
|
+
rowSelectionState: RowSelectionState;
|
|
571
|
+
setRowSelectionState: react.Dispatch<react.SetStateAction<RowSelectionState>>;
|
|
572
|
+
columnHelper: _tanstack_react_table.ColumnHelper<T>;
|
|
573
|
+
rowSelectionColumn: _tanstack_react_table.DisplayColumnDef<T, unknown>;
|
|
574
|
+
getFilterColumn: (threeDot: (value: T) => any, type?: ComponentType) => _tanstack_react_table.DisplayColumnDef<T, unknown> | undefined;
|
|
575
|
+
expandableColumn: _tanstack_react_table.DisplayColumnDef<T, unknown>;
|
|
576
|
+
selectedRowKeys: react.Key[];
|
|
577
|
+
setSelectedRowKeys: react.Dispatch<react.SetStateAction<react.Key[]>>;
|
|
578
|
+
indexColumn: _tanstack_react_table.DisplayColumnDef<T, unknown>;
|
|
579
|
+
};
|
|
580
|
+
|
|
581
|
+
declare const getHiddenColumns: (columns: any[]) => any;
|
|
582
|
+
declare const getRowIds: <T>(table: Table<T>) => string[];
|
|
583
|
+
declare const getSelectedRowModel: <T>(table: Table<T>) => T[];
|
|
584
|
+
declare const getCellSize: (type: DensityState) => "py-2" | "py-4" | "py-6";
|
|
585
|
+
declare const getBordered: (bordered: boolean) => "" | "border";
|
|
586
|
+
declare const handlePinColumn: (columnId: string, pinType: "left" | "right", table: Table<unknown>) => void;
|
|
587
|
+
declare const getExtraColumns: <T>({ rowSelection, rowExpandable, }: {
|
|
588
|
+
rowSelection?: unknown;
|
|
589
|
+
rowExpandable?: unknown;
|
|
590
|
+
}) => _tanstack_react_table.DisplayColumnDef<T, unknown>[];
|
|
591
|
+
declare const isIndeterminate: (selected: string[], allOptions: string[]) => boolean;
|
|
592
|
+
declare const isCheckAll: (selected: string[], allOptions: string[]) => boolean;
|
|
593
|
+
declare const getHeading: (type: ComponentType) => "View" | "Edit" | "Add";
|
|
594
|
+
|
|
595
|
+
declare const PAGINATION_PAGE_SIZE_OPTIONS: {
|
|
596
|
+
value: string;
|
|
597
|
+
label: string;
|
|
598
|
+
}[];
|
|
599
|
+
declare const defaultPinnedColumns: string[];
|
|
600
|
+
declare const OPTIONS_FOR_NUMERIC_QUANTITY: {
|
|
601
|
+
label: string;
|
|
602
|
+
value: string;
|
|
603
|
+
}[];
|
|
604
|
+
|
|
605
|
+
interface GroupByDropDownProps<T> {
|
|
606
|
+
table: Table<T>;
|
|
607
|
+
persistenceKey?: string;
|
|
608
|
+
}
|
|
609
|
+
declare const GroupByDropDown: <T>({ table, persistenceKey, }: GroupByDropDownProps<T>) => react.JSX.Element;
|
|
610
|
+
|
|
611
|
+
declare const useAppTheme: () => any;
|
|
612
|
+
|
|
613
|
+
export { ARRAY_OPERATORS, type BaseInputProps, ColumnDropDown, type ColumnState, type CustomColumnMeta, type CustomTable, type CustomTableMeta, type CustomTableOptions, type CustomTableState, DEFAULT_BACKEND_DATE_FORMAT, DEFAULT_DATE_FORMAT, DEFAULT_DATE_MONTH_FORMAT, DEFAULT_DATE_TIME_FORMAT, type DataProps, type DensityState, EButton, type EButtonProps, type EDividerProps, EDividerWithNoStyle, EDropdown, type EDropdownProps, EHeading, EIcon, type EIconProps, ELink, EParagraph, EPrimaryIcon, type EPrimaryIconProps, ETab, type ETabProps, EText, type Editable, EditableCell, EditableRow, FILTER_PREFIX, FilePreviewCell, FilterDropDown, FullColumnWIdth, type GetComponentProps, GroupByDropDown, type GroupSummaryEntry, type GroupSummaryResult, IndeterminateCheckbox, InternalTable, type InternalTableProps, type ListToolBarHeaderMenuProps, type ListToolBarMenuItem, MemoizedCell, MemoizedTableBody, type NavigationSearchParams, NoobTanstackTable, OPTIONS_FOR_NUMERIC_QUANTITY, type OmittedInternalTableProps, type OmittedTableProps, type OptionConfig, PAGINATION_PAGE_SIZE_OPTIONS, type PaginationState, type ParagraphTypographyProps, PreInputFormField, type PreInputFormFieldProps, ProAmount, ProDateField, ProDatePicker, ProDateRangePicker, ProSelect, type ProSelectProps, type RHFCardConfig, type RequestResponse, SEARCH_KEY, type SavedViewsOption, type ServerExportOption, SortableColumns, SortableHeader, TableBody, TableClearButton, type TableDeleteButtonProps, type TableEditableCellProps, TableInput, type TableInputFieldTypes, type TableInputProps, type TableRef, TanstackFilter, TanstackGlobalFilter, TanstackTableCount, TanstackTableEmpty, TanstackTablePagination, type TanstackTableParams, type TanstackTableProps, TanstackTableRowSelection, TanstackToolbar, type TanstackToolbarProps, type TextTypographyProps, type UrlFilterValue, VIEW_DATE_TIME_FORMAT, VirtualTableBody, type _CustomColumnMeta, buildSearchString, type dateFormat, defaultPinnedColumns, filtersToUrlParams, getBordered, getCellSize, getExtraColumns, getHeading, getHiddenColumns, getRowIds, getSelectedRowModel, handlePinColumn, isCheckAll, isIndeterminate, parseDateTime, parseUrlToFilters, useAppTheme, useFilePreview, useTableStyles, useTableUrlSync, useTanstackTable };
|