@carbon/react 1.102.0 → 1.103.0-rc.0

package/es/components/Breadcrumb/BreadcrumbItem.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React, { forwardRef, cloneElement, isValidElement } from 'react';
+import React, { cloneElement, forwardRef, isValidElement } from 'react';
 import cx from 'classnames';
 import Link from '../Link/Link.js';
 import { OverflowMenuHorizontal } from '@carbon/icons-react';

package/es/components/Button/Button.Skeleton.js

@@ -27,7 +27,8 @@ const ButtonSkeleton = ({
     [`${prefix}--btn--md`]: size === 'md',
     [`${prefix}--btn--lg`]: size === 'lg',
     [`${prefix}--btn--xl`]: size === 'xl',
-    [`${prefix}--btn--2xl`]: size === '2xl'
+    [`${prefix}--btn--2xl`]: size === '2xl',
+    [`${prefix}--layout--size-${size}`]: size
   });
   const commonProps = {
     className: buttonClasses,

package/es/components/Button/Button.d.ts

@@ -17,7 +17,7 @@ export declare const ButtonTooltipPositions: string[];
 export type ButtonTooltipPosition = (typeof ButtonTooltipPositions)[number];
 export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     /**
-     * Specify the message read by screen readers for the danger button variant
+     * Specify the message read by screen readers for the danger button variants
      */
     dangerDescription?: string;
     /**
@@ -38,7 +38,7 @@ export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonEl
      */
     isExpressive?: boolean;
     /**
-     * Specify whether the Button is currently selected. Only applies to the Ghost variant.
+     * Specify whether the Button is currently selected. Only applies to the icon only Ghost variant.
      */
     isSelected?: boolean;
     /**
@@ -63,7 +63,7 @@ export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonEl
     target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
     /**
      * Specify the alignment of the tooltip to the icon-only button.
-     * Can be one of: start, center, or end.
+     * Can be one of: `start`, `center`, or `end`.
      */
     tooltipAlignment?: ButtonTooltipAlignment;
     /**
@@ -77,7 +77,7 @@ export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonEl
     tooltipHighContrast?: boolean;
     /**
      * Specify the direction of the tooltip for icon-only buttons.
-     * Can be either top, right, bottom, or left.
+     * Can be either `top`, `right`, `bottom`, or `left`.
      */
     tooltipPosition?: ButtonTooltipPosition;
 }

package/es/components/Button/Button.js

@@ -127,7 +127,7 @@ Button.propTypes = {
    */
   className: PropTypes.string,
   /**
-   * Specify the message read by screen readers for the danger button variant
+   * Specify the message read by screen readers for the danger button variants
    */
   dangerDescription: PropTypes.string,
   /**
@@ -157,7 +157,7 @@ Button.propTypes = {
    */
   isExpressive: PropTypes.bool,
   /**
-   * Specify whether the Button is currently selected. Only applies to the Ghost variant.
+   * Specify whether the Button is currently selected. Only applies to the icon only Ghost variant.
    */
   isSelected: PropTypes.bool,
   /**
@@ -227,7 +227,7 @@ Button.propTypes = {
   target: PropTypes.string,
   /**
    * Specify the alignment of the tooltip to the icon-only button.
-   * Can be one of: start, center, or end.
+   * Can be one of: `start`, `center`, or `end`.
    */
   tooltipAlignment: PropTypes.oneOf(['start', 'center', 'end']),
   /**
@@ -241,7 +241,7 @@ Button.propTypes = {
   tooltipHighContrast: PropTypes.bool,
   /**
    * Specify the direction of the tooltip for icon-only buttons.
-   * Can be either top, right, bottom, or left.
+   * Can be either `top`, `right`, `bottom`, or `left`.
    */
   tooltipPosition: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
   /**

package/es/components/Button/index.js

@@ -7,7 +7,7 @@
 
 import Button from './Button.js';
 export { ButtonKinds, ButtonSizes, ButtonTooltipAlignments, ButtonTooltipPositions } from './Button.js';
-export { default as ButtonSkeleton } from './Button.Skeleton.js';
+export { ButtonSkeleton } from './Button.Skeleton.js';
 
 
 

package/es/components/ButtonSet/ButtonSet.js

@@ -62,7 +62,7 @@ const ButtonSet = /*#__PURE__*/forwardRef((props, ref) => {
     });
     resizeObserver.observe(fluidInnerRef.current);
     return () => resizeObserver.disconnect();
-  }, [isStacked, stacked]);
+  }, [fluid, stacked]);
   useEffect(() => {
     const newSortedChildren = React.Children.toArray(children);
     newSortedChildren.sort((a, b) => {

package/es/components/Checkbox/index.js

@@ -6,7 +6,7 @@
  */
 
 import Checkbox from './Checkbox.js';
-export { default as CheckboxSkeleton } from './Checkbox.Skeleton.js';
+export { CheckboxSkeleton } from './Checkbox.Skeleton.js';
 
 
 

package/es/components/ComboBox/ComboBox.js

@@ -283,8 +283,8 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
             if (isMatchingSelection) {
               return changes;
             }
-            const nextSelectedItem = items.find(item => itemToString(item) === inputValue) ?? inputValue;
-            const isCustomSelection = typeof nextSelectedItem === 'string' && !items.some(item => isEqual(item, nextSelectedItem));
+            const nextSelectedItem = inputValue === '' ? null : items.find(item => itemToString(item) === inputValue) ?? inputValue;
+            const isCustomSelection = typeof nextSelectedItem === 'string' && nextSelectedItem !== '' && !items.some(item => isEqual(item, nextSelectedItem));
             if (!isEqual(currentSelectedItem, nextSelectedItem) && onChange) {
               onChange({
                 selectedItem: nextSelectedItem,

package/es/components/ComposedModal/ComposedModal.js

@@ -257,9 +257,6 @@ const ComposedModalDialog = /*#__PURE__*/React.forwardRef(function ComposedModal
   const containerClass = cx(`${prefix}--modal-container`, size && `${prefix}--modal-container--${size}`, isFullWidth && `${prefix}--modal-container--full-width`, containerClassName);
 
   // Generate aria-label based on Modal Header label if one is not provided (L253)
-  //
-  // TODO: Confirm whether `ModalHeader` `label` should allow `ReactNode`. If
-  // so, define how to derive a string for `aria-label`.
   let generatedAriaLabel;
   const childrenWithProps = React.Children.toArray(children).map(child => {
     if (isComponentElement(child, ModalHeader)) {

package/es/components/ComposedModal/ComposedModalPresence.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 PropsWithChildren } from 'react';
+import React, { type ComponentType, type PropsWithChildren } from 'react';
 import { type PresenceContext } from '../../internal/usePresenceContext';
 import { useComposedModalState } from './useComposedModalState';
 export interface ComposedModalPresenceProps {
@@ -31,4 +31,12 @@ export declare const ComposedModalPresenceContext: React.Context<ComposedModalPr
  * Handles occurrences where only a single composed modal must consume a context.
  */
 export declare const useExclusiveComposedModalPresenceContext: (id: string) => ComposedModalPresenceContextProps | undefined;
+type WithComposedModalPresenceProps = Pick<ComposedModalPresenceProps, 'open'>;
+/**
+ * Higher-order function that wraps a component with ComposedModalPresence
+ */
+export declare const withComposedModalPresence: <TProps extends object>(Component: ComponentType<TProps>) => {
+    ({ open, ...componentProps }: TProps & WithComposedModalPresenceProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export {};

package/es/components/ComposedModal/ComposedModalPresence.js

@@ -38,5 +38,18 @@ const useExclusiveComposedModalPresenceContext = id => {
   const ctx = useContext(ComposedModalPresenceContext);
   return ctx?.isPresenceExclusive(id) ? ctx : undefined;
 };
+/**
+ * Higher-order function that wraps a component with ComposedModalPresence
+ */
+const withComposedModalPresence = Component => {
+  const WithComposedModalPresence = ({
+    open,
+    ...componentProps
+  }) => /*#__PURE__*/React.createElement(ComposedModalPresence, {
+    open: open
+  }, /*#__PURE__*/React.createElement(Component, componentProps));
+  WithComposedModalPresence.displayName = `withComposedModalPresence(${Component.displayName || Component.name || 'Component'})`;
+  return WithComposedModalPresence;
+};
 
-export { ComposedModalPresence, ComposedModalPresenceContext, useExclusiveComposedModalPresenceContext };
+export { ComposedModalPresence, ComposedModalPresenceContext, useExclusiveComposedModalPresenceContext, withComposedModalPresence };

package/es/components/ComposedModal/index.d.ts

@@ -6,7 +6,7 @@
  */
 import ComposedModal from './ComposedModal';
 export { default as ComposedModal, type ComposedModalProps, ModalBody, type ModalBodyProps, } from './ComposedModal';
-export { ComposedModalPresence, type ComposedModalPresenceProps, } from './ComposedModalPresence';
+export { ComposedModalPresence, withComposedModalPresence, type ComposedModalPresenceProps, } from './ComposedModalPresence';
 export { ModalHeader, type ModalHeaderProps } from './ModalHeader';
 export { ModalFooter, type ModalFooterProps } from './ModalFooter';
 export default ComposedModal;

package/es/components/ContainedList/index.js

@@ -17,4 +17,4 @@ if (process.env.NODE_ENV !== 'production') {
   deprecateFieldOnObject(ContainedList, 'ContainedListItem', ContainedListItem);
 }
 
-export { ContainedList, ContainedListItem, ContainedList as default };
+export { ContainedList, ContainedListItem };

package/es/components/DataTable/TableHeader.js

@@ -8,7 +8,7 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import React, { forwardRef, useRef, cloneElement } from 'react';
+import React, { useRef, forwardRef, cloneElement } from 'react';
 import { ArrowUp, ArrowsVertical } from '@carbon/icons-react';
 import { useId } from '../../internal/useId.js';
 import { usePrefix } from '../../internal/usePrefix.js';

package/es/components/DataTable/TableRow.js

@@ -6,7 +6,7 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React, { forwardRef, Children } from 'react';
+import React, { Children, forwardRef } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';

package/es/components/DataTable/TableToolbarMenu.js

@@ -11,7 +11,7 @@ import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
 import { usePrefix } from '../../internal/usePrefix.js';
-import OverflowMenu from '../OverflowMenu/index.js';
+import { OverflowMenu } from '../OverflowMenu/index.js';
 
 const defaultIconDescription = 'Settings';
 const TableToolbarMenu = ({

package/es/components/DatePicker/DatePicker.Skeleton.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.
@@ -7,11 +7,14 @@
 import PropTypes from 'prop-types';
 import { type HTMLAttributes } from 'react';
 export interface DatePickerSkeletonProps extends HTMLAttributes<HTMLDivElement> {
-    range?: boolean;
     /**
-     * Specify whether the label should be hidden, or not
+     * Specify whether to hide the label.
      */
     hideLabel?: boolean;
+    /**
+     * Specify whether to render the range skeleton variant.
+     */
+    range?: boolean;
 }
 declare const DatePickerSkeleton: {
     ({ range, id, hideLabel, className, ...rest }: DatePickerSkeletonProps): import("react/jsx-runtime").JSX.Element;
@@ -21,7 +24,7 @@ declare const DatePickerSkeleton: {
          */
         className: PropTypes.Requireable<string>;
         /**
-         * Specify whether the label should be hidden, or not
+         * Specify whether to hide the label.
          */
         hideLabel: PropTypes.Requireable<boolean>;
         /**
@@ -29,7 +32,7 @@ declare const DatePickerSkeleton: {
          */
         id: PropTypes.Requireable<string>;
         /**
-         * Specify whether the skeleton should be of range date picker.
+         * Specify whether to render the range skeleton variant.
          */
         range: PropTypes.Requireable<boolean>;
     };

package/es/components/DatePicker/DatePicker.Skeleton.js

@@ -46,7 +46,7 @@ DatePickerSkeleton.propTypes = {
    */
   className: PropTypes.string,
   /**
-   * Specify whether the label should be hidden, or not
+   * Specify whether to hide the label.
    */
   hideLabel: PropTypes.bool,
   /**
@@ -54,7 +54,7 @@ DatePickerSkeleton.propTypes = {
    */
   id: PropTypes.string,
   /**
-   * Specify whether the skeleton should be of range date picker.
+   * Specify whether to render the range skeleton variant.
    */
   range: PropTypes.bool
 };

package/es/components/DatePicker/index.js

@@ -6,7 +6,7 @@
  */
 
 import DatePicker from './DatePicker.js';
-export { default as DatePickerSkeleton } from './DatePicker.Skeleton.js';
+export { DatePickerSkeleton } from './DatePicker.Skeleton.js';
 
 
 

package/es/components/DatePickerInput/DatePickerInput.js

@@ -9,7 +9,7 @@ import { Calendar, WarningFilled, WarningAltFilled } from '@carbon/icons-react';
 import { warning } from '../../internal/warning.js';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import React, { forwardRef, useContext, cloneElement } from 'react';
+import React, { useContext, forwardRef, cloneElement } from 'react';
 import { usePrefix } from '../../internal/usePrefix.js';
 import '../FluidForm/FluidForm.js';
 import { FormContext } from '../FluidForm/FormContext.js';

package/es/components/Dialog/Dialog.js

@@ -7,7 +7,7 @@
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React, { useRef, useEffect, createContext, useContext, useState } from 'react';
+import React, { useRef, useEffect, useContext, useState, createContext } from 'react';
 import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import cx from 'classnames';

package/es/components/Dropdown/index.js

@@ -6,7 +6,7 @@
  */
 
 import Dropdown from './Dropdown.js';
-export { default as DropdownSkeleton } from './Dropdown.Skeleton.js';
+export { DropdownSkeleton } from './Dropdown.Skeleton.js';
 
 
 

package/es/components/ExpandableSearch/ExpandableSearch.js

@@ -6,7 +6,7 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React, { forwardRef, useState, useRef, useEffect } from 'react';
+import React, { useState, useRef, useEffect, forwardRef } from 'react';
 import cx from 'classnames';
 import Search from '../Search/Search.js';
 import '../Search/Search.Skeleton.js';

package/es/components/FeatureFlags/index.d.ts

@@ -1,11 +1,11 @@
 /**
- * Copyright IBM Corp. 2015, 2025
+ * Copyright IBM Corp. 2015, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 import PropTypes from 'prop-types';
-import React, { ReactNode, type JSX } from 'react';
+import { type ReactNode } from 'react';
 export interface FeatureFlagsProps {
     children?: ReactNode;
     flags?: Record<string, boolean>;
@@ -20,19 +20,14 @@ export interface FeatureFlagsProps {
     enableEnhancedFileUploader?: boolean;
     enablePresence?: boolean;
 }
-/**
- * Our FeatureFlagContext is used alongside the FeatureFlags component to enable
- * or disable feature flags in a given React tree
- */
-declare const FeatureFlagContext: React.Context<any>;
 /**
  * Supports an object of feature flag values with the `flags` prop, merging them
  * along with the current `FeatureFlagContext` to provide consumers to check if
  * a feature flag is enabled or disabled in a given React tree
  */
-declare function FeatureFlags({ children, flags, enableV12TileDefaultIcons, enableV12TileRadioIcons, enableV12Overflowmenu, enableTreeviewControllable, enableExperimentalFocusWrapWithoutSentinels, enableFocusWrapWithoutSentinels, enableDialogElement, enableV12DynamicFloatingStyles, enableEnhancedFileUploader, enablePresence, }: FeatureFlagsProps): JSX.Element;
-declare namespace FeatureFlags {
-    var propTypes: {
+export declare const FeatureFlags: {
+    ({ children, flags, enableV12TileDefaultIcons, enableV12TileRadioIcons, enableV12Overflowmenu, enableTreeviewControllable, enableExperimentalFocusWrapWithoutSentinels, enableFocusWrapWithoutSentinels, enableDialogElement, enableV12DynamicFloatingStyles, enableEnhancedFileUploader, enablePresence, }: FeatureFlagsProps): import("react/jsx-runtime").JSX.Element;
+    propTypes: {
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         /**
          * Provide the feature flags to enabled or disabled in the current Rea,ct tree
@@ -49,18 +44,13 @@ declare namespace FeatureFlags {
         enableEnhancedFileUploader: PropTypes.Requireable<boolean>;
         enablePresence: PropTypes.Requireable<boolean>;
     };
-}
+};
 /**
  * Access whether a given flag is enabled or disabled in a given
  * FeatureFlagContext
- *
- * @returns {boolean}
  */
-declare function useFeatureFlag(flag: any): any;
+export declare const useFeatureFlag: (flag: string) => boolean;
 /**
  * Access all feature flag information for the given FeatureFlagContext
- *
- * @returns {FeatureFlagScope}
  */
-declare function useFeatureFlags(): any;
-export { FeatureFlags, FeatureFlagContext, useFeatureFlags, useFeatureFlag };
+export declare const useFeatureFlags: () => import("@carbon/feature-flags/types/FeatureFlagScope").FeatureFlagScope;

package/es/components/FeatureFlags/index.js

@@ -7,10 +7,9 @@
 
 import { FeatureFlags as FeatureFlags$1, createScope } from '@carbon/feature-flags';
 import PropTypes from 'prop-types';
-import React, { useContext, createContext, useState, useRef, useEffect } from 'react';
+import React, { useContext, createContext, useMemo } from 'react';
 import { deprecate } from '../../prop-types/deprecate.js';
 
-// TODO: Can this variable be deleted now? It isn't used anywhere.
 /**
  * Our FeatureFlagContext is used alongside the FeatureFlags component to enable
  * or disable feature flags in a given React tree
@@ -22,7 +21,7 @@ const FeatureFlagContext = /*#__PURE__*/createContext(FeatureFlags$1);
  * along with the current `FeatureFlagContext` to provide consumers to check if
  * a feature flag is enabled or disabled in a given React tree
  */
-function FeatureFlags({
+const FeatureFlags = ({
   children,
   flags = {},
   enableV12TileDefaultIcons = false,
@@ -35,46 +34,30 @@ function FeatureFlags({
   enableV12DynamicFloatingStyles = false,
   enableEnhancedFileUploader = false,
   enablePresence = false
-}) {
+}) => {
   const parentScope = useContext(FeatureFlagContext);
-  const [prevParentScope, setPrevParentScope] = useState(parentScope);
-  const combinedFlags = {
-    'enable-v12-tile-default-icons': enableV12TileDefaultIcons,
-    'enable-v12-tile-radio-icons': enableV12TileRadioIcons,
-    'enable-v12-overflowmenu': enableV12Overflowmenu,
-    'enable-treeview-controllable': enableTreeviewControllable,
-    'enable-experimental-focus-wrap-without-sentinels': enableExperimentalFocusWrapWithoutSentinels,
-    'enable-focus-wrap-without-sentinels': enableFocusWrapWithoutSentinels,
-    'enable-dialog-element': enableDialogElement,
-    'enable-v12-dynamic-floating-styles': enableV12DynamicFloatingStyles,
-    'enable-enhanced-file-uploader': enableEnhancedFileUploader,
-    'enable-presence': enablePresence,
-    ...flags
-  };
-  const [scope, updateScope] = useState(() => {
+  const scope = useMemo(() => {
+    const combinedFlags = {
+      'enable-v12-tile-default-icons': enableV12TileDefaultIcons,
+      'enable-v12-tile-radio-icons': enableV12TileRadioIcons,
+      'enable-v12-overflowmenu': enableV12Overflowmenu,
+      'enable-treeview-controllable': enableTreeviewControllable,
+      'enable-experimental-focus-wrap-without-sentinels': enableExperimentalFocusWrapWithoutSentinels,
+      'enable-focus-wrap-without-sentinels': enableFocusWrapWithoutSentinels,
+      'enable-dialog-element': enableDialogElement,
+      'enable-v12-dynamic-floating-styles': enableV12DynamicFloatingStyles,
+      'enable-enhanced-file-uploader': enableEnhancedFileUploader,
+      'enable-presence': enablePresence,
+      ...flags
+    };
     const scope = createScope(combinedFlags);
     scope.mergeWithScope(parentScope);
     return scope;
-  });
-  if (parentScope !== prevParentScope) {
-    const scope = createScope(combinedFlags);
-    scope.mergeWithScope(parentScope);
-    updateScope(scope);
-    setPrevParentScope(parentScope);
-  }
-
-  // We use a custom hook to detect if any of the keys or their values change
-  // for flags that are passed in. If they have changed, then we re-create the
-  // FeatureFlagScope using the new flags
-  useChangedValue(combinedFlags, isEqual, changedFlags => {
-    const scope = createScope(changedFlags);
-    scope.mergeWithScope(parentScope);
-    updateScope(scope);
-  });
+  }, [enableV12TileDefaultIcons, enableV12TileRadioIcons, enableV12Overflowmenu, enableTreeviewControllable, enableExperimentalFocusWrapWithoutSentinels, enableFocusWrapWithoutSentinels, enableDialogElement, enableV12DynamicFloatingStyles, enableEnhancedFileUploader, enablePresence, flags, parentScope]);
   return /*#__PURE__*/React.createElement(FeatureFlagContext.Provider, {
     value: scope
   }, children);
-}
+};
 FeatureFlags.propTypes = {
   children: PropTypes.node,
   /**
@@ -93,81 +76,18 @@ FeatureFlags.propTypes = {
   enablePresence: PropTypes.bool
 };
 
-/**
- * This hook will store previous versions of the given `value` and compare the
- * current value to the previous one using the `compare` function. If the
- * compare function returns true, then the given `callback` is invoked in an
- * effect.
- *
- * @param {any} value
- * @param {Function} compare
- * @param {Function} callback
- */
-function useChangedValue(value, compare, callback) {
-  const initialRender = useRef(false);
-  const savedCallback = useRef(callback);
-  const [prevValue, setPrevValue] = useState(value);
-  if (!compare(prevValue, value)) {
-    setPrevValue(value);
-  }
-  useEffect(() => {
-    savedCallback.current = callback;
-  });
-  useEffect(() => {
-    // We only want the callback triggered after the first render
-    if (initialRender.current) {
-      savedCallback.current(prevValue);
-    }
-  }, [prevValue]);
-  useEffect(() => {
-    initialRender.current = true;
-  }, []);
-}
-
 /**
  * Access whether a given flag is enabled or disabled in a given
  * FeatureFlagContext
- *
- * @returns {boolean}
  */
-function useFeatureFlag(flag) {
+const useFeatureFlag = flag => {
   const scope = useContext(FeatureFlagContext);
   return scope.enabled(flag);
-}
+};
 
 /**
  * Access all feature flag information for the given FeatureFlagContext
- *
- * @returns {FeatureFlagScope}
- */
-function useFeatureFlags() {
-  return useContext(FeatureFlagContext);
-}
-
-/**
- * Compare two objects and determine if they are equal. This is a shallow
- * comparison since the objects we are comparing are objects with boolean flags
- * from the flags prop in the `FeatureFlags` component
- *
- * @param {object} a
- * @param {object} b
- * @returns {boolean}
  */
-function isEqual(a, b) {
-  if (a === b) {
-    return true;
-  }
-  for (const key of Object.keys(a)) {
-    if (a[key] !== b[key]) {
-      return false;
-    }
-  }
-  for (const key of Object.keys(b)) {
-    if (b[key] !== a[key]) {
-      return false;
-    }
-  }
-  return true;
-}
+const useFeatureFlags = () => useContext(FeatureFlagContext);
 
-export { FeatureFlagContext, FeatureFlags, useFeatureFlag, useFeatureFlags };
+export { FeatureFlags, useFeatureFlag, useFeatureFlags };

package/es/components/FileUploader/FileUploader.Skeleton.js

@@ -10,7 +10,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import cx from 'classnames';
 import SkeletonText from '../SkeletonText/SkeletonText.js';
-import ButtonSkeleton from '../Button/Button.Skeleton.js';
+import { ButtonSkeleton } from '../Button/Button.Skeleton.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 
 var _SkeletonText, _ButtonSkeleton;

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

@@ -8,7 +8,7 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
-import React, { useState, useRef } from 'react';
+import React, { useState, useRef, useEffect } from 'react';
 import { Enter, Space } from '../../internal/keyboard/keys.js';
 import { matches } from '../../internal/keyboard/match.js';
 import { useId } from '../../internal/useId.js';
@@ -35,7 +35,6 @@ function FileUploaderButton({
 }) {
   const prefix = usePrefix();
   const [labelText, setLabelText] = useState(ownerLabelText);
-  const [prevOwnerLabelText, setPrevOwnerLabelText] = useState(ownerLabelText);
   const generatedId = useId();
   const {
     current: inputId
@@ -49,12 +48,9 @@ function FileUploaderButton({
     [`${prefix}--btn--sm`]: size === 'small' || size === 'sm',
     [`${prefix}--layout--size-${size}`]: size
   });
-
-  // Adjust label text state based on changes to the labelText prop
-  if (ownerLabelText !== prevOwnerLabelText) {
+  useEffect(() => {
     setLabelText(ownerLabelText);
-    setPrevOwnerLabelText(ownerLabelText);
-  }
+  }, [ownerLabelText]);
   function onClick(event) {
     event.target.value = null;
     if (inputNode.current) {

package/es/components/Icon/Icon.Skeleton.js

@@ -27,4 +27,4 @@ IconSkeleton.propTypes = {
   className: PropTypes.string
 };
 
-export { IconSkeleton, IconSkeleton as default };
+export { IconSkeleton };

package/es/components/IconIndicator/index.js

@@ -70,4 +70,4 @@ IconIndicator.propTypes = {
   size: PropTypes.oneOf([16, 20])
 };
 
-export { IconIndicator, IconIndicatorKinds, IconIndicator as default };
+export { IconIndicator, IconIndicatorKinds };