@carbon/ibm-products 1.50.0 → 1.52.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (101) hide show
  1. package/README.md +10 -5
  2. package/css/index-full-carbon.css +131 -82
  3. package/css/index-full-carbon.css.map +1 -1
  4. package/css/index-full-carbon.min.css +2 -2
  5. package/css/index-full-carbon.min.css.map +1 -1
  6. package/css/index-without-carbon-released-only.css +38 -11
  7. package/css/index-without-carbon-released-only.css.map +1 -1
  8. package/css/index-without-carbon-released-only.min.css +1 -1
  9. package/css/index-without-carbon-released-only.min.css.map +1 -1
  10. package/css/index-without-carbon.css +131 -82
  11. package/css/index-without-carbon.css.map +1 -1
  12. package/css/index-without-carbon.min.css +2 -2
  13. package/css/index-without-carbon.min.css.map +1 -1
  14. package/css/index.css +131 -82
  15. package/css/index.css.map +1 -1
  16. package/css/index.min.css +2 -2
  17. package/css/index.min.css.map +1 -1
  18. package/es/components/AboutModal/AboutModal.js +3 -4
  19. package/es/components/ActionBar/ActionBar.js +9 -18
  20. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +8 -13
  21. package/es/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +7 -11
  22. package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +8 -8
  23. package/es/components/Datagrid/Datagrid/DatagridToolbar.js +5 -5
  24. package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +3 -4
  25. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +17 -3
  26. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +17 -2
  27. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +8 -4
  28. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +2 -1
  29. package/es/components/Datagrid/Datagrid/addons/Filtering/utils.js +14 -0
  30. package/es/components/Datagrid/index.js +1 -0
  31. package/es/components/Datagrid/useActionsColumn.js +10 -7
  32. package/es/components/Datagrid/useCustomizeColumns.js +5 -1
  33. package/es/components/Datagrid/useEditableCell.js +12 -0
  34. package/es/components/Datagrid/useExpandedRow.js +11 -7
  35. package/es/components/Datagrid/useFiltering.js +15 -10
  36. package/es/components/Datagrid/useInlineEdit.js +17 -8
  37. package/es/components/Datagrid/useNestedRows.js +10 -6
  38. package/es/components/Datagrid/useOnRowClick.js +9 -1
  39. package/es/components/Datagrid/useSelectRows.js +2 -0
  40. package/es/components/EditInPlace/EditInPlace.js +43 -0
  41. package/es/components/EditInPlace/index.js +8 -0
  42. package/es/components/ExampleComponent/ExampleComponent.js +32 -4
  43. package/es/components/ExampleComponent/useExample.js +49 -0
  44. package/es/components/InlineEdit/InlineEdit.js +5 -1
  45. package/es/components/InlineEditV1/InlineEditV1.js +7 -2
  46. package/es/components/InlineEditV2/InlineEditV2.js +51 -15
  47. package/es/components/NonLinearReading/NonLinearReading.js +7 -7
  48. package/es/components/PageHeader/PageHeader.js +28 -31
  49. package/es/components/SidePanel/SidePanel.js +25 -26
  50. package/es/components/TagSet/TagSet.js +5 -7
  51. package/es/components/Tearsheet/TearsheetShell.js +4 -6
  52. package/es/components/index.js +2 -1
  53. package/es/global/js/hooks/useResizeObserver.js +74 -0
  54. package/es/global/js/package-settings.js +35 -4
  55. package/es/global/js/utils/test-helper.js +34 -3
  56. package/es/settings.js +40 -29
  57. package/lib/components/AboutModal/AboutModal.js +3 -4
  58. package/lib/components/ActionBar/ActionBar.js +9 -18
  59. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +8 -13
  60. package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +7 -11
  61. package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +2 -1
  62. package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +4 -4
  63. package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +3 -4
  64. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +17 -3
  65. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +17 -2
  66. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +8 -4
  67. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +2 -1
  68. package/lib/components/Datagrid/Datagrid/addons/Filtering/utils.js +15 -0
  69. package/lib/components/Datagrid/index.js +7 -0
  70. package/lib/components/Datagrid/useActionsColumn.js +7 -1
  71. package/lib/components/Datagrid/useCustomizeColumns.js +4 -0
  72. package/lib/components/Datagrid/useEditableCell.js +20 -0
  73. package/lib/components/Datagrid/useExpandedRow.js +4 -0
  74. package/lib/components/Datagrid/useFiltering.js +8 -2
  75. package/lib/components/Datagrid/useInlineEdit.js +19 -8
  76. package/lib/components/Datagrid/useNestedRows.js +9 -6
  77. package/lib/components/Datagrid/useOnRowClick.js +9 -1
  78. package/lib/components/Datagrid/useSelectRows.js +2 -0
  79. package/lib/components/EditInPlace/EditInPlace.js +46 -0
  80. package/lib/components/EditInPlace/index.js +12 -0
  81. package/lib/components/ExampleComponent/ExampleComponent.js +35 -4
  82. package/lib/components/ExampleComponent/useExample.js +58 -0
  83. package/lib/components/InlineEdit/InlineEdit.js +5 -1
  84. package/lib/components/InlineEditV1/InlineEditV1.js +7 -2
  85. package/lib/components/InlineEditV2/InlineEditV2.js +53 -16
  86. package/lib/components/NonLinearReading/NonLinearReading.js +6 -6
  87. package/lib/components/PageHeader/PageHeader.js +28 -31
  88. package/lib/components/SidePanel/SidePanel.js +25 -26
  89. package/lib/components/TagSet/TagSet.js +5 -7
  90. package/lib/components/Tearsheet/TearsheetShell.js +4 -6
  91. package/lib/components/index.js +13 -0
  92. package/lib/global/js/hooks/useResizeObserver.js +83 -0
  93. package/lib/global/js/package-settings.js +34 -3
  94. package/lib/global/js/utils/test-helper.js +37 -5
  95. package/lib/settings.js +41 -30
  96. package/package.json +2 -3
  97. package/scss/components/Datagrid/styles/_useSelectAllToggle.scss +10 -7
  98. package/scss/components/InlineEditV2/_inline-edit-v2.scss +52 -11
  99. package/scss/components/InlineEditV2/_storybook-styles.scss +9 -2
  100. package/scss/components/NonLinearReading/_non-linear-reading.scss +76 -67
  101. package/scss/components/NonLinearReading/_storybook-styles.scss +16 -0
@@ -23,7 +23,7 @@ import PropTypes from 'prop-types';
23
23
  import cx from 'classnames';
24
24
  import { Link, TooltipIcon } from 'carbon-components-react';
25
25
  import { pkg, carbon } from '../../settings';
26
- import { useResizeDetector } from 'react-resize-detector';
26
+ import { useResizeObserver } from '../../global/js/hooks/useResizeObserver';
27
27
  import { ArrowLeft16 } from '@carbon/icons-react';
28
28
 
29
29
  // Carbon and package components we use.
@@ -238,24 +238,19 @@ export var BreadcrumbWithOverflow = function BreadcrumbWithOverflow(_ref) {
238
238
  /* istanbul ignore next */ // not sure how to test resize
239
239
  checkFullyVisibleBreadcrumbItems();
240
240
  };
241
-
242
- /* istanbul ignore next */ // not sure how to test resize
243
- var handleBreadcrumbItemsResize = function handleBreadcrumbItemsResize() {
244
- /* istanbul ignore next */ // not sure how to test resize
245
- checkFullyVisibleBreadcrumbItems();
246
- };
247
241
  var backItem = breadcrumbs[breadcrumbs.length - 1];
248
242
  /* istanbul ignore if */ // not sure how to test media queries
249
243
  if (backItem.isCurrentPage) {
250
244
  backItem = breadcrumbs[breadcrumbs.length - 2];
251
245
  }
252
- useResizeDetector({
253
- onResize: handleBreadcrumbItemsResize,
254
- targetRef: sizingContainerRef
246
+
247
+ // container resize
248
+ useResizeObserver(sizingContainerRef, {
249
+ callback: handleResize
255
250
  });
256
- useResizeDetector({
257
- onResize: handleResize,
258
- targetRef: breadcrumbItemWithOverflow
251
+ // item resize
252
+ useResizeObserver(breadcrumbItemWithOverflow, {
253
+ callback: handleResize
259
254
  });
260
255
  return /*#__PURE__*/React.createElement("div", {
261
256
  className: cx(blockClass, className, _defineProperty({}, "".concat(blockClass, "__with-items"), displayedBreadcrumbItems.length > 1)),
@@ -21,7 +21,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
21
21
  import React, { useEffect, useState, useRef } from 'react';
22
22
  import PropTypes from 'prop-types';
23
23
  import cx from 'classnames';
24
- import { useResizeDetector } from 'react-resize-detector';
24
+ import { useResizeObserver } from '../../global/js/hooks/useResizeObserver';
25
25
  import { ButtonSet, Button } from 'carbon-components-react';
26
26
  import { ButtonMenu, ButtonMenuItem } from '../ButtonMenu';
27
27
  import { pkg, carbon } from '../../settings';
@@ -135,18 +135,14 @@ export var ButtonSetWithOverflow = function ButtonSetWithOverflow(_ref) {
135
135
  }, prepareProps(other, ['iconDescription', 'renderIcon'])));
136
136
  }).reverse());
137
137
  });
138
- useResizeDetector({
139
- onResize: checkFullyVisibleItems,
140
- targetRef: sizingContainerRefSet
138
+ useResizeObserver(sizingContainerRefSet, {
139
+ callback: checkFullyVisibleItems
141
140
  });
142
- useResizeDetector({
143
- onResize: checkFullyVisibleItems,
144
- targetRef: sizingContainerRefCombo
141
+ useResizeObserver(sizingContainerRefCombo, {
142
+ callback: checkFullyVisibleItems
145
143
  });
146
- useResizeDetector({
147
- onResize: checkFullyVisibleItems,
148
- targetRef: spaceAvailableRef,
149
- handleWidth: true
144
+ useResizeObserver(spaceAvailableRef, {
145
+ callback: checkFullyVisibleItems
150
146
  });
151
147
  return /*#__PURE__*/React.createElement("div", {
152
148
  className: cx([blockClass, className, _defineProperty({}, "".concat(blockClass, "--right"), rightAlign)]),
@@ -3,14 +3,13 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
4
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
5
5
  var _excluded = ["onChange"];
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, 2023
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
- // @flow
12
+
14
13
  import React, { useEffect, useState, useLayoutEffect } from 'react';
15
14
  import PropTypes from 'prop-types';
16
15
  import cx from 'classnames';
@@ -84,7 +83,8 @@ var SelectAllWithToggle = function SelectAllWithToggle(_ref) {
84
83
  id: "".concat(tableId, "-select-all-checkbox-id")
85
84
  }))), /*#__PURE__*/React.createElement(OverflowMenu, {
86
85
  renderIcon: CaretDown16,
87
- size: "sm"
86
+ size: "sm",
87
+ menuOptionsClass: "".concat(blockClass, "__select-all-toggle-overflow")
88
88
  }, /*#__PURE__*/React.createElement(OverflowMenuItem, {
89
89
  itemText: allPageRowsLabel,
90
90
  requireTitle: true,
@@ -7,10 +7,10 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
7
7
  * LICENSE file in the root directory of this source tree.
8
8
  */
9
9
 
10
- import React, { useEffect, useState } from 'react';
10
+ import React, { useEffect, useRef, useState } from 'react';
11
11
  import { Add16, OverflowMenuVertical16 } from '@carbon/icons-react';
12
12
  import { DataTable, TableBatchActions, TableBatchAction } from 'carbon-components-react';
13
- import { useResizeDetector } from 'react-resize-detector';
13
+ import { useResizeObserver } from '../../../global/js/hooks/useResizeObserver';
14
14
  import { ButtonMenu, ButtonMenuItem } from '../../ButtonMenu';
15
15
  import { pkg, carbon } from '../../../settings';
16
16
  import cx from 'classnames';
@@ -124,9 +124,9 @@ var DatagridBatchActionsToolbar = function DatagridBatchActionsToolbar(datagridS
124
124
  })), renderBatchActionOverflow());
125
125
  };
126
126
  var DatagridToolbar = function DatagridToolbar(datagridState) {
127
- var _useResizeDetector = useResizeDetector(),
128
- width = _useResizeDetector.width,
129
- ref = _useResizeDetector.ref;
127
+ var ref = useRef(null);
128
+ var _useResizeObserver = useResizeObserver(ref),
129
+ width = _useResizeObserver.width;
130
130
  var DatagridActions = datagridState.DatagridActions,
131
131
  DatagridBatchActions = datagridState.DatagridBatchActions,
132
132
  batchActions = datagridState.batchActions,
@@ -13,7 +13,7 @@ import React, { useEffect } from 'react';
13
13
  import { VariableSizeList } from 'react-window';
14
14
  import { DataTable } from 'carbon-components-react';
15
15
  import { px } from '@carbon/layout';
16
- import { useResizeDetector } from 'react-resize-detector';
16
+ import { useResizeObserver } from '../../../global/js/hooks/useResizeObserver';
17
17
  import { pkg } from '../../../settings';
18
18
  import DatagridHead from './DatagridHead';
19
19
  var blockClass = "".concat(pkg.prefix, "--datagrid");
@@ -51,9 +51,8 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
51
51
  var gridRefElement = gridRef === null || gridRef === void 0 ? void 0 : gridRef.current;
52
52
  gridRefElement.style.width = gridRefElement === null || gridRefElement === void 0 ? void 0 : gridRefElement.clientWidth;
53
53
  };
54
- useResizeDetector({
55
- onResize: handleVirtualGridResize,
56
- targetRef: gridRef
54
+ useResizeObserver(gridRef, {
55
+ callback: handleVirtualGridResize
57
56
  });
58
57
  var syncScroll = function syncScroll(e) {
59
58
  var virtualBody = e.target;
@@ -44,7 +44,12 @@ var FilterFlyout = function FilterFlyout(_ref) {
44
44
  secondaryActionLabel = _ref$secondaryActionL === void 0 ? 'Cancel' : _ref$secondaryActionL,
45
45
  setAllFilters = _ref.setAllFilters,
46
46
  _ref$data = _ref.data,
47
- data = _ref$data === void 0 ? [] : _ref$data;
47
+ data = _ref$data === void 0 ? [] : _ref$data,
48
+ _ref$initialFilters = _ref.initialFilters,
49
+ initialFilters = _ref$initialFilters === void 0 ? [] : _ref$initialFilters;
50
+ // Save the initial filters we only need the filters once when it loads
51
+ var initialFiltersRef = useRef(initialFilters);
52
+
48
53
  /** State */
49
54
  var _useState = useState(false),
50
55
  _useState2 = _slicedToArray(_useState, 2),
@@ -54,7 +59,8 @@ var FilterFlyout = function FilterFlyout(_ref) {
54
59
  updateMethod: updateMethod,
55
60
  filters: filters,
56
61
  setAllFilters: setAllFilters,
57
- variation: FLYOUT
62
+ variation: FLYOUT,
63
+ initialFilters: initialFiltersRef.current
58
64
  }),
59
65
  filtersState = _useFilters.filtersState,
60
66
  prevFiltersObjectArrayRef = _useFilters.prevFiltersObjectArrayRef,
@@ -179,11 +185,19 @@ FilterFlyout.propTypes = {
179
185
  type: PropTypes.string.isRequired,
180
186
  column: PropTypes.string.isRequired,
181
187
  props: PropTypes.object.isRequired
182
- })).isRequired,
188
+ })),
183
189
  /**
184
190
  * Icon description for the filter flyout button
185
191
  */
186
192
  flyoutIconDescription: PropTypes.string,
193
+ /**
194
+ * Filters that should be applied on load
195
+ */
196
+ initialFilters: PropTypes.arrayOf(PropTypes.shape({
197
+ id: PropTypes.string.isRequired,
198
+ type: PropTypes.string.isRequired,
199
+ value: PropTypes.any.isRequired
200
+ })),
187
201
  /**
188
202
  * Callback when the apply button is clicked
189
203
  */
@@ -53,7 +53,12 @@ var FilterPanel = function FilterPanel(_ref) {
53
53
  _ref$searchLabelText = _ref.searchLabelText,
54
54
  searchLabelText = _ref$searchLabelText === void 0 ? 'Filter search' : _ref$searchLabelText,
55
55
  _ref$searchPlaceholde = _ref.searchPlaceholder,
56
- searchPlaceholder = _ref$searchPlaceholde === void 0 ? 'Find filters' : _ref$searchPlaceholde;
56
+ searchPlaceholder = _ref$searchPlaceholde === void 0 ? 'Find filters' : _ref$searchPlaceholde,
57
+ _ref$initialFilters = _ref.initialFilters,
58
+ initialFilters = _ref$initialFilters === void 0 ? [] : _ref$initialFilters;
59
+ // Save the initial filters we only need the filters once
60
+ var initialFiltersRef = useRef(initialFilters);
61
+
57
62
  /** State */
58
63
  var _useState = useState(false),
59
64
  _useState2 = _slicedToArray(_useState, 2),
@@ -63,7 +68,8 @@ var FilterPanel = function FilterPanel(_ref) {
63
68
  updateMethod: updateMethod,
64
69
  filters: filterSections,
65
70
  setAllFilters: setAllFilters,
66
- variation: PANEL
71
+ variation: PANEL,
72
+ initialFilters: initialFiltersRef.current
67
73
  }),
68
74
  filtersState = _useFilters.filtersState,
69
75
  prevFiltersObjectArrayRef = _useFilters.prevFiltersObjectArrayRef,
@@ -214,6 +220,7 @@ var FilterPanel = function FilterPanel(_ref) {
214
220
  filters = _ref2$filters === void 0 ? [] : _ref2$filters,
215
221
  hasAccordion = _ref2.hasAccordion;
216
222
  return /*#__PURE__*/React.createElement("div", {
223
+ key: categoryTitle,
217
224
  className: "".concat(componentClass, "__category")
218
225
  }, categoryTitle && /*#__PURE__*/React.createElement("div", {
219
226
  className: "".concat(componentClass, "__category-title")
@@ -234,6 +241,14 @@ FilterPanel.propTypes = {
234
241
  closeIconDescription: PropTypes.string,
235
242
  filterPanelMinHeight: PropTypes.number,
236
243
  filterSections: PropTypes.array,
244
+ /**
245
+ * Filters that should be applied on load
246
+ */
247
+ initialFilters: PropTypes.arrayOf(PropTypes.shape({
248
+ id: PropTypes.string.isRequired,
249
+ type: PropTypes.string.isRequired,
250
+ value: PropTypes.any.isRequired
251
+ })),
237
252
  onApply: PropTypes.func,
238
253
  onCancel: PropTypes.func,
239
254
  onPanelClose: PropTypes.func,
@@ -21,13 +21,14 @@ var useFilters = function useFilters(_ref) {
21
21
  _ref$filters = _ref.filters,
22
22
  filters = _ref$filters === void 0 ? [] : _ref$filters,
23
23
  setAllFilters = _ref.setAllFilters,
24
- variation = _ref.variation;
24
+ variation = _ref.variation,
25
+ initialFilters = _ref.initialFilters;
25
26
  /** State */
26
- var _useInitialStateFromF = useInitialStateFromFilters(filters, variation),
27
+ var _useInitialStateFromF = useInitialStateFromFilters(filters, variation, initialFilters),
27
28
  _useInitialStateFromF2 = _slicedToArray(_useInitialStateFromF, 2),
28
29
  filtersState = _useInitialStateFromF2[0],
29
30
  setFiltersState = _useInitialStateFromF2[1];
30
- var _useState = useState([]),
31
+ var _useState = useState(initialFilters),
31
32
  _useState2 = _slicedToArray(_useState, 2),
32
33
  filtersObjectArray = _useState2[0],
33
34
  setFiltersObjectArray = _useState2[1];
@@ -44,8 +45,11 @@ var useFilters = function useFilters(_ref) {
44
45
  setFiltersObjectArray(JSON.parse(prevFiltersObjectArrayRef.current));
45
46
  };
46
47
  var reset = function reset() {
48
+ // When we reset we want the "initialFilters" to be an empty array
49
+ var resetFiltersArray = [];
50
+
47
51
  // Get the initial values for the filters
48
- var initialFiltersState = getInitialStateFromFilters(filters, variation);
52
+ var initialFiltersState = getInitialStateFromFilters(filters, variation, resetFiltersArray);
49
53
  var initialFiltersObjectArray = [];
50
54
 
51
55
  // Set the state to the initial values
@@ -11,7 +11,8 @@ import { FLYOUT } from '../constants';
11
11
  import { getInitialStateFromFilters } from '../utils';
12
12
  var useInitialStateFromFilters = function useInitialStateFromFilters(filters) {
13
13
  var variation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : FLYOUT;
14
- var _useState = useState(getInitialStateFromFilters(filters, variation)),
14
+ var initialFilters = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
15
+ var _useState = useState(getInitialStateFromFilters(filters, variation, initialFilters)),
15
16
  _useState2 = _slicedToArray(_useState, 2),
16
17
  state = _useState2[0],
17
18
  setState = _useState2[1];
@@ -6,10 +6,21 @@
6
6
  */
7
7
 
8
8
  import { CHECKBOX, DATE, DROPDOWN, FLYOUT, NUMBER, PANEL, RADIO } from './constants';
9
+ var applyInitialFilters = function applyInitialFilters(filterState, initialFilters) {
10
+ Object.keys(filterState).forEach(function (key) {
11
+ var hasInitialFilter = initialFilters.find(function (filter) {
12
+ return filter.id === key;
13
+ });
14
+ if (hasInitialFilter) {
15
+ filterState[key].value = hasInitialFilter.value;
16
+ }
17
+ });
18
+ };
9
19
 
10
20
  // This functions takes the filters passed in and makes an object to track it's state
11
21
  export var getInitialStateFromFilters = function getInitialStateFromFilters(filters) {
12
22
  var variation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : FLYOUT;
23
+ var initialFilters = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
13
24
  var initialFilterState = {};
14
25
  var setInitialState = function setInitialState(_ref) {
15
26
  var type = _ref.type,
@@ -66,5 +77,8 @@ export var getInitialStateFromFilters = function getInitialStateFromFilters(filt
66
77
  } else {
67
78
  console.error('No variation passed into useInitialStateFromFilters');
68
79
  }
80
+ if (initialFilters.length > 0) {
81
+ applyInitialFilters(initialFilterState, initialFilters);
82
+ }
69
83
  return initialFilterState;
70
84
  };
@@ -23,5 +23,6 @@ export { default as useSelectAllWithToggle } from './useSelectAllToggle';
23
23
  export { default as useColumnCenterAlign } from './useColumnCenterAlign';
24
24
  export { default as useColumnOrder } from './useColumnOrder';
25
25
  export { default as useInlineEdit } from './useInlineEdit';
26
+ export { default as useEditableCell } from './useEditableCell';
26
27
  export { default as useFiltering } from './useFiltering';
27
28
  export { getAutoSizedColumnWidth } from './utils/getAutoSizedColumnWidth';
@@ -5,19 +5,22 @@ var _excluded = ["id", "itemText", "onClick", "icon"],
5
5
  _excluded2 = ["id", "onClick", "shouldHideMenuItem", "shouldDisableMenuItem", "disabled"];
6
6
  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; }
7
7
  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; }
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.
8
+ /**
9
+ * Copyright IBM Corp. 2021, 2023
10
+ *
11
+ * This source code is licensed under the Apache-2.0 license found in the
12
+ * LICENSE file in the root directory of this source tree.
14
13
  */
15
- import React from 'react';
14
+
15
+ import React, { useEffect } from 'react';
16
16
  import cx from 'classnames';
17
17
  import { IconSkeleton, OverflowMenu, OverflowMenuItem } from 'carbon-components-react';
18
18
  import { pkg } from '../../settings';
19
19
  var blockClass = "".concat(pkg.prefix, "--datagrid");
20
20
  var useActionsColumn = function useActionsColumn(hooks) {
21
+ useEffect(function () {
22
+ pkg.checkReportFeatureEnabled('Datagrid.useActionsColumn');
23
+ }, []);
21
24
  var useAttachActionsOnInstance = function useAttachActionsOnInstance(instance) {
22
25
  var rowActions = instance.rowActions,
23
26
  isFetching = instance.isFetching,
@@ -4,15 +4,19 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
4
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
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
6
  /**
7
- * Copyright IBM Corp. 2022, 2022
7
+ * Copyright IBM Corp. 2022, 2023
8
8
  *
9
9
  * This source code is licensed under the Apache-2.0 license found in the
10
10
  * LICENSE file in the root directory of this source tree.
11
11
  */
12
12
 
13
13
  import * as React from 'react';
14
+ import { pkg } from '../../settings';
14
15
  import { CustomizeColumnsTearsheetWrapper, ToggleButtonWrapper } from './Datagrid/addons/CustomizeColumns';
15
16
  var useCustomizeColumns = function useCustomizeColumns(hooks) {
17
+ React.useEffect(function () {
18
+ pkg.checkReportFeatureEnabled('Datagrid.useCustomizeColumns');
19
+ }, []);
16
20
  var _React$useState = React.useState(false),
17
21
  _React$useState2 = _slicedToArray(_React$useState, 2),
18
22
  isTearsheetOpen = _React$useState2[0],
@@ -0,0 +1,12 @@
1
+ /**
2
+ * Copyright IBM Corp. 2023, 2023
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ import useInlineEdit from './useInlineEdit';
9
+ var useEditableCell = function useEditableCell(hooks) {
10
+ useInlineEdit(hooks, 'usingEditableCell');
11
+ };
12
+ export default useEditableCell;
@@ -2,17 +2,21 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
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
4
  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; }
5
- /*
6
- * Licensed Materials - Property of IBM
7
- * 5724-Q36
8
- * (c) Copyright IBM Corp. 2020
9
- * US Government Users Restricted Rights - Use, duplication or disclosure
10
- * restricted by GSA ADP Schedule Contract with IBM Corp.
5
+ /**
6
+ * Copyright IBM Corp. 2020, 2023
7
+ *
8
+ * This source code is licensed under the Apache-2.0 license found in the
9
+ * LICENSE file in the root directory of this source tree.
11
10
  */
12
- import { useState } from 'react';
11
+
12
+ import { useEffect, useState } from 'react';
13
+ import { pkg } from '../../settings';
13
14
  import DatagridExpandedRow from './Datagrid/DatagridExpandedRow';
14
15
  import useRowExpander from './useRowExpander';
15
16
  var useExpandedRow = function useExpandedRow(hooks) {
17
+ useEffect(function () {
18
+ pkg.checkReportFeatureEnabled('Datagrid.useExpandedRow');
19
+ }, []);
16
20
  useRowExpander(hooks);
17
21
  var useInstance = function useInstance(instance) {
18
22
  var rows = instance.rows,
@@ -2,18 +2,21 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
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
4
  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; }
5
- // @flow
6
- /*
7
- * Licensed Materials - Property of IBM
8
- * 5724-Q36
9
- * (c) Copyright IBM Corp. 2022
10
- * US Government Users Restricted Rights - Use, duplication or disclosure
11
- * restricted by GSA ADP Schedule Contract with IBM Corp.
5
+ /**
6
+ * Copyright IBM Corp. 2022, 2023
7
+ *
8
+ * This source code is licensed under the Apache-2.0 license found in the
9
+ * LICENSE file in the root directory of this source tree.
12
10
  */
13
- import { useMemo } from 'react';
11
+
12
+ import { useMemo, useEffect } from 'react';
13
+ import { pkg } from '../../settings';
14
14
  import { FilterFlyout } from './Datagrid/addons/Filtering';
15
15
  import { BATCH } from './Datagrid/addons/Filtering/constants';
16
16
  var useFiltering = function useFiltering(hooks) {
17
+ useEffect(function () {
18
+ pkg.checkReportFeatureEnabled('Datagrid.useFiltering');
19
+ }, []);
17
20
  var filterTypes = useMemo(function () {
18
21
  return {
19
22
  date: function date(rows, id, _ref) {
@@ -65,11 +68,13 @@ var useFiltering = function useFiltering(hooks) {
65
68
  setAllFilters = instance.setAllFilters,
66
69
  setFilter = instance.setFilter,
67
70
  headers = instance.headers,
68
- data = instance.data;
71
+ data = instance.data,
72
+ state = instance.state;
69
73
  var defaultProps = {
70
74
  variation: 'flyout',
71
75
  updateMethod: BATCH,
72
- panelIconDescription: 'Open filter panel'
76
+ panelIconDescription: 'Open filter panel',
77
+ initialFilters: state.filters
73
78
  };
74
79
  var getFilterFlyoutProps = function getFilterFlyoutProps() {
75
80
  return _objectSpread(_objectSpread(_objectSpread({}, defaultProps), filterProps), {}, {
@@ -1,17 +1,26 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- /*
3
- * Licensed Materials - Property of IBM
4
- * 5724-Q36
5
- * (c) Copyright IBM Corp. 2022
6
- * US Government Users Restricted Rights - Use, duplication or disclosure
7
- * restricted by GSA ADP Schedule Contract with IBM Corp.
2
+ /**
3
+ * Copyright IBM Corp. 2022, 2023
4
+ *
5
+ * This source code is licensed under the Apache-2.0 license found in the
6
+ * LICENSE file in the root directory of this source tree.
8
7
  */
9
- import React from 'react';
8
+
9
+ import React, { useEffect } from 'react';
10
10
  import { pkg } from '../../settings';
11
11
  import cx from 'classnames';
12
12
  import { InlineEditCell } from './Datagrid/addons/InlineEdit/InlineEditCell';
13
+ import { warn } from '../../global/js/utils/pconsole';
13
14
  var blockClass = "".concat(pkg.prefix, "--datagrid");
14
- var useInlineEdit = function useInlineEdit(hooks) {
15
+ var useInlineEdit = function useInlineEdit(hooks, usingEditableCell) {
16
+ useEffect(function () {
17
+ pkg.checkReportFeatureEnabled('Datagrid.useInlineEdit');
18
+ }, []);
19
+ useEffect(function () {
20
+ if (!usingEditableCell) {
21
+ warn("The 'useInlineEdit' hook is being renamed in Carbon for IBM Products v2 to 'useEditableCell'. You can use this newly renamed hook now or upgrade when moving to v2.");
22
+ }
23
+ }, [usingEditableCell]);
15
24
  var addInlineEdit = function addInlineEdit(props, _ref) {
16
25
  var _cell$column, _cell$column$inlineEd, _instance$columns$fil;
17
26
  var cell = _ref.cell,
@@ -1,16 +1,20 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- /*
3
- * Licensed Materials - Property of IBM
4
- * 5724-Q36
5
- * (c) Copyright IBM Corp. 2020
6
- * US Government Users Restricted Rights - Use, duplication or disclosure
7
- * restricted by GSA ADP Schedule Contract with IBM Corp.
2
+ /**
3
+ * Copyright IBM Corp. 2020, 2023
4
+ *
5
+ * This source code is licensed under the Apache-2.0 license found in the
6
+ * LICENSE file in the root directory of this source tree.
8
7
  */
8
+
9
+ import { useEffect } from 'react';
9
10
  import { pkg } from '../../settings';
10
11
  import cx from 'classnames';
11
12
  import useNestedRowExpander from './useNestedRowExpander';
12
13
  var blockClass = "".concat(pkg.prefix, "--datagrid");
13
14
  var useNestedRows = function useNestedRows(hooks) {
15
+ useEffect(function () {
16
+ pkg.checkReportFeatureEnabled('Datagrid.useNestedRows');
17
+ }, []);
14
18
  useNestedRowExpander(hooks);
15
19
  var marginLeft = 24;
16
20
  var getRowProps = function getRowProps(props, _ref) {
@@ -24,9 +24,17 @@ var useOnRowClick = function useOnRowClick(hooks) {
24
24
  toggleRowSelected(id, true);
25
25
  }
26
26
  };
27
+ var onKeyDown = function onKeyDown(event) {
28
+ var key = event.key;
29
+ if (key === 'Enter') {
30
+ onClick();
31
+ }
32
+ };
27
33
  return [props, {
28
- onClick: onClick
34
+ onClick: onClick,
35
+ onKeyDown: onKeyDown
29
36
  }, {
37
+ tabIndex: 0,
30
38
  style: {
31
39
  cursor: 'pointer'
32
40
  }
@@ -71,6 +71,7 @@ var SelectRow = function SelectRow(datagridState) {
71
71
  radio = datagridState.radio,
72
72
  toggleAllRowsSelected = datagridState.toggleAllRowsSelected,
73
73
  onRadioSelect = datagridState.onRadioSelect,
74
+ onRowSelect = datagridState.onRowSelect,
74
75
  columns = datagridState.columns,
75
76
  withStickyColumn = datagridState.withStickyColumn;
76
77
  var _useState = useState(window.innerWidth),
@@ -103,6 +104,7 @@ var SelectRow = function SelectRow(datagridState) {
103
104
  }
104
105
  }
105
106
  onChange(e);
107
+ onRowSelect === null || onRowSelect === void 0 ? void 0 : onRowSelect(row, e);
106
108
  },
107
109
  id: "".concat(tableId, "-").concat(row.index),
108
110
  name: "".concat(tableId, "-").concat(row.index, "-name"),
@@ -0,0 +1,43 @@
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
+ var _excluded = ["v2"];
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
+ 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
+ * Copyright IBM Corp. 2022, 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.
11
+ */
12
+
13
+ import React, { forwardRef } from 'react';
14
+ import PropTypes from 'prop-types';
15
+ import { pkg } from '../../settings';
16
+ import { InlineEditV1 } from '../InlineEditV1';
17
+ import { InlineEditV2 } from '../InlineEditV2';
18
+
19
+ /**
20
+ * this is a wrapper component that will allow us to support the rename of InlineEdit to EditInPlace
21
+ *
22
+ * if the user passes in the v2 feature flag the v2 version of the component will be rendered
23
+ * since this is a temporary solution the named export should just remain InlineEdit unlike how
24
+ * Card works as a base layer for Productive and Expressive cards.
25
+ */
26
+
27
+ var componentName = 'EditInPlace';
28
+ export var EditInPlace = /*#__PURE__*/forwardRef(function (_ref, ref) {
29
+ var v2 = _ref.v2,
30
+ rest = _objectWithoutProperties(_ref, _excluded);
31
+ var props = _objectSpread(_objectSpread({}, rest), {}, {
32
+ ref: ref
33
+ });
34
+ if (v2 === true) {
35
+ return /*#__PURE__*/React.createElement(InlineEditV2, props);
36
+ }
37
+ return /*#__PURE__*/React.createElement(InlineEditV1, props);
38
+ });
39
+ EditInPlace = pkg.checkComponentEnabled(EditInPlace, componentName);
40
+ EditInPlace.displayName = componentName;
41
+ EditInPlace.propTypes = {
42
+ v2: PropTypes.bool
43
+ };
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Copyright IBM Corp. 2022, 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.
6
+ */
7
+
8
+ export { EditInPlace } from './EditInPlace';