@carbon/react 1.99.0 → 1.100.0-rc.0

package/es/components/ListBox/ListBoxField.d.ts

@@ -4,13 +4,46 @@
  * 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 HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
+import PropTypes from 'prop-types';
 export interface ListBoxFieldProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Specify if the parent <ListBox> is disabled
      */
     disabled?: boolean;
 }
-export type ListBoxFieldComponent = React.FC<ListBoxFieldProps>;
+/**
+ * `ListBoxField` is responsible for creating the containing node for valid
+ * elements inside of a field. It also provides a11y-related attributes like
+ * `role` to make sure a user can focus the given field.
+ */
+declare function ListBoxField({ children, disabled, tabIndex, ...rest }: ListBoxFieldProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ListBoxField {
+    var propTypes: {
+        /**
+         * Typically set by `getToggleButtonProps`, this should specify whether the
+         * field has a popup.
+         */
+        'aria-haspopup': PropTypes.Requireable<NonNullable<string | boolean | null | undefined>>;
+        /**
+         * Provide the contents of your ListBoxField
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify if the parent <ListBox> is disabled
+         */
+        disabled: PropTypes.Requireable<boolean>;
+        /**
+         * The role for the component, should be set by `getToggleButtonProps` coming
+         * from Downshift
+         */
+        role: PropTypes.Requireable<string>;
+        /**
+         * Optional prop to specify the tabIndex of the <ListBox> trigger button
+         */
+        tabIndex: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+    };
+}
+export type ListBoxFieldComponent = typeof ListBoxField;
 declare const _default: ListBoxFieldComponent;
 export default _default;

package/es/components/ListBox/ListBoxMenuIcon.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 from 'react';
+import PropTypes from 'prop-types';
 import type { TranslateWithId } from '../../types/common';
 declare const translationIds: {
     readonly 'close.menu': "close.menu";
@@ -18,10 +18,23 @@ export interface ListBoxMenuIconProps extends TranslateWithId<TranslationKey> {
      */
     isOpen: boolean;
 }
-export type ListBoxMenuIconComponent = React.FC<ListBoxMenuIconProps>;
+export type ListBoxMenuIconComponent = typeof ListBoxMenuIcon;
 /**
  * `ListBoxMenuIcon` is used to orient the icon up or down depending on the
  * state of the menu for a given `ListBox`
  */
-declare const ListBoxMenuIcon: ListBoxMenuIconComponent;
+declare const ListBoxMenuIcon: {
+    ({ isOpen, translateWithId: t, }: ListBoxMenuIconProps): import("react/jsx-runtime").JSX.Element;
+    propTypes: {
+        /**
+         * Specify whether the menu is currently open, which will influence the
+         * direction of the menu icon
+         */
+        isOpen: PropTypes.Validator<boolean>;
+        /**
+         * Translates component strings using your i18n tool.
+         */
+        translateWithId: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+};
 export default ListBoxMenuIcon;

package/es/components/ListBox/ListBoxMenuItem.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/es/components/ListBox/ListBoxSelection.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 from 'react';
+import PropTypes from 'prop-types';
 import { KeyboardEvent, MouseEvent } from 'react';
 import type { TranslateWithId } from '../../types/common';
 export interface ListBoxSelectionProps extends TranslateWithId<TranslationKey> {
@@ -32,7 +32,7 @@ export interface ListBoxSelectionProps extends TranslateWithId<TranslationKey> {
      */
     selectionCount?: number;
 }
-export type ListBoxSelectionComponent = React.FC<ListBoxSelectionProps>;
+export type ListBoxSelectionComponent = typeof ListBoxSelection;
 declare const translationIds: {
     readonly 'clear.all': "clear.all";
     readonly 'clear.selection': "clear.selection";
@@ -43,5 +43,36 @@ type TranslationKey = keyof typeof translationIds;
  * addition to conditionally rendering a badge if the control has more than one
  * selection.
  */
-declare const ListBoxSelection: ListBoxSelectionComponent;
+declare const ListBoxSelection: {
+    ({ clearSelection, selectionCount, translateWithId: t, disabled, onClearSelection, readOnly, }: ListBoxSelectionProps): import("react/jsx-runtime").JSX.Element;
+    propTypes: {
+        /**
+         * Specify a function to be invoked when a user interacts with the clear
+         * selection element.
+         */
+        clearSelection: PropTypes.Validator<(...args: any[]) => any>;
+        /**
+         * Specify whether or not the clear selection element should be disabled
+         */
+        disabled: PropTypes.Requireable<boolean>;
+        /**
+         * Specify an optional `onClearSelection` handler that is called when the underlying
+         * element is cleared
+         */
+        onClearSelection: PropTypes.Requireable<(...args: any[]) => any>;
+        /**
+         * Whether or not the Dropdown is readonly
+         */
+        readOnly: PropTypes.Requireable<boolean>;
+        /**
+         * Specify an optional `selectionCount` value that will be used to determine
+         * whether the selection should display a badge or a single clear icon.
+         */
+        selectionCount: PropTypes.Requireable<number>;
+        /**
+         * Translates component strings using your i18n tool.
+         */
+        translateWithId: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+};
 export default ListBoxSelection;

package/es/components/Menu/MenuItem.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, { ComponentProps, FC, KeyboardEvent, LiHTMLAttributes, MouseEvent, ReactNode } from 'react';
+import React, { type ComponentProps, type ElementType, type KeyboardEvent, type LiHTMLAttributes, type MouseEvent, type ReactNode } from 'react';
 export interface MenuItemProps extends LiHTMLAttributes<HTMLLIElement> {
     /**
      * Optionally provide another Menu to create a submenu. props.children can't be used to specify the content of the MenuItem itself. Use props.label instead.
@@ -33,7 +33,7 @@ export interface MenuItemProps extends LiHTMLAttributes<HTMLLIElement> {
     /**
      * A component used to render an icon.
      */
-    renderIcon?: FC;
+    renderIcon?: ElementType;
     /**
      * Provide a shortcut for the action of this MenuItem. Note that the component will only render it as a hint but not actually register the shortcut.
      */

package/es/components/MultiSelect/FilterableMultiSelect.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { type UseComboboxProps, type UseMultipleSelectionProps } from 'downshift';
-import React, { type FunctionComponent, type ReactElement, type ReactNode } from 'react';
+import React, { type ReactElement, type ReactNode } from 'react';
 import { type MultiSelectSortingProps } from './MultiSelectPropTypes';
 import { type ListBoxMenuIconTranslationKey, type ListBoxSelectionTranslationKey, type ListBoxSize, type ListBoxType } from '../ListBox';
 import type { TranslateWithId } from '../../types/common';
@@ -93,7 +93,7 @@ export interface FilterableMultiSelectProps<ItemType> extends MultiSelectSorting
      * Function to render items as custom components instead of strings.
      * Defaults to null and is overridden by a getter
      */
-    itemToElement?: FunctionComponent<ItemType>;
+    itemToElement?: (item: ItemType) => ReactNode;
     /**
      * Helper function passed to downshift that allows the library to render
      * a given item to a string label.

package/es/components/MultiSelect/FilterableMultiSelect.js

@@ -33,6 +33,7 @@ import { useFloating, autoUpdate, flip, size, hide } from '@floating-ui/react';
 import { AILabel } from '../AILabel/index.js';
 import { defaultItemToString } from '../../internal/defaultItemToString.js';
 import { isComponentElement } from '../../internal/utils.js';
+import { useNormalizedInputProps } from '../../internal/useNormalizedInputProps.js';
 import { ListBoxTypePropType, ListBoxSizePropType } from '../ListBox/ListBoxPropTypes.js';
 
 const {
@@ -71,7 +72,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
   hideLabel,
   id,
   initialSelectedItems = [],
-  invalid,
+  invalid = false,
   invalidText,
   items,
   itemToElement: ItemToElement,
@@ -93,7 +94,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
   sortItems = defaultSortItems,
   translateWithId,
   useTitleInItem,
-  warn,
+  warn = false,
   warnText,
   slug,
   inputProps
@@ -237,15 +238,23 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
     return sortedReal;
     // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20452
   }, [items, inputValue, controlledSelectedItems, topItems, selectionFeedback, itemToString, compareItems, locale, sortItems, nonSelectAllItems]);
+  const normalizedProps = useNormalizedInputProps({
+    id,
+    disabled,
+    readOnly,
+    invalid,
+    warn
+  });
   const inline = type === 'inline';
-  const showWarning = !invalid && warn;
+  const showWarning = normalizedProps.warn;
+  const showHelperText = !normalizedProps.warn && !normalizedProps.invalid;
   const wrapperClasses = cx(`${prefix}--multi-select__wrapper`, `${prefix}--multi-select--filterable__wrapper`, `${prefix}--list-box__wrapper`, containerClassName, {
     [`${prefix}--multi-select__wrapper--inline`]: inline,
     [`${prefix}--list-box__wrapper--inline`]: inline,
-    [`${prefix}--multi-select__wrapper--inline--invalid`]: inline && invalid,
-    [`${prefix}--list-box__wrapper--inline--invalid`]: inline && invalid,
+    [`${prefix}--multi-select__wrapper--inline--invalid`]: inline && normalizedProps.invalid,
+    [`${prefix}--list-box__wrapper--inline--invalid`]: inline && normalizedProps.invalid,
     [`${prefix}--list-box--up`]: direction === 'top',
-    [`${prefix}--list-box__wrapper--fluid--invalid`]: isFluid && invalid,
+    [`${prefix}--list-box__wrapper--fluid--invalid`]: isFluid && normalizedProps.invalid,
     [`${prefix}--list-box__wrapper--slug`]: slug,
     [`${prefix}--list-box__wrapper--decorator`]: decorator,
     [`${prefix}--autoalign`]: autoAlign
@@ -519,8 +528,8 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
   // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
   item => !item.isSelectAll).length;
   const className = cx(`${prefix}--multi-select`, `${prefix}--combo-box`, `${prefix}--multi-select--filterable`, {
-    [`${prefix}--multi-select--invalid`]: invalid,
-    [`${prefix}--multi-select--invalid--focused`]: invalid && inputFocused,
+    [`${prefix}--multi-select--invalid`]: normalizedProps.invalid,
+    [`${prefix}--multi-select--invalid--focused`]: inputFocused && normalizedProps.invalid,
     [`${prefix}--multi-select--open`]: isOpen,
     [`${prefix}--multi-select--inline`]: inline,
     [`${prefix}--multi-select--selected`]: controlledSelectedItems?.length > 0,
@@ -552,7 +561,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
   });
   const inputProp = getInputProps(getDropdownProps({
     'aria-controls': isOpen ? menuId : undefined,
-    'aria-describedby': helperText && !invalid && !warn ? helperId : undefined,
+    'aria-describedby': helperText && showHelperText ? helperId : undefined,
     'aria-haspopup': 'listbox',
     // Remove excess aria `aria-labelledby`. HTML <label for>
     // provides this aria information.
@@ -647,9 +656,9 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
     light: light,
     ref: ref,
     id: id,
-    invalid: invalid,
+    invalid: normalizedProps.invalid,
     invalidText: invalidText,
-    warn: warn,
+    warn: normalizedProps.warn,
     warnText: warnText,
     isOpen: !readOnly && isOpen,
     size: size$1
@@ -673,7 +682,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
     ref: mergedRef
   }, readOnlyEventHandlers, {
     readOnly: readOnly
-  })), invalid && /*#__PURE__*/React.createElement(WarningFilled, {
+  })), normalizedProps.invalid && /*#__PURE__*/React.createElement(WarningFilled, {
     className: `${prefix}--list-box__invalid-icon`
   }), showWarning && /*#__PURE__*/React.createElement(WarningAltFilled, {
     className: `${prefix}--list-box__invalid-icon ${prefix}--list-box__invalid-icon--warning`
@@ -742,7 +751,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
       disabled: disabled,
       tabIndex: -1
     })));
-  }) : null)), !inline && !invalid && !warn ? helper : null);
+  }) : null)), !inline && showHelperText ? helper : null);
 });
 FilterableMultiSelect.displayName = 'FilterableMultiSelect';
 FilterableMultiSelect.propTypes = {

package/es/components/MultiSelect/MultiSelect.js

@@ -32,6 +32,7 @@ import { useFeatureFlag } from '../FeatureFlags/index.js';
 import { AILabel } from '../AILabel/index.js';
 import { defaultItemToString } from '../../internal/defaultItemToString.js';
 import { isComponentElement } from '../../internal/utils.js';
+import { useNormalizedInputProps } from '../../internal/useNormalizedInputProps.js';
 import { ListBoxTypePropType, ListBoxSizePropType } from '../ListBox/ListBoxPropTypes.js';
 
 const {
@@ -71,9 +72,9 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
   clearAnnouncement = 'all items have been cleared',
   clearSelectionDescription = 'Total items selected: ',
   light,
-  invalid,
+  invalid = false,
   invalidText,
-  warn,
+  warn = false,
   warnText,
   useTitleInItem,
   translateWithId,
@@ -254,14 +255,22 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
     setIsOpenWrapper(open);
     setPrevOpenProp(open);
   }
+  const normalizedProps = useNormalizedInputProps({
+    id,
+    disabled,
+    readOnly,
+    invalid,
+    warn
+  });
   const inline = type === 'inline';
-  const showWarning = !invalid && warn;
+  const showWarning = normalizedProps.warn;
+  const showHelperText = !normalizedProps.warn && !normalizedProps.invalid && helperText;
   const wrapperClasses = cx(`${prefix}--multi-select__wrapper`, `${prefix}--list-box__wrapper`, containerClassName, {
     [`${prefix}--multi-select__wrapper--inline`]: inline,
     [`${prefix}--list-box__wrapper--inline`]: inline,
-    [`${prefix}--multi-select__wrapper--inline--invalid`]: inline && invalid,
-    [`${prefix}--list-box__wrapper--inline--invalid`]: inline && invalid,
-    [`${prefix}--list-box__wrapper--fluid--invalid`]: isFluid && invalid,
+    [`${prefix}--multi-select__wrapper--inline--invalid`]: inline && normalizedProps.invalid,
+    [`${prefix}--list-box__wrapper--inline--invalid`]: inline && normalizedProps.invalid,
+    [`${prefix}--list-box__wrapper--fluid--invalid`]: isFluid && normalizedProps.invalid,
     [`${prefix}--list-box__wrapper--slug`]: slug,
     [`${prefix}--list-box__wrapper--decorator`]: decorator
   });
@@ -275,8 +284,8 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
     [`${prefix}--form__helper-text--disabled`]: disabled
   });
   const className = cx(`${prefix}--multi-select`, {
-    [`${prefix}--multi-select--invalid`]: invalid,
-    [`${prefix}--multi-select--invalid--focused`]: invalid && inputFocused,
+    [`${prefix}--multi-select--invalid`]: normalizedProps.invalid,
+    [`${prefix}--multi-select--invalid--focused`]: inputFocused && normalizedProps.invalid,
     [`${prefix}--multi-select--warning`]: showWarning,
     [`${prefix}--multi-select--inline`]: inline,
     [`${prefix}--multi-select--selected`]: selectedItems && selectedItems.length > 0,
@@ -447,13 +456,13 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
     className: className,
     disabled: disabled,
     light: light,
-    invalid: invalid,
+    invalid: normalizedProps.invalid,
     invalidText: invalidText,
-    warn: warn,
+    warn: normalizedProps.warn,
     warnText: warnText,
     isOpen: isOpen,
     id: id
-  }, invalid && /*#__PURE__*/React.createElement(WarningFilled, {
+  }, normalizedProps.invalid && /*#__PURE__*/React.createElement(WarningFilled, {
     className: `${prefix}--list-box__invalid-icon`
   }), showWarning && /*#__PURE__*/React.createElement(WarningAltFilled, {
     className: `${prefix}--list-box__invalid-icon ${prefix}--list-box__invalid-icon--warning`
@@ -473,7 +482,7 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
     className: `${prefix}--list-box__field`,
     disabled: disabled,
     "aria-disabled": disabled || readOnly,
-    "aria-describedby": !inline && !invalid && !warn && helperText ? helperId : undefined
+    "aria-describedby": !inline && showHelperText ? helperId : undefined
   }, toggleButtonProps, {
     ref: mergedRef
   }, readOnlyEventHandlers), /*#__PURE__*/React.createElement("span", {
@@ -528,7 +537,7 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
   })), itemsCleared && /*#__PURE__*/React.createElement("span", {
     "aria-live": "assertive",
     "aria-label": clearAnnouncement
-  })), !inline && !invalid && !warn && helperText && /*#__PURE__*/React.createElement("div", {
+  })), !inline && showHelperText && /*#__PURE__*/React.createElement("div", {
     id: helperId,
     className: helperClasses
   }, helperText));

package/es/components/Notification/Notification.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,6 +7,7 @@
 import PropTypes from 'prop-types';
 import React, { type ReactNode, type MouseEvent, type ButtonHTMLAttributes, type HTMLAttributes, type ComponentProps } from 'react';
 import Button, { type ButtonProps } from '../Button';
+type NotificationCloseHandler = ((event: MouseEvent) => boolean) | ((event: MouseEvent) => void);
 export interface NotificationActionButtonProps extends ButtonProps<'button'> {
     /**
      * Specify the content of the notification action button.
@@ -151,7 +152,7 @@ export interface ToastNotificationProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Provide a function that is called when menu is closed
      */
-    onClose?(event: MouseEvent): boolean | void;
+    onClose?: NotificationCloseHandler;
     /**
      * Provide a function that is called when the close button is clicked
      */
@@ -277,7 +278,7 @@ export interface InlineNotificationProps extends HTMLAttributes<HTMLDivElement>
     /**
      * Provide a function that is called when menu is closed
      */
-    onClose?(event: MouseEvent): boolean | void;
+    onClose?: NotificationCloseHandler;
     /**
      * Provide a function that is called when the close button is clicked
      */
@@ -409,7 +410,7 @@ export interface ActionableNotificationProps extends HTMLAttributes<HTMLDivEleme
      * Provide a function that is called when menu is closed.
      * Default behavior of hiding the notification is prevented if this function returns false.
      */
-    onClose?(event: MouseEvent): boolean | void;
+    onClose?: NotificationCloseHandler;
     /**
      * Provide a function that is called when the close button is clicked
      */
@@ -617,6 +618,6 @@ export declare namespace Callout {
 /**
  * @deprecated Use `CalloutProps` instead.
  */
-export interface StaticNotificationProps extends CalloutProps {
-}
-export declare const StaticNotification: React.FC<StaticNotificationProps>;
+export type StaticNotificationProps = CalloutProps;
+export declare const StaticNotification: (props: StaticNotificationProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/es/components/Notification/Notification.js

@@ -810,7 +810,6 @@ Callout.propTypes = {
 /**
  * @deprecated Use `CalloutProps` instead.
  */
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type -- https://github.com/carbon-design-system/carbon/issues/20452
 
 let didWarnAboutDeprecation = false;
 const StaticNotification = props => {

package/es/components/OverflowMenu/OverflowMenu.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/es/components/OverflowMenu/OverflowMenu.js

@@ -75,7 +75,6 @@ const getMenuOffset = (menuBody, direction, trigger, flip) => {
     case 'top':
     case 'bottom':
       {
-        // TODO: Ensure `trigger` is there for `<OverflowMenu open>`
         const triggerWidth = !trigger ? 0 : trigger.offsetWidth;
         return {
           left: (!flip ? 1 : -1) * (menuWidth / 2 - triggerWidth / 2),

package/es/components/OverflowMenu/index.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/es/components/PageHeader/PageHeader.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 ComponentType, type FunctionComponent } from 'react';
+import React, { type ElementType } from 'react';
 import PropTypes from 'prop-types';
 import { TYPES } from '../Tag/Tag';
 /**
@@ -32,7 +32,7 @@ interface PageHeaderBreadcrumbBarProps {
     /**
      * Provide an optional icon to render in front of the PageHeaderContent's title.
      */
-    renderIcon?: ComponentType | FunctionComponent;
+    renderIcon?: ElementType;
     /**
      * The PageHeaderBreadcrumbBar's content actions
      */
@@ -68,7 +68,7 @@ interface PageHeaderContentProps {
     /**
      * Provide an optional icon to render in front of the PageHeaderContent's title.
      */
-    renderIcon?: ComponentType | FunctionComponent;
+    renderIcon?: ElementType;
     /**
      * The PageHeaderContent's title
      */

package/es/components/Popover/index.js

@@ -9,13 +9,13 @@ import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin.js';
-import React, { useRef, useMemo, useEffect } from 'react';
+import React, { forwardRef, useRef, useEffect, useMemo } from 'react';
 import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
 import { useMergedRefs } from '../../internal/useMergedRefs.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { useEvent, useWindowEvent } from '../../internal/useEvent.js';
 import { mapPopoverAlign } from '../../tools/mapPopoverAlign.js';
-import { useFloating, autoUpdate, offset, flip, arrow, hide } from '@floating-ui/react';
+import { useFloating, offset, flip, arrow, hide, autoUpdate } from '@floating-ui/react';
 import { useFeatureFlag } from '../FeatureFlags/index.js';
 
 const PopoverContext = /*#__PURE__*/React.createContext({
@@ -147,7 +147,9 @@ forwardRef) {
     refs,
     floatingStyles,
     placement,
-    middlewareData
+    middlewareData,
+    elements,
+    update
   } = useFloating(enableFloatingStyles ? {
     placement: align,
     // The floating element is positioned relative to its nearest
@@ -167,12 +169,18 @@ forwardRef) {
     }), arrow({
       element: caretRef,
       padding: 16
-    }), autoAlign && hide()],
-    whileElementsMounted: autoUpdate
+    }), autoAlign && hide()]
   } : {}
   // When autoAlign is turned off & the `enable-v12-dynamic-floating-styles` feature flag is not
   // enabled, floating-ui will not be used
   );
+  useEffect(() => {
+    if (!enableFloatingStyles) return;
+    if (open && elements.reference && elements.floating) {
+      const cleanup = autoUpdate(elements.reference, elements.floating, update);
+      return cleanup;
+    }
+  }, [enableFloatingStyles, open, elements, update]);
   const value = useMemo(() => {
     return {
       floating,
@@ -397,11 +405,13 @@ Popover.propTypes = {
    */
   open: PropTypes.bool.isRequired
 };
-function PopoverContentRenderFunction({
-  className,
-  children,
-  ...rest
-}, forwardRef) {
+const frFn = forwardRef;
+const PopoverContent = frFn((props, forwardRef) => {
+  const {
+    className,
+    children,
+    ...rest
+  } = props;
   const prefix = usePrefix();
   const {
     setFloating,
@@ -427,8 +437,7 @@ function PopoverContentRenderFunction({
     }),
     ref: caretRef
   }));
-}
-const PopoverContent = /*#__PURE__*/React.forwardRef(PopoverContentRenderFunction);
+});
 PopoverContent.displayName = 'PopoverContent';
 PopoverContent.propTypes = {
   /**

package/es/components/Search/Search.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 ChangeEvent, type ComponentType, type FunctionComponent, type HTMLAttributes, type KeyboardEvent, type MouseEvent, type ReactNode } from 'react';
+import React, { type ChangeEvent, type ElementType, type HTMLAttributes, type KeyboardEvent, type MouseEvent, type ReactNode } from 'react';
 type InputPropsBase = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'>;
 export interface SearchProps extends InputPropsBase {
     /**
@@ -61,7 +61,7 @@ export interface SearchProps extends InputPropsBase {
     /**
      * A component used to render an icon.
      */
-    renderIcon?: ComponentType | FunctionComponent;
+    renderIcon?: ElementType;
     /**
      * @deprecated Specify the role for the underlying `<input>`.
      * No longer needed since `<input type="search">` already provides the correct semantics.

package/es/components/Select/Select.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/es/components/Select/Select.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React, { useContext, useState, cloneElement } from 'react';
+import React, { forwardRef, useContext, useState, cloneElement } from 'react';
 import cx from 'classnames';
 import { ChevronDown, WarningFilled, WarningAltFilled } from '@carbon/icons-react';
 import { deprecate } from '../../prop-types/deprecate.js';
@@ -21,7 +21,7 @@ import { AILabel } from '../AILabel/index.js';
 import { isComponentElement } from '../../internal/utils.js';
 import { useNormalizedInputProps } from '../../internal/useNormalizedInputProps.js';
 
-const Select = /*#__PURE__*/React.forwardRef(({
+const Select = /*#__PURE__*/forwardRef(({
   className,
   decorator,
   id,

package/es/components/SkeletonIcon/SkeletonIcon.d.ts

@@ -1,9 +1,23 @@
-import React from 'react';
+/**
+ * Copyright IBM Corp. 2016, 2025
+ *
+ * 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';
 export interface SkeletonIconProps {
     /**
      * Specify an optional className to add.
      */
     className?: string;
 }
-declare const SkeletonIcon: React.FC<SkeletonIconProps>;
+declare const SkeletonIcon: {
+    ({ className, ...other }: SkeletonIconProps): import("react/jsx-runtime").JSX.Element;
+    propTypes: {
+        /**
+         * Specify an optional className to add.
+         */
+        className: PropTypes.Requireable<string>;
+    };
+};
 export default SkeletonIcon;

package/es/components/SkeletonText/SkeletonText.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.