@procore/data-table 13.0.0 → 13.1.0
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/CHANGELOG.md +11 -0
- package/dist/legacy/index.js +202 -157
- package/dist/legacy/index.mjs +204 -159
- package/dist/modern/index.js +188 -140
- package/dist/modern/index.mjs +190 -142
- package/package.json +1 -1
package/dist/legacy/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import React82, { forwardRef, useContext, useRef,
|
|
2
|
-
import { startsWith, equals, omit, isNil, mergeDeepLeft,
|
|
1
|
+
import React82, { useState, forwardRef, useContext, useRef, useImperativeHandle, useLayoutEffect, useCallback, useMemo, memo, useEffect, Component as Component$1, createElement } from 'react';
|
|
2
|
+
import { startsWith, equals, omit, isNil, mergeDeepLeft, intersection, isEmpty, groupBy } from 'ramda';
|
|
3
3
|
import { useI18nContext, Select, Input, UNSAFE_useOverlayTriggerContext, Card, Flex, Box, SegmentedController, Calendar, useDateTime, OverlayTrigger, isEventSource, DateInput, UNSAFE_isValidYearRange, DateSelect, PillSelect, TextArea, UNSAFE_useMenuImperativeControlNavigation, UNSAFE_Menu, UNSAFE_menuItemsWrapperAttribute, Spinner, FlexList, Typography, Tooltip, Button, Required, colors, Form, spacing, Switch, Panel, UNSAFE_StyledFilterTokenLabel, typographyWeights, SelectButton, StyledSelectButton, StyledSelectButtonLabel, StyledButton, StyledSelectArrow, Popover, UNSAFE_StyledSuperSelectTrigger, UNSAFE_StyledSuperSelectLabel, UNSAFE_StyledSuperSelectArrow, DateTimeProvider, useField, Label, UNSAFE_mergeRefs, ContactItem as ContactItem$1, ToggleButton, Pagination, Link, AvatarStack, Pill, Typeahead, UNSAFE_FilterToken, useI18n, I18nContext, UNSAFE_SuperSelect, Avatar, MultiSelect, H3, Checkbox, useVisibility, UNSAFE_useSuperSelectContext, DropdownFlyout, StyledDropdownFlyoutLabel, StyledDropdownFlyoutExpandIcon, EmptyState as EmptyState$1 } from '@procore/core-react';
|
|
4
4
|
import classnames from 'classnames/bind';
|
|
5
5
|
import { Error as Error$1, Grip, Pencil, Building, Calendar as Calendar$1, CaretsInVertical, CaretsOutVertical, CaretsOutVerticalWithLine, CaretsIn, CaretsOut, ArrowDown, ArrowUp, CaretDown, CaretRight } from '@procore/core-icons';
|
|
@@ -55147,7 +55147,7 @@ function getAffectedRows(currentRows, selectionNode, affectedRows) {
|
|
|
55147
55147
|
var _a;
|
|
55148
55148
|
const isNodeRootLevel = isNodeRootLevelOfGrid(selectionNode.parent);
|
|
55149
55149
|
const nodeId = selectionNode.id;
|
|
55150
|
-
const
|
|
55150
|
+
const isRowSelected2 = !!selectionNode.isSelected();
|
|
55151
55151
|
const parentChildrenMap = {};
|
|
55152
55152
|
if (selectionNode.group || ((_a = selectionNode.parent) == null ? void 0 : _a.group) && !isNodeRootLevel) {
|
|
55153
55153
|
currentRows.forEach((row) => {
|
|
@@ -55166,7 +55166,7 @@ function getAffectedRows(currentRows, selectionNode, affectedRows) {
|
|
|
55166
55166
|
}
|
|
55167
55167
|
});
|
|
55168
55168
|
}
|
|
55169
|
-
const selectedState =
|
|
55169
|
+
const selectedState = isRowSelected2 ? rowSelectionState.selected : rowSelectionState.unselected;
|
|
55170
55170
|
affectedRows[nodeId] = {
|
|
55171
55171
|
node: selectionNode,
|
|
55172
55172
|
selectedState
|
|
@@ -55212,7 +55212,7 @@ function getAffectedRows(currentRows, selectionNode, affectedRows) {
|
|
|
55212
55212
|
).forEach((node) => {
|
|
55213
55213
|
affectedRows[node.id] = {
|
|
55214
55214
|
node,
|
|
55215
|
-
selectedState:
|
|
55215
|
+
selectedState: isRowSelected2 ? rowSelectionState.selected : rowSelectionState.unselected
|
|
55216
55216
|
};
|
|
55217
55217
|
});
|
|
55218
55218
|
}
|
|
@@ -55274,7 +55274,8 @@ function getSelectedState(node, affectedRows) {
|
|
|
55274
55274
|
function ServerSideRowCheckbox(props) {
|
|
55275
55275
|
var _a, _b, _c, _d;
|
|
55276
55276
|
const { rowSelectionRef } = useInternalTableContext();
|
|
55277
|
-
const indeterminate = ((_b = (_a = rowSelectionRef.current) == null ? void 0 : _a.affectedRows[props.node.id]) == null ? void 0 : _b.selectedState) === "indeterminate"
|
|
55277
|
+
const indeterminate = ((_b = (_a = rowSelectionRef.current) == null ? void 0 : _a.affectedRows[props.node.id]) == null ? void 0 : _b.selectedState) === "indeterminate";
|
|
55278
|
+
const { tableRef } = useInternalTableContext();
|
|
55278
55279
|
const checked = getSelectedState(
|
|
55279
55280
|
props.node,
|
|
55280
55281
|
(_c = rowSelectionRef.current) == null ? void 0 : _c.affectedRows
|
|
@@ -55288,7 +55289,8 @@ function ServerSideRowCheckbox(props) {
|
|
|
55288
55289
|
"data-qa": "rowCheckbox",
|
|
55289
55290
|
onClick: noop2,
|
|
55290
55291
|
onChange: () => {
|
|
55291
|
-
|
|
55292
|
+
var _a2, _b2;
|
|
55293
|
+
props.node.isSelected() ? (_a2 = tableRef == null ? void 0 : tableRef.current) == null ? void 0 : _a2.deselectRows([props.node.id]) : (_b2 = tableRef == null ? void 0 : tableRef.current) == null ? void 0 : _b2.selectRows([props.node.id]);
|
|
55292
55294
|
}
|
|
55293
55295
|
}
|
|
55294
55296
|
));
|
|
@@ -55685,19 +55687,32 @@ var DataTableCellRenderer = ({
|
|
|
55685
55687
|
)
|
|
55686
55688
|
));
|
|
55687
55689
|
};
|
|
55690
|
+
function getStartingValue(eventKey, editorType, existingValue) {
|
|
55691
|
+
if (eventKey && editorType === "input" && eventKey !== "Enter") {
|
|
55692
|
+
if (eventKey === "Backspace") {
|
|
55693
|
+
return "";
|
|
55694
|
+
}
|
|
55695
|
+
return eventKey;
|
|
55696
|
+
}
|
|
55697
|
+
return existingValue;
|
|
55698
|
+
}
|
|
55688
55699
|
var DataTableCellEditor = React82.forwardRef(
|
|
55689
55700
|
({
|
|
55701
|
+
api,
|
|
55690
55702
|
colDef,
|
|
55691
55703
|
Component: Component4,
|
|
55692
55704
|
context,
|
|
55693
55705
|
data,
|
|
55694
55706
|
editorType,
|
|
55707
|
+
eventKey,
|
|
55695
55708
|
node,
|
|
55696
55709
|
parseValue,
|
|
55697
55710
|
stopEditing,
|
|
55698
55711
|
value
|
|
55699
55712
|
}, ref) => {
|
|
55700
55713
|
var _a;
|
|
55714
|
+
const startingValue = getStartingValue(eventKey, editorType, value);
|
|
55715
|
+
const [currentValue, setCurrentValue] = useState(startingValue);
|
|
55701
55716
|
const { rowHeight, tableRef } = useInternalTableContext();
|
|
55702
55717
|
const inlineEditorRef = React82.useRef(null);
|
|
55703
55718
|
const inputRef = React82.useRef(null);
|
|
@@ -55735,19 +55750,39 @@ var DataTableCellEditor = React82.forwardRef(
|
|
|
55735
55750
|
}
|
|
55736
55751
|
};
|
|
55737
55752
|
});
|
|
55753
|
+
function handleKeyDown(event) {
|
|
55754
|
+
if (node.rowIndex !== null && colDef.field && editorType === "input" && !event.shiftKey && !event.metaKey && !event.altKey && !event.ctrlKey) {
|
|
55755
|
+
if (event.key === "ArrowUp") {
|
|
55756
|
+
stopEditing(true);
|
|
55757
|
+
api.setFocusedCell(node.rowIndex - 1, colDef.field, node.rowPinned);
|
|
55758
|
+
} else if (event.key === "ArrowDown" || event.key === "Enter") {
|
|
55759
|
+
stopEditing(true);
|
|
55760
|
+
api.setFocusedCell(node.rowIndex + 1, colDef.field, node.rowPinned);
|
|
55761
|
+
}
|
|
55762
|
+
}
|
|
55763
|
+
}
|
|
55738
55764
|
React82.useEffect(() => {
|
|
55739
|
-
var _a2, _b, _c, _d, _e, _f, _g;
|
|
55765
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
55740
55766
|
if (editorType === "input") {
|
|
55741
|
-
(
|
|
55742
|
-
|
|
55767
|
+
if (eventKey) {
|
|
55768
|
+
(_a2 = inputRef.current) == null ? void 0 : _a2.focus();
|
|
55769
|
+
} else {
|
|
55770
|
+
(_b = inputRef.current) == null ? void 0 : _b.select();
|
|
55771
|
+
}
|
|
55772
|
+
(_c = inlineEditorRef.current) == null ? void 0 : _c.show();
|
|
55773
|
+
(_d = inputRef.current) == null ? void 0 : _d.addEventListener("keydown", handleKeyDown);
|
|
55743
55774
|
} else if (editorType === "textarea") {
|
|
55744
|
-
(
|
|
55745
|
-
(
|
|
55775
|
+
(_e = textAreaRef.current) == null ? void 0 : _e.select();
|
|
55776
|
+
(_f = inlineEditorRef.current) == null ? void 0 : _f.show();
|
|
55746
55777
|
} else {
|
|
55747
|
-
(
|
|
55748
|
-
(
|
|
55749
|
-
(
|
|
55778
|
+
(_g = selectRef.current) == null ? void 0 : _g.click();
|
|
55779
|
+
(_h = selectRef.current) == null ? void 0 : _h.focus();
|
|
55780
|
+
(_i = inlineEditorRef.current) == null ? void 0 : _i.show();
|
|
55750
55781
|
}
|
|
55782
|
+
return () => {
|
|
55783
|
+
var _a3;
|
|
55784
|
+
(_a3 = inputRef.current) == null ? void 0 : _a3.removeEventListener("keydown", handleKeyDown);
|
|
55785
|
+
};
|
|
55751
55786
|
}, []);
|
|
55752
55787
|
const handleRefs = (editorType2) => {
|
|
55753
55788
|
const getRef = (refType) => UNSAFE_mergeRefs(refType, ref);
|
|
@@ -55778,10 +55813,13 @@ var DataTableCellEditor = React82.forwardRef(
|
|
|
55778
55813
|
parentId: context == null ? void 0 : context.parentId,
|
|
55779
55814
|
rowPinned: node.rowPinned,
|
|
55780
55815
|
rowHeight,
|
|
55781
|
-
setDataValue: (field, newValue) =>
|
|
55816
|
+
setDataValue: (field, newValue) => {
|
|
55817
|
+
node.setDataValue(field, newValue);
|
|
55818
|
+
setCurrentValue(newValue);
|
|
55819
|
+
},
|
|
55782
55820
|
stopEditing,
|
|
55783
55821
|
tableApi: tableRef == null ? void 0 : tableRef.current,
|
|
55784
|
-
value,
|
|
55822
|
+
value: currentValue,
|
|
55785
55823
|
ref: handleRefs(editorType)
|
|
55786
55824
|
}
|
|
55787
55825
|
)
|
|
@@ -56157,12 +56195,15 @@ var SortComponent = (props) => {
|
|
|
56157
56195
|
}
|
|
56158
56196
|
return null;
|
|
56159
56197
|
};
|
|
56198
|
+
var isRowSelected = (rowNode) => {
|
|
56199
|
+
return Boolean(rowNode.selectable ? rowNode.isSelected() : true);
|
|
56200
|
+
};
|
|
56160
56201
|
var GenericHeaderRenderer = (props) => {
|
|
56161
56202
|
var _a;
|
|
56162
56203
|
const colDef = props.column.getColDef();
|
|
56163
56204
|
const HeaderNode = (_a = colDef.headerComponentParams) == null ? void 0 : _a.headerNode;
|
|
56164
56205
|
const I18n = useI18nContext();
|
|
56165
|
-
const { columnApi, gridApi, onServerSideDataRequest } = useInternalTableContext();
|
|
56206
|
+
const { columnApi, tableRef, gridApi, onServerSideDataRequest } = useInternalTableContext();
|
|
56166
56207
|
const onSSDR = Boolean(onServerSideDataRequest);
|
|
56167
56208
|
const [sortOrder, setSortOrder] = React82.useState(props.column.getSort());
|
|
56168
56209
|
const [isFirstColumn2, setIsFirstColumn] = React82.useState(false);
|
|
@@ -56197,9 +56238,11 @@ var GenericHeaderRenderer = (props) => {
|
|
|
56197
56238
|
};
|
|
56198
56239
|
}, []);
|
|
56199
56240
|
const onSortToggled = (event) => {
|
|
56200
|
-
var _a2;
|
|
56241
|
+
var _a2, _b, _c;
|
|
56201
56242
|
let currentSort = null;
|
|
56202
|
-
if (
|
|
56243
|
+
if (Array.from(((_b = (_a2 = checkbox.current) == null ? void 0 : _a2.parentElement) == null ? void 0 : _b.children) || []).includes(
|
|
56244
|
+
(_c = event.target) == null ? void 0 : _c.parentElement
|
|
56245
|
+
)) {
|
|
56203
56246
|
return;
|
|
56204
56247
|
}
|
|
56205
56248
|
if (props.enableSorting) {
|
|
@@ -56251,6 +56294,9 @@ var GenericHeaderRenderer = (props) => {
|
|
|
56251
56294
|
}, [props.column]);
|
|
56252
56295
|
const [isExpandable, setIsExpandable] = React82.useState(false);
|
|
56253
56296
|
React82.useEffect(() => {
|
|
56297
|
+
if (onSSDR) {
|
|
56298
|
+
return;
|
|
56299
|
+
}
|
|
56254
56300
|
const hasExpandableNodes = !!findNode(
|
|
56255
56301
|
(node) => node.isExpandable(),
|
|
56256
56302
|
props.api
|
|
@@ -56378,14 +56424,9 @@ var GenericHeaderRenderer = (props) => {
|
|
|
56378
56424
|
return;
|
|
56379
56425
|
}
|
|
56380
56426
|
function updateSelectAllCheckbox() {
|
|
56381
|
-
const
|
|
56382
|
-
const
|
|
56383
|
-
|
|
56384
|
-
);
|
|
56385
|
-
const isAllSelected = currentPageIds.every(
|
|
56386
|
-
(id) => selectedRowIds.includes(id)
|
|
56387
|
-
);
|
|
56388
|
-
const isPartialSelected = !isAllSelected && currentPageIds.some((id) => selectedRowIds.includes(id));
|
|
56427
|
+
const currentRows = getCurrentRows(gridApi);
|
|
56428
|
+
const isAllSelected = currentRows.length && currentRows.every(isRowSelected);
|
|
56429
|
+
const isPartialSelected = !isAllSelected && currentRows.some(isRowSelected);
|
|
56389
56430
|
if (isAllSelected) {
|
|
56390
56431
|
setSelectAll("all" /* All */);
|
|
56391
56432
|
} else if (isPartialSelected) {
|
|
@@ -56397,55 +56438,20 @@ var GenericHeaderRenderer = (props) => {
|
|
|
56397
56438
|
props.api.addEventListener(selectionChanged, updateSelectAllCheckbox);
|
|
56398
56439
|
props.api.addEventListener(paginationChanged, updateSelectAllCheckbox);
|
|
56399
56440
|
return () => {
|
|
56400
|
-
props.api.removeEventListener(
|
|
56401
|
-
|
|
56402
|
-
updateSelectAllCheckbox
|
|
56403
|
-
);
|
|
56404
|
-
props.api.removeEventListener(
|
|
56405
|
-
"paginationChanged",
|
|
56406
|
-
updateSelectAllCheckbox
|
|
56407
|
-
);
|
|
56441
|
+
props.api.removeEventListener(selectionChanged, updateSelectAllCheckbox);
|
|
56442
|
+
props.api.removeEventListener(paginationChanged, updateSelectAllCheckbox);
|
|
56408
56443
|
};
|
|
56409
56444
|
}, [isFirstColumn2, selectAll, props.selectionSSREnabled]);
|
|
56410
|
-
const
|
|
56411
|
-
|
|
56412
|
-
const
|
|
56413
|
-
|
|
56414
|
-
|
|
56415
|
-
const
|
|
56416
|
-
|
|
56417
|
-
|
|
56418
|
-
|
|
56419
|
-
|
|
56420
|
-
return [...Array(endPageIndex - startPageIndex + 1).keys()].map(
|
|
56421
|
-
(index) => {
|
|
56422
|
-
var _a2, _b;
|
|
56423
|
-
return (_b = (_a2 = props.api.getDisplayedRowAtIndex(index + startPageIndex)) == null ? void 0 : _a2.data) == null ? void 0 : _b.id;
|
|
56424
|
-
}
|
|
56425
|
-
);
|
|
56426
|
-
};
|
|
56427
|
-
const handleSSRSelectAll = (param) => {
|
|
56428
|
-
var _a2;
|
|
56429
|
-
if (!props.selectionSSREnabled) {
|
|
56430
|
-
return;
|
|
56431
|
-
}
|
|
56432
|
-
const selectedRowIds = (props.api.getSelectedRows() ?? []).map(
|
|
56433
|
-
({ id }) => id
|
|
56434
|
-
);
|
|
56435
|
-
const currentPageIds = getCurrentPageIds();
|
|
56436
|
-
if (param === "all" /* All */) {
|
|
56437
|
-
(_a2 = [.../* @__PURE__ */ new Set([...selectedRowIds, ...currentPageIds])]) == null ? void 0 : _a2.forEach(
|
|
56438
|
-
(id) => {
|
|
56439
|
-
var _a3;
|
|
56440
|
-
(_a3 = props.api.getRowNode(id.toString())) == null ? void 0 : _a3.setSelected(true);
|
|
56441
|
-
}
|
|
56442
|
-
);
|
|
56443
|
-
}
|
|
56444
|
-
if (param === "none" /* None */) {
|
|
56445
|
-
currentPageIds.forEach((id) => {
|
|
56446
|
-
var _a3;
|
|
56447
|
-
(_a3 = props.api.getRowNode(id.toString())) == null ? void 0 : _a3.setSelected(false);
|
|
56448
|
-
});
|
|
56445
|
+
const toggleSelectAll = () => {
|
|
56446
|
+
var _a2, _b, _c;
|
|
56447
|
+
const nextSelectedState = selectAll === "all" /* All */ ? "none" /* None */ : "all" /* All */;
|
|
56448
|
+
setSelectAll(nextSelectedState);
|
|
56449
|
+
(_a2 = props.onSelectAll) == null ? void 0 : _a2.call(props, nextSelectedState);
|
|
56450
|
+
const isSelectAll = nextSelectedState == "all" /* All */;
|
|
56451
|
+
if (props.selectionSSREnabled) {
|
|
56452
|
+
isSelectAll ? (_b = tableRef == null ? void 0 : tableRef.current) == null ? void 0 : _b.selectAll() : (_c = tableRef == null ? void 0 : tableRef.current) == null ? void 0 : _c.deselectAll();
|
|
56453
|
+
} else {
|
|
56454
|
+
isSelectAll ? props.api.selectAllFiltered() : props.api.deselectAllFiltered();
|
|
56449
56455
|
}
|
|
56450
56456
|
};
|
|
56451
56457
|
return /* @__PURE__ */ React82.createElement(
|
|
@@ -56484,16 +56490,7 @@ var GenericHeaderRenderer = (props) => {
|
|
|
56484
56490
|
indeterminate: selectAll === "partial",
|
|
56485
56491
|
onClick: (e) => e.stopPropagation(),
|
|
56486
56492
|
onChange: () => {
|
|
56487
|
-
|
|
56488
|
-
if (selectAll === "all" /* All */) {
|
|
56489
|
-
setSelectAll("none" /* None */);
|
|
56490
|
-
(_a2 = props.onSelectAll) == null ? void 0 : _a2.call(props, "none" /* None */);
|
|
56491
|
-
onSSDR ? handleSSRSelectAll("none" /* None */) : props.api.deselectAllFiltered();
|
|
56492
|
-
} else {
|
|
56493
|
-
setSelectAll("all" /* All */);
|
|
56494
|
-
(_b = props.onSelectAll) == null ? void 0 : _b.call(props, "all" /* All */);
|
|
56495
|
-
onSSDR ? handleSSRSelectAll("all" /* All */) : props.api.selectAllFiltered();
|
|
56496
|
-
}
|
|
56493
|
+
toggleSelectAll();
|
|
56497
56494
|
}
|
|
56498
56495
|
}
|
|
56499
56496
|
),
|
|
@@ -58777,18 +58774,31 @@ var ClientSideRowModelModule = {
|
|
|
58777
58774
|
rowModel: "clientSide",
|
|
58778
58775
|
beans: [ClientSideRowModel, FilterStage, SortStage, FlattenStage, SortService, FilterService, ImmutableService]
|
|
58779
58776
|
};
|
|
58777
|
+
var getSelectedRows = ({
|
|
58778
|
+
gridApi,
|
|
58779
|
+
rowSelectionRef
|
|
58780
|
+
}) => {
|
|
58781
|
+
var _a;
|
|
58782
|
+
const serverSideRows = Object.values(
|
|
58783
|
+
((_a = rowSelectionRef == null ? void 0 : rowSelectionRef.current) == null ? void 0 : _a.affectedRows) || {}
|
|
58784
|
+
).filter(
|
|
58785
|
+
(affectedRow) => affectedRow.selectedState === rowSelectionState.selected
|
|
58786
|
+
).map((affectedRow) => affectedRow.node);
|
|
58787
|
+
return (gridApi == null ? void 0 : gridApi.getModel().getType()) === "serverSide" ? serverSideRows : (gridApi == null ? void 0 : gridApi.getSelectedNodes()) ?? [];
|
|
58788
|
+
};
|
|
58780
58789
|
var useRowSelectionState = () => {
|
|
58781
58790
|
const [selectedRows, setSelectedRows] = React82.useState([]);
|
|
58782
|
-
const { gridApi } = useInternalTableContext();
|
|
58791
|
+
const { gridApi, rowSelectionRef } = useInternalTableContext();
|
|
58783
58792
|
React82.useEffect(() => {
|
|
58784
58793
|
function selectionEventFunction() {
|
|
58785
|
-
|
|
58786
|
-
setSelectedRows(rows);
|
|
58794
|
+
setSelectedRows(getSelectedRows({ gridApi, rowSelectionRef }));
|
|
58787
58795
|
}
|
|
58788
58796
|
selectionEventFunction();
|
|
58789
58797
|
gridApi == null ? void 0 : gridApi.addEventListener("selectionChanged", selectionEventFunction);
|
|
58798
|
+
gridApi == null ? void 0 : gridApi.addEventListener("paginationChanged", selectionEventFunction);
|
|
58790
58799
|
return () => {
|
|
58791
58800
|
gridApi == null ? void 0 : gridApi.removeEventListener("selectionChanged", selectionEventFunction);
|
|
58801
|
+
gridApi == null ? void 0 : gridApi.removeEventListener("paginationChanged", selectionEventFunction);
|
|
58792
58802
|
};
|
|
58793
58803
|
}, [gridApi]);
|
|
58794
58804
|
return selectedRows;
|
|
@@ -75696,6 +75706,7 @@ var useTableApi = ({
|
|
|
75696
75706
|
filterStorage,
|
|
75697
75707
|
onTableConfigChange,
|
|
75698
75708
|
rowHeight,
|
|
75709
|
+
rowSelectionRef,
|
|
75699
75710
|
setRowHeight: internalSetRowHeight,
|
|
75700
75711
|
searchStorage
|
|
75701
75712
|
} = useInternalTableContext();
|
|
@@ -75830,11 +75841,11 @@ var useTableApi = ({
|
|
|
75830
75841
|
columnDefinition: colDef,
|
|
75831
75842
|
node: { rowPinned: false },
|
|
75832
75843
|
data: {}
|
|
75833
|
-
})
|
|
75844
|
+
})
|
|
75834
75845
|
);
|
|
75835
75846
|
}
|
|
75836
75847
|
if (typeof colDef.bulkEditable === "boolean") {
|
|
75837
|
-
return colDef.bulkEditable
|
|
75848
|
+
return colDef.bulkEditable;
|
|
75838
75849
|
}
|
|
75839
75850
|
if (typeof colDef.editable === "function") {
|
|
75840
75851
|
return (
|
|
@@ -75846,7 +75857,7 @@ var useTableApi = ({
|
|
|
75846
75857
|
columnDefinition: colDef,
|
|
75847
75858
|
node: { rowPinned: false },
|
|
75848
75859
|
data: {}
|
|
75849
|
-
})
|
|
75860
|
+
})
|
|
75850
75861
|
);
|
|
75851
75862
|
}
|
|
75852
75863
|
return colDef.editable === true;
|
|
@@ -76021,14 +76032,59 @@ var useTableApi = ({
|
|
|
76021
76032
|
[internalSetRowHeight]
|
|
76022
76033
|
);
|
|
76023
76034
|
const gridApiMethods = React82.useMemo(
|
|
76024
|
-
() => buildPartialTableApi({
|
|
76035
|
+
() => buildPartialTableApi({
|
|
76036
|
+
gridApi,
|
|
76037
|
+
columnApi,
|
|
76038
|
+
rowHeight,
|
|
76039
|
+
filterStorage,
|
|
76040
|
+
rowSelectionRef
|
|
76041
|
+
}),
|
|
76025
76042
|
[columnApi, gridApi, rowHeight, filterStorage]
|
|
76026
76043
|
);
|
|
76044
|
+
const onSelectionChanged = (rowNode) => {
|
|
76045
|
+
var _a;
|
|
76046
|
+
const isGrouped = rowNode.group || ((_a = rowNode.parent) == null ? void 0 : _a.group) && !isNodeRootLevelOfGrid(rowNode.parent);
|
|
76047
|
+
const currAffectedRows = rowSelectionRef.current.affectedRows;
|
|
76048
|
+
if (!isGrouped) {
|
|
76049
|
+
rowSelectionRef.current.affectedRows = {
|
|
76050
|
+
...currAffectedRows,
|
|
76051
|
+
[rowNode.id]: {
|
|
76052
|
+
node: rowNode,
|
|
76053
|
+
selectedState: rowNode.isSelected() ? rowSelectionState.selected : rowSelectionState.unselected
|
|
76054
|
+
}
|
|
76055
|
+
};
|
|
76056
|
+
gridApi == null ? void 0 : gridApi.redrawRows({ rowNodes: [rowNode] });
|
|
76057
|
+
return;
|
|
76058
|
+
}
|
|
76059
|
+
const rowsToUpdate = getAffectedRows(
|
|
76060
|
+
getCurrentRows(gridApi),
|
|
76061
|
+
rowNode,
|
|
76062
|
+
currAffectedRows
|
|
76063
|
+
);
|
|
76064
|
+
const rowValues = Object.values(rowsToUpdate);
|
|
76065
|
+
rowValues.forEach((row) => {
|
|
76066
|
+
row.node.setSelected(
|
|
76067
|
+
row.selectedState === rowSelectionState.selected,
|
|
76068
|
+
false,
|
|
76069
|
+
"checkboxSelected"
|
|
76070
|
+
);
|
|
76071
|
+
});
|
|
76072
|
+
rowSelectionRef.current.affectedRows = {
|
|
76073
|
+
...currAffectedRows,
|
|
76074
|
+
...rowsToUpdate
|
|
76075
|
+
};
|
|
76076
|
+
gridApi == null ? void 0 : gridApi.redrawRows({
|
|
76077
|
+
rowNodes: rowValues.map((rowValue) => rowValue.node)
|
|
76078
|
+
});
|
|
76079
|
+
};
|
|
76027
76080
|
const selectRows = React82.useCallback(
|
|
76028
76081
|
(rowIds) => {
|
|
76029
76082
|
rowIds == null ? void 0 : rowIds.forEach((id) => {
|
|
76030
|
-
|
|
76031
|
-
|
|
76083
|
+
const rowNode = gridApi == null ? void 0 : gridApi.getRowNode(id.toString());
|
|
76084
|
+
if (!rowNode)
|
|
76085
|
+
return;
|
|
76086
|
+
rowNode.setSelected(true);
|
|
76087
|
+
onSelectionChanged(rowNode);
|
|
76032
76088
|
});
|
|
76033
76089
|
},
|
|
76034
76090
|
[gridApi]
|
|
@@ -76036,8 +76092,11 @@ var useTableApi = ({
|
|
|
76036
76092
|
const deselectRows = React82.useCallback(
|
|
76037
76093
|
(rowIds) => {
|
|
76038
76094
|
rowIds == null ? void 0 : rowIds.forEach((id) => {
|
|
76039
|
-
|
|
76040
|
-
|
|
76095
|
+
const rowNode = gridApi == null ? void 0 : gridApi.getRowNode(id.toString());
|
|
76096
|
+
if (!rowNode)
|
|
76097
|
+
return;
|
|
76098
|
+
rowNode.setSelected(false);
|
|
76099
|
+
onSelectionChanged(rowNode);
|
|
76041
76100
|
});
|
|
76042
76101
|
},
|
|
76043
76102
|
[gridApi]
|
|
@@ -76086,7 +76145,8 @@ function buildPartialTableApi({
|
|
|
76086
76145
|
gridApi,
|
|
76087
76146
|
rowHeight,
|
|
76088
76147
|
columnApi,
|
|
76089
|
-
filterStorage
|
|
76148
|
+
filterStorage,
|
|
76149
|
+
rowSelectionRef
|
|
76090
76150
|
}) {
|
|
76091
76151
|
const setRowData = (rows) => {
|
|
76092
76152
|
if ((gridApi == null ? void 0 : gridApi.getModel().getType()) === "serverSide") {
|
|
@@ -76128,7 +76188,8 @@ function buildPartialTableApi({
|
|
|
76128
76188
|
gridApi: detailGridApi,
|
|
76129
76189
|
columnApi: detailGridColumnApi,
|
|
76130
76190
|
rowHeight,
|
|
76131
|
-
filterStorage
|
|
76191
|
+
filterStorage,
|
|
76192
|
+
rowSelectionRef
|
|
76132
76193
|
}) : void 0;
|
|
76133
76194
|
};
|
|
76134
76195
|
const getTableConfiguration = () => {
|
|
@@ -76163,44 +76224,58 @@ function buildPartialTableApi({
|
|
|
76163
76224
|
}
|
|
76164
76225
|
return {};
|
|
76165
76226
|
};
|
|
76166
|
-
const
|
|
76227
|
+
const getSelectedRows2 = () => {
|
|
76167
76228
|
return (gridApi == null ? void 0 : gridApi.getSelectedRows()) || [];
|
|
76168
76229
|
};
|
|
76169
|
-
const
|
|
76170
|
-
const
|
|
76171
|
-
|
|
76172
|
-
|
|
76173
|
-
|
|
76174
|
-
gridApi == null ? void 0 : gridApi.forEachNode(function(node) {
|
|
76175
|
-
if (node.isSelected() === false) {
|
|
76176
|
-
node.setSelected(true, void 0, "apiSelectAll");
|
|
76230
|
+
const rowsNeedingUpdateAfterSelectAll = (isSelectAll) => {
|
|
76231
|
+
const prevRowNodes = (gridApi == null ? void 0 : gridApi.getRenderedNodes()) || [];
|
|
76232
|
+
return prevRowNodes.filter((prevRowNode) => {
|
|
76233
|
+
if (!prevRowNode.selectable) {
|
|
76234
|
+
return false;
|
|
76177
76235
|
}
|
|
76236
|
+
return isSelectAll ? !prevRowNode.isSelected() : prevRowNode.isSelected();
|
|
76178
76237
|
});
|
|
76238
|
+
};
|
|
76239
|
+
const updateAffectedRowsOnToggle = (isSelected) => {
|
|
76240
|
+
const prevAffectedRows = rowSelectionRef.current.affectedRows;
|
|
76241
|
+
const currentRows = getCurrentRows(gridApi);
|
|
76242
|
+
rowSelectionRef.current.affectedRows = currentRows.reduce(
|
|
76243
|
+
(accum, rowNode) => {
|
|
76244
|
+
if (!rowNode.id) {
|
|
76245
|
+
return accum;
|
|
76246
|
+
}
|
|
76247
|
+
return {
|
|
76248
|
+
...accum,
|
|
76249
|
+
[rowNode.id]: {
|
|
76250
|
+
node: rowNode,
|
|
76251
|
+
selectedState: isSelected ? rowSelectionState.selected : rowSelectionState.unselected
|
|
76252
|
+
}
|
|
76253
|
+
};
|
|
76254
|
+
},
|
|
76255
|
+
prevAffectedRows
|
|
76256
|
+
);
|
|
76257
|
+
};
|
|
76258
|
+
const selectAll = () => {
|
|
76259
|
+
const nodesToUpdate = rowsNeedingUpdateAfterSelectAll(true);
|
|
76260
|
+
gridApi == null ? void 0 : gridApi.selectAll();
|
|
76179
76261
|
if ((gridApi == null ? void 0 : gridApi.getModel().getType()) === "serverSide") {
|
|
76180
|
-
|
|
76262
|
+
updateAffectedRowsOnToggle(true);
|
|
76263
|
+
gridApi == null ? void 0 : gridApi.redrawRows({ rowNodes: nodesToUpdate });
|
|
76181
76264
|
}
|
|
76182
76265
|
};
|
|
76183
76266
|
const deselectAll = () => {
|
|
76184
|
-
const
|
|
76185
|
-
|
|
76186
|
-
gridApi == null ? void 0 : gridApi.deselectAll();
|
|
76187
|
-
}
|
|
76188
|
-
gridApi == null ? void 0 : gridApi.forEachNode(function(node) {
|
|
76189
|
-
if (node.isSelected() === true) {
|
|
76190
|
-
node.setSelected(false, void 0, "apiSelectAll");
|
|
76191
|
-
}
|
|
76192
|
-
});
|
|
76267
|
+
const nodesToUpdate = rowsNeedingUpdateAfterSelectAll(false);
|
|
76268
|
+
gridApi == null ? void 0 : gridApi.deselectAll();
|
|
76193
76269
|
if ((gridApi == null ? void 0 : gridApi.getModel().getType()) === "serverSide") {
|
|
76194
|
-
|
|
76270
|
+
updateAffectedRowsOnToggle(false);
|
|
76271
|
+
gridApi == null ? void 0 : gridApi.redrawRows({ rowNodes: nodesToUpdate });
|
|
76195
76272
|
}
|
|
76196
76273
|
};
|
|
76197
76274
|
const collapseAll = () => {
|
|
76198
76275
|
gridApi == null ? void 0 : gridApi.collapseAll();
|
|
76199
76276
|
};
|
|
76200
76277
|
const expandAll = () => {
|
|
76201
|
-
gridApi == null ? void 0 : gridApi.
|
|
76202
|
-
node.setExpanded(true);
|
|
76203
|
-
});
|
|
76278
|
+
gridApi == null ? void 0 : gridApi.expandAll();
|
|
76204
76279
|
};
|
|
76205
76280
|
const setRowNodeExpanded = (rowNode, expanded) => {
|
|
76206
76281
|
return gridApi == null ? void 0 : gridApi.setRowNodeExpanded(rowNode, expanded);
|
|
@@ -76231,7 +76306,7 @@ function buildPartialTableApi({
|
|
|
76231
76306
|
getFilteredAndSortedRowNodes,
|
|
76232
76307
|
getRootAggregateData,
|
|
76233
76308
|
getRowData,
|
|
76234
|
-
getSelectedRows,
|
|
76309
|
+
getSelectedRows: getSelectedRows2,
|
|
76235
76310
|
getTableConfiguration,
|
|
76236
76311
|
refreshCells,
|
|
76237
76312
|
setPinnedBottomRowData,
|
|
@@ -77187,42 +77262,6 @@ var Table = (props) => {
|
|
|
77187
77262
|
},
|
|
77188
77263
|
[props.onRowGroupOpened]
|
|
77189
77264
|
);
|
|
77190
|
-
const onSelectionChanged = (event) => {
|
|
77191
|
-
if (!internalTableContext.onServerSideDataRequest || event.source === "apiSelectAll") {
|
|
77192
|
-
return;
|
|
77193
|
-
}
|
|
77194
|
-
const previousSelectedIds = Object.keys(
|
|
77195
|
-
rowSelectionRef.current.affectedRows
|
|
77196
|
-
).filter(
|
|
77197
|
-
(nodeId) => rowSelectionRef.current.affectedRows[nodeId].selectedState === rowSelectionState.selected
|
|
77198
|
-
);
|
|
77199
|
-
const affectedRows = rowSelectionRef.current.affectedRows;
|
|
77200
|
-
const eventSelectedIds = event.api.getSelectedNodes().map((node) => node.id);
|
|
77201
|
-
const diff = symmetricDifference(eventSelectedIds, previousSelectedIds);
|
|
77202
|
-
const selectionNode = event.api.getRowNode(diff[0]);
|
|
77203
|
-
if (selectionNode === void 0) {
|
|
77204
|
-
return;
|
|
77205
|
-
}
|
|
77206
|
-
const rowsToUpdate = getAffectedRows(
|
|
77207
|
-
getCurrentRows(event.api),
|
|
77208
|
-
selectionNode,
|
|
77209
|
-
affectedRows
|
|
77210
|
-
);
|
|
77211
|
-
Object.values(rowsToUpdate).forEach((row) => {
|
|
77212
|
-
row.node.setSelected(
|
|
77213
|
-
row.selectedState === rowSelectionState.selected,
|
|
77214
|
-
void 0,
|
|
77215
|
-
event.source
|
|
77216
|
-
);
|
|
77217
|
-
});
|
|
77218
|
-
rowSelectionRef.current.affectedRows = {
|
|
77219
|
-
...affectedRows,
|
|
77220
|
-
...rowsToUpdate
|
|
77221
|
-
};
|
|
77222
|
-
gridApi == null ? void 0 : gridApi.redrawRows({
|
|
77223
|
-
rowNodes: Object.values(rowsToUpdate).map((val) => val.node)
|
|
77224
|
-
});
|
|
77225
|
-
};
|
|
77226
77265
|
const getGroupRowAgg = React82.useCallback(
|
|
77227
77266
|
(params) => {
|
|
77228
77267
|
const agNodes = params.nodes;
|
|
@@ -77376,6 +77415,7 @@ var Table = (props) => {
|
|
|
77376
77415
|
cacheBlockSize: props.paginationPageSize || defaultPaginationPageSize,
|
|
77377
77416
|
defaultColDef,
|
|
77378
77417
|
enableGroupEdit: internalTableContext.enableGroupEditAndValidation,
|
|
77418
|
+
enableCellEditingOnBackspace: true,
|
|
77379
77419
|
excelStyles: transformToExcelStyles(props.excelDataTypeFormats),
|
|
77380
77420
|
components: frameworkComponents,
|
|
77381
77421
|
fullWidthCellRenderer: FullWidthCellRenderer(
|
|
@@ -77432,7 +77472,6 @@ var Table = (props) => {
|
|
|
77432
77472
|
onRowDragMove,
|
|
77433
77473
|
onRowGroupOpened: internalRowGroupOpened,
|
|
77434
77474
|
onRowSelected: internalOnRowSelected,
|
|
77435
|
-
onSelectionChanged,
|
|
77436
77475
|
onSortChanged: onSortEventChanged,
|
|
77437
77476
|
onFilterChanged,
|
|
77438
77477
|
onFirstDataRendered: props.onFirstDataRendered,
|
|
@@ -77485,13 +77524,19 @@ var TablePagination = ({
|
|
|
77485
77524
|
page: 0,
|
|
77486
77525
|
items: 0
|
|
77487
77526
|
});
|
|
77527
|
+
const { rowSelectionRef } = useInternalTableContext();
|
|
77488
77528
|
React82.useEffect(() => {
|
|
77489
77529
|
function onPaginationChanged(params) {
|
|
77530
|
+
var _a;
|
|
77490
77531
|
if (gridApi && params.api.paginationGetCurrentPage() !== pagination.page || pagination.items !== params.api.paginationGetRowCount()) {
|
|
77491
77532
|
setPagination({
|
|
77492
77533
|
page: params.api.paginationGetCurrentPage(),
|
|
77493
77534
|
items: params.api.paginationGetRowCount()
|
|
77494
77535
|
});
|
|
77536
|
+
if (params.api.getModel().getType() === "serverSide") {
|
|
77537
|
+
((_a = rowSelectionRef == null ? void 0 : rowSelectionRef.current) == null ? void 0 : _a.affectedRows) && (rowSelectionRef.current.affectedRows = {});
|
|
77538
|
+
gridApi == null ? void 0 : gridApi.deselectAll();
|
|
77539
|
+
}
|
|
77495
77540
|
}
|
|
77496
77541
|
}
|
|
77497
77542
|
gridApi == null ? void 0 : gridApi.addEventListener("paginationChanged", onPaginationChanged);
|