@carbon/ibm-products 1.13.0 → 1.16.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/css/components/Datagrid/styles/addons/CustomizeColumnsModal.css +47 -0
- package/css/components/Datagrid/styles/addons/CustomizeColumnsModal.css.map +1 -0
- package/css/components/Datagrid/styles/addons/RowSizeDropdown.css +20 -0
- package/css/components/Datagrid/styles/addons/RowSizeDropdown.css.map +1 -0
- package/css/components/Datagrid/styles/datagrid.css +268 -0
- package/css/components/Datagrid/styles/datagrid.css.map +1 -0
- package/css/components/Datagrid/styles/index.css +513 -0
- package/css/components/Datagrid/styles/index.css.map +1 -0
- package/css/components/Datagrid/styles/useActionsColumn.css +23 -0
- package/css/components/Datagrid/styles/useActionsColumn.css.map +1 -0
- package/css/components/Datagrid/styles/useColumnRightAlign.css +28 -0
- package/css/components/Datagrid/styles/useColumnRightAlign.css.map +1 -0
- package/css/components/Datagrid/styles/useNestedRows.css +15 -0
- package/css/components/Datagrid/styles/useNestedRows.css.map +1 -0
- package/css/components/Datagrid/styles/useNestedTable.css +25 -0
- package/css/components/Datagrid/styles/useNestedTable.css.map +1 -0
- package/css/components/Datagrid/styles/useSelectAllToggle.css +28 -0
- package/css/components/Datagrid/styles/useSelectAllToggle.css.map +1 -0
- package/css/components/Datagrid/styles/useSortableColumns.css +50 -0
- package/css/components/Datagrid/styles/useSortableColumns.css.map +1 -0
- package/css/components/Datagrid/styles/useStickyColumn.css +35 -0
- package/css/components/Datagrid/styles/useStickyColumn.css.map +1 -0
- package/css/index-full-carbon.css +611 -10
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +3 -3
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +7 -4
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +2 -2
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +611 -10
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +3 -3
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +611 -10
- package/css/index.css.map +1 -1
- package/css/index.min.css +3 -3
- package/css/index.min.css.map +1 -1
- package/es/components/AddSelect/AddSelect.js +106 -43
- package/es/components/AddSelect/AddSelectFilter.js +172 -0
- package/es/components/AddSelect/add-select-utils.js +30 -0
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +255 -175
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +78 -17
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +65 -20
- package/es/components/DataSpreadsheet/hooks/index.js +11 -0
- package/es/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +139 -0
- package/es/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +2 -4
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +68 -0
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +1 -3
- package/es/components/DataSpreadsheet/utils/createCellSelectionArea.js +20 -8
- package/es/components/DataSpreadsheet/utils/generateData.js +17 -9
- package/es/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +18 -0
- package/es/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +30 -0
- package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +121 -0
- package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +108 -0
- package/es/components/DataSpreadsheet/utils/handleEditSubmit.js +87 -0
- package/es/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +42 -8
- package/es/components/DataSpreadsheet/utils/handleMultipleKeys.js +225 -13
- package/es/components/DataSpreadsheet/utils/selectAllCells.js +53 -0
- package/es/components/Datagrid/Datagrid/Datagrid.js +70 -0
- package/es/components/Datagrid/Datagrid/DatagridBody.js +36 -0
- package/es/components/Datagrid/Datagrid/DatagridEmptyBody.js +19 -0
- package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +26 -0
- package/es/components/Datagrid/Datagrid/DatagridHead.js +31 -0
- package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +57 -0
- package/es/components/Datagrid/Datagrid/DatagridRefBody.js +37 -0
- package/es/components/Datagrid/Datagrid/DatagridRow.js +60 -0
- package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +50 -0
- package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +122 -0
- package/es/components/Datagrid/Datagrid/DatagridSimpleBody.js +36 -0
- package/es/components/Datagrid/Datagrid/DatagridToolbar.js +22 -0
- package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +87 -0
- package/es/components/Datagrid/Datagrid/DraggableElement.js +188 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +78 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +51 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +140 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsModal.js +157 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/ModalWrapper.js +62 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/common.js +13 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/index.js +9 -0
- package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +62 -0
- package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +139 -0
- package/es/components/Datagrid/Datagrid/addons/RowSize/index.js +8 -0
- package/es/components/Datagrid/Datagrid/index.js +8 -0
- package/es/components/Datagrid/Datagrid.stories/CustomizeColumnStory.js +6 -0
- package/es/components/Datagrid/Datagrid.stories/LeftPanelStory.js +6 -0
- package/es/components/Datagrid/Datagrid.stories/RowSizeDropdownStory.js +6 -0
- package/es/components/Datagrid/Datagrid.stories/SelectAllWithToggleStory.js +6 -0
- package/es/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +92 -0
- package/es/components/Datagrid/Datagrid.stories/common.js +199 -0
- package/es/components/Datagrid/Datagrid.stories/index.js +5 -0
- package/es/components/Datagrid/common-column-ids.js +8 -0
- package/es/components/Datagrid/index.js +22 -0
- package/es/components/Datagrid/useActionsColumn.js +86 -0
- package/es/components/Datagrid/useColumnRightAlign.js +52 -0
- package/es/components/Datagrid/useCustomizeColumns.js +45 -0
- package/es/components/Datagrid/useDatagrid.js +44 -0
- package/es/components/Datagrid/useDefaultStringRenderer.js +48 -0
- package/es/components/Datagrid/useDisableSelectRows.js +84 -0
- package/es/components/Datagrid/useExpandedRow.js +52 -0
- package/es/components/Datagrid/useFlexResize.js +51 -0
- package/es/components/Datagrid/useFloatingScroll.js +88 -0
- package/es/components/Datagrid/useInfiniteScroll.js +54 -0
- package/es/components/Datagrid/useNestedRows.js +53 -0
- package/es/components/Datagrid/useOnRowClick.js +37 -0
- package/es/components/Datagrid/useParentDimensions.js +65 -0
- package/es/components/Datagrid/useResizeTable.js +40 -0
- package/es/components/Datagrid/useRowExpander.js +34 -0
- package/es/components/Datagrid/useRowIsMouseOver.js +61 -0
- package/es/components/Datagrid/useRowRenderer.js +30 -0
- package/es/components/Datagrid/useRowSize.js +56 -0
- package/es/components/Datagrid/useSelectAllToggle.js +74 -0
- package/es/components/Datagrid/useSelectRows.js +107 -0
- package/es/components/Datagrid/useSkeletonRows.js +32 -0
- package/es/components/Datagrid/useSortableColumns.js +110 -0
- package/es/components/Datagrid/useStickyColumn.js +183 -0
- package/es/components/MultiAddSelect/MultiAddSelect.js +150 -3
- package/es/components/PageHeader/PageHeader.js +3 -1
- package/es/components/SingleAddSelect/SingleAddSelect.js +90 -4
- package/es/components/TagSet/TagSet.js +13 -6
- package/es/components/Tearsheet/TearsheetShell.js +34 -10
- package/es/components/index.js +2 -1
- package/es/global/js/package-settings.js +4 -2
- package/lib/components/AddSelect/AddSelect.js +105 -41
- package/lib/components/AddSelect/AddSelectFilter.js +190 -0
- package/lib/components/AddSelect/add-select-utils.js +35 -2
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +261 -177
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +79 -23
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +67 -21
- package/lib/components/DataSpreadsheet/hooks/index.js +45 -0
- package/lib/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +151 -0
- package/lib/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +2 -4
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +79 -0
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +1 -3
- package/lib/components/DataSpreadsheet/utils/createCellSelectionArea.js +21 -8
- package/lib/components/DataSpreadsheet/utils/generateData.js +17 -9
- package/lib/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +27 -0
- package/lib/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +40 -0
- package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +127 -0
- package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +118 -0
- package/lib/components/DataSpreadsheet/utils/handleEditSubmit.js +94 -0
- package/lib/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +44 -8
- package/lib/components/DataSpreadsheet/utils/handleMultipleKeys.js +235 -20
- package/lib/components/DataSpreadsheet/utils/selectAllCells.js +60 -0
- package/lib/components/Datagrid/Datagrid/Datagrid.js +86 -0
- package/lib/components/Datagrid/Datagrid/DatagridBody.js +50 -0
- package/lib/components/Datagrid/Datagrid/DatagridEmptyBody.js +31 -0
- package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +38 -0
- package/lib/components/Datagrid/Datagrid/DatagridHead.js +43 -0
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +73 -0
- package/lib/components/Datagrid/Datagrid/DatagridRefBody.js +44 -0
- package/lib/components/Datagrid/Datagrid/DatagridRow.js +68 -0
- package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +55 -0
- package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +139 -0
- package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js +44 -0
- package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +35 -0
- package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +101 -0
- package/lib/components/Datagrid/Datagrid/DraggableElement.js +210 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +92 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +65 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +166 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsModal.js +173 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ModalWrapper.js +73 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/common.js +25 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/index.js +23 -0
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +80 -0
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +160 -0
- package/lib/components/Datagrid/Datagrid/addons/RowSize/index.js +15 -0
- package/lib/components/Datagrid/Datagrid/index.js +15 -0
- package/lib/components/Datagrid/Datagrid.stories/CustomizeColumnStory.js +13 -0
- package/lib/components/Datagrid/Datagrid.stories/LeftPanelStory.js +13 -0
- package/lib/components/Datagrid/Datagrid.stories/RowSizeDropdownStory.js +13 -0
- package/lib/components/Datagrid/Datagrid.stories/SelectAllWithToggleStory.js +13 -0
- package/lib/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +112 -0
- package/lib/components/Datagrid/Datagrid.stories/common.js +215 -0
- package/lib/components/Datagrid/Datagrid.stories/index.js +47 -0
- package/lib/components/Datagrid/common-column-ids.js +16 -0
- package/lib/components/Datagrid/index.js +127 -0
- package/lib/components/Datagrid/useActionsColumn.js +94 -0
- package/lib/components/Datagrid/useColumnRightAlign.js +59 -0
- package/lib/components/Datagrid/useCustomizeColumns.js +55 -0
- package/lib/components/Datagrid/useDatagrid.js +58 -0
- package/lib/components/Datagrid/useDefaultStringRenderer.js +54 -0
- package/lib/components/Datagrid/useDisableSelectRows.js +92 -0
- package/lib/components/Datagrid/useExpandedRow.js +58 -0
- package/lib/components/Datagrid/useFlexResize.js +61 -0
- package/lib/components/Datagrid/useFloatingScroll.js +101 -0
- package/lib/components/Datagrid/useInfiniteScroll.js +67 -0
- package/lib/components/Datagrid/useNestedRows.js +65 -0
- package/lib/components/Datagrid/useOnRowClick.js +45 -0
- package/lib/components/Datagrid/useParentDimensions.js +75 -0
- package/lib/components/Datagrid/useResizeTable.js +48 -0
- package/lib/components/Datagrid/useRowExpander.js +45 -0
- package/lib/components/Datagrid/useRowIsMouseOver.js +66 -0
- package/lib/components/Datagrid/useRowRenderer.js +40 -0
- package/lib/components/Datagrid/useRowSize.js +67 -0
- package/lib/components/Datagrid/useSelectAllToggle.js +88 -0
- package/lib/components/Datagrid/useSelectRows.js +119 -0
- package/lib/components/Datagrid/useSkeletonRows.js +42 -0
- package/lib/components/Datagrid/useSortableColumns.js +117 -0
- package/lib/components/Datagrid/useStickyColumn.js +190 -0
- package/lib/components/MultiAddSelect/MultiAddSelect.js +150 -2
- package/lib/components/PageHeader/PageHeader.js +3 -1
- package/lib/components/SingleAddSelect/SingleAddSelect.js +91 -3
- package/lib/components/TagSet/TagSet.js +13 -6
- package/lib/components/Tearsheet/TearsheetShell.js +36 -10
- package/lib/components/index.js +9 -1
- package/lib/global/js/package-settings.js +4 -2
- package/package.json +16 -12
- package/scss/components/AboutModal/_about-modal.scss +4 -0
- package/scss/components/AddSelect/_add-select.scss +46 -2
- package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +41 -4
- package/scss/components/Datagrid/_datagrid.scss +66 -0
- package/scss/components/Datagrid/_index.scss +8 -0
- package/scss/components/Datagrid/_storybook-styles.scss +26 -0
- package/scss/components/Datagrid/styles/_variables.scss +9 -0
- package/scss/components/Datagrid/styles/addons/CustomizeColumnsModal.scss +48 -0
- package/scss/components/Datagrid/styles/addons/RowSizeDropdown.scss +23 -0
- package/scss/components/Datagrid/styles/datagrid.scss +326 -0
- package/scss/components/Datagrid/styles/index.scss +17 -0
- package/scss/components/Datagrid/styles/useActionsColumn.scss +24 -0
- package/scss/components/Datagrid/styles/useColumnRightAlign.scss +29 -0
- package/scss/components/Datagrid/styles/useNestedRows.scss +17 -0
- package/scss/components/Datagrid/styles/useNestedTable.scss +28 -0
- package/scss/components/Datagrid/styles/useSelectAllToggle.scss +28 -0
- package/scss/components/Datagrid/styles/useSortableColumns.scss +55 -0
- package/scss/components/Datagrid/styles/useStickyColumn.scss +38 -0
- package/scss/components/ExportModal/_export-modal.scss +0 -4
- package/scss/components/Tearsheet/_tearsheet.scss +4 -0
- package/scss/components/_index.scss +1 -0
|
@@ -1,3 +1,9 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
|
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
+
|
|
5
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
+
|
|
1
7
|
/**
|
|
2
8
|
* Copyright IBM Corp. 2022, 2022
|
|
3
9
|
*
|
|
@@ -5,24 +11,66 @@
|
|
|
5
11
|
* LICENSE file in the root directory of this source tree.
|
|
6
12
|
*/
|
|
7
13
|
import { deepCloneObject } from '../../../global/js/utils/deepCloneObject';
|
|
14
|
+
import uuidv4 from '../../../global/js/utils/uuidv4';
|
|
15
|
+
import { selectAllCells } from './selectAllCells';
|
|
16
|
+
export var includesResourceKey = function includesResourceKey(arr, usingMac) {
|
|
17
|
+
if (usingMac) {
|
|
18
|
+
return includesMeta(arr);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
if (!usingMac) {
|
|
22
|
+
return includesControl(arr);
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
export var includesShift = function includesShift(arr) {
|
|
26
|
+
if (arr.includes('ShiftLeft') || arr.includes('ShiftRight')) {
|
|
27
|
+
return true;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
return false;
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
var includesMeta = function includesMeta(arr) {
|
|
34
|
+
if (arr.includes('MetaLeft') || arr.includes('MetaRight')) {
|
|
35
|
+
return true;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
return false;
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
var includesControl = function includesControl(arr) {
|
|
42
|
+
if (arr.includes('ControlLeft') || arr.includes('ControlRight')) {
|
|
43
|
+
return true;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
return false;
|
|
47
|
+
};
|
|
48
|
+
|
|
8
49
|
export var handleMultipleKeys = function handleMultipleKeys(_ref) {
|
|
9
|
-
var _selectionAreasClone
|
|
50
|
+
var _selectionAreasClone$, _selectionAreasClone$2, _selectionAreasClone$3;
|
|
10
51
|
|
|
11
|
-
var
|
|
52
|
+
var activeCellCoordinates = _ref.activeCellCoordinates,
|
|
53
|
+
event = _ref.event,
|
|
54
|
+
keysPressedList = _ref.keysPressedList,
|
|
12
55
|
selectionAreas = _ref.selectionAreas,
|
|
13
56
|
currentMatcher = _ref.currentMatcher,
|
|
14
57
|
rows = _ref.rows,
|
|
15
58
|
setSelectionAreas = _ref.setSelectionAreas,
|
|
16
|
-
columns = _ref.columns
|
|
17
|
-
|
|
59
|
+
columns = _ref.columns,
|
|
60
|
+
updateActiveCellCoordinates = _ref.updateActiveCellCoordinates,
|
|
61
|
+
spreadsheetRef = _ref.spreadsheetRef,
|
|
62
|
+
removeCellSelections = _ref.removeCellSelections,
|
|
63
|
+
blockClass = _ref.blockClass,
|
|
64
|
+
setCurrentMatcher = _ref.setCurrentMatcher,
|
|
65
|
+
usingMac = _ref.usingMac;
|
|
18
66
|
var selectionAreasClone = deepCloneObject(selectionAreas);
|
|
19
67
|
var indexOfCurrentArea = selectionAreasClone.findIndex(function (item) {
|
|
20
68
|
return item.matcher === currentMatcher;
|
|
21
69
|
});
|
|
22
|
-
var pointToUpdate = (_selectionAreasClone$ = selectionAreasClone[indexOfCurrentArea]) !== null && _selectionAreasClone$ !== void 0 && _selectionAreasClone$.point2 ? selectionAreasClone[indexOfCurrentArea].point2 : selectionAreasClone[indexOfCurrentArea].point1; // Down + Shift
|
|
70
|
+
var pointToUpdate = (_selectionAreasClone$ = selectionAreasClone[indexOfCurrentArea]) !== null && _selectionAreasClone$ !== void 0 && _selectionAreasClone$.point2 ? (_selectionAreasClone$2 = selectionAreasClone[indexOfCurrentArea]) === null || _selectionAreasClone$2 === void 0 ? void 0 : _selectionAreasClone$2.point2 : (_selectionAreasClone$3 = selectionAreasClone[indexOfCurrentArea]) === null || _selectionAreasClone$3 === void 0 ? void 0 : _selectionAreasClone$3.point1; // Down + Shift
|
|
23
71
|
|
|
24
|
-
if (
|
|
25
|
-
if (rows.length - 1 === pointToUpdate.row) {
|
|
72
|
+
if (includesShift(keysPressedList) && keysPressedList.includes('ArrowDown') && keysPressedList.length === 2) {
|
|
73
|
+
if (rows.length - 1 === (pointToUpdate === null || pointToUpdate === void 0 ? void 0 : pointToUpdate.row) || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header') {
|
|
26
74
|
return;
|
|
27
75
|
}
|
|
28
76
|
|
|
@@ -36,8 +84,8 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
|
|
|
36
84
|
} // Right + Shift
|
|
37
85
|
|
|
38
86
|
|
|
39
|
-
if (
|
|
40
|
-
if (columns.length - 1 === pointToUpdate.column) {
|
|
87
|
+
if (includesShift(keysPressedList) && keysPressedList.includes('ArrowRight') && keysPressedList.length === 2) {
|
|
88
|
+
if (columns.length - 1 === (pointToUpdate === null || pointToUpdate === void 0 ? void 0 : pointToUpdate.column) || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header') {
|
|
41
89
|
return;
|
|
42
90
|
}
|
|
43
91
|
|
|
@@ -51,8 +99,8 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
|
|
|
51
99
|
} // Up + Shift
|
|
52
100
|
|
|
53
101
|
|
|
54
|
-
if (
|
|
55
|
-
if (pointToUpdate.row === 0) {
|
|
102
|
+
if (includesShift(keysPressedList) && keysPressedList.includes('ArrowUp') && keysPressedList.length === 2) {
|
|
103
|
+
if ((pointToUpdate === null || pointToUpdate === void 0 ? void 0 : pointToUpdate.row) === 0 || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header') {
|
|
56
104
|
return;
|
|
57
105
|
}
|
|
58
106
|
|
|
@@ -66,8 +114,8 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
|
|
|
66
114
|
} // Left + Shift
|
|
67
115
|
|
|
68
116
|
|
|
69
|
-
if (
|
|
70
|
-
if (pointToUpdate.column === 0) {
|
|
117
|
+
if (includesShift(keysPressedList) && keysPressedList.includes('ArrowLeft') && keysPressedList.length === 2) {
|
|
118
|
+
if ((pointToUpdate === null || pointToUpdate === void 0 ? void 0 : pointToUpdate.column) === 0 || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header') {
|
|
71
119
|
return;
|
|
72
120
|
}
|
|
73
121
|
|
|
@@ -78,5 +126,169 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
|
|
|
78
126
|
selectionAreasClone[indexOfCurrentArea].point2 = _newPoint3;
|
|
79
127
|
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
|
80
128
|
setSelectionAreas(selectionAreasClone);
|
|
129
|
+
} // CMD + a (select all)
|
|
130
|
+
|
|
131
|
+
|
|
132
|
+
if (includesResourceKey(keysPressedList, usingMac) && keysPressedList.includes('KeyA')) {
|
|
133
|
+
event.preventDefault();
|
|
134
|
+
var selectionPoint1 = {
|
|
135
|
+
row: 0,
|
|
136
|
+
column: 0
|
|
137
|
+
};
|
|
138
|
+
var selectionPoint2 = {
|
|
139
|
+
row: rows.length - 1,
|
|
140
|
+
column: columns.length - 1
|
|
141
|
+
}; // If indexOfCurrentArea is -1, it means the active cell is in a cell header position
|
|
142
|
+
|
|
143
|
+
if (indexOfCurrentArea === -1) {
|
|
144
|
+
selectAllCells({
|
|
145
|
+
ref: spreadsheetRef,
|
|
146
|
+
setCurrentMatcher: setCurrentMatcher,
|
|
147
|
+
setSelectionAreas: setSelectionAreas,
|
|
148
|
+
rows: rows,
|
|
149
|
+
columns: columns,
|
|
150
|
+
activeCellCoordinates: activeCellCoordinates,
|
|
151
|
+
updateActiveCellCoordinates: updateActiveCellCoordinates
|
|
152
|
+
});
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
selectionAreasClone[indexOfCurrentArea].point1 = selectionPoint1;
|
|
156
|
+
selectionAreasClone[indexOfCurrentArea].point2 = selectionPoint2;
|
|
157
|
+
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
|
158
|
+
setSelectionAreas(selectionAreasClone);
|
|
159
|
+
} // CONTROL + SPACE (Select current column)
|
|
160
|
+
|
|
161
|
+
|
|
162
|
+
if (includesControl(keysPressedList) && keysPressedList.includes('Space')) {
|
|
163
|
+
var _selectionPoint = {
|
|
164
|
+
row: 0,
|
|
165
|
+
column: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column
|
|
166
|
+
};
|
|
167
|
+
var _selectionPoint2 = {
|
|
168
|
+
row: rows.length - 1,
|
|
169
|
+
column: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column
|
|
170
|
+
}; // If indexOfCurrentArea is -1, it means the active cell is in a cell header position
|
|
171
|
+
|
|
172
|
+
if (indexOfCurrentArea === -1) {
|
|
173
|
+
var tempMatcher = uuidv4();
|
|
174
|
+
var newSelectionArea = {
|
|
175
|
+
point1: _selectionPoint,
|
|
176
|
+
point2: _selectionPoint2,
|
|
177
|
+
areaCreated: false,
|
|
178
|
+
matcher: tempMatcher
|
|
179
|
+
};
|
|
180
|
+
|
|
181
|
+
var coordinatesClone = _objectSpread({}, activeCellCoordinates);
|
|
182
|
+
|
|
183
|
+
updateActiveCellCoordinates({
|
|
184
|
+
coords: coordinatesClone,
|
|
185
|
+
updatedValue: {
|
|
186
|
+
column: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column,
|
|
187
|
+
row: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row
|
|
188
|
+
}
|
|
189
|
+
});
|
|
190
|
+
setCurrentMatcher(tempMatcher);
|
|
191
|
+
return setSelectionAreas([newSelectionArea]);
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
selectionAreasClone[indexOfCurrentArea].point1 = _selectionPoint;
|
|
195
|
+
selectionAreasClone[indexOfCurrentArea].point2 = _selectionPoint2;
|
|
196
|
+
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
|
197
|
+
setSelectionAreas(selectionAreasClone);
|
|
198
|
+
} // Shift + SPACE (Select current row)
|
|
199
|
+
|
|
200
|
+
|
|
201
|
+
if (includesShift(keysPressedList) && keysPressedList.includes('Space')) {
|
|
202
|
+
var _selectionPoint3 = {
|
|
203
|
+
row: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row,
|
|
204
|
+
column: 0
|
|
205
|
+
};
|
|
206
|
+
var _selectionPoint4 = {
|
|
207
|
+
row: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row,
|
|
208
|
+
column: columns.length - 1
|
|
209
|
+
}; // If indexOfCurrentArea is -1, it means the active cell is in a cell header position
|
|
210
|
+
|
|
211
|
+
if (indexOfCurrentArea === -1) {
|
|
212
|
+
var _tempMatcher = uuidv4();
|
|
213
|
+
|
|
214
|
+
var _newSelectionArea = {
|
|
215
|
+
point1: _selectionPoint3,
|
|
216
|
+
point2: _selectionPoint4,
|
|
217
|
+
areaCreated: false,
|
|
218
|
+
matcher: _tempMatcher
|
|
219
|
+
};
|
|
220
|
+
|
|
221
|
+
var _coordinatesClone = _objectSpread({}, activeCellCoordinates);
|
|
222
|
+
|
|
223
|
+
updateActiveCellCoordinates({
|
|
224
|
+
coords: _coordinatesClone,
|
|
225
|
+
updatedValue: {
|
|
226
|
+
column: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column,
|
|
227
|
+
row: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row
|
|
228
|
+
}
|
|
229
|
+
});
|
|
230
|
+
setCurrentMatcher(_tempMatcher);
|
|
231
|
+
return setSelectionAreas([_newSelectionArea]);
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
selectionAreasClone[indexOfCurrentArea].point1 = _selectionPoint3;
|
|
235
|
+
selectionAreasClone[indexOfCurrentArea].point2 = _selectionPoint4;
|
|
236
|
+
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
|
237
|
+
setSelectionAreas(selectionAreasClone);
|
|
238
|
+
} // CMD + HOME (Selects first cell in first row)
|
|
239
|
+
|
|
240
|
+
|
|
241
|
+
if (includesResourceKey(keysPressedList, usingMac) && keysPressedList.includes('Home')) {
|
|
242
|
+
var scrollElement = spreadsheetRef.current.querySelector(".".concat(blockClass, "__list--container"));
|
|
243
|
+
scrollElement.scrollTop = 0;
|
|
244
|
+
|
|
245
|
+
var _coordinatesClone2 = _objectSpread({}, activeCellCoordinates);
|
|
246
|
+
|
|
247
|
+
removeCellSelections({
|
|
248
|
+
spreadsheetRef: spreadsheetRef
|
|
249
|
+
});
|
|
250
|
+
updateActiveCellCoordinates({
|
|
251
|
+
coords: _coordinatesClone2,
|
|
252
|
+
updatedValue: {
|
|
253
|
+
column: 0,
|
|
254
|
+
row: 0
|
|
255
|
+
}
|
|
256
|
+
});
|
|
257
|
+
} // CMD + END (Selects last cell in last row)
|
|
258
|
+
|
|
259
|
+
|
|
260
|
+
if (includesResourceKey(keysPressedList, usingMac) && keysPressedList.includes('End')) {
|
|
261
|
+
var _scrollElement = spreadsheetRef.current.querySelector(".".concat(blockClass, "__list--container"));
|
|
262
|
+
|
|
263
|
+
_scrollElement.scrollTop = _scrollElement.scrollHeight;
|
|
264
|
+
|
|
265
|
+
var _coordinatesClone3 = _objectSpread({}, activeCellCoordinates);
|
|
266
|
+
|
|
267
|
+
removeCellSelections({
|
|
268
|
+
spreadsheetRef: spreadsheetRef
|
|
269
|
+
});
|
|
270
|
+
var lastCellExists = !!rows[(rows === null || rows === void 0 ? void 0 : rows.length) - 1].cells[(columns === null || columns === void 0 ? void 0 : columns.length) - 1];
|
|
271
|
+
|
|
272
|
+
var updateToLastCell = function updateToLastCell() {
|
|
273
|
+
updateActiveCellCoordinates({
|
|
274
|
+
coords: _coordinatesClone3,
|
|
275
|
+
updatedValue: {
|
|
276
|
+
column: columns.length - 1,
|
|
277
|
+
row: rows.length - 1
|
|
278
|
+
}
|
|
279
|
+
});
|
|
280
|
+
}; // With the spreadsheet supporting virtualized data, it's possible that the last cell
|
|
281
|
+
// has never been rendered yet, if that's the case we scroll to the bottom of the spreadsheet
|
|
282
|
+
// and add a timeout to wait for the last row to render to the DOM before updating the active cell coordinates.
|
|
283
|
+
// If we're able to verify that the last row has been rendered, no timeout is used.
|
|
284
|
+
|
|
285
|
+
|
|
286
|
+
if (lastCellExists) {
|
|
287
|
+
updateToLastCell();
|
|
288
|
+
} else {
|
|
289
|
+
setTimeout(function () {
|
|
290
|
+
updateToLastCell();
|
|
291
|
+
}, 1);
|
|
292
|
+
}
|
|
81
293
|
}
|
|
82
294
|
};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
|
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
+
|
|
5
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* Copyright IBM Corp. 2022, 2022
|
|
9
|
+
*
|
|
10
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
11
|
+
* LICENSE file in the root directory of this source tree.
|
|
12
|
+
*/
|
|
13
|
+
import { removeCellSelections } from './removeCellSelections';
|
|
14
|
+
import uuidv4 from '../../../global/js/utils/uuidv4';
|
|
15
|
+
export var selectAllCells = function selectAllCells(_ref) {
|
|
16
|
+
var activeCellCoordinates = _ref.activeCellCoordinates,
|
|
17
|
+
columns = _ref.columns,
|
|
18
|
+
setCurrentMatcher = _ref.setCurrentMatcher,
|
|
19
|
+
setSelectionAreas = _ref.setSelectionAreas,
|
|
20
|
+
ref = _ref.ref,
|
|
21
|
+
rows = _ref.rows,
|
|
22
|
+
updateActiveCellCoordinates = _ref.updateActiveCellCoordinates;
|
|
23
|
+
removeCellSelections({
|
|
24
|
+
spreadsheetRef: ref
|
|
25
|
+
});
|
|
26
|
+
var selectionPoint1 = {
|
|
27
|
+
row: 0,
|
|
28
|
+
column: 0
|
|
29
|
+
};
|
|
30
|
+
var selectionPoint2 = {
|
|
31
|
+
row: rows.length - 1,
|
|
32
|
+
column: columns.length - 1
|
|
33
|
+
};
|
|
34
|
+
var tempMatcher = uuidv4();
|
|
35
|
+
var newSelectionArea = {
|
|
36
|
+
point1: selectionPoint1,
|
|
37
|
+
point2: selectionPoint2,
|
|
38
|
+
areaCreated: false,
|
|
39
|
+
matcher: tempMatcher
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
var coordinatesClone = _objectSpread({}, activeCellCoordinates);
|
|
43
|
+
|
|
44
|
+
updateActiveCellCoordinates({
|
|
45
|
+
coords: coordinatesClone,
|
|
46
|
+
updatedValue: {
|
|
47
|
+
column: 0,
|
|
48
|
+
row: 0
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
setCurrentMatcher(tempMatcher);
|
|
52
|
+
return setSelectionAreas([newSelectionArea]);
|
|
53
|
+
};
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
+
var _excluded = ["getTableProps", "withVirtualScroll", "DatagridPagination", "isFetching", "tableId", "CustomizeColumnsModal", "leftPanel", "fullHeightDatagrid", "verticalAlign", "variableRowHeight", "className"];
|
|
5
|
+
|
|
6
|
+
/*
|
|
7
|
+
* Licensed Materials - Property of IBM
|
|
8
|
+
* 5724-Q36
|
|
9
|
+
* (c) Copyright IBM Corp. 2020 - 2021
|
|
10
|
+
* US Government Users Restricted Rights - Use, duplication or disclosure
|
|
11
|
+
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
|
12
|
+
*/
|
|
13
|
+
import React from 'react';
|
|
14
|
+
import { DataTable } from 'carbon-components-react';
|
|
15
|
+
import cx from 'classnames';
|
|
16
|
+
import DatagridHead from './DatagridHead';
|
|
17
|
+
import DatagridBody from './DatagridBody';
|
|
18
|
+
import DatagridToolbar from './DatagridToolbar';
|
|
19
|
+
import { getDevtoolsProps } from '../../../global/js/utils/devtools';
|
|
20
|
+
import { pkg } from '../../../settings';
|
|
21
|
+
var blockClass = "".concat(pkg.prefix, "--datagrid");
|
|
22
|
+
var componentName = 'Datagrid';
|
|
23
|
+
var TableContainer = DataTable.TableContainer,
|
|
24
|
+
Table = DataTable.Table;
|
|
25
|
+
var Datagrid = /*#__PURE__*/React.forwardRef(function (datagridState, ref) {
|
|
26
|
+
var _getTableProps;
|
|
27
|
+
|
|
28
|
+
var _datagridState$getTab = datagridState.getTableProps,
|
|
29
|
+
getTableProps = _datagridState$getTab === void 0 ? function () {} : _datagridState$getTab,
|
|
30
|
+
withVirtualScroll = datagridState.withVirtualScroll,
|
|
31
|
+
DatagridPagination = datagridState.DatagridPagination,
|
|
32
|
+
isFetching = datagridState.isFetching,
|
|
33
|
+
tableId = datagridState.tableId,
|
|
34
|
+
CustomizeColumnsModal = datagridState.CustomizeColumnsModal,
|
|
35
|
+
leftPanel = datagridState.leftPanel,
|
|
36
|
+
fullHeightDatagrid = datagridState.fullHeightDatagrid,
|
|
37
|
+
_datagridState$vertic = datagridState.verticalAlign,
|
|
38
|
+
verticalAlign = _datagridState$vertic === void 0 ? 'center' : _datagridState$vertic,
|
|
39
|
+
variableRowHeight = datagridState.variableRowHeight,
|
|
40
|
+
className = datagridState.className,
|
|
41
|
+
rest = _objectWithoutProperties(datagridState, _excluded);
|
|
42
|
+
|
|
43
|
+
var rows = DatagridPagination && datagridState.page || datagridState.rows;
|
|
44
|
+
var dataGrid = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TableContainer, {
|
|
45
|
+
className: cx("".concat(blockClass, "__grid-container"), withVirtualScroll || fullHeightDatagrid ? "".concat(blockClass, "__full-height") : '')
|
|
46
|
+
}, /*#__PURE__*/React.createElement(Table, _extends({}, getTableProps(), {
|
|
47
|
+
className: cx(DatagridPagination ? "".concat(blockClass, "__with-pagination") : '', withVirtualScroll ? '' : "".concat(blockClass, "__table-simple"), "".concat(blockClass, "__vertical-align-").concat(verticalAlign), _defineProperty({}, "".concat(blockClass, "__variable-row-height"), variableRowHeight), (_getTableProps = getTableProps()) === null || _getTableProps === void 0 ? void 0 : _getTableProps.className)
|
|
48
|
+
}), /*#__PURE__*/React.createElement(DatagridHead, datagridState), /*#__PURE__*/React.createElement(DatagridBody, _extends({}, datagridState, {
|
|
49
|
+
rows: rows
|
|
50
|
+
})))), (rows === null || rows === void 0 ? void 0 : rows.length) > 0 && !isFetching && DatagridPagination && DatagridPagination(datagridState), CustomizeColumnsModal && /*#__PURE__*/React.createElement(CustomizeColumnsModal, {
|
|
51
|
+
instance: datagridState
|
|
52
|
+
}));
|
|
53
|
+
return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
|
|
54
|
+
id: tableId,
|
|
55
|
+
ref: ref,
|
|
56
|
+
className: cx(className, blockClass, withVirtualScroll ? "".concat(blockClass, "__datagridWrap") : "".concat(blockClass, "__datagridWrap-simple"))
|
|
57
|
+
}, getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(DatagridToolbar, datagridState), leftPanel && /*#__PURE__*/React.createElement("div", {
|
|
58
|
+
className: "".concat(blockClass, "__grid-container ").concat(blockClass, "__displayFlex")
|
|
59
|
+
}, leftPanel && leftPanel.isOpen && /*#__PURE__*/React.createElement("div", {
|
|
60
|
+
className: "".concat(blockClass, "__datagridLeftPanel")
|
|
61
|
+
}, leftPanel.panelContent), /*#__PURE__*/React.createElement("div", {
|
|
62
|
+
className: "".concat(blockClass, "__datagridWithPanel")
|
|
63
|
+
}, dataGrid)), leftPanel === undefined && dataGrid);
|
|
64
|
+
}); // Return a placeholder if not released and not enabled by feature flag
|
|
65
|
+
|
|
66
|
+
Datagrid = pkg.checkComponentEnabled(Datagrid, componentName); // The display name of the component, used by React. Note that displayName
|
|
67
|
+
// is used in preference to relying on function.name.
|
|
68
|
+
|
|
69
|
+
Datagrid.displayName = componentName;
|
|
70
|
+
export default Datagrid;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Licensed Materials - Property of IBM
|
|
3
|
+
* 5724-Q36
|
|
4
|
+
* (c) Copyright IBM Corp. 2021
|
|
5
|
+
* US Government Users Restricted Rights - Use, duplication or disclosure
|
|
6
|
+
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
|
7
|
+
*/
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import DatagridEmptyBody from './DatagridEmptyBody';
|
|
10
|
+
import DatagridVirtualBody from './DatagridVirtualBody';
|
|
11
|
+
import DatagridSimpleBody from './DatagridSimpleBody';
|
|
12
|
+
import DatagridRefBody from './DatagridRefBody';
|
|
13
|
+
|
|
14
|
+
var DatagridBody = function DatagridBody(datagridState) {
|
|
15
|
+
var isFetching = datagridState.isFetching,
|
|
16
|
+
_datagridState$rows = datagridState.rows,
|
|
17
|
+
rows = _datagridState$rows === void 0 ? [] : _datagridState$rows,
|
|
18
|
+
withVirtualScroll = datagridState.withVirtualScroll,
|
|
19
|
+
withStickyColumn = datagridState.withStickyColumn;
|
|
20
|
+
|
|
21
|
+
if (!isFetching && rows.length === 0) {
|
|
22
|
+
return /*#__PURE__*/React.createElement(DatagridEmptyBody, datagridState);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
if (withVirtualScroll) {
|
|
26
|
+
return /*#__PURE__*/React.createElement(DatagridVirtualBody, datagridState);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
if (withStickyColumn) {
|
|
30
|
+
return /*#__PURE__*/React.createElement(DatagridRefBody, datagridState);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
return /*#__PURE__*/React.createElement(DatagridSimpleBody, datagridState);
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
export default DatagridBody;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Licensed Materials - Property of IBM
|
|
3
|
+
* 5724-Q36
|
|
4
|
+
* (c) Copyright IBM Corp. 2020
|
|
5
|
+
* US Government Users Restricted Rights - Use, duplication or disclosure
|
|
6
|
+
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
|
7
|
+
*/
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import { pkg } from '../../../settings';
|
|
10
|
+
var blockClass = "".concat(pkg.prefix, "--datagrid");
|
|
11
|
+
|
|
12
|
+
var DatagridEmptyBody = function DatagridEmptyBody(datagridState) {
|
|
13
|
+
var EmptyState = datagridState.EmptyState;
|
|
14
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
15
|
+
className: "".concat(blockClass, "__empty-state-body")
|
|
16
|
+
}, EmptyState);
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
export default DatagridEmptyBody;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Licensed Materials - Property of IBM
|
|
3
|
+
* 5724-Q36
|
|
4
|
+
* (c) Copyright IBM Corp. 2020
|
|
5
|
+
* US Government Users Restricted Rights - Use, duplication or disclosure
|
|
6
|
+
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
|
7
|
+
*/
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import { pkg } from '../../../settings';
|
|
10
|
+
var blockClass = "".concat(pkg.prefix, "--datagrid"); // eslint-disable-next-line react/prop-types
|
|
11
|
+
|
|
12
|
+
var DatagridExpandedRow = function DatagridExpandedRow(PreviousRowRenderer, ExpandedRowContentComponent) {
|
|
13
|
+
return function (datagridState) {
|
|
14
|
+
var row = datagridState.row;
|
|
15
|
+
|
|
16
|
+
if (!row.isExpanded) {
|
|
17
|
+
return PreviousRowRenderer(datagridState);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
21
|
+
className: "".concat(blockClass, "__expanded-row")
|
|
22
|
+
}, PreviousRowRenderer(datagridState), ExpandedRowContentComponent(datagridState));
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
export default DatagridExpandedRow;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
|
|
3
|
+
/*
|
|
4
|
+
* Licensed Materials - Property of IBM
|
|
5
|
+
* 5724-Q36
|
|
6
|
+
* (c) Copyright IBM Corp. 2020, 2021
|
|
7
|
+
* US Government Users Restricted Rights - Use, duplication or disclosure
|
|
8
|
+
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
|
9
|
+
*/
|
|
10
|
+
import React from 'react';
|
|
11
|
+
import { DataTable } from 'carbon-components-react';
|
|
12
|
+
var TableHead = DataTable.TableHead;
|
|
13
|
+
|
|
14
|
+
var DatagridHead = function DatagridHead(datagridState) {
|
|
15
|
+
var _datagridState$header = datagridState.headerGroups,
|
|
16
|
+
headerGroups = _datagridState$header === void 0 ? [] : _datagridState$header,
|
|
17
|
+
headRef = datagridState.headRef,
|
|
18
|
+
HeaderRow = datagridState.HeaderRow;
|
|
19
|
+
return /*#__PURE__*/React.createElement(TableHead, null, headerGroups.map(function (headerGroup, index) {
|
|
20
|
+
return (
|
|
21
|
+
/*#__PURE__*/
|
|
22
|
+
// doesn't support header grouping.
|
|
23
|
+
React.createElement("div", _extends({}, headerGroup.getHeaderGroupProps(), {
|
|
24
|
+
ref: headRef,
|
|
25
|
+
key: "header_".concat(index)
|
|
26
|
+
}), HeaderRow(datagridState))
|
|
27
|
+
);
|
|
28
|
+
}));
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
export default DatagridHead;
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
+
|
|
4
|
+
/*
|
|
5
|
+
* Licensed Materials - Property of IBM
|
|
6
|
+
* 5724-Q36
|
|
7
|
+
* (c) Copyright IBM Corp. 2020, 2021
|
|
8
|
+
* US Government Users Restricted Rights - Use, duplication or disclosure
|
|
9
|
+
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
|
10
|
+
*/
|
|
11
|
+
// @flow
|
|
12
|
+
import React from 'react';
|
|
13
|
+
import cx from 'classnames';
|
|
14
|
+
import { DataTable } from 'carbon-components-react';
|
|
15
|
+
import { selectionColumnId } from '../common-column-ids';
|
|
16
|
+
import { pkg } from '../../../settings';
|
|
17
|
+
var blockClass = "".concat(pkg.prefix, "--datagrid");
|
|
18
|
+
|
|
19
|
+
var HeaderRow = function HeaderRow(datagridState) {
|
|
20
|
+
return /*#__PURE__*/React.createElement(TableRow, {
|
|
21
|
+
className: "".concat(blockClass, "__head")
|
|
22
|
+
}, datagridState.headers.filter(function (_ref) {
|
|
23
|
+
var isVisible = _ref.isVisible;
|
|
24
|
+
return isVisible;
|
|
25
|
+
}).map(function (header) {
|
|
26
|
+
var _cx;
|
|
27
|
+
|
|
28
|
+
if (header.id === selectionColumnId) {
|
|
29
|
+
// render directly without the wrapper TableHeader
|
|
30
|
+
return header.render('Header', {
|
|
31
|
+
key: header.id
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
return /*#__PURE__*/React.createElement(TableHeader, _extends({}, header.getHeaderProps(), {
|
|
36
|
+
className: cx((_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__resizableColumn"), header.getResizerProps), _defineProperty(_cx, "".concat(blockClass, "__isResizing"), header.isResizing), _defineProperty(_cx, "".concat(blockClass, "__sortableColumn"), header.canSort), _defineProperty(_cx, "".concat(blockClass, "__isSorted"), header.isSorted), _cx), header.getHeaderProps().className),
|
|
37
|
+
key: header.id
|
|
38
|
+
}), header.render('Header'), header.getResizerProps && /*#__PURE__*/React.createElement("div", _extends({}, header.getResizerProps(), {
|
|
39
|
+
className: "".concat(blockClass, "__resizer")
|
|
40
|
+
})));
|
|
41
|
+
}));
|
|
42
|
+
};
|
|
43
|
+
|
|
44
|
+
var TableHeader = DataTable.TableHeader,
|
|
45
|
+
TableRow = DataTable.TableRow;
|
|
46
|
+
|
|
47
|
+
var useHeaderRow = function useHeaderRow(hooks) {
|
|
48
|
+
var useInstance = function useInstance(instance) {
|
|
49
|
+
Object.assign(instance, {
|
|
50
|
+
HeaderRow: HeaderRow
|
|
51
|
+
});
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
hooks.useInstance.push(useInstance);
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
export default useHeaderRow;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
+
|
|
4
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5
|
+
|
|
6
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
|
+
|
|
8
|
+
/*
|
|
9
|
+
* Licensed Materials - Property of IBM
|
|
10
|
+
* 5724-Q36
|
|
11
|
+
* (c) Copyright IBM Corp. 2021
|
|
12
|
+
* US Government Users Restricted Rights - Use, duplication or disclosure
|
|
13
|
+
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
|
14
|
+
*/
|
|
15
|
+
import React from 'react';
|
|
16
|
+
import cx from 'classnames';
|
|
17
|
+
import { pkg } from '../../../settings';
|
|
18
|
+
var blockClass = "".concat(pkg.prefix, "--datagrid"); // TableBody from carbon is a functional component
|
|
19
|
+
// hence no way to pass the ref to html element without changes in carbon side
|
|
20
|
+
// define html directly here.
|
|
21
|
+
// ref should be passed in thru getTableBodyProps
|
|
22
|
+
|
|
23
|
+
var DatagridRefBody = function DatagridRefBody(datagridState) {
|
|
24
|
+
var getTableBodyProps = datagridState.getTableBodyProps,
|
|
25
|
+
rows = datagridState.rows,
|
|
26
|
+
prepareRow = datagridState.prepareRow;
|
|
27
|
+
return /*#__PURE__*/React.createElement("tbody", _extends({}, getTableBodyProps(), {
|
|
28
|
+
className: cx("".concat(blockClass, "__simple-body"), getTableBodyProps().className)
|
|
29
|
+
}), rows.map(function (row) {
|
|
30
|
+
prepareRow(row);
|
|
31
|
+
return row.RowRenderer(_objectSpread(_objectSpread({}, datagridState), {}, {
|
|
32
|
+
row: row
|
|
33
|
+
}));
|
|
34
|
+
}));
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
export default DatagridRefBody;
|