@carbon/react 1.101.0-rc.0 → 1.102.0-rc.0

package/lib/components/MultiSelect/MultiSelectPropTypes.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -34,17 +34,15 @@ export declare const sortingPropTypes: {
      */
     sortItems: PropTypes.Requireable<(...args: any[]) => any>;
 };
-interface DownshiftTypedProps<ItemType> {
-    itemToString?(item: ItemType): string;
-}
 interface SharedOptions {
     locale: string;
 }
-interface CompareItems {
-    (itemA: string, itemB: string, options: SharedOptions): number;
-}
-export interface SortItemsOptions<ItemType> extends SharedOptions, DownshiftTypedProps<ItemType> {
+export type CompareItems = (itemA: string, itemB: string, options: {
+    locale: string;
+}) => number;
+export interface SortItemsOptions<ItemType> extends SharedOptions {
     compareItems: CompareItems;
+    itemToString: (item: ItemType) => string;
     selectedItems: ItemType[];
 }
 export interface MultiSelectSortingProps<ItemType> {

package/lib/components/MultiSelect/tools/sorting.d.ts

@@ -1,9 +1,16 @@
-export function defaultCompareItems(itemA: string, itemB: string, { locale }: {
-    locale: string;
-}): number;
-export function defaultSortItems(items: any, { selectedItems, itemToString, compareItems, locale }: {
-    selectedItems?: never[] | undefined;
-    itemToString: any;
-    compareItems: any;
-    locale?: string | undefined;
-}): any;
+/**
+ * Copyright IBM Corp. 2016, 2026
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import type { CompareItems, SortItemsOptions } from '../MultiSelectPropTypes';
+/**
+ * Use `localeCompare` with the `numeric` option enabled to sort two
+ * alphanumeric strings.
+ */
+export declare const defaultCompareItems: CompareItems;
+/**
+ * Default sorting function for options in a selection control.
+ */
+export declare const defaultSortItems: <T>(items: T[], { selectedItems, itemToString, compareItems, locale }: SortItemsOptions<T>) => T[];

package/lib/components/MultiSelect/tools/sorting.js

@@ -7,16 +7,11 @@
 
 'use strict';
 
+const isSelectAllItem = item => typeof item === 'object' && item !== null && 'isSelectAll' in item;
+
 /**
- * Use the locale `localeCompare` with the `numeric` option to sort two
- * alpha-numeric strings.
- *
- * @param {string} itemA - The first string to compare.
- * @param {string} itemB - The second string to compare.
- * @param {object} options - Options for comparing.
- * @param {string} options.locale - The locale to use for comparison.
- * @returns {number} A negative number if itemA comes before itemB, a positive
- *   number if itemA comes after itemB, or 0 if they are equal.
+ * Use `localeCompare` with the `numeric` option enabled to sort two
+ * alphanumeric strings.
  */
 const defaultCompareItems = (itemA, itemB, {
   locale
@@ -25,18 +20,19 @@ const defaultCompareItems = (itemA, itemB, {
 });
 
 /**
- * Default sorting algorithm for options in a selection control
+ * Default sorting function for options in a selection control.
  */
 const defaultSortItems = (items, {
-  selectedItems = [],
+  selectedItems,
   itemToString,
   compareItems,
-  locale = 'en'
+  locale
 }) => {
+  // TODO: Should this util mutate items or should that be avoided?
   return items.sort((itemA, itemB) => {
     // Always place "select all" option at the beginning
-    if (itemA.isSelectAll) return -1;
-    if (itemB.isSelectAll) return 1;
+    if (isSelectAllItem(itemA) && itemA.isSelectAll) return -1;
+    if (isSelectAllItem(itemB) && itemB.isSelectAll) return 1;
     const hasItemA = selectedItems.includes(itemA);
     const hasItemB = selectedItems.includes(itemB);
     if (hasItemA && !hasItemB) return -1;

package/lib/components/NumberInput/NumberInput.js

@@ -447,7 +447,7 @@ const NumberInput = /*#__PURE__*/React.forwardRef((props, forwardRef) => {
     if ('type' in evt.target && evt.target.type === 'button') {
       setIsFocused(false);
     } else {
-      setIsFocused(evt.type === 'focus' ? true : false);
+      setIsFocused(evt.type === 'focus');
     }
   };
   const outerElementClasses = cx(`${prefix}--form-item`, {

package/lib/components/OverflowMenu/OverflowMenu.js

@@ -259,6 +259,7 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef(({
     const focusinEventName = hasFocusin ? 'focusin' : 'focus';
     hFocusIn.current = on(menuBody.ownerDocument, focusinEventName, event => {
       const target = event.target;
+      if (!(target instanceof Element)) return;
       const triggerEl = triggerRef.current;
       if (typeof target.matches === 'function') {
         if (!menuBody.contains(target) && triggerEl && !target.matches(`.${prefix}--overflow-menu:first-child, .${prefix}--overflow-menu-options:first-child`)) {

package/lib/components/OverflowMenuItem/OverflowMenuItem.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -14,6 +14,10 @@ export interface OverflowMenuItemProps extends React.HTMLAttributes<HTMLElement>
      * A callback to tell the parent menu component that the menu should be closed.
      */
     closeMenu?: () => void;
+    /**
+     * Specify the message read by screen readers for the danger overflow menu item variant
+     */
+    dangerDescription?: string;
     /**
      * `true` to make this menu item disabled.
      */

package/lib/components/OverflowMenuItem/OverflowMenuItem.js

@@ -19,12 +19,14 @@ var usePrefix = require('../../internal/usePrefix.js');
 var warning = require('../../internal/warning.js');
 var Text = require('../Text/Text.js');
 require('../Text/TextDirection.js');
+var useId = require('../../internal/useId.js');
 
 const frFn = React.forwardRef;
 const OverflowMenuItem = frFn((props, ref) => {
   const {
     className,
     closeMenu,
+    dangerDescription = 'danger',
     disabled = false,
     handleOverflowMenuItemFocus,
     hasDivider = false,
@@ -68,13 +70,17 @@ const OverflowMenuItem = frFn((props, ref) => {
     [`${prefix}--overflow-menu-options__option--disabled`]: disabled
   }, wrapperClassName);
   const TagToUse = href ? 'a' : 'button';
+  const assistiveId = useId.useId('danger-description');
   const OverflowMenuItemContent = (() => {
     if (typeof itemText !== 'string') {
       return itemText;
     }
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
       className: `${prefix}--overflow-menu-options__option-content`
-    }, itemText);
+    }, itemText), isDelete && /*#__PURE__*/React.createElement("span", {
+      id: assistiveId,
+      className: `${prefix}--visually-hidden`
+    }, dangerDescription));
   })();
   return /*#__PURE__*/React.createElement(Text.Text, {
     as: "li",
@@ -114,6 +120,10 @@ OverflowMenuItem.propTypes = {
    * A callback to tell the parent menu component that the menu should be closed.
    */
   closeMenu: PropTypes.func,
+  /**
+   * Specify the message read by screen readers for the danger overflow menu item variant
+   */
+  dangerDescription: PropTypes.string,
   /**
    * `true` to make this menu item disabled.
    */

package/lib/components/Popover/index.js

@@ -42,7 +42,7 @@ const Popover = /*#__PURE__*/React.forwardRef(function PopoverRenderFunction({
   autoAlign = false,
   autoAlignBoundary,
   backgroundToken = 'layer',
-  caret = isTabTip ? false : true,
+  caret = !isTabTip,
   className: customClassName,
   children,
   border = false,
@@ -162,7 +162,8 @@ forwardRef) {
     // Middleware order matters, arrow should be last
     middleware: [react.offset(!isTabTip ? {
       alignmentAxis: alignmentAxisOffset,
-      mainAxis: popoverDimensions?.current?.offset
+      // Use 4px spacing when no caret, otherwise use the caret offset
+      mainAxis: caret ? popoverDimensions?.current?.offset : 4
     } : 0), autoAlign && react.flip({
       fallbackPlacements: isTabTip ? align.includes('bottom') ? ['bottom-start', 'bottom-end', 'top-start', 'top-end'] : ['top-start', 'top-end', 'bottom-start', 'bottom-end'] : align.includes('bottom') ? ['bottom', 'bottom-start', 'bottom-end', 'right', 'right-start', 'right-end', 'left', 'left-start', 'left-end', 'top', 'top-start', 'top-end'] : ['top', 'top-start', 'top-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end', 'bottom', 'bottom-start', 'bottom-end'],
       fallbackStrategy: 'initialPlacement',
@@ -299,10 +300,9 @@ forwardRef) {
       return item;
     }
   });
-  const BaseComponentAsAny = BaseComponent;
   return /*#__PURE__*/React.createElement(PopoverContext.Provider, {
     value: value
-  }, /*#__PURE__*/React.createElement(BaseComponentAsAny, _rollupPluginBabelHelpers.extends({}, rest, {
+  }, /*#__PURE__*/React.createElement(BaseComponent, _rollupPluginBabelHelpers.extends({}, rest, {
     className: className,
     ref: ref
   }), enableFloatingStyles || isTabTip ? mappedChildren : children));

package/lib/components/ProgressIndicator/ProgressIndicator.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/ProgressIndicator/ProgressIndicator.js

@@ -67,7 +67,7 @@ function ProgressIndicator({
     if (index === currentIndex) {
       return /*#__PURE__*/React.cloneElement(child, {
         complete: child.props.complete,
-        current: child.props.complete ? false : true,
+        current: !child.props.complete,
         index,
         onClick
       });

package/lib/components/RadioButtonGroup/RadioButtonGroup.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/RadioButtonGroup/RadioButtonGroup.js

@@ -47,17 +47,14 @@ const RadioButtonGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
   } = props;
   const prefix = usePrefix.usePrefix();
   const [selected, setSelected] = React.useState(valueSelected ?? defaultSelected);
-  const [prevValueSelected, setPrevValueSelected] = React.useState(valueSelected);
+  const prevValueSelected = React.useRef(valueSelected);
   const radioButtonGroupInstanceId = useId.useId();
-
-  /**
-   * prop + state alignment - getDerivedStateFromProps
-   * only update if selected prop changes
-   */
-  if (valueSelected !== prevValueSelected) {
-    setSelected(valueSelected);
-    setPrevValueSelected(valueSelected);
-  }
+  React.useEffect(() => {
+    if (valueSelected !== prevValueSelected.current) {
+      setSelected(valueSelected);
+      prevValueSelected.current = valueSelected;
+    }
+  }, [valueSelected]);
   function getRadioButtons() {
     const mappedChildren = React.Children.map(children, radioButton => {
       if (!radioButton) {

package/lib/components/Search/Search.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/Search/Search.js

@@ -26,6 +26,7 @@ var FormContext = require('../FluidForm/FormContext.js');
 var noopFn = require('../../internal/noopFn.js');
 require('../Tooltip/DefinitionTooltip.js');
 var Tooltip = require('../Tooltip/Tooltip.js');
+var utils = require('./utils.js');
 
 var _Close;
 const Search = /*#__PURE__*/React.forwardRef(({
@@ -51,7 +52,7 @@ const Search = /*#__PURE__*/React.forwardRef(({
   value,
   ...rest
 }, forwardRef) => {
-  const hasPropValue = value || defaultValue ? true : false;
+  const hasPropValue = utils.isSearchValuePresent(value) || utils.isSearchValuePresent(defaultValue);
   const prefix = usePrefix.usePrefix();
   const {
     isFluid
@@ -78,7 +79,7 @@ const Search = /*#__PURE__*/React.forwardRef(({
     [`${prefix}--search-close--hidden`]: !hasContent || !isExpanded
   });
   if (value !== prevValue) {
-    setHasContent(!!value);
+    setHasContent(utils.isSearchValuePresent(value));
     setPrevValue(value);
   }
   function clearInput() {

package/lib/components/Search/utils.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright IBM Corp. 2026
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export declare const isSearchValuePresent: (value: string | number | undefined) => boolean;

package/lib/components/Search/utils.js

@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+const isSearchValuePresent = value => value !== '' && typeof value !== 'undefined';
+
+exports.isSearchValuePresent = isSearchValuePresent;

package/lib/components/Select/Select.d.ts

@@ -4,7 +4,7 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import React, { type ChangeEventHandler, type ComponentPropsWithRef, type ReactNode } from 'react';
+import React, { type ChangeEventHandler, type ComponentPropsWithRef, type ReactNode, type SelectHTMLAttributes } from 'react';
 type ExcludedAttributes = 'size';
 export interface SelectProps extends Omit<ComponentPropsWithRef<'select'>, ExcludedAttributes> {
     /**
@@ -22,7 +22,7 @@ export interface SelectProps extends Omit<ComponentPropsWithRef<'select'>, Exclu
     /**
      * Optionally provide the default value of the `<select>`
      */
-    defaultValue?: any;
+    defaultValue?: SelectHTMLAttributes<HTMLSelectElement>['defaultValue'];
     /**
      * Specify whether the control is disabled
      */

package/lib/components/Select/Select.js

@@ -38,7 +38,7 @@ const Select = /*#__PURE__*/React.forwardRef(({
   hideLabel = false,
   invalid = false,
   invalidText = '',
-  helperText = '',
+  helperText,
   light = false,
   readOnly,
   size,
@@ -111,7 +111,7 @@ const Select = /*#__PURE__*/React.forwardRef(({
     ariaProps['aria-describedby'] = helper ? normalizedProps.helperId : undefined;
   }
   const handleFocus = evt => {
-    setIsFocused(evt.type === 'focus' ? true : false);
+    setIsFocused(evt.type === 'focus');
   };
   const handleChange = evt => {
     const selectedOption = evt?.target?.options[evt.target.selectedIndex];

package/lib/components/SelectItem/SelectItem.d.ts

@@ -1,11 +1,11 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 import PropTypes from 'prop-types';
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes, type OptionHTMLAttributes } from 'react';
 export interface SelectItemProps extends HTMLAttributes<HTMLOptionElement> {
     /**
      * Specify an optional className to be applied to the node
@@ -26,7 +26,7 @@ export interface SelectItemProps extends HTMLAttributes<HTMLOptionElement> {
     /**
      * Specify the value of the <SelectItem>
      */
-    value: any;
+    value: OptionHTMLAttributes<HTMLOptionElement>['value'];
 }
 declare const SelectItem: {
     ({ className, value, disabled, hidden, text, ...other }: SelectItemProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/StructuredList/StructuredList.js

@@ -152,8 +152,8 @@ 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/20452
-  const rowId = id ?? useId.useId('grid-input');
+  const generatedRowId = useId.useId('grid-input');
+  const rowId = id ?? generatedRowId;
   const selectedRow = React.useContext(GridSelectedRowStateContext);
   const setSelectedRow = React.useContext(GridSelectedRowDispatchContext);
   const prefix = usePrefix.usePrefix();

package/lib/components/Tabs/Tabs.js

@@ -850,8 +850,8 @@ const Tab = /*#__PURE__*/React.forwardRef(({
     if (tabRef.current && tabRef.current.parentElement) {
       // determine number of tabs, excluding disabled
       const tabCount = Array.from(tabRef.current.parentElement.childNodes).filter(node => {
-        const element = node;
-        return element.classList.contains(`${prefix}--tabs__nav-link`) && !element.classList.contains(`${prefix}--tabs__nav-item--disabled`);
+        if (!(node instanceof HTMLElement)) return false;
+        return node.classList.contains(`${prefix}--tabs__nav-link`) && !node.classList.contains(`${prefix}--tabs__nav-item--disabled`);
       }).length;
 
       // if not removing last tab focus on next tab
@@ -861,7 +861,10 @@ const Tab = /*#__PURE__*/React.forwardRef(({
       // if removing last tab focus on previous tab
       else {
         const prevTabIndex = (tabCount - 2) * 2;
-        tabRef.current.parentElement.childNodes[prevTabIndex]?.focus();
+        const previousTab = tabRef.current.parentElement.childNodes[prevTabIndex];
+        if (previousTab instanceof HTMLElement) {
+          previousTab.focus();
+        }
       }
     }
   };
@@ -1162,7 +1165,9 @@ function TabPanels({
       // set max height to TabList
       const heights = refs.current.map(ref => ref?.offsetHeight || 0);
       const max = Math.max(...heights);
-      tabContainer.style.height = max + 'px';
+      if (tabContainer instanceof HTMLElement) {
+        tabContainer.style.height = max + 'px';
+      }
 
       // re-hide hidden Tab Panels
       refs.current.forEach((ref, index) => {

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

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/Tag/DismissibleTag.js

@@ -49,8 +49,8 @@ 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/20452
-  const tagId = id || `tag-${useId.useId()}`;
+  const generatedTagId = useId.useId();
+  const tagId = id ?? `tag-${generatedTagId}`;
   const tagClasses = cx(`${prefix}--tag--filter`, className);
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
   useIsomorphicEffect.default(() => {

package/lib/components/Tag/OperationalTag.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/Tag/OperationalTag.js

@@ -49,8 +49,8 @@ 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/20452
-  const tagId = id || `tag-${useId.useId()}`;
+  const generatedTagId = useId.useId();
+  const tagId = id ?? `tag-${generatedTagId}`;
   const tagClasses = cx(`${prefix}--tag--operational`, className);
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
   useIsomorphicEffect.default(() => {

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

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/Tag/SelectableTag.js

@@ -41,8 +41,8 @@ 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/20452
-  const tagId = id || `tag-${useId.useId()}`;
+  const generatedTagId = useId.useId();
+  const tagId = id ?? `tag-${generatedTagId}`;
   const [selectedTag, setSelectedTag] = useControllableState.useControllableState({
     value: selected,
     onChange: onChange,

package/lib/components/Tag/Tag.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/Tag/Tag.js

@@ -78,8 +78,8 @@ const TagBase = /*#__PURE__*/React.forwardRef(({
     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/20452
-  const tagId = id || `tag-${useId.useId()}`;
+  const generatedTagId = useId.useId();
+  const tagId = id ?? `tag-${generatedTagId}`;
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
   useIsomorphicEffect.default(() => {
     const newElement = tagRef.current?.getElementsByClassName(`${prefix}--tag__label`)[0];

package/lib/components/TextArea/TextArea.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -7,8 +7,7 @@
 import React, { type ReactNode } from 'react';
 export interface TextAreaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
     /**
-     * Provide a custom className that is applied directly to the underlying
-     * `<textarea>` node
+     * Provide a custom className that is applied to the wrapper node
      */
     className?: string;
     /**

package/lib/components/TextArea/TextArea.js

@@ -42,7 +42,7 @@ const TextArea = frFn((props, forwardRef) => {
     onKeyDown = noopFn.noopFn,
     invalid = false,
     invalidText = '',
-    helperText = '',
+    helperText,
     light,
     placeholder = '',
     enableCounter = false,
@@ -243,7 +243,7 @@ const TextArea = frFn((props, forwardRef) => {
     ariaDescribedBy = warnId;
   } else {
     const ids = [];
-    if (!isFluid && helperText && helperId) ids.push(helperId);
+    if (!isFluid && hasHelper && helperId) ids.push(helperId);
     if (counterDescriptionId) ids.push(counterDescriptionId);
     ariaDescribedBy = ids.length > 0 ? ids.join(' ') : undefined;
   }
@@ -282,7 +282,7 @@ const TextArea = frFn((props, forwardRef) => {
   }, [ariaAnnouncement, prevAnnouncement, counterMode]);
   const input = /*#__PURE__*/React.createElement("textarea", _rollupPluginBabelHelpers.extends({}, other, textareaProps, {
     placeholder: placeholder,
-    "aria-readonly": other.readOnly ? true : false,
+    "aria-readonly": other.readOnly,
     className: textareaClasses,
     "aria-invalid": invalid,
     "aria-describedby": ariaDescribedBy,
@@ -328,8 +328,7 @@ const TextArea = frFn((props, forwardRef) => {
 TextArea.displayName = 'TextArea';
 TextArea.propTypes = {
   /**
-   * Provide a custom className that is applied directly to the underlying
-   * `<textarea>` node
+   * Provide a custom className that is applied to the wrapper node
    */
   className: PropTypes.string,
   /**

package/lib/components/TextInput/ControlledPasswordInput.js

@@ -31,7 +31,7 @@ const ControlledPasswordInput = /*#__PURE__*/React.forwardRef(({
   hideLabel,
   invalid = false,
   invalidText = '',
-  helperText = '',
+  helperText,
   light,
   type = 'password',
   togglePasswordVisibility,

package/lib/components/TimePickerSelect/TimePickerSelect.d.ts

@@ -1,10 +1,10 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import React from 'react';
+import React, { type SelectHTMLAttributes } from 'react';
 export type TimePickerSelectProps = {
     /**
      * Provide the contents of your TimePickerSelect
@@ -17,7 +17,7 @@ export type TimePickerSelectProps = {
     /**
      * Optionally provide the default value of the `<select>`
      */
-    defaultValue?: any;
+    defaultValue?: SelectHTMLAttributes<HTMLSelectElement>['defaultValue'];
     /**
      * Specify whether the control is disabled
      */
@@ -39,7 +39,7 @@ declare const TimePickerSelect: React.ForwardRefExoticComponent<{
     /**
      * Optionally provide the default value of the `<select>`
      */
-    defaultValue?: any;
+    defaultValue?: SelectHTMLAttributes<HTMLSelectElement>["defaultValue"];
     /**
      * Specify whether the control is disabled
      */

package/lib/components/Toggletip/index.js

@@ -138,8 +138,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/20452
-      if (open && node && !ref.current.contains(node)) {
+      if (open && node && !ref.current?.contains(node)) {
         setOpen(false);
       }
     };