@itwin/itwinui-react 3.0.4 → 3.0.6

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 (500) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/cjs/core/Alert/Alert.js +46 -106
  3. package/cjs/core/Avatar/Avatar.js +21 -58
  4. package/cjs/core/AvatarGroup/AvatarGroup.js +26 -64
  5. package/cjs/core/Backdrop/Backdrop.js +8 -16
  6. package/cjs/core/Badge/Badge.js +22 -39
  7. package/cjs/core/Breadcrumbs/Breadcrumbs.js +61 -138
  8. package/cjs/core/ButtonGroup/ButtonGroup.js +32 -68
  9. package/cjs/core/Buttons/Button.js +11 -57
  10. package/cjs/core/Buttons/DropdownButton.js +15 -49
  11. package/cjs/core/Buttons/IconButton.js +13 -53
  12. package/cjs/core/Buttons/IdeasButton.js +8 -20
  13. package/cjs/core/Buttons/SplitButton.js +43 -103
  14. package/cjs/core/Carousel/Carousel.js +54 -78
  15. package/cjs/core/Carousel/CarouselContext.js +4 -4
  16. package/cjs/core/Carousel/CarouselDot.js +12 -23
  17. package/cjs/core/Carousel/CarouselDotsList.js +92 -153
  18. package/cjs/core/Carousel/CarouselNavigation.js +41 -84
  19. package/cjs/core/Carousel/CarouselSlide.js +26 -49
  20. package/cjs/core/Carousel/CarouselSlider.js +47 -66
  21. package/cjs/core/Checkbox/Checkbox.js +32 -88
  22. package/cjs/core/ColorPicker/ColorBuilder.js +174 -292
  23. package/cjs/core/ColorPicker/ColorInputPanel.js +246 -411
  24. package/cjs/core/ColorPicker/ColorPalette.js +23 -47
  25. package/cjs/core/ColorPicker/ColorPicker.js +53 -87
  26. package/cjs/core/ColorPicker/ColorPickerContext.js +9 -11
  27. package/cjs/core/ColorPicker/ColorSwatch.js +15 -40
  28. package/cjs/core/ComboBox/ComboBox.js +280 -402
  29. package/cjs/core/ComboBox/ComboBoxEndIcon.js +12 -28
  30. package/cjs/core/ComboBox/ComboBoxInput.js +131 -207
  31. package/cjs/core/ComboBox/ComboBoxInputContainer.js +12 -35
  32. package/cjs/core/ComboBox/ComboBoxMenu.js +43 -87
  33. package/cjs/core/ComboBox/ComboBoxMenuItem.js +21 -73
  34. package/cjs/core/ComboBox/ComboBoxMultipleContainer.js +7 -13
  35. package/cjs/core/ComboBox/helpers.js +43 -47
  36. package/cjs/core/DatePicker/DatePicker.js +333 -569
  37. package/cjs/core/Dialog/Dialog.js +36 -65
  38. package/cjs/core/Dialog/DialogBackdrop.js +27 -47
  39. package/cjs/core/Dialog/DialogButtonBar.js +3 -3
  40. package/cjs/core/Dialog/DialogContent.js +18 -26
  41. package/cjs/core/Dialog/DialogContext.js +5 -5
  42. package/cjs/core/Dialog/DialogDragContext.js +8 -8
  43. package/cjs/core/Dialog/DialogMain.js +137 -183
  44. package/cjs/core/Dialog/DialogTitleBar.js +20 -67
  45. package/cjs/core/Dialog/DialogTitleBarTitle.js +3 -3
  46. package/cjs/core/Divider/Divider.js +8 -14
  47. package/cjs/core/DropdownMenu/DropdownMenu.js +46 -80
  48. package/cjs/core/ExpandableBlock/ExpandableBlock.js +101 -206
  49. package/cjs/core/Fieldset/Fieldset.js +14 -25
  50. package/cjs/core/FileUpload/FileEmptyCard.js +17 -43
  51. package/cjs/core/FileUpload/FileUpload.js +42 -88
  52. package/cjs/core/FileUpload/FileUploadCard.js +84 -169
  53. package/cjs/core/FileUpload/FileUploadTemplate.js +16 -51
  54. package/cjs/core/Flex/Flex.js +77 -93
  55. package/cjs/core/Footer/Footer.js +64 -103
  56. package/cjs/core/Footer/FooterItem.js +3 -3
  57. package/cjs/core/Footer/FooterList.js +3 -3
  58. package/cjs/core/Footer/FooterSeparator.js +5 -8
  59. package/cjs/core/Header/Header.js +22 -67
  60. package/cjs/core/Header/HeaderBasicButton.js +13 -24
  61. package/cjs/core/Header/HeaderBreadcrumbs.js +14 -38
  62. package/cjs/core/Header/HeaderButton.js +22 -76
  63. package/cjs/core/Header/HeaderDropdownButton.js +20 -48
  64. package/cjs/core/Header/HeaderLogo.js +11 -42
  65. package/cjs/core/Header/HeaderSplitButton.js +21 -66
  66. package/cjs/core/Icon/Icon.js +18 -32
  67. package/cjs/core/InformationPanel/InformationPanel.js +42 -77
  68. package/cjs/core/InformationPanel/InformationPanelBody.js +4 -6
  69. package/cjs/core/InformationPanel/InformationPanelContent.js +8 -20
  70. package/cjs/core/InformationPanel/InformationPanelHeader.js +14 -34
  71. package/cjs/core/InformationPanel/InformationPanelWrapper.js +4 -6
  72. package/cjs/core/Input/Input.js +10 -18
  73. package/cjs/core/InputGrid/InputGrid.js +8 -17
  74. package/cjs/core/InputGroup/InputGroup.js +25 -72
  75. package/cjs/core/InputWithDecorations/InputWithDecorations.js +23 -51
  76. package/cjs/core/Label/Label.js +11 -32
  77. package/cjs/core/LabeledInput/LabeledInput.js +20 -70
  78. package/cjs/core/LabeledSelect/LabeledSelect.js +28 -77
  79. package/cjs/core/LabeledTextarea/LabeledTextarea.js +7 -13
  80. package/cjs/core/LinkAction/LinkAction.js +3 -3
  81. package/cjs/core/List/List.js +3 -3
  82. package/cjs/core/List/ListItem.js +35 -55
  83. package/cjs/core/Menu/Menu.js +53 -66
  84. package/cjs/core/Menu/MenuDivider.js +4 -4
  85. package/cjs/core/Menu/MenuExtraContent.js +4 -4
  86. package/cjs/core/Menu/MenuItem.js +92 -168
  87. package/cjs/core/Menu/MenuItemSkeleton.js +19 -54
  88. package/cjs/core/Modal/Modal.js +11 -38
  89. package/cjs/core/Modal/ModalButtonBar.js +4 -7
  90. package/cjs/core/Modal/ModalContent.js +3 -3
  91. package/cjs/core/NonIdealState/ErrorPage.js +131 -187
  92. package/cjs/core/NonIdealState/NonIdealState.js +12 -77
  93. package/cjs/core/NotificationMarker/NotificationMarker.js +8 -29
  94. package/cjs/core/Overlay/Overlay.d.ts +20 -24
  95. package/cjs/core/Overlay/Overlay.js +50 -64
  96. package/cjs/core/Popover/Popover.js +87 -157
  97. package/cjs/core/ProgressIndicators/ProgressLinear.js +11 -49
  98. package/cjs/core/ProgressIndicators/ProgressRadial.js +19 -51
  99. package/cjs/core/Radio/Radio.js +12 -54
  100. package/cjs/core/RadioTiles/RadioTile.js +14 -80
  101. package/cjs/core/RadioTiles/RadioTileGroup.js +9 -16
  102. package/cjs/core/SearchBox/SearchBox.js +104 -221
  103. package/cjs/core/Select/Select.js +141 -276
  104. package/cjs/core/Select/SelectTag.js +9 -21
  105. package/cjs/core/Select/SelectTagContainer.js +14 -30
  106. package/cjs/core/SideNavigation/SideNavigation.js +29 -138
  107. package/cjs/core/SideNavigation/SidenavButton.js +8 -30
  108. package/cjs/core/SideNavigation/SidenavSubmenu.js +9 -23
  109. package/cjs/core/SideNavigation/SidenavSubmenuHeader.js +10 -29
  110. package/cjs/core/SkipToContentLink/SkipToContentLink.js +8 -20
  111. package/cjs/core/Slider/Slider.js +195 -376
  112. package/cjs/core/Slider/Thumb.js +57 -108
  113. package/cjs/core/Slider/Track.js +55 -83
  114. package/cjs/core/StatusMessage/StatusMessage.js +12 -34
  115. package/cjs/core/Stepper/Stepper.js +21 -80
  116. package/cjs/core/Stepper/StepperStep.js +36 -109
  117. package/cjs/core/Stepper/WorkflowDiagram.js +15 -38
  118. package/cjs/core/Stepper/WorkflowDiagramStep.js +11 -39
  119. package/cjs/core/Surface/Surface.js +54 -94
  120. package/cjs/core/Table/SubRowExpander.js +15 -37
  121. package/cjs/core/Table/Table.js +419 -763
  122. package/cjs/core/Table/TableCell.js +63 -113
  123. package/cjs/core/Table/TablePaginator.js +136 -312
  124. package/cjs/core/Table/TableRowMemoized.js +64 -137
  125. package/cjs/core/Table/actionHandlers/expandHandler.js +12 -12
  126. package/cjs/core/Table/actionHandlers/filterHandler.js +17 -25
  127. package/cjs/core/Table/actionHandlers/index.js +14 -56
  128. package/cjs/core/Table/actionHandlers/resizeHandler.js +13 -13
  129. package/cjs/core/Table/actionHandlers/selectHandler.js +98 -128
  130. package/cjs/core/Table/cells/DefaultCell.js +13 -48
  131. package/cjs/core/Table/cells/EditableCell.js +46 -75
  132. package/cjs/core/Table/cells/index.js +6 -16
  133. package/cjs/core/Table/columns/actionColumn.js +67 -97
  134. package/cjs/core/Table/columns/expanderColumn.js +32 -46
  135. package/cjs/core/Table/columns/index.js +11 -41
  136. package/cjs/core/Table/columns/selectionColumn.js +29 -57
  137. package/cjs/core/Table/filters/BaseFilter.js +13 -24
  138. package/cjs/core/Table/filters/DateRangeFilter/DatePickerInput.js +52 -120
  139. package/cjs/core/Table/filters/DateRangeFilter/DateRangeFilter.js +60 -120
  140. package/cjs/core/Table/filters/FilterButtonBar.js +16 -39
  141. package/cjs/core/Table/filters/FilterToggle.js +26 -62
  142. package/cjs/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js +36 -58
  143. package/cjs/core/Table/filters/TextFilter/TextFilter.js +28 -40
  144. package/cjs/core/Table/filters/customFilterFunctions.js +14 -16
  145. package/cjs/core/Table/filters/defaultFilterFunctions.js +81 -86
  146. package/cjs/core/Table/filters/index.js +11 -35
  147. package/cjs/core/Table/filters/tableFilters.js +32 -44
  148. package/cjs/core/Table/filters/types.js +2 -2
  149. package/cjs/core/Table/hooks/index.js +19 -67
  150. package/cjs/core/Table/hooks/useColumnDragAndDrop.js +86 -101
  151. package/cjs/core/Table/hooks/useExpanderCell.js +25 -33
  152. package/cjs/core/Table/hooks/useResizeColumns.js +290 -362
  153. package/cjs/core/Table/hooks/useScrollToRow.js +38 -46
  154. package/cjs/core/Table/hooks/useSelectionCell.js +10 -17
  155. package/cjs/core/Table/hooks/useStickyColumns.js +62 -64
  156. package/cjs/core/Table/hooks/useSubRowFiltering.js +88 -95
  157. package/cjs/core/Table/hooks/useSubRowSelection.js +31 -32
  158. package/cjs/core/Table/index.js +18 -78
  159. package/cjs/core/Table/utils.js +40 -42
  160. package/cjs/core/Tabs/Tabs.js +232 -417
  161. package/cjs/core/Tag/Tag.js +15 -42
  162. package/cjs/core/Tag/TagContainer.js +11 -23
  163. package/cjs/core/Textarea/Textarea.js +6 -11
  164. package/cjs/core/ThemeProvider/ThemeContext.js +4 -4
  165. package/cjs/core/ThemeProvider/ThemeProvider.js +52 -105
  166. package/cjs/core/Tile/Tile.js +230 -410
  167. package/cjs/core/TimePicker/TimePicker.js +234 -458
  168. package/cjs/core/Toast/Toast.js +107 -204
  169. package/cjs/core/Toast/Toaster.js +77 -102
  170. package/cjs/core/ToggleSwitch/ToggleSwitch.js +23 -66
  171. package/cjs/core/Tooltip/Tooltip.js +91 -137
  172. package/cjs/core/TransferList/TransferList.js +103 -177
  173. package/cjs/core/Tree/Tree.js +129 -204
  174. package/cjs/core/Tree/TreeContext.js +9 -9
  175. package/cjs/core/Tree/TreeNode.js +104 -207
  176. package/cjs/core/Tree/TreeNodeExpander.js +12 -26
  177. package/cjs/core/Typography/Anchor.js +3 -3
  178. package/cjs/core/Typography/Blockquote.js +10 -18
  179. package/cjs/core/Typography/Code.js +3 -3
  180. package/cjs/core/Typography/Kbd.js +21 -30
  181. package/cjs/core/Typography/Text.js +13 -26
  182. package/cjs/core/VisuallyHidden/VisuallyHidden.js +8 -14
  183. package/cjs/core/utils/color/ColorValue.js +453 -535
  184. package/cjs/core/utils/color/index.js +4 -4
  185. package/cjs/core/utils/components/AutoclearingHiddenLiveRegion.js +13 -20
  186. package/cjs/core/utils/components/Box.js +3 -3
  187. package/cjs/core/utils/components/ButtonBase.js +20 -38
  188. package/cjs/core/utils/components/FocusTrap.js +38 -47
  189. package/cjs/core/utils/components/InputContainer.js +19 -58
  190. package/cjs/core/utils/components/InputFlexContainer.js +8 -24
  191. package/cjs/core/utils/components/MiddleTextTruncation.js +22 -32
  192. package/cjs/core/utils/components/Portal.js +20 -22
  193. package/cjs/core/utils/components/Resizer.js +196 -253
  194. package/cjs/core/utils/components/VirtualScroll.js +223 -304
  195. package/cjs/core/utils/components/WithCSSTransition.js +32 -49
  196. package/cjs/core/utils/components/index.js +14 -14
  197. package/cjs/core/utils/functions/colors.js +22 -25
  198. package/cjs/core/utils/functions/date.js +10 -10
  199. package/cjs/core/utils/functions/dev.js +14 -13
  200. package/cjs/core/utils/functions/dom.d.ts +2 -1
  201. package/cjs/core/utils/functions/dom.js +22 -25
  202. package/cjs/core/utils/functions/focusable.js +17 -26
  203. package/cjs/core/utils/functions/import.js +23 -46
  204. package/cjs/core/utils/functions/index.js +13 -13
  205. package/cjs/core/utils/functions/numbers.d.ts +7 -0
  206. package/cjs/core/utils/functions/numbers.js +21 -10
  207. package/cjs/core/utils/functions/polymorphic.js +30 -43
  208. package/cjs/core/utils/functions/react.js +24 -26
  209. package/cjs/core/utils/functions/supports.js +4 -5
  210. package/cjs/core/utils/hooks/index.js +17 -17
  211. package/cjs/core/utils/hooks/useContainerWidth.js +19 -26
  212. package/cjs/core/utils/hooks/useControlledState.js +12 -21
  213. package/cjs/core/utils/hooks/useDragAndDrop.js +87 -110
  214. package/cjs/core/utils/hooks/useEventListener.js +22 -22
  215. package/cjs/core/utils/hooks/useGlobals.js +27 -33
  216. package/cjs/core/utils/hooks/useId.js +8 -10
  217. package/cjs/core/utils/hooks/useIntersection.js +24 -30
  218. package/cjs/core/utils/hooks/useIsClient.js +9 -9
  219. package/cjs/core/utils/hooks/useIsomorphicLayoutEffect.js +5 -6
  220. package/cjs/core/utils/hooks/useLatestRef.js +9 -9
  221. package/cjs/core/utils/hooks/useMediaQuery.js +31 -31
  222. package/cjs/core/utils/hooks/useMergedRefs.js +16 -15
  223. package/cjs/core/utils/hooks/useOverflow.js +57 -70
  224. package/cjs/core/utils/hooks/useResizeObserver.js +17 -22
  225. package/cjs/core/utils/hooks/useSafeContext.js +9 -9
  226. package/cjs/core/utils/icons/StatusIconMap.js +12 -28
  227. package/cjs/core/utils/icons/Svg.js +3 -3
  228. package/cjs/core/utils/icons/SvgCalendar.js +7 -12
  229. package/cjs/core/utils/icons/SvgCaretDownSmall.js +7 -12
  230. package/cjs/core/utils/icons/SvgCaretRightSmall.js +7 -12
  231. package/cjs/core/utils/icons/SvgCaretUpSmall.js +7 -12
  232. package/cjs/core/utils/icons/SvgCheckmark.js +7 -10
  233. package/cjs/core/utils/icons/SvgCheckmarkSmall.js +7 -12
  234. package/cjs/core/utils/icons/SvgChevronLeft.js +7 -12
  235. package/cjs/core/utils/icons/SvgChevronLeftDouble.js +7 -12
  236. package/cjs/core/utils/icons/SvgChevronRight.js +7 -12
  237. package/cjs/core/utils/icons/SvgChevronRightDouble.js +7 -12
  238. package/cjs/core/utils/icons/SvgClose.js +7 -12
  239. package/cjs/core/utils/icons/SvgCloseSmall.js +7 -12
  240. package/cjs/core/utils/icons/SvgColumnManager.js +7 -12
  241. package/cjs/core/utils/icons/SvgDocument.js +7 -10
  242. package/cjs/core/utils/icons/SvgFilter.js +7 -10
  243. package/cjs/core/utils/icons/SvgFilterHollow.js +7 -12
  244. package/cjs/core/utils/icons/SvgImportantSmall.js +7 -12
  245. package/cjs/core/utils/icons/SvgInfoCircular.js +7 -12
  246. package/cjs/core/utils/icons/SvgMore.js +7 -12
  247. package/cjs/core/utils/icons/SvgMoreVertical.js +7 -12
  248. package/cjs/core/utils/icons/SvgNew.js +7 -12
  249. package/cjs/core/utils/icons/SvgSearch.js +7 -12
  250. package/cjs/core/utils/icons/SvgSmileyHappy.js +7 -12
  251. package/cjs/core/utils/icons/SvgSortDown.js +7 -12
  252. package/cjs/core/utils/icons/SvgSortUp.js +7 -12
  253. package/cjs/core/utils/icons/SvgStatusError.js +7 -12
  254. package/cjs/core/utils/icons/SvgStatusSuccess.js +7 -12
  255. package/cjs/core/utils/icons/SvgStatusWarning.js +7 -12
  256. package/cjs/core/utils/icons/SvgSwap.js +7 -12
  257. package/cjs/core/utils/icons/SvgUpload.js +7 -12
  258. package/cjs/core/utils/icons/index.js +34 -34
  259. package/cjs/core/utils/index.js +10 -10
  260. package/cjs/core/utils/props.js +2 -2
  261. package/cjs/core/utils/types.js +2 -2
  262. package/cjs/index.js +229 -949
  263. package/cjs/react-table/react-table.js +2 -2
  264. package/cjs/styles.js +412 -425
  265. package/esm/core/Alert/Alert.js +39 -106
  266. package/esm/core/Avatar/Avatar.js +14 -42
  267. package/esm/core/AvatarGroup/AvatarGroup.js +20 -58
  268. package/esm/core/Backdrop/Backdrop.js +2 -10
  269. package/esm/core/Badge/Badge.js +16 -31
  270. package/esm/core/Breadcrumbs/Breadcrumbs.js +55 -135
  271. package/esm/core/ButtonGroup/ButtonGroup.js +25 -61
  272. package/esm/core/Buttons/Button.js +5 -45
  273. package/esm/core/Buttons/DropdownButton.js +7 -37
  274. package/esm/core/Buttons/IconButton.js +5 -40
  275. package/esm/core/Buttons/IdeasButton.js +2 -12
  276. package/esm/core/Buttons/SplitButton.js +34 -101
  277. package/esm/core/Carousel/Carousel.js +43 -72
  278. package/esm/core/Carousel/CarouselDot.js +6 -17
  279. package/esm/core/Carousel/CarouselDotsList.js +85 -147
  280. package/esm/core/Carousel/CarouselNavigation.js +32 -68
  281. package/esm/core/Carousel/CarouselSlide.js +19 -41
  282. package/esm/core/Carousel/CarouselSlider.js +41 -65
  283. package/esm/core/Checkbox/Checkbox.js +25 -78
  284. package/esm/core/ColorPicker/ColorBuilder.js +167 -280
  285. package/esm/core/ColorPicker/ColorInputPanel.js +237 -395
  286. package/esm/core/ColorPicker/ColorPalette.js +14 -35
  287. package/esm/core/ColorPicker/ColorPicker.js +46 -79
  288. package/esm/core/ColorPicker/ColorPickerContext.js +5 -7
  289. package/esm/core/ColorPicker/ColorSwatch.js +7 -24
  290. package/esm/core/ComboBox/ComboBox.js +267 -396
  291. package/esm/core/ComboBox/ComboBoxEndIcon.js +5 -18
  292. package/esm/core/ComboBox/ComboBoxInput.js +125 -197
  293. package/esm/core/ComboBox/ComboBoxInputContainer.js +5 -20
  294. package/esm/core/ComboBox/ComboBoxMenu.js +37 -77
  295. package/esm/core/ComboBox/ComboBoxMenuItem.js +14 -61
  296. package/esm/core/ComboBox/ComboBoxMultipleContainer.js +2 -6
  297. package/esm/core/ComboBox/helpers.js +38 -38
  298. package/esm/core/DatePicker/DatePicker.js +326 -555
  299. package/esm/core/Dialog/Dialog.js +24 -53
  300. package/esm/core/Dialog/DialogBackdrop.js +19 -39
  301. package/esm/core/Dialog/DialogContent.js +12 -20
  302. package/esm/core/Dialog/DialogContext.js +1 -1
  303. package/esm/core/Dialog/DialogDragContext.js +4 -4
  304. package/esm/core/Dialog/DialogMain.js +128 -177
  305. package/esm/core/Dialog/DialogTitleBar.js +10 -45
  306. package/esm/core/Divider/Divider.js +2 -8
  307. package/esm/core/DropdownMenu/DropdownMenu.js +40 -75
  308. package/esm/core/ExpandableBlock/ExpandableBlock.js +92 -193
  309. package/esm/core/Fieldset/Fieldset.js +8 -19
  310. package/esm/core/FileUpload/FileEmptyCard.js +8 -19
  311. package/esm/core/FileUpload/FileUpload.js +36 -72
  312. package/esm/core/FileUpload/FileUploadCard.js +76 -153
  313. package/esm/core/FileUpload/FileUploadTemplate.js +9 -37
  314. package/esm/core/Flex/Flex.js +71 -87
  315. package/esm/core/Footer/Footer.js +55 -86
  316. package/esm/core/Footer/FooterSeparator.js +1 -1
  317. package/esm/core/Header/Header.js +14 -55
  318. package/esm/core/Header/HeaderBasicButton.js +7 -15
  319. package/esm/core/Header/HeaderBreadcrumbs.js +8 -32
  320. package/esm/core/Header/HeaderButton.js +14 -62
  321. package/esm/core/Header/HeaderDropdownButton.js +13 -42
  322. package/esm/core/Header/HeaderLogo.js +5 -36
  323. package/esm/core/Header/HeaderSplitButton.js +14 -61
  324. package/esm/core/Icon/Icon.js +12 -26
  325. package/esm/core/InformationPanel/InformationPanel.js +36 -71
  326. package/esm/core/InformationPanel/InformationPanelContent.js +3 -17
  327. package/esm/core/InformationPanel/InformationPanelHeader.js +8 -32
  328. package/esm/core/InformationPanel/InformationPanelWrapper.js +1 -3
  329. package/esm/core/Input/Input.js +4 -12
  330. package/esm/core/InputGrid/InputGrid.js +2 -11
  331. package/esm/core/InputGroup/InputGroup.js +16 -57
  332. package/esm/core/InputWithDecorations/InputWithDecorations.js +11 -42
  333. package/esm/core/Label/Label.js +5 -26
  334. package/esm/core/LabeledInput/LabeledInput.js +10 -63
  335. package/esm/core/LabeledSelect/LabeledSelect.js +18 -67
  336. package/esm/core/LabeledTextarea/LabeledTextarea.js +2 -8
  337. package/esm/core/List/ListItem.js +28 -46
  338. package/esm/core/Menu/Menu.js +48 -64
  339. package/esm/core/Menu/MenuDivider.js +1 -1
  340. package/esm/core/Menu/MenuExtraContent.js +1 -1
  341. package/esm/core/Menu/MenuItem.js +84 -164
  342. package/esm/core/Menu/MenuItemSkeleton.js +12 -43
  343. package/esm/core/Modal/Modal.js +6 -33
  344. package/esm/core/NonIdealState/ErrorPage.js +123 -173
  345. package/esm/core/NonIdealState/NonIdealState.js +6 -65
  346. package/esm/core/NotificationMarker/NotificationMarker.js +2 -20
  347. package/esm/core/Overlay/Overlay.d.ts +20 -24
  348. package/esm/core/Overlay/Overlay.js +45 -55
  349. package/esm/core/Popover/Popover.js +80 -172
  350. package/esm/core/ProgressIndicators/ProgressLinear.js +5 -40
  351. package/esm/core/ProgressIndicators/ProgressRadial.js +14 -40
  352. package/esm/core/Radio/Radio.js +6 -45
  353. package/esm/core/RadioTiles/RadioTile.js +8 -62
  354. package/esm/core/RadioTiles/RadioTileGroup.js +3 -10
  355. package/esm/core/SearchBox/SearchBox.js +97 -214
  356. package/esm/core/Select/Select.js +130 -265
  357. package/esm/core/Select/SelectTag.js +3 -15
  358. package/esm/core/Select/SelectTagContainer.js +7 -20
  359. package/esm/core/SideNavigation/SideNavigation.js +21 -118
  360. package/esm/core/SideNavigation/SidenavButton.js +2 -24
  361. package/esm/core/SideNavigation/SidenavSubmenu.js +3 -14
  362. package/esm/core/SideNavigation/SidenavSubmenuHeader.js +4 -20
  363. package/esm/core/SkipToContentLink/SkipToContentLink.js +2 -11
  364. package/esm/core/Slider/Slider.js +187 -340
  365. package/esm/core/Slider/Thumb.js +50 -97
  366. package/esm/core/Slider/Track.js +49 -74
  367. package/esm/core/StatusMessage/StatusMessage.js +5 -23
  368. package/esm/core/Stepper/Stepper.js +14 -70
  369. package/esm/core/Stepper/StepperStep.js +29 -92
  370. package/esm/core/Stepper/WorkflowDiagram.js +8 -21
  371. package/esm/core/Stepper/WorkflowDiagramStep.js +4 -22
  372. package/esm/core/Surface/Surface.js +48 -84
  373. package/esm/core/Table/SubRowExpander.js +9 -31
  374. package/esm/core/Table/Table.js +408 -763
  375. package/esm/core/Table/TableCell.js +53 -87
  376. package/esm/core/Table/TablePaginator.js +125 -306
  377. package/esm/core/Table/TableRowMemoized.js +58 -129
  378. package/esm/core/Table/actionHandlers/expandHandler.js +10 -10
  379. package/esm/core/Table/actionHandlers/filterHandler.js +15 -23
  380. package/esm/core/Table/actionHandlers/index.js +1 -5
  381. package/esm/core/Table/actionHandlers/resizeHandler.js +11 -11
  382. package/esm/core/Table/actionHandlers/selectHandler.js +95 -122
  383. package/esm/core/Table/cells/DefaultCell.js +7 -42
  384. package/esm/core/Table/cells/EditableCell.js +41 -70
  385. package/esm/core/Table/columns/actionColumn.js +55 -85
  386. package/esm/core/Table/columns/expanderColumn.js +25 -39
  387. package/esm/core/Table/columns/selectionColumn.js +23 -51
  388. package/esm/core/Table/filters/BaseFilter.js +7 -15
  389. package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.js +42 -107
  390. package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.js +52 -110
  391. package/esm/core/Table/filters/FilterButtonBar.js +9 -28
  392. package/esm/core/Table/filters/FilterToggle.js +18 -51
  393. package/esm/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js +28 -50
  394. package/esm/core/Table/filters/TextFilter/TextFilter.js +20 -32
  395. package/esm/core/Table/filters/customFilterFunctions.js +12 -14
  396. package/esm/core/Table/filters/defaultFilterFunctions.js +79 -84
  397. package/esm/core/Table/filters/tableFilters.js +25 -34
  398. package/esm/core/Table/hooks/useColumnDragAndDrop.js +81 -88
  399. package/esm/core/Table/hooks/useExpanderCell.js +20 -26
  400. package/esm/core/Table/hooks/useResizeColumns.js +287 -353
  401. package/esm/core/Table/hooks/useScrollToRow.js +34 -42
  402. package/esm/core/Table/hooks/useSelectionCell.js +6 -10
  403. package/esm/core/Table/hooks/useStickyColumns.js +59 -61
  404. package/esm/core/Table/hooks/useSubRowFiltering.js +83 -90
  405. package/esm/core/Table/hooks/useSubRowSelection.js +27 -28
  406. package/esm/core/Table/index.js +1 -5
  407. package/esm/core/Table/utils.js +38 -40
  408. package/esm/core/Tabs/Tabs.js +226 -401
  409. package/esm/core/Tag/Tag.js +8 -35
  410. package/esm/core/Tag/TagContainer.js +5 -17
  411. package/esm/core/Textarea/Textarea.js +1 -6
  412. package/esm/core/ThemeProvider/ThemeProvider.js +44 -101
  413. package/esm/core/Tile/Tile.js +218 -386
  414. package/esm/core/TimePicker/TimePicker.js +228 -448
  415. package/esm/core/Toast/Toast.js +99 -193
  416. package/esm/core/Toast/Toaster.js +69 -82
  417. package/esm/core/ToggleSwitch/ToggleSwitch.js +17 -60
  418. package/esm/core/Tooltip/Tooltip.js +86 -151
  419. package/esm/core/TransferList/TransferList.js +93 -157
  420. package/esm/core/Tree/Tree.js +122 -196
  421. package/esm/core/Tree/TreeContext.js +5 -5
  422. package/esm/core/Tree/TreeNode.js +96 -195
  423. package/esm/core/Tree/TreeNodeExpander.js +5 -16
  424. package/esm/core/Typography/Blockquote.js +4 -12
  425. package/esm/core/Typography/Kbd.js +15 -24
  426. package/esm/core/Typography/Text.js +7 -20
  427. package/esm/core/VisuallyHidden/VisuallyHidden.js +2 -8
  428. package/esm/core/utils/color/ColorValue.js +449 -524
  429. package/esm/core/utils/components/AutoclearingHiddenLiveRegion.js +7 -11
  430. package/esm/core/utils/components/ButtonBase.js +13 -31
  431. package/esm/core/utils/components/FocusTrap.js +32 -41
  432. package/esm/core/utils/components/InputContainer.js +11 -50
  433. package/esm/core/utils/components/InputFlexContainer.js +2 -15
  434. package/esm/core/utils/components/MiddleTextTruncation.js +17 -27
  435. package/esm/core/utils/components/Portal.js +12 -12
  436. package/esm/core/utils/components/Resizer.js +192 -250
  437. package/esm/core/utils/components/VirtualScroll.js +218 -297
  438. package/esm/core/utils/components/WithCSSTransition.js +26 -43
  439. package/esm/core/utils/functions/colors.js +19 -19
  440. package/esm/core/utils/functions/date.js +8 -8
  441. package/esm/core/utils/functions/dev.js +12 -11
  442. package/esm/core/utils/functions/dom.d.ts +2 -1
  443. package/esm/core/utils/functions/dom.js +18 -18
  444. package/esm/core/utils/functions/focusable.js +15 -24
  445. package/esm/core/utils/functions/import.js +2 -4
  446. package/esm/core/utils/functions/numbers.d.ts +7 -0
  447. package/esm/core/utils/functions/numbers.js +17 -7
  448. package/esm/core/utils/functions/polymorphic.js +23 -32
  449. package/esm/core/utils/functions/react.js +19 -21
  450. package/esm/core/utils/functions/supports.js +1 -2
  451. package/esm/core/utils/hooks/useContainerWidth.js +13 -16
  452. package/esm/core/utils/hooks/useControlledState.js +8 -17
  453. package/esm/core/utils/hooks/useDragAndDrop.js +81 -100
  454. package/esm/core/utils/hooks/useEventListener.js +18 -18
  455. package/esm/core/utils/hooks/useGlobals.js +21 -27
  456. package/esm/core/utils/hooks/useId.js +3 -4
  457. package/esm/core/utils/hooks/useIntersection.js +19 -25
  458. package/esm/core/utils/hooks/useIsClient.js +5 -5
  459. package/esm/core/utils/hooks/useIsomorphicLayoutEffect.js +1 -2
  460. package/esm/core/utils/hooks/useLatestRef.js +5 -5
  461. package/esm/core/utils/hooks/useMediaQuery.js +25 -23
  462. package/esm/core/utils/hooks/useMergedRefs.js +12 -11
  463. package/esm/core/utils/hooks/useOverflow.js +51 -63
  464. package/esm/core/utils/hooks/useResizeObserver.js +12 -17
  465. package/esm/core/utils/hooks/useSafeContext.js +5 -5
  466. package/esm/core/utils/icons/StatusIconMap.js +4 -8
  467. package/esm/core/utils/icons/SvgCalendar.js +2 -7
  468. package/esm/core/utils/icons/SvgCaretDownSmall.js +2 -7
  469. package/esm/core/utils/icons/SvgCaretRightSmall.js +2 -7
  470. package/esm/core/utils/icons/SvgCaretUpSmall.js +2 -7
  471. package/esm/core/utils/icons/SvgCheckmark.js +2 -5
  472. package/esm/core/utils/icons/SvgCheckmarkSmall.js +2 -7
  473. package/esm/core/utils/icons/SvgChevronLeft.js +2 -7
  474. package/esm/core/utils/icons/SvgChevronLeftDouble.js +2 -7
  475. package/esm/core/utils/icons/SvgChevronRight.js +2 -7
  476. package/esm/core/utils/icons/SvgChevronRightDouble.js +2 -7
  477. package/esm/core/utils/icons/SvgClose.js +2 -7
  478. package/esm/core/utils/icons/SvgCloseSmall.js +2 -7
  479. package/esm/core/utils/icons/SvgColumnManager.js +2 -7
  480. package/esm/core/utils/icons/SvgDocument.js +2 -5
  481. package/esm/core/utils/icons/SvgFilter.js +2 -5
  482. package/esm/core/utils/icons/SvgFilterHollow.js +2 -7
  483. package/esm/core/utils/icons/SvgImportantSmall.js +2 -7
  484. package/esm/core/utils/icons/SvgInfoCircular.js +2 -7
  485. package/esm/core/utils/icons/SvgMore.js +2 -7
  486. package/esm/core/utils/icons/SvgMoreVertical.js +2 -7
  487. package/esm/core/utils/icons/SvgNew.js +2 -7
  488. package/esm/core/utils/icons/SvgSearch.js +2 -7
  489. package/esm/core/utils/icons/SvgSmileyHappy.js +2 -7
  490. package/esm/core/utils/icons/SvgSortDown.js +2 -7
  491. package/esm/core/utils/icons/SvgSortUp.js +2 -7
  492. package/esm/core/utils/icons/SvgStatusError.js +2 -7
  493. package/esm/core/utils/icons/SvgStatusSuccess.js +2 -7
  494. package/esm/core/utils/icons/SvgStatusWarning.js +2 -7
  495. package/esm/core/utils/icons/SvgSwap.js +2 -7
  496. package/esm/core/utils/icons/SvgUpload.js +2 -7
  497. package/esm/index.js +3 -21
  498. package/esm/styles.js +414 -425
  499. package/package.json +2 -2
  500. package/styles.css +6 -6
@@ -1,13 +1,13 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useIntersection = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const dom_js_1 = require('../functions/dom.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const dom_js_1 = require("../functions/dom.js");
11
11
  /**
12
12
  * Hook that uses `IntersectionObserver` to trigger `onIntersect` callback when element is in viewport.
13
13
  * Callback is called only once by default (can be changed using the `once` parameter).
@@ -21,31 +21,25 @@ const dom_js_1 = require('../functions/dom.js');
21
21
  * return (<div ref={ref}>One of many elements</div>);
22
22
  */
23
23
  const useIntersection = (onIntersect, options = {}, once = true) => {
24
- const { root, rootMargin, threshold } = options;
25
- const cleanupRef = React.useRef(() => {});
26
- const setRef = React.useCallback(
27
- (node) => {
28
- cleanupRef.current?.();
29
- cleanupRef.current = () => {}; // ensure it doesn't try to clean up again
30
- if (!node || !(0, dom_js_1.getWindow)()?.IntersectionObserver) {
31
- return;
32
- }
33
- const observer = new IntersectionObserver(
34
- ([entry], obs) => {
35
- if (entry.isIntersecting) {
36
- if (once) {
37
- obs.disconnect();
24
+ const { root, rootMargin, threshold } = options;
25
+ const cleanupRef = React.useRef(() => { });
26
+ const setRef = React.useCallback((node) => {
27
+ cleanupRef.current?.();
28
+ cleanupRef.current = () => { }; // ensure it doesn't try to clean up again
29
+ if (!node || !(0, dom_js_1.getWindow)()?.IntersectionObserver) {
30
+ return;
31
+ }
32
+ const observer = new IntersectionObserver(([entry], obs) => {
33
+ if (entry.isIntersecting) {
34
+ if (once) {
35
+ obs.disconnect();
36
+ }
37
+ onIntersect();
38
38
  }
39
- onIntersect();
40
- }
41
- },
42
- { root, rootMargin, threshold },
43
- );
44
- observer.observe(node);
45
- cleanupRef.current = () => observer.disconnect();
46
- },
47
- [onIntersect, once, root, rootMargin, threshold],
48
- );
49
- return setRef;
39
+ }, { root, rootMargin, threshold });
40
+ observer.observe(node);
41
+ cleanupRef.current = () => observer.disconnect();
42
+ }, [onIntersect, once, root, rootMargin, threshold]);
43
+ return setRef;
50
44
  };
51
45
  exports.useIntersection = useIntersection;
@@ -1,17 +1,17 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useIsClient = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
9
+ const React = tslib_1.__importStar(require("react"));
10
10
  const useIsClient = () => {
11
- const [isClient, setIsClient] = React.useState(false);
12
- React.useEffect(() => {
13
- setIsClient(true);
14
- }, []);
15
- return isClient;
11
+ const [isClient, setIsClient] = React.useState(false);
12
+ React.useEffect(() => {
13
+ setIsClient(true);
14
+ }, []);
15
+ return isClient;
16
16
  };
17
17
  exports.useIsClient = useIsClient;
@@ -1,16 +1,15 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useIsomorphicLayoutEffect = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
9
+ const React = tslib_1.__importStar(require("react"));
10
10
  /**
11
11
  * SSR-safe version of `useLayoutEffect` that replaces it with `useEffect` on the server.
12
12
  *
13
13
  * @see https://fb.me/react-uselayouteffect-ssr
14
14
  */
15
- exports.useIsomorphicLayoutEffect =
16
- typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
15
+ exports.useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
@@ -1,12 +1,12 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useLatestRef = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
9
+ const React = tslib_1.__importStar(require("react"));
10
10
  /**
11
11
  * Hook that keeps track of the latest value in a ref.
12
12
  * @private
@@ -15,10 +15,10 @@ const React = tslib_1.__importStar(require('react'));
15
15
  * const valueRef = useLatestRef(value);
16
16
  */
17
17
  const useLatestRef = (value) => {
18
- const valueRef = React.useRef(value);
19
- React.useEffect(() => {
20
- valueRef.current = value;
21
- }, [value]);
22
- return valueRef;
18
+ const valueRef = React.useRef(value);
19
+ React.useEffect(() => {
20
+ valueRef.current = value;
21
+ }, [value]);
22
+ return valueRef;
23
23
  };
24
24
  exports.useLatestRef = useLatestRef;
@@ -1,40 +1,40 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useMediaQuery = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const index_js_1 = require('../functions/index.js');
11
- const useIsomorphicLayoutEffect_js_1 = require('./useIsomorphicLayoutEffect.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const index_js_1 = require("../functions/index.js");
11
+ const useIsomorphicLayoutEffect_js_1 = require("./useIsomorphicLayoutEffect.js");
12
12
  const useMediaQuery = (queryString) => {
13
- const [matches, setMatches] = React.useState();
14
- (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
15
- const mediaQueryList = (0, index_js_1.getWindow)()?.matchMedia?.(
16
- queryString,
17
- );
18
- const handleChange = ({ matches }) => setMatches(matches);
19
- if (mediaQueryList != undefined) {
20
- setMatches(mediaQueryList.matches);
21
- try {
22
- mediaQueryList.addEventListener('change', handleChange);
23
- } catch {
24
- // Safari 13 fallback
25
- mediaQueryList.addListener?.(handleChange);
26
- }
27
- }
28
- return () => {
29
- try {
30
- mediaQueryList?.removeEventListener('change', handleChange);
31
- } catch {
32
- // Safari 13 fallback
33
- mediaQueryList?.removeListener?.(handleChange);
34
- }
35
- };
36
- }, [queryString]);
37
- return !!matches;
13
+ const [matches, setMatches] = React.useState();
14
+ (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
15
+ const mediaQueryList = (0, index_js_1.getWindow)()?.matchMedia?.(queryString);
16
+ const handleChange = ({ matches }) => setMatches(matches);
17
+ if (mediaQueryList != undefined) {
18
+ setMatches(mediaQueryList.matches);
19
+ try {
20
+ mediaQueryList.addEventListener('change', handleChange);
21
+ }
22
+ catch {
23
+ // Safari 13 fallback
24
+ mediaQueryList.addListener?.(handleChange);
25
+ }
26
+ }
27
+ return () => {
28
+ try {
29
+ mediaQueryList?.removeEventListener('change', handleChange);
30
+ }
31
+ catch {
32
+ // Safari 13 fallback
33
+ mediaQueryList?.removeListener?.(handleChange);
34
+ }
35
+ };
36
+ }, [queryString]);
37
+ return !!matches;
38
38
  };
39
39
  exports.useMediaQuery = useMediaQuery;
40
40
  exports.default = exports.useMediaQuery;
@@ -1,32 +1,33 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useMergedRefs = exports.mergeRefs = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
9
+ const React = tslib_1.__importStar(require("react"));
10
10
  /**
11
11
  * Function that merges the provided refs into one.
12
12
  */
13
13
  const mergeRefs = (...refs) => {
14
- return (instance) => {
15
- refs.forEach((ref) => {
16
- if (typeof ref === 'function') {
17
- ref(instance);
18
- } else if (ref) {
19
- ref.current = instance;
20
- }
21
- });
22
- };
14
+ return (instance) => {
15
+ refs.forEach((ref) => {
16
+ if (typeof ref === 'function') {
17
+ ref(instance);
18
+ }
19
+ else if (ref) {
20
+ ref.current = instance;
21
+ }
22
+ });
23
+ };
23
24
  };
24
25
  exports.mergeRefs = mergeRefs;
25
26
  /**
26
27
  * Returns a ref callback that merges the provided refs using `mergeRefs`.
27
28
  */
28
29
  const useMergedRefs = (...refs) => {
29
- // eslint-disable-next-line react-hooks/exhaustive-deps
30
- return React.useCallback((0, exports.mergeRefs)(...refs), [...refs]);
30
+ // eslint-disable-next-line react-hooks/exhaustive-deps
31
+ return React.useCallback((0, exports.mergeRefs)(...refs), [...refs]);
31
32
  };
32
33
  exports.useMergedRefs = useMergedRefs;
@@ -1,15 +1,15 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useOverflow = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const useMergedRefs_js_1 = require('./useMergedRefs.js');
11
- const useResizeObserver_js_1 = require('./useResizeObserver.js');
12
- const useIsomorphicLayoutEffect_js_1 = require('./useIsomorphicLayoutEffect.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const useMergedRefs_js_1 = require("./useMergedRefs.js");
11
+ const useResizeObserver_js_1 = require("./useResizeObserver.js");
12
+ const useIsomorphicLayoutEffect_js_1 = require("./useIsomorphicLayoutEffect.js");
13
13
  const STARTING_MAX_ITEMS_COUNT = 20;
14
14
  /**
15
15
  * Hook that observes the size of an element and returns the number of items
@@ -34,69 +34,56 @@ const STARTING_MAX_ITEMS_COUNT = 20;
34
34
  * );
35
35
  */
36
36
  const useOverflow = (items, disabled = false, orientation = 'horizontal') => {
37
- const containerRef = React.useRef(null);
38
- const [visibleCount, setVisibleCount] = React.useState(() =>
39
- disabled ? items.length : Math.min(items.length, STARTING_MAX_ITEMS_COUNT),
40
- );
41
- const needsFullRerender = React.useRef(true);
42
- const [containerSize, setContainerSize] = React.useState(0);
43
- const previousContainerSize = React.useRef(0);
44
- const updateContainerSize = React.useCallback(
45
- ({ width, height }) =>
46
- setContainerSize(orientation === 'horizontal' ? width : height),
47
- [orientation],
48
- );
49
- const [resizeRef, observer] = (0, useResizeObserver_js_1.useResizeObserver)(
50
- updateContainerSize,
51
- );
52
- const resizeObserverRef = React.useRef(observer);
53
- (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
54
- if (disabled) {
55
- setVisibleCount(items.length);
56
- } else {
57
- setVisibleCount(Math.min(items.length, STARTING_MAX_ITEMS_COUNT));
58
- needsFullRerender.current = true;
59
- }
60
- }, [containerSize, disabled, items]);
61
- const mergedRefs = (0, useMergedRefs_js_1.useMergedRefs)(
62
- containerRef,
63
- resizeRef,
64
- );
65
- (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
66
- if (!containerRef.current || disabled) {
67
- resizeObserverRef.current?.disconnect();
68
- return;
69
- }
70
- const dimension = orientation === 'horizontal' ? 'Width' : 'Height';
71
- const availableSize = containerRef.current[`offset${dimension}`];
72
- const requiredSize = containerRef.current[`scroll${dimension}`];
73
- if (availableSize < requiredSize) {
74
- const avgItemSize = requiredSize / visibleCount;
75
- const visibleItems = Math.floor(availableSize / avgItemSize);
76
- /* When first item is larger than the container - visibleItems count is 0,
37
+ const containerRef = React.useRef(null);
38
+ const [visibleCount, setVisibleCount] = React.useState(() => disabled ? items.length : Math.min(items.length, STARTING_MAX_ITEMS_COUNT));
39
+ const needsFullRerender = React.useRef(true);
40
+ const [containerSize, setContainerSize] = React.useState(0);
41
+ const previousContainerSize = React.useRef(0);
42
+ const updateContainerSize = React.useCallback(({ width, height }) => setContainerSize(orientation === 'horizontal' ? width : height), [orientation]);
43
+ const [resizeRef, observer] = (0, useResizeObserver_js_1.useResizeObserver)(updateContainerSize);
44
+ const resizeObserverRef = React.useRef(observer);
45
+ (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
46
+ if (disabled) {
47
+ setVisibleCount(items.length);
48
+ }
49
+ else {
50
+ setVisibleCount(Math.min(items.length, STARTING_MAX_ITEMS_COUNT));
51
+ needsFullRerender.current = true;
52
+ }
53
+ }, [containerSize, disabled, items]);
54
+ const mergedRefs = (0, useMergedRefs_js_1.useMergedRefs)(containerRef, resizeRef);
55
+ (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
56
+ if (!containerRef.current || disabled) {
57
+ resizeObserverRef.current?.disconnect();
58
+ return;
59
+ }
60
+ const dimension = orientation === 'horizontal' ? 'Width' : 'Height';
61
+ const availableSize = containerRef.current[`offset${dimension}`];
62
+ const requiredSize = containerRef.current[`scroll${dimension}`];
63
+ if (availableSize < requiredSize) {
64
+ const avgItemSize = requiredSize / visibleCount;
65
+ const visibleItems = Math.floor(availableSize / avgItemSize);
66
+ /* When first item is larger than the container - visibleItems count is 0,
77
67
  We can assume that at least some part of the first item is visible and return 1. */
78
- setVisibleCount(visibleItems > 0 ? visibleItems : 1);
79
- } else if (needsFullRerender.current) {
80
- const childrenSize = Array.from(containerRef.current.children).reduce(
81
- (sum, child) => sum + child[`offset${dimension}`],
82
- 0,
83
- );
84
- // Previous `useEffect` might have updated visible count, but we still have old one
85
- // If it is 0, lets try to update it with items length.
86
- const currentVisibleCount =
87
- visibleCount || Math.min(items.length, STARTING_MAX_ITEMS_COUNT);
88
- const avgItemSize = childrenSize / currentVisibleCount;
89
- const visibleItems = Math.floor(availableSize / avgItemSize);
90
- if (!isNaN(visibleItems)) {
91
- // Doubling the visible items to overflow the container. Just to be safe.
92
- setVisibleCount(Math.min(items.length, visibleItems * 2));
93
- }
94
- }
95
- needsFullRerender.current = false;
96
- }, [containerSize, visibleCount, disabled, items.length, orientation]);
97
- (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
98
- previousContainerSize.current = containerSize;
99
- }, [containerSize]);
100
- return [mergedRefs, visibleCount];
68
+ setVisibleCount(visibleItems > 0 ? visibleItems : 1);
69
+ }
70
+ else if (needsFullRerender.current) {
71
+ const childrenSize = Array.from(containerRef.current.children).reduce((sum, child) => sum + child[`offset${dimension}`], 0);
72
+ // Previous `useEffect` might have updated visible count, but we still have old one
73
+ // If it is 0, lets try to update it with items length.
74
+ const currentVisibleCount = visibleCount || Math.min(items.length, STARTING_MAX_ITEMS_COUNT);
75
+ const avgItemSize = childrenSize / currentVisibleCount;
76
+ const visibleItems = Math.floor(availableSize / avgItemSize);
77
+ if (!isNaN(visibleItems)) {
78
+ // Doubling the visible items to overflow the container. Just to be safe.
79
+ setVisibleCount(Math.min(items.length, visibleItems * 2));
80
+ }
81
+ }
82
+ needsFullRerender.current = false;
83
+ }, [containerSize, visibleCount, disabled, items.length, orientation]);
84
+ (0, useIsomorphicLayoutEffect_js_1.useIsomorphicLayoutEffect)(() => {
85
+ previousContainerSize.current = containerSize;
86
+ }, [containerSize]);
87
+ return [mergedRefs, visibleCount];
101
88
  };
102
89
  exports.useOverflow = useOverflow;
@@ -1,13 +1,13 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useResizeObserver = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const dom_js_1 = require('../functions/dom.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const dom_js_1 = require("../functions/dom.js");
11
11
  /**
12
12
  * Hook that uses `ResizeObserver` to access an element's size every time it updates.
13
13
  * @private
@@ -21,22 +21,17 @@ const dom_js_1 = require('../functions/dom.js');
21
21
  * return <div ref={ref}>...</div>;
22
22
  */
23
23
  const useResizeObserver = (onResize) => {
24
- const resizeObserver = React.useRef();
25
- const elementRef = React.useCallback(
26
- (element) => {
27
- if (!(0, dom_js_1.getWindow)()?.ResizeObserver) {
28
- return;
29
- }
30
- resizeObserver.current?.disconnect?.();
31
- if (element) {
32
- resizeObserver.current = new ResizeObserver(([{ contentRect }]) =>
33
- onResize(contentRect),
34
- );
35
- resizeObserver.current?.observe?.(element);
36
- }
37
- },
38
- [onResize],
39
- );
40
- return [elementRef, resizeObserver.current];
24
+ const resizeObserver = React.useRef();
25
+ const elementRef = React.useCallback((element) => {
26
+ if (!(0, dom_js_1.getWindow)()?.ResizeObserver) {
27
+ return;
28
+ }
29
+ resizeObserver.current?.disconnect?.();
30
+ if (element) {
31
+ resizeObserver.current = new ResizeObserver(([{ contentRect }]) => onResize(contentRect));
32
+ resizeObserver.current?.observe?.(element);
33
+ }
34
+ }, [onResize]);
35
+ return [elementRef, resizeObserver.current];
41
36
  };
42
37
  exports.useResizeObserver = useResizeObserver;
@@ -1,21 +1,21 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useSafeContext = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
9
+ const React = tslib_1.__importStar(require("react"));
10
10
  /**
11
11
  * Wrapper hook around `useContext` that throws an error if the context is not provided.
12
12
  * @param context Context to use. Must have a `displayName` for useful errors.
13
13
  */
14
14
  const useSafeContext = (context) => {
15
- const value = React.useContext(context);
16
- if (!value) {
17
- throw new Error(`${context.displayName} is undefined`);
18
- }
19
- return value; // eslint-disable-line @typescript-eslint/no-non-null-assertion -- we already checked for undefined
15
+ const value = React.useContext(context);
16
+ if (!value) {
17
+ throw new Error(`${context.displayName} is undefined`);
18
+ }
19
+ return value; // eslint-disable-line @typescript-eslint/no-non-null-assertion -- we already checked for undefined
20
20
  };
21
21
  exports.useSafeContext = useSafeContext;
@@ -1,35 +1,19 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.StatusIconMap = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const SvgInfoCircular_js_1 = require('./SvgInfoCircular.js');
11
- const SvgStatusError_js_1 = require('./SvgStatusError.js');
12
- const SvgStatusSuccess_js_1 = require('./SvgStatusSuccess.js');
13
- const SvgStatusWarning_js_1 = require('./SvgStatusWarning.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const SvgInfoCircular_js_1 = require("./SvgInfoCircular.js");
11
+ const SvgStatusError_js_1 = require("./SvgStatusError.js");
12
+ const SvgStatusSuccess_js_1 = require("./SvgStatusSuccess.js");
13
+ const SvgStatusWarning_js_1 = require("./SvgStatusWarning.js");
14
14
  exports.StatusIconMap = {
15
- negative: (args) =>
16
- React.createElement(SvgStatusError_js_1.SvgStatusError, {
17
- 'aria-hidden': true,
18
- ...args,
19
- }),
20
- positive: (args) =>
21
- React.createElement(SvgStatusSuccess_js_1.SvgStatusSuccess, {
22
- 'aria-hidden': true,
23
- ...args,
24
- }),
25
- warning: (args) =>
26
- React.createElement(SvgStatusWarning_js_1.SvgStatusWarning, {
27
- 'aria-hidden': true,
28
- ...args,
29
- }),
30
- informational: (args) =>
31
- React.createElement(SvgInfoCircular_js_1.SvgInfoCircular, {
32
- 'aria-hidden': true,
33
- ...args,
34
- }),
15
+ negative: (args) => React.createElement(SvgStatusError_js_1.SvgStatusError, { "aria-hidden": true, ...args }),
16
+ positive: (args) => React.createElement(SvgStatusSuccess_js_1.SvgStatusSuccess, { "aria-hidden": true, ...args }),
17
+ warning: (args) => React.createElement(SvgStatusWarning_js_1.SvgStatusWarning, { "aria-hidden": true, ...args }),
18
+ informational: (args) => (React.createElement(SvgInfoCircular_js_1.SvgInfoCircular, { "aria-hidden": true, ...args })),
35
19
  };
@@ -1,9 +1,9 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.Svg = void 0;
4
4
  /*---------------------------------------------------------------------------------------------
5
5
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
6
6
  * See LICENSE.md in the project root for license terms and full copyright notice.
7
7
  *--------------------------------------------------------------------------------------------*/
8
- const polymorphic_js_1 = require('../functions/polymorphic.js');
8
+ const polymorphic_js_1 = require("../functions/polymorphic.js");
9
9
  exports.Svg = polymorphic_js_1.polymorphic.svg('', { viewBox: '0 0 16 16' });
@@ -1,20 +1,15 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.SvgCalendar = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const Svg_js_1 = require('./Svg.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const Svg_js_1 = require("./Svg.js");
11
11
  const SvgCalendar = (props) => {
12
- return React.createElement(
13
- Svg_js_1.Svg,
14
- { ...props },
15
- React.createElement('path', {
16
- d: 'M13,13H9V10h4ZM16,3V15a1,1,0,0,1-1,1H1a1,1,0,0,1-1-1V3A1,1,0,0,1,1,2H3V0H4V2h8V0h1V2h2A1,1,0,0,1,16,3ZM15,6H1v9H15Z',
17
- }),
18
- );
12
+ return (React.createElement(Svg_js_1.Svg, { ...props },
13
+ React.createElement("path", { d: 'M13,13H9V10h4ZM16,3V15a1,1,0,0,1-1,1H1a1,1,0,0,1-1-1V3A1,1,0,0,1,1,2H3V0H4V2h8V0h1V2h2A1,1,0,0,1,16,3ZM15,6H1v9H15Z' })));
19
14
  };
20
15
  exports.SvgCalendar = SvgCalendar;
@@ -1,20 +1,15 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.SvgCaretDownSmall = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const Svg_js_1 = require('./Svg.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const Svg_js_1 = require("./Svg.js");
11
11
  const SvgCaretDownSmall = (props) => {
12
- return React.createElement(
13
- Svg_js_1.Svg,
14
- { ...props },
15
- React.createElement('path', {
16
- d: 'M4.807 6h6.395a.28.28 0 0 1 .24.443L8.27 9.9a.34.34 0 0 1-.481 0L4.566 6.443A.27.27 0 0 1 4.806 6z',
17
- }),
18
- );
12
+ return (React.createElement(Svg_js_1.Svg, { ...props },
13
+ React.createElement("path", { d: 'M4.807 6h6.395a.28.28 0 0 1 .24.443L8.27 9.9a.34.34 0 0 1-.481 0L4.566 6.443A.27.27 0 0 1 4.806 6z' })));
19
14
  };
20
15
  exports.SvgCaretDownSmall = SvgCaretDownSmall;