@carbon/react 1.89.0 → 1.90.0

package/lib/components/Tabs/Tabs.js

@@ -80,6 +80,7 @@ function Tabs({
 }) {
   const baseId = useId.useId('ccs');
   if (dismissable && !onTabCloseRequest) {
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
     console.error('dismissable property specified without also providing an onTabCloseRequest property.');
   }
   // The active index is used to track the element which has focus in our tablist
@@ -166,15 +167,11 @@ function TabsVertical({
   };
   const isSm = useMatchMedia.useMatchMedia(smMediaQuery);
   if (!isSm) {
-    return (
-      /*#__PURE__*/
-      // eslint-disable-next-line react/forbid-component-props
-      React.createElement(Grid.Grid, {
-        style: {
-          height: height
-        }
-      }, /*#__PURE__*/React.createElement(Tabs, props, children))
-    );
+    return /*#__PURE__*/React.createElement(Grid.Grid, {
+      style: {
+        height: height
+      }
+    }, /*#__PURE__*/React.createElement(Tabs, props, children));
   }
   return /*#__PURE__*/React.createElement(Tabs, props, children);
 }
@@ -278,6 +275,7 @@ function TabList({
   let hasSecondaryLabelTabs = false;
   if (contained) {
     hasSecondaryLabelTabs = 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 _child = child;
       return /*#__PURE__*/React.isValidElement(child) && !!_child.props.secondaryLabel;
     });
@@ -391,6 +389,7 @@ function TabList({
         inline: 'nearest'
       });
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, []);
   React.useEffect(() => {
     //adding 1 in calculation for firefox support
@@ -411,6 +410,7 @@ function TabList({
         setSelectedIndex(tabs.current.indexOf(tab));
       }
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, []);
   useIsomorphicEffect.default(() => {
     if (ref.current) {
@@ -497,7 +497,9 @@ function TabList({
         hasSecondaryLabel: hasSecondaryLabelTabs,
         contained
       }
-    }, /*#__PURE__*/React.cloneElement(child, {
+    }, /*#__PURE__*/React.cloneElement(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+    child, {
       ref: node => {
         tabs.current[index] = node;
       }
@@ -631,6 +633,7 @@ function TabListVertical({
         setSelectedIndex(tabs.current.indexOf(tab));
       }
     }
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, []);
   React.useEffect(() => {
     function handler() {
@@ -641,6 +644,7 @@ function TabListVertical({
       if (containerTop && containerHeight) {
         // scrolls so selected tab is in view
         if (selectedPositionTop - halfTabHeight < containerTop || selectedPositionTop - containerTop + verticalTabHeight + halfTabHeight > containerHeight) {
+          // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
           ref.current && ref.current.scrollTo({
             top: (selectedIndex - 1) * verticalTabHeight,
             behavior: 'smooth'
@@ -695,7 +699,9 @@ function TabListVertical({
         index,
         hasSecondaryLabel: false
       }
-    }, /*#__PURE__*/React.cloneElement(child, {
+    }, /*#__PURE__*/React.cloneElement(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+    child, {
       ref: node => {
         tabs.current[index] = node;
       }
@@ -771,7 +777,8 @@ function createLongPressBehavior(ref, direction, setScrollLeft) {
  * Tab
  */
 
-const Tab = /*#__PURE__*/React.forwardRef(function Tab({
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+const Tab = /*#__PURE__*/React.forwardRef(({
   as = 'button',
   children,
   className: customClassName,
@@ -781,7 +788,7 @@ const Tab = /*#__PURE__*/React.forwardRef(function Tab({
   secondaryLabel,
   renderIcon: Icon,
   ...rest
-}, forwardRef) {
+}, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const {
     selectedIndex,
@@ -805,6 +812,8 @@ const Tab = /*#__PURE__*/React.forwardRef(function Tab({
   const id = `${baseId}-tab-${index$1}`;
   const panelId = `${baseId}-tabpanel-${index$1}`;
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   const isEllipsisActive = element => {
     setIsEllipsisApplied(element.offsetHeight < element.scrollHeight);
     return element.offsetHeight < element.scrollHeight;
@@ -1024,7 +1033,8 @@ Tab.propTypes = {
  */
 
 const IconTabContext = /*#__PURE__*/React.createContext(false);
-const IconTab = /*#__PURE__*/React.forwardRef(function IconTab({
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+const IconTab = /*#__PURE__*/React.forwardRef(({
   badgeIndicator,
   children,
   className: customClassName,
@@ -1033,7 +1043,7 @@ const IconTab = /*#__PURE__*/React.forwardRef(function IconTab({
   leaveDelayMs,
   label,
   ...rest
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   const value = React.useMemo(() => ({
     badgeIndicator
@@ -1095,11 +1105,12 @@ IconTab.propTypes = {
  * TabPanel
  */
 
-const TabPanel = /*#__PURE__*/React.forwardRef(function TabPanel({
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+const TabPanel = /*#__PURE__*/React.forwardRef(({
   children,
   className: customClassName,
   ...rest
-}, forwardRef) {
+}, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const panel = React.useRef(null);
   const ref = useMergedRefs.useMergedRefs([forwardRef, panel]);

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

@@ -7,6 +7,7 @@
 import React, { type ReactNode } from 'react';
 import { PolymorphicProps } from '../../types/common';
 import { SIZES, TYPES } from './Tag';
+import { PopoverAlignment } from '../Popover';
 export interface DismissibleTagBaseProps {
     /**
      * Provide a custom className that is applied to the containing <span>
@@ -20,6 +21,10 @@ export interface DismissibleTagBaseProps {
      * Specify if the `DismissibleTag` is disabled
      */
     disabled?: boolean;
+    /**
+     * Specify the tooltip alignment for the dismiss button
+     */
+    dismissTooltipAlignment?: PopoverAlignment;
     /**
      * Provide a custom tooltip label for the dismiss button
      */

package/lib/components/Tag/DismissibleTag.js

@@ -28,6 +28,7 @@ var utils = require('../../internal/utils.js');
 var Text = require('../Text/Text.js');
 
 var _Close;
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
 const DismissibleTag = /*#__PURE__*/React.forwardRef(({
   className,
   decorator,
@@ -41,11 +42,13 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef(({
   text,
   tagTitle,
   type,
+  dismissTooltipAlignment = 'bottom',
   dismissTooltipLabel = 'Dismiss tag',
   ...other
 }, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagLabelRef = React.useRef(null);
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   const tagId = id || `tag-${useId.useId()}`;
   const tagClasses = cx(`${prefix}--tag--filter`, className);
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
@@ -92,7 +95,7 @@ const DismissibleTag = /*#__PURE__*/React.forwardRef(({
     className: `${prefix}--tag__decorator`
   }, normalizedDecorator) : '', /*#__PURE__*/React.createElement(Tooltip.Tooltip, {
     label: dismissActionLabel,
-    align: "bottom",
+    align: dismissTooltipAlignment,
     className: tooltipClasses,
     leaveDelayMs: 0,
     closeOnActivation: true
@@ -117,6 +120,10 @@ DismissibleTag.propTypes = {
    * Specify if the `DismissibleTag` is disabled
    */
   disabled: PropTypes.bool,
+  /**
+   * Specify the tooltip alignment for the dismiss button
+   */
+  dismissTooltipAlignment: PropTypes.oneOf(['top', 'bottom', 'left', 'right', 'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-end', 'left-start', 'right-end', 'right-start']),
   /**
    * Provide a custom tooltip label for the dismiss button
    */

package/lib/components/Tag/OperationalTag.js

@@ -35,6 +35,7 @@ const TYPES = {
   'cool-gray': 'Cool-Gray',
   'warm-gray': 'Warm-Gray'
 };
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
 const OperationalTag = /*#__PURE__*/React.forwardRef(({
   className,
   disabled,
@@ -47,6 +48,7 @@ const OperationalTag = /*#__PURE__*/React.forwardRef(({
 }, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   const tagId = id || `tag-${useId.useId()}`;
   const tagClasses = cx(`${prefix}--tag--operational`, className);
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);

package/lib/components/Tag/SelectableTag.js

@@ -24,6 +24,7 @@ var mergeRefs = require('../../tools/mergeRefs.js');
 var useControllableState = require('../../internal/useControllableState.js');
 var Text = require('../Text/Text.js');
 
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
 const SelectableTag = /*#__PURE__*/React.forwardRef(({
   className,
   disabled,
@@ -39,6 +40,7 @@ const SelectableTag = /*#__PURE__*/React.forwardRef(({
 }, forwardRef) => {
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   const tagId = id || `tag-${useId.useId()}`;
   const [selectedTag, setSelectedTag] = useControllableState.useControllableState({
     value: selected,

package/lib/components/Tag/Tag.js

@@ -46,6 +46,7 @@ const SIZES = {
   md: 'md',
   lg: 'lg'
 };
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
 const TagBase = /*#__PURE__*/React.forwardRef(({
   children,
   className,
@@ -68,12 +69,15 @@ const TagBase = /*#__PURE__*/React.forwardRef(({
   const prefix = usePrefix.usePrefix();
   const tagRef = React.useRef(null);
   if (filter) {
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
     console.warn('The `filter` prop for Tag has been deprecated and will be removed in the next major version. Use DismissibleTag instead.');
   }
   if (onClose) {
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
     console.warn('The `onClose` prop for Tag has been deprecated and will be removed in the next major version. Use DismissibleTag instead.');
   }
   const ref = useMergedRefs.useMergedRefs([forwardRef, tagRef]);
+  // eslint-disable-next-line  react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
   const tagId = id || `tag-${useId.useId()}`;
   const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
   React.useLayoutEffect(() => {

package/lib/components/Tag/isEllipsisActive.js

@@ -7,6 +7,7 @@
 
 'use strict';
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
 const isEllipsisActive = element => {
   if (element) {
     return element?.offsetWidth < element?.scrollWidth;

package/lib/components/Text/Text.js

@@ -13,6 +13,7 @@ var React = require('react');
 require('./index.js');
 var TextDirectionContext = require('./TextDirectionContext.js');
 
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
 const TextBase = /*#__PURE__*/React.forwardRef(({
   as,
   children,

package/lib/components/TextInput/ControlledPasswordInput.js

@@ -20,7 +20,7 @@ var usePrefix = require('../../internal/usePrefix.js');
 var useId = require('../../internal/useId.js');
 var noopFn = require('../../internal/noopFn.js');
 
-const ControlledPasswordInput = /*#__PURE__*/React.forwardRef(function ControlledPasswordInput({
+const ControlledPasswordInput = /*#__PURE__*/React.forwardRef(({
   labelText,
   className,
   id,
@@ -33,9 +33,7 @@ const ControlledPasswordInput = /*#__PURE__*/React.forwardRef(function Controlle
   invalidText = '',
   helperText = '',
   light,
-  // eslint-disable-next-line react/prop-types
   type = 'password',
-  // eslint-disable-next-line react/prop-types
   togglePasswordVisibility,
   tooltipPosition = 'bottom',
   tooltipAlignment = 'center',
@@ -43,7 +41,7 @@ const ControlledPasswordInput = /*#__PURE__*/React.forwardRef(function Controlle
   showPasswordLabel = 'Show password',
   size = undefined,
   ...other
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   const controlledPasswordInstanceId = useId.useId();
   const errorId = id + '-error-msg';

package/lib/components/TextInput/PasswordInput.js

@@ -23,7 +23,7 @@ var Tooltip = require('../Tooltip/Tooltip.js');
 var deprecate = require('../../prop-types/deprecate.js');
 var usePrefix = require('../../internal/usePrefix.js');
 
-const PasswordInput = /*#__PURE__*/React.forwardRef(function PasswordInput({
+const PasswordInput = /*#__PURE__*/React.forwardRef(({
   className,
   disabled = false,
   helperText,
@@ -48,7 +48,7 @@ const PasswordInput = /*#__PURE__*/React.forwardRef(function PasswordInput({
   warn = false,
   warnText,
   ...rest
-}, ref) {
+}, ref) => {
   const [inputType, setInputType] = React.useState(type);
   const prefix = usePrefix.usePrefix();
   const normalizedProps = useNormalizedInputProps.useNormalizedInputProps({
@@ -65,6 +65,7 @@ const PasswordInput = /*#__PURE__*/React.forwardRef(function PasswordInput({
   } = React.useContext(FormContext.FormContext);
   const handleTogglePasswordVisibility = event => {
     setInputType(inputType === 'password' ? 'text' : 'password');
+    // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
     onTogglePasswordVisibility && onTogglePasswordVisibility(event);
   };
   const textInputClasses = cx(`${prefix}--text-input`, `${prefix}--password-input`, className, {
@@ -154,8 +155,10 @@ const PasswordInput = /*#__PURE__*/React.forwardRef(function PasswordInput({
     align = tooltipPosition;
   }
   if (!hidePasswordLabel || hidePasswordLabel.trim() === '') {
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
     console.warn('Warning: The "hidePasswordLabel" should not be blank.');
   } else if (!showPasswordLabel || showPasswordLabel.trim() === '') {
+    // eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
     console.warn('Warning: The "showPasswordLabel" should not be blank.');
   }
   const input = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("input", _rollupPluginBabelHelpers.extends({}, util.textInputProps({
@@ -184,6 +187,8 @@ const PasswordInput = /*#__PURE__*/React.forwardRef(function PasswordInput({
   React.useEffect(() => {
     setInputType(type);
   }, [type]);
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   const Icon = normalizedProps.icon;
   return /*#__PURE__*/React.createElement("div", {
     className: inputWrapperClasses

package/lib/components/TextInput/TextInput.js

@@ -25,7 +25,7 @@ var index = require('../AILabel/index.js');
 var utils = require('../../internal/utils.js');
 var Text = require('../Text/Text.js');
 
-const TextInput = /*#__PURE__*/React.forwardRef(function TextInput({
+const TextInput = /*#__PURE__*/React.forwardRef(({
   className,
   decorator,
   disabled = false,
@@ -49,7 +49,7 @@ const TextInput = /*#__PURE__*/React.forwardRef(function TextInput({
   maxCount,
   slug,
   ...rest
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   const {
     defaultValue,
@@ -64,6 +64,7 @@ const TextInput = /*#__PURE__*/React.forwardRef(function TextInput({
   const [textCount, setTextCount] = React.useState(getInitialTextCount());
   React.useEffect(() => {
     setTextCount(getInitialTextCount());
+    // eslint-disable-next-line  react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
   }, [value, defaultValue, enableCounter]);
   const normalizedProps = useNormalizedInputProps.useNormalizedInputProps({
     id,
@@ -192,6 +193,7 @@ const TextInput = /*#__PURE__*/React.forwardRef(function TextInput({
       }
     }
   }, [ariaAnnouncement, prevAnnouncement]);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   const Icon = normalizedProps.icon;
 
   // AILabel is always size `mini`

package/lib/components/Theme/index.js

@@ -18,16 +18,20 @@ var useMatchMedia = require('../../internal/useMatchMedia.js');
 const ThemeContext = /*#__PURE__*/React.createContext({
   theme: 'white'
 });
-const GlobalTheme = /*#__PURE__*/React.forwardRef(function GlobalTheme({
+
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+const GlobalTheme = /*#__PURE__*/React.forwardRef(({
   children,
   theme
-}, ref) {
+}, ref) => {
   const value = React.useMemo(() => {
     return {
       theme
     };
   }, [theme]);
-  const childrenWithProps = /*#__PURE__*/React.cloneElement(children, {
+  const childrenWithProps = /*#__PURE__*/React.cloneElement(
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
+  children, {
     ref: ref
   });
   return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
@@ -69,6 +73,7 @@ function Theme({
       isDark
     };
   }, [theme]);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   const BaseComponentAsAny = BaseComponent;
   return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
     value: value

package/lib/components/Tile/Tile.js

@@ -29,7 +29,7 @@ var utils = require('../../internal/utils.js');
 var Text = require('../Text/Text.js');
 
 var _CheckboxCheckedFille, _Checkbox, _ChevronDown, _ChevronDown2;
-const Tile = /*#__PURE__*/React.forwardRef(function Tile({
+const Tile = /*#__PURE__*/React.forwardRef(({
   children,
   className,
   decorator,
@@ -37,7 +37,7 @@ const Tile = /*#__PURE__*/React.forwardRef(function Tile({
   slug,
   hasRoundedCorners = false,
   ...rest
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   const tileClasses = cx(`${prefix}--tile`, {
     [`${prefix}--tile--light`]: light,
@@ -84,7 +84,7 @@ Tile.propTypes = {
    */
   slug: deprecate.deprecate(PropTypes.node, 'The `slug` prop for `Tile` has ' + 'been deprecated in favor of the new `decorator` prop. It will be removed in the next major release.')
 };
-const ClickableTile = /*#__PURE__*/React.forwardRef(function ClickableTile({
+const ClickableTile = /*#__PURE__*/React.forwardRef(({
   children,
   className,
   clicked = false,
@@ -98,7 +98,7 @@ const ClickableTile = /*#__PURE__*/React.forwardRef(function ClickableTile({
   hasRoundedCorners,
   slug,
   ...rest
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   const classes = cx(`${prefix}--tile`, `${prefix}--tile--clickable`, {
     [`${prefix}--tile--is-clicked`]: clicked,
@@ -207,7 +207,8 @@ ClickableTile.propTypes = {
    */
   renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
 };
-const SelectableTile = /*#__PURE__*/React.forwardRef(function SelectableTile({
+// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
+const SelectableTile = /*#__PURE__*/React.forwardRef(({
   children,
   className,
   decorator,
@@ -223,7 +224,7 @@ const SelectableTile = /*#__PURE__*/React.forwardRef(function SelectableTile({
   slug,
   hasRoundedCorners,
   ...rest
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   const clickHandler = onClick;
   const keyDownHandler = onKeyDown;
@@ -284,9 +285,7 @@ const SelectableTile = /*#__PURE__*/React.forwardRef(function SelectableTile({
       onClick: !disabled ? handleClick : undefined,
       role: "checkbox",
       "aria-checked": isSelected,
-      onKeyDown: !disabled ? handleKeyDown : undefined
-      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-      ,
+      onKeyDown: !disabled ? handleKeyDown : undefined,
       tabIndex: !disabled ? tabIndex : undefined,
       ref: ref,
       id: id,
@@ -366,16 +365,14 @@ SelectableTile.propTypes = {
    */
   value: deprecate.deprecate(PropTypes.oneOfType([PropTypes.string, PropTypes.number]), 'The `value` property is no longer used.  It will be removed in the next major release.`')
 };
-const ExpandableTile = /*#__PURE__*/React.forwardRef(function ExpandableTile({
+const ExpandableTile = /*#__PURE__*/React.forwardRef(({
   tabIndex = 0,
   className,
   children,
   decorator,
   expanded = false,
   tileMaxHeight = 0,
-  // eslint-disable-line
   tilePadding = 0,
-  // eslint-disable-line
   onClick,
   onKeyUp,
   tileCollapsedIconText = 'Interact to expand Tile',
@@ -386,7 +383,7 @@ const ExpandableTile = /*#__PURE__*/React.forwardRef(function ExpandableTile({
   slug,
   hasRoundedCorners,
   ...rest
-}, forwardRef) {
+}, forwardRef) => {
   const [isTileMaxHeight, setIsTileMaxHeight] = React.useState(tileMaxHeight);
   const [isTilePadding, setIsTilePadding] = React.useState(tilePadding);
   const [prevExpanded, setPrevExpanded] = React.useState(expanded);
@@ -611,9 +608,9 @@ ExpandableTile.propTypes = {
   tileExpandedLabel: PropTypes.string
 };
 ExpandableTile.displayName = 'ExpandableTile';
-const TileAboveTheFoldContent = /*#__PURE__*/React.forwardRef(function TilAboveTheFoldContent({
+const TileAboveTheFoldContent = /*#__PURE__*/React.forwardRef(({
   children
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   return /*#__PURE__*/React.createElement("div", {
     ref: ref,
@@ -627,9 +624,9 @@ TileAboveTheFoldContent.propTypes = {
   children: PropTypes.node
 };
 TileAboveTheFoldContent.displayName = 'TileAboveTheFoldContent';
-const TileBelowTheFoldContent = /*#__PURE__*/React.forwardRef(function TileBelowTheFoldContent({
+const TileBelowTheFoldContent = /*#__PURE__*/React.forwardRef(({
   children
-}, ref) {
+}, ref) => {
   const prefix = usePrefix.usePrefix();
   return /*#__PURE__*/React.createElement("div", {
     ref: ref,

package/lib/components/TimePicker/TimePicker.js

@@ -116,6 +116,7 @@ const TimePicker = frFn((props, ref) => {
       }
     };
     const mappedChildren = React.Children.map(children, pickerSelect => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
       const item = pickerSelect;
       if (item) {
         return /*#__PURE__*/React.cloneElement(item, {

package/lib/components/Toggle/Toggle.js

@@ -71,7 +71,7 @@ function Toggle({
   const labelId = `${id}_label`;
   return (
     /*#__PURE__*/
-    // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
+    // eslint-disable-next-line jsx-a11y/click-events-have-key-events
     React.createElement("div", {
       className: wrapperClasses,
       onClick: !labelText ? e => {

package/lib/components/Toggletip/index.js

@@ -29,6 +29,7 @@ function ToggletipLabel({
 }) {
   const prefix = usePrefix.usePrefix();
   const className = cx(`${prefix}--toggletip-label`, customClassName);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   const BaseComponentAsAny = BaseComponent;
   return /*#__PURE__*/React.createElement(BaseComponentAsAny, _rollupPluginBabelHelpers.extends({
     className: className
@@ -129,13 +130,25 @@ function Toggletip({
       actions.close();
     }
   });
-  useEvent.useWindowEvent('click', ({
-    target
-  }) => {
-    if (open && target instanceof Node && !ref.current?.contains(target)) {
-      actions.close();
-    }
-  });
+  React.useEffect(() => {
+    if (!ref.current) return;
+    const targetDocument = ref.current.ownerDocument || document;
+    const eventType = 'PointerEvent' in window ? 'pointerdown' : 'mousedown';
+    const handleOutsideClick = event => {
+      const node = event.target;
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20071
+      if (open && node && !ref.current.contains(node)) {
+        setOpen(false);
+      }
+    };
+    const options = {
+      capture: true
+    };
+    targetDocument.addEventListener(eventType, handleOutsideClick, options);
+    return () => {
+      targetDocument.removeEventListener(eventType, handleOutsideClick, options);
+    };
+  }, [open]);
   return /*#__PURE__*/React.createElement(ToggletipContext.Provider, {
     value: value
   }, /*#__PURE__*/React.createElement(index.Popover, _rollupPluginBabelHelpers.extends({
@@ -156,6 +169,7 @@ function Toggletip({
 // Get all the properties from Popover except for "open".
 // The Typescript types for PropTypes are really messed up so we need lots of
 // casting.  It will be great when we can finally get rid of PropTypes altogether.
+// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
 const {
   open,
   ...popoverNonOpenPropTypes
@@ -183,6 +197,7 @@ const ToggletipButton = /*#__PURE__*/React.forwardRef(function ToggletipButton({
   const toggletip = useToggletip();
   const prefix = usePrefix.usePrefix();
   const className = cx(`${prefix}--toggletip-button`, customClassName);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
   const ComponentToggle = BaseComponent ?? 'button';
   if (ComponentToggle !== 'button') {
     return /*#__PURE__*/React.createElement(ComponentToggle, _rollupPluginBabelHelpers.extends({}, toggletip?.onClick, {

package/lib/components/Tooltip/DefinitionTooltip.js

@@ -50,6 +50,7 @@ const DefinitionTooltip = ({
       setOpen(false);
     },
     onMouseEnter: () => {
+      // eslint-disable-next-line  @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
       openOnHover ? setOpen(true) : null;
     },
     onFocus: () => {