@carbon/react 1.83.0-rc.0 → 1.84.0-rc.0

package/es/components/CodeSnippet/CodeSnippet.js

@@ -7,9 +7,9 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default, { useState, useRef, useCallback, useEffect } from 'react';
+import React, { useState, useRef, useCallback, useEffect } from 'react';
 import cx from 'classnames';
-import useResizeObserver from 'use-resize-observer';
+import { useResizeObserver } from '../../internal/useResizeObserver.js';
 import { ChevronDown } from '@carbon/icons-react';
 import Copy from '../Copy/Copy.js';
 import Button from '../Button/Button.js';
@@ -27,32 +27,31 @@ const defaultMaxCollapsedNumberOfRows = 15;
 const defaultMaxExpandedNumberOfRows = 0;
 const defaultMinCollapsedNumberOfRows = 3;
 const defaultMinExpandedNumberOfRows = 16;
-function CodeSnippet(_ref) {
-  let {
-    align = 'bottom',
-    autoAlign = false,
-    className,
-    type = 'single',
-    children,
-    disabled,
-    feedback,
-    feedbackTimeout,
-    onClick,
-    ['aria-label']: ariaLabel = 'Copy to clipboard',
-    ariaLabel: deprecatedAriaLabel,
-    copyText,
-    copyButtonDescription,
-    light,
-    showMoreText = 'Show more',
-    showLessText = 'Show less',
-    hideCopyButton,
-    wrapText = false,
-    maxCollapsedNumberOfRows = defaultMaxCollapsedNumberOfRows,
-    maxExpandedNumberOfRows = defaultMaxExpandedNumberOfRows,
-    minCollapsedNumberOfRows = defaultMinCollapsedNumberOfRows,
-    minExpandedNumberOfRows = defaultMinExpandedNumberOfRows,
-    ...rest
-  } = _ref;
+function CodeSnippet({
+  align = 'bottom',
+  autoAlign = false,
+  className,
+  type = 'single',
+  children,
+  disabled,
+  feedback,
+  feedbackTimeout,
+  onClick,
+  ['aria-label']: ariaLabel = 'Copy to clipboard',
+  ariaLabel: deprecatedAriaLabel,
+  copyText,
+  copyButtonDescription,
+  light,
+  showMoreText = 'Show more',
+  showLessText = 'Show less',
+  hideCopyButton,
+  wrapText = false,
+  maxCollapsedNumberOfRows = defaultMaxCollapsedNumberOfRows,
+  maxExpandedNumberOfRows = defaultMaxExpandedNumberOfRows,
+  minCollapsedNumberOfRows = defaultMinCollapsedNumberOfRows,
+  minExpandedNumberOfRows = defaultMinExpandedNumberOfRows,
+  ...rest
+}) {
   const [expandedCode, setExpandedCode] = useState(false);
   const [shouldShowMoreLessBtn, setShouldShowMoreLessBtn] = useState(false);
   const {
@@ -146,14 +145,14 @@ function CodeSnippet(_ref) {
   const expandCodeBtnText = expandedCode ? showLessText : showMoreText;
   if (type === 'inline') {
     if (hideCopyButton) {
-      return /*#__PURE__*/React__default.createElement("span", {
+      return /*#__PURE__*/React.createElement("span", {
         className: codeSnippetClasses
-      }, /*#__PURE__*/React__default.createElement("code", {
+      }, /*#__PURE__*/React.createElement("code", {
         id: uid,
         ref: innerCodeRef
       }, children));
     }
-    return /*#__PURE__*/React__default.createElement(Copy, _extends({}, rest, {
+    return /*#__PURE__*/React.createElement(Copy, _extends({}, rest, {
       align: align,
       autoAlign: autoAlign,
       onClick: handleCopyClick,
@@ -162,7 +161,7 @@ function CodeSnippet(_ref) {
       className: codeSnippetClasses,
       feedback: feedback,
       feedbackTimeout: feedbackTimeout
-    }), /*#__PURE__*/React__default.createElement("code", {
+    }), /*#__PURE__*/React.createElement("code", {
       id: uid,
       ref: innerCodeRef
     }, children));
@@ -189,9 +188,9 @@ function CodeSnippet(_ref) {
       containerStyle.style = styles;
     }
   }
-  return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
     className: codeSnippetClasses
-  }), /*#__PURE__*/React__default.createElement("div", _extends({
+  }), /*#__PURE__*/React.createElement("div", _extends({
     ref: codeContainerRef,
     role: type === 'single' || type === 'multi' ? 'textbox' : undefined,
     tabIndex: (type === 'single' || type === 'multi') && !disabled ? 0 : undefined,
@@ -200,16 +199,16 @@ function CodeSnippet(_ref) {
     "aria-readonly": type === 'single' || type === 'multi' ? true : undefined,
     "aria-multiline": type === 'multi' ? true : undefined,
     onScroll: type === 'single' && handleScroll || undefined
-  }, containerStyle), /*#__PURE__*/React__default.createElement("pre", {
+  }, containerStyle), /*#__PURE__*/React.createElement("pre", {
     ref: codeContentRef,
     onScroll: type === 'multi' && handleScroll || undefined
-  }, /*#__PURE__*/React__default.createElement("code", {
+  }, /*#__PURE__*/React.createElement("code", {
     ref: innerCodeRef
-  }, children))), hasLeftOverflow && /*#__PURE__*/React__default.createElement("div", {
+  }, children))), hasLeftOverflow && /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--snippet__overflow-indicator--left`
-  }), hasRightOverflow && type !== 'multi' && /*#__PURE__*/React__default.createElement("div", {
+  }), hasRightOverflow && type !== 'multi' && /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--snippet__overflow-indicator--right`
-  }), !hideCopyButton && /*#__PURE__*/React__default.createElement(CopyButton, {
+  }), !hideCopyButton && /*#__PURE__*/React.createElement(CopyButton, {
     align: align,
     autoAlign: autoAlign,
     size: type === 'multi' ? 'sm' : 'md',
@@ -218,15 +217,15 @@ function CodeSnippet(_ref) {
     feedback: feedback,
     feedbackTimeout: feedbackTimeout,
     iconDescription: copyButtonDescription
-  }), shouldShowMoreLessBtn && /*#__PURE__*/React__default.createElement(Button, {
+  }), shouldShowMoreLessBtn && /*#__PURE__*/React.createElement(Button, {
     kind: "ghost",
     size: "sm",
     className: `${prefix}--snippet-btn--expand`,
     disabled: disabled,
     onClick: () => setExpandedCode(!expandedCode)
-  }, /*#__PURE__*/React__default.createElement("span", {
+  }, /*#__PURE__*/React.createElement("span", {
     className: `${prefix}--snippet-btn--text`
-  }, expandCodeBtnText), /*#__PURE__*/React__default.createElement(ChevronDown, {
+  }, expandCodeBtnText), /*#__PURE__*/React.createElement(ChevronDown, {
     className: `${prefix}--icon-chevron--down ${prefix}--snippet__icon`,
     name: "chevron--down",
     role: "img"

package/es/components/ComboBox/ComboBox.js

@@ -9,7 +9,7 @@ import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js
 import cx from 'classnames';
 import { useCombobox } from 'downshift';
 import PropTypes from 'prop-types';
-import React__default, { forwardRef, useRef, useEffect, useState, useContext, useCallback, useMemo } from 'react';
+import React, { forwardRef, useRef, useEffect, useState, useContext, useCallback, useMemo } from 'react';
 import '../Text/index.js';
 import { WarningFilled, WarningAltFilled, Checkmark } from '@carbon/icons-react';
 import isEqual from 'react-fast-compare';
@@ -54,11 +54,10 @@ const defaultItemToString = item => {
   return '';
 };
 const defaultShouldFilterItem = () => true;
-const autocompleteCustomFilter = _ref => {
-  let {
-    item,
-    inputValue
-  } = _ref;
+const autocompleteCustomFilter = ({
+  item,
+  inputValue
+}) => {
   if (inputValue === null || inputValue === '') {
     return true; // Show all items if there's no input
   }
@@ -66,13 +65,12 @@ const autocompleteCustomFilter = _ref => {
   const lowercaseInput = inputValue.toLowerCase();
   return lowercaseItem.startsWith(lowercaseInput);
 };
-const getInputValue = _ref2 => {
-  let {
-    initialSelectedItem,
-    itemToString,
-    selectedItem,
-    prevSelectedItem
-  } = _ref2;
+const getInputValue = ({
+  initialSelectedItem,
+  itemToString,
+  selectedItem,
+  prevSelectedItem
+}) => {
   // If there's a current selection (even if it's an object or string), use it.
   if (selectedItem !== null && typeof selectedItem !== 'undefined') {
     return itemToString(selectedItem);
@@ -88,11 +86,10 @@ const getInputValue = _ref2 => {
   // string.
   return '';
 };
-const findHighlightedIndex = (_ref3, inputValue) => {
-  let {
-    items,
-    itemToString = defaultItemToString
-  } = _ref3;
+const findHighlightedIndex = ({
+  items,
+  itemToString = defaultItemToString
+}, inputValue) => {
   if (!inputValue) {
     return -1;
   }
@@ -440,9 +437,9 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
   const ItemToElement = itemToElement;
 
   // AILabel always size `mini`
-  let normalizedDecorator = /*#__PURE__*/React__default.isValidElement(slug ?? decorator) ? slug ?? decorator : null;
+  let normalizedDecorator = /*#__PURE__*/React.isValidElement(slug ?? decorator) ? slug ?? decorator : null;
   if (normalizedDecorator && normalizedDecorator['type']?.displayName === 'AILabel') {
-    normalizedDecorator = /*#__PURE__*/React__default.cloneElement(normalizedDecorator, {
+    normalizedDecorator = /*#__PURE__*/React.cloneElement(normalizedDecorator, {
       size: 'mini'
     });
   }
@@ -471,18 +468,16 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
     itemToString: item => {
       return itemToString(item);
     },
-    onInputValueChange(_ref4) {
-      let {
-        inputValue
-      } = _ref4;
+    onInputValueChange({
+      inputValue
+    }) {
       const normalizedInput = inputValue || '';
       setInputValue(normalizedInput);
       setHighlightedIndex(indexToHighlight(normalizedInput));
     },
-    onHighlightedIndexChange: _ref5 => {
-      let {
-        highlightedIndex
-      } = _ref5;
+    onHighlightedIndexChange: ({
+      highlightedIndex
+    }) => {
       if (highlightedIndex > -1 && typeof window !== undefined) {
         const itemArray = document.querySelectorAll(`li.${prefix}--list-box__menu-item[role="option"]`);
         const highlightedItem = itemArray[highlightedIndex];
@@ -501,11 +496,10 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
       return item?.disabled;
     },
     ...downshiftProps,
-    onStateChange: _ref6 => {
-      let {
-        type,
-        selectedItem: newSelectedItem
-      } = _ref6;
+    onStateChange: ({
+      type,
+      selectedItem: newSelectedItem
+    }) => {
       downshiftProps?.onStateChange?.({
         type,
         selectedItem: newSelectedItem
@@ -594,12 +588,12 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
       }
     }
   }, [inputValue, typeaheadText]);
-  return /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: wrapperClasses
-  }, titleText && /*#__PURE__*/React__default.createElement(Text, _extends({
+  }, titleText && /*#__PURE__*/React.createElement(Text, _extends({
     as: "label",
     className: titleClasses
-  }, getLabelProps()), titleText), /*#__PURE__*/React__default.createElement(ListBox, {
+  }, getLabelProps()), titleText), /*#__PURE__*/React.createElement(ListBox, {
     onFocus: handleFocus,
     onBlur: handleFocus,
     className: className,
@@ -614,9 +608,9 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
     ref: enableFloatingStyles ? refs.setReference : null,
     warnText: warnText,
     warnTextId: warnTextId
-  }, /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--list-box__field`
-  }, /*#__PURE__*/React__default.createElement("input", _extends({
+  }, /*#__PURE__*/React.createElement("input", _extends({
     disabled: disabled,
     className: inputClasses,
     type: "text",
@@ -700,11 +694,11 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
   }), rest, readOnlyEventHandlers, {
     readOnly: readOnly,
     "aria-describedby": ariaDescribedBy
-  })), invalid && /*#__PURE__*/React__default.createElement(WarningFilled, {
+  })), invalid && /*#__PURE__*/React.createElement(WarningFilled, {
     className: `${prefix}--list-box__invalid-icon`
-  }), showWarning && /*#__PURE__*/React__default.createElement(WarningAltFilled, {
+  }), showWarning && /*#__PURE__*/React.createElement(WarningAltFilled, {
     className: `${prefix}--list-box__invalid-icon ${prefix}--list-box__invalid-icon--warning`
-  }), inputValue && /*#__PURE__*/React__default.createElement(ListBoxSelection, {
+  }), inputValue && /*#__PURE__*/React.createElement(ListBoxSelection, {
     clearSelection: () => {
       setIsClearing(true); // This updates the state which syncs to the ref
       setInputValue('');
@@ -718,12 +712,12 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
     disabled: disabled || readOnly,
     onClearSelection: handleSelectionClear,
     selectionCount: 0
-  }), /*#__PURE__*/React__default.createElement(ListBoxTrigger, _extends({}, buttonProps, {
+  }), /*#__PURE__*/React.createElement(ListBoxTrigger, _extends({}, buttonProps, {
     isOpen: isOpen,
     translateWithId: translateWithId
-  }))), slug ? normalizedDecorator : decorator ? /*#__PURE__*/React__default.createElement("div", {
+  }))), slug ? normalizedDecorator : decorator ? /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--list-box__inner-wrapper--decorator`
-  }, normalizedDecorator) : '', /*#__PURE__*/React__default.createElement(ListBox.Menu, menuProps, isOpen ? filterItems(items, itemToString, inputValue).map((item, index) => {
+  }, normalizedDecorator) : '', /*#__PURE__*/React.createElement(ListBox.Menu, menuProps, isOpen ? filterItems(items, itemToString, inputValue).map((item, index) => {
     const isObject = item !== null && typeof item === 'object';
     const title = isObject && 'text' in item && itemToElement ? item.text?.toString() : itemToString(item);
     const itemProps = getItemProps({
@@ -741,18 +735,18 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
       // eslint-disable-line @typescript-eslint/no-unused-vars
       ...modifiedItemProps
     } = itemProps;
-    return /*#__PURE__*/React__default.createElement(ListBox.MenuItem, _extends({
+    return /*#__PURE__*/React.createElement(ListBox.MenuItem, _extends({
       key: itemProps.id,
       isActive: selectedItem === item,
       isHighlighted: highlightedIndex === index,
       title: title,
       disabled: disabled
-    }, modifiedItemProps), ItemToElement ? /*#__PURE__*/React__default.createElement(ItemToElement, _extends({
+    }, modifiedItemProps), ItemToElement ? /*#__PURE__*/React.createElement(ItemToElement, _extends({
       key: itemProps.id
-    }, item)) : itemToString(item), selectedItem === item && /*#__PURE__*/React__default.createElement(Checkmark, {
+    }, item)) : itemToString(item), selectedItem === item && /*#__PURE__*/React.createElement(Checkmark, {
       className: `${prefix}--list-box__menu-item__selected-icon`
     }));
-  }) : null)), helperText && !invalid && !warn && !isFluid && /*#__PURE__*/React__default.createElement(Text, {
+  }) : null)), helperText && !invalid && !warn && !isFluid && /*#__PURE__*/React.createElement(Text, {
     as: "div",
     id: helperTextId,
     className: helperClasses

package/es/components/ComboBox/tools/filter.js

@@ -5,17 +5,14 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-const defaultFilterItems = (items, _ref) => {
-  let {
-    itemToString,
-    inputValue
-  } = _ref;
-  return items.filter(item => {
-    if (!inputValue) {
-      return true;
-    }
-    return itemToString(item).toLowerCase().includes(inputValue.toLowerCase());
-  });
-};
+const defaultFilterItems = (items, {
+  itemToString,
+  inputValue
+}) => items.filter(item => {
+  if (!inputValue) {
+    return true;
+  }
+  return itemToString(item).toLowerCase().includes(inputValue.toLowerCase());
+});
 
 export { defaultFilterItems };

package/es/components/ComboButton/index.js

@@ -6,7 +6,7 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { useRef, useLayoutEffect } from 'react';
+import React, { useRef, useLayoutEffect } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { ChevronDown } from '@carbon/icons-react';
@@ -36,19 +36,18 @@ const defaultTranslations = {
 function defaultTranslateWithId(messageId) {
   return defaultTranslations[messageId];
 }
-const ComboButton = /*#__PURE__*/React__default.forwardRef(function ComboButton(_ref, forwardRef) {
-  let {
-    children,
-    className,
-    disabled,
-    label,
-    onClick,
-    size: size$1 = 'lg',
-    menuAlignment = 'bottom',
-    tooltipAlignment,
-    translateWithId: t = defaultTranslateWithId,
-    ...rest
-  } = _ref;
+const ComboButton = /*#__PURE__*/React.forwardRef(function ComboButton({
+  children,
+  className,
+  disabled,
+  label,
+  onClick,
+  size: size$1 = 'lg',
+  menuAlignment = 'bottom',
+  tooltipAlignment,
+  translateWithId: t = defaultTranslateWithId,
+  ...rest
+}, forwardRef) {
   // feature flag utilized to separate out only the dynamic styles from @floating-ui
   // flag is turned on when collision detection (ie. flip, hide) logic is not desired
   const enableOnlyFloatingStyles = useFeatureFlag('enable-v12-dynamic-floating-styles');
@@ -63,11 +62,10 @@ const ComboButton = /*#__PURE__*/React__default.forwardRef(function ComboButton(
   }
   if (menuAlignment === 'bottom' || menuAlignment === 'top') {
     middlewares.push(size({
-      apply(_ref2) {
-        let {
-          rects,
-          elements
-        } = _ref2;
+      apply({
+        rects,
+        elements
+      }) {
         Object.assign(elements.floating.style, {
           width: `${rects.reference.width}px`
         });
@@ -124,18 +122,18 @@ const ComboButton = /*#__PURE__*/React__default.forwardRef(function ComboButton(
   const menuClasses = cx(`${prefix}--combo-button__${menuAlignment}`);
   const primaryActionClasses = cx(`${prefix}--combo-button__primary-action`);
   const triggerClasses = cx(`${prefix}--combo-button__trigger`);
-  return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
     className: containerClasses,
     ref: ref,
     "aria-owns": open ? id : undefined
-  }), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: primaryActionClasses
-  }, /*#__PURE__*/React__default.createElement(Button, {
+  }, /*#__PURE__*/React.createElement(Button, {
     title: label,
     size: size$1,
     disabled: disabled,
     onClick: handlePrimaryActionClick
-  }, label)), /*#__PURE__*/React__default.createElement(IconButton, {
+  }, label)), /*#__PURE__*/React.createElement(IconButton, {
     ref: refs.setReference,
     className: triggerClasses,
     label: t('carbon.combo-button.additional-actions'),
@@ -147,7 +145,7 @@ const ComboButton = /*#__PURE__*/React__default.forwardRef(function ComboButton(
     onClick: handleTriggerClick,
     onMouseDown: handleTriggerMousedown,
     "aria-controls": open ? id : undefined
-  }, _ChevronDown || (_ChevronDown = /*#__PURE__*/React__default.createElement(ChevronDown, null))), /*#__PURE__*/React__default.createElement(Menu, {
+  }, _ChevronDown || (_ChevronDown = /*#__PURE__*/React.createElement(ChevronDown, null))), /*#__PURE__*/React.createElement(Menu, {
     containerRef: containerRef,
     menuAlignment: menuAlignment,
     className: menuClasses,

package/es/components/ComposedModal/ComposedModal.js

@@ -6,7 +6,7 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { useRef, useState, useEffect } from 'react';
+import React, { useRef, useState, useEffect } from 'react';
 import { isElement } from 'react-is';
 import PropTypes from 'prop-types';
 import { Layer } from '../Layer/index.js';
@@ -28,14 +28,13 @@ import { unstable__Dialog } from '../Dialog/index.js';
 import { warning } from '../../internal/warning.js';
 import { debounce } from '../../node_modules/es-toolkit/dist/compat/function/debounce.mjs.js';
 
-const ModalBody = /*#__PURE__*/React__default.forwardRef(function ModalBody(_ref, ref) {
-  let {
-    className: customClassName,
-    children,
-    hasForm,
-    hasScrollingContent,
-    ...rest
-  } = _ref;
+const ModalBody = /*#__PURE__*/React.forwardRef(function ModalBody({
+  className: customClassName,
+  children,
+  hasForm,
+  hasScrollingContent,
+  ...rest
+}, ref) {
   const prefix = usePrefix();
   const contentRef = useRef(null);
   const [isScrollable, setIsScrollable] = useState(false);
@@ -64,7 +63,7 @@ const ModalBody = /*#__PURE__*/React__default.forwardRef(function ModalBody(_ref
     tabIndex: 0,
     role: 'region'
   } : {};
-  return /*#__PURE__*/React__default.createElement(Layer, _extends({
+  return /*#__PURE__*/React.createElement(Layer, _extends({
     className: contentClass
   }, hasScrollingContentProps, rest, {
     ref: mergeRefs(contentRef, ref)
@@ -93,27 +92,26 @@ ModalBody.propTypes = {
    */
   hasScrollingContent: PropTypes.bool
 };
-const ComposedModal = /*#__PURE__*/React__default.forwardRef(function ComposedModal(_ref2, ref) {
-  let {
-    ['aria-labelledby']: ariaLabelledBy,
-    ['aria-label']: ariaLabel,
-    children,
-    className: customClassName,
-    containerClassName,
-    danger,
-    decorator,
-    isFullWidth,
-    onClose,
-    onKeyDown,
-    open,
-    preventCloseOnClickOutside,
-    selectorPrimaryFocus = '[data-modal-primary-focus]',
-    selectorsFloatingMenus,
-    size,
-    launcherButtonRef,
-    slug,
-    ...rest
-  } = _ref2;
+const ComposedModal = /*#__PURE__*/React.forwardRef(function ComposedModal({
+  ['aria-labelledby']: ariaLabelledBy,
+  ['aria-label']: ariaLabel,
+  children,
+  className: customClassName,
+  containerClassName,
+  danger,
+  decorator,
+  isFullWidth,
+  onClose,
+  onKeyDown,
+  open,
+  preventCloseOnClickOutside,
+  selectorPrimaryFocus = '[data-modal-primary-focus]',
+  selectorsFloatingMenus,
+  size,
+  launcherButtonRef,
+  slug,
+  ...rest
+}, ref) {
   const prefix = usePrefix();
   const [isOpen, setIsOpen] = useState(!!open);
   const [wasOpen, setWasOpen] = useState(!!open);
@@ -174,11 +172,10 @@ const ComposedModal = /*#__PURE__*/React__default.forwardRef(function ComposedMo
       closeModal(evt);
     }
   }
-  function handleBlur(_ref3) {
-    let {
-      target: oldActiveNode,
-      relatedTarget: currentActiveNode
-    } = _ref3;
+  function handleBlur({
+    target: oldActiveNode,
+    relatedTarget: currentActiveNode
+  }) {
     if (open && currentActiveNode && oldActiveNode && innerModal.current) {
       const {
         current: bodyNode
@@ -214,20 +211,20 @@ const ComposedModal = /*#__PURE__*/React__default.forwardRef(function ComposedMo
 
   // Generate aria-label based on Modal Header label if one is not provided (L253)
   let generatedAriaLabel;
-  const childrenWithProps = React__default.Children.toArray(children).map(child => {
+  const childrenWithProps = React.Children.toArray(children).map(child => {
     switch (true) {
-      case isElement(child) && child.type === React__default.createElement(ModalHeader).type:
+      case isElement(child) && child.type === React.createElement(ModalHeader).type:
         {
           const el = child;
           generatedAriaLabel = el.props.label;
-          return /*#__PURE__*/React__default.cloneElement(el, {
+          return /*#__PURE__*/React.cloneElement(el, {
             closeModal
           });
         }
-      case isElement(child) && child.type === React__default.createElement(ModalFooter).type:
+      case isElement(child) && child.type === React.createElement(ModalFooter).type:
         {
           const el = child;
-          return /*#__PURE__*/React__default.cloneElement(el, {
+          return /*#__PURE__*/React.cloneElement(el, {
             closeModal,
             inputref: button,
             danger
@@ -270,44 +267,44 @@ const ComposedModal = /*#__PURE__*/React__default.forwardRef(function ComposedMo
   }, [open, selectorPrimaryFocus, isOpen]);
 
   // AILabel is always size `sm`
-  let normalizedDecorator = /*#__PURE__*/React__default.isValidElement(slug ?? decorator) ? slug ?? decorator : null;
+  let normalizedDecorator = /*#__PURE__*/React.isValidElement(slug ?? decorator) ? slug ?? decorator : null;
   if (normalizedDecorator && normalizedDecorator['type']?.displayName === 'AILabel') {
-    normalizedDecorator = /*#__PURE__*/React__default.cloneElement(normalizedDecorator, {
+    normalizedDecorator = /*#__PURE__*/React.cloneElement(normalizedDecorator, {
       size: 'sm'
     });
   }
-  const modalBody = enableDialogElement ? /*#__PURE__*/React__default.createElement(unstable__Dialog, {
+  const modalBody = enableDialogElement ? /*#__PURE__*/React.createElement(unstable__Dialog, {
     open: open,
     modal: true,
     className: containerClass,
     "aria-label": ariaLabel ? ariaLabel : generatedAriaLabel,
     "aria-labelledby": ariaLabelledBy
-  }, /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     ref: innerModal,
     className: `${prefix}--modal-container-body`
-  }, slug ? normalizedDecorator : decorator ? /*#__PURE__*/React__default.createElement("div", {
+  }, slug ? normalizedDecorator : decorator ? /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--modal--inner__decorator`
-  }, normalizedDecorator) : '', childrenWithProps)) : /*#__PURE__*/React__default.createElement("div", {
+  }, normalizedDecorator) : '', childrenWithProps)) : /*#__PURE__*/React.createElement("div", {
     className: containerClass,
     role: "dialog",
     "aria-modal": "true",
     "aria-label": ariaLabel ? ariaLabel : generatedAriaLabel,
     "aria-labelledby": ariaLabelledBy
-  }, !focusTrapWithoutSentinels && /*#__PURE__*/React__default.createElement("button", {
+  }, !focusTrapWithoutSentinels && /*#__PURE__*/React.createElement("button", {
     type: "button",
     ref: startSentinel,
     className: `${prefix}--visually-hidden`
-  }, "Focus sentinel"), /*#__PURE__*/React__default.createElement("div", {
+  }, "Focus sentinel"), /*#__PURE__*/React.createElement("div", {
     ref: innerModal,
     className: `${prefix}--modal-container-body`
-  }, slug ? normalizedDecorator : decorator ? /*#__PURE__*/React__default.createElement("div", {
+  }, slug ? normalizedDecorator : decorator ? /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--modal--inner__decorator`
-  }, normalizedDecorator) : '', childrenWithProps), !focusTrapWithoutSentinels && /*#__PURE__*/React__default.createElement("button", {
+  }, normalizedDecorator) : '', childrenWithProps), !focusTrapWithoutSentinels && /*#__PURE__*/React.createElement("button", {
     type: "button",
     ref: endSentinel,
     className: `${prefix}--visually-hidden`
   }, "Focus sentinel"));
-  return /*#__PURE__*/React__default.createElement(Layer, _extends({}, rest, {
+  return /*#__PURE__*/React.createElement(Layer, _extends({}, rest, {
     level: 0,
     role: "presentation",
     ref: ref,