@itwin/itwinui-react 3.0.4 → 3.0.5

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 (496) hide show
  1. package/CHANGELOG.md +7 -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 +116 -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.js +17 -24
  201. package/cjs/core/utils/functions/focusable.js +17 -26
  202. package/cjs/core/utils/functions/import.js +23 -46
  203. package/cjs/core/utils/functions/index.js +13 -13
  204. package/cjs/core/utils/functions/numbers.js +9 -9
  205. package/cjs/core/utils/functions/polymorphic.js +30 -43
  206. package/cjs/core/utils/functions/react.js +24 -26
  207. package/cjs/core/utils/functions/supports.js +4 -5
  208. package/cjs/core/utils/hooks/index.js +17 -17
  209. package/cjs/core/utils/hooks/useContainerWidth.js +19 -26
  210. package/cjs/core/utils/hooks/useControlledState.js +12 -21
  211. package/cjs/core/utils/hooks/useDragAndDrop.js +87 -110
  212. package/cjs/core/utils/hooks/useEventListener.js +22 -22
  213. package/cjs/core/utils/hooks/useGlobals.js +27 -33
  214. package/cjs/core/utils/hooks/useId.js +8 -10
  215. package/cjs/core/utils/hooks/useIntersection.js +24 -30
  216. package/cjs/core/utils/hooks/useIsClient.js +9 -9
  217. package/cjs/core/utils/hooks/useIsomorphicLayoutEffect.js +5 -6
  218. package/cjs/core/utils/hooks/useLatestRef.js +9 -9
  219. package/cjs/core/utils/hooks/useMediaQuery.js +31 -31
  220. package/cjs/core/utils/hooks/useMergedRefs.js +16 -15
  221. package/cjs/core/utils/hooks/useOverflow.js +57 -70
  222. package/cjs/core/utils/hooks/useResizeObserver.js +17 -22
  223. package/cjs/core/utils/hooks/useSafeContext.js +9 -9
  224. package/cjs/core/utils/icons/StatusIconMap.js +12 -28
  225. package/cjs/core/utils/icons/Svg.js +3 -3
  226. package/cjs/core/utils/icons/SvgCalendar.js +7 -12
  227. package/cjs/core/utils/icons/SvgCaretDownSmall.js +7 -12
  228. package/cjs/core/utils/icons/SvgCaretRightSmall.js +7 -12
  229. package/cjs/core/utils/icons/SvgCaretUpSmall.js +7 -12
  230. package/cjs/core/utils/icons/SvgCheckmark.js +7 -10
  231. package/cjs/core/utils/icons/SvgCheckmarkSmall.js +7 -12
  232. package/cjs/core/utils/icons/SvgChevronLeft.js +7 -12
  233. package/cjs/core/utils/icons/SvgChevronLeftDouble.js +7 -12
  234. package/cjs/core/utils/icons/SvgChevronRight.js +7 -12
  235. package/cjs/core/utils/icons/SvgChevronRightDouble.js +7 -12
  236. package/cjs/core/utils/icons/SvgClose.js +7 -12
  237. package/cjs/core/utils/icons/SvgCloseSmall.js +7 -12
  238. package/cjs/core/utils/icons/SvgColumnManager.js +7 -12
  239. package/cjs/core/utils/icons/SvgDocument.js +7 -10
  240. package/cjs/core/utils/icons/SvgFilter.js +7 -10
  241. package/cjs/core/utils/icons/SvgFilterHollow.js +7 -12
  242. package/cjs/core/utils/icons/SvgImportantSmall.js +7 -12
  243. package/cjs/core/utils/icons/SvgInfoCircular.js +7 -12
  244. package/cjs/core/utils/icons/SvgMore.js +7 -12
  245. package/cjs/core/utils/icons/SvgMoreVertical.js +7 -12
  246. package/cjs/core/utils/icons/SvgNew.js +7 -12
  247. package/cjs/core/utils/icons/SvgSearch.js +7 -12
  248. package/cjs/core/utils/icons/SvgSmileyHappy.js +7 -12
  249. package/cjs/core/utils/icons/SvgSortDown.js +7 -12
  250. package/cjs/core/utils/icons/SvgSortUp.js +7 -12
  251. package/cjs/core/utils/icons/SvgStatusError.js +7 -12
  252. package/cjs/core/utils/icons/SvgStatusSuccess.js +7 -12
  253. package/cjs/core/utils/icons/SvgStatusWarning.js +7 -12
  254. package/cjs/core/utils/icons/SvgSwap.js +7 -12
  255. package/cjs/core/utils/icons/SvgUpload.js +7 -12
  256. package/cjs/core/utils/icons/index.js +34 -34
  257. package/cjs/core/utils/index.js +10 -10
  258. package/cjs/core/utils/props.js +2 -2
  259. package/cjs/core/utils/types.js +2 -2
  260. package/cjs/index.js +229 -949
  261. package/cjs/react-table/react-table.js +2 -2
  262. package/cjs/styles.js +412 -425
  263. package/esm/core/Alert/Alert.js +39 -106
  264. package/esm/core/Avatar/Avatar.js +14 -42
  265. package/esm/core/AvatarGroup/AvatarGroup.js +20 -58
  266. package/esm/core/Backdrop/Backdrop.js +2 -10
  267. package/esm/core/Badge/Badge.js +16 -31
  268. package/esm/core/Breadcrumbs/Breadcrumbs.js +55 -135
  269. package/esm/core/ButtonGroup/ButtonGroup.js +25 -61
  270. package/esm/core/Buttons/Button.js +5 -45
  271. package/esm/core/Buttons/DropdownButton.js +7 -37
  272. package/esm/core/Buttons/IconButton.js +5 -40
  273. package/esm/core/Buttons/IdeasButton.js +2 -12
  274. package/esm/core/Buttons/SplitButton.js +34 -101
  275. package/esm/core/Carousel/Carousel.js +43 -72
  276. package/esm/core/Carousel/CarouselDot.js +6 -17
  277. package/esm/core/Carousel/CarouselDotsList.js +85 -147
  278. package/esm/core/Carousel/CarouselNavigation.js +32 -68
  279. package/esm/core/Carousel/CarouselSlide.js +19 -41
  280. package/esm/core/Carousel/CarouselSlider.js +41 -65
  281. package/esm/core/Checkbox/Checkbox.js +25 -78
  282. package/esm/core/ColorPicker/ColorBuilder.js +167 -280
  283. package/esm/core/ColorPicker/ColorInputPanel.js +237 -395
  284. package/esm/core/ColorPicker/ColorPalette.js +14 -35
  285. package/esm/core/ColorPicker/ColorPicker.js +46 -79
  286. package/esm/core/ColorPicker/ColorPickerContext.js +5 -7
  287. package/esm/core/ColorPicker/ColorSwatch.js +7 -24
  288. package/esm/core/ComboBox/ComboBox.js +267 -396
  289. package/esm/core/ComboBox/ComboBoxEndIcon.js +5 -18
  290. package/esm/core/ComboBox/ComboBoxInput.js +125 -197
  291. package/esm/core/ComboBox/ComboBoxInputContainer.js +5 -20
  292. package/esm/core/ComboBox/ComboBoxMenu.js +37 -77
  293. package/esm/core/ComboBox/ComboBoxMenuItem.js +14 -61
  294. package/esm/core/ComboBox/ComboBoxMultipleContainer.js +2 -6
  295. package/esm/core/ComboBox/helpers.js +38 -38
  296. package/esm/core/DatePicker/DatePicker.js +326 -555
  297. package/esm/core/Dialog/Dialog.js +24 -53
  298. package/esm/core/Dialog/DialogBackdrop.js +19 -39
  299. package/esm/core/Dialog/DialogContent.js +12 -20
  300. package/esm/core/Dialog/DialogContext.js +1 -1
  301. package/esm/core/Dialog/DialogDragContext.js +4 -4
  302. package/esm/core/Dialog/DialogMain.js +107 -177
  303. package/esm/core/Dialog/DialogTitleBar.js +10 -45
  304. package/esm/core/Divider/Divider.js +2 -8
  305. package/esm/core/DropdownMenu/DropdownMenu.js +40 -75
  306. package/esm/core/ExpandableBlock/ExpandableBlock.js +92 -193
  307. package/esm/core/Fieldset/Fieldset.js +8 -19
  308. package/esm/core/FileUpload/FileEmptyCard.js +8 -19
  309. package/esm/core/FileUpload/FileUpload.js +36 -72
  310. package/esm/core/FileUpload/FileUploadCard.js +76 -153
  311. package/esm/core/FileUpload/FileUploadTemplate.js +9 -37
  312. package/esm/core/Flex/Flex.js +71 -87
  313. package/esm/core/Footer/Footer.js +55 -86
  314. package/esm/core/Footer/FooterSeparator.js +1 -1
  315. package/esm/core/Header/Header.js +14 -55
  316. package/esm/core/Header/HeaderBasicButton.js +7 -15
  317. package/esm/core/Header/HeaderBreadcrumbs.js +8 -32
  318. package/esm/core/Header/HeaderButton.js +14 -62
  319. package/esm/core/Header/HeaderDropdownButton.js +13 -42
  320. package/esm/core/Header/HeaderLogo.js +5 -36
  321. package/esm/core/Header/HeaderSplitButton.js +14 -61
  322. package/esm/core/Icon/Icon.js +12 -26
  323. package/esm/core/InformationPanel/InformationPanel.js +36 -71
  324. package/esm/core/InformationPanel/InformationPanelContent.js +3 -17
  325. package/esm/core/InformationPanel/InformationPanelHeader.js +8 -32
  326. package/esm/core/InformationPanel/InformationPanelWrapper.js +1 -3
  327. package/esm/core/Input/Input.js +4 -12
  328. package/esm/core/InputGrid/InputGrid.js +2 -11
  329. package/esm/core/InputGroup/InputGroup.js +16 -57
  330. package/esm/core/InputWithDecorations/InputWithDecorations.js +11 -42
  331. package/esm/core/Label/Label.js +5 -26
  332. package/esm/core/LabeledInput/LabeledInput.js +10 -63
  333. package/esm/core/LabeledSelect/LabeledSelect.js +18 -67
  334. package/esm/core/LabeledTextarea/LabeledTextarea.js +2 -8
  335. package/esm/core/List/ListItem.js +28 -46
  336. package/esm/core/Menu/Menu.js +48 -64
  337. package/esm/core/Menu/MenuDivider.js +1 -1
  338. package/esm/core/Menu/MenuExtraContent.js +1 -1
  339. package/esm/core/Menu/MenuItem.js +84 -164
  340. package/esm/core/Menu/MenuItemSkeleton.js +12 -43
  341. package/esm/core/Modal/Modal.js +6 -33
  342. package/esm/core/NonIdealState/ErrorPage.js +123 -173
  343. package/esm/core/NonIdealState/NonIdealState.js +6 -65
  344. package/esm/core/NotificationMarker/NotificationMarker.js +2 -20
  345. package/esm/core/Overlay/Overlay.d.ts +20 -24
  346. package/esm/core/Overlay/Overlay.js +45 -55
  347. package/esm/core/Popover/Popover.js +80 -172
  348. package/esm/core/ProgressIndicators/ProgressLinear.js +5 -40
  349. package/esm/core/ProgressIndicators/ProgressRadial.js +14 -40
  350. package/esm/core/Radio/Radio.js +6 -45
  351. package/esm/core/RadioTiles/RadioTile.js +8 -62
  352. package/esm/core/RadioTiles/RadioTileGroup.js +3 -10
  353. package/esm/core/SearchBox/SearchBox.js +97 -214
  354. package/esm/core/Select/Select.js +130 -265
  355. package/esm/core/Select/SelectTag.js +3 -15
  356. package/esm/core/Select/SelectTagContainer.js +7 -20
  357. package/esm/core/SideNavigation/SideNavigation.js +21 -118
  358. package/esm/core/SideNavigation/SidenavButton.js +2 -24
  359. package/esm/core/SideNavigation/SidenavSubmenu.js +3 -14
  360. package/esm/core/SideNavigation/SidenavSubmenuHeader.js +4 -20
  361. package/esm/core/SkipToContentLink/SkipToContentLink.js +2 -11
  362. package/esm/core/Slider/Slider.js +187 -340
  363. package/esm/core/Slider/Thumb.js +50 -97
  364. package/esm/core/Slider/Track.js +49 -74
  365. package/esm/core/StatusMessage/StatusMessage.js +5 -23
  366. package/esm/core/Stepper/Stepper.js +14 -70
  367. package/esm/core/Stepper/StepperStep.js +29 -92
  368. package/esm/core/Stepper/WorkflowDiagram.js +8 -21
  369. package/esm/core/Stepper/WorkflowDiagramStep.js +4 -22
  370. package/esm/core/Surface/Surface.js +48 -84
  371. package/esm/core/Table/SubRowExpander.js +9 -31
  372. package/esm/core/Table/Table.js +408 -763
  373. package/esm/core/Table/TableCell.js +53 -87
  374. package/esm/core/Table/TablePaginator.js +125 -306
  375. package/esm/core/Table/TableRowMemoized.js +58 -129
  376. package/esm/core/Table/actionHandlers/expandHandler.js +10 -10
  377. package/esm/core/Table/actionHandlers/filterHandler.js +15 -23
  378. package/esm/core/Table/actionHandlers/index.js +1 -5
  379. package/esm/core/Table/actionHandlers/resizeHandler.js +11 -11
  380. package/esm/core/Table/actionHandlers/selectHandler.js +95 -122
  381. package/esm/core/Table/cells/DefaultCell.js +7 -42
  382. package/esm/core/Table/cells/EditableCell.js +41 -70
  383. package/esm/core/Table/columns/actionColumn.js +55 -85
  384. package/esm/core/Table/columns/expanderColumn.js +25 -39
  385. package/esm/core/Table/columns/selectionColumn.js +23 -51
  386. package/esm/core/Table/filters/BaseFilter.js +7 -15
  387. package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.js +42 -107
  388. package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.js +52 -110
  389. package/esm/core/Table/filters/FilterButtonBar.js +9 -28
  390. package/esm/core/Table/filters/FilterToggle.js +18 -51
  391. package/esm/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js +28 -50
  392. package/esm/core/Table/filters/TextFilter/TextFilter.js +20 -32
  393. package/esm/core/Table/filters/customFilterFunctions.js +12 -14
  394. package/esm/core/Table/filters/defaultFilterFunctions.js +79 -84
  395. package/esm/core/Table/filters/tableFilters.js +25 -34
  396. package/esm/core/Table/hooks/useColumnDragAndDrop.js +81 -88
  397. package/esm/core/Table/hooks/useExpanderCell.js +20 -26
  398. package/esm/core/Table/hooks/useResizeColumns.js +287 -353
  399. package/esm/core/Table/hooks/useScrollToRow.js +34 -42
  400. package/esm/core/Table/hooks/useSelectionCell.js +6 -10
  401. package/esm/core/Table/hooks/useStickyColumns.js +59 -61
  402. package/esm/core/Table/hooks/useSubRowFiltering.js +83 -90
  403. package/esm/core/Table/hooks/useSubRowSelection.js +27 -28
  404. package/esm/core/Table/index.js +1 -5
  405. package/esm/core/Table/utils.js +38 -40
  406. package/esm/core/Tabs/Tabs.js +226 -401
  407. package/esm/core/Tag/Tag.js +8 -35
  408. package/esm/core/Tag/TagContainer.js +5 -17
  409. package/esm/core/Textarea/Textarea.js +1 -6
  410. package/esm/core/ThemeProvider/ThemeProvider.js +44 -101
  411. package/esm/core/Tile/Tile.js +218 -386
  412. package/esm/core/TimePicker/TimePicker.js +228 -448
  413. package/esm/core/Toast/Toast.js +99 -193
  414. package/esm/core/Toast/Toaster.js +69 -82
  415. package/esm/core/ToggleSwitch/ToggleSwitch.js +17 -60
  416. package/esm/core/Tooltip/Tooltip.js +86 -151
  417. package/esm/core/TransferList/TransferList.js +93 -157
  418. package/esm/core/Tree/Tree.js +122 -196
  419. package/esm/core/Tree/TreeContext.js +5 -5
  420. package/esm/core/Tree/TreeNode.js +96 -195
  421. package/esm/core/Tree/TreeNodeExpander.js +5 -16
  422. package/esm/core/Typography/Blockquote.js +4 -12
  423. package/esm/core/Typography/Kbd.js +15 -24
  424. package/esm/core/Typography/Text.js +7 -20
  425. package/esm/core/VisuallyHidden/VisuallyHidden.js +2 -8
  426. package/esm/core/utils/color/ColorValue.js +449 -524
  427. package/esm/core/utils/components/AutoclearingHiddenLiveRegion.js +7 -11
  428. package/esm/core/utils/components/ButtonBase.js +13 -31
  429. package/esm/core/utils/components/FocusTrap.js +32 -41
  430. package/esm/core/utils/components/InputContainer.js +11 -50
  431. package/esm/core/utils/components/InputFlexContainer.js +2 -15
  432. package/esm/core/utils/components/MiddleTextTruncation.js +17 -27
  433. package/esm/core/utils/components/Portal.js +12 -12
  434. package/esm/core/utils/components/Resizer.js +191 -249
  435. package/esm/core/utils/components/VirtualScroll.js +218 -297
  436. package/esm/core/utils/components/WithCSSTransition.js +26 -43
  437. package/esm/core/utils/functions/colors.js +19 -19
  438. package/esm/core/utils/functions/date.js +8 -8
  439. package/esm/core/utils/functions/dev.js +12 -11
  440. package/esm/core/utils/functions/dom.js +14 -17
  441. package/esm/core/utils/functions/focusable.js +15 -24
  442. package/esm/core/utils/functions/import.js +2 -4
  443. package/esm/core/utils/functions/numbers.js +7 -7
  444. package/esm/core/utils/functions/polymorphic.js +23 -32
  445. package/esm/core/utils/functions/react.js +19 -21
  446. package/esm/core/utils/functions/supports.js +1 -2
  447. package/esm/core/utils/hooks/useContainerWidth.js +13 -16
  448. package/esm/core/utils/hooks/useControlledState.js +8 -17
  449. package/esm/core/utils/hooks/useDragAndDrop.js +80 -99
  450. package/esm/core/utils/hooks/useEventListener.js +18 -18
  451. package/esm/core/utils/hooks/useGlobals.js +21 -27
  452. package/esm/core/utils/hooks/useId.js +3 -4
  453. package/esm/core/utils/hooks/useIntersection.js +19 -25
  454. package/esm/core/utils/hooks/useIsClient.js +5 -5
  455. package/esm/core/utils/hooks/useIsomorphicLayoutEffect.js +1 -2
  456. package/esm/core/utils/hooks/useLatestRef.js +5 -5
  457. package/esm/core/utils/hooks/useMediaQuery.js +25 -23
  458. package/esm/core/utils/hooks/useMergedRefs.js +12 -11
  459. package/esm/core/utils/hooks/useOverflow.js +51 -63
  460. package/esm/core/utils/hooks/useResizeObserver.js +12 -17
  461. package/esm/core/utils/hooks/useSafeContext.js +5 -5
  462. package/esm/core/utils/icons/StatusIconMap.js +4 -8
  463. package/esm/core/utils/icons/SvgCalendar.js +2 -7
  464. package/esm/core/utils/icons/SvgCaretDownSmall.js +2 -7
  465. package/esm/core/utils/icons/SvgCaretRightSmall.js +2 -7
  466. package/esm/core/utils/icons/SvgCaretUpSmall.js +2 -7
  467. package/esm/core/utils/icons/SvgCheckmark.js +2 -5
  468. package/esm/core/utils/icons/SvgCheckmarkSmall.js +2 -7
  469. package/esm/core/utils/icons/SvgChevronLeft.js +2 -7
  470. package/esm/core/utils/icons/SvgChevronLeftDouble.js +2 -7
  471. package/esm/core/utils/icons/SvgChevronRight.js +2 -7
  472. package/esm/core/utils/icons/SvgChevronRightDouble.js +2 -7
  473. package/esm/core/utils/icons/SvgClose.js +2 -7
  474. package/esm/core/utils/icons/SvgCloseSmall.js +2 -7
  475. package/esm/core/utils/icons/SvgColumnManager.js +2 -7
  476. package/esm/core/utils/icons/SvgDocument.js +2 -5
  477. package/esm/core/utils/icons/SvgFilter.js +2 -5
  478. package/esm/core/utils/icons/SvgFilterHollow.js +2 -7
  479. package/esm/core/utils/icons/SvgImportantSmall.js +2 -7
  480. package/esm/core/utils/icons/SvgInfoCircular.js +2 -7
  481. package/esm/core/utils/icons/SvgMore.js +2 -7
  482. package/esm/core/utils/icons/SvgMoreVertical.js +2 -7
  483. package/esm/core/utils/icons/SvgNew.js +2 -7
  484. package/esm/core/utils/icons/SvgSearch.js +2 -7
  485. package/esm/core/utils/icons/SvgSmileyHappy.js +2 -7
  486. package/esm/core/utils/icons/SvgSortDown.js +2 -7
  487. package/esm/core/utils/icons/SvgSortUp.js +2 -7
  488. package/esm/core/utils/icons/SvgStatusError.js +2 -7
  489. package/esm/core/utils/icons/SvgStatusSuccess.js +2 -7
  490. package/esm/core/utils/icons/SvgStatusWarning.js +2 -7
  491. package/esm/core/utils/icons/SvgSwap.js +2 -7
  492. package/esm/core/utils/icons/SvgUpload.js +2 -7
  493. package/esm/index.js +3 -21
  494. package/esm/styles.js +414 -425
  495. package/package.json +2 -2
  496. package/styles.css +6 -6
@@ -1,53 +1,45 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useScrollToRow = 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
- function useScrollToRow({
11
- data,
12
- enableVirtualization,
13
- page,
14
- paginatorRenderer,
15
- scrollToRow,
16
- }) {
17
- const rowRefs = React.useRef({});
18
- // Refs prevents from having `page` and `data` as dependencies
19
- // therefore we avoid unnecessary scroll to row.
20
- const pageRef = React.useRef(page);
21
- pageRef.current = page;
22
- const dataRef = React.useRef(data);
23
- dataRef.current = data;
24
- // For virtualized tables, all we need to do is pass the index of the item
25
- // to the VirtualScroll component
26
- const scrollToIndex = React.useMemo(() => {
27
- if (!scrollToRow || paginatorRenderer) {
28
- return undefined;
29
- }
30
- const index = scrollToRow(pageRef.current, dataRef.current);
31
- return index < 0 ? undefined : index;
32
- }, [paginatorRenderer, scrollToRow]);
33
- // For non-virtualized tables, we need to add a ref to each row
34
- // and scroll to the element
35
- React.useEffect(() => {
36
- if (
37
- enableVirtualization ||
38
- scrollToIndex === undefined ||
39
- scrollToIndex === null ||
40
- scrollToIndex < 0
41
- ) {
42
- return;
43
- }
44
- rowRefs.current[pageRef.current[scrollToIndex]?.id]?.scrollIntoView();
45
- }, [enableVirtualization, scrollToIndex]);
46
- const tableRowRef = React.useCallback((row) => {
47
- return (element) => {
48
- rowRefs.current[row.id] = element;
49
- };
50
- }, []);
51
- return { scrollToIndex, tableRowRef };
9
+ const React = tslib_1.__importStar(require("react"));
10
+ function useScrollToRow({ data, enableVirtualization, page, paginatorRenderer, scrollToRow, }) {
11
+ const rowRefs = React.useRef({});
12
+ // Refs prevents from having `page` and `data` as dependencies
13
+ // therefore we avoid unnecessary scroll to row.
14
+ const pageRef = React.useRef(page);
15
+ pageRef.current = page;
16
+ const dataRef = React.useRef(data);
17
+ dataRef.current = data;
18
+ // For virtualized tables, all we need to do is pass the index of the item
19
+ // to the VirtualScroll component
20
+ const scrollToIndex = React.useMemo(() => {
21
+ if (!scrollToRow || paginatorRenderer) {
22
+ return undefined;
23
+ }
24
+ const index = scrollToRow(pageRef.current, dataRef.current);
25
+ return index < 0 ? undefined : index;
26
+ }, [paginatorRenderer, scrollToRow]);
27
+ // For non-virtualized tables, we need to add a ref to each row
28
+ // and scroll to the element
29
+ React.useEffect(() => {
30
+ if (enableVirtualization ||
31
+ scrollToIndex === undefined ||
32
+ scrollToIndex === null ||
33
+ scrollToIndex < 0) {
34
+ return;
35
+ }
36
+ rowRefs.current[pageRef.current[scrollToIndex]?.id]?.scrollIntoView();
37
+ }, [enableVirtualization, scrollToIndex]);
38
+ const tableRowRef = React.useCallback((row) => {
39
+ return (element) => {
40
+ rowRefs.current[row.id] = element;
41
+ };
42
+ }, []);
43
+ return { scrollToIndex, tableRowRef };
52
44
  }
53
45
  exports.useScrollToRow = useScrollToRow;
@@ -1,24 +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.useSelectionCell = void 0;
4
- const index_js_1 = require('../columns/index.js');
5
- const useSelectionCell =
6
- (isSelectable, selectionMode, isRowDisabled, density = 'default') =>
7
- (hooks) => {
4
+ const index_js_1 = require("../columns/index.js");
5
+ const useSelectionCell = (isSelectable, selectionMode, isRowDisabled, density = 'default') => (hooks) => {
8
6
  if (!isSelectable) {
9
- return;
7
+ return;
10
8
  }
11
- hooks.allColumns.push((columns) =>
12
- selectionMode === 'single' ||
13
- columns.find((c) => c.id === index_js_1.SELECTION_CELL_ID)
9
+ hooks.allColumns.push((columns) => selectionMode === 'single' ||
10
+ columns.find((c) => c.id === index_js_1.SELECTION_CELL_ID)
14
11
  ? columns
15
12
  : [
16
- (0, index_js_1.SelectionColumn)({
17
- isDisabled: isRowDisabled,
18
- density: density,
19
- }),
13
+ (0, index_js_1.SelectionColumn)({ isDisabled: isRowDisabled, density: density }),
20
14
  ...columns,
21
- ],
22
- );
23
- };
15
+ ]);
16
+ };
24
17
  exports.useSelectionCell = useSelectionCell;
@@ -1,79 +1,77 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useStickyColumns = 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 react_table_1 = require('react-table');
8
+ const react_table_1 = require("react-table");
9
9
  react_table_1.actions.setScrolledLeft = 'setScrolledLeft';
10
10
  react_table_1.actions.setScrolledRight = 'setScrolledRight';
11
11
  const useStickyColumns = (hooks) => {
12
- hooks.stateReducers.push(reducer);
13
- hooks.useInstance.push(useInstance);
12
+ hooks.stateReducers.push(reducer);
13
+ hooks.useInstance.push(useInstance);
14
14
  };
15
15
  exports.useStickyColumns = useStickyColumns;
16
16
  const reducer = (newState, action) => {
17
- if (action.type === react_table_1.actions.init) {
18
- return {
19
- ...newState,
20
- sticky: {},
21
- };
22
- }
23
- if (
24
- action.type === react_table_1.actions.setScrolledLeft &&
25
- newState.sticky?.isScrolledToLeft !== action.value // Prevents unnecessary re-render
26
- ) {
27
- return {
28
- ...newState,
29
- sticky: {
30
- ...newState.sticky,
31
- isScrolledToLeft: action.value,
32
- },
33
- };
34
- }
35
- if (
36
- action.type === react_table_1.actions.setScrolledRight &&
37
- newState.sticky?.isScrolledToRight !== action.value // Prevents unnecessary re-render
38
- ) {
39
- return {
40
- ...newState,
41
- sticky: {
42
- ...newState.sticky,
43
- isScrolledToRight: action.value,
44
- },
45
- };
46
- }
47
- return newState;
48
- };
49
- const useInstance = (instance) => {
50
- const { flatHeaders } = instance;
51
- // Edge case. Saving original sticky state in case sticky columns are reordered.
52
- flatHeaders.forEach((header) => {
53
- if (!header.originalSticky) {
54
- header.originalSticky = header.sticky ?? 'none';
55
- }
56
- header.sticky =
57
- header.originalSticky === 'none' ? undefined : header.originalSticky;
58
- });
59
- // If there is a column that is sticked to the left, make every column prior to that sticky too.
60
- let hasLeftStickyColumn = false;
61
- [...flatHeaders].reverse().forEach((header) => {
62
- if (header.sticky === 'left') {
63
- hasLeftStickyColumn = true;
17
+ if (action.type === react_table_1.actions.init) {
18
+ return {
19
+ ...newState,
20
+ sticky: {},
21
+ };
64
22
  }
65
- if (hasLeftStickyColumn) {
66
- header.sticky = 'left';
23
+ if (action.type === react_table_1.actions.setScrolledLeft &&
24
+ newState.sticky?.isScrolledToLeft !== action.value // Prevents unnecessary re-render
25
+ ) {
26
+ return {
27
+ ...newState,
28
+ sticky: {
29
+ ...newState.sticky,
30
+ isScrolledToLeft: action.value,
31
+ },
32
+ };
67
33
  }
68
- });
69
- // If there is a column that is sticked to the right, make every column after to that sticky too.
70
- let hasRightStickyColumn = false;
71
- flatHeaders.forEach((header) => {
72
- if (header.sticky === 'right') {
73
- hasRightStickyColumn = true;
34
+ if (action.type === react_table_1.actions.setScrolledRight &&
35
+ newState.sticky?.isScrolledToRight !== action.value // Prevents unnecessary re-render
36
+ ) {
37
+ return {
38
+ ...newState,
39
+ sticky: {
40
+ ...newState.sticky,
41
+ isScrolledToRight: action.value,
42
+ },
43
+ };
74
44
  }
75
- if (hasRightStickyColumn) {
76
- header.sticky = 'right';
77
- }
78
- });
45
+ return newState;
46
+ };
47
+ const useInstance = (instance) => {
48
+ const { flatHeaders } = instance;
49
+ // Edge case. Saving original sticky state in case sticky columns are reordered.
50
+ flatHeaders.forEach((header) => {
51
+ if (!header.originalSticky) {
52
+ header.originalSticky = header.sticky ?? 'none';
53
+ }
54
+ header.sticky =
55
+ header.originalSticky === 'none' ? undefined : header.originalSticky;
56
+ });
57
+ // If there is a column that is sticked to the left, make every column prior to that sticky too.
58
+ let hasLeftStickyColumn = false;
59
+ [...flatHeaders].reverse().forEach((header) => {
60
+ if (header.sticky === 'left') {
61
+ hasLeftStickyColumn = true;
62
+ }
63
+ if (hasLeftStickyColumn) {
64
+ header.sticky = 'left';
65
+ }
66
+ });
67
+ // If there is a column that is sticked to the right, make every column after to that sticky too.
68
+ let hasRightStickyColumn = false;
69
+ flatHeaders.forEach((header) => {
70
+ if (header.sticky === 'right') {
71
+ hasRightStickyColumn = true;
72
+ }
73
+ if (hasRightStickyColumn) {
74
+ header.sticky = 'right';
75
+ }
76
+ });
79
77
  };
@@ -1,110 +1,103 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useSubRowFiltering = 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 defaultFilterFunctions_js_1 = require('../filters/defaultFilterFunctions.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const defaultFilterFunctions_js_1 = require("../filters/defaultFilterFunctions.js");
11
11
  const useSubRowFiltering = (hasAnySubRows) => (hooks) => {
12
- hooks.useInstance.push(useInstance.bind({}, hasAnySubRows));
12
+ hooks.useInstance.push(useInstance.bind({}, hasAnySubRows));
13
13
  };
14
14
  exports.useSubRowFiltering = useSubRowFiltering;
15
15
  const useInstance = (hasAnySubRows, instance) => {
16
- // There is a bug in react-table that filtered out sub-rows won't be shown after clearing the filter.
17
- // Therefore saving original sub-rows separately.
18
- // Related issue: https://github.com/tannerlinsley/react-table/issues/2928
19
- const setInitialSubRows = (rows) => {
20
- rows.forEach((row) => {
21
- if (!row.initialSubRows) {
22
- row.initialSubRows = row.subRows;
23
- }
24
- setInitialSubRows(row.subRows);
25
- });
26
- };
27
- setInitialSubRows(instance.initialRows);
28
- const {
29
- filteredRows = instance.filteredRows,
30
- filteredFlatRows = instance.filteredFlatRows,
31
- filteredRowsById = instance.filteredRowsById,
32
- } = React.useMemo(() => {
33
- if (!hasAnySubRows) {
34
- return {};
35
- }
36
- // Restore original sub-rows
37
- const setSubRows = (rows) => {
38
- rows.forEach((row) => {
39
- row.subRows = row.initialSubRows ?? [];
40
- setSubRows(row.subRows);
41
- });
16
+ // There is a bug in react-table that filtered out sub-rows won't be shown after clearing the filter.
17
+ // Therefore saving original sub-rows separately.
18
+ // Related issue: https://github.com/tannerlinsley/react-table/issues/2928
19
+ const setInitialSubRows = (rows) => {
20
+ rows.forEach((row) => {
21
+ if (!row.initialSubRows) {
22
+ row.initialSubRows = row.subRows;
23
+ }
24
+ setInitialSubRows(row.subRows);
25
+ });
42
26
  };
43
- setSubRows(instance.initialRows);
44
- let currentlyFilteredRows = [...instance.initialRows];
45
- instance.state.filters.forEach(({ id: columnId, value: filterValue }) => {
46
- const column = instance.allColumns.find((c) => c.id === columnId);
47
- if (!column) {
48
- return;
49
- }
50
- const filterTypes = {
51
- ...defaultFilterFunctions_js_1.defaultFilterFunctions,
52
- ...instance.filterTypes,
53
- };
54
- const filterFn =
55
- typeof column.filter === 'function'
56
- ? column.filter
57
- : filterTypes[column.filter ?? 'text'];
58
- currentlyFilteredRows = currentlyFilteredRows.filter((row) =>
59
- handleRowFiltering(row, filterFn, columnId, filterValue),
60
- );
27
+ setInitialSubRows(instance.initialRows);
28
+ const { filteredRows = instance.filteredRows, filteredFlatRows = instance.filteredFlatRows, filteredRowsById = instance.filteredRowsById, } = React.useMemo(() => {
29
+ if (!hasAnySubRows) {
30
+ return {};
31
+ }
32
+ // Restore original sub-rows
33
+ const setSubRows = (rows) => {
34
+ rows.forEach((row) => {
35
+ row.subRows = row.initialSubRows ?? [];
36
+ setSubRows(row.subRows);
37
+ });
38
+ };
39
+ setSubRows(instance.initialRows);
40
+ let currentlyFilteredRows = [...instance.initialRows];
41
+ instance.state.filters.forEach(({ id: columnId, value: filterValue }) => {
42
+ const column = instance.allColumns.find((c) => c.id === columnId);
43
+ if (!column) {
44
+ return;
45
+ }
46
+ const filterTypes = {
47
+ ...defaultFilterFunctions_js_1.defaultFilterFunctions,
48
+ ...instance.filterTypes,
49
+ };
50
+ const filterFn = typeof column.filter === 'function'
51
+ ? column.filter
52
+ : filterTypes[column.filter ?? 'text'];
53
+ currentlyFilteredRows = currentlyFilteredRows.filter((row) => handleRowFiltering(row, filterFn, columnId, filterValue));
54
+ });
55
+ const filteredRows = [];
56
+ const filteredFlatRows = [];
57
+ const filteredRowsById = {};
58
+ // Setting rows here helps to keep them ordered.
59
+ const populateRows = (row) => {
60
+ if (row.depth === 0) {
61
+ filteredRows.push(row);
62
+ }
63
+ filteredFlatRows.push(row);
64
+ filteredRowsById[row.id] = row;
65
+ if (row.subRows.length) {
66
+ row.subRows.forEach((r) => populateRows(r));
67
+ }
68
+ };
69
+ currentlyFilteredRows.forEach((row) => populateRows(row));
70
+ return { filteredRows, filteredFlatRows, filteredRowsById };
71
+ }, [
72
+ instance.allColumns,
73
+ instance.filterTypes,
74
+ instance.initialRows,
75
+ instance.state.filters,
76
+ hasAnySubRows,
77
+ ]);
78
+ Object.assign(instance, {
79
+ filteredRows,
80
+ filteredFlatRows,
81
+ filteredRowsById,
82
+ rows: filteredRows,
83
+ flatRows: filteredFlatRows,
84
+ rowsById: filteredRowsById,
61
85
  });
62
- const filteredRows = [];
63
- const filteredFlatRows = [];
64
- const filteredRowsById = {};
65
- // Setting rows here helps to keep them ordered.
66
- const populateRows = (row) => {
67
- if (row.depth === 0) {
68
- filteredRows.push(row);
69
- }
70
- filteredFlatRows.push(row);
71
- filteredRowsById[row.id] = row;
72
- if (row.subRows.length) {
73
- row.subRows.forEach((r) => populateRows(r));
74
- }
75
- };
76
- currentlyFilteredRows.forEach((row) => populateRows(row));
77
- return { filteredRows, filteredFlatRows, filteredRowsById };
78
- }, [
79
- instance.allColumns,
80
- instance.filterTypes,
81
- instance.initialRows,
82
- instance.state.filters,
83
- hasAnySubRows,
84
- ]);
85
- Object.assign(instance, {
86
- filteredRows,
87
- filteredFlatRows,
88
- filteredRowsById,
89
- rows: filteredRows,
90
- flatRows: filteredFlatRows,
91
- rowsById: filteredRowsById,
92
- });
93
86
  };
94
87
  const handleRowFiltering = (row, filterFn, columnId, filterValue) => {
95
- let hasFilteredSubRows = false;
96
- row.subRows = row.initialSubRows.filter((subRow) => {
97
- const result = handleRowFiltering(subRow, filterFn, columnId, filterValue);
98
- if (result) {
99
- hasFilteredSubRows = true;
88
+ let hasFilteredSubRows = false;
89
+ row.subRows = row.initialSubRows.filter((subRow) => {
90
+ const result = handleRowFiltering(subRow, filterFn, columnId, filterValue);
91
+ if (result) {
92
+ hasFilteredSubRows = true;
93
+ }
94
+ return result;
95
+ });
96
+ // If row has any sub-rows that meet filter conditions,
97
+ // then that row also needs to be shown.
98
+ if (hasFilteredSubRows) {
99
+ return true;
100
100
  }
101
- return result;
102
- });
103
- // If row has any sub-rows that meet filter conditions,
104
- // then that row also needs to be shown.
105
- if (hasFilteredSubRows) {
106
- return true;
107
- }
108
- const result = filterFn([row], [columnId], filterValue);
109
- return !!result.length;
101
+ const result = filterFn([row], [columnId], filterValue);
102
+ return !!result.length;
110
103
  };
@@ -1,42 +1,41 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useSubRowSelection = 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 useSubRowSelection = (hooks) => {
11
- hooks.useInstance.push(useInstance);
11
+ hooks.useInstance.push(useInstance);
12
12
  };
13
13
  exports.useSubRowSelection = useSubRowSelection;
14
14
  const useInstance = (instance) => {
15
- const selectedFlatRows = React.useMemo(() => {
16
- const selectedFlatRows = [];
17
- const setSelectionState = (row, selectedRowIds) => {
18
- let isSomeSubRowsSelected = false;
19
- row.subRows.forEach((subRow) => {
20
- setSelectionState(subRow, selectedRowIds);
21
- if (subRow.isSelected || subRow.isSomeSelected) {
22
- isSomeSubRowsSelected = true;
23
- }
24
- });
25
- if (selectedRowIds[row.id]) {
26
- row.isSelected = true;
27
- row.isSomeSelected = false;
28
- selectedFlatRows.push(row);
29
- } else {
30
- row.isSelected = false;
31
- row.isSomeSelected = isSomeSubRowsSelected;
32
- }
33
- };
34
- instance.rows.forEach((row) =>
35
- setSelectionState(row, instance.state.selectedRowIds),
36
- );
37
- return selectedFlatRows;
38
- }, [instance.rows, instance.state.selectedRowIds]);
39
- Object.assign(instance, {
40
- selectedFlatRows,
41
- });
15
+ const selectedFlatRows = React.useMemo(() => {
16
+ const selectedFlatRows = [];
17
+ const setSelectionState = (row, selectedRowIds) => {
18
+ let isSomeSubRowsSelected = false;
19
+ row.subRows.forEach((subRow) => {
20
+ setSelectionState(subRow, selectedRowIds);
21
+ if (subRow.isSelected || subRow.isSomeSelected) {
22
+ isSomeSubRowsSelected = true;
23
+ }
24
+ });
25
+ if (selectedRowIds[row.id]) {
26
+ row.isSelected = true;
27
+ row.isSomeSelected = false;
28
+ selectedFlatRows.push(row);
29
+ }
30
+ else {
31
+ row.isSelected = false;
32
+ row.isSomeSelected = isSomeSubRowsSelected;
33
+ }
34
+ };
35
+ instance.rows.forEach((row) => setSelectionState(row, instance.state.selectedRowIds));
36
+ return selectedFlatRows;
37
+ }, [instance.rows, instance.state.selectedRowIds]);
38
+ Object.assign(instance, {
39
+ selectedFlatRows,
40
+ });
42
41
  };
@@ -1,83 +1,23 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
3
- exports.SelectionColumn =
4
- exports.ExpanderColumn =
5
- exports.ActionColumn =
6
- exports.TablePaginator =
7
- exports.EditableCell =
8
- exports.DefaultCell =
9
- exports.tableFilters =
10
- exports.FilterButtonBar =
11
- exports.BaseFilter =
12
- exports.Table =
13
- void 0;
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SelectionColumn = exports.ExpanderColumn = exports.ActionColumn = exports.TablePaginator = exports.EditableCell = exports.DefaultCell = exports.tableFilters = exports.FilterButtonBar = exports.BaseFilter = exports.Table = void 0;
14
4
  /*---------------------------------------------------------------------------------------------
15
5
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
16
6
  * See LICENSE.md in the project root for license terms and full copyright notice.
17
7
  *--------------------------------------------------------------------------------------------*/
18
- var Table_js_1 = require('./Table.js');
19
- Object.defineProperty(exports, 'Table', {
20
- enumerable: true,
21
- get: function () {
22
- return Table_js_1.Table;
23
- },
24
- });
25
- var index_js_1 = require('./filters/index.js');
26
- Object.defineProperty(exports, 'BaseFilter', {
27
- enumerable: true,
28
- get: function () {
29
- return index_js_1.BaseFilter;
30
- },
31
- });
32
- Object.defineProperty(exports, 'FilterButtonBar', {
33
- enumerable: true,
34
- get: function () {
35
- return index_js_1.FilterButtonBar;
36
- },
37
- });
38
- Object.defineProperty(exports, 'tableFilters', {
39
- enumerable: true,
40
- get: function () {
41
- return index_js_1.tableFilters;
42
- },
43
- });
44
- var index_js_2 = require('./cells/index.js');
45
- Object.defineProperty(exports, 'DefaultCell', {
46
- enumerable: true,
47
- get: function () {
48
- return index_js_2.DefaultCell;
49
- },
50
- });
51
- Object.defineProperty(exports, 'EditableCell', {
52
- enumerable: true,
53
- get: function () {
54
- return index_js_2.EditableCell;
55
- },
56
- });
57
- var TablePaginator_js_1 = require('./TablePaginator.js');
58
- Object.defineProperty(exports, 'TablePaginator', {
59
- enumerable: true,
60
- get: function () {
61
- return TablePaginator_js_1.TablePaginator;
62
- },
63
- });
64
- var index_js_3 = require('./columns/index.js');
65
- Object.defineProperty(exports, 'ActionColumn', {
66
- enumerable: true,
67
- get: function () {
68
- return index_js_3.ActionColumn;
69
- },
70
- });
71
- Object.defineProperty(exports, 'ExpanderColumn', {
72
- enumerable: true,
73
- get: function () {
74
- return index_js_3.ExpanderColumn;
75
- },
76
- });
77
- Object.defineProperty(exports, 'SelectionColumn', {
78
- enumerable: true,
79
- get: function () {
80
- return index_js_3.SelectionColumn;
81
- },
82
- });
8
+ var Table_js_1 = require("./Table.js");
9
+ Object.defineProperty(exports, "Table", { enumerable: true, get: function () { return Table_js_1.Table; } });
10
+ var index_js_1 = require("./filters/index.js");
11
+ Object.defineProperty(exports, "BaseFilter", { enumerable: true, get: function () { return index_js_1.BaseFilter; } });
12
+ Object.defineProperty(exports, "FilterButtonBar", { enumerable: true, get: function () { return index_js_1.FilterButtonBar; } });
13
+ Object.defineProperty(exports, "tableFilters", { enumerable: true, get: function () { return index_js_1.tableFilters; } });
14
+ var index_js_2 = require("./cells/index.js");
15
+ Object.defineProperty(exports, "DefaultCell", { enumerable: true, get: function () { return index_js_2.DefaultCell; } });
16
+ Object.defineProperty(exports, "EditableCell", { enumerable: true, get: function () { return index_js_2.EditableCell; } });
17
+ var TablePaginator_js_1 = require("./TablePaginator.js");
18
+ Object.defineProperty(exports, "TablePaginator", { enumerable: true, get: function () { return TablePaginator_js_1.TablePaginator; } });
19
+ var index_js_3 = require("./columns/index.js");
20
+ Object.defineProperty(exports, "ActionColumn", { enumerable: true, get: function () { return index_js_3.ActionColumn; } });
21
+ Object.defineProperty(exports, "ExpanderColumn", { enumerable: true, get: function () { return index_js_3.ExpanderColumn; } });
22
+ Object.defineProperty(exports, "SelectionColumn", { enumerable: true, get: function () { return index_js_3.SelectionColumn; } });
83
23
  exports.default = './Table';