@itwin/itwinui-react 3.0.3 → 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 (498) hide show
  1. package/CHANGELOG.md +14 -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 -282
  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.d.ts +3 -5
  161. package/cjs/core/Tabs/Tabs.js +235 -422
  162. package/cjs/core/Tag/Tag.js +15 -42
  163. package/cjs/core/Tag/TagContainer.js +11 -23
  164. package/cjs/core/Textarea/Textarea.js +6 -11
  165. package/cjs/core/ThemeProvider/ThemeContext.js +4 -4
  166. package/cjs/core/ThemeProvider/ThemeProvider.js +52 -105
  167. package/cjs/core/Tile/Tile.js +230 -410
  168. package/cjs/core/TimePicker/TimePicker.js +234 -458
  169. package/cjs/core/Toast/Toast.js +107 -204
  170. package/cjs/core/Toast/Toaster.js +77 -103
  171. package/cjs/core/ToggleSwitch/ToggleSwitch.js +23 -66
  172. package/cjs/core/Tooltip/Tooltip.js +91 -137
  173. package/cjs/core/TransferList/TransferList.js +103 -177
  174. package/cjs/core/Tree/Tree.js +129 -204
  175. package/cjs/core/Tree/TreeContext.js +9 -9
  176. package/cjs/core/Tree/TreeNode.js +104 -207
  177. package/cjs/core/Tree/TreeNodeExpander.js +12 -26
  178. package/cjs/core/Typography/Anchor.js +3 -3
  179. package/cjs/core/Typography/Blockquote.js +10 -18
  180. package/cjs/core/Typography/Code.js +3 -3
  181. package/cjs/core/Typography/Kbd.js +21 -30
  182. package/cjs/core/Typography/Text.js +13 -26
  183. package/cjs/core/VisuallyHidden/VisuallyHidden.js +8 -14
  184. package/cjs/core/utils/color/ColorValue.js +453 -535
  185. package/cjs/core/utils/color/index.js +4 -4
  186. package/cjs/core/utils/components/AutoclearingHiddenLiveRegion.js +13 -20
  187. package/cjs/core/utils/components/Box.js +3 -3
  188. package/cjs/core/utils/components/ButtonBase.js +20 -38
  189. package/cjs/core/utils/components/FocusTrap.js +38 -47
  190. package/cjs/core/utils/components/InputContainer.js +19 -58
  191. package/cjs/core/utils/components/InputFlexContainer.js +8 -24
  192. package/cjs/core/utils/components/MiddleTextTruncation.js +22 -32
  193. package/cjs/core/utils/components/Portal.js +20 -22
  194. package/cjs/core/utils/components/Resizer.js +196 -253
  195. package/cjs/core/utils/components/VirtualScroll.js +223 -304
  196. package/cjs/core/utils/components/WithCSSTransition.js +32 -49
  197. package/cjs/core/utils/components/index.js +14 -14
  198. package/cjs/core/utils/functions/colors.js +22 -25
  199. package/cjs/core/utils/functions/date.js +10 -10
  200. package/cjs/core/utils/functions/dev.js +14 -13
  201. package/cjs/core/utils/functions/dom.js +17 -24
  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.js +9 -9
  206. package/cjs/core/utils/functions/polymorphic.js +30 -43
  207. package/cjs/core/utils/functions/react.js +24 -26
  208. package/cjs/core/utils/functions/supports.js +4 -5
  209. package/cjs/core/utils/hooks/index.js +17 -17
  210. package/cjs/core/utils/hooks/useContainerWidth.js +19 -26
  211. package/cjs/core/utils/hooks/useControlledState.js +12 -21
  212. package/cjs/core/utils/hooks/useDragAndDrop.js +87 -110
  213. package/cjs/core/utils/hooks/useEventListener.js +22 -22
  214. package/cjs/core/utils/hooks/useGlobals.js +27 -33
  215. package/cjs/core/utils/hooks/useId.js +8 -9
  216. package/cjs/core/utils/hooks/useIntersection.js +24 -30
  217. package/cjs/core/utils/hooks/useIsClient.js +9 -9
  218. package/cjs/core/utils/hooks/useIsomorphicLayoutEffect.js +5 -6
  219. package/cjs/core/utils/hooks/useLatestRef.js +9 -9
  220. package/cjs/core/utils/hooks/useMediaQuery.js +31 -31
  221. package/cjs/core/utils/hooks/useMergedRefs.js +16 -15
  222. package/cjs/core/utils/hooks/useOverflow.js +57 -70
  223. package/cjs/core/utils/hooks/useResizeObserver.js +17 -22
  224. package/cjs/core/utils/hooks/useSafeContext.js +9 -9
  225. package/cjs/core/utils/icons/StatusIconMap.js +12 -28
  226. package/cjs/core/utils/icons/Svg.js +3 -3
  227. package/cjs/core/utils/icons/SvgCalendar.js +7 -12
  228. package/cjs/core/utils/icons/SvgCaretDownSmall.js +7 -12
  229. package/cjs/core/utils/icons/SvgCaretRightSmall.js +7 -12
  230. package/cjs/core/utils/icons/SvgCaretUpSmall.js +7 -12
  231. package/cjs/core/utils/icons/SvgCheckmark.js +7 -10
  232. package/cjs/core/utils/icons/SvgCheckmarkSmall.js +7 -12
  233. package/cjs/core/utils/icons/SvgChevronLeft.js +7 -12
  234. package/cjs/core/utils/icons/SvgChevronLeftDouble.js +7 -12
  235. package/cjs/core/utils/icons/SvgChevronRight.js +7 -12
  236. package/cjs/core/utils/icons/SvgChevronRightDouble.js +7 -12
  237. package/cjs/core/utils/icons/SvgClose.js +7 -12
  238. package/cjs/core/utils/icons/SvgCloseSmall.js +7 -12
  239. package/cjs/core/utils/icons/SvgColumnManager.js +7 -12
  240. package/cjs/core/utils/icons/SvgDocument.js +7 -10
  241. package/cjs/core/utils/icons/SvgFilter.js +7 -10
  242. package/cjs/core/utils/icons/SvgFilterHollow.js +7 -12
  243. package/cjs/core/utils/icons/SvgImportantSmall.js +7 -12
  244. package/cjs/core/utils/icons/SvgInfoCircular.js +7 -12
  245. package/cjs/core/utils/icons/SvgMore.js +7 -12
  246. package/cjs/core/utils/icons/SvgMoreVertical.js +7 -12
  247. package/cjs/core/utils/icons/SvgNew.js +7 -12
  248. package/cjs/core/utils/icons/SvgSearch.js +7 -12
  249. package/cjs/core/utils/icons/SvgSmileyHappy.js +7 -12
  250. package/cjs/core/utils/icons/SvgSortDown.js +7 -12
  251. package/cjs/core/utils/icons/SvgSortUp.js +7 -12
  252. package/cjs/core/utils/icons/SvgStatusError.js +7 -12
  253. package/cjs/core/utils/icons/SvgStatusSuccess.js +7 -12
  254. package/cjs/core/utils/icons/SvgStatusWarning.js +7 -12
  255. package/cjs/core/utils/icons/SvgSwap.js +7 -12
  256. package/cjs/core/utils/icons/SvgUpload.js +7 -12
  257. package/cjs/core/utils/icons/index.js +34 -34
  258. package/cjs/core/utils/index.js +10 -10
  259. package/cjs/core/utils/props.js +2 -2
  260. package/cjs/core/utils/types.js +2 -2
  261. package/cjs/index.js +229 -949
  262. package/cjs/react-table/react-table.js +2 -2
  263. package/cjs/styles.js +412 -425
  264. package/esm/core/Alert/Alert.js +39 -106
  265. package/esm/core/Avatar/Avatar.js +14 -42
  266. package/esm/core/AvatarGroup/AvatarGroup.js +20 -58
  267. package/esm/core/Backdrop/Backdrop.js +2 -10
  268. package/esm/core/Badge/Badge.js +16 -31
  269. package/esm/core/Breadcrumbs/Breadcrumbs.js +55 -135
  270. package/esm/core/ButtonGroup/ButtonGroup.js +25 -61
  271. package/esm/core/Buttons/Button.js +5 -45
  272. package/esm/core/Buttons/DropdownButton.js +7 -37
  273. package/esm/core/Buttons/IconButton.js +5 -40
  274. package/esm/core/Buttons/IdeasButton.js +2 -12
  275. package/esm/core/Buttons/SplitButton.js +34 -101
  276. package/esm/core/Carousel/Carousel.js +43 -72
  277. package/esm/core/Carousel/CarouselDot.js +6 -17
  278. package/esm/core/Carousel/CarouselDotsList.js +85 -147
  279. package/esm/core/Carousel/CarouselNavigation.js +32 -68
  280. package/esm/core/Carousel/CarouselSlide.js +19 -41
  281. package/esm/core/Carousel/CarouselSlider.js +41 -65
  282. package/esm/core/Checkbox/Checkbox.js +25 -78
  283. package/esm/core/ColorPicker/ColorBuilder.js +167 -280
  284. package/esm/core/ColorPicker/ColorInputPanel.js +237 -395
  285. package/esm/core/ColorPicker/ColorPalette.js +14 -35
  286. package/esm/core/ColorPicker/ColorPicker.js +46 -79
  287. package/esm/core/ColorPicker/ColorPickerContext.js +5 -7
  288. package/esm/core/ColorPicker/ColorSwatch.js +7 -24
  289. package/esm/core/ComboBox/ComboBox.js +267 -396
  290. package/esm/core/ComboBox/ComboBoxEndIcon.js +5 -18
  291. package/esm/core/ComboBox/ComboBoxInput.js +125 -197
  292. package/esm/core/ComboBox/ComboBoxInputContainer.js +5 -20
  293. package/esm/core/ComboBox/ComboBoxMenu.js +37 -77
  294. package/esm/core/ComboBox/ComboBoxMenuItem.js +14 -61
  295. package/esm/core/ComboBox/ComboBoxMultipleContainer.js +2 -6
  296. package/esm/core/ComboBox/helpers.js +38 -38
  297. package/esm/core/DatePicker/DatePicker.js +326 -555
  298. package/esm/core/Dialog/Dialog.js +24 -53
  299. package/esm/core/Dialog/DialogBackdrop.js +19 -39
  300. package/esm/core/Dialog/DialogContent.js +12 -20
  301. package/esm/core/Dialog/DialogContext.js +1 -1
  302. package/esm/core/Dialog/DialogDragContext.js +4 -4
  303. package/esm/core/Dialog/DialogMain.js +107 -177
  304. package/esm/core/Dialog/DialogTitleBar.js +10 -45
  305. package/esm/core/Divider/Divider.js +2 -8
  306. package/esm/core/DropdownMenu/DropdownMenu.js +40 -75
  307. package/esm/core/ExpandableBlock/ExpandableBlock.js +92 -193
  308. package/esm/core/Fieldset/Fieldset.js +8 -19
  309. package/esm/core/FileUpload/FileEmptyCard.js +8 -19
  310. package/esm/core/FileUpload/FileUpload.js +36 -72
  311. package/esm/core/FileUpload/FileUploadCard.js +76 -153
  312. package/esm/core/FileUpload/FileUploadTemplate.js +9 -37
  313. package/esm/core/Flex/Flex.js +71 -87
  314. package/esm/core/Footer/Footer.js +55 -86
  315. package/esm/core/Footer/FooterSeparator.js +1 -1
  316. package/esm/core/Header/Header.js +14 -55
  317. package/esm/core/Header/HeaderBasicButton.js +7 -15
  318. package/esm/core/Header/HeaderBreadcrumbs.js +8 -32
  319. package/esm/core/Header/HeaderButton.js +14 -62
  320. package/esm/core/Header/HeaderDropdownButton.js +13 -42
  321. package/esm/core/Header/HeaderLogo.js +5 -36
  322. package/esm/core/Header/HeaderSplitButton.js +14 -61
  323. package/esm/core/Icon/Icon.js +12 -26
  324. package/esm/core/InformationPanel/InformationPanel.js +36 -71
  325. package/esm/core/InformationPanel/InformationPanelContent.js +3 -17
  326. package/esm/core/InformationPanel/InformationPanelHeader.js +8 -32
  327. package/esm/core/InformationPanel/InformationPanelWrapper.js +1 -3
  328. package/esm/core/Input/Input.js +4 -12
  329. package/esm/core/InputGrid/InputGrid.js +2 -11
  330. package/esm/core/InputGroup/InputGroup.js +16 -57
  331. package/esm/core/InputWithDecorations/InputWithDecorations.js +11 -42
  332. package/esm/core/Label/Label.js +5 -26
  333. package/esm/core/LabeledInput/LabeledInput.js +10 -63
  334. package/esm/core/LabeledSelect/LabeledSelect.js +18 -67
  335. package/esm/core/LabeledTextarea/LabeledTextarea.js +2 -8
  336. package/esm/core/List/ListItem.js +28 -46
  337. package/esm/core/Menu/Menu.js +48 -64
  338. package/esm/core/Menu/MenuDivider.js +1 -1
  339. package/esm/core/Menu/MenuExtraContent.js +1 -1
  340. package/esm/core/Menu/MenuItem.js +84 -164
  341. package/esm/core/Menu/MenuItemSkeleton.js +12 -43
  342. package/esm/core/Modal/Modal.js +6 -33
  343. package/esm/core/NonIdealState/ErrorPage.js +123 -173
  344. package/esm/core/NonIdealState/NonIdealState.js +6 -65
  345. package/esm/core/NotificationMarker/NotificationMarker.js +2 -20
  346. package/esm/core/Overlay/Overlay.d.ts +20 -24
  347. package/esm/core/Overlay/Overlay.js +45 -55
  348. package/esm/core/Popover/Popover.js +80 -172
  349. package/esm/core/ProgressIndicators/ProgressLinear.js +5 -40
  350. package/esm/core/ProgressIndicators/ProgressRadial.js +14 -40
  351. package/esm/core/Radio/Radio.js +6 -45
  352. package/esm/core/RadioTiles/RadioTile.js +8 -62
  353. package/esm/core/RadioTiles/RadioTileGroup.js +3 -10
  354. package/esm/core/SearchBox/SearchBox.js +97 -214
  355. package/esm/core/Select/Select.js +130 -271
  356. package/esm/core/Select/SelectTag.js +3 -15
  357. package/esm/core/Select/SelectTagContainer.js +7 -20
  358. package/esm/core/SideNavigation/SideNavigation.js +21 -118
  359. package/esm/core/SideNavigation/SidenavButton.js +2 -24
  360. package/esm/core/SideNavigation/SidenavSubmenu.js +3 -14
  361. package/esm/core/SideNavigation/SidenavSubmenuHeader.js +4 -20
  362. package/esm/core/SkipToContentLink/SkipToContentLink.js +2 -11
  363. package/esm/core/Slider/Slider.js +187 -340
  364. package/esm/core/Slider/Thumb.js +50 -97
  365. package/esm/core/Slider/Track.js +49 -74
  366. package/esm/core/StatusMessage/StatusMessage.js +5 -23
  367. package/esm/core/Stepper/Stepper.js +14 -70
  368. package/esm/core/Stepper/StepperStep.js +29 -92
  369. package/esm/core/Stepper/WorkflowDiagram.js +8 -21
  370. package/esm/core/Stepper/WorkflowDiagramStep.js +4 -22
  371. package/esm/core/Surface/Surface.js +48 -84
  372. package/esm/core/Table/SubRowExpander.js +9 -31
  373. package/esm/core/Table/Table.js +408 -763
  374. package/esm/core/Table/TableCell.js +53 -87
  375. package/esm/core/Table/TablePaginator.js +125 -306
  376. package/esm/core/Table/TableRowMemoized.js +58 -129
  377. package/esm/core/Table/actionHandlers/expandHandler.js +10 -10
  378. package/esm/core/Table/actionHandlers/filterHandler.js +15 -23
  379. package/esm/core/Table/actionHandlers/index.js +1 -5
  380. package/esm/core/Table/actionHandlers/resizeHandler.js +11 -11
  381. package/esm/core/Table/actionHandlers/selectHandler.js +95 -122
  382. package/esm/core/Table/cells/DefaultCell.js +7 -42
  383. package/esm/core/Table/cells/EditableCell.js +41 -70
  384. package/esm/core/Table/columns/actionColumn.js +55 -85
  385. package/esm/core/Table/columns/expanderColumn.js +25 -39
  386. package/esm/core/Table/columns/selectionColumn.js +23 -51
  387. package/esm/core/Table/filters/BaseFilter.js +7 -15
  388. package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.js +42 -107
  389. package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.js +52 -110
  390. package/esm/core/Table/filters/FilterButtonBar.js +9 -28
  391. package/esm/core/Table/filters/FilterToggle.js +18 -51
  392. package/esm/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js +28 -50
  393. package/esm/core/Table/filters/TextFilter/TextFilter.js +20 -32
  394. package/esm/core/Table/filters/customFilterFunctions.js +12 -14
  395. package/esm/core/Table/filters/defaultFilterFunctions.js +79 -84
  396. package/esm/core/Table/filters/tableFilters.js +25 -34
  397. package/esm/core/Table/hooks/useColumnDragAndDrop.js +81 -88
  398. package/esm/core/Table/hooks/useExpanderCell.js +20 -26
  399. package/esm/core/Table/hooks/useResizeColumns.js +287 -353
  400. package/esm/core/Table/hooks/useScrollToRow.js +34 -42
  401. package/esm/core/Table/hooks/useSelectionCell.js +6 -10
  402. package/esm/core/Table/hooks/useStickyColumns.js +59 -61
  403. package/esm/core/Table/hooks/useSubRowFiltering.js +83 -90
  404. package/esm/core/Table/hooks/useSubRowSelection.js +27 -28
  405. package/esm/core/Table/index.js +1 -5
  406. package/esm/core/Table/utils.js +38 -40
  407. package/esm/core/Tabs/Tabs.d.ts +3 -5
  408. package/esm/core/Tabs/Tabs.js +229 -406
  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 -83
  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 +191 -249
  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.js +14 -17
  443. package/esm/core/utils/functions/focusable.js +15 -24
  444. package/esm/core/utils/functions/import.js +2 -4
  445. package/esm/core/utils/functions/numbers.js +7 -7
  446. package/esm/core/utils/functions/polymorphic.js +23 -32
  447. package/esm/core/utils/functions/react.js +19 -21
  448. package/esm/core/utils/functions/supports.js +1 -2
  449. package/esm/core/utils/hooks/useContainerWidth.js +13 -16
  450. package/esm/core/utils/hooks/useControlledState.js +8 -17
  451. package/esm/core/utils/hooks/useDragAndDrop.js +80 -99
  452. package/esm/core/utils/hooks/useEventListener.js +18 -18
  453. package/esm/core/utils/hooks/useGlobals.js +21 -27
  454. package/esm/core/utils/hooks/useId.js +3 -3
  455. package/esm/core/utils/hooks/useIntersection.js +19 -25
  456. package/esm/core/utils/hooks/useIsClient.js +5 -5
  457. package/esm/core/utils/hooks/useIsomorphicLayoutEffect.js +1 -2
  458. package/esm/core/utils/hooks/useLatestRef.js +5 -5
  459. package/esm/core/utils/hooks/useMediaQuery.js +25 -23
  460. package/esm/core/utils/hooks/useMergedRefs.js +12 -11
  461. package/esm/core/utils/hooks/useOverflow.js +51 -63
  462. package/esm/core/utils/hooks/useResizeObserver.js +12 -17
  463. package/esm/core/utils/hooks/useSafeContext.js +5 -5
  464. package/esm/core/utils/icons/StatusIconMap.js +4 -8
  465. package/esm/core/utils/icons/SvgCalendar.js +2 -7
  466. package/esm/core/utils/icons/SvgCaretDownSmall.js +2 -7
  467. package/esm/core/utils/icons/SvgCaretRightSmall.js +2 -7
  468. package/esm/core/utils/icons/SvgCaretUpSmall.js +2 -7
  469. package/esm/core/utils/icons/SvgCheckmark.js +2 -5
  470. package/esm/core/utils/icons/SvgCheckmarkSmall.js +2 -7
  471. package/esm/core/utils/icons/SvgChevronLeft.js +2 -7
  472. package/esm/core/utils/icons/SvgChevronLeftDouble.js +2 -7
  473. package/esm/core/utils/icons/SvgChevronRight.js +2 -7
  474. package/esm/core/utils/icons/SvgChevronRightDouble.js +2 -7
  475. package/esm/core/utils/icons/SvgClose.js +2 -7
  476. package/esm/core/utils/icons/SvgCloseSmall.js +2 -7
  477. package/esm/core/utils/icons/SvgColumnManager.js +2 -7
  478. package/esm/core/utils/icons/SvgDocument.js +2 -5
  479. package/esm/core/utils/icons/SvgFilter.js +2 -5
  480. package/esm/core/utils/icons/SvgFilterHollow.js +2 -7
  481. package/esm/core/utils/icons/SvgImportantSmall.js +2 -7
  482. package/esm/core/utils/icons/SvgInfoCircular.js +2 -7
  483. package/esm/core/utils/icons/SvgMore.js +2 -7
  484. package/esm/core/utils/icons/SvgMoreVertical.js +2 -7
  485. package/esm/core/utils/icons/SvgNew.js +2 -7
  486. package/esm/core/utils/icons/SvgSearch.js +2 -7
  487. package/esm/core/utils/icons/SvgSmileyHappy.js +2 -7
  488. package/esm/core/utils/icons/SvgSortDown.js +2 -7
  489. package/esm/core/utils/icons/SvgSortUp.js +2 -7
  490. package/esm/core/utils/icons/SvgStatusError.js +2 -7
  491. package/esm/core/utils/icons/SvgStatusSuccess.js +2 -7
  492. package/esm/core/utils/icons/SvgStatusWarning.js +2 -7
  493. package/esm/core/utils/icons/SvgSwap.js +2 -7
  494. package/esm/core/utils/icons/SvgUpload.js +2 -7
  495. package/esm/index.js +3 -21
  496. package/esm/styles.js +414 -425
  497. package/package.json +2 -2
  498. 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';