@carbon/react 1.92.0 → 1.93.0-rc.0

package/lib/components/Select/Select.js

@@ -57,11 +57,13 @@ const Select = /*#__PURE__*/React.forwardRef(({
   // Convert children to an array of valid elements once using type narrowing
   const validChildren = React.Children.toArray(children).filter(child => /*#__PURE__*/React.isValidElement(child));
 
-  // Find the default option based on the specified defaultValue
-  const defaultOption = validChildren.find(child => child.props?.value === other?.defaultValue);
+  // Find the default option based on the specified defaultValue or value
+  const selectedValue = other?.value || other?.defaultValue;
+  const selectedOption = validChildren.find(child => child.props?.value === selectedValue);
 
-  // Use the default option's text if available; otherwise, fallback to the first option's text
-  const initialTitle = defaultOption?.props?.text || validChildren[0]?.props?.text || '';
+  // Use the provided title prop, or the selected option's text if available;
+  // otherwise, fallback to the first option's text
+  const initialTitle = other?.title || selectedOption?.props?.text || validChildren[0]?.props?.text || '';
   const [title, setTitle] = React.useState(initialTitle);
   const selectClasses = cx({
     [`${prefix}--select`]: true,
@@ -143,7 +145,7 @@ const Select = /*#__PURE__*/React.forwardRef(({
   const candidateIsAILabel = utils.isComponentElement(candidate, index.AILabel);
   const normalizedDecorator = candidateIsAILabel ? /*#__PURE__*/React.cloneElement(candidate, {
     size: 'mini'
-  }) : null;
+  }) : candidate;
   const input = (() => {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("select", _rollupPluginBabelHelpers.extends({}, other, ariaProps, {
       id: id,

package/lib/components/ShapeIndicator/index.js

@@ -50,13 +50,13 @@ const shapeTypes = {
   incomplete: incompleteIcon,
   draft: iconsReact.CircleStroke
 };
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const ShapeIndicator = /*#__PURE__*/React.forwardRef(({
   className: customClassName,
   kind,
   label,
   textSize = 12,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20452
   ...rest
 }, ref) => {
   const prefix = usePrefix.usePrefix();

package/lib/components/Slider/Slider.d.ts

@@ -6,22 +6,20 @@
  */
 import { type InputHTMLAttributes, type KeyboardEventHandler, type ReactNode } from 'react';
 import PropTypes from 'prop-types';
-import { TranslateWithId } from '../../types/common';
+import type { TranslateWithId } from '../../types/common';
 declare const translationIds: {
-    readonly autoCorrectAnnouncement: "carbon.slider.auto-correct-announcement";
+    readonly 'carbon.slider.auto-correct-announcement': "carbon.slider.auto-correct-announcement";
+};
+type TranslationKey = keyof typeof translationIds;
+type TranslationArgs = {
+    correctedValue?: string;
 };
-/**
- * Message ids that will be passed to translateWithId().
- */
-type TranslationKey = (typeof translationIds)[keyof typeof translationIds];
 declare enum HandlePosition {
     LOWER = "lower",
     UPPER = "upper"
 }
 type ExcludedAttributes = 'onChange' | 'onBlur';
-export interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes>, TranslateWithId<TranslationKey, {
-    correctedValue?: string;
-}> {
+export interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes>, TranslateWithId<TranslationKey, TranslationArgs> {
     /**
      * The `ariaLabel` for the `<input>`.
      */

package/lib/components/Slider/Slider.js

@@ -44,22 +44,18 @@ const ThumbWrapper = ({
   }
 };
 const translationIds = {
-  autoCorrectAnnouncement: 'carbon.slider.auto-correct-announcement'
+  'carbon.slider.auto-correct-announcement': 'carbon.slider.auto-correct-announcement'
 };
-
-/**
- * Message ids that will be passed to translateWithId().
- */
-
-function translateWithId(translationId, translationState) {
-  if (translationState?.correctedValue) {
-    const {
-      correctedValue
-    } = translationState;
-    return `The inputted value "${correctedValue}" was corrected to the nearest allowed digit.`;
+const defaultTranslations = {
+  [translationIds['carbon.slider.auto-correct-announcement']]: 'The inputted value "{correctedValue}" was corrected to the nearest allowed digit.'
+};
+const defaultTranslateWithId = (messageId, args) => {
+  const template = defaultTranslations[messageId];
+  if (args?.correctedValue) {
+    return template.replace('{correctedValue}', args.correctedValue);
   }
-  return '';
-}
+  return template;
+};
 const defaultFormatLabel = (value, label) => {
   return `${value}${label ?? ''}`;
 };
@@ -695,7 +691,7 @@ const Slider = props => {
       min,
       max
     } = props;
-    const numSteps = Math.floor((max - min) / step) + ((max - min) % step === 0 ? 1 : 2);
+    const numSteps = Math.floor((max - min) / step) + 1;
     /** Index of the step that corresponds to `leftPercent`. */
     const stepIndex = Math.round(leftPercent * (numSteps - 1));
     const discreteValue = stepIndex === numSteps - 1 ? max : min + step * stepIndex;
@@ -957,7 +953,7 @@ const Slider = props => {
       hideLabel,
       step = 1,
       // TODO: Other properties are deleted below. Why isn't this one?
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20452
       stepMultiplier: _stepMultiplier,
       inputType = 'number',
       invalidText,
@@ -969,7 +965,7 @@ const Slider = props => {
       readOnly = false,
       warn,
       warnText,
-      translateWithId: t = translateWithId,
+      translateWithId: t = defaultTranslateWithId,
       ...other
     } = props;
     delete other.onRelease;
@@ -986,11 +982,11 @@ const Slider = props => {
     } = state;
     const showWarning = !readOnly && warn ||
     // TODO: https://github.com/carbon-design-system/carbon/issues/18991#issuecomment-2795709637
-    // eslint-disable-next-line valid-typeof , no-constant-binary-expression -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line valid-typeof , no-constant-binary-expression -- https://github.com/carbon-design-system/carbon/issues/20452
     typeof correctedValue !== null && correctedPosition === HandlePosition.LOWER && isValid;
     const showWarningUpper = !readOnly && warn ||
     // TODO: https://github.com/carbon-design-system/carbon/issues/18991#issuecomment-2795709637
-    // eslint-disable-next-line valid-typeof, no-constant-binary-expression -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line valid-typeof, no-constant-binary-expression -- https://github.com/carbon-design-system/carbon/issues/20452
     typeof correctedValue !== null && correctedPosition === (twoHandles ? HandlePosition.UPPER : HandlePosition.LOWER) && (twoHandles ? isValidUpper : isValid);
     return /*#__PURE__*/React.createElement(usePrefix.PrefixContext.Consumer, null, prefix => {
       const labelId = `${id}-label`;
@@ -1198,7 +1194,7 @@ const Slider = props => {
         as: "div",
         role: "alert",
         className: cx(`${prefix}--slider__status-msg`, `${prefix}--form-requirement`)
-      }, t(translationIds.autoCorrectAnnouncement, {
+      }, t(translationIds['carbon.slider.auto-correct-announcement'], {
         correctedValue
       })));
     });

package/lib/components/Stack/HStack.js

@@ -11,7 +11,7 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var React = require('react');
 var Stack = require('./Stack.js');
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const HStack = /*#__PURE__*/React.forwardRef((props, ref) => {
   return /*#__PURE__*/React.createElement(Stack.Stack, _rollupPluginBabelHelpers.extends({}, props, {
     ref: ref,

package/lib/components/Stack/Stack.js

@@ -37,7 +37,7 @@ const SPACING_STEPS = Array.from({
  * - https://paste.twilio.design/layout/stack/
  * - https://github.com/Workday/canvas-kit/blob/f2f599654876700f483a1d8c5de82a41315c76f1/modules/labs-react/layout/lib/Stack.tsx
  */
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const Stack = /*#__PURE__*/React.forwardRef((props, ref) => {
   const {
     as: BaseComponent = 'div',

package/lib/components/Stack/VStack.js

@@ -11,7 +11,7 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var React = require('react');
 var Stack = require('./Stack.js');
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const VStack = /*#__PURE__*/React.forwardRef((props, ref) => {
   return /*#__PURE__*/React.createElement(Stack.Stack, _rollupPluginBabelHelpers.extends({}, props, {
     ref: ref,

package/lib/components/StructuredList/StructuredList.js

@@ -152,7 +152,7 @@ function StructuredListRow(props) {
     ...other
   } = props;
   const [hasFocusWithin, setHasFocusWithin] = React.useState(false);
-  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20452
   const rowId = id ?? useId.useId('grid-input');
   const selectedRow = React.useContext(GridSelectedRowStateContext);
   const setSelectedRow = React.useContext(GridSelectedRowDispatchContext);
@@ -186,7 +186,7 @@ function StructuredListRow(props) {
     ref: itemRef,
     onClick: event => {
       setSelectedRow?.(rowId);
-      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
+      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20452
       onClick && onClick(event);
       if (selection) {
         // focus items only when selection is enabled
@@ -266,7 +266,7 @@ function StructuredListInput(props) {
     value: row?.id ?? '',
     onChange: event => {
       setSelectedRow?.(event.target.value);
-      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
+      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20452
       onChange && onChange(event);
     },
     id: id ?? defaultId,

package/lib/components/Tabs/Tabs.js

@@ -80,7 +80,7 @@ function Tabs({
 }) {
   const baseId = useId.useId('ccs');
   if (dismissable && !onTabCloseRequest) {
-    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20452
     console.error('dismissable property specified without also providing an onTabCloseRequest property.');
   }
   // The active index is used to track the element which has focus in our tablist
@@ -275,7 +275,7 @@ function TabList({
   let hasSecondaryLabelTabs = false;
   if (contained) {
     hasSecondaryLabelTabs = React.Children.toArray(children).some(child => {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
       const _child = child;
       return /*#__PURE__*/React.isValidElement(child) && !!_child.props.secondaryLabel;
     });
@@ -389,7 +389,7 @@ function TabList({
         inline: 'nearest'
       });
     }
-    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20452
   }, []);
   React.useEffect(() => {
     //adding 1 in calculation for firefox support
@@ -410,7 +410,7 @@ function TabList({
         setSelectedIndex(tabs.current.indexOf(tab));
       }
     }
-    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20452
   }, []);
   useIsomorphicEffect.default(() => {
     if (ref.current) {
@@ -498,7 +498,7 @@ function TabList({
         contained
       }
     }, /*#__PURE__*/React.cloneElement(
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
     child, {
       ref: node => {
         tabs.current[index] = node;
@@ -633,7 +633,7 @@ function TabListVertical({
         setSelectedIndex(tabs.current.indexOf(tab));
       }
     }
-    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20452
   }, []);
   React.useEffect(() => {
     function handler() {
@@ -644,7 +644,7 @@ function TabListVertical({
       if (containerTop && containerHeight) {
         // scrolls so selected tab is in view
         if (selectedPositionTop - halfTabHeight < containerTop || selectedPositionTop - containerTop + verticalTabHeight + halfTabHeight > containerHeight) {
-          // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
+          // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20452
           ref.current && ref.current.scrollTo({
             top: (selectedIndex - 1) * verticalTabHeight,
             behavior: 'smooth'
@@ -700,7 +700,7 @@ function TabListVertical({
         hasSecondaryLabel: false
       }
     }, /*#__PURE__*/React.cloneElement(
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
     child, {
       ref: node => {
         tabs.current[index] = node;
@@ -777,7 +777,7 @@ function createLongPressBehavior(ref, direction, setScrollLeft) {
  * Tab
  */
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const Tab = /*#__PURE__*/React.forwardRef(({
   as = 'button',
   children,
@@ -813,7 +813,7 @@ const Tab = /*#__PURE__*/React.forwardRef(({
   const panelId = `${baseId}-tabpanel-${index$1}`;
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
 
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   const isEllipsisActive = element => {
     setIsEllipsisApplied(element.offsetHeight < element.scrollHeight);
     return element.offsetHeight < element.scrollHeight;
@@ -1033,7 +1033,7 @@ Tab.propTypes = {
  */
 
 const IconTabContext = /*#__PURE__*/React.createContext(false);
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const IconTab = /*#__PURE__*/React.forwardRef(({
   badgeIndicator,
   children,
@@ -1105,7 +1105,7 @@ IconTab.propTypes = {
  * TabPanel
  */
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const TabPanel = /*#__PURE__*/React.forwardRef(({
   children,
   className: customClassName,

package/lib/components/Tag/DismissibleTag.js

@@ -28,7 +28,7 @@ var index = require('../AILabel/index.js');
 var utils = require('../../internal/utils.js');
 
 var _Close;
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const DismissibleTag = /*#__PURE__*/React.forwardRef(({
   className,
   decorator,
@@ -48,7 +48,7 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef(({
 }, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagLabelRef = React.useRef(null);
-  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20452
   const tagId = id || `tag-${useId.useId()}`;
   const tagClasses = cx(`${prefix}--tag--filter`, className);
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
@@ -68,7 +68,7 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef(({
   const normalizedDecorator = candidateIsAILabel ? /*#__PURE__*/React.cloneElement(candidate, {
     size: 'sm',
     kind: 'inline'
-  }) : null;
+  }) : candidate;
   const tooltipClasses = cx(`${prefix}--icon-tooltip`, `${prefix}--tag-label-tooltip`);
 
   // Removing onClick from the spread operator

package/lib/components/Tag/OperationalTag.js

@@ -35,7 +35,7 @@ const TYPES = {
   'cool-gray': 'Cool-Gray',
   'warm-gray': 'Warm-Gray'
 };
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const OperationalTag = /*#__PURE__*/React.forwardRef(({
   className,
   disabled,
@@ -48,7 +48,7 @@ const OperationalTag = /*#__PURE__*/React.forwardRef(({
 }, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
-  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20452
   const tagId = id || `tag-${useId.useId()}`;
   const tagClasses = cx(`${prefix}--tag--operational`, className);
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);

package/lib/components/Tag/SelectableTag.js

@@ -24,7 +24,7 @@ var isEllipsisActive = require('./isEllipsisActive.js');
 var mergeRefs = require('../../tools/mergeRefs.js');
 var useControllableState = require('../../internal/useControllableState.js');
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const SelectableTag = /*#__PURE__*/React.forwardRef(({
   className,
   disabled,
@@ -40,7 +40,7 @@ const SelectableTag = /*#__PURE__*/React.forwardRef(({
 }, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
-  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20452
   const tagId = id || `tag-${useId.useId()}`;
   const [selectedTag, setSelectedTag] = useControllableState.useControllableState({
     value: selected,

package/lib/components/Tag/Tag.js

@@ -46,7 +46,7 @@ const SIZES = {
   md: 'md',
   lg: 'lg'
 };
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const TagBase = /*#__PURE__*/React.forwardRef(({
   children,
   className,
@@ -69,15 +69,15 @@ const TagBase = /*#__PURE__*/React.forwardRef(({
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
   if (filter) {
-    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20452
     console.warn('The `filter` prop for Tag has been deprecated and will be removed in the next major version. Use DismissibleTag instead.');
   }
   if (onClose) {
-    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20452
     console.warn('The `onClose` prop for Tag has been deprecated and will be removed in the next major version. Use DismissibleTag instead.');
   }
   const ref = useMergedRefs.useMergedRefs([forwardRef, tagRef]);
-  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20452
   const tagId = id || `tag-${useId.useId()}`;
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
   React.useLayoutEffect(() => {

package/lib/components/Tag/isEllipsisActive.js

@@ -7,7 +7,7 @@
 
 'use strict';
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
 const isEllipsisActive = element => {
   if (element) {
     return element?.offsetWidth < element?.scrollWidth;

package/lib/components/Text/Text.js

@@ -12,7 +12,7 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var TextDirectionContext = require('./TextDirectionContext.js');
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const TextBase = /*#__PURE__*/React.forwardRef(({
   as,
   children,

package/lib/components/TextArea/TextArea.js

@@ -291,7 +291,7 @@ const TextArea = frFn((props, forwardRef) => {
   const candidateIsAILabel = utils.isComponentElement(candidate, index.AILabel);
   const normalizedDecorator = candidateIsAILabel ? /*#__PURE__*/React.cloneElement(candidate, {
     size: 'mini'
-  }) : null;
+  }) : candidate;
   return /*#__PURE__*/React.createElement("div", {
     className: formItemClasses
   }, /*#__PURE__*/React.createElement("div", {

package/lib/components/TextInput/PasswordInput.js

@@ -65,7 +65,7 @@ const PasswordInput = /*#__PURE__*/React.forwardRef(({
   } = React.useContext(FormContext.FormContext);
   const handleTogglePasswordVisibility = event => {
     setInputType(inputType === 'password' ? 'text' : 'password');
-    // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20452
     onTogglePasswordVisibility && onTogglePasswordVisibility(event);
   };
   const textInputClasses = cx(`${prefix}--text-input`, `${prefix}--password-input`, className, {
@@ -155,10 +155,10 @@ const PasswordInput = /*#__PURE__*/React.forwardRef(({
     align = tooltipPosition;
   }
   if (!hidePasswordLabel || hidePasswordLabel.trim() === '') {
-    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20452
     console.warn('Warning: The "hidePasswordLabel" should not be blank.');
   } else if (!showPasswordLabel || showPasswordLabel.trim() === '') {
-    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20452
     console.warn('Warning: The "showPasswordLabel" should not be blank.');
   }
   const input = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("input", _rollupPluginBabelHelpers.extends({}, util.getTextInputProps({
@@ -188,7 +188,7 @@ const PasswordInput = /*#__PURE__*/React.forwardRef(({
     setInputType(type);
   }, [type]);
 
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   const Icon = normalizedProps.icon;
   return /*#__PURE__*/React.createElement("div", {
     className: inputWrapperClasses

package/lib/components/TextInput/TextInput.js

@@ -64,7 +64,7 @@ const TextInput = /*#__PURE__*/React.forwardRef(({
   const [textCount, setTextCount] = React.useState(getInitialTextCount());
   React.useEffect(() => {
     setTextCount(getInitialTextCount());
-    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20452
   }, [value, defaultValue, enableCounter]);
   const normalizedProps = useNormalizedInputProps.useNormalizedInputProps({
     id,
@@ -193,7 +193,7 @@ const TextInput = /*#__PURE__*/React.forwardRef(({
       }
     }
   }, [ariaAnnouncement, prevAnnouncement]);
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   const Icon = normalizedProps.icon;
 
   // AILabel is always size `mini`
@@ -201,7 +201,7 @@ const TextInput = /*#__PURE__*/React.forwardRef(({
   const candidateIsAILabel = utils.isComponentElement(candidate, index.AILabel);
   const normalizedDecorator = candidateIsAILabel ? /*#__PURE__*/React.cloneElement(candidate, {
     size: 'mini'
-  }) : null;
+  }) : candidate;
   return /*#__PURE__*/React.createElement("div", {
     className: inputWrapperClasses
   }, !inline ? labelWrapper : /*#__PURE__*/React.createElement("div", {

package/lib/components/Theme/index.js

@@ -19,7 +19,7 @@ const ThemeContext = /*#__PURE__*/React.createContext({
   theme: 'white'
 });
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const GlobalTheme = /*#__PURE__*/React.forwardRef(({
   children,
   theme
@@ -30,7 +30,7 @@ const GlobalTheme = /*#__PURE__*/React.forwardRef(({
     };
   }, [theme]);
   const childrenWithProps = /*#__PURE__*/React.cloneElement(
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   children, {
     ref: ref
   });
@@ -73,7 +73,7 @@ function Theme({
       isDark
     };
   }, [theme]);
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   const BaseComponentAsAny = BaseComponent;
   return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
     value: value

package/lib/components/Tile/Tile.js

@@ -207,7 +207,7 @@ ClickableTile.propTypes = {
    */
   renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
 };
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
 const SelectableTile = /*#__PURE__*/React.forwardRef(({
   children,
   className,
@@ -276,7 +276,7 @@ const SelectableTile = /*#__PURE__*/React.forwardRef(({
   const normalizedDecorator = candidateIsAILabel ? /*#__PURE__*/React.cloneElement(candidate, {
     size: 'xs',
     ref: decoratorRef
-  }) : null;
+  }) : candidate;
   return (
     /*#__PURE__*/
     // eslint-disable-next-line jsx-a11y/interactive-supports-focus
@@ -503,7 +503,7 @@ const ExpandableTile = /*#__PURE__*/React.forwardRef(({
   const candidateIsAILabel = utils.isComponentElement(candidate, index$1.AILabel);
   const normalizedDecorator = candidateIsAILabel ? /*#__PURE__*/React.cloneElement(candidate, {
     size: 'xs'
-  }) : null;
+  }) : candidate;
   return interactive ? /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
     ref: ref,
     className: interactiveClassNames

package/lib/components/TimePicker/TimePicker.js

@@ -116,7 +116,7 @@ const TimePicker = frFn((props, ref) => {
       }
     };
     const mappedChildren = React.Children.map(children, pickerSelect => {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
       const item = pickerSelect;
       if (item) {
         return /*#__PURE__*/React.cloneElement(item, {

package/lib/components/Toggletip/index.js

@@ -29,7 +29,7 @@ function ToggletipLabel({
 }) {
   const prefix = usePrefix.usePrefix();
   const className = cx(`${prefix}--toggletip-label`, customClassName);
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   const BaseComponentAsAny = BaseComponent;
   return /*#__PURE__*/React.createElement(BaseComponentAsAny, _rollupPluginBabelHelpers.extends({
     className: className
@@ -136,7 +136,7 @@ function Toggletip({
     const eventType = 'PointerEvent' in window ? 'pointerdown' : 'mousedown';
     const handleOutsideClick = event => {
       const node = event.target;
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20071
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452
       if (open && node && !ref.current.contains(node)) {
         setOpen(false);
       }
@@ -169,7 +169,7 @@ function Toggletip({
 // Get all the properties from Popover except for "open".
 // The Typescript types for PropTypes are really messed up so we need lots of
 // casting.  It will be great when we can finally get rid of PropTypes altogether.
-// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
+// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20452
 const {
   open,
   ...popoverNonOpenPropTypes
@@ -197,7 +197,7 @@ const ToggletipButton = /*#__PURE__*/React.forwardRef(function ToggletipButton({
   const toggletip = useToggletip();
   const prefix = usePrefix.usePrefix();
   const className = cx(`${prefix}--toggletip-button`, customClassName);
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   const ComponentToggle = BaseComponent ?? 'button';
   if (ComponentToggle !== 'button') {
     return /*#__PURE__*/React.createElement(ComponentToggle, _rollupPluginBabelHelpers.extends({}, toggletip?.onClick, {

package/lib/components/Tooltip/DefinitionTooltip.js

@@ -50,7 +50,7 @@ const DefinitionTooltip = ({
       setOpen(false);
     },
     onMouseEnter: () => {
-      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
+      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20452
       openOnHover ? setOpen(true) : null;
     },
     onFocus: () => {