@carbon/ibm-products 1.14.0 → 1.17.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (109) hide show
  1. package/css/components/Datagrid/styles/datagrid.css +4 -0
  2. package/css/components/Datagrid/styles/datagrid.css.map +1 -1
  3. package/css/components/Datagrid/styles/index.css +5 -1
  4. package/css/components/Datagrid/styles/index.css.map +1 -1
  5. package/css/components/Datagrid/styles/useNestedRows.css +1 -1
  6. package/css/index-full-carbon.css +75 -16
  7. package/css/index-full-carbon.css.map +1 -1
  8. package/css/index-full-carbon.min.css +6 -3
  9. package/css/index-full-carbon.min.css.map +1 -1
  10. package/css/index-without-carbon-released-only.css +13 -7
  11. package/css/index-without-carbon-released-only.css.map +1 -1
  12. package/css/index-without-carbon-released-only.min.css +5 -2
  13. package/css/index-without-carbon-released-only.min.css.map +1 -1
  14. package/css/index-without-carbon.css +75 -16
  15. package/css/index-without-carbon.css.map +1 -1
  16. package/css/index-without-carbon.min.css +6 -3
  17. package/css/index-without-carbon.min.css.map +1 -1
  18. package/css/index.css +75 -16
  19. package/css/index.css.map +1 -1
  20. package/css/index.min.css +6 -3
  21. package/css/index.min.css.map +1 -1
  22. package/es/components/AddSelect/AddSelect.js +34 -23
  23. package/es/components/AddSelect/AddSelectFilter.js +52 -9
  24. package/es/components/DataSpreadsheet/DataSpreadsheet.js +186 -129
  25. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +67 -15
  26. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +55 -11
  27. package/es/components/DataSpreadsheet/hooks/index.js +2 -1
  28. package/es/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +36 -8
  29. package/es/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +113 -0
  30. package/es/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js +16 -0
  31. package/es/components/DataSpreadsheet/utils/createCellSelectionArea.js +29 -12
  32. package/es/components/DataSpreadsheet/utils/generateData.js +17 -9
  33. package/es/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +18 -0
  34. package/es/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +30 -0
  35. package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +121 -0
  36. package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +108 -0
  37. package/es/components/DataSpreadsheet/utils/handleEditSubmit.js +87 -0
  38. package/es/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +46 -8
  39. package/es/components/DataSpreadsheet/utils/handleMultipleKeys.js +153 -15
  40. package/es/components/DataSpreadsheet/utils/selectAllCells.js +53 -0
  41. package/es/components/Datagrid/Datagrid/Datagrid.js +24 -12
  42. package/es/components/Datagrid/Datagrid/DatagridHead.js +8 -16
  43. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +10 -10
  44. package/es/components/Datagrid/Datagrid/DatagridRow.js +12 -2
  45. package/es/components/Datagrid/Datagrid/index.js +6 -7
  46. package/es/components/Datagrid/index.js +1 -1
  47. package/es/components/Datagrid/useNestedRows.js +3 -3
  48. package/es/components/Datagrid/useRowExpander.js +1 -1
  49. package/es/components/ExportModal/ExportModal.js +10 -5
  50. package/es/components/MultiAddSelect/MultiAddSelect.js +150 -3
  51. package/es/components/PageHeader/PageHeader.js +3 -1
  52. package/es/components/SidePanel/SidePanel.js +5 -1
  53. package/es/components/SingleAddSelect/SingleAddSelect.js +90 -4
  54. package/es/components/TagSet/TagSet.js +13 -6
  55. package/es/components/Tearsheet/TearsheetShell.js +34 -10
  56. package/es/components/WebTerminal/WebTerminal.js +36 -11
  57. package/es/components/WebTerminal/WebTerminalContentWrapper.js +49 -0
  58. package/es/components/WebTerminal/index.js +2 -1
  59. package/es/components/index.js +1 -1
  60. package/es/global/js/package-settings.js +3 -1
  61. package/lib/components/AddSelect/AddSelect.js +34 -23
  62. package/lib/components/AddSelect/AddSelectFilter.js +51 -8
  63. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +190 -128
  64. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +69 -15
  65. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +58 -12
  66. package/lib/components/DataSpreadsheet/hooks/index.js +9 -1
  67. package/lib/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +36 -8
  68. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +129 -0
  69. package/lib/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js +26 -0
  70. package/lib/components/DataSpreadsheet/utils/createCellSelectionArea.js +31 -13
  71. package/lib/components/DataSpreadsheet/utils/generateData.js +17 -9
  72. package/lib/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +27 -0
  73. package/lib/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +40 -0
  74. package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +127 -0
  75. package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +118 -0
  76. package/lib/components/DataSpreadsheet/utils/handleEditSubmit.js +94 -0
  77. package/lib/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +48 -8
  78. package/lib/components/DataSpreadsheet/utils/handleMultipleKeys.js +161 -22
  79. package/lib/components/DataSpreadsheet/utils/selectAllCells.js +60 -0
  80. package/lib/components/Datagrid/Datagrid/Datagrid.js +25 -8
  81. package/lib/components/Datagrid/Datagrid/DatagridHead.js +8 -16
  82. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +10 -10
  83. package/lib/components/Datagrid/Datagrid/DatagridRow.js +14 -2
  84. package/lib/components/Datagrid/Datagrid/index.js +3 -5
  85. package/lib/components/Datagrid/index.js +2 -2
  86. package/lib/components/Datagrid/useNestedRows.js +3 -3
  87. package/lib/components/Datagrid/useRowExpander.js +1 -1
  88. package/lib/components/ExportModal/ExportModal.js +9 -4
  89. package/lib/components/MultiAddSelect/MultiAddSelect.js +150 -2
  90. package/lib/components/PageHeader/PageHeader.js +3 -1
  91. package/lib/components/SidePanel/SidePanel.js +5 -1
  92. package/lib/components/SingleAddSelect/SingleAddSelect.js +91 -3
  93. package/lib/components/TagSet/TagSet.js +13 -6
  94. package/lib/components/Tearsheet/TearsheetShell.js +36 -10
  95. package/lib/components/WebTerminal/WebTerminal.js +36 -10
  96. package/lib/components/WebTerminal/WebTerminalContentWrapper.js +58 -0
  97. package/lib/components/WebTerminal/index.js +9 -1
  98. package/lib/components/index.js +6 -0
  99. package/lib/global/js/package-settings.js +3 -1
  100. package/package.json +13 -13
  101. package/scss/components/AboutModal/_about-modal.scss +4 -0
  102. package/scss/components/AddSelect/_add-select.scss +9 -2
  103. package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +39 -2
  104. package/scss/components/Datagrid/styles/datagrid.scss +8 -0
  105. package/scss/components/Datagrid/styles/useNestedRows.scss +1 -1
  106. package/scss/components/ExportModal/_export-modal.scss +0 -4
  107. package/scss/components/SidePanel/_side-panel.scss +22 -3
  108. package/scss/components/WebTerminal/_storybook-styles.scss +5 -0
  109. package/scss/components/WebTerminal/_web-terminal.scss +14 -4
@@ -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,6 +11,17 @@
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
+ };
8
25
  export var includesShift = function includesShift(arr) {
9
26
  if (arr.includes('ShiftLeft') || arr.includes('ShiftRight')) {
10
27
  return true;
@@ -30,7 +47,7 @@ var includesControl = function includesControl(arr) {
30
47
  };
31
48
 
32
49
  export var handleMultipleKeys = function handleMultipleKeys(_ref) {
33
- var _selectionAreasClone$;
50
+ var _selectionAreasClone$, _selectionAreasClone$2, _selectionAreasClone$3;
34
51
 
35
52
  var activeCellCoordinates = _ref.activeCellCoordinates,
36
53
  event = _ref.event,
@@ -39,15 +56,21 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
39
56
  currentMatcher = _ref.currentMatcher,
40
57
  rows = _ref.rows,
41
58
  setSelectionAreas = _ref.setSelectionAreas,
42
- columns = _ref.columns;
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;
43
66
  var selectionAreasClone = deepCloneObject(selectionAreas);
44
67
  var indexOfCurrentArea = selectionAreasClone.findIndex(function (item) {
45
68
  return item.matcher === currentMatcher;
46
69
  });
47
- 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
48
71
 
49
72
  if (includesShift(keysPressedList) && keysPressedList.includes('ArrowDown') && keysPressedList.length === 2) {
50
- if (rows.length - 1 === pointToUpdate.row) {
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') {
51
74
  return;
52
75
  }
53
76
 
@@ -62,7 +85,7 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
62
85
 
63
86
 
64
87
  if (includesShift(keysPressedList) && keysPressedList.includes('ArrowRight') && keysPressedList.length === 2) {
65
- if (columns.length - 1 === pointToUpdate.column) {
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') {
66
89
  return;
67
90
  }
68
91
 
@@ -77,7 +100,7 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
77
100
 
78
101
 
79
102
  if (includesShift(keysPressedList) && keysPressedList.includes('ArrowUp') && keysPressedList.length === 2) {
80
- if (pointToUpdate.row === 0) {
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') {
81
104
  return;
82
105
  }
83
106
 
@@ -92,7 +115,7 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
92
115
 
93
116
 
94
117
  if (includesShift(keysPressedList) && keysPressedList.includes('ArrowLeft') && keysPressedList.length === 2) {
95
- if (pointToUpdate.column === 0) {
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') {
96
119
  return;
97
120
  }
98
121
 
@@ -106,7 +129,7 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
106
129
  } // CMD + a (select all)
107
130
 
108
131
 
109
- if (includesMeta(keysPressedList) && keysPressedList.includes('KeyA')) {
132
+ if (includesResourceKey(keysPressedList, usingMac) && keysPressedList.includes('KeyA')) {
110
133
  event.preventDefault();
111
134
  var selectionPoint1 = {
112
135
  row: 0,
@@ -115,7 +138,20 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
115
138
  var selectionPoint2 = {
116
139
  row: rows.length - 1,
117
140
  column: columns.length - 1
118
- };
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
+
119
155
  selectionAreasClone[indexOfCurrentArea].point1 = selectionPoint1;
120
156
  selectionAreasClone[indexOfCurrentArea].point2 = selectionPoint2;
121
157
  selectionAreasClone[indexOfCurrentArea].areaCreated = false;
@@ -126,12 +162,35 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
126
162
  if (includesControl(keysPressedList) && keysPressedList.includes('Space')) {
127
163
  var _selectionPoint = {
128
164
  row: 0,
129
- column: activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column
165
+ column: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column
130
166
  };
131
167
  var _selectionPoint2 = {
132
168
  row: rows.length - 1,
133
- column: activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column
134
- };
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
+
135
194
  selectionAreasClone[indexOfCurrentArea].point1 = _selectionPoint;
136
195
  selectionAreasClone[indexOfCurrentArea].point2 = _selectionPoint2;
137
196
  selectionAreasClone[indexOfCurrentArea].areaCreated = false;
@@ -141,16 +200,95 @@ export var handleMultipleKeys = function handleMultipleKeys(_ref) {
141
200
 
142
201
  if (includesShift(keysPressedList) && keysPressedList.includes('Space')) {
143
202
  var _selectionPoint3 = {
144
- row: activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row,
203
+ row: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row,
145
204
  column: 0
146
205
  };
147
206
  var _selectionPoint4 = {
148
- row: activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row,
207
+ row: (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' ? 0 : activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row,
149
208
  column: columns.length - 1
150
- };
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
+
151
234
  selectionAreasClone[indexOfCurrentArea].point1 = _selectionPoint3;
152
235
  selectionAreasClone[indexOfCurrentArea].point2 = _selectionPoint4;
153
236
  selectionAreasClone[indexOfCurrentArea].areaCreated = false;
154
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
+ }
155
293
  }
156
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
+ };
@@ -1,16 +1,16 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- var _excluded = ["getTableProps", "withVirtualScroll", "DatagridPagination", "isFetching", "tableId", "CustomizeColumnsModal", "leftPanel", "fullHeightDatagrid", "verticalAlign", "variableRowHeight", "className"];
4
+ var _excluded = ["datagridState"];
5
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.
6
+ /**
7
+ * Copyright IBM Corp. 2020, 2022
8
+ *
9
+ * This source code is licensed under the Apache-2.0 license found in the
10
+ * LICENSE file in the root directory of this source tree.
12
11
  */
13
12
  import React from 'react';
13
+ import PropTypes from 'prop-types';
14
14
  import { DataTable } from 'carbon-components-react';
15
15
  import cx from 'classnames';
16
16
  import DatagridHead from './DatagridHead';
@@ -18,13 +18,22 @@ import DatagridBody from './DatagridBody';
18
18
  import DatagridToolbar from './DatagridToolbar';
19
19
  import { getDevtoolsProps } from '../../../global/js/utils/devtools';
20
20
  import { pkg } from '../../../settings';
21
+ import pconsole from '../../../global/js/utils/pconsole';
21
22
  var blockClass = "".concat(pkg.prefix, "--datagrid");
22
23
  var componentName = 'Datagrid';
23
24
  var TableContainer = DataTable.TableContainer,
24
25
  Table = DataTable.Table;
25
- var Datagrid = /*#__PURE__*/React.forwardRef(function (datagridState, ref) {
26
+ export var Datagrid = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
26
27
  var _getTableProps;
27
28
 
29
+ var datagridState = _ref.datagridState,
30
+ rest = _objectWithoutProperties(_ref, _excluded);
31
+
32
+ if (!datagridState) {
33
+ pconsole.warn('Datagrid was not passed datagridState which is required to render this component.');
34
+ return null;
35
+ }
36
+
28
37
  var _datagridState$getTab = datagridState.getTableProps,
29
38
  getTableProps = _datagridState$getTab === void 0 ? function () {} : _datagridState$getTab,
30
39
  withVirtualScroll = datagridState.withVirtualScroll,
@@ -37,9 +46,7 @@ var Datagrid = /*#__PURE__*/React.forwardRef(function (datagridState, ref) {
37
46
  _datagridState$vertic = datagridState.verticalAlign,
38
47
  verticalAlign = _datagridState$vertic === void 0 ? 'center' : _datagridState$vertic,
39
48
  variableRowHeight = datagridState.variableRowHeight,
40
- className = datagridState.className,
41
- rest = _objectWithoutProperties(datagridState, _excluded);
42
-
49
+ className = datagridState.className;
43
50
  var rows = DatagridPagination && datagridState.page || datagridState.rows;
44
51
  var dataGrid = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TableContainer, {
45
52
  className: cx("".concat(blockClass, "__grid-container"), withVirtualScroll || fullHeightDatagrid ? "".concat(blockClass, "__full-height") : '')
@@ -67,4 +74,9 @@ Datagrid = pkg.checkComponentEnabled(Datagrid, componentName); // The display na
67
74
  // is used in preference to relying on function.name.
68
75
 
69
76
  Datagrid.displayName = componentName;
70
- export default Datagrid;
77
+ Datagrid.propTypes = {
78
+ /**
79
+ * The data grid state, much of it being supplied by the useDatagrid hook
80
+ */
81
+ datagridState: PropTypes.object.isRequired
82
+ };
@@ -1,11 +1,8 @@
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.
1
+ /**
2
+ * Copyright IBM Corp. 2020, 2022
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.
9
6
  */
10
7
  import React from 'react';
11
8
  import { DataTable } from 'carbon-components-react';
@@ -16,14 +13,9 @@ var DatagridHead = function DatagridHead(datagridState) {
16
13
  headerGroups = _datagridState$header === void 0 ? [] : _datagridState$header,
17
14
  headRef = datagridState.headRef,
18
15
  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))
16
+ return /*#__PURE__*/React.createElement(TableHead, null, headerGroups.map(function (headerGroup) {
17
+ return (// doesn't support header grouping.
18
+ HeaderRow(datagridState, headRef, headerGroup)
27
19
  );
28
20
  }));
29
21
  };
@@ -1,12 +1,11 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
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.
4
+ /**
5
+ * Copyright IBM Corp. 2020, 2022
6
+ *
7
+ * This source code is licensed under the Apache-2.0 license found in the
8
+ * LICENSE file in the root directory of this source tree.
10
9
  */
11
10
  // @flow
12
11
  import React from 'react';
@@ -16,10 +15,11 @@ import { selectionColumnId } from '../common-column-ids';
16
15
  import { pkg } from '../../../settings';
17
16
  var blockClass = "".concat(pkg.prefix, "--datagrid");
18
17
 
19
- var HeaderRow = function HeaderRow(datagridState) {
20
- return /*#__PURE__*/React.createElement(TableRow, {
21
- className: "".concat(blockClass, "__head")
22
- }, datagridState.headers.filter(function (_ref) {
18
+ var HeaderRow = function HeaderRow(datagridState, headRef, headerGroup) {
19
+ return /*#__PURE__*/React.createElement(TableRow, _extends({}, headerGroup.getHeaderGroupProps(), {
20
+ className: cx("".concat(blockClass, "__head"), headerGroup.getHeaderGroupProps().className),
21
+ ref: headRef
22
+ }), datagridState.headers.filter(function (_ref) {
23
23
  var isVisible = _ref.isVisible;
24
24
  return isVisible;
25
25
  }).map(function (header) {
@@ -1,5 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
4
  var _excluded = ["children"];
4
5
 
5
6
  /*
@@ -13,6 +14,7 @@ var _excluded = ["children"];
13
14
  import React from 'react';
14
15
  import { DataTable, SkeletonText } from 'carbon-components-react';
15
16
  import { selectionColumnId } from '../common-column-ids';
17
+ import cx from 'classnames';
16
18
  import { pkg } from '../../../settings';
17
19
  var blockClass = "".concat(pkg.prefix, "--datagrid");
18
20
  var TableRow = DataTable.TableRow,
@@ -21,9 +23,17 @@ var TableRow = DataTable.TableRow,
21
23
  var DatagridRow = function DatagridRow(datagridState) {
22
24
  var row = datagridState.row;
23
25
  return /*#__PURE__*/React.createElement(TableRow, _extends({
24
- className: "".concat(blockClass, "__carbon-row")
26
+ className: cx("".concat(blockClass, "__carbon-row"), _defineProperty({}, "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded))
25
27
  }, row.getRowProps(), {
26
- key: row.id
28
+ key: row.id,
29
+ onMouseEnter: function onMouseEnter(event) {
30
+ var hoverRow = event.target.closest(".".concat(blockClass, "__carbon-row-expanded"));
31
+ hoverRow === null || hoverRow === void 0 ? void 0 : hoverRow.classList.add("".concat(blockClass, "__carbon-row-expanded-hover-active"));
32
+ },
33
+ onMouseLeave: function onMouseLeave(event) {
34
+ var hoverRow = event.target.closest(".".concat(blockClass, "__carbon-row-expanded"));
35
+ hoverRow === null || hoverRow === void 0 ? void 0 : hoverRow.classList.remove("".concat(blockClass, "__carbon-row-expanded-hover-active"));
36
+ }
27
37
  }), row.cells.map(function (cell) {
28
38
  var cellProps = cell.getCellProps();
29
39
 
@@ -1,8 +1,7 @@
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.
1
+ /**
2
+ * Copyright IBM Corp. 2020, 2022
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.
7
6
  */
8
- export { default } from './Datagrid';
7
+ export { Datagrid } from './Datagrid';
@@ -5,7 +5,7 @@
5
5
  * US Government Users Restricted Rights - Use, duplication or disclosure
6
6
  * restricted by GSA ADP Schedule Contract with IBM Corp.
7
7
  */
8
- export { default as Datagrid } from './Datagrid';
8
+ export { Datagrid } from './Datagrid';
9
9
  export { default as useDatagrid } from './useDatagrid';
10
10
  export { default as useInfiniteScroll } from './useInfiniteScroll';
11
11
  export { default as useNestedRows } from './useNestedRows';
@@ -11,7 +11,7 @@ var blockClass = "".concat(pkg.prefix, "--datagrid");
11
11
 
12
12
  var useNestedRows = function useNestedRows(hooks) {
13
13
  useRowExpander(hooks);
14
- var marginLeft = 32;
14
+ var marginLeft = 24;
15
15
 
16
16
  var getRowProps = function getRowProps(props, _ref) {
17
17
  var row = _ref.row;
@@ -25,7 +25,7 @@ var useNestedRows = function useNestedRows(hooks) {
25
25
  return [props, {
26
26
  style: {
27
27
  marginLeft: "".concat(row.depth > 0 ? marginLeft : 0, "px"),
28
- paddingLeft: "".concat(row.depth > 1 ? marginLeft * (row.depth - 1) : 0, "px"),
28
+ paddingLeft: "".concat(row.depth > 1 ? marginLeft * (row.depth - 1) + marginLeft : row.depth === 1 ? marginLeft : 0, "px"),
29
29
  maxWidth: "calc(100% - ".concat(marginLeft * row.depth, "px)")
30
30
  }
31
31
  }];
@@ -40,7 +40,7 @@ var useNestedRows = function useNestedRows(hooks) {
40
40
  }) === 0;
41
41
  return [props, {
42
42
  style: {
43
- marginRight: isFirstCell ? "-".concat(marginLeft * cell.row.depth, "px") : ''
43
+ marginRight: "".concat(isFirstCell && cell.row.depth > 0 ? "-".concat(marginLeft * (cell.row.depth + 1), "px") : '')
44
44
  }
45
45
  }];
46
46
  };
@@ -20,7 +20,7 @@ var useRowExpander = function useRowExpander(hooks) {
20
20
  var row = _ref.row;
21
21
  return row.canExpand && /*#__PURE__*/React.createElement("span", row.getToggleRowExpandedProps(), row.isExpanded ? /*#__PURE__*/React.createElement(ChevronUp16, null) : /*#__PURE__*/React.createElement(ChevronDown16, null));
22
22
  },
23
- width: 32,
23
+ width: 48,
24
24
  disableResizing: true,
25
25
  disableSortBy: true,
26
26
  Header: ''
@@ -14,7 +14,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
14
14
  // This source code is licensed under the Apache-2.0 license found in the
15
15
  // LICENSE file in the root directory of this source tree.
16
16
  //
17
- import React, { useState, useRef, forwardRef } from 'react';
17
+ import React, { useState, useRef, forwardRef, useEffect } from 'react';
18
18
  import { Button, ComposedModal, ModalHeader, ModalFooter, ModalBody, TextInput, RadioButton, RadioButtonGroup, FormGroup, Loading, PasswordInput } from 'carbon-components-react';
19
19
  import cx from 'classnames';
20
20
  import { ErrorFilled16, CheckmarkFilled16 } from '@carbon/icons-react';
@@ -30,8 +30,6 @@ var defaults = {
30
30
  validExtensions: Object.freeze([])
31
31
  };
32
32
  export var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
33
- var _preformattedExtensio;
34
-
35
33
  var body = _ref.body,
36
34
  className = _ref.className,
37
35
  error = _ref.error,
@@ -60,7 +58,7 @@ export var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
60
58
  validExtensions = _ref$validExtensions === void 0 ? defaults.validExtensions : _ref$validExtensions,
61
59
  rest = _objectWithoutProperties(_ref, _excluded);
62
60
 
63
- var _useState = useState(filename),
61
+ var _useState = useState(''),
64
62
  _useState2 = _slicedToArray(_useState, 2),
65
63
  name = _useState2[0],
66
64
  setName = _useState2[1];
@@ -71,11 +69,18 @@ export var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
71
69
  setDirtyInput = _useState4[1]; // by default (if it exists) use the first extension in the extension array
72
70
 
73
71
 
74
- var _useState5 = useState(preformattedExtensions === null || preformattedExtensions === void 0 ? void 0 : (_preformattedExtensio = preformattedExtensions[0]) === null || _preformattedExtensio === void 0 ? void 0 : _preformattedExtensio.extension),
72
+ var _useState5 = useState(''),
75
73
  _useState6 = _slicedToArray(_useState5, 2),
76
74
  extension = _useState6[0],
77
75
  setExtension = _useState6[1];
78
76
 
77
+ useEffect(function () {
78
+ var _preformattedExtensio;
79
+
80
+ setName(filename);
81
+ setExtension(preformattedExtensions === null || preformattedExtensions === void 0 ? void 0 : (_preformattedExtensio = preformattedExtensions[0]) === null || _preformattedExtensio === void 0 ? void 0 : _preformattedExtensio.extension);
82
+ }, [filename, preformattedExtensions]);
83
+
79
84
  var onNameChangeHandler = function onNameChangeHandler(evt) {
80
85
  setName(evt.target.value);
81
86
  };