@carbon/react 1.80.0 → 1.81.0-rc.0

package/lib/components/Layer/LayerLevel.d.ts

@@ -1,11 +1,11 @@
 /**
- * Copyright IBM Corp. 2023
+ * Copyright IBM Corp. 2023, 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.
  */
 export declare const levels: readonly ["one", "two", "three"];
-export declare const MIN_LEVEL = 0;
-export declare const MAX_LEVEL: number;
 export declare const LayerLevels: readonly [0, 1, 2];
+export declare const MIN_LEVEL: 0;
+export declare const MAX_LEVEL: 0 | 1 | 2;
 export type LayerLevel = (typeof LayerLevels)[number];

package/lib/components/Layer/LayerLevel.js

@@ -10,9 +10,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const levels = ['one', 'two', 'three'];
-const MIN_LEVEL = 0;
-const MAX_LEVEL = levels.length - 1;
+const LayerLevels = [0, 1, 2];
+const MIN_LEVEL = LayerLevels[0];
+const MAX_LEVEL = LayerLevels[LayerLevels.length - 1];
 
+exports.LayerLevels = LayerLevels;
 exports.MAX_LEVEL = MAX_LEVEL;
 exports.MIN_LEVEL = MIN_LEVEL;
 exports.levels = levels;

package/lib/components/Layer/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * 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.
@@ -31,5 +31,7 @@ export interface LayerBaseProps {
     level?: LayerLevel;
 }
 export type LayerProps<T extends React.ElementType> = PolymorphicComponentPropWithRef<T, LayerBaseProps>;
-declare const Layer: React.ForwardRefExoticComponent<Omit<LayerProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>>;
+declare const Layer: React.ForwardRefExoticComponent<LayerBaseProps & {
+    as?: React.ElementType;
+} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<any>>;
 export { Layer };

package/lib/components/Layer/index.js

@@ -16,6 +16,7 @@ var cx = require('classnames');
 var usePrefix = require('../../internal/usePrefix.js');
 var LayerContext = require('./LayerContext.js');
 var LayerLevel = require('./LayerLevel.js');
+var clamp = require('../../internal/clamp.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -47,7 +48,7 @@ const Layer = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
   const prefix = usePrefix.usePrefix();
   const className = cx__default["default"](`${prefix}--layer-${LayerLevel.levels[level]}`, customClassName);
   // The level should be between MIN_LEVEL and MAX_LEVEL
-  const value = Math.max(LayerLevel.MIN_LEVEL, Math.min(level + 1, LayerLevel.MAX_LEVEL));
+  const value = clamp.clamp(level + 1, LayerLevel.MIN_LEVEL, LayerLevel.MAX_LEVEL);
   const BaseComponent = as || 'div';
   return /*#__PURE__*/React__default["default"].createElement(LayerContext.LayerContext.Provider, {
     value: value

package/lib/components/Link/Link.js

@@ -21,7 +21,8 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const Link = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
+// First create the component with basic types
+const LinkBase = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
   let {
     as: BaseComponent,
     children,
@@ -64,6 +65,7 @@ const Link = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
     className: `${prefix}--link__icon`
   }, /*#__PURE__*/React__default["default"].createElement(Icon, null)));
 });
+const Link = LinkBase;
 Link.displayName = 'Link';
 Link.propTypes = {
   /**

package/lib/components/Menu/Menu.d.ts

@@ -9,7 +9,7 @@ export interface MenuProps extends React.HTMLAttributes<HTMLUListElement> {
     /**
      * The ref of the containing element, used for positioning and alignment of the menu
      */
-    containerRef?: RefObject<HTMLDivElement>;
+    containerRef?: RefObject<HTMLDivElement | null>;
     /**
      * A collection of MenuItems to be rendered within this Menu.
      */

package/lib/components/Menu/MenuContext.d.ts

@@ -28,7 +28,7 @@ declare function menuReducer(state: StateType, action: ActionType): {
 type DispatchFuncProps = {
     type: ActionType['type'];
     payload: {
-        ref: RefObject<HTMLLIElement>;
+        ref: RefObject<HTMLLIElement | null>;
         disabled: boolean;
     };
 };

package/lib/components/Modal/Modal.js

@@ -34,6 +34,7 @@ var index = require('../FeatureFlags/index.js');
 var events = require('../../tools/events.js');
 var deprecate = require('../../prop-types/deprecate.js');
 var index$1 = require('../Dialog/index.js');
+var warning = require('../../internal/warning.js');
 var debounce = require('../../node_modules/es-toolkit/dist/compat/function/debounce.mjs.js');
 var Text = require('../Text/Text.js');
 
@@ -97,19 +98,33 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     [`${prefix}--btn--loading`]: loadingStatus !== 'inactive'
   });
   const loadingActive = loadingStatus !== 'inactive';
-  const enableDialogElement = index.useFeatureFlag('enable-experimental-focus-wrap-without-sentinels') || index.useFeatureFlag('enable-dialog-element');
+  const focusTrapWithoutSentinels = index.useFeatureFlag('enable-experimental-focus-wrap-without-sentinels');
+  const enableDialogElement = index.useFeatureFlag('enable-dialog-element');
+  process.env.NODE_ENV !== "production" ? warning.warning(!(focusTrapWithoutSentinels && enableDialogElement), '`<Modal>` detected both `focusTrapWithoutSentinels` and ' + '`enableDialogElement` feature flags are enabled. The native dialog ' + 'element handles focus, so `enableDialogElement` must be off for ' + '`focusTrapWithoutSentinels` to have any effect.') : void 0;
   function isCloseButton(element) {
     return !onSecondarySubmit && element === secondaryButton.current || element.classList.contains(modalCloseButtonClass);
   }
   function handleKeyDown(evt) {
+    const {
+      target
+    } = evt;
     evt.stopPropagation();
     if (open) {
       if (match.match(evt, keys.Escape)) {
         onRequestClose(evt);
       }
-      if (match.match(evt, keys.Enter) && shouldSubmitOnEnter && !isCloseButton(evt.target)) {
+      if (match.match(evt, keys.Enter) && shouldSubmitOnEnter && target instanceof Element && !isCloseButton(target) && document.activeElement !== button.current) {
         onRequestSubmit(evt);
       }
+      if (focusTrapWithoutSentinels && !enableDialogElement && match.match(evt, keys.Tab) && innerModal.current) {
+        wrapFocus.wrapFocusWithoutSentinels({
+          containerNode: innerModal.current,
+          currentActiveNode: evt.target,
+          // TODO: Delete type assertion following util rewrite.
+          // https://github.com/carbon-design-system/carbon/pull/18913
+          event: evt
+        });
+      }
     }
   }
   function handleOnClick(evt) {
@@ -186,13 +201,13 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
   React.useEffect(() => {
     return () => {
       if (!enableDialogElement) {
-        toggleClass["default"](document.body, `${prefix}--body--with-modal-open`, false);
+        toggleClass.toggleClass(document.body, `${prefix}--body--with-modal-open`, false);
       }
     };
   }, [prefix, enableDialogElement]);
   React.useEffect(() => {
     if (!enableDialogElement) {
-      toggleClass["default"](document.body, `${prefix}--body--with-modal-open`, open ?? false);
+      toggleClass.toggleClass(document.body, `${prefix}--body--with-modal-open`, open ?? false);
     }
   }, [open, prefix, enableDialogElement]);
   React.useEffect(() => {
@@ -336,7 +351,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     iconDescription: loadingIconDescription,
     className: `${prefix}--inline-loading--btn`,
     onSuccess: onLoadingSuccess
-  })))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, !enableDialogElement && /*#__PURE__*/React__default["default"].createElement("span", {
+  })))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, !enableDialogElement && !focusTrapWithoutSentinels && /*#__PURE__*/React__default["default"].createElement("span", {
     ref: startTrap,
     tabIndex: 0,
     role: "link",
@@ -395,7 +410,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     iconDescription: loadingIconDescription,
     className: `${prefix}--inline-loading--btn`,
     onSuccess: onLoadingSuccess
-  })))), !enableDialogElement && /*#__PURE__*/React__default["default"].createElement("span", {
+  })))), !enableDialogElement && !focusTrapWithoutSentinels && /*#__PURE__*/React__default["default"].createElement("span", {
     ref: endTrap,
     tabIndex: 0,
     role: "link",

package/lib/components/ModalWrapper/ModalWrapper.d.ts

@@ -62,8 +62,8 @@ export default class ModalWrapper extends React.Component<ModalWrapperProps, Mod
         triggerButtonKind: PropTypes.Requireable<"primary" | "secondary" | "danger" | "ghost" | "danger--primary" | "danger--ghost" | "danger--tertiary" | "tertiary">;
         withHeader: PropTypes.Requireable<boolean>;
     };
-    triggerButton: React.RefObject<HTMLButtonElement>;
-    modal: React.RefObject<HTMLDivElement>;
+    triggerButton: React.RefObject<HTMLButtonElement | null>;
+    modal: React.RefObject<HTMLDivElement | null>;
     state: {
         isOpen: boolean;
     };

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

@@ -191,11 +191,11 @@ export interface FilterableMultiSelectProps<ItemType> extends MultiSelectSorting
      */
     warnText?: ReactNode;
 }
-declare const FilterableMultiSelect: {
-    <ItemType>(props: FilterableMultiSelectProps<ItemType>): ReactElement;
+export declare const FilterableMultiSelect: {
+    <ItemType>(props: FilterableMultiSelectProps<ItemType>): ReactElement<any>;
     propTypes?: any;
     contextTypes?: any;
     defaultProps?: any;
     displayName?: any;
 };
-export default FilterableMultiSelect;
+export {};

package/lib/components/MultiSelect/FilterableMultiSelect.js

@@ -73,7 +73,7 @@ const {
  * ends up just being defined as "string".)
  */
 
-const FilterableMultiSelect = /*#__PURE__*/React__default["default"].forwardRef(function FilterableMultiSelect(_ref, ref) {
+const FilterableMultiSelect = /*#__PURE__*/React.forwardRef(function FilterableMultiSelect(_ref, ref) {
   let {
     autoAlign = false,
     className: containerClassName,
@@ -659,6 +659,7 @@ const FilterableMultiSelect = /*#__PURE__*/React__default["default"].forwardRef(
     }, item)) : itemText)));
   }) : null)), !inline && !invalid && !warn ? helper : null);
 });
+FilterableMultiSelect.displayName = 'FilterableMultiSelect';
 FilterableMultiSelect.propTypes = {
   /**
    * Deprecated, aria-label is no longer needed
@@ -812,4 +813,4 @@ FilterableMultiSelect.propTypes = {
   warnText: PropTypes__default["default"].node
 };
 
-exports["default"] = FilterableMultiSelect;
+exports.FilterableMultiSelect = FilterableMultiSelect;

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

@@ -173,9 +173,5 @@ export interface MultiSelectProps<ItemType> extends MultiSelectSortingProps<Item
      */
     warnText?: ReactNode;
 }
-type MultiSelectComponentProps<ItemType> = React.PropsWithChildren<MultiSelectProps<ItemType>> & React.RefAttributes<HTMLButtonElement>;
-interface MultiSelectComponent {
-    <ItemType>(props: MultiSelectComponentProps<ItemType>): React.ReactElement | null;
-}
-declare const _default: MultiSelectComponent;
-export default _default;
+export declare const MultiSelect: React.ForwardRefExoticComponent<MultiSelectProps<unknown> & React.RefAttributes<HTMLButtonElement>>;
+export {};

package/lib/components/MultiSelect/MultiSelect.js

@@ -436,6 +436,16 @@ const MultiSelect = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref
     ref: enableFloatingStyles ? refs.setFloating : null
   }), [enableFloatingStyles, getMenuProps, refs.setFloating]);
   const labelProps = ! /*#__PURE__*/React.isValidElement(titleText) ? getLabelProps() : null;
+  const getSelectionStats = React.useCallback((selectedItems, filteredItems) => {
+    const hasIndividualSelections = selectedItems.some(selected => !selected.isSelectAll);
+    const nonSelectAllSelectedCount = selectedItems.filter(selected => !selected.isSelectAll).length;
+    const totalSelectableCount = filteredItems.filter(item => !item.isSelectAll && !item.disabled).length;
+    return {
+      hasIndividualSelections,
+      nonSelectAllSelectedCount,
+      totalSelectableCount
+    };
+  }, [selectedItems, filteredItems]);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: wrapperClasses
   }, /*#__PURE__*/React__default["default"].createElement("label", _rollupPluginBabelHelpers["extends"]({
@@ -489,7 +499,12 @@ const MultiSelect = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref
     className: `${prefix}--list-box__inner-wrapper--decorator`
   }, normalizedDecorator) : ''), /*#__PURE__*/React__default["default"].createElement(index$1["default"].Menu, menuProps, isOpen && sortItems(filteredItems, sortOptions).map((item, index) => {
     const isChecked = selectedItems.filter(selected => isEqual__default["default"](selected, item)).length > 0;
-    const isIndeterminate = selectedItems.length !== 0 && item['isSelectAll'] && !isChecked;
+    const {
+      hasIndividualSelections,
+      nonSelectAllSelectedCount,
+      totalSelectableCount
+    } = getSelectionStats(selectedItems, filteredItems);
+    const isIndeterminate = item['isSelectAll'] && hasIndividualSelections && nonSelectAllSelectedCount < totalSelectableCount;
     const itemProps = getItemProps({
       item,
       // we don't want Downshift to set aria-selected for us
@@ -712,4 +727,4 @@ MultiSelect.propTypes = {
   warnText: PropTypes__default["default"].node
 };
 
-exports["default"] = MultiSelect;
+exports.MultiSelect = MultiSelect;

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

@@ -4,7 +4,5 @@
  * 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 MultiSelect from './MultiSelect';
-import { default as FilterableMultiSelect } from './FilterableMultiSelect';
-export { FilterableMultiSelect, MultiSelect };
-export default MultiSelect;
+export * from './FilterableMultiSelect';
+export * from './MultiSelect';

package/lib/components/NumberInput/NumberInput.js

@@ -21,6 +21,7 @@ var deprecate = require('../../prop-types/deprecate.js');
 require('../FluidForm/FluidForm.js');
 var FormContext = require('../FluidForm/FormContext.js');
 require('../Text/index.js');
+var clamp = require('../../internal/clamp.js');
 var Text = require('../Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -183,7 +184,7 @@ const NumberInput = /*#__PURE__*/React__default["default"].forwardRef(function N
       const rawValue = direction === 'up' ? currentValue + step : currentValue - step;
       const precision = Math.max(getDecimalPlaces(currentValue), getDecimalPlaces(step));
       const floatValue = parseFloat(rawValue.toFixed(precision));
-      const newValue = typeof min !== 'undefined' && typeof max !== 'undefined' ? Math.min(Math.max(floatValue, min), max) : floatValue;
+      const newValue = clamp.clamp(floatValue, min ?? -Infinity, max ?? Infinity);
       const state = {
         value: allowEmpty && inputRef.current.value === '' && step === 0 ? '' : newValue,
         direction

package/lib/components/OverflowMenu/OverflowMenu.d.ts

@@ -6,6 +6,7 @@
  */
 import React, { type ElementType, type ReactNode, type Ref } from 'react';
 import { type MenuDirection, type MenuOffset } from '../../internal/FloatingMenu';
+import { PopoverAlignment } from '../Popover';
 /**
  * Calculates the offset for the floating menu.
  *
@@ -16,6 +17,10 @@ import { type MenuDirection, type MenuOffset } from '../../internal/FloatingMenu
  */
 export declare const getMenuOffset: MenuOffset;
 export interface OverflowMenuProps {
+    /**
+     * Specify how the trigger tooltip should be aligned.
+     */
+    align?: PopoverAlignment;
     /**
      * Specify a label to be read by screen readers on the container node
      */
@@ -105,7 +110,8 @@ export interface OverflowMenuProps {
      */
     size?: 'sm' | 'md' | 'lg';
     /**
-     * The ref to the HTML element that should receive focus when the OverflowMenu opens
+     * The ref to the overflow menu's trigger button element.
+     * @deprecated Use the standard React `ref` prop instead.
      */
     innerRef?: Ref<any>;
 }

package/lib/components/OverflowMenu/OverflowMenu.js

@@ -15,7 +15,6 @@ var iconsReact = require('@carbon/icons-react');
 var cx = require('classnames');
 var invariant = require('invariant');
 var PropTypes = require('prop-types');
-var ClickListener = require('../../internal/ClickListener.js');
 var FloatingMenu = require('../../internal/FloatingMenu.js');
 var keys = require('../../internal/keyboard/keys.js');
 var match = require('../../internal/keyboard/match.js');
@@ -25,6 +24,8 @@ var deprecate = require('../../prop-types/deprecate.js');
 var mergeRefs = require('../../tools/mergeRefs.js');
 var setupGetInstanceId = require('../../tools/setupGetInstanceId.js');
 var index = require('../IconButton/index.js');
+var useOutsideClick = require('../../internal/useOutsideClick.js');
+var deprecateValuesWithin = require('../../prop-types/deprecateValuesWithin.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -33,7 +34,7 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var invariant__default = /*#__PURE__*/_interopDefaultLegacy(invariant);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
-const getInstanceId = setupGetInstanceId["default"]();
+const getInstanceId = setupGetInstanceId.setupGetInstanceId();
 const on = function (target) {
   for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
     args[_key - 1] = arguments[_key];
@@ -100,8 +101,25 @@ const getMenuOffset = (menuBody, direction, trigger, flip) => {
       };
   }
 };
+
+// TODO: Replace this code when align mapping is consolidated.
+// https://github.com/carbon-design-system/carbon/pull/19081
+const propMappingFunction = deprecatedValue => {
+  const mapping = {
+    'top-left': 'top-start',
+    'top-right': 'top-end',
+    'bottom-left': 'bottom-start',
+    'bottom-right': 'bottom-end',
+    'left-bottom': 'left-end',
+    'left-top': 'left-start',
+    'right-bottom': 'right-end',
+    'right-top': 'right-start'
+  };
+  return mapping[deprecatedValue];
+};
 const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
+    align,
     ['aria-label']: ariaLabel = null,
     ariaLabel: deprecatedAriaLabel,
     children,
@@ -123,6 +141,7 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     renderIcon: IconElement = iconsReact.OverflowMenuVertical,
     selectorPrimaryFocus = '[data-floating-menu-primary-focus]',
     size = 'md',
+    innerRef,
     ...other
   } = _ref;
   const prefix = React.useContext(usePrefix.PrefixContext);
@@ -138,6 +157,7 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   const prevOpenState = React.useRef(open);
   /** The element ref of the tooltip's trigger button. */
   const triggerRef = React.useRef(null);
+  const wrapperRef = React.useRef(null);
 
   // Sync open prop changes.
   React.useEffect(() => {
@@ -161,6 +181,14 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     }
     prevOpenState.current = open;
   }, [open, onClose]);
+  useOutsideClick.useOutsideClick(wrapperRef, _ref2 => {
+    let {
+      target
+    } = _ref2;
+    if (open && (!menuBodyRef.current || target instanceof Node && !menuBodyRef.current.contains(target))) {
+      closeMenu();
+    }
+  });
   const focusMenuEl = React.useCallback(() => {
     if (triggerRef.current) {
       triggerRef.current.focus();
@@ -211,23 +239,18 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       evt.stopPropagation();
     }
   };
-  const handleClickOutside = evt => {
-    if (open && (!menuBodyRef.current || evt.target instanceof Node && !menuBodyRef.current.contains(evt.target))) {
-      closeMenu();
-    }
-  };
 
   /**
    * Focuses the next enabled overflow menu item given the currently focused
    * item index and direction to move.
    */
-  const handleOverflowMenuItemFocus = _ref2 => {
+  const handleOverflowMenuItemFocus = _ref3 => {
     let {
-      currentIndex,
+      currentIndex = 0,
       direction
-    } = _ref2;
+    } = _ref3;
     const enabledIndices = React.Children.toArray(children).reduce((acc, curr, i) => {
-      if (/*#__PURE__*/React.isValidElement(curr) && !curr.props.disabled) {
+      if (/*#__PURE__*/React__default["default"].isValidElement(curr) && !curr.props.disabled) {
         acc.push(i);
       }
       return acc;
@@ -325,12 +348,13 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   }, /*#__PURE__*/React.cloneElement(menuBody, {
     'data-floating-menu-direction': direction
   }));
-  return /*#__PURE__*/React__default["default"].createElement(ClickListener.ClickListener, {
-    onClickOutside: handleClickOutside
-  }, /*#__PURE__*/React__default["default"].createElement("span", {
+  const combinedRef = innerRef ? mergeRefs["default"](triggerRef, innerRef, ref) : mergeRefs["default"](triggerRef, ref);
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
     className: `${prefix}--overflow-menu__wrapper`,
-    "aria-owns": open ? menuBodyId : undefined
+    "aria-owns": open ? menuBodyId : undefined,
+    ref: wrapperRef
   }, /*#__PURE__*/React__default["default"].createElement(index.IconButton, _rollupPluginBabelHelpers["extends"]({}, other, {
+    align: align,
     type: "button",
     "aria-haspopup": true,
     "aria-expanded": open,
@@ -338,7 +362,7 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     className: overflowMenuClasses,
     onClick: handleClick,
     id: id,
-    ref: mergeRefs["default"](triggerRef, ref),
+    ref: combinedRef,
     size: size,
     label: iconDescription,
     kind: "ghost"
@@ -348,6 +372,35 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   })), open && hasMountedTrigger && wrappedMenuBody));
 });
 OverflowMenu.propTypes = {
+  /**
+   * Specify how the trigger should align with the tooltip
+   */
+  align: deprecateValuesWithin["default"](PropTypes__default["default"].oneOf(['top', 'top-left',
+  // deprecated use top-start instead
+  'top-right',
+  // deprecated use top-end instead
+
+  'bottom', 'bottom-left',
+  // deprecated use bottom-start instead
+  'bottom-right',
+  // deprecated use bottom-end instead
+
+  'left', 'left-bottom',
+  // deprecated use left-end instead
+  'left-top',
+  // deprecated use left-start instead
+
+  'right', 'right-bottom',
+  // deprecated use right-end instead
+  'right-top',
+  // deprecated use right-start instead
+
+  // new values to match floating-ui
+  'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-end', 'left-start', 'right-end', 'right-start']),
+  //allowed prop values
+  ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end'],
+  //optional mapper function
+  propMappingFunction),
   /**
    * Specify a label to be read by screen readers on the container node
    */
@@ -439,7 +492,6 @@ OverflowMenu.propTypes = {
   /**
    * A component used to render an icon.
    */
-  // @ts-expect-error: PropTypes are not expressive enough to cover this case
   renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
   /**
    * Specify a CSS selector that matches the DOM element that should

package/lib/components/OverflowMenu/index.d.ts

@@ -4,10 +4,8 @@
  * 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 OverflowMenuProps } from './OverflowMenu';
-declare const OverflowMenu: {
-    (props: OverflowMenuProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+import React from 'react';
+import type { OverflowMenuProps } from './OverflowMenu';
+declare const OverflowMenu: React.ForwardRefExoticComponent<OverflowMenuProps & React.RefAttributes<HTMLDivElement>>;
 export default OverflowMenu;
 export { OverflowMenu, type OverflowMenuProps };

package/lib/components/OverflowMenu/index.js

@@ -9,6 +9,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var index = require('../FeatureFlags/index.js');
 var index$1 = require('./next/index.js');
@@ -20,10 +21,14 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 const OverflowMenuV11 = createClassWrapper.createClassWrapper(OverflowMenu$1.OverflowMenu);
-const OverflowMenu = props => {
+const OverflowMenu = /*#__PURE__*/React.forwardRef((props, ref) => {
   const enableV12OverflowMenu = index.useFeatureFlag('enable-v12-overflowmenu');
-  return enableV12OverflowMenu ? /*#__PURE__*/React__default["default"].createElement(index$1.OverflowMenu, props) : /*#__PURE__*/React__default["default"].createElement(OverflowMenuV11, props);
-};
+  return enableV12OverflowMenu ? /*#__PURE__*/React__default["default"].createElement(index$1.OverflowMenu, _rollupPluginBabelHelpers["extends"]({}, props, {
+    ref: ref
+  })) : /*#__PURE__*/React__default["default"].createElement(OverflowMenuV11, _rollupPluginBabelHelpers["extends"]({}, props, {
+    ref: ref
+  }));
+});
 OverflowMenu.displayName = 'OverflowMenu';
 
 exports.OverflowMenu = OverflowMenu;

package/lib/components/OverflowMenu/next/index.js

@@ -177,7 +177,6 @@ OverflowMenu.propTypes = {
   /**
    * A component used to render an icon.
    */
-  // @ts-expect-error: PropTypes are not expressive enough to cover this case
   renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
   /**
    * Specify the size of the menu, from a list of available sizes.

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

@@ -40,6 +40,10 @@ export interface OverflowMenuItemProps extends React.HTMLAttributes<HTMLElement>
      * `true` to make this menu item a danger button.
      */
     isDelete?: boolean;
+    /**
+     * accepts a ref to the button element
+     */
+    ref?: (element: HTMLElement) => void;
     /**
      * `true` to require the title attribute.
      */

package/lib/components/PageHeader/PageHeader.js

@@ -153,7 +153,7 @@ PageHeaderContent.propTypes = {
   /**
    * Provide an optional icon to render in front of the PageHeaderContent's title.
    */
-  // @ts-expect-error: PropTypes are not expressive enough to cover this case
+
   renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
   /**
    * The PageHeaderContent's title

package/lib/components/PaginationNav/PaginationNav.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2020
+ * Copyright IBM Corp. 2020, 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.

package/lib/components/PaginationNav/PaginationNav.js

@@ -18,6 +18,7 @@ var index = require('../IconButton/index.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var layout = require('@carbon/layout');
 var useMatchMedia = require('../../internal/useMatchMedia.js');
+var clamp = require('../../internal/clamp.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -199,7 +200,7 @@ const PaginationNav = /*#__PURE__*/React__default["default"].forwardRef(function
       numberOfPages = itemsShown === 4 ? itemsShown : 5;
       break;
     case 'sm':
-      numberOfPages = Math.max(4, Math.min(itemsShown, 7));
+      numberOfPages = clamp.clamp(itemsShown, 4, 7);
       break;
     default:
       numberOfPages = 4;

package/lib/components/Popover/index.d.ts

@@ -1,10 +1,11 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * 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 React, { type WeakValidationMap } from 'react';
+import { WeakValidationMap } from 'prop-types';
+import React from 'react';
 import { type Boundary } from '@floating-ui/react';
 import { PolymorphicComponentPropWithRef } from '../../internal/PolymorphicProps';
 export interface PopoverContext {