@carbon/react 1.80.1 → 1.81.0

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

package/lib/components/OverflowMenu/index.js

@@ -9,22 +9,26 @@
 
 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');
 var OverflowMenu$1 = require('./OverflowMenu.js');
-var createClassWrapper = require('../../internal/createClassWrapper.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 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(OverflowMenu$1.OverflowMenu, _rollupPluginBabelHelpers["extends"]({}, props, {
+    ref: ref
+  }));
+});
 OverflowMenu.displayName = 'OverflowMenu';
+OverflowMenu.propTypes = OverflowMenu$1.OverflowMenu.propTypes;
 
 exports.OverflowMenu = OverflowMenu;
 exports["default"] = 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.d.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { type ComponentType, type FunctionComponent } from 'react';
+import { Tabs as BaseTabs } from '../Tabs/Tabs';
 /**
  * ----------
  * PageHeader
@@ -87,6 +88,11 @@ interface PageHeaderTabBarProps {
     className?: string;
 }
 declare const PageHeaderTabBar: React.ForwardRefExoticComponent<PageHeaderTabBarProps & React.RefAttributes<HTMLDivElement>>;
+interface PageHeaderTabsProps extends React.ComponentProps<typeof BaseTabs> {
+    children?: React.ReactNode;
+    className?: string;
+}
+declare const PageHeaderTabs: React.ForwardRefExoticComponent<PageHeaderTabsProps & React.RefAttributes<HTMLDivElement>>;
 /**
  * -------
  * Exports
@@ -97,5 +103,6 @@ declare const BreadcrumbBar: React.ForwardRefExoticComponent<PageHeaderBreadcrum
 declare const Content: React.ForwardRefExoticComponent<PageHeaderContentProps & React.RefAttributes<HTMLDivElement>>;
 declare const HeroImage: React.ForwardRefExoticComponent<PageHeaderHeroImageProps & React.RefAttributes<HTMLDivElement>>;
 declare const TabBar: React.ForwardRefExoticComponent<PageHeaderTabBarProps & React.RefAttributes<HTMLDivElement>>;
-export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderHeroImage, PageHeaderTabBar, Root, BreadcrumbBar, Content, HeroImage, TabBar, };
-export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderHeroImageProps, PageHeaderTabBarProps, };
+declare const Tabs: React.ForwardRefExoticComponent<PageHeaderTabsProps & React.RefAttributes<HTMLDivElement>>;
+export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderHeroImage, PageHeaderTabBar, PageHeaderTabs, Root, BreadcrumbBar, Content, HeroImage, TabBar, Tabs, };
+export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderHeroImageProps, PageHeaderTabBarProps, PageHeaderTabsProps, };

package/lib/components/PageHeader/PageHeader.js

@@ -20,6 +20,7 @@ require('../Text/index.js');
 var DefinitionTooltip = require('../Tooltip/DefinitionTooltip.js');
 require('../Tooltip/Tooltip.js');
 var AspectRatio = require('../AspectRatio/AspectRatio.js');
+var Tabs$1 = require('../Tabs/Tabs.js');
 var Text = require('../Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -28,7 +29,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _p, _p2, _p3;
+var _p, _p2;
 
 /**
  * ----------
@@ -153,7 +154,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
@@ -228,9 +229,18 @@ const PageHeaderTabBar = /*#__PURE__*/React__default["default"].forwardRef(funct
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: classNames,
     ref: ref
-  }, other), _p3 || (_p3 = /*#__PURE__*/React__default["default"].createElement("p", null, "page header tab bar")), children);
+  }, other), children);
 });
 PageHeaderTabBar.displayName = 'PageHeaderTabBar';
+const PageHeaderTabs = /*#__PURE__*/React__default["default"].forwardRef(function PageHeaderTabs(_ref6, ref) {
+  let {
+    className,
+    children,
+    ...other
+  } = _ref6;
+  return /*#__PURE__*/React__default["default"].createElement(Tabs$1.Tabs, other, children);
+});
+PageHeaderTabs.displayName = 'PageHeaderTabs';
 
 /**
  * -------
@@ -247,6 +257,8 @@ const HeroImage = PageHeaderHeroImage;
 HeroImage.displayName = 'PageHeaderHeroImage';
 const TabBar = PageHeaderTabBar;
 TabBar.displayName = 'PageHeaderTabBar';
+const Tabs = PageHeaderTabs;
+Tabs.displayName = 'PageHeader.Tabs';
 
 exports.BreadcrumbBar = BreadcrumbBar;
 exports.Content = Content;
@@ -256,5 +268,7 @@ exports.PageHeaderBreadcrumbBar = PageHeaderBreadcrumbBar;
 exports.PageHeaderContent = PageHeaderContent;
 exports.PageHeaderHeroImage = PageHeaderHeroImage;
 exports.PageHeaderTabBar = PageHeaderTabBar;
+exports.PageHeaderTabs = PageHeaderTabs;
 exports.Root = Root;
 exports.TabBar = TabBar;
+exports.Tabs = Tabs;

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

@@ -4,5 +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.
  */
-export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderTabBar, PageHeaderHeroImage, Root, BreadcrumbBar, Content, TabBar, HeroImage, } from './PageHeader';
-export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderTabBarProps, PageHeaderHeroImageProps, } from './PageHeader';
+export { PageHeader, PageHeaderBreadcrumbBar, PageHeaderContent, PageHeaderTabBar, PageHeaderHeroImage, PageHeaderTabs, Root, BreadcrumbBar, Content, TabBar, HeroImage, Tabs, } from './PageHeader';
+export type { PageHeaderProps, PageHeaderBreadcrumbBarProps, PageHeaderContentProps, PageHeaderTabBarProps, PageHeaderHeroImageProps, PageHeaderTabsProps, } from './PageHeader';

package/lib/components/PageHeader/index.js

@@ -21,5 +21,7 @@ exports.PageHeaderBreadcrumbBar = PageHeader.PageHeaderBreadcrumbBar;
 exports.PageHeaderContent = PageHeader.PageHeaderContent;
 exports.PageHeaderHeroImage = PageHeader.PageHeaderHeroImage;
 exports.PageHeaderTabBar = PageHeader.PageHeaderTabBar;
+exports.PageHeaderTabs = PageHeader.PageHeaderTabs;
 exports.Root = PageHeader.Root;
 exports.TabBar = PageHeader.TabBar;
+exports.Tabs = PageHeader.Tabs;

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 {

package/lib/components/Popover/index.js

@@ -56,7 +56,9 @@ const propMappingFunction = deprecatedValue => {
   };
   return mapping[deprecatedValue];
 };
-const Popover = /*#__PURE__*/React__default["default"].forwardRef(function PopoverRenderFunction(_ref, forwardRef) {
+const Popover = /*#__PURE__*/React__default["default"].forwardRef(function PopoverRenderFunction(_ref,
+//this is a workaround, have to come back and fix this.
+forwardRef) {
   let {
     isTabTip,
     align: initialAlign = isTabTip ? 'bottom-start' : 'bottom',
@@ -86,8 +88,11 @@ const Popover = /*#__PURE__*/React__default["default"].forwardRef(function Popov
       onRequestClose?.();
     }
   });
-  useEvent.useWindowEvent('click', event => {
-    if (open && !popover?.current?.contains(event.target)) {
+  useEvent.useWindowEvent('click', _ref2 => {
+    let {
+      target
+    } = _ref2;
+    if (open && target instanceof Node && !popover.current?.contains(target)) {
       onRequestClose?.();
     }
   });
@@ -361,12 +366,12 @@ Popover.propTypes = {
   open: PropTypes__default["default"].bool.isRequired
 };
 function PopoverContentRenderFunction(// eslint-disable-next-line react/prop-types
-_ref2, forwardRef) {
+_ref3, forwardRef) {
   let {
     className,
     children,
     ...rest
-  } = _ref2;
+  } = _ref3;
   const prefix = usePrefix.usePrefix();
   const {
     setFloating,

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

@@ -13,7 +13,7 @@ export interface PortalProps {
     /**
      * Provide a ref for a container node to render the portal
      */
-    container?: React.RefObject<HTMLElement>;
+    container?: React.RefObject<HTMLElement | null>;
 }
 /**
  * Helper component for rendering content within a portal. By default, the

package/lib/components/Search/Search.js

@@ -232,7 +232,6 @@ Search.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 role for the underlying `<input>`, defaults to `searchbox`

package/lib/components/SkeletonText/SkeletonText.js

@@ -69,7 +69,9 @@ const SkeletonText = _ref => {
     lines.push(/*#__PURE__*/React__default["default"].createElement("p", _rollupPluginBabelHelpers["extends"]({
       className: skeletonTextClasses,
       key: i,
-      ref: el => refs.current = [...refs.current, el]
+      ref: el => {
+        refs.current = [...refs.current, el];
+      }
     }, rest)));
   }
   if (lineCountNumber !== 1) {

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

@@ -319,9 +319,9 @@ declare class Slider extends PureComponent<SliderProps> {
         correctedPosition: null;
         isRtl: boolean;
     };
-    thumbRef: React.RefObject<HTMLDivElement>;
-    thumbRefUpper: React.RefObject<HTMLDivElement>;
-    filledTrackRef: React.RefObject<HTMLDivElement>;
+    thumbRef: React.RefObject<HTMLDivElement | null>;
+    thumbRefUpper: React.RefObject<HTMLDivElement | null>;
+    filledTrackRef: React.RefObject<HTMLDivElement | null>;
     element: HTMLDivElement | null;
     inputId: string;
     track: HTMLDivElement | null | undefined;
@@ -339,16 +339,6 @@ declare class Slider extends PureComponent<SliderProps> {
      * should be called.
      */
     componentDidUpdate(prevProps: any, prevState: any): void;
-    /**
-     * Synonymous to ECMA2017+ `Math.clamp`.
-     *
-     * @param {number} val
-     * @param {number} min
-     * @param {number} max
-     *
-     * @returns `val` if `max>=val>=min`; `min` if `val<min`; `max` if `val>max`.
-     */
-    clamp(val: any, min: any, max: any): number;
     /**
      * Rounds a given value to the nearest step defined by the slider's `step`
      * prop.

package/lib/components/Slider/Slider.js

@@ -23,6 +23,7 @@ require('../Text/index.js');
 require('../Tooltip/DefinitionTooltip.js');
 var Tooltip = require('../Tooltip/Tooltip.js');
 var SliderHandles = require('./SliderHandles.js');
+var clamp = require('../../internal/clamp.js');
 var throttle = require('../../node_modules/es-toolkit/dist/compat/function/throttle.mjs.js');
 var Text = require('../Text/Text.js');
 
@@ -574,7 +575,7 @@ class Slider extends React.PureComponent {
         range
       });
       /** `leftPercentRaw` clamped between 0 and 1. */
-      const leftPercent = Math.min(1, Math.max(0, leftPercentRaw));
+      const leftPercent = clamp.clamp(leftPercentRaw, 0, 1);
       if (useRawValue) {
         return {
           value,
@@ -865,19 +866,6 @@ class Slider extends React.PureComponent {
     }
   }
 
-  /**
-   * Synonymous to ECMA2017+ `Math.clamp`.
-   *
-   * @param {number} val
-   * @param {number} min
-   * @param {number} max
-   *
-   * @returns `val` if `max>=val>=min`; `min` if `val<min`; `max` if `val>max`.
-   */
-  clamp(val, min, max) {
-    return Math.max(min, Math.min(val, max));
-  }
-
   /**
    * Rounds a given value to the nearest step defined by the slider's `step`
    * prop.

package/lib/components/Tabs/Tabs.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import PropTypes from 'prop-types';
-import React, { type ReactNode, type MouseEvent, type KeyboardEvent, type HTMLAttributes, type ComponentType, type ReactHTML } from 'react';
+import React, { type ReactNode, type MouseEvent, type KeyboardEvent, type HTMLAttributes, type ComponentType, type HTMLElementType } from 'react';
 type DivAttributes = HTMLAttributes<HTMLDivElement>;
 /**
  * Tabs
@@ -312,7 +312,7 @@ export interface TabProps extends HTMLAttributes<HTMLElement> {
     /**
      * Provide a custom element to render instead of the default button
      */
-    as?: keyof ReactHTML | ComponentType;
+    as?: HTMLElementType | ComponentType;
     /**
      * Provide child elements to be rendered inside `Tab`.
      */

package/lib/components/Tabs/Tabs.js

@@ -88,6 +88,9 @@ function Tabs(_ref) {
     onTabCloseRequest
   } = _ref;
   const baseId = useId.useId('ccs');
+  if (dismissable && !onTabCloseRequest) {
+    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
   const [activeIndex, setActiveIndex] = React.useState(defaultSelectedIndex);
   // The selected index is used for the tab/panel pairing which is "visible"
@@ -289,7 +292,8 @@ function TabList(_ref4) {
   let hasSecondaryLabelTabs = false;
   if (contained) {
     hasSecondaryLabelTabs = React__default["default"].Children.toArray(children).some(child => {
-      return reactIs.isElement(child) && !!child.props.secondaryLabel;
+      const _child = child;
+      return /*#__PURE__*/React__default["default"].isValidElement(child) && !!_child.props.secondaryLabel;
     });
   }
   const isLg = useMatchMedia.useMatchMedia(lgMediaQuery);
@@ -653,7 +657,7 @@ function TabListVertical(_ref8) {
       if (containerTop && containerHeight) {
         // scrolls so selected tab is in view
         if (selectedPositionTop - halfTabHeight < containerTop || selectedPositionTop - containerTop + verticalTabHeight + halfTabHeight > containerHeight) {
-          ref.current.scrollTo({
+          ref.current && ref.current.scrollTo({
             top: (selectedIndex - 1) * verticalTabHeight,
             behavior: 'smooth'
           });
@@ -994,7 +998,6 @@ Tab.propTypes = {
   /**
    * Provide a custom element to render instead of the default button
    */
-  // @ts-expect-error: Invalid prop type derivation
   as: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].elementType]),
   /**
    * Provide child elements to be rendered inside `Tab`.
@@ -1025,7 +1028,6 @@ Tab.propTypes = {
   /**
    * A component used to render an icon.
    */
-  // @ts-expect-error: Invalid prop type derivation
   renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
   /**
    * An optional label to render under the primary tab label.
@@ -1054,7 +1056,7 @@ const IconTab = /*#__PURE__*/React__default["default"].forwardRef(function IconT
   const value = React.useMemo(() => ({
     badgeIndicator
   }), [badgeIndicator]);
-  const hasSize20 = /*#__PURE__*/React__default["default"].isValidElement(children) && children.props?.size === 20;
+  const hasSize20 = /*#__PURE__*/React.isValidElement(children) && children.props.size === 20;
   const classNames = cx__default["default"](`${prefix}--tabs__nav-item--icon-only`, customClassName, {
     [`${prefix}--tabs__nav-item--icon-only__20`]: hasSize20
   });

package/lib/components/Tabs/usePressable.js

@@ -14,7 +14,7 @@ var React = require('react');
 /* istanbul ignore file */
 
 /**
- * @param {React.RefObject<HTMLElement>} ref
+ * @param {React.RefObject<HTMLElement | null>} ref
  *
  * @param {{
  *   onPress?(state: { longPress: boolean }): void,

package/lib/components/Tag/Tag.js

@@ -50,7 +50,7 @@ const SIZES = {
   md: 'md',
   lg: 'lg'
 };
-const Tag = /*#__PURE__*/React__default["default"].forwardRef((_ref, forwardRef) => {
+const TagBase = /*#__PURE__*/React__default["default"].forwardRef((_ref, forwardRef) => {
   let {
     children,
     className,
@@ -71,7 +71,13 @@ const Tag = /*#__PURE__*/React__default["default"].forwardRef((_ref, forwardRef)
     ...other
   } = _ref;
   const prefix = usePrefix.usePrefix();
-  const tagRef = React.useRef();
+  const tagRef = React.useRef(null);
+  if (filter) {
+    console.warn('The `filter` prop for Tag has been deprecated and will be removed in the next major version. Use DismissibleTag instead.');
+  }
+  if (onClose) {
+    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]);
   const tagId = id || `tag-${useId.useId()}`;
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
@@ -151,6 +157,7 @@ const Tag = /*#__PURE__*/React__default["default"].forwardRef((_ref, forwardRef)
     className: `${prefix}--tag__decorator`
   }, normalizedDecorator) : '');
 });
+const Tag = TagBase;
 Tag.propTypes = {
   /**
    * Provide an alternative tag or component to use instead of the default