@carbon/react 1.90.0-rc.0 → 1.90.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (248) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +743 -784
  2. package/es/components/AILabel/index.js +8 -6
  3. package/es/components/Breadcrumb/BreadcrumbItem.js +2 -0
  4. package/es/components/Button/Button.js +3 -0
  5. package/es/components/ChatButton/ChatButton.js +1 -0
  6. package/es/components/CheckboxGroup/CheckboxGroup.js +21 -2
  7. package/es/components/ComboBox/ComboBox.js +17 -1
  8. package/es/components/ComboButton/index.js +1 -0
  9. package/es/components/ComposedModal/ComposedModal.js +4 -1
  10. package/es/components/DataTable/DataTable.js +14 -0
  11. package/es/components/DataTable/Table.js +3 -3
  12. package/es/components/DataTable/TableExpandHeader.js +5 -1
  13. package/es/components/DataTable/TableExpandRow.js +1 -0
  14. package/es/components/DataTable/TableHeader.js +2 -0
  15. package/es/components/DataTable/TableRow.js +5 -0
  16. package/es/components/DataTable/TableSlugRow.js +1 -0
  17. package/es/components/DataTable/TableToolbarMenu.js +3 -0
  18. package/es/components/DataTable/state/sorting.d.ts +3 -1
  19. package/es/components/DataTable/state/sorting.js +2 -0
  20. package/es/components/DataTable/tools/sorting.js +1 -0
  21. package/es/components/DatePicker/DatePicker.js +14 -3
  22. package/es/components/DatePickerInput/DatePickerInput.js +6 -0
  23. package/es/components/Dialog/Dialog.js +10 -2
  24. package/es/components/Dropdown/Dropdown.js +16 -4
  25. package/es/components/ErrorBoundary/ErrorBoundaryContext.js +1 -0
  26. package/es/components/FileUploader/FileUploader.js +9 -2
  27. package/es/components/FileUploader/FileUploaderButton.js +1 -1
  28. package/es/components/FileUploader/FileUploaderDropContainer.js +1 -1
  29. package/es/components/FileUploader/FileUploaderItem.js +3 -0
  30. package/es/components/FluidMultiSelect/FluidMultiSelect.js +2 -0
  31. package/es/components/FluidNumberInput/FluidNumberInput.js +3 -2
  32. package/es/components/FluidSearch/FluidSearch.js +3 -2
  33. package/es/components/FluidSelect/FluidSelect.js +3 -2
  34. package/es/components/FluidTextInput/FluidTextInput.js +3 -2
  35. package/es/components/FluidTimePicker/FluidTimePicker.js +11 -4
  36. package/es/components/FluidTimePickerSelect/FluidTimePickerSelect.js +3 -2
  37. package/es/components/Grid/CSSGrid.js +5 -0
  38. package/es/components/Grid/Column.js +3 -0
  39. package/es/components/Grid/ColumnHang.js +1 -0
  40. package/es/components/Grid/FlexGrid.js +1 -0
  41. package/es/components/Grid/Row.js +1 -0
  42. package/es/components/Heading/index.js +3 -1
  43. package/es/components/IconButton/index.js +4 -2
  44. package/es/components/IconIndicator/index.js +4 -2
  45. package/es/components/InlineCheckbox/InlineCheckbox.js +3 -2
  46. package/es/components/Layout/index.js +6 -4
  47. package/es/components/LayoutDirection/LayoutDirection.js +2 -0
  48. package/es/components/Link/Link.js +3 -0
  49. package/es/components/ListBox/ListBoxMenuItem.js +4 -1
  50. package/es/components/ListBox/next/ListBoxTrigger.js +3 -2
  51. package/es/components/Menu/Menu.js +6 -9
  52. package/es/components/Menu/MenuContext.js +1 -0
  53. package/es/components/Menu/MenuItem.js +5 -13
  54. package/es/components/MenuButton/index.js +7 -2
  55. package/es/components/Modal/Modal.js +3 -0
  56. package/es/components/ModalWrapper/ModalWrapper.js +2 -0
  57. package/es/components/MultiSelect/FilterableMultiSelect.js +24 -5
  58. package/es/components/MultiSelect/MultiSelect.js +21 -5
  59. package/es/components/Notification/Notification.js +1 -1
  60. package/es/components/NumberInput/NumberInput.js +7 -1
  61. package/es/components/OverflowMenu/OverflowMenu.js +2 -0
  62. package/es/components/OverflowMenu/next/index.js +3 -2
  63. package/es/components/OverflowMenuItem/OverflowMenuItem.js +2 -0
  64. package/es/components/PageHeader/PageHeader.d.ts +3 -3
  65. package/es/components/PageHeader/PageHeader.js +22 -8
  66. package/es/components/Pagination/Pagination.js +6 -2
  67. package/es/components/PaginationNav/PaginationNav.js +2 -5
  68. package/es/components/Popover/index.js +14 -4
  69. package/es/components/ProgressBar/ProgressBar.js +4 -2
  70. package/es/components/RadioTile/RadioTile.js +2 -2
  71. package/es/components/Search/Search.js +2 -2
  72. package/es/components/Select/Select.js +2 -3
  73. package/es/components/ShapeIndicator/index.js +4 -2
  74. package/es/components/SkeletonPlaceholder/SkeletonPlaceholder.d.ts +4 -4
  75. package/es/components/SkeletonPlaceholder/SkeletonPlaceholder.js +1 -2
  76. package/es/components/SkeletonText/SkeletonText.js +0 -2
  77. package/es/components/Slider/Slider.js +11 -16
  78. package/es/components/Stack/HStack.js +1 -0
  79. package/es/components/Stack/Stack.js +6 -9
  80. package/es/components/Stack/VStack.js +1 -0
  81. package/es/components/StructuredList/StructuredList.js +3 -0
  82. package/es/components/Switch/Switch.js +1 -1
  83. package/es/components/Tabs/Tabs.js +28 -17
  84. package/es/components/Tag/DismissibleTag.js +2 -0
  85. package/es/components/Tag/OperationalTag.js +2 -0
  86. package/es/components/Tag/SelectableTag.js +2 -0
  87. package/es/components/Tag/Tag.js +4 -0
  88. package/es/components/Tag/isEllipsisActive.js +1 -0
  89. package/es/components/Text/Text.js +1 -0
  90. package/es/components/TextInput/ControlledPasswordInput.js +2 -4
  91. package/es/components/TextInput/PasswordInput.js +7 -2
  92. package/es/components/TextInput/TextInput.js +4 -2
  93. package/es/components/Theme/index.js +8 -3
  94. package/es/components/Tile/Tile.js +14 -17
  95. package/es/components/TimePicker/TimePicker.js +1 -0
  96. package/es/components/Toggle/Toggle.js +1 -1
  97. package/es/components/Toggletip/index.js +4 -0
  98. package/es/components/Tooltip/DefinitionTooltip.js +1 -0
  99. package/es/components/Tooltip/Tooltip.js +30 -23
  100. package/es/components/TreeView/TreeNode.js +13 -5
  101. package/es/components/TreeView/TreeView.js +7 -0
  102. package/es/components/UIShell/HeaderContainer.js +3 -1
  103. package/es/components/UIShell/HeaderGlobalAction.js +2 -2
  104. package/es/components/UIShell/HeaderMenu.js +3 -3
  105. package/es/components/UIShell/HeaderPanel.js +2 -2
  106. package/es/components/UIShell/Link.js +2 -0
  107. package/es/components/UIShell/SideNavItems.js +1 -0
  108. package/es/components/UIShell/SideNavMenu.js +2 -2
  109. package/es/components/UIShell/SideNavMenuItem.js +1 -1
  110. package/es/components/UIShell/SideNavSwitcher.js +1 -1
  111. package/es/components/UIShell/Switcher.js +2 -1
  112. package/es/components/UIShell/SwitcherItem.js +4 -2
  113. package/es/internal/FloatingMenu.js +7 -1
  114. package/es/internal/Selection.js +12 -3
  115. package/es/internal/useMergedRefs.js +1 -0
  116. package/es/internal/useNoInteractiveChildren.js +4 -0
  117. package/es/internal/useOutsideClick.js +1 -0
  118. package/es/internal/useOverflowItems.js +6 -0
  119. package/es/internal/useResizeObserver.js +4 -0
  120. package/es/internal/useSavedCallback.js +1 -0
  121. package/es/internal/warning.js +1 -0
  122. package/es/prop-types/isRequiredOneOf.js +4 -1
  123. package/es/tools/events.js +3 -1
  124. package/es/tools/wrapComponent.js +1 -0
  125. package/lib/components/AILabel/index.js +8 -6
  126. package/lib/components/Breadcrumb/BreadcrumbItem.js +2 -0
  127. package/lib/components/Button/Button.js +3 -0
  128. package/lib/components/ChatButton/ChatButton.js +1 -0
  129. package/lib/components/CheckboxGroup/CheckboxGroup.js +20 -1
  130. package/lib/components/ComboBox/ComboBox.js +17 -1
  131. package/lib/components/ComboButton/index.js +1 -0
  132. package/lib/components/ComposedModal/ComposedModal.js +4 -1
  133. package/lib/components/DataTable/DataTable.js +14 -0
  134. package/lib/components/DataTable/Table.js +3 -3
  135. package/lib/components/DataTable/TableExpandHeader.js +5 -1
  136. package/lib/components/DataTable/TableExpandRow.js +1 -0
  137. package/lib/components/DataTable/TableHeader.js +2 -0
  138. package/lib/components/DataTable/TableRow.js +5 -0
  139. package/lib/components/DataTable/TableSlugRow.js +1 -0
  140. package/lib/components/DataTable/TableToolbarMenu.js +3 -0
  141. package/lib/components/DataTable/state/sorting.d.ts +3 -1
  142. package/lib/components/DataTable/state/sorting.js +2 -0
  143. package/lib/components/DataTable/tools/sorting.js +1 -0
  144. package/lib/components/DatePicker/DatePicker.js +14 -3
  145. package/lib/components/DatePickerInput/DatePickerInput.js +6 -0
  146. package/lib/components/Dialog/Dialog.js +10 -2
  147. package/lib/components/Dropdown/Dropdown.js +16 -4
  148. package/lib/components/ErrorBoundary/ErrorBoundaryContext.js +1 -0
  149. package/lib/components/FileUploader/FileUploader.js +9 -2
  150. package/lib/components/FileUploader/FileUploaderButton.js +1 -1
  151. package/lib/components/FileUploader/FileUploaderDropContainer.js +1 -1
  152. package/lib/components/FileUploader/FileUploaderItem.js +3 -0
  153. package/lib/components/FluidMultiSelect/FluidMultiSelect.js +2 -0
  154. package/lib/components/FluidNumberInput/FluidNumberInput.js +3 -2
  155. package/lib/components/FluidSearch/FluidSearch.js +3 -2
  156. package/lib/components/FluidSelect/FluidSelect.js +3 -2
  157. package/lib/components/FluidTextInput/FluidTextInput.js +3 -2
  158. package/lib/components/FluidTimePicker/FluidTimePicker.js +11 -4
  159. package/lib/components/FluidTimePickerSelect/FluidTimePickerSelect.js +3 -2
  160. package/lib/components/Grid/CSSGrid.js +5 -0
  161. package/lib/components/Grid/Column.js +3 -0
  162. package/lib/components/Grid/ColumnHang.js +1 -0
  163. package/lib/components/Grid/FlexGrid.js +1 -0
  164. package/lib/components/Grid/Row.js +1 -0
  165. package/lib/components/Heading/index.js +3 -1
  166. package/lib/components/IconButton/index.js +4 -2
  167. package/lib/components/IconIndicator/index.js +4 -2
  168. package/lib/components/InlineCheckbox/InlineCheckbox.js +3 -2
  169. package/lib/components/Layout/index.js +6 -4
  170. package/lib/components/LayoutDirection/LayoutDirection.js +2 -0
  171. package/lib/components/Link/Link.js +3 -0
  172. package/lib/components/ListBox/ListBoxMenuItem.js +4 -1
  173. package/lib/components/ListBox/next/ListBoxTrigger.js +3 -2
  174. package/lib/components/Menu/Menu.js +6 -9
  175. package/lib/components/Menu/MenuContext.js +1 -0
  176. package/lib/components/Menu/MenuItem.js +5 -13
  177. package/lib/components/MenuButton/index.js +7 -2
  178. package/lib/components/Modal/Modal.js +3 -0
  179. package/lib/components/ModalWrapper/ModalWrapper.js +2 -0
  180. package/lib/components/MultiSelect/FilterableMultiSelect.js +24 -5
  181. package/lib/components/MultiSelect/MultiSelect.js +21 -5
  182. package/lib/components/Notification/Notification.js +1 -1
  183. package/lib/components/NumberInput/NumberInput.js +7 -1
  184. package/lib/components/OverflowMenu/OverflowMenu.js +2 -0
  185. package/lib/components/OverflowMenu/next/index.js +3 -2
  186. package/lib/components/OverflowMenuItem/OverflowMenuItem.js +2 -0
  187. package/lib/components/PageHeader/PageHeader.d.ts +3 -3
  188. package/lib/components/PageHeader/PageHeader.js +22 -8
  189. package/lib/components/Pagination/Pagination.js +6 -2
  190. package/lib/components/PaginationNav/PaginationNav.js +2 -5
  191. package/lib/components/Popover/index.js +14 -4
  192. package/lib/components/ProgressBar/ProgressBar.js +4 -2
  193. package/lib/components/RadioTile/RadioTile.js +2 -2
  194. package/lib/components/Search/Search.js +2 -2
  195. package/lib/components/Select/Select.js +2 -3
  196. package/lib/components/ShapeIndicator/index.js +4 -2
  197. package/lib/components/SkeletonPlaceholder/SkeletonPlaceholder.d.ts +4 -4
  198. package/lib/components/SkeletonPlaceholder/SkeletonPlaceholder.js +1 -2
  199. package/lib/components/SkeletonText/SkeletonText.js +0 -2
  200. package/lib/components/Slider/Slider.js +11 -16
  201. package/lib/components/Stack/HStack.js +1 -0
  202. package/lib/components/Stack/Stack.js +6 -9
  203. package/lib/components/Stack/VStack.js +1 -0
  204. package/lib/components/StructuredList/StructuredList.js +3 -0
  205. package/lib/components/Switch/Switch.js +1 -1
  206. package/lib/components/Tabs/Tabs.js +28 -17
  207. package/lib/components/Tag/DismissibleTag.js +2 -0
  208. package/lib/components/Tag/OperationalTag.js +2 -0
  209. package/lib/components/Tag/SelectableTag.js +2 -0
  210. package/lib/components/Tag/Tag.js +4 -0
  211. package/lib/components/Tag/isEllipsisActive.js +1 -0
  212. package/lib/components/Text/Text.js +1 -0
  213. package/lib/components/TextInput/ControlledPasswordInput.js +2 -4
  214. package/lib/components/TextInput/PasswordInput.js +7 -2
  215. package/lib/components/TextInput/TextInput.js +4 -2
  216. package/lib/components/Theme/index.js +8 -3
  217. package/lib/components/Tile/Tile.js +14 -17
  218. package/lib/components/TimePicker/TimePicker.js +1 -0
  219. package/lib/components/Toggle/Toggle.js +1 -1
  220. package/lib/components/Toggletip/index.js +4 -0
  221. package/lib/components/Tooltip/DefinitionTooltip.js +1 -0
  222. package/lib/components/Tooltip/Tooltip.js +30 -23
  223. package/lib/components/TreeView/TreeNode.js +13 -5
  224. package/lib/components/TreeView/TreeView.js +7 -0
  225. package/lib/components/UIShell/HeaderContainer.js +3 -1
  226. package/lib/components/UIShell/HeaderGlobalAction.js +2 -2
  227. package/lib/components/UIShell/HeaderMenu.js +3 -3
  228. package/lib/components/UIShell/HeaderPanel.js +2 -2
  229. package/lib/components/UIShell/Link.js +2 -0
  230. package/lib/components/UIShell/SideNavItems.js +1 -0
  231. package/lib/components/UIShell/SideNavMenu.js +2 -2
  232. package/lib/components/UIShell/SideNavMenuItem.js +1 -1
  233. package/lib/components/UIShell/SideNavSwitcher.js +1 -1
  234. package/lib/components/UIShell/Switcher.js +2 -1
  235. package/lib/components/UIShell/SwitcherItem.js +4 -2
  236. package/lib/internal/FloatingMenu.js +7 -1
  237. package/lib/internal/Selection.js +12 -3
  238. package/lib/internal/useMergedRefs.js +1 -0
  239. package/lib/internal/useNoInteractiveChildren.js +4 -0
  240. package/lib/internal/useOutsideClick.js +1 -0
  241. package/lib/internal/useOverflowItems.js +6 -0
  242. package/lib/internal/useResizeObserver.js +4 -0
  243. package/lib/internal/useSavedCallback.js +1 -0
  244. package/lib/internal/warning.js +1 -0
  245. package/lib/prop-types/isRequiredOneOf.js +4 -1
  246. package/lib/tools/events.js +3 -1
  247. package/lib/tools/wrapComponent.js +1 -0
  248. package/package.json +9 -9
@@ -150,7 +150,7 @@ const MenuItem = /*#__PURE__*/forwardRef(function MenuItem({
150
150
  }, [direction]);
151
151
  useEffect(() => {
152
152
  if (IconElement && !context.state.hasIcons) {
153
- // @ts-ignore - TODO: Should we be passing payload?
153
+ // @ts-expect-error - TODO: Should we be passing payload?
154
154
  context.dispatch({
155
155
  type: 'enableIcons'
156
156
  });
@@ -225,17 +225,14 @@ MenuItem.propTypes = {
225
225
  /**
226
226
  * Provide an optional function to be called when the MenuItem is clicked.
227
227
  */
228
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
229
228
  onClick: PropTypes.func,
230
229
  /**
231
230
  * A component used to render an icon.
232
231
  */
233
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
234
232
  renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
235
233
  /**
236
234
  * Provide a shortcut for the action of this MenuItem. Note that the component will only render it as a hint but not actually register the shortcut.
237
235
  */
238
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
239
236
  shortcut: PropTypes.string
240
237
  };
241
238
  const MenuItemSelectable = /*#__PURE__*/forwardRef(function MenuItemSelectable({
@@ -253,12 +250,12 @@ const MenuItemSelectable = /*#__PURE__*/forwardRef(function MenuItemSelectable({
253
250
  onChange,
254
251
  defaultValue: defaultSelected ?? false
255
252
  });
256
- function handleClick(e) {
253
+ function handleClick() {
257
254
  setChecked(!checked);
258
255
  }
259
256
  useEffect(() => {
260
257
  if (!context.state.hasSelectableItems) {
261
- // @ts-ignore - TODO: Should we be passing payload?
258
+ // @ts-expect-error - TODO: Should we be passing payload?
262
259
  context.dispatch({
263
260
  type: 'enableSelectableItems'
264
261
  });
@@ -282,7 +279,6 @@ MenuItemSelectable.propTypes = {
282
279
  /**
283
280
  * Specify whether the option should be selected by default.
284
281
  */
285
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
286
282
  defaultSelected: PropTypes.bool,
287
283
  /**
288
284
  * A required label titling this option.
@@ -291,12 +287,10 @@ MenuItemSelectable.propTypes = {
291
287
  /**
292
288
  * Provide an optional function to be called when the selection state changes.
293
289
  */
294
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
295
290
  onChange: PropTypes.func,
296
291
  /**
297
292
  * Pass a bool to props.selected to control the state of this option.
298
293
  */
299
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
300
294
  selected: PropTypes.bool
301
295
  };
302
296
  const MenuItemGroup = /*#__PURE__*/forwardRef(function MenuItemGroup({
@@ -348,12 +342,13 @@ const MenuItemRadioGroup = /*#__PURE__*/forwardRef(function MenuItemRadioGroup({
348
342
  onChange,
349
343
  defaultValue: defaultSelectedItem ?? {}
350
344
  });
345
+ //eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
351
346
  function handleClick(item, e) {
352
347
  setSelection(item);
353
348
  }
354
349
  useEffect(() => {
355
350
  if (!context.state.hasSelectableItems) {
356
- // @ts-ignore - TODO: Should we be passing payload?
351
+ // @ts-expect-error - TODO: Should we be passing payload?
357
352
  context.dispatch({
358
353
  type: 'enableSelectableItems'
359
354
  });
@@ -389,12 +384,10 @@ MenuItemRadioGroup.propTypes = {
389
384
  /**
390
385
  * Provide a function to convert an item to the string that will be rendered. Defaults to item.toString().
391
386
  */
392
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
393
387
  itemToString: PropTypes.func,
394
388
  /**
395
389
  * Provide the options for this radio group. Can be of any type, as long as you provide an appropriate props.itemToString function.
396
390
  */
397
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
398
391
  items: PropTypes.array,
399
392
  /**
400
393
  * A required label titling this radio group.
@@ -403,7 +396,6 @@ MenuItemRadioGroup.propTypes = {
403
396
  /**
404
397
  * Provide an optional function to be called when the selection changes.
405
398
  */
406
- // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
407
399
  onChange: PropTypes.func,
408
400
  /**
409
401
  * Provide props.selectedItem to control the state of this radio group. Must match the type of props.items.
@@ -23,7 +23,8 @@ import mergeRefs from '../../tools/mergeRefs.js';
23
23
 
24
24
  const validButtonKinds = ['primary', 'tertiary', 'ghost'];
25
25
  const defaultButtonKind = 'primary';
26
- const MenuButton = /*#__PURE__*/forwardRef(function MenuButton({
26
+ // eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
27
+ const MenuButton = /*#__PURE__*/forwardRef(({
27
28
  children,
28
29
  className,
29
30
  disabled,
@@ -34,13 +35,14 @@ const MenuButton = /*#__PURE__*/forwardRef(function MenuButton({
34
35
  tabIndex = 0,
35
36
  menuTarget,
36
37
  ...rest
37
- }, forwardRef) {
38
+ }, forwardRef) => {
38
39
  // feature flag utilized to separate out only the dynamic styles from @floating-ui
39
40
  // flag is turned on when collision detection (ie. flip, hide) logic is not desired
40
41
  const enableOnlyFloatingStyles = useFeatureFlag('enable-v12-dynamic-floating-styles');
41
42
  const id = useId('MenuButton');
42
43
  const prefix = usePrefix();
43
44
  const triggerRef = useRef(null);
45
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
44
46
  let middlewares = [];
45
47
  if (!enableOnlyFloatingStyles) {
46
48
  middlewares = [flip({
@@ -159,6 +161,7 @@ MenuButton.propTypes = {
159
161
  /**
160
162
  * Specify the type of button to be used as the base for the trigger button.
161
163
  */
164
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
162
165
  // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
163
166
  kind: PropTypes.oneOf(validButtonKinds),
164
167
  /**
@@ -172,11 +175,13 @@ MenuButton.propTypes = {
172
175
  /**
173
176
  * Specify the size of the button and menu.
174
177
  */
178
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
175
179
  // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
176
180
  size: PropTypes.oneOf(['sm', 'md', 'lg']),
177
181
  /**
178
182
  * Specify the tabIndex of the button.
179
183
  */
184
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
180
185
  // @ts-ignore-next-line -- avoid spurious (?) TS2322 error
181
186
  tabIndex: PropTypes.number,
182
187
  /**
@@ -173,6 +173,8 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal({
173
173
  }
174
174
  const lastContent = modalContent.children[modalContent.children.length - 1];
175
175
  const gradientSpacing = modalContent.scrollHeight - lastContent.offsetTop - lastContent.clientHeight;
176
+
177
+ // eslint-disable-next-line prefer-const -- https://github.com/carbon-design-system/carbon/issues/20071
176
178
  for (let elem of modalContent.children) {
177
179
  if (elem.contains(currentActiveNode)) {
178
180
  const spaceBelow = modalContent.clientHeight - elem.offsetTop + modalContent.scrollTop - elem.clientHeight;
@@ -235,6 +237,7 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal({
235
237
  return () => {
236
238
  document.removeEventListener('keydown', handleEscapeKey, true);
237
239
  };
240
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
238
241
  }, [open]);
239
242
  useEffect(() => {
240
243
  return () => {
@@ -17,6 +17,7 @@ import { Escape } from '../../internal/keyboard/keys.js';
17
17
  import { match } from '../../internal/keyboard/match.js';
18
18
 
19
19
  let didWarnAboutDeprecation = false;
20
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
20
21
  process.env.NODE_ENV !== 'production';
21
22
  class ModalWrapper extends React.Component {
22
23
  constructor(...args) {
@@ -53,6 +54,7 @@ class ModalWrapper extends React.Component {
53
54
  handleSubmit?.(evt);
54
55
  });
55
56
  }
57
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
56
58
  if(isDev) {
57
59
  process.env.NODE_ENV !== "production" ? warning(didWarnAboutDeprecation, '`<ModalWrapper>` has been deprecated in favor of `<ComposedModal/>` and will be removed in the next major version, `@carbon/react@v2.x`') : void 0;
58
60
  didWarnAboutDeprecation = true;
@@ -111,6 +111,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
111
111
  isFluid
112
112
  } = useContext(FormContext);
113
113
  const isFirstRender = useRef(true);
114
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
114
115
  const [isFocused, setIsFocused] = useState(false);
115
116
  const [isOpen, setIsOpen] = useState(!!open);
116
117
  const [prevOpen, setPrevOpen] = useState(!!open);
@@ -121,7 +122,10 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
121
122
  itemToString,
122
123
  inputValue
123
124
  }), [items, inputValue, itemToString, filterItems]);
124
- const nonSelectAllItems = useMemo(() => filteredItems.filter(item => !item.isSelectAll), [filteredItems]);
125
+ const nonSelectAllItems = useMemo(
126
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
127
+ () => filteredItems.filter(item => !item.isSelectAll), [filteredItems]);
128
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
125
129
  const selectAll = filteredItems.some(item => item.isSelectAll);
126
130
  const {
127
131
  selectedItems: controlledSelectedItems,
@@ -137,7 +141,9 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
137
141
  filteredItems
138
142
  });
139
143
  const selectAllStatus = useMemo(() => {
140
- const selectable = nonSelectAllItems.filter(item => !item.disabled);
144
+ const selectable = nonSelectAllItems.filter(
145
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
146
+ item => !item.disabled);
141
147
  const nonSelectedCount = selectable.filter(item => !controlledSelectedItems.some(sel => isEqual(sel, item))).length;
142
148
  const totalCount = selectable.length;
143
149
  return {
@@ -146,6 +152,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
146
152
  };
147
153
  }, [controlledSelectedItems, nonSelectAllItems]);
148
154
  const handleSelectAllClick = useCallback(() => {
155
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
149
156
  const selectable = nonSelectAllItems.filter(i => !i.disabled);
150
157
  const {
151
158
  checked,
@@ -162,6 +169,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
162
169
  const toSelect = selectable.filter(e => !controlledSelectedItems.some(sel => isEqual(sel, e)));
163
170
  toggleAll([...controlledSelectedItems, ...toSelect]);
164
171
  }
172
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
165
173
  }, [nonSelectAllItems, selectAllStatus, controlledSelectedItems, toggleAll]);
166
174
  const {
167
175
  refs,
@@ -212,11 +220,14 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
212
220
 
213
221
  // memoize sorted items to reduce unnecessary expensive sort on rerender
214
222
  const sortedItems = useMemo(() => {
215
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
223
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
216
224
  const selectAllItem = items.find(item => item.isSelectAll);
217
- const selectableRealItems = nonSelectAllItems.filter(item => !item.disabled);
225
+ const selectableRealItems = nonSelectAllItems.filter(
226
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
227
+ item => !item.disabled);
218
228
 
219
229
  // Sort only non-select-all items, select-all item must stay at the top
230
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20071
220
231
  const sortedReal = sortItems(nonSelectAllItems, {
221
232
  selectedItems: {
222
233
  top: controlledSelectedItems,
@@ -233,6 +244,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
233
244
  return [selectAllItem, ...sortedReal];
234
245
  }
235
246
  return sortedReal;
247
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
236
248
  }, [items, inputValue, controlledSelectedItems, topItems, selectionFeedback, itemToString, compareItems, locale, sortItems, nonSelectAllItems]);
237
249
  const inline = type === 'inline';
238
250
  const showWarning = !invalid && warn;
@@ -316,6 +328,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
316
328
  return () => {
317
329
  document.removeEventListener('mousedown', handleClickOutside);
318
330
  };
331
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
319
332
  }, [isOpen, inputFocused]);
320
333
  const {
321
334
  getToggleButtonProps,
@@ -338,7 +351,9 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
338
351
  inputId,
339
352
  inputValue,
340
353
  stateReducer,
354
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
341
355
  isItemDisabled(item, _index) {
356
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
342
357
  return item?.disabled;
343
358
  }
344
359
  });
@@ -509,7 +524,9 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
509
524
  }) : null;
510
525
 
511
526
  // exclude the select-all item from the count
512
- const selectedItemsLength = controlledSelectedItems.filter(item => !item.isSelectAll).length;
527
+ const selectedItemsLength = controlledSelectedItems.filter(
528
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
529
+ item => !item.isSelectAll).length;
513
530
  const className = cx(`${prefix}--multi-select`, `${prefix}--combo-box`, `${prefix}--multi-select--filterable`, {
514
531
  [`${prefix}--multi-select--invalid`]: invalid,
515
532
  [`${prefix}--multi-select--invalid--focused`]: invalid && inputFocused,
@@ -690,6 +707,7 @@ const FilterableMultiSelect = /*#__PURE__*/forwardRef(function FilterableMultiSe
690
707
  }, normalizedDecorator) : '', /*#__PURE__*/React.createElement(ListBox.Menu, menuProps, isOpen ? sortedItems.map((item, index) => {
691
708
  let isChecked;
692
709
  let isIndeterminate = false;
710
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
693
711
  if (item.isSelectAll) {
694
712
  isChecked = selectAllStatus.checked;
695
713
  isIndeterminate = selectAllStatus.indeterminate;
@@ -787,6 +805,7 @@ FilterableMultiSelect.propTypes = {
787
805
  * change, and in some cases they can not be shimmed by Carbon to shield you
788
806
  * from potentially breaking changes.
789
807
  */
808
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
790
809
  // @ts-ignore
791
810
  downshiftProps: PropTypes.shape(Downshift.propTypes),
792
811
  /**
@@ -111,12 +111,15 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
111
111
  return true; // Return true if item is not an object with undefined values
112
112
  });
113
113
  }, [items]);
114
+
115
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
114
116
  const selectAll = filteredItems.some(item => item.isSelectAll);
115
117
  const prefix = usePrefix();
116
118
  const {
117
119
  isFluid
118
120
  } = useContext(FormContext);
119
121
  const multiSelectInstanceId = useId();
122
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
120
123
  const [isFocused, setIsFocused] = useState(false);
121
124
  const [inputFocused, setInputFocused] = useState(false);
122
125
  const [isOpen, setIsOpen] = useState(open || false);
@@ -185,13 +188,15 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
185
188
  stateReducer,
186
189
  isOpen,
187
190
  itemToString: filteredItems => {
188
- return Array.isArray(filteredItems) && filteredItems.map(function (item) {
191
+ return Array.isArray(filteredItems) && filteredItems.map(item => {
189
192
  return itemToString(item);
190
193
  }).join(', ') || '';
191
194
  },
192
195
  selectedItem: controlledSelectedItems,
193
196
  items: filteredItems,
197
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
194
198
  isItemDisabled(item, _index) {
199
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
195
200
  return item?.disabled;
196
201
  },
197
202
  ...downshiftProps
@@ -386,6 +391,7 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
386
391
  [`${prefix}--list-box__field--wrapper--input-focused`]: inputFocused
387
392
  });
388
393
  const handleFocus = evt => {
394
+ // eslint-disable-next-line @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
389
395
  evt.target.classList.contains(`${prefix}--tag__close-icon`) ? setIsFocused(false) : setIsFocused(evt.type === 'focus' ? true : false);
390
396
  };
391
397
  const readOnlyEventHandlers = readOnly ? {
@@ -413,7 +419,9 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
413
419
  size: 'mini'
414
420
  }) : null;
415
421
  const itemsSelectedText = selectedItems.length > 0 && selectedItems.map(item => item?.text);
416
- const selectedItemsLength = selectAll ? selectedItems.filter(item => !item.isSelectAll).length : selectedItems.length;
422
+ const selectedItemsLength = selectAll ?
423
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
424
+ selectedItems.filter(item => !item.isSelectAll).length : selectedItems.length;
417
425
 
418
426
  // Memoize the value of getMenuProps to avoid an infinite loop
419
427
  const menuProps = useMemo(() => getMenuProps({
@@ -432,7 +440,9 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
432
440
  nonSelectAllSelectedCount,
433
441
  totalSelectableCount
434
442
  };
435
- }, [selectedItems, filteredItems]);
443
+ },
444
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
445
+ [selectedItems, filteredItems]);
436
446
  return /*#__PURE__*/React.createElement("div", {
437
447
  className: wrapperClasses
438
448
  }, /*#__PURE__*/React.createElement("label", _extends({
@@ -484,14 +494,20 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
484
494
  translateWithId: translateWithId
485
495
  })), slug ? normalizedDecorator : decorator ? /*#__PURE__*/React.createElement("div", {
486
496
  className: `${prefix}--list-box__inner-wrapper--decorator`
487
- }, normalizedDecorator) : ''), /*#__PURE__*/React.createElement(ListBox.Menu, menuProps, isOpen && sortItems(filteredItems, sortOptions).map((item, index) => {
497
+ }, normalizedDecorator) : ''), /*#__PURE__*/React.createElement(ListBox.Menu, menuProps, isOpen &&
498
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20071
499
+ sortItems(filteredItems, sortOptions).map((item, index) => {
488
500
  const {
489
501
  hasIndividualSelections,
490
502
  nonSelectAllSelectedCount,
491
503
  totalSelectableCount
492
504
  } = getSelectionStats(selectedItems, filteredItems);
505
+
506
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
493
507
  const isChecked = item.isSelectAll ? nonSelectAllSelectedCount === totalSelectableCount && totalSelectableCount > 0 : selectedItems.some(selected => isEqual(selected, item));
494
- const isIndeterminate = item.isSelectAll && hasIndividualSelections && nonSelectAllSelectedCount < totalSelectableCount;
508
+ const isIndeterminate =
509
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
510
+ item.isSelectAll && hasIndividualSelections && nonSelectAllSelectedCount < totalSelectableCount;
495
511
  const itemProps = getItemProps({
496
512
  item,
497
513
  // we don't want Downshift to set aria-selected for us
@@ -108,7 +108,6 @@ function NotificationButton({
108
108
  [`${prefix}--${notificationType}-notification__close-icon`]: notificationType
109
109
  });
110
110
  return /*#__PURE__*/React.createElement("button", _extends({}, rest, {
111
- // eslint-disable-next-line react/button-has-type
112
111
  type: type,
113
112
  "aria-label": deprecatedAriaLabel || ariaLabel,
114
113
  title: deprecatedAriaLabel || ariaLabel,
@@ -808,6 +807,7 @@ Callout.propTypes = {
808
807
  /**
809
808
  * @deprecated Use `CalloutProps` instead.
810
809
  */
810
+ // eslint-disable-next-line @typescript-eslint/no-empty-object-type -- https://github.com/carbon-design-system/carbon/issues/20071
811
811
 
812
812
  let didWarnAboutDeprecation = false;
813
813
  const StaticNotification = props => {
@@ -41,7 +41,8 @@ const defaultTranslations = {
41
41
  [translationIds['increment.number']]: 'Increment number',
42
42
  [translationIds['decrement.number']]: 'Decrement number'
43
43
  };
44
- const NumberInput = /*#__PURE__*/React.forwardRef(function NumberInput(props, forwardRef) {
44
+ // eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
45
+ const NumberInput = /*#__PURE__*/React.forwardRef((props, forwardRef) => {
45
46
  const {
46
47
  allowEmpty = false,
47
48
  className: customClassName,
@@ -101,6 +102,7 @@ const NumberInput = /*#__PURE__*/React.forwardRef(function NumberInput(props, fo
101
102
  }
102
103
  return 0;
103
104
  });
105
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
104
106
  const [prevControlledValue, setPrevControlledValue] = useState(controlledValue);
105
107
  const numberParser = useMemo(() => new NumberParser(locale, formatOptions), [locale, formatOptions]);
106
108
  /**
@@ -233,6 +235,8 @@ const NumberInput = /*#__PURE__*/React.forwardRef(function NumberInput(props, fo
233
235
  [`${prefix}--number-input--fluid--focus`]: isFluid && isFocused,
234
236
  [`${prefix}--number-input--fluid--disabled`]: isFluid && disabled
235
237
  });
238
+
239
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
236
240
  const Icon = normalizedProps.icon;
237
241
  const getDecimalPlaces = num => {
238
242
  const parts = num.toString().split('.');
@@ -342,7 +346,9 @@ const NumberInput = /*#__PURE__*/React.forwardRef(function NumberInput(props, fo
342
346
  onKeyUp: onKeyUp,
343
347
  onKeyDown: e => {
344
348
  if (type === 'text') {
349
+ // eslint-disable-next-line @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
345
350
  match(e, ArrowUp) && handleStep(e, 'up');
351
+ // eslint-disable-next-line @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
346
352
  match(e, ArrowDown) && handleStep(e, 'down');
347
353
  }
348
354
  if (rest?.onKeyDown) {
@@ -66,6 +66,7 @@ const getMenuOffset = (menuBody, direction, trigger, flip) => {
66
66
  if (process.env.NODE_ENV !== 'production') {
67
67
  !(triggerButtonPositionProp && triggerButtonPositionFactor) ? process.env.NODE_ENV !== "production" ? invariant(false, '[OverflowMenu] wrong floating menu direction: `%s`', direction) : invariant(false) : void 0;
68
68
  }
69
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
69
70
  const {
70
71
  offsetWidth: menuWidth,
71
72
  offsetHeight: menuHeight
@@ -88,6 +89,7 @@ const getMenuOffset = (menuBody, direction, trigger, flip) => {
88
89
  };
89
90
  }
90
91
  };
92
+ // eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
91
93
  const OverflowMenu = /*#__PURE__*/forwardRef(({
92
94
  align,
93
95
  ['aria-label']: ariaLabel = null,
@@ -23,7 +23,8 @@ import deprecateValuesWithin from '../../../prop-types/deprecateValuesWithin.js'
23
23
  import { mapPopoverAlign } from '../../../tools/mapPopoverAlign.js';
24
24
 
25
25
  const defaultSize = 'md';
26
- const OverflowMenu = /*#__PURE__*/React.forwardRef(function OverflowMenu({
26
+ // eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
27
+ const OverflowMenu = /*#__PURE__*/React.forwardRef(({
27
28
  autoAlign = false,
28
29
  children,
29
30
  className,
@@ -34,7 +35,7 @@ const OverflowMenu = /*#__PURE__*/React.forwardRef(function OverflowMenu({
34
35
  tooltipAlignment,
35
36
  menuTarget,
36
37
  ...rest
37
- }, forwardRef) {
38
+ }, forwardRef) => {
38
39
  const enableFloatingStyles = useFeatureFlag('enable-v12-dynamic-floating-styles') || autoAlign;
39
40
  const {
40
41
  refs,
@@ -89,12 +89,14 @@ const OverflowMenuItem = frFn((props, ref) => {
89
89
  // ref as any: the type of `ref` is `ForwardedRef<HTMLButtonElement>` in `Button` component
90
90
  // but `OverflowMenuItem` can be rendered as `a` tag as well, which is `HTMLAnchorElement`
91
91
  // so we have to use `any` here
92
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
92
93
  ,
93
94
  ref: ref,
94
95
  tabIndex: -1
95
96
  // itemText as any: itemText may be a ReactNode, but `title` only accepts string
96
97
  // to avoid compatibility issue, we use `any` here. Consider to enforce `itemText` to be `string?`
97
98
  // in the next major release
99
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
98
100
  ,
99
101
  title: requireTitle ? title || itemText : undefined
100
102
  }, rest), OverflowMenuItemContent));
@@ -26,7 +26,7 @@ interface PageHeaderBreadcrumbBarProps {
26
26
  /**
27
27
  * `true` by default to render BreadcrumbBar bottom border.
28
28
  */
29
- border?: Boolean;
29
+ border?: boolean;
30
30
  children?: React.ReactNode;
31
31
  className?: string;
32
32
  /**
@@ -40,7 +40,7 @@ interface PageHeaderBreadcrumbBarProps {
40
40
  /**
41
41
  * `true` to set content actions flush against page actions
42
42
  */
43
- contentActionsFlush?: Boolean;
43
+ contentActionsFlush?: boolean;
44
44
  /**
45
45
  * The PageHeaderContent's page actions
46
46
  */
@@ -48,7 +48,7 @@ interface PageHeaderBreadcrumbBarProps {
48
48
  /**
49
49
  * `true` to set page actions flush with page
50
50
  */
51
- pageActionsFlush?: Boolean;
51
+ pageActionsFlush?: boolean;
52
52
  }
53
53
  declare const PageHeaderBreadcrumbBar: React.ForwardRefExoticComponent<PageHeaderBreadcrumbBarProps & React.RefAttributes<HTMLDivElement>>;
54
54
  /**
@@ -42,11 +42,11 @@ import { Text } from '../Text/Text.js';
42
42
  * ----------
43
43
  */
44
44
 
45
- const PageHeader = /*#__PURE__*/React.forwardRef(function PageHeader({
45
+ const PageHeader = /*#__PURE__*/React.forwardRef(({
46
46
  className,
47
47
  children,
48
48
  ...other
49
- }, ref) {
49
+ }, ref) => {
50
50
  const prefix = usePrefix();
51
51
  const classNames = cx({
52
52
  [`${prefix}--page-header`]: true
@@ -64,7 +64,7 @@ PageHeader.displayName = 'PageHeader';
64
64
  * -----------------------
65
65
  */
66
66
 
67
- const PageHeaderBreadcrumbBar = /*#__PURE__*/React.forwardRef(function PageHeaderBreadcrumbBar({
67
+ const PageHeaderBreadcrumbBar = /*#__PURE__*/React.forwardRef(({
68
68
  border = true,
69
69
  className,
70
70
  children,
@@ -74,7 +74,7 @@ const PageHeaderBreadcrumbBar = /*#__PURE__*/React.forwardRef(function PageHeade
74
74
  pageActions,
75
75
  pageActionsFlush,
76
76
  ...other
77
- }, ref) {
77
+ }, ref) => {
78
78
  const prefix = usePrefix();
79
79
  const classNames = cx({
80
80
  [`${prefix}--page-header__breadcrumb-bar`]: true,
@@ -111,7 +111,7 @@ PageHeaderBreadcrumbBar.displayName = 'PageHeaderBreadcrumbBar';
111
111
  * -----------------
112
112
  */
113
113
 
114
- const PageHeaderContent = /*#__PURE__*/React.forwardRef(function PageHeaderContent({
114
+ const PageHeaderContent = /*#__PURE__*/React.forwardRef(({
115
115
  className,
116
116
  children,
117
117
  title,
@@ -119,7 +119,7 @@ const PageHeaderContent = /*#__PURE__*/React.forwardRef(function PageHeaderConte
119
119
  contextualActions,
120
120
  pageActions,
121
121
  ...other
122
- }, ref) {
122
+ }, ref) => {
123
123
  const prefix = usePrefix();
124
124
  const classNames = cx({
125
125
  [`${prefix}--page-header__content`]: true
@@ -131,6 +131,7 @@ const PageHeaderContent = /*#__PURE__*/React.forwardRef(function PageHeaderConte
131
131
  return element.offsetHeight < element.scrollHeight;
132
132
  };
133
133
  useLayoutEffect(() => {
134
+ // eslint-disable-next-line @typescript-eslint/no-unused-expressions -- https://github.com/carbon-design-system/carbon/issues/20071
134
135
  titleRef.current && isEllipsisActive(titleRef.current);
135
136
  }, [title]);
136
137
  return /*#__PURE__*/React.createElement("div", _extends({
@@ -202,6 +203,7 @@ PageHeaderContent.propTypes = {
202
203
 
203
204
  const PageHeaderContentPageActions = ({
204
205
  className,
206
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
205
207
  children,
206
208
  menuButtonLabel = 'Actions',
207
209
  actions,
@@ -237,6 +239,7 @@ const PageHeaderContentPageActions = ({
237
239
  }
238
240
  }
239
241
  });
242
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
240
243
  }, []);
241
244
  return /*#__PURE__*/React.createElement("div", _extends({
242
245
  className: classNames,
@@ -359,12 +362,12 @@ PageHeaderHeroImage.propTypes = {
359
362
  * ----------------
360
363
  */
361
364
 
362
- const PageHeaderTabBar = /*#__PURE__*/React.forwardRef(function PageHeaderTabBar({
365
+ const PageHeaderTabBar = /*#__PURE__*/React.forwardRef(({
363
366
  className,
364
367
  children,
365
368
  tags = [],
366
369
  ...other
367
- }, ref) {
370
+ }, ref) => {
368
371
  const prefix = usePrefix();
369
372
  const classNames = cx({
370
373
  [`${prefix}--page-header__tab-bar`]: true
@@ -380,18 +383,26 @@ const PageHeaderTabBar = /*#__PURE__*/React.forwardRef(function PageHeaderTabBar
380
383
  sm: 4
381
384
  }, children)));
382
385
  }
386
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
383
387
  const [openPopover, setOpenPopover] = useState(false);
384
388
  const tagSize = tags[0]?.size || 'md';
389
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
385
390
  const instanceId = useId('PageHeaderTabBar');
391
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
386
392
  const tagsWithIds = useMemo(() => {
387
393
  return tags.map((tag, index) => ({
388
394
  ...tag,
389
395
  id: tag.id || `tag-${index}-${instanceId}`
390
396
  }));
397
+ // eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
391
398
  }, [tags]);
399
+
400
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
392
401
  const tagsContainerRef = useRef(null);
402
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
393
403
  const offsetRef = useRef(null);
394
404
  // To close popover when window resizes
405
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
395
406
  useEffect(() => {
396
407
  const handleResize = () => {
397
408
  // Close the popover when window resizes to prevent unwanted opens
@@ -408,11 +419,14 @@ const PageHeaderTabBar = /*#__PURE__*/React.forwardRef(function PageHeaderTabBar
408
419
  visibleItems = [],
409
420
  hiddenItems = [],
410
421
  itemRefHandler = () => {}
422
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
411
423
  } = useOverflowItems(tagsWithIds, tagsContainerRef, offsetRef) || {
412
424
  visibleItems: [],
413
425
  hiddenItems: [],
414
426
  itemRefHandler: () => {}
415
427
  };
428
+
429
+ // eslint-disable-next-line react-hooks/rules-of-hooks -- https://github.com/carbon-design-system/carbon/issues/20071
416
430
  const handleOverflowClick = useCallback(event => {
417
431
  event.stopPropagation();
418
432
  setOpenPopover(prev => !prev);