@carbon/ibm-products 2.43.2-canary.15 → 2.43.2-canary.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/css/index-full-carbon.css +2 -3
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +2 -3
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +2 -3
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +16 -29
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +1 -9
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -18
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +0 -8
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +6 -17
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +1 -4
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +1 -3
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +3 -15
- package/es/components/DataSpreadsheet/types/index.d.ts +1 -1
- package/es/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +2 -34
- package/es/components/Datagrid/types/index.d.ts +4 -18
- package/es/components/Datagrid/useActionsColumn.d.ts +1 -8
- package/es/components/Datagrid/useActionsColumn.js +6 -7
- package/es/components/Datagrid/useColumnRightAlign.d.ts +1 -8
- package/es/components/Datagrid/useColumnRightAlign.js +3 -4
- package/es/components/Datagrid/useNestedRows.js +9 -27
- package/es/components/Decorator/Decorator.js +1 -2
- package/es/components/DecoratorBase/DecoratorBase.js +5 -3
- package/es/components/DecoratorDualButton/DecoratorDualButton.js +1 -2
- package/es/components/DecoratorLink/DecoratorLink.js +1 -2
- package/es/components/DecoratorSingleButton/DecoratorSingleButton.js +1 -2
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +16 -29
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +1 -9
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -18
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +0 -8
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +6 -17
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +1 -4
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +1 -3
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +3 -15
- package/lib/components/DataSpreadsheet/types/index.d.ts +1 -1
- package/lib/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +2 -34
- package/lib/components/Datagrid/types/index.d.ts +4 -18
- package/lib/components/Datagrid/useActionsColumn.d.ts +1 -8
- package/lib/components/Datagrid/useActionsColumn.js +6 -7
- package/lib/components/Datagrid/useColumnRightAlign.d.ts +1 -8
- package/lib/components/Datagrid/useColumnRightAlign.js +3 -4
- package/lib/components/Datagrid/useNestedRows.js +9 -27
- package/lib/components/Decorator/Decorator.js +1 -2
- package/lib/components/DecoratorBase/DecoratorBase.js +5 -3
- package/lib/components/DecoratorDualButton/DecoratorDualButton.js +1 -2
- package/lib/components/DecoratorLink/DecoratorLink.js +1 -2
- package/lib/components/DecoratorSingleButton/DecoratorSingleButton.js +1 -2
- package/package.json +3 -3
- package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +0 -1
- package/scss/components/StatusIcon/_status-icon.scss +4 -4
- package/scss/components/StringFormatter/_string-formatter.scss +2 -2
- package/scss/components/UserProfileImage/_user-profile-image.scss +2 -6
@@ -112,19 +112,15 @@ var DataSpreadsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
112
112
|
_useState18 = _slicedToArray(_useState17, 2),
|
113
113
|
headerCellHoldActive = _useState18[0],
|
114
114
|
setHeaderCellHoldActive = _useState18[1];
|
115
|
+
var isBlurSpreadsheet = useRef(false);
|
115
116
|
var _useState19 = useState(false),
|
116
117
|
_useState20 = _slicedToArray(_useState19, 2),
|
117
|
-
|
118
|
-
|
119
|
-
var isBlurSpreadsheet = useRef(false);
|
118
|
+
isActiveHeaderCellChanged = _useState20[0],
|
119
|
+
setIsActiveHeaderCellChanged = _useState20[1];
|
120
120
|
var _useState21 = useState(false),
|
121
121
|
_useState22 = _slicedToArray(_useState21, 2),
|
122
|
-
|
123
|
-
|
124
|
-
var _useState23 = useState(false),
|
125
|
-
_useState24 = _slicedToArray(_useState23, 2),
|
126
|
-
activeCellInsideSelectionArea = _useState24[0],
|
127
|
-
setActiveCellInsideSelectionArea = _useState24[1];
|
122
|
+
activeCellInsideSelectionArea = _useState22[0],
|
123
|
+
setActiveCellInsideSelectionArea = _useState22[1];
|
128
124
|
var previousState = usePreviousValue({
|
129
125
|
activeCellCoordinates: activeCellCoordinates,
|
130
126
|
isEditing: isEditing,
|
@@ -132,10 +128,10 @@ var DataSpreadsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
132
128
|
}) || {};
|
133
129
|
var cellSizeValue = getCellSize(cellSize);
|
134
130
|
var cellEditorRef = useRef();
|
135
|
-
var
|
136
|
-
|
137
|
-
activeCellContent =
|
138
|
-
setActiveCellContent =
|
131
|
+
var _useState23 = useState(),
|
132
|
+
_useState24 = _slicedToArray(_useState23, 2),
|
133
|
+
activeCellContent = _useState24[0],
|
134
|
+
setActiveCellContent = _useState24[1];
|
139
135
|
var activeCellRef = useRef();
|
140
136
|
var cellEditorRulerRef = useRef();
|
141
137
|
var defaultColumn = useMemo(function () {
|
@@ -211,12 +207,9 @@ var DataSpreadsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
211
207
|
}
|
212
208
|
if ((prevCoords === null || prevCoords === void 0 ? void 0 : prevCoords.row) !== (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) || (prevCoords === null || prevCoords === void 0 ? void 0 : prevCoords.column) !== (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column)) {
|
213
209
|
if (activeCellCoordinates && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) !== 'header' && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) !== 'header') {
|
210
|
+
var _activeCellFullData$r;
|
214
211
|
var activeCellFullData = typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'number' && typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'number' ? rows[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row].cells[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column] : null;
|
215
|
-
|
216
|
-
setActiveCellContent(activeCellFullData.render('Cell'));
|
217
|
-
} else {
|
218
|
-
setActiveCellContent(null);
|
219
|
-
}
|
212
|
+
setActiveCellContent((_activeCellFullData$r = activeCellFullData === null || activeCellFullData === void 0 ? void 0 : activeCellFullData.render('Cell')) !== null && _activeCellFullData$r !== void 0 ? _activeCellFullData$r : null);
|
220
213
|
}
|
221
214
|
if (activeCellCoordinates && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header') {
|
222
215
|
setActiveCellContent(null);
|
@@ -431,8 +424,8 @@ var DataSpreadsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
431
424
|
var activeCellFullData = typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'number' && typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'number' ? rows[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row].cells[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column] : null;
|
432
425
|
var activeCellValue;
|
433
426
|
if (activeCellFullData && activeCellCoordinates !== null && activeCellCoordinates !== void 0 && activeCellCoordinates.column) {
|
434
|
-
var _activeCellFullData$
|
435
|
-
activeCellValue = activeCellFullData ? (_activeCellFullData$
|
427
|
+
var _activeCellFullData$r2;
|
428
|
+
activeCellValue = activeCellFullData ? (_activeCellFullData$r2 = activeCellFullData.row.cells) === null || _activeCellFullData$r2 === void 0 || (_activeCellFullData$r2 = _activeCellFullData$r2[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column]) === null || _activeCellFullData$r2 === void 0 ? void 0 : _activeCellFullData$r2.value : null;
|
436
429
|
}
|
437
430
|
setCellEditorValue(activeCellValue || '');
|
438
431
|
if (cellEditorRulerRef !== null && cellEditorRulerRef !== void 0 && cellEditorRulerRef.current) {
|
@@ -622,8 +615,6 @@ var DataSpreadsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
622
615
|
columns: columns,
|
623
616
|
currentMatcher: currentMatcher,
|
624
617
|
defaultColumn: defaultColumn,
|
625
|
-
selectedHeaderReorderActive: selectedHeaderReorderActive,
|
626
|
-
setSelectedHeaderReorderActive: setSelectedHeaderReorderActive,
|
627
618
|
headerGroups: headerGroups,
|
628
619
|
rows: rows,
|
629
620
|
scrollBarSize: scrollBarSize,
|
@@ -647,8 +638,6 @@ var DataSpreadsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
647
638
|
currentMatcher: currentMatcher,
|
648
639
|
setCurrentMatcher: setCurrentMatcher,
|
649
640
|
setContainerHasFocus: setContainerHasFocus,
|
650
|
-
selectedHeaderReorderActive: selectedHeaderReorderActive,
|
651
|
-
setSelectedHeaderReorderActive: setSelectedHeaderReorderActive,
|
652
641
|
selectionAreas: selectionAreas,
|
653
642
|
setSelectionAreas: setSelectionAreas,
|
654
643
|
headerGroups: headerGroups,
|
@@ -699,11 +688,9 @@ var DataSpreadsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref
|
|
699
688
|
updateData: updateData
|
700
689
|
}),
|
701
690
|
onChange: function onChange(event) {
|
702
|
-
|
703
|
-
|
704
|
-
|
705
|
-
cellEditorRulerRef.current.textContent = event.target.value;
|
706
|
-
}
|
691
|
+
setCellEditorValue(event.target.value);
|
692
|
+
if (cellEditorRulerRef !== null && cellEditorRulerRef !== void 0 && cellEditorRulerRef.current) {
|
693
|
+
cellEditorRulerRef.current.textContent = event.target.value;
|
707
694
|
}
|
708
695
|
},
|
709
696
|
ref: cellEditorRef,
|
@@ -79,15 +79,7 @@ interface DataSpreadsheetBodyProps {
|
|
79
79
|
/**
|
80
80
|
* Array of selection area data
|
81
81
|
*/
|
82
|
-
selectionAreaData?:
|
83
|
-
/**
|
84
|
-
* Header reordering is active
|
85
|
-
*/
|
86
|
-
selectedHeaderReorderActive?: boolean;
|
87
|
-
/**
|
88
|
-
* Set header reordering active or not
|
89
|
-
*/
|
90
|
-
setSelectedHeaderReorderActive?: Dispatch<SetStateAction<boolean>>;
|
82
|
+
selectionAreaData?: object[];
|
91
83
|
/**
|
92
84
|
* Array of selection areas
|
93
85
|
*/
|
@@ -40,8 +40,6 @@ var DataSpreadsheetBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
40
40
|
selectionAreaData = _ref.selectionAreaData,
|
41
41
|
setSelectionAreaData = _ref.setSelectionAreaData,
|
42
42
|
setActiveCellCoordinates = _ref.setActiveCellCoordinates,
|
43
|
-
selectedHeaderReorderActive = _ref.selectedHeaderReorderActive,
|
44
|
-
setSelectedHeaderReorderActive = _ref.setSelectedHeaderReorderActive,
|
45
43
|
selectionAreas = _ref.selectionAreas,
|
46
44
|
setContainerHasFocus = _ref.setContainerHasFocus,
|
47
45
|
setSelectionAreas = _ref.setSelectionAreas,
|
@@ -77,12 +75,8 @@ var DataSpreadsheetBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
77
75
|
// back to the consumer
|
78
76
|
useEffect(function () {
|
79
77
|
if (selectionAreaData !== null && selectionAreaData !== void 0 && selectionAreaData.length) {
|
80
|
-
var _previousState$select
|
81
|
-
|
82
|
-
if ((previousState === null || previousState === void 0 || (_previousState$select = previousState.selectionAreaData) === null || _previousState$select === void 0 ? void 0 : _previousState$select.length) !== (selectionAreaData === null || selectionAreaData === void 0 ? void 0 : selectionAreaData.length) || (selectionAreaData === null || selectionAreaData === void 0 || (_selectionAreaData$ = selectionAreaData[0]) === null || _selectionAreaData$ === void 0 ? void 0 : _selectionAreaData$.cells.length) !== (previousState === null || previousState === void 0 || (_previousState$select2 = previousState.selectionAreaData) === null || _previousState$select2 === void 0 || (_previousState$select2 = _previousState$select2[0]) === null || _previousState$select2 === void 0 ? void 0 : _previousState$select2.cells.length)) {
|
83
|
-
selectionChanged = true;
|
84
|
-
}
|
85
|
-
if (!clickAndHoldActive && previousState !== null && previousState !== void 0 && previousState.clickAndHoldActive || selectionChanged) {
|
78
|
+
var _previousState$select;
|
79
|
+
if (!clickAndHoldActive && previousState !== null && previousState !== void 0 && previousState.clickAndHoldActive || (previousState === null || previousState === void 0 || (_previousState$select = previousState.selectionAreaData) === null || _previousState$select === void 0 ? void 0 : _previousState$select.length) !== (selectionAreaData === null || selectionAreaData === void 0 ? void 0 : selectionAreaData.length)) {
|
86
80
|
onSelectionAreaChange === null || onSelectionAreaChange === void 0 || onSelectionAreaChange(selectionAreaData);
|
87
81
|
}
|
88
82
|
}
|
@@ -157,8 +151,6 @@ var DataSpreadsheetBody = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
157
151
|
setClickAndHoldActive: setClickAndHoldActive,
|
158
152
|
setSelectionAreas: setSelectionAreas,
|
159
153
|
setValidStartingPoint: setValidStartingPoint,
|
160
|
-
selectedHeaderReorderActive: selectedHeaderReorderActive,
|
161
|
-
setSelectedHeaderReorderActive: setSelectedHeaderReorderActive,
|
162
154
|
validStartingPoint: validStartingPoint,
|
163
155
|
ref: ref,
|
164
156
|
setHeaderCellHoldActive: setHeaderCellHoldActive,
|
@@ -465,10 +457,6 @@ DataSpreadsheetBody.propTypes = {
|
|
465
457
|
* The scrollbar width
|
466
458
|
*/
|
467
459
|
scrollBarSize: PropTypes.number,
|
468
|
-
/**
|
469
|
-
* Header reordering is active
|
470
|
-
*/
|
471
|
-
selectedHeaderReorderActive: PropTypes.bool,
|
472
460
|
/**
|
473
461
|
* Array of selection area data
|
474
462
|
*/
|
@@ -505,10 +493,6 @@ DataSpreadsheetBody.propTypes = {
|
|
505
493
|
* Setter fn for header cell hold active value
|
506
494
|
*/
|
507
495
|
setHeaderCellHoldActive: PropTypes.func,
|
508
|
-
/**
|
509
|
-
* Set header reordering active or not
|
510
|
-
*/
|
511
|
-
setSelectedHeaderReorderActive: PropTypes.func,
|
512
496
|
/**
|
513
497
|
* Setter fn for selectionAreaData state value
|
514
498
|
*/
|
@@ -56,14 +56,6 @@ interface DataSpreadsheetHeaderProps {
|
|
56
56
|
* Setter fn for activeCellCoordinates value
|
57
57
|
*/
|
58
58
|
setActiveCellCoordinates?: Dispatch<SetStateAction<ActiveCellCoordinates | null>>;
|
59
|
-
/**
|
60
|
-
* Header reordering is active
|
61
|
-
*/
|
62
|
-
selectedHeaderReorderActive?: boolean;
|
63
|
-
/**
|
64
|
-
* Set header reordering active or not
|
65
|
-
*/
|
66
|
-
setSelectedHeaderReorderActive?: Dispatch<SetStateAction<boolean>>;
|
67
59
|
/**
|
68
60
|
* Setter fn for currentMatcher value
|
69
61
|
*/
|
@@ -31,8 +31,6 @@ var DataSpreadsheetHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
31
31
|
headerGroups = _ref.headerGroups,
|
32
32
|
scrollBarSize = _ref.scrollBarSize,
|
33
33
|
selectionAreas = _ref.selectionAreas,
|
34
|
-
selectedHeaderReorderActive = _ref.selectedHeaderReorderActive,
|
35
|
-
setSelectedHeaderReorderActive = _ref.setSelectedHeaderReorderActive,
|
36
34
|
setActiveCellCoordinates = _ref.setActiveCellCoordinates,
|
37
35
|
setCurrentMatcher = _ref.setCurrentMatcher,
|
38
36
|
setSelectionAreas = _ref.setSelectionAreas,
|
@@ -48,6 +46,10 @@ var DataSpreadsheetHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
48
46
|
_useState2 = _slicedToArray(_useState, 2),
|
49
47
|
scrollBarSizeValue = _useState2[0],
|
50
48
|
setScrollBarSizeValue = _useState2[1];
|
49
|
+
var _useState3 = useState(false),
|
50
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
51
|
+
selectedHeaderReorderActive = _useState4[0],
|
52
|
+
setSelectedHeaderReorderActive = _useState4[1];
|
51
53
|
var previousState = usePreviousValue({
|
52
54
|
cellSize: cellSize
|
53
55
|
}) || {};
|
@@ -105,16 +107,11 @@ var DataSpreadsheetHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
105
107
|
// Remove columns, need to call handleHeaderCellSelection
|
106
108
|
return;
|
107
109
|
}
|
110
|
+
setSelectedHeaderReorderActive(true);
|
108
111
|
var selectionAreaToClone = selectionAreas === null || selectionAreas === void 0 ? void 0 : selectionAreas.filter(function (item) {
|
109
112
|
return (item === null || item === void 0 ? void 0 : item.matcher) === currentMatcher;
|
110
113
|
});
|
111
114
|
var selectionAreaElement = ref.current.querySelector("[data-matcher-id=\"".concat(selectionAreaToClone === null || selectionAreaToClone === void 0 || (_selectionAreaToClone = selectionAreaToClone[0]) === null || _selectionAreaToClone === void 0 ? void 0 : _selectionAreaToClone.matcher, "\"]"));
|
112
|
-
if (selectionAreaElement) {
|
113
|
-
selectionAreaElement.classList.add("".concat(blockClass, "__selection-area--element"));
|
114
|
-
}
|
115
|
-
if (typeof setSelectedHeaderReorderActive === 'function') {
|
116
|
-
setSelectedHeaderReorderActive(true);
|
117
|
-
}
|
118
115
|
var clickXPosition = event.clientX;
|
119
116
|
var headerButtonCoords = event.target.getBoundingClientRect();
|
120
117
|
var headerIndex = event.target.getAttribute('data-column-index');
|
@@ -192,7 +189,7 @@ var DataSpreadsheetHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
192
189
|
"data-column-index": index,
|
193
190
|
tabIndex: -1,
|
194
191
|
onMouseDown: selectedHeader ? handleHeaderMouseDown(index) : undefined,
|
195
|
-
onMouseUp: selectedHeader
|
192
|
+
onMouseUp: selectedHeader ? function () {
|
196
193
|
return setSelectedHeaderReorderActive(false);
|
197
194
|
} : undefined,
|
198
195
|
onClick: !selectedHeader ? handleColumnHeaderClick(index) : undefined,
|
@@ -257,10 +254,6 @@ DataSpreadsheetHeader.propTypes = {
|
|
257
254
|
* The aria label applied to the Select all button
|
258
255
|
*/
|
259
256
|
selectAllAriaLabel: PropTypes.string.isRequired,
|
260
|
-
/**
|
261
|
-
* Header reordering is active
|
262
|
-
*/
|
263
|
-
selectedHeaderReorderActive: PropTypes.bool,
|
264
257
|
/**
|
265
258
|
* All of the cell selection area items
|
266
259
|
*/
|
@@ -278,10 +271,6 @@ DataSpreadsheetHeader.propTypes = {
|
|
278
271
|
* Setter fn for header cell hold active value
|
279
272
|
*/
|
280
273
|
setHeaderCellHoldActive: PropTypes.func,
|
281
|
-
/**
|
282
|
-
* Set header reordering active or not
|
283
|
-
*/
|
284
|
-
setSelectedHeaderReorderActive: PropTypes.func,
|
285
274
|
/**
|
286
275
|
* Setter fn for selectionAreaData state value
|
287
276
|
*/
|
@@ -40,12 +40,9 @@ var useSpreadsheetMouseMove = function useSpreadsheetMouseMove(_ref) {
|
|
40
40
|
var totalSpreadsheetScrollingWidth = listContainer.scrollWidth;
|
41
41
|
var clonedSelectionWidth = clonedSelectionElement.offsetWidth;
|
42
42
|
var clonePlacement = Math.max(xPositionRelativeToSpreadsheet - offsetXValue, defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeaderWidth);
|
43
|
-
var leftPosition = totalSpreadsheetScrollingWidth - clonedSelectionWidth >= clonePlacement ? clonePlacement + scrollAmount : totalSpreadsheetScrollingWidth - clonedSelectionWidth;
|
44
43
|
// Moves the position of the cloned selection area to follow mouse, and
|
45
44
|
// add the amount horizontally scrolled
|
46
|
-
|
47
|
-
clonedSelectionElement.style.left = px(leftPosition);
|
48
|
-
}
|
45
|
+
clonedSelectionElement.style.left = px(totalSpreadsheetScrollingWidth - clonedSelectionWidth >= clonePlacement ? clonePlacement + scrollAmount : totalSpreadsheetScrollingWidth - clonedSelectionWidth);
|
49
46
|
};
|
50
47
|
if (headerCellHoldActive) {
|
51
48
|
ref.current.addEventListener('mousemove', handleMouseMove);
|
@@ -1,8 +1,6 @@
|
|
1
|
-
export function useSpreadsheetMouseUp({ currentMatcher, setSelectionAreas,
|
1
|
+
export function useSpreadsheetMouseUp({ currentMatcher, setSelectionAreas, setClickAndHoldActive, setValidStartingPoint, validStartingPoint, blockClass, ref, setHeaderCellHoldActive, setColumnOrder, visibleColumns, setActiveCellCoordinates, activeCellCoordinates, rows, defaultColumn, selectionAreas, }: {
|
2
2
|
currentMatcher: any;
|
3
3
|
setSelectionAreas: any;
|
4
|
-
selectedHeaderReorderActive: any;
|
5
|
-
setSelectedHeaderReorderActive: any;
|
6
4
|
setClickAndHoldActive: any;
|
7
5
|
setValidStartingPoint: any;
|
8
6
|
validStartingPoint: any;
|
@@ -14,8 +14,6 @@ import { deepCloneObject } from '../../../global/js/utils/deepCloneObject.js';
|
|
14
14
|
var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
15
15
|
var currentMatcher = _ref.currentMatcher,
|
16
16
|
setSelectionAreas = _ref.setSelectionAreas,
|
17
|
-
selectedHeaderReorderActive = _ref.selectedHeaderReorderActive,
|
18
|
-
setSelectedHeaderReorderActive = _ref.setSelectedHeaderReorderActive,
|
19
17
|
setClickAndHoldActive = _ref.setClickAndHoldActive,
|
20
18
|
setValidStartingPoint = _ref.setValidStartingPoint,
|
21
19
|
validStartingPoint = _ref.validStartingPoint,
|
@@ -32,22 +30,15 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
32
30
|
selectionAreas = _ref.selectionAreas;
|
33
31
|
useEffect(function () {
|
34
32
|
var handleMouseUp = function handleMouseUp(event) {
|
35
|
-
var _selectionAreas$;
|
36
|
-
var isHoldingColumn = false;
|
37
|
-
if (selectionAreas !== null && selectionAreas !== void 0 && (_selectionAreas$ = selectionAreas[0]) !== null && _selectionAreas$ !== void 0 && _selectionAreas$.header && selectionAreas[0].header.type === 'column') {
|
38
|
-
isHoldingColumn = true;
|
39
|
-
}
|
40
33
|
// Remove the cloned selection area on mouse up
|
41
|
-
if (!validStartingPoint
|
34
|
+
if (!validStartingPoint) {
|
42
35
|
setHeaderCellHoldActive(false);
|
43
|
-
var selectionAreaElement = ref.current.querySelector(".".concat(blockClass, "__selection-area--element"));
|
44
36
|
var selectionAreaCloneElement = ref.current.querySelector(".".concat(blockClass, "__selection-area--element-cloned"));
|
45
37
|
if (!selectionAreaCloneElement) {
|
46
38
|
return;
|
47
39
|
}
|
48
40
|
// Mouse up while a cloned selection area exists/a column is being reordered
|
49
41
|
if (selectionAreaCloneElement) {
|
50
|
-
var _selectionAreaElement;
|
51
42
|
var closestCell = event.target.closest(".".concat(blockClass, "--interactive-cell-element"));
|
52
43
|
var newColumnIndex = parseInt === null || parseInt === void 0 ? void 0 : parseInt(closestCell === null || closestCell === void 0 ? void 0 : closestCell.getAttribute('data-column-index'));
|
53
44
|
var originalColumnIndex = parseInt === null || parseInt === void 0 ? void 0 : parseInt(selectionAreaCloneElement === null || selectionAreaCloneElement === void 0 ? void 0 : selectionAreaCloneElement.getAttribute('data-column-index-original'));
|
@@ -90,7 +81,6 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
90
81
|
selectionAreaClone[indexOfItemToUpdate].point1.column = Math.min.apply(Math, _toConsumableArray(newIndexArray));
|
91
82
|
selectionAreaClone[indexOfItemToUpdate].point2.column = Math.max.apply(Math, _toConsumableArray(newIndexArray));
|
92
83
|
}
|
93
|
-
selectionAreaClone[indexOfItemToUpdate].areaCreated = false;
|
94
84
|
return selectionAreaClone;
|
95
85
|
});
|
96
86
|
// Only reorder columns if the new index is _not_ part of the
|
@@ -135,13 +125,11 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
135
125
|
var indicatorLineElement = ref.current.querySelector(".".concat(blockClass, "__reorder-indicator-line"));
|
136
126
|
indicatorLineElement === null || indicatorLineElement === void 0 || indicatorLineElement.remove();
|
137
127
|
selectionAreaCloneElement === null || selectionAreaCloneElement === void 0 || selectionAreaCloneElement.remove();
|
138
|
-
selectionAreaElement === null || selectionAreaElement === void 0 || (_selectionAreaElement = selectionAreaElement.classList) === null || _selectionAreaElement === void 0 || _selectionAreaElement.remove("".concat(blockClass, "__selection-area--element"));
|
139
|
-
setSelectedHeaderReorderActive(false);
|
140
128
|
}
|
141
129
|
}
|
142
130
|
// Mouse up was on a spreadsheet body cell which is a valid
|
143
131
|
// start/end point for creating a selection area
|
144
|
-
if (validStartingPoint
|
132
|
+
if (validStartingPoint) {
|
145
133
|
setClickAndHoldActive(false);
|
146
134
|
setValidStartingPoint(false);
|
147
135
|
var cellButton = event.target.closest(".".concat(blockClass, "__body--td"));
|
@@ -170,7 +158,7 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
170
158
|
return function () {
|
171
159
|
document.removeEventListener('mouseup', handleMouseUp);
|
172
160
|
};
|
173
|
-
}, [blockClass, currentMatcher, setSelectionAreas, setClickAndHoldActive, setValidStartingPoint, validStartingPoint,
|
161
|
+
}, [blockClass, currentMatcher, setSelectionAreas, setClickAndHoldActive, setValidStartingPoint, validStartingPoint, ref, setHeaderCellHoldActive, setColumnOrder, visibleColumns, setActiveCellCoordinates, activeCellCoordinates, rows, defaultColumn, selectionAreas]);
|
174
162
|
};
|
175
163
|
|
176
164
|
export { useSpreadsheetMouseUp };
|
@@ -13,7 +13,7 @@ export interface PrevState {
|
|
13
13
|
cellEditorValue?: string;
|
14
14
|
activeCellCoordinates?: ActiveCellCoordinates;
|
15
15
|
isEditing?: boolean;
|
16
|
-
selectionAreaData?:
|
16
|
+
selectionAreaData?: object[];
|
17
17
|
clickAndHoldActive?: boolean;
|
18
18
|
rowHeight?: number;
|
19
19
|
cellSize?: Size;
|
@@ -22,43 +22,11 @@ var moveColumnIndicatorLine = function moveColumnIndicatorLine(_ref) {
|
|
22
22
|
var indicatorLineElement = ref.current.querySelector(".".concat(blockClass, "__reorder-indicator-line"));
|
23
23
|
var matcherId = clonedSelectionElement === null || clonedSelectionElement === void 0 ? void 0 : clonedSelectionElement.getAttribute('data-matcher-id');
|
24
24
|
var selectionAreaOrigin = ref.current.querySelector("[data-matcher-id=\"".concat(matcherId, "\"]"));
|
25
|
-
var listContainer = ref.current.querySelector(".".concat(blockClass, "__list--container"));
|
26
|
-
var scrollSpeed = 10; // Scrolling speed
|
27
|
-
var leftEdgeThreshold = 120; // Distance from the left edge to start scrolling
|
28
|
-
var rightEdgeThreshold = 100; // Distance from the right edge to start scrolling
|
29
|
-
|
30
|
-
var _event = event,
|
31
|
-
clientX = _event.clientX;
|
32
|
-
var _listContainer$getBou = listContainer.getBoundingClientRect(),
|
33
|
-
left = _listContainer$getBou.left,
|
34
|
-
right = _listContainer$getBou.right;
|
35
|
-
|
36
|
-
// Is near left side of viewport
|
37
|
-
if (clientX < leftEdgeThreshold) {
|
38
|
-
window.scrollBy(-scrollSpeed, 0);
|
39
|
-
}
|
40
|
-
|
41
|
-
// Is near right side of viewport
|
42
|
-
if (clientX > window.innerWidth - rightEdgeThreshold) {
|
43
|
-
window.scrollBy(scrollSpeed, 0);
|
44
|
-
}
|
45
|
-
|
46
|
-
// Is near left edge of table
|
47
|
-
if (clientX > left && clientX < left + leftEdgeThreshold) {
|
48
|
-
listContainer.scrollBy(-scrollSpeed, 0);
|
49
|
-
}
|
50
|
-
|
51
|
-
// Is near right edge of table
|
52
|
-
if (clientX < right && clientX > right - rightEdgeThreshold) {
|
53
|
-
listContainer.scrollBy(scrollSpeed, 0);
|
54
|
-
}
|
55
25
|
if (Number(newColumnIndex) > Number(originalColumnIndex)) {
|
56
|
-
|
57
|
-
indicatorLineElement.style.left = px(leftPosition);
|
26
|
+
indicatorLineElement.style.left = px(closestCellCoords.left - spreadsheetCoords.left + closestCell.offsetWidth - 2 + leftScrollAmount);
|
58
27
|
}
|
59
28
|
if (Number(newColumnIndex) < Number(originalColumnIndex)) {
|
60
|
-
|
61
|
-
indicatorLineElement.style.left = px(_leftPosition);
|
29
|
+
indicatorLineElement.style.left = px(closestCellCoords.left - spreadsheetCoords.left + leftScrollAmount);
|
62
30
|
}
|
63
31
|
if (Number(newColumnIndex) === Number(originalColumnIndex)) {
|
64
32
|
indicatorLineElement.style.left = selectionAreaOrigin.style.left;
|
@@ -5,10 +5,10 @@ import { RadioButtonProps } from '@carbon/react/lib/components/RadioButton/Radio
|
|
5
5
|
import { RadioButtonGroupProps } from '@carbon/react/lib/components/RadioButtonGroup/RadioButtonGroup';
|
6
6
|
import { CheckboxProps } from '@carbon/react/lib/components/Checkbox';
|
7
7
|
import { NumberInputProps } from '@carbon/react/lib/components/NumberInput/NumberInput';
|
8
|
-
import
|
9
|
-
import { Cell, Column, ColumnInstance, FilterValue, Filters, HeaderGroup, Meta, Row, TableCommonProps, TableDispatch, TableInstance, TableToggleAllRowsSelectedProps, UseExpandedRowProps, UseFiltersInstanceProps, UsePaginationInstanceProps, UseResizeColumnsColumnProps, UseResizeColumnsState, UseRowSelectInstanceProps, UseRowSelectRowProps, UseRowSelectState, UseSortByColumnProps,
|
8
|
+
import { CSSProperties, JSXElementConstructor, MutableRefObject, ReactNode, TouchEventHandler } from 'react';
|
9
|
+
import { Cell, Column, ColumnInstance, FilterValue, Filters, HeaderGroup, Meta, Row, TableCommonProps, TableDispatch, TableInstance, TableToggleAllRowsSelectedProps, UseExpandedRowProps, UseFiltersInstanceProps, UsePaginationInstanceProps, UseResizeColumnsColumnProps, UseResizeColumnsState, UseRowSelectInstanceProps, UseRowSelectRowProps, UseRowSelectState, UseSortByColumnProps, UseTableHooks } from 'react-table';
|
10
10
|
import { CarbonIconType } from '@carbon/react/icons';
|
11
|
-
import {
|
11
|
+
import { type ButtonProps } from '@carbon/react';
|
12
12
|
import { TableBatchActionsProps } from '@carbon/react/lib/components/DataTable/TableBatchActions';
|
13
13
|
export type Size = 'xs' | 'sm' | 'md' | 'lg';
|
14
14
|
export interface ResizerProps {
|
@@ -85,10 +85,9 @@ export interface DataGridToggleAllRowsProps extends TableToggleAllRowsSelectedPr
|
|
85
85
|
}
|
86
86
|
export interface DatagridTableHooks<T extends object = any> extends UseTableHooks<T> {
|
87
87
|
}
|
88
|
-
export interface DatagridColumn<T extends object = any> extends ColumnInstance<T
|
88
|
+
export interface DatagridColumn<T extends object = any> extends ColumnInstance<T> {
|
89
89
|
sticky?: 'left' | 'right';
|
90
90
|
className?: string;
|
91
|
-
rightAlignedColumn?: boolean;
|
92
91
|
disableSortBy?: boolean;
|
93
92
|
centerAlignedColumn?: boolean;
|
94
93
|
}
|
@@ -101,7 +100,6 @@ export interface DatagridRow<T extends object = any> extends Omit<Row<T>, 'cells
|
|
101
100
|
RowExpansionRenderer?: (state?: DataGridState) => void;
|
102
101
|
cells: Array<DataGridCell>;
|
103
102
|
isSkeleton?: boolean;
|
104
|
-
hasExpanded?: boolean;
|
105
103
|
}
|
106
104
|
export interface DataGridHeader<T extends object = any> extends ColumnInstance, UseResizeColumnsColumnProps<T>, UseSortByColumnProps<T> {
|
107
105
|
className(className: any, arg1: {
|
@@ -122,16 +120,6 @@ interface DataGridTableState extends UseResizeColumnsState<any>, UseRowSelectSta
|
|
122
120
|
}
|
123
121
|
export interface DataGridTableInstance<T extends object = any> extends TableInstance<T> {
|
124
122
|
}
|
125
|
-
export interface RowAction {
|
126
|
-
id?: string;
|
127
|
-
itemText?: string;
|
128
|
-
icon?: ComponentType | FunctionComponent;
|
129
|
-
align?: React.ComponentProps<typeof IconButton>['align'];
|
130
|
-
shouldHideMenuItem?: (...args: any[]) => void;
|
131
|
-
shouldDisableMenuItem?: (...args: any[]) => void;
|
132
|
-
disabled?: boolean;
|
133
|
-
onClick?: (...args: any[]) => void;
|
134
|
-
}
|
135
123
|
export interface DataGridState<T extends object = any> extends TableCommonProps, UsePaginationInstanceProps<T>, Omit<TableInstance<T>, 'state' | 'headers' | 'rows' | 'columns'>, Omit<UseFiltersInstanceProps<T>, 'rows'>, UseRowSelectInstanceProps<T>, Pick<UseRowSelectInstanceProps<T>, 'toggleAllRowsSelected'> {
|
136
124
|
withVirtualScroll?: boolean;
|
137
125
|
DatagridPagination?: JSXElementConstructor<any>;
|
@@ -154,7 +142,6 @@ export interface DataGridState<T extends object = any> extends TableCommonProps,
|
|
154
142
|
batchActions?: boolean;
|
155
143
|
row: DatagridRow;
|
156
144
|
rows: Array<DatagridRow<any>>;
|
157
|
-
rowActions?: RowAction[];
|
158
145
|
columns: Array<DatagridColumn>;
|
159
146
|
key?: any;
|
160
147
|
rowSize?: Size;
|
@@ -230,5 +217,4 @@ export interface ResizeHeaderProps {
|
|
230
217
|
isFetching?: boolean;
|
231
218
|
}
|
232
219
|
export type VisibleColumns<T extends object = {}> = (allColumns: Array<ColumnInstance<T>>, meta: Meta<T>) => Array<Column<T>>;
|
233
|
-
export type NodeFuncType = (props: any) => ReactNode;
|
234
220
|
export {};
|
@@ -1,9 +1,2 @@
|
|
1
|
-
/**
|
2
|
-
* Copyright IBM Corp. 2021, 2023
|
3
|
-
*
|
4
|
-
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
-
* LICENSE file in the root directory of this source tree.
|
6
|
-
*/
|
7
|
-
import { Hooks } from 'react-table';
|
8
|
-
declare const useActionsColumn: (hooks: Hooks) => void;
|
9
1
|
export default useActionsColumn;
|
2
|
+
declare function useActionsColumn(hooks: any): void;
|
@@ -17,10 +17,9 @@ var _excluded = ["align", "id", "itemText", "onClick", "icon", "shouldHideMenuIt
|
|
17
17
|
var blockClass = "".concat(pkg.prefix, "--datagrid");
|
18
18
|
var useActionsColumn = function useActionsColumn(hooks) {
|
19
19
|
var useAttachActionsOnInstance = function useAttachActionsOnInstance(instance) {
|
20
|
-
var
|
21
|
-
|
22
|
-
|
23
|
-
selectedRowIds = _ref.state.selectedRowIds;
|
20
|
+
var rowActions = instance.rowActions,
|
21
|
+
isFetching = instance.isFetching,
|
22
|
+
selectedRowIds = instance.state.selectedRowIds;
|
24
23
|
var getDisabledState = function getDisabledState(rowIndex) {
|
25
24
|
var selectedRowIndexes = Object.keys(selectedRowIds).map(function (n) {
|
26
25
|
return Number(n);
|
@@ -80,10 +79,10 @@ var useActionsColumn = function useActionsColumn(hooks) {
|
|
80
79
|
return;
|
81
80
|
}
|
82
81
|
e.stopPropagation();
|
83
|
-
_onClick
|
82
|
+
_onClick(id, row, e);
|
84
83
|
},
|
85
84
|
disabled: isDisabledByRow
|
86
|
-
}),
|
85
|
+
}), /*#__PURE__*/React__default.createElement(Icon, null)));
|
87
86
|
})), !isFetching && (rowActions.length > 2 || isColumnSticky) && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(OverflowMenu, {
|
88
87
|
align: "left",
|
89
88
|
size: "sm",
|
@@ -109,7 +108,7 @@ var useActionsColumn = function useActionsColumn(hooks) {
|
|
109
108
|
disabled: isDisabledByRow,
|
110
109
|
onClick: function onClick(e) {
|
111
110
|
e.stopPropagation();
|
112
|
-
_onClick2
|
111
|
+
_onClick2(id, row, e);
|
113
112
|
},
|
114
113
|
key: id
|
115
114
|
}));
|
@@ -1,9 +1,2 @@
|
|
1
|
-
/**
|
2
|
-
* Copyright IBM Corp. 2020, 2023
|
3
|
-
*
|
4
|
-
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
-
* LICENSE file in the root directory of this source tree.
|
6
|
-
*/
|
7
|
-
import { Hooks } from 'react-table';
|
8
|
-
declare const useColumnRightAlign: (hooks: Hooks) => void;
|
9
1
|
export default useColumnRightAlign;
|
2
|
+
declare function useColumnRightAlign(hooks: any): void;
|
@@ -13,17 +13,16 @@ import { pkg } from '../../settings.js';
|
|
13
13
|
var blockClass = "".concat(pkg.prefix, "--datagrid");
|
14
14
|
var useColumnRightAlign = function useColumnRightAlign(hooks) {
|
15
15
|
var RightAlignRenderer = function RightAlignRenderer(tableProps, column) {
|
16
|
-
var _tableProps$column, _column$Cell;
|
17
16
|
return /*#__PURE__*/React__default.createElement("div", {
|
18
17
|
className: cx("".concat(blockClass, "__right-align-cell-renderer"), {
|
19
|
-
sortDisabled: !tableProps.isTableSortable ||
|
18
|
+
sortDisabled: !tableProps.isTableSortable || tableProps.column.disableSortBy === true
|
20
19
|
})
|
21
|
-
}, column
|
20
|
+
}, column.Cell(tableProps));
|
22
21
|
};
|
23
22
|
var RightAlignHeader = function RightAlignHeader(headerProp, column) {
|
24
23
|
return /*#__PURE__*/React__default.createElement("div", {
|
25
24
|
className: "".concat(blockClass, "__right-align-header")
|
26
|
-
}, typeof column.Header === 'function' ?
|
25
|
+
}, typeof column.Header === 'function' ? column.Header(headerProp) : column.Header);
|
27
26
|
};
|
28
27
|
var rightAlignedColumns = function rightAlignedColumns(columns) {
|
29
28
|
var columnsWithDefaultCells = columns.map(function (column) {
|
@@ -15,30 +15,12 @@ var blockClass = "".concat(pkg.prefix, "--datagrid");
|
|
15
15
|
var useNestedRows = function useNestedRows(hooks) {
|
16
16
|
useNestedRowExpander(hooks);
|
17
17
|
var useInstance = function useInstance(instance) {
|
18
|
-
useEffect(function () {
|
19
|
-
var _ref = instance,
|
20
|
-
rows = _ref.rows;
|
21
|
-
var defaultExpandedRows = rows.filter(function (row) {
|
22
|
-
var _row$original;
|
23
|
-
return row === null || row === void 0 || (_row$original = row.original) === null || _row$original === void 0 ? void 0 : _row$original.defaultExpanded;
|
24
|
-
});
|
25
|
-
if (defaultExpandedRows !== null && defaultExpandedRows !== void 0 && defaultExpandedRows.length) {
|
26
|
-
defaultExpandedRows.map(function (defaultExpandedRow) {
|
27
|
-
if (!(defaultExpandedRow !== null && defaultExpandedRow !== void 0 && defaultExpandedRow.isExpanded) && !(defaultExpandedRow !== null && defaultExpandedRow !== void 0 && defaultExpandedRow.hasExpanded)) {
|
28
|
-
var _defaultExpandedRow$t;
|
29
|
-
defaultExpandedRow === null || defaultExpandedRow === void 0 || (_defaultExpandedRow$t = defaultExpandedRow.toggleRowExpanded) === null || _defaultExpandedRow$t === void 0 || _defaultExpandedRow$t.call(defaultExpandedRow);
|
30
|
-
defaultExpandedRow.hasExpanded = true;
|
31
|
-
return;
|
32
|
-
}
|
33
|
-
});
|
34
|
-
}
|
35
|
-
}, [instance, instance.rows]);
|
36
18
|
// This useEffect will expand rows if they exist in the initialState obj
|
37
19
|
useEffect(function () {
|
38
20
|
var rows = instance.rows,
|
39
21
|
initialState = instance.initialState;
|
40
|
-
var
|
41
|
-
expandedRowIds =
|
22
|
+
var _ref = initialState,
|
23
|
+
expandedRowIds = _ref.expandedRowIds;
|
42
24
|
if (expandedRowIds) {
|
43
25
|
Object.keys(expandedRowIds).forEach(function (key) {
|
44
26
|
var row = rows.filter(function (r) {
|
@@ -52,14 +34,14 @@ var useNestedRows = function useNestedRows(hooks) {
|
|
52
34
|
}
|
53
35
|
}, [instance]);
|
54
36
|
var marginLeft = 24;
|
55
|
-
var getRowProps = function getRowProps(props,
|
56
|
-
var row =
|
37
|
+
var getRowProps = function getRowProps(props, _ref2) {
|
38
|
+
var row = _ref2.row;
|
57
39
|
return [props, {
|
58
40
|
className: cx(_defineProperty(_defineProperty({}, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded))
|
59
41
|
}];
|
60
42
|
};
|
61
|
-
var getRowStyles = function getRowStyles(props,
|
62
|
-
var row =
|
43
|
+
var getRowStyles = function getRowStyles(props, _ref3) {
|
44
|
+
var row = _ref3.row;
|
63
45
|
return [props, {
|
64
46
|
style: {
|
65
47
|
paddingLeft: "".concat(row.depth > 1 ? marginLeft * 2 + (row.depth - 1) * (marginLeft + marginLeft / 3) : row.depth === 1 ? marginLeft * 2 : 0, "px")
|
@@ -69,9 +51,9 @@ var useNestedRows = function useNestedRows(hooks) {
|
|
69
51
|
var getIndentation = function getIndentation(depth) {
|
70
52
|
return 32 * depth + 16;
|
71
53
|
}; // row indentation padding
|
72
|
-
var getCellProps = function getCellProps(props,
|
73
|
-
var cell =
|
74
|
-
instance =
|
54
|
+
var getCellProps = function getCellProps(props, _ref4) {
|
55
|
+
var cell = _ref4.cell,
|
56
|
+
instance = _ref4.instance;
|
75
57
|
// we add a dynamic -ve margin right only if the cell is resized below minimum width i.e 50px, else we set the width based on indentation at different levels
|
76
58
|
var isFirstCell = instance.columns.findIndex(function (c) {
|
77
59
|
return c.id === cell.column.id;
|
@@ -87,8 +87,7 @@ Decorator.propTypes = {
|
|
87
87
|
*/
|
88
88
|
small: PropTypes.bool,
|
89
89
|
/**
|
90
|
-
*
|
91
|
-
* Useful if you want "invert" the component's theme.
|
90
|
+
* Determines the theme of the component.
|
92
91
|
*/
|
93
92
|
theme: PropTypes.oneOf(['light', 'dark']),
|
94
93
|
/**
|