@carbon/react 1.82.0 → 1.83.0-rc.0

package/lib/components/DatePicker/DatePicker.js

@@ -521,8 +521,11 @@ const DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function Da
     }
   }, [inline]);
   React.useEffect(() => {
-    //when value prop is set to empty, this clears the flatpicker's calendar instance and text input
-    if (value === '') {
+    // when value prop is manually reset, this clears the flatpickr calendar instance and text input
+    // run if both:
+    // 1. value prop is set to a falsy value (`""`, `undefined`, `null`, etc) OR an array of all falsy values
+    // 2. flatpickr instance contains values in its `selectedDates` property so it hasn't already been cleared
+    if ((!value || Array.isArray(value) && value.every(date => !date)) && calendarRef.current?.selectedDates.length) {
       calendarRef.current?.clear();
       if (startInputField.current) {
         startInputField.current.value = '';
@@ -605,7 +608,7 @@ const DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function Da
 DatePicker.propTypes = {
   /**
    * Flatpickr prop passthrough enables direct date input, and when set to false,
-   * we must clear dates manually by resetting the value prop to empty string making it a controlled input.
+   * we must clear dates manually by resetting the value prop to a falsy value (such as `""`, `null`, or `undefined`) or an array of all falsy values, making it a controlled input.
    */
   allowInput: PropTypes__default["default"].bool,
   /**

package/lib/components/FileUploader/FileUploaderButton.d.ts

@@ -81,7 +81,7 @@ declare namespace FileUploaderButton {
         /**
          * Specify the type of underlying button
          */
-        buttonKind: PropTypes.Requireable<string>;
+        buttonKind: PropTypes.Requireable<"primary" | "secondary" | "danger" | "ghost" | "danger--primary" | "danger--ghost" | "danger--tertiary" | "tertiary">;
         /**
          * Provide a custom className to be applied to the container node
          */

package/lib/components/FileUploader/FileUploaderButton.js

@@ -15,11 +15,12 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var keys = require('../../internal/keyboard/keys.js');
 var match = require('../../internal/keyboard/match.js');
-var types = require('../../prop-types/types.js');
 var uniqueId = require('../../tools/uniqueId.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var deprecate = require('../../prop-types/deprecate.js');
 var noopFn = require('../../internal/noopFn.js');
+var Button = require('../Button/Button.js');
+require('../Button/Button.Skeleton.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -123,7 +124,7 @@ FileUploaderButton.propTypes = {
   /**
    * Specify the type of underlying button
    */
-  buttonKind: PropTypes__default["default"].oneOf(types.ButtonKinds),
+  buttonKind: PropTypes__default["default"].oneOf(Button.ButtonKinds),
   /**
    * Provide a custom className to be applied to the container node
    */

package/lib/components/Grid/Column.d.ts

@@ -28,35 +28,35 @@ export interface ColumnBaseProps {
      * Specify column span for the `lg` breakpoint (Default breakpoint up to 1312px)
      * This breakpoint supports 16 columns by default.
      *
-     * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+     * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
      */
     lg?: ColumnSpan;
     /**
      * Specify column span for the `max` breakpoint. This breakpoint supports 16
      * columns by default.
      *
-     * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+     * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
      */
     max?: ColumnSpan;
     /**
      * Specify column span for the `md` breakpoint (Default breakpoint up to 1056px)
      * This breakpoint supports 8 columns by default.
      *
-     * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+     * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
      */
     md?: ColumnSpan;
     /**
      * Specify column span for the `sm` breakpoint (Default breakpoint up to 672px)
      * This breakpoint supports 4 columns by default.
      *
-     * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+     * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
      */
     sm?: ColumnSpan;
     /**
      * Specify column span for the `xlg` breakpoint (Default breakpoint up to
      * 1584px) This breakpoint supports 16 columns by default.
      *
-     * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+     * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
      */
     xlg?: ColumnSpan;
     /**

package/lib/components/Grid/Column.js

@@ -106,28 +106,28 @@ Column.propTypes = {
    * Specify column span for the `lg` breakpoint (Default breakpoint up to 1312px)
    * This breakpoint supports 16 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   lg: spanPropType,
   /**
    * Specify column span for the `max` breakpoint. This breakpoint supports 16
    * columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   max: spanPropType,
   /**
    * Specify column span for the `md` breakpoint (Default breakpoint up to 1056px)
    * This breakpoint supports 8 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   md: spanPropType,
   /**
    * Specify column span for the `sm` breakpoint (Default breakpoint up to 672px)
    * This breakpoint supports 4 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   sm: spanPropType,
   /**
@@ -139,7 +139,7 @@ Column.propTypes = {
    * Specify column span for the `xlg` breakpoint (Default breakpoint up to
    * 1584px) This breakpoint supports 16 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   xlg: spanPropType
 };
@@ -183,28 +183,28 @@ CSSGridColumn.propTypes = {
    * Specify column span for the `lg` breakpoint (Default breakpoint up to 1312px)
    * This breakpoint supports 16 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   lg: spanPropType,
   /**
    * Specify column span for the `max` breakpoint. This breakpoint supports 16
    * columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   max: spanPropType,
   /**
    * Specify column span for the `md` breakpoint (Default breakpoint up to 1056px)
    * This breakpoint supports 8 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   md: spanPropType,
   /**
    * Specify column span for the `sm` breakpoint (Default breakpoint up to 672px)
    * This breakpoint supports 4 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   sm: spanPropType,
   /**
@@ -220,7 +220,7 @@ CSSGridColumn.propTypes = {
    * Specify column span for the `xlg` breakpoint (Default breakpoint up to
    * 1584px) This breakpoint supports 16 columns by default.
    *
-   * @see https://www.carbondesignsystem.com/guidelines/layout#breakpoints
+   * @see https://carbondesignsystem.com/elements/2x-grid/overview/#breakpoints
    */
   xlg: spanPropType
 };

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

@@ -0,0 +1,8 @@
+/**
+ * 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.
+ */
+export { LayoutDirection } from './LayoutDirection';
+export { useLayoutDirection } from './useLayoutDirection';

package/lib/components/Menu/Menu.js

@@ -20,8 +20,9 @@ var useMergedRefs = require('../../internal/useMergedRefs.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var deprecate = require('../../prop-types/deprecate.js');
 var MenuContext = require('./MenuContext.js');
-var environment = require('../../internal/environment.js');
+require('../LayoutDirection/LayoutDirection.js');
 var useLayoutDirection = require('../LayoutDirection/useLayoutDirection.js');
+var environment = require('../../internal/environment.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/lib/components/Menu/MenuItem.js

@@ -22,8 +22,9 @@ var useMergedRefs = require('../../internal/useMergedRefs.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var Menu = require('./Menu.js');
 var MenuContext = require('./MenuContext.js');
-require('../Text/index.js');
+require('../LayoutDirection/LayoutDirection.js');
 var useLayoutDirection = require('../LayoutDirection/useLayoutDirection.js');
+require('../Text/index.js');
 var Text = require('../Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/lib/components/Modal/Modal.d.ts

@@ -32,7 +32,7 @@ export interface ModalProps extends ReactAttr<HTMLDivElement> {
      */
     className?: string;
     /**
-     * Specify an label for the close button of the modal; defaults to close
+     * Specify label for the close button of the modal; defaults to close
      */
     closeButtonLabel?: string;
     /**

package/lib/components/Modal/Modal.js

@@ -25,6 +25,7 @@ var wrapFocus = require('../../internal/wrapFocus.js');
 var useIsomorphicEffect = require('../../internal/useIsomorphicEffect.js');
 var useId = require('../../internal/useId.js');
 var usePrefix = require('../../internal/usePrefix.js');
+var usePreviousValue = require('../../internal/usePreviousValue.js');
 var keys = require('../../internal/keyboard/keys.js');
 var match = require('../../internal/keyboard/match.js');
 var index$2 = require('../IconButton/index.js');
@@ -89,6 +90,7 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
   const startTrap = React.useRef(null);
   const endTrap = React.useRef(null);
   const [isScrollable, setIsScrollable] = React.useState(false);
+  const prevOpen = usePreviousValue.usePreviousValue(open);
   const modalInstanceId = `modal-${useId.useId()}`;
   const modalLabelId = `${prefix}--modal-header__label--${modalInstanceId}`;
   const modalHeadingId = `${prefix}--modal-header__heading--${modalInstanceId}`;
@@ -211,14 +213,14 @@ const Modal = /*#__PURE__*/React__default["default"].forwardRef(function Modal(_
     }
   }, [open, prefix, enableDialogElement]);
   React.useEffect(() => {
-    if (!enableDialogElement && !open && launcherButtonRef) {
+    if (!enableDialogElement && prevOpen && !open && launcherButtonRef) {
       setTimeout(() => {
         if ('current' in launcherButtonRef) {
           launcherButtonRef.current?.focus();
         }
       });
     }
-  }, [open, launcherButtonRef, enableDialogElement]);
+  }, [open, prevOpen, launcherButtonRef, enableDialogElement]);
   React.useEffect(() => {
     if (!enableDialogElement) {
       const initialFocus = focusContainerElement => {
@@ -445,7 +447,7 @@ Modal.propTypes = {
    */
   className: PropTypes__default["default"].string,
   /**
-   * Specify an label for the close button of the modal; defaults to close
+   * Specify label for the close button of the modal; defaults to close
    */
   closeButtonLabel: PropTypes__default["default"].string,
   /**

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

@@ -73,6 +73,10 @@ export interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputEle
      * The label for the slider.
      */
     labelText?: ReactNode;
+    /**
+     * Specify whether you want the underlying label to be visually hidden
+     */
+    hideLabel?: boolean;
     /**
      * @deprecated
      * `true` to use the light version.
@@ -215,6 +219,10 @@ declare class Slider extends PureComponent<SliderProps> {
          * The label for the slider.
          */
         labelText: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Specify whether you want the underlying label to be visually hidden
+         */
+        hideLabel: PropTypes.Requireable<boolean>;
         /**
          * `true` to use the light version.
          */

package/lib/components/Slider/Slider.js

@@ -955,6 +955,7 @@ class Slider extends React.PureComponent {
       maxLabel = '',
       formatLabel = defaultFormatLabel,
       labelText,
+      hideLabel,
       step = 1,
       stepMultiplier: _stepMultiplier,
       inputType = 'number',
@@ -988,6 +989,7 @@ class Slider extends React.PureComponent {
     return /*#__PURE__*/React__default["default"].createElement(usePrefix.PrefixContext.Consumer, null, prefix => {
       const labelId = `${id}-label`;
       const labelClasses = cx__default["default"](`${prefix}--label`, {
+        [`${prefix}--visually-hidden`]: hideLabel,
         [`${prefix}--label--disabled`]: disabled
       });
       const containerClasses = cx__default["default"](`${prefix}--slider-container`, {
@@ -1241,6 +1243,10 @@ _rollupPluginBabelHelpers.defineProperty(Slider, "propTypes", {
    * The label for the slider.
    */
   labelText: PropTypes__default["default"].node,
+  /**
+   * Specify whether you want the underlying label to be visually hidden
+   */
+  hideLabel: PropTypes__default["default"].bool,
   /**
    * `true` to use the light version.
    */

package/lib/components/Tabs/Tabs.js

@@ -329,9 +329,12 @@ function TabList(_ref4) {
   });
   const tabs = React.useRef([]);
   const debouncedOnScroll = React.useCallback(() => {
-    return debounce.debounce(event => {
-      setScrollLeft(event.target.scrollLeft);
+    const updateScroll = debounce.debounce(() => {
+      if (ref.current) {
+        setScrollLeft(ref.current.scrollLeft);
+      }
     }, scrollDebounceWait);
+    updateScroll();
   }, [scrollDebounceWait]);
   function onKeyDown(event) {
     if (match.matches(event, [keys.ArrowRight, keys.ArrowLeft, keys.Home, keys.End])) {

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

@@ -20,6 +20,10 @@ export interface DismissibleTagBaseProps {
      * Specify if the `DismissibleTag` is disabled
      */
     disabled?: boolean;
+    /**
+     * Provide a custom tooltip label for the dismiss button
+     */
+    dismissTooltipLabel?: string;
     /**
      * Specify the id for the selectable tag.
      */

package/lib/components/Tag/DismissibleTag.js

@@ -46,6 +46,7 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
     text,
     tagTitle,
     type,
+    dismissTooltipLabel = 'Dismiss tag',
     ...other
   } = _ref;
   const prefix = usePrefix.usePrefix();
@@ -79,7 +80,7 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
     onClick,
     ...otherProps
   } = other;
-  const dismissLabel = `Dismiss "${text}"`;
+  const dismissActionLabel = isEllipsisApplied ? dismissTooltipLabel : title;
   return /*#__PURE__*/React__default["default"].createElement(Tag["default"], _rollupPluginBabelHelpers["extends"]({
     ref: combinedRef,
     type: type,
@@ -96,7 +97,7 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
   }, text), slug ? normalizedDecorator : decorator ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: `${prefix}--tag__decorator`
   }, normalizedDecorator) : '', /*#__PURE__*/React__default["default"].createElement(Tooltip.Tooltip, {
-    label: isEllipsisApplied ? dismissLabel : title,
+    label: dismissActionLabel,
     align: "bottom",
     className: tooltipClasses,
     leaveDelayMs: 0,
@@ -106,7 +107,7 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
     className: `${prefix}--tag__close-icon`,
     onClick: handleClose,
     disabled: disabled,
-    "aria-label": title
+    "aria-label": dismissActionLabel
   }, _Close || (_Close = /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, null))))));
 });
 DismissibleTag.propTypes = {
@@ -122,6 +123,10 @@ DismissibleTag.propTypes = {
    * Specify if the `DismissibleTag` is disabled
    */
   disabled: PropTypes__default["default"].bool,
+  /**
+   * Provide a custom tooltip label for the dismiss button
+   */
+  dismissTooltipLabel: PropTypes__default["default"].string,
   /**
    * Specify the id for the tag.
    */

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

@@ -36,6 +36,10 @@ export interface SelectableTagBaseProps {
      * Specify the state of the selectable tag.
      */
     selected?: boolean;
+    /**
+     * Specify the default state of the selectable tag.
+     */
+    defaultSelected?: boolean;
     /**
      * Specify the size of the Tag. Currently supports either `sm`,
      * `md` (default) or `lg` sizes.

package/lib/components/Tag/SelectableTag.js

@@ -21,6 +21,7 @@ var Tooltip = require('../Tooltip/Tooltip.js');
 require('../Text/index.js');
 var isEllipsisActive = require('./isEllipsisActive.js');
 var mergeRefs = require('../../tools/mergeRefs.js');
+var useControllableState = require('../../internal/useControllableState.js');
 var Text = require('../Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -37,15 +38,20 @@ const SelectableTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
     renderIcon,
     onChange,
     onClick,
-    selected = false,
+    selected,
     size,
     text,
+    defaultSelected = false,
     ...other
   } = _ref;
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
   const tagId = id || `tag-${useId.useId()}`;
-  const [selectedTag, setSelectedTag] = React.useState(selected);
+  const [selectedTag, setSelectedTag] = useControllableState.useControllableState({
+    value: selected,
+    onChange: onChange,
+    defaultValue: defaultSelected
+  });
   const tagClasses = cx__default["default"](`${prefix}--tag--selectable`, className, {
     [`${prefix}--tag--selectable-selected`]: selectedTag
   });
@@ -58,7 +64,6 @@ const SelectableTag = /*#__PURE__*/React.forwardRef((_ref, forwardRef) => {
   const combinedRef = mergeRefs["default"](tagRef, forwardRef);
   const handleClick = e => {
     setSelectedTag(!selectedTag);
-    onChange?.(!selectedTag);
     onClick?.(e);
   };
   if (isEllipsisApplied) {
@@ -125,6 +130,10 @@ SelectableTag.propTypes = {
    * Specify the state of the selectable tag.
    */
   selected: PropTypes__default["default"].bool,
+  /**
+   * Specify the default state of the selectable tag.
+   */
+  defaultSelected: PropTypes__default["default"].bool,
   /**
    * Specify the size of the Tag. Currently supports either `sm`,
    * `md` (default) or `lg` sizes.

package/lib/components/UIShell/Switcher.js

@@ -16,7 +16,7 @@ var usePrefix = require('../../internal/usePrefix.js');
 var useMergedRefs = require('../../internal/useMergedRefs.js');
 var PropTypes = require('prop-types');
 var AriaPropTypes = require('../../prop-types/AriaPropTypes.js');
-var getDisplayName = require('../../prop-types/tools/getDisplayName.js');
+var SwitcherItem = require('./SwitcherItem.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -48,7 +48,7 @@ const Switcher = /*#__PURE__*/React.forwardRef(function Switcher(props, forwardR
       direction
     } = _ref;
     const enabledIndices = React__default["default"].Children.toArray(children).reduce((acc, curr, i) => {
-      if (/*#__PURE__*/React__default["default"].isValidElement(curr) && Object.keys(curr.props).length !== 0 && getDisplayName["default"](curr.type) === 'SwitcherItem') {
+      if (/*#__PURE__*/React__default["default"].isValidElement(curr) && Object.keys(curr.props).length !== 0 && curr.type === SwitcherItem["default"]) {
         acc.push(i);
       }
       return acc;
@@ -76,7 +76,7 @@ const Switcher = /*#__PURE__*/React.forwardRef(function Switcher(props, forwardR
   };
   const childrenWithProps = React__default["default"].Children.toArray(children).map((child, index) => {
     // only setup click handlers if onChange event is passed
-    if (/*#__PURE__*/React__default["default"].isValidElement(child) && child.type && getDisplayName["default"](child.type) === 'SwitcherItem') {
+    if (/*#__PURE__*/React__default["default"].isValidElement(child) && child.type === SwitcherItem["default"]) {
       return /*#__PURE__*/React__default["default"].cloneElement(child, {
         handleSwitcherItemFocus,
         index,

package/lib/feature-flags.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 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.
+ */
+export {};

package/lib/index.js

@@ -195,6 +195,8 @@ var index$f = require('./components/Heading/index.js');
 var index$g = require('./components/IconButton/index.js');
 var index$h = require('./components/Layer/index.js');
 var index$2 = require('./components/Layout/index.js');
+var LayoutDirection = require('./components/LayoutDirection/LayoutDirection.js');
+var useLayoutDirection = require('./components/LayoutDirection/useLayoutDirection.js');
 var index$3 = require('./components/OverflowMenuV2/index.js');
 var index$i = require('./components/Popover/index.js');
 var ProgressBar = require('./components/ProgressBar/ProgressBar.js');
@@ -217,8 +219,6 @@ var Pagination = require('./components/Pagination/experimental/Pagination.js');
 var ContainedListItem = require('./components/ContainedList/ContainedListItem/ContainedListItem.js');
 var ContainedList = require('./components/ContainedList/ContainedList.js');
 var Slider_Skeleton = require('./components/Slider/Slider.Skeleton.js');
-var LayoutDirection = require('./components/LayoutDirection/LayoutDirection.js');
-var useLayoutDirection = require('./components/LayoutDirection/useLayoutDirection.js');
 var Text = require('./components/Text/Text.js');
 var TextDirection = require('./components/Text/TextDirection.js');
 var DataTable = require('./components/DataTable/DataTable.js');
@@ -474,6 +474,8 @@ exports.IconButtonKinds = index$g.IconButtonKinds;
 exports.Layer = index$h.Layer;
 exports.useLayer = index$h.useLayer;
 exports.unstable_Layout = index$2.Layout;
+exports.unstable_LayoutDirection = LayoutDirection.LayoutDirection;
+exports.unstable_useLayoutDirection = useLayoutDirection.useLayoutDirection;
 exports.unstable_OverflowMenuV2 = index$3.OverflowMenuV2;
 exports.Popover = index$i.Popover;
 exports.PopoverContent = index$i.PopoverContent;
@@ -509,8 +511,6 @@ exports.unstable_Pagination = Pagination["default"];
 exports.ContainedListItem = ContainedListItem["default"];
 exports.ContainedList = ContainedList["default"];
 exports.SliderSkeleton = Slider_Skeleton["default"];
-exports.unstable_LayoutDirection = LayoutDirection.LayoutDirection;
-exports.unstable_useLayoutDirection = useLayoutDirection.useLayoutDirection;
 exports.unstable_Text = Text.Text;
 exports.unstable_TextDirection = TextDirection.TextDirection;
 exports.DataTable = DataTable["default"];

package/lib/internal/debounce.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright IBM Corp. 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 { debounce } from 'es-toolkit/compat';
+export default debounce;

package/lib/internal/environment.d.ts

@@ -0,0 +1,12 @@
+/**
+ * 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.
+ */
+/**
+ * Indicate whether current execution environment can access the DOM.
+ *
+ * @see https://github.com/facebook/fbjs/blob/4d1751311d3f67af2dcce2e40df8512a23c7b9c6/packages/fbjs/src/core/ExecutionEnvironment.js#L12
+ */
+export declare const canUseDOM: boolean;

package/lib/internal/usePreviousValue.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Copyright IBM Corp. 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.
+ */
+/**
+ * Stores the previous value of a given input.
+ *
+ * @param value - The current value.
+ * @returns The value before the current render.
+ *
+ * @example
+ * const [count, setCount] = useState(0);
+ * const prevCount = usePreviousValue(count);
+ */
+export declare const usePreviousValue: <T>(value: T) => T | undefined;

package/lib/internal/usePreviousValue.js

@@ -0,0 +1,32 @@
+/**
+ * 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';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+/**
+ * Stores the previous value of a given input.
+ *
+ * @param value - The current value.
+ * @returns The value before the current render.
+ *
+ * @example
+ * const [count, setCount] = useState(0);
+ * const prevCount = usePreviousValue(count);
+ */
+const usePreviousValue = value => {
+  const ref = React.useRef(undefined);
+  React.useEffect(() => {
+    ref.current = value;
+  }, [value]);
+  return ref.current;
+};
+
+exports.usePreviousValue = usePreviousValue;

package/lib/prop-types/AriaPropTypes.d.ts

@@ -0,0 +1,8 @@
+/**
+ * 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 declare const AriaLabelPropType: PropTypes.ValidationMap<any>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.82.0",
+  "version": "1.83.0-rc.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -55,8 +55,8 @@
     "@carbon/feature-flags": "^0.26.0",
     "@carbon/icons-react": "^11.60.0",
     "@carbon/layout": "^11.34.0",
-    "@carbon/styles": "^1.81.0",
-    "@carbon/utilities": "^0.5.0",
+    "@carbon/styles": "^1.82.0-rc.0",
+    "@carbon/utilities": "^0.6.0-rc.0",
     "@floating-ui/react": "^0.27.4",
     "@ibm/telemetry-js": "^1.5.0",
     "classnames": "2.5.1",
@@ -147,5 +147,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "ec31b96c91af8208499180eaeae89eb08b7ac8c8"
+  "gitHead": "184bbaf4d986f623be415b47b933c56b19655774"
 }

package/telemetry.yml

@@ -322,6 +322,7 @@ collect:
         # Dialog
         - modal
         # DismissibleTag
+        - dismissTooltipLabel
         - tagTitle
         # ErrorBoundary
         - fallback