@carbon/react 1.90.0-rc.0 → 1.90.0

package/es/components/UIShell/SwitcherItem.js

@@ -15,7 +15,7 @@ import { ArrowDown, ArrowUp } from '../../internal/keyboard/keys.js';
 import { match } from '../../internal/keyboard/match.js';
 import { AriaLabelPropType } from '../../prop-types/AriaPropTypes.js';
 
-const SwitcherItem = /*#__PURE__*/forwardRef(function SwitcherItem(props, forwardRef) {
+const SwitcherItem = /*#__PURE__*/forwardRef((props, forwardRef) => {
   const {
     'aria-label': ariaLabel,
     'aria-labelledby': ariaLabelledBy,
@@ -68,7 +68,9 @@ const SwitcherItem = /*#__PURE__*/forwardRef(function SwitcherItem(props, forwar
     },
     href: href,
     target: target,
-    rel: rel,
+    rel: rel
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+    ,
     ref: forwardRef
   }, rest, {
     className: linkClassName,

package/es/internal/FloatingMenu.js

@@ -198,6 +198,7 @@ const FloatingMenu = ({
       }
       placeInProgressRef.current = false;
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [floatingPosition, onPlace]);
 
   // Attach a resize listener.
@@ -208,11 +209,13 @@ const FloatingMenu = ({
     return () => {
       resizeHandler.remove();
     };
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [triggerRef, menuOffset, menuDirection, flipped, target, updateOrientation]);
 
   // Update menu position when key props change.
   useEffect(() => {
     updateMenuPosition();
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [menuOffset, menuDirection, flipped, triggerRef, target, updateOrientation]);
 
   /**
@@ -274,7 +277,10 @@ const FloatingMenu = ({
   const focusTrapWithoutSentinels = FeatureFlags.enabled('enable-experimental-focus-wrap-without-sentinels');
   if (typeof document !== 'undefined') {
     const portalTarget = target ? target() : document.body;
-    return /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/ReactDOM.createPortal(
+    /*#__PURE__*/
+    // eslint-disable-next-line  jsx-a11y/no-static-element-interactions  -- https://github.com/carbon-design-system/carbon/issues/20071
+    React.createElement("div", {
       onBlur: focusTrap && !focusTrapWithoutSentinels ? handleBlur : undefined,
       onKeyDown: focusTrapWithoutSentinels ? handleKeyDown : undefined
     }, !focusTrapWithoutSentinels && /*#__PURE__*/React.createElement("span", {

package/es/internal/Selection.js

@@ -42,21 +42,28 @@ const useSelection = ({
   const savedOnChange = useRef(onChange);
   const [uncontrolledItems, setUncontrolledItems] = useState(initialSelectedItems);
   const isControlled = !!controlledItems;
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20071
   const selectedItems = isControlled ? controlledItems : uncontrolledItems;
   const onItemChange = useCallback(item => {
     if (disabled) return;
 
     // Assert special properties (e.g., `disabled`, `isSelectAll`, etc.) are
     // `any` since those properties aren’t part of the generic type.
-    const allSelectableItems = filteredItems.filter(item => !item?.disabled && !item?.isSelectAll);
-    const disabledItemCount = filteredItems.filter(item => item?.disabled).length;
+    const allSelectableItems = filteredItems.filter(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+    item => !item?.disabled && !item?.isSelectAll);
+    const disabledItemCount = filteredItems.filter(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+    item => item?.disabled).length;
     let newSelectedItems;
 
     // deselect all on click to All/indeterminate option
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
     if (item?.isSelectAll && selectedItems.length > 0) {
       newSelectedItems = [];
     }
     // select all options
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
     else if (item?.isSelectAll && selectedItems.length === 0) {
       newSelectedItems = allSelectableItems;
     } else {
@@ -69,7 +76,9 @@ const useSelection = ({
         }
       } else {
         newSelectedItems = removeAtIndex(selectedItems, selectedIndex);
-        newSelectedItems = newSelectedItems.filter(item => !item?.isSelectAll);
+        newSelectedItems = newSelectedItems.filter(
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+        item => !item?.isSelectAll);
       }
     }
     callOnChangeHandler({

package/es/internal/useMergedRefs.js

@@ -16,6 +16,7 @@ import { useMemo, useCallback } from 'react';
  * node, assigns that node to every ref in the array.
  */
 const useMergedRefs = refs => {
+  // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   const memoizedRefs = useMemo(() => refs, refs);
   return useCallback(node => {
     memoizedRefs.forEach(ref => {

package/es/internal/useNoInteractiveChildren.js

@@ -14,13 +14,16 @@ const useNoInteractiveChildren = (ref, message = 'component should have no inter
     /*
     // eslint-disable-next-line react-hooks/rules-of-hooks
     */
+    // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
     useEffect(() => {
       const node = ref.current ? getInteractiveContent(ref.current) : false;
       if (node) {
         const errorMessage = `Error: ${message}.\n\nInstead found: ${node.outerHTML}`;
+        // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
         console.error(errorMessage);
         throw new Error(errorMessage);
       }
+      // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
     }, []);
   }
 };
@@ -31,6 +34,7 @@ const useInteractiveChildrenNeedDescription = (ref, message = `interactive child
     /*
     // eslint-disable-next-line react-hooks/rules-of-hooks
     */
+    // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
     useEffect(() => {
       const node = ref.current ? getInteractiveContent(ref.current) : false;
       if (node && !node.hasAttribute('aria-describedby')) {

package/es/internal/useOutsideClick.js

@@ -23,6 +23,7 @@ const useOutsideClick = (ref, callback) => {
     /*
     // eslint-disable-next-line react-hooks/rules-of-hooks
     */
+    // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
     useWindowEvent('click', event => {
       const {
         target

package/es/internal/useOverflowItems.js

@@ -36,6 +36,7 @@ const useOverflowItems = (items, containerRef, offsetRef, maxItems, onChange) =>
       setMaxWidth(newMax);
     }
   };
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   useResizeObserver({
     ref: containerRef,
     onResize: handleResize
@@ -85,14 +86,17 @@ const useOverflowItems = (items, containerRef, offsetRef, maxItems, onChange) =>
   };
 
   // Memoize visible items calculation to avoid recalculating on every render
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   const visibleItems = useMemo(() => {
     if (!Array.isArray(items)) {
       return [];
     }
     return getVisibleItems();
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [items, maxWidth, maxItems]);
 
   // Memoize hidden items calculation
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   const hiddenItems = useMemo(() => {
     if (!Array.isArray(items)) {
       return [];
@@ -101,9 +105,11 @@ const useOverflowItems = (items, containerRef, offsetRef, maxItems, onChange) =>
   }, [items, visibleItems]);
 
   // Use previous value to compare and only call onChange when needed
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   const previousHiddenItems = usePreviousValue(hiddenItems);
 
   // Only call onChange if hidden items actually changed
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   useEffect(() => {
   }, [hiddenItems, previousHiddenItems, onChange]);
   return {

package/es/internal/useResizeObserver.js

@@ -35,6 +35,7 @@ const useResizeObserver = ({
       return;
     }
     getInitialSize();
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [width, height]);
   useLayoutEffect(() => {
     if (!ref?.current) {
@@ -47,6 +48,8 @@ const useResizeObserver = ({
       const entry = entriesToHandle.current[0];
       setWidth(entry.contentRect.width);
       setHeight(entry.contentRect.height);
+
+      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
       cb.current && cb.current(entry.contentRect);
     };
     const observer = new ResizeObserver(entries => {
@@ -63,6 +66,7 @@ const useResizeObserver = ({
     return () => {
       observer.disconnect();
     };
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, []);
   return {
     width,

package/es/internal/useSavedCallback.js

@@ -15,6 +15,7 @@ import { useRef, useEffect, useCallback } from 'react';
  *
  * @param callback - The callback to track.
  */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
 const useSavedCallback = callback => {
   const savedCallback = useRef(callback);
   useEffect(() => {

package/es/internal/warning.js

@@ -22,6 +22,7 @@ const warning = process.env.NODE_ENV !== 'production' ? (condition, message) =>
     throw new Error('`warning(condition, message)` requires a warning ' + 'format argument');
   }
   if (!condition) {
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
     console.warn('Warning: ' + message);
   }
 } : noopFn;

package/es/prop-types/isRequiredOneOf.js

@@ -13,9 +13,12 @@
  *    are the names of the props, and the values are the prop-type validators.
  * @returns A new object of wrapped prop-type validators.
  */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
 const isRequiredOneOf = propTypes => {
   const names = Object.keys(propTypes);
-  const checker = propType => (props, propName, componentName, ...rest) => {
+  const checker = propType =>
+  // eslint-disable-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  (props, propName, componentName, ...rest) => {
     if (process.env.NODE_ENV !== 'production' && names.every(name => typeof props[name] === 'undefined')) {
       return new Error(`${componentName} requires one of the following props: ${names.join(', ')}`);
     }

package/es/tools/events.js

@@ -14,7 +14,9 @@
  * @param handlers - An array of event handler functions.
  * @returns A composite event handler.
  */
-const composeEventHandlers = handlers => (event, ...args) => {
+const composeEventHandlers = handlers =>
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+(event, ...args) => {
   for (const handler of handlers) {
     if (event.defaultPrevented) {
       break;

package/es/tools/wrapComponent.js

@@ -42,6 +42,7 @@ const wrapComponent = ({
   Component.propTypes = {
     className: PropTypes.string
   };
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   return Component;
 };
 

package/lib/components/AILabel/index.js

@@ -21,17 +21,19 @@ var deprecate = require('../../prop-types/deprecate.js');
 var _Undo;
 const AILabelContent = /*#__PURE__*/React.forwardRef(function AILabelContent({
   className,
-  children,
-  ...rest
-}, ref) {
+  children
+}, ref // eslint-disable-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
+) {
   const prefix = usePrefix.usePrefix();
   const hasAILabelActions = React.Children.toArray(children).some(child => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
     const item = child;
     // TODO: Is there supposed to be a `return` here? If so, this issue would
     // have been caught by ESLint. It's concerning that this code is 7 months
     // old and no one has noticed any issues with it. It also makes me question
     // whether the code is necessary.
     // https://github.com/carbon-design-system/carbon/issues/18991
+    // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
     item.type === AILabelActions;
   });
   const aiLabelContentClasses = cx(className, {
@@ -55,9 +57,9 @@ AILabelContent.propTypes = {
 };
 const AILabelActions = /*#__PURE__*/React.forwardRef(function AILabelActions({
   className,
-  children,
-  ...rest
-}, ref) {
+  children
+}, ref // eslint-disable-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
+) {
   const prefix = usePrefix.usePrefix();
   const aiLabelActionsClasses = cx(className, {
     [`${prefix}--ai-label-actions`]: true

package/lib/components/Breadcrumb/BreadcrumbItem.js

@@ -37,6 +37,8 @@ const BreadcrumbItem = frFn((props, ref) => {
     [`${prefix}--breadcrumb-item--current`]: isCurrentPage && ariaCurrent !== 'page',
     [customClassName]: !!customClassName
   });
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   const child = children;
   if (child.type && child.type.displayName !== undefined && child.type.displayName.includes('OverflowMenu')) {
     const horizontalOverflowIcon = /*#__PURE__*/React.createElement(iconsReact.OverflowMenuHorizontal, {

package/lib/components/Button/Button.js

@@ -25,6 +25,8 @@ function isIconOnlyButton(hasIconOnly, _kind) {
   }
   return false;
 }
+
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
 const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
   const {
     as,
@@ -47,6 +49,7 @@ const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
     ...rest
   } = props;
   if (ButtonImageElement && !children && !iconDescription) {
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
     console.error('Button: renderIcon property specified without also providing an iconDescription property. ' + 'This may impact accessibility for screen reader users.');
   }
   const iconOnlyImage = !ButtonImageElement ? null : /*#__PURE__*/React.createElement(ButtonImageElement, null);

package/lib/components/ChatButton/ChatButton.js

@@ -42,6 +42,7 @@ const ChatButton = /*#__PURE__*/React.forwardRef(function ChatButton({
   } else {
     // Check if size is valid and warn if not
     if (size && !allowedSizes.includes(size)) {
+      // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
       console.error(`Invalid size "${size}" provided to ChatButton. Size must be one of: ${allowedSizes.join(', ')}. Defaulting to "lg".`);
       size = 'lg';
     }

package/lib/components/CheckboxGroup/CheckboxGroup.js

@@ -19,6 +19,8 @@ var iconsReact = require('@carbon/icons-react');
 var useId = require('../../internal/useId.js');
 var index = require('../AILabel/index.js');
 var utils = require('../../internal/utils.js');
+var Checkbox = require('../Checkbox/Checkbox.js');
+require('../Checkbox/Checkbox.Skeleton.js');
 
 const CheckboxGroup = ({
   children,
@@ -61,6 +63,23 @@ const CheckboxGroup = ({
     size: 'mini',
     kind: 'default'
   }) : null;
+  const clonedChildren = React.Children.map(children, child => {
+    if (/*#__PURE__*/React.isValidElement(child) && child.type === Checkbox.default) {
+      const childProps = {
+        ...(typeof invalid !== 'undefined' && typeof child.props.invalid === 'undefined' ? {
+          invalid
+        } : {}),
+        ...(typeof readOnly !== 'undefined' && typeof child.props.readOnly === 'undefined' ? {
+          readOnly
+        } : {}),
+        ...(typeof warn !== 'undefined' && typeof child.props.warn === 'undefined' ? {
+          warn
+        } : {})
+      };
+      return Object.keys(childProps).length ? /*#__PURE__*/React.cloneElement(child, childProps) : child;
+    }
+    return child;
+  });
   return /*#__PURE__*/React.createElement("fieldset", _rollupPluginBabelHelpers.extends({
     className: fieldsetClasses,
     "data-invalid": invalid ? true : undefined,
@@ -72,7 +91,7 @@ const CheckboxGroup = ({
     id: legendId || rest['aria-labelledby']
   }, legendText, slug ? normalizedDecorator : decorator ? /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--checkbox-group-inner--decorator`
-  }, normalizedDecorator) : ''), children, /*#__PURE__*/React.createElement("div", {
+  }, normalizedDecorator) : ''), clonedChildren, /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--checkbox-group__validation-msg`
   }, !readOnly && invalid && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(iconsReact.WarningFilled, {
     className: `${prefix}--checkbox__invalid-icon`

package/lib/components/ComboBox/ComboBox.js

@@ -184,6 +184,7 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
         refs.floating.current.style.width = parentWidth + 'px';
       }
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [enableFloatingStyles, floatingStyles, refs.floating, parentWidth]);
   const [inputValue, setInputValue] = React.useState(getInputValue({
     initialSelectedItem,
@@ -213,6 +214,7 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
       }
       prevInputLengthRef.current = inputValue.length;
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [typeahead, inputValue, items, itemToString, autocompleteCustomFilter]);
   const isManualClearingRef = React.useRef(false);
   const [isClearing, setIsClearing] = React.useState(false);
@@ -253,6 +255,7 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
       }
       prevSelectedItemProp.current = selectedItemProp;
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [selectedItemProp]);
   const filterItems = (items, itemToString, inputValue) => items.filter(item => typeahead ? autocompleteCustomFilter({
     item: itemToString(item),
@@ -267,8 +270,10 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
   React.useEffect(() => {
     if (prevInputValue.current !== inputValue) {
       prevInputValue.current = inputValue;
+      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
       onInputChange && onInputChange(inputValue);
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [inputValue]);
   const handleSelectionClear = () => {
     if (textInput?.current) {
@@ -321,6 +326,8 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
           if (state.highlightedIndex !== -1) {
             const filteredList = filterItems(items, itemToString, inputValue);
             const highlightedItem = filteredList[state.highlightedIndex];
+
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
             if (highlightedItem && !highlightedItem.disabled) {
               return {
                 ...changes,
@@ -332,6 +339,8 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
             const autoIndex = indexToHighlight(inputValue);
             if (autoIndex !== -1) {
               const matchingItem = items[autoIndex];
+
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
               if (matchingItem && !matchingItem.disabled) {
                 return {
                   ...changes,
@@ -484,8 +493,10 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
     onHighlightedIndexChange: ({
       highlightedIndex
     }) => {
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion , valid-typeof , no-constant-binary-expression -- https://github.com/carbon-design-system/carbon/issues/20071
       if (highlightedIndex > -1 && typeof window !== undefined) {
         const itemArray = document.querySelectorAll(`li.${prefix}--list-box__menu-item[role="option"]`);
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20071
         const highlightedItem = itemArray[highlightedIndex];
         if (highlightedItem) {
           highlightedItem.scrollIntoView({
@@ -498,7 +509,9 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
     initialSelectedItem: initialSelectedItem,
     inputId: id,
     stateReducer,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
     isItemDisabled(item, _index) {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
       return item?.disabled;
     },
     ...downshiftProps,
@@ -535,6 +548,7 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
         toggleMenu
       };
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [closeMenu, openMenu, reset, selectItem, setHighlightedIndex, downshiftSetInputValue, toggleMenu]);
   const buttonProps = getToggleButtonProps({
     disabled: disabled || readOnly,
@@ -583,7 +597,9 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
   // Memoize the value of getMenuProps to avoid an infinite loop
   const menuProps = React.useMemo(() => getMenuProps({
     ref: enableFloatingStyles ? refs.setFloating : null
-  }), [enableFloatingStyles, deprecatedAriaLabel, ariaLabel, getMenuProps, refs.setFloating]);
+  }),
+  // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
+  [enableFloatingStyles, deprecatedAriaLabel, ariaLabel, getMenuProps, refs.setFloating]);
   React.useEffect(() => {
     if (textInput.current) {
       if (inputRef.current && typeaheadText) {

package/lib/components/ComboButton/index.js

@@ -56,6 +56,7 @@ const ComboButton = /*#__PURE__*/React.forwardRef(function ComboButton({
   const id = useId.useId('combobutton');
   const prefix = usePrefix.usePrefix();
   const containerRef = React.useRef(null);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   let middlewares = [];
   if (!enableOnlyFloatingStyles) {
     middlewares = [react.flip({

package/lib/components/ComposedModal/ComposedModal.js

@@ -138,6 +138,7 @@ const ComposedModal = /*#__PURE__*/React.forwardRef(function ComposedModal({
       setWasOpen(!!open);
       toggleClass.toggleClass(document.body, `${prefix}--body--with-modal-open`, !!open);
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [open, wasOpen, prefix]);
   // Remove the document.body className on unmount
   React.useEffect(() => {
@@ -213,7 +214,7 @@ const ComposedModal = /*#__PURE__*/React.forwardRef(function ComposedModal({
     }
     const lastContent = modalContent.children[modalContent.children.length - 1];
     const gradientSpacing = modalContent.scrollHeight - lastContent.offsetTop - lastContent.clientHeight;
-    for (let elem of modalContent.children) {
+    for (const elem of modalContent.children) {
       if (elem.contains(currentActiveNode)) {
         const spaceBelow = modalContent.clientHeight - elem.offsetTop + modalContent.scrollTop - elem.clientHeight;
         if (spaceBelow < gradientSpacing) {
@@ -280,6 +281,7 @@ const ComposedModal = /*#__PURE__*/React.forwardRef(function ComposedModal({
     return () => {
       document.removeEventListener('keydown', handleEscapeKey, true);
     };
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [open]);
   React.useEffect(() => {
     if (!enableDialogElement && !open && launcherButtonRef) {
@@ -311,6 +313,7 @@ const ComposedModal = /*#__PURE__*/React.forwardRef(function ComposedModal({
         focusButton(innerModal.current);
       }
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [open, selectorPrimaryFocus, isOpen]);
 
   // AILabel is always size `sm`

package/lib/components/DataTable/DataTable.js

@@ -70,6 +70,17 @@ const defaultTranslations = {
   [translationKeys.unselectRow]: 'Unselect row'
 };
 const translateWithId = id => defaultTranslations[id];
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+
 /**
  * Data Tables are used to represent a collection of resources, displaying a
  * subset of their fields in columns, or headers. We prioritize direct updates
@@ -80,6 +91,7 @@ const translateWithId = id => defaultTranslations[id];
  * and updating the state of the single entity will cascade updates to the
  * consumer.
  */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
 const DataTable = props => {
   const {
     children,
@@ -128,6 +140,7 @@ const DataTable = props => {
     if (hasRowIdsChanged || hasHeadersChanged || hasRowsChanged) {
       setState(prev => getDerivedStateFromProps.default(props, prev));
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [headers, rows]);
 
   /**
@@ -160,6 +173,7 @@ const DataTable = props => {
           ...prev,
           ...nextSortState
         }));
+        // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
         onClick && handleOnHeaderClick(onClick, {
           sortHeaderKey: header.key,
           sortDirection: nextSortState.sortDirection

package/lib/components/DataTable/Table.js

@@ -76,9 +76,11 @@ const Table = ({
     [`${prefix}--data-table--visible-overflow-menu`]: !overflowMenuOnHover
   });
   const toggleTableBodyAlignmentClass = React.useCallback((alignTop = false) => {
+    // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
     alignTop ? tableRef.current?.classList.add(`${prefix}--data-table--top-aligned-body`) : tableRef.current?.classList.remove(`${prefix}--data-table--top-aligned-body`);
   }, [prefix]);
   const toggleTableHeaderAlignmentClass = React.useCallback((alignTop = false) => {
+    // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
     alignTop ? tableRef.current?.classList.add(`${prefix}--data-table--top-aligned-header`) : tableRef.current?.classList.remove(`${prefix}--data-table--top-aligned-header`);
   }, [prefix]);
   const setTableAlignment = React.useCallback(() => {
@@ -128,9 +130,7 @@ const Table = ({
     setTableAlignment();
   }, [setTableAlignment, size]);
   const table = /*#__PURE__*/React.createElement("div", {
-    className: `${prefix}--data-table-content`
-    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-    ,
+    className: `${prefix}--data-table-content`,
     tabIndex: tabIndex ?? (isScrollable ? 0 : undefined)
   }, /*#__PURE__*/React.createElement("table", _rollupPluginBabelHelpers.extends({
     "aria-labelledby": titleId,

package/lib/components/DataTable/TableExpandHeader.js

@@ -95,7 +95,11 @@ TableExpandHeader.propTypes = {
   /**
    * Hook for when a listener initiates a request to expand the given row
    */
-  onExpand: PropTypes.oneOfType([requiredIfGivenPropIsTruthy.default('enableExpando', PropTypes.func), requiredIfGivenPropIsTruthy.default('enableToggle', PropTypes.func)])
+  onExpand: PropTypes.oneOfType([requiredIfGivenPropIsTruthy.default('enableExpando', PropTypes.func
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  ), requiredIfGivenPropIsTruthy.default('enableToggle', PropTypes.func
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  )])
 };
 
 exports.default = TableExpandHeader;

package/lib/components/DataTable/TableExpandRow.js

@@ -96,6 +96,7 @@ TableExpandRow.propTypes = {
    * Specify the string read by a voice reader when the expand trigger is
    * focused
    */
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
   /**@ts-ignore*/
   'aria-label': PropTypes.string,
   /**

package/lib/components/DataTable/TableHeader.js

@@ -192,6 +192,8 @@ TableHeader.propTypes = {
    */
   translateWithId: PropTypes.func
 };
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
 TableHeader.translationKeys = Object.values(translationKeys);
 TableHeader.displayName = 'TableHeader';
 

package/lib/components/DataTable/TableRow.js

@@ -25,10 +25,15 @@ const TableRow = frFn((props, ref) => {
   // only useful in `TableExpandRow`
   const {
     ariaLabel,
+    // eslint-disable-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
     'aria-label': ariaLabelAlt,
+    // eslint-disable-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
     'aria-controls': ariaControls,
+    // eslint-disable-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
     onExpand,
+    // eslint-disable-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
     isExpanded,
+    // eslint-disable-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
     isSelected,
     ...cleanProps
   } = props;

package/lib/components/DataTable/TableSlugRow.js

@@ -34,6 +34,7 @@ const TableSlugRow = ({
   // Slug is always size `mini`
   let normalizedSlug;
   if (slug) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
     normalizedSlug = /*#__PURE__*/React.cloneElement(slug, {
       size: 'mini'
     });