@hitachivantara/uikit-react-core 5.66.9 → 5.66.11

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 (462) hide show
  1. package/dist/cjs/Accordion/Accordion.cjs +1 -1
  2. package/dist/cjs/ActionBar/ActionBar.cjs +1 -1
  3. package/dist/cjs/ActionsGeneric/ActionsGeneric.cjs +1 -1
  4. package/dist/cjs/AppSwitcher/Action/Action.cjs +1 -1
  5. package/dist/cjs/AppSwitcher/AppSwitcher.cjs +2 -2
  6. package/dist/cjs/Avatar/Avatar.cjs +1 -1
  7. package/dist/cjs/AvatarGroup/AvatarGroup.cjs +1 -1
  8. package/dist/cjs/AvatarGroup/AvatarGroupContext.cjs +1 -1
  9. package/dist/cjs/Badge/Badge.cjs +1 -1
  10. package/dist/cjs/Banner/Banner.cjs +1 -1
  11. package/dist/cjs/Banner/BannerContent/ActionContainer/ActionContainer.cjs +1 -1
  12. package/dist/cjs/Banner/BannerContent/BannerContent.cjs +1 -1
  13. package/dist/cjs/Banner/BannerContent/MessageContainer/MessageContainer.cjs +1 -1
  14. package/dist/cjs/BaseCheckBox/BaseCheckBox.cjs +1 -1
  15. package/dist/cjs/BaseCheckBox/icons.cjs +1 -1
  16. package/dist/cjs/BaseDropdown/BaseDropdown.cjs +1 -1
  17. package/dist/cjs/BaseInput/BaseInput.cjs +1 -1
  18. package/dist/cjs/BaseRadio/BaseRadio.cjs +1 -1
  19. package/dist/cjs/BaseRadio/icons.cjs +1 -1
  20. package/dist/cjs/BaseSwitch/BaseSwitch.cjs +1 -1
  21. package/dist/cjs/Box/Box.cjs +1 -1
  22. package/dist/cjs/BreadCrumb/BreadCrumb.cjs +1 -1
  23. package/dist/cjs/BreadCrumb/Page/Page.cjs +1 -1
  24. package/dist/cjs/BreadCrumb/PathElement/PathElement.cjs +1 -1
  25. package/dist/cjs/BreadCrumb/utils.cjs +1 -1
  26. package/dist/cjs/BulkActions/BulkActions.cjs +1 -1
  27. package/dist/cjs/BulkActions/BulkActions.styles.cjs +1 -1
  28. package/dist/cjs/Button/Button.cjs +1 -1
  29. package/dist/cjs/Calendar/Calendar.cjs +10 -4
  30. package/dist/cjs/Calendar/CalendarHeader/CalendarHeader.cjs +1 -1
  31. package/dist/cjs/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.cjs +1 -1
  32. package/dist/cjs/Calendar/CalendarNavigation/MonthSelector/MonthSelector.cjs +1 -1
  33. package/dist/cjs/Calendar/CalendarNavigation/Navigation/Navigation.cjs +1 -1
  34. package/dist/cjs/Calendar/SingleCalendar/CalendarCell.cjs +2 -2
  35. package/dist/cjs/Calendar/SingleCalendar/SingleCalendar.cjs +1 -1
  36. package/dist/cjs/Card/Card.cjs +1 -1
  37. package/dist/cjs/Card/Content/Content.cjs +1 -1
  38. package/dist/cjs/Card/Header/Header.cjs +1 -1
  39. package/dist/cjs/Card/Media/Media.cjs +1 -7
  40. package/dist/cjs/Carousel/Carousel.cjs +1 -1
  41. package/dist/cjs/Carousel/CarouselControls.cjs +1 -1
  42. package/dist/cjs/Carousel/CarouselSlide/CarouselSlide.cjs +1 -1
  43. package/dist/cjs/Carousel/CarouselThumbnails.cjs +1 -1
  44. package/dist/cjs/CheckBox/CheckBox.cjs +1 -1
  45. package/dist/cjs/CheckBoxGroup/CheckBoxGroup.cjs +1 -1
  46. package/dist/cjs/ColorPicker/ColorPicker.cjs +1 -1
  47. package/dist/cjs/ColorPicker/Fields/Fields.cjs +1 -1
  48. package/dist/cjs/ColorPicker/Picker/Picker.cjs +1 -1
  49. package/dist/cjs/ColorPicker/PresetColors/PresetColors.cjs +1 -1
  50. package/dist/cjs/ColorPicker/SavedColors/SavedColors.cjs +1 -1
  51. package/dist/cjs/Container/Container.cjs +1 -1
  52. package/dist/cjs/Controls/Controls.cjs +1 -1
  53. package/dist/cjs/Controls/LeftControl/LeftControl.cjs +1 -1
  54. package/dist/cjs/Controls/RightControl/RightControl.cjs +1 -1
  55. package/dist/cjs/DatePicker/DatePicker.cjs +1 -1
  56. package/dist/cjs/Dialog/Actions/Actions.cjs +1 -1
  57. package/dist/cjs/Dialog/Content/Content.cjs +1 -1
  58. package/dist/cjs/Dialog/Dialog.cjs +1 -1
  59. package/dist/cjs/Dialog/Title/Title.cjs +1 -1
  60. package/dist/cjs/DotPagination/DotPagination.cjs +1 -1
  61. package/dist/cjs/Drawer/Drawer.cjs +1 -1
  62. package/dist/cjs/DropDownMenu/DropDownMenu.cjs +1 -1
  63. package/dist/cjs/Dropdown/Dropdown.cjs +1 -1
  64. package/dist/cjs/Dropdown/List/List.cjs +1 -1
  65. package/dist/cjs/DropdownButton/DropdownButton.cjs +1 -1
  66. package/dist/cjs/EmptyState/EmptyState.cjs +1 -1
  67. package/dist/cjs/FileUploader/DropZone/DropZone.cjs +1 -1
  68. package/dist/cjs/FileUploader/File/File.cjs +1 -1
  69. package/dist/cjs/FileUploader/FileList/FileList.cjs +1 -1
  70. package/dist/cjs/FileUploader/FileUploader.cjs +1 -1
  71. package/dist/cjs/FileUploader/Preview/Preview.cjs +1 -1
  72. package/dist/cjs/FilterGroup/Counter/Counter.cjs +1 -1
  73. package/dist/cjs/FilterGroup/FilterContent/FilterContent.cjs +1 -1
  74. package/dist/cjs/FilterGroup/FilterGroup.cjs +1 -1
  75. package/dist/cjs/FilterGroup/FilterGroupContext.cjs +1 -1
  76. package/dist/cjs/FilterGroup/LeftPanel/LeftPanel.cjs +1 -1
  77. package/dist/cjs/FilterGroup/RightPanel/RightPanel.cjs +1 -1
  78. package/dist/cjs/Focus/Focus.cjs +2 -3
  79. package/dist/cjs/Footer/Footer.cjs +1 -1
  80. package/dist/cjs/Forms/Adornment/Adornment.cjs +1 -1
  81. package/dist/cjs/Forms/CharCounter/CharCounter.cjs +1 -1
  82. package/dist/cjs/Forms/FormElement/FormElement.cjs +1 -1
  83. package/dist/cjs/Forms/InfoMessage/InfoMessage.cjs +1 -1
  84. package/dist/cjs/Forms/Label/Label.cjs +1 -1
  85. package/dist/cjs/Forms/Suggestions/Suggestions.cjs +1 -1
  86. package/dist/cjs/Forms/WarningText/WarningText.cjs +1 -1
  87. package/dist/cjs/GlobalActions/GlobalActions.cjs +1 -1
  88. package/dist/cjs/Grid/Grid.cjs +5 -8
  89. package/dist/cjs/Header/Actions/Actions.cjs +1 -1
  90. package/dist/cjs/Header/Brand/Brand.cjs +1 -1
  91. package/dist/cjs/Header/Header.cjs +1 -1
  92. package/dist/cjs/Header/Navigation/MenuBar/Bar.cjs +1 -1
  93. package/dist/cjs/Header/Navigation/MenuBar/MenuBar.cjs +1 -1
  94. package/dist/cjs/Header/Navigation/MenuItem/MenuItem.cjs +2 -2
  95. package/dist/cjs/Header/Navigation/Navigation.cjs +1 -1
  96. package/dist/cjs/Header/Navigation/useSelectionPath.cjs +1 -1
  97. package/dist/cjs/Header/Navigation/utils/FocusContext.cjs +1 -1
  98. package/dist/cjs/IconButton/IconButton.cjs +1 -1
  99. package/dist/cjs/InlineEditor/InlineEditor.cjs +1 -1
  100. package/dist/cjs/Input/Input.cjs +1 -1
  101. package/dist/cjs/Kpi/Kpi.cjs +1 -1
  102. package/dist/cjs/Link/Link.cjs +1 -1
  103. package/dist/cjs/List/List.cjs +1 -1
  104. package/dist/cjs/List/utils.cjs +1 -1
  105. package/dist/cjs/ListContainer/ListContainer.cjs +1 -1
  106. package/dist/cjs/ListContainer/ListItem/ListItem.cjs +1 -1
  107. package/dist/cjs/Loading/Loading.cjs +1 -1
  108. package/dist/cjs/LoadingContainer/LoadingContainer.cjs +1 -1
  109. package/dist/cjs/Login/Login.cjs +1 -1
  110. package/dist/cjs/MultiButton/MultiButton.cjs +1 -1
  111. package/dist/cjs/OverflowTooltip/OverflowTooltip.cjs +1 -1
  112. package/dist/cjs/Pagination/Pagination.cjs +1 -1
  113. package/dist/cjs/Pagination/Select.cjs +1 -1
  114. package/dist/cjs/Panel/Panel.cjs +1 -1
  115. package/dist/cjs/ProgressBar/ProgressBar.cjs +1 -1
  116. package/dist/cjs/QueryBuilder/ConfirmationDialog/ConfirmationDialog.cjs +1 -1
  117. package/dist/cjs/QueryBuilder/Context.cjs +1 -1
  118. package/dist/cjs/QueryBuilder/QueryBuilder.cjs +1 -1
  119. package/dist/cjs/QueryBuilder/Rule/Attribute/Attribute.cjs +1 -1
  120. package/dist/cjs/QueryBuilder/Rule/Operator/Operator.cjs +1 -1
  121. package/dist/cjs/QueryBuilder/Rule/Rule.cjs +1 -1
  122. package/dist/cjs/QueryBuilder/Rule/Value/BooleanValue/BooleanValue.cjs +1 -1
  123. package/dist/cjs/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.cjs +1 -1
  124. package/dist/cjs/QueryBuilder/Rule/Value/NumericValue/NumericValue.cjs +1 -1
  125. package/dist/cjs/QueryBuilder/Rule/Value/TextValue/TextValue.cjs +1 -1
  126. package/dist/cjs/QueryBuilder/Rule/Value/Value.cjs +1 -1
  127. package/dist/cjs/QueryBuilder/RuleGroup/RuleGroup.cjs +1 -1
  128. package/dist/cjs/QueryBuilder/utils/index.cjs +1 -1
  129. package/dist/cjs/Radio/Radio.cjs +1 -1
  130. package/dist/cjs/RadioGroup/RadioGroup.cjs +1 -1
  131. package/dist/cjs/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.cjs +1 -1
  132. package/dist/cjs/ScrollTo/Horizontal/ScrollToHorizontal.cjs +1 -1
  133. package/dist/cjs/ScrollTo/Vertical/ScrollToVertical.cjs +1 -1
  134. package/dist/cjs/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.cjs +1 -1
  135. package/dist/cjs/ScrollTo/utils.cjs +2 -2
  136. package/dist/cjs/Section/Section.cjs +1 -1
  137. package/dist/cjs/Select/Option.cjs +1 -1
  138. package/dist/cjs/Select/OptionGroup.cjs +1 -1
  139. package/dist/cjs/Select/Select.cjs +3 -2
  140. package/dist/cjs/SelectionList/SelectionList.cjs +1 -1
  141. package/dist/cjs/SimpleGrid/SimpleGrid.cjs +1 -1
  142. package/dist/cjs/Skeleton/Skeleton.cjs +1 -1
  143. package/dist/cjs/Slider/Slider.cjs +3 -2
  144. package/dist/cjs/Slider/SliderInput/SliderInput.cjs +1 -1
  145. package/dist/cjs/Snackbar/Snackbar.cjs +1 -1
  146. package/dist/cjs/Snackbar/SnackbarContent/SnackbarContent.cjs +1 -1
  147. package/dist/cjs/SnackbarProvider/SnackbarProvider.cjs +1 -1
  148. package/dist/cjs/Stack/Stack.cjs +10 -11
  149. package/dist/cjs/Switch/Switch.cjs +1 -1
  150. package/dist/cjs/Tab/Tab.cjs +1 -1
  151. package/dist/cjs/Table/Table.cjs +1 -1
  152. package/dist/cjs/Table/TableBody/TableBody.cjs +1 -1
  153. package/dist/cjs/Table/TableCell/TableCell.cjs +1 -1
  154. package/dist/cjs/Table/TableContainer/TableContainer.cjs +1 -1
  155. package/dist/cjs/Table/TableHead/TableHead.cjs +1 -1
  156. package/dist/cjs/Table/TableHeader/TableHeader.cjs +1 -1
  157. package/dist/cjs/Table/TableRow/TableRow.cjs +1 -1
  158. package/dist/cjs/Table/hooks/useRowExpand.cjs +1 -1
  159. package/dist/cjs/Table/hooks/useRowSelection.cjs +7 -7
  160. package/dist/cjs/Table/renderers/DateColumnCell/DateColumnCell.cjs +1 -1
  161. package/dist/cjs/Table/renderers/DropdownColumnCell/DropdownColumnCell.cjs +1 -1
  162. package/dist/cjs/Table/renderers/ProgressColumnCell/ProgressColumnCell.cjs +1 -1
  163. package/dist/cjs/Table/renderers/SwitchColumnCell/SwitchColumnCell.cjs +1 -1
  164. package/dist/cjs/Table/renderers/renderers.cjs +1 -1
  165. package/dist/cjs/TableSection/TableSection.cjs +1 -1
  166. package/dist/cjs/TableSection/TableSection.styles.cjs +1 -1
  167. package/dist/cjs/Tabs/Tabs.cjs +1 -1
  168. package/dist/cjs/Tag/Tag.cjs +1 -1
  169. package/dist/cjs/TagsInput/TagsInput.cjs +2 -2
  170. package/dist/cjs/TextArea/TextArea.cjs +1 -1
  171. package/dist/cjs/TimeAgo/TimeAgo.cjs +1 -1
  172. package/dist/cjs/TimePicker/Placeholder.cjs +1 -1
  173. package/dist/cjs/TimePicker/TimePicker.cjs +1 -1
  174. package/dist/cjs/TimePicker/Unit/Unit.cjs +1 -1
  175. package/dist/cjs/ToggleButton/ToggleButton.cjs +1 -1
  176. package/dist/cjs/Tooltip/Tooltip.cjs +9 -5
  177. package/dist/cjs/TreeView/TreeItem/DefaultContent.cjs +1 -1
  178. package/dist/cjs/TreeView/TreeItem/TreeItem.cjs +1 -1
  179. package/dist/cjs/TreeView/TreeView.cjs +1 -1
  180. package/dist/cjs/TreeView/internals/DescendantProvider.cjs +2 -2
  181. package/dist/cjs/TreeView/internals/TreeViewProvider.cjs +1 -1
  182. package/dist/cjs/Typography/Typography.cjs +1 -1
  183. package/dist/cjs/VerticalNavigation/Actions/Action.cjs +13 -11
  184. package/dist/cjs/VerticalNavigation/Actions/Action.styles.cjs +4 -4
  185. package/dist/cjs/VerticalNavigation/Actions/Actions.cjs +9 -9
  186. package/dist/cjs/VerticalNavigation/Header/Header.cjs +46 -26
  187. package/dist/cjs/VerticalNavigation/Header/Header.styles.cjs +3 -1
  188. package/dist/cjs/VerticalNavigation/Navigation/Navigation.cjs +23 -29
  189. package/dist/cjs/VerticalNavigation/NavigationPopup/NavigationPopup.styles.cjs +0 -8
  190. package/dist/cjs/VerticalNavigation/NavigationPopup/NavigationPopupContainer.cjs +20 -6
  191. package/dist/cjs/VerticalNavigation/NavigationSlider/NavigationSlider.cjs +41 -30
  192. package/dist/cjs/VerticalNavigation/NavigationSlider/NavigationSlider.styles.cjs +6 -9
  193. package/dist/cjs/VerticalNavigation/TreeView/IconWrapper/IconWrapper.cjs +7 -18
  194. package/dist/cjs/VerticalNavigation/TreeView/TreeView.cjs +614 -631
  195. package/dist/cjs/VerticalNavigation/TreeView/TreeViewItem.cjs +39 -26
  196. package/dist/cjs/VerticalNavigation/TreeView/TreeViewItem.styles.cjs +25 -13
  197. package/dist/cjs/VerticalNavigation/VerticalNavigation.cjs +1 -1
  198. package/dist/cjs/hocs/withTooltip.cjs +1 -1
  199. package/dist/cjs/hooks/useEmotionCache.cjs +1 -1
  200. package/dist/cjs/hooks/useTheme.cjs +1 -1
  201. package/dist/cjs/providers/Provider.cjs +1 -1
  202. package/dist/cjs/providers/ThemeProvider.cjs +34 -41
  203. package/dist/cjs/utils/document.cjs +4 -0
  204. package/dist/cjs/utils/focusableElementFinder.cjs +1 -1
  205. package/dist/cjs/utils/iconVariant.cjs +1 -1
  206. package/dist/cjs/utils/theme.cjs +3 -3
  207. package/dist/esm/Accordion/Accordion.js +1 -1
  208. package/dist/esm/ActionBar/ActionBar.js +1 -1
  209. package/dist/esm/ActionsGeneric/ActionsGeneric.js +1 -1
  210. package/dist/esm/AppSwitcher/Action/Action.js +1 -1
  211. package/dist/esm/AppSwitcher/AppSwitcher.js +2 -2
  212. package/dist/esm/AppSwitcher/AppSwitcher.js.map +1 -1
  213. package/dist/esm/Avatar/Avatar.js +1 -1
  214. package/dist/esm/AvatarGroup/AvatarGroup.js +1 -1
  215. package/dist/esm/AvatarGroup/AvatarGroupContext.js +1 -1
  216. package/dist/esm/Badge/Badge.js +1 -1
  217. package/dist/esm/Banner/Banner.js +1 -1
  218. package/dist/esm/Banner/BannerContent/ActionContainer/ActionContainer.js +1 -1
  219. package/dist/esm/Banner/BannerContent/BannerContent.js +1 -1
  220. package/dist/esm/Banner/BannerContent/MessageContainer/MessageContainer.js +1 -1
  221. package/dist/esm/BaseCheckBox/BaseCheckBox.js +1 -1
  222. package/dist/esm/BaseCheckBox/icons.js +1 -1
  223. package/dist/esm/BaseDropdown/BaseDropdown.js +1 -1
  224. package/dist/esm/BaseInput/BaseInput.js +1 -1
  225. package/dist/esm/BaseRadio/BaseRadio.js +1 -1
  226. package/dist/esm/BaseRadio/icons.js +1 -1
  227. package/dist/esm/BaseSwitch/BaseSwitch.js +1 -1
  228. package/dist/esm/Box/Box.js +1 -1
  229. package/dist/esm/BreadCrumb/BreadCrumb.js +1 -1
  230. package/dist/esm/BreadCrumb/Page/Page.js +1 -1
  231. package/dist/esm/BreadCrumb/PathElement/PathElement.js +1 -1
  232. package/dist/esm/BreadCrumb/utils.js +1 -1
  233. package/dist/esm/BulkActions/BulkActions.js +1 -1
  234. package/dist/esm/BulkActions/BulkActions.styles.js +1 -1
  235. package/dist/esm/Button/Button.js +1 -1
  236. package/dist/esm/Calendar/Calendar.js +10 -4
  237. package/dist/esm/Calendar/Calendar.js.map +1 -1
  238. package/dist/esm/Calendar/CalendarHeader/CalendarHeader.js +1 -1
  239. package/dist/esm/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.js +1 -1
  240. package/dist/esm/Calendar/CalendarNavigation/MonthSelector/MonthSelector.js +1 -1
  241. package/dist/esm/Calendar/CalendarNavigation/Navigation/Navigation.js +1 -1
  242. package/dist/esm/Calendar/SingleCalendar/CalendarCell.js +2 -2
  243. package/dist/esm/Calendar/SingleCalendar/CalendarCell.js.map +1 -1
  244. package/dist/esm/Calendar/SingleCalendar/SingleCalendar.js +1 -1
  245. package/dist/esm/Card/Card.js +1 -1
  246. package/dist/esm/Card/Content/Content.js +1 -1
  247. package/dist/esm/Card/Header/Header.js +1 -1
  248. package/dist/esm/Card/Media/Media.js +1 -7
  249. package/dist/esm/Card/Media/Media.js.map +1 -1
  250. package/dist/esm/Carousel/Carousel.js +1 -1
  251. package/dist/esm/Carousel/CarouselControls.js +1 -1
  252. package/dist/esm/Carousel/CarouselSlide/CarouselSlide.js +1 -1
  253. package/dist/esm/Carousel/CarouselThumbnails.js +1 -1
  254. package/dist/esm/CheckBox/CheckBox.js +1 -1
  255. package/dist/esm/CheckBoxGroup/CheckBoxGroup.js +1 -1
  256. package/dist/esm/ColorPicker/ColorPicker.js +1 -1
  257. package/dist/esm/ColorPicker/Fields/Fields.js +1 -1
  258. package/dist/esm/ColorPicker/Picker/Picker.js +1 -1
  259. package/dist/esm/ColorPicker/PresetColors/PresetColors.js +1 -1
  260. package/dist/esm/ColorPicker/SavedColors/SavedColors.js +1 -1
  261. package/dist/esm/Container/Container.js +1 -1
  262. package/dist/esm/Controls/Controls.js +1 -1
  263. package/dist/esm/Controls/LeftControl/LeftControl.js +1 -1
  264. package/dist/esm/Controls/RightControl/RightControl.js +1 -1
  265. package/dist/esm/DatePicker/DatePicker.js +1 -1
  266. package/dist/esm/Dialog/Actions/Actions.js +1 -1
  267. package/dist/esm/Dialog/Content/Content.js +1 -1
  268. package/dist/esm/Dialog/Dialog.js +1 -1
  269. package/dist/esm/Dialog/Title/Title.js +1 -1
  270. package/dist/esm/DotPagination/DotPagination.js +1 -1
  271. package/dist/esm/Drawer/Drawer.js +1 -1
  272. package/dist/esm/DropDownMenu/DropDownMenu.js +1 -1
  273. package/dist/esm/Dropdown/Dropdown.js +1 -1
  274. package/dist/esm/Dropdown/List/List.js +1 -1
  275. package/dist/esm/DropdownButton/DropdownButton.js +1 -1
  276. package/dist/esm/EmptyState/EmptyState.js +1 -1
  277. package/dist/esm/FileUploader/DropZone/DropZone.js +1 -1
  278. package/dist/esm/FileUploader/File/File.js +1 -1
  279. package/dist/esm/FileUploader/FileList/FileList.js +1 -1
  280. package/dist/esm/FileUploader/FileUploader.js +1 -1
  281. package/dist/esm/FileUploader/Preview/Preview.js +1 -1
  282. package/dist/esm/FilterGroup/Counter/Counter.js +1 -1
  283. package/dist/esm/FilterGroup/FilterContent/FilterContent.js +1 -1
  284. package/dist/esm/FilterGroup/FilterGroup.js +1 -1
  285. package/dist/esm/FilterGroup/FilterGroupContext.js +1 -1
  286. package/dist/esm/FilterGroup/LeftPanel/LeftPanel.js +1 -1
  287. package/dist/esm/FilterGroup/RightPanel/RightPanel.js +1 -1
  288. package/dist/esm/Focus/Focus.js +2 -3
  289. package/dist/esm/Focus/Focus.js.map +1 -1
  290. package/dist/esm/Footer/Footer.js +1 -1
  291. package/dist/esm/Forms/Adornment/Adornment.js +1 -1
  292. package/dist/esm/Forms/CharCounter/CharCounter.js +1 -1
  293. package/dist/esm/Forms/FormElement/FormElement.js +1 -1
  294. package/dist/esm/Forms/InfoMessage/InfoMessage.js +1 -1
  295. package/dist/esm/Forms/Label/Label.js +1 -1
  296. package/dist/esm/Forms/Suggestions/Suggestions.js +1 -1
  297. package/dist/esm/Forms/WarningText/WarningText.js +1 -1
  298. package/dist/esm/GlobalActions/GlobalActions.js +1 -1
  299. package/dist/esm/Grid/Grid.js +5 -8
  300. package/dist/esm/Grid/Grid.js.map +1 -1
  301. package/dist/esm/Header/Actions/Actions.js +1 -1
  302. package/dist/esm/Header/Brand/Brand.js +1 -1
  303. package/dist/esm/Header/Header.js +1 -1
  304. package/dist/esm/Header/Navigation/MenuBar/Bar.js +1 -1
  305. package/dist/esm/Header/Navigation/MenuBar/MenuBar.js +1 -1
  306. package/dist/esm/Header/Navigation/MenuItem/MenuItem.js +2 -2
  307. package/dist/esm/Header/Navigation/MenuItem/MenuItem.js.map +1 -1
  308. package/dist/esm/Header/Navigation/Navigation.js +1 -1
  309. package/dist/esm/Header/Navigation/useSelectionPath.js +1 -1
  310. package/dist/esm/Header/Navigation/useSelectionPath.js.map +1 -1
  311. package/dist/esm/Header/Navigation/utils/FocusContext.js +1 -1
  312. package/dist/esm/IconButton/IconButton.js +1 -1
  313. package/dist/esm/InlineEditor/InlineEditor.js +1 -1
  314. package/dist/esm/Input/Input.js +1 -1
  315. package/dist/esm/Kpi/Kpi.js +1 -1
  316. package/dist/esm/Link/Link.js +1 -1
  317. package/dist/esm/Link/Link.js.map +1 -1
  318. package/dist/esm/List/List.js +1 -1
  319. package/dist/esm/List/utils.js +1 -1
  320. package/dist/esm/List/utils.js.map +1 -1
  321. package/dist/esm/ListContainer/ListContainer.js +1 -1
  322. package/dist/esm/ListContainer/ListItem/ListItem.js +1 -1
  323. package/dist/esm/Loading/Loading.js +1 -1
  324. package/dist/esm/LoadingContainer/LoadingContainer.js +1 -1
  325. package/dist/esm/Login/Login.js +1 -1
  326. package/dist/esm/MultiButton/MultiButton.js +1 -1
  327. package/dist/esm/OverflowTooltip/OverflowTooltip.js +1 -1
  328. package/dist/esm/Pagination/Pagination.js +1 -1
  329. package/dist/esm/Pagination/Select.js +1 -1
  330. package/dist/esm/Panel/Panel.js +1 -1
  331. package/dist/esm/ProgressBar/ProgressBar.js +1 -1
  332. package/dist/esm/QueryBuilder/ConfirmationDialog/ConfirmationDialog.js +1 -1
  333. package/dist/esm/QueryBuilder/Context.js +1 -1
  334. package/dist/esm/QueryBuilder/QueryBuilder.js +1 -1
  335. package/dist/esm/QueryBuilder/QueryBuilder.js.map +1 -1
  336. package/dist/esm/QueryBuilder/Rule/Attribute/Attribute.js +1 -1
  337. package/dist/esm/QueryBuilder/Rule/Operator/Operator.js +1 -1
  338. package/dist/esm/QueryBuilder/Rule/Rule.js +1 -1
  339. package/dist/esm/QueryBuilder/Rule/Value/BooleanValue/BooleanValue.js +1 -1
  340. package/dist/esm/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.js +1 -1
  341. package/dist/esm/QueryBuilder/Rule/Value/NumericValue/NumericValue.js +1 -1
  342. package/dist/esm/QueryBuilder/Rule/Value/TextValue/TextValue.js +1 -1
  343. package/dist/esm/QueryBuilder/Rule/Value/Value.js +1 -1
  344. package/dist/esm/QueryBuilder/RuleGroup/RuleGroup.js +1 -1
  345. package/dist/esm/QueryBuilder/utils/index.js +1 -1
  346. package/dist/esm/QueryBuilder/utils/index.js.map +1 -1
  347. package/dist/esm/Radio/Radio.js +1 -1
  348. package/dist/esm/RadioGroup/RadioGroup.js +1 -1
  349. package/dist/esm/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js +1 -1
  350. package/dist/esm/ScrollTo/Horizontal/ScrollToHorizontal.js +1 -1
  351. package/dist/esm/ScrollTo/Vertical/ScrollToVertical.js +1 -1
  352. package/dist/esm/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.js +1 -1
  353. package/dist/esm/ScrollTo/useScrollTo.js.map +1 -1
  354. package/dist/esm/ScrollTo/utils.js +2 -2
  355. package/dist/esm/ScrollTo/utils.js.map +1 -1
  356. package/dist/esm/Section/Section.js +1 -1
  357. package/dist/esm/Select/Option.js +1 -1
  358. package/dist/esm/Select/OptionGroup.js +1 -1
  359. package/dist/esm/Select/Select.js +3 -2
  360. package/dist/esm/Select/Select.js.map +1 -1
  361. package/dist/esm/SelectionList/SelectionList.js +1 -1
  362. package/dist/esm/SimpleGrid/SimpleGrid.js +1 -1
  363. package/dist/esm/Skeleton/Skeleton.js +1 -1
  364. package/dist/esm/Slider/Slider.js +3 -2
  365. package/dist/esm/Slider/Slider.js.map +1 -1
  366. package/dist/esm/Slider/SliderInput/SliderInput.js +1 -1
  367. package/dist/esm/Slider/utils.js.map +1 -1
  368. package/dist/esm/Snackbar/Snackbar.js +1 -1
  369. package/dist/esm/Snackbar/SnackbarContent/SnackbarContent.js +1 -1
  370. package/dist/esm/SnackbarProvider/SnackbarProvider.js +1 -1
  371. package/dist/esm/Stack/Stack.js +10 -11
  372. package/dist/esm/Stack/Stack.js.map +1 -1
  373. package/dist/esm/Switch/Switch.js +1 -1
  374. package/dist/esm/Tab/Tab.js +1 -1
  375. package/dist/esm/Table/Table.js +1 -1
  376. package/dist/esm/Table/TableBody/TableBody.js +1 -1
  377. package/dist/esm/Table/TableCell/TableCell.js +1 -1
  378. package/dist/esm/Table/TableContainer/TableContainer.js +1 -1
  379. package/dist/esm/Table/TableHead/TableHead.js +1 -1
  380. package/dist/esm/Table/TableHeader/TableHeader.js +1 -1
  381. package/dist/esm/Table/TableRow/TableRow.js +1 -1
  382. package/dist/esm/Table/hooks/useRowExpand.js +1 -1
  383. package/dist/esm/Table/hooks/useRowSelection.js +7 -7
  384. package/dist/esm/Table/hooks/useRowSelection.js.map +1 -1
  385. package/dist/esm/Table/renderers/DateColumnCell/DateColumnCell.js +1 -1
  386. package/dist/esm/Table/renderers/DropdownColumnCell/DropdownColumnCell.js +1 -1
  387. package/dist/esm/Table/renderers/ProgressColumnCell/ProgressColumnCell.js +1 -1
  388. package/dist/esm/Table/renderers/SwitchColumnCell/SwitchColumnCell.js +1 -1
  389. package/dist/esm/Table/renderers/renderers.js +1 -1
  390. package/dist/esm/Table/renderers/renderers.js.map +1 -1
  391. package/dist/esm/TableSection/TableSection.js +1 -1
  392. package/dist/esm/TableSection/TableSection.styles.js +1 -1
  393. package/dist/esm/Tabs/Tabs.js +1 -1
  394. package/dist/esm/Tag/Tag.js +1 -1
  395. package/dist/esm/TagsInput/TagsInput.js +2 -2
  396. package/dist/esm/TagsInput/TagsInput.js.map +1 -1
  397. package/dist/esm/TextArea/TextArea.js +1 -1
  398. package/dist/esm/TimeAgo/TimeAgo.js +1 -1
  399. package/dist/esm/TimePicker/Placeholder.js +1 -1
  400. package/dist/esm/TimePicker/TimePicker.js +1 -1
  401. package/dist/esm/TimePicker/Unit/Unit.js +1 -1
  402. package/dist/esm/ToggleButton/ToggleButton.js +1 -1
  403. package/dist/esm/Tooltip/Tooltip.js +10 -6
  404. package/dist/esm/Tooltip/Tooltip.js.map +1 -1
  405. package/dist/esm/TreeView/TreeItem/DefaultContent.js +1 -1
  406. package/dist/esm/TreeView/TreeItem/TreeItem.js +1 -1
  407. package/dist/esm/TreeView/TreeView.js +1 -1
  408. package/dist/esm/TreeView/internals/DescendantProvider.js +2 -2
  409. package/dist/esm/TreeView/internals/DescendantProvider.js.map +1 -1
  410. package/dist/esm/TreeView/internals/TreeViewProvider.js +1 -1
  411. package/dist/esm/Typography/Typography.js +1 -1
  412. package/dist/esm/VerticalNavigation/Actions/Action.js +13 -11
  413. package/dist/esm/VerticalNavigation/Actions/Action.js.map +1 -1
  414. package/dist/esm/VerticalNavigation/Actions/Action.styles.js +4 -4
  415. package/dist/esm/VerticalNavigation/Actions/Action.styles.js.map +1 -1
  416. package/dist/esm/VerticalNavigation/Actions/Actions.js +9 -9
  417. package/dist/esm/VerticalNavigation/Actions/Actions.js.map +1 -1
  418. package/dist/esm/VerticalNavigation/Header/Header.js +46 -26
  419. package/dist/esm/VerticalNavigation/Header/Header.js.map +1 -1
  420. package/dist/esm/VerticalNavigation/Header/Header.styles.js +3 -1
  421. package/dist/esm/VerticalNavigation/Header/Header.styles.js.map +1 -1
  422. package/dist/esm/VerticalNavigation/Navigation/Navigation.js +23 -29
  423. package/dist/esm/VerticalNavigation/Navigation/Navigation.js.map +1 -1
  424. package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopup.styles.js +0 -6
  425. package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopup.styles.js.map +1 -1
  426. package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopupContainer.js +21 -7
  427. package/dist/esm/VerticalNavigation/NavigationPopup/NavigationPopupContainer.js.map +1 -1
  428. package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.js +41 -30
  429. package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.js.map +1 -1
  430. package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.styles.js +6 -9
  431. package/dist/esm/VerticalNavigation/NavigationSlider/NavigationSlider.styles.js.map +1 -1
  432. package/dist/esm/VerticalNavigation/TreeView/IconWrapper/IconWrapper.js +7 -18
  433. package/dist/esm/VerticalNavigation/TreeView/IconWrapper/IconWrapper.js.map +1 -1
  434. package/dist/esm/VerticalNavigation/TreeView/TreeView.js +614 -631
  435. package/dist/esm/VerticalNavigation/TreeView/TreeView.js.map +1 -1
  436. package/dist/esm/VerticalNavigation/TreeView/TreeView.styles.js.map +1 -1
  437. package/dist/esm/VerticalNavigation/TreeView/TreeViewItem.js +39 -26
  438. package/dist/esm/VerticalNavigation/TreeView/TreeViewItem.js.map +1 -1
  439. package/dist/esm/VerticalNavigation/TreeView/TreeViewItem.styles.js +25 -13
  440. package/dist/esm/VerticalNavigation/TreeView/TreeViewItem.styles.js.map +1 -1
  441. package/dist/esm/VerticalNavigation/VerticalNavigation.js +1 -1
  442. package/dist/esm/VerticalNavigation/VerticalNavigation.js.map +1 -1
  443. package/dist/esm/hocs/withTooltip.js +1 -1
  444. package/dist/esm/hooks/useEmotionCache.js +1 -1
  445. package/dist/esm/hooks/useTheme.js +1 -1
  446. package/dist/esm/providers/Provider.js +1 -1
  447. package/dist/esm/providers/Provider.js.map +1 -1
  448. package/dist/esm/providers/ThemeProvider.js +34 -41
  449. package/dist/esm/providers/ThemeProvider.js.map +1 -1
  450. package/dist/esm/types/generic.js.map +1 -1
  451. package/dist/esm/utils/document.js +4 -0
  452. package/dist/esm/utils/document.js.map +1 -1
  453. package/dist/esm/utils/focusableElementFinder.js +1 -1
  454. package/dist/esm/utils/focusableElementFinder.js.map +1 -1
  455. package/dist/esm/utils/iconVariant.js +1 -1
  456. package/dist/esm/utils/theme.js +2 -2
  457. package/dist/esm/utils/theme.js.map +1 -1
  458. package/dist/types/index.d.ts +83 -232
  459. package/package.json +5 -5
  460. package/dist/cjs/VerticalNavigation/TreeView/IconWrapper/IconWrapper.styles.cjs +0 -20
  461. package/dist/esm/VerticalNavigation/TreeView/IconWrapper/IconWrapper.styles.js +0 -18
  462. package/dist/esm/VerticalNavigation/TreeView/IconWrapper/IconWrapper.styles.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"QueryBuilder.js","sources":["../../../src/QueryBuilder/QueryBuilder.tsx"],"sourcesContent":["import { useEffect, useMemo, useReducer, useRef, useState } from \"react\";\n\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useLabels } from \"../hooks/useLabels\";\nimport { DeepPartial } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { isEqual } from \"../utils/helpers\";\nimport { ConfirmationDialog } from \"./ConfirmationDialog\";\nimport {\n defaultCombinators,\n defaultLabels,\n defaultOperators,\n HvQueryBuilderProvider,\n} from \"./Context\";\nimport { staticClasses, useClasses } from \"./QueryBuilder.styles\";\nimport { RuleGroup } from \"./RuleGroup\";\nimport {\n AskAction,\n defaultRendererKey,\n HvQueryBuilderAttribute,\n HvQueryBuilderLabels,\n HvQueryBuilderQuery,\n HvQueryBuilderQueryCombinator,\n HvQueryBuilderQueryOperator,\n HvQueryBuilderRenderers,\n} from \"./types\";\nimport { clearNodeIds, emptyGroup, setNodeIds } from \"./utils\";\nimport reducer from \"./utils/reducer\";\n\nexport { staticClasses as queryBuilderClasses };\n\nexport type HvQueryBuilderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvQueryBuilderProps {\n /** The query attribute types. */\n attributes?: Record<string, HvQueryBuilderAttribute>;\n /** The query rules operators by attribute type and combinator. */\n operators?: Record<string, HvQueryBuilderQueryOperator[]>;\n /** The query combinators operands. */\n combinators?: HvQueryBuilderQueryCombinator[];\n /** The query when the component is controlled. */\n value?: HvQueryBuilderQuery;\n /** The initial query when the component is uncontrolled. */\n defaultValue?: HvQueryBuilderQuery;\n /**\n * The initial query when the component is uncontrolled.\n *\n * @deprecated Use `defaultValue` instead.\n * */\n query?: HvQueryBuilderQuery; // TODO - remove in v6\n /** Callback fired when the query changes. */\n onChange?: (value: HvQueryBuilderQuery) => void;\n /** Max depth of nested query groups. */\n maxDepth?: number;\n /** Object containing all the labels. */\n labels?: DeepPartial<HvQueryBuilderLabels>;\n /** Whether the query builder is in read-only mode. */\n readOnly?: boolean;\n /**\n * Operators that should use the empty value renderer when selected.\n *\n * When one of the listed operators is selected, the rule value is reset and an empty component is rendered.\n * This property takes priority over `renderers`.\n *\n * @default [\"Empty\", \"IsNotEmpty\"]\n * */\n emptyRenderer?: string[];\n /** Custom renderers for the rules' value. */\n renderers?: HvQueryBuilderRenderers;\n /** Whether to opt-out of the confirmation dialogs shown before removing rules and rule groups. @default false. */\n disableConfirmation?: boolean;\n /**\n * Whether to allow attributes to be repeated in AND conditions.\n * By default an error is shown when the selected attribute already exists in an AND conditions.\n * @default false\n */\n allowRepeatedAttributes?: boolean; // TODO - review in v6: should we even have this validation? if needed, we should review its behavior.\n /** A Jss Object used to override or extend the styles applied. */\n classes?: HvQueryBuilderClasses;\n}\n\n// TODO - v6\n// - \"range\", \"Empty\", and \"IsNotEmpty\" operators with internal/built-in logic\n// - review query builder validation\n\n// Notes:\n// Deep clone is needed throughout the component to avoid undesired mutations in props, state, and ref values\n\n/**\n * This component allows you to create conditions and group them using logical operators.\n * It outputs a structured set of rules which can be easily parsed to create SQL/NoSQL/whatever queries.\n *\n * Take a look at the [usage page](https://lumada-design.github.io/uikit/master/?path=/docs/widgets-query-builder-usage--docs) to learn more about this component.\n */\nexport const HvQueryBuilder = (props: HvQueryBuilderProps) => {\n const {\n attributes,\n renderers,\n query: queryProp, // TODO - remove in v6\n value,\n defaultValue,\n onChange,\n disableConfirmation = false,\n allowRepeatedAttributes = false,\n operators = defaultOperators,\n combinators = defaultCombinators,\n maxDepth = 1,\n labels: labelsProp,\n readOnly = false,\n emptyRenderer = [\"Empty\", \"IsNotEmpty\"],\n classes: classesProp,\n } = useDefaultProps(\"HvQueryBuilder\", props);\n\n if (\n import.meta.env.DEV &&\n [\n Object.values(attributes || {}).map(({ type }) => type),\n Object.values(operators || {})\n .map((ops) => ops.map(({ operator }) => operator))\n .flat(),\n ]\n .flat()\n ?.find((key) => key === defaultRendererKey)\n ) {\n // eslint-disable-next-line no-console\n console.error(\n `${defaultRendererKey} is a restricted key and shouldn't be used as an attribute or operator type. Update the key to avoid unexpected behaviors.`,\n );\n }\n\n const { classes } = useClasses(classesProp);\n\n const currentAttributes = useRef<HvQueryBuilderProps[\"attributes\"] | null>(\n null,\n );\n\n const controlled = useRef(value != null);\n const initialQuery = useRef(\n value ?? defaultValue ?? queryProp ?? emptyGroup(),\n );\n const [query, setQuery] = useControlled(value, initialQuery.current);\n const prevQuery = useRef(query);\n\n const [pendingAction, setPendingAction] = useState<AskAction>();\n const [initialState, setInitialState] = useState(true);\n\n const [state, dispatchAction] = useReducer(\n reducer,\n setNodeIds(structuredClone(initialQuery.current)),\n );\n\n const labels = useLabels(defaultLabels, labelsProp);\n\n const contextValue = useMemo(\n () => ({\n dispatchAction,\n askAction: setPendingAction,\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n initialTouched: initialState,\n readOnly,\n renderers,\n disableConfirmation,\n allowRepeatedAttributes,\n emptyRenderer,\n }),\n [\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n readOnly,\n initialState,\n renderers,\n disableConfirmation,\n emptyRenderer,\n allowRepeatedAttributes,\n ],\n );\n\n // Keep track of attributes\n useEffect(() => {\n if (currentAttributes.current == null) {\n // First run, nothing to do\n currentAttributes.current = attributes;\n } else if (currentAttributes.current !== attributes) {\n // Attributes changed. The existing query is almost certainly invalid, so reset it\n currentAttributes.current = attributes;\n dispatchAction({ type: \"reset-query\" });\n }\n }, [attributes]);\n\n useEffect(() => {\n // \"value\" prop was updated by user (when controlled)\n if (!isEqual(prevQuery.current, query)) {\n dispatchAction({\n type: \"set-query\",\n query: setNodeIds(structuredClone(query), state),\n });\n prevQuery.current = query;\n } else if (\n !isEqual(\n clearNodeIds(structuredClone(state)),\n clearNodeIds(structuredClone(query)),\n )\n ) {\n setInitialState(false);\n\n // TODO - remove \"true\" from clearNodeIds in v6 (only keep else statement)\n // To avoid breaking changes, clearNodeIds will delete all ids provided by the user when uncontrolled\n // In the future if the user provides ids, it doesn't make sense to remove them with onChange\n if (!controlled.current) {\n onChange?.(\n clearNodeIds(structuredClone(state), true) as HvQueryBuilderQuery,\n );\n } else {\n // When controlled, the ids provided by the user are not removed. Only the auto generated ones.\n onChange?.(clearNodeIds(structuredClone(state)) as HvQueryBuilderQuery);\n }\n\n prevQuery.current = state;\n // This will only run if uncontrolled\n setQuery(state);\n }\n }, [onChange, query, setQuery, state]);\n\n const handleConfirm = () => {\n if (pendingAction) {\n setPendingAction(undefined);\n pendingAction.actions.forEach((action) => dispatchAction(action));\n }\n };\n\n const handleCancel = () => {\n setPendingAction(undefined);\n };\n\n return (\n <HvQueryBuilderProvider value={contextValue}>\n <RuleGroup\n level={0}\n id={state.id}\n combinator={state.combinator}\n rules={state.rules}\n classes={classes}\n />\n <ConfirmationDialog\n isOpen={pendingAction != null}\n onConfirm={handleConfirm}\n onCancel={handleCancel}\n title={pendingAction?.dialog.dialogTitle}\n message={pendingAction?.dialog.dialogMessage}\n confirmButtonLabel={pendingAction?.dialog.dialogConfirm}\n cancelButtonLabel={pendingAction?.dialog.dialogCancel}\n closeButtonTooltip={pendingAction?.dialog.dialogCloseTooltip}\n />\n </HvQueryBuilderProvider>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"QueryBuilder.js","sources":["../../../src/QueryBuilder/QueryBuilder.tsx"],"sourcesContent":["import { useEffect, useMemo, useReducer, useRef, useState } from \"react\";\n\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useLabels } from \"../hooks/useLabels\";\nimport { DeepPartial } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { isEqual } from \"../utils/helpers\";\nimport { ConfirmationDialog } from \"./ConfirmationDialog\";\nimport {\n defaultCombinators,\n defaultLabels,\n defaultOperators,\n HvQueryBuilderProvider,\n} from \"./Context\";\nimport { staticClasses, useClasses } from \"./QueryBuilder.styles\";\nimport { RuleGroup } from \"./RuleGroup\";\nimport {\n AskAction,\n defaultRendererKey,\n HvQueryBuilderAttribute,\n HvQueryBuilderLabels,\n HvQueryBuilderQuery,\n HvQueryBuilderQueryCombinator,\n HvQueryBuilderQueryOperator,\n HvQueryBuilderRenderers,\n} from \"./types\";\nimport { clearNodeIds, emptyGroup, setNodeIds } from \"./utils\";\nimport reducer from \"./utils/reducer\";\n\nexport { staticClasses as queryBuilderClasses };\n\nexport type HvQueryBuilderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvQueryBuilderProps {\n /** The query attribute types. */\n attributes?: Record<string, HvQueryBuilderAttribute>;\n /** The query rules operators by attribute type and combinator. */\n operators?: Record<string, HvQueryBuilderQueryOperator[]>;\n /** The query combinators operands. */\n combinators?: HvQueryBuilderQueryCombinator[];\n /** The query when the component is controlled. */\n value?: HvQueryBuilderQuery;\n /** The initial query when the component is uncontrolled. */\n defaultValue?: HvQueryBuilderQuery;\n /**\n * The initial query when the component is uncontrolled.\n *\n * @deprecated Use `defaultValue` instead.\n * */\n query?: HvQueryBuilderQuery; // TODO - remove in v6\n /** Callback fired when the query changes. */\n onChange?: (value: HvQueryBuilderQuery) => void;\n /** Max depth of nested query groups. */\n maxDepth?: number;\n /** Object containing all the labels. */\n labels?: DeepPartial<HvQueryBuilderLabels>;\n /** Whether the query builder is in read-only mode. */\n readOnly?: boolean;\n /**\n * Operators that should use the empty value renderer when selected.\n *\n * When one of the listed operators is selected, the rule value is reset and an empty component is rendered.\n * This property takes priority over `renderers`.\n *\n * @default [\"Empty\", \"IsNotEmpty\"]\n * */\n emptyRenderer?: string[];\n /** Custom renderers for the rules' value. */\n renderers?: HvQueryBuilderRenderers;\n /** Whether to opt-out of the confirmation dialogs shown before removing rules and rule groups. @default false. */\n disableConfirmation?: boolean;\n /**\n * Whether to allow attributes to be repeated in AND conditions.\n * By default an error is shown when the selected attribute already exists in an AND conditions.\n * @default false\n */\n allowRepeatedAttributes?: boolean; // TODO - review in v6: should we even have this validation? if needed, we should review its behavior.\n /** A Jss Object used to override or extend the styles applied. */\n classes?: HvQueryBuilderClasses;\n}\n\n// TODO - v6\n// - \"range\", \"Empty\", and \"IsNotEmpty\" operators with internal/built-in logic\n// - review query builder validation\n\n// Notes:\n// Deep clone is needed throughout the component to avoid undesired mutations in props, state, and ref values\n\n/**\n * This component allows you to create conditions and group them using logical operators.\n * It outputs a structured set of rules which can be easily parsed to create SQL/NoSQL/whatever queries.\n *\n * Take a look at the [usage page](https://lumada-design.github.io/uikit/master/?path=/docs/widgets-query-builder-usage--docs) to learn more about this component.\n */\nexport const HvQueryBuilder = (props: HvQueryBuilderProps) => {\n const {\n attributes,\n renderers,\n query: queryProp, // TODO - remove in v6\n value,\n defaultValue,\n onChange,\n disableConfirmation = false,\n allowRepeatedAttributes = false,\n operators = defaultOperators,\n combinators = defaultCombinators,\n maxDepth = 1,\n labels: labelsProp,\n readOnly = false,\n emptyRenderer = [\"Empty\", \"IsNotEmpty\"],\n classes: classesProp,\n } = useDefaultProps(\"HvQueryBuilder\", props);\n\n if (\n import.meta.env.DEV &&\n [\n Object.values(attributes || {}).map(({ type }) => type),\n Object.values(operators || {}).flatMap((ops) =>\n ops.map(({ operator }) => operator),\n ),\n ]\n .flat()\n ?.find((key) => key === defaultRendererKey)\n ) {\n // eslint-disable-next-line no-console\n console.error(\n `${defaultRendererKey} is a restricted key and shouldn't be used as an attribute or operator type. Update the key to avoid unexpected behaviors.`,\n );\n }\n\n const { classes } = useClasses(classesProp);\n\n const currentAttributes = useRef<HvQueryBuilderProps[\"attributes\"] | null>(\n null,\n );\n\n const controlled = useRef(value != null);\n const initialQuery = useRef(\n value ?? defaultValue ?? queryProp ?? emptyGroup(),\n );\n const [query, setQuery] = useControlled(value, initialQuery.current);\n const prevQuery = useRef(query);\n\n const [pendingAction, setPendingAction] = useState<AskAction>();\n const [initialState, setInitialState] = useState(true);\n\n const [state, dispatchAction] = useReducer(\n reducer,\n setNodeIds(structuredClone(initialQuery.current)),\n );\n\n const labels = useLabels(defaultLabels, labelsProp);\n\n const contextValue = useMemo(\n () => ({\n dispatchAction,\n askAction: setPendingAction,\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n initialTouched: initialState,\n readOnly,\n renderers,\n disableConfirmation,\n allowRepeatedAttributes,\n emptyRenderer,\n }),\n [\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n readOnly,\n initialState,\n renderers,\n disableConfirmation,\n emptyRenderer,\n allowRepeatedAttributes,\n ],\n );\n\n // Keep track of attributes\n useEffect(() => {\n if (currentAttributes.current == null) {\n // First run, nothing to do\n currentAttributes.current = attributes;\n } else if (currentAttributes.current !== attributes) {\n // Attributes changed. The existing query is almost certainly invalid, so reset it\n currentAttributes.current = attributes;\n dispatchAction({ type: \"reset-query\" });\n }\n }, [attributes]);\n\n useEffect(() => {\n // \"value\" prop was updated by user (when controlled)\n if (!isEqual(prevQuery.current, query)) {\n dispatchAction({\n type: \"set-query\",\n query: setNodeIds(structuredClone(query), state),\n });\n prevQuery.current = query;\n } else if (\n !isEqual(\n clearNodeIds(structuredClone(state)),\n clearNodeIds(structuredClone(query)),\n )\n ) {\n setInitialState(false);\n\n // TODO - remove \"true\" from clearNodeIds in v6 (only keep else statement)\n // To avoid breaking changes, clearNodeIds will delete all ids provided by the user when uncontrolled\n // In the future if the user provides ids, it doesn't make sense to remove them with onChange\n if (!controlled.current) {\n onChange?.(\n clearNodeIds(structuredClone(state), true) as HvQueryBuilderQuery,\n );\n } else {\n // When controlled, the ids provided by the user are not removed. Only the auto generated ones.\n onChange?.(clearNodeIds(structuredClone(state)) as HvQueryBuilderQuery);\n }\n\n prevQuery.current = state;\n // This will only run if uncontrolled\n setQuery(state);\n }\n }, [onChange, query, setQuery, state]);\n\n const handleConfirm = () => {\n if (pendingAction) {\n setPendingAction(undefined);\n pendingAction.actions.forEach((action) => dispatchAction(action));\n }\n };\n\n const handleCancel = () => {\n setPendingAction(undefined);\n };\n\n return (\n <HvQueryBuilderProvider value={contextValue}>\n <RuleGroup\n level={0}\n id={state.id}\n combinator={state.combinator}\n rules={state.rules}\n classes={classes}\n />\n <ConfirmationDialog\n isOpen={pendingAction != null}\n onConfirm={handleConfirm}\n onCancel={handleCancel}\n title={pendingAction?.dialog.dialogTitle}\n message={pendingAction?.dialog.dialogMessage}\n confirmButtonLabel={pendingAction?.dialog.dialogConfirm}\n cancelButtonLabel={pendingAction?.dialog.dialogCancel}\n closeButtonTooltip={pendingAction?.dialog.dialogCloseTooltip}\n />\n </HvQueryBuilderProvider>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useMemo, memo } from "react";
3
3
  import { useQueryBuilderContext } from "../../Context.js";
4
4
  import { isBigList } from "../../utils/index.js";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useMemo, memo } from "react";
3
3
  import { useQueryBuilderContext } from "../../Context.js";
4
4
  import { isBigList } from "../../utils/index.js";
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { useMemo } from "react";
3
3
  import { useTheme } from "@mui/material/styles";
4
4
  import useMediaQuery from "@mui/material/useMediaQuery";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { memo } from "react";
3
3
  import { useQueryBuilderContext } from "../../../Context.js";
4
4
  import { isBigList } from "../../../utils/index.js";
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { useState, useCallback, useMemo, memo } from "react";
3
3
  import { useTheme } from "@mui/material/styles";
4
4
  import useMediaQuery from "@mui/material/useMediaQuery";
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { useCallback, useState, memo } from "react";
3
3
  import { useTheme } from "@mui/material/styles";
4
4
  import useMediaQuery from "@mui/material/useMediaQuery";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useState, memo } from "react";
3
3
  import { useQueryBuilderContext } from "../../../Context.js";
4
4
  import { useClasses } from "./TextValue.styles.js";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { memo } from "react";
3
3
  import { useQueryBuilderContext } from "../../Context.js";
4
4
  import { defaultRendererKey } from "../../types.js";
@@ -1,4 +1,4 @@
1
- import { jsxs, Fragment, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, Fragment, jsx } from "react/jsx-runtime";
2
2
  import { useCallback } from "react";
3
3
  import { Add, Delete, Info } from "@hitachivantara/uikit-react-icons";
4
4
  import { useQueryBuilderContext } from "../Context.js";
@@ -23,7 +23,7 @@ const clearNodeIds = (original, full = false) => {
23
23
  const isQueryGroup = (value) => "rules" in value;
24
24
  const setNodeIds = (query, prevQuery) => {
25
25
  if (!query.id) {
26
- query.id = prevQuery && prevQuery?.id && isEqual(
26
+ query.id = prevQuery?.id && isEqual(
27
27
  clearNodeIds(structuredClone(query)),
28
28
  clearNodeIds(structuredClone(prevQuery))
29
29
  ) ? prevQuery.id : createId();
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../src/QueryBuilder/utils/index.tsx"],"sourcesContent":["import { isEqual, uniqueId } from \"../../utils/helpers\";\nimport {\n HvQueryBuilderQueryGroup,\n HvQueryBuilderQueryRule,\n Query,\n} from \"../types\";\n\nexport const isBigList = (values: unknown[]) =>\n values != null && values?.length > 10;\n\nconst ID_PREFIX = \"@hv_\";\nconst createId = () => uniqueId(ID_PREFIX);\n\nexport const emptyRule = () => ({\n id: createId(),\n});\n\nexport const emptyGroup = (createEmptyRule = false) => ({\n id: createId(),\n combinator: \"and\",\n rules: createEmptyRule ? [emptyRule()] : [],\n});\n\nexport const clearNodeIds = (\n original: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n full: boolean = false,\n) => {\n const rule = { ...original };\n\n if ((!full && rule.id?.toString().startsWith(ID_PREFIX)) || full) {\n delete rule.id;\n }\n\n if (\"rules\" in rule) {\n rule.rules = rule.rules.map((r) => clearNodeIds(r, full));\n }\n\n return rule;\n};\n\nconst isQueryGroup = (\n value: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): value is HvQueryBuilderQueryGroup => \"rules\" in value;\n\nexport const setNodeIds = (\n query: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n prevQuery?: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): Query => {\n // Use already existing autogenerated id when possible\n if (!query.id) {\n query.id =\n prevQuery &&\n prevQuery?.id &&\n isEqual(\n clearNodeIds(structuredClone(query)),\n clearNodeIds(structuredClone(prevQuery)),\n )\n ? prevQuery.id\n : createId();\n }\n\n if (isQueryGroup(query)) {\n query.rules = query.rules.map((item, idx) =>\n setNodeIds(\n item,\n prevQuery && isQueryGroup(prevQuery) ? prevQuery.rules[idx] : undefined,\n ),\n );\n }\n\n return query as Query;\n};\n\nexport const findNodeById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n) => {\n if (node.id === id) {\n return node;\n }\n if (\"rules\" in node) {\n for (let i = 0; i < node.rules.length; ++i) {\n const rule = node.rules[i];\n\n const found = findNodeById(id, rule);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n\nexport const findParentById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n parent?: HvQueryBuilderQueryGroup,\n) => {\n if (node.id === id) {\n return parent ?? null;\n }\n\n if (\"rules\" in node) {\n const group = node;\n\n for (let i = 0; i < group.rules.length; ++i) {\n const rule = group.rules[i];\n\n const found = findParentById(id, rule, group);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n"],"names":[],"mappings":";AAOO,MAAM,YAAY,CAAC,WACxB,UAAU,QAAQ,QAAQ,SAAS;AAErC,MAAM,YAAY;AAClB,MAAM,WAAW,MAAM,SAAS,SAAS;AAElC,MAAM,YAAY,OAAO;AAAA,EAC9B,IAAI,SAAS;AACf;AAEa,MAAA,aAAa,CAAC,kBAAkB,WAAW;AAAA,EACtD,IAAI,SAAS;AAAA,EACb,YAAY;AAAA,EACZ,OAAO,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC;AAC5C;AAEO,MAAM,eAAe,CAC1B,UACA,OAAgB,UACb;AACG,QAAA,OAAO,EAAE,GAAG;AAEb,MAAA,CAAC,QAAQ,KAAK,IAAI,WAAW,WAAW,SAAS,KAAM,MAAM;AAChE,WAAO,KAAK;AAAA,EACd;AAEA,MAAI,WAAW,MAAM;AACd,SAAA,QAAQ,KAAK,MAAM,IAAI,CAAC,MAAM,aAAa,GAAG,IAAI,CAAC;AAAA,EAC1D;AAEO,SAAA;AACT;AAEA,MAAM,eAAe,CACnB,UACsC,WAAW;AAEtC,MAAA,aAAa,CACxB,OACA,cACU;AAEN,MAAA,CAAC,MAAM,IAAI;AACP,UAAA,KACJ,aACA,WAAW,MACX;AAAA,MACE,aAAa,gBAAgB,KAAK,CAAC;AAAA,MACnC,aAAa,gBAAgB,SAAS,CAAC;AAAA,IAAA,IAErC,UAAU,KACV;EACR;AAEI,MAAA,aAAa,KAAK,GAAG;AACjB,UAAA,QAAQ,MAAM,MAAM;AAAA,MAAI,CAAC,MAAM,QACnC;AAAA,QACE;AAAA,QACA,aAAa,aAAa,SAAS,IAAI,UAAU,MAAM,GAAG,IAAI;AAAA,MAChE;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AACT;AAEa,MAAA,eAAe,CAC1B,IACA,SACG;AACC,MAAA,KAAK,OAAO,IAAI;AACX,WAAA;AAAA,EACT;AACA,MAAI,WAAW,MAAM;AACnB,aAAS,IAAI,GAAG,IAAI,KAAK,MAAM,QAAQ,EAAE,GAAG;AACpC,YAAA,OAAO,KAAK,MAAM,CAAC;AAEnB,YAAA,QAAQ,aAAa,IAAI,IAAI;AACnC,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;AAEO,MAAM,iBAAiB,CAC5B,IACA,MACA,WACG;AACC,MAAA,KAAK,OAAO,IAAI;AAClB,WAAO,UAAU;AAAA,EACnB;AAEA,MAAI,WAAW,MAAM;AACnB,UAAM,QAAQ;AAEd,aAAS,IAAI,GAAG,IAAI,MAAM,MAAM,QAAQ,EAAE,GAAG;AACrC,YAAA,OAAO,MAAM,MAAM,CAAC;AAE1B,YAAM,QAAQ,eAAe,IAAI,MAAM,KAAK;AAC5C,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;"}
1
+ {"version":3,"file":"index.js","sources":["../../../../src/QueryBuilder/utils/index.tsx"],"sourcesContent":["import { isEqual, uniqueId } from \"../../utils/helpers\";\nimport {\n HvQueryBuilderQueryGroup,\n HvQueryBuilderQueryRule,\n Query,\n} from \"../types\";\n\nexport const isBigList = (values: unknown[]) =>\n values != null && values?.length > 10;\n\nconst ID_PREFIX = \"@hv_\";\nconst createId = () => uniqueId(ID_PREFIX);\n\nexport const emptyRule = () => ({\n id: createId(),\n});\n\nexport const emptyGroup = (createEmptyRule = false) => ({\n id: createId(),\n combinator: \"and\",\n rules: createEmptyRule ? [emptyRule()] : [],\n});\n\nexport const clearNodeIds = (\n original: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n full = false,\n) => {\n const rule = { ...original };\n\n if ((!full && rule.id?.toString().startsWith(ID_PREFIX)) || full) {\n delete rule.id;\n }\n\n if (\"rules\" in rule) {\n rule.rules = rule.rules.map((r) => clearNodeIds(r, full));\n }\n\n return rule;\n};\n\nconst isQueryGroup = (\n value: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): value is HvQueryBuilderQueryGroup => \"rules\" in value;\n\nexport const setNodeIds = (\n query: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n prevQuery?: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n): Query => {\n // Use already existing autogenerated id when possible\n if (!query.id) {\n query.id =\n prevQuery?.id &&\n isEqual(\n clearNodeIds(structuredClone(query)),\n clearNodeIds(structuredClone(prevQuery)),\n )\n ? prevQuery.id\n : createId();\n }\n\n if (isQueryGroup(query)) {\n query.rules = query.rules.map((item, idx) =>\n setNodeIds(\n item,\n prevQuery && isQueryGroup(prevQuery) ? prevQuery.rules[idx] : undefined,\n ),\n );\n }\n\n return query as Query;\n};\n\nexport const findNodeById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n) => {\n if (node.id === id) {\n return node;\n }\n if (\"rules\" in node) {\n for (let i = 0; i < node.rules.length; ++i) {\n const rule = node.rules[i];\n\n const found = findNodeById(id, rule);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n\nexport const findParentById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n parent?: HvQueryBuilderQueryGroup,\n) => {\n if (node.id === id) {\n return parent ?? null;\n }\n\n if (\"rules\" in node) {\n const group = node;\n\n for (let i = 0; i < group.rules.length; ++i) {\n const rule = group.rules[i];\n\n const found = findParentById(id, rule, group);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n"],"names":[],"mappings":";AAOO,MAAM,YAAY,CAAC,WACxB,UAAU,QAAQ,QAAQ,SAAS;AAErC,MAAM,YAAY;AAClB,MAAM,WAAW,MAAM,SAAS,SAAS;AAElC,MAAM,YAAY,OAAO;AAAA,EAC9B,IAAI,SAAS;AACf;AAEa,MAAA,aAAa,CAAC,kBAAkB,WAAW;AAAA,EACtD,IAAI,SAAS;AAAA,EACb,YAAY;AAAA,EACZ,OAAO,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC;AAC5C;AAEO,MAAM,eAAe,CAC1B,UACA,OAAO,UACJ;AACG,QAAA,OAAO,EAAE,GAAG;AAEb,MAAA,CAAC,QAAQ,KAAK,IAAI,WAAW,WAAW,SAAS,KAAM,MAAM;AAChE,WAAO,KAAK;AAAA,EACd;AAEA,MAAI,WAAW,MAAM;AACd,SAAA,QAAQ,KAAK,MAAM,IAAI,CAAC,MAAM,aAAa,GAAG,IAAI,CAAC;AAAA,EAC1D;AAEO,SAAA;AACT;AAEA,MAAM,eAAe,CACnB,UACsC,WAAW;AAEtC,MAAA,aAAa,CACxB,OACA,cACU;AAEN,MAAA,CAAC,MAAM,IAAI;AACP,UAAA,KACJ,WAAW,MACX;AAAA,MACE,aAAa,gBAAgB,KAAK,CAAC;AAAA,MACnC,aAAa,gBAAgB,SAAS,CAAC;AAAA,IAAA,IAErC,UAAU,KACV;EACR;AAEI,MAAA,aAAa,KAAK,GAAG;AACjB,UAAA,QAAQ,MAAM,MAAM;AAAA,MAAI,CAAC,MAAM,QACnC;AAAA,QACE;AAAA,QACA,aAAa,aAAa,SAAS,IAAI,UAAU,MAAM,GAAG,IAAI;AAAA,MAChE;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AACT;AAEa,MAAA,eAAe,CAC1B,IACA,SACG;AACC,MAAA,KAAK,OAAO,IAAI;AACX,WAAA;AAAA,EACT;AACA,MAAI,WAAW,MAAM;AACnB,aAAS,IAAI,GAAG,IAAI,KAAK,MAAM,QAAQ,EAAE,GAAG;AACpC,YAAA,OAAO,KAAK,MAAM,CAAC;AAEnB,YAAA,QAAQ,aAAa,IAAI,IAAI;AACnC,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;AAEO,MAAM,iBAAiB,CAC5B,IACA,MACA,WACG;AACC,MAAA,KAAK,OAAO,IAAI;AAClB,WAAO,UAAU;AAAA,EACnB;AAEA,MAAI,WAAW,MAAM;AACnB,UAAM,QAAQ;AAEd,aAAS,IAAI,GAAG,IAAI,MAAM,MAAM,QAAQ,EAAE,GAAG;AACrC,YAAA,OAAO,MAAM,MAAM,CAAC;AAE1B,YAAM,QAAQ,eAAe,IAAI,MAAM,KAAK;AAC5C,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;"}
@@ -1,4 +1,4 @@
1
- import { jsx, jsxs } from "@emotion/react/jsx-runtime";
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { forwardRef, useState, useCallback } from "react";
3
3
  import { useControlled } from "../hooks/useControlled.js";
4
4
  import { useDefaultProps } from "../hooks/useDefaultProps.js";
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { forwardRef, useCallback, useMemo, Children, cloneElement } from "react";
3
3
  import { useControlled } from "../hooks/useControlled.js";
4
4
  import { useDefaultProps } from "../hooks/useDefaultProps.js";
@@ -1,4 +1,4 @@
1
- import { jsx, jsxs } from "@emotion/react/jsx-runtime";
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { useDefaultProps } from "../../../hooks/useDefaultProps.js";
3
3
  import { setId } from "../../../utils/setId.js";
4
4
  import { useClasses } from "./HorizontalScrollListItem.styles.js";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useTheme } from "@mui/material/styles";
3
3
  import useMediaQuery from "@mui/material/useMediaQuery";
4
4
  import { theme } from "@hitachivantara/uikit-styles";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useDefaultProps } from "../../hooks/useDefaultProps.js";
3
3
  import { isKey } from "../../utils/keyboardUtils.js";
4
4
  import { setId } from "../../utils/setId.js";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useDefaultProps } from "../../../hooks/useDefaultProps.js";
3
3
  import { useClasses } from "./VerticalScrollListItem.styles.js";
4
4
  import { staticClasses } from "./VerticalScrollListItem.styles.js";
@@ -1 +1 @@
1
- {"version":3,"file":"useScrollTo.js","sources":["../../../src/ScrollTo/useScrollTo.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { HvScrollToOption } from \"./types\";\nimport {\n findFirstVisibleElement,\n getScrollTop,\n isScrolledToTheBottom,\n scrollElement,\n verticalScrollOffset,\n} from \"./utils\";\n\ninterface HvScrollToOptionWithLink extends HvScrollToOption {\n href: string;\n}\n\nexport const useScrollTo = (\n selectedIndexProp: number = 0,\n scrollElementId: string | undefined = undefined,\n navigationMode: \"push\" | \"replace\" | \"none\" = \"push\",\n relativeLinks: boolean = false,\n offset: number = 0,\n options: HvScrollToOption[] = [],\n onChange:\n | ((\n event:\n | Event\n | React.MouseEvent<HTMLDivElement | HTMLAnchorElement>\n | React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement>,\n index: number,\n ) => void)\n | undefined = undefined,\n direction: \"column\" | \"row\" = \"column\",\n): [\n number,\n (\n event:\n | React.MouseEvent<HTMLDivElement | HTMLAnchorElement>\n | React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void,\n ) => void,\n HvScrollToOptionWithLink[],\n] => {\n const RETRY_MAX: number = 5;\n const [selectedIndex, setSelectedIndex] = useState<number>(selectedIndexProp);\n\n const scrollEle = useRef<HTMLElement | (Window & typeof globalThis)>(window);\n const requestedAnimationFrame = useRef(0);\n const lastContainerScrollTop = useRef<number>(0);\n\n // Ref to use a often-changing value in useCallback, as recommended in\n // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n const selectedIndexRef = useRef(selectedIndex);\n\n useEffect(() => {\n selectedIndexRef.current = selectedIndex;\n }, [selectedIndex]);\n\n useEffect(() => {\n scrollEle.current =\n (scrollElementId && document.getElementById(scrollElementId)) || window;\n\n lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);\n }, [scrollElementId]);\n\n const checkScroll = useCallback(\n (\n event:\n | Event\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n ) => {\n if (\n requestedAnimationFrame.current === 0 &&\n window?.requestAnimationFrame\n ) {\n requestedAnimationFrame.current = window.requestAnimationFrame(() => {\n requestedAnimationFrame.current = 0;\n\n const firstVisibleElementIndex = findFirstVisibleElement(\n scrollEle.current,\n options,\n offset,\n );\n\n let newSelectedIndex = firstVisibleElementIndex;\n\n // select the first element when all elements are bellow the container's top\n if (firstVisibleElementIndex < 0) {\n newSelectedIndex = 0;\n }\n\n // if the user has reached the bottom of the container, select the first nav item still visible\n // (usually this selects the last nav item, when it can't reach the top the container)\n // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour\n if (\n newSelectedIndex < options.length - 1 &&\n isScrolledToTheBottom(scrollEle.current)\n ) {\n newSelectedIndex += 1;\n }\n\n const containerScrollTop = getScrollTop(scrollEle.current);\n const isScrollingDown =\n containerScrollTop > lastContainerScrollTop.current;\n lastContainerScrollTop.current = containerScrollTop;\n\n // only update the selected item if the scroll direction is moving away from it\n if (isScrollingDown) {\n if (newSelectedIndex < selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n } else if (newSelectedIndex > selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n\n setSelectedIndex(newSelectedIndex);\n onChange?.(event, newSelectedIndex);\n });\n }\n },\n [offset, options, onChange],\n );\n\n // Registers and unregisters the scroll listener\n useEffect(() => {\n if (scrollEle.current) {\n scrollEle.current.addEventListener(\"scroll\", checkScroll, false);\n }\n\n return () => {\n if (scrollEle.current) {\n scrollEle.current.removeEventListener(\"scroll\", checkScroll);\n }\n\n if (requestedAnimationFrame.current !== 0) {\n window.cancelAnimationFrame(requestedAnimationFrame.current);\n requestedAnimationFrame.current = 0;\n }\n };\n }, [checkScroll]);\n\n // Waits for the elements to be rendered and scrolls to the one referenced in the URL hash, if any\n useEffect(() => {\n let checkRenderedInterval: any;\n\n if (navigationMode !== \"none\") {\n const hashValue = document.location.hash.split(\"#\")[1] || \"\";\n\n const option = options.find((o) => o.value === hashValue);\n\n if (option) {\n let retry = 0;\n checkRenderedInterval = setInterval(() => {\n const ele = document.getElementById(option.value);\n\n if (ele) {\n scrollElement(ele, scrollEle.current, option.offset || offset);\n clearInterval(checkRenderedInterval);\n } else {\n retry += 1;\n if (retry === RETRY_MAX) {\n clearInterval(checkRenderedInterval);\n }\n }\n }, 1000);\n }\n }\n\n return () => {\n clearInterval(checkRenderedInterval);\n };\n\n // We really want to run this just in the first load\n // in fact this doesn't even belong here, the logic should be external\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const baseUrl =\n relativeLinks || window == null ? \"\" : window.location.href.split(\"#\")[0];\n\n const elements = useMemo(\n () =>\n options.map((o) => ({\n ...o,\n href: `${baseUrl}#${o.value}`,\n })),\n [options, baseUrl],\n );\n\n const setScrollTo = useCallback(\n (\n event:\n | React.MouseEvent<HTMLDivElement | HTMLAnchorElement>\n | React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void,\n ) => {\n const option = elements.find((o) => o.value === id);\n\n if (option) {\n const ele = document.getElementById(id);\n if (ele) {\n scrollElement(\n ele,\n scrollEle.current,\n option.offset || offset,\n direction,\n );\n }\n\n if (navigationMode === \"push\") {\n window.history.pushState({}, \"\", option.href);\n } else if (navigationMode === \"replace\") {\n window.history.replaceState({}, \"\", option.href);\n }\n\n setSelectedIndex(index);\n wrappedOnChange?.(index);\n\n // Safari scrolls immediately (no smooth scroll support),\n // so this ref value must be updated asap\n selectedIndexRef.current = index;\n }\n },\n [elements, navigationMode, direction, offset],\n );\n\n return [selectedIndex, setScrollTo, elements];\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"useScrollTo.js","sources":["../../../src/ScrollTo/useScrollTo.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport { HvScrollToOption } from \"./types\";\nimport {\n findFirstVisibleElement,\n getScrollTop,\n isScrolledToTheBottom,\n scrollElement,\n verticalScrollOffset,\n} from \"./utils\";\n\ninterface HvScrollToOptionWithLink extends HvScrollToOption {\n href: string;\n}\n\nexport const useScrollTo = (\n selectedIndexProp = 0,\n scrollElementId: string | undefined = undefined,\n navigationMode: \"push\" | \"replace\" | \"none\" = \"push\",\n relativeLinks = false,\n offset = 0,\n options: HvScrollToOption[] = [],\n onChange:\n | ((\n event:\n | Event\n | React.MouseEvent<HTMLDivElement | HTMLAnchorElement>\n | React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement>,\n index: number,\n ) => void)\n | undefined = undefined,\n direction: \"column\" | \"row\" = \"column\",\n): [\n number,\n (\n event:\n | React.MouseEvent<HTMLDivElement | HTMLAnchorElement>\n | React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void,\n ) => void,\n HvScrollToOptionWithLink[],\n] => {\n const RETRY_MAX: number = 5;\n const [selectedIndex, setSelectedIndex] = useState<number>(selectedIndexProp);\n\n const scrollEle = useRef<HTMLElement | (Window & typeof globalThis)>(window);\n const requestedAnimationFrame = useRef(0);\n const lastContainerScrollTop = useRef<number>(0);\n\n // Ref to use a often-changing value in useCallback, as recommended in\n // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n const selectedIndexRef = useRef(selectedIndex);\n\n useEffect(() => {\n selectedIndexRef.current = selectedIndex;\n }, [selectedIndex]);\n\n useEffect(() => {\n scrollEle.current =\n (scrollElementId && document.getElementById(scrollElementId)) || window;\n\n lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);\n }, [scrollElementId]);\n\n const checkScroll = useCallback(\n (\n event:\n | Event\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n ) => {\n if (\n requestedAnimationFrame.current === 0 &&\n window?.requestAnimationFrame\n ) {\n requestedAnimationFrame.current = window.requestAnimationFrame(() => {\n requestedAnimationFrame.current = 0;\n\n const firstVisibleElementIndex = findFirstVisibleElement(\n scrollEle.current,\n options,\n offset,\n );\n\n let newSelectedIndex = firstVisibleElementIndex;\n\n // select the first element when all elements are bellow the container's top\n if (firstVisibleElementIndex < 0) {\n newSelectedIndex = 0;\n }\n\n // if the user has reached the bottom of the container, select the first nav item still visible\n // (usually this selects the last nav item, when it can't reach the top the container)\n // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour\n if (\n newSelectedIndex < options.length - 1 &&\n isScrolledToTheBottom(scrollEle.current)\n ) {\n newSelectedIndex += 1;\n }\n\n const containerScrollTop = getScrollTop(scrollEle.current);\n const isScrollingDown =\n containerScrollTop > lastContainerScrollTop.current;\n lastContainerScrollTop.current = containerScrollTop;\n\n // only update the selected item if the scroll direction is moving away from it\n if (isScrollingDown) {\n if (newSelectedIndex < selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n } else if (newSelectedIndex > selectedIndexRef.current) {\n newSelectedIndex = selectedIndexRef.current;\n }\n\n setSelectedIndex(newSelectedIndex);\n onChange?.(event, newSelectedIndex);\n });\n }\n },\n [offset, options, onChange],\n );\n\n // Registers and unregisters the scroll listener\n useEffect(() => {\n if (scrollEle.current) {\n scrollEle.current.addEventListener(\"scroll\", checkScroll, false);\n }\n\n return () => {\n if (scrollEle.current) {\n scrollEle.current.removeEventListener(\"scroll\", checkScroll);\n }\n\n if (requestedAnimationFrame.current !== 0) {\n window.cancelAnimationFrame(requestedAnimationFrame.current);\n requestedAnimationFrame.current = 0;\n }\n };\n }, [checkScroll]);\n\n // Waits for the elements to be rendered and scrolls to the one referenced in the URL hash, if any\n useEffect(() => {\n let checkRenderedInterval: any;\n\n if (navigationMode !== \"none\") {\n const hashValue = document.location.hash.split(\"#\")[1] || \"\";\n\n const option = options.find((o) => o.value === hashValue);\n\n if (option) {\n let retry = 0;\n checkRenderedInterval = setInterval(() => {\n const ele = document.getElementById(option.value);\n\n if (ele) {\n scrollElement(ele, scrollEle.current, option.offset || offset);\n clearInterval(checkRenderedInterval);\n } else {\n retry += 1;\n if (retry === RETRY_MAX) {\n clearInterval(checkRenderedInterval);\n }\n }\n }, 1000);\n }\n }\n\n return () => {\n clearInterval(checkRenderedInterval);\n };\n\n // We really want to run this just in the first load\n // in fact this doesn't even belong here, the logic should be external\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const baseUrl =\n relativeLinks || window == null ? \"\" : window.location.href.split(\"#\")[0];\n\n const elements = useMemo(\n () =>\n options.map((o) => ({\n ...o,\n href: `${baseUrl}#${o.value}`,\n })),\n [options, baseUrl],\n );\n\n const setScrollTo = useCallback(\n (\n event:\n | React.MouseEvent<HTMLDivElement | HTMLAnchorElement>\n | React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement>,\n id: string,\n index: number,\n wrappedOnChange?: (index: number) => void,\n ) => {\n const option = elements.find((o) => o.value === id);\n\n if (option) {\n const ele = document.getElementById(id);\n if (ele) {\n scrollElement(\n ele,\n scrollEle.current,\n option.offset || offset,\n direction,\n );\n }\n\n if (navigationMode === \"push\") {\n window.history.pushState({}, \"\", option.href);\n } else if (navigationMode === \"replace\") {\n window.history.replaceState({}, \"\", option.href);\n }\n\n setSelectedIndex(index);\n wrappedOnChange?.(index);\n\n // Safari scrolls immediately (no smooth scroll support),\n // so this ref value must be updated asap\n selectedIndexRef.current = index;\n }\n },\n [elements, navigationMode, direction, offset],\n );\n\n return [selectedIndex, setScrollTo, elements];\n};\n"],"names":[],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  const getScrollTop = (c = window) => {
2
2
  if (c === window) {
3
- return window.scrollY || window.pageYOffset || document.documentElement && document.documentElement.scrollTop || document.body.scrollTop;
3
+ return window.scrollY || window.pageYOffset || document.documentElement?.scrollTop || document.body.scrollTop;
4
4
  }
5
5
  return c.scrollTop;
6
6
  };
@@ -41,7 +41,7 @@ const scrollElement = (element, container, offset = 0, direction) => {
41
41
  const isScrolledToTheBottom = (container) => {
42
42
  const containerScrollTop = getScrollTop(container);
43
43
  if (container === window) {
44
- const scrollHeight = document.documentElement && document.documentElement.scrollHeight || document.body.scrollHeight;
44
+ const scrollHeight = document.documentElement?.scrollHeight || document.body.scrollHeight;
45
45
  return containerScrollTop + window.innerHeight >= scrollHeight;
46
46
  }
47
47
  return containerScrollTop + container.offsetHeight >= container.scrollHeight;
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../../../src/ScrollTo/utils.ts"],"sourcesContent":["import { HvScrollToOption } from \"./types\";\n\ntype ExtendedWindow = Window & typeof globalThis & HTMLElement;\n\nexport const getScrollTop = (\n c: HTMLElement | (Window & typeof globalThis) = window,\n) => {\n if (c === window) {\n return (\n window.scrollY ||\n window.pageYOffset ||\n (document.documentElement && document.documentElement.scrollTop) ||\n document.body.scrollTop\n );\n }\n\n return (c as ExtendedWindow).scrollTop;\n};\n\nexport const verticalScrollOffset = (\n t: HTMLElement | (Window & typeof globalThis),\n c: HTMLElement | (Window & typeof globalThis) = window,\n) => {\n if (c === window) {\n return (\n ((t as ExtendedWindow)?.getBoundingClientRect?.().top || 0) +\n (window.scrollY || window.pageYOffset)\n );\n }\n if (getComputedStyle(c as ExtendedWindow).position !== \"static\") {\n return (t as ExtendedWindow).offsetTop;\n }\n\n return (t as ExtendedWindow).offsetTop - (c as ExtendedWindow).offsetTop;\n};\n\nexport const horizontalScrollOffset = (\n t: HTMLElement,\n c: HTMLElement | (Window & typeof globalThis) = window,\n) => {\n if (c === window) {\n return (\n (t?.getBoundingClientRect?.().left || 0) +\n (window.scrollX || window.pageXOffset)\n );\n }\n if (getComputedStyle(c as ExtendedWindow).position !== \"static\") {\n return t.offsetLeft;\n }\n\n return t.offsetLeft - (c as ExtendedWindow).offsetLeft;\n};\n\nexport const scrollElement = (\n element: HTMLElement,\n container: HTMLElement | (Window & typeof globalThis),\n offset: number = 0,\n direction?: \"row\" | \"column\",\n) => {\n if (direction === \"row\") {\n const elemLeft = horizontalScrollOffset(element, container);\n container?.scrollTo?.({\n left: elemLeft - offset,\n behavior: \"smooth\",\n });\n } else {\n const elemTop = verticalScrollOffset(element, container);\n container?.scrollTo?.({\n top: elemTop - offset,\n behavior: \"smooth\",\n });\n }\n element.focus({ preventScroll: true });\n};\n\nexport const isScrolledToTheBottom = (\n container: HTMLElement | (Window & typeof globalThis),\n) => {\n const containerScrollTop = getScrollTop(container);\n\n if (container === window) {\n // Accounting for cases where html/body are set to height:100%\n const scrollHeight =\n (document.documentElement && document.documentElement.scrollHeight) ||\n document.body.scrollHeight;\n\n return containerScrollTop + window.innerHeight >= scrollHeight;\n }\n\n return (\n containerScrollTop + (container as ExtendedWindow).offsetHeight >=\n (container as ExtendedWindow).scrollHeight\n );\n};\n\nexport const findFirstVisibleElement = (\n container: HTMLElement | (Window & typeof globalThis),\n options: HvScrollToOption[],\n offset: number,\n) => {\n const boundsTop = verticalScrollOffset(container);\n\n let i = 0;\n\n // Find index of first element whose top is still visible inside the container\n for (; i < options.length; i += 1) {\n const ele = document.getElementById(options[i].value);\n\n if (ele) {\n const elemTop = verticalScrollOffset(ele) - (options[i].offset || offset);\n\n if (elemTop > boundsTop) {\n break;\n }\n }\n }\n\n // Return the previous index, the element that last scrolled past the top\n return i - 1;\n};\n"],"names":[],"mappings":"AAIa,MAAA,eAAe,CAC1B,IAAgD,WAC7C;AACH,MAAI,MAAM,QAAQ;AAEd,WAAA,OAAO,WACP,OAAO,eACN,SAAS,mBAAmB,SAAS,gBAAgB,aACtD,SAAS,KAAK;AAAA,EAElB;AAEA,SAAQ,EAAqB;AAC/B;AAEO,MAAM,uBAAuB,CAClC,GACA,IAAgD,WAC7C;AACH,MAAI,MAAM,QAAQ;AAChB,YACI,GAAsB,wBAAwB,EAAE,OAAO,MACxD,OAAO,WAAW,OAAO;AAAA,EAE9B;AACA,MAAI,iBAAiB,CAAmB,EAAE,aAAa,UAAU;AAC/D,WAAQ,EAAqB;AAAA,EAC/B;AAEQ,SAAA,EAAqB,YAAa,EAAqB;AACjE;AAEO,MAAM,yBAAyB,CACpC,GACA,IAAgD,WAC7C;AACH,MAAI,MAAM,QAAQ;AAChB,YACG,GAAG,wBAAwB,EAAE,QAAQ,MACrC,OAAO,WAAW,OAAO;AAAA,EAE9B;AACA,MAAI,iBAAiB,CAAmB,EAAE,aAAa,UAAU;AAC/D,WAAO,EAAE;AAAA,EACX;AAEO,SAAA,EAAE,aAAc,EAAqB;AAC9C;AAEO,MAAM,gBAAgB,CAC3B,SACA,WACA,SAAiB,GACjB,cACG;AACH,MAAI,cAAc,OAAO;AACjB,UAAA,WAAW,uBAAuB,SAAS,SAAS;AAC1D,eAAW,WAAW;AAAA,MACpB,MAAM,WAAW;AAAA,MACjB,UAAU;AAAA,IAAA,CACX;AAAA,EAAA,OACI;AACC,UAAA,UAAU,qBAAqB,SAAS,SAAS;AACvD,eAAW,WAAW;AAAA,MACpB,KAAK,UAAU;AAAA,MACf,UAAU;AAAA,IAAA,CACX;AAAA,EACH;AACA,UAAQ,MAAM,EAAE,eAAe,KAAM,CAAA;AACvC;AAEa,MAAA,wBAAwB,CACnC,cACG;AACG,QAAA,qBAAqB,aAAa,SAAS;AAEjD,MAAI,cAAc,QAAQ;AAExB,UAAM,eACH,SAAS,mBAAmB,SAAS,gBAAgB,gBACtD,SAAS,KAAK;AAET,WAAA,qBAAqB,OAAO,eAAe;AAAA,EACpD;AAGE,SAAA,qBAAsB,UAA6B,gBAClD,UAA6B;AAElC;AAEO,MAAM,0BAA0B,CACrC,WACA,SACA,WACG;AACG,QAAA,YAAY,qBAAqB,SAAS;AAEhD,MAAI,IAAI;AAGR,SAAO,IAAI,QAAQ,QAAQ,KAAK,GAAG;AACjC,UAAM,MAAM,SAAS,eAAe,QAAQ,CAAC,EAAE,KAAK;AAEpD,QAAI,KAAK;AACP,YAAM,UAAU,qBAAqB,GAAG,KAAK,QAAQ,CAAC,EAAE,UAAU;AAElE,UAAI,UAAU,WAAW;AACvB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAGA,SAAO,IAAI;AACb;"}
1
+ {"version":3,"file":"utils.js","sources":["../../../src/ScrollTo/utils.ts"],"sourcesContent":["import { HvScrollToOption } from \"./types\";\n\ntype ExtendedWindow = Window & typeof globalThis & HTMLElement;\n\nexport const getScrollTop = (\n c: HTMLElement | (Window & typeof globalThis) = window,\n) => {\n if (c === window) {\n return (\n window.scrollY ||\n window.pageYOffset ||\n document.documentElement?.scrollTop ||\n document.body.scrollTop\n );\n }\n\n return (c as ExtendedWindow).scrollTop;\n};\n\nexport const verticalScrollOffset = (\n t: HTMLElement | (Window & typeof globalThis),\n c: HTMLElement | (Window & typeof globalThis) = window,\n) => {\n if (c === window) {\n return (\n ((t as ExtendedWindow)?.getBoundingClientRect?.().top || 0) +\n (window.scrollY || window.pageYOffset)\n );\n }\n if (getComputedStyle(c as ExtendedWindow).position !== \"static\") {\n return (t as ExtendedWindow).offsetTop;\n }\n\n return (t as ExtendedWindow).offsetTop - (c as ExtendedWindow).offsetTop;\n};\n\nexport const horizontalScrollOffset = (\n t: HTMLElement,\n c: HTMLElement | (Window & typeof globalThis) = window,\n) => {\n if (c === window) {\n return (\n (t?.getBoundingClientRect?.().left || 0) +\n (window.scrollX || window.pageXOffset)\n );\n }\n if (getComputedStyle(c as ExtendedWindow).position !== \"static\") {\n return t.offsetLeft;\n }\n\n return t.offsetLeft - (c as ExtendedWindow).offsetLeft;\n};\n\nexport const scrollElement = (\n element: HTMLElement,\n container: HTMLElement | (Window & typeof globalThis),\n offset = 0,\n direction?: \"row\" | \"column\",\n) => {\n if (direction === \"row\") {\n const elemLeft = horizontalScrollOffset(element, container);\n container?.scrollTo?.({\n left: elemLeft - offset,\n behavior: \"smooth\",\n });\n } else {\n const elemTop = verticalScrollOffset(element, container);\n container?.scrollTo?.({\n top: elemTop - offset,\n behavior: \"smooth\",\n });\n }\n element.focus({ preventScroll: true });\n};\n\nexport const isScrolledToTheBottom = (\n container: HTMLElement | (Window & typeof globalThis),\n) => {\n const containerScrollTop = getScrollTop(container);\n\n if (container === window) {\n // Accounting for cases where html/body are set to height:100%\n const scrollHeight =\n document.documentElement?.scrollHeight || document.body.scrollHeight;\n\n return containerScrollTop + window.innerHeight >= scrollHeight;\n }\n\n return (\n containerScrollTop + (container as ExtendedWindow).offsetHeight >=\n (container as ExtendedWindow).scrollHeight\n );\n};\n\nexport const findFirstVisibleElement = (\n container: HTMLElement | (Window & typeof globalThis),\n options: HvScrollToOption[],\n offset: number,\n) => {\n const boundsTop = verticalScrollOffset(container);\n\n let i = 0;\n\n // Find index of first element whose top is still visible inside the container\n for (; i < options.length; i += 1) {\n const ele = document.getElementById(options[i].value);\n\n if (ele) {\n const elemTop = verticalScrollOffset(ele) - (options[i].offset || offset);\n\n if (elemTop > boundsTop) {\n break;\n }\n }\n }\n\n // Return the previous index, the element that last scrolled past the top\n return i - 1;\n};\n"],"names":[],"mappings":"AAIa,MAAA,eAAe,CAC1B,IAAgD,WAC7C;AACH,MAAI,MAAM,QAAQ;AAEd,WAAA,OAAO,WACP,OAAO,eACP,SAAS,iBAAiB,aAC1B,SAAS,KAAK;AAAA,EAElB;AAEA,SAAQ,EAAqB;AAC/B;AAEO,MAAM,uBAAuB,CAClC,GACA,IAAgD,WAC7C;AACH,MAAI,MAAM,QAAQ;AAChB,YACI,GAAsB,wBAAwB,EAAE,OAAO,MACxD,OAAO,WAAW,OAAO;AAAA,EAE9B;AACA,MAAI,iBAAiB,CAAmB,EAAE,aAAa,UAAU;AAC/D,WAAQ,EAAqB;AAAA,EAC/B;AAEQ,SAAA,EAAqB,YAAa,EAAqB;AACjE;AAEO,MAAM,yBAAyB,CACpC,GACA,IAAgD,WAC7C;AACH,MAAI,MAAM,QAAQ;AAChB,YACG,GAAG,wBAAwB,EAAE,QAAQ,MACrC,OAAO,WAAW,OAAO;AAAA,EAE9B;AACA,MAAI,iBAAiB,CAAmB,EAAE,aAAa,UAAU;AAC/D,WAAO,EAAE;AAAA,EACX;AAEO,SAAA,EAAE,aAAc,EAAqB;AAC9C;AAEO,MAAM,gBAAgB,CAC3B,SACA,WACA,SAAS,GACT,cACG;AACH,MAAI,cAAc,OAAO;AACjB,UAAA,WAAW,uBAAuB,SAAS,SAAS;AAC1D,eAAW,WAAW;AAAA,MACpB,MAAM,WAAW;AAAA,MACjB,UAAU;AAAA,IAAA,CACX;AAAA,EAAA,OACI;AACC,UAAA,UAAU,qBAAqB,SAAS,SAAS;AACvD,eAAW,WAAW;AAAA,MACpB,KAAK,UAAU;AAAA,MACf,UAAU;AAAA,IAAA,CACX;AAAA,EACH;AACA,UAAQ,MAAM,EAAE,eAAe,KAAM,CAAA;AACvC;AAEa,MAAA,wBAAwB,CACnC,cACG;AACG,QAAA,qBAAqB,aAAa,SAAS;AAEjD,MAAI,cAAc,QAAQ;AAExB,UAAM,eACJ,SAAS,iBAAiB,gBAAgB,SAAS,KAAK;AAEnD,WAAA,qBAAqB,OAAO,eAAe;AAAA,EACpD;AAGE,SAAA,qBAAsB,UAA6B,gBAClD,UAA6B;AAElC;AAEO,MAAM,0BAA0B,CACrC,WACA,SACA,WACG;AACG,QAAA,YAAY,qBAAqB,SAAS;AAEhD,MAAI,IAAI;AAGR,SAAO,IAAI,QAAQ,QAAQ,KAAK,GAAG;AACjC,UAAM,MAAM,SAAS,eAAe,QAAQ,CAAC,EAAE,KAAK;AAEpD,QAAI,KAAK;AACP,YAAM,UAAU,qBAAqB,GAAG,KAAK,QAAQ,CAAC,EAAE,UAAU;AAElE,UAAI,UAAU,WAAW;AACvB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAGA,SAAO,IAAI;AACb;"}
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { forwardRef } from "react";
3
3
  import { Up, Down } from "@hitachivantara/uikit-react-icons";
4
4
  import { useControlled } from "../hooks/useControlled.js";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useRef } from "react";
3
3
  import { useOption } from "@mui/base/useOption";
4
4
  import { useForkRef } from "@mui/material/utils";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { forwardRef } from "react";
3
3
  import { OptionGroup } from "@mui/base/OptionGroup";
4
4
  import { theme } from "@hitachivantara/uikit-styles";
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx, Fragment } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
2
2
  import { useState, useRef } from "react";
3
3
  import { Popper } from "@mui/base/Popper";
4
4
  import { useSelect, SelectProvider } from "@mui/base/useSelect";
@@ -8,6 +8,7 @@ import { useDefaultProps } from "../hooks/useDefaultProps.js";
8
8
  import { useTheme } from "../hooks/useTheme.js";
9
9
  import { useUniqueId } from "../hooks/useUniqueId.js";
10
10
  import { fixedForwardRef } from "../types/generic.js";
11
+ import { getContainerElement } from "../utils/document.js";
11
12
  import { setId } from "../utils/setId.js";
12
13
  import { useClasses } from "./Select.styles.js";
13
14
  import { staticClasses } from "./Select.styles.js";
@@ -175,7 +176,7 @@ const HvSelect = fixedForwardRef(function HvSelect2(props, ref) {
175
176
  open: isOpen,
176
177
  keepMounted: true,
177
178
  disablePortal: !enablePortal,
178
- container: enablePortal ? document.getElementById(rootId || "") || document.body : void 0,
179
+ container: enablePortal ? getContainerElement(rootId) : void 0,
179
180
  anchorEl: buttonRef.current,
180
181
  className: classes.popper,
181
182
  placement,
@@ -1 +1 @@
1
- {"version":3,"file":"Select.js","sources":["../../../src/Select/Select.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define */\nimport { useRef, useState } from \"react\";\nimport { Popper } from \"@mui/base/Popper\";\nimport { SelectOption } from \"@mui/base/useOption\";\nimport {\n SelectProvider,\n useSelect,\n UseSelectParameters,\n} from \"@mui/base/useSelect\";\nimport { useControlled, useForkRef } from \"@mui/material/utils\";\nimport type { Placement } from \"@popperjs/core\";\nimport clsx from \"clsx\";\n\nimport { HvButtonProps } from \"../Button\";\nimport { HvDropdownButton } from \"../DropdownButton\";\nimport {\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvWarningText,\n} from \"../Forms\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvListContainer } from \"../ListContainer\";\nimport { HvPanel } from \"../Panel\";\nimport { fixedForwardRef } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Select.styles\";\n\nfunction defaultRenderValue<Value>(\n options: SelectOption<Value> | SelectOption<Value>[] | null,\n) {\n if (Array.isArray(options)) {\n if (options.length === 0) return null;\n return <>{options.map((o) => o.label).join(\", \")}</>;\n }\n\n return options?.label ?? null;\n}\n\nconst mergeIds = (...ids: clsx.ClassValue[]) => clsx(ids) || undefined;\n\nexport { staticClasses as selectClasses };\n\nexport type HvSelectClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSelectProps<\n OptionValue extends {},\n Multiple extends boolean = false,\n> extends Omit<HvFormElementProps, \"value\" | \"defaultValue\" | \"onChange\">,\n Pick<\n UseSelectParameters<OptionValue, Multiple>,\n | \"name\"\n | \"required\"\n | \"disabled\"\n | \"multiple\"\n | \"open\"\n | \"defaultOpen\"\n | \"value\"\n | \"defaultValue\"\n | \"buttonRef\"\n | \"options\"\n | \"getSerializedValue\"\n | \"onChange\"\n | \"onOpenChange\"\n >,\n Pick<HvButtonProps, \"size\" | \"variant\"> {\n classes?: HvSelectClasses;\n placeholder?: React.ReactNode;\n autoComplete?: string;\n /** Whether the width of the select panel can vary independently. */\n variableWidth?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /** If enabled the panel will be rendered using a portal , if disabled will be under the DOM hierarchy of the parent component. */\n enablePortal?: boolean;\n}\n\n/**\n * The `HvSelect` component is a form control element that allows selection from a list of options.\n *\n * It aims to be aligned with the native HTML `<select>` and `<option>` APIs and be easily integrated with forms.\n *\n * @example\n * <HvSelect name=\"pets\">\n * <HvOption value=\"dog\">Dog</HvOption>\n * <HvOption value=\"cat\">Cat</HvOption>\n * </HvSelect>\n * */\nexport const HvSelect = fixedForwardRef(function HvSelect<\n OptionValue extends {},\n Multiple extends boolean = false,\n>(\n props: HvSelectProps<OptionValue, Multiple>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n classes: classesProp,\n className,\n id: idProp,\n size,\n variant = \"secondarySubtle\",\n name,\n required,\n disabled: disabledProp,\n readOnly,\n label,\n open: openProp,\n defaultOpen,\n multiple,\n autoComplete,\n options: optionsProp,\n variableWidth,\n value: valueProp,\n defaultValue,\n placeholder,\n inputProps,\n enablePortal,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n getSerializedValue,\n onClick,\n onChange,\n onOpenChange,\n ...others\n } = useDefaultProps(\"HvSelect\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [placement, setPlacement] = useState<Placement>(\"bottom-start\");\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleButtonRef = useForkRef(ref, buttonRef);\n\n const {\n contextValue,\n disabled,\n getButtonProps,\n getListboxProps,\n getHiddenInputProps,\n getOptionMetadata,\n value,\n open,\n } = useSelect<OptionValue, Multiple>({\n componentName: \"HvSelect\",\n name,\n required,\n disabled: disabledProp,\n multiple,\n open: openProp,\n defaultOpen,\n value: valueProp,\n defaultValue,\n options: optionsProp,\n buttonRef: handleButtonRef,\n getSerializedValue,\n onChange,\n onOpenChange: handleOpenChange,\n });\n\n const id = useUniqueId(idProp);\n const labelId = useUniqueId(setId(idProp, \"label\"));\n const descriptionId = useUniqueId(setId(idProp, \"description\"));\n const errorMessageId = useUniqueId(setId(idProp, \"error\"));\n\n const [validationMessage] = useControlled({\n name: \"HvSelect.statusMessage\",\n controlled: statusMessage,\n default: \"Required\",\n });\n const [validationState, setValidationState] = useControlled<HvFormStatus>({\n name: \"HvSelect.status\",\n controlled: status,\n default: \"standBy\",\n });\n\n function handleOpenChange(newOpen: boolean) {\n if (!newOpen) {\n const hasValue = multiple ? (value as OptionValue[]).length > 0 : !!value;\n setValidationState(required && !hasValue ? \"invalid\" : \"valid\");\n }\n onOpenChange?.(newOpen);\n }\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isInvalid = validationState === \"invalid\";\n\n const actualValue = multiple\n ? (value as OptionValue[])\n .map((v) => getOptionMetadata(v))\n .filter((v): v is SelectOption<OptionValue> => v !== undefined)\n : getOptionMetadata(value as OptionValue) ?? null;\n\n const isOpen = open && !!children;\n\n return (\n <HvFormElement\n name={name}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n className={cx(classes.root, className, {\n [classes.disabled]: disabled,\n [classes.readOnly]: readOnly,\n })}\n {...others}\n >\n {(label || description) && (\n <div className={classes.labelContainer}>\n {label && (\n <HvLabel\n id={labelId}\n htmlFor={id}\n label={label}\n className={classes.label}\n />\n )}\n {description && (\n <HvInfoMessage id={descriptionId} className={classes.description}>\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvDropdownButton\n id={id}\n open={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n className={cx(classes.select, {\n [classes.invalid]: validationState === \"invalid\",\n })}\n placement={placement}\n size={size}\n variant={variant}\n aria-label={ariaLabel}\n aria-labelledby={mergeIds(ariaLabelledBy, { [labelId]: label })}\n aria-invalid={isInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={mergeIds(ariaDescribedBy, {\n [descriptionId]: description,\n })}\n {...getButtonProps()}\n >\n {defaultRenderValue(actualValue) ?? placeholder}\n </HvDropdownButton>\n <Popper\n open={isOpen}\n keepMounted\n disablePortal={!enablePortal}\n container={\n enablePortal\n ? document.getElementById(rootId || \"\") || document.body\n : undefined\n }\n anchorEl={buttonRef.current}\n className={classes.popper}\n placement={placement}\n modifiers={[\n {\n enabled: true,\n phase: \"main\",\n fn: ({ state }) => setPlacement(state.placement),\n },\n ]}\n >\n <HvPanel\n style={{\n width: variableWidth\n ? \"auto\"\n : (buttonRef.current?.clientWidth || 0) + 2,\n }}\n className={cx(classes.panel, className, {\n [classes.panelOpenedUp]: placement.includes(\"top\"),\n [classes.panelOpenedDown]: placement.includes(\"bottom\"),\n })}\n >\n <SelectProvider value={contextValue}>\n <HvListContainer condensed selectable {...getListboxProps()}>\n {children}\n </HvListContainer>\n </SelectProvider>\n </HvPanel>\n </Popper>\n <input\n {...getHiddenInputProps()}\n autoComplete={autoComplete}\n {...inputProps}\n />\n {canShowError && (\n <HvWarningText\n id={errorMessageId}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["HvSelect"],"mappings":"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"}
1
+ {"version":3,"file":"Select.js","sources":["../../../src/Select/Select.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define */\nimport { useRef, useState } from \"react\";\nimport { Popper } from \"@mui/base/Popper\";\nimport { SelectOption } from \"@mui/base/useOption\";\nimport {\n SelectProvider,\n useSelect,\n UseSelectParameters,\n} from \"@mui/base/useSelect\";\nimport { useControlled, useForkRef } from \"@mui/material/utils\";\nimport type { Placement } from \"@popperjs/core\";\nimport clsx from \"clsx\";\n\nimport { HvButtonProps } from \"../Button\";\nimport { HvDropdownButton } from \"../DropdownButton\";\nimport {\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvWarningText,\n} from \"../Forms\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvListContainer } from \"../ListContainer\";\nimport { HvPanel } from \"../Panel\";\nimport { fixedForwardRef } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { getContainerElement } from \"../utils/document\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Select.styles\";\n\nfunction defaultRenderValue<Value>(\n options: SelectOption<Value> | SelectOption<Value>[] | null,\n) {\n if (Array.isArray(options)) {\n if (options.length === 0) return null;\n return <>{options.map((o) => o.label).join(\", \")}</>;\n }\n\n return options?.label ?? null;\n}\n\nconst mergeIds = (...ids: clsx.ClassValue[]) => clsx(ids) || undefined;\n\nexport { staticClasses as selectClasses };\n\nexport type HvSelectClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSelectProps<\n OptionValue extends {},\n Multiple extends boolean = false,\n> extends Omit<HvFormElementProps, \"value\" | \"defaultValue\" | \"onChange\">,\n Pick<\n UseSelectParameters<OptionValue, Multiple>,\n | \"name\"\n | \"required\"\n | \"disabled\"\n | \"multiple\"\n | \"open\"\n | \"defaultOpen\"\n | \"value\"\n | \"defaultValue\"\n | \"buttonRef\"\n | \"options\"\n | \"getSerializedValue\"\n | \"onChange\"\n | \"onOpenChange\"\n >,\n Pick<HvButtonProps, \"size\" | \"variant\"> {\n classes?: HvSelectClasses;\n placeholder?: React.ReactNode;\n autoComplete?: string;\n /** Whether the width of the select panel can vary independently. */\n variableWidth?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /** If enabled the panel will be rendered using a portal , if disabled will be under the DOM hierarchy of the parent component. */\n enablePortal?: boolean;\n}\n\n/**\n * The `HvSelect` component is a form control element that allows selection from a list of options.\n *\n * It aims to be aligned with the native HTML `<select>` and `<option>` APIs and be easily integrated with forms.\n *\n * @example\n * <HvSelect name=\"pets\">\n * <HvOption value=\"dog\">Dog</HvOption>\n * <HvOption value=\"cat\">Cat</HvOption>\n * </HvSelect>\n * */\nexport const HvSelect = fixedForwardRef(function HvSelect<\n OptionValue extends {},\n Multiple extends boolean = false,\n>(\n props: HvSelectProps<OptionValue, Multiple>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n classes: classesProp,\n className,\n id: idProp,\n size,\n variant = \"secondarySubtle\",\n name,\n required,\n disabled: disabledProp,\n readOnly,\n label,\n open: openProp,\n defaultOpen,\n multiple,\n autoComplete,\n options: optionsProp,\n variableWidth,\n value: valueProp,\n defaultValue,\n placeholder,\n inputProps,\n enablePortal,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n getSerializedValue,\n onClick,\n onChange,\n onOpenChange,\n ...others\n } = useDefaultProps(\"HvSelect\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [placement, setPlacement] = useState<Placement>(\"bottom-start\");\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleButtonRef = useForkRef(ref, buttonRef);\n\n const {\n contextValue,\n disabled,\n getButtonProps,\n getListboxProps,\n getHiddenInputProps,\n getOptionMetadata,\n value,\n open,\n } = useSelect<OptionValue, Multiple>({\n componentName: \"HvSelect\",\n name,\n required,\n disabled: disabledProp,\n multiple,\n open: openProp,\n defaultOpen,\n value: valueProp,\n defaultValue,\n options: optionsProp,\n buttonRef: handleButtonRef,\n getSerializedValue,\n onChange,\n onOpenChange: handleOpenChange,\n });\n\n const id = useUniqueId(idProp);\n const labelId = useUniqueId(setId(idProp, \"label\"));\n const descriptionId = useUniqueId(setId(idProp, \"description\"));\n const errorMessageId = useUniqueId(setId(idProp, \"error\"));\n\n const [validationMessage] = useControlled({\n name: \"HvSelect.statusMessage\",\n controlled: statusMessage,\n default: \"Required\",\n });\n const [validationState, setValidationState] = useControlled<HvFormStatus>({\n name: \"HvSelect.status\",\n controlled: status,\n default: \"standBy\",\n });\n\n function handleOpenChange(newOpen: boolean) {\n if (!newOpen) {\n const hasValue = multiple ? (value as OptionValue[]).length > 0 : !!value;\n setValidationState(required && !hasValue ? \"invalid\" : \"valid\");\n }\n onOpenChange?.(newOpen);\n }\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isInvalid = validationState === \"invalid\";\n\n const actualValue = multiple\n ? (value as OptionValue[])\n .map((v) => getOptionMetadata(v))\n .filter((v): v is SelectOption<OptionValue> => v !== undefined)\n : getOptionMetadata(value as OptionValue) ?? null;\n\n const isOpen = open && !!children;\n\n return (\n <HvFormElement\n name={name}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n className={cx(classes.root, className, {\n [classes.disabled]: disabled,\n [classes.readOnly]: readOnly,\n })}\n {...others}\n >\n {(label || description) && (\n <div className={classes.labelContainer}>\n {label && (\n <HvLabel\n id={labelId}\n htmlFor={id}\n label={label}\n className={classes.label}\n />\n )}\n {description && (\n <HvInfoMessage id={descriptionId} className={classes.description}>\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvDropdownButton\n id={id}\n open={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n className={cx(classes.select, {\n [classes.invalid]: validationState === \"invalid\",\n })}\n placement={placement}\n size={size}\n variant={variant}\n aria-label={ariaLabel}\n aria-labelledby={mergeIds(ariaLabelledBy, { [labelId]: label })}\n aria-invalid={isInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={mergeIds(ariaDescribedBy, {\n [descriptionId]: description,\n })}\n {...getButtonProps()}\n >\n {defaultRenderValue(actualValue) ?? placeholder}\n </HvDropdownButton>\n <Popper\n open={isOpen}\n keepMounted\n disablePortal={!enablePortal}\n container={enablePortal ? getContainerElement(rootId) : undefined}\n anchorEl={buttonRef.current}\n className={classes.popper}\n placement={placement}\n modifiers={[\n {\n enabled: true,\n phase: \"main\",\n fn: ({ state }) => setPlacement(state.placement),\n },\n ]}\n >\n <HvPanel\n style={{\n width: variableWidth\n ? \"auto\"\n : (buttonRef.current?.clientWidth || 0) + 2,\n }}\n className={cx(classes.panel, className, {\n [classes.panelOpenedUp]: placement.includes(\"top\"),\n [classes.panelOpenedDown]: placement.includes(\"bottom\"),\n })}\n >\n <SelectProvider value={contextValue}>\n <HvListContainer condensed selectable {...getListboxProps()}>\n {children}\n </HvListContainer>\n </SelectProvider>\n </HvPanel>\n </Popper>\n <input\n {...getHiddenInputProps()}\n autoComplete={autoComplete}\n {...inputProps}\n />\n {canShowError && (\n <HvWarningText\n id={errorMessageId}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["HvSelect"],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { forwardRef, useMemo, Children, useRef, useEffect, useCallback, cloneElement } from "react";
3
3
  import { useForkRef } from "@mui/material/utils";
4
4
  import { useControlled } from "../hooks/useControlled.js";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useDefaultProps } from "../hooks/useDefaultProps.js";
3
3
  import { useClasses, getContainerStyle } from "./SimpleGrid.styles.js";
4
4
  import { staticClasses } from "./SimpleGrid.styles.js";
@@ -1,4 +1,4 @@
1
- import { jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsx } from "react/jsx-runtime";
2
2
  import { useDefaultProps } from "../hooks/useDefaultProps.js";
3
3
  import { useClasses } from "./Skeleton.styles.js";
4
4
  import { staticClasses } from "./Skeleton.styles.js";
@@ -1,4 +1,4 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { forwardRef, useRef, useMemo, useState, useCallback, useEffect } from "react";
3
3
  import Slider from "rc-slider";
4
4
  import Tooltip from "rc-tooltip";
@@ -6,6 +6,7 @@ import validationState from "../Forms/FormElement/validationStates.js";
6
6
  import { useControlled } from "../hooks/useControlled.js";
7
7
  import { useDefaultProps } from "../hooks/useDefaultProps.js";
8
8
  import { useUniqueId } from "../hooks/useUniqueId.js";
9
+ import { getElementById } from "../utils/document.js";
9
10
  import { setId } from "../utils/setId.js";
10
11
  import { useClasses, sliderStyles } from "./Slider.styles.js";
11
12
  import { staticClasses } from "./Slider.styles.js";
@@ -308,7 +309,7 @@ const HvSlider = forwardRef((props, ref) => {
308
309
  visible: dragging,
309
310
  placement: "top",
310
311
  overlayClassName: classes.sliderTooltip,
311
- getTooltipContainer: () => document.getElementById(indexedHandleId || ""),
312
+ getTooltipContainer: () => getElementById(indexedHandleId),
312
313
  children: /* @__PURE__ */ jsx(
313
314
  "div",
314
315
  {