polaris-react-extended 13.10.5-rc1 → 13.10.5
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/build/cjs/components/IndexTable/IndexTable.js +8 -103
- package/build/cjs/components/IndexTable/components/Row/Row.js +3 -31
- package/build/esm/components/IndexTable/IndexTable.js +9 -104
- package/build/esm/components/IndexTable/components/Row/Row.js +3 -31
- package/build/esm/styles.css +1 -1
- package/build/esnext/components/AppProvider/global.out.css +1 -1
- package/build/esnext/components/IndexTable/IndexTable.esnext +9 -104
- package/build/esnext/components/IndexTable/components/Row/Row.esnext +3 -31
- package/build/ts/src/components/IndexTable/IndexTable.d.ts +0 -20
- package/build/ts/src/components/IndexTable/IndexTable.d.ts.map +1 -1
- package/build/ts/src/components/IndexTable/components/Row/Row.d.ts +0 -8
- package/build/ts/src/components/IndexTable/components/Row/Row.d.ts.map +1 -1
- package/build/ts/src/utilities/index-table/context.d.ts +0 -10
- package/build/ts/src/utilities/index-table/context.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -49,16 +49,6 @@ function IndexTableBase({
|
|
|
49
49
|
sortToggleLabels,
|
|
50
50
|
hasZebraStriping,
|
|
51
51
|
pagination,
|
|
52
|
-
expandable,
|
|
53
|
-
expandedRowIds,
|
|
54
|
-
defaultExpandedRowIds,
|
|
55
|
-
onExpandedChange,
|
|
56
|
-
getRowChildren,
|
|
57
|
-
isRowExpandable,
|
|
58
|
-
expandIconCollapsed,
|
|
59
|
-
expandIconExpanded,
|
|
60
|
-
expandButtonClassName,
|
|
61
|
-
expandButtonStyle,
|
|
62
52
|
rowClassName,
|
|
63
53
|
rowStyle,
|
|
64
54
|
cellClassName,
|
|
@@ -100,38 +90,6 @@ function IndexTableBase({
|
|
|
100
90
|
const [tableInitialized, setTableInitialized] = React.useState(false);
|
|
101
91
|
const [stickyWrapper, setStickyWrapper] = React.useState(null);
|
|
102
92
|
const [hideScrollContainer, setHideScrollContainer] = React.useState(true);
|
|
103
|
-
|
|
104
|
-
// Expansion state
|
|
105
|
-
const [expandedRows, setExpandedRows] = React.useState(() => {
|
|
106
|
-
if (expandedRowIds) {
|
|
107
|
-
return new Set(expandedRowIds);
|
|
108
|
-
}
|
|
109
|
-
if (defaultExpandedRowIds) {
|
|
110
|
-
return new Set(defaultExpandedRowIds);
|
|
111
|
-
}
|
|
112
|
-
return new Set();
|
|
113
|
-
});
|
|
114
|
-
|
|
115
|
-
// Update expanded state when prop changes
|
|
116
|
-
React.useEffect(() => {
|
|
117
|
-
if (expandedRowIds !== undefined) {
|
|
118
|
-
setExpandedRows(new Set(expandedRowIds));
|
|
119
|
-
}
|
|
120
|
-
}, [expandedRowIds]);
|
|
121
|
-
|
|
122
|
-
// Toggle expansion
|
|
123
|
-
const toggleRowExpansion = React.useCallback(rowId => {
|
|
124
|
-
setExpandedRows(prev => {
|
|
125
|
-
const newExpanded = new Set(prev);
|
|
126
|
-
if (newExpanded.has(rowId)) {
|
|
127
|
-
newExpanded.delete(rowId);
|
|
128
|
-
} else {
|
|
129
|
-
newExpanded.add(rowId);
|
|
130
|
-
}
|
|
131
|
-
onExpandedChange?.(Array.from(newExpanded));
|
|
132
|
-
return newExpanded;
|
|
133
|
-
});
|
|
134
|
-
}, [onExpandedChange]);
|
|
135
93
|
const tableHeadings = React.useRef([]);
|
|
136
94
|
const stickyTableHeadings = React.useRef([]);
|
|
137
95
|
const stickyHeaderWrapperElement = React.useRef(null);
|
|
@@ -387,56 +345,12 @@ function IndexTableBase({
|
|
|
387
345
|
event: "resize",
|
|
388
346
|
handler: handleResize
|
|
389
347
|
}), stickyHeaderMarkup);
|
|
390
|
-
|
|
391
|
-
// Process children to insert child rows for expanded rows
|
|
392
|
-
const processedChildren = React.useMemo(() => {
|
|
393
|
-
if (!expandable || !getRowChildren) {
|
|
394
|
-
return children;
|
|
395
|
-
}
|
|
396
|
-
const result = [];
|
|
397
|
-
let position = 0;
|
|
398
|
-
React.Children.forEach(children, child => {
|
|
399
|
-
if (/*#__PURE__*/React.isValidElement(child) && child.type === Row.Row) {
|
|
400
|
-
const rowId = child.props.id;
|
|
401
|
-
const isExpanded = expandedRows.has(rowId);
|
|
402
|
-
|
|
403
|
-
// Clone the row with updated position
|
|
404
|
-
const updatedRow = /*#__PURE__*/React.cloneElement(child, {
|
|
405
|
-
...child.props,
|
|
406
|
-
position
|
|
407
|
-
});
|
|
408
|
-
result.push(updatedRow);
|
|
409
|
-
position++;
|
|
410
|
-
|
|
411
|
-
// Add child rows if expanded
|
|
412
|
-
if (isExpanded) {
|
|
413
|
-
const childRows = getRowChildren(rowId);
|
|
414
|
-
if (childRows && childRows.length > 0) {
|
|
415
|
-
childRows.forEach((childRow, index) => {
|
|
416
|
-
if (/*#__PURE__*/React.isValidElement(childRow)) {
|
|
417
|
-
result.push(/*#__PURE__*/React.cloneElement(childRow, {
|
|
418
|
-
...childRow.props,
|
|
419
|
-
key: `${rowId}-child-${index}`,
|
|
420
|
-
position,
|
|
421
|
-
rowType: 'child'
|
|
422
|
-
}));
|
|
423
|
-
position++;
|
|
424
|
-
}
|
|
425
|
-
});
|
|
426
|
-
}
|
|
427
|
-
}
|
|
428
|
-
} else {
|
|
429
|
-
result.push(child);
|
|
430
|
-
}
|
|
431
|
-
});
|
|
432
|
-
return result;
|
|
433
|
-
}, [children, expandable, expandedRows, getRowChildren]);
|
|
434
348
|
const condensedClassNames = css.classNames(IndexTable_module.default.CondensedList, hasZebraStriping && IndexTable_module.default.ZebraStriping);
|
|
435
349
|
const bodyMarkup = condensed ? /*#__PURE__*/React.createElement(React.Fragment, null, sharedMarkup, /*#__PURE__*/React.createElement("ul", {
|
|
436
350
|
"data-selectmode": Boolean(selectMode),
|
|
437
351
|
className: condensedClassNames,
|
|
438
352
|
ref: condensedListElement
|
|
439
|
-
},
|
|
353
|
+
}, children)) : /*#__PURE__*/React.createElement(React.Fragment, null, sharedMarkup, /*#__PURE__*/React.createElement(ScrollContainer.ScrollContainer, {
|
|
440
354
|
scrollableContainerRef: scrollableContainerElement,
|
|
441
355
|
onScroll: handleScrollContainerScroll
|
|
442
356
|
}, /*#__PURE__*/React.createElement("table", {
|
|
@@ -446,10 +360,15 @@ function IndexTableBase({
|
|
|
446
360
|
className: IndexTable_module.default.HeadingRow
|
|
447
361
|
}, headingsMarkup)), /*#__PURE__*/React.createElement("tbody", {
|
|
448
362
|
ref: tableBodyRef
|
|
449
|
-
},
|
|
363
|
+
}, children))));
|
|
450
364
|
const tableContentMarkup = itemCount > 0 ? bodyMarkup : /*#__PURE__*/React.createElement("div", {
|
|
451
365
|
className: IndexTable_module.default.EmptySearchResultWrapper
|
|
452
366
|
}, emptyStateMarkup);
|
|
367
|
+
const paginationMarkup = pagination ? /*#__PURE__*/React.createElement("div", {
|
|
368
|
+
className: IndexTable_module.default.PaginationWrapper
|
|
369
|
+
}, /*#__PURE__*/React.createElement(Pagination.Pagination, Object.assign({
|
|
370
|
+
type: "table"
|
|
371
|
+
}, pagination))) : null;
|
|
453
372
|
const customizationContextValue = {
|
|
454
373
|
rowClassName,
|
|
455
374
|
rowStyle,
|
|
@@ -458,22 +377,8 @@ function IndexTableBase({
|
|
|
458
377
|
checkboxClassName,
|
|
459
378
|
checkboxStyle,
|
|
460
379
|
checkboxWrapperClassName,
|
|
461
|
-
checkboxWrapperStyle
|
|
462
|
-
expandable,
|
|
463
|
-
expandedRowIds: expandedRows,
|
|
464
|
-
toggleRowExpansion,
|
|
465
|
-
isRowExpandable,
|
|
466
|
-
getRowChildren,
|
|
467
|
-
expandIconCollapsed,
|
|
468
|
-
expandIconExpanded,
|
|
469
|
-
expandButtonClassName,
|
|
470
|
-
expandButtonStyle
|
|
380
|
+
checkboxWrapperStyle
|
|
471
381
|
};
|
|
472
|
-
const paginationMarkup = pagination ? /*#__PURE__*/React.createElement("div", {
|
|
473
|
-
className: IndexTable_module.default.PaginationWrapper
|
|
474
|
-
}, /*#__PURE__*/React.createElement(Pagination.Pagination, Object.assign({
|
|
475
|
-
type: "table"
|
|
476
|
-
}, pagination))) : null;
|
|
477
382
|
return /*#__PURE__*/React.createElement(context.IndexTableCustomizationContext.Provider, {
|
|
478
383
|
value: customizationContextValue
|
|
479
384
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -6,8 +6,8 @@ var css = require('../../../../utilities/css.js');
|
|
|
6
6
|
var IndexTable_module = require('../../IndexTable.css.js');
|
|
7
7
|
var hooks = require('../../../../utilities/index-provider/hooks.js');
|
|
8
8
|
var types = require('../../../../utilities/index-provider/types.js');
|
|
9
|
-
var Cell = require('../Cell/Cell.js');
|
|
10
9
|
var context = require('../../../../utilities/index-table/context.js');
|
|
10
|
+
var Cell = require('../Cell/Cell.js');
|
|
11
11
|
var Checkbox = require('../Checkbox/Checkbox.js');
|
|
12
12
|
|
|
13
13
|
const Row = /*#__PURE__*/React.memo(function Row({
|
|
@@ -38,15 +38,7 @@ const Row = /*#__PURE__*/React.memo(function Row({
|
|
|
38
38
|
} = useToggle.useToggle(false);
|
|
39
39
|
const {
|
|
40
40
|
rowClassName: customRowClassName,
|
|
41
|
-
rowStyle: customRowStyle
|
|
42
|
-
expandable: tableExpandable,
|
|
43
|
-
expandedRowIds,
|
|
44
|
-
toggleRowExpansion,
|
|
45
|
-
isRowExpandable: tableIsRowExpandable,
|
|
46
|
-
expandIconCollapsed,
|
|
47
|
-
expandIconExpanded,
|
|
48
|
-
expandButtonClassName,
|
|
49
|
-
expandButtonStyle
|
|
41
|
+
rowStyle: customRowStyle
|
|
50
42
|
} = React.useContext(context.IndexTableCustomizationContext);
|
|
51
43
|
const handleInteraction = React.useCallback(event => {
|
|
52
44
|
event.stopPropagation();
|
|
@@ -116,26 +108,6 @@ const Row = /*#__PURE__*/React.memo(function Row({
|
|
|
116
108
|
const checkboxMarkup = hideSelectable ? /*#__PURE__*/React.createElement(Cell.Cell, null) : /*#__PURE__*/React.createElement(Checkbox.Checkbox, {
|
|
117
109
|
accessibilityLabel: accessibilityLabel
|
|
118
110
|
});
|
|
119
|
-
const isRowExpandable = tableIsRowExpandable ? tableIsRowExpandable(id) : false;
|
|
120
|
-
const isExpanded = expandedRowIds ? expandedRowIds.has(id) : false;
|
|
121
|
-
const expandButton = tableExpandable && isRowExpandable ? /*#__PURE__*/React.createElement(Cell.Cell, null, /*#__PURE__*/React.createElement("button", {
|
|
122
|
-
onClick: e => {
|
|
123
|
-
e.stopPropagation();
|
|
124
|
-
toggleRowExpansion?.(id);
|
|
125
|
-
},
|
|
126
|
-
className: expandButtonClassName,
|
|
127
|
-
style: {
|
|
128
|
-
background: 'none',
|
|
129
|
-
border: 'none',
|
|
130
|
-
cursor: 'pointer',
|
|
131
|
-
padding: '4px',
|
|
132
|
-
display: 'flex',
|
|
133
|
-
alignItems: 'center',
|
|
134
|
-
justifyContent: 'center',
|
|
135
|
-
...expandButtonStyle
|
|
136
|
-
},
|
|
137
|
-
"aria-label": isExpanded ? 'Collapse row' : 'Expand row'
|
|
138
|
-
}, isExpanded ? expandIconExpanded || '▼' : expandIconCollapsed || '▶')) : null;
|
|
139
111
|
return /*#__PURE__*/React.createElement(context.RowContext.Provider, {
|
|
140
112
|
value: contextValue
|
|
141
113
|
}, /*#__PURE__*/React.createElement(context.RowHoveredContext.Provider, {
|
|
@@ -149,7 +121,7 @@ const Row = /*#__PURE__*/React.memo(function Row({
|
|
|
149
121
|
onMouseLeave: setHoverOut,
|
|
150
122
|
onClick: handleRowClick,
|
|
151
123
|
ref: tableRowCallbackRef
|
|
152
|
-
},
|
|
124
|
+
}, tableIsSelectable ? checkboxMarkup : null, children)));
|
|
153
125
|
});
|
|
154
126
|
|
|
155
127
|
exports.Row = Row;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useRef, useState,
|
|
1
|
+
import React, { useRef, useState, useCallback, useMemo, useEffect } from 'react';
|
|
2
2
|
import { SortAscendingIcon, SortDescendingIcon } from '@shopify/polaris-icons';
|
|
3
3
|
import { debounce } from '../../utilities/debounce.js';
|
|
4
4
|
import { useToggle } from '../../utilities/use-toggle.js';
|
|
@@ -47,16 +47,6 @@ function IndexTableBase({
|
|
|
47
47
|
sortToggleLabels,
|
|
48
48
|
hasZebraStriping,
|
|
49
49
|
pagination,
|
|
50
|
-
expandable,
|
|
51
|
-
expandedRowIds,
|
|
52
|
-
defaultExpandedRowIds,
|
|
53
|
-
onExpandedChange,
|
|
54
|
-
getRowChildren,
|
|
55
|
-
isRowExpandable,
|
|
56
|
-
expandIconCollapsed,
|
|
57
|
-
expandIconExpanded,
|
|
58
|
-
expandButtonClassName,
|
|
59
|
-
expandButtonStyle,
|
|
60
50
|
rowClassName,
|
|
61
51
|
rowStyle,
|
|
62
52
|
cellClassName,
|
|
@@ -98,38 +88,6 @@ function IndexTableBase({
|
|
|
98
88
|
const [tableInitialized, setTableInitialized] = useState(false);
|
|
99
89
|
const [stickyWrapper, setStickyWrapper] = useState(null);
|
|
100
90
|
const [hideScrollContainer, setHideScrollContainer] = useState(true);
|
|
101
|
-
|
|
102
|
-
// Expansion state
|
|
103
|
-
const [expandedRows, setExpandedRows] = useState(() => {
|
|
104
|
-
if (expandedRowIds) {
|
|
105
|
-
return new Set(expandedRowIds);
|
|
106
|
-
}
|
|
107
|
-
if (defaultExpandedRowIds) {
|
|
108
|
-
return new Set(defaultExpandedRowIds);
|
|
109
|
-
}
|
|
110
|
-
return new Set();
|
|
111
|
-
});
|
|
112
|
-
|
|
113
|
-
// Update expanded state when prop changes
|
|
114
|
-
useEffect(() => {
|
|
115
|
-
if (expandedRowIds !== undefined) {
|
|
116
|
-
setExpandedRows(new Set(expandedRowIds));
|
|
117
|
-
}
|
|
118
|
-
}, [expandedRowIds]);
|
|
119
|
-
|
|
120
|
-
// Toggle expansion
|
|
121
|
-
const toggleRowExpansion = useCallback(rowId => {
|
|
122
|
-
setExpandedRows(prev => {
|
|
123
|
-
const newExpanded = new Set(prev);
|
|
124
|
-
if (newExpanded.has(rowId)) {
|
|
125
|
-
newExpanded.delete(rowId);
|
|
126
|
-
} else {
|
|
127
|
-
newExpanded.add(rowId);
|
|
128
|
-
}
|
|
129
|
-
onExpandedChange?.(Array.from(newExpanded));
|
|
130
|
-
return newExpanded;
|
|
131
|
-
});
|
|
132
|
-
}, [onExpandedChange]);
|
|
133
91
|
const tableHeadings = useRef([]);
|
|
134
92
|
const stickyTableHeadings = useRef([]);
|
|
135
93
|
const stickyHeaderWrapperElement = useRef(null);
|
|
@@ -385,56 +343,12 @@ function IndexTableBase({
|
|
|
385
343
|
event: "resize",
|
|
386
344
|
handler: handleResize
|
|
387
345
|
}), stickyHeaderMarkup);
|
|
388
|
-
|
|
389
|
-
// Process children to insert child rows for expanded rows
|
|
390
|
-
const processedChildren = useMemo(() => {
|
|
391
|
-
if (!expandable || !getRowChildren) {
|
|
392
|
-
return children;
|
|
393
|
-
}
|
|
394
|
-
const result = [];
|
|
395
|
-
let position = 0;
|
|
396
|
-
React.Children.forEach(children, child => {
|
|
397
|
-
if (/*#__PURE__*/React.isValidElement(child) && child.type === Row) {
|
|
398
|
-
const rowId = child.props.id;
|
|
399
|
-
const isExpanded = expandedRows.has(rowId);
|
|
400
|
-
|
|
401
|
-
// Clone the row with updated position
|
|
402
|
-
const updatedRow = /*#__PURE__*/React.cloneElement(child, {
|
|
403
|
-
...child.props,
|
|
404
|
-
position
|
|
405
|
-
});
|
|
406
|
-
result.push(updatedRow);
|
|
407
|
-
position++;
|
|
408
|
-
|
|
409
|
-
// Add child rows if expanded
|
|
410
|
-
if (isExpanded) {
|
|
411
|
-
const childRows = getRowChildren(rowId);
|
|
412
|
-
if (childRows && childRows.length > 0) {
|
|
413
|
-
childRows.forEach((childRow, index) => {
|
|
414
|
-
if (/*#__PURE__*/React.isValidElement(childRow)) {
|
|
415
|
-
result.push(/*#__PURE__*/React.cloneElement(childRow, {
|
|
416
|
-
...childRow.props,
|
|
417
|
-
key: `${rowId}-child-${index}`,
|
|
418
|
-
position,
|
|
419
|
-
rowType: 'child'
|
|
420
|
-
}));
|
|
421
|
-
position++;
|
|
422
|
-
}
|
|
423
|
-
});
|
|
424
|
-
}
|
|
425
|
-
}
|
|
426
|
-
} else {
|
|
427
|
-
result.push(child);
|
|
428
|
-
}
|
|
429
|
-
});
|
|
430
|
-
return result;
|
|
431
|
-
}, [children, expandable, expandedRows, getRowChildren]);
|
|
432
346
|
const condensedClassNames = classNames(styles.CondensedList, hasZebraStriping && styles.ZebraStriping);
|
|
433
347
|
const bodyMarkup = condensed ? /*#__PURE__*/React.createElement(React.Fragment, null, sharedMarkup, /*#__PURE__*/React.createElement("ul", {
|
|
434
348
|
"data-selectmode": Boolean(selectMode),
|
|
435
349
|
className: condensedClassNames,
|
|
436
350
|
ref: condensedListElement
|
|
437
|
-
},
|
|
351
|
+
}, children)) : /*#__PURE__*/React.createElement(React.Fragment, null, sharedMarkup, /*#__PURE__*/React.createElement(ScrollContainer, {
|
|
438
352
|
scrollableContainerRef: scrollableContainerElement,
|
|
439
353
|
onScroll: handleScrollContainerScroll
|
|
440
354
|
}, /*#__PURE__*/React.createElement("table", {
|
|
@@ -444,10 +358,15 @@ function IndexTableBase({
|
|
|
444
358
|
className: styles.HeadingRow
|
|
445
359
|
}, headingsMarkup)), /*#__PURE__*/React.createElement("tbody", {
|
|
446
360
|
ref: tableBodyRef
|
|
447
|
-
},
|
|
361
|
+
}, children))));
|
|
448
362
|
const tableContentMarkup = itemCount > 0 ? bodyMarkup : /*#__PURE__*/React.createElement("div", {
|
|
449
363
|
className: styles.EmptySearchResultWrapper
|
|
450
364
|
}, emptyStateMarkup);
|
|
365
|
+
const paginationMarkup = pagination ? /*#__PURE__*/React.createElement("div", {
|
|
366
|
+
className: styles.PaginationWrapper
|
|
367
|
+
}, /*#__PURE__*/React.createElement(Pagination, Object.assign({
|
|
368
|
+
type: "table"
|
|
369
|
+
}, pagination))) : null;
|
|
451
370
|
const customizationContextValue = {
|
|
452
371
|
rowClassName,
|
|
453
372
|
rowStyle,
|
|
@@ -456,22 +375,8 @@ function IndexTableBase({
|
|
|
456
375
|
checkboxClassName,
|
|
457
376
|
checkboxStyle,
|
|
458
377
|
checkboxWrapperClassName,
|
|
459
|
-
checkboxWrapperStyle
|
|
460
|
-
expandable,
|
|
461
|
-
expandedRowIds: expandedRows,
|
|
462
|
-
toggleRowExpansion,
|
|
463
|
-
isRowExpandable,
|
|
464
|
-
getRowChildren,
|
|
465
|
-
expandIconCollapsed,
|
|
466
|
-
expandIconExpanded,
|
|
467
|
-
expandButtonClassName,
|
|
468
|
-
expandButtonStyle
|
|
378
|
+
checkboxWrapperStyle
|
|
469
379
|
};
|
|
470
|
-
const paginationMarkup = pagination ? /*#__PURE__*/React.createElement("div", {
|
|
471
|
-
className: styles.PaginationWrapper
|
|
472
|
-
}, /*#__PURE__*/React.createElement(Pagination, Object.assign({
|
|
473
|
-
type: "table"
|
|
474
|
-
}, pagination))) : null;
|
|
475
380
|
return /*#__PURE__*/React.createElement(IndexTableCustomizationContext.Provider, {
|
|
476
381
|
value: customizationContextValue
|
|
477
382
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -4,8 +4,8 @@ import { classNames, variationName } from '../../../../utilities/css.js';
|
|
|
4
4
|
import styles from '../../IndexTable.css.js';
|
|
5
5
|
import { useIndexRow, useIndexSelectionChange } from '../../../../utilities/index-provider/hooks.js';
|
|
6
6
|
import { SelectionType } from '../../../../utilities/index-provider/types.js';
|
|
7
|
-
import { Cell } from '../Cell/Cell.js';
|
|
8
7
|
import { IndexTableCustomizationContext, RowContext, RowHoveredContext } from '../../../../utilities/index-table/context.js';
|
|
8
|
+
import { Cell } from '../Cell/Cell.js';
|
|
9
9
|
import { Checkbox } from '../Checkbox/Checkbox.js';
|
|
10
10
|
|
|
11
11
|
const Row = /*#__PURE__*/memo(function Row({
|
|
@@ -36,15 +36,7 @@ const Row = /*#__PURE__*/memo(function Row({
|
|
|
36
36
|
} = useToggle(false);
|
|
37
37
|
const {
|
|
38
38
|
rowClassName: customRowClassName,
|
|
39
|
-
rowStyle: customRowStyle
|
|
40
|
-
expandable: tableExpandable,
|
|
41
|
-
expandedRowIds,
|
|
42
|
-
toggleRowExpansion,
|
|
43
|
-
isRowExpandable: tableIsRowExpandable,
|
|
44
|
-
expandIconCollapsed,
|
|
45
|
-
expandIconExpanded,
|
|
46
|
-
expandButtonClassName,
|
|
47
|
-
expandButtonStyle
|
|
39
|
+
rowStyle: customRowStyle
|
|
48
40
|
} = useContext(IndexTableCustomizationContext);
|
|
49
41
|
const handleInteraction = useCallback(event => {
|
|
50
42
|
event.stopPropagation();
|
|
@@ -114,26 +106,6 @@ const Row = /*#__PURE__*/memo(function Row({
|
|
|
114
106
|
const checkboxMarkup = hideSelectable ? /*#__PURE__*/React.createElement(Cell, null) : /*#__PURE__*/React.createElement(Checkbox, {
|
|
115
107
|
accessibilityLabel: accessibilityLabel
|
|
116
108
|
});
|
|
117
|
-
const isRowExpandable = tableIsRowExpandable ? tableIsRowExpandable(id) : false;
|
|
118
|
-
const isExpanded = expandedRowIds ? expandedRowIds.has(id) : false;
|
|
119
|
-
const expandButton = tableExpandable && isRowExpandable ? /*#__PURE__*/React.createElement(Cell, null, /*#__PURE__*/React.createElement("button", {
|
|
120
|
-
onClick: e => {
|
|
121
|
-
e.stopPropagation();
|
|
122
|
-
toggleRowExpansion?.(id);
|
|
123
|
-
},
|
|
124
|
-
className: expandButtonClassName,
|
|
125
|
-
style: {
|
|
126
|
-
background: 'none',
|
|
127
|
-
border: 'none',
|
|
128
|
-
cursor: 'pointer',
|
|
129
|
-
padding: '4px',
|
|
130
|
-
display: 'flex',
|
|
131
|
-
alignItems: 'center',
|
|
132
|
-
justifyContent: 'center',
|
|
133
|
-
...expandButtonStyle
|
|
134
|
-
},
|
|
135
|
-
"aria-label": isExpanded ? 'Collapse row' : 'Expand row'
|
|
136
|
-
}, isExpanded ? expandIconExpanded || '▼' : expandIconCollapsed || '▶')) : null;
|
|
137
109
|
return /*#__PURE__*/React.createElement(RowContext.Provider, {
|
|
138
110
|
value: contextValue
|
|
139
111
|
}, /*#__PURE__*/React.createElement(RowHoveredContext.Provider, {
|
|
@@ -147,7 +119,7 @@ const Row = /*#__PURE__*/memo(function Row({
|
|
|
147
119
|
onMouseLeave: setHoverOut,
|
|
148
120
|
onClick: handleRowClick,
|
|
149
121
|
ref: tableRowCallbackRef
|
|
150
|
-
},
|
|
122
|
+
}, tableIsSelectable ? checkboxMarkup : null, children)));
|
|
151
123
|
});
|
|
152
124
|
|
|
153
125
|
export { Row };
|
package/build/esm/styles.css
CHANGED
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
@keyframes p-motion-keyframes-appear-below{ from{ transform:translateY(calc(var(--p-space-100)*-1)); opacity:0; } to{ transform:none; opacity:1; } }
|
|
22
22
|
|
|
23
23
|
:root{
|
|
24
|
-
--polaris-version-number:'13.10.
|
|
24
|
+
--polaris-version-number:'13.10.4';
|
|
25
25
|
|
|
26
26
|
--pg-navigation-width:15rem;
|
|
27
27
|
--pg-dangerous-magic-space-4:1rem;
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
@keyframes p-motion-keyframes-appear-below{ from{ transform:translateY(calc(var(--p-space-100)*-1)); opacity:0; } to{ transform:none; opacity:1; } }
|
|
22
22
|
|
|
23
23
|
:root{
|
|
24
|
-
--polaris-version-number:'13.10.
|
|
24
|
+
--polaris-version-number:'13.10.4';
|
|
25
25
|
|
|
26
26
|
--pg-navigation-width:15rem;
|
|
27
27
|
--pg-dangerous-magic-space-4:1rem;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useRef, useState,
|
|
1
|
+
import React, { useRef, useState, useCallback, useMemo, useEffect } from 'react';
|
|
2
2
|
import { SortAscendingIcon, SortDescendingIcon } from '@shopify/polaris-icons';
|
|
3
3
|
import { debounce } from '../../utilities/debounce.esnext';
|
|
4
4
|
import { useToggle } from '../../utilities/use-toggle.esnext';
|
|
@@ -47,16 +47,6 @@ function IndexTableBase({
|
|
|
47
47
|
sortToggleLabels,
|
|
48
48
|
hasZebraStriping,
|
|
49
49
|
pagination,
|
|
50
|
-
expandable,
|
|
51
|
-
expandedRowIds,
|
|
52
|
-
defaultExpandedRowIds,
|
|
53
|
-
onExpandedChange,
|
|
54
|
-
getRowChildren,
|
|
55
|
-
isRowExpandable,
|
|
56
|
-
expandIconCollapsed,
|
|
57
|
-
expandIconExpanded,
|
|
58
|
-
expandButtonClassName,
|
|
59
|
-
expandButtonStyle,
|
|
60
50
|
rowClassName,
|
|
61
51
|
rowStyle,
|
|
62
52
|
cellClassName,
|
|
@@ -98,38 +88,6 @@ function IndexTableBase({
|
|
|
98
88
|
const [tableInitialized, setTableInitialized] = useState(false);
|
|
99
89
|
const [stickyWrapper, setStickyWrapper] = useState(null);
|
|
100
90
|
const [hideScrollContainer, setHideScrollContainer] = useState(true);
|
|
101
|
-
|
|
102
|
-
// Expansion state
|
|
103
|
-
const [expandedRows, setExpandedRows] = useState(() => {
|
|
104
|
-
if (expandedRowIds) {
|
|
105
|
-
return new Set(expandedRowIds);
|
|
106
|
-
}
|
|
107
|
-
if (defaultExpandedRowIds) {
|
|
108
|
-
return new Set(defaultExpandedRowIds);
|
|
109
|
-
}
|
|
110
|
-
return new Set();
|
|
111
|
-
});
|
|
112
|
-
|
|
113
|
-
// Update expanded state when prop changes
|
|
114
|
-
useEffect(() => {
|
|
115
|
-
if (expandedRowIds !== undefined) {
|
|
116
|
-
setExpandedRows(new Set(expandedRowIds));
|
|
117
|
-
}
|
|
118
|
-
}, [expandedRowIds]);
|
|
119
|
-
|
|
120
|
-
// Toggle expansion
|
|
121
|
-
const toggleRowExpansion = useCallback(rowId => {
|
|
122
|
-
setExpandedRows(prev => {
|
|
123
|
-
const newExpanded = new Set(prev);
|
|
124
|
-
if (newExpanded.has(rowId)) {
|
|
125
|
-
newExpanded.delete(rowId);
|
|
126
|
-
} else {
|
|
127
|
-
newExpanded.add(rowId);
|
|
128
|
-
}
|
|
129
|
-
onExpandedChange?.(Array.from(newExpanded));
|
|
130
|
-
return newExpanded;
|
|
131
|
-
});
|
|
132
|
-
}, [onExpandedChange]);
|
|
133
91
|
const tableHeadings = useRef([]);
|
|
134
92
|
const stickyTableHeadings = useRef([]);
|
|
135
93
|
const stickyHeaderWrapperElement = useRef(null);
|
|
@@ -385,56 +343,12 @@ function IndexTableBase({
|
|
|
385
343
|
event: "resize",
|
|
386
344
|
handler: handleResize
|
|
387
345
|
}), stickyHeaderMarkup);
|
|
388
|
-
|
|
389
|
-
// Process children to insert child rows for expanded rows
|
|
390
|
-
const processedChildren = useMemo(() => {
|
|
391
|
-
if (!expandable || !getRowChildren) {
|
|
392
|
-
return children;
|
|
393
|
-
}
|
|
394
|
-
const result = [];
|
|
395
|
-
let position = 0;
|
|
396
|
-
React.Children.forEach(children, child => {
|
|
397
|
-
if (/*#__PURE__*/React.isValidElement(child) && child.type === Row) {
|
|
398
|
-
const rowId = child.props.id;
|
|
399
|
-
const isExpanded = expandedRows.has(rowId);
|
|
400
|
-
|
|
401
|
-
// Clone the row with updated position
|
|
402
|
-
const updatedRow = /*#__PURE__*/React.cloneElement(child, {
|
|
403
|
-
...child.props,
|
|
404
|
-
position
|
|
405
|
-
});
|
|
406
|
-
result.push(updatedRow);
|
|
407
|
-
position++;
|
|
408
|
-
|
|
409
|
-
// Add child rows if expanded
|
|
410
|
-
if (isExpanded) {
|
|
411
|
-
const childRows = getRowChildren(rowId);
|
|
412
|
-
if (childRows && childRows.length > 0) {
|
|
413
|
-
childRows.forEach((childRow, index) => {
|
|
414
|
-
if (/*#__PURE__*/React.isValidElement(childRow)) {
|
|
415
|
-
result.push(/*#__PURE__*/React.cloneElement(childRow, {
|
|
416
|
-
...childRow.props,
|
|
417
|
-
key: `${rowId}-child-${index}`,
|
|
418
|
-
position,
|
|
419
|
-
rowType: 'child'
|
|
420
|
-
}));
|
|
421
|
-
position++;
|
|
422
|
-
}
|
|
423
|
-
});
|
|
424
|
-
}
|
|
425
|
-
}
|
|
426
|
-
} else {
|
|
427
|
-
result.push(child);
|
|
428
|
-
}
|
|
429
|
-
});
|
|
430
|
-
return result;
|
|
431
|
-
}, [children, expandable, expandedRows, getRowChildren]);
|
|
432
346
|
const condensedClassNames = classNames(styles.CondensedList, hasZebraStriping && styles.ZebraStriping);
|
|
433
347
|
const bodyMarkup = condensed ? /*#__PURE__*/React.createElement(React.Fragment, null, sharedMarkup, /*#__PURE__*/React.createElement("ul", {
|
|
434
348
|
"data-selectmode": Boolean(selectMode),
|
|
435
349
|
className: condensedClassNames,
|
|
436
350
|
ref: condensedListElement
|
|
437
|
-
},
|
|
351
|
+
}, children)) : /*#__PURE__*/React.createElement(React.Fragment, null, sharedMarkup, /*#__PURE__*/React.createElement(ScrollContainer, {
|
|
438
352
|
scrollableContainerRef: scrollableContainerElement,
|
|
439
353
|
onScroll: handleScrollContainerScroll
|
|
440
354
|
}, /*#__PURE__*/React.createElement("table", {
|
|
@@ -444,10 +358,15 @@ function IndexTableBase({
|
|
|
444
358
|
className: styles.HeadingRow
|
|
445
359
|
}, headingsMarkup)), /*#__PURE__*/React.createElement("tbody", {
|
|
446
360
|
ref: tableBodyRef
|
|
447
|
-
},
|
|
361
|
+
}, children))));
|
|
448
362
|
const tableContentMarkup = itemCount > 0 ? bodyMarkup : /*#__PURE__*/React.createElement("div", {
|
|
449
363
|
className: styles.EmptySearchResultWrapper
|
|
450
364
|
}, emptyStateMarkup);
|
|
365
|
+
const paginationMarkup = pagination ? /*#__PURE__*/React.createElement("div", {
|
|
366
|
+
className: styles.PaginationWrapper
|
|
367
|
+
}, /*#__PURE__*/React.createElement(Pagination, Object.assign({
|
|
368
|
+
type: "table"
|
|
369
|
+
}, pagination))) : null;
|
|
451
370
|
const customizationContextValue = {
|
|
452
371
|
rowClassName,
|
|
453
372
|
rowStyle,
|
|
@@ -456,22 +375,8 @@ function IndexTableBase({
|
|
|
456
375
|
checkboxClassName,
|
|
457
376
|
checkboxStyle,
|
|
458
377
|
checkboxWrapperClassName,
|
|
459
|
-
checkboxWrapperStyle
|
|
460
|
-
expandable,
|
|
461
|
-
expandedRowIds: expandedRows,
|
|
462
|
-
toggleRowExpansion,
|
|
463
|
-
isRowExpandable,
|
|
464
|
-
getRowChildren,
|
|
465
|
-
expandIconCollapsed,
|
|
466
|
-
expandIconExpanded,
|
|
467
|
-
expandButtonClassName,
|
|
468
|
-
expandButtonStyle
|
|
378
|
+
checkboxWrapperStyle
|
|
469
379
|
};
|
|
470
|
-
const paginationMarkup = pagination ? /*#__PURE__*/React.createElement("div", {
|
|
471
|
-
className: styles.PaginationWrapper
|
|
472
|
-
}, /*#__PURE__*/React.createElement(Pagination, Object.assign({
|
|
473
|
-
type: "table"
|
|
474
|
-
}, pagination))) : null;
|
|
475
380
|
return /*#__PURE__*/React.createElement(IndexTableCustomizationContext.Provider, {
|
|
476
381
|
value: customizationContextValue
|
|
477
382
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -4,8 +4,8 @@ import { classNames, variationName } from '../../../../utilities/css.esnext';
|
|
|
4
4
|
import styles from '../../IndexTable.css.esnext';
|
|
5
5
|
import { useIndexRow, useIndexSelectionChange } from '../../../../utilities/index-provider/hooks.esnext';
|
|
6
6
|
import { SelectionType } from '../../../../utilities/index-provider/types.esnext';
|
|
7
|
-
import { Cell } from '../Cell/Cell.esnext';
|
|
8
7
|
import { IndexTableCustomizationContext, RowContext, RowHoveredContext } from '../../../../utilities/index-table/context.esnext';
|
|
8
|
+
import { Cell } from '../Cell/Cell.esnext';
|
|
9
9
|
import { Checkbox } from '../Checkbox/Checkbox.esnext';
|
|
10
10
|
|
|
11
11
|
const Row = /*#__PURE__*/memo(function Row({
|
|
@@ -36,15 +36,7 @@ const Row = /*#__PURE__*/memo(function Row({
|
|
|
36
36
|
} = useToggle(false);
|
|
37
37
|
const {
|
|
38
38
|
rowClassName: customRowClassName,
|
|
39
|
-
rowStyle: customRowStyle
|
|
40
|
-
expandable: tableExpandable,
|
|
41
|
-
expandedRowIds,
|
|
42
|
-
toggleRowExpansion,
|
|
43
|
-
isRowExpandable: tableIsRowExpandable,
|
|
44
|
-
expandIconCollapsed,
|
|
45
|
-
expandIconExpanded,
|
|
46
|
-
expandButtonClassName,
|
|
47
|
-
expandButtonStyle
|
|
39
|
+
rowStyle: customRowStyle
|
|
48
40
|
} = useContext(IndexTableCustomizationContext);
|
|
49
41
|
const handleInteraction = useCallback(event => {
|
|
50
42
|
event.stopPropagation();
|
|
@@ -114,26 +106,6 @@ const Row = /*#__PURE__*/memo(function Row({
|
|
|
114
106
|
const checkboxMarkup = hideSelectable ? /*#__PURE__*/React.createElement(Cell, null) : /*#__PURE__*/React.createElement(Checkbox, {
|
|
115
107
|
accessibilityLabel: accessibilityLabel
|
|
116
108
|
});
|
|
117
|
-
const isRowExpandable = tableIsRowExpandable ? tableIsRowExpandable(id) : false;
|
|
118
|
-
const isExpanded = expandedRowIds ? expandedRowIds.has(id) : false;
|
|
119
|
-
const expandButton = tableExpandable && isRowExpandable ? /*#__PURE__*/React.createElement(Cell, null, /*#__PURE__*/React.createElement("button", {
|
|
120
|
-
onClick: e => {
|
|
121
|
-
e.stopPropagation();
|
|
122
|
-
toggleRowExpansion?.(id);
|
|
123
|
-
},
|
|
124
|
-
className: expandButtonClassName,
|
|
125
|
-
style: {
|
|
126
|
-
background: 'none',
|
|
127
|
-
border: 'none',
|
|
128
|
-
cursor: 'pointer',
|
|
129
|
-
padding: '4px',
|
|
130
|
-
display: 'flex',
|
|
131
|
-
alignItems: 'center',
|
|
132
|
-
justifyContent: 'center',
|
|
133
|
-
...expandButtonStyle
|
|
134
|
-
},
|
|
135
|
-
"aria-label": isExpanded ? 'Collapse row' : 'Expand row'
|
|
136
|
-
}, isExpanded ? expandIconExpanded || '▼' : expandIconCollapsed || '▶')) : null;
|
|
137
109
|
return /*#__PURE__*/React.createElement(RowContext.Provider, {
|
|
138
110
|
value: contextValue
|
|
139
111
|
}, /*#__PURE__*/React.createElement(RowHoveredContext.Provider, {
|
|
@@ -147,7 +119,7 @@ const Row = /*#__PURE__*/memo(function Row({
|
|
|
147
119
|
onMouseLeave: setHoverOut,
|
|
148
120
|
onClick: handleRowClick,
|
|
149
121
|
ref: tableRowCallbackRef
|
|
150
|
-
},
|
|
122
|
+
}, tableIsSelectable ? checkboxMarkup : null, children)));
|
|
151
123
|
});
|
|
152
124
|
|
|
153
125
|
export { Row };
|
|
@@ -76,26 +76,6 @@ export interface IndexTableBaseProps {
|
|
|
76
76
|
hasZebraStriping?: boolean;
|
|
77
77
|
/** Properties to enable pagination at the bottom of the table. */
|
|
78
78
|
pagination?: IndexTablePaginationProps;
|
|
79
|
-
/** Enable expandable rows */
|
|
80
|
-
expandable?: boolean;
|
|
81
|
-
/** IDs of expanded rows */
|
|
82
|
-
expandedRowIds?: string[];
|
|
83
|
-
/** Default expanded row IDs */
|
|
84
|
-
defaultExpandedRowIds?: string[];
|
|
85
|
-
/** Callback when expanded rows change */
|
|
86
|
-
onExpandedChange?: (expandedRowIds: string[]) => void;
|
|
87
|
-
/** Callback to get child rows for a row ID */
|
|
88
|
-
getRowChildren?: (rowId: string) => React.ReactNode[];
|
|
89
|
-
/** Callback to determine if a row is expandable */
|
|
90
|
-
isRowExpandable?: (rowId: string) => boolean;
|
|
91
|
-
/** Custom expand icon for collapsed state */
|
|
92
|
-
expandIconCollapsed?: React.ReactNode;
|
|
93
|
-
/** Custom expand icon for expanded state */
|
|
94
|
-
expandIconExpanded?: React.ReactNode;
|
|
95
|
-
/** Custom class name for expand button */
|
|
96
|
-
expandButtonClassName?: string;
|
|
97
|
-
/** Custom styles for expand button */
|
|
98
|
-
expandButtonStyle?: React.CSSProperties;
|
|
99
79
|
/** Custom class name for all rows */
|
|
100
80
|
rowClassName?: string;
|
|
101
81
|
/** Custom styles for all rows */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IndexTable.d.ts","sourceRoot":"","sources":["../../../../../src/components/IndexTable/IndexTable.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"IndexTable.d.ts","sourceRoot":"","sources":["../../../../../src/components/IndexTable/IndexTable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -31,14 +31,6 @@ export interface RowProps {
|
|
|
31
31
|
onNavigation?(id: string): void;
|
|
32
32
|
/** Callback fired when the row is clicked. Overrides the default click behaviour. */
|
|
33
33
|
onClick?(): void;
|
|
34
|
-
/** @deprecated Use IndexTable expandable props instead */
|
|
35
|
-
expandable?: boolean;
|
|
36
|
-
/** @deprecated Use IndexTable expandable props instead */
|
|
37
|
-
expanded?: boolean;
|
|
38
|
-
/** @deprecated Use IndexTable expandable props instead */
|
|
39
|
-
onToggleExpansion?(): void;
|
|
40
|
-
/** @deprecated Use IndexTable expandable props instead */
|
|
41
|
-
expandIcon?: React.ReactNode;
|
|
42
34
|
}
|
|
43
35
|
export declare const Row: React.NamedExoticComponent<RowProps>;
|
|
44
36
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Row.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/IndexTable/components/Row/Row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAY5E,OAAO,KAAK,EAAC,KAAK,EAAC,MAAM,4CAA4C,CAAC;AAGtE,KAAK,OAAO,GAAG,MAAM,GAAG,WAAW,GAAG,OAAO,CAAC;AAC9C,KAAK,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AAGhE,MAAM,WAAW,QAAQ;IACvB,iCAAiC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,sCAAsC;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,oGAAoG;IACpG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IACrC,+EAA+E;IAC/E,QAAQ,EAAE,MAAM,CAAC;IACjB,kFAAkF;IAClF,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mLAAmL;IACnL,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB;;0BAEsB;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,8EAA8E;IAC9E,YAAY,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,qFAAqF;IACrF,OAAO,CAAC,IAAI,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"Row.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/IndexTable/components/Row/Row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAY5E,OAAO,KAAK,EAAC,KAAK,EAAC,MAAM,4CAA4C,CAAC;AAGtE,KAAK,OAAO,GAAG,MAAM,GAAG,WAAW,GAAG,OAAO,CAAC;AAC9C,KAAK,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AAGhE,MAAM,WAAW,QAAQ;IACvB,iCAAiC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,sCAAsC;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,oGAAoG;IACpG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IACrC,+EAA+E;IAC/E,QAAQ,EAAE,MAAM,CAAC;IACjB,kFAAkF;IAClF,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mLAAmL;IACnL,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB;;0BAEsB;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,8EAA8E;IAC9E,YAAY,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,qFAAqF;IACrF,OAAO,CAAC,IAAI,IAAI,CAAC;CAClB;AAED,eAAO,MAAM,GAAG,sCAwKd,CAAC"}
|
|
@@ -28,16 +28,6 @@ export interface IndexTableCustomizationContextType {
|
|
|
28
28
|
checkboxStyle?: React.CSSProperties;
|
|
29
29
|
checkboxWrapperClassName?: string;
|
|
30
30
|
checkboxWrapperStyle?: React.CSSProperties;
|
|
31
|
-
expandable?: boolean;
|
|
32
|
-
expandedRowIds?: Set<string>;
|
|
33
|
-
toggleRowExpansion?: (rowId: string) => void;
|
|
34
|
-
isRowExpandable?: (rowId: string) => boolean;
|
|
35
|
-
getRowChildren?: (rowId: string) => React.ReactNode[];
|
|
36
|
-
expandIcon?: React.ReactNode;
|
|
37
|
-
expandIconCollapsed?: React.ReactNode;
|
|
38
|
-
expandIconExpanded?: React.ReactNode;
|
|
39
|
-
expandButtonClassName?: string;
|
|
40
|
-
expandButtonStyle?: React.CSSProperties;
|
|
41
31
|
}
|
|
42
32
|
export declare const IndexTableCustomizationContext: import("react").Context<IndexTableCustomizationContextType>;
|
|
43
33
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../../src/utilities/index-table/context.ts"],"names":[],"mappings":";AAEA,UAAU,cAAc;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,GAAG,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;CACzE;AAED,eAAO,MAAM,UAAU,yCAAoC,CAAC;AAE5D,eAAO,MAAM,iBAAiB,8CAAgD,CAAC;AAE/E,MAAM,WAAW,iBAAiB;IAChC,mBAAmB,EAAE,cAAc,GAAG,IAAI,CAAC;IAC3C,aAAa,EAAE,OAAO,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,oBAAoB;;;;CAIhC,CAAC;AAEF,eAAO,MAAM,aAAa,4CAC8B,CAAC;AAEzD,MAAM,WAAW,kCAAkC;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,oBAAoB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../../src/utilities/index-table/context.ts"],"names":[],"mappings":";AAEA,UAAU,cAAc;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,GAAG,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;CACzE;AAED,eAAO,MAAM,UAAU,yCAAoC,CAAC;AAE5D,eAAO,MAAM,iBAAiB,8CAAgD,CAAC;AAE/E,MAAM,WAAW,iBAAiB;IAChC,mBAAmB,EAAE,cAAc,GAAG,IAAI,CAAC;IAC3C,aAAa,EAAE,OAAO,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,oBAAoB;;;;CAIhC,CAAC;AAEF,eAAO,MAAM,aAAa,4CAC8B,CAAC;AAEzD,MAAM,WAAW,kCAAkC;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC/B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,oBAAoB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5C;AAED,eAAO,MAAM,8BAA8B,6DACY,CAAC"}
|
package/package.json
CHANGED