@itwin/itwinui-react 3.17.4 → 3.18.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 (641) hide show
  1. package/CHANGELOG.md +64 -0
  2. package/DEV-cjs/core/Alert/Alert.js +12 -6
  3. package/DEV-cjs/core/Avatar/Avatar.js +1 -1
  4. package/DEV-cjs/core/AvatarGroup/AvatarGroup.js +2 -1
  5. package/DEV-cjs/core/Backdrop/Backdrop.js +1 -1
  6. package/DEV-cjs/core/Badge/Badge.js +1 -1
  7. package/DEV-cjs/core/Breadcrumbs/Breadcrumbs.js +8 -5
  8. package/DEV-cjs/core/ButtonGroup/ButtonGroup.js +4 -2
  9. package/DEV-cjs/core/Buttons/Button.js +1 -1
  10. package/DEV-cjs/core/Buttons/DropdownButton.js +2 -1
  11. package/DEV-cjs/core/Buttons/IconButton.js +8 -2
  12. package/DEV-cjs/core/Buttons/IdeasButton.js +2 -1
  13. package/DEV-cjs/core/Buttons/SplitButton.js +2 -1
  14. package/DEV-cjs/core/Carousel/Carousel.js +2 -1
  15. package/DEV-cjs/core/Carousel/CarouselContext.js +2 -1
  16. package/DEV-cjs/core/Carousel/CarouselDot.js +2 -1
  17. package/DEV-cjs/core/Carousel/CarouselDotsList.js +2 -1
  18. package/DEV-cjs/core/Carousel/CarouselNavigation.js +6 -3
  19. package/DEV-cjs/core/Carousel/CarouselSlide.js +2 -1
  20. package/DEV-cjs/core/Carousel/CarouselSlider.js +2 -1
  21. package/DEV-cjs/core/Checkbox/Checkbox.js +1 -1
  22. package/DEV-cjs/core/ColorPicker/ColorBuilder.js +2 -1
  23. package/DEV-cjs/core/ColorPicker/ColorInputPanel.js +4 -2
  24. package/DEV-cjs/core/ColorPicker/ColorPalette.js +2 -1
  25. package/DEV-cjs/core/ColorPicker/ColorPicker.js +2 -1
  26. package/DEV-cjs/core/ColorPicker/ColorSwatch.js +2 -1
  27. package/DEV-cjs/core/ComboBox/ComboBox.js +61 -29
  28. package/DEV-cjs/core/ComboBox/ComboBoxEndIcon.js +2 -1
  29. package/DEV-cjs/core/ComboBox/ComboBoxInput.js +2 -3
  30. package/DEV-cjs/core/ComboBox/ComboBoxInputContainer.js +2 -1
  31. package/DEV-cjs/core/ComboBox/ComboBoxMenu.js +2 -1
  32. package/DEV-cjs/core/ComboBox/ComboBoxMenuItem.js +3 -2
  33. package/DEV-cjs/core/ComboBox/ComboBoxMultipleContainer.js +2 -1
  34. package/DEV-cjs/core/ComboBox/helpers.js +4 -2
  35. package/DEV-cjs/core/DatePicker/DatePicker.js +5 -4
  36. package/DEV-cjs/core/Dialog/Dialog.js +23 -11
  37. package/DEV-cjs/core/Dialog/DialogBackdrop.js +2 -1
  38. package/DEV-cjs/core/Dialog/DialogButtonBar.js +2 -1
  39. package/DEV-cjs/core/Dialog/DialogContent.js +2 -1
  40. package/DEV-cjs/core/Dialog/DialogMain.js +2 -1
  41. package/DEV-cjs/core/Dialog/DialogTitleBar.js +2 -1
  42. package/DEV-cjs/core/Dialog/DialogTitleBarTitle.js +2 -1
  43. package/DEV-cjs/core/Divider/Divider.js +1 -1
  44. package/DEV-cjs/core/DropdownMenu/DropdownMenu.js +32 -24
  45. package/DEV-cjs/core/ExpandableBlock/ExpandableBlock.js +38 -13
  46. package/DEV-cjs/core/Fieldset/Fieldset.js +1 -1
  47. package/DEV-cjs/core/FileUpload/FileEmptyCard.js +6 -3
  48. package/DEV-cjs/core/FileUpload/FileUpload.js +2 -1
  49. package/DEV-cjs/core/FileUpload/FileUploadCard.js +18 -9
  50. package/DEV-cjs/core/FileUpload/FileUploadTemplate.js +2 -1
  51. package/DEV-cjs/core/Flex/Flex.js +4 -3
  52. package/DEV-cjs/core/Footer/Footer.js +1 -1
  53. package/DEV-cjs/core/Footer/FooterItem.js +2 -1
  54. package/DEV-cjs/core/Footer/FooterList.js +2 -1
  55. package/DEV-cjs/core/Footer/FooterSeparator.js +2 -1
  56. package/DEV-cjs/core/Header/Header.js +1 -1
  57. package/DEV-cjs/core/Header/HeaderBreadcrumbs.js +2 -1
  58. package/DEV-cjs/core/Header/HeaderButton.js +2 -1
  59. package/DEV-cjs/core/Header/HeaderLogo.js +3 -2
  60. package/DEV-cjs/core/Icon/Icon.js +1 -1
  61. package/DEV-cjs/core/InformationPanel/InformationPanel.js +2 -1
  62. package/DEV-cjs/core/InformationPanel/InformationPanelBody.js +2 -1
  63. package/DEV-cjs/core/InformationPanel/InformationPanelContent.js +2 -1
  64. package/DEV-cjs/core/InformationPanel/InformationPanelHeader.js +2 -1
  65. package/DEV-cjs/core/InformationPanel/InformationPanelWrapper.js +2 -1
  66. package/DEV-cjs/core/Input/Input.js +1 -1
  67. package/DEV-cjs/core/InputGrid/InputGrid.js +1 -1
  68. package/DEV-cjs/core/InputGroup/InputGroup.js +2 -1
  69. package/DEV-cjs/core/InputWithDecorations/InputWithDecorations.js +10 -5
  70. package/DEV-cjs/core/Label/Label.js +1 -1
  71. package/DEV-cjs/core/LabeledInput/LabeledInput.js +2 -1
  72. package/DEV-cjs/core/LabeledSelect/LabeledSelect.js +5 -2
  73. package/DEV-cjs/core/LabeledTextarea/LabeledTextarea.js +2 -1
  74. package/DEV-cjs/core/LinkAction/LinkAction.js +4 -3
  75. package/DEV-cjs/core/List/List.js +1 -1
  76. package/DEV-cjs/core/List/ListItem.js +10 -5
  77. package/DEV-cjs/core/Menu/Menu.js +3 -1
  78. package/DEV-cjs/core/Menu/MenuDivider.js +2 -1
  79. package/DEV-cjs/core/Menu/MenuExtraContent.js +3 -4
  80. package/DEV-cjs/core/Menu/MenuItem.js +7 -3
  81. package/DEV-cjs/core/Menu/MenuItemSkeleton.js +2 -1
  82. package/DEV-cjs/core/Modal/Modal.js +1 -1
  83. package/DEV-cjs/core/Modal/ModalButtonBar.js +2 -1
  84. package/DEV-cjs/core/Modal/ModalContent.js +2 -1
  85. package/DEV-cjs/core/NonIdealState/ErrorPage.js +1 -1
  86. package/DEV-cjs/core/NonIdealState/NonIdealState.js +2 -1
  87. package/DEV-cjs/core/NotificationMarker/NotificationMarker.js +2 -1
  88. package/DEV-cjs/core/Overlay/Overlay.js +8 -4
  89. package/DEV-cjs/core/Panels/Panels.js +13 -7
  90. package/DEV-cjs/core/Panels/helpers.js +2 -1
  91. package/DEV-cjs/core/Popover/Popover.js +35 -28
  92. package/DEV-cjs/core/ProgressIndicators/ProgressLinear.js +2 -1
  93. package/DEV-cjs/core/ProgressIndicators/ProgressRadial.js +2 -1
  94. package/DEV-cjs/core/Radio/Radio.js +1 -1
  95. package/DEV-cjs/core/RadioTiles/RadioTile.js +1 -1
  96. package/DEV-cjs/core/RadioTiles/RadioTileGroup.js +2 -1
  97. package/DEV-cjs/core/SearchBox/SearchBox.js +15 -8
  98. package/DEV-cjs/core/Select/Select.js +61 -48
  99. package/DEV-cjs/core/Select/SelectTag.js +1 -0
  100. package/DEV-cjs/core/SideNavigation/SideNavigation.js +3 -2
  101. package/DEV-cjs/core/SideNavigation/SidenavButton.js +2 -1
  102. package/DEV-cjs/core/SideNavigation/SidenavSubmenu.js +2 -1
  103. package/DEV-cjs/core/SideNavigation/SidenavSubmenuHeader.js +2 -1
  104. package/DEV-cjs/core/SkipToContentLink/SkipToContentLink.js +2 -1
  105. package/DEV-cjs/core/Slider/Slider.js +1 -1
  106. package/DEV-cjs/core/StatusMessage/StatusMessage.js +2 -1
  107. package/DEV-cjs/core/Stepper/Stepper.js +1 -1
  108. package/DEV-cjs/core/Stepper/WorkflowDiagram.js +2 -1
  109. package/DEV-cjs/core/Surface/Surface.js +7 -4
  110. package/DEV-cjs/core/Table/ColumnHeader.js +17 -17
  111. package/DEV-cjs/core/Table/Table.js +147 -57
  112. package/DEV-cjs/core/Table/TableCell.js +6 -4
  113. package/DEV-cjs/core/Table/actionHandlers/expandHandler.js +2 -4
  114. package/DEV-cjs/core/Table/actionHandlers/selectHandler.js +1 -4
  115. package/DEV-cjs/core/Table/cells/DefaultCell.js +31 -15
  116. package/DEV-cjs/core/Table/cells/EditableCell.js +2 -1
  117. package/DEV-cjs/core/Table/columns/expanderColumn.js +16 -17
  118. package/DEV-cjs/core/Table/columns/selectionColumn.js +4 -2
  119. package/DEV-cjs/core/Tabs/Tabs.js +82 -27
  120. package/DEV-cjs/core/Tag/Tag.js +1 -1
  121. package/DEV-cjs/core/Tag/TagContainer.js +2 -1
  122. package/DEV-cjs/core/Textarea/Textarea.js +1 -1
  123. package/DEV-cjs/core/ThemeProvider/ThemeProvider.js +34 -22
  124. package/DEV-cjs/core/Tile/Tile.js +56 -44
  125. package/DEV-cjs/core/TimePicker/TimePicker.js +2 -1
  126. package/DEV-cjs/core/Toast/Toaster.js +4 -2
  127. package/DEV-cjs/core/ToggleSwitch/ToggleSwitch.js +2 -1
  128. package/DEV-cjs/core/Tooltip/Tooltip.js +1 -1
  129. package/DEV-cjs/core/TransferList/TransferList.js +15 -11
  130. package/DEV-cjs/core/Tree/Tree.js +1 -1
  131. package/DEV-cjs/core/Tree/TreeNode.js +1 -1
  132. package/DEV-cjs/core/Tree/TreeNodeExpander.js +2 -1
  133. package/DEV-cjs/core/Typography/Anchor.js +1 -1
  134. package/DEV-cjs/core/Typography/Blockquote.js +2 -1
  135. package/DEV-cjs/core/Typography/Code.js +1 -1
  136. package/DEV-cjs/core/Typography/Kbd.js +1 -1
  137. package/DEV-cjs/core/Typography/Text.js +1 -1
  138. package/DEV-cjs/core/VisuallyHidden/VisuallyHidden.js +2 -1
  139. package/DEV-cjs/index.js +3 -0
  140. package/DEV-cjs/styles.js +1 -1
  141. package/DEV-cjs/utils/components/AutoclearingHiddenLiveRegion.js +2 -1
  142. package/DEV-cjs/utils/components/ButtonBase.js +2 -1
  143. package/DEV-cjs/utils/components/InputWithIcon.js +2 -1
  144. package/DEV-cjs/utils/components/LineClamp.js +6 -0
  145. package/DEV-cjs/utils/components/MiddleTextTruncation.js +2 -1
  146. package/DEV-cjs/utils/components/OverflowContainer.js +6 -9
  147. package/DEV-cjs/utils/components/Portal.js +4 -8
  148. package/DEV-cjs/utils/components/ShadowRoot.js +10 -8
  149. package/DEV-cjs/utils/functions/polymorphic.js +2 -1
  150. package/DEV-cjs/utils/hooks/useGlobals.js +11 -2
  151. package/DEV-cjs/utils/hooks/useWarningLogger.js +29 -28
  152. package/DEV-cjs/utils/providers/index.js +0 -1
  153. package/DEV-esm/core/Alert/Alert.js +12 -6
  154. package/DEV-esm/core/Avatar/Avatar.js +1 -1
  155. package/DEV-esm/core/AvatarGroup/AvatarGroup.js +2 -1
  156. package/DEV-esm/core/Backdrop/Backdrop.js +1 -1
  157. package/DEV-esm/core/Badge/Badge.js +1 -1
  158. package/DEV-esm/core/Breadcrumbs/Breadcrumbs.js +8 -5
  159. package/DEV-esm/core/ButtonGroup/ButtonGroup.js +4 -2
  160. package/DEV-esm/core/Buttons/Button.js +1 -1
  161. package/DEV-esm/core/Buttons/DropdownButton.js +2 -1
  162. package/DEV-esm/core/Buttons/IconButton.js +8 -2
  163. package/DEV-esm/core/Buttons/IdeasButton.js +2 -1
  164. package/DEV-esm/core/Buttons/SplitButton.js +2 -1
  165. package/DEV-esm/core/Carousel/Carousel.js +2 -1
  166. package/DEV-esm/core/Carousel/CarouselContext.js +2 -1
  167. package/DEV-esm/core/Carousel/CarouselDot.js +2 -1
  168. package/DEV-esm/core/Carousel/CarouselDotsList.js +2 -1
  169. package/DEV-esm/core/Carousel/CarouselNavigation.js +6 -3
  170. package/DEV-esm/core/Carousel/CarouselSlide.js +2 -1
  171. package/DEV-esm/core/Carousel/CarouselSlider.js +2 -1
  172. package/DEV-esm/core/Checkbox/Checkbox.js +1 -1
  173. package/DEV-esm/core/ColorPicker/ColorBuilder.js +2 -1
  174. package/DEV-esm/core/ColorPicker/ColorInputPanel.js +4 -2
  175. package/DEV-esm/core/ColorPicker/ColorPalette.js +2 -1
  176. package/DEV-esm/core/ColorPicker/ColorPicker.js +2 -1
  177. package/DEV-esm/core/ColorPicker/ColorSwatch.js +2 -1
  178. package/DEV-esm/core/ComboBox/ComboBox.js +61 -29
  179. package/DEV-esm/core/ComboBox/ComboBoxEndIcon.js +2 -1
  180. package/DEV-esm/core/ComboBox/ComboBoxInput.js +2 -3
  181. package/DEV-esm/core/ComboBox/ComboBoxInputContainer.js +2 -1
  182. package/DEV-esm/core/ComboBox/ComboBoxMenu.js +2 -1
  183. package/DEV-esm/core/ComboBox/ComboBoxMenuItem.js +3 -2
  184. package/DEV-esm/core/ComboBox/ComboBoxMultipleContainer.js +2 -1
  185. package/DEV-esm/core/ComboBox/helpers.js +4 -2
  186. package/DEV-esm/core/DatePicker/DatePicker.js +5 -4
  187. package/DEV-esm/core/Dialog/Dialog.js +22 -9
  188. package/DEV-esm/core/Dialog/DialogBackdrop.js +2 -1
  189. package/DEV-esm/core/Dialog/DialogButtonBar.js +2 -1
  190. package/DEV-esm/core/Dialog/DialogContent.js +2 -1
  191. package/DEV-esm/core/Dialog/DialogMain.js +2 -1
  192. package/DEV-esm/core/Dialog/DialogTitleBar.js +2 -1
  193. package/DEV-esm/core/Dialog/DialogTitleBarTitle.js +2 -1
  194. package/DEV-esm/core/Divider/Divider.js +1 -1
  195. package/DEV-esm/core/DropdownMenu/DropdownMenu.js +32 -24
  196. package/DEV-esm/core/ExpandableBlock/ExpandableBlock.js +107 -91
  197. package/DEV-esm/core/Fieldset/Fieldset.js +1 -1
  198. package/DEV-esm/core/FileUpload/FileEmptyCard.js +6 -3
  199. package/DEV-esm/core/FileUpload/FileUpload.js +2 -1
  200. package/DEV-esm/core/FileUpload/FileUploadCard.js +18 -9
  201. package/DEV-esm/core/FileUpload/FileUploadTemplate.js +2 -1
  202. package/DEV-esm/core/Flex/Flex.js +4 -3
  203. package/DEV-esm/core/Footer/Footer.js +1 -1
  204. package/DEV-esm/core/Footer/FooterItem.js +2 -1
  205. package/DEV-esm/core/Footer/FooterList.js +2 -1
  206. package/DEV-esm/core/Footer/FooterSeparator.js +2 -1
  207. package/DEV-esm/core/Header/Header.js +1 -1
  208. package/DEV-esm/core/Header/HeaderBreadcrumbs.js +2 -1
  209. package/DEV-esm/core/Header/HeaderButton.js +2 -1
  210. package/DEV-esm/core/Header/HeaderLogo.js +3 -2
  211. package/DEV-esm/core/Icon/Icon.js +1 -1
  212. package/DEV-esm/core/InformationPanel/InformationPanel.js +2 -1
  213. package/DEV-esm/core/InformationPanel/InformationPanelBody.js +2 -1
  214. package/DEV-esm/core/InformationPanel/InformationPanelContent.js +2 -1
  215. package/DEV-esm/core/InformationPanel/InformationPanelHeader.js +2 -1
  216. package/DEV-esm/core/InformationPanel/InformationPanelWrapper.js +2 -1
  217. package/DEV-esm/core/Input/Input.js +1 -1
  218. package/DEV-esm/core/InputGrid/InputGrid.js +1 -1
  219. package/DEV-esm/core/InputGroup/InputGroup.js +2 -1
  220. package/DEV-esm/core/InputWithDecorations/InputWithDecorations.js +10 -5
  221. package/DEV-esm/core/Label/Label.js +1 -1
  222. package/DEV-esm/core/LabeledInput/LabeledInput.js +2 -1
  223. package/DEV-esm/core/LabeledSelect/LabeledSelect.js +5 -2
  224. package/DEV-esm/core/LabeledTextarea/LabeledTextarea.js +2 -1
  225. package/DEV-esm/core/LinkAction/LinkAction.js +4 -3
  226. package/DEV-esm/core/List/List.js +1 -1
  227. package/DEV-esm/core/List/ListItem.js +10 -5
  228. package/DEV-esm/core/Menu/Menu.js +4 -1
  229. package/DEV-esm/core/Menu/MenuDivider.js +2 -1
  230. package/DEV-esm/core/Menu/MenuExtraContent.js +3 -4
  231. package/DEV-esm/core/Menu/MenuItem.js +7 -3
  232. package/DEV-esm/core/Menu/MenuItemSkeleton.js +2 -1
  233. package/DEV-esm/core/Modal/Modal.js +1 -1
  234. package/DEV-esm/core/Modal/ModalButtonBar.js +2 -1
  235. package/DEV-esm/core/Modal/ModalContent.js +2 -1
  236. package/DEV-esm/core/NonIdealState/ErrorPage.js +1 -1
  237. package/DEV-esm/core/NonIdealState/NonIdealState.js +2 -1
  238. package/DEV-esm/core/NotificationMarker/NotificationMarker.js +2 -1
  239. package/DEV-esm/core/Overlay/Overlay.js +8 -4
  240. package/DEV-esm/core/Panels/Panels.js +13 -7
  241. package/DEV-esm/core/Panels/helpers.js +2 -1
  242. package/DEV-esm/core/Popover/Popover.js +39 -29
  243. package/DEV-esm/core/ProgressIndicators/ProgressLinear.js +2 -1
  244. package/DEV-esm/core/ProgressIndicators/ProgressRadial.js +2 -1
  245. package/DEV-esm/core/Radio/Radio.js +1 -1
  246. package/DEV-esm/core/RadioTiles/RadioTile.js +1 -1
  247. package/DEV-esm/core/RadioTiles/RadioTileGroup.js +2 -1
  248. package/DEV-esm/core/SearchBox/SearchBox.js +15 -8
  249. package/DEV-esm/core/Select/Select.js +61 -48
  250. package/DEV-esm/core/Select/SelectTag.js +1 -0
  251. package/DEV-esm/core/SideNavigation/SideNavigation.js +3 -2
  252. package/DEV-esm/core/SideNavigation/SidenavButton.js +2 -1
  253. package/DEV-esm/core/SideNavigation/SidenavSubmenu.js +2 -1
  254. package/DEV-esm/core/SideNavigation/SidenavSubmenuHeader.js +2 -1
  255. package/DEV-esm/core/SkipToContentLink/SkipToContentLink.js +2 -1
  256. package/DEV-esm/core/Slider/Slider.js +1 -1
  257. package/DEV-esm/core/StatusMessage/StatusMessage.js +2 -1
  258. package/DEV-esm/core/Stepper/Stepper.js +1 -1
  259. package/DEV-esm/core/Stepper/WorkflowDiagram.js +2 -1
  260. package/DEV-esm/core/Surface/Surface.js +7 -4
  261. package/DEV-esm/core/Table/ColumnHeader.js +17 -17
  262. package/DEV-esm/core/Table/Table.js +144 -57
  263. package/DEV-esm/core/Table/TableCell.js +6 -4
  264. package/DEV-esm/core/Table/actionHandlers/expandHandler.js +2 -4
  265. package/DEV-esm/core/Table/actionHandlers/selectHandler.js +1 -4
  266. package/DEV-esm/core/Table/cells/DefaultCell.js +31 -15
  267. package/DEV-esm/core/Table/cells/EditableCell.js +2 -1
  268. package/DEV-esm/core/Table/columns/expanderColumn.js +16 -17
  269. package/DEV-esm/core/Table/columns/selectionColumn.js +4 -2
  270. package/DEV-esm/core/Tabs/Tabs.js +75 -23
  271. package/DEV-esm/core/Tag/Tag.js +1 -1
  272. package/DEV-esm/core/Tag/TagContainer.js +2 -1
  273. package/DEV-esm/core/Textarea/Textarea.js +1 -1
  274. package/DEV-esm/core/ThemeProvider/ThemeProvider.js +34 -21
  275. package/DEV-esm/core/Tile/Tile.js +57 -48
  276. package/DEV-esm/core/TimePicker/TimePicker.js +2 -1
  277. package/DEV-esm/core/Toast/Toaster.js +4 -2
  278. package/DEV-esm/core/ToggleSwitch/ToggleSwitch.js +2 -1
  279. package/DEV-esm/core/Tooltip/Tooltip.js +1 -1
  280. package/DEV-esm/core/TransferList/TransferList.js +15 -11
  281. package/DEV-esm/core/Tree/Tree.js +1 -1
  282. package/DEV-esm/core/Tree/TreeNode.js +1 -1
  283. package/DEV-esm/core/Tree/TreeNodeExpander.js +2 -1
  284. package/DEV-esm/core/Typography/Anchor.js +1 -1
  285. package/DEV-esm/core/Typography/Blockquote.js +2 -1
  286. package/DEV-esm/core/Typography/Code.js +1 -1
  287. package/DEV-esm/core/Typography/Kbd.js +1 -1
  288. package/DEV-esm/core/Typography/Text.js +1 -1
  289. package/DEV-esm/core/VisuallyHidden/VisuallyHidden.js +2 -1
  290. package/DEV-esm/index.js +1 -1
  291. package/DEV-esm/styles.js +1 -1
  292. package/DEV-esm/utils/components/AutoclearingHiddenLiveRegion.js +2 -1
  293. package/DEV-esm/utils/components/ButtonBase.js +2 -1
  294. package/DEV-esm/utils/components/InputWithIcon.js +2 -1
  295. package/DEV-esm/utils/components/LineClamp.js +3 -0
  296. package/DEV-esm/utils/components/MiddleTextTruncation.js +2 -1
  297. package/DEV-esm/utils/components/OverflowContainer.js +6 -9
  298. package/DEV-esm/utils/components/Portal.js +2 -4
  299. package/DEV-esm/utils/components/ShadowRoot.js +10 -8
  300. package/DEV-esm/utils/functions/polymorphic.js +2 -1
  301. package/DEV-esm/utils/hooks/useGlobals.js +11 -2
  302. package/DEV-esm/utils/hooks/useWarningLogger.js +29 -27
  303. package/DEV-esm/utils/providers/index.js +0 -1
  304. package/cjs/core/Alert/Alert.js +12 -0
  305. package/cjs/core/Avatar/Avatar.js +1 -0
  306. package/cjs/core/AvatarGroup/AvatarGroup.js +2 -0
  307. package/cjs/core/Backdrop/Backdrop.js +1 -0
  308. package/cjs/core/Badge/Badge.js +1 -0
  309. package/cjs/core/Breadcrumbs/Breadcrumbs.js +10 -1
  310. package/cjs/core/ButtonGroup/ButtonGroup.js +4 -0
  311. package/cjs/core/Buttons/Button.js +1 -0
  312. package/cjs/core/Buttons/DropdownButton.js +2 -0
  313. package/cjs/core/Buttons/IconButton.js +9 -0
  314. package/cjs/core/Buttons/IdeasButton.js +2 -0
  315. package/cjs/core/Buttons/SplitButton.js +2 -0
  316. package/cjs/core/Carousel/Carousel.js +2 -0
  317. package/cjs/core/Carousel/CarouselContext.js +2 -0
  318. package/cjs/core/Carousel/CarouselDot.js +2 -0
  319. package/cjs/core/Carousel/CarouselDotsList.js +2 -0
  320. package/cjs/core/Carousel/CarouselNavigation.js +6 -0
  321. package/cjs/core/Carousel/CarouselSlide.js +2 -0
  322. package/cjs/core/Carousel/CarouselSlider.js +2 -0
  323. package/cjs/core/Checkbox/Checkbox.js +1 -0
  324. package/cjs/core/ColorPicker/ColorBuilder.js +2 -0
  325. package/cjs/core/ColorPicker/ColorInputPanel.js +4 -1
  326. package/cjs/core/ColorPicker/ColorPalette.js +2 -0
  327. package/cjs/core/ColorPicker/ColorPicker.js +2 -0
  328. package/cjs/core/ColorPicker/ColorSwatch.js +2 -0
  329. package/cjs/core/ComboBox/ComboBox.js +61 -28
  330. package/cjs/core/ComboBox/ComboBoxEndIcon.js +2 -0
  331. package/cjs/core/ComboBox/ComboBoxInput.js +2 -2
  332. package/cjs/core/ComboBox/ComboBoxInputContainer.js +2 -0
  333. package/cjs/core/ComboBox/ComboBoxMenu.js +2 -0
  334. package/cjs/core/ComboBox/ComboBoxMenuItem.js +3 -1
  335. package/cjs/core/ComboBox/ComboBoxMultipleContainer.js +2 -0
  336. package/cjs/core/ComboBox/helpers.js +4 -0
  337. package/cjs/core/DatePicker/DatePicker.js +11 -2
  338. package/cjs/core/Dialog/Dialog.js +23 -10
  339. package/cjs/core/Dialog/DialogBackdrop.js +2 -0
  340. package/cjs/core/Dialog/DialogButtonBar.js +2 -0
  341. package/cjs/core/Dialog/DialogContent.js +2 -0
  342. package/cjs/core/Dialog/DialogContext.d.ts +1 -1
  343. package/cjs/core/Dialog/DialogMain.js +2 -0
  344. package/cjs/core/Dialog/DialogTitleBar.js +2 -0
  345. package/cjs/core/Dialog/DialogTitleBarTitle.js +2 -0
  346. package/cjs/core/Divider/Divider.js +1 -0
  347. package/cjs/core/DropdownMenu/DropdownMenu.d.ts +7 -1
  348. package/cjs/core/DropdownMenu/DropdownMenu.js +32 -23
  349. package/cjs/core/ExpandableBlock/ExpandableBlock.d.ts +3 -0
  350. package/cjs/core/ExpandableBlock/ExpandableBlock.js +38 -3
  351. package/cjs/core/Fieldset/Fieldset.js +1 -0
  352. package/cjs/core/FileUpload/FileEmptyCard.js +6 -0
  353. package/cjs/core/FileUpload/FileUpload.js +2 -0
  354. package/cjs/core/FileUpload/FileUploadCard.js +18 -0
  355. package/cjs/core/FileUpload/FileUploadTemplate.js +2 -0
  356. package/cjs/core/Flex/Flex.js +4 -0
  357. package/cjs/core/Footer/Footer.js +1 -0
  358. package/cjs/core/Footer/FooterItem.js +2 -0
  359. package/cjs/core/Footer/FooterList.js +2 -0
  360. package/cjs/core/Footer/FooterSeparator.js +2 -0
  361. package/cjs/core/Header/Header.js +1 -0
  362. package/cjs/core/Header/HeaderBreadcrumbs.js +2 -0
  363. package/cjs/core/Header/HeaderButton.js +2 -0
  364. package/cjs/core/Header/HeaderLogo.js +3 -1
  365. package/cjs/core/Icon/Icon.js +1 -0
  366. package/cjs/core/InformationPanel/InformationPanel.js +2 -0
  367. package/cjs/core/InformationPanel/InformationPanelBody.js +2 -0
  368. package/cjs/core/InformationPanel/InformationPanelContent.js +2 -0
  369. package/cjs/core/InformationPanel/InformationPanelHeader.js +2 -0
  370. package/cjs/core/InformationPanel/InformationPanelWrapper.js +2 -0
  371. package/cjs/core/Input/Input.js +1 -0
  372. package/cjs/core/InputGrid/InputGrid.js +1 -0
  373. package/cjs/core/InputGroup/InputGroup.js +2 -0
  374. package/cjs/core/InputWithDecorations/InputWithDecorations.js +10 -0
  375. package/cjs/core/Label/Label.js +1 -0
  376. package/cjs/core/LabeledInput/LabeledInput.js +2 -0
  377. package/cjs/core/LabeledSelect/LabeledSelect.js +5 -1
  378. package/cjs/core/LabeledTextarea/LabeledTextarea.js +2 -0
  379. package/cjs/core/LinkAction/LinkAction.js +4 -1
  380. package/cjs/core/List/List.js +1 -0
  381. package/cjs/core/List/ListItem.js +10 -0
  382. package/cjs/core/Menu/Menu.d.ts +3 -1
  383. package/cjs/core/Menu/Menu.js +3 -1
  384. package/cjs/core/Menu/MenuDivider.js +2 -0
  385. package/cjs/core/Menu/MenuExtraContent.d.ts +1 -1
  386. package/cjs/core/Menu/MenuExtraContent.js +3 -3
  387. package/cjs/core/Menu/MenuItem.js +10 -1
  388. package/cjs/core/Menu/MenuItemSkeleton.js +2 -0
  389. package/cjs/core/Modal/Modal.d.ts +1 -1
  390. package/cjs/core/Modal/Modal.js +1 -0
  391. package/cjs/core/Modal/ModalButtonBar.js +2 -0
  392. package/cjs/core/Modal/ModalContent.js +2 -0
  393. package/cjs/core/NonIdealState/ErrorPage.js +1 -0
  394. package/cjs/core/NonIdealState/NonIdealState.js +2 -0
  395. package/cjs/core/NotificationMarker/NotificationMarker.js +2 -0
  396. package/cjs/core/Overlay/Overlay.js +8 -0
  397. package/cjs/core/Panels/Panels.js +13 -0
  398. package/cjs/core/Panels/helpers.js +2 -0
  399. package/cjs/core/Popover/Popover.js +35 -27
  400. package/cjs/core/ProgressIndicators/ProgressLinear.js +2 -0
  401. package/cjs/core/ProgressIndicators/ProgressRadial.js +2 -0
  402. package/cjs/core/Radio/Radio.js +1 -0
  403. package/cjs/core/RadioTiles/RadioTile.js +1 -0
  404. package/cjs/core/RadioTiles/RadioTileGroup.js +2 -0
  405. package/cjs/core/SearchBox/SearchBox.js +15 -0
  406. package/cjs/core/Select/Select.js +61 -47
  407. package/cjs/core/Select/SelectTag.js +1 -0
  408. package/cjs/core/SideNavigation/SideNavigation.d.ts +5 -1
  409. package/cjs/core/SideNavigation/SideNavigation.js +3 -1
  410. package/cjs/core/SideNavigation/SidenavButton.js +2 -0
  411. package/cjs/core/SideNavigation/SidenavSubmenu.js +2 -0
  412. package/cjs/core/SideNavigation/SidenavSubmenuHeader.js +2 -0
  413. package/cjs/core/SkipToContentLink/SkipToContentLink.js +2 -0
  414. package/cjs/core/Slider/Slider.js +1 -0
  415. package/cjs/core/StatusMessage/StatusMessage.js +2 -0
  416. package/cjs/core/Stepper/Stepper.js +1 -0
  417. package/cjs/core/Stepper/WorkflowDiagram.js +2 -0
  418. package/cjs/core/Surface/Surface.js +7 -0
  419. package/cjs/core/Table/ColumnHeader.js +17 -17
  420. package/cjs/core/Table/Table.d.ts +27 -1
  421. package/cjs/core/Table/Table.js +152 -53
  422. package/cjs/core/Table/TableCell.js +6 -4
  423. package/cjs/core/Table/actionHandlers/expandHandler.js +2 -4
  424. package/cjs/core/Table/actionHandlers/selectHandler.js +1 -4
  425. package/cjs/core/Table/cells/DefaultCell.js +31 -14
  426. package/cjs/core/Table/cells/EditableCell.js +2 -0
  427. package/cjs/core/Table/columns/expanderColumn.js +16 -17
  428. package/cjs/core/Table/columns/selectionColumn.js +4 -2
  429. package/cjs/core/Tabs/Tabs.d.ts +37 -0
  430. package/cjs/core/Tabs/Tabs.js +82 -16
  431. package/cjs/core/Tag/Tag.js +1 -0
  432. package/cjs/core/Tag/TagContainer.js +2 -0
  433. package/cjs/core/Textarea/Textarea.js +1 -0
  434. package/cjs/core/ThemeProvider/ThemeProvider.js +57 -21
  435. package/cjs/core/Tile/Tile.js +56 -26
  436. package/cjs/core/TimePicker/TimePicker.js +2 -0
  437. package/cjs/core/Toast/Toaster.js +4 -0
  438. package/cjs/core/ToggleSwitch/ToggleSwitch.js +2 -0
  439. package/cjs/core/Tooltip/Tooltip.js +1 -0
  440. package/cjs/core/TransferList/TransferList.js +15 -4
  441. package/cjs/core/Tree/Tree.js +1 -0
  442. package/cjs/core/Tree/TreeNode.js +1 -0
  443. package/cjs/core/Tree/TreeNodeExpander.js +2 -0
  444. package/cjs/core/Typography/Anchor.js +1 -0
  445. package/cjs/core/Typography/Blockquote.js +2 -0
  446. package/cjs/core/Typography/Code.js +1 -0
  447. package/cjs/core/Typography/Kbd.js +1 -0
  448. package/cjs/core/Typography/Text.js +1 -0
  449. package/cjs/core/VisuallyHidden/VisuallyHidden.js +2 -0
  450. package/cjs/index.d.ts +1 -1
  451. package/cjs/index.js +3 -0
  452. package/cjs/styles.js +1 -1
  453. package/cjs/utils/components/AutoclearingHiddenLiveRegion.d.ts +2 -2
  454. package/cjs/utils/components/AutoclearingHiddenLiveRegion.js +2 -1
  455. package/cjs/utils/components/ButtonBase.js +2 -0
  456. package/cjs/utils/components/InputWithIcon.js +2 -0
  457. package/cjs/utils/components/LineClamp.js +6 -0
  458. package/cjs/utils/components/MiddleTextTruncation.js +2 -0
  459. package/cjs/utils/components/OverflowContainer.js +6 -8
  460. package/cjs/utils/components/Portal.d.ts +3 -5
  461. package/cjs/utils/components/Portal.js +4 -8
  462. package/cjs/utils/components/ShadowRoot.d.ts +11 -2
  463. package/cjs/utils/components/ShadowRoot.js +10 -8
  464. package/cjs/utils/functions/polymorphic.js +2 -0
  465. package/cjs/utils/hooks/useGlobals.js +29 -2
  466. package/cjs/utils/hooks/useWarningLogger.js +29 -1
  467. package/cjs/utils/providers/index.d.ts +0 -1
  468. package/cjs/utils/providers/index.js +0 -1
  469. package/esm/core/Alert/Alert.js +12 -0
  470. package/esm/core/Avatar/Avatar.js +1 -0
  471. package/esm/core/AvatarGroup/AvatarGroup.js +2 -0
  472. package/esm/core/Backdrop/Backdrop.js +1 -0
  473. package/esm/core/Badge/Badge.js +1 -0
  474. package/esm/core/Breadcrumbs/Breadcrumbs.js +10 -1
  475. package/esm/core/ButtonGroup/ButtonGroup.js +4 -0
  476. package/esm/core/Buttons/Button.js +1 -0
  477. package/esm/core/Buttons/DropdownButton.js +2 -0
  478. package/esm/core/Buttons/IconButton.js +9 -0
  479. package/esm/core/Buttons/IdeasButton.js +2 -0
  480. package/esm/core/Buttons/SplitButton.js +2 -0
  481. package/esm/core/Carousel/Carousel.js +2 -0
  482. package/esm/core/Carousel/CarouselContext.js +2 -0
  483. package/esm/core/Carousel/CarouselDot.js +2 -0
  484. package/esm/core/Carousel/CarouselDotsList.js +2 -0
  485. package/esm/core/Carousel/CarouselNavigation.js +6 -0
  486. package/esm/core/Carousel/CarouselSlide.js +2 -0
  487. package/esm/core/Carousel/CarouselSlider.js +2 -0
  488. package/esm/core/Checkbox/Checkbox.js +1 -0
  489. package/esm/core/ColorPicker/ColorBuilder.js +2 -0
  490. package/esm/core/ColorPicker/ColorInputPanel.js +4 -1
  491. package/esm/core/ColorPicker/ColorPalette.js +2 -0
  492. package/esm/core/ColorPicker/ColorPicker.js +2 -0
  493. package/esm/core/ColorPicker/ColorSwatch.js +2 -0
  494. package/esm/core/ComboBox/ComboBox.js +61 -28
  495. package/esm/core/ComboBox/ComboBoxEndIcon.js +2 -0
  496. package/esm/core/ComboBox/ComboBoxInput.js +2 -2
  497. package/esm/core/ComboBox/ComboBoxInputContainer.js +2 -0
  498. package/esm/core/ComboBox/ComboBoxMenu.js +2 -0
  499. package/esm/core/ComboBox/ComboBoxMenuItem.js +3 -1
  500. package/esm/core/ComboBox/ComboBoxMultipleContainer.js +2 -0
  501. package/esm/core/ComboBox/helpers.js +4 -0
  502. package/esm/core/DatePicker/DatePicker.js +11 -2
  503. package/esm/core/Dialog/Dialog.js +22 -8
  504. package/esm/core/Dialog/DialogBackdrop.js +2 -0
  505. package/esm/core/Dialog/DialogButtonBar.js +2 -0
  506. package/esm/core/Dialog/DialogContent.js +2 -0
  507. package/esm/core/Dialog/DialogContext.d.ts +1 -1
  508. package/esm/core/Dialog/DialogMain.js +2 -0
  509. package/esm/core/Dialog/DialogTitleBar.js +2 -0
  510. package/esm/core/Dialog/DialogTitleBarTitle.js +2 -0
  511. package/esm/core/Divider/Divider.js +1 -0
  512. package/esm/core/DropdownMenu/DropdownMenu.d.ts +7 -1
  513. package/esm/core/DropdownMenu/DropdownMenu.js +32 -23
  514. package/esm/core/ExpandableBlock/ExpandableBlock.d.ts +3 -0
  515. package/esm/core/ExpandableBlock/ExpandableBlock.js +107 -81
  516. package/esm/core/Fieldset/Fieldset.js +1 -0
  517. package/esm/core/FileUpload/FileEmptyCard.js +6 -0
  518. package/esm/core/FileUpload/FileUpload.js +2 -0
  519. package/esm/core/FileUpload/FileUploadCard.js +18 -0
  520. package/esm/core/FileUpload/FileUploadTemplate.js +2 -0
  521. package/esm/core/Flex/Flex.js +4 -0
  522. package/esm/core/Footer/Footer.js +1 -0
  523. package/esm/core/Footer/FooterItem.js +2 -0
  524. package/esm/core/Footer/FooterList.js +2 -0
  525. package/esm/core/Footer/FooterSeparator.js +2 -0
  526. package/esm/core/Header/Header.js +1 -0
  527. package/esm/core/Header/HeaderBreadcrumbs.js +2 -0
  528. package/esm/core/Header/HeaderButton.js +2 -0
  529. package/esm/core/Header/HeaderLogo.js +3 -1
  530. package/esm/core/Icon/Icon.js +1 -0
  531. package/esm/core/InformationPanel/InformationPanel.js +2 -0
  532. package/esm/core/InformationPanel/InformationPanelBody.js +2 -0
  533. package/esm/core/InformationPanel/InformationPanelContent.js +2 -0
  534. package/esm/core/InformationPanel/InformationPanelHeader.js +2 -0
  535. package/esm/core/InformationPanel/InformationPanelWrapper.js +2 -0
  536. package/esm/core/Input/Input.js +1 -0
  537. package/esm/core/InputGrid/InputGrid.js +1 -0
  538. package/esm/core/InputGroup/InputGroup.js +2 -0
  539. package/esm/core/InputWithDecorations/InputWithDecorations.js +10 -0
  540. package/esm/core/Label/Label.js +1 -0
  541. package/esm/core/LabeledInput/LabeledInput.js +2 -0
  542. package/esm/core/LabeledSelect/LabeledSelect.js +5 -1
  543. package/esm/core/LabeledTextarea/LabeledTextarea.js +2 -0
  544. package/esm/core/LinkAction/LinkAction.js +4 -1
  545. package/esm/core/List/List.js +1 -0
  546. package/esm/core/List/ListItem.js +10 -0
  547. package/esm/core/Menu/Menu.d.ts +3 -1
  548. package/esm/core/Menu/Menu.js +4 -1
  549. package/esm/core/Menu/MenuDivider.js +2 -0
  550. package/esm/core/Menu/MenuExtraContent.d.ts +1 -1
  551. package/esm/core/Menu/MenuExtraContent.js +3 -3
  552. package/esm/core/Menu/MenuItem.js +10 -1
  553. package/esm/core/Menu/MenuItemSkeleton.js +2 -0
  554. package/esm/core/Modal/Modal.d.ts +1 -1
  555. package/esm/core/Modal/Modal.js +1 -0
  556. package/esm/core/Modal/ModalButtonBar.js +2 -0
  557. package/esm/core/Modal/ModalContent.js +2 -0
  558. package/esm/core/NonIdealState/ErrorPage.js +1 -0
  559. package/esm/core/NonIdealState/NonIdealState.js +2 -0
  560. package/esm/core/NotificationMarker/NotificationMarker.js +2 -0
  561. package/esm/core/Overlay/Overlay.js +8 -0
  562. package/esm/core/Panels/Panels.js +13 -0
  563. package/esm/core/Panels/helpers.js +2 -0
  564. package/esm/core/Popover/Popover.js +39 -28
  565. package/esm/core/ProgressIndicators/ProgressLinear.js +2 -0
  566. package/esm/core/ProgressIndicators/ProgressRadial.js +2 -0
  567. package/esm/core/Radio/Radio.js +1 -0
  568. package/esm/core/RadioTiles/RadioTile.js +1 -0
  569. package/esm/core/RadioTiles/RadioTileGroup.js +2 -0
  570. package/esm/core/SearchBox/SearchBox.js +15 -0
  571. package/esm/core/Select/Select.js +61 -47
  572. package/esm/core/Select/SelectTag.js +1 -0
  573. package/esm/core/SideNavigation/SideNavigation.d.ts +5 -1
  574. package/esm/core/SideNavigation/SideNavigation.js +3 -1
  575. package/esm/core/SideNavigation/SidenavButton.js +2 -0
  576. package/esm/core/SideNavigation/SidenavSubmenu.js +2 -0
  577. package/esm/core/SideNavigation/SidenavSubmenuHeader.js +2 -0
  578. package/esm/core/SkipToContentLink/SkipToContentLink.js +2 -0
  579. package/esm/core/Slider/Slider.js +1 -0
  580. package/esm/core/StatusMessage/StatusMessage.js +2 -0
  581. package/esm/core/Stepper/Stepper.js +1 -0
  582. package/esm/core/Stepper/WorkflowDiagram.js +2 -0
  583. package/esm/core/Surface/Surface.js +7 -0
  584. package/esm/core/Table/ColumnHeader.js +17 -17
  585. package/esm/core/Table/Table.d.ts +27 -1
  586. package/esm/core/Table/Table.js +149 -53
  587. package/esm/core/Table/TableCell.js +6 -4
  588. package/esm/core/Table/actionHandlers/expandHandler.js +2 -4
  589. package/esm/core/Table/actionHandlers/selectHandler.js +1 -4
  590. package/esm/core/Table/cells/DefaultCell.js +31 -14
  591. package/esm/core/Table/cells/EditableCell.js +2 -0
  592. package/esm/core/Table/columns/expanderColumn.js +16 -17
  593. package/esm/core/Table/columns/selectionColumn.js +4 -2
  594. package/esm/core/Tabs/Tabs.d.ts +37 -0
  595. package/esm/core/Tabs/Tabs.js +75 -12
  596. package/esm/core/Tag/Tag.js +1 -0
  597. package/esm/core/Tag/TagContainer.js +2 -0
  598. package/esm/core/Textarea/Textarea.js +1 -0
  599. package/esm/core/ThemeProvider/ThemeProvider.js +57 -20
  600. package/esm/core/Tile/Tile.js +57 -30
  601. package/esm/core/TimePicker/TimePicker.js +2 -0
  602. package/esm/core/Toast/Toaster.js +4 -0
  603. package/esm/core/ToggleSwitch/ToggleSwitch.js +2 -0
  604. package/esm/core/Tooltip/Tooltip.js +1 -0
  605. package/esm/core/TransferList/TransferList.js +15 -4
  606. package/esm/core/Tree/Tree.js +1 -0
  607. package/esm/core/Tree/TreeNode.js +1 -0
  608. package/esm/core/Tree/TreeNodeExpander.js +2 -0
  609. package/esm/core/Typography/Anchor.js +1 -0
  610. package/esm/core/Typography/Blockquote.js +2 -0
  611. package/esm/core/Typography/Code.js +1 -0
  612. package/esm/core/Typography/Kbd.js +1 -0
  613. package/esm/core/Typography/Text.js +1 -0
  614. package/esm/core/VisuallyHidden/VisuallyHidden.js +2 -0
  615. package/esm/index.d.ts +1 -1
  616. package/esm/index.js +1 -1
  617. package/esm/styles.js +1 -1
  618. package/esm/utils/components/AutoclearingHiddenLiveRegion.d.ts +2 -2
  619. package/esm/utils/components/AutoclearingHiddenLiveRegion.js +2 -1
  620. package/esm/utils/components/ButtonBase.js +2 -0
  621. package/esm/utils/components/InputWithIcon.js +2 -0
  622. package/esm/utils/components/LineClamp.js +3 -0
  623. package/esm/utils/components/MiddleTextTruncation.js +2 -0
  624. package/esm/utils/components/OverflowContainer.js +6 -8
  625. package/esm/utils/components/Portal.d.ts +3 -5
  626. package/esm/utils/components/Portal.js +2 -4
  627. package/esm/utils/components/ShadowRoot.d.ts +11 -2
  628. package/esm/utils/components/ShadowRoot.js +10 -8
  629. package/esm/utils/functions/polymorphic.js +2 -0
  630. package/esm/utils/hooks/useGlobals.js +29 -2
  631. package/esm/utils/hooks/useWarningLogger.js +29 -1
  632. package/esm/utils/providers/index.d.ts +0 -1
  633. package/esm/utils/providers/index.js +0 -1
  634. package/package.json +11 -12
  635. package/styles.css +10 -10
  636. package/DEV-cjs/utils/providers/ScopeProvider.js +0 -66
  637. package/DEV-esm/utils/providers/ScopeProvider.js +0 -43
  638. package/cjs/utils/providers/ScopeProvider.d.ts +0 -26
  639. package/cjs/utils/providers/ScopeProvider.js +0 -66
  640. package/esm/utils/providers/ScopeProvider.d.ts +0 -26
  641. package/esm/utils/providers/ScopeProvider.js +0 -43
package/esm/core/Menu/MenuExtraContent.js CHANGED
@@ -1,4 +1,4 @@
1
1
  import { polymorphic } from '../../utils/index.js';
2
- export const MenuExtraContent = polymorphic.li('iui-menu-content', {
3
- role: 'presentation',
4
- });
2
+ export const MenuExtraContent = polymorphic.div('iui-menu-content');
3
+ if ('development' === process.env.NODE_ENV)
4
+ MenuExtraContent.displayName = 'MenuExtraContent';
package/esm/core/Menu/MenuItem.js CHANGED
@@ -21,7 +21,7 @@ export const MenuItem = React.forwardRef((props, forwardedRef) => {
21
21
  value,
22
22
  onClick: onClickProp,
23
23
  sublabel,
24
- size = sublabel ? 'large' : 'default',
24
+ size = !!sublabel ? 'large' : 'default',
25
25
  icon,
26
26
  startIcon = icon,
27
27
  badge,
@@ -31,6 +31,14 @@ export const MenuItem = React.forwardRef((props, forwardedRef) => {
31
31
  ...rest
32
32
  } = props;
33
33
  let logWarning = useWarningLogger();
34
+ if (
35
+ 'development' === process.env.NODE_ENV &&
36
+ null != onClickProp &&
37
+ subMenuItems.length > 0
38
+ )
39
+ logWarning(
40
+ 'Passing a non-empty submenuItems array and onClick to MenuItem at the same time is not supported. This is because when a non empty submenuItems array is passed, clicking the MenuItem toggles the submenu visibility.',
41
+ );
34
42
  let parentMenu = React.useContext(MenuContext);
35
43
  let dropdownMenu = React.useContext(DropdownMenuContext);
36
44
  let shouldCloseMenuOnClick = React.useContext(
@@ -139,3 +147,4 @@ export const MenuItem = React.forwardRef((props, forwardedRef) => {
139
147
  : trigger,
140
148
  );
141
149
  });
150
+ if ('development' === process.env.NODE_ENV) MenuItem.displayName = 'MenuItem';
package/esm/core/Menu/MenuItemSkeleton.js CHANGED
@@ -50,3 +50,5 @@ export const MenuItemSkeleton = React.forwardRef((props, forwardedRef) => {
50
50
  ),
51
51
  );
52
52
  });
53
+ if ('development' === process.env.NODE_ENV)
54
+ MenuItemSkeleton.displayName = 'MenuItemSkeleton';
package/esm/core/Modal/Modal.d.ts CHANGED
@@ -30,7 +30,7 @@ type ModalProps = {
30
30
  */
31
31
  onKeyDown?: React.KeyboardEventHandler;
32
32
  /**
33
- * If true, the dialog will be portaled into a <div> inside the nearest `ThemeProvider`.
33
+ * If true, the dialog will be portaled to the end of `<body>` or to the nearest popover.
34
34
  *
35
35
  * Can be set to an object with a `to` property to portal into a specific element.
36
36
  * If `to`/`to()` === `null`/`undefined`, the default behavior will be used (i.e. as if `portal` is not passed).
package/esm/core/Modal/Modal.js CHANGED
@@ -45,3 +45,4 @@ export const Modal = React.forwardRef((props, forwardedRef) => {
45
45
  ),
46
46
  );
47
47
  });
48
+ if ('development' === process.env.NODE_ENV) Modal.displayName = 'Modal';
package/esm/core/Modal/ModalButtonBar.js CHANGED
@@ -1,2 +1,4 @@
1
1
  import { DialogButtonBar } from '../Dialog/DialogButtonBar.js';
2
2
  export const ModalButtonBar = Object.assign({}, DialogButtonBar);
3
+ if ('development' === process.env.NODE_ENV)
4
+ ModalButtonBar.displayName = 'ModalButtonBar';
package/esm/core/Modal/ModalContent.js CHANGED
@@ -1,2 +1,4 @@
1
1
  import { DialogContent } from '../Dialog/DialogContent.js';
2
2
  export const ModalContent = Object.assign({}, DialogContent);
3
+ if ('development' === process.env.NODE_ENV)
4
+ ModalContent.displayName = 'ModalContent';
package/esm/core/NonIdealState/ErrorPage.js CHANGED
@@ -164,3 +164,4 @@ export const ErrorPage = React.forwardRef((props, forwardedRef) => {
164
164
  ...rest,
165
165
  });
166
166
  });
167
+ if ('development' === process.env.NODE_ENV) ErrorPage.displayName = 'ErrorPage';
package/esm/core/NonIdealState/NonIdealState.js CHANGED
@@ -68,3 +68,5 @@ export const NonIdealState = React.forwardRef((props, forwardedRef) => {
68
68
  ),
69
69
  );
70
70
  });
71
+ if ('development' === process.env.NODE_ENV)
72
+ NonIdealState.displayName = 'NonIdealState';
package/esm/core/NotificationMarker/NotificationMarker.js CHANGED
@@ -28,3 +28,5 @@ export const NotificationMarker = React.forwardRef((props, ref) => {
28
28
  children,
29
29
  );
30
30
  });
31
+ if ('development' === process.env.NODE_ENV)
32
+ NotificationMarker.displayName = 'NotificationMarker';
package/esm/core/Overlay/Overlay.js CHANGED
@@ -12,6 +12,8 @@ let OverlayComponent = React.forwardRef((props, forwardedRef) => {
12
12
  React.createElement(OverlayHiddenContent, null, children),
13
13
  );
14
14
  });
15
+ if ('development' === process.env.NODE_ENV)
16
+ OverlayComponent.displayName = 'Overlay';
15
17
  let OverlayHiddenContent = React.forwardRef((props, ref) => {
16
18
  let { children, ...rest } = props;
17
19
  return React.createElement(
@@ -24,8 +26,14 @@ let OverlayHiddenContent = React.forwardRef((props, ref) => {
24
26
  children,
25
27
  );
26
28
  });
29
+ if ('development' === process.env.NODE_ENV)
30
+ OverlayHiddenContent.displayName = 'Overlay.HiddenContent';
27
31
  let OverlayOverlay = polymorphic.div('iui-overlay');
32
+ if ('development' === process.env.NODE_ENV)
33
+ OverlayOverlay.displayName = 'Overlay.Overlay';
28
34
  let OverlayWrapper = polymorphic.div('iui-overlay-wrapper');
35
+ if ('development' === process.env.NODE_ENV)
36
+ OverlayWrapper.displayName = 'Overlay.Wrapper';
29
37
  export const Overlay = Object.assign(OverlayComponent, {
30
38
  Wrapper: OverlayWrapper,
31
39
  HiddenContent: OverlayHiddenContent,
package/esm/core/Panels/Panels.js CHANGED
@@ -92,7 +92,11 @@ export const PanelsWrapper = React.forwardRef((props, forwardedRef) => {
92
92
  ),
93
93
  );
94
94
  });
95
+ if ('development' === process.env.NODE_ENV)
96
+ PanelsWrapper.displayName = 'Panels.Wrapper';
95
97
  export const PanelsWrapperContext = React.createContext(void 0);
98
+ if ('development' === process.env.NODE_ENV)
99
+ PanelsWrapperContext.displayName = 'PanelsWrapperContext';
96
100
  let Panel = React.forwardRef((props, forwardedRef) => {
97
101
  let { id, children, className, ...rest } = props;
98
102
  let { activePanelId, triggers, panels, setActivePanelId } =
@@ -140,7 +144,10 @@ let Panel = React.forwardRef((props, forwardedRef) => {
140
144
  ),
141
145
  );
142
146
  });
147
+ if ('development' === process.env.NODE_ENV) Panel.displayName = 'Panels.Panel';
143
148
  let PanelContext = React.createContext(void 0);
149
+ if ('development' === process.env.NODE_ENV)
150
+ PanelContext.displayName = 'PanelContext';
144
151
  let PanelTrigger = (props) => {
145
152
  let { children, for: forProp } = props;
146
153
  let {
@@ -213,6 +220,8 @@ let PanelTrigger = (props) => {
213
220
  'aria-controls': forProp,
214
221
  }));
215
222
  };
223
+ if ('development' === process.env.NODE_ENV)
224
+ PanelTrigger.displayName = 'Panels.Trigger';
216
225
  let PanelHeader = React.forwardRef((props, forwardedRef) => {
217
226
  let { titleProps, children, ...rest } = props;
218
227
  let { shouldFocus, setShouldFocus } = useSafeContext(PanelsWrapperContext);
@@ -252,6 +261,8 @@ let PanelHeader = React.forwardRef((props, forwardedRef) => {
252
261
  ),
253
262
  );
254
263
  });
264
+ if ('development' === process.env.NODE_ENV)
265
+ PanelHeader.displayName = 'Panels.Header';
255
266
  let PanelBackButton = React.forwardRef((props, forwardedRef) => {
256
267
  let { children, onClick, ...rest } = props;
257
268
  let { instance: panelInstance } = useSafeContext(PanelsInstanceContext);
@@ -272,6 +283,8 @@ let PanelBackButton = React.forwardRef((props, forwardedRef) => {
272
283
  children || React.createElement(SvgChevronLeft, null),
273
284
  );
274
285
  });
286
+ if ('development' === process.env.NODE_ENV)
287
+ PanelBackButton.displayName = 'Panels.BackButton';
275
288
  export const Panels = {
276
289
  Wrapper: PanelsWrapper,
277
290
  Panel,
package/esm/core/Panels/helpers.js CHANGED
@@ -2,6 +2,8 @@ import * as React from 'react';
2
2
  import { useSafeContext, useSynchronizeInstance } from '../../utils/index.js';
3
3
  import { Panels, PanelsWrapperContext } from './Panels.js';
4
4
  export const PanelsInstanceContext = React.createContext(void 0);
5
+ if ('development' === process.env.NODE_ENV)
6
+ PanelsInstanceContext.displayName = 'PanelsInstanceContext';
5
7
  export const PanelsInstanceProvider = (props) => {
6
8
  let { children, instance: instanceProp } = props;
7
9
  let instanceBackup = Panels.useInstance();
package/esm/core/Popover/Popover.js CHANGED
@@ -32,7 +32,10 @@ import {
32
32
  useLayoutEffect,
33
33
  useMergedRefs,
34
34
  } from '../../utils/index.js';
35
- import { usePortalTo } from '../../utils/components/Portal.js';
35
+ import {
36
+ PortalContainerContext,
37
+ usePortalTo,
38
+ } from '../../utils/components/Portal.js';
36
39
  import { ThemeProvider } from '../ThemeProvider/ThemeProvider.js';
37
40
  export const PopoverOpenContext = React.createContext(void 0);
38
41
  export const PopoverInitialFocusContext = React.createContext(void 0);
@@ -51,10 +54,12 @@ export const usePopover = (options) => {
51
54
  let mergedInteractions = React.useMemo(
52
55
  () => ({
53
56
  ...interactionsProp,
54
- click: interactionsProp?.click ?? true,
55
- dismiss: interactionsProp?.dismiss ?? true,
56
- hover: interactionsProp?.hover ?? false,
57
- focus: interactionsProp?.focus ?? false,
57
+ ...{
58
+ click: interactionsProp?.click ?? true,
59
+ dismiss: interactionsProp?.dismiss ?? true,
60
+ hover: interactionsProp?.hover ?? false,
61
+ focus: interactionsProp?.focus ?? false,
62
+ },
58
63
  }),
59
64
  [interactionsProp],
60
65
  );
@@ -81,6 +86,7 @@ export const usePopover = (options) => {
81
86
  open,
82
87
  onOpenChange,
83
88
  strategy: 'fixed',
89
+ transform: false,
84
90
  whileElementsMounted: React.useMemo(
85
91
  () =>
86
92
  open ? (...args) => autoUpdate(...args, autoUpdateOptions) : void 0,
@@ -163,7 +169,7 @@ export const usePopover = (options) => {
163
169
  availableHeight && {
164
170
  maxBlockSize: `min(${availableHeight}px, ${maxHeight})`,
165
171
  }),
166
- zIndex: 9999,
172
+ zIndex: 999,
167
173
  ...(matchWidth && referenceWidth
168
174
  ? {
169
175
  minInlineSize: `${referenceWidth}px`,
@@ -233,7 +239,7 @@ export const Popover = React.forwardRef((props, forwardedRef) => {
233
239
  role: 'dialog',
234
240
  middleware,
235
241
  });
236
- let [popoverElement, setPopoverElement] = React.useState();
242
+ let [popoverElement, setPopoverElement] = React.useState(null);
237
243
  let popoverRef = useMergedRefs(
238
244
  popover.refs.setFloating,
239
245
  forwardedRef,
@@ -280,33 +286,37 @@ export const Popover = React.forwardRef((props, forwardedRef) => {
280
286
  },
281
287
  React.createElement(
282
288
  ThemeProvider,
283
- {
284
- portalContainer: popoverElement,
285
- },
286
- React.createElement(DisplayContents, null),
289
+ null,
287
290
  React.createElement(
288
- FloatingFocusManager,
291
+ PortalContainerContext.Provider,
289
292
  {
290
- context: popover.context,
291
- modal: false,
292
- initialFocus: initialFocus,
293
+ value: popoverElement,
293
294
  },
295
+ React.createElement(DisplayContents, null),
294
296
  React.createElement(
295
- Box,
297
+ FloatingFocusManager,
296
298
  {
297
- className: cx(
298
- {
299
- 'iui-popover-surface': applyBackground,
300
- },
301
- className,
302
- ),
303
- 'aria-labelledby': hasAriaLabel
304
- ? void 0
305
- : popover.refs.domReference.current?.id,
306
- ...popover.getFloatingProps(rest),
307
- ref: popoverRef,
299
+ context: popover.context,
300
+ modal: false,
301
+ initialFocus: initialFocus,
308
302
  },
309
- content,
303
+ React.createElement(
304
+ Box,
305
+ {
306
+ className: cx(
307
+ {
308
+ 'iui-popover-surface': applyBackground,
309
+ },
310
+ className,
311
+ ),
312
+ 'aria-labelledby': hasAriaLabel
313
+ ? void 0
314
+ : popover.refs.domReference.current?.id,
315
+ ...popover.getFloatingProps(rest),
316
+ ref: popoverRef,
317
+ },
318
+ content,
319
+ ),
310
320
  ),
311
321
  ),
312
322
  ),
@@ -315,6 +325,7 @@ export const Popover = React.forwardRef((props, forwardedRef) => {
315
325
  : null,
316
326
  );
317
327
  });
328
+ if ('development' === process.env.NODE_ENV) Popover.displayName = 'Popover';
318
329
  let PopoverPortal = ({ children, portal = true }) => {
319
330
  let portalTo = usePortalTo(portal);
320
331
  return React.createElement(
package/esm/core/ProgressIndicators/ProgressLinear.js CHANGED
@@ -57,3 +57,5 @@ export const ProgressLinear = React.forwardRef((props, forwardedRef) => {
57
57
  ),
58
58
  );
59
59
  });
60
+ if ('development' === process.env.NODE_ENV)
61
+ ProgressLinear.displayName = 'ProgressLinear';
package/esm/core/ProgressIndicators/ProgressRadial.js CHANGED
@@ -55,3 +55,5 @@ export const ProgressRadial = React.forwardRef((props, forwardedRef) => {
55
55
  'x-small' !== size ? children ?? (status ? statusMap[status] : null) : null,
56
56
  );
57
57
  });
58
+ if ('development' === process.env.NODE_ENV)
59
+ ProgressRadial.displayName = 'ProgressRadial';
package/esm/core/Radio/Radio.js CHANGED
@@ -47,3 +47,4 @@ export const Radio = React.forwardRef((props, ref) => {
47
47
  )
48
48
  : radio;
49
49
  });
50
+ if ('development' === process.env.NODE_ENV) Radio.displayName = 'Radio';
package/esm/core/RadioTiles/RadioTile.js CHANGED
@@ -65,3 +65,4 @@ export const RadioTile = React.forwardRef((props, ref) => {
65
65
  ),
66
66
  );
67
67
  });
68
+ if ('development' === process.env.NODE_ENV) RadioTile.displayName = 'RadioTile';
package/esm/core/RadioTiles/RadioTileGroup.js CHANGED
@@ -25,3 +25,5 @@ export const RadioTileGroup = React.forwardRef((props, forwardedRef) => {
25
25
  ),
26
26
  );
27
27
  });
28
+ if ('development' === process.env.NODE_ENV)
29
+ RadioTileGroup.displayName = 'RadioTileGroup';
package/esm/core/SearchBox/SearchBox.js CHANGED
@@ -113,11 +113,15 @@ let SearchBoxCollapsedState = ({ children }) => {
113
113
  children ?? React.createElement(SearchBoxExpandButton, null),
114
114
  );
115
115
  };
116
+ if ('development' === process.env.NODE_ENV)
117
+ SearchBoxCollapsedState.displayName = 'SearchBox.CollapsedState';
116
118
  let SearchBoxExpandedState = ({ children }) => {
117
119
  let { isExpanded, expandable } = useSafeContext(SearchBoxContext);
118
120
  if (expandable && !isExpanded) return null;
119
121
  return React.createElement(React.Fragment, null, children);
120
122
  };
123
+ if ('development' === process.env.NODE_ENV)
124
+ SearchBoxExpandedState.displayName = 'SearchBox.ExpandedState';
121
125
  let SearchBoxIcon = React.forwardRef((props, ref) => {
122
126
  let { className, children, ...rest } = props;
123
127
  return React.createElement(
@@ -131,6 +135,8 @@ let SearchBoxIcon = React.forwardRef((props, ref) => {
131
135
  children ?? React.createElement(SvgSearch, null),
132
136
  );
133
137
  });
138
+ if ('development' === process.env.NODE_ENV)
139
+ SearchBoxIcon.displayName = 'SearchBox.Icon';
134
140
  let SearchBoxInput = React.forwardRef((props, ref) => {
135
141
  let { className, id: idProp, ...rest } = props;
136
142
  let { inputId, setInputId, isDisabled, inputRef } =
@@ -149,6 +155,8 @@ let SearchBoxInput = React.forwardRef((props, ref) => {
149
155
  ...rest,
150
156
  });
151
157
  });
158
+ if ('development' === process.env.NODE_ENV)
159
+ SearchBoxInput.displayName = 'SearchBox.Input';
152
160
  let SearchBoxButton = React.forwardRef((props, ref) => {
153
161
  let { children, ...rest } = props;
154
162
  let { size: sizeContext, isDisabled } = useSafeContext(SearchBoxContext);
@@ -163,6 +171,8 @@ let SearchBoxButton = React.forwardRef((props, ref) => {
163
171
  children ?? React.createElement(SvgSearch, null),
164
172
  );
165
173
  });
174
+ if ('development' === process.env.NODE_ENV)
175
+ SearchBoxButton.displayName = 'SearchBox.Button';
166
176
  let SearchBoxCollapseButton = React.forwardRef((props, ref) => {
167
177
  let { children, onClick: onClickProp, ...rest } = props;
168
178
  let {
@@ -183,6 +193,8 @@ let SearchBoxCollapseButton = React.forwardRef((props, ref) => {
183
193
  children ?? React.createElement(SvgCloseSmall, null),
184
194
  );
185
195
  });
196
+ if ('development' === process.env.NODE_ENV)
197
+ SearchBoxCollapseButton.displayName = 'SearchBox.CollapseButton';
186
198
  let SearchBoxExpandButton = React.forwardRef((props, ref) => {
187
199
  let { children, onClick: onClickProp, ...rest } = props;
188
200
  let {
@@ -205,6 +217,8 @@ let SearchBoxExpandButton = React.forwardRef((props, ref) => {
205
217
  children ?? React.createElement(SvgSearch, null),
206
218
  );
207
219
  });
220
+ if ('development' === process.env.NODE_ENV)
221
+ SearchBoxExpandButton.displayName = 'SearchBox.ExpandButton';
208
222
  export const SearchBox = Object.assign(SearchBoxComponent, {
209
223
  Icon: SearchBoxIcon,
210
224
  Input: SearchBoxInput,
@@ -214,3 +228,4 @@ export const SearchBox = Object.assign(SearchBoxComponent, {
214
228
  ExpandedState: SearchBoxExpandedState,
215
229
  CollapsedState: SearchBoxCollapsedState,
216
230
  });
231
+ if ('development' === process.env.NODE_ENV) SearchBox.displayName = 'SearchBox';
package/esm/core/Select/Select.js CHANGED
@@ -27,6 +27,7 @@ export const Select = React.forwardRef((props, forwardedRef) => {
27
27
  ref: forwardedRef,
28
28
  });
29
29
  });
30
+ if ('development' === process.env.NODE_ENV) Select.displayName = 'Select';
30
31
  let NativeSelect = React.forwardRef((props, forwardedRef) => {
31
32
  let {
32
33
  triggerProps,
@@ -131,6 +132,36 @@ let CustomSelect = React.forwardRef((props, forwardedRef) => {
131
132
  });
132
133
  popoverProps?.onVisibleChange?.(false);
133
134
  }, [popoverProps]);
135
+ let handleOptionSelection = React.useCallback(
136
+ (option, { isSelected = false } = {}) => {
137
+ if (isSingleOnChange(onChangeRef.current, multiple)) {
138
+ setUncontrolledValue(option.value);
139
+ onChangeRef.current?.(option.value);
140
+ hide();
141
+ } else {
142
+ setUncontrolledValue((prev) =>
143
+ isSelected
144
+ ? prev?.filter((i) => option.value !== i)
145
+ : [...(prev ?? []), option.value],
146
+ );
147
+ onChangeRef.current?.(option.value, isSelected ? 'removed' : 'added');
148
+ }
149
+ if (isMultipleEnabled(value, multiple)) {
150
+ let prevSelectedValue = value || [];
151
+ let newSelectedValue = isSelected
152
+ ? prevSelectedValue.filter((i) => option.value !== i)
153
+ : [...prevSelectedValue, option.value];
154
+ setLiveRegionSelection(
155
+ options
156
+ .filter((i) => newSelectedValue.includes(i.value))
157
+ .map((item) => item.label)
158
+ .filter(Boolean)
159
+ .join(', '),
160
+ );
161
+ }
162
+ },
163
+ [hide, multiple, onChangeRef, options, value],
164
+ );
134
165
  let menuItems = React.useMemo(
135
166
  () =>
136
167
  options.map((option, index) => {
@@ -156,34 +187,9 @@ let CustomSelect = React.forwardRef((props, forwardedRef) => {
156
187
  : null,
157
188
  onClick: () => {
158
189
  if (option.disabled) return;
159
- if (isSingleOnChange(onChangeRef.current, multiple)) {
160
- setUncontrolledValue(option.value);
161
- onChangeRef.current?.(option.value);
162
- hide();
163
- } else {
164
- setUncontrolledValue((prev) =>
165
- isSelected
166
- ? prev?.filter((i) => option.value !== i)
167
- : [...(prev ?? []), option.value],
168
- );
169
- onChangeRef.current?.(
170
- option.value,
171
- isSelected ? 'removed' : 'added',
172
- );
173
- }
174
- if (isMultipleEnabled(value, multiple)) {
175
- let prevSelectedValue = value || [];
176
- let newSelectedValue = isSelected
177
- ? prevSelectedValue.filter((i) => option.value !== i)
178
- : [...prevSelectedValue, option.value];
179
- setLiveRegionSelection(
180
- options
181
- .filter((i) => newSelectedValue.includes(i.value))
182
- .map((item) => item.label)
183
- .filter(Boolean)
184
- .join(', '),
185
- );
186
- }
190
+ handleOptionSelection(option, {
191
+ isSelected,
192
+ });
187
193
  },
188
194
  ref: (el) => {
189
195
  if (isSelected && !multiple)
@@ -196,7 +202,7 @@ let CustomSelect = React.forwardRef((props, forwardedRef) => {
196
202
  ...menuItem.props,
197
203
  });
198
204
  }),
199
- [hide, itemRenderer, multiple, onChangeRef, options, value],
205
+ [handleOptionSelection, itemRenderer, multiple, options, value],
200
206
  );
201
207
  let selectedItems = React.useMemo(() => {
202
208
  if (null == value) return;
@@ -213,12 +219,18 @@ let CustomSelect = React.forwardRef((props, forwardedRef) => {
213
219
  return index >= 0 ? index : 0;
214
220
  }, [options, value]);
215
221
  let tagRenderer = React.useCallback(
216
- (item) =>
222
+ (option) =>
217
223
  React.createElement(SelectTag, {
218
- key: item.label,
219
- label: item.label,
224
+ key: option.label,
225
+ label: option.label,
226
+ onRemove: () => {
227
+ handleOptionSelection(option, {
228
+ isSelected: true,
229
+ });
230
+ selectRef.current?.focus();
231
+ },
220
232
  }),
221
- [],
233
+ [handleOptionSelection],
222
234
  );
223
235
  let popover = usePopover({
224
236
  visible: isOpen,
@@ -269,6 +281,7 @@ let CustomSelect = React.forwardRef((props, forwardedRef) => {
269
281
  },
270
282
  triggerProps?.className,
271
283
  ),
284
+ 'data-iui-multi': multiple,
272
285
  },
273
286
  (!selectedItems || 0 === selectedItems.length) &&
274
287
  React.createElement(
@@ -280,10 +293,8 @@ let CustomSelect = React.forwardRef((props, forwardedRef) => {
280
293
  placeholder,
281
294
  ),
282
295
  isMultipleEnabled(selectedItems, multiple)
283
- ? React.createElement(MultipleSelectButton, {
284
- selectedItems: selectedItems,
285
- selectedItemsRenderer: selectedItemRenderer,
286
- tagRenderer: tagRenderer,
296
+ ? React.createElement(AutoclearingHiddenLiveRegion, {
297
+ text: liveRegionSelection,
287
298
  })
288
299
  : React.createElement(SingleSelectButton, {
289
300
  selectedItem: selectedItems,
@@ -294,9 +305,12 @@ let CustomSelect = React.forwardRef((props, forwardedRef) => {
294
305
  disabled: disabled,
295
306
  isOpen: isOpen,
296
307
  }),
297
- multiple
298
- ? React.createElement(AutoclearingHiddenLiveRegion, {
299
- text: liveRegionSelection,
308
+ isMultipleEnabled(selectedItems, multiple)
309
+ ? React.createElement(MultipleSelectButton, {
310
+ selectedItems: selectedItems,
311
+ selectedItemsRenderer: selectedItemRenderer,
312
+ tagRenderer: tagRenderer,
313
+ size: 'small' === size ? 'small' : void 0,
300
314
  })
301
315
  : null,
302
316
  ),
@@ -395,6 +409,7 @@ let MultipleSelectButton = ({
395
409
  selectedItems,
396
410
  selectedItemsRenderer,
397
411
  tagRenderer,
412
+ size,
398
413
  }) => {
399
414
  let selectedItemsElements = React.useMemo(() => {
400
415
  if (!selectedItems) return [];
@@ -404,19 +419,18 @@ let MultipleSelectButton = ({
404
419
  React.Fragment,
405
420
  null,
406
421
  selectedItems &&
407
- selectedItemsRenderer &&
408
- selectedItemsRenderer(selectedItems),
409
- selectedItems &&
410
- !selectedItemsRenderer &&
411
422
  React.createElement(
412
423
  Box,
413
424
  {
414
425
  as: 'span',
415
426
  className: 'iui-content',
416
427
  },
417
- React.createElement(SelectTagContainer, {
418
- tags: selectedItemsElements,
419
- }),
428
+ selectedItemsRenderer
429
+ ? selectedItemsRenderer(selectedItems)
430
+ : React.createElement(SelectTagContainer, {
431
+ tags: selectedItemsElements,
432
+ 'data-iui-size': size,
433
+ }),
420
434
  ),
421
435
  );
422
436
  };
package/esm/core/Select/SelectTag.js CHANGED
@@ -12,6 +12,7 @@ export const SelectTag = React.forwardRef((props, forwardedRef) => {
12
12
  },
13
13
  removeButtonProps: {
14
14
  className: 'iui-select-tag-button',
15
+ 'aria-label': `Deselect ${label}`,
15
16
  },
16
17
  ref: forwardedRef,
17
18
  ...rest,
package/esm/core/SideNavigation/SideNavigation.d.ts CHANGED
@@ -52,7 +52,7 @@ type SideNavigationProps = {
52
52
  /**
53
53
  * Passes props for SideNav wrapper.
54
54
  */
55
- wrapperProps?: React.ComponentProps<'div'>;
55
+ wrapperProps?: React.ComponentProps<'nav'>;
56
56
  /**
57
57
  * Passes props for SideNav content.
58
58
  */
@@ -68,6 +68,10 @@ type SideNavigationProps = {
68
68
  };
69
69
  /**
70
70
  * Left side navigation menu component.
71
+ *
72
+ * Renders a `<nav>` landmark, which can be labelled using `wrapperProps['aria-labelledby']`
73
+ * or `wrapperProps['aria-label']`.
74
+ *
71
75
  * @example
72
76
  * <SideNavigation
73
77
  * items={[
package/esm/core/SideNavigation/SideNavigation.js CHANGED
@@ -44,6 +44,7 @@ export const SideNavigation = React.forwardRef((props, forwardedRef) => {
44
44
  React.createElement(
45
45
  Box,
46
46
  {
47
+ as: 'nav',
47
48
  ...wrapperProps,
48
49
  className: cx('iui-side-navigation-wrapper', wrapperProps?.className),
49
50
  ref: forwardedRef,
@@ -56,7 +57,6 @@ export const SideNavigation = React.forwardRef((props, forwardedRef) => {
56
57
  React.createElement(
57
58
  Box,
58
59
  {
59
- as: 'div',
60
60
  className: cx(
61
61
  'iui-side-navigation',
62
62
  {
@@ -101,3 +101,5 @@ export const SideNavigation = React.forwardRef((props, forwardedRef) => {
101
101
  ),
102
102
  );
103
103
  });
104
+ if ('development' === process.env.NODE_ENV)
105
+ SideNavigation.displayName = 'SideNavigation';
package/esm/core/SideNavigation/SidenavButton.js CHANGED
@@ -43,3 +43,5 @@ export const SidenavButton = React.forwardRef((props, ref) => {
43
43
  sidenavButton,
44
44
  );
45
45
  });
46
+ if ('development' === process.env.NODE_ENV)
47
+ SidenavButton.displayName = 'SidenavButton';
package/esm/core/SideNavigation/SidenavSubmenu.js CHANGED
@@ -19,3 +19,5 @@ export const SidenavSubmenu = React.forwardRef((props, ref) => {
19
19
  ),
20
20
  );
21
21
  });
22
+ if ('development' === process.env.NODE_ENV)
23
+ SidenavSubmenu.displayName = 'SidenavSubmenu';
package/esm/core/SideNavigation/SidenavSubmenuHeader.js CHANGED
@@ -27,3 +27,5 @@ export const SidenavSubmenuHeader = React.forwardRef((props, forwardedRef) => {
27
27
  ),
28
28
  );
29
29
  });
30
+ if ('development' === process.env.NODE_ENV)
31
+ SidenavSubmenuHeader.displayName = 'SidenavSubmenuHeader';
package/esm/core/SkipToContentLink/SkipToContentLink.js CHANGED
@@ -14,3 +14,5 @@ export const SkipToContentLink = React.forwardRef((props, ref) => {
14
14
  children,
15
15
  );
16
16
  });
17
+ if ('development' === process.env.NODE_ENV)
18
+ SkipToContentLink.displayName = 'SkipToContentLink';
package/esm/core/Slider/Slider.js CHANGED
@@ -347,3 +347,4 @@ export const Slider = React.forwardRef((props, ref) => {
347
347
  ),
348
348
  );
349
349
  });
350
+ if ('development' === process.env.NODE_ENV) Slider.displayName = 'Slider';