@ackplus/react-tanstack-data-table 1.0.19-beta-0.7 → 1.0.19-beta-0.8

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.
Files changed (125) hide show
  1. package/README.md +599 -0
  2. package/package.json +1 -1
  3. package/src/index.d.ts +19 -0
  4. package/src/index.js +31 -0
  5. package/src/lib/components/droupdown/menu-dropdown.d.ts +17 -0
  6. package/src/lib/components/droupdown/menu-dropdown.js +52 -0
  7. package/src/lib/components/filters/filter-value-input.d.ts +9 -0
  8. package/src/lib/components/filters/filter-value-input.js +58 -0
  9. package/src/lib/components/filters/index.d.ts +23 -0
  10. package/src/lib/components/filters/index.js +129 -0
  11. package/src/lib/components/headers/draggable-header.d.ts +12 -0
  12. package/src/lib/components/headers/draggable-header.js +212 -0
  13. package/src/lib/components/headers/index.d.ts +2 -0
  14. package/src/lib/components/headers/index.js +5 -0
  15. package/src/lib/components/headers/table-header.d.ts +10 -0
  16. package/src/lib/components/headers/table-header.js +48 -0
  17. package/src/lib/components/index.d.ts +7 -0
  18. package/src/lib/components/index.js +10 -0
  19. package/src/lib/components/pagination/data-table-pagination.d.ts +11 -0
  20. package/src/lib/components/pagination/data-table-pagination.js +25 -0
  21. package/src/lib/components/pagination/index.d.ts +1 -0
  22. package/src/lib/components/pagination/index.js +4 -0
  23. package/src/lib/components/rows/data-table-row.d.ts +13 -0
  24. package/src/lib/components/rows/data-table-row.js +31 -0
  25. package/src/lib/components/rows/empty-data-row.d.ts +6 -0
  26. package/src/lib/components/rows/empty-data-row.js +11 -0
  27. package/src/lib/components/rows/index.d.ts +3 -0
  28. package/src/lib/components/rows/index.js +6 -0
  29. package/src/lib/components/rows/loading-rows.d.ts +5 -0
  30. package/src/lib/components/rows/loading-rows.js +49 -0
  31. package/src/lib/components/table/data-table.d.ts +3 -0
  32. package/src/lib/components/table/data-table.js +492 -0
  33. package/src/lib/components/table/data-table.types.d.ts +114 -0
  34. package/src/lib/components/table/data-table.types.js +2 -0
  35. package/src/lib/components/table/index.d.ts +2 -0
  36. package/src/lib/components/table/index.js +5 -0
  37. package/src/lib/components/toolbar/bulk-actions-toolbar.d.ts +9 -0
  38. package/src/lib/components/toolbar/bulk-actions-toolbar.js +25 -0
  39. package/src/lib/components/toolbar/column-custom-filter-control.d.ts +1 -0
  40. package/src/lib/components/toolbar/column-custom-filter-control.js +137 -0
  41. package/src/lib/components/toolbar/column-pinning-control.d.ts +1 -0
  42. package/src/lib/components/toolbar/column-pinning-control.js +105 -0
  43. package/src/lib/components/toolbar/column-reset-control.d.ts +1 -0
  44. package/src/lib/components/toolbar/column-reset-control.js +16 -0
  45. package/src/lib/components/toolbar/column-visibility-control.d.ts +1 -0
  46. package/src/lib/components/toolbar/column-visibility-control.js +31 -0
  47. package/src/lib/components/toolbar/data-table-toolbar.d.ts +14 -0
  48. package/src/lib/components/toolbar/data-table-toolbar.js +26 -0
  49. package/src/lib/components/toolbar/index.d.ts +8 -0
  50. package/src/lib/components/toolbar/index.js +17 -0
  51. package/src/lib/components/toolbar/table-export-control.d.ts +25 -0
  52. package/src/lib/components/toolbar/table-export-control.js +93 -0
  53. package/src/lib/components/toolbar/table-search-control.d.ts +1 -0
  54. package/src/lib/components/toolbar/table-search-control.js +61 -0
  55. package/src/lib/components/toolbar/table-size-control.d.ts +1 -0
  56. package/src/lib/components/toolbar/table-size-control.js +36 -0
  57. package/src/lib/contexts/data-table-context.d.ts +43 -0
  58. package/src/lib/contexts/data-table-context.js +54 -0
  59. package/src/lib/examples/advanced-features-example.d.ts +1 -0
  60. package/src/lib/examples/advanced-features-example.js +264 -0
  61. package/src/lib/examples/bulk-actions-test.d.ts +1 -0
  62. package/src/lib/examples/bulk-actions-test.js +44 -0
  63. package/src/lib/examples/custom-column-filter-example.d.ts +1 -0
  64. package/src/lib/examples/custom-column-filter-example.js +60 -0
  65. package/src/lib/examples/index.d.ts +5 -0
  66. package/src/lib/examples/index.js +13 -0
  67. package/src/lib/examples/selection-test-example.d.ts +1 -0
  68. package/src/lib/examples/selection-test-example.js +101 -0
  69. package/src/lib/examples/simple-local-example.d.ts +1 -0
  70. package/src/lib/examples/simple-local-example.js +97 -0
  71. package/src/lib/features/custom-column-filter.feature.d.ts +45 -0
  72. package/src/lib/features/custom-column-filter.feature.js +247 -0
  73. package/src/lib/features/custom-selection.feature.d.ts +46 -0
  74. package/src/lib/features/custom-selection.feature.js +172 -0
  75. package/src/lib/features/index.d.ts +2 -0
  76. package/src/lib/features/index.js +8 -0
  77. package/src/lib/hooks/index.d.ts +1 -0
  78. package/src/lib/hooks/index.js +4 -0
  79. package/src/lib/hooks/use-data-table-api.d.ts +56 -0
  80. package/src/lib/hooks/use-data-table-api.js +616 -0
  81. package/src/lib/icons/add-icon.d.ts +2 -0
  82. package/src/lib/icons/add-icon.js +8 -0
  83. package/src/lib/icons/csv-icon.d.ts +2 -0
  84. package/src/lib/icons/csv-icon.js +8 -0
  85. package/src/lib/icons/delete-icon.d.ts +2 -0
  86. package/src/lib/icons/delete-icon.js +8 -0
  87. package/src/lib/icons/excel-icon.d.ts +2 -0
  88. package/src/lib/icons/excel-icon.js +8 -0
  89. package/src/lib/icons/index.d.ts +7 -0
  90. package/src/lib/icons/index.js +17 -0
  91. package/src/lib/icons/unpin-icon.d.ts +2 -0
  92. package/src/lib/icons/unpin-icon.js +8 -0
  93. package/src/lib/icons/view-comfortable-icon.d.ts +2 -0
  94. package/src/lib/icons/view-comfortable-icon.js +8 -0
  95. package/src/lib/icons/view-compact-icon.d.ts +2 -0
  96. package/src/lib/icons/view-compact-icon.js +8 -0
  97. package/src/lib/types/column.types.d.ts +29 -0
  98. package/src/lib/types/column.types.js +5 -0
  99. package/src/lib/types/data-table-api.d.ts +134 -0
  100. package/src/lib/types/data-table-api.js +2 -0
  101. package/src/lib/types/export.types.d.ts +99 -0
  102. package/src/lib/types/export.types.js +2 -0
  103. package/src/lib/types/index.d.ts +6 -0
  104. package/src/lib/types/index.js +8 -0
  105. package/src/lib/types/slots.types.d.ts +272 -0
  106. package/src/lib/types/slots.types.js +2 -0
  107. package/src/lib/types/table.types.d.ts +63 -0
  108. package/src/lib/types/table.types.js +2 -0
  109. package/src/lib/utils/column-helpers.d.ts +7 -0
  110. package/src/lib/utils/column-helpers.js +43 -0
  111. package/src/lib/utils/debounced-fetch.utils.d.ts +11 -0
  112. package/src/lib/utils/debounced-fetch.utils.js +49 -0
  113. package/src/lib/utils/export-utils.d.ts +30 -0
  114. package/src/lib/utils/export-utils.js +152 -0
  115. package/src/lib/utils/index.d.ts +7 -0
  116. package/src/lib/utils/index.js +10 -0
  117. package/src/lib/utils/slot-helpers.d.ts +9 -0
  118. package/src/lib/utils/slot-helpers.js +21 -0
  119. package/src/lib/utils/special-columns.utils.d.ts +6 -0
  120. package/src/lib/utils/special-columns.utils.js +52 -0
  121. package/src/lib/utils/styling-helpers.d.ts +36 -0
  122. package/src/lib/utils/styling-helpers.js +61 -0
  123. package/src/lib/utils/table-helpers.d.ts +9 -0
  124. package/src/lib/utils/table-helpers.js +57 -0
  125. package/tsconfig.tsbuildinfo +1 -0
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ExcelIcon = exports.CsvIcon = exports.ViewComfortableIcon = exports.ViewCompactIcon = exports.DeleteIcon = exports.AddIcon = exports.UnpinIcon = void 0;
4
+ var unpin_icon_1 = require("./unpin-icon");
5
+ Object.defineProperty(exports, "UnpinIcon", { enumerable: true, get: function () { return unpin_icon_1.UnpinIcon; } });
6
+ var add_icon_1 = require("./add-icon");
7
+ Object.defineProperty(exports, "AddIcon", { enumerable: true, get: function () { return add_icon_1.AddIcon; } });
8
+ var delete_icon_1 = require("./delete-icon");
9
+ Object.defineProperty(exports, "DeleteIcon", { enumerable: true, get: function () { return delete_icon_1.DeleteIcon; } });
10
+ var view_compact_icon_1 = require("./view-compact-icon");
11
+ Object.defineProperty(exports, "ViewCompactIcon", { enumerable: true, get: function () { return view_compact_icon_1.ViewCompactIcon; } });
12
+ var view_comfortable_icon_1 = require("./view-comfortable-icon");
13
+ Object.defineProperty(exports, "ViewComfortableIcon", { enumerable: true, get: function () { return view_comfortable_icon_1.ViewComfortableIcon; } });
14
+ var csv_icon_1 = require("./csv-icon");
15
+ Object.defineProperty(exports, "CsvIcon", { enumerable: true, get: function () { return csv_icon_1.CsvIcon; } });
16
+ var excel_icon_1 = require("./excel-icon");
17
+ Object.defineProperty(exports, "ExcelIcon", { enumerable: true, get: function () { return excel_icon_1.ExcelIcon; } });
@@ -0,0 +1,2 @@
1
+ import { SvgIconProps } from '@mui/material';
2
+ export declare function UnpinIcon(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.UnpinIcon = UnpinIcon;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const material_1 = require("@mui/material");
6
+ function UnpinIcon(props) {
7
+ return ((0, jsx_runtime_1.jsxs)(material_1.SvgIcon, Object.assign({}, props, { viewBox: "0 0 24 24", children: [(0, jsx_runtime_1.jsx)("path", { d: "M2 5.27L3.28 4 20 20.72 18.73 22l-3.41-3.41V22h-1.6v-6H8v-2l2-2V9.27L2 5.27zM16 12V4h1V2H7v2h1v3.73l8 8z", opacity: "0.7" }), (0, jsx_runtime_1.jsx)("path", { d: "M14.73 12L16 10.73V4h1V2H7v2h1v3.73l2.27 2.27z" })] })));
8
+ }
@@ -0,0 +1,2 @@
1
+ import { SvgIconProps } from '@mui/material';
2
+ export declare function ViewComfortableIcon(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ViewComfortableIcon = ViewComfortableIcon;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const material_1 = require("@mui/material");
6
+ function ViewComfortableIcon(props) {
7
+ return ((0, jsx_runtime_1.jsxs)(material_1.SvgIcon, Object.assign({}, props, { viewBox: "0 0 24 24", children: [(0, jsx_runtime_1.jsx)("rect", { x: "3", y: "3", width: "18", height: "3", fill: "currentColor", rx: "1" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "8", width: "18", height: "3", fill: "currentColor", rx: "1" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "13", width: "18", height: "3", fill: "currentColor", rx: "1" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "18", width: "18", height: "3", fill: "currentColor", rx: "1" })] })));
8
+ }
@@ -0,0 +1,2 @@
1
+ import { SvgIconProps } from '@mui/material';
2
+ export declare function ViewCompactIcon(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ViewCompactIcon = ViewCompactIcon;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const material_1 = require("@mui/material");
6
+ function ViewCompactIcon(props) {
7
+ return ((0, jsx_runtime_1.jsxs)(material_1.SvgIcon, Object.assign({}, props, { viewBox: "0 0 24 24", children: [(0, jsx_runtime_1.jsx)("rect", { x: "3", y: "4", width: "18", height: "2", fill: "currentColor" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "7", width: "18", height: "2", fill: "currentColor" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "10", width: "18", height: "2", fill: "currentColor" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "13", width: "18", height: "2", fill: "currentColor" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "16", width: "18", height: "2", fill: "currentColor" }), (0, jsx_runtime_1.jsx)("rect", { x: "3", y: "19", width: "18", height: "2", fill: "currentColor" })] })));
8
+ }
@@ -0,0 +1,29 @@
1
+ import { ColumnDef, RowData, Column } from '@tanstack/react-table';
2
+ import { ColumnFilterRule } from '../features';
3
+ export declare const DEFAULT_SELECTION_COLUMN_NAME = "_selection";
4
+ export declare const DEFAULT_EXPANDING_COLUMN_NAME = "_expanding";
5
+ declare module '@tanstack/table-core' {
6
+ interface ColumnDefBase<TData extends RowData, TValue> {
7
+ type?: 'boolean' | 'number' | 'date' | 'select' | 'text';
8
+ options?: {
9
+ label: string;
10
+ value: string;
11
+ }[];
12
+ align?: 'left' | 'center' | 'right';
13
+ filterable?: boolean;
14
+ hideInExport?: boolean;
15
+ editComponent?: React.ComponentType<{
16
+ value: any;
17
+ onChange: (value: any) => void;
18
+ filter: ColumnFilterRule;
19
+ column: Column<TData, TValue>;
20
+ }>;
21
+ filterComponent?: React.ComponentType<{
22
+ value: any;
23
+ onChange: (value: any) => void;
24
+ filter: ColumnFilterRule;
25
+ column: Column<TData, TValue>;
26
+ }>;
27
+ }
28
+ }
29
+ export type DataTableColumn<TData extends RowData, TValue = unknown> = ColumnDef<TData, TValue> & {};
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.DEFAULT_EXPANDING_COLUMN_NAME = exports.DEFAULT_SELECTION_COLUMN_NAME = void 0;
4
+ exports.DEFAULT_SELECTION_COLUMN_NAME = '_selection';
5
+ exports.DEFAULT_EXPANDING_COLUMN_NAME = '_expanding';
@@ -0,0 +1,134 @@
1
+ import { ColumnPinningState, SortingState, ColumnOrderState, TableState, Row } from '@tanstack/react-table';
2
+ import { CustomColumnFilterState } from './table.types';
3
+ import { SelectionState } from '../features/custom-selection.feature';
4
+ export interface DataTableApi<T = any> {
5
+ columnVisibility: {
6
+ showColumn: (columnId: string) => void;
7
+ hideColumn: (columnId: string) => void;
8
+ toggleColumn: (columnId: string) => void;
9
+ showAllColumns: () => void;
10
+ hideAllColumns: () => void;
11
+ resetColumnVisibility: () => void;
12
+ };
13
+ columnOrdering: {
14
+ setColumnOrder: (columnOrder: ColumnOrderState) => void;
15
+ moveColumn: (columnId: string, toIndex: number) => void;
16
+ resetColumnOrder: () => void;
17
+ };
18
+ columnPinning: {
19
+ pinColumnLeft: (columnId: string) => void;
20
+ pinColumnRight: (columnId: string) => void;
21
+ unpinColumn: (columnId: string) => void;
22
+ setPinning: (pinning: ColumnPinningState) => void;
23
+ resetColumnPinning: () => void;
24
+ };
25
+ columnResizing: {
26
+ resizeColumn: (columnId: string, width: number) => void;
27
+ autoSizeColumn: (columnId: string) => void;
28
+ autoSizeAllColumns: () => void;
29
+ resetColumnSizing: () => void;
30
+ };
31
+ filtering: {
32
+ setGlobalFilter: (filter: string) => void;
33
+ clearGlobalFilter: () => void;
34
+ setCustomColumnFilters: (filters: CustomColumnFilterState) => void;
35
+ addColumnFilter: (columnId: string, operator: string, value: any) => void;
36
+ removeColumnFilter: (filterId: string) => void;
37
+ clearAllFilters: () => void;
38
+ resetFilters: () => void;
39
+ };
40
+ sorting: {
41
+ setSorting: (sorting: SortingState) => void;
42
+ sortColumn: (columnId: string, direction: 'asc' | 'desc' | false) => void;
43
+ clearSorting: () => void;
44
+ resetSorting: () => void;
45
+ };
46
+ pagination: {
47
+ goToPage: (pageIndex: number) => void;
48
+ nextPage: () => void;
49
+ previousPage: () => void;
50
+ setPageSize: (pageSize: number) => void;
51
+ goToFirstPage: () => void;
52
+ goToLastPage: () => void;
53
+ };
54
+ selection: {
55
+ selectRow: (rowId: string) => void;
56
+ deselectRow: (rowId: string) => void;
57
+ toggleRowSelection: (rowId: string) => void;
58
+ selectAll: () => void;
59
+ deselectAll: () => void;
60
+ toggleSelectAll: () => void;
61
+ getSelectionState: () => SelectionState;
62
+ getSelectedCount: () => number;
63
+ getSelectedRows: () => Row<T>[];
64
+ isRowSelected: (rowId: string) => boolean;
65
+ };
66
+ data: {
67
+ refresh: () => void;
68
+ reload: () => void;
69
+ getAllData: () => T[];
70
+ getRowData: (rowId: string) => T | undefined;
71
+ getRowByIndex: (index: number) => T | undefined;
72
+ updateRow: (rowId: string, updates: Partial<T>) => void;
73
+ updateRowByIndex: (index: number, updates: Partial<T>) => void;
74
+ insertRow: (newRow: T, index?: number) => void;
75
+ deleteRow: (rowId: string) => void;
76
+ deleteRowByIndex: (index: number) => void;
77
+ deleteSelectedRows: () => void;
78
+ replaceAllData: (newData: T[]) => void;
79
+ updateMultipleRows: (updates: Array<{
80
+ rowId: string;
81
+ data: Partial<T>;
82
+ }>) => void;
83
+ insertMultipleRows: (newRows: T[], startIndex?: number) => void;
84
+ deleteMultipleRows: (rowIds: string[]) => void;
85
+ updateField: (rowId: string, fieldName: keyof T, value: any) => void;
86
+ updateFieldByIndex: (index: number, fieldName: keyof T, value: any) => void;
87
+ findRows: (predicate: (row: T) => boolean) => T[];
88
+ findRowIndex: (predicate: (row: T) => boolean) => number;
89
+ getDataCount: () => number;
90
+ getFilteredDataCount: () => number;
91
+ };
92
+ layout: {
93
+ resetLayout: () => void;
94
+ resetAll: () => void;
95
+ saveLayout: () => any;
96
+ restoreLayout: (layout: any) => void;
97
+ };
98
+ state: {
99
+ getTableState: () => any;
100
+ getCurrentFilters: () => CustomColumnFilterState;
101
+ getCurrentSorting: () => SortingState;
102
+ getCurrentPagination: () => {
103
+ pageIndex: number;
104
+ pageSize: number;
105
+ };
106
+ getCurrentSelection: () => string[];
107
+ };
108
+ export: {
109
+ exportCSV: (options?: {
110
+ filename?: string;
111
+ onlyVisibleColumns?: boolean;
112
+ onlySelectedRows?: boolean;
113
+ includeHeaders?: boolean;
114
+ }) => Promise<void>;
115
+ exportExcel: (options?: {
116
+ filename?: string;
117
+ onlyVisibleColumns?: boolean;
118
+ onlySelectedRows?: boolean;
119
+ includeHeaders?: boolean;
120
+ }) => Promise<void>;
121
+ exportServerData: (options: {
122
+ format: 'csv' | 'excel';
123
+ filename?: string;
124
+ fetchData: (filters?: Partial<TableState>) => Promise<{
125
+ data: T[];
126
+ total: number;
127
+ }>;
128
+ pageSize?: number;
129
+ includeHeaders?: boolean;
130
+ }) => Promise<void>;
131
+ isExporting: () => boolean;
132
+ cancelExport: () => void;
133
+ };
134
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,99 @@
1
+ import { TableState } from './table.types';
2
+ export interface ServerExportColumn<T = any> {
3
+ id: string;
4
+ header: string;
5
+ accessor: keyof T | string;
6
+ formatter?: (value: any, row: T) => string;
7
+ }
8
+ export interface ExportOptions {
9
+ filename?: string;
10
+ format: 'csv' | 'excel';
11
+ includeHeaders?: boolean;
12
+ onlyVisibleColumns?: boolean;
13
+ onlyFilteredData?: boolean;
14
+ chunkSize?: number;
15
+ onProgress?: (progress: ExportProgress) => void;
16
+ onComplete?: (result: ExportResult) => void;
17
+ onError?: (error: ExportError) => void;
18
+ signal?: AbortSignal;
19
+ }
20
+ export interface ExportProgress {
21
+ processedRows: number;
22
+ totalRows: number;
23
+ percentage: number;
24
+ currentChunk: number;
25
+ totalChunks: number;
26
+ estimatedTimeRemaining?: number;
27
+ }
28
+ export interface ExportResult {
29
+ success: boolean;
30
+ filename: string;
31
+ totalRows: number;
32
+ totalColumns: number;
33
+ processingTime: number;
34
+ fileSize?: number;
35
+ }
36
+ export interface ExportError {
37
+ message: string;
38
+ code: 'CANCELLED' | 'MEMORY_ERROR' | 'PROCESSING_ERROR' | 'UNKNOWN';
39
+ details?: any;
40
+ }
41
+ export interface ExportConfig {
42
+ enabled: boolean;
43
+ formats: ('csv' | 'excel')[];
44
+ filename?: string;
45
+ includeHeaders?: boolean;
46
+ onlyVisibleColumns?: boolean;
47
+ onlyFilteredData?: boolean;
48
+ chunkSize?: number;
49
+ enableProgressTracking?: boolean;
50
+ maxMemoryThreshold?: number;
51
+ }
52
+ export interface ExportState {
53
+ isExporting: boolean;
54
+ progress?: ExportProgress;
55
+ controller?: AbortController;
56
+ startTime?: number;
57
+ }
58
+ export interface ChunkProcessingConfig {
59
+ chunkSize: number;
60
+ delayBetweenChunks: number;
61
+ useWebWorker: boolean;
62
+ }
63
+ export interface PinnedColumnStyleOptions {
64
+ width?: number | string;
65
+ isPinned?: 'left' | 'right' | false;
66
+ pinnedPosition?: number;
67
+ pinnedRightPosition?: number;
68
+ zIndex?: number;
69
+ disableStickyHeader?: boolean;
70
+ isLastLeftPinnedColumn?: boolean;
71
+ isFirstRightPinnedColumn?: boolean;
72
+ }
73
+ export interface SimpleExportOptions {
74
+ filename?: string;
75
+ format: 'csv' | 'excel';
76
+ includeHeaders?: boolean;
77
+ onlyVisibleColumns?: boolean;
78
+ onlySelectedRows?: boolean;
79
+ }
80
+ export interface SelectionExportData {
81
+ selectAllMatching?: boolean;
82
+ excludedIds?: string[];
83
+ selectedIds?: string[];
84
+ hasSelection?: boolean;
85
+ }
86
+ export interface ServerExportOptions extends SimpleExportOptions {
87
+ fetchData: (filters?: Partial<TableState>, selection?: SelectionExportData) => Promise<{
88
+ data: any[];
89
+ total: number;
90
+ }>;
91
+ currentFilters?: any;
92
+ pageSize?: number;
93
+ selection?: SelectionExportData;
94
+ }
95
+ export interface ExportCallbacks {
96
+ onProgress?: (progress: ExportProgress) => void;
97
+ onComplete?: (result: ExportResult) => void;
98
+ onError?: (error: ExportError) => void;
99
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,6 @@
1
+ export * from './column.types';
2
+ export * from './table.types';
3
+ export * from './export.types';
4
+ export * from './data-table-api';
5
+ export * from './slots.types';
6
+ export type { DataTableApi } from './data-table-api';
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const tslib_1 = require("tslib");
4
+ tslib_1.__exportStar(require("./column.types"), exports);
5
+ tslib_1.__exportStar(require("./table.types"), exports);
6
+ tslib_1.__exportStar(require("./export.types"), exports);
7
+ tslib_1.__exportStar(require("./data-table-api"), exports);
8
+ tslib_1.__exportStar(require("./slots.types"), exports);
@@ -0,0 +1,272 @@
1
+ import { TableProps, TableContainerProps, BoxProps } from '@mui/material';
2
+ import { Table, Row, Column } from '@tanstack/react-table';
3
+ import { ComponentType, ReactNode } from 'react';
4
+ import { DataTableColumn, TableFilters, ExportProgress, ExportResult, ExportError, ServerExportColumn } from './index';
5
+ import { DataTableSize } from '../utils/table-helpers';
6
+ import { DataTablePaginationProps } from "../components/pagination";
7
+ export interface DataTableSlots<T = any> {
8
+ root?: ComponentType<DataTableSlotProps<T>['root']>;
9
+ tableContainer?: ComponentType<DataTableSlotProps<T>['tableContainer']>;
10
+ table?: ComponentType<DataTableSlotProps<T>['table']>;
11
+ toolbar?: ComponentType<DataTableSlotProps<T>['toolbar']>;
12
+ header?: ComponentType<DataTableSlotProps<T>['header']>;
13
+ headerRow?: ComponentType<DataTableSlotProps<T>['headerRow']>;
14
+ headerCell?: ComponentType<DataTableSlotProps<T>['headerCell']>;
15
+ sortIconAsc?: ComponentType<DataTableSlotProps<T>['sortIconAsc']>;
16
+ sortIconDesc?: ComponentType<DataTableSlotProps<T>['sortIconDesc']>;
17
+ body?: ComponentType<DataTableSlotProps<T>['body']>;
18
+ row?: ComponentType<DataTableSlotProps<T>['row']>;
19
+ cell?: ComponentType<DataTableSlotProps<T>['cell']>;
20
+ loadingRow?: ComponentType<DataTableSlotProps<T>['loadingRow']>;
21
+ emptyRow?: ComponentType<DataTableSlotProps<T>['emptyRow']>;
22
+ expandedRow?: ComponentType<DataTableSlotProps<T>['expandedRow']>;
23
+ footer?: ComponentType<DataTableSlotProps<T>['footer']>;
24
+ pagination?: ComponentType<DataTableSlotProps<T>['pagination']>;
25
+ searchInput?: ComponentType<DataTableSlotProps<T>['searchInput']>;
26
+ columnVisibilityControl?: ComponentType<DataTableSlotProps<T>['columnVisibilityControl']>;
27
+ columnCustomFilterControl?: ComponentType<DataTableSlotProps<T>['columnCustomFilterControl']>;
28
+ columnPinningControl?: ComponentType<DataTableSlotProps<T>['columnPinningControl']>;
29
+ exportButton?: ComponentType<DataTableSlotProps<T>['exportButton']>;
30
+ resetButton?: ComponentType<DataTableSlotProps<T>['resetButton']>;
31
+ tableSizeControl?: ComponentType<DataTableSlotProps<T>['tableSizeControl']>;
32
+ bulkActionsToolbar?: ComponentType<DataTableSlotProps<T>['bulkActionsToolbar']>;
33
+ searchIcon?: ComponentType<DataTableSlotProps<T>['searchIcon']>;
34
+ clearIcon?: ComponentType<DataTableSlotProps<T>['clearIcon']>;
35
+ exportIcon?: ComponentType<DataTableSlotProps<T>['exportIcon']>;
36
+ columnIcon?: ComponentType<DataTableSlotProps<T>['columnIcon']>;
37
+ resetIcon?: ComponentType<DataTableSlotProps<T>['resetIcon']>;
38
+ moreIcon?: ComponentType<DataTableSlotProps<T>['moreIcon']>;
39
+ filterIcon?: ComponentType<DataTableSlotProps<T>['filterIcon']>;
40
+ pinIcon?: ComponentType<DataTableSlotProps<T>['pinIcon']>;
41
+ unpinIcon?: ComponentType<DataTableSlotProps<T>['unpinIcon']>;
42
+ leftIcon?: ComponentType<DataTableSlotProps<T>['leftIcon']>;
43
+ rightIcon?: ComponentType<DataTableSlotProps<T>['rightIcon']>;
44
+ csvIcon?: ComponentType<DataTableSlotProps<T>['csvIcon']>;
45
+ excelIcon?: ComponentType<DataTableSlotProps<T>['excelIcon']>;
46
+ selectAllIcon?: ComponentType<DataTableSlotProps<T>['selectAllIcon']>;
47
+ deselectIcon?: ComponentType<DataTableSlotProps<T>['deselectIcon']>;
48
+ tableSizeIcon?: ComponentType<DataTableSlotProps<T>['tableSizeIcon']>;
49
+ tableSizeSmallIcon?: ComponentType<DataTableSlotProps<T>['tableSizeSmallIcon']>;
50
+ tableSizeMediumIcon?: ComponentType<DataTableSlotProps<T>['tableSizeMediumIcon']>;
51
+ checkboxSelection?: ComponentType<DataTableSlotProps<T>['checkboxSelection']>;
52
+ expandIcon?: ComponentType<DataTableSlotProps<T>['expandIcon']>;
53
+ collapseIcon?: ComponentType<DataTableSlotProps<T>['collapseIcon']>;
54
+ loadingSkeleton?: ComponentType<DataTableSlotProps<T>['loadingSkeleton']>;
55
+ noDataOverlay?: ComponentType<DataTableSlotProps<T>['noDataOverlay']>;
56
+ exportProgressDialog?: ComponentType<DataTableSlotProps<T>['exportProgressDialog']>;
57
+ }
58
+ export interface BaseSlotProps<T = any> {
59
+ table: Table<T>;
60
+ data: T[];
61
+ columns: DataTableColumn<T>[];
62
+ }
63
+ export interface DataTableSlotProps<T = any> {
64
+ root: BaseSlotProps<T> & BoxProps & {
65
+ children: ReactNode;
66
+ };
67
+ tableContainer: BaseSlotProps<T> & TableContainerProps & {
68
+ children: ReactNode;
69
+ enableStickyHeader?: boolean;
70
+ maxHeight?: string | number;
71
+ enableVirtualization?: boolean;
72
+ };
73
+ table: BaseSlotProps<T> & TableProps & {
74
+ children: ReactNode;
75
+ tableSize?: DataTableSize;
76
+ enableStickyHeader?: boolean;
77
+ fitToScreen?: boolean;
78
+ tableStyle?: React.CSSProperties;
79
+ };
80
+ toolbar: BaseSlotProps<T> & {
81
+ title?: string;
82
+ subtitle?: string;
83
+ enableGlobalFilter?: boolean;
84
+ enableColumnVisibility?: boolean;
85
+ enableColumnFilter?: boolean;
86
+ enableExport?: boolean;
87
+ enableReset?: boolean;
88
+ enableTableSizeControl?: boolean;
89
+ enableColumnPinning?: boolean;
90
+ extraFilter?: ReactNode;
91
+ serverExport?: {
92
+ fetchData: (page: number, pageSize: number, filters: TableFilters) => Promise<{
93
+ data: T[];
94
+ total: number;
95
+ }>;
96
+ columns: ServerExportColumn<T>[];
97
+ pageSize?: number;
98
+ };
99
+ currentFilters?: TableFilters;
100
+ onExportStart?: (format: 'csv' | 'excel', summary: {
101
+ mode: 'client' | 'server';
102
+ totalRows: number;
103
+ estimatedMemoryMB?: number;
104
+ }) => void;
105
+ onExportProgress?: (progress: ExportProgress) => void;
106
+ onExportComplete?: (result: ExportResult) => void;
107
+ onExportError?: (error: ExportError) => void;
108
+ onExportCancel?: () => void;
109
+ };
110
+ header: BaseSlotProps<T> & {
111
+ enableSorting?: boolean;
112
+ draggable?: boolean;
113
+ enableColumnResizing?: boolean;
114
+ enableStickyHeader?: boolean;
115
+ fitToScreen?: boolean;
116
+ onColumnReorder?: (draggedColumnId: string, targetColumnId: string) => void;
117
+ };
118
+ headerRow: BaseSlotProps<T> & {
119
+ headerGroups: any[];
120
+ };
121
+ headerCell: BaseSlotProps<T> & {
122
+ header: any;
123
+ column: Column<T>;
124
+ enableSorting?: boolean;
125
+ draggable?: boolean;
126
+ enableColumnResizing?: boolean;
127
+ onColumnReorder?: (draggedColumnId: string, targetColumnId: string) => void;
128
+ isPinned?: boolean | 'left' | 'right';
129
+ pinnedPosition?: number;
130
+ pinnedRightPosition?: number;
131
+ };
132
+ sortIconAsc: Record<string, any>;
133
+ sortIconDesc: Record<string, any>;
134
+ body: BaseSlotProps<T> & {
135
+ children: ReactNode;
136
+ rows: Row<T>[];
137
+ loading?: boolean;
138
+ emptyMessage?: string;
139
+ enableVirtualization?: boolean;
140
+ enablePagination?: boolean;
141
+ };
142
+ row: BaseSlotProps<T> & {
143
+ row: Row<T>;
144
+ index: number;
145
+ enableHover?: boolean;
146
+ enableStripes?: boolean;
147
+ isOdd?: boolean;
148
+ renderSubComponent?: (row: Row<T>) => ReactNode;
149
+ disableStickyHeader?: boolean;
150
+ };
151
+ cell: BaseSlotProps<T> & {
152
+ row: Row<T>;
153
+ cell: any;
154
+ column: Column<T>;
155
+ value: any;
156
+ isPinned?: boolean | 'left' | 'right';
157
+ pinnedPosition?: number;
158
+ pinnedRightPosition?: number;
159
+ alignment?: 'left' | 'center' | 'right';
160
+ };
161
+ loadingRow: BaseSlotProps<T> & {
162
+ rowCount: number;
163
+ colSpan: number;
164
+ };
165
+ emptyRow: BaseSlotProps<T> & {
166
+ colSpan: number;
167
+ message: string;
168
+ };
169
+ expandedRow: BaseSlotProps<T> & {
170
+ row: Row<T>;
171
+ colSpan: number;
172
+ children: ReactNode;
173
+ };
174
+ footer: BaseSlotProps<T> & {
175
+ children: ReactNode;
176
+ enableStickyFooter?: boolean;
177
+ };
178
+ pagination: BaseSlotProps<T> & DataTablePaginationProps;
179
+ searchInput: BaseSlotProps<T> & {
180
+ value: string;
181
+ onChange: (value: string) => void;
182
+ placeholder?: string;
183
+ autoFocus?: boolean;
184
+ };
185
+ columnsPanel: BaseSlotProps<T> & {
186
+ getTogglableColumns: (columns: DataTableColumn<T>[]) => DataTableColumn<T>[];
187
+ getPinnableColumns: (columns: DataTableColumn<T>[]) => DataTableColumn<T>[];
188
+ };
189
+ columnVisibilityControl: BaseSlotProps<T>;
190
+ columnCustomFilterControl: BaseSlotProps<T>;
191
+ columnPinningControl: BaseSlotProps<T>;
192
+ resetButton: BaseSlotProps<T>;
193
+ tableSizeControl: BaseSlotProps<T>;
194
+ bulkActionsToolbar: BaseSlotProps<T> & {
195
+ selectionState: any;
196
+ selectedRowCount: number;
197
+ bulkActions?: (selectionState: any) => ReactNode;
198
+ onBulkAction?: (action: string, selectionState: T[]) => void;
199
+ enableSelectAll?: boolean;
200
+ onSelectAll?: () => void;
201
+ onDeselectAll?: () => void;
202
+ };
203
+ exportButton: BaseSlotProps<T> & {
204
+ filename?: string;
205
+ dataMode?: 'client' | 'server';
206
+ serverExport?: {
207
+ fetchData: (page: number, pageSize: number, filters: TableFilters) => Promise<{
208
+ data: T[];
209
+ total: number;
210
+ }>;
211
+ columns: ServerExportColumn<T>[];
212
+ pageSize?: number;
213
+ };
214
+ currentFilters?: TableFilters;
215
+ onExportStart?: (format: 'csv' | 'excel', summary: {
216
+ mode: 'client' | 'server';
217
+ totalRows: number;
218
+ estimatedMemoryMB?: number;
219
+ }) => void;
220
+ onExportProgress?: (progress: ExportProgress) => void;
221
+ onExportComplete?: (result: ExportResult) => void;
222
+ onExportError?: (error: ExportError) => void;
223
+ onExportCancel?: () => void;
224
+ };
225
+ searchIcon: Record<string, any>;
226
+ clearIcon: Record<string, any>;
227
+ exportIcon: Record<string, any>;
228
+ columnIcon: Record<string, any>;
229
+ resetIcon: Record<string, any>;
230
+ moreIcon: Record<string, any>;
231
+ filterIcon: Record<string, any>;
232
+ pinIcon: Record<string, any>;
233
+ unpinIcon: Record<string, any>;
234
+ leftIcon: Record<string, any>;
235
+ rightIcon: Record<string, any>;
236
+ expandIcon: Record<string, any>;
237
+ collapseIcon: Record<string, any>;
238
+ csvIcon: Record<string, any>;
239
+ excelIcon: Record<string, any>;
240
+ selectAllIcon: Record<string, any>;
241
+ deselectIcon: Record<string, any>;
242
+ tableSizeIcon: Record<string, any>;
243
+ tableSizeSmallIcon: Record<string, any>;
244
+ tableSizeMediumIcon: Record<string, any>;
245
+ checkboxSelection: BaseSlotProps<T> & {
246
+ row?: Row<T>;
247
+ checked: boolean;
248
+ indeterminate?: boolean;
249
+ onChange: (checked: boolean) => void;
250
+ disabled?: boolean;
251
+ };
252
+ selectionColumn: DataTableColumn<T>;
253
+ expandColumn: DataTableColumn<T>;
254
+ loadingSkeleton: BaseSlotProps<T> & {
255
+ rows: number;
256
+ columns: number;
257
+ };
258
+ noDataOverlay: BaseSlotProps<T> & {
259
+ message: string;
260
+ };
261
+ exportProgressDialog: BaseSlotProps<T> & {
262
+ open: boolean;
263
+ progress: ExportProgress;
264
+ onCancel: () => void;
265
+ };
266
+ }
267
+ export interface DefaultSlots<T = any> extends DataTableSlots<T> {
268
+ }
269
+ export type PartialSlotProps<T = any> = {
270
+ [K in keyof DataTableSlotProps<T>]?: Partial<DataTableSlotProps<T>[K]>;
271
+ };
272
+ export type SlotComponentProps<TSlot extends keyof DataTableSlots<T>, T = any> = DataTableSlotProps<T>[TSlot];
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });