@carbon/ibm-products 2.61.0 → 2.62.0-rc.0

package/lib/components/PageHeader/PageHeaderTitle.js

@@ -42,7 +42,7 @@ var PageHeaderTitle = function PageHeaderTitle(_ref) {
     cancelDescription = title.cancelDescription,
     saveDescription = title.saveDescription,
     _title$tooltipAlignme = title.tooltipAlignment,
-    tooltipAlignment = _title$tooltipAlignme === undefined ? 'bottom' : _title$tooltipAlignme,
+    tooltipAlignment = _title$tooltipAlignme === void 0 ? 'bottom' : _title$tooltipAlignme,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(title, _excluded);
   var titleText;
   var isEditable = !!onSave;

package/lib/components/PageHeader/PageHeaderUtils.js

@@ -165,7 +165,7 @@ var utilGetBreadcrumbItemForTitle = function utilGetBreadcrumbItemForTitle(block
       var _ref, _title$breadcrumbCont;
       // user defined content
       breadcrumbTitle = {
-        label: (_ref = (_title$breadcrumbCont = title.breadcrumbContent) !== null && _title$breadcrumbCont !== undefined ? _title$breadcrumbCont : title.content) !== null && _ref !== undefined ? _ref : title.asText,
+        label: (_ref = (_title$breadcrumbCont = title.breadcrumbContent) !== null && _title$breadcrumbCont !== void 0 ? _title$breadcrumbCont : title.content) !== null && _ref !== void 0 ? _ref : title.asText,
         title: title.asText
       };
     } else {

package/lib/components/ProductiveCard/ProductiveCard.js

@@ -19,7 +19,7 @@ var _excluded = ["actionsPlacement"];
 var componentName = 'ProductiveCard';
 exports.ProductiveCard = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$actionsPlacement = _ref.actionsPlacement,
-    actionsPlacement = _ref$actionsPlacement === undefined ? 'top' : _ref$actionsPlacement,
+    actionsPlacement = _ref$actionsPlacement === void 0 ? 'top' : _ref$actionsPlacement,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var validProps = propsHelper.prepareProps(rest, ['media', 'mediaPosition', 'pictogram', 'primaryButtonClick', 'productive', 'secondaryButtonKind']);
   return /*#__PURE__*/React.createElement(Card.Card, _rollupPluginBabelHelpers.extends({}, _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, validProps), {}, {

package/lib/components/RemoveModal/RemoveModal.js

@@ -76,10 +76,10 @@ exports.RemoveModal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   // the value of the input will still remain: we only want to empty the input value
   // when open actually changes to false.
   React.useEffect(function () {
-    if (!open && previousState !== null && previousState !== undefined && previousState.open) {
+    if (!open && previousState !== null && previousState !== void 0 && previousState.open) {
       setUserInput('');
     }
-  }, [open, previousState === null || previousState === undefined ? undefined : previousState.open]);
+  }, [open, previousState === null || previousState === void 0 ? void 0 : previousState.open]);
   return renderPortalUse(/*#__PURE__*/React.createElement(react.ComposedModal, _rollupPluginBabelHelpers.extends({}, rest, {
     className: cx(blockClass, className),
     size: "sm",

package/lib/components/Saving/Saving.js

@@ -83,7 +83,7 @@ exports.Saving = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     size: 16
   }))), /*#__PURE__*/React.createElement("p", {
     className: "".concat(blockClass, "__text")
-  }, (_statusObj$status = statusObj[status]) === null || _statusObj$status === undefined ? undefined : _statusObj$status.text)) : /*#__PURE__*/React.createElement("div", {
+  }, (_statusObj$status = statusObj[status]) === null || _statusObj$status === void 0 ? void 0 : _statusObj$status.text)) : /*#__PURE__*/React.createElement("div", {
     className: "".concat(blockClass, "__buttons")
   }, /*#__PURE__*/React.createElement(react.Button, {
     onClick: onRequestCancel,
@@ -93,11 +93,11 @@ exports.Saving = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, secondaryButtonText), /*#__PURE__*/React.createElement(react.Button, {
     onClick: onRequestSave,
     kind: "primary",
-    renderIcon: (_statusObj$status2 = statusObj[status]) === null || _statusObj$status2 === undefined ? undefined : _statusObj$status2.icon,
-    iconDescription: (_statusObj$status3 = statusObj[status]) === null || _statusObj$status3 === undefined ? undefined : _statusObj$status3.iconDescription,
+    renderIcon: (_statusObj$status2 = statusObj[status]) === null || _statusObj$status2 === void 0 ? void 0 : _statusObj$status2.icon,
+    iconDescription: (_statusObj$status3 = statusObj[status]) === null || _statusObj$status3 === void 0 ? void 0 : _statusObj$status3.iconDescription,
     disabled: status === 'in-progress',
     type: "button"
-  }, (_statusObj$status4 = statusObj[status]) === null || _statusObj$status4 === undefined ? undefined : _statusObj$status4.text)));
+  }, (_statusObj$status4 = statusObj[status]) === null || _statusObj$status4 === void 0 ? void 0 : _statusObj$status4.text)));
 });
 exports.Saving = settings.pkg.checkComponentEnabled(exports.Saving, componentName);
 exports.Saving.propTypes = {

package/lib/components/ScrollGradient/ScrollGradient.js

@@ -35,14 +35,14 @@ exports.ScrollGradient = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     _ref$color = _ref.color,
-    color = _ref$color === undefined ? defaults.color : _ref$color,
+    color = _ref$color === void 0 ? defaults.color : _ref$color,
     _ref$onScroll = _ref.onScroll,
-    onScroll = _ref$onScroll === undefined ? defaults.onScroll : _ref$onScroll,
+    onScroll = _ref$onScroll === void 0 ? defaults.onScroll : _ref$onScroll,
     scrollElementClassName = _ref.scrollElementClassName,
     _ref$getScrollElement = _ref.getScrollElementRef,
-    getScrollElementRef = _ref$getScrollElement === undefined ? defaults.getScrollElementRef : _ref$getScrollElement,
+    getScrollElementRef = _ref$getScrollElement === void 0 ? defaults.getScrollElementRef : _ref$getScrollElement,
     _ref$hideStartGradien = _ref.hideStartGradient,
-    hideStartGradient = _ref$hideStartGradien === undefined ? defaults.hideStartGradient : _ref$hideStartGradien,
+    hideStartGradient = _ref$hideStartGradien === void 0 ? defaults.hideStartGradient : _ref$hideStartGradien,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var intersectionStartRef = React.useRef();
   var intersectionEndRef = React.useRef();
@@ -86,11 +86,11 @@ exports.ScrollGradient = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       if (entry.isIntersecting) {
         gradientRef.current.style.opacity = 0;
         gradientRef.current.style.display = 'none';
-        gradientRef === null || gradientRef === undefined || gradientRef.current.setAttribute('aria-hidden', false);
+        gradientRef === null || gradientRef === void 0 || gradientRef.current.setAttribute('aria-hidden', false);
       } else {
         gradientRef.current.style.opacity = 1;
         gradientRef.current.style.display = 'block';
-        gradientRef === null || gradientRef === undefined || gradientRef.current.setAttribute('aria-hidden', true);
+        gradientRef === null || gradientRef === void 0 || gradientRef.current.setAttribute('aria-hidden', true);
       }
     }
   };

package/lib/components/SearchBar/SearchBar.js

@@ -33,19 +33,19 @@ exports.SearchBar = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     clearButtonLabelText = _ref.clearButtonLabelText,
     _ref$hideScopesLabel = _ref.hideScopesLabel,
-    hideScopesLabel = _ref$hideScopesLabel === undefined ? defaults.hideScopesLabel : _ref$hideScopesLabel,
+    hideScopesLabel = _ref$hideScopesLabel === void 0 ? defaults.hideScopesLabel : _ref$hideScopesLabel,
     labelText = _ref.labelText,
     _ref$onChange = _ref.onChange,
-    onChange = _ref$onChange === undefined ? defaults.onChange : _ref$onChange,
+    onChange = _ref$onChange === void 0 ? defaults.onChange : _ref$onChange,
     _ref$onSubmit = _ref.onSubmit,
-    onSubmit = _ref$onSubmit === undefined ? defaults.onSubmit : _ref$onSubmit,
+    onSubmit = _ref$onSubmit === void 0 ? defaults.onSubmit : _ref$onSubmit,
     placeholderText = _ref.placeholderText,
     _ref$scopes = _ref.scopes,
-    scopes = _ref$scopes === undefined ? [] : _ref$scopes,
+    scopes = _ref$scopes === void 0 ? [] : _ref$scopes,
     scopesTypeLabel = _ref.scopesTypeLabel,
     scopeToString = _ref.scopeToString,
     _ref$selectedScopes = _ref.selectedScopes,
-    selectedScopes = _ref$selectedScopes === undefined ? [] : _ref$selectedScopes,
+    selectedScopes = _ref$selectedScopes === void 0 ? [] : _ref$selectedScopes,
     sortItems = _ref.sortItems,
     submitLabel = _ref.submitLabel,
     translateWithId = _ref.translateWithId,
@@ -126,7 +126,7 @@ exports.SearchBar = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, devtools.getDevtoolsProps(componentName), {
     className: cx(blockClass, className, _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--hide-scopes-label"), hideScopesLabel)),
     onSubmit: handleSubmit
-  }), scopes !== null && scopes !== undefined && scopes.length ? /*#__PURE__*/React.createElement(react.MultiSelect, _rollupPluginBabelHelpers.extends({}, multiSelectProps, {
+  }), scopes !== null && scopes !== void 0 && scopes.length ? /*#__PURE__*/React.createElement(react.MultiSelect, _rollupPluginBabelHelpers.extends({}, multiSelectProps, {
     id: "".concat(blockClass, "__multi-select"),
     name: "search-scopes",
     className: "".concat(blockClass, "__scopes"),

package/lib/components/SidePanel/SidePanel.js

@@ -48,32 +48,32 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     actions = _ref.actions,
     aiLabel = _ref.aiLabel,
     _ref$animateTitle = _ref.animateTitle,
-    animateTitle = _ref$animateTitle === undefined ? defaults.animateTitle : _ref$animateTitle,
+    animateTitle = _ref$animateTitle === void 0 ? defaults.animateTitle : _ref$animateTitle,
     children = _ref.children,
     className = _ref.className,
     _ref$closeIconDescrip = _ref.closeIconDescription,
-    closeIconDescription = _ref$closeIconDescrip === undefined ? defaults.closeIconDescription : _ref$closeIconDescrip,
+    closeIconDescription = _ref$closeIconDescrip === void 0 ? defaults.closeIconDescription : _ref$closeIconDescrip,
     condensedActions = _ref.condensedActions,
     _ref$currentStep = _ref.currentStep,
-    currentStep = _ref$currentStep === undefined ? defaults.currentStep : _ref$currentStep,
+    currentStep = _ref$currentStep === void 0 ? defaults.currentStep : _ref$currentStep,
     decorator = _ref.decorator,
     _ref$id = _ref.id,
-    id = _ref$id === undefined ? blockClass : _ref$id,
+    id = _ref$id === void 0 ? blockClass : _ref$id,
     includeOverlay = _ref.includeOverlay,
     labelText = _ref.labelText,
     _ref$navigationBackIc = _ref.navigationBackIconDescription,
-    navigationBackIconDescription = _ref$navigationBackIc === undefined ? defaults.navigationBackIconDescription : _ref$navigationBackIc,
+    navigationBackIconDescription = _ref$navigationBackIc === void 0 ? defaults.navigationBackIconDescription : _ref$navigationBackIc,
     onNavigationBack = _ref.onNavigationBack,
     onRequestClose = _ref.onRequestClose,
     onUnmount = _ref.onUnmount,
     open = _ref.open,
     _ref$placement = _ref.placement,
-    placement = _ref$placement === undefined ? defaults.placement : _ref$placement,
+    placement = _ref$placement === void 0 ? defaults.placement : _ref$placement,
     preventCloseOnClickOutside = _ref.preventCloseOnClickOutside,
     selectorPageContent = _ref.selectorPageContent,
     selectorPrimaryFocus = _ref.selectorPrimaryFocus,
     _ref$size = _ref.size,
-    size = _ref$size === undefined ? defaults.size : _ref$size,
+    size = _ref$size === void 0 ? defaults.size : _ref$size,
     slideIn = _ref.slideIn,
     slug = _ref.slug,
     subtitle = _ref.subtitle,
@@ -113,7 +113,7 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var panelRefValue = sidePanelRef.current;
   var previousOpen = usePreviousValue.usePreviousValue(open);
   var shouldReduceMotion = usePrefersReducedMotion.usePrefersReducedMotion();
-  var exitAnimationName = placement === 'right' ? 'side-panel-exit-right' : 'side-panel-exit-left';
+  var exitAnimationName = shouldReduceMotion ? 'side-panel-exit-reduced' : placement === 'right' ? 'side-panel-exit-right' : 'side-panel-exit-left';
   var _usePresence = usePresence.usePresence(open, sidePanelRef, exitAnimationName),
     shouldRender = _usePresence.shouldRender;
 
@@ -124,51 +124,51 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     setLabelTextHeight = _useState8[1];
   var handleEscapeKey = function handleEscapeKey(event) {
     if (event.key === 'Escape' && open) {
-      onRequestClose === null || onRequestClose === undefined || onRequestClose();
+      onRequestClose === null || onRequestClose === void 0 || onRequestClose();
     }
   };
   React.useEffect(function () {
-    if (open && !(titleRef !== null && titleRef !== undefined && titleRef.current)) {
+    if (open && !(titleRef !== null && titleRef !== void 0 && titleRef.current)) {
       setDoAnimateTitle(false);
     } else {
       setDoAnimateTitle(animateTitle);
     }
   }, [animateTitle, open]);
   var titleItemsStyles = React.useCallback(function (progress) {
-    if (subtitleRef !== null && subtitleRef !== undefined && subtitleRef.current) {
+    if (subtitleRef !== null && subtitleRef !== void 0 && subtitleRef.current) {
       var _subtitleEl$style;
-      var subtitleEl = subtitleRef === null || subtitleRef === undefined ? undefined : subtitleRef.current;
-      var height = subtitleEl === null || subtitleEl === undefined ? undefined : subtitleEl.clientHeight;
+      var subtitleEl = subtitleRef === null || subtitleRef === void 0 ? void 0 : subtitleRef.current;
+      var height = subtitleEl === null || subtitleEl === void 0 ? void 0 : subtitleEl.clientHeight;
       var calculatedMargin = height * progress;
-      subtitleEl === null || subtitleEl === undefined || (_subtitleEl$style = subtitleEl.style) === null || _subtitleEl$style === undefined || _subtitleEl$style.setProperty('margin-top', "".concat(-calculatedMargin, "px"));
+      subtitleEl === null || subtitleEl === void 0 || (_subtitleEl$style = subtitleEl.style) === null || _subtitleEl$style === void 0 || _subtitleEl$style.setProperty('margin-top', "".concat(-calculatedMargin, "px"));
     }
-    if (labelTextRef !== null && labelTextRef !== undefined && labelTextRef.current) {
+    if (labelTextRef !== null && labelTextRef !== void 0 && labelTextRef.current) {
       var _labelTextRef$current;
       var _calculatedMargin = labelTextHeight * progress;
-      labelTextRef === null || labelTextRef === undefined || (_labelTextRef$current = labelTextRef.current) === null || _labelTextRef$current === undefined || (_labelTextRef$current = _labelTextRef$current.style) === null || _labelTextRef$current === undefined || _labelTextRef$current.setProperty('margin-top', "".concat(-_calculatedMargin, "px"));
+      labelTextRef === null || labelTextRef === void 0 || (_labelTextRef$current = labelTextRef.current) === null || _labelTextRef$current === void 0 || (_labelTextRef$current = _labelTextRef$current.style) === null || _labelTextRef$current === void 0 || _labelTextRef$current.setProperty('margin-top', "".concat(-_calculatedMargin, "px"));
     }
   }, [labelTextHeight]);
   React.useEffect(function () {
-    if (open && animateTitle && labelTextRef !== null && labelTextRef !== undefined && labelTextRef.current) {
+    if (open && animateTitle && labelTextRef !== null && labelTextRef !== void 0 && labelTextRef.current) {
       var _labelTextRef$current2;
-      setLabelTextHeight(Number((labelTextRef === null || labelTextRef === undefined || (_labelTextRef$current2 = labelTextRef.current) === null || _labelTextRef$current2 === undefined ? undefined : _labelTextRef$current2.clientHeight) || null));
+      setLabelTextHeight(Number((labelTextRef === null || labelTextRef === void 0 || (_labelTextRef$current2 = labelTextRef.current) === null || _labelTextRef$current2 === void 0 ? void 0 : _labelTextRef$current2.clientHeight) || null));
     }
   }, [animateTitle, labelTextRef, open]);
   var handleScroll = React.useCallback(function () {
-    if (doAnimateTitle && innerContentRef !== null && innerContentRef !== undefined && innerContentRef.current) {
+    if (doAnimateTitle && innerContentRef !== null && innerContentRef !== void 0 && innerContentRef.current) {
       var _innerContentRef$curr;
-      var scrollTop = innerContentRef === null || innerContentRef === undefined || (_innerContentRef$curr = innerContentRef.current) === null || _innerContentRef$curr === undefined ? undefined : _innerContentRef$curr.scrollTop;
+      var scrollTop = innerContentRef === null || innerContentRef === void 0 || (_innerContentRef$curr = innerContentRef.current) === null || _innerContentRef$curr === void 0 ? void 0 : _innerContentRef$curr.scrollTop;
       var animationProgress = Math.min(Number(scrollTop), scrollAnimationDistance) / scrollAnimationDistance;
-      panelRefValue === null || panelRefValue === undefined || panelRefValue.style.setProperty("--".concat(blockClass, "--scroll-animation-progress"), animationProgress.toString());
+      panelRefValue === null || panelRefValue === void 0 || panelRefValue.style.setProperty("--".concat(blockClass, "--scroll-animation-progress"), animationProgress.toString());
       titleItemsStyles(animationProgress);
     }
-  }, [doAnimateTitle, panelRefValue === null || panelRefValue === undefined ? undefined : panelRefValue.style, scrollAnimationDistance, titleItemsStyles]);
+  }, [doAnimateTitle, panelRefValue === null || panelRefValue === void 0 ? void 0 : panelRefValue.style, scrollAnimationDistance, titleItemsStyles]);
 
   // scroll panel to top going between steps
   React.useEffect(function () {
     if (sidePanelRef && panelRefValue) {
       var _animatedScrollRef$cu;
-      var scrollableSection = (_animatedScrollRef$cu = animatedScrollRef.current) !== null && _animatedScrollRef$cu !== undefined ? _animatedScrollRef$cu : innerContentRef.current;
+      var scrollableSection = (_animatedScrollRef$cu = animatedScrollRef.current) !== null && _animatedScrollRef$cu !== void 0 ? _animatedScrollRef$cu : innerContentRef.current;
       if (previousState && previousState['currentStep'] !== currentStep && scrollableSection) {
         scrollableSection.scrollTop = 0;
       }
@@ -193,17 +193,17 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     if (previousOpen && !open && launcherButtonRef) {
       setTimeout(function () {
         var _launcherButtonRef$cu;
-        launcherButtonRef === null || launcherButtonRef === undefined || (_launcherButtonRef$cu = launcherButtonRef.current) === null || _launcherButtonRef$cu === undefined || _launcherButtonRef$cu.focus();
+        launcherButtonRef === null || launcherButtonRef === void 0 || (_launcherButtonRef$cu = launcherButtonRef.current) === null || _launcherButtonRef$cu === void 0 || _launcherButtonRef$cu.focus();
       }, 0);
     }
   }, [launcherButtonRef, open, previousOpen]);
   var checkSetDoAnimateTitle = function checkSetDoAnimateTitle() {
     var canDoAnimateTitle = false;
-    if (panelRefValue && open && animateTitle && animationComplete && titleRef !== null && titleRef !== undefined && titleRef.current && title && title.length && !shouldReduceMotion) {
+    if (panelRefValue && open && animateTitle && animationComplete && titleRef !== null && titleRef !== void 0 && titleRef.current && title && title.length && !shouldReduceMotion) {
       var _labelTextRef$current3, _labelTextRef$current4, _subtitleRef$current$, _subtitleRef$current;
       var titleEl = titleRef.current;
-      var labelHeight = (_labelTextRef$current3 = labelTextRef === null || labelTextRef === undefined || (_labelTextRef$current4 = labelTextRef.current) === null || _labelTextRef$current4 === undefined ? undefined : _labelTextRef$current4.offsetHeight) !== null && _labelTextRef$current3 !== undefined ? _labelTextRef$current3 : 0;
-      var subtitleHeight = (_subtitleRef$current$ = subtitleRef === null || subtitleRef === undefined || (_subtitleRef$current = subtitleRef.current) === null || _subtitleRef$current === undefined ? undefined : _subtitleRef$current.offsetHeight) !== null && _subtitleRef$current$ !== undefined ? _subtitleRef$current$ : 0;
+      var labelHeight = (_labelTextRef$current3 = labelTextRef === null || labelTextRef === void 0 || (_labelTextRef$current4 = labelTextRef.current) === null || _labelTextRef$current4 === void 0 ? void 0 : _labelTextRef$current4.offsetHeight) !== null && _labelTextRef$current3 !== void 0 ? _labelTextRef$current3 : 0;
+      var subtitleHeight = (_subtitleRef$current$ = subtitleRef === null || subtitleRef === void 0 || (_subtitleRef$current = subtitleRef.current) === null || _subtitleRef$current === void 0 ? void 0 : _subtitleRef$current.offsetHeight) !== null && _subtitleRef$current$ !== void 0 ? _subtitleRef$current$ : 0;
 
       // Adjusts space at bottom of titles by changing where scrolling finishes
       // Styles use border to save use of get computed style
@@ -212,12 +212,12 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       setScrollAnimationDistance(_scrollAnimationDistance);
 
       // used to calculate the header moves
-      panelRefValue === null || panelRefValue === undefined || panelRefValue.style.setProperty("--".concat(blockClass, "--scroll-animation-distance"), _scrollAnimationDistance.toString());
+      panelRefValue === null || panelRefValue === void 0 || panelRefValue.style.setProperty("--".concat(blockClass, "--scroll-animation-distance"), _scrollAnimationDistance.toString());
       var scrollEl = innerContentRef.current;
       if (scrollEl) {
         var _window;
-        var innerComputed = (_window = window) === null || _window === undefined ? undefined : _window.getComputedStyle(innerContentRef.current);
-        var innerPaddingHeight = innerComputed ? parseFloat(innerComputed === null || innerComputed === undefined ? undefined : innerComputed.paddingTop) + parseFloat(innerComputed === null || innerComputed === undefined ? undefined : innerComputed.paddingBottom) : 0;
+        var innerComputed = (_window = window) === null || _window === void 0 ? void 0 : _window.getComputedStyle(innerContentRef.current);
+        var innerPaddingHeight = innerComputed ? parseFloat(innerComputed === null || innerComputed === void 0 ? void 0 : innerComputed.paddingTop) + parseFloat(innerComputed === null || innerComputed === void 0 ? void 0 : innerComputed.paddingBottom) : 0;
         canDoAnimateTitle = (!!labelText || !!actionToolbarButtons || !!subtitle) && scrollEl.scrollHeight - scrollEl.clientHeight >= _scrollAnimationDistance + innerPaddingHeight;
       }
     }
@@ -228,13 +228,13 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   };
   React.useEffect(function () {
     if (!doAnimateTitle && sidePanelRef.current) {
-      panelRefValue === null || panelRefValue === undefined || panelRefValue.style.setProperty("--".concat(blockClass, "--scroll-animation-progress"), '0');
+      panelRefValue === null || panelRefValue === void 0 || panelRefValue.style.setProperty("--".concat(blockClass, "--scroll-animation-progress"), '0');
     }
-  }, [doAnimateTitle, handleScroll, sidePanelRef, innerContentRef, open, panelRefValue === null || panelRefValue === undefined ? undefined : panelRefValue.style]);
+  }, [doAnimateTitle, handleScroll, sidePanelRef, innerContentRef, open, panelRefValue === null || panelRefValue === void 0 ? void 0 : panelRefValue.style]);
 
   // Calculate scroll distances
   React.useEffect(function () {
-    if (panelRefValue && open && animateTitle && animationComplete && titleRef !== null && titleRef !== undefined && titleRef.current && title && title.length && !shouldReduceMotion) {
+    if (panelRefValue && open && animateTitle && animationComplete && titleRef !== null && titleRef !== void 0 && titleRef.current && title && title.length && !shouldReduceMotion) {
       checkSetDoAnimateTitle();
     }
 
@@ -267,7 +267,7 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   // initializes the side panel to close
   var onAnimationEnd = function onAnimationEnd() {
     if (!open) {
-      onUnmount === null || onUnmount === undefined || onUnmount();
+      onUnmount === null || onUnmount === void 0 || onUnmount();
     }
     setAnimationComplete(!animationComplete);
   };
@@ -298,7 +298,7 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, [open, placement, selectorPageContent, slideIn]);
   React.useEffect(function () {
     if (!open && previousState && previousState['open'] && shouldReduceMotion) {
-      onUnmount === null || onUnmount === undefined || onUnmount();
+      onUnmount === null || onUnmount === void 0 || onUnmount();
     }
   }, [open, onUnmount, shouldReduceMotion, previousState]);
 
@@ -324,17 +324,17 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, [slideIn, selectorPageContent, placement, size, shouldReduceMotion, open]);
   React.useEffect(function () {
     if (open && animationComplete) {
-      if (selectorPrimaryFocus && useFocus.getSpecificElement(sidePanelRef === null || sidePanelRef === undefined ? undefined : sidePanelRef.current, selectorPrimaryFocus)) {
+      if (selectorPrimaryFocus && useFocus.getSpecificElement(sidePanelRef === null || sidePanelRef === void 0 ? void 0 : sidePanelRef.current, selectorPrimaryFocus)) {
         var _window2;
-        var primeFocusEl = useFocus.getSpecificElement(sidePanelRef === null || sidePanelRef === undefined ? undefined : sidePanelRef.current, selectorPrimaryFocus);
-        if (primeFocusEl && ((_window2 = window) === null || _window2 === undefined || (_window2 = _window2.getComputedStyle(primeFocusEl)) === null || _window2 === undefined ? undefined : _window2.display) !== 'none') {
+        var primeFocusEl = useFocus.getSpecificElement(sidePanelRef === null || sidePanelRef === void 0 ? void 0 : sidePanelRef.current, selectorPrimaryFocus);
+        if (primeFocusEl && ((_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.getComputedStyle(primeFocusEl)) === null || _window2 === void 0 ? void 0 : _window2.display) !== 'none') {
           setTimeout(function () {
-            return primeFocusEl === null || primeFocusEl === undefined ? undefined : primeFocusEl.focus();
+            return primeFocusEl === null || primeFocusEl === void 0 ? void 0 : primeFocusEl.focus();
           }, 0);
         }
       } else if (!slideIn) {
         setTimeout(function () {
-          return firstElement === null || firstElement === undefined ? undefined : firstElement.focus();
+          return firstElement === null || firstElement === void 0 ? void 0 : firstElement.focus();
         }, 0);
       }
     }
@@ -363,19 +363,19 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
      * slug is deprecated
      * can remove this condition in future release
      */
-    if (slug && ((_slug$type = slug['type']) === null || _slug$type === undefined ? undefined : _slug$type.displayName) === 'AILabel') {
+    if (slug && ((_slug$type = slug['type']) === null || _slug$type === void 0 ? void 0 : _slug$type.displayName) === 'AILabel') {
       normalizedDecorator = /*#__PURE__*/React.cloneElement(slug, {
         // slug size is sm unless actions and size > md
         size: closeSize
       });
     }
-    if (aiLabel && ((_aiLabel$type = aiLabel['type']) === null || _aiLabel$type === undefined ? undefined : _aiLabel$type.displayName) === 'AILabel') {
+    if (aiLabel && ((_aiLabel$type = aiLabel['type']) === null || _aiLabel$type === void 0 ? void 0 : _aiLabel$type.displayName) === 'AILabel') {
       normalizedDecorator = /*#__PURE__*/React.cloneElement(aiLabel, {
         // aiLabel size is sm unless actions and size > md
         size: closeSize
       });
     }
-    if ((decorator === null || decorator === undefined || (_decorator$type = decorator['type']) === null || _decorator$type === undefined ? undefined : _decorator$type.displayName) === 'AILabel') {
+    if ((decorator === null || decorator === void 0 || (_decorator$type = decorator['type']) === null || _decorator$type === void 0 ? void 0 : _decorator$type.displayName) === 'AILabel') {
       normalizedDecorator = /*#__PURE__*/React.cloneElement(decorator, {
         // decorator size is sm unless actions and size > md
         size: closeSize
@@ -424,7 +424,7 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       var label = _ref4.label,
         kind = _ref4.kind,
         _ref4$hasIconOnly = _ref4.hasIconOnly,
-        hasIconOnly = _ref4$hasIconOnly === undefined ? false : _ref4$hasIconOnly,
+        hasIconOnly = _ref4$hasIconOnly === void 0 ? false : _ref4$hasIconOnly,
         icon = _ref4.icon,
         renderIcon = _ref4.renderIcon,
         tooltipPosition = _ref4.tooltipPosition,
@@ -474,7 +474,7 @@ exports.SidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onAnimationStart: onAnimationStart,
     onKeyDown: handleKeyDown
   }), renderHeader(), renderMain(), /*#__PURE__*/React.createElement(ActionSet.ActionSet, {
-    actions: actions !== null && actions !== undefined ? actions : [],
+    actions: actions !== null && actions !== void 0 ? actions : [],
     className: primaryActionContainerClassNames,
     size: size === 'xs' ? 'sm' : size
   })), includeOverlay && /*#__PURE__*/React.createElement("div", {

package/lib/components/SimpleHeader/SimpleHeader.js

@@ -37,13 +37,13 @@ var SimpleHeader = function SimpleHeader(_ref) {
     className = _ref.className,
     title = _ref.title,
     _ref$noTrailingSlash = _ref.noTrailingSlash,
-    noTrailingSlash = _ref$noTrailingSlash === undefined ? true : _ref$noTrailingSlash,
+    noTrailingSlash = _ref$noTrailingSlash === void 0 ? true : _ref$noTrailingSlash,
     maxVisible = _ref.maxVisible,
     overflowAriaLabel = _ref.overflowAriaLabel,
     overflowTooltipAlign = _ref.overflowTooltipAlign,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var warnIfNoTitleOrBreadcrumbs = React.useCallback(function () {
-    if (!title && !(breadcrumbs !== null && breadcrumbs !== undefined && breadcrumbs.length)) {
+    if (!title && !(breadcrumbs !== null && breadcrumbs !== void 0 && breadcrumbs.length)) {
       pconsole.default.error("Warning: You have tried using a ".concat(componentName, " component without specifying a title or breadcrumbs props"));
     }
   }, [breadcrumbs, title]);
@@ -52,7 +52,7 @@ var SimpleHeader = function SimpleHeader(_ref) {
   }, [title, breadcrumbs, warnIfNoTitleOrBreadcrumbs]);
   return /*#__PURE__*/React.createElement("header", _rollupPluginBabelHelpers.extends({
     className: cx(blockClass, className)
-  }, rest), (breadcrumbs === null || breadcrumbs === undefined ? undefined : breadcrumbs.length) > 0 && /*#__PURE__*/React.createElement(BreadcrumbWithOverflow.BreadcrumbWithOverflow, {
+  }, rest), (breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length) > 0 && /*#__PURE__*/React.createElement(BreadcrumbWithOverflow.BreadcrumbWithOverflow, {
     noTrailingSlash: noTrailingSlash,
     className: cx("".concat(blockClass, "__breadcrumbs")),
     breadcrumbs: breadcrumbs,
@@ -65,7 +65,7 @@ var SimpleHeader = function SimpleHeader(_ref) {
 };
 var overflowAriaLabel_required_if_breadcrumbs_exist = propsHelper.isRequiredIf(index.default.string, function (props) {
   var _props$breadcrumbs;
-  return ((_props$breadcrumbs = props.breadcrumbs) === null || _props$breadcrumbs === undefined ? undefined : _props$breadcrumbs.length) > 0;
+  return ((_props$breadcrumbs = props.breadcrumbs) === null || _props$breadcrumbs === void 0 ? void 0 : _props$breadcrumbs.length) > 0;
 });
 SimpleHeader.propTypes = {
   /** Header breadcrumbs */

package/lib/components/StatusIcon/StatusIcon.js

@@ -326,7 +326,7 @@ exports.StatusIcon = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
       })
     }
   };
-  var IconComponent = (_icons$kind = icons$1[kind]) === null || _icons$kind === undefined ? undefined : _icons$kind[size];
+  var IconComponent = (_icons$kind = icons$1[kind]) === null || _icons$kind === void 0 ? void 0 : _icons$kind[size];
   var classNames = cx(className, blockClass, "".concat(blockClass, "--").concat(theme), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--").concat(theme, "-").concat(kind), kind));
   return IconComponent && /*#__PURE__*/React.createElement(IconComponent, _rollupPluginBabelHelpers.extends({}, rest, {
     className: classNames,

package/lib/components/StatusIndicator/StatusIndicator.js

@@ -36,9 +36,9 @@ exports.StatusIndicator = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     className = _ref.className,
     onRetry = _ref.onRetry,
     _ref$retryLabel = _ref.retryLabel,
-    retryLabel = _ref$retryLabel === undefined ? defaults.retryLabel : _ref$retryLabel,
+    retryLabel = _ref$retryLabel === void 0 ? defaults.retryLabel : _ref$retryLabel,
     _ref$showRetry = _ref.showRetry,
-    showRetry = _ref$showRetry === undefined ? defaults.showRetry : _ref$showRetry,
+    showRetry = _ref$showRetry === void 0 ? defaults.showRetry : _ref$showRetry,
     title = _ref.title,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {

package/lib/components/StatusIndicator/StatusIndicatorStep.js

@@ -35,7 +35,7 @@ exports.StatusIndicatorStep = /*#__PURE__*/React.forwardRef(function (_ref, ref)
     description = _ref.description,
     errorMessage = _ref.errorMessage,
     _ref$status = _ref.status,
-    status = _ref$status === undefined ? defaults.status : _ref$status,
+    status = _ref$status === void 0 ? defaults.status : _ref$status,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement("li", _rollupPluginBabelHelpers.extends({}, rest, {
     className: cx(blockClass, className, "".concat(blockClass, "--").concat(status)),

package/lib/components/StringFormatter/StringFormatter.js

@@ -35,13 +35,13 @@ var defaults = {
 exports.StringFormatter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$lines = _ref.lines,
-    lines = _ref$lines === undefined ? defaults.lines : _ref$lines,
+    lines = _ref$lines === void 0 ? defaults.lines : _ref$lines,
     _ref$tooltipDirection = _ref.tooltipDirection,
-    tooltipDirection = _ref$tooltipDirection === undefined ? defaults.tooltipDirection : _ref$tooltipDirection,
+    tooltipDirection = _ref$tooltipDirection === void 0 ? defaults.tooltipDirection : _ref$tooltipDirection,
     _ref$truncate = _ref.truncate,
-    truncate = _ref$truncate === undefined ? defaults.truncate : _ref$truncate,
+    truncate = _ref$truncate === void 0 ? defaults.truncate : _ref$truncate,
     _ref$width = _ref.width,
-    width = _ref$width === undefined ? defaults.width : _ref$width,
+    width = _ref$width === void 0 ? defaults.width : _ref$width,
     value = _ref.value,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var contentRef = React.useRef(null);

package/lib/components/TagOverflow/TagOverflow.js

@@ -18,7 +18,7 @@ var cx = require('classnames');
 var devtools = require('../../global/js/utils/devtools.js');
 var propsHelper = require('../../global/js/utils/props-helper.js');
 var settings = require('../../settings.js');
-var useOverflowItems = require('../../global/js/hooks/useOverflowItems.js');
+var useOverflowItems = require('../../global/js/hooks/useOverflowItems/useOverflowItems.js');
 
 var _excluded = ["align", "allTagsModalAriaLabel", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "allTagsModalTarget", "allTagsModalTitle", "autoAlign", "className", "items", "maxVisible", "overflowAlign", "overflowClassName", "overflowType", "onOverflowTagChange", "showAllTagsLabel", "tagComponent"],
   _excluded2 = ["className"],
@@ -28,7 +28,7 @@ var componentName = 'TagOverflow';
 var allTagsModalSearchThreshold = 10;
 exports.TagOverflow = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _props$align = props.align,
-    align = _props$align === undefined ? 'start' : _props$align,
+    align = _props$align === void 0 ? 'start' : _props$align,
     allTagsModalAriaLabel = props.allTagsModalAriaLabel,
     allTagsModalSearchLabel = props.allTagsModalSearchLabel,
     allTagsModalSearchPlaceholderText = props.allTagsModalSearchPlaceholderText,
@@ -39,10 +39,10 @@ exports.TagOverflow = /*#__PURE__*/React.forwardRef(function (props, ref) {
     items = props.items,
     maxVisible = props.maxVisible,
     _props$overflowAlign = props.overflowAlign,
-    overflowAlign = _props$overflowAlign === undefined ? 'bottom' : _props$overflowAlign,
+    overflowAlign = _props$overflowAlign === void 0 ? 'bottom' : _props$overflowAlign,
     overflowClassName = props.overflowClassName,
     _props$overflowType = props.overflowType,
-    overflowType = _props$overflowType === undefined ? 'default' : _props$overflowType,
+    overflowType = _props$overflowType === void 0 ? 'default' : _props$overflowType,
     onOverflowTagChange = props.onOverflowTagChange,
     showAllTagsLabel = props.showAllTagsLabel,
     tagComponent = props.tagComponent,
@@ -75,8 +75,8 @@ exports.TagOverflow = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }));
   };
   var handleTagOnClose = React.useCallback(function (onClose, index) {
-    onClose === null || onClose === undefined || onClose();
-    if (index <= (visibleItems === null || visibleItems === undefined ? undefined : visibleItems.length) - 1) {
+    onClose === null || onClose === void 0 || onClose();
+    if (index <= (visibleItems === null || visibleItems === void 0 ? void 0 : visibleItems.length) - 1) {
       setPopoverOpen(false);
     }
   }, [visibleItems]);
@@ -154,7 +154,7 @@ var tagTypes = Object.keys(constants.TYPES);
  */
 var string_required_if_more_than_10_tags = propsHelper.isRequiredIf(index.default.string, function (_ref) {
   var items = _ref.items;
-  return (items === null || items === undefined ? undefined : items.length) > allTagsModalSearchThreshold;
+  return (items === null || items === void 0 ? void 0 : items.length) > allTagsModalSearchThreshold;
 });
 
 // The types and DocGen commentary for the component props,

package/lib/components/TagOverflow/TagOverflowModal.js

@@ -32,14 +32,14 @@ var TagOverflowModal = function TagOverflowModal(_ref) {
     className = _ref.className,
     title = _ref.title,
     _ref$modalAriaLabel = _ref.modalAriaLabel,
-    modalAriaLabel = _ref$modalAriaLabel === undefined ? defaults.modalAriaLabel : _ref$modalAriaLabel,
+    modalAriaLabel = _ref$modalAriaLabel === void 0 ? defaults.modalAriaLabel : _ref$modalAriaLabel,
     onClose = _ref.onClose,
     onTagClose = _ref.onTagClose,
     open = _ref.open,
     overflowType = _ref.overflowType,
     portalTargetIn = _ref.portalTarget,
     _ref$searchLabel = _ref.searchLabel,
-    searchLabel = _ref$searchLabel === undefined ? defaults.searchLabel : _ref$searchLabel,
+    searchLabel = _ref$searchLabel === void 0 ? defaults.searchLabel : _ref$searchLabel,
     searchPlaceholder = _ref.searchPlaceholder,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var _useState = React.useState(''),
@@ -51,7 +51,7 @@ var TagOverflowModal = function TagOverflowModal(_ref) {
     if (open && search && allTags) {
       return allTags.filter(function (tag) {
         var _tag$label;
-        return (_tag$label = tag.label) === null || _tag$label === undefined || (_tag$label = _tag$label.toLocaleLowerCase()) === null || _tag$label === undefined ? undefined : _tag$label.includes(search.toLocaleLowerCase());
+        return (_tag$label = tag.label) === null || _tag$label === void 0 || (_tag$label = _tag$label.toLocaleLowerCase()) === null || _tag$label === void 0 ? void 0 : _tag$label.includes(search.toLocaleLowerCase());
       });
     }
     return allTags || [];
@@ -92,7 +92,7 @@ var TagOverflowModal = function TagOverflowModal(_ref) {
       key: id,
       text: label,
       onClose: function onClose() {
-        return onTagClose === null || onTagClose === undefined ? undefined : onTagClose({
+        return onTagClose === null || onTagClose === void 0 ? void 0 : onTagClose({
           label: label,
           id: id
         });