@carbon/react 1.82.1 → 1.83.0

package/es/components/Switch/IconSwitch.js

@@ -7,13 +7,13 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default, { useState } from 'react';
+import React, { useState } from 'react';
 import cx from 'classnames';
 import { IconButton } from '../IconButton/index.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 
 const noopFn = () => {};
-const IconSwitch = /*#__PURE__*/React__default.forwardRef(function Switch(props, tabRef) {
+const IconSwitch = /*#__PURE__*/React.forwardRef(function Switch(props, tabRef) {
   const {
     align,
     children,
@@ -72,7 +72,7 @@ const IconSwitch = /*#__PURE__*/React__default.forwardRef(function Switch(props,
     leaveDelayMs,
     size
   };
-  return /*#__PURE__*/React__default.createElement(IconButton, _extends({
+  return /*#__PURE__*/React.createElement(IconButton, _extends({
     label: text,
     type: "button",
     ref: tabRef,

package/es/components/Switch/Switch.js

@@ -7,12 +7,12 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { noopFn } from '../../internal/noopFn.js';
 
-const Switch = /*#__PURE__*/React__default.forwardRef(function Switch(props, tabRef) {
+const Switch = /*#__PURE__*/React.forwardRef(function Switch(props, tabRef) {
   const {
     children,
     className,
@@ -52,13 +52,13 @@ const Switch = /*#__PURE__*/React__default.forwardRef(function Switch(props, tab
     className: classes,
     disabled
   };
-  return /*#__PURE__*/React__default.createElement("button", _extends({
+  return /*#__PURE__*/React.createElement("button", _extends({
     type: "button",
     ref: tabRef,
     role: "tab",
     tabIndex: selected ? 0 : -1,
     "aria-selected": selected
-  }, other, commonProps), /*#__PURE__*/React__default.createElement("span", {
+  }, other, commonProps), /*#__PURE__*/React.createElement("span", {
     className: `${prefix}--content-switcher__label`,
     title: text
   }, text !== undefined ? text : children));

package/es/components/TabContent/TabContent.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default, { useRef, useState } from 'react';
+import React, { useRef, useState } from 'react';
 import cx from 'classnames';
 import { selectorTabbable } from '../../internal/keyboard/navigation.js';
 import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
@@ -38,7 +38,7 @@ function TabContent(props) {
   const tabContentClasses = cx(`${prefix}--tab-content`, className);
   const ref = useRef(null);
   const hasTabbableContent = useTabbableContent(ref);
-  return /*#__PURE__*/React__default.createElement("div", _extends({
+  return /*#__PURE__*/React.createElement("div", _extends({
     role: "tabpanel"
   }, other, {
     className: tabContentClasses,

package/es/components/Tabs/Tabs.Skeleton.js

@@ -7,18 +7,18 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
+import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 
 var _span, _Tab, _Tab2, _Tab3, _Tab4, _Tab5;
 function Tab() {
   const prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement("li", {
+  return /*#__PURE__*/React.createElement("li", {
     className: `${prefix}--tabs__nav-item`
-  }, /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--tabs__nav-link`
-  }, _span || (_span = /*#__PURE__*/React__default.createElement("span", null))));
+  }, _span || (_span = /*#__PURE__*/React.createElement("span", null))));
 }
 function TabsSkeleton(_ref) {
   let {
@@ -30,11 +30,11 @@ function TabsSkeleton(_ref) {
   const tabClasses = cx(className, `${prefix}--tabs`, `${prefix}--skeleton`, {
     [`${prefix}--tabs--contained`]: contained
   });
-  return /*#__PURE__*/React__default.createElement("div", _extends({
+  return /*#__PURE__*/React.createElement("div", _extends({
     className: tabClasses
-  }, rest), /*#__PURE__*/React__default.createElement("ul", {
+  }, rest), /*#__PURE__*/React.createElement("ul", {
     className: `${prefix}--tabs__nav`
-  }, _Tab || (_Tab = /*#__PURE__*/React__default.createElement(Tab, null)), _Tab2 || (_Tab2 = /*#__PURE__*/React__default.createElement(Tab, null)), _Tab3 || (_Tab3 = /*#__PURE__*/React__default.createElement(Tab, null)), _Tab4 || (_Tab4 = /*#__PURE__*/React__default.createElement(Tab, null)), _Tab5 || (_Tab5 = /*#__PURE__*/React__default.createElement(Tab, null))));
+  }, _Tab || (_Tab = /*#__PURE__*/React.createElement(Tab, null)), _Tab2 || (_Tab2 = /*#__PURE__*/React.createElement(Tab, null)), _Tab3 || (_Tab3 = /*#__PURE__*/React.createElement(Tab, null)), _Tab4 || (_Tab4 = /*#__PURE__*/React.createElement(Tab, null)), _Tab5 || (_Tab5 = /*#__PURE__*/React.createElement(Tab, null))));
 }
 TabsSkeleton.propTypes = {
   /**

package/es/components/Tabs/Tabs.js

@@ -10,7 +10,7 @@ import { ChevronLeft, ChevronRight, Close } from '@carbon/icons-react';
 import { breakpoints } from '@carbon/layout';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import React__default, { useState, useRef, useCallback, useEffect, forwardRef, createContext, useMemo, isValidElement } from 'react';
+import React, { useState, useRef, useCallback, useEffect, forwardRef, createContext, useMemo, isValidElement } from 'react';
 import '../Grid/FlexGrid.js';
 import { Grid as GridAsGridComponent } from '../Grid/Grid.js';
 import '../Grid/Row.js';
@@ -42,7 +42,7 @@ const verticalTabHeight = 64;
 
 // Used to manage the overall state of the Tabs
 
-const TabsContext = /*#__PURE__*/React__default.createContext({
+const TabsContext = /*#__PURE__*/React.createContext({
   baseId: '',
   activeIndex: 0,
   defaultSelectedIndex: 0,
@@ -54,7 +54,7 @@ const TabsContext = /*#__PURE__*/React__default.createContext({
 });
 
 // Used to keep track of position in a tablist
-const TabContext = /*#__PURE__*/React__default.createContext({
+const TabContext = /*#__PURE__*/React.createContext({
   index: 0,
   hasSecondaryLabel: false
 });
@@ -62,7 +62,7 @@ const lgMediaQuery = `(min-width: ${breakpoints.lg.width})`;
 const smMediaQuery = `(max-width: ${breakpoints.md.width})`;
 
 // Used to keep track of position in a list of tab panels
-const TabPanelContext = /*#__PURE__*/React__default.createContext(0);
+const TabPanelContext = /*#__PURE__*/React.createContext(0);
 
 /**
  * Tabs
@@ -101,7 +101,7 @@ function Tabs(_ref) {
     selectedIndex,
     setSelectedIndex
   };
-  return /*#__PURE__*/React__default.createElement(TabsContext.Provider, {
+  return /*#__PURE__*/React.createElement(TabsContext.Provider, {
     value: value
   }, children);
 }
@@ -172,14 +172,14 @@ function TabsVertical(_ref2) {
     return (
       /*#__PURE__*/
       // eslint-disable-next-line react/forbid-component-props
-      React__default.createElement(GridAsGridComponent, {
+      React.createElement(GridAsGridComponent, {
         style: {
           height: height
         }
-      }, /*#__PURE__*/React__default.createElement(Tabs, props, children))
+      }, /*#__PURE__*/React.createElement(Tabs, props, children))
     );
   }
-  return /*#__PURE__*/React__default.createElement(Tabs, props, children);
+  return /*#__PURE__*/React.createElement(Tabs, props, children);
 }
 TabsVertical.propTypes = {
   /**
@@ -272,7 +272,7 @@ function TabList(_ref4) {
     setSelectedIndex,
     setActiveIndex,
     dismissable
-  } = React__default.useContext(TabsContext);
+  } = React.useContext(TabsContext);
   const prefix = usePrefix();
   const ref = useRef(null);
   const previousButton = useRef(null);
@@ -281,13 +281,13 @@ function TabList(_ref4) {
   const [scrollLeft, setScrollLeft] = useState(0);
   let hasSecondaryLabelTabs = false;
   if (contained) {
-    hasSecondaryLabelTabs = React__default.Children.toArray(children).some(child => {
+    hasSecondaryLabelTabs = React.Children.toArray(children).some(child => {
       const _child = child;
-      return /*#__PURE__*/React__default.isValidElement(child) && !!_child.props.secondaryLabel;
+      return /*#__PURE__*/React.isValidElement(child) && !!_child.props.secondaryLabel;
     });
   }
   const isLg = useMatchMedia(lgMediaQuery);
-  const distributeWidth = fullWidth && contained && isLg && React__default.Children.toArray(children).length < 9;
+  const distributeWidth = fullWidth && contained && isLg && React.Children.toArray(children).length < 9;
   const className = cx(`${prefix}--tabs`, {
     [`${prefix}--tabs--contained`]: contained,
     [`${prefix}--tabs--light`]: light,
@@ -319,9 +319,12 @@ function TabList(_ref4) {
   });
   const tabs = useRef([]);
   const debouncedOnScroll = useCallback(() => {
-    return debounce(event => {
-      setScrollLeft(event.target.scrollLeft);
+    const updateScroll = debounce(() => {
+      if (ref.current) {
+        setScrollLeft(ref.current.scrollLeft);
+      }
     }, scrollDebounceWait);
+    updateScroll();
   }, [scrollDebounceWait]);
   function onKeyDown(event) {
     if (matches(event, [ArrowRight, ArrowLeft, Home, End])) {
@@ -477,16 +480,16 @@ function TabList(_ref4) {
       return createLongPressBehavior(ref, 'forward', setScrollLeft);
     }
   });
-  return /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: className
-  }, /*#__PURE__*/React__default.createElement("button", _extends({
+  }, /*#__PURE__*/React.createElement("button", _extends({
     "aria-hidden": "true",
     tabIndex: -1,
     "aria-label": "Scroll left",
     ref: previousButton,
     className: previousButtonClasses,
     type: "button"
-  }, leftOverflowButtonProps), _ChevronLeft || (_ChevronLeft = /*#__PURE__*/React__default.createElement(ChevronLeft, null))), /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  }, leftOverflowButtonProps), _ChevronLeft || (_ChevronLeft = /*#__PURE__*/React.createElement(ChevronLeft, null))), /*#__PURE__*/React.createElement("div", _extends({}, rest, {
     "aria-label": label,
     ref: ref,
     role: "tablist",
@@ -494,26 +497,26 @@ function TabList(_ref4) {
     onScroll: debouncedOnScroll,
     onKeyDown: onKeyDown,
     onBlur: handleBlur
-  }), React__default.Children.map(children, (child, index) => {
-    return !isElement(child) ? null : /*#__PURE__*/React__default.createElement(TabContext.Provider, {
+  }), React.Children.map(children, (child, index) => {
+    return !isElement(child) ? null : /*#__PURE__*/React.createElement(TabContext.Provider, {
       value: {
         index,
         hasSecondaryLabel: hasSecondaryLabelTabs,
         contained
       }
-    }, /*#__PURE__*/React__default.cloneElement(child, {
+    }, /*#__PURE__*/React.cloneElement(child, {
       ref: node => {
         tabs.current[index] = node;
       }
     }));
-  })), /*#__PURE__*/React__default.createElement("button", _extends({
+  })), /*#__PURE__*/React.createElement("button", _extends({
     "aria-hidden": "true",
     tabIndex: -1,
     "aria-label": "Scroll right",
     ref: nextButton,
     className: nextButtonClasses,
     type: "button"
-  }, rightOverflowButtonProps), _ChevronRight || (_ChevronRight = /*#__PURE__*/React__default.createElement(ChevronRight, null))));
+  }, rightOverflowButtonProps), _ChevronRight || (_ChevronRight = /*#__PURE__*/React.createElement(ChevronRight, null))));
 }
 TabList.propTypes = {
   /**
@@ -592,7 +595,7 @@ function TabListVertical(_ref8) {
     selectedIndex,
     setSelectedIndex,
     setActiveIndex
-  } = React__default.useContext(TabsContext);
+  } = React.useContext(TabsContext);
   const prefix = usePrefix();
   const ref = useRef(null);
   const [isOverflowingBottom, setIsOverflowingBottom] = useState(false);
@@ -679,34 +682,34 @@ function TabListVertical(_ref8) {
     };
   });
   if (isSm) {
-    return /*#__PURE__*/React__default.createElement(TabList, _extends({}, rest, {
+    return /*#__PURE__*/React.createElement(TabList, _extends({}, rest, {
       "aria-label": label,
       contained: true
     }), children);
   }
-  return /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: className
-  }, isOverflowingTop && /*#__PURE__*/React__default.createElement("div", {
+  }, isOverflowingTop && /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--tab--list-gradient_top`
-  }), /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  }), /*#__PURE__*/React.createElement("div", _extends({}, rest, {
     "aria-label": label,
     ref: ref,
     role: "tablist",
     className: `${prefix}--tab--list`,
     onKeyDown: onKeyDown,
     onBlur: handleBlur
-  }), React__default.Children.map(children, (child, index) => {
-    return !isElement(child) ? null : /*#__PURE__*/React__default.createElement(TabContext.Provider, {
+  }), React.Children.map(children, (child, index) => {
+    return !isElement(child) ? null : /*#__PURE__*/React.createElement(TabContext.Provider, {
       value: {
         index,
         hasSecondaryLabel: false
       }
-    }, /*#__PURE__*/React__default.cloneElement(child, {
+    }, /*#__PURE__*/React.cloneElement(child, {
       ref: node => {
         tabs.current[index] = node;
       }
     }));
-  })), isOverflowingBottom && /*#__PURE__*/React__default.createElement("div", {
+  })), isOverflowingBottom && /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--tab--list-gradient_bottom`
   }));
 }
@@ -796,15 +799,15 @@ const Tab = /*#__PURE__*/forwardRef(function Tab(_ref10, forwardRef) {
     baseId,
     dismissable,
     onTabCloseRequest
-  } = React__default.useContext(TabsContext);
+  } = React.useContext(TabsContext);
   const {
     index,
     hasSecondaryLabel,
     contained
-  } = React__default.useContext(TabContext);
+  } = React.useContext(TabContext);
   const {
     badgeIndicator
-  } = React__default.useContext(IconTabContext) || {};
+  } = React.useContext(IconTabContext) || {};
   const dismissIconRef = useRef(null);
   const tabRef = useRef(null);
   const ref = useMergedRefs([forwardRef, tabRef]);
@@ -880,12 +883,12 @@ const Tab = /*#__PURE__*/forwardRef(function Tab(_ref10, forwardRef) {
     }
     onKeyDown?.(event);
   };
-  const DismissIcon = /*#__PURE__*/React__default.createElement("div", {
+  const DismissIcon = /*#__PURE__*/React.createElement("div", {
     className: cx({
       [`${prefix}--tabs__nav-item--close`]: dismissable,
       [`${prefix}--tabs__nav-item--close--hidden`]: !dismissable
     })
-  }, /*#__PURE__*/React__default.createElement("button", {
+  }, /*#__PURE__*/React.createElement("button", {
     type: "button",
     tabIndex: selectedIndex === index && dismissable ? 0 : -1,
     "aria-disabled": disabled,
@@ -900,7 +903,7 @@ const Tab = /*#__PURE__*/forwardRef(function Tab(_ref10, forwardRef) {
     onClick: handleClose,
     title: `Remove ${typeof children === 'string' ? children : ''} tab`,
     ref: dismissIconRef
-  }, /*#__PURE__*/React__default.createElement(Close, {
+  }, /*#__PURE__*/React.createElement(Close, {
     "aria-hidden": selectedIndex === index && dismissable ? 'false' : 'true',
     "aria-label": `Press delete to remove ${typeof children === 'string' ? children : ''} tab`
   })));
@@ -908,14 +911,14 @@ const Tab = /*#__PURE__*/forwardRef(function Tab(_ref10, forwardRef) {
 
   // should only happen for vertical variation, so no dismissable icon is needed here
   if (isEllipsisApplied) {
-    return /*#__PURE__*/React__default.createElement(Tooltip, {
+    return /*#__PURE__*/React.createElement(Tooltip, {
       label: children,
       align: "top",
       leaveDelayMs: 0,
       autoAlign: true,
       onMouseEnter: () => false,
       closeOnActivation: true
-    }, /*#__PURE__*/React__default.createElement(BaseComponent, _extends({}, rest, {
+    }, /*#__PURE__*/React.createElement(BaseComponent, _extends({}, rest, {
       "aria-controls": panelId,
       "aria-disabled": disabled,
       "aria-selected": selectedIndex === index,
@@ -935,17 +938,17 @@ const Tab = /*#__PURE__*/forwardRef(function Tab(_ref10, forwardRef) {
       onKeyDown: handleKeyDown,
       tabIndex: selectedIndex === index ? '0' : '-1',
       type: "button"
-    }), /*#__PURE__*/React__default.createElement("div", {
+    }), /*#__PURE__*/React.createElement("div", {
       className: `${prefix}--tabs__nav-item-label-wrapper`
-    }, /*#__PURE__*/React__default.createElement(Text, {
+    }, /*#__PURE__*/React.createElement(Text, {
       className: `${prefix}--tabs__nav-item-label`
-    }, children)), hasSecondaryLabel && secondaryLabel && /*#__PURE__*/React__default.createElement(Text, {
+    }, children)), hasSecondaryLabel && secondaryLabel && /*#__PURE__*/React.createElement(Text, {
       as: "div",
       className: `${prefix}--tabs__nav-item-secondary-label`,
       title: secondaryLabel
     }, secondaryLabel)));
   }
-  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(BaseComponent, _extends({}, rest, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(BaseComponent, _extends({}, rest, {
     "aria-controls": panelId,
     "aria-disabled": disabled,
     "aria-selected": selectedIndex === index,
@@ -964,25 +967,25 @@ const Tab = /*#__PURE__*/forwardRef(function Tab(_ref10, forwardRef) {
     onKeyDown: handleKeyDown,
     tabIndex: selectedIndex === index ? '0' : '-1',
     type: "button"
-  }), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--tabs__nav-item-label-wrapper`
-  }, dismissable && Icon && /*#__PURE__*/React__default.createElement("div", {
+  }, dismissable && Icon && /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--tabs__nav-item--icon-left`
-  }, /*#__PURE__*/React__default.createElement(Icon, {
+  }, /*#__PURE__*/React.createElement(Icon, {
     size: 16
-  })), /*#__PURE__*/React__default.createElement(Text, {
+  })), /*#__PURE__*/React.createElement(Text, {
     className: `${prefix}--tabs__nav-item-label`
-  }, children), !dismissable && Icon && /*#__PURE__*/React__default.createElement("div", {
+  }, children), !dismissable && Icon && /*#__PURE__*/React.createElement("div", {
     className: cx(`${prefix}--tabs__nav-item--icon`, {
       [`${prefix}--visually-hidden`]: !hasIcon
     })
-  }, !dismissable && Icon && /*#__PURE__*/React__default.createElement(Icon, {
+  }, !dismissable && Icon && /*#__PURE__*/React.createElement(Icon, {
     size: 16
-  }))), hasSecondaryLabel && secondaryLabel && /*#__PURE__*/React__default.createElement(Text, {
+  }))), hasSecondaryLabel && secondaryLabel && /*#__PURE__*/React.createElement(Text, {
     as: "div",
     className: `${prefix}--tabs__nav-item-secondary-label`,
     title: secondaryLabel
-  }, secondaryLabel), !disabled && badgeIndicator && (_BadgeIndicator || (_BadgeIndicator = /*#__PURE__*/React__default.createElement(BadgeIndicator, null)))), DismissIcon);
+  }, secondaryLabel), !disabled && badgeIndicator && (_BadgeIndicator || (_BadgeIndicator = /*#__PURE__*/React.createElement(BadgeIndicator, null)))), DismissIcon);
 });
 Tab.propTypes = {
   /**
@@ -1031,7 +1034,7 @@ Tab.propTypes = {
  */
 
 const IconTabContext = /*#__PURE__*/createContext(false);
-const IconTab = /*#__PURE__*/React__default.forwardRef(function IconTab(_ref11, ref) {
+const IconTab = /*#__PURE__*/React.forwardRef(function IconTab(_ref11, ref) {
   let {
     badgeIndicator,
     children,
@@ -1050,16 +1053,16 @@ const IconTab = /*#__PURE__*/React__default.forwardRef(function IconTab(_ref11,
   const classNames = cx(`${prefix}--tabs__nav-item--icon-only`, customClassName, {
     [`${prefix}--tabs__nav-item--icon-only__20`]: hasSize20
   });
-  return /*#__PURE__*/React__default.createElement(IconTabContext.Provider, {
+  return /*#__PURE__*/React.createElement(IconTabContext.Provider, {
     value: value
-  }, /*#__PURE__*/React__default.createElement(Tooltip, {
+  }, /*#__PURE__*/React.createElement(Tooltip, {
     align: "bottom",
     defaultOpen: defaultOpen,
     className: `${prefix}--icon-tooltip`,
     enterDelayMs: enterDelayMs,
     label: label,
     leaveDelayMs: leaveDelayMs
-  }, /*#__PURE__*/React__default.createElement(Tab, _extends({
+  }, /*#__PURE__*/React.createElement(Tab, _extends({
     className: classNames,
     ref: ref
   }, rest), children)));
@@ -1103,7 +1106,7 @@ IconTab.propTypes = {
  * TabPanel
  */
 
-const TabPanel = /*#__PURE__*/React__default.forwardRef(function TabPanel(_ref12, forwardRef) {
+const TabPanel = /*#__PURE__*/React.forwardRef(function TabPanel(_ref12, forwardRef) {
   let {
     children,
     className: customClassName,
@@ -1117,8 +1120,8 @@ const TabPanel = /*#__PURE__*/React__default.forwardRef(function TabPanel(_ref12
   const {
     selectedIndex,
     baseId
-  } = React__default.useContext(TabsContext);
-  const index = React__default.useContext(TabPanelContext);
+  } = React.useContext(TabsContext);
+  const index = React.useContext(TabPanelContext);
   const id = `${baseId}-tabpanel-${index}`;
   const tabId = `${baseId}-tab-${index}`;
   const className = cx(`${prefix}--tab-content`, customClassName, {
@@ -1158,7 +1161,7 @@ const TabPanel = /*#__PURE__*/React__default.forwardRef(function TabPanel(_ref12
     });
     return () => observer.disconnect();
   }, []);
-  return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
     "aria-labelledby": tabId,
     id: id,
     className: className,
@@ -1219,10 +1222,10 @@ function TabPanels(_ref13) {
       });
     }
   });
-  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, React__default.Children.map(children, (child, index) => {
-    return !isElement(child) ? null : /*#__PURE__*/React__default.createElement(TabPanelContext.Provider, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, React.Children.map(children, (child, index) => {
+    return !isElement(child) ? null : /*#__PURE__*/React.createElement(TabPanelContext.Provider, {
       value: index
-    }, /*#__PURE__*/React__default.cloneElement(child, {
+    }, /*#__PURE__*/React.cloneElement(child, {
       ref: element => {
         refs.current[index] = element;
       }

package/es/components/Tag/DismissibleTag.d.ts

@@ -20,6 +20,10 @@ export interface DismissibleTagBaseProps {
      * Specify if the `DismissibleTag` is disabled
      */
     disabled?: boolean;
+    /**
+     * Provide a custom tooltip label for the dismiss button
+     */
+    dismissTooltipLabel?: string;
     /**
      * Specify the id for the selectable tag.
      */

package/es/components/Tag/DismissibleTag.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default, { forwardRef, useRef, useState, useLayoutEffect } from 'react';
+import React, { forwardRef, useRef, useState, useLayoutEffect } from 'react';
 import cx from 'classnames';
 import { useId } from '../../internal/useId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
@@ -36,6 +36,7 @@ const DismissibleTag = /*#__PURE__*/forwardRef((_ref, forwardRef) => {
     text,
     tagTitle,
     type,
+    dismissTooltipLabel = 'Dismiss tag',
     ...other
   } = _ref;
   const prefix = usePrefix();
@@ -54,9 +55,9 @@ const DismissibleTag = /*#__PURE__*/forwardRef((_ref, forwardRef) => {
       onClose(event);
     }
   };
-  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',
       kind: 'inline'
     });
@@ -69,8 +70,8 @@ const DismissibleTag = /*#__PURE__*/forwardRef((_ref, forwardRef) => {
     onClick,
     ...otherProps
   } = other;
-  const dismissLabel = `Dismiss "${text}"`;
-  return /*#__PURE__*/React__default.createElement(Tag, _extends({
+  const dismissActionLabel = isEllipsisApplied ? dismissTooltipLabel : title;
+  return /*#__PURE__*/React.createElement(Tag, _extends({
     ref: combinedRef,
     type: type,
     size: size,
@@ -78,26 +79,26 @@ const DismissibleTag = /*#__PURE__*/forwardRef((_ref, forwardRef) => {
     disabled: disabled,
     className: tagClasses,
     id: tagId
-  }, otherProps), /*#__PURE__*/React__default.createElement("div", {
+  }, otherProps), /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--interactive--tag-children`
-  }, /*#__PURE__*/React__default.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Text, {
     title: tagTitle ? tagTitle : text,
     className: `${prefix}--tag__label`
-  }, text), slug ? normalizedDecorator : decorator ? /*#__PURE__*/React__default.createElement("div", {
+  }, text), slug ? normalizedDecorator : decorator ? /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--tag__decorator`
-  }, normalizedDecorator) : '', /*#__PURE__*/React__default.createElement(Tooltip, {
-    label: isEllipsisApplied ? dismissLabel : title,
+  }, normalizedDecorator) : '', /*#__PURE__*/React.createElement(Tooltip, {
+    label: dismissActionLabel,
     align: "bottom",
     className: tooltipClasses,
     leaveDelayMs: 0,
     closeOnActivation: true
-  }, /*#__PURE__*/React__default.createElement("button", {
+  }, /*#__PURE__*/React.createElement("button", {
     type: "button",
     className: `${prefix}--tag__close-icon`,
     onClick: handleClose,
     disabled: disabled,
-    "aria-label": title
-  }, _Close || (_Close = /*#__PURE__*/React__default.createElement(Close, null))))));
+    "aria-label": dismissActionLabel
+  }, _Close || (_Close = /*#__PURE__*/React.createElement(Close, null))))));
 });
 DismissibleTag.propTypes = {
   /**
@@ -112,6 +113,10 @@ DismissibleTag.propTypes = {
    * Specify if the `DismissibleTag` is disabled
    */
   disabled: PropTypes.bool,
+  /**
+   * Provide a custom tooltip label for the dismiss button
+   */
+  dismissTooltipLabel: PropTypes.string,
   /**
    * Specify the id for the tag.
    */

package/es/components/Tag/OperationalTag.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default, { forwardRef, useRef, useState, useLayoutEffect } from 'react';
+import React, { forwardRef, useRef, useState, useLayoutEffect } from 'react';
 import cx from 'classnames';
 import { useId } from '../../internal/useId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
@@ -54,14 +54,14 @@ const OperationalTag = /*#__PURE__*/forwardRef((_ref, forwardRef) => {
   const tooltipClasses = cx(`${prefix}--icon-tooltip`, `${prefix}--tag-label-tooltip`);
   const combinedRef = mergeRefs(tagRef, forwardRef);
   if (isEllipsisApplied) {
-    return /*#__PURE__*/React__default.createElement(Tooltip, {
+    return /*#__PURE__*/React.createElement(Tooltip, {
       label: text,
       align: "bottom",
       className: tooltipClasses,
       leaveDelayMs: 0,
       onMouseEnter: () => false,
       closeOnActivation: true
-    }, /*#__PURE__*/React__default.createElement(Tag, _extends({
+    }, /*#__PURE__*/React.createElement(Tag, _extends({
       ref: combinedRef,
       type: type,
       size: size,
@@ -69,12 +69,12 @@ const OperationalTag = /*#__PURE__*/forwardRef((_ref, forwardRef) => {
       disabled: disabled,
       className: tagClasses,
       id: tagId
-    }, other), /*#__PURE__*/React__default.createElement(Text, {
+    }, other), /*#__PURE__*/React.createElement(Text, {
       title: text,
       className: `${prefix}--tag__label`
     }, text)));
   }
-  return /*#__PURE__*/React__default.createElement(Tag, _extends({
+  return /*#__PURE__*/React.createElement(Tag, _extends({
     ref: combinedRef,
     type: type,
     size: size,
@@ -82,7 +82,7 @@ const OperationalTag = /*#__PURE__*/forwardRef((_ref, forwardRef) => {
     disabled: disabled,
     className: tagClasses,
     id: tagId
-  }, other), /*#__PURE__*/React__default.createElement(Text, {
+  }, other), /*#__PURE__*/React.createElement(Text, {
     title: text,
     className: `${prefix}--tag__label`
   }, text));

package/es/components/Tag/SelectableTag.d.ts

@@ -36,6 +36,10 @@ export interface SelectableTagBaseProps {
      * Specify the state of the selectable tag.
      */
     selected?: boolean;
+    /**
+     * Specify the default state of the selectable tag.
+     */
+    defaultSelected?: boolean;
     /**
      * Specify the size of the Tag. Currently supports either `sm`,
      * `md` (default) or `lg` sizes.