@expcat/tigercat-react 0.4.0 → 0.4.3
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/{chunk-PWZB45Z7.js → chunk-JQK354YN.js} +11 -9
- package/dist/{chunk-3577FW3I.mjs → chunk-KBTFBEPE.mjs} +95 -14
- package/dist/{chunk-ZGQOYCQT.mjs → chunk-LLHUBM6E.mjs} +1 -1
- package/dist/{chunk-IRH2ZVD3.js → chunk-LXX2ZDJN.js} +2 -2
- package/dist/chunk-PEGJ2KHC.js +273 -0
- package/dist/chunk-RCNTRSUA.mjs +271 -0
- package/dist/chunk-SHT4TU3T.mjs +26 -0
- package/dist/{chunk-OUAZM7NY.mjs → chunk-SMC2RV3V.mjs} +12 -10
- package/dist/{chunk-OESNOOOT.js → chunk-YWTZALG5.js} +8 -4
- package/dist/{chunk-ZTVATZB6.js → chunk-ZBVFM3GJ.js} +131 -46
- package/dist/components/ActivityFeed.js +4 -4
- package/dist/components/ActivityFeed.mjs +2 -2
- package/dist/components/DataTableWithToolbar.js +4 -4
- package/dist/components/DataTableWithToolbar.mjs +2 -2
- package/dist/components/InputNumber.d.mts +24 -0
- package/dist/components/InputNumber.d.ts +24 -0
- package/dist/components/InputNumber.js +10 -0
- package/dist/components/InputNumber.mjs +1 -0
- package/dist/components/Sidebar.js +2 -2
- package/dist/components/Sidebar.mjs +1 -1
- package/dist/components/SubMenu.js +2 -2
- package/dist/components/SubMenu.mjs +1 -1
- package/dist/components/Table.d.mts +5 -1
- package/dist/components/Table.d.ts +5 -1
- package/dist/components/Table.js +2 -2
- package/dist/components/Table.mjs +1 -1
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +45 -40
- package/dist/index.mjs +12 -11
- package/package.json +2 -2
- package/dist/chunk-RITTIFCJ.mjs +0 -22
- package/dist/{chunk-IOM7DWWQ.js → chunk-J3HKED4B.js} +1 -1
- package/dist/{chunk-FTY2W4L2.mjs → chunk-MTL2QUM3.mjs} +1 -1
|
@@ -1,9 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var React = require('react');
|
|
4
4
|
var tigercatCore = require('@expcat/tigercat-core');
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
|
|
7
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
|
+
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
10
|
+
|
|
7
11
|
// src/components/Table.tsx
|
|
8
12
|
var spinnerSvg = tigercatCore.getSpinnerSVG("spinner");
|
|
9
13
|
var SortIcon = ({ direction }) => {
|
|
@@ -24,6 +28,20 @@ var SortIcon = ({ direction }) => {
|
|
|
24
28
|
var LockIcon = ({ locked }) => {
|
|
25
29
|
return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: tigercatCore.icon24ViewBox, fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: locked ? tigercatCore.lockClosedIcon24PathD : tigercatCore.lockOpenIcon24PathD }) });
|
|
26
30
|
};
|
|
31
|
+
var ExpandIcon = ({ expanded }) => {
|
|
32
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
33
|
+
"svg",
|
|
34
|
+
{
|
|
35
|
+
className: tigercatCore.getExpandIconClasses(expanded),
|
|
36
|
+
width: "16",
|
|
37
|
+
height: "16",
|
|
38
|
+
viewBox: tigercatCore.icon16ViewBox,
|
|
39
|
+
fill: "currentColor",
|
|
40
|
+
"aria-hidden": "true",
|
|
41
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: tigercatCore.expandChevronIcon16PathD })
|
|
42
|
+
}
|
|
43
|
+
);
|
|
44
|
+
};
|
|
27
45
|
var LoadingSpinner = () => /* @__PURE__ */ jsxRuntime.jsx(
|
|
28
46
|
"svg",
|
|
29
47
|
{
|
|
@@ -61,6 +79,7 @@ function Table({
|
|
|
61
79
|
showTotal: true
|
|
62
80
|
},
|
|
63
81
|
rowSelection,
|
|
82
|
+
expandable,
|
|
64
83
|
rowKey = "id",
|
|
65
84
|
rowClassName,
|
|
66
85
|
stickyHeader = false,
|
|
@@ -72,6 +91,7 @@ function Table({
|
|
|
72
91
|
onSortChange,
|
|
73
92
|
onFilterChange,
|
|
74
93
|
onPageChange,
|
|
94
|
+
onExpandChange,
|
|
75
95
|
className,
|
|
76
96
|
...props
|
|
77
97
|
}) {
|
|
@@ -81,51 +101,59 @@ function Table({
|
|
|
81
101
|
const isCurrentPageControlled = paginationConfig?.current !== void 0;
|
|
82
102
|
const isPageSizeControlled = paginationConfig?.pageSize !== void 0;
|
|
83
103
|
const isSelectionControlled = rowSelection?.selectedRowKeys !== void 0 && Array.isArray(rowSelection.selectedRowKeys);
|
|
84
|
-
const
|
|
104
|
+
const isExpandControlled = expandable?.expandedRowKeys !== void 0 && Array.isArray(expandable.expandedRowKeys);
|
|
105
|
+
const [uncontrolledSortState, setUncontrolledSortState] = React.useState(
|
|
85
106
|
defaultSort ?? { key: null, direction: null }
|
|
86
107
|
);
|
|
87
|
-
const [uncontrolledFilterState, setUncontrolledFilterState] =
|
|
108
|
+
const [uncontrolledFilterState, setUncontrolledFilterState] = React.useState(
|
|
88
109
|
defaultFilters ?? {}
|
|
89
110
|
);
|
|
90
|
-
const [uncontrolledCurrentPage, setUncontrolledCurrentPage] =
|
|
111
|
+
const [uncontrolledCurrentPage, setUncontrolledCurrentPage] = React.useState(
|
|
91
112
|
() => paginationConfig?.defaultCurrent ?? paginationConfig?.current ?? 1
|
|
92
113
|
);
|
|
93
|
-
const [uncontrolledCurrentPageSize, setUncontrolledCurrentPageSize] =
|
|
114
|
+
const [uncontrolledCurrentPageSize, setUncontrolledCurrentPageSize] = React.useState(
|
|
94
115
|
() => paginationConfig?.defaultPageSize ?? paginationConfig?.pageSize ?? 10
|
|
95
116
|
);
|
|
96
|
-
const [uncontrolledSelectedRowKeys, setUncontrolledSelectedRowKeys] =
|
|
117
|
+
const [uncontrolledSelectedRowKeys, setUncontrolledSelectedRowKeys] = React.useState(rowSelection?.defaultSelectedRowKeys ?? rowSelection?.selectedRowKeys ?? []);
|
|
118
|
+
const [uncontrolledExpandedRowKeys, setUncontrolledExpandedRowKeys] = React.useState(expandable?.defaultExpandedRowKeys ?? expandable?.expandedRowKeys ?? []);
|
|
97
119
|
const sortState = isSortControlled ? sort : uncontrolledSortState;
|
|
98
120
|
const filterState = isFiltersControlled ? filters : uncontrolledFilterState;
|
|
99
121
|
const currentPage = isCurrentPageControlled ? paginationConfig.current : uncontrolledCurrentPage;
|
|
100
122
|
const currentPageSize = isPageSizeControlled ? paginationConfig.pageSize : uncontrolledCurrentPageSize;
|
|
101
123
|
const selectedRowKeys = isSelectionControlled ? rowSelection.selectedRowKeys : uncontrolledSelectedRowKeys;
|
|
102
|
-
|
|
124
|
+
const expandedRowKeys = isExpandControlled ? expandable.expandedRowKeys : uncontrolledExpandedRowKeys;
|
|
125
|
+
React.useEffect(() => {
|
|
103
126
|
if (isSortControlled && sort) {
|
|
104
127
|
setUncontrolledSortState(sort);
|
|
105
128
|
}
|
|
106
129
|
}, [isSortControlled, sort?.key, sort?.direction]);
|
|
107
|
-
|
|
130
|
+
React.useEffect(() => {
|
|
108
131
|
if (isFiltersControlled && filters) {
|
|
109
132
|
setUncontrolledFilterState(filters);
|
|
110
133
|
}
|
|
111
134
|
}, [isFiltersControlled, filters]);
|
|
112
|
-
|
|
135
|
+
React.useEffect(() => {
|
|
113
136
|
if (isCurrentPageControlled) {
|
|
114
137
|
setUncontrolledCurrentPage(paginationConfig.current);
|
|
115
138
|
}
|
|
116
139
|
}, [isCurrentPageControlled, paginationConfig?.current]);
|
|
117
|
-
|
|
140
|
+
React.useEffect(() => {
|
|
118
141
|
if (isPageSizeControlled) {
|
|
119
142
|
setUncontrolledCurrentPageSize(paginationConfig.pageSize);
|
|
120
143
|
}
|
|
121
144
|
}, [isPageSizeControlled, paginationConfig?.pageSize]);
|
|
122
|
-
|
|
145
|
+
React.useEffect(() => {
|
|
123
146
|
if (isSelectionControlled) {
|
|
124
147
|
setUncontrolledSelectedRowKeys(rowSelection?.selectedRowKeys ?? []);
|
|
125
148
|
}
|
|
126
149
|
}, [isSelectionControlled, rowSelection?.selectedRowKeys]);
|
|
127
|
-
|
|
128
|
-
|
|
150
|
+
React.useEffect(() => {
|
|
151
|
+
if (isExpandControlled) {
|
|
152
|
+
setUncontrolledExpandedRowKeys(expandable?.expandedRowKeys ?? []);
|
|
153
|
+
}
|
|
154
|
+
}, [isExpandControlled, expandable?.expandedRowKeys]);
|
|
155
|
+
const [fixedOverrides, setFixedOverrides] = React.useState({});
|
|
156
|
+
const displayColumns = React.useMemo(() => {
|
|
129
157
|
return columns.map((column) => {
|
|
130
158
|
const hasOverride = Object.prototype.hasOwnProperty.call(fixedOverrides, column.key);
|
|
131
159
|
return {
|
|
@@ -134,17 +162,23 @@ function Table({
|
|
|
134
162
|
};
|
|
135
163
|
});
|
|
136
164
|
}, [columns, fixedOverrides]);
|
|
137
|
-
const
|
|
165
|
+
const totalColumnCount = React.useMemo(() => {
|
|
166
|
+
let count = displayColumns.length;
|
|
167
|
+
if (rowSelection && rowSelection.showCheckbox !== false) count++;
|
|
168
|
+
if (expandable) count++;
|
|
169
|
+
return count;
|
|
170
|
+
}, [displayColumns.length, rowSelection, expandable]);
|
|
171
|
+
const columnByKey = React.useMemo(() => {
|
|
138
172
|
const map = {};
|
|
139
173
|
for (const column of displayColumns) {
|
|
140
174
|
map[column.key] = column;
|
|
141
175
|
}
|
|
142
176
|
return map;
|
|
143
177
|
}, [displayColumns]);
|
|
144
|
-
const fixedColumnsInfo =
|
|
178
|
+
const fixedColumnsInfo = React.useMemo(() => {
|
|
145
179
|
return tigercatCore.getFixedColumnOffsets(displayColumns);
|
|
146
180
|
}, [displayColumns]);
|
|
147
|
-
const toggleColumnLock =
|
|
181
|
+
const toggleColumnLock = React.useCallback(
|
|
148
182
|
(columnKey) => {
|
|
149
183
|
setFixedOverrides((prev) => {
|
|
150
184
|
const original = columns.find((c) => c.key === columnKey)?.fixed;
|
|
@@ -158,7 +192,7 @@ function Table({
|
|
|
158
192
|
},
|
|
159
193
|
[columns]
|
|
160
194
|
);
|
|
161
|
-
const processedData =
|
|
195
|
+
const processedData = React.useMemo(() => {
|
|
162
196
|
let data = dataSource;
|
|
163
197
|
data = tigercatCore.filterData(data, filterState);
|
|
164
198
|
if (sortState.key && sortState.direction) {
|
|
@@ -167,28 +201,32 @@ function Table({
|
|
|
167
201
|
}
|
|
168
202
|
return data;
|
|
169
203
|
}, [dataSource, filterState, sortState, columnByKey]);
|
|
170
|
-
const paginatedData =
|
|
204
|
+
const paginatedData = React.useMemo(() => {
|
|
171
205
|
if (pagination === false) {
|
|
172
206
|
return processedData;
|
|
173
207
|
}
|
|
174
208
|
return tigercatCore.paginateData(processedData, currentPage, currentPageSize);
|
|
175
209
|
}, [processedData, currentPage, currentPageSize, pagination]);
|
|
176
|
-
const pageRowKeys =
|
|
210
|
+
const pageRowKeys = React.useMemo(
|
|
177
211
|
() => paginatedData.map((record, index) => tigercatCore.getRowKey(record, rowKey, index)),
|
|
178
212
|
[paginatedData, rowKey]
|
|
179
213
|
);
|
|
180
|
-
const selectedRowKeySet =
|
|
214
|
+
const selectedRowKeySet = React.useMemo(
|
|
181
215
|
() => new Set(selectedRowKeys),
|
|
182
216
|
[selectedRowKeys]
|
|
183
217
|
);
|
|
184
|
-
const
|
|
218
|
+
const expandedRowKeySet = React.useMemo(
|
|
219
|
+
() => new Set(expandedRowKeys),
|
|
220
|
+
[expandedRowKeys]
|
|
221
|
+
);
|
|
222
|
+
const paginationInfo = React.useMemo(() => {
|
|
185
223
|
if (pagination === false) {
|
|
186
224
|
return null;
|
|
187
225
|
}
|
|
188
226
|
const total = processedData.length;
|
|
189
227
|
return tigercatCore.calculatePagination(total, currentPage, currentPageSize);
|
|
190
228
|
}, [processedData.length, currentPage, currentPageSize, pagination]);
|
|
191
|
-
const handleSort =
|
|
229
|
+
const handleSort = React.useCallback(
|
|
192
230
|
(columnKey) => {
|
|
193
231
|
const column = columnByKey[columnKey];
|
|
194
232
|
if (!column || !column.sortable) {
|
|
@@ -231,7 +269,7 @@ function Table({
|
|
|
231
269
|
onChange
|
|
232
270
|
]
|
|
233
271
|
);
|
|
234
|
-
const handleFilter =
|
|
272
|
+
const handleFilter = React.useCallback(
|
|
235
273
|
(columnKey, value) => {
|
|
236
274
|
const newFilterState = {
|
|
237
275
|
...filterState,
|
|
@@ -261,7 +299,7 @@ function Table({
|
|
|
261
299
|
onChange
|
|
262
300
|
]
|
|
263
301
|
);
|
|
264
|
-
const handlePageChange =
|
|
302
|
+
const handlePageChange = React.useCallback(
|
|
265
303
|
(page) => {
|
|
266
304
|
setUncontrolledCurrentPage(page);
|
|
267
305
|
onPageChange?.({ current: page, pageSize: currentPageSize });
|
|
@@ -276,7 +314,7 @@ function Table({
|
|
|
276
314
|
},
|
|
277
315
|
[currentPageSize, sortState, filterState, onPageChange, onChange]
|
|
278
316
|
);
|
|
279
|
-
const handlePageSizeChange =
|
|
317
|
+
const handlePageSizeChange = React.useCallback(
|
|
280
318
|
(pageSize) => {
|
|
281
319
|
setUncontrolledCurrentPageSize(pageSize);
|
|
282
320
|
setUncontrolledCurrentPage(1);
|
|
@@ -292,13 +330,31 @@ function Table({
|
|
|
292
330
|
},
|
|
293
331
|
[sortState, filterState, onPageChange, onChange]
|
|
294
332
|
);
|
|
295
|
-
const
|
|
333
|
+
const handleToggleExpand = React.useCallback(
|
|
334
|
+
(key, record) => {
|
|
335
|
+
const isExpanded = expandedRowKeySet.has(key);
|
|
336
|
+
const newKeys = isExpanded ? expandedRowKeys.filter((k) => k !== key) : [...expandedRowKeys, key];
|
|
337
|
+
if (!isExpandControlled) {
|
|
338
|
+
setUncontrolledExpandedRowKeys(newKeys);
|
|
339
|
+
}
|
|
340
|
+
onExpandChange?.(newKeys, record, !isExpanded);
|
|
341
|
+
},
|
|
342
|
+
[expandedRowKeySet, expandedRowKeys, isExpandControlled, onExpandChange]
|
|
343
|
+
);
|
|
344
|
+
const handleRowClick = React.useCallback(
|
|
296
345
|
(record, index) => {
|
|
297
346
|
onRowClick?.(record, index);
|
|
347
|
+
if (expandable?.expandRowByClick) {
|
|
348
|
+
const key = tigercatCore.getRowKey(record, rowKey, index);
|
|
349
|
+
const isExpandableRow = expandable?.rowExpandable ? expandable.rowExpandable(record) : true;
|
|
350
|
+
if (isExpandableRow) {
|
|
351
|
+
handleToggleExpand(key, record);
|
|
352
|
+
}
|
|
353
|
+
}
|
|
298
354
|
},
|
|
299
|
-
[onRowClick]
|
|
355
|
+
[onRowClick, expandable, rowKey, handleToggleExpand]
|
|
300
356
|
);
|
|
301
|
-
const handleSelectRow =
|
|
357
|
+
const handleSelectRow = React.useCallback(
|
|
302
358
|
(key, checked) => {
|
|
303
359
|
let newKeys;
|
|
304
360
|
if (rowSelection?.type === "radio") {
|
|
@@ -317,7 +373,7 @@ function Table({
|
|
|
317
373
|
},
|
|
318
374
|
[rowSelection, selectedRowKeys, isSelectionControlled, onSelectionChange]
|
|
319
375
|
);
|
|
320
|
-
const handleSelectAll =
|
|
376
|
+
const handleSelectAll = React.useCallback(
|
|
321
377
|
(checked) => {
|
|
322
378
|
if (checked) {
|
|
323
379
|
const newKeys = pageRowKeys;
|
|
@@ -334,17 +390,20 @@ function Table({
|
|
|
334
390
|
},
|
|
335
391
|
[pageRowKeys, isSelectionControlled, onSelectionChange]
|
|
336
392
|
);
|
|
337
|
-
const allSelected =
|
|
393
|
+
const allSelected = React.useMemo(() => {
|
|
338
394
|
if (pageRowKeys.length === 0) {
|
|
339
395
|
return false;
|
|
340
396
|
}
|
|
341
397
|
return pageRowKeys.every((key) => selectedRowKeySet.has(key));
|
|
342
398
|
}, [pageRowKeys, selectedRowKeySet]);
|
|
343
|
-
const someSelected =
|
|
399
|
+
const someSelected = React.useMemo(() => {
|
|
344
400
|
return selectedRowKeys.length > 0 && !allSelected;
|
|
345
401
|
}, [selectedRowKeys.length, allSelected]);
|
|
346
|
-
const renderTableHeader =
|
|
402
|
+
const renderTableHeader = React.useCallback(() => {
|
|
403
|
+
const expandHeaderTh = expandable ? /* @__PURE__ */ jsxRuntime.jsx("th", { className: tigercatCore.getExpandIconCellClasses(size), "aria-label": "Expand" }) : null;
|
|
404
|
+
const expandAtStart = expandable?.expandIconPosition !== "end";
|
|
347
405
|
return /* @__PURE__ */ jsxRuntime.jsx("thead", { className: tigercatCore.getTableHeaderClasses(stickyHeader), children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
|
|
406
|
+
expandAtStart && expandHeaderTh,
|
|
348
407
|
rowSelection && rowSelection.showCheckbox !== false && rowSelection.type !== "radio" && /* @__PURE__ */ jsxRuntime.jsx("th", { className: tigercatCore.getCheckboxCellClasses(size), children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
349
408
|
"input",
|
|
350
409
|
{
|
|
@@ -437,7 +496,8 @@ function Table({
|
|
|
437
496
|
},
|
|
438
497
|
column.key
|
|
439
498
|
);
|
|
440
|
-
})
|
|
499
|
+
}),
|
|
500
|
+
!expandAtStart && expandHeaderTh
|
|
441
501
|
] }) });
|
|
442
502
|
}, [
|
|
443
503
|
displayColumns,
|
|
@@ -445,6 +505,7 @@ function Table({
|
|
|
445
505
|
stickyHeader,
|
|
446
506
|
sortState,
|
|
447
507
|
rowSelection,
|
|
508
|
+
expandable,
|
|
448
509
|
allSelected,
|
|
449
510
|
someSelected,
|
|
450
511
|
handleSort,
|
|
@@ -454,25 +515,35 @@ function Table({
|
|
|
454
515
|
toggleColumnLock,
|
|
455
516
|
fixedColumnsInfo
|
|
456
517
|
]);
|
|
457
|
-
const renderTableBody =
|
|
518
|
+
const renderTableBody = React.useCallback(() => {
|
|
458
519
|
if (loading) {
|
|
459
520
|
return null;
|
|
460
521
|
}
|
|
461
522
|
if (paginatedData.length === 0) {
|
|
462
|
-
return /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
463
|
-
"td",
|
|
464
|
-
{
|
|
465
|
-
colSpan: displayColumns.length + (rowSelection ? 1 : 0),
|
|
466
|
-
className: tigercatCore.tableEmptyStateClasses,
|
|
467
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("div", { role: "status", "aria-live": "polite", children: emptyText })
|
|
468
|
-
}
|
|
469
|
-
) }) });
|
|
523
|
+
return /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: totalColumnCount, className: tigercatCore.tableEmptyStateClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { role: "status", "aria-live": "polite", children: emptyText }) }) }) });
|
|
470
524
|
}
|
|
471
525
|
return /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: paginatedData.map((record, index) => {
|
|
472
526
|
const key = pageRowKeys[index];
|
|
473
527
|
const isSelected = selectedRowKeySet.has(key);
|
|
528
|
+
const isExpanded = expandedRowKeySet.has(key);
|
|
529
|
+
const isRowExpandable = expandable ? expandable.rowExpandable ? expandable.rowExpandable(record) : true : false;
|
|
474
530
|
const rowClass = typeof rowClassName === "function" ? rowClassName(record, index) : rowClassName;
|
|
475
|
-
|
|
531
|
+
const expandToggleCell = expandable ? /* @__PURE__ */ jsxRuntime.jsx("td", { className: tigercatCore.getExpandIconCellClasses(size), children: isRowExpandable && /* @__PURE__ */ jsxRuntime.jsx(
|
|
532
|
+
"button",
|
|
533
|
+
{
|
|
534
|
+
type: "button",
|
|
535
|
+
className: "inline-flex items-center justify-center",
|
|
536
|
+
"aria-label": isExpanded ? "Collapse row" : "Expand row",
|
|
537
|
+
"aria-expanded": isExpanded,
|
|
538
|
+
onClick: (e) => {
|
|
539
|
+
e.stopPropagation();
|
|
540
|
+
handleToggleExpand(key, record);
|
|
541
|
+
},
|
|
542
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(ExpandIcon, { expanded: isExpanded })
|
|
543
|
+
}
|
|
544
|
+
) }) : null;
|
|
545
|
+
const expandAtStart = expandable?.expandIconPosition !== "end";
|
|
546
|
+
const rowNode = /* @__PURE__ */ jsxRuntime.jsxs(
|
|
476
547
|
"tr",
|
|
477
548
|
{
|
|
478
549
|
className: tigercatCore.classNames(
|
|
@@ -481,6 +552,7 @@ function Table({
|
|
|
481
552
|
),
|
|
482
553
|
onClick: () => handleRowClick(record, index),
|
|
483
554
|
children: [
|
|
555
|
+
expandAtStart && expandToggleCell,
|
|
484
556
|
rowSelection && rowSelection.showCheckbox !== false && /* @__PURE__ */ jsxRuntime.jsx("td", { className: tigercatCore.getCheckboxCellClasses(size), children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
485
557
|
"input",
|
|
486
558
|
{
|
|
@@ -527,29 +599,42 @@ function Table({
|
|
|
527
599
|
},
|
|
528
600
|
column.key
|
|
529
601
|
);
|
|
530
|
-
})
|
|
602
|
+
}),
|
|
603
|
+
!expandAtStart && expandToggleCell
|
|
531
604
|
]
|
|
532
605
|
},
|
|
533
606
|
key
|
|
534
607
|
);
|
|
608
|
+
if (expandable && isExpanded && isRowExpandable) {
|
|
609
|
+
const expandedContent = expandable.expandedRowRender ? expandable.expandedRowRender(record, index) : null;
|
|
610
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(React__default.default.Fragment, { children: [
|
|
611
|
+
rowNode,
|
|
612
|
+
/* @__PURE__ */ jsxRuntime.jsx("tr", { className: tigercatCore.getExpandedRowClasses(), children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: totalColumnCount, className: tigercatCore.getExpandedRowContentClasses(size), children: expandedContent }) }, `${key}-expanded`)
|
|
613
|
+
] }, key);
|
|
614
|
+
}
|
|
615
|
+
return rowNode;
|
|
535
616
|
}) });
|
|
536
617
|
}, [
|
|
537
618
|
loading,
|
|
538
619
|
paginatedData,
|
|
539
620
|
displayColumns,
|
|
540
621
|
rowSelection,
|
|
622
|
+
expandable,
|
|
541
623
|
emptyText,
|
|
542
624
|
pageRowKeys,
|
|
543
625
|
selectedRowKeySet,
|
|
626
|
+
expandedRowKeySet,
|
|
627
|
+
totalColumnCount,
|
|
544
628
|
rowClassName,
|
|
545
629
|
hoverable,
|
|
546
630
|
striped,
|
|
547
631
|
size,
|
|
548
632
|
handleRowClick,
|
|
549
633
|
handleSelectRow,
|
|
634
|
+
handleToggleExpand,
|
|
550
635
|
fixedColumnsInfo
|
|
551
636
|
]);
|
|
552
|
-
const renderPagination =
|
|
637
|
+
const renderPagination = React.useCallback(() => {
|
|
553
638
|
if (pagination === false || !paginationInfo) {
|
|
554
639
|
return null;
|
|
555
640
|
}
|
|
@@ -608,7 +693,7 @@ function Table({
|
|
|
608
693
|
handlePageChange,
|
|
609
694
|
handlePageSizeChange
|
|
610
695
|
]);
|
|
611
|
-
const wrapperStyle =
|
|
696
|
+
const wrapperStyle = React.useMemo(
|
|
612
697
|
() => maxHeight ? {
|
|
613
698
|
maxHeight: typeof maxHeight === "number" ? `${maxHeight}px` : maxHeight
|
|
614
699
|
} : void 0,
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var chunkJ3HKED4B_js = require('../chunk-J3HKED4B.js');
|
|
6
6
|
require('../chunk-PR3PQUKM.js');
|
|
7
|
-
require('../chunk-2GKTVAAB.js');
|
|
8
7
|
require('../chunk-QYYAXM5F.js');
|
|
8
|
+
require('../chunk-2GKTVAAB.js');
|
|
9
9
|
require('../chunk-VCULFIZ5.js');
|
|
10
10
|
require('../chunk-I5TCE5E7.js');
|
|
11
11
|
require('../chunk-SSQOCZ6O.js');
|
|
@@ -15,9 +15,9 @@ require('../chunk-CI2WHAT2.js');
|
|
|
15
15
|
|
|
16
16
|
Object.defineProperty(exports, "ActivityFeed", {
|
|
17
17
|
enumerable: true,
|
|
18
|
-
get: function () { return
|
|
18
|
+
get: function () { return chunkJ3HKED4B_js.ActivityFeed; }
|
|
19
19
|
});
|
|
20
20
|
Object.defineProperty(exports, "default", {
|
|
21
21
|
enumerable: true,
|
|
22
|
-
get: function () { return
|
|
22
|
+
get: function () { return chunkJ3HKED4B_js.ActivityFeed_default; }
|
|
23
23
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export { ActivityFeed, ActivityFeed_default as default } from '../chunk-
|
|
1
|
+
export { ActivityFeed, ActivityFeed_default as default } from '../chunk-MTL2QUM3.mjs';
|
|
2
2
|
import '../chunk-JVTAKNRO.mjs';
|
|
3
|
-
import '../chunk-AVUXDQYO.mjs';
|
|
4
3
|
import '../chunk-XZVQ3PJS.mjs';
|
|
4
|
+
import '../chunk-AVUXDQYO.mjs';
|
|
5
5
|
import '../chunk-TGKNEMD4.mjs';
|
|
6
6
|
import '../chunk-LIV33O73.mjs';
|
|
7
7
|
import '../chunk-3M2IG6IN.mjs';
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
6
|
-
require('../chunk-
|
|
5
|
+
var chunkLXX2ZDJN_js = require('../chunk-LXX2ZDJN.js');
|
|
6
|
+
require('../chunk-ZBVFM3GJ.js');
|
|
7
7
|
require('../chunk-TDRINUMH.js');
|
|
8
8
|
require('../chunk-3GW3UAKB.js');
|
|
9
9
|
require('../chunk-OYCMGKQ7.js');
|
|
@@ -13,9 +13,9 @@ require('../chunk-F24IF2QL.js');
|
|
|
13
13
|
|
|
14
14
|
Object.defineProperty(exports, "DataTableWithToolbar", {
|
|
15
15
|
enumerable: true,
|
|
16
|
-
get: function () { return
|
|
16
|
+
get: function () { return chunkLXX2ZDJN_js.DataTableWithToolbar; }
|
|
17
17
|
});
|
|
18
18
|
Object.defineProperty(exports, "default", {
|
|
19
19
|
enumerable: true,
|
|
20
|
-
get: function () { return
|
|
20
|
+
get: function () { return chunkLXX2ZDJN_js.DataTableWithToolbar_default; }
|
|
21
21
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { DataTableWithToolbar, DataTableWithToolbar_default as default } from '../chunk-
|
|
2
|
-
import '../chunk-
|
|
1
|
+
export { DataTableWithToolbar, DataTableWithToolbar_default as default } from '../chunk-LLHUBM6E.mjs';
|
|
2
|
+
import '../chunk-KBTFBEPE.mjs';
|
|
3
3
|
import '../chunk-MDZDPGRK.mjs';
|
|
4
4
|
import '../chunk-NZLOLMT2.mjs';
|
|
5
5
|
import '../chunk-RPTLVIBF.mjs';
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { InputNumberProps as InputNumberProps$1 } from '@expcat/tigercat-core';
|
|
3
|
+
|
|
4
|
+
interface InputNumberProps extends InputNumberProps$1 {
|
|
5
|
+
/**
|
|
6
|
+
* Change handler (called with committed value)
|
|
7
|
+
*/
|
|
8
|
+
onChange?: (value: number | null) => void;
|
|
9
|
+
/**
|
|
10
|
+
* Focus handler
|
|
11
|
+
*/
|
|
12
|
+
onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
|
|
13
|
+
/**
|
|
14
|
+
* Blur handler
|
|
15
|
+
*/
|
|
16
|
+
onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
|
|
17
|
+
/**
|
|
18
|
+
* Additional CSS classes
|
|
19
|
+
*/
|
|
20
|
+
className?: string;
|
|
21
|
+
}
|
|
22
|
+
declare const InputNumber: React.FC<InputNumberProps>;
|
|
23
|
+
|
|
24
|
+
export { InputNumber, type InputNumberProps };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { InputNumberProps as InputNumberProps$1 } from '@expcat/tigercat-core';
|
|
3
|
+
|
|
4
|
+
interface InputNumberProps extends InputNumberProps$1 {
|
|
5
|
+
/**
|
|
6
|
+
* Change handler (called with committed value)
|
|
7
|
+
*/
|
|
8
|
+
onChange?: (value: number | null) => void;
|
|
9
|
+
/**
|
|
10
|
+
* Focus handler
|
|
11
|
+
*/
|
|
12
|
+
onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
|
|
13
|
+
/**
|
|
14
|
+
* Blur handler
|
|
15
|
+
*/
|
|
16
|
+
onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
|
|
17
|
+
/**
|
|
18
|
+
* Additional CSS classes
|
|
19
|
+
*/
|
|
20
|
+
className?: string;
|
|
21
|
+
}
|
|
22
|
+
declare const InputNumber: React.FC<InputNumberProps>;
|
|
23
|
+
|
|
24
|
+
export { InputNumber, type InputNumberProps };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { InputNumber } from '../chunk-RCNTRSUA.mjs';
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkYWTZALG5_js = require('../chunk-YWTZALG5.js');
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
Object.defineProperty(exports, "Sidebar", {
|
|
8
8
|
enumerable: true,
|
|
9
|
-
get: function () { return
|
|
9
|
+
get: function () { return chunkYWTZALG5_js.Sidebar; }
|
|
10
10
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { Sidebar } from '../chunk-
|
|
1
|
+
export { Sidebar } from '../chunk-SHT4TU3T.mjs';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkJQK354YN_js = require('../chunk-JQK354YN.js');
|
|
4
4
|
require('../chunk-GJEWBALW.js');
|
|
5
5
|
require('../chunk-A3PYG3D6.js');
|
|
6
6
|
require('../chunk-IBYIPXIO.js');
|
|
@@ -9,5 +9,5 @@ require('../chunk-IBYIPXIO.js');
|
|
|
9
9
|
|
|
10
10
|
Object.defineProperty(exports, "SubMenu", {
|
|
11
11
|
enumerable: true,
|
|
12
|
-
get: function () { return
|
|
12
|
+
get: function () { return chunkJQK354YN_js.SubMenu; }
|
|
13
13
|
});
|
|
@@ -36,11 +36,15 @@ interface TableProps<T = Record<string, unknown>> extends TableProps$1<T> {
|
|
|
36
36
|
current: number;
|
|
37
37
|
pageSize: number;
|
|
38
38
|
}) => void;
|
|
39
|
+
/**
|
|
40
|
+
* Expand change handler
|
|
41
|
+
*/
|
|
42
|
+
onExpandChange?: (expandedKeys: (string | number)[], record: T, expanded: boolean) => void;
|
|
39
43
|
/**
|
|
40
44
|
* Additional CSS classes
|
|
41
45
|
*/
|
|
42
46
|
className?: string;
|
|
43
47
|
}
|
|
44
|
-
declare function Table<T extends Record<string, unknown> = Record<string, unknown>>({ columns, columnLockable, dataSource, sort, defaultSort, filters, defaultFilters, size, bordered, striped, hoverable, loading, emptyText, pagination, rowSelection, rowKey, rowClassName, stickyHeader, maxHeight, tableLayout, onChange, onRowClick, onSelectionChange, onSortChange, onFilterChange, onPageChange, className, ...props }: TableProps<T>): react_jsx_runtime.JSX.Element;
|
|
48
|
+
declare function Table<T extends Record<string, unknown> = Record<string, unknown>>({ columns, columnLockable, dataSource, sort, defaultSort, filters, defaultFilters, size, bordered, striped, hoverable, loading, emptyText, pagination, rowSelection, expandable, rowKey, rowClassName, stickyHeader, maxHeight, tableLayout, onChange, onRowClick, onSelectionChange, onSortChange, onFilterChange, onPageChange, onExpandChange, className, ...props }: TableProps<T>): react_jsx_runtime.JSX.Element;
|
|
45
49
|
|
|
46
50
|
export { Table, type TableProps };
|
|
@@ -36,11 +36,15 @@ interface TableProps<T = Record<string, unknown>> extends TableProps$1<T> {
|
|
|
36
36
|
current: number;
|
|
37
37
|
pageSize: number;
|
|
38
38
|
}) => void;
|
|
39
|
+
/**
|
|
40
|
+
* Expand change handler
|
|
41
|
+
*/
|
|
42
|
+
onExpandChange?: (expandedKeys: (string | number)[], record: T, expanded: boolean) => void;
|
|
39
43
|
/**
|
|
40
44
|
* Additional CSS classes
|
|
41
45
|
*/
|
|
42
46
|
className?: string;
|
|
43
47
|
}
|
|
44
|
-
declare function Table<T extends Record<string, unknown> = Record<string, unknown>>({ columns, columnLockable, dataSource, sort, defaultSort, filters, defaultFilters, size, bordered, striped, hoverable, loading, emptyText, pagination, rowSelection, rowKey, rowClassName, stickyHeader, maxHeight, tableLayout, onChange, onRowClick, onSelectionChange, onSortChange, onFilterChange, onPageChange, className, ...props }: TableProps<T>): react_jsx_runtime.JSX.Element;
|
|
48
|
+
declare function Table<T extends Record<string, unknown> = Record<string, unknown>>({ columns, columnLockable, dataSource, sort, defaultSort, filters, defaultFilters, size, bordered, striped, hoverable, loading, emptyText, pagination, rowSelection, expandable, rowKey, rowClassName, stickyHeader, maxHeight, tableLayout, onChange, onRowClick, onSelectionChange, onSortChange, onFilterChange, onPageChange, onExpandChange, className, ...props }: TableProps<T>): react_jsx_runtime.JSX.Element;
|
|
45
49
|
|
|
46
50
|
export { Table, type TableProps };
|
package/dist/components/Table.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkZBVFM3GJ_js = require('../chunk-ZBVFM3GJ.js');
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
Object.defineProperty(exports, "Table", {
|
|
8
8
|
enumerable: true,
|
|
9
|
-
get: function () { return
|
|
9
|
+
get: function () { return chunkZBVFM3GJ_js.Table; }
|
|
10
10
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { Table } from '../chunk-
|
|
1
|
+
export { Table } from '../chunk-KBTFBEPE.mjs';
|
package/dist/index.d.mts
CHANGED
|
@@ -10,6 +10,7 @@ export { Radio, RadioProps } from './components/Radio.mjs';
|
|
|
10
10
|
export { RadioGroup, RadioGroupProps } from './components/RadioGroup.mjs';
|
|
11
11
|
export { Textarea, TextareaProps } from './components/Textarea.mjs';
|
|
12
12
|
export { Input, InputProps } from './components/Input.mjs';
|
|
13
|
+
export { InputNumber, InputNumberProps } from './components/InputNumber.mjs';
|
|
13
14
|
export { Form, FormContextValue, FormHandle, FormProps, FormSubmitEvent, useFormContext } from './components/Form.mjs';
|
|
14
15
|
export { FormItem, FormItemProps } from './components/FormItem.mjs';
|
|
15
16
|
export { Space, SpaceProps } from './components/Space.mjs';
|
package/dist/index.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ export { Radio, RadioProps } from './components/Radio.js';
|
|
|
10
10
|
export { RadioGroup, RadioGroupProps } from './components/RadioGroup.js';
|
|
11
11
|
export { Textarea, TextareaProps } from './components/Textarea.js';
|
|
12
12
|
export { Input, InputProps } from './components/Input.js';
|
|
13
|
+
export { InputNumber, InputNumberProps } from './components/InputNumber.js';
|
|
13
14
|
export { Form, FormContextValue, FormHandle, FormProps, FormSubmitEvent, useFormContext } from './components/Form.js';
|
|
14
15
|
export { FormItem, FormItemProps } from './components/FormItem.js';
|
|
15
16
|
export { Space, SpaceProps } from './components/Space.js';
|