@carbon/ibm-products 2.68.0 → 2.69.0-rc.0

package/es/components/Datagrid/Datagrid/DatagridRow.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2020, 2024
+ * 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/es/components/Datagrid/Datagrid/DatagridRow.js

@@ -7,11 +7,11 @@
 
 import { extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { isValidElement } from 'react';
-import { TableRow, SkeletonText, TableCell } from '@carbon/react';
+import { usePrefix, TableRow, SkeletonText, TableCell } from '@carbon/react';
 import { px } from '@carbon/layout';
 import { selectionColumnId } from '../common-column-ids.js';
 import cx from 'classnames';
-import { pkg, carbon } from '../../../settings.js';
+import { pkg } from '../../../settings.js';
 import { DatagridAILabel } from './addons/AiLabel/DatagridAiLabel.js';
 
 var _SkeletonText;
@@ -39,6 +39,7 @@ const DatagridRow = datagridState => {
     visibleColumns,
     getAsyncSubRows
   } = datagridState;
+  const carbonPrefix = usePrefix();
   const getVisibleNestedRowCount = _ref => {
     let {
       isExpanded,
@@ -118,7 +119,7 @@ const DatagridRow = datagridState => {
     [`${blockClass}__carbon-row-expanded`]: row.isExpanded,
     [`${blockClass}__carbon-row-expandable`]: row.canExpand,
     [`${blockClass}__carbon-row-expandable--async`]: getAsyncSubRows && row.depth > 0,
-    [`${carbon.prefix}--data-table--selected`]: row.isSelected,
+    [`${carbonPrefix}--data-table--selected`]: row.isSelected,
     [`${blockClass}__slug--row`]: /*#__PURE__*/isValidElement(row?.original?.slug),
     [`${blockClass}__ai-label--row`]: /*#__PURE__*/isValidElement(row?.original?.aiLabel)
   });

package/es/components/Datagrid/Datagrid/DatagridToolbar.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2021, 2023
+ * Copyright IBM Corp. 2021, 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/es/components/Datagrid/Datagrid/DatagridToolbar.js

@@ -7,9 +7,9 @@
 
 import React__default, { useRef, useState, useEffect } from 'react';
 import PropTypes from '../../../_virtual/index.js';
-import { TableToolbar, TableBatchActions, TableBatchAction, MenuButton, MenuItem } from '@carbon/react';
+import { TableToolbar, usePrefix, TableBatchActions, TableBatchAction, MenuButton, MenuItem } from '@carbon/react';
 import { useResizeObserver } from '../../../global/js/hooks/useResizeObserver.js';
-import { pkg, carbon } from '../../../settings.js';
+import { pkg } from '../../../settings.js';
 import cx from 'classnames';
 import { handleSelectAllRowData } from './addons/stateReducer.js';
 
@@ -33,6 +33,7 @@ const DatagridBatchActionsToolbar = (datagridState, width, ref) => {
     batchActionMenuButtonLabel,
     translateWithIdBatchActions
   } = datagridState;
+  const carbonPrefix = usePrefix();
   const [availableRowsCount, setAvailableRowsCount] = useState(rows.length);
   const batchActionMenuButtonLabelText = batchActionMenuButtonLabel ?? 'More';
   const selectedKeys = Object.keys(selectedRowIds || {});
@@ -49,19 +50,19 @@ const DatagridBatchActionsToolbar = (datagridState, width, ref) => {
   // the ButtonMenu
   useEffect(() => {
     if (totalSelected === 1 && !receivedInitialWidth) {
-      const batchActionListWidth = ref?.current?.querySelector(`.${carbon.prefix}--action-list`).offsetWidth;
+      const batchActionListWidth = ref?.current?.querySelector(`.${carbonPrefix}--action-list`).offsetWidth;
       setInitialListWidth(batchActionListWidth);
       setReceivedInitialWidth(true);
     }
-  }, [totalSelected, receivedInitialWidth, ref]);
+  }, [totalSelected, receivedInitialWidth, ref, carbonPrefix]);
   useEffect(() => {
-    const summaryWidth = ref?.current.querySelector(`.${carbon.prefix}--batch-summary`).offsetWidth;
+    const summaryWidth = ref?.current.querySelector(`.${carbonPrefix}--batch-summary`).offsetWidth;
     if (width < summaryWidth + initialListWidth + 32) {
       setDisplayAllInMenu(true);
     } else {
       setDisplayAllInMenu(false);
     }
-  }, [width, ref, initialListWidth]);
+  }, [width, ref, initialListWidth, carbonPrefix]);
   const getSelectedRowData = () => {
     if (selectedKeys.length === 0) {
       return [];
@@ -149,7 +150,7 @@ const DatagridBatchActionsToolbar = (datagridState, width, ref) => {
         renderIcon: batchAction.renderIcon,
         onClick: event => onClickHandler(event, batchAction),
         className: cx({
-          [`${carbon.prefix}--noLabel`]: !batchAction.label || batchAction.label === ''
+          [`${carbonPrefix}--noLabel`]: !batchAction.label || batchAction.label === ''
         }),
         iconDescription: batchAction.label,
         tabIndex: totalSelected > 0 ? 0 : -1

package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.d.ts

@@ -1,4 +1,4 @@
-export function handleGridKeyPress({ event, dispatch, state, instance, keysPressedList, usingMac, ref, }: {
+export function handleGridKeyPress({ event, dispatch, state, instance, keysPressedList, usingMac, ref, carbonPrefix, }: {
     event: any;
     dispatch: any;
     state: any;
@@ -6,4 +6,5 @@ export function handleGridKeyPress({ event, dispatch, state, instance, keysPress
     keysPressedList: any;
     usingMac: any;
     ref: any;
+    carbonPrefix: any;
 }): void;

package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { pkg, carbon } from '../../../../../settings.js';
+import { pkg } from '../../../../../settings.js';
 import { handleMultipleKeys } from './handleMultipleKeys.js';
 import { getCellIdAsObject } from './InlineEditContext/getCellIdAsObject.js';
 
@@ -18,7 +18,8 @@ const handleGridKeyPress = _ref => {
     instance,
     keysPressedList,
     usingMac,
-    ref
+    ref,
+    carbonPrefix
   } = _ref;
   const {
     key
@@ -73,7 +74,7 @@ const handleGridKeyPress = _ref => {
 
   // Checks if the date picker is open
   const datePickerIsActive = () => {
-    const focusedCalendarElement = document.querySelector(`.${carbon.prefix}--date-picker__input.flatpickr-input.active`);
+    const focusedCalendarElement = document.querySelector(`.${carbonPrefix}--date-picker__input.flatpickr-input.active`);
     if (focusedCalendarElement || document.activeElement.classList.contains(`flatpickr-day`)) {
       return true;
     }

package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js

@@ -9,10 +9,10 @@ import { extends as _extends } from '../../../../../_virtual/_rollupPluginBabelH
 import React__default, { useRef, useEffect } from 'react';
 import PropTypes from '../../../../../_virtual/index.js';
 import { Settings } from '@carbon/react/icons';
-import { Popover, IconButton, PopoverContent, Layer } from '@carbon/react';
+import { usePrefix, Popover, IconButton, PopoverContent, Layer } from '@carbon/react';
 import cx from 'classnames';
 import RowSizeRadioGroup from './RowSizeRadioGroup.js';
-import { carbon, pkg } from '../../../../../settings.js';
+import { pkg } from '../../../../../settings.js';
 
 var _Settings;
 const blockClass = `${pkg.prefix}--datagrid__row-size`;
@@ -25,6 +25,7 @@ const RowSizeDropdown = _ref => {
   } = _ref;
   const radioGroupRef = useRef(undefined);
   const [isOpen, setIsOpen] = React__default.useState(false);
+  const carbonPrefix = usePrefix();
   const onCloseHandler = () => {
     setIsOpen(false);
   };
@@ -41,7 +42,7 @@ const RowSizeDropdown = _ref => {
   useEffect(() => {
     if (isOpen) {
       const radioGroupParentElement = radioGroupRef?.current;
-      const checkedRadioChild = radioGroupParentElement?.querySelector(`.${carbon.prefix}--radio-button:checked`);
+      const checkedRadioChild = radioGroupParentElement?.querySelector(`.${carbonPrefix}--radio-button:checked`);
       checkedRadioChild?.focus();
     }
   }, [isOpen]);

package/es/components/Datagrid/useNestedRowExpander.js

@@ -9,12 +9,14 @@ import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js
 import React__default, { useRef } from 'react';
 import { ChevronRight } from '@carbon/react/icons';
 import cx from 'classnames';
-import { pkg, carbon } from '../../settings.js';
+import { pkg } from '../../settings.js';
 import { useFocusRowExpander } from './useFocusRowExpander.js';
 import { handleDynamicRowCheck } from './Datagrid/addons/stateReducer.js';
+import { usePrefix } from '@carbon/react';
 
 const blockClass = `${pkg.prefix}--datagrid`;
 const useNestedRowExpander = hooks => {
+  const carbonPrefix = usePrefix();
   const tempState = useRef(undefined);
   const lastExpandedRowIndex = useRef(undefined);
   const useInstance = instance => {
@@ -80,7 +82,7 @@ const useNestedRowExpander = hooks => {
         return row.canExpand || getAsyncSubRows ? /*#__PURE__*/React__default.createElement("button", _extends({
           type: "button",
           "aria-label": expanderTitle,
-          className: cx(`${blockClass}__row-expander`, `${carbon.prefix}--btn`, `${carbon.prefix}--btn--ghost`)
+          className: cx(`${blockClass}__row-expander`, `${carbonPrefix}--btn`, `${carbonPrefix}--btn--ghost`)
         }, expanderButtonProps), /*#__PURE__*/React__default.createElement(ChevronRight, {
           className: cx(`${blockClass}__expander-icon`, {
             [`${blockClass}__expander-icon--not-open`]: !row.isExpanded,

package/es/components/Datagrid/useOnRowClick.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2020, 2023
+ * 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/es/components/Datagrid/useOnRowClick.js

@@ -5,10 +5,12 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { pkg, carbon } from '../../settings.js';
+import { pkg } from '../../settings.js';
+import { usePrefix } from '@carbon/react';
 
 const useOnRowClick = hooks => {
   const useInstance = rowInstance => {
+    const carbonPrefix = usePrefix();
     const {
       onRowClick
     } = rowInstance;
@@ -32,14 +34,14 @@ const useOnRowClick = hooks => {
           // We do not want to change the list of selected rows if using the useSelectedRows hook, otherwise clicking on an entire row will mark the row as checked
 
           // Remove selected class from all other clickable rows as only one clickable row can be selected at a time
-          const clickableSelectedRows = document.querySelectorAll(`#${tableId}.${pkg.prefix}--datagrid .${carbon.prefix}--data-table--selected:not(.${pkg.prefix}--datagrid__active-row)`);
+          const clickableSelectedRows = document.querySelectorAll(`#${tableId}.${pkg.prefix}--datagrid .${carbonPrefix}--data-table--selected:not(.${pkg.prefix}--datagrid__active-row)`);
           if (clickableSelectedRows.length) {
             Array.from(clickableSelectedRows).forEach(row => {
-              row.classList.remove(`${carbon.prefix}--data-table--selected`);
+              row.classList.remove(`${carbonPrefix}--data-table--selected`);
             });
           }
           const closestRow = event.currentTarget.closest('tr');
-          closestRow.classList.add(`${carbon.prefix}--data-table--selected`);
+          closestRow.classList.add(`${carbonPrefix}--data-table--selected`);
           if (!withSelectRows) {
             if (instance.selectedFlatRows) {
               instance.selectedFlatRows.map(toggleRow => toggleRow.toggleRowSelected?.(false));

package/es/components/Datagrid/useRowExpander.js

@@ -8,9 +8,10 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useRef } from 'react';
 import { ChevronUp, ChevronDown } from '@carbon/react/icons';
-import { pkg, carbon } from '../../settings.js';
+import { pkg } from '../../settings.js';
 import cx from 'classnames';
 import { useFocusRowExpander } from './useFocusRowExpander.js';
+import { usePrefix } from '@carbon/react';
 
 const blockClass = `${pkg.prefix}--datagrid`;
 const useRowExpander = hooks => {
@@ -19,6 +20,7 @@ const useRowExpander = hooks => {
   const useInstance = instance => {
     tempState.current = instance;
   };
+  const carbonPrefix = usePrefix();
   useFocusRowExpander({
     instance: tempState?.current,
     lastExpandedRowIndex: lastExpandedRowIndex?.current,
@@ -51,7 +53,7 @@ const useRowExpander = hooks => {
         return row.canExpand && /*#__PURE__*/React__default.createElement("button", _extends({
           type: "button",
           "aria-label": expanderTitle,
-          className: cx(`${blockClass}__row-expander`, `${carbon.prefix}--btn`, `${carbon.prefix}--btn--ghost`)
+          className: cx(`${blockClass}__row-expander`, `${carbonPrefix}--btn`, `${carbonPrefix}--btn--ghost`)
         }, expanderButtonProps), row.isExpanded ? /*#__PURE__*/React__default.createElement(ChevronUp, {
           className: `${blockClass}__row-expander--icon`
         }) : /*#__PURE__*/React__default.createElement(ChevronDown, {

package/es/components/Datagrid/useSelectRows.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2020, 2023
+ * 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/es/components/Datagrid/useSelectRows.js

@@ -8,10 +8,10 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useState, useLayoutEffect, useCallback } from 'react';
 import cx from 'classnames';
-import { TableSelectRow } from '@carbon/react';
+import { usePrefix, TableSelectRow } from '@carbon/react';
 import { SelectAll } from './Datagrid/DatagridSelectAll.js';
 import { selectionColumnId } from './common-column-ids.js';
-import { pkg, carbon } from '../../settings.js';
+import { pkg } from '../../settings.js';
 import { handleToggleRowSelected } from './Datagrid/addons/stateReducer.js';
 
 const blockClass = `${pkg.prefix}--datagrid`;
@@ -52,6 +52,7 @@ const useSelectRows = hooks => {
   });
 };
 const useHighlightSelection = hooks => {
+  const carbonPrefix = usePrefix();
   const getRowProps = (props, _ref) => {
     let {
       row
@@ -61,7 +62,7 @@ const useHighlightSelection = hooks => {
     } = row.getToggleRowSelectedProps();
     return [props, {
       className: cx([`${blockClass}__carbon-row`, {
-        [`${carbon.prefix}--data-table--selected`]: checked,
+        [`${carbonPrefix}--data-table--selected`]: checked,
         [`${blockClass}__active-row`]: checked
       }])
     }];

package/es/components/Datagrid/useSortableColumns.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2020, 2024
+ * 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/es/components/Datagrid/useSortableColumns.js

@@ -7,8 +7,8 @@
 
 import React__default from 'react';
 import cx from 'classnames';
-import { pkg, carbon } from '../../settings.js';
-import { Button } from '@carbon/react';
+import { pkg } from '../../settings.js';
+import { usePrefix, Button } from '@carbon/react';
 import { ArrowsVertical, ArrowDown, ArrowUp } from '@carbon/react/icons';
 import { SelectAll } from './Datagrid/DatagridSelectAll.js';
 import { DatagridAILabel } from './Datagrid/addons/AiLabel/DatagridAiLabel.js';
@@ -52,6 +52,7 @@ const getAriaPressedValue = col => {
   return 'false';
 };
 const useSortableColumns = hooks => {
+  const carbonPrefix = usePrefix();
   const sortableVisibleColumns = (visibleColumns, _ref) => {
     let {
       instance
@@ -60,7 +61,7 @@ const useSortableColumns = hooks => {
       onSort
     } = instance;
     const onSortClick = (event, column) => {
-      const aiLabel = event.target.classList.contains(`${carbon.prefix}--slug`) || event.target.closest(`.${carbon.prefix}--slug`);
+      const aiLabel = event.target.classList.contains(`${carbonPrefix}--slug`) || event.target.closest(`.${carbonPrefix}--slug`);
       // Do not continue with sorting if we find a slug
       if (aiLabel) {
         event.stopPropagation();
@@ -82,7 +83,7 @@ const useSortableColumns = hooks => {
         const iconProps = {
           size: 16,
           ...props,
-          className: `${blockClass}__sortable-icon ${carbon.prefix}--btn__icon`
+          className: `${blockClass}__sortable-icon ${carbonPrefix}--btn__icon`
         };
         if (col?.isSorted) {
           switch (col.isSortedDesc) {
@@ -114,7 +115,7 @@ const useSortableColumns = hooks => {
           }), icon(headerProp?.column, props));
         },
         id: column?.id,
-        className: cx(`${carbon.prefix}--table-sort ${blockClass}--table-sort`, {
+        className: cx(`${carbonPrefix}--table-sort ${blockClass}--table-sort`, {
           [`${blockClass}--table-sort--desc`]: headerProp?.column.isSortedDesc,
           [`${blockClass}--table-sort--asc`]: headerProp?.column.isSortedDesc === false
         }),

package/es/components/EditInPlace/EditInPlace.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2022, 2022
+ * Copyright IBM Corp. 2022, 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/es/components/EditInPlace/EditInPlace.js

@@ -8,8 +8,8 @@
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { WarningFilled, Close, Checkmark, Edit } from '@carbon/react/icons';
 import React__default, { forwardRef, useState, useRef, useEffect } from 'react';
-import { pkg, carbon } from '../../settings.js';
-import { IconButton } from '@carbon/react';
+import { pkg } from '../../settings.js';
+import { usePrefix, IconButton } from '@carbon/react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
@@ -49,6 +49,7 @@ let EditInPlace = /*#__PURE__*/forwardRef((_ref, ref) => {
   const inputRef = useRef(null);
   const canSave = value !== initialValue && !invalid;
   const escaping = useRef(false);
+  const carbonPrefix = usePrefix();
   const tipAlignIsObject = typeof tooltipAlignment === 'object';
   const tipAlignments = ['edit', 'save', 'cancel'].reduce((acc, tips) => {
     acc[tips] = (tipAlignIsObject ? tooltipAlignment[tips] : tooltipAlignment) ?? defaults.tooltipAlignment;
@@ -156,7 +157,7 @@ let EditInPlace = /*#__PURE__*/forwardRef((_ref, ref) => {
     onBlur: onBlurHandler
   }, /*#__PURE__*/React__default.createElement("input", {
     id: id,
-    className: cx(`${blockClass}__text-input`, `${carbon.prefix}--text-input`, `${carbon.prefix}--text-input--${size}`),
+    className: cx(`${blockClass}__text-input`, `${carbonPrefix}--text-input`, `${carbonPrefix}--text-input--${size}`),
     type: "text",
     placeholder: placeholder,
     value: value,

package/es/components/EmptyStates/EmptyStateContent.d.ts

@@ -32,5 +32,34 @@ interface EmptyStateProps {
      */
     title: string | ReactNode;
 }
-export declare const EmptyStateContent: React.ForwardRefExoticComponent<EmptyStateProps & React.RefAttributes<HTMLDivElement>>;
+export declare const EmptyStateContent: {
+    (props: EmptyStateProps): React.JSX.Element;
+    displayName: string;
+    propTypes: {
+        /**
+         * Empty state action button
+         */
+        action: any;
+        /**
+         * Empty state headingAs allows you to customize the type of heading element
+         */
+        headingAs: any;
+        /**
+         * Empty state link object
+         */
+        link: any;
+        /**
+         * Empty state size
+         */
+        size: any;
+        /**
+         * Empty state subtitle
+         */
+        subtitle: any;
+        /**
+         * Empty state title
+         */
+        title: any;
+    };
+};
 export {};

package/es/components/EmptyStates/EmptyStateContent.js

@@ -15,7 +15,7 @@ import { Button, Section, Heading, Link } from '@carbon/react';
 // The block part of our conventional BEM class names (blockClass__E--M).
 const blockClass = `${pkg.prefix}--empty-state`;
 const componentName = 'EmptyStateContent';
-const EmptyStateContent = /*#__PURE__*/React__default.forwardRef(props => {
+const EmptyStateContent = props => {
   const {
     action,
     link,
@@ -45,7 +45,7 @@ const EmptyStateContent = /*#__PURE__*/React__default.forwardRef(props => {
     className: `${blockClass}__link`,
     href: link.href
   }), link.text));
-});
+};
 
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.

package/es/components/ExportModal/ExportModal.js

@@ -6,13 +6,13 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import { unstable_FeatureFlags, ComposedModal, ModalHeader, ModalBody, FormGroup, RadioButtonGroup, RadioButton, TextInput, PasswordInput, Loading, ModalFooter, Button } from '@carbon/react';
+import { usePrefix, unstable_FeatureFlags, ComposedModal, ModalHeader, ModalBody, FormGroup, RadioButtonGroup, RadioButton, TextInput, PasswordInput, Loading, ModalFooter, Button } from '@carbon/react';
 import { CheckmarkFilled, ErrorFilled } from '@carbon/react/icons';
 import React__default, { forwardRef, useState, useEffect, useRef } from 'react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
-import { pkg, carbon } from '../../settings.js';
+import { pkg } from '../../settings.js';
 import { usePortalTarget } from '../../global/js/hooks/usePortalTarget.js';
 import uuidv4 from '../../global/js/utils/uuidv4.js';
 
@@ -65,6 +65,7 @@ let ExportModal = /*#__PURE__*/forwardRef((_ref, ref) => {
   // by default (if it exists) use the first extension in the extension array
   const [extension, setExtension] = useState('');
   const renderPortalUse = usePortalTarget(portalTargetIn);
+  const carbonPrefix = usePrefix();
   useEffect(() => {
     setName(filename);
     if (preformattedExtensions && preformattedExtensions.length > 0 && preformattedExtensions[0]?.extension) {
@@ -73,10 +74,10 @@ let ExportModal = /*#__PURE__*/forwardRef((_ref, ref) => {
   }, [filename, preformattedExtensions, open]);
   useEffect(() => {
     if (successful) {
-      const button = document.querySelector(`.${blockClass} .${carbon.prefix}--modal-close-button button`);
+      const button = document.querySelector(`.${blockClass} .${carbonPrefix}--modal-close-button button`);
       button?.focus();
     }
-  }, [successful, blockClass]);
+  }, [successful, blockClass, carbonPrefix]);
   const onNameChangeHandler = evt => {
     setName(evt.target.value);
   };
@@ -141,7 +142,8 @@ let ExportModal = /*#__PURE__*/forwardRef((_ref, ref) => {
     orientation: "vertical",
     onChange: onExtensionChangeHandler,
     valueSelected: extension,
-    name: "extensions"
+    name: "extensions",
+    "aria-label": "extensions"
   }, preformattedExtensions.map(o => /*#__PURE__*/React__default.createElement(RadioButton, {
     key: o.extension,
     id: o.extension,

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

@@ -1,40 +1,59 @@
 /**
- * Copyright IBM Corp. 2024, 2024
+ * Copyright IBM Corp. 2024, 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 from 'react';
+import React, { ReactNode, type JSX } from 'react';
+export interface FeatureFlagsProps {
+    children?: ReactNode;
+    flags?: Record<string, boolean>;
+    defaultPortalTargetBody?: boolean;
+    enableDatagridUseInlineEdit?: boolean;
+    enableDatagridUseEditableCell?: boolean;
+    enableDatagridUseCustomizeColumns?: boolean;
+    enableSidepanelResizer?: boolean;
+    enableTestFlagA?: boolean;
+    enableTestFlagB?: 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 individual feature flag values as props, merging them
+ * 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, ...newFlags }: {
-    [x: string]: any;
-    children: any;
-    flags?: {} | undefined;
-}): React.JSX.Element;
+declare function FeatureFlags({ children, flags, defaultPortalTargetBody, enableDatagridUseInlineEdit, enableDatagridUseEditableCell, enableDatagridUseCustomizeColumns, enableSidepanelResizer, enableTestFlagA, enableTestFlagB, }: FeatureFlagsProps): JSX.Element;
 declare namespace FeatureFlags {
     var propTypes: {
         children: any;
         /**
-         * Provide the feature flags to enabled or disabled in the current React tree, this has been deprecated. as we are going to pass individual boolean props for each flag.
+         * Provide the feature flags to enabled or disabled in the current React tree
          */
-        flags: any;
+        defaultPortalTargetBody: any;
+        enableDatagridUseCustomizeColumns: any;
+        enableDatagridUseEditableCell: any;
+        enableDatagridUseInlineEdit: any;
+        enableSidepanelResizer: any;
+        enableTestFlagA: any;
+        enableTestFlagB: any;
+        flags: (props: any, propName: any, comp: any, loc: any, propFullName: any, secret: any) => any;
     };
 }
 /**
- * Access whether a given flag is enabled or disabled in a given FeatureFlagContext
+ * Access whether a given flag is enabled or disabled in a given
+ * FeatureFlagContext
+ *
+ * @returns {boolean}
  */
-declare function useFeatureFlag(flag: string): boolean;
+declare function useFeatureFlag(flag: any): any;
 /**
  * Access all feature flag information for the given FeatureFlagContext
+ *
+ * @returns {FeatureFlagScope}
  */
 declare function useFeatureFlags(): any;
 export { FeatureFlags, FeatureFlagContext, useFeatureFlags, useFeatureFlag };