@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,14 +1,14 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InformationPanel = 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 classnames_1 = tslib_1.__importDefault(require('classnames'));
10
- const React = tslib_1.__importStar(require('react'));
11
- const index_js_1 = require('../utils/index.js');
9
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
10
+ const React = tslib_1.__importStar(require("react"));
11
+ const index_js_1 = require("../utils/index.js");
12
12
  /**
13
13
  * InformationPanel provides a way to view additional content or attributes
14
14
  * without leaving the main content area (e.g. Table).
@@ -31,76 +31,41 @@ const index_js_1 = require('../utils/index.js');
31
31
  * </InformationPanelWrapper>
32
32
  */
33
33
  exports.InformationPanel = React.forwardRef((props, ref) => {
34
- const {
35
- className,
36
- isOpen = false,
37
- orientation = 'vertical',
38
- resizable = true,
39
- children,
40
- ...rest
41
- } = props;
42
- const infoPanelRef = React.useRef(null);
43
- const refs = (0, index_js_1.useMergedRefs)(ref, infoPanelRef);
44
- const startResize = (e) => {
45
- if (!infoPanelRef.current) {
46
- return;
47
- }
48
- if (e.button != undefined && e.button !== 0) {
49
- return;
50
- }
51
- e.preventDefault();
52
- e.stopPropagation();
53
- infoPanelRef.current.ownerDocument.addEventListener(
54
- 'pointermove',
55
- onResize,
56
- );
57
- infoPanelRef.current.ownerDocument.addEventListener(
58
- 'pointerup',
59
- () =>
60
- infoPanelRef.current?.ownerDocument.removeEventListener(
61
- 'pointermove',
62
- onResize,
63
- ),
64
- { once: true },
65
- );
66
- };
67
- const onResize = React.useCallback(
68
- (e) => {
69
- e.preventDefault();
70
- if (!infoPanelRef.current) {
71
- return;
72
- }
73
- const { right, bottom } = infoPanelRef.current.getBoundingClientRect();
74
- if (orientation === 'vertical') {
75
- infoPanelRef.current.style.width = `${right - e.clientX}px`;
76
- } else {
77
- infoPanelRef.current.style.height = `${bottom - e.clientY}px`;
78
- }
79
- },
80
- [orientation],
81
- );
82
- return React.createElement(
83
- index_js_1.Box,
84
- {
85
- className: (0, classnames_1.default)(
86
- 'iui-information-panel',
87
- {
88
- 'iui-right': orientation === 'vertical',
89
- 'iui-bottom': orientation === 'horizontal',
90
- 'iui-visible': isOpen,
91
- },
92
- className,
93
- ),
94
- ref: refs,
95
- ...rest,
96
- },
97
- resizable &&
98
- React.createElement(
99
- index_js_1.Box,
100
- { className: 'iui-resizer', onPointerDown: startResize },
101
- React.createElement(index_js_1.Box, { className: 'iui-resizer-bar' }),
102
- ),
103
- children,
104
- );
34
+ const { className, isOpen = false, orientation = 'vertical', resizable = true, children, ...rest } = props;
35
+ const infoPanelRef = React.useRef(null);
36
+ const refs = (0, index_js_1.useMergedRefs)(ref, infoPanelRef);
37
+ const startResize = (e) => {
38
+ if (!infoPanelRef.current) {
39
+ return;
40
+ }
41
+ if (e.button != undefined && e.button !== 0) {
42
+ return;
43
+ }
44
+ e.preventDefault();
45
+ e.stopPropagation();
46
+ infoPanelRef.current.ownerDocument.addEventListener('pointermove', onResize);
47
+ infoPanelRef.current.ownerDocument.addEventListener('pointerup', () => infoPanelRef.current?.ownerDocument.removeEventListener('pointermove', onResize), { once: true });
48
+ };
49
+ const onResize = React.useCallback((e) => {
50
+ e.preventDefault();
51
+ if (!infoPanelRef.current) {
52
+ return;
53
+ }
54
+ const { right, bottom } = infoPanelRef.current.getBoundingClientRect();
55
+ if (orientation === 'vertical') {
56
+ infoPanelRef.current.style.width = `${right - e.clientX}px`;
57
+ }
58
+ else {
59
+ infoPanelRef.current.style.height = `${bottom - e.clientY}px`;
60
+ }
61
+ }, [orientation]);
62
+ return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-information-panel', {
63
+ 'iui-right': orientation === 'vertical',
64
+ 'iui-bottom': orientation === 'horizontal',
65
+ 'iui-visible': isOpen,
66
+ }, className), ref: refs, ...rest },
67
+ resizable && (React.createElement(index_js_1.Box, { className: 'iui-resizer', onPointerDown: startResize },
68
+ React.createElement(index_js_1.Box, { className: 'iui-resizer-bar' }))),
69
+ children));
105
70
  });
106
71
  exports.default = exports.InformationPanel;
@@ -1,15 +1,13 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InformationPanelBody = 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 index_js_1 = require('../utils/index.js');
8
+ const index_js_1 = require("../utils/index.js");
9
9
  /**
10
10
  * Body of the `InformationPanel` containing the main content.
11
11
  */
12
- exports.InformationPanelBody = index_js_1.polymorphic.div(
13
- 'iui-information-body',
14
- );
12
+ exports.InformationPanelBody = index_js_1.polymorphic.div('iui-information-body');
15
13
  exports.default = exports.InformationPanelBody;
@@ -1,14 +1,14 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InformationPanelContent = 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 classnames_1 = tslib_1.__importDefault(require('classnames'));
10
- const React = tslib_1.__importStar(require('react'));
11
- const index_js_1 = require('../utils/index.js');
9
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
10
+ const React = tslib_1.__importStar(require("react"));
11
+ const index_js_1 = require("../utils/index.js");
12
12
  /**
13
13
  * The `InformationPanelContent` component should be used inside `InformationPanelBody`
14
14
  * to style rows of key/value pairs, where the key is ideally represented by a `Label` component
@@ -33,19 +33,7 @@ const index_js_1 = require('../utils/index.js');
33
33
  * </InformationPanelContent>
34
34
  */
35
35
  exports.InformationPanelContent = React.forwardRef((props, forwardedRef) => {
36
- const { className, displayStyle = 'default', children, ...rest } = props;
37
- return React.createElement(
38
- index_js_1.Box,
39
- {
40
- className: (0, classnames_1.default)(
41
- 'iui-information-body-content',
42
- { 'iui-inline': displayStyle === 'inline' },
43
- className,
44
- ),
45
- ref: forwardedRef,
46
- ...rest,
47
- },
48
- children,
49
- );
36
+ const { className, displayStyle = 'default', children, ...rest } = props;
37
+ return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-information-body-content', { 'iui-inline': displayStyle === 'inline' }, className), ref: forwardedRef, ...rest }, children));
50
38
  });
51
39
  exports.default = exports.InformationPanelContent;
@@ -1,15 +1,15 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InformationPanelHeader = 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 classnames_1 = tslib_1.__importDefault(require('classnames'));
11
- const IconButton_js_1 = require('../Buttons/IconButton.js');
12
- const index_js_1 = require('../utils/index.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
11
+ const IconButton_js_1 = require("../Buttons/IconButton.js");
12
+ const index_js_1 = require("../utils/index.js");
13
13
  /**
14
14
  * Header of the InformationPanel to be passed in the `header` prop.
15
15
  *
@@ -27,32 +27,12 @@ const index_js_1 = require('../utils/index.js');
27
27
  * </InformationPanelHeader>
28
28
  */
29
29
  exports.InformationPanelHeader = React.forwardRef((props, forwardedRef) => {
30
- const { children, onClose, actions, className, ...rest } = props;
31
- return React.createElement(
32
- index_js_1.Box,
33
- {
34
- className: (0, classnames_1.default)('iui-information-header', className),
35
- ref: forwardedRef,
36
- ...rest,
37
- },
38
- React.createElement(
39
- index_js_1.Box,
40
- { as: 'span', className: 'iui-information-header-label' },
41
- children,
42
- ),
43
- React.createElement(
44
- index_js_1.Box,
45
- { className: 'iui-information-header-actions' },
46
- actions,
47
- onClose &&
48
- React.createElement(
49
- IconButton_js_1.IconButton,
50
- { styleType: 'borderless', onClick: onClose, 'aria-label': 'Close' },
51
- React.createElement(index_js_1.SvgCloseSmall, {
52
- 'aria-hidden': true,
53
- }),
54
- ),
55
- ),
56
- );
30
+ const { children, onClose, actions, className, ...rest } = props;
31
+ return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-information-header', className), ref: forwardedRef, ...rest },
32
+ React.createElement(index_js_1.Box, { as: 'span', className: 'iui-information-header-label' }, children),
33
+ React.createElement(index_js_1.Box, { className: 'iui-information-header-actions' },
34
+ actions,
35
+ onClose && (React.createElement(IconButton_js_1.IconButton, { styleType: 'borderless', onClick: onClose, "aria-label": 'Close' },
36
+ React.createElement(index_js_1.SvgCloseSmall, { "aria-hidden": true }))))));
57
37
  });
58
38
  exports.default = exports.InformationPanelHeader;
@@ -1,11 +1,11 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InformationPanelWrapper = 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 index_js_1 = require('../utils/index.js');
8
+ const index_js_1 = require("../utils/index.js");
9
9
  /**
10
10
  * InformationPanelWrapper should contain the `InformationPanel`
11
11
  * and the component over which the panel will overlay.
@@ -15,7 +15,5 @@ const index_js_1 = require('../utils/index.js');
15
15
  * <InformationPanel ... />
16
16
  * </InformationPanelWrapper>
17
17
  */
18
- exports.InformationPanelWrapper = index_js_1.polymorphic.div(
19
- 'iui-information-panel-wrapper',
20
- );
18
+ exports.InformationPanelWrapper = index_js_1.polymorphic.div('iui-information-panel-wrapper');
21
19
  exports.default = exports.InformationPanelWrapper;
@@ -1,14 +1,14 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.Input = 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 classnames_1 = tslib_1.__importDefault(require('classnames'));
10
- const React = tslib_1.__importStar(require('react'));
11
- const index_js_1 = require('../utils/index.js');
9
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
10
+ const React = tslib_1.__importStar(require("react"));
11
+ const index_js_1 = require("../utils/index.js");
12
12
  /**
13
13
  * Basic input component
14
14
  * @example
@@ -16,17 +16,9 @@ const index_js_1 = require('../utils/index.js');
16
16
  * <Input size='small' />
17
17
  */
18
18
  exports.Input = React.forwardRef((props, ref) => {
19
- const { size, htmlSize, status, className, ...rest } = props;
20
- const inputRef = React.useRef(null);
21
- const refs = (0, index_js_1.useMergedRefs)(inputRef, ref);
22
- return React.createElement(index_js_1.Box, {
23
- as: 'input',
24
- className: (0, classnames_1.default)('iui-input', className),
25
- 'data-iui-size': size,
26
- 'data-iui-status': status,
27
- size: htmlSize,
28
- ref: refs,
29
- ...rest,
30
- });
19
+ const { size, htmlSize, status, className, ...rest } = props;
20
+ const inputRef = React.useRef(null);
21
+ const refs = (0, index_js_1.useMergedRefs)(inputRef, ref);
22
+ return (React.createElement(index_js_1.Box, { as: 'input', className: (0, classnames_1.default)('iui-input', className), "data-iui-size": size, "data-iui-status": status, size: htmlSize, ref: refs, ...rest }));
31
23
  });
32
24
  exports.default = exports.Input;
@@ -1,14 +1,14 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InputGrid = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const index_js_1 = require('../utils/index.js');
11
- const classnames_1 = tslib_1.__importDefault(require('classnames'));
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const index_js_1 = require("../utils/index.js");
11
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
12
12
  //-------------------------------------------------------------------------------
13
13
  /**
14
14
  * InputGrid component is used to display inputs (input, textarea, select)
@@ -23,17 +23,8 @@ const classnames_1 = tslib_1.__importDefault(require('classnames'));
23
23
  * </InputGrid>
24
24
  */
25
25
  exports.InputGrid = React.forwardRef((props, ref) => {
26
- const { children, className, labelPlacement = undefined, ...rest } = props;
27
- return React.createElement(
28
- index_js_1.Box,
29
- {
30
- className: (0, classnames_1.default)('iui-input-grid', className),
31
- 'data-iui-label-placement': labelPlacement,
32
- ref: ref,
33
- ...rest,
34
- },
35
- children,
36
- );
26
+ const { children, className, labelPlacement = undefined, ...rest } = props;
27
+ return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-input-grid', className), "data-iui-label-placement": labelPlacement, ref: ref, ...rest }, children));
37
28
  });
38
29
  //-------------------------------------------------------------------------------
39
30
  exports.default = exports.InputGrid;
@@ -1,17 +1,17 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InputGroup = 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 classnames_1 = tslib_1.__importDefault(require('classnames'));
11
- const index_js_1 = require('../utils/index.js');
12
- const InputGrid_js_1 = require('../InputGrid/InputGrid.js');
13
- const Label_js_1 = require('../Label/Label.js');
14
- const StatusMessage_js_1 = require('../StatusMessage/StatusMessage.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
11
+ const index_js_1 = require("../utils/index.js");
12
+ const InputGrid_js_1 = require("../InputGrid/InputGrid.js");
13
+ const Label_js_1 = require("../Label/Label.js");
14
+ const StatusMessage_js_1 = require("../StatusMessage/StatusMessage.js");
15
15
  /**
16
16
  * Group Checkbox/Radio components together
17
17
  * @example
@@ -28,68 +28,21 @@ const StatusMessage_js_1 = require('../StatusMessage/StatusMessage.js');
28
28
  * </InputGroup>
29
29
  */
30
30
  exports.InputGroup = React.forwardRef((props, forwardedRef) => {
31
- const {
32
- className,
33
- children,
34
- disabled = false,
35
- displayStyle = 'default',
36
- label,
37
- message,
38
- status,
39
- svgIcon,
40
- required = false,
41
- labelProps,
42
- messageProps,
43
- innerProps,
44
- ...rest
45
- } = props;
46
- const icon = () => {
47
- if (svgIcon) {
48
- return React.cloneElement(svgIcon, { 'aria-hidden': true });
49
- }
50
- if (status && message) {
51
- return React.cloneElement(index_js_1.StatusIconMap[status](), {
52
- 'aria-hidden': true,
53
- });
54
- }
55
- return undefined;
56
- };
57
- return React.createElement(
58
- InputGrid_js_1.InputGrid,
59
- {
60
- ref: forwardedRef,
61
- as: 'div',
62
- labelPlacement: displayStyle,
63
- className: (0, classnames_1.default)(
64
- 'iui-input-group-wrapper',
65
- className,
66
- ),
67
- ...rest,
68
- },
69
- label &&
70
- React.createElement(
71
- Label_js_1.Label,
72
- { as: 'label', required: required, disabled: disabled, ...labelProps },
73
- label,
74
- ),
75
- React.createElement(
76
- index_js_1.Box,
77
- {
78
- as: 'div',
79
- ...innerProps,
80
- className: (0, classnames_1.default)(
81
- 'iui-input-group',
82
- innerProps?.className,
83
- ),
84
- },
85
- children,
86
- ),
87
- (message || status || svgIcon) &&
88
- React.createElement(
89
- StatusMessage_js_1.StatusMessage,
90
- { startIcon: icon(), status: status, ...messageProps },
91
- displayStyle !== 'inline' && message,
92
- ),
93
- );
31
+ const { className, children, disabled = false, displayStyle = 'default', label, message, status, svgIcon, required = false, labelProps, messageProps, innerProps, ...rest } = props;
32
+ const icon = () => {
33
+ if (svgIcon) {
34
+ return React.cloneElement(svgIcon, { 'aria-hidden': true });
35
+ }
36
+ if (status && message) {
37
+ return React.cloneElement(index_js_1.StatusIconMap[status](), {
38
+ 'aria-hidden': true,
39
+ });
40
+ }
41
+ return undefined;
42
+ };
43
+ return (React.createElement(InputGrid_js_1.InputGrid, { ref: forwardedRef, as: 'div', labelPlacement: displayStyle, className: (0, classnames_1.default)('iui-input-group-wrapper', className), ...rest },
44
+ label && (React.createElement(Label_js_1.Label, { as: 'label', required: required, disabled: disabled, ...labelProps }, label)),
45
+ React.createElement(index_js_1.Box, { as: 'div', ...innerProps, className: (0, classnames_1.default)('iui-input-group', innerProps?.className) }, children),
46
+ (message || status || svgIcon) && (React.createElement(StatusMessage_js_1.StatusMessage, { startIcon: icon(), status: status, ...messageProps }, displayStyle !== 'inline' && message))));
94
47
  });
95
48
  exports.default = exports.InputGroup;
@@ -1,59 +1,31 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InputWithDecorations = void 0;
4
- const tslib_1 = require('tslib');
4
+ const tslib_1 = require("tslib");
5
5
  /*---------------------------------------------------------------------------------------------
6
6
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
7
7
  * See LICENSE.md in the project root for license terms and full copyright notice.
8
8
  *--------------------------------------------------------------------------------------------*/
9
- const React = tslib_1.__importStar(require('react'));
10
- const index_js_1 = require('../utils/index.js');
11
- const IconButton_js_1 = require('../Buttons/IconButton.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const index_js_1 = require("../utils/index.js");
11
+ const IconButton_js_1 = require("../Buttons/IconButton.js");
12
12
  const InputWithDecorationsContext = React.createContext(undefined);
13
13
  const InputWithDecorationsComponent = React.forwardRef((props, ref) => {
14
- const { children, size, isDisabled, ...rest } = props;
15
- return React.createElement(
16
- InputWithDecorationsContext.Provider,
17
- { value: { size, isDisabled } },
18
- React.createElement(
19
- index_js_1.InputFlexContainer,
20
- { isDisabled: isDisabled, size: size, ref: ref, ...rest },
21
- children,
22
- ),
23
- );
14
+ const { children, size, isDisabled, ...rest } = props;
15
+ return (React.createElement(InputWithDecorationsContext.Provider, { value: { size, isDisabled } },
16
+ React.createElement(index_js_1.InputFlexContainer, { isDisabled: isDisabled, size: size, ref: ref, ...rest }, children)));
24
17
  });
25
18
  //-------------------------------------------------------------------------------
26
19
  const InputWithDecorationsInput = React.forwardRef((props, ref) => {
27
- const { id: idProp, size, disabled: localDisabled, ...rest } = props;
28
- const { size: contextSize, isDisabled } = (0, index_js_1.useSafeContext)(
29
- InputWithDecorationsContext,
30
- );
31
- return React.createElement(index_js_1.Box, {
32
- as: 'input',
33
- ref: ref,
34
- 'data-iui-size': size ?? contextSize,
35
- disabled: localDisabled ?? isDisabled,
36
- id: idProp,
37
- ...rest,
38
- });
20
+ const { id: idProp, size, disabled: localDisabled, ...rest } = props;
21
+ const { size: contextSize, isDisabled } = (0, index_js_1.useSafeContext)(InputWithDecorationsContext);
22
+ return (React.createElement(index_js_1.Box, { as: 'input', ref: ref, "data-iui-size": size ?? contextSize, disabled: localDisabled ?? isDisabled, id: idProp, ...rest }));
39
23
  });
40
24
  //-------------------------------------------------------------------------------
41
25
  const InputWithDecorationsButton = React.forwardRef((props, ref) => {
42
- const { children, size, disabled: localDisabled, ...rest } = props;
43
- const { size: contextSize, isDisabled } = (0, index_js_1.useSafeContext)(
44
- InputWithDecorationsContext,
45
- );
46
- return React.createElement(
47
- IconButton_js_1.IconButton,
48
- {
49
- ref: ref,
50
- size: size ?? contextSize,
51
- styleType: 'borderless',
52
- disabled: localDisabled ?? isDisabled,
53
- ...rest,
54
- },
55
- children,
56
- );
26
+ const { children, size, disabled: localDisabled, ...rest } = props;
27
+ const { size: contextSize, isDisabled } = (0, index_js_1.useSafeContext)(InputWithDecorationsContext);
28
+ return (React.createElement(IconButton_js_1.IconButton, { ref: ref, size: size ?? contextSize, styleType: 'borderless', disabled: localDisabled ?? isDisabled, ...rest }, children));
57
29
  });
58
30
  /**
59
31
  * Input component with various additional decorations.
@@ -70,12 +42,12 @@ const InputWithDecorationsButton = React.forwardRef((props, ref) => {
70
42
  * </InputWithDecorations>
71
43
  */
72
44
  exports.InputWithDecorations = Object.assign(InputWithDecorationsComponent, {
73
- /**
74
- * Subcomponent to include input in your InputWithDecorations
75
- */
76
- Input: InputWithDecorationsInput,
77
- /**
78
- * Subcomponent to include button in your InputWithDecorations
79
- */
80
- Button: InputWithDecorationsButton,
45
+ /**
46
+ * Subcomponent to include input in your InputWithDecorations
47
+ */
48
+ Input: InputWithDecorationsInput,
49
+ /**
50
+ * Subcomponent to include button in your InputWithDecorations
51
+ */
52
+ Button: InputWithDecorationsButton,
81
53
  });
@@ -1,14 +1,14 @@
1
- 'use strict';
2
- Object.defineProperty(exports, '__esModule', { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.Label = 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 classnames_1 = tslib_1.__importDefault(require('classnames'));
11
- const index_js_1 = require('../utils/index.js');
9
+ const React = tslib_1.__importStar(require("react"));
10
+ const classnames_1 = tslib_1.__importDefault(require("classnames"));
11
+ const index_js_1 = require("../utils/index.js");
12
12
  /**
13
13
  * A standalone label to be used with input components (using `htmlFor`).
14
14
  * Can be rendered as any element, e.g. span, using the `as` prop.
@@ -17,31 +17,10 @@ const index_js_1 = require('../utils/index.js');
17
17
  * <Input id='name-input' />
18
18
  */
19
19
  exports.Label = React.forwardRef((props, forwardedRef) => {
20
- const {
21
- displayStyle = 'block',
22
- required,
23
- disabled,
24
- className,
25
- children,
26
- ...rest
27
- } = props;
28
- return React.createElement(
29
- index_js_1.Box,
30
- {
31
- as: 'label',
32
- className: (0, classnames_1.default)(
33
- 'iui-input-label',
34
- {
35
- 'iui-inline': displayStyle === 'inline',
36
- 'iui-required': required,
37
- },
38
- className,
39
- ),
40
- 'data-iui-disabled': disabled ? true : undefined,
41
- ref: forwardedRef,
42
- ...rest,
43
- },
44
- children,
45
- );
20
+ const { displayStyle = 'block', required, disabled, className, children, ...rest } = props;
21
+ return (React.createElement(index_js_1.Box, { as: 'label', className: (0, classnames_1.default)('iui-input-label', {
22
+ 'iui-inline': displayStyle === 'inline',
23
+ 'iui-required': required,
24
+ }, className), "data-iui-disabled": disabled ? true : undefined, ref: forwardedRef, ...rest }, children));
46
25
  });
47
26
  exports.default = exports.Label;