@carbon/ibm-products 1.4.0 → 1.7.0

package/lib/components/SidePanel/SidePanel.js

@@ -113,8 +113,12 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
   var sidePanelInnerRef = (0, _react.useRef)();
   var sidePanelCloseRef = (0, _react.useRef)();
   var previousState = (0, _hooks.usePreviousValue)({
-    size: size
-  }); // scroll panel to top going between steps
+    size: size,
+    open: open
+  });
+  var reducedMotion = window && window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
+    matches: true
+  }; // scroll panel to top going between steps
 
   (0, _react.useEffect)(function () {
     var panelRef = ref || sidePanelRef;
@@ -193,7 +197,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
 
   (0, _react.useEffect)(function () {
-    if (open && animateTitle && animationComplete && title && title.length) {
+    if (open && animateTitle && animationComplete && title && title.length && !reducedMotion.matches) {
       var _document$querySelect2, _document$querySelect3, _document$querySelect4;
 
       var sidePanelOuter = document.querySelector("#".concat(blockClass, "-outer"));
@@ -285,7 +289,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       _sidePanelOuter === null || _sidePanelOuter === void 0 ? void 0 : _sidePanelOuter.style.setProperty("--".concat(blockClass, "--subtitle-container-height"), "".concat(_sidePanelSubtitleElementHeight, "px"));
       _sidePanelOuter === null || _sidePanelOuter === void 0 ? void 0 : _sidePanelOuter.style.setProperty("--".concat(blockClass, "--action-bar-container-height"), "".concat(sidePanelActionBarElementHeight, "px"));
     }
-  }, [open, animateTitle, animationComplete, shouldRender, panelHeight, title, size]); // click outside functionality if `includeOverlay` prop is set
+  }, [open, animateTitle, animationComplete, shouldRender, panelHeight, title, size, reducedMotion.matches]); // click outside functionality if `includeOverlay` prop is set
 
   (0, _react.useEffect)(function () {
     var handleOutsideClick = function handleOutsideClick(event) {
@@ -311,7 +315,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     return function () {
       document.removeEventListener('click', handleOutsideClick);
     };
-  }, [includeOverlay, onRequestClose, open, preventCloseOnClickOutside, ref]); // initialize the side panel to open
+  }, [includeOverlay, onRequestClose, open, preventCloseOnClickOutside, ref, onUnmount]); // initialize the side panel to open
 
   (0, _react.useEffect)(function () {
     if (open) {
@@ -321,14 +325,21 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
   var onAnimationEnd = function onAnimationEnd() {
     if (!open) {
-      onUnmount && onUnmount();
+      onUnmount === null || onUnmount === void 0 ? void 0 : onUnmount();
       setRender(false);
     }
 
     setAnimationComplete(true);
-  }; // initializes the side panel to open
+  }; // Set the internal state `animationComplete` to true if
+  // prefers reduced motion is true
 
 
+  (0, _react.useEffect)(function () {
+    if (reducedMotion.matches) {
+      setAnimationComplete(true);
+    }
+  }, [reducedMotion.matches]); // initializes the side panel to open
+
   var _onAnimationStart = function onAnimationStart(event) {
     event.persist();
     var isPanelTarget = event.target.id === "".concat(blockClass, "-outer");
@@ -349,7 +360,13 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
         pageContentElement.style.marginLeft = 0;
       }
     }
-  }, [open, placement, selectorPageContent, slideIn]); // used to set margins of content for slide in panel version
+  }, [open, placement, selectorPageContent, slideIn]);
+  (0, _react.useEffect)(function () {
+    if (!open && previousState !== null && previousState !== void 0 && previousState.open && reducedMotion.matches) {
+      setRender(false);
+      onUnmount === null || onUnmount === void 0 ? void 0 : onUnmount();
+    }
+  }, [open, onUnmount, reducedMotion.matches, previousState === null || previousState === void 0 ? void 0 : previousState.open]); // used to set margins of content for slide in panel version
 
   (0, _react.useEffect)(function () {
     if (shouldRender && slideIn) {
@@ -357,15 +374,15 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
       if (placement && placement === 'right' && pageContentElement) {
         pageContentElement.style.marginRight = 0;
-        pageContentElement.style.transition = "margin-right ".concat(_motion.moderate02);
+        pageContentElement.style.transition = !reducedMotion.matches ? "margin-right ".concat(_motion.moderate02) : null;
         pageContentElement.style.marginRight = _constants.SIDE_PANEL_SIZES[size];
       } else if (pageContentElement) {
         pageContentElement.style.marginLeft = 0;
-        pageContentElement.style.transition = "margin-left ".concat(_motion.moderate02);
+        pageContentElement.style.transition = !reducedMotion.matches ? "margin-left ".concat(_motion.moderate02) : null;
         pageContentElement.style.marginLeft = _constants.SIDE_PANEL_SIZES[size];
       }
     }
-  }, [slideIn, selectorPageContent, placement, shouldRender, size]); // adds focus trap functionality
+  }, [slideIn, selectorPageContent, placement, shouldRender, size, reducedMotion.matches]); // adds focus trap functionality
 
   /* istanbul ignore next */
 
@@ -392,7 +409,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     var _cx, _cx2;
 
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)("".concat(blockClass, "__title-container"), (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step"), currentStep > 0), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step-without-title"), currentStep > 0 && !title), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container--no-title-animation"), !animateTitle), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-is-animating"), !animationComplete || !open), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-without-title"), !title), _cx))
+      className: (0, _classnames.default)("".concat(blockClass, "__title-container"), (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step"), currentStep > 0), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__on-detail-step-without-title"), currentStep > 0 && !title), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container--no-title-animation"), !animateTitle), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-is-animating"), !animationComplete || !open), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container-without-title"), !title), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__title-container--reduced-motion"), reducedMotion.matches), _cx))
     }, currentStep > 0 && /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
       "aria-label": navigationBackIconDescription,
       kind: "ghost",
@@ -449,7 +466,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       className: "".concat(blockClass, "__title-text"),
       title: title,
       "aria-hidden": false
-    }, title), animateTitle && title && title.length && /*#__PURE__*/_react.default.createElement("h2", {
+    }, title), animateTitle && title && title.length && !reducedMotion.matches && /*#__PURE__*/_react.default.createElement("h2", {
       className: "".concat(blockClass, "__collapsed-title-text"),
       title: title,
       "aria-hidden": true
@@ -466,7 +483,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     id: "".concat(blockClass, "-outer"),
     className: mainPanelClassNames,
     style: {
-      animation: "".concat(open ? placement === 'right' ? "sidePanelEntranceRight ".concat(_motion.moderate02) : "sidePanelEntranceLeft ".concat(_motion.moderate02) : placement === 'right' ? "sidePanelExitRight ".concat(_motion.moderate02) : "sidePanelExitLeft ".concat(_motion.moderate02))
+      animation: !reducedMotion.matches ? "".concat(open ? placement === 'right' ? "side-panel-entrance-right ".concat(_motion.moderate02) : "side-panel-entrance-left ".concat(_motion.moderate02) : placement === 'right' ? "side-panel-exit-right ".concat(_motion.moderate02) : "side-panel-exit-left ".concat(_motion.moderate02)) : null
     },
     onAnimationEnd: onAnimationEnd,
     onAnimationStart: function onAnimationStart(event) {
@@ -499,7 +516,7 @@ var SidePanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     ref: sidePanelOverlayRef,
     className: "".concat(blockClass, "__overlay"),
     style: {
-      animation: "".concat(open ? "sidePanelOverlayEntrance ".concat(_motion.moderate02) : "sidePanelOverlayExit ".concat(_motion.moderate02))
+      animation: !reducedMotion.matches ? "".concat(open ? "side-panel-overlay-entrance ".concat(_motion.moderate02) : "side-panel-overlay-exit ".concat(_motion.moderate02)) : null
     }
   }));
 }); // Return a placeholder if not released and not enabled by feature flag
@@ -533,7 +550,7 @@ SidePanel.propTypes = {
    * See https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
    */
   actions: (0, _propsHelper.allPropTypes)([_ActionSet.ActionSet.validateActions(), _propTypes.default.arrayOf(_propTypes.default.shape(_objectSpread(_objectSpread({}, _carbonComponentsReact.Button.propTypes), {}, {
-    kind: _propTypes.default.oneOf(['ghost', 'secondary', 'primary']),
+    kind: _propTypes.default.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
     label: _propTypes.default.string,
     loading: _propTypes.default.bool,
     // we duplicate this Button prop to improve the DocGen here

package/lib/components/Tearsheet/Tearsheet.js

@@ -94,7 +94,7 @@ Tearsheet.propTypes = _objectSpread({
   actions: (0, _propsHelper.allPropTypes)([_ActionSet.ActionSet.validateActions(function () {
     return 'max';
   }), _propTypes.default.arrayOf(_propTypes.default.shape(_objectSpread(_objectSpread({}, _carbonComponentsReact.Button.propTypes), {}, {
-    kind: _propTypes.default.oneOf(['ghost', 'secondary', 'primary']),
+    kind: _propTypes.default.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
     label: _propTypes.default.string,
     loading: _propTypes.default.bool,
     // we duplicate this Button prop to improve the DocGen here

package/lib/components/Tearsheet/TearsheetNarrow.js

@@ -90,7 +90,7 @@ TearsheetNarrow.propTypes = _objectSpread({
   actions: (0, _propsHelper.allPropTypes)([_ActionSet.ActionSet.validateActions(function () {
     return 'lg';
   }), _propTypes.default.arrayOf(_propTypes.default.shape(_objectSpread(_objectSpread({}, _carbonComponentsReact.Button.propTypes), {}, {
-    kind: _propTypes.default.oneOf(['ghost', 'secondary', 'primary']),
+    kind: _propTypes.default.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
     label: _propTypes.default.string,
     loading: _propTypes.default.bool,
     // we duplicate this Button prop to improve the DocGen here

package/lib/components/Tearsheet/TearsheetShell.js

@@ -146,10 +146,9 @@ var TearsheetShell = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
     setTimeout(function () {
       return element.focus();
     }, 1);
-  }; // Hook called whenever the tearsheet mounts, unmounts, or 'open' changes.
+  };
 
-
-  (0, _react.useLayoutEffect)(function () {
+  (0, _react.useEffect)(function () {
     var notify = function notify() {
       return stack.all.forEach(function (handler) {
         handler(Math.min(stack.open.length, maxDepth), stack.open.indexOf(handler) + 1);
@@ -311,7 +310,7 @@ TearsheetShell.propTypes = _objectSpread({
   actions: _propTypes.default.arrayOf( // NB we don't include the validator here, as the component wrapping this
   // one should ensure appropriate validation is done.
   _propTypes.default.shape(_objectSpread(_objectSpread({}, _carbonComponentsReact.Button.propTypes), {}, {
-    kind: _propTypes.default.oneOf(['ghost', 'secondary', 'primary']),
+    kind: _propTypes.default.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
     label: _propTypes.default.string,
     loading: _propTypes.default.bool,
     // we duplicate this Button prop to improve the DocGen here

package/lib/components/WebTerminal/WebTerminal.js

@@ -80,7 +80,7 @@ var WebTerminal = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
     ref: ref,
     className: (0, _classnames.default)([blockClass, (_ref2 = {}, (0, _defineProperty2.default)(_ref2, "".concat(blockClass, "--open"), open), (0, _defineProperty2.default)(_ref2, "".concat(blockClass, "--closed"), !open), (0, _defineProperty2.default)(_ref2, className, className), _ref2)]),
     style: {
-      animation: "".concat(open ? 'webTerminalEntrance 250ms' : 'webTerminalExit 250ms')
+      animation: "".concat(open ? 'web-terminal-entrance 250ms' : 'web-terminal-exit 250ms')
     },
     onAnimationEnd: onAnimationEnd
   }), /*#__PURE__*/_react.default.createElement("header", {

package/lib/components/index.js

@@ -87,6 +87,12 @@ Object.defineProperty(exports, "CreateTearsheetStep", {
     return _CreateTearsheet.CreateTearsheetStep;
   }
 });
+Object.defineProperty(exports, "DataSpreadsheet", {
+  enumerable: true,
+  get: function get() {
+    return _DataSpreadsheet.DataSpreadsheet;
+  }
+});
 Object.defineProperty(exports, "EditSidePanel", {
   enumerable: true,
   get: function get() {
@@ -364,4 +370,6 @@ var _OptionsTile = require("./OptionsTile");
 
 var _CancelableTextEdit = require("./CancelableTextEdit");
 
-var _InlineEdit = require("./InlineEdit");
+var _InlineEdit = require("./InlineEdit");
+
+var _DataSpreadsheet = require("./DataSpreadsheet");

package/lib/global/js/hooks/index.js

@@ -39,6 +39,12 @@ Object.defineProperty(exports, "useResetCreateComponent", {
     return _useResetCreateComponent.useResetCreateComponent;
   }
 });
+Object.defineProperty(exports, "useRetrieveStepData", {
+  enumerable: true,
+  get: function get() {
+    return _useRetrieveStepData.useRetrieveStepData;
+  }
+});
 Object.defineProperty(exports, "useValidCreateStepCount", {
   enumerable: true,
   get: function get() {
@@ -72,4 +78,6 @@ var _usePreviousValue = require("./usePreviousValue");
 
 var _useResetCreateComponent = require("./useResetCreateComponent");
 
+var _useRetrieveStepData = require("./useRetrieveStepData");
+
 var _useValidCreateStepCount = require("./useValidCreateStepCount");

package/lib/global/js/hooks/useCreateComponentStepChange.js

@@ -14,13 +14,15 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _react = require("react");
 
 /**
- * Copyright IBM Corp. 2021, 2021
+ * Copyright IBM Corp. 2021, 2022
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
-  var totalStepCount = _ref.totalStepCount,
+  var firstIncludedStep = _ref.firstIncludedStep,
+      lastIncludedStep = _ref.lastIncludedStep,
+      stepData = _ref.stepData,
       onNext = _ref.onNext,
       isSubmitDisabled = _ref.isSubmitDisabled,
       setCurrentStep = _ref.setCurrentStep,
@@ -185,20 +187,29 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
       };
     }();
 
-    if (totalStepCount > 0) {
+    if ((stepData === null || stepData === void 0 ? void 0 : stepData.length) > 0) {
       var buttons = [];
 
-      if (totalStepCount > 1 && !shouldViewAll) {
+      if ((stepData === null || stepData === void 0 ? void 0 : stepData.length) > 1 && !shouldViewAll) {
         buttons.push({
           key: 'create-action-button-back',
           label: backButtonText,
           onClick: function onClick() {
             return setCurrentStep(function (prev) {
-              return prev - 1;
+              // Find previous included step to render
+              // There will always be a previous step otherwise we will
+              // have disabled the back button since we have reached the first visible step
+              do {
+                var _stepData;
+
+                prev--;
+              } while (!((_stepData = stepData[prev - 1]) !== null && _stepData !== void 0 && _stepData.shouldIncludeStep));
+
+              return prev;
             });
           },
           kind: 'secondary',
-          disabled: currentStep === 1
+          disabled: currentStep === firstIncludedStep
         });
       }
 
@@ -212,8 +223,8 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
       });
       buttons.push({
         key: 'create-action-button-submit',
-        label: shouldViewAll ? submitButtonText : currentStep < totalStepCount ? nextButtonText : submitButtonText,
-        onClick: shouldViewAll ? handleSubmit : currentStep < totalStepCount ? handleNext : handleSubmit,
+        label: shouldViewAll ? submitButtonText : currentStep < lastIncludedStep ? nextButtonText : submitButtonText,
+        onClick: shouldViewAll ? handleSubmit : currentStep < lastIncludedStep ? handleNext : handleSubmit,
         disabled: isSubmitDisabled,
         kind: 'primary',
         loading: isSubmitting,
@@ -221,13 +232,22 @@ var useCreateComponentStepChange = function useCreateComponentStepChange(_ref) {
       });
       setCreateComponentActions(buttons);
     }
-  }, [totalStepCount, onNext, isSubmitDisabled, backButtonText, cancelButtonText, currentStep, onClose, nextButtonText, submitButtonText, onRequestSubmit, isSubmitting, shouldViewAll, componentBlockClass, componentName, continueToNextStep, setCurrentStep, setCreateComponentActions, setIsSubmitting, setShouldViewAll, setModalIsOpen]);
+  }, [firstIncludedStep, lastIncludedStep, stepData, onNext, isSubmitDisabled, backButtonText, cancelButtonText, currentStep, onClose, nextButtonText, submitButtonText, onRequestSubmit, isSubmitting, shouldViewAll, componentBlockClass, componentName, continueToNextStep, setCurrentStep, setCreateComponentActions, setIsSubmitting, setShouldViewAll, setModalIsOpen]);
   var continueToNextStep = (0, _react.useCallback)(function () {
     setIsSubmitting(false);
     setCurrentStep(function (prev) {
-      return prev + 1;
+      // Find next included step to render
+      // There will always be a next step otherwise we will
+      // have reach the onSubmit
+      do {
+        var _stepData2;
+
+        prev++;
+      } while (!((_stepData2 = stepData[prev - 1]) !== null && _stepData2 !== void 0 && _stepData2.shouldIncludeStep));
+
+      return prev;
     });
-  }, [setCurrentStep, setIsSubmitting]);
+  }, [setCurrentStep, setIsSubmitting, stepData]);
 };
 
 exports.useCreateComponentStepChange = useCreateComponentStepChange;

package/lib/global/js/hooks/useResetCreateComponent.js

@@ -8,7 +8,7 @@ exports.useResetCreateComponent = void 0;
 var _react = require("react");
 
 /**
- * Copyright IBM Corp. 2021, 2021
+ * Copyright IBM Corp. 2021, 2022
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -17,6 +17,7 @@ var _react = require("react");
 /**
  * Resets the current step of the create component if it has been closed.
  * @param {object} useResetCreateComponent - Create component that uses this custom hook
+ * @param {object} useResetCreateComponent.firstIncludedStep
  * @param {object} useResetCreateComponent.previousState
  * @param {boolean} useResetCreateComponent.open
  * @param {Function} useResetCreateComponent.setCurrentStep
@@ -25,7 +26,8 @@ var _react = require("react");
  * @param {string} useResetCreateComponent.componentName
  */
 var useResetCreateComponent = function useResetCreateComponent(_ref) {
-  var previousState = _ref.previousState,
+  var firstIncludedStep = _ref.firstIncludedStep,
+      previousState = _ref.previousState,
       open = _ref.open,
       setCurrentStep = _ref.setCurrentStep,
       initialStep = _ref.initialStep,
@@ -36,7 +38,8 @@ var useResetCreateComponent = function useResetCreateComponent(_ref) {
       if (initialStep && totalSteps && Number(initialStep) <= Number(totalSteps) && Number(initialStep) > 0) {
         setCurrentStep(Number(initialStep));
       } else {
-        setCurrentStep(1);
+        // default should be fist includedStep instead of just 1
+        setCurrentStep(firstIncludedStep);
       } // An invalid initialStep value was provided, we'll default to rendering the first step in this scenario
 
 
@@ -44,7 +47,7 @@ var useResetCreateComponent = function useResetCreateComponent(_ref) {
         console.warn("".concat(componentName, ": An invalid `initialStep` prop was supplied. The `initialStep` prop should be a number that is greater than 0 or less than or equal to the number of steps your ").concat(componentName, " has."));
       }
     }
-  }, [open, previousState, setCurrentStep, initialStep, totalSteps, componentName]);
+  }, [firstIncludedStep, open, previousState, setCurrentStep, initialStep, totalSteps, componentName]);
 };
 
 exports.useResetCreateComponent = useResetCreateComponent;

package/lib/global/js/hooks/useRetrieveStepData.js

@@ -0,0 +1,62 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useRetrieveStepData = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _react = require("react");
+
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * This useEffect makes sure that every CreateTearsheetStep/CreateFullPageStep reports back it's
+ * title, secondaryLabel, introStep, and shouldIncludeStep data so that it can be sent to the CreateInfluencer.
+ * @param {object} useResetCreateComponent
+ * @param {object} useResetCreateComponent.stepsContext
+ * @param {number} useResetCreateComponent.stepNumber
+ * @param {boolean} useResetCreateComponent.introStep
+ * @param {boolean} useResetCreateComponent.shouldIncludeStep
+ * @param {string} useResetCreateComponent.secondaryLabel
+ * @param {string} useResetCreateComponent.title
+ */
+var useRetrieveStepData = function useRetrieveStepData(_ref) {
+  var stepsContext = _ref.stepsContext,
+      stepNumber = _ref.stepNumber,
+      introStep = _ref.introStep,
+      shouldIncludeStep = _ref.shouldIncludeStep,
+      secondaryLabel = _ref.secondaryLabel,
+      title = _ref.title;
+  (0, _react.useEffect)(function () {
+    if (stepsContext) {
+      stepsContext.setStepData(function (prev) {
+        var stepItem = {
+          title: title,
+          secondaryLabel: secondaryLabel,
+          introStep: introStep,
+          shouldIncludeStep: shouldIncludeStep
+        };
+        var previousItem = prev[stepNumber - 1];
+
+        if ((previousItem === null || previousItem === void 0 ? void 0 : previousItem.title) !== stepItem.title || (previousItem === null || previousItem === void 0 ? void 0 : previousItem.secondaryLabel) !== stepItem.secondaryLabel || (previousItem === null || previousItem === void 0 ? void 0 : previousItem.introStep) !== stepItem.introStep || (previousItem === null || previousItem === void 0 ? void 0 : previousItem.shouldIncludeStep) !== stepItem.shouldIncludeStep) {
+          var clone = (0, _toConsumableArray2.default)(prev);
+          clone[stepNumber - 1] = stepItem;
+          return clone;
+        }
+
+        return prev;
+      });
+    }
+  }, [shouldIncludeStep, title, secondaryLabel, introStep, stepsContext, stepNumber]);
+};
+
+exports.useRetrieveStepData = useRetrieveStepData;

package/lib/global/js/package-settings.js

@@ -67,7 +67,8 @@ var defaults = {
     EditSidePanel: false,
     OptionsTile: false,
     CancelableTextEdit: false,
-    InlineEdit: false
+    InlineEdit: false,
+    DataSpreadsheet: false
     /* new component flags here - comment used by generate CLI */
 
   },

package/lib/global/js/utils/getScrollbarWidth.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getScrollbarWidth = void 0;
+
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var getScrollbarWidth = function getScrollbarWidth() {
+  var scrollDiv = document.createElement('div');
+  scrollDiv.setAttribute('style', 'width: 100px; height: 100px; overflow: scroll; position:absolute; top:-9999px;');
+  document.body.appendChild(scrollDiv);
+  var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
+  document.body.removeChild(scrollDiv);
+  return scrollbarWidth;
+};
+
+exports.getScrollbarWidth = getScrollbarWidth;

package/lib/global/js/utils/lastIndexInArray.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.lastIndexInArray = void 0;
+
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * This utility will return the index of the last instance of an
+ * item in the given array of objects whose key is equal to the value
+ * parameter. If there are no matches, -1 is returned as similar to findIndex
+ * @param {Array<Object.*>} array
+ * @param {string} key
+ * @param {string|boolean|number} value
+ */
+var lastIndexInArray = function lastIndexInArray(array, key, value) {
+  for (var i = array.length - 1; i >= 0; i--) {
+    var _array$i;
+
+    if (((_array$i = array[i]) === null || _array$i === void 0 ? void 0 : _array$i[key]) === value) {
+      return i + 1;
+    }
+  }
+
+  return -1;
+};
+
+exports.lastIndexInArray = lastIndexInArray;

package/lib/settings.js

@@ -9,8 +9,6 @@ exports.pkg = exports.carbon = void 0;
 
 var _Canary = require("./components/_Canary");
 
-var _featureFlags = _interopRequireDefault(require("./generated/feature-flags/feature-flags"));
-
 var _packageSettings = _interopRequireDefault(require("./global/js/package-settings"));
 
 var _carbonComponents = require("carbon-components");
@@ -28,10 +26,6 @@ var carbon = {
     _carbonComponents.settings.prefix = val;
   },
 
-  get flags() {
-    return _featureFlags.default;
-  },
-
   get themes() {
     return _themes.themes;
   }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "1.4.0",
+  "version": "1.7.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -33,58 +33,60 @@
     "access": "public"
   },
   "scripts": {
-    "build": "run-s clean build-all",
+    "build": "run-s clean build-first build-all",
     "build-all": "run-p build:*",
-    "build:css-dev": "sass --style=expanded --load-path node_modules --load-path ../../node_modules src:css",
-    "build:css-min": "sass --style=compressed --no-source-map --load-path node_modules --load-path ../../node_modules src/index.scss:css/index.min.css src/index-full-carbon.scss:css/index-full-carbon.min.css src/index-without-carbon.scss:css/index-without-carbon.min.css src/index-without-carbon-released-only.scss:css/index-without-carbon-released-only.min.css",
+    "build-first": "copyfiles 'src/**/*.scss' scss -u 1",
+    "build:css-dev": "sass --style=expanded --load-path node_modules --load-path ../../node_modules scss:css",
+    "build:css-min": "sass --style=compressed --load-path node_modules --load-path ../../node_modules scss/index.scss:css/index.min.css scss/index-full-carbon.scss:css/index-full-carbon.min.css scss/index-without-carbon.scss:css/index-without-carbon.min.css scss/index-without-carbon-released-only.scss:css/index-without-carbon-released-only.min.css",
     "build:js-esm": "cross-env BABEL_ENV=esm yarn build:js:modules -d es",
     "build:js-cjs": "cross-env BABEL_ENV=cjs yarn build:js:modules -d lib",
     "build:js:modules": "babel src --ignore '**/__tests__','**/*.test.js','**/*.stories.js','src/utils/**/*'",
-    "build:scss": "copyfiles 'src/**/*.scss' scss -u 1",
     "ci-check": "node scripts/import",
     "clean": "rimraf es lib css scss",
     "generate": "cross-env FORCE_COLOR=1 node scripts/generate",
     "postinstall": "carbon-telemetry collect --install",
     "test": "jest --colors",
-    "//upgrade-dependencies": "# don't upgrade carbon (done globally), react/react-dom (explicit range peer dependency) or chalk (until we can load it as ESM)",
-    "upgrade-dependencies": "npm-check-updates -u --color --reject '/(carbon|^react$|^react-dom$|^chalk$)/'"
+    "//upgrade-dependencies": "# don't upgrade carbon (done globally), react/react-dom (explicit range peer dependency), chalk (issue #1596)",
+    "upgrade-dependencies": "npm-check-updates -u --dep dev,peer,prod --color --reject '/(carbon|^react$|^react-dom$|^chalk$)/'"
   },
   "devDependencies": {
-    "@babel/cli": "^7.16.8",
-    "@babel/core": "^7.16.10",
-    "babel-preset-ibm-cloud-cognitive": "^0.14.4",
+    "@babel/cli": "^7.17.0",
+    "@babel/core": "^7.17.2",
+    "babel-preset-ibm-cloud-cognitive": "^0.14.7",
     "chalk": "^4.1.2",
     "change-case": "^4.1.2",
     "copyfiles": "^2.4.1",
     "cross-env": "^7.0.3",
     "fs-extra": "^10.0.0",
     "glob": "^7.2.0",
-    "jest": "^27.4.7",
-    "jest-config-ibm-cloud-cognitive": "^0.23.5",
-    "npm-check-updates": "^12.2.0",
+    "jest": "^27.5.1",
+    "jest-config-ibm-cloud-cognitive": "^0.23.8",
+    "npm-check-updates": "^12.3.0",
     "npm-run-all": "^4.1.5",
     "rimraf": "^3.0.2",
-    "sass": "^1.49.0",
+    "sass": "^1.49.7",
     "yargs": "^17.3.1"
   },
   "dependencies": {
-    "@babel/runtime": "^7.16.7",
+    "@babel/runtime": "^7.17.2",
     "@carbon/telemetry": "^0.0.0-alpha.6",
-    "react-resize-detector": "^7.0.0"
+    "react-resize-detector": "^7.0.0",
+    "react-table": "^7.7.0",
+    "react-window": "^1.8.6"
   },
   "peerDependencies": {
-    "@carbon/colors": "^10.34.0",
-    "@carbon/icons-react": "^10.42.0",
+    "@carbon/colors": "^10.36.0",
+    "@carbon/icons-react": "^10.46.0",
     "@carbon/import-once": "^10.5.0",
-    "@carbon/layout": "^10.34.0",
-    "@carbon/motion": "^10.26.0",
-    "@carbon/themes": "^10.46.0",
-    "@carbon/type": "^10.38.0",
-    "carbon-components": "^10.47.1",
-    "carbon-components-react": "^7.47.2",
+    "@carbon/layout": "^10.36.0",
+    "@carbon/motion": "^10.28.0",
+    "@carbon/themes": "^10.50.0",
+    "@carbon/type": "^10.40.0",
+    "carbon-components": "^10.53.0",
+    "carbon-components-react": "^7.53.0",
     "carbon-icons": "^7.0.7",
     "react": "^16.8.6 || ^17.0.1",
     "react-dom": "^16.8.6 || ^17.0.1"
   },
-  "gitHead": "64c7f310e4d344bce77216750d5989485d28a11c"
+  "gitHead": "f4a8ee412f5ddb54722b47478e35d469f49ac411"
 }