@carbon/ibm-products 2.61.0 → 2.62.0

package/es/components/SearchBar/SearchBar.js

@@ -31,19 +31,19 @@ var SearchBar = /*#__PURE__*/React__default.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,
@@ -124,7 +124,7 @@ var SearchBar = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   }, getDevtoolsProps(componentName), {
     className: cx(blockClass, className, _defineProperty({}, "".concat(blockClass, "--hide-scopes-label"), hideScopesLabel)),
     onSubmit: handleSubmit
-  }), scopes !== null && scopes !== undefined && scopes.length ? /*#__PURE__*/React__default.createElement(MultiSelect, _extends({}, multiSelectProps, {
+  }), scopes !== null && scopes !== void 0 && scopes.length ? /*#__PURE__*/React__default.createElement(MultiSelect, _extends({}, multiSelectProps, {
     id: "".concat(blockClass, "__multi-select"),
     name: "search-scopes",
     className: "".concat(blockClass, "__scopes"),

package/es/components/SidePanel/SidePanel.js

@@ -46,32 +46,32 @@ var SidePanel = /*#__PURE__*/React__default.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,
@@ -111,7 +111,7 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var panelRefValue = sidePanelRef.current;
   var previousOpen = usePreviousValue(open);
   var shouldReduceMotion = 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(open, sidePanelRef, exitAnimationName),
     shouldRender = _usePresence.shouldRender;
 
@@ -122,51 +122,51 @@ var SidePanel = /*#__PURE__*/React__default.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();
     }
   };
   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 = 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]);
   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 = 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
   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;
       }
@@ -191,17 +191,17 @@ var SidePanel = /*#__PURE__*/React__default.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
@@ -210,12 +210,12 @@ var SidePanel = /*#__PURE__*/React__default.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;
       }
     }
@@ -226,13 +226,13 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   };
   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
   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();
     }
 
@@ -265,7 +265,7 @@ var SidePanel = /*#__PURE__*/React__default.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);
   };
@@ -296,7 +296,7 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   }, [open, placement, selectorPageContent, slideIn]);
   useEffect(function () {
     if (!open && previousState && previousState['open'] && shouldReduceMotion) {
-      onUnmount === null || onUnmount === undefined || onUnmount();
+      onUnmount === null || onUnmount === void 0 || onUnmount();
     }
   }, [open, onUnmount, shouldReduceMotion, previousState]);
 
@@ -322,17 +322,17 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   }, [slideIn, selectorPageContent, placement, size, shouldReduceMotion, open]);
   useEffect(function () {
     if (open && animationComplete) {
-      if (selectorPrimaryFocus && getSpecificElement(sidePanelRef === null || sidePanelRef === undefined ? undefined : sidePanelRef.current, selectorPrimaryFocus)) {
+      if (selectorPrimaryFocus && getSpecificElement(sidePanelRef === null || sidePanelRef === void 0 ? void 0 : sidePanelRef.current, selectorPrimaryFocus)) {
         var _window2;
-        var primeFocusEl = 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 = 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);
       }
     }
@@ -361,19 +361,19 @@ var SidePanel = /*#__PURE__*/React__default.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__default.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__default.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__default.cloneElement(decorator, {
         // decorator size is sm unless actions and size > md
         size: closeSize
@@ -422,7 +422,7 @@ var SidePanel = /*#__PURE__*/React__default.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,
@@ -472,7 +472,7 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     onAnimationStart: onAnimationStart,
     onKeyDown: handleKeyDown
   }), renderHeader(), renderMain(), /*#__PURE__*/React__default.createElement(ActionSet, {
-    actions: actions !== null && actions !== undefined ? actions : [],
+    actions: actions !== null && actions !== void 0 ? actions : [],
     className: primaryActionContainerClassNames,
     size: size === 'xs' ? 'sm' : size
   })), includeOverlay && /*#__PURE__*/React__default.createElement("div", {

package/es/components/SimpleHeader/SimpleHeader.js

@@ -35,13 +35,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 = _objectWithoutProperties(_ref, _excluded);
   var warnIfNoTitleOrBreadcrumbs = useCallback(function () {
-    if (!title && !(breadcrumbs !== null && breadcrumbs !== undefined && breadcrumbs.length)) {
+    if (!title && !(breadcrumbs !== null && breadcrumbs !== void 0 && breadcrumbs.length)) {
       pconsole.error("Warning: You have tried using a ".concat(componentName, " component without specifying a title or breadcrumbs props"));
     }
   }, [breadcrumbs, title]);
@@ -50,7 +50,7 @@ var SimpleHeader = function SimpleHeader(_ref) {
   }, [title, breadcrumbs, warnIfNoTitleOrBreadcrumbs]);
   return /*#__PURE__*/React__default.createElement("header", _extends({
     className: cx(blockClass, className)
-  }, rest), (breadcrumbs === null || breadcrumbs === undefined ? undefined : breadcrumbs.length) > 0 && /*#__PURE__*/React__default.createElement(BreadcrumbWithOverflow, {
+  }, rest), (breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length) > 0 && /*#__PURE__*/React__default.createElement(BreadcrumbWithOverflow, {
     noTrailingSlash: noTrailingSlash,
     className: cx("".concat(blockClass, "__breadcrumbs")),
     breadcrumbs: breadcrumbs,
@@ -63,7 +63,7 @@ var SimpleHeader = function SimpleHeader(_ref) {
 };
 var overflowAriaLabel_required_if_breadcrumbs_exist = isRequiredIf(PropTypes.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/es/components/StatusIcon/StatusIcon.js

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

package/es/components/StatusIndicator/StatusIndicator.js

@@ -34,9 +34,9 @@ var StatusIndicator = /*#__PURE__*/React__default.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 = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {

package/es/components/StatusIndicator/StatusIndicatorStep.js

@@ -33,7 +33,7 @@ var StatusIndicatorStep = /*#__PURE__*/React__default.forwardRef(function (_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 = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React__default.createElement("li", _extends({}, rest, {
     className: cx(blockClass, className, "".concat(blockClass, "--").concat(status)),

package/es/components/StringFormatter/StringFormatter.js

@@ -33,13 +33,13 @@ var defaults = {
 var StringFormatter = /*#__PURE__*/React__default.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 = _objectWithoutProperties(_ref, _excluded);
   var contentRef = useRef(null);

package/es/components/TagOverflow/TagOverflow.js

@@ -16,7 +16,7 @@ import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { isRequiredIf } from '../../global/js/utils/props-helper.js';
 import { pkg } from '../../settings.js';
-import { useOverflowItems } from '../../global/js/hooks/useOverflowItems.js';
+import { useOverflowItems } from '../../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"],
@@ -26,7 +26,7 @@ var componentName = 'TagOverflow';
 var allTagsModalSearchThreshold = 10;
 var TagOverflow = /*#__PURE__*/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,
@@ -37,10 +37,10 @@ var TagOverflow = /*#__PURE__*/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,
@@ -73,8 +73,8 @@ var TagOverflow = /*#__PURE__*/forwardRef(function (props, ref) {
     }));
   };
   var handleTagOnClose = 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]);
@@ -152,7 +152,7 @@ var tagTypes = Object.keys(TYPES);
  */
 var string_required_if_more_than_10_tags = isRequiredIf(PropTypes.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/es/components/TagOverflow/TagOverflowModal.js

@@ -30,14 +30,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 = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(''),
@@ -49,7 +49,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 || [];
@@ -90,7 +90,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
         });

package/es/components/TagOverflow/TagOverflowPopover.js

@@ -34,32 +34,32 @@ var TagOverflowPopover = /*#__PURE__*/forwardRef(function (props, ref) {
   var overflowTagContent = useRef(null);
   useClickOutside(ref || localRef, function () {
     if (popoverOpen) {
-      setPopoverOpen === null || setPopoverOpen === undefined || setPopoverOpen(false);
+      setPopoverOpen === null || setPopoverOpen === void 0 || setPopoverOpen(false);
     }
   });
   var handleShowAllTagsClick = function handleShowAllTagsClick(evt) {
     evt.stopPropagation();
     evt.preventDefault();
-    setPopoverOpen === null || setPopoverOpen === undefined || setPopoverOpen(false);
-    onShowAllClick === null || onShowAllClick === undefined || onShowAllClick();
+    setPopoverOpen === null || setPopoverOpen === void 0 || setPopoverOpen(false);
+    onShowAllClick === null || onShowAllClick === void 0 || onShowAllClick();
   };
   var handleEscKeyPress = function handleEscKeyPress(evt) {
     var key = evt.key;
     if (key === 'Escape') {
-      setPopoverOpen === null || setPopoverOpen === undefined || setPopoverOpen(false);
+      setPopoverOpen === null || setPopoverOpen === void 0 || setPopoverOpen(false);
     }
   };
   var getOverflowPopoverItems = function getOverflowPopoverItems() {
-    var thresh = allTagsModalSearchThreshold !== null && allTagsModalSearchThreshold !== undefined ? allTagsModalSearchThreshold : 0;
-    return overflowTags === null || overflowTags === undefined ? undefined : overflowTags.filter(function (_, index) {
-      return (overflowTags === null || overflowTags === undefined ? undefined : overflowTags.length) > thresh ? index < thresh : index <= thresh;
+    var thresh = allTagsModalSearchThreshold !== null && allTagsModalSearchThreshold !== void 0 ? allTagsModalSearchThreshold : 0;
+    return overflowTags === null || overflowTags === void 0 ? void 0 : overflowTags.filter(function (_, index) {
+      return (overflowTags === null || overflowTags === void 0 ? void 0 : overflowTags.length) > thresh ? index < thresh : index <= thresh;
     });
   };
   var visibleItems = getOverflowPopoverItems();
-  var hasItems = (visibleItems === null || visibleItems === undefined ? undefined : visibleItems.length) > 0;
+  var hasItems = (visibleItems === null || visibleItems === void 0 ? void 0 : visibleItems.length) > 0;
   return /*#__PURE__*/React__default.createElement("span", _extends({}, rest, {
-    "aria-hidden": (overflowTags === null || overflowTags === undefined ? undefined : overflowTags.length) === 0,
-    className: cx(blockClass, _defineProperty({}, "".concat(blockClass, "--hidden"), (overflowTags === null || overflowTags === undefined ? undefined : overflowTags.length) === 0)),
+    "aria-hidden": (overflowTags === null || overflowTags === void 0 ? void 0 : overflowTags.length) === 0,
+    className: cx(blockClass, _defineProperty({}, "".concat(blockClass, "--hidden"), (overflowTags === null || overflowTags === void 0 ? void 0 : overflowTags.length) === 0)),
     ref: ref || localRef
   }), /*#__PURE__*/React__default.createElement(Popover, {
     align: overflowAlign,
@@ -71,7 +71,7 @@ var TagOverflowPopover = /*#__PURE__*/forwardRef(function (props, ref) {
     open: popoverOpen || false
   }, /*#__PURE__*/React__default.createElement(OperationalTag, {
     onClick: function onClick() {
-      return setPopoverOpen === null || setPopoverOpen === undefined ? undefined : setPopoverOpen(!popoverOpen);
+      return setPopoverOpen === null || setPopoverOpen === void 0 ? void 0 : setPopoverOpen(!popoverOpen);
     },
     className: cx("".concat(blockClass, "__trigger")),
     text: "+".concat(overflowTags.length)
@@ -93,7 +93,7 @@ var TagOverflowPopover = /*#__PURE__*/forwardRef(function (props, ref) {
     if (isFilterable) {
       tag = /*#__PURE__*/React__default.createElement(DismissibleTag, _extends({}, other, {
         onClose: function onClose() {
-          return _onClose === null || _onClose === undefined ? undefined : _onClose();
+          return _onClose === null || _onClose === void 0 ? void 0 : _onClose();
         },
         type: typeValue,
         text: label
@@ -107,7 +107,7 @@ var TagOverflowPopover = /*#__PURE__*/forwardRef(function (props, ref) {
       className: cx("".concat(blockClass, "__tag-item"), _defineProperty(_defineProperty({}, "".concat(blockClass, "__tag-item--default"), overflowType === 'default'), "".concat(blockClass, "__tag-item--tag"), overflowType === 'tag')),
       key: id
     }, overflowType === 'tag' ? tag : label);
-  })), ((_overflowTags$length = overflowTags === null || overflowTags === undefined ? undefined : overflowTags.length) !== null && _overflowTags$length !== undefined ? _overflowTags$length : 0) > (allTagsModalSearchThreshold !== null && allTagsModalSearchThreshold !== undefined ? allTagsModalSearchThreshold : 0) && /*#__PURE__*/React__default.createElement(Link, {
+  })), ((_overflowTags$length = overflowTags === null || overflowTags === void 0 ? void 0 : overflowTags.length) !== null && _overflowTags$length !== void 0 ? _overflowTags$length : 0) > (allTagsModalSearchThreshold !== null && allTagsModalSearchThreshold !== void 0 ? allTagsModalSearchThreshold : 0) && /*#__PURE__*/React__default.createElement(Link, {
     className: "".concat(blockClass, "__show-all-tags-link"),
     href: "",
     onClick: handleShowAllTagsClick,