@vibe/core 4.5.9 → 4.5.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 (491) hide show
  1. package/dist/components/AvatarGroup/AvatarGroup.d.ts +1 -2
  2. package/dist/components/AvatarGroup/AvatarGroupCounter.d.ts +1 -2
  3. package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContainer.d.ts +1 -2
  4. package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContent.d.ts +1 -2
  5. package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.d.ts +1 -2
  6. package/dist/components/AvatarGroup/AvatarGroupCounterTooltipHelper.d.ts +1 -2
  7. package/dist/components/AvatarGroup/AvatarGroupHelper.d.ts +1 -1
  8. package/dist/components/Chips/Chips.d.ts +1 -1
  9. package/dist/components/Menu/MenuItem/AvatarMenuItem.d.ts +1 -1
  10. package/dist/components/Modal/footers/utils/getPropsForButton.d.ts +1 -0
  11. package/dist/components/avatar/dist/Avatar/Avatar.js +2 -0
  12. package/dist/components/avatar/dist/Avatar/Avatar.js.map +1 -0
  13. package/dist/components/avatar/dist/Avatar/Avatar.module.scss.js +2 -0
  14. package/dist/components/avatar/dist/Avatar/AvatarBadge.js +2 -0
  15. package/dist/components/avatar/dist/Avatar/AvatarBadge.js.map +1 -0
  16. package/dist/components/avatar/dist/Avatar/AvatarBadge.module.scss.js +2 -0
  17. package/dist/components/avatar/dist/Avatar/AvatarContent.js +2 -0
  18. package/dist/components/avatar/dist/Avatar/AvatarContent.js.map +1 -0
  19. package/dist/components/avatar/dist/Avatar/AvatarContent.module.scss.js +2 -0
  20. package/dist/components/avatar/dist/_virtual/_tslib.js +2 -0
  21. package/dist/components/avatar/dist/_virtual/_tslib.js.map +1 -0
  22. package/dist/components/button-group/dist/ButtonGroup/ButtonGroup.js +1 -1
  23. package/dist/components/button-group/dist/ButtonGroup/ButtonGroup.js.map +1 -1
  24. package/dist/components/button-group/dist/ButtonGroup/ButtonGroup.module.scss.js +1 -1
  25. package/dist/components/checkbox/dist/Checkbox/Checkbox.module.scss.js +1 -1
  26. package/dist/components/counter/dist/Counter/Counter.module.scss.js +1 -1
  27. package/dist/components/dialog/dist/Dialog/Dialog.js +1 -1
  28. package/dist/components/dialog/dist/Dialog/Dialog.js.map +1 -1
  29. package/dist/components/dialog/dist/Dialog/Dialog.module.scss.js +1 -1
  30. package/dist/components/dialog/dist/Dialog/components/DialogContent/DialogContent.module.scss.js +1 -1
  31. package/dist/components/dialog/dist/DialogContentContainer/DialogContentContainer.module.scss.js +1 -1
  32. package/dist/components/editable/dist/EditableHeading/EditableHeading.js +2 -0
  33. package/dist/components/editable/dist/EditableHeading/EditableHeading.js.map +1 -0
  34. package/dist/components/editable/dist/EditableHeading/EditableHeading.module.scss.js +2 -0
  35. package/dist/components/editable/dist/EditableText/EditableText.js +2 -0
  36. package/dist/components/editable/dist/EditableText/EditableText.js.map +1 -0
  37. package/dist/components/editable/dist/EditableText/EditableText.module.scss.js +2 -0
  38. package/dist/components/editable/dist/EditableTypography/EditableTypography.js +2 -0
  39. package/dist/components/editable/dist/EditableTypography/EditableTypography.js.map +1 -0
  40. package/dist/components/editable/dist/EditableTypography/EditableTypography.module.scss.js +2 -0
  41. package/dist/components/editable/dist/_virtual/_tslib.js +2 -0
  42. package/dist/components/editable/dist/_virtual/_tslib.js.map +1 -0
  43. package/dist/components/expand-collapse/dist/ExpandCollapse/ExpandCollapse.module.scss.js +1 -1
  44. package/dist/components/icon-button/dist/IconButton/IconButton.module.scss.js +1 -1
  45. package/dist/components/index.d.ts +2 -3
  46. package/dist/components/label/dist/Label/Label.module.scss.js +1 -1
  47. package/dist/components/label/dist/Label/LabelCelebrationAnimation.module.scss.js +1 -1
  48. package/dist/components/radio-button/dist/RadioButton/RadioButton.module.scss.js +1 -1
  49. package/dist/components/tooltip/dist/Tooltip/Tooltip.module.scss.js +1 -1
  50. package/dist/components/typography/dist/Heading/Heading.module.scss.js +1 -1
  51. package/dist/components/typography/dist/Text/Text.module.scss.js +1 -1
  52. package/dist/components/typography/dist/Typography/Typography.module.scss.js +1 -1
  53. package/dist/hooks/dist/usePrevious/index.js.map +1 -0
  54. package/dist/hooks/index.d.ts +1 -2
  55. package/dist/metadata/components.json +23 -6
  56. package/dist/metadata.json +23 -6
  57. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroup.d.ts +1 -2
  58. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounter.d.ts +1 -2
  59. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContainer.d.ts +1 -2
  60. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContent.d.ts +1 -2
  61. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.d.ts +1 -2
  62. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipHelper.d.ts +1 -2
  63. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupHelper.d.ts +1 -1
  64. package/dist/mocked_classnames/components/Chips/Chips.d.ts +1 -1
  65. package/dist/mocked_classnames/components/Menu/MenuItem/AvatarMenuItem.d.ts +1 -1
  66. package/dist/mocked_classnames/components/Modal/footers/utils/getPropsForButton.d.ts +1 -0
  67. package/dist/mocked_classnames/components/index.d.ts +2 -3
  68. package/dist/mocked_classnames/hooks/index.d.ts +1 -2
  69. package/dist/mocked_classnames/src/components/Accordion/Accordion/Accordion.module.scss.js +1 -1
  70. package/dist/mocked_classnames/src/components/AlertBanner/AlertBanner.module.scss.js +1 -1
  71. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.module.scss.js +1 -1
  72. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerLink/AlertBannerLink.module.scss.js +1 -1
  73. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerText/AlertBannerText.module.scss.js +1 -1
  74. package/dist/mocked_classnames/src/components/AttentionBox/AttentionBox.module.scss.js +1 -1
  75. package/dist/mocked_classnames/src/components/AttentionBox/components/AttentionBoxCloseButton/AttentionBoxCloseButton.module.scss.js +1 -1
  76. package/dist/mocked_classnames/src/components/AttentionBox/components/AttentionBoxLeadingIcon/AttentionBoxLeadingIcon.module.scss.js +1 -1
  77. package/dist/mocked_classnames/src/components/AttentionBox/components/AttentionBoxLink/AttentionBoxLink.module.scss.js +1 -1
  78. package/dist/mocked_classnames/src/components/AttentionBox/layouts/AttentionBoxCompact/AttentionBoxCompact.module.scss.js +1 -1
  79. package/dist/mocked_classnames/src/components/AttentionBox/layouts/AttentionBoxDefault/AttentionBoxDefault.module.scss.js +1 -1
  80. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroup.js.map +1 -1
  81. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroup.module.scss.js +1 -1
  82. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounter.js.map +1 -1
  83. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounter.module.scss.js +1 -1
  84. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js.map +1 -1
  85. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.js.map +1 -1
  86. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.module.scss.js +1 -1
  87. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.js.map +1 -1
  88. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.module.scss.js +1 -1
  89. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipHelper.js +1 -1
  90. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipHelper.js.map +1 -1
  91. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupHelper.js.map +1 -1
  92. package/dist/mocked_classnames/src/components/Badge/Badge.module.scss.js +1 -1
  93. package/dist/mocked_classnames/src/components/Badge/Indicator/Indicator.module.scss.js +1 -1
  94. package/dist/mocked_classnames/src/components/BaseItem/BaseItem.module.scss.js +1 -1
  95. package/dist/mocked_classnames/src/components/BaseItem/utils.js +1 -1
  96. package/dist/mocked_classnames/src/components/BaseItem/utils.js.map +1 -1
  97. package/dist/mocked_classnames/src/components/BaseList/BaseList.module.scss.js +1 -1
  98. package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.module.scss.js +1 -1
  99. package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.module.scss.js +1 -1
  100. package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbMenu/BreadcrumbsMenu.module.scss.js +1 -1
  101. package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbsBar.module.scss.js +1 -1
  102. package/dist/mocked_classnames/src/components/Chips/Chips.js +1 -1
  103. package/dist/mocked_classnames/src/components/Chips/Chips.js.map +1 -1
  104. package/dist/mocked_classnames/src/components/Chips/Chips.module.scss.js +1 -1
  105. package/dist/mocked_classnames/src/components/ColorPicker/ColorPicker.module.scss.js +1 -1
  106. package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.module.scss.js +1 -1
  107. package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.module.scss.js +1 -1
  108. package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.module.scss.js +1 -1
  109. package/dist/mocked_classnames/src/components/Combobox/Combobox.module.scss.js +1 -1
  110. package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js +1 -1
  111. package/dist/mocked_classnames/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js +1 -1
  112. package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js +1 -1
  113. package/dist/mocked_classnames/src/components/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js +1 -1
  114. package/dist/mocked_classnames/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js +1 -1
  115. package/dist/mocked_classnames/src/components/DatePicker/DatePicker.module.scss.js +1 -1
  116. package/dist/mocked_classnames/src/components/DatePicker/DatePickerHeader.module.scss.js +1 -1
  117. package/dist/mocked_classnames/src/components/Dropdown/components/DropdownBase/DropdownBase.module.scss.js +1 -1
  118. package/dist/mocked_classnames/src/components/Dropdown/components/DropdownBaseList/DropdownBaseList.module.scss.js +1 -1
  119. package/dist/mocked_classnames/src/components/Dropdown/components/DropdownBoxMode/DropdownBoxMode.module.scss.js +1 -1
  120. package/dist/mocked_classnames/src/components/Dropdown/components/DropdownPopup/DropdownPopup.js +1 -1
  121. package/dist/mocked_classnames/src/components/Dropdown/components/DropdownPopup/DropdownPopup.js.map +1 -1
  122. package/dist/mocked_classnames/src/components/Dropdown/components/Menu/Menu.module.scss.js +1 -1
  123. package/dist/mocked_classnames/src/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.module.scss.js +1 -1
  124. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/Trigger.module.scss.js +1 -1
  125. package/dist/mocked_classnames/src/components/EmptyState/EmptyState.module.scss.js +1 -1
  126. package/dist/mocked_classnames/src/components/FieldLabel/FieldLabel.module.scss.js +1 -1
  127. package/dist/mocked_classnames/src/components/HiddenText/HiddenText.module.scss.js +1 -1
  128. package/dist/mocked_classnames/src/components/Info/components/InfoDialogContent/InfoDialogContent.module.scss.js +1 -1
  129. package/dist/mocked_classnames/src/components/Info/components/InfoLink/InfoLink.module.scss.js +1 -1
  130. package/dist/mocked_classnames/src/components/InfoText/InfoText.module.scss.js +1 -1
  131. package/dist/mocked_classnames/src/components/List/List.module.scss.js +1 -1
  132. package/dist/mocked_classnames/src/components/List/VirtualizedListItems/VirtualizedListItems.module.scss.js +1 -1
  133. package/dist/mocked_classnames/src/components/ListItem/ListItem.module.scss.js +1 -1
  134. package/dist/mocked_classnames/src/components/ListItemAvatar/ListItemAvatar.js +1 -1
  135. package/dist/mocked_classnames/src/components/ListItemAvatar/ListItemAvatar.js.map +1 -1
  136. package/dist/mocked_classnames/src/components/ListItemAvatar/ListItemAvatar.module.scss.js +1 -1
  137. package/dist/mocked_classnames/src/components/ListItemIcon/ListItemIcon.module.scss.js +1 -1
  138. package/dist/mocked_classnames/src/components/ListTitle/ListTitle.module.scss.js +1 -1
  139. package/dist/mocked_classnames/src/components/Menu/Menu/Menu.js +1 -1
  140. package/dist/mocked_classnames/src/components/Menu/Menu/Menu.js.map +1 -1
  141. package/dist/mocked_classnames/src/components/Menu/Menu/Menu.module.scss.js +1 -1
  142. package/dist/mocked_classnames/src/components/Menu/Menu/hooks/useMouseLeave.js +1 -1
  143. package/dist/mocked_classnames/src/components/Menu/Menu/hooks/useMouseLeave.js.map +1 -1
  144. package/dist/mocked_classnames/src/components/Menu/MenuDivider/MenuDivider.module.scss.js +1 -1
  145. package/dist/mocked_classnames/src/components/Menu/MenuItem/AvatarMenuItem.js +1 -1
  146. package/dist/mocked_classnames/src/components/Menu/MenuItem/AvatarMenuItem.js.map +1 -1
  147. package/dist/mocked_classnames/src/components/Menu/MenuItem/MenuItem.module.scss.js +1 -1
  148. package/dist/mocked_classnames/src/components/Menu/MenuItem/components/BaseMenuItem/BaseMenuItem.module.scss.js +1 -1
  149. package/dist/mocked_classnames/src/components/Menu/MenuItem/components/MenuItemIcon/MenuItemIcon.module.scss.js +1 -1
  150. package/dist/mocked_classnames/src/components/Menu/MenuItem/components/MenuItemSubMenuIcon/MenuItemSubMenuIcon.module.scss.js +1 -1
  151. package/dist/mocked_classnames/src/components/Menu/MenuItem/hooks/useMenuItemMouseEvents.js +1 -1
  152. package/dist/mocked_classnames/src/components/Menu/MenuItem/hooks/useMenuItemMouseEvents.js.map +1 -1
  153. package/dist/mocked_classnames/src/components/Menu/MenuItemButton/MenuItemButton.module.scss.js +1 -1
  154. package/dist/mocked_classnames/src/components/Menu/MenuTitle/MenuTitle.module.scss.js +1 -1
  155. package/dist/mocked_classnames/src/components/MenuButton/MenuButton.module.scss.js +1 -1
  156. package/dist/mocked_classnames/src/components/Modal/Modal/Modal.module.scss.js +1 -1
  157. package/dist/mocked_classnames/src/components/Modal/ModalHeader/ModalHeader.module.scss.js +1 -1
  158. package/dist/mocked_classnames/src/components/Modal/ModalMedia/ModalMedia.module.scss.js +1 -1
  159. package/dist/mocked_classnames/src/components/Modal/ModalTopActions/ModalTopActions.module.scss.js +1 -1
  160. package/dist/mocked_classnames/src/components/Modal/footers/ModalFooter/ModalFooter.module.scss.js +1 -1
  161. package/dist/mocked_classnames/src/components/Modal/footers/ModalFooterBase/ModalFooterBase.module.scss.js +1 -1
  162. package/dist/mocked_classnames/src/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.module.scss.js +1 -1
  163. package/dist/mocked_classnames/src/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.module.scss.js +1 -1
  164. package/dist/mocked_classnames/src/components/Modal/layouts/ModalFooterShadow.module.scss.js +1 -1
  165. package/dist/mocked_classnames/src/components/Modal/layouts/ModalLayoutScrollableContent.module.scss.js +1 -1
  166. package/dist/mocked_classnames/src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.module.scss.js +1 -1
  167. package/dist/mocked_classnames/src/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.module.scss.js +1 -1
  168. package/dist/mocked_classnames/src/components/MultiStepIndicator/MultiStepIndicator.module.scss.js +1 -1
  169. package/dist/mocked_classnames/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.module.scss.js +1 -1
  170. package/dist/mocked_classnames/src/components/NumberField/NumberField.module.scss.js +1 -1
  171. package/dist/mocked_classnames/src/components/NumberField/components/NumberFieldSpinButton/NumberFieldSpinButton.module.scss.js +1 -1
  172. package/dist/mocked_classnames/src/components/Search/Search.module.scss.js +1 -1
  173. package/dist/mocked_classnames/src/components/Skeleton/Skeleton.module.scss.js +1 -1
  174. package/dist/mocked_classnames/src/components/SlideTransition/SlideTransition.module.scss.js +1 -1
  175. package/dist/mocked_classnames/src/components/Slider/SelectionIndicator.module.scss.js +1 -1
  176. package/dist/mocked_classnames/src/components/Slider/Slider.module.scss.js +1 -1
  177. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderBase.module.scss.js +1 -1
  178. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderFilledTrack.module.scss.js +1 -1
  179. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderRail.module.scss.js +1 -1
  180. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderThumb.module.scss.js +1 -1
  181. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderTrack.module.scss.js +1 -1
  182. package/dist/mocked_classnames/src/components/Slider/SliderInfix.module.scss.js +1 -1
  183. package/dist/mocked_classnames/src/components/SplitButton/SplitButton.module.scss.js +1 -1
  184. package/dist/mocked_classnames/src/components/Steps/Steps.module.scss.js +1 -1
  185. package/dist/mocked_classnames/src/components/Steps/StepsCommand.module.scss.js +1 -1
  186. package/dist/mocked_classnames/src/components/Steps/StepsDot.module.scss.js +1 -1
  187. package/dist/mocked_classnames/src/components/Steps/StepsGalleryHeader.module.scss.js +1 -1
  188. package/dist/mocked_classnames/src/components/Steps/StepsHeader.module.scss.js +1 -1
  189. package/dist/mocked_classnames/src/components/Steps/StepsNumbersHeader.module.scss.js +1 -1
  190. package/dist/mocked_classnames/src/components/Switch/Switch.module.scss.js +1 -1
  191. package/dist/mocked_classnames/src/components/Table/Table/Table.module.scss.js +1 -1
  192. package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.module.scss.js +1 -1
  193. package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.module.scss.js +1 -1
  194. package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js +1 -1
  195. package/dist/mocked_classnames/src/components/Table/TableContainer/TableContainer.module.scss.js +1 -1
  196. package/dist/mocked_classnames/src/components/Table/TableHeader/TableHeader.module.scss.js +1 -1
  197. package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.module.scss.js +1 -1
  198. package/dist/mocked_classnames/src/components/Table/TableRow/TableRow.module.scss.js +1 -1
  199. package/dist/mocked_classnames/src/components/Table/TableRowMenu/TableRowMenu.module.scss.js +1 -1
  200. package/dist/mocked_classnames/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss.js +1 -1
  201. package/dist/mocked_classnames/src/components/Tabs/Tab/Tab.module.scss.js +1 -1
  202. package/dist/mocked_classnames/src/components/Tabs/TabList/TabList.js +1 -1
  203. package/dist/mocked_classnames/src/components/Tabs/TabList/TabList.js.map +1 -1
  204. package/dist/mocked_classnames/src/components/Tabs/TabList/TabList.module.scss.js +1 -1
  205. package/dist/mocked_classnames/src/components/Tabs/TabPanel/TabPanel.module.scss.js +1 -1
  206. package/dist/mocked_classnames/src/components/Tabs/TabPanels/TabPanels.module.scss.js +1 -1
  207. package/dist/mocked_classnames/src/components/Tabs/TabsContext/TabsContext.js +1 -1
  208. package/dist/mocked_classnames/src/components/Tabs/TabsContext/TabsContext.js.map +1 -1
  209. package/dist/mocked_classnames/src/components/TextArea/TextArea.module.scss.js +1 -1
  210. package/dist/mocked_classnames/src/components/TextField/TextField.module.scss.js +1 -1
  211. package/dist/mocked_classnames/src/components/TextWithHighlight/TextWithHighlight.module.scss.js +1 -1
  212. package/dist/mocked_classnames/src/components/Tipseen/Tipseen.module.scss.js +1 -1
  213. package/dist/mocked_classnames/src/components/Tipseen/TipseenBasicContent.module.scss.js +1 -1
  214. package/dist/mocked_classnames/src/components/Tipseen/TipseenContent.module.scss.js +1 -1
  215. package/dist/mocked_classnames/src/components/Tipseen/TipseenMedia/TipseenMedia.module.scss.js +1 -1
  216. package/dist/mocked_classnames/src/components/Tipseen/TipseenTitle.module.scss.js +1 -1
  217. package/dist/mocked_classnames/src/components/Tipseen/TipseenWizard.module.scss.js +1 -1
  218. package/dist/mocked_classnames/src/components/Toast/Toast.js +1 -1
  219. package/dist/mocked_classnames/src/components/Toast/Toast.js.map +1 -1
  220. package/dist/mocked_classnames/src/components/Toast/Toast.module.scss.js +1 -1
  221. package/dist/mocked_classnames/src/components/Toast/ToastLink/ToastLink.module.scss.js +1 -1
  222. package/dist/mocked_classnames/src/components/Toggle/MockToggle.module.scss.js +1 -1
  223. package/dist/mocked_classnames/src/components/Toggle/Toggle.module.scss.js +1 -1
  224. package/dist/mocked_classnames/src/components/Toggle/ToggleText.module.scss.js +1 -1
  225. package/dist/mocked_classnames/src/components/TransitionView/TransitionView.module.scss.js +1 -1
  226. package/dist/mocked_classnames/src/components/VirtualizedGrid/VirtualizedGrid.js +1 -1
  227. package/dist/mocked_classnames/src/components/VirtualizedGrid/VirtualizedGrid.js.map +1 -1
  228. package/dist/mocked_classnames/src/components/VirtualizedGrid/VirtualizedGrid.module.scss.js +1 -1
  229. package/dist/mocked_classnames/src/components/VirtualizedList/VirtualizedList.js +1 -1
  230. package/dist/mocked_classnames/src/components/VirtualizedList/VirtualizedList.js.map +1 -1
  231. package/dist/mocked_classnames/src/components/VirtualizedList/VirtualizedList.module.scss.js +1 -1
  232. package/dist/mocked_classnames/src/components/next/List/List.module.scss.js +1 -1
  233. package/dist/mocked_classnames/src/components/next/List/ListTitle/ListTitle.module.scss.js +1 -1
  234. package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js +1 -1
  235. package/dist/mocked_classnames/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js.map +1 -1
  236. package/dist/mocked_classnames/src/hooks/useSetFocus/index.js +1 -1
  237. package/dist/mocked_classnames/src/hooks/useSetFocus/index.js.map +1 -1
  238. package/dist/mocked_classnames/src/index.js +1 -1
  239. package/dist/shared/dist/types/Colors.js +2 -0
  240. package/dist/shared/dist/types/Colors.js.map +1 -0
  241. package/dist/src/components/Accordion/Accordion/Accordion.module.scss.js +1 -1
  242. package/dist/src/components/AlertBanner/AlertBanner.module.scss.js +1 -1
  243. package/dist/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.module.scss.js +1 -1
  244. package/dist/src/components/AlertBanner/AlertBannerLink/AlertBannerLink.module.scss.js +1 -1
  245. package/dist/src/components/AlertBanner/AlertBannerText/AlertBannerText.module.scss.js +1 -1
  246. package/dist/src/components/AttentionBox/AttentionBox.module.scss.js +1 -1
  247. package/dist/src/components/AttentionBox/components/AttentionBoxCloseButton/AttentionBoxCloseButton.module.scss.js +1 -1
  248. package/dist/src/components/AttentionBox/components/AttentionBoxLeadingIcon/AttentionBoxLeadingIcon.module.scss.js +1 -1
  249. package/dist/src/components/AttentionBox/components/AttentionBoxLink/AttentionBoxLink.module.scss.js +1 -1
  250. package/dist/src/components/AttentionBox/layouts/AttentionBoxCompact/AttentionBoxCompact.module.scss.js +1 -1
  251. package/dist/src/components/AttentionBox/layouts/AttentionBoxDefault/AttentionBoxDefault.module.scss.js +1 -1
  252. package/dist/src/components/AvatarGroup/AvatarGroup.js.map +1 -1
  253. package/dist/src/components/AvatarGroup/AvatarGroup.module.scss.js +1 -1
  254. package/dist/src/components/AvatarGroup/AvatarGroupCounter.js.map +1 -1
  255. package/dist/src/components/AvatarGroup/AvatarGroupCounter.module.scss.js +1 -1
  256. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js.map +1 -1
  257. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.js.map +1 -1
  258. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.module.scss.js +1 -1
  259. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.js.map +1 -1
  260. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.module.scss.js +1 -1
  261. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipHelper.js +1 -1
  262. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipHelper.js.map +1 -1
  263. package/dist/src/components/AvatarGroup/AvatarGroupHelper.js.map +1 -1
  264. package/dist/src/components/Badge/Badge.module.scss.js +1 -1
  265. package/dist/src/components/Badge/Indicator/Indicator.module.scss.js +1 -1
  266. package/dist/src/components/BaseItem/BaseItem.module.scss.js +1 -1
  267. package/dist/src/components/BaseItem/utils.js +1 -1
  268. package/dist/src/components/BaseItem/utils.js.map +1 -1
  269. package/dist/src/components/BaseList/BaseList.module.scss.js +1 -1
  270. package/dist/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.module.scss.js +1 -1
  271. package/dist/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.module.scss.js +1 -1
  272. package/dist/src/components/BreadcrumbsBar/BreadcrumbMenu/BreadcrumbsMenu.module.scss.js +1 -1
  273. package/dist/src/components/BreadcrumbsBar/BreadcrumbsBar.module.scss.js +1 -1
  274. package/dist/src/components/Chips/Chips.js +1 -1
  275. package/dist/src/components/Chips/Chips.js.map +1 -1
  276. package/dist/src/components/Chips/Chips.module.scss.js +1 -1
  277. package/dist/src/components/ColorPicker/ColorPicker.module.scss.js +1 -1
  278. package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.module.scss.js +1 -1
  279. package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.module.scss.js +1 -1
  280. package/dist/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.module.scss.js +1 -1
  281. package/dist/src/components/Combobox/Combobox.module.scss.js +1 -1
  282. package/dist/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js +1 -1
  283. package/dist/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.module.scss.js +1 -1
  284. package/dist/src/components/Combobox/components/ComboboxItems/ComboboxItems.module.scss.js +1 -1
  285. package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.module.scss.js +1 -1
  286. package/dist/src/components/Combobox/components/StickyCategoryHeader/StickyCategoryHeader.module.scss.js +1 -1
  287. package/dist/src/components/DatePicker/DatePicker.module.scss.js +1 -1
  288. package/dist/src/components/DatePicker/DatePickerHeader.module.scss.js +1 -1
  289. package/dist/src/components/Dropdown/components/DropdownBase/DropdownBase.module.scss.js +1 -1
  290. package/dist/src/components/Dropdown/components/DropdownBaseList/DropdownBaseList.module.scss.js +1 -1
  291. package/dist/src/components/Dropdown/components/DropdownBoxMode/DropdownBoxMode.module.scss.js +1 -1
  292. package/dist/src/components/Dropdown/components/DropdownPopup/DropdownPopup.js +1 -1
  293. package/dist/src/components/Dropdown/components/DropdownPopup/DropdownPopup.js.map +1 -1
  294. package/dist/src/components/Dropdown/components/Menu/Menu.module.scss.js +1 -1
  295. package/dist/src/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.module.scss.js +1 -1
  296. package/dist/src/components/Dropdown/components/Trigger/Trigger.module.scss.js +1 -1
  297. package/dist/src/components/EmptyState/EmptyState.module.scss.js +1 -1
  298. package/dist/src/components/FieldLabel/FieldLabel.module.scss.js +1 -1
  299. package/dist/src/components/HiddenText/HiddenText.module.scss.js +1 -1
  300. package/dist/src/components/Info/components/InfoDialogContent/InfoDialogContent.module.scss.js +1 -1
  301. package/dist/src/components/Info/components/InfoLink/InfoLink.module.scss.js +1 -1
  302. package/dist/src/components/InfoText/InfoText.module.scss.js +1 -1
  303. package/dist/src/components/List/List.module.scss.js +1 -1
  304. package/dist/src/components/List/VirtualizedListItems/VirtualizedListItems.module.scss.js +1 -1
  305. package/dist/src/components/ListItem/ListItem.module.scss.js +1 -1
  306. package/dist/src/components/ListItemAvatar/ListItemAvatar.js +1 -1
  307. package/dist/src/components/ListItemAvatar/ListItemAvatar.js.map +1 -1
  308. package/dist/src/components/ListItemAvatar/ListItemAvatar.module.scss.js +1 -1
  309. package/dist/src/components/ListItemIcon/ListItemIcon.module.scss.js +1 -1
  310. package/dist/src/components/ListTitle/ListTitle.module.scss.js +1 -1
  311. package/dist/src/components/Menu/Menu/Menu.js +1 -1
  312. package/dist/src/components/Menu/Menu/Menu.js.map +1 -1
  313. package/dist/src/components/Menu/Menu/Menu.module.scss.js +1 -1
  314. package/dist/src/components/Menu/Menu/hooks/useMouseLeave.js +1 -1
  315. package/dist/src/components/Menu/Menu/hooks/useMouseLeave.js.map +1 -1
  316. package/dist/src/components/Menu/MenuDivider/MenuDivider.module.scss.js +1 -1
  317. package/dist/src/components/Menu/MenuItem/AvatarMenuItem.js +1 -1
  318. package/dist/src/components/Menu/MenuItem/AvatarMenuItem.js.map +1 -1
  319. package/dist/src/components/Menu/MenuItem/MenuItem.module.scss.js +1 -1
  320. package/dist/src/components/Menu/MenuItem/components/BaseMenuItem/BaseMenuItem.module.scss.js +1 -1
  321. package/dist/src/components/Menu/MenuItem/components/MenuItemIcon/MenuItemIcon.module.scss.js +1 -1
  322. package/dist/src/components/Menu/MenuItem/components/MenuItemSubMenuIcon/MenuItemSubMenuIcon.module.scss.js +1 -1
  323. package/dist/src/components/Menu/MenuItem/hooks/useMenuItemMouseEvents.js +1 -1
  324. package/dist/src/components/Menu/MenuItem/hooks/useMenuItemMouseEvents.js.map +1 -1
  325. package/dist/src/components/Menu/MenuItemButton/MenuItemButton.module.scss.js +1 -1
  326. package/dist/src/components/Menu/MenuTitle/MenuTitle.module.scss.js +1 -1
  327. package/dist/src/components/MenuButton/MenuButton.js +1 -1
  328. package/dist/src/components/MenuButton/MenuButton.module.scss.js +1 -1
  329. package/dist/src/components/Modal/Modal/Modal.module.scss.js +1 -1
  330. package/dist/src/components/Modal/ModalHeader/ModalHeader.module.scss.js +1 -1
  331. package/dist/src/components/Modal/ModalMedia/ModalMedia.module.scss.js +1 -1
  332. package/dist/src/components/Modal/ModalTopActions/ModalTopActions.module.scss.js +1 -1
  333. package/dist/src/components/Modal/footers/ModalFooter/ModalFooter.module.scss.js +1 -1
  334. package/dist/src/components/Modal/footers/ModalFooterBase/ModalFooterBase.module.scss.js +1 -1
  335. package/dist/src/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.module.scss.js +1 -1
  336. package/dist/src/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.module.scss.js +1 -1
  337. package/dist/src/components/Modal/layouts/ModalFooterShadow.module.scss.js +1 -1
  338. package/dist/src/components/Modal/layouts/ModalLayoutScrollableContent.module.scss.js +1 -1
  339. package/dist/src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.module.scss.js +1 -1
  340. package/dist/src/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.module.scss.js +1 -1
  341. package/dist/src/components/MultiStepIndicator/MultiStepIndicator.module.scss.js +1 -1
  342. package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.module.scss.js +1 -1
  343. package/dist/src/components/NumberField/NumberField.module.scss.js +1 -1
  344. package/dist/src/components/NumberField/components/NumberFieldSpinButton/NumberFieldSpinButton.module.scss.js +1 -1
  345. package/dist/src/components/Search/Search.module.scss.js +1 -1
  346. package/dist/src/components/Skeleton/Skeleton.module.scss.js +1 -1
  347. package/dist/src/components/SlideTransition/SlideTransition.module.scss.js +1 -1
  348. package/dist/src/components/Slider/SelectionIndicator.module.scss.js +1 -1
  349. package/dist/src/components/Slider/Slider.module.scss.js +1 -1
  350. package/dist/src/components/Slider/SliderBase/SliderBase.module.scss.js +1 -1
  351. package/dist/src/components/Slider/SliderBase/SliderFilledTrack.module.scss.js +1 -1
  352. package/dist/src/components/Slider/SliderBase/SliderRail.module.scss.js +1 -1
  353. package/dist/src/components/Slider/SliderBase/SliderThumb.module.scss.js +1 -1
  354. package/dist/src/components/Slider/SliderBase/SliderTrack.module.scss.js +1 -1
  355. package/dist/src/components/Slider/SliderInfix.module.scss.js +1 -1
  356. package/dist/src/components/SplitButton/SplitButton.module.scss.js +1 -1
  357. package/dist/src/components/Steps/Steps.module.scss.js +1 -1
  358. package/dist/src/components/Steps/StepsCommand.module.scss.js +1 -1
  359. package/dist/src/components/Steps/StepsDot.module.scss.js +1 -1
  360. package/dist/src/components/Steps/StepsGalleryHeader.module.scss.js +1 -1
  361. package/dist/src/components/Steps/StepsHeader.module.scss.js +1 -1
  362. package/dist/src/components/Steps/StepsNumbersHeader.module.scss.js +1 -1
  363. package/dist/src/components/Switch/Switch.module.scss.js +1 -1
  364. package/dist/src/components/Table/Table/Table.module.scss.js +1 -1
  365. package/dist/src/components/Table/TableBody/TableBody.module.scss.js +1 -1
  366. package/dist/src/components/Table/TableCell/TableCell.module.scss.js +1 -1
  367. package/dist/src/components/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js +1 -1
  368. package/dist/src/components/Table/TableContainer/TableContainer.module.scss.js +1 -1
  369. package/dist/src/components/Table/TableHeader/TableHeader.module.scss.js +1 -1
  370. package/dist/src/components/Table/TableHeaderCell/TableHeaderCell.module.scss.js +1 -1
  371. package/dist/src/components/Table/TableRow/TableRow.module.scss.js +1 -1
  372. package/dist/src/components/Table/TableRowMenu/TableRowMenu.module.scss.js +1 -1
  373. package/dist/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.module.scss.js +1 -1
  374. package/dist/src/components/Tabs/Tab/Tab.module.scss.js +1 -1
  375. package/dist/src/components/Tabs/TabList/TabList.js +1 -1
  376. package/dist/src/components/Tabs/TabList/TabList.js.map +1 -1
  377. package/dist/src/components/Tabs/TabList/TabList.module.scss.js +1 -1
  378. package/dist/src/components/Tabs/TabPanel/TabPanel.module.scss.js +1 -1
  379. package/dist/src/components/Tabs/TabPanels/TabPanels.module.scss.js +1 -1
  380. package/dist/src/components/Tabs/TabsContext/TabsContext.js +1 -1
  381. package/dist/src/components/Tabs/TabsContext/TabsContext.js.map +1 -1
  382. package/dist/src/components/TextArea/TextArea.module.scss.js +1 -1
  383. package/dist/src/components/TextField/TextField.module.scss.js +1 -1
  384. package/dist/src/components/TextWithHighlight/TextWithHighlight.module.scss.js +1 -1
  385. package/dist/src/components/Tipseen/Tipseen.module.scss.js +1 -1
  386. package/dist/src/components/Tipseen/TipseenBasicContent.module.scss.js +1 -1
  387. package/dist/src/components/Tipseen/TipseenContent.module.scss.js +1 -1
  388. package/dist/src/components/Tipseen/TipseenMedia/TipseenMedia.module.scss.js +1 -1
  389. package/dist/src/components/Tipseen/TipseenTitle.module.scss.js +1 -1
  390. package/dist/src/components/Tipseen/TipseenWizard.module.scss.js +1 -1
  391. package/dist/src/components/Toast/Toast.js +1 -1
  392. package/dist/src/components/Toast/Toast.js.map +1 -1
  393. package/dist/src/components/Toast/Toast.module.scss.js +1 -1
  394. package/dist/src/components/Toast/ToastLink/ToastLink.module.scss.js +1 -1
  395. package/dist/src/components/Toggle/MockToggle.module.scss.js +1 -1
  396. package/dist/src/components/Toggle/Toggle.module.scss.js +1 -1
  397. package/dist/src/components/Toggle/ToggleText.module.scss.js +1 -1
  398. package/dist/src/components/TransitionView/TransitionView.module.scss.js +1 -1
  399. package/dist/src/components/VirtualizedGrid/VirtualizedGrid.js +1 -1
  400. package/dist/src/components/VirtualizedGrid/VirtualizedGrid.js.map +1 -1
  401. package/dist/src/components/VirtualizedGrid/VirtualizedGrid.module.scss.js +1 -1
  402. package/dist/src/components/VirtualizedList/VirtualizedList.js +1 -1
  403. package/dist/src/components/VirtualizedList/VirtualizedList.js.map +1 -1
  404. package/dist/src/components/VirtualizedList/VirtualizedList.module.scss.js +1 -1
  405. package/dist/src/components/next/List/List.module.scss.js +1 -1
  406. package/dist/src/components/next/List/ListTitle/ListTitle.module.scss.js +1 -1
  407. package/dist/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js +1 -1
  408. package/dist/src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.js.map +1 -1
  409. package/dist/src/hooks/useSetFocus/index.js +1 -1
  410. package/dist/src/hooks/useSetFocus/index.js.map +1 -1
  411. package/dist/src/index.js +1 -1
  412. package/dist/style/dist/index.min.css.js +1 -1
  413. package/package.json +15 -13
  414. package/dist/components/Avatar/Avatar.d.ts +0 -107
  415. package/dist/components/Avatar/Avatar.types.d.ts +0 -2
  416. package/dist/components/Avatar/AvatarBadge.d.ts +0 -28
  417. package/dist/components/Avatar/AvatarContent.d.ts +0 -40
  418. package/dist/components/Avatar/index.d.ts +0 -2
  419. package/dist/components/EditableHeading/EditableHeading.d.ts +0 -16
  420. package/dist/components/EditableHeading/index.d.ts +0 -1
  421. package/dist/components/EditableText/EditableText.d.ts +0 -20
  422. package/dist/components/EditableText/index.d.ts +0 -1
  423. package/dist/components/EditableTypography/EditableTypography.d.ts +0 -79
  424. package/dist/components/EditableTypography/index.d.ts +0 -1
  425. package/dist/components/button-group/dist/ButtonGroup/usePrevious.js +0 -2
  426. package/dist/components/button-group/dist/ButtonGroup/usePrevious.js.map +0 -1
  427. package/dist/hooks/usePrevious/index.d.ts +0 -1
  428. package/dist/mocked_classnames/components/Avatar/Avatar.d.ts +0 -107
  429. package/dist/mocked_classnames/components/Avatar/Avatar.types.d.ts +0 -2
  430. package/dist/mocked_classnames/components/Avatar/AvatarBadge.d.ts +0 -28
  431. package/dist/mocked_classnames/components/Avatar/AvatarContent.d.ts +0 -40
  432. package/dist/mocked_classnames/components/Avatar/index.d.ts +0 -2
  433. package/dist/mocked_classnames/components/EditableHeading/EditableHeading.d.ts +0 -16
  434. package/dist/mocked_classnames/components/EditableHeading/index.d.ts +0 -1
  435. package/dist/mocked_classnames/components/EditableText/EditableText.d.ts +0 -20
  436. package/dist/mocked_classnames/components/EditableText/index.d.ts +0 -1
  437. package/dist/mocked_classnames/components/EditableTypography/EditableTypography.d.ts +0 -79
  438. package/dist/mocked_classnames/components/EditableTypography/index.d.ts +0 -1
  439. package/dist/mocked_classnames/hooks/usePrevious/index.d.ts +0 -1
  440. package/dist/mocked_classnames/src/components/Avatar/Avatar.js +0 -2
  441. package/dist/mocked_classnames/src/components/Avatar/Avatar.js.map +0 -1
  442. package/dist/mocked_classnames/src/components/Avatar/Avatar.module.scss.js +0 -2
  443. package/dist/mocked_classnames/src/components/Avatar/AvatarBadge.js +0 -2
  444. package/dist/mocked_classnames/src/components/Avatar/AvatarBadge.js.map +0 -1
  445. package/dist/mocked_classnames/src/components/Avatar/AvatarBadge.module.scss.js +0 -2
  446. package/dist/mocked_classnames/src/components/Avatar/AvatarContent.js +0 -2
  447. package/dist/mocked_classnames/src/components/Avatar/AvatarContent.js.map +0 -1
  448. package/dist/mocked_classnames/src/components/Avatar/AvatarContent.module.scss.js +0 -2
  449. package/dist/mocked_classnames/src/components/EditableHeading/EditableHeading.js +0 -2
  450. package/dist/mocked_classnames/src/components/EditableHeading/EditableHeading.js.map +0 -1
  451. package/dist/mocked_classnames/src/components/EditableHeading/EditableHeading.module.scss.js +0 -2
  452. package/dist/mocked_classnames/src/components/EditableText/EditableText.js +0 -2
  453. package/dist/mocked_classnames/src/components/EditableText/EditableText.js.map +0 -1
  454. package/dist/mocked_classnames/src/components/EditableText/EditableText.module.scss.js +0 -2
  455. package/dist/mocked_classnames/src/components/EditableTypography/EditableTypography.js +0 -2
  456. package/dist/mocked_classnames/src/components/EditableTypography/EditableTypography.js.map +0 -1
  457. package/dist/mocked_classnames/src/components/EditableTypography/EditableTypography.module.scss.js +0 -2
  458. package/dist/mocked_classnames/src/hooks/usePrevious/index.js +0 -2
  459. package/dist/mocked_classnames/src/hooks/usePrevious/index.js.map +0 -1
  460. package/dist/src/components/Avatar/Avatar.js +0 -2
  461. package/dist/src/components/Avatar/Avatar.js.map +0 -1
  462. package/dist/src/components/Avatar/Avatar.module.scss.js +0 -2
  463. package/dist/src/components/Avatar/Avatar.module.scss.js.map +0 -1
  464. package/dist/src/components/Avatar/AvatarBadge.js +0 -2
  465. package/dist/src/components/Avatar/AvatarBadge.js.map +0 -1
  466. package/dist/src/components/Avatar/AvatarBadge.module.scss.js +0 -2
  467. package/dist/src/components/Avatar/AvatarBadge.module.scss.js.map +0 -1
  468. package/dist/src/components/Avatar/AvatarContent.js +0 -2
  469. package/dist/src/components/Avatar/AvatarContent.js.map +0 -1
  470. package/dist/src/components/Avatar/AvatarContent.module.scss.js +0 -2
  471. package/dist/src/components/Avatar/AvatarContent.module.scss.js.map +0 -1
  472. package/dist/src/components/EditableHeading/EditableHeading.js +0 -2
  473. package/dist/src/components/EditableHeading/EditableHeading.js.map +0 -1
  474. package/dist/src/components/EditableHeading/EditableHeading.module.scss.js +0 -2
  475. package/dist/src/components/EditableHeading/EditableHeading.module.scss.js.map +0 -1
  476. package/dist/src/components/EditableText/EditableText.js +0 -2
  477. package/dist/src/components/EditableText/EditableText.js.map +0 -1
  478. package/dist/src/components/EditableText/EditableText.module.scss.js +0 -2
  479. package/dist/src/components/EditableText/EditableText.module.scss.js.map +0 -1
  480. package/dist/src/components/EditableTypography/EditableTypography.js +0 -2
  481. package/dist/src/components/EditableTypography/EditableTypography.js.map +0 -1
  482. package/dist/src/components/EditableTypography/EditableTypography.module.scss.js +0 -2
  483. package/dist/src/components/EditableTypography/EditableTypography.module.scss.js.map +0 -1
  484. package/dist/src/hooks/usePrevious/index.js.map +0 -1
  485. /package/dist/{mocked_classnames/src/components → components/avatar/dist}/Avatar/Avatar.module.scss.js.map +0 -0
  486. /package/dist/{mocked_classnames/src/components → components/avatar/dist}/Avatar/AvatarBadge.module.scss.js.map +0 -0
  487. /package/dist/{mocked_classnames/src/components → components/avatar/dist}/Avatar/AvatarContent.module.scss.js.map +0 -0
  488. /package/dist/{mocked_classnames/src/components → components/editable/dist}/EditableHeading/EditableHeading.module.scss.js.map +0 -0
  489. /package/dist/{mocked_classnames/src/components → components/editable/dist}/EditableText/EditableText.module.scss.js.map +0 -0
  490. /package/dist/{mocked_classnames/src/components → components/editable/dist}/EditableTypography/EditableTypography.module.scss.js.map +0 -0
  491. /package/dist/{src/hooks → hooks/dist}/usePrevious/index.js +0 -0
@@ -1,2 +1,2 @@
1
- var e={title:"title"};!function(e){const t="s_id-c12c5d8f6c34_4_5_8";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".title {\n padding-inline-end: var(--space-16);\n padding-bottom: var(--space-4);\n}");export{e as default};
1
+ var e={title:"title"};!function(e){const t="s_id-c12c5d8f6c34_4_5_10";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".title {\n padding-inline-end: var(--space-16);\n padding-bottom: var(--space-4);\n}");export{e as default};
2
2
  //# sourceMappingURL=TipseenTitle.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var e={tipseenWizard:"tipseenWizard",tipseenWizardWizard:"tipseenWizardWizard"};!function(e){const i="s_id-98eba0c83d1f_4_5_8";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+i))return;const d=document.createElement("style");d.id=i,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[i]=e)}(".tipseenWizard {\n display: flex;\n flex-direction: column;\n}\n.tipseenWizardWizard {\n width: 100%;\n}");export{e as default};
1
+ var e={tipseenWizard:"tipseenWizard",tipseenWizardWizard:"tipseenWizardWizard"};!function(e){const i="s_id-98eba0c83d1f_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+i))return;const d=document.createElement("style");d.id=i,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[i]=e)}(".tipseenWizard {\n display: flex;\n flex-direction: column;\n}\n.tipseenWizardWizard {\n width: 100%;\n}");export{e as default};
2
2
  //# sourceMappingURL=TipseenWizard.module.scss.js.map
@@ -1,2 +1,2 @@
1
- import{defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as e}from"../../../_virtual/_tslib.js";import{camelCase as o}from"es-toolkit";import{getTestId as i,ComponentDefaultTestId as n}from"../../tests/testIds.js";import r from"classnames";import a,{useRef as l,useMemo as s,useCallback as c,useEffect as m}from"react";import{CSSTransition as u}from"react-transition-group";import{Text as d}from"@vibe/typography/mockedClassNames";import{Loader as f}from"@vibe/loader/mockedClassNames";import{Flex as p}from"@vibe/layout/mockedClassNames";import{CloseSmall as v}from"@vibe/icons";import T from"./ToastLink/ToastLink.js";import y from"./ToastButton/ToastButton.js";import{getIcon as h}from"./ToastHelpers.js";import{getStyle as b,NOOP as N}from"@vibe/shared";import g from"./Toast.module.scss.js";import{IconButton as k}from"@vibe/icon-button/mockedClassNames";import E from"../../hooks/usePrevious/index.js";var C=function(C){var j=C.open,x=void 0!==j&&j,O=C.loading,A=void 0!==O&&O,B=C.autoHideDuration,_=void 0===B?null:B,w=C.type,L=void 0===w?"normal":w,S=C.icon,H=C.hideIcon,P=void 0!==H&&H,z=C.action,I=C.actions,D=C.children,R=C.closeable,U=void 0===R||R,q=C.onClose,F=void 0===q?N:q,G=C.className,J=C.id,K=C.closeButtonAriaLabel,M=void 0===K?"Close":K,Q=C["data-testid"],V=l(null),W=l(null),X=E(null==I?void 0:I.length),Y=s((function(){return I?I.filter((function(t){return"link"===t.type})).map((function(t){var o=e(t,["type"]);return a.createElement(T,Object.assign({key:o.href,className:g.actionLink},o))})):null}),[I]),Z=s((function(){return void 0!==X&&(null==I?void 0:I.length)!==X}),[I,X]),$=s((function(){return I?I.filter((function(t){return"button"===t.type})).map((function(o,i){var n=o.content,l=e(o,["type","content"]);return a.createElement(y,Object.assign({key:"alert-button-".concat(i),className:r(g.actionButton,t({},g.withTransition,Z))},l),n)})):null}),[I,Z]),tt=s((function(){return r(g.toast,b(g,o("type-"+L)),G)}),[L,G]),et=c((function(){F&&F()}),[F]),ot=l(),it=c((function(t){F&&null!=t&&(clearTimeout(ot.current),ot.current=setTimeout((function(){et()}),t))}),[et,F]);m((function(){return x&&_>0&&it(_),function(){clearTimeout(ot.current)}}),[x,_,it]);var nt=!P&&h(L,S),rt=c((function(t){var e=t.style.width;t.style.width="auto";var o=getComputedStyle(t).width;t.style.width=e,t.style.width=o}),[]);return m((function(){V.current&&rt(V.current)}),[D,rt]),a.createElement(u,{in:x,nodeRef:W,classNames:{enterActive:g.enterActive,exitActive:g.exitActive},timeout:400,unmountOnExit:!0},a.createElement(d,{ref:W,id:J,"data-testid":Q||i(n.TOAST,J),type:"text2",element:"div",color:"fixedLight",className:tt,role:"alert","aria-live":"polite"},nt&&a.createElement("div",{className:r(g.icon)},nt),a.createElement(p,{align:"center",gap:"large",className:g.content},a.createElement(p,{gap:"medium","data-testid":i(n.TOAST_CONTENT),className:g.textContent},a.createElement("span",null,D),Y),($||z)&&($||z),A&&a.createElement(f,{size:"xs"})),U&&a.createElement(k,{className:r(g.closeButton),onClick:et,size:"small",kind:"tertiary",color:"fixed-light","aria-label":M,"data-testid":i(n.TOAST_CLOSE_BUTTON),icon:v,hideTooltip:!0})))};export{C as default};
1
+ import{defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as e}from"../../../_virtual/_tslib.js";import{camelCase as o}from"es-toolkit";import{getTestId as i,ComponentDefaultTestId as n}from"../../tests/testIds.js";import r from"classnames";import a,{useRef as l,useMemo as s,useCallback as c,useEffect as m}from"react";import{CSSTransition as u}from"react-transition-group";import{Text as d}from"@vibe/typography/mockedClassNames";import{Loader as f}from"@vibe/loader/mockedClassNames";import{Flex as p}from"@vibe/layout/mockedClassNames";import{CloseSmall as v}from"@vibe/icons";import T from"./ToastLink/ToastLink.js";import y from"./ToastButton/ToastButton.js";import{getIcon as b}from"./ToastHelpers.js";import{getStyle as h,NOOP as N}from"@vibe/shared";import g from"./Toast.module.scss.js";import{IconButton as k}from"@vibe/icon-button/mockedClassNames";import{usePrevious as E}from"@vibe/hooks";var C=function(C){var j=C.open,x=void 0!==j&&j,O=C.loading,A=void 0!==O&&O,B=C.autoHideDuration,_=void 0===B?null:B,w=C.type,L=void 0===w?"normal":w,S=C.icon,H=C.hideIcon,z=void 0!==H&&H,I=C.action,P=C.actions,D=C.children,R=C.closeable,U=void 0===R||R,q=C.onClose,F=void 0===q?N:q,G=C.className,J=C.id,K=C.closeButtonAriaLabel,M=void 0===K?"Close":K,Q=C["data-testid"],V=l(null),W=l(null),X=E(null==P?void 0:P.length),Y=s((function(){return P?P.filter((function(t){return"link"===t.type})).map((function(t){var o=e(t,["type"]);return a.createElement(T,Object.assign({key:o.href,className:g.actionLink},o))})):null}),[P]),Z=s((function(){return void 0!==X&&(null==P?void 0:P.length)!==X}),[P,X]),$=s((function(){return P?P.filter((function(t){return"button"===t.type})).map((function(o,i){var n=o.content,l=e(o,["type","content"]);return a.createElement(y,Object.assign({key:"alert-button-".concat(i),className:r(g.actionButton,t({},g.withTransition,Z))},l),n)})):null}),[P,Z]),tt=s((function(){return r(g.toast,h(g,o("type-"+L)),G)}),[L,G]),et=c((function(){F&&F()}),[F]),ot=l(),it=c((function(t){F&&null!=t&&(clearTimeout(ot.current),ot.current=setTimeout((function(){et()}),t))}),[et,F]);m((function(){return x&&_>0&&it(_),function(){clearTimeout(ot.current)}}),[x,_,it]);var nt=!z&&b(L,S),rt=c((function(t){var e=t.style.width;t.style.width="auto";var o=getComputedStyle(t).width;t.style.width=e,t.style.width=o}),[]);return m((function(){V.current&&rt(V.current)}),[D,rt]),a.createElement(u,{in:x,nodeRef:W,classNames:{enterActive:g.enterActive,exitActive:g.exitActive},timeout:400,unmountOnExit:!0},a.createElement(d,{ref:W,id:J,"data-testid":Q||i(n.TOAST,J),type:"text2",element:"div",color:"fixedLight",className:tt,role:"alert","aria-live":"polite"},nt&&a.createElement("div",{className:r(g.icon)},nt),a.createElement(p,{align:"center",gap:"large",className:g.content},a.createElement(p,{gap:"medium","data-testid":i(n.TOAST_CONTENT),className:g.textContent},a.createElement("span",null,D),Y),($||I)&&($||I),A&&a.createElement(f,{size:"xs"})),U&&a.createElement(k,{className:r(g.closeButton),onClick:et,size:"small",kind:"tertiary",color:"fixed-light","aria-label":M,"data-testid":i(n.TOAST_CLOSE_BUTTON),icon:v,hideTooltip:!0})))};export{C as default};
2
2
  //# sourceMappingURL=Toast.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.js","sources":["../../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type ReactElement, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { type IconSubComponentProps } from \"@vibe/icon\";\nimport { Text } from \"@vibe/typography\";\nimport { Loader } from \"@vibe/loader\";\nimport { Flex } from \"@vibe/layout\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport ToastLink from \"./ToastLink/ToastLink\";\nimport ToastButton from \"./ToastButton/ToastButton\";\nimport { type ToastType, type ToastAction } from \"./Toast.types\";\nimport { getIcon } from \"./ToastHelpers\";\nimport { NOOP, getStyle } from \"@vibe/shared\";\n\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./Toast.module.scss\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport usePrevious from \"../../hooks/usePrevious\";\n\nexport interface ToastProps extends VibeComponentProps {\n /**\n * The actions available in the toast.\n */\n actions?: ToastAction[];\n /**\n * If true, the toast is open (visible).\n */\n open?: boolean;\n /**\n * If true, displays a loading indicator inside the toast.\n */\n loading?: boolean;\n /**\n * The type of toast.\n */\n type?: ToastType;\n /**\n * The icon displayed in the toast.\n */\n icon?: string | React.FC<IconSubComponentProps> | null;\n /**\n * If true, hides the toast icon.\n */\n hideIcon?: boolean;\n /**\n * The action element displayed in the toast.\n */\n action?: JSX.Element;\n /**\n * If false, hides the close button.\n */\n closeable?: boolean;\n /**\n * Callback fired when the toast is closed.\n */\n onClose?: () => void;\n /**\n * The number of milliseconds before the toast automatically closes.\n * (0 or null disables auto-close behavior).\n */\n autoHideDuration?: number;\n /**\n * The content displayed inside the toast.\n */\n children?: ReactElement | ReactElement[] | string;\n /**\n * The aria-label for the close button.\n */\n closeButtonAriaLabel?: string;\n}\n\nconst Toast = ({\n open = false,\n loading = false,\n autoHideDuration = null,\n type = \"normal\",\n icon,\n hideIcon = false,\n action: deprecatedAction,\n actions,\n children,\n closeable = true,\n onClose = NOOP,\n className,\n id,\n closeButtonAriaLabel = \"Close\",\n \"data-testid\": dataTestId\n}: ToastProps) => {\n const ref = useRef(null);\n const nodeRef = useRef<HTMLDivElement>(null);\n const prevActions = usePrevious(actions?.length);\n const toastLinks = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"link\")\n .map(({ type: _type, ...otherProps }) => (\n <ToastLink key={otherProps.href} className={styles.actionLink} {...otherProps} />\n ))\n : null;\n }, [actions]);\n\n const shouldShowButtonTransition = useMemo(() => {\n return prevActions !== undefined && actions?.length !== prevActions;\n }, [actions, prevActions]);\n\n const toastButtons: JSX.Element[] | null = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"button\")\n .map(({ type: _type, content, ...otherProps }, index) => (\n <ToastButton\n key={`alert-button-${index}`}\n className={cx(styles.actionButton, { [styles.withTransition]: shouldShowButtonTransition })}\n {...otherProps}\n >\n {content}\n </ToastButton>\n ))\n : null;\n }, [actions, shouldShowButtonTransition]);\n\n const classNames = useMemo(\n () => cx(styles.toast, getStyle(styles, camelCase(\"type-\" + type)), className),\n [type, className]\n );\n\n const handleClose = useCallback(() => {\n if (onClose) {\n onClose();\n }\n }, [onClose]);\n\n /* Timer */\n const timerAutoHide = useRef<NodeJS.Timeout>();\n const setAutoHideTimer = useCallback(\n (duration: number) => {\n if (!onClose || duration == null) {\n return;\n }\n\n clearTimeout(timerAutoHide.current);\n timerAutoHide.current = setTimeout(() => {\n handleClose();\n }, duration);\n },\n [handleClose, onClose]\n );\n\n useEffect(() => {\n if (open && autoHideDuration > 0) {\n setAutoHideTimer(autoHideDuration);\n }\n\n return () => {\n clearTimeout(timerAutoHide.current);\n };\n }, [open, autoHideDuration, setAutoHideTimer]);\n\n const iconElement = !hideIcon && getIcon(type, icon);\n\n // https://n12v.com/css-transition-to-from-auto/\n const recalculateElementWidth = useCallback((element: HTMLElement) => {\n const prevWidth = element.style.width;\n element.style.width = \"auto\";\n const endWidth = getComputedStyle(element).width;\n element.style.width = prevWidth;\n element.offsetWidth; // force repaint\n element.style.width = endWidth;\n }, []);\n\n useEffect(() => {\n if (ref.current) {\n recalculateElementWidth(ref.current);\n }\n }, [children, recalculateElementWidth]);\n\n return (\n <CSSTransition\n in={open}\n nodeRef={nodeRef}\n classNames={{ enterActive: styles.enterActive, exitActive: styles.exitActive }}\n timeout={400}\n unmountOnExit\n >\n <Text\n ref={nodeRef}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TOAST, id)}\n type=\"text2\"\n element=\"div\"\n color=\"fixedLight\"\n className={classNames}\n role=\"alert\"\n aria-live=\"polite\"\n >\n {iconElement && <div className={cx(styles.icon)}>{iconElement}</div>}\n <Flex align=\"center\" gap=\"large\" className={styles.content}>\n <Flex\n gap=\"medium\"\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CONTENT)}\n className={styles.textContent}\n >\n <span>{children}</span>\n {toastLinks}\n </Flex>\n {(toastButtons || deprecatedAction) && (toastButtons || deprecatedAction)}\n {loading && <Loader size=\"xs\" />}\n </Flex>\n {closeable && (\n <IconButton\n className={cx(styles.closeButton)}\n onClick={handleClose}\n size=\"small\"\n kind=\"tertiary\"\n color=\"fixed-light\"\n aria-label={closeButtonAriaLabel}\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CLOSE_BUTTON)}\n icon={CloseSmall}\n hideTooltip\n />\n )}\n </Text>\n </CSSTransition>\n );\n};\n\nexport default Toast;\n"],"names":["Toast","_ref","_ref$open","open","_ref$loading","loading","_ref$autoHideDuration","autoHideDuration","_ref$type","type","icon","_ref$hideIcon","hideIcon","deprecatedAction","action","actions","children","_ref$closeable","closeable","_ref$onClose","onClose","NOOP","className","id","_ref$closeButtonAriaL","closeButtonAriaLabel","dataTestId","ref","useRef","nodeRef","prevActions","usePrevious","length","toastLinks","useMemo","filter","map","_a","otherProps","__rest","React","createElement","ToastLink","key","href","styles","actionLink","shouldShowButtonTransition","undefined","toastButtons","index","content","ToastButton","Object","assign","concat","cx","actionButton","_defineProperty","withTransition","classNames","toast","getStyle","camelCase","handleClose","useCallback","timerAutoHide","setAutoHideTimer","duration","clearTimeout","current","setTimeout","useEffect","iconElement","getIcon","recalculateElementWidth","element","prevWidth","style","width","endWidth","getComputedStyle","CSSTransition","in","enterActive","exitActive","timeout","unmountOnExit","Text","getTestId","ComponentDefaultTestId","TOAST","color","role","Flex","align","gap","TOAST_CONTENT","textContent","Loader","size","IconButton","closeButton","onClick","kind","TOAST_CLOSE_BUTTON","CloseSmall","hideTooltip"],"mappings":"i7BAyEA,IAAMA,EAAQ,SAAHC,GAgBM,IAAAC,EAAAD,EAffE,KAAAA,OAAO,IAAHD,GAAQA,EAAAE,EAAAH,EACZI,QAAAA,OAAU,IAAHD,GAAQA,EAAAE,EAAAL,EACfM,iBAAAA,OAAmB,IAAHD,EAAG,KAAIA,EAAAE,EAAAP,EACvBQ,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAAIT,EAAJS,KAAIC,EAAAV,EACJW,SAAAA,OAAW,IAAHD,GAAQA,EACRE,EAAgBZ,EAAxBa,OACAC,EAAOd,EAAPc,QACAC,EAAQf,EAARe,SAAQC,EAAAhB,EACRiB,UAAAA,OAAY,IAAHD,GAAOA,EAAAE,EAAAlB,EAChBmB,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EACdG,EAASrB,EAATqB,UACAC,EAAEtB,EAAFsB,GAAEC,EAAAvB,EACFwB,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EACfE,EAAUzB,EAAzB,eAEM0B,EAAMC,EAAO,MACbC,EAAUD,EAAuB,MACjCE,EAAcC,EAAYhB,aAAO,EAAPA,EAASiB,QACnCC,EAAaC,GAAQ,WACzB,OAAOnB,EACHA,EACGoB,QAAO,SAAArB,GAAM,MAAoB,SAAhBA,EAAOL,IAAe,IACvC2B,KAAI,SAACC,GAAkBC,IAAAA,EAAUC,EAAAF,EAA5B,UAAmC,OACvCG,EAACC,cAAAC,iBAAUC,IAAKL,EAAWM,KAAMtB,UAAWuB,EAAOC,YAAgBR,GACpE,IACH,IACN,GAAG,CAACvB,IAEEgC,EAA6Bb,GAAQ,WACzC,YAAuBc,IAAhBlB,IAA6Bf,aAAO,EAAPA,EAASiB,UAAWF,CAC1D,GAAG,CAACf,EAASe,IAEPmB,EAAqCf,GAAQ,WACjD,OAAOnB,EACHA,EACGoB,QAAO,SAAArB,GAAM,MAAoB,WAAhBA,EAAOL,IAAiB,IACzC2B,KAAI,SAACC,EAAyCa,OAA1BC,IAAAA,QAAYb,EAA3BC,EAAAF,EAAA,CAAA,OAAA,YAAmD,OACvDG,EAAAC,cAACW,EAAWC,OAAAC,OAAA,CACVX,IAAGY,gBAAAA,OAAkBL,GACrB5B,UAAWkC,EAAGX,EAAOY,aAAYC,EAAA,CAAA,EAAKb,EAAOc,eAAiBZ,KAC1DT,GAEHa,EAEJ,IACH,IACN,GAAG,CAACpC,EAASgC,IAEPa,GAAa1B,GACjB,WAAA,OAAMsB,EAAGX,EAAOgB,MAAOC,EAASjB,EAAQkB,EAAU,QAAUtD,IAAQa,EAAU,GAC9E,CAACb,EAAMa,IAGH0C,GAAcC,GAAY,WAC1B7C,GACFA,GAEJ,GAAG,CAACA,IAGE8C,GAAgBtC,IAChBuC,GAAmBF,GACvB,SAACG,GACMhD,GAAuB,MAAZgD,IAIhBC,aAAaH,GAAcI,SAC3BJ,GAAcI,QAAUC,YAAW,WACjCP,IACD,GAAEI,GACL,GACA,CAACJ,GAAa5C,IAGhBoD,GAAU,WAKR,OAJIrE,GAAQI,EAAmB,GAC7B4D,GAAiB5D,GAGZ,WACL8D,aAAaH,GAAcI,SAE9B,GAAE,CAACnE,EAAMI,EAAkB4D,KAE5B,IAAMM,IAAe7D,GAAY8D,EAAQjE,EAAMC,GAGzCiE,GAA0BV,GAAY,SAACW,GAC3C,IAAMC,EAAYD,EAAQE,MAAMC,MAChCH,EAAQE,MAAMC,MAAQ,OACtB,IAAMC,EAAWC,iBAAiBL,GAASG,MAC3CH,EAAQE,MAAMC,MAAQF,EAEtBD,EAAQE,MAAMC,MAAQC,CACvB,GAAE,IAQH,OANAR,GAAU,WACJ7C,EAAI2C,SACNK,GAAwBhD,EAAI2C,QAEhC,GAAG,CAACtD,EAAU2D,KAGZnC,EAAAC,cAACyC,EAAa,CACZC,GAAIhF,EACJ0B,QAASA,EACT+B,WAAY,CAAEwB,YAAavC,EAAOuC,YAAaC,WAAYxC,EAAOwC,YAClEC,QAAS,IACTC,eAAa,GAEb/C,EAAAC,cAAC+C,EACC,CAAA7D,IAAKE,EACLN,GAAIA,EACS,cAAAG,GAAc+D,EAAUC,EAAuBC,MAAOpE,GACnEd,KAAK,QACLmE,QAAQ,MACRgB,MAAM,aACNtE,UAAWsC,GACXiC,KAAK,oBACK,UAETpB,IAAejC,EAAAC,cAAA,MAAA,CAAKnB,UAAWkC,EAAGX,EAAOnC,OAAQ+D,IAClDjC,EAAAC,cAACqD,EAAI,CAACC,MAAM,SAASC,IAAI,QAAQ1E,UAAWuB,EAAOM,SACjDX,EAAAC,cAACqD,EACC,CAAAE,IAAI,uBACSP,EAAUC,EAAuBO,eAC9C3E,UAAWuB,EAAOqD,aAElB1D,EAAAC,cAAA,OAAA,KAAOzB,GACNiB,IAEDgB,GAAgBpC,KAAsBoC,GAAgBpC,GACvDR,GAAWmC,gBAAC2D,EAAM,CAACC,KAAK,QAE1BlF,GACCsB,EAACC,cAAA4D,GACC/E,UAAWkC,EAAGX,EAAOyD,aACrBC,QAASvC,GACToC,KAAK,QACLI,KAAK,WACLZ,MAAM,cAAa,aACPnE,EACC,cAAAgE,EAAUC,EAAuBe,oBAC9C/F,KAAMgG,EACNC,kBAMZ"}
1
+ {"version":3,"file":"Toast.js","sources":["../../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type ReactElement, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { type IconSubComponentProps } from \"@vibe/icon\";\nimport { Text } from \"@vibe/typography\";\nimport { Loader } from \"@vibe/loader\";\nimport { Flex } from \"@vibe/layout\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport ToastLink from \"./ToastLink/ToastLink\";\nimport ToastButton from \"./ToastButton/ToastButton\";\nimport { type ToastType, type ToastAction } from \"./Toast.types\";\nimport { getIcon } from \"./ToastHelpers\";\nimport { NOOP, getStyle } from \"@vibe/shared\";\n\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./Toast.module.scss\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { usePrevious } from \"@vibe/hooks\";\n\nexport interface ToastProps extends VibeComponentProps {\n /**\n * The actions available in the toast.\n */\n actions?: ToastAction[];\n /**\n * If true, the toast is open (visible).\n */\n open?: boolean;\n /**\n * If true, displays a loading indicator inside the toast.\n */\n loading?: boolean;\n /**\n * The type of toast.\n */\n type?: ToastType;\n /**\n * The icon displayed in the toast.\n */\n icon?: string | React.FC<IconSubComponentProps> | null;\n /**\n * If true, hides the toast icon.\n */\n hideIcon?: boolean;\n /**\n * The action element displayed in the toast.\n */\n action?: JSX.Element;\n /**\n * If false, hides the close button.\n */\n closeable?: boolean;\n /**\n * Callback fired when the toast is closed.\n */\n onClose?: () => void;\n /**\n * The number of milliseconds before the toast automatically closes.\n * (0 or null disables auto-close behavior).\n */\n autoHideDuration?: number;\n /**\n * The content displayed inside the toast.\n */\n children?: ReactElement | ReactElement[] | string;\n /**\n * The aria-label for the close button.\n */\n closeButtonAriaLabel?: string;\n}\n\nconst Toast = ({\n open = false,\n loading = false,\n autoHideDuration = null,\n type = \"normal\",\n icon,\n hideIcon = false,\n action: deprecatedAction,\n actions,\n children,\n closeable = true,\n onClose = NOOP,\n className,\n id,\n closeButtonAriaLabel = \"Close\",\n \"data-testid\": dataTestId\n}: ToastProps) => {\n const ref = useRef(null);\n const nodeRef = useRef<HTMLDivElement>(null);\n const prevActions = usePrevious(actions?.length);\n const toastLinks = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"link\")\n .map(({ type: _type, ...otherProps }) => (\n <ToastLink key={otherProps.href} className={styles.actionLink} {...otherProps} />\n ))\n : null;\n }, [actions]);\n\n const shouldShowButtonTransition = useMemo(() => {\n return prevActions !== undefined && actions?.length !== prevActions;\n }, [actions, prevActions]);\n\n const toastButtons: JSX.Element[] | null = useMemo(() => {\n return actions\n ? actions\n .filter(action => action.type === \"button\")\n .map(({ type: _type, content, ...otherProps }, index) => (\n <ToastButton\n key={`alert-button-${index}`}\n className={cx(styles.actionButton, { [styles.withTransition]: shouldShowButtonTransition })}\n {...otherProps}\n >\n {content}\n </ToastButton>\n ))\n : null;\n }, [actions, shouldShowButtonTransition]);\n\n const classNames = useMemo(\n () => cx(styles.toast, getStyle(styles, camelCase(\"type-\" + type)), className),\n [type, className]\n );\n\n const handleClose = useCallback(() => {\n if (onClose) {\n onClose();\n }\n }, [onClose]);\n\n /* Timer */\n const timerAutoHide = useRef<NodeJS.Timeout>();\n const setAutoHideTimer = useCallback(\n (duration: number) => {\n if (!onClose || duration == null) {\n return;\n }\n\n clearTimeout(timerAutoHide.current);\n timerAutoHide.current = setTimeout(() => {\n handleClose();\n }, duration);\n },\n [handleClose, onClose]\n );\n\n useEffect(() => {\n if (open && autoHideDuration > 0) {\n setAutoHideTimer(autoHideDuration);\n }\n\n return () => {\n clearTimeout(timerAutoHide.current);\n };\n }, [open, autoHideDuration, setAutoHideTimer]);\n\n const iconElement = !hideIcon && getIcon(type, icon);\n\n // https://n12v.com/css-transition-to-from-auto/\n const recalculateElementWidth = useCallback((element: HTMLElement) => {\n const prevWidth = element.style.width;\n element.style.width = \"auto\";\n const endWidth = getComputedStyle(element).width;\n element.style.width = prevWidth;\n element.offsetWidth; // force repaint\n element.style.width = endWidth;\n }, []);\n\n useEffect(() => {\n if (ref.current) {\n recalculateElementWidth(ref.current);\n }\n }, [children, recalculateElementWidth]);\n\n return (\n <CSSTransition\n in={open}\n nodeRef={nodeRef}\n classNames={{ enterActive: styles.enterActive, exitActive: styles.exitActive }}\n timeout={400}\n unmountOnExit\n >\n <Text\n ref={nodeRef}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.TOAST, id)}\n type=\"text2\"\n element=\"div\"\n color=\"fixedLight\"\n className={classNames}\n role=\"alert\"\n aria-live=\"polite\"\n >\n {iconElement && <div className={cx(styles.icon)}>{iconElement}</div>}\n <Flex align=\"center\" gap=\"large\" className={styles.content}>\n <Flex\n gap=\"medium\"\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CONTENT)}\n className={styles.textContent}\n >\n <span>{children}</span>\n {toastLinks}\n </Flex>\n {(toastButtons || deprecatedAction) && (toastButtons || deprecatedAction)}\n {loading && <Loader size=\"xs\" />}\n </Flex>\n {closeable && (\n <IconButton\n className={cx(styles.closeButton)}\n onClick={handleClose}\n size=\"small\"\n kind=\"tertiary\"\n color=\"fixed-light\"\n aria-label={closeButtonAriaLabel}\n data-testid={getTestId(ComponentDefaultTestId.TOAST_CLOSE_BUTTON)}\n icon={CloseSmall}\n hideTooltip\n />\n )}\n </Text>\n </CSSTransition>\n );\n};\n\nexport default Toast;\n"],"names":["Toast","_ref","_ref$open","open","_ref$loading","loading","_ref$autoHideDuration","autoHideDuration","_ref$type","type","icon","_ref$hideIcon","hideIcon","deprecatedAction","action","actions","children","_ref$closeable","closeable","_ref$onClose","onClose","NOOP","className","id","_ref$closeButtonAriaL","closeButtonAriaLabel","dataTestId","ref","useRef","nodeRef","prevActions","usePrevious","length","toastLinks","useMemo","filter","map","_a","otherProps","__rest","React","createElement","ToastLink","key","href","styles","actionLink","shouldShowButtonTransition","undefined","toastButtons","index","content","ToastButton","Object","assign","concat","cx","actionButton","_defineProperty","withTransition","classNames","toast","getStyle","camelCase","handleClose","useCallback","timerAutoHide","setAutoHideTimer","duration","clearTimeout","current","setTimeout","useEffect","iconElement","getIcon","recalculateElementWidth","element","prevWidth","style","width","endWidth","getComputedStyle","CSSTransition","in","enterActive","exitActive","timeout","unmountOnExit","Text","getTestId","ComponentDefaultTestId","TOAST","color","role","Flex","align","gap","TOAST_CONTENT","textContent","Loader","size","IconButton","closeButton","onClick","kind","TOAST_CLOSE_BUTTON","CloseSmall","hideTooltip"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- var n={toast:"toast",typeNormal:"typeNormal",typePositive:"typePositive",typeNegative:"typeNegative",typeWarning:"typeWarning",closeButton:"closeButton",actionButton:"actionButton",actionLink:"actionLink",typeDark:"typeDark",icon:"icon",withTransition:"withTransition",bounceIn:"bounceIn",content:"content",textContent:"textContent",enterActive:"enterActive",slideIn:"slideIn",exitActive:"exitActive",slideOut:"slideOut"};!function(n){const t="s_id-da2ee7919891_4_5_8";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+t))return;const e=document.createElement("style");e.id=t,o.firstChild?o.insertBefore(e,o.firstChild):o.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".toast {\n box-shadow: var(--box-shadow-medium);\n -webkit-font-smoothing: var(--font-smoothing-webkit);\n -moz-osx-font-smoothing: var(--font-smoothing-moz);\n margin: var(--space-16);\n position: fixed;\n left: 50%;\n top: 0;\n margin-inline: auto;\n padding: var(--space-8);\n align-items: center;\n display: flex;\n min-width: 200px;\n width: auto;\n border-radius: var(--border-radius-small);\n color: var(--fixed-light-color);\n transform: translateX(-50%);\n transition: background-color 80ms cubic-bezier(0.6, 0, 0.4, 1), width 200ms cubic-bezier(0, 0, 0.4, 1);\n}\n.toast.typeNormal {\n background-color: var(--primary-color);\n}\n.toast.typePositive {\n background-color: var(--positive-color);\n}\n.toast.typeNegative {\n background-color: var(--negative-color);\n}\n.toast.typeWarning {\n background-color: var(--warning-color);\n color: var(--fixed-dark-color);\n}\n.toast.typeWarning .closeButton {\n color: var(--fixed-dark-color);\n}\n.toast.typeWarning .actionButton,\n.toast.typeWarning .actionLink {\n color: var(--fixed-dark-color);\n border-color: var(--fixed-dark-color);\n}\n.toast.typeDark {\n background-color: var(--inverted-color-background);\n color: var(--text-color-on-inverted);\n}\n.toast.typeDark .closeButton {\n color: var(--text-color-on-inverted);\n}\n.toast.typeDark .actionButton,\n.toast.typeDark .actionLink {\n color: var(--text-color-on-inverted);\n border-color: var(--text-color-on-inverted);\n}\n.icon {\n display: flex;\n margin-inline-start: var(--space-8);\n}\n.actionButton.withTransition {\n opacity: 0;\n animation: bounceIn 150ms cubic-bezier(0, 0, 0.4, 1);\n animation-delay: 300ms;\n animation-fill-mode: forwards;\n}\n.content {\n margin: 0 var(--space-8);\n flex: 1;\n}\n.textContent {\n display: inline-flex;\n flex-grow: 1;\n}\n.enterActive {\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n animation-name: slideIn;\n animation-duration: 350ms;\n animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.exitActive {\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n animation-name: slideOut;\n animation-duration: 350ms;\n animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.closeButton {\n margin-inline-start: var(--space-8);\n}\n@keyframes slideIn {\n 0% {\n transform: translate(-50%, -100px);\n }\n 40% {\n transform: translate(-50%, 16px);\n }\n 100% {\n transform: translate(-50%, 0px);\n }\n}\n@keyframes slideOut {\n 0% {\n transform: translate(-50%, 0);\n }\n 100% {\n transform: translate(-50%, -100px);\n opacity: 0;\n }\n}\n@keyframes bounceIn {\n 0% {\n transform: scale(0.8);\n opacity: 0;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}");export{n as default};
1
+ var n={toast:"toast",typeNormal:"typeNormal",typePositive:"typePositive",typeNegative:"typeNegative",typeWarning:"typeWarning",closeButton:"closeButton",actionButton:"actionButton",actionLink:"actionLink",typeDark:"typeDark",icon:"icon",withTransition:"withTransition",bounceIn:"bounceIn",content:"content",textContent:"textContent",enterActive:"enterActive",slideIn:"slideIn",exitActive:"exitActive",slideOut:"slideOut"};!function(n){const t="s_id-da2ee7919891_4_5_10";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+t))return;const e=document.createElement("style");e.id=t,o.firstChild?o.insertBefore(e,o.firstChild):o.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".toast {\n box-shadow: var(--box-shadow-medium);\n -webkit-font-smoothing: var(--font-smoothing-webkit);\n -moz-osx-font-smoothing: var(--font-smoothing-moz);\n margin: var(--space-16);\n position: fixed;\n left: 50%;\n top: 0;\n margin-inline: auto;\n padding: var(--space-8);\n align-items: center;\n display: flex;\n min-width: 200px;\n width: auto;\n border-radius: var(--border-radius-small);\n color: var(--fixed-light-color);\n transform: translateX(-50%);\n transition: background-color 80ms cubic-bezier(0.6, 0, 0.4, 1), width 200ms cubic-bezier(0, 0, 0.4, 1);\n}\n.toast.typeNormal {\n background-color: var(--primary-color);\n}\n.toast.typePositive {\n background-color: var(--positive-color);\n}\n.toast.typeNegative {\n background-color: var(--negative-color);\n}\n.toast.typeWarning {\n background-color: var(--warning-color);\n color: var(--fixed-dark-color);\n}\n.toast.typeWarning .closeButton {\n color: var(--fixed-dark-color);\n}\n.toast.typeWarning .actionButton,\n.toast.typeWarning .actionLink {\n color: var(--fixed-dark-color);\n border-color: var(--fixed-dark-color);\n}\n.toast.typeDark {\n background-color: var(--inverted-color-background);\n color: var(--text-color-on-inverted);\n}\n.toast.typeDark .closeButton {\n color: var(--text-color-on-inverted);\n}\n.toast.typeDark .actionButton,\n.toast.typeDark .actionLink {\n color: var(--text-color-on-inverted);\n border-color: var(--text-color-on-inverted);\n}\n.icon {\n display: flex;\n margin-inline-start: var(--space-8);\n}\n.actionButton.withTransition {\n opacity: 0;\n animation: bounceIn 150ms cubic-bezier(0, 0, 0.4, 1);\n animation-delay: 300ms;\n animation-fill-mode: forwards;\n}\n.content {\n margin: 0 var(--space-8);\n flex: 1;\n}\n.textContent {\n display: inline-flex;\n flex-grow: 1;\n}\n.enterActive {\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n animation-name: slideIn;\n animation-duration: 350ms;\n animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.exitActive {\n animation-iteration-count: 1;\n animation-fill-mode: forwards;\n animation-name: slideOut;\n animation-duration: 350ms;\n animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);\n}\n.closeButton {\n margin-inline-start: var(--space-8);\n}\n@keyframes slideIn {\n 0% {\n transform: translate(-50%, -100px);\n }\n 40% {\n transform: translate(-50%, 16px);\n }\n 100% {\n transform: translate(-50%, 0px);\n }\n}\n@keyframes slideOut {\n 0% {\n transform: translate(-50%, 0);\n }\n 100% {\n transform: translate(-50%, -100px);\n opacity: 0;\n }\n}\n@keyframes bounceIn {\n 0% {\n transform: scale(0.8);\n opacity: 0;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}");export{n as default};
2
2
  //# sourceMappingURL=Toast.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var e={actionLink:"actionLink"};!function(e){const t="s_id-a224471727c9_4_5_8";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".actionLink {\n color: var(--text-color-on-primary);\n -webkit-font-smoothing: auto;\n -moz-osx-font-smoothing: auto;\n}\n.actionLink:hover {\n color: inherit;\n}");export{e as default};
1
+ var e={actionLink:"actionLink"};!function(e){const t="s_id-a224471727c9_4_5_10";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".actionLink {\n color: var(--text-color-on-primary);\n -webkit-font-smoothing: auto;\n -moz-osx-font-smoothing: auto;\n}\n.actionLink:hover {\n color: inherit;\n}");export{e as default};
2
2
  //# sourceMappingURL=ToastLink.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var n={toggle:"toggle","focus-visible":"focus-visible",selected:"selected",notSelected:"notSelected",disabled:"disabled",medium:"medium",small:"small",noSpacing:"noSpacing"};!function(n){const e="s_id-5e47b8a7e8fd_4_5_8";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}('/* stylelint-disable */\n/* stylelint-enable */\n.toggle {\n border: none;\n margin: 0;\n padding: 0;\n width: auto;\n overflow: visible;\n background: transparent;\n /* inherit font & color from ancestor */\n color: inherit;\n font: inherit;\n /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */\n line-height: normal;\n /* Corrects font smoothing for webkit */\n -webkit-font-smoothing: inherit;\n -moz-osx-font-smoothing: inherit;\n /* Corrects inability to style clickable `input` types in iOS */\n appearance: none;\n transition: background-color var(--motion-productive-medium) var(--motion-timing-transition);\n margin: 0 var(--space-8);\n position: relative;\n height: var(--toggle-height);\n width: var(--toggle-width);\n cursor: pointer;\n border-radius: 100px !important;\n}\n.toggle:focus-visible, .toggle.focus-visible {\n outline: none;\n z-index: 11;\n border-radius: 4px;\n box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.toggle:focus:not(.focus-visible) {\n outline: none;\n}\n.toggle::after {\n background-color: var(--primary-background-color);\n content: " ";\n position: absolute;\n width: var(--circle-size);\n height: var(--circle-size);\n border-radius: 50%;\n top: calc(50% - 9px);\n transition: inset-inline-start var(--motion-productive-medium) var(--motion-timing-transition);\n}\n.toggle.selected {\n background-color: var(--primary-color);\n}\n.toggle.selected::after {\n inset-inline-start: 20px;\n}\n.toggle.notSelected {\n background-color: var(--ui-border-color);\n}\n.toggle.notSelected::after {\n inset-inline-start: 3px;\n}\n.toggle.disabled {\n opacity: var(--disabled-component-opacity);\n cursor: not-allowed;\n}\n.toggle.medium {\n --toggle-width: 41px;\n --toggle-height: 24px;\n}\n.toggle.medium::after {\n --circle-size: 18px;\n}\n.toggle.small {\n --toggle-width: 28px;\n --toggle-height: 16px;\n}\n.toggle.small::after {\n --circle-size: 12px;\n top: calc(50% - 6px);\n inset-inline-start: 14px;\n}\n.toggle.small.notSelected::after {\n inset-inline-start: 2px;\n}\n.toggle.noSpacing {\n margin: 0;\n}');export{n as default};
1
+ var n={toggle:"toggle","focus-visible":"focus-visible",selected:"selected",notSelected:"notSelected",disabled:"disabled",medium:"medium",small:"small",noSpacing:"noSpacing"};!function(n){const e="s_id-5e47b8a7e8fd_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}('/* stylelint-disable */\n/* stylelint-enable */\n.toggle {\n border: none;\n margin: 0;\n padding: 0;\n width: auto;\n overflow: visible;\n background: transparent;\n /* inherit font & color from ancestor */\n color: inherit;\n font: inherit;\n /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */\n line-height: normal;\n /* Corrects font smoothing for webkit */\n -webkit-font-smoothing: inherit;\n -moz-osx-font-smoothing: inherit;\n /* Corrects inability to style clickable `input` types in iOS */\n appearance: none;\n transition: background-color var(--motion-productive-medium) var(--motion-timing-transition);\n margin: 0 var(--space-8);\n position: relative;\n height: var(--toggle-height);\n width: var(--toggle-width);\n cursor: pointer;\n border-radius: 100px !important;\n}\n.toggle:focus-visible, .toggle.focus-visible {\n outline: none;\n z-index: 11;\n border-radius: 4px;\n box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.toggle:focus:not(.focus-visible) {\n outline: none;\n}\n.toggle::after {\n background-color: var(--primary-background-color);\n content: " ";\n position: absolute;\n width: var(--circle-size);\n height: var(--circle-size);\n border-radius: 50%;\n top: calc(50% - 9px);\n transition: inset-inline-start var(--motion-productive-medium) var(--motion-timing-transition);\n}\n.toggle.selected {\n background-color: var(--primary-color);\n}\n.toggle.selected::after {\n inset-inline-start: 20px;\n}\n.toggle.notSelected {\n background-color: var(--ui-border-color);\n}\n.toggle.notSelected::after {\n inset-inline-start: 3px;\n}\n.toggle.disabled {\n opacity: var(--disabled-component-opacity);\n cursor: not-allowed;\n}\n.toggle.medium {\n --toggle-width: 41px;\n --toggle-height: 24px;\n}\n.toggle.medium::after {\n --circle-size: 18px;\n}\n.toggle.small {\n --toggle-width: 28px;\n --toggle-height: 16px;\n}\n.toggle.small::after {\n --circle-size: 12px;\n top: calc(50% - 6px);\n inset-inline-start: 14px;\n}\n.toggle.small.notSelected::after {\n inset-inline-start: 2px;\n}\n.toggle.noSpacing {\n margin: 0;\n}');export{n as default};
2
2
  //# sourceMappingURL=MockToggle.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var e={toggleInput:"toggleInput","focus-visible":"focus-visible",toggleFocusTarget:"toggleFocusTarget",wrapper:"wrapper"};!function(e){const t="s_id-679f544f6e7c_4_5_8";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,l.firstChild?l.insertBefore(n,l.firstChild):l.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n.toggleInput:focus-visible, .toggleInput.focus-visible { /* stylelint-disable-line selector-class-pattern */ }\n.toggleInput:focus-visible ~ .toggleFocusTarget, .toggleInput.focus-visible ~ .toggleFocusTarget {\n outline: none;\n z-index: 11;\n border-radius: 4px;\n box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.wrapper {\n display: flex;\n align-items: center;\n}");export{e as default};
1
+ var e={toggleInput:"toggleInput","focus-visible":"focus-visible",toggleFocusTarget:"toggleFocusTarget",wrapper:"wrapper"};!function(e){const t="s_id-679f544f6e7c_4_5_10";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,l.firstChild?l.insertBefore(n,l.firstChild):l.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n.toggleInput:focus-visible, .toggleInput.focus-visible { /* stylelint-disable-line selector-class-pattern */ }\n.toggleInput:focus-visible ~ .toggleFocusTarget, .toggleInput.focus-visible ~ .toggleFocusTarget {\n outline: none;\n z-index: 11;\n border-radius: 4px;\n box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.wrapper {\n display: flex;\n align-items: center;\n}");export{e as default};
2
2
  //# sourceMappingURL=Toggle.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var e={text:"text",disabled:"disabled"};!function(e){const t="s_id-1dee71639eb3_4_5_8";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".text {\n color: var(--primary-text-color);\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n}\n\n.disabled {\n color: var(--disabled-text-color);\n}");export{e as default};
1
+ var e={text:"text",disabled:"disabled"};!function(e){const t="s_id-1dee71639eb3_4_5_10";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".text {\n color: var(--primary-text-color);\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n}\n\n.disabled {\n color: var(--disabled-text-color);\n}");export{e as default};
2
2
  //# sourceMappingURL=ToggleText.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var e={slideshow:"slideshow"};!function(e){const t="s_id-1d828e3be878_4_5_8";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".slideshow {\n width: 100%;\n height: 100%;\n min-height: 0;\n}");export{e as default};
1
+ var e={slideshow:"slideshow"};!function(e){const t="s_id-1d828e3be878_4_5_10";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".slideshow {\n width: 100%;\n height: 100%;\n min-height: 0;\n}");export{e as default};
2
2
  //# sourceMappingURL=TransitionView.module.scss.js.map
@@ -1,2 +1,2 @@
1
- import{slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e,{forwardRef as t,useState as o,useRef as n,useCallback as i,useMemo as l,useEffect as u}from"react";import s from"classnames";import{VariableSizeGrid as c}from"react-window";import a from"react-virtualized-auto-sizer";import{getNormalizedItems as d,getOnItemsRenderedData as m,isLayoutDirectionScrollbarVisible as f}from"../../services/virtualized-service.js";import v from"../../hooks/usePrevious/index.js";import h from"../../hooks/useThrottledCallback.js";import{useMergeRef as I,NOOP as p}from"@vibe/shared";import{getTestId as g,ComponentDefaultTestId as w}from"../../tests/testIds.js";import x from"./VirtualizedGrid.module.scss.js";var R=t((function(t,R){var T=t.className,b=t.id,S=t.items,C=void 0===S?[]:S,z=t.itemRenderer,N=t.getRowHeight,j=void 0===N?function(){return 50}:N,M=t.getColumnWidth,E=void 0===M?function(){return 100}:M,V=t.getItemId,W=void 0===V?function(r,e){return r.id}:V,k=t.onScroll,y=t.scrollToId,A=void 0===y?null:y,D=t.onScrollToFinished,G=void 0===D?p:D,H=t.onItemsRendered,O=void 0===H?null:H,U=t.onItemsRenderedThrottleMs,_=void 0===U?200:U,F=t.onSizeUpdate,P=void 0===F?p:F,q=t.onVerticalScrollbarVisiblityChange,B=void 0===q?null:q,L=t.scrollableClassName,Z=t["data-testid"],J=o(0),K=r(J,2),Q=K[0],X=K[1],Y=o(0),$=r(Y,2),rr=$[0],er=$[1],tr=v(A),or=n(null),nr=n(null),ir=n(null),lr=n(0),ur=n({scrollOffsetInitial:0,scrollOffsetFinal:0,animationStartTime:0}),sr=I(R,or),cr=ur.current,ar=i((function(r){var e=j();return e&&!Number.isNaN(e)||console.error("Couldn't get height for item: ",r),e}),[j]),dr=i((function(r,e){var t=W(r,e);return void 0===t&&console.error("Couldn't get id for item: ",r),t}),[W]),mr=l((function(){return d(C,dr,ar)}),[C,dr,ar]),fr=l((function(){return Math.min(C.length,Math.floor(rr/E()))}),[C,rr,E]),vr=l((function(){return fr>0?Math.ceil(C.length/fr):0}),[C,fr]),hr=l((function(){return A%fr}),[A,fr]),Ir=l((function(){return Math.floor(A/fr)}),[A,fr]),pr=i((function(r){var e=r.horizontalScrollDirection,t=r.scrollTop,o=r.scrollUpdateWasRequested;lr.current=t,o||(cr.scrollOffsetInitial=t),k&&k(e,t,o)}),[k,lr,cr]),gr=i((function(r){var e=r.rowIndex*fr+r.columnIndex;return z(C[e],e,r.style)}),[C,z,fr]),wr=i((function(r,e){e===Q&&r===rr||setTimeout((function(){X(e),er(r),P(r,e)}),0)}),[Q,rr,P]),xr=h((function(r){if(O){var e=m(C,mr,dr,r.visibleRowStartIndex,r.visibleRowStopIndex,Q,lr.current);O(e)}}),{wait:_,trailing:!0},[O,C,mr,dr,Q]);return u((function(){A&&tr!==A&&(ir.current.scrollToItem({align:"center",columnIndex:hr,rowIndex:Ir}),G())}),[A,tr,ir,hr,Ir,G]),u((function(){ir.current&&ir.current.resetAfterIndices({columnIndex:0,rowIndex:0})}),[mr]),u((function(){if(B){var r=f(C,mr,dr,Q);nr.current!==r&&(nr.current=r,B(r))}}),[B,C,mr,Q,dr]),e.createElement("div",{ref:sr,className:s(x.virtualizedGridWrapper,T),id:b,"data-testid":Z||g(w.VIRTUALIZED_GRID,b)},e.createElement(a,null,(function(r){var t=r.height,o=r.width;return wr(o,t),e.createElement(c,{ref:ir,height:t,width:o,columnWidth:E,columnCount:fr,rowHeight:j,rowCount:vr,onScroll:pr,onItemsRendered:xr,className:L},gr)})))}));export{R as default};
1
+ import{slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e,{forwardRef as t,useState as o,useRef as n,useCallback as i,useMemo as l,useEffect as u}from"react";import c from"classnames";import{VariableSizeGrid as a}from"react-window";import s from"react-virtualized-auto-sizer";import{getNormalizedItems as d,getOnItemsRenderedData as m,isLayoutDirectionScrollbarVisible as f}from"../../services/virtualized-service.js";import{usePrevious as v}from"@vibe/hooks";import h from"../../hooks/useThrottledCallback.js";import{useMergeRef as I,NOOP as p}from"@vibe/shared";import{getTestId as g,ComponentDefaultTestId as w}from"../../tests/testIds.js";import b from"./VirtualizedGrid.module.scss.js";var R=t((function(t,R){var T=t.className,x=t.id,S=t.items,C=void 0===S?[]:S,z=t.itemRenderer,N=t.getRowHeight,j=void 0===N?function(){return 50}:N,M=t.getColumnWidth,E=void 0===M?function(){return 100}:M,V=t.getItemId,W=void 0===V?function(r,e){return r.id}:V,k=t.onScroll,y=t.scrollToId,A=void 0===y?null:y,D=t.onScrollToFinished,G=void 0===D?p:D,H=t.onItemsRendered,O=void 0===H?null:H,U=t.onItemsRenderedThrottleMs,_=void 0===U?200:U,F=t.onSizeUpdate,q=void 0===F?p:F,B=t.onVerticalScrollbarVisiblityChange,L=void 0===B?null:B,P=t.scrollableClassName,Z=t["data-testid"],J=o(0),K=r(J,2),Q=K[0],X=K[1],Y=o(0),$=r(Y,2),rr=$[0],er=$[1],tr=v(A),or=n(null),nr=n(null),ir=n(null),lr=n(0),ur=n({scrollOffsetInitial:0,scrollOffsetFinal:0,animationStartTime:0}),cr=I(R,or),ar=ur.current,sr=i((function(r){var e=j();return e&&!Number.isNaN(e)||console.error("Couldn't get height for item: ",r),e}),[j]),dr=i((function(r,e){var t=W(r,e);return void 0===t&&console.error("Couldn't get id for item: ",r),t}),[W]),mr=l((function(){return d(C,dr,sr)}),[C,dr,sr]),fr=l((function(){return Math.min(C.length,Math.floor(rr/E()))}),[C,rr,E]),vr=l((function(){return fr>0?Math.ceil(C.length/fr):0}),[C,fr]),hr=l((function(){return A%fr}),[A,fr]),Ir=l((function(){return Math.floor(A/fr)}),[A,fr]),pr=i((function(r){var e=r.horizontalScrollDirection,t=r.scrollTop,o=r.scrollUpdateWasRequested;lr.current=t,o||(ar.scrollOffsetInitial=t),k&&k(e,t,o)}),[k,lr,ar]),gr=i((function(r){var e=r.rowIndex*fr+r.columnIndex;return z(C[e],e,r.style)}),[C,z,fr]),wr=i((function(r,e){e===Q&&r===rr||setTimeout((function(){X(e),er(r),q(r,e)}),0)}),[Q,rr,q]),br=h((function(r){if(O){var e=m(C,mr,dr,r.visibleRowStartIndex,r.visibleRowStopIndex,Q,lr.current);O(e)}}),{wait:_,trailing:!0},[O,C,mr,dr,Q]);return u((function(){A&&tr!==A&&(ir.current.scrollToItem({align:"center",columnIndex:hr,rowIndex:Ir}),G())}),[A,tr,ir,hr,Ir,G]),u((function(){ir.current&&ir.current.resetAfterIndices({columnIndex:0,rowIndex:0})}),[mr]),u((function(){if(L){var r=f(C,mr,dr,Q);nr.current!==r&&(nr.current=r,L(r))}}),[L,C,mr,Q,dr]),e.createElement("div",{ref:cr,className:c(b.virtualizedGridWrapper,T),id:x,"data-testid":Z||g(w.VIRTUALIZED_GRID,x)},e.createElement(s,null,(function(r){var t=r.height,o=r.width;return wr(o,t),e.createElement(a,{ref:ir,height:t,width:o,columnWidth:E,columnCount:fr,rowHeight:j,rowCount:vr,onScroll:pr,onItemsRendered:br,className:P},gr)})))}));export{R as default};
2
2
  //# sourceMappingURL=VirtualizedGrid.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"VirtualizedGrid.js","sources":["../../../../../src/components/VirtualizedGrid/VirtualizedGrid.tsx"],"sourcesContent":["import React, {\n type CSSProperties,\n type ReactElement,\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport cx from \"classnames\";\nimport {\n type GridChildComponentProps,\n type GridOnScrollProps,\n type ScrollDirection,\n VariableSizeGrid as Grid,\n type GridOnItemsRenderedProps\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport {\n getNormalizedItems,\n getOnItemsRenderedData,\n isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport { useMergeRef, NOOP } from \"@vibe/shared\";\nimport { type VibeComponentProps } from \"../../types\";\n\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./VirtualizedGrid.module.scss\";\nimport { type VirtualizedGridItemType as ItemType } from \"./VirtualizedGrid.types\";\n\nexport interface VirtualizedGridProps extends VibeComponentProps {\n /**\n * The list of items to be rendered in the grid.\n */\n items: ItemType[];\n /**\n * Function that renders each item in the grid.\n */\n itemRenderer: (item: ItemType, index: number, style: CSSProperties) => ReactElement;\n /**\n * Function that returns the row height.\n */\n getRowHeight: () => number;\n /**\n * Function that returns the column width.\n */\n getColumnWidth: () => number;\n /**\n * Function that returns the unique ID of an item.\n */\n getItemId?: (item: ItemType, index: number) => string;\n /**\n * The index of the item to scroll to.\n */\n scrollToId?: number;\n /**\n * Callback fired when the grid is scrolled.\n */\n onScroll?: (horizontalScrollDirection: ScrollDirection, scrollTop: number, scrollUpdateWasRequested: boolean) => void;\n /**\n * Callback fired when scrolling has finished.\n */\n onScrollToFinished?: () => void;\n /**\n * Callback fired when items are rendered in the grid.\n */\n onItemsRendered?: ({\n firstItemId,\n secondItemId,\n lastItemId,\n centerItemId,\n firstItemOffsetEnd,\n currentOffsetTop\n }: {\n firstItemId: string;\n secondItemId: string;\n lastItemId: string;\n centerItemId: string;\n firstItemOffsetEnd: number;\n currentOffsetTop: number;\n }) => void;\n /**\n * The delay (in ms) for throttling the `onItemsRendered` callback.\n */\n onItemsRenderedThrottleMs?: number;\n /**\n * Callback fired when the grid size is updated.\n */\n onSizeUpdate?: (width: number, height: number) => void;\n /**\n * Callback fired when the vertical scrollbar visibility changes.\n */\n onVerticalScrollbarVisiblityChange?: (value: boolean) => void;\n /**\n * Class name applied to the scrollable container.\n */\n scrollableClassName?: string;\n}\n\nconst VirtualizedGrid = forwardRef(\n (\n {\n className,\n id,\n items = [],\n itemRenderer,\n getRowHeight = () => 50,\n getColumnWidth = () => 100,\n getItemId = (item: ItemType, _index: number) => item.id,\n onScroll,\n scrollToId = null,\n onScrollToFinished = NOOP,\n onItemsRendered = null,\n onItemsRenderedThrottleMs = 200,\n onSizeUpdate = NOOP,\n onVerticalScrollbarVisiblityChange = null,\n scrollableClassName,\n \"data-testid\": dataTestId\n }: VirtualizedGridProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n // states\n const [gridHeight, setGridHeight] = useState(0);\n const [gridWidth, setGridWidth] = useState(0);\n\n // prevs\n const prevScrollToId = usePrevious(scrollToId);\n\n // Refs\n const componentRef = useRef(null);\n const isVerticalScrollbarVisibleRef = useRef(null);\n const gridRef = useRef(null);\n const scrollTopRef = useRef(0);\n const animationDataRef = useRef({\n scrollOffsetInitial: 0,\n scrollOffsetFinal: 0,\n animationStartTime: 0\n });\n const mergedRef = useMergeRef(ref, componentRef);\n\n const animationData = animationDataRef.current;\n\n // Callbacks\n const heightGetter = useCallback(\n (item: ItemType) => {\n const height = getRowHeight();\n if (!height || Number.isNaN(height)) {\n console.error(\"Couldn't get height for item: \", item);\n }\n return height;\n },\n [getRowHeight]\n );\n\n const idGetter = useCallback(\n (item: ItemType, index: number) => {\n const itemId = getItemId(item, index);\n if (itemId === undefined) {\n console.error(\"Couldn't get id for item: \", item);\n }\n return itemId;\n },\n [getItemId]\n );\n\n // Memos\n // Creates object of itemId => { item, index, height, offsetTop}\n const normalizedItems = useMemo(() => {\n return getNormalizedItems(items, idGetter, heightGetter);\n }, [items, idGetter, heightGetter]);\n\n const calcColumnCount = useMemo(() => {\n return Math.min(items.length, Math.floor(gridWidth / getColumnWidth()));\n }, [items, gridWidth, getColumnWidth]);\n\n const calcRowCount = useMemo(() => {\n return calcColumnCount > 0 ? Math.ceil(items.length / calcColumnCount) : 0;\n }, [items, calcColumnCount]);\n\n const scrollToColumnIndex = useMemo(() => {\n return scrollToId % calcColumnCount;\n }, [scrollToId, calcColumnCount]);\n\n const scrollToRowIndex = useMemo(() => {\n return Math.floor(scrollToId / calcColumnCount);\n }, [scrollToId, calcColumnCount]);\n\n // Callbacks\n const onScrollCB = useCallback(\n ({ horizontalScrollDirection, scrollTop, scrollUpdateWasRequested }: GridOnScrollProps) => {\n scrollTopRef.current = scrollTop;\n if (!scrollUpdateWasRequested) {\n animationData.scrollOffsetInitial = scrollTop;\n }\n onScroll && onScroll(horizontalScrollDirection, scrollTop, scrollUpdateWasRequested);\n },\n [onScroll, scrollTopRef, animationData]\n );\n\n const cellRenderer = useCallback(\n ({ columnIndex, rowIndex, style }: { columnIndex: number; rowIndex: number; style: CSSProperties }) => {\n const index = rowIndex * calcColumnCount + columnIndex;\n const item = items[index];\n return itemRenderer(item, index, style);\n },\n [items, itemRenderer, calcColumnCount]\n );\n\n const updateGridSize = useCallback(\n (width: number, height: number) => {\n if (height !== gridHeight || width !== gridWidth) {\n setTimeout(() => {\n setGridHeight(height);\n setGridWidth(width);\n onSizeUpdate(width, height);\n }, 0);\n }\n },\n [gridHeight, gridWidth, onSizeUpdate]\n );\n\n const onItemsRenderedCB = useThrottledCallback(\n ({ visibleRowStartIndex, visibleRowStopIndex }: GridOnItemsRenderedProps) => {\n if (!onItemsRendered) return;\n const data = getOnItemsRenderedData(\n items,\n normalizedItems,\n idGetter,\n visibleRowStartIndex,\n visibleRowStopIndex,\n gridHeight,\n scrollTopRef.current\n );\n onItemsRendered(data);\n },\n { wait: onItemsRenderedThrottleMs, trailing: true },\n [onItemsRendered, items, normalizedItems, idGetter, gridHeight]\n );\n\n // Effects\n useEffect(() => {\n // scroll to specific item\n if (scrollToId && prevScrollToId !== scrollToId) {\n gridRef.current.scrollToItem({\n align: \"center\",\n columnIndex: scrollToColumnIndex,\n rowIndex: scrollToRowIndex\n });\n onScrollToFinished();\n }\n }, [scrollToId, prevScrollToId, gridRef, scrollToColumnIndex, scrollToRowIndex, onScrollToFinished]);\n\n useEffect(() => {\n // recalculate row heights\n if (gridRef.current) {\n gridRef.current.resetAfterIndices({ columnIndex: 0, rowIndex: 0 });\n }\n }, [normalizedItems]);\n\n useEffect(() => {\n // update vertical scrollbar visibility\n if (onVerticalScrollbarVisiblityChange) {\n const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, gridHeight);\n if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n isVerticalScrollbarVisibleRef.current = isVisible;\n onVerticalScrollbarVisiblityChange(isVisible);\n }\n }\n }, [onVerticalScrollbarVisiblityChange, items, normalizedItems, gridHeight, idGetter]);\n\n return (\n <div\n ref={mergedRef}\n className={cx(styles.virtualizedGridWrapper, className)}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_GRID, id)}\n >\n <AutoSizer>\n {({ height, width }: { height: number; width: number }) => {\n updateGridSize(width, height);\n return (\n <Grid\n ref={gridRef}\n height={height}\n width={width}\n columnWidth={getColumnWidth}\n columnCount={calcColumnCount}\n rowHeight={getRowHeight}\n rowCount={calcRowCount}\n onScroll={onScrollCB}\n onItemsRendered={onItemsRenderedCB}\n className={scrollableClassName}\n >\n {cellRenderer as unknown as React.ComponentType<GridChildComponentProps>}\n </Grid>\n );\n }}\n </AutoSizer>\n </div>\n );\n }\n);\n\nexport default VirtualizedGrid;\n"],"names":["VirtualizedGrid","forwardRef","_ref","ref","className","id","_ref$items","items","itemRenderer","_ref$getRowHeight","getRowHeight","_ref$getColumnWidth","getColumnWidth","_ref$getItemId","getItemId","item","_index","onScroll","_ref$scrollToId","scrollToId","_ref$onScrollToFinish","onScrollToFinished","NOOP","_ref$onItemsRendered","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onVerticalScroll","onVerticalScrollbarVisiblityChange","scrollableClassName","dataTestId","_useState","useState","_useState2","_slicedToArray","gridHeight","setGridHeight","_useState3","_useState4","gridWidth","setGridWidth","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","gridRef","scrollTopRef","animationDataRef","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","animationData","current","heightGetter","useCallback","height","Number","isNaN","console","error","idGetter","index","itemId","undefined","normalizedItems","useMemo","getNormalizedItems","calcColumnCount","Math","min","length","floor","calcRowCount","ceil","scrollToColumnIndex","scrollToRowIndex","onScrollCB","_ref2","horizontalScrollDirection","scrollTop","scrollUpdateWasRequested","cellRenderer","_ref3","rowIndex","columnIndex","style","updateGridSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleRowStartIndex","visibleRowStopIndex","wait","trailing","useEffect","scrollToItem","align","resetAfterIndices","isVisible","isLayoutDirectionScrollbarVisible","React","createElement","cx","styles","virtualizedGridWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_GRID","AutoSizer","_ref5","Grid","columnWidth","columnCount","rowHeight","rowCount"],"mappings":"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"}
1
+ {"version":3,"file":"VirtualizedGrid.js","sources":["../../../../../src/components/VirtualizedGrid/VirtualizedGrid.tsx"],"sourcesContent":["import React, {\n type CSSProperties,\n type ReactElement,\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport cx from \"classnames\";\nimport {\n type GridChildComponentProps,\n type GridOnScrollProps,\n type ScrollDirection,\n VariableSizeGrid as Grid,\n type GridOnItemsRenderedProps\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport {\n getNormalizedItems,\n getOnItemsRenderedData,\n isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport { usePrevious } from \"@vibe/hooks\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport { useMergeRef, NOOP } from \"@vibe/shared\";\nimport { type VibeComponentProps } from \"../../types\";\n\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./VirtualizedGrid.module.scss\";\nimport { type VirtualizedGridItemType as ItemType } from \"./VirtualizedGrid.types\";\n\nexport interface VirtualizedGridProps extends VibeComponentProps {\n /**\n * The list of items to be rendered in the grid.\n */\n items: ItemType[];\n /**\n * Function that renders each item in the grid.\n */\n itemRenderer: (item: ItemType, index: number, style: CSSProperties) => ReactElement;\n /**\n * Function that returns the row height.\n */\n getRowHeight: () => number;\n /**\n * Function that returns the column width.\n */\n getColumnWidth: () => number;\n /**\n * Function that returns the unique ID of an item.\n */\n getItemId?: (item: ItemType, index: number) => string;\n /**\n * The index of the item to scroll to.\n */\n scrollToId?: number;\n /**\n * Callback fired when the grid is scrolled.\n */\n onScroll?: (horizontalScrollDirection: ScrollDirection, scrollTop: number, scrollUpdateWasRequested: boolean) => void;\n /**\n * Callback fired when scrolling has finished.\n */\n onScrollToFinished?: () => void;\n /**\n * Callback fired when items are rendered in the grid.\n */\n onItemsRendered?: ({\n firstItemId,\n secondItemId,\n lastItemId,\n centerItemId,\n firstItemOffsetEnd,\n currentOffsetTop\n }: {\n firstItemId: string;\n secondItemId: string;\n lastItemId: string;\n centerItemId: string;\n firstItemOffsetEnd: number;\n currentOffsetTop: number;\n }) => void;\n /**\n * The delay (in ms) for throttling the `onItemsRendered` callback.\n */\n onItemsRenderedThrottleMs?: number;\n /**\n * Callback fired when the grid size is updated.\n */\n onSizeUpdate?: (width: number, height: number) => void;\n /**\n * Callback fired when the vertical scrollbar visibility changes.\n */\n onVerticalScrollbarVisiblityChange?: (value: boolean) => void;\n /**\n * Class name applied to the scrollable container.\n */\n scrollableClassName?: string;\n}\n\nconst VirtualizedGrid = forwardRef(\n (\n {\n className,\n id,\n items = [],\n itemRenderer,\n getRowHeight = () => 50,\n getColumnWidth = () => 100,\n getItemId = (item: ItemType, _index: number) => item.id,\n onScroll,\n scrollToId = null,\n onScrollToFinished = NOOP,\n onItemsRendered = null,\n onItemsRenderedThrottleMs = 200,\n onSizeUpdate = NOOP,\n onVerticalScrollbarVisiblityChange = null,\n scrollableClassName,\n \"data-testid\": dataTestId\n }: VirtualizedGridProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n // states\n const [gridHeight, setGridHeight] = useState(0);\n const [gridWidth, setGridWidth] = useState(0);\n\n // prevs\n const prevScrollToId = usePrevious(scrollToId);\n\n // Refs\n const componentRef = useRef(null);\n const isVerticalScrollbarVisibleRef = useRef(null);\n const gridRef = useRef(null);\n const scrollTopRef = useRef(0);\n const animationDataRef = useRef({\n scrollOffsetInitial: 0,\n scrollOffsetFinal: 0,\n animationStartTime: 0\n });\n const mergedRef = useMergeRef(ref, componentRef);\n\n const animationData = animationDataRef.current;\n\n // Callbacks\n const heightGetter = useCallback(\n (item: ItemType) => {\n const height = getRowHeight();\n if (!height || Number.isNaN(height)) {\n console.error(\"Couldn't get height for item: \", item);\n }\n return height;\n },\n [getRowHeight]\n );\n\n const idGetter = useCallback(\n (item: ItemType, index: number) => {\n const itemId = getItemId(item, index);\n if (itemId === undefined) {\n console.error(\"Couldn't get id for item: \", item);\n }\n return itemId;\n },\n [getItemId]\n );\n\n // Memos\n // Creates object of itemId => { item, index, height, offsetTop}\n const normalizedItems = useMemo(() => {\n return getNormalizedItems(items, idGetter, heightGetter);\n }, [items, idGetter, heightGetter]);\n\n const calcColumnCount = useMemo(() => {\n return Math.min(items.length, Math.floor(gridWidth / getColumnWidth()));\n }, [items, gridWidth, getColumnWidth]);\n\n const calcRowCount = useMemo(() => {\n return calcColumnCount > 0 ? Math.ceil(items.length / calcColumnCount) : 0;\n }, [items, calcColumnCount]);\n\n const scrollToColumnIndex = useMemo(() => {\n return scrollToId % calcColumnCount;\n }, [scrollToId, calcColumnCount]);\n\n const scrollToRowIndex = useMemo(() => {\n return Math.floor(scrollToId / calcColumnCount);\n }, [scrollToId, calcColumnCount]);\n\n // Callbacks\n const onScrollCB = useCallback(\n ({ horizontalScrollDirection, scrollTop, scrollUpdateWasRequested }: GridOnScrollProps) => {\n scrollTopRef.current = scrollTop;\n if (!scrollUpdateWasRequested) {\n animationData.scrollOffsetInitial = scrollTop;\n }\n onScroll && onScroll(horizontalScrollDirection, scrollTop, scrollUpdateWasRequested);\n },\n [onScroll, scrollTopRef, animationData]\n );\n\n const cellRenderer = useCallback(\n ({ columnIndex, rowIndex, style }: { columnIndex: number; rowIndex: number; style: CSSProperties }) => {\n const index = rowIndex * calcColumnCount + columnIndex;\n const item = items[index];\n return itemRenderer(item, index, style);\n },\n [items, itemRenderer, calcColumnCount]\n );\n\n const updateGridSize = useCallback(\n (width: number, height: number) => {\n if (height !== gridHeight || width !== gridWidth) {\n setTimeout(() => {\n setGridHeight(height);\n setGridWidth(width);\n onSizeUpdate(width, height);\n }, 0);\n }\n },\n [gridHeight, gridWidth, onSizeUpdate]\n );\n\n const onItemsRenderedCB = useThrottledCallback(\n ({ visibleRowStartIndex, visibleRowStopIndex }: GridOnItemsRenderedProps) => {\n if (!onItemsRendered) return;\n const data = getOnItemsRenderedData(\n items,\n normalizedItems,\n idGetter,\n visibleRowStartIndex,\n visibleRowStopIndex,\n gridHeight,\n scrollTopRef.current\n );\n onItemsRendered(data);\n },\n { wait: onItemsRenderedThrottleMs, trailing: true },\n [onItemsRendered, items, normalizedItems, idGetter, gridHeight]\n );\n\n // Effects\n useEffect(() => {\n // scroll to specific item\n if (scrollToId && prevScrollToId !== scrollToId) {\n gridRef.current.scrollToItem({\n align: \"center\",\n columnIndex: scrollToColumnIndex,\n rowIndex: scrollToRowIndex\n });\n onScrollToFinished();\n }\n }, [scrollToId, prevScrollToId, gridRef, scrollToColumnIndex, scrollToRowIndex, onScrollToFinished]);\n\n useEffect(() => {\n // recalculate row heights\n if (gridRef.current) {\n gridRef.current.resetAfterIndices({ columnIndex: 0, rowIndex: 0 });\n }\n }, [normalizedItems]);\n\n useEffect(() => {\n // update vertical scrollbar visibility\n if (onVerticalScrollbarVisiblityChange) {\n const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, gridHeight);\n if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n isVerticalScrollbarVisibleRef.current = isVisible;\n onVerticalScrollbarVisiblityChange(isVisible);\n }\n }\n }, [onVerticalScrollbarVisiblityChange, items, normalizedItems, gridHeight, idGetter]);\n\n return (\n <div\n ref={mergedRef}\n className={cx(styles.virtualizedGridWrapper, className)}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_GRID, id)}\n >\n <AutoSizer>\n {({ height, width }: { height: number; width: number }) => {\n updateGridSize(width, height);\n return (\n <Grid\n ref={gridRef}\n height={height}\n width={width}\n columnWidth={getColumnWidth}\n columnCount={calcColumnCount}\n rowHeight={getRowHeight}\n rowCount={calcRowCount}\n onScroll={onScrollCB}\n onItemsRendered={onItemsRenderedCB}\n className={scrollableClassName}\n >\n {cellRenderer as unknown as React.ComponentType<GridChildComponentProps>}\n </Grid>\n );\n }}\n </AutoSizer>\n </div>\n );\n }\n);\n\nexport default VirtualizedGrid;\n"],"names":["VirtualizedGrid","forwardRef","_ref","ref","className","id","_ref$items","items","itemRenderer","_ref$getRowHeight","getRowHeight","_ref$getColumnWidth","getColumnWidth","_ref$getItemId","getItemId","item","_index","onScroll","_ref$scrollToId","scrollToId","_ref$onScrollToFinish","onScrollToFinished","NOOP","_ref$onItemsRendered","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onVerticalScroll","onVerticalScrollbarVisiblityChange","scrollableClassName","dataTestId","_useState","useState","_useState2","_slicedToArray","gridHeight","setGridHeight","_useState3","_useState4","gridWidth","setGridWidth","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","gridRef","scrollTopRef","animationDataRef","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","animationData","current","heightGetter","useCallback","height","Number","isNaN","console","error","idGetter","index","itemId","undefined","normalizedItems","useMemo","getNormalizedItems","calcColumnCount","Math","min","length","floor","calcRowCount","ceil","scrollToColumnIndex","scrollToRowIndex","onScrollCB","_ref2","horizontalScrollDirection","scrollTop","scrollUpdateWasRequested","cellRenderer","_ref3","rowIndex","columnIndex","style","updateGridSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleRowStartIndex","visibleRowStopIndex","wait","trailing","useEffect","scrollToItem","align","resetAfterIndices","isVisible","isLayoutDirectionScrollbarVisible","React","createElement","cx","styles","virtualizedGridWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_GRID","AutoSizer","_ref5","Grid","columnWidth","columnCount","rowHeight","rowCount"],"mappings":"itBAsGMA,IAAAA,EAAkBC,GACtB,SAAAC,EAmBEC,GACE,IAlBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EACVE,EAAYN,EAAZM,aAAYC,EAAAP,EACZQ,aAAAA,OAAe,IAAHD,EAAG,WAAA,OAAM,EAAE,EAAAA,EAAAE,EAAAT,EACvBU,eAAAA,OAAiB,IAAHD,EAAG,WAAA,OAAM,GAAG,EAAAA,EAAAE,EAAAX,EAC1BY,UAAAA,OAAS,IAAAD,EAAG,SAACE,EAAgBC,GAAc,OAAKD,EAAKV,EAAE,EAAAQ,EACvDI,EAAQf,EAARe,SAAQC,EAAAhB,EACRiB,WAAAA,OAAa,IAAHD,EAAG,KAAIA,EAAAE,EAAAlB,EACjBmB,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EAAAG,EAAArB,EACzBsB,gBAAAA,OAAkB,IAAHD,EAAG,KAAIA,EAAAE,EAAAvB,EACtBwB,0BAAAA,OAA4B,IAAHD,EAAG,IAAGA,EAAAE,EAAAzB,EAC/B0B,aAAAA,OAAeN,IAAHK,EAAGL,EAAIK,EAAAE,EAAA3B,EACnB4B,mCAAAA,OAAqC,IAAHD,EAAG,KAAIA,EACzCE,EAAmB7B,EAAnB6B,oBACeC,EAAU9B,EAAzB,eAKF+B,EAAoCC,EAAS,GAAEC,EAAAC,EAAAH,EAAA,GAAxCI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAChCI,EAAkCL,EAAS,GAAEM,EAAAJ,EAAAG,EAAA,GAAtCE,GAASD,EAAA,GAAEE,GAAYF,EAAA,GAGxBG,GAAiBC,EAAYzB,GAG7B0B,GAAeC,EAAO,MACtBC,GAAgCD,EAAO,MACvCE,GAAUF,EAAO,MACjBG,GAAeH,EAAO,GACtBI,GAAmBJ,EAAO,CAC9BK,oBAAqB,EACrBC,kBAAmB,EACnBC,mBAAoB,IAEhBC,GAAYC,EAAYpD,EAAK0C,IAE7BW,GAAgBN,GAAiBO,QAGjCC,GAAeC,GACnB,SAAC5C,GACC,IAAM6C,EAASlD,IAIf,OAHKkD,IAAUC,OAAOC,MAAMF,IAC1BG,QAAQC,MAAM,iCAAkCjD,GAE3C6C,CACT,GACA,CAAClD,IAGGuD,GAAWN,GACf,SAAC5C,EAAgBmD,GACf,IAAMC,EAASrD,EAAUC,EAAMmD,GAI/B,YAHeE,IAAXD,GACFJ,QAAQC,MAAM,6BAA8BjD,GAEvCoD,CACT,GACA,CAACrD,IAKGuD,GAAkBC,GAAQ,WAC9B,OAAOC,EAAmBhE,EAAO0D,GAAUP,GAC5C,GAAE,CAACnD,EAAO0D,GAAUP,KAEfc,GAAkBF,GAAQ,WAC9B,OAAOG,KAAKC,IAAInE,EAAMoE,OAAQF,KAAKG,MAAMnC,GAAY7B,KACtD,GAAE,CAACL,EAAOkC,GAAW7B,IAEhBiE,GAAeP,GAAQ,WAC3B,OAAOE,GAAkB,EAAIC,KAAKK,KAAKvE,EAAMoE,OAASH,IAAmB,CAC3E,GAAG,CAACjE,EAAOiE,KAELO,GAAsBT,GAAQ,WAClC,OAAOnD,EAAaqD,EACtB,GAAG,CAACrD,EAAYqD,KAEVQ,GAAmBV,GAAQ,WAC/B,OAAOG,KAAKG,MAAMzD,EAAaqD,GACjC,GAAG,CAACrD,EAAYqD,KAGVS,GAAatB,GACjB,SAAAuB,GAA0F,IAAvFC,EAAyBD,EAAzBC,0BAA2BC,EAASF,EAATE,UAAWC,EAAwBH,EAAxBG,yBACvCpC,GAAaQ,QAAU2B,EAClBC,IACH7B,GAAcL,oBAAsBiC,GAEtCnE,GAAYA,EAASkE,EAA2BC,EAAWC,EAC5D,GACD,CAACpE,EAAUgC,GAAcO,KAGrB8B,GAAe3B,GACnB,SAAA4B,GAAsG,IAC9FrB,EADgBqB,EAARC,SACWhB,GADbe,EAAXE,YAGD,OAAOjF,EADMD,EAAM2D,GACOA,EAHGqB,EAALG,MAIzB,GACD,CAACnF,EAAOC,EAAcgE,KAGlBmB,GAAiBhC,GACrB,SAACiC,EAAehC,GACVA,IAAWvB,GAAcuD,IAAUnD,IACrCoD,YAAW,WACTvD,EAAcsB,GACdlB,GAAakD,GACbhE,EAAagE,EAAOhC,EACrB,GAAE,EAEN,GACD,CAACvB,EAAYI,GAAWb,IAGpBkE,GAAoBC,GACxB,SAAAC,GACE,GAAKxE,EAAL,CACA,IAAMyE,EAAOC,EACX3F,EACA8D,GACAJ,GALmB+B,EAApBG,qBAAyCH,EAAnBI,oBAQrB/D,EACAY,GAAaQ,SAEfjC,EAAgByE,EAVM,CAWxB,GACA,CAAEI,KAAM3E,EAA2B4E,UAAU,GAC7C,CAAC9E,EAAiBjB,EAAO8D,GAAiBJ,GAAU5B,IAkCtD,OA9BAkE,GAAU,WAEJpF,GAAcwB,KAAmBxB,IACnC6B,GAAQS,QAAQ+C,aAAa,CAC3BC,MAAO,SACPhB,YAAaV,GACbS,SAAUR,KAEZ3D,IAEJ,GAAG,CAACF,EAAYwB,GAAgBK,GAAS+B,GAAqBC,GAAkB3D,IAEhFkF,GAAU,WAEJvD,GAAQS,SACVT,GAAQS,QAAQiD,kBAAkB,CAAEjB,YAAa,EAAGD,SAAU,GAElE,GAAG,CAACnB,KAEJkC,GAAU,WAER,GAAIzE,EAAoC,CACtC,IAAM6E,EAAYC,EAAkCrG,EAAO8D,GAAiBJ,GAAU5B,GAClFU,GAA8BU,UAAYkD,IAC5C5D,GAA8BU,QAAUkD,EACxC7E,EAAmC6E,GAEvC,CACF,GAAG,CAAC7E,EAAoCvB,EAAO8D,GAAiBhC,EAAY4B,KAG1E4C,EAAAC,cAAA,MAAA,CACE3G,IAAKmD,GACLlD,UAAW2G,EAAGC,EAAOC,uBAAwB7G,GAC7CC,GAAIA,EAAE,cACO2B,GAAckF,EAAUC,EAAuBC,iBAAkB/G,IAE9EwG,EAACC,cAAAO,QACE,SAAAC,GAAyD,IAAtD1D,EAAM0D,EAAN1D,OAAQgC,EAAK0B,EAAL1B,MAEV,OADAD,GAAeC,EAAOhC,GAEpBiD,gBAACU,EAAI,CACHpH,IAAK6C,GACLY,OAAQA,EACRgC,MAAOA,EACP4B,YAAa5G,EACb6G,YAAajD,GACbkD,UAAWhH,EACXiH,SAAU9C,GACV5D,SAAUgE,GACVzD,gBAAiBsE,GACjB1F,UAAW2B,GAEVuD,GAGN,IAIT"}
@@ -1,2 +1,2 @@
1
- var e={virtualizedGridWrapper:"virtualizedGridWrapper"};!function(e){const t="s_id-03a8eed790d8_4_5_8";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,d.firstChild?d.insertBefore(i,d.firstChild):d.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedGridWrapper {\n height: 100%;\n width: 100%;\n}");export{e as default};
1
+ var e={virtualizedGridWrapper:"virtualizedGridWrapper"};!function(e){const t="s_id-03a8eed790d8_4_5_10";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,d.firstChild?d.insertBefore(i,d.firstChild):d.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedGridWrapper {\n height: 100%;\n width: 100%;\n}");export{e as default};
2
2
  //# sourceMappingURL=VirtualizedGrid.module.scss.js.map
@@ -1,2 +1,2 @@
1
- import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import i from"classnames";import e,{forwardRef as r,useState as o,useMemo as n,useRef as l,useCallback as a,useEffect as s}from"react";import{noop as c}from"es-toolkit";import{VariableSizeList as u}from"react-window";import f from"react-virtualized-auto-sizer";import d from"../../hooks/usePrevious/index.js";import m from"../../hooks/useThrottledCallback.js";import{useMergeRef as v}from"@vibe/shared";import{getNormalizedItems as p,getMaxOffset as h,getOnItemsRenderedData as I,isLayoutDirectionScrollbarVisible as S,easeInOutQuint as T}from"../../services/virtualized-service.js";import{getTestId as O}from"../../tests/testIds.js";import{ComponentDefaultTestId as g}from"../../tests/constants.js";import z from"./VirtualizedList.module.scss.js";var b=r((function(r,b){var y=r.className,C=r.id,j=r.items,w=void 0===j?[]:j,F=r.itemRenderer,R=void 0===F?function(t,i,e){return t}:F,x=r.getItemSize,L=void 0===x?function(t,i){return t.height}:x,k=r.layout,A=void 0===k?"vertical":k,D=r.onScroll,E=r.overscanCount,N=void 0===E?0:E,M=r.getItemId,U=void 0===M?function(t,i){return t.id}:M,V=r.scrollToId,_=r.scrollDuration,q=void 0===_?200:_,P=r.onScrollToFinished,W=void 0===P?c:P,B=r.onItemsRendered,H=r.onItemsRenderedThrottleMs,Z=void 0===H?200:H,G=r.onSizeUpdate,J=void 0===G?c:G,K=r.onLayoutDirectionScrollbarVisibilityChange,Q=void 0===K?null:K,X=r.virtualListRef,Y=r.scrollableClassName,$=r.role,tt=r["aria-label"],it=r.style,et=r["data-testid"],rt=o(0),ot=t(rt,2),nt=ot[0],lt=ot[1],at=o(0),st=t(at,2),ct=st[0],ut=st[1],ft="horizontal"!==A,dt=n((function(){return ft?nt:ct}),[ft,nt,ct]),mt=d(V),vt=l(null),pt=l(null),ht=l(null),It=l(0),St=l({initialized:!1,scrollOffsetInitial:0,scrollOffsetFinal:0,animationStartTime:0}),Tt=v(b,vt),Ot=v(X,ht),gt=St.current;gt.initialized||(gt.initialized=!0,gt.scrollOffsetInitial=0,gt.scrollOffsetFinal=0,gt.animationStartTime=0);var zt=a((function(t,i){var e=L(t,i);return void 0===e&&console.error("Couldn't get height for item: ",t),e}),[L]),bt=a((function(t,i){var e=U(t,i);return void 0===e&&console.error("Couldn't get id for item: ",t),e}),[U]),yt=n((function(){return p(w,bt,zt)}),[w,bt,zt]),Ct=n((function(){return h(dt,yt)}),[dt,yt]),jt=a((function(t){var i=t.scrollDirection,e=t.scrollOffset,r=t.scrollUpdateWasRequested;It.current=e,r||(gt.scrollOffsetInitial=e),D&&D(i,e,r)}),[D,It,gt]),wt=a((function(){requestAnimationFrame((function(){var t,i=performance.now()-gt.animationStartTime,e=gt.scrollOffsetFinal-gt.scrollOffsetInitial,r=T(Math.min(1,i/q)),o=Math.min(Ct,gt.scrollOffsetInitial+e*r);It.current=o,null===(t=ht.current)||void 0===t||t.scrollTo(o),q>i?wt():(gt.animationStartTime=void 0,W&&W())}))}),[q,gt,ht,Ct,W]),Ft=a((function(t){var i,e,r,o,n=t.offsetTop;gt.animationStartTime?gt.scrollOffsetFinal=n:(null!==(null===(e=null===(i=ht.current)||void 0===i?void 0:i.state)||void 0===e?void 0:e.scrollOffset)&&(gt.scrollOffsetInitial=null===(o=null===(r=ht.current)||void 0===r?void 0:r.state)||void 0===o?void 0:o.scrollOffset),gt.scrollOffsetInitial!==n?(gt.scrollOffsetFinal=n,gt.animationStartTime=performance.now(),wt()):W&&W())}),[gt,wt,W]),Rt=a((function(t){var i=t.index;return R(w[i],i,t.style)}),[w,R]),xt=a((function(t){return zt(w[t],t)}),[w,zt]),Lt=a((function(t,i){i===nt&&t===ct||setTimeout((function(){lt(i),ut(t),J(t,i)}),0)}),[nt,ct,J]),kt=m((function(t){if(B){var i=I(w,yt,bt,t.visibleStartIndex,t.visibleStopIndex,dt,It.current);B(i)}}),{wait:Z,trailing:!0},[B,w,yt,bt,dt]);return s((function(){if(V&&mt!==V){var t=S(w,yt,bt,dt),i=yt[V];t&&i&&Ft(i)}}),[mt,V,Ft,yt,w,bt,dt]),s((function(){ht.current&&ht.current.resetAfterIndex(0)}),[yt]),s((function(){if(Q){var t=S(w,yt,bt,dt);pt.current!==t&&(pt.current=t,Q(t))}}),[Q,w,yt,dt,bt]),e.createElement("div",{ref:Tt,className:i(z.virtualizedListWrapper,y),id:C,role:$,"aria-label":tt,"data-testid":et||O(g.VIRTUALIZED_LIST,C),style:it},e.createElement(f,null,(function(t){var i=t.height,r=t.width;return Lt(r,i),e.createElement(u,{ref:Ot,height:i,width:r,itemCount:w.length,itemSize:xt,onScroll:jt,layout:A,overscanCount:N,onItemsRendered:kt,className:Y},Rt)})))}));export{b as default};
1
+ import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import i from"classnames";import e,{forwardRef as r,useState as o,useMemo as n,useRef as l,useCallback as a,useEffect as s}from"react";import{noop as c}from"es-toolkit";import{VariableSizeList as u}from"react-window";import f from"react-virtualized-auto-sizer";import{usePrevious as d}from"@vibe/hooks";import m from"../../hooks/useThrottledCallback.js";import{useMergeRef as v}from"@vibe/shared";import{getNormalizedItems as p,getMaxOffset as h,getOnItemsRenderedData as I,isLayoutDirectionScrollbarVisible as S,easeInOutQuint as T}from"../../services/virtualized-service.js";import{getTestId as O}from"../../tests/testIds.js";import{ComponentDefaultTestId as g}from"../../tests/constants.js";import z from"./VirtualizedList.module.scss.js";var b=r((function(r,b){var y=r.className,C=r.id,w=r.items,F=void 0===w?[]:w,R=r.itemRenderer,j=void 0===R?function(t,i,e){return t}:R,L=r.getItemSize,x=void 0===L?function(t,i){return t.height}:L,k=r.layout,A=void 0===k?"vertical":k,D=r.onScroll,E=r.overscanCount,N=void 0===E?0:E,M=r.getItemId,U=void 0===M?function(t,i){return t.id}:M,V=r.scrollToId,_=r.scrollDuration,q=void 0===_?200:_,W=r.onScrollToFinished,B=void 0===W?c:W,H=r.onItemsRendered,P=r.onItemsRenderedThrottleMs,Z=void 0===P?200:P,G=r.onSizeUpdate,J=void 0===G?c:G,K=r.onLayoutDirectionScrollbarVisibilityChange,Q=void 0===K?null:K,X=r.virtualListRef,Y=r.scrollableClassName,$=r.role,tt=r["aria-label"],it=r.style,et=r["data-testid"],rt=o(0),ot=t(rt,2),nt=ot[0],lt=ot[1],at=o(0),st=t(at,2),ct=st[0],ut=st[1],ft="horizontal"!==A,dt=n((function(){return ft?nt:ct}),[ft,nt,ct]),mt=d(V),vt=l(null),pt=l(null),ht=l(null),It=l(0),St=l({initialized:!1,scrollOffsetInitial:0,scrollOffsetFinal:0,animationStartTime:0}),Tt=v(b,vt),Ot=v(X,ht),gt=St.current;gt.initialized||(gt.initialized=!0,gt.scrollOffsetInitial=0,gt.scrollOffsetFinal=0,gt.animationStartTime=0);var zt=a((function(t,i){var e=x(t,i);return void 0===e&&console.error("Couldn't get height for item: ",t),e}),[x]),bt=a((function(t,i){var e=U(t,i);return void 0===e&&console.error("Couldn't get id for item: ",t),e}),[U]),yt=n((function(){return p(F,bt,zt)}),[F,bt,zt]),Ct=n((function(){return h(dt,yt)}),[dt,yt]),wt=a((function(t){var i=t.scrollDirection,e=t.scrollOffset,r=t.scrollUpdateWasRequested;It.current=e,r||(gt.scrollOffsetInitial=e),D&&D(i,e,r)}),[D,It,gt]),Ft=a((function(){requestAnimationFrame((function(){var t,i=performance.now()-gt.animationStartTime,e=gt.scrollOffsetFinal-gt.scrollOffsetInitial,r=T(Math.min(1,i/q)),o=Math.min(Ct,gt.scrollOffsetInitial+e*r);It.current=o,null===(t=ht.current)||void 0===t||t.scrollTo(o),q>i?Ft():(gt.animationStartTime=void 0,B&&B())}))}),[q,gt,ht,Ct,B]),Rt=a((function(t){var i,e,r,o,n=t.offsetTop;gt.animationStartTime?gt.scrollOffsetFinal=n:(null!==(null===(e=null===(i=ht.current)||void 0===i?void 0:i.state)||void 0===e?void 0:e.scrollOffset)&&(gt.scrollOffsetInitial=null===(o=null===(r=ht.current)||void 0===r?void 0:r.state)||void 0===o?void 0:o.scrollOffset),gt.scrollOffsetInitial!==n?(gt.scrollOffsetFinal=n,gt.animationStartTime=performance.now(),Ft()):B&&B())}),[gt,Ft,B]),jt=a((function(t){var i=t.index;return j(F[i],i,t.style)}),[F,j]),Lt=a((function(t){return zt(F[t],t)}),[F,zt]),xt=a((function(t,i){i===nt&&t===ct||setTimeout((function(){lt(i),ut(t),J(t,i)}),0)}),[nt,ct,J]),kt=m((function(t){if(H){var i=I(F,yt,bt,t.visibleStartIndex,t.visibleStopIndex,dt,It.current);H(i)}}),{wait:Z,trailing:!0},[H,F,yt,bt,dt]);return s((function(){if(V&&mt!==V){var t=S(F,yt,bt,dt),i=yt[V];t&&i&&Rt(i)}}),[mt,V,Rt,yt,F,bt,dt]),s((function(){ht.current&&ht.current.resetAfterIndex(0)}),[yt]),s((function(){if(Q){var t=S(F,yt,bt,dt);pt.current!==t&&(pt.current=t,Q(t))}}),[Q,F,yt,dt,bt]),e.createElement("div",{ref:Tt,className:i(z.virtualizedListWrapper,y),id:C,role:$,"aria-label":tt,"data-testid":et||O(g.VIRTUALIZED_LIST,C),style:it},e.createElement(f,null,(function(t){var i=t.height,r=t.width;return xt(r,i),e.createElement(u,{ref:Ot,height:i,width:r,itemCount:F.length,itemSize:Lt,onScroll:wt,layout:A,overscanCount:N,onItemsRendered:kt,className:Y},jt)})))}));export{b as default};
2
2
  //# sourceMappingURL=VirtualizedList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"VirtualizedList.js","sources":["../../../../../src/components/VirtualizedList/VirtualizedList.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n type CSSProperties,\n type ForwardedRef,\n forwardRef,\n type LegacyRef,\n type ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport { noop as NOOP } from \"es-toolkit\";\nimport {\n type ScrollDirection,\n VariableSizeList as List,\n type ListOnItemsRenderedProps,\n type ListChildComponentProps,\n type VariableSizeList\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport {\n easeInOutQuint,\n getMaxOffset,\n getNormalizedItems,\n getOnItemsRenderedData,\n isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./VirtualizedList.module.scss\";\nimport {\n type VirtualizedListItem,\n type VirtualizedListLayout,\n type VirtualizedListScrollDirection\n} from \"./VirtualizedList.types\";\n\nexport interface VirtualizedListProps extends VibeComponentProps {\n /**\n * Class name applied to the scrollable container.\n */\n scrollableClassName?: string;\n /**\n * The orientation of the list.\n */\n layout?: VirtualizedListLayout;\n /**\n * The list of items to be rendered.\n */\n items: VirtualizedListItem[];\n /**\n * Function to render each item in the list.\n */\n itemRenderer: (item: VirtualizedListItem, index: number, style: CSSProperties) => ReactElement | JSX.Element;\n /**\n * Function to get the size (height/width) of each item, based on layout.\n */\n getItemSize?: (item: VirtualizedListItem, index: number) => number;\n /**\n * Function to get the unique ID of an item.\n */\n getItemId?: (item: VirtualizedListItem, index: number) => string;\n /**\n * Callback fired when the scroll animation is finished.\n */\n onScrollToFinished?: () => void;\n /**\n * Number of items to render above and below the visible portion.\n */\n overscanCount?: number;\n /**\n * The duration of the scroll animation in milliseconds.\n */\n scrollDuration?: number;\n /**\n * Callback fired when items are rendered.\n */\n onItemsRendered?: ({\n firstItemId,\n secondItemId,\n lastItemId,\n centerItemId,\n firstItemOffsetEnd,\n currentOffsetTop\n }: {\n firstItemId: string;\n secondItemId: string;\n lastItemId: string;\n centerItemId: string;\n firstItemOffsetEnd: number;\n currentOffsetTop: number;\n }) => void;\n /**\n * The delay (in ms) for throttling the `onItemsRendered` callback.\n */\n onItemsRenderedThrottleMs?: number;\n /**\n * Callback fired when the list size changes.\n */\n onSizeUpdate?: (width: number, height: number) => void;\n /**\n * Callback fired when the vertical or horizontal scrollbar visibility changes.\n */\n onLayoutDirectionScrollbarVisibilityChange?: (value: boolean) => void;\n /**\n * The ARIA role attribute applied to the list.\n */\n role?: string;\n /**\n * The ARIA label for the list.\n */\n \"aria-label\"?: string;\n /**\n * Custom inline styles applied to the list.\n */\n style?: CSSProperties;\n /**\n * The ID of the item to scroll to.\n */\n scrollToId?: string;\n /**\n * Reference to the virtualized list component.\n */\n virtualListRef?: ForwardedRef<HTMLElement>;\n /**\n * Callback fired when the list is scrolled.\n */\n onScroll?: (\n horizontalScrollDirection: VirtualizedListScrollDirection,\n scrollTop: number,\n scrollUpdateWasRequested: boolean\n ) => void;\n}\n\nconst VirtualizedList = forwardRef(\n (\n {\n className,\n id,\n items = [],\n itemRenderer = (item: VirtualizedListItem, _index: number, _style: CSSProperties) => item as ReactElement,\n getItemSize = (item: VirtualizedListItem, _index: number) => item.height,\n layout = \"vertical\",\n onScroll,\n overscanCount = 0,\n getItemId = (item: VirtualizedListItem, _index: number) => item.id,\n scrollToId,\n scrollDuration = 200,\n onScrollToFinished = NOOP,\n onItemsRendered,\n onItemsRenderedThrottleMs = 200,\n onSizeUpdate = NOOP,\n onLayoutDirectionScrollbarVisibilityChange = null,\n virtualListRef,\n scrollableClassName,\n role,\n \"aria-label\": ariaLabel,\n style,\n \"data-testid\": dataTestId\n }: VirtualizedListProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n // states\n const [listHeight, setListHeight] = useState(0);\n const [listWidth, setListWidth] = useState(0);\n\n const isVerticalList = layout !== \"horizontal\";\n const listSizeByLayout = useMemo(() => {\n return isVerticalList ? listHeight : listWidth;\n }, [isVerticalList, listHeight, listWidth]);\n\n // prevs\n const prevScrollToId = usePrevious(scrollToId);\n\n // Refs\n const componentRef = useRef(null);\n const isVerticalScrollbarVisibleRef = useRef(null);\n const listRef = useRef(null);\n const scrollTopRef = useRef(0);\n const animationDataRef = useRef({\n initialized: false,\n scrollOffsetInitial: 0,\n scrollOffsetFinal: 0,\n animationStartTime: 0\n });\n const mergedRef = useMergeRef(ref, componentRef);\n const mergedListRef = useMergeRef(virtualListRef, listRef);\n\n const animationData = animationDataRef.current;\n if (!animationData.initialized) {\n animationData.initialized = true;\n animationData.scrollOffsetInitial = 0;\n animationData.scrollOffsetFinal = 0;\n animationData.animationStartTime = 0;\n }\n\n // Callbacks\n const sizeGetter = useCallback(\n (item: VirtualizedListItem, index: number) => {\n const height = getItemSize(item, index);\n if (height === undefined) {\n console.error(\"Couldn't get height for item: \", item);\n }\n return height;\n },\n [getItemSize]\n );\n\n const idGetter = useCallback(\n (item: VirtualizedListItem, index: number) => {\n const itemId = getItemId(item, index);\n if (itemId === undefined) {\n console.error(\"Couldn't get id for item: \", item);\n }\n return itemId;\n },\n [getItemId]\n );\n\n // Memos\n // Creates object of itemId => { item, index, size, offsetTop}\n const normalizedItems = useMemo(() => {\n return getNormalizedItems(items, idGetter, sizeGetter);\n }, [items, idGetter, sizeGetter]);\n\n const maxListOffset = useMemo(() => {\n return getMaxOffset(listSizeByLayout, normalizedItems);\n }, [listSizeByLayout, normalizedItems]);\n\n // Callbacks\n const onScrollCB = useCallback(\n ({\n scrollDirection,\n scrollOffset,\n scrollUpdateWasRequested\n }: {\n scrollDirection: ScrollDirection;\n scrollOffset: number;\n scrollUpdateWasRequested: boolean;\n }) => {\n scrollTopRef.current = scrollOffset;\n if (!scrollUpdateWasRequested) {\n animationData.scrollOffsetInitial = scrollOffset;\n }\n onScroll && onScroll(scrollDirection, scrollOffset, scrollUpdateWasRequested);\n },\n [onScroll, scrollTopRef, animationData]\n );\n\n const animateScroll = useCallback(() => {\n requestAnimationFrame(() => {\n const now = performance.now();\n const ellapsed = now - animationData.animationStartTime;\n const scrollDelta = animationData.scrollOffsetFinal - animationData.scrollOffsetInitial;\n const easedTime = easeInOutQuint(Math.min(1, ellapsed / scrollDuration));\n const scrollOffset = animationData.scrollOffsetInitial + scrollDelta * easedTime;\n const finalOffsetValue = Math.min(maxListOffset, scrollOffset);\n scrollTopRef.current = finalOffsetValue;\n listRef.current?.scrollTo(finalOffsetValue);\n\n if (ellapsed < scrollDuration) {\n animateScroll();\n } else {\n animationData.animationStartTime = undefined;\n onScrollToFinished && onScrollToFinished();\n }\n });\n }, [scrollDuration, animationData, listRef, maxListOffset, onScrollToFinished]);\n\n const startScrollAnimation = useCallback(\n (item: VirtualizedListItem) => {\n const { offsetTop } = item;\n\n if (animationData.animationStartTime) {\n // animation already in progress\n animationData.scrollOffsetFinal = offsetTop;\n return;\n }\n\n // Update the initial scroll offset with the current scroll position for react 18 batching behavior\n if (listRef.current?.state?.scrollOffset !== null) {\n animationData.scrollOffsetInitial = listRef.current?.state?.scrollOffset;\n }\n\n if (animationData.scrollOffsetInitial === offsetTop) {\n // offset already equals to item offset\n onScrollToFinished && onScrollToFinished();\n return;\n }\n\n animationData.scrollOffsetFinal = offsetTop;\n animationData.animationStartTime = performance.now();\n animateScroll();\n },\n [animationData, animateScroll, onScrollToFinished]\n );\n\n const rowRenderer = useCallback(\n ({ index, style }: { index: number; style: CSSProperties }) => {\n const item = items[index];\n return itemRenderer(item, index, style);\n },\n [items, itemRenderer]\n );\n\n const calcItemSize = useCallback(\n (index: number) => {\n const item = items[index];\n return sizeGetter(item, index);\n },\n [items, sizeGetter]\n );\n\n const updateListSize = useCallback(\n (width: number, height: number) => {\n if (height !== listHeight || width !== listWidth) {\n setTimeout(() => {\n setListHeight(height);\n setListWidth(width);\n onSizeUpdate(width, height);\n }, 0);\n }\n },\n [listHeight, listWidth, onSizeUpdate]\n );\n\n const onItemsRenderedCB = useThrottledCallback(\n ({ visibleStartIndex, visibleStopIndex }: ListOnItemsRenderedProps) => {\n if (!onItemsRendered) return;\n const data = getOnItemsRenderedData(\n items,\n normalizedItems,\n idGetter,\n visibleStartIndex,\n visibleStopIndex,\n listSizeByLayout,\n scrollTopRef.current\n );\n onItemsRendered(data);\n },\n { wait: onItemsRenderedThrottleMs, trailing: true },\n [onItemsRendered, items, normalizedItems, idGetter, listSizeByLayout]\n );\n\n // Effects\n useEffect(() => {\n // scroll to specific item\n if (scrollToId && prevScrollToId !== scrollToId) {\n const hasScrollbar = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n const item = normalizedItems[scrollToId as keyof typeof normalizedItems];\n hasScrollbar && item && startScrollAnimation(item);\n }\n }, [prevScrollToId, scrollToId, startScrollAnimation, normalizedItems, items, idGetter, listSizeByLayout]);\n\n useEffect(() => {\n // recalculate row heights\n if (listRef.current) {\n listRef.current.resetAfterIndex(0);\n }\n }, [normalizedItems]);\n\n useEffect(() => {\n // update vertical scrollbar visibility\n if (onLayoutDirectionScrollbarVisibilityChange) {\n const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n isVerticalScrollbarVisibleRef.current = isVisible;\n onLayoutDirectionScrollbarVisibilityChange(isVisible);\n }\n }\n }, [onLayoutDirectionScrollbarVisibilityChange, items, normalizedItems, listSizeByLayout, idGetter]);\n\n return (\n <div\n ref={mergedRef}\n className={cx(styles.virtualizedListWrapper, className)}\n id={id}\n role={role}\n aria-label={ariaLabel}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_LIST, id)}\n style={style}\n >\n <AutoSizer>\n {({ height, width }: { height: number; width: number }) => {\n updateListSize(width, height);\n return (\n <List\n ref={mergedListRef as unknown as LegacyRef<VariableSizeList<unknown>>}\n height={height}\n width={width}\n itemCount={items.length}\n itemSize={calcItemSize}\n onScroll={onScrollCB}\n layout={layout}\n overscanCount={overscanCount}\n onItemsRendered={onItemsRenderedCB}\n className={scrollableClassName}\n >\n {rowRenderer as React.ComponentType<ListChildComponentProps>}\n </List>\n );\n }}\n </AutoSizer>\n </div>\n );\n }\n);\n\nexport default VirtualizedList;\n"],"names":["VirtualizedList","forwardRef","_ref","ref","className","id","_ref$items","items","_ref$itemRenderer","itemRenderer","item","_index","_style","_ref$getItemSize","getItemSize","height","_ref$layout","layout","onScroll","_ref$overscanCount","overscanCount","_ref$getItemId","getItemId","scrollToId","_ref$scrollDuration","scrollDuration","_ref$onScrollToFinish","onScrollToFinished","NOOP","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onLayoutDirectio","onLayoutDirectionScrollbarVisibilityChange","virtualListRef","scrollableClassName","role","ariaLabel","style","dataTestId","_useState","useState","_useState2","_slicedToArray","listHeight","setListHeight","_useState3","_useState4","listWidth","setListWidth","isVerticalList","listSizeByLayout","useMemo","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","listRef","scrollTopRef","animationDataRef","initialized","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","mergedListRef","animationData","current","sizeGetter","useCallback","index","undefined","console","error","idGetter","itemId","normalizedItems","getNormalizedItems","maxListOffset","getMaxOffset","onScrollCB","_ref2","scrollDirection","scrollOffset","scrollUpdateWasRequested","animateScroll","requestAnimationFrame","ellapsed","performance","now","scrollDelta","easedTime","easeInOutQuint","Math","min","finalOffsetValue","_a","scrollTo","startScrollAnimation","offsetTop","_b","state","_d","_c","rowRenderer","_ref3","calcItemSize","updateListSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleStartIndex","visibleStopIndex","wait","trailing","useEffect","hasScrollbar","isLayoutDirectionScrollbarVisible","resetAfterIndex","isVisible","React","createElement","cx","styles","virtualizedListWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_LIST","AutoSizer","_ref5","List","itemCount","length","itemSize"],"mappings":"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"}
1
+ {"version":3,"file":"VirtualizedList.js","sources":["../../../../../src/components/VirtualizedList/VirtualizedList.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n type CSSProperties,\n type ForwardedRef,\n forwardRef,\n type LegacyRef,\n type ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport { noop as NOOP } from \"es-toolkit\";\nimport {\n type ScrollDirection,\n VariableSizeList as List,\n type ListOnItemsRenderedProps,\n type ListChildComponentProps,\n type VariableSizeList\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport { usePrevious } from \"@vibe/hooks\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport {\n easeInOutQuint,\n getMaxOffset,\n getNormalizedItems,\n getOnItemsRenderedData,\n isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./VirtualizedList.module.scss\";\nimport {\n type VirtualizedListItem,\n type VirtualizedListLayout,\n type VirtualizedListScrollDirection\n} from \"./VirtualizedList.types\";\n\nexport interface VirtualizedListProps extends VibeComponentProps {\n /**\n * Class name applied to the scrollable container.\n */\n scrollableClassName?: string;\n /**\n * The orientation of the list.\n */\n layout?: VirtualizedListLayout;\n /**\n * The list of items to be rendered.\n */\n items: VirtualizedListItem[];\n /**\n * Function to render each item in the list.\n */\n itemRenderer: (item: VirtualizedListItem, index: number, style: CSSProperties) => ReactElement | JSX.Element;\n /**\n * Function to get the size (height/width) of each item, based on layout.\n */\n getItemSize?: (item: VirtualizedListItem, index: number) => number;\n /**\n * Function to get the unique ID of an item.\n */\n getItemId?: (item: VirtualizedListItem, index: number) => string;\n /**\n * Callback fired when the scroll animation is finished.\n */\n onScrollToFinished?: () => void;\n /**\n * Number of items to render above and below the visible portion.\n */\n overscanCount?: number;\n /**\n * The duration of the scroll animation in milliseconds.\n */\n scrollDuration?: number;\n /**\n * Callback fired when items are rendered.\n */\n onItemsRendered?: ({\n firstItemId,\n secondItemId,\n lastItemId,\n centerItemId,\n firstItemOffsetEnd,\n currentOffsetTop\n }: {\n firstItemId: string;\n secondItemId: string;\n lastItemId: string;\n centerItemId: string;\n firstItemOffsetEnd: number;\n currentOffsetTop: number;\n }) => void;\n /**\n * The delay (in ms) for throttling the `onItemsRendered` callback.\n */\n onItemsRenderedThrottleMs?: number;\n /**\n * Callback fired when the list size changes.\n */\n onSizeUpdate?: (width: number, height: number) => void;\n /**\n * Callback fired when the vertical or horizontal scrollbar visibility changes.\n */\n onLayoutDirectionScrollbarVisibilityChange?: (value: boolean) => void;\n /**\n * The ARIA role attribute applied to the list.\n */\n role?: string;\n /**\n * The ARIA label for the list.\n */\n \"aria-label\"?: string;\n /**\n * Custom inline styles applied to the list.\n */\n style?: CSSProperties;\n /**\n * The ID of the item to scroll to.\n */\n scrollToId?: string;\n /**\n * Reference to the virtualized list component.\n */\n virtualListRef?: ForwardedRef<HTMLElement>;\n /**\n * Callback fired when the list is scrolled.\n */\n onScroll?: (\n horizontalScrollDirection: VirtualizedListScrollDirection,\n scrollTop: number,\n scrollUpdateWasRequested: boolean\n ) => void;\n}\n\nconst VirtualizedList = forwardRef(\n (\n {\n className,\n id,\n items = [],\n itemRenderer = (item: VirtualizedListItem, _index: number, _style: CSSProperties) => item as ReactElement,\n getItemSize = (item: VirtualizedListItem, _index: number) => item.height,\n layout = \"vertical\",\n onScroll,\n overscanCount = 0,\n getItemId = (item: VirtualizedListItem, _index: number) => item.id,\n scrollToId,\n scrollDuration = 200,\n onScrollToFinished = NOOP,\n onItemsRendered,\n onItemsRenderedThrottleMs = 200,\n onSizeUpdate = NOOP,\n onLayoutDirectionScrollbarVisibilityChange = null,\n virtualListRef,\n scrollableClassName,\n role,\n \"aria-label\": ariaLabel,\n style,\n \"data-testid\": dataTestId\n }: VirtualizedListProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n // states\n const [listHeight, setListHeight] = useState(0);\n const [listWidth, setListWidth] = useState(0);\n\n const isVerticalList = layout !== \"horizontal\";\n const listSizeByLayout = useMemo(() => {\n return isVerticalList ? listHeight : listWidth;\n }, [isVerticalList, listHeight, listWidth]);\n\n // prevs\n const prevScrollToId = usePrevious(scrollToId);\n\n // Refs\n const componentRef = useRef(null);\n const isVerticalScrollbarVisibleRef = useRef(null);\n const listRef = useRef(null);\n const scrollTopRef = useRef(0);\n const animationDataRef = useRef({\n initialized: false,\n scrollOffsetInitial: 0,\n scrollOffsetFinal: 0,\n animationStartTime: 0\n });\n const mergedRef = useMergeRef(ref, componentRef);\n const mergedListRef = useMergeRef(virtualListRef, listRef);\n\n const animationData = animationDataRef.current;\n if (!animationData.initialized) {\n animationData.initialized = true;\n animationData.scrollOffsetInitial = 0;\n animationData.scrollOffsetFinal = 0;\n animationData.animationStartTime = 0;\n }\n\n // Callbacks\n const sizeGetter = useCallback(\n (item: VirtualizedListItem, index: number) => {\n const height = getItemSize(item, index);\n if (height === undefined) {\n console.error(\"Couldn't get height for item: \", item);\n }\n return height;\n },\n [getItemSize]\n );\n\n const idGetter = useCallback(\n (item: VirtualizedListItem, index: number) => {\n const itemId = getItemId(item, index);\n if (itemId === undefined) {\n console.error(\"Couldn't get id for item: \", item);\n }\n return itemId;\n },\n [getItemId]\n );\n\n // Memos\n // Creates object of itemId => { item, index, size, offsetTop}\n const normalizedItems = useMemo(() => {\n return getNormalizedItems(items, idGetter, sizeGetter);\n }, [items, idGetter, sizeGetter]);\n\n const maxListOffset = useMemo(() => {\n return getMaxOffset(listSizeByLayout, normalizedItems);\n }, [listSizeByLayout, normalizedItems]);\n\n // Callbacks\n const onScrollCB = useCallback(\n ({\n scrollDirection,\n scrollOffset,\n scrollUpdateWasRequested\n }: {\n scrollDirection: ScrollDirection;\n scrollOffset: number;\n scrollUpdateWasRequested: boolean;\n }) => {\n scrollTopRef.current = scrollOffset;\n if (!scrollUpdateWasRequested) {\n animationData.scrollOffsetInitial = scrollOffset;\n }\n onScroll && onScroll(scrollDirection, scrollOffset, scrollUpdateWasRequested);\n },\n [onScroll, scrollTopRef, animationData]\n );\n\n const animateScroll = useCallback(() => {\n requestAnimationFrame(() => {\n const now = performance.now();\n const ellapsed = now - animationData.animationStartTime;\n const scrollDelta = animationData.scrollOffsetFinal - animationData.scrollOffsetInitial;\n const easedTime = easeInOutQuint(Math.min(1, ellapsed / scrollDuration));\n const scrollOffset = animationData.scrollOffsetInitial + scrollDelta * easedTime;\n const finalOffsetValue = Math.min(maxListOffset, scrollOffset);\n scrollTopRef.current = finalOffsetValue;\n listRef.current?.scrollTo(finalOffsetValue);\n\n if (ellapsed < scrollDuration) {\n animateScroll();\n } else {\n animationData.animationStartTime = undefined;\n onScrollToFinished && onScrollToFinished();\n }\n });\n }, [scrollDuration, animationData, listRef, maxListOffset, onScrollToFinished]);\n\n const startScrollAnimation = useCallback(\n (item: VirtualizedListItem) => {\n const { offsetTop } = item;\n\n if (animationData.animationStartTime) {\n // animation already in progress\n animationData.scrollOffsetFinal = offsetTop;\n return;\n }\n\n // Update the initial scroll offset with the current scroll position for react 18 batching behavior\n if (listRef.current?.state?.scrollOffset !== null) {\n animationData.scrollOffsetInitial = listRef.current?.state?.scrollOffset;\n }\n\n if (animationData.scrollOffsetInitial === offsetTop) {\n // offset already equals to item offset\n onScrollToFinished && onScrollToFinished();\n return;\n }\n\n animationData.scrollOffsetFinal = offsetTop;\n animationData.animationStartTime = performance.now();\n animateScroll();\n },\n [animationData, animateScroll, onScrollToFinished]\n );\n\n const rowRenderer = useCallback(\n ({ index, style }: { index: number; style: CSSProperties }) => {\n const item = items[index];\n return itemRenderer(item, index, style);\n },\n [items, itemRenderer]\n );\n\n const calcItemSize = useCallback(\n (index: number) => {\n const item = items[index];\n return sizeGetter(item, index);\n },\n [items, sizeGetter]\n );\n\n const updateListSize = useCallback(\n (width: number, height: number) => {\n if (height !== listHeight || width !== listWidth) {\n setTimeout(() => {\n setListHeight(height);\n setListWidth(width);\n onSizeUpdate(width, height);\n }, 0);\n }\n },\n [listHeight, listWidth, onSizeUpdate]\n );\n\n const onItemsRenderedCB = useThrottledCallback(\n ({ visibleStartIndex, visibleStopIndex }: ListOnItemsRenderedProps) => {\n if (!onItemsRendered) return;\n const data = getOnItemsRenderedData(\n items,\n normalizedItems,\n idGetter,\n visibleStartIndex,\n visibleStopIndex,\n listSizeByLayout,\n scrollTopRef.current\n );\n onItemsRendered(data);\n },\n { wait: onItemsRenderedThrottleMs, trailing: true },\n [onItemsRendered, items, normalizedItems, idGetter, listSizeByLayout]\n );\n\n // Effects\n useEffect(() => {\n // scroll to specific item\n if (scrollToId && prevScrollToId !== scrollToId) {\n const hasScrollbar = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n const item = normalizedItems[scrollToId as keyof typeof normalizedItems];\n hasScrollbar && item && startScrollAnimation(item);\n }\n }, [prevScrollToId, scrollToId, startScrollAnimation, normalizedItems, items, idGetter, listSizeByLayout]);\n\n useEffect(() => {\n // recalculate row heights\n if (listRef.current) {\n listRef.current.resetAfterIndex(0);\n }\n }, [normalizedItems]);\n\n useEffect(() => {\n // update vertical scrollbar visibility\n if (onLayoutDirectionScrollbarVisibilityChange) {\n const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n isVerticalScrollbarVisibleRef.current = isVisible;\n onLayoutDirectionScrollbarVisibilityChange(isVisible);\n }\n }\n }, [onLayoutDirectionScrollbarVisibilityChange, items, normalizedItems, listSizeByLayout, idGetter]);\n\n return (\n <div\n ref={mergedRef}\n className={cx(styles.virtualizedListWrapper, className)}\n id={id}\n role={role}\n aria-label={ariaLabel}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_LIST, id)}\n style={style}\n >\n <AutoSizer>\n {({ height, width }: { height: number; width: number }) => {\n updateListSize(width, height);\n return (\n <List\n ref={mergedListRef as unknown as LegacyRef<VariableSizeList<unknown>>}\n height={height}\n width={width}\n itemCount={items.length}\n itemSize={calcItemSize}\n onScroll={onScrollCB}\n layout={layout}\n overscanCount={overscanCount}\n onItemsRendered={onItemsRenderedCB}\n className={scrollableClassName}\n >\n {rowRenderer as React.ComponentType<ListChildComponentProps>}\n </List>\n );\n }}\n </AutoSizer>\n </div>\n );\n }\n);\n\nexport default VirtualizedList;\n"],"names":["VirtualizedList","forwardRef","_ref","ref","className","id","_ref$items","items","_ref$itemRenderer","itemRenderer","item","_index","_style","_ref$getItemSize","getItemSize","height","_ref$layout","layout","onScroll","_ref$overscanCount","overscanCount","_ref$getItemId","getItemId","scrollToId","_ref$scrollDuration","scrollDuration","_ref$onScrollToFinish","onScrollToFinished","NOOP","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onLayoutDirectio","onLayoutDirectionScrollbarVisibilityChange","virtualListRef","scrollableClassName","role","ariaLabel","style","dataTestId","_useState","useState","_useState2","_slicedToArray","listHeight","setListHeight","_useState3","_useState4","listWidth","setListWidth","isVerticalList","listSizeByLayout","useMemo","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","listRef","scrollTopRef","animationDataRef","initialized","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","mergedListRef","animationData","current","sizeGetter","useCallback","index","undefined","console","error","idGetter","itemId","normalizedItems","getNormalizedItems","maxListOffset","getMaxOffset","onScrollCB","_ref2","scrollDirection","scrollOffset","scrollUpdateWasRequested","animateScroll","requestAnimationFrame","ellapsed","performance","now","scrollDelta","easedTime","easeInOutQuint","Math","min","finalOffsetValue","_a","scrollTo","startScrollAnimation","offsetTop","_b","state","_d","_c","rowRenderer","_ref3","calcItemSize","updateListSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleStartIndex","visibleStopIndex","wait","trailing","useEffect","hasScrollbar","isLayoutDirectionScrollbarVisible","resetAfterIndex","isVisible","React","createElement","cx","styles","virtualizedListWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_LIST","AutoSizer","_ref5","List","itemCount","length","itemSize"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- var e={virtualizedListWrapper:"virtualizedListWrapper"};!function(e){const t="s_id-9250e4cf6c59_4_5_8";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedListWrapper {\n height: 100%;\n width: 100%;\n}");export{e as default};
1
+ var e={virtualizedListWrapper:"virtualizedListWrapper"};!function(e){const t="s_id-9250e4cf6c59_4_5_10";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.virtualizedListWrapper {\n height: 100%;\n width: 100%;\n}");export{e as default};
2
2
  //# sourceMappingURL=VirtualizedList.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var e={list:"list"};!function(e){const t="s_id-39e4d9ed645a_4_5_8";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".list {\n margin: 0;\n padding: 0;\n list-style: none;\n}");export{e as default};
1
+ var e={list:"list"};!function(e){const t="s_id-39e4d9ed645a_4_5_10";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".list {\n margin: 0;\n padding: 0;\n list-style: none;\n}");export{e as default};
2
2
  //# sourceMappingURL=List.module.scss.js.map
@@ -1,2 +1,2 @@
1
- var e={listTitle:"listTitle",small:"small",medium:"medium",large:"large",sticky:"sticky"};!function(e){const n="s_id-7bd0f1d1374d_4_5_8";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listTitle {\n -webkit-font-smoothing: var(--font-smoothing-webkit);\n -moz-osx-font-smoothing: var(--font-smoothing-moz);\n border-radius: var(--border-radius-small);\n}\n.small {\n padding: var(--space-16) var(--space-8) var(--space-8);\n}\n.medium {\n padding: var(--space-16) 12px var(--space-8);\n}\n.large {\n padding: var(--space-16) 12px var(--space-8);\n}\n.sticky {\n position: sticky;\n inset-block-start: 0;\n background-color: var(--primary-background-color);\n z-index: 1;\n}");export{e as default};
1
+ var e={listTitle:"listTitle",small:"small",medium:"medium",large:"large",sticky:"sticky"};!function(e){const n="s_id-7bd0f1d1374d_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listTitle {\n -webkit-font-smoothing: var(--font-smoothing-webkit);\n -moz-osx-font-smoothing: var(--font-smoothing-moz);\n border-radius: var(--border-radius-small);\n}\n.small {\n padding: var(--space-16) var(--space-8) var(--space-8);\n}\n.medium {\n padding: var(--space-16) 12px var(--space-8);\n}\n.large {\n padding: var(--space-16) 12px var(--space-8);\n}\n.sticky {\n position: sticky;\n inset-block-start: 0;\n background-color: var(--primary-background-color);\n z-index: 1;\n}");export{e as default};
2
2
  //# sourceMappingURL=ListTitle.module.scss.js.map
@@ -1,2 +1,2 @@
1
- import{useCallback as e,useMemo as t,useEffect as n,useRef as s}from"react";import{useKeyEvent as i,useEventListener as o}from"@vibe/shared";import u from"../usePrevious/index.js";import{getNextSelectableIndex as c,getPreviousSelectableIndex as r}from"./useActiveDescendantListFocusHelpers.js";import l from"../useListenFocusTriggers/index.js";var a;!function(e){e.UP="ArrowUp",e.DOWN="ArrowDown",e.RIGHT="ArrowRight",e.LEFT="ArrowLeft"}(a||(a={}));var m="Enter";function I(t){var n=t.itemsCount,s=t.focusedElementRef,o=t.visualFocusItemIndex,u=t.setVisualFocusItemIndex,l=t.isHorizontalList,m=t.isItemSelectable,I=t.listenerOptions,d=t.triggeredByKeyboard,f=l?a.RIGHT:a.DOWN,v=l?a.LEFT:a.UP,F=e((function(e){var t;document.activeElement===s.current&&(!d.current&&(d.current=!0,o>-1)||(e===f?t=c({isItemSelectable:m,visualFocusItemIndex:o,itemsCount:n}):e===v&&(t=r({isItemSelectable:m,visualFocusItemIndex:o,itemsCount:n})),t>-1&&t!==o&&u(t)))}),[s,d,f,v,o,u,m,n]),b=e((function(){F(v)}),[v,F]),x=e((function(){F(f)}),[f,F]);i(Object.assign({keys:[f],callback:x},I)),i(Object.assign({keys:[v],callback:b},I))}function d(n){var s=n.visualFocusItemIndex,o=n.focusedElementRef,u=n.itemsCount,c=n.setVisualFocusItemIndex,r=n.onItemClick,l=n.isItemSelectable,a=n.listenerOptions,I=void 0===a?void 0:a,d=n.isIgnoreSpaceAsItemSelection,f=void 0!==d&&d,v=t((function(){return f?[m]:[m," "]}),[f]),F=e((function(e,t){r&&(t>=0&&u>t)&&l(t)&&(s!==t&&c(t),r(e,t))}),[u,r,l,s,c]),b=e((function(e){o.current.contains(document.activeElement)&&F(e,s)}),[F,o,s]);i(Object.assign({keys:v,callback:b},I))}function f(t){var s=t.focusedElementRef,i=t.visualFocusItemIndex,c=t.setVisualFocusItemIndex,r=u(s),l=e((function(){-1!==i&&c(-1)}),[c,i]);n((function(){null===(null==s?void 0:s.current)&&null!==(null==r?void 0:r.current)&&l()}),[s.current,r,l]),o({eventName:"blur",ref:s,callback:l})}function v(t){var n=t.focusedElementRef,i=t.isItemSelectable,o=t.visualFocusItemIndex,u=t.setVisualFocusItemIndex,r=t.itemsCount,a=t.defaultVisualFocusItemIndex,m=void 0===a?-1:a,I=s(!1),d=e((function(){var e;(I.current=!0,o!==m)&&(e=i(m)?m:c({isItemSelectable:i,itemsCount:r,visualFocusItemIndex:m}),u(e))}),[m,i,r,u,I,o]),f=e((function(){I.current=!1}),[I]);return l({ref:n,onFocusByKeyboard:d,onFocusByMouse:f}),{triggeredByKeyboard:I}}function F(e){var t=e.visualFocusItemIndex,s=e.itemsIds,i=e.isItemSelectable,o=e.setVisualFocusItemIndex,r=u(s);n((function(){var e;void 0!==r&&r!==s&&void 0!==r&&-1!==t?e=s.indexOf(r[t]):e=t;if(e!==t)if(i(e))o(e);else{var n=c({isItemSelectable:i,visualFocusItemIndex:e,itemsCount:s.length});o(n)}}),[t,s,i,o,r])}export{f as useCleanVisualFocusOnBlur,F as useKeepFocusOnItemWhenListChanged,v as useSetDefaultItemOnFocusEvent,I as useSupportArrowsKeyboardNavigation,d as useSupportPressItemKeyboardNavigation};
1
+ import{useCallback as e,useMemo as t,useEffect as n,useRef as s}from"react";import{useKeyEvent as i,useEventListener as o}from"@vibe/shared";import{usePrevious as u}from"@vibe/hooks";import{getNextSelectableIndex as c,getPreviousSelectableIndex as r}from"./useActiveDescendantListFocusHelpers.js";import l from"../useListenFocusTriggers/index.js";var a;!function(e){e.UP="ArrowUp",e.DOWN="ArrowDown",e.RIGHT="ArrowRight",e.LEFT="ArrowLeft"}(a||(a={}));var m="Enter";function I(t){var n=t.itemsCount,s=t.focusedElementRef,o=t.visualFocusItemIndex,u=t.setVisualFocusItemIndex,l=t.isHorizontalList,m=t.isItemSelectable,I=t.listenerOptions,d=t.triggeredByKeyboard,f=l?a.RIGHT:a.DOWN,v=l?a.LEFT:a.UP,b=e((function(e){var t;document.activeElement===s.current&&(!d.current&&(d.current=!0,o>-1)||(e===f?t=c({isItemSelectable:m,visualFocusItemIndex:o,itemsCount:n}):e===v&&(t=r({isItemSelectable:m,visualFocusItemIndex:o,itemsCount:n})),t>-1&&t!==o&&u(t)))}),[s,d,f,v,o,u,m,n]),F=e((function(){b(v)}),[v,b]),x=e((function(){b(f)}),[f,b]);i(Object.assign({keys:[f],callback:x},I)),i(Object.assign({keys:[v],callback:F},I))}function d(n){var s=n.visualFocusItemIndex,o=n.focusedElementRef,u=n.itemsCount,c=n.setVisualFocusItemIndex,r=n.onItemClick,l=n.isItemSelectable,a=n.listenerOptions,I=void 0===a?void 0:a,d=n.isIgnoreSpaceAsItemSelection,f=void 0!==d&&d,v=t((function(){return f?[m]:[m," "]}),[f]),b=e((function(e,t){r&&(t>=0&&u>t)&&l(t)&&(s!==t&&c(t),r(e,t))}),[u,r,l,s,c]),F=e((function(e){o.current.contains(document.activeElement)&&b(e,s)}),[b,o,s]);i(Object.assign({keys:v,callback:F},I))}function f(t){var s=t.focusedElementRef,i=t.visualFocusItemIndex,c=t.setVisualFocusItemIndex,r=u(s),l=e((function(){-1!==i&&c(-1)}),[c,i]);n((function(){null===(null==s?void 0:s.current)&&null!==(null==r?void 0:r.current)&&l()}),[s.current,r,l]),o({eventName:"blur",ref:s,callback:l})}function v(t){var n=t.focusedElementRef,i=t.isItemSelectable,o=t.visualFocusItemIndex,u=t.setVisualFocusItemIndex,r=t.itemsCount,a=t.defaultVisualFocusItemIndex,m=void 0===a?-1:a,I=s(!1),d=e((function(){var e;(I.current=!0,o!==m)&&(e=i(m)?m:c({isItemSelectable:i,itemsCount:r,visualFocusItemIndex:m}),u(e))}),[m,i,r,u,I,o]),f=e((function(){I.current=!1}),[I]);return l({ref:n,onFocusByKeyboard:d,onFocusByMouse:f}),{triggeredByKeyboard:I}}function b(e){var t=e.visualFocusItemIndex,s=e.itemsIds,i=e.isItemSelectable,o=e.setVisualFocusItemIndex,r=u(s);n((function(){var e;void 0!==r&&r!==s&&void 0!==r&&-1!==t?e=s.indexOf(r[t]):e=t;if(e!==t)if(i(e))o(e);else{var n=c({isItemSelectable:i,visualFocusItemIndex:e,itemsCount:s.length});o(n)}}),[t,s,i,o,r])}export{f as useCleanVisualFocusOnBlur,b as useKeepFocusOnItemWhenListChanged,v as useSetDefaultItemOnFocusEvent,I as useSupportArrowsKeyboardNavigation,d as useSupportPressItemKeyboardNavigation};
2
2
  //# sourceMappingURL=useActiveDescendantListFocusHooks.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useActiveDescendantListFocusHooks.js","sources":["../../../../../src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.ts"],"sourcesContent":["import { type MutableRefObject } from \"react\";\nimport type React from \"react\";\nimport { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport useKeyEvent, { type UseKeyEventArgs } from \"../useKeyEvent\";\nimport useEventListener from \"../useEventListener\";\nimport usePrevious from \"../usePrevious\";\nimport { getNextSelectableIndex, getPreviousSelectableIndex } from \"./useActiveDescendantListFocusHelpers\";\nimport useListenFocusTriggers from \"../useListenFocusTriggers\";\n\nenum ArrowDirection {\n UP = \"ArrowUp\",\n DOWN = \"ArrowDown\",\n RIGHT = \"ArrowRight\",\n LEFT = \"ArrowLeft\"\n}\n\nconst ENTER_KEY = \"Enter\";\nconst SPACE_KEY = \" \";\n\nexport function useSupportArrowsKeyboardNavigation({\n itemsCount,\n focusedElementRef,\n visualFocusItemIndex,\n setVisualFocusItemIndex,\n isHorizontalList,\n isItemSelectable,\n listenerOptions,\n triggeredByKeyboard\n}: {\n itemsCount: number;\n focusedElementRef: MutableRefObject<HTMLElement>;\n visualFocusItemIndex: number;\n setVisualFocusItemIndex: (index: number) => void;\n isHorizontalList: boolean;\n isItemSelectable: (index: number) => boolean;\n triggeredByKeyboard: MutableRefObject<boolean>;\n listenerOptions: Omit<UseKeyEventArgs, \"keys\" | \"callback\">;\n}) {\n const nextArrow = isHorizontalList ? ArrowDirection.RIGHT : ArrowDirection.DOWN;\n const backArrow = isHorizontalList ? ArrowDirection.LEFT : ArrowDirection.UP;\n\n const onArrowKeyEvent = useCallback(\n (direction: ArrowDirection) => {\n // we desire to change the visual focus item only if the user pressed on the keyboard arrows keys while\n // the focusedElementRef is naturally focus\n if (document.activeElement !== focusedElementRef.current) {\n return;\n }\n\n // If the focusedElementRef is naturally focus but this is the first keyboard interaction of the user, we will mark future user interactions as trigger by keyboard (until the next mouse interaction)\n // that from now on the interactions are trigger by keyboard (until the next mouse interaction)\n if (!triggeredByKeyboard.current) {\n triggeredByKeyboard.current = true;\n\n // If the focusedElementRef is naturally focus but this is the first keyboard interaction of the user, we want only to display the item\n // which right now visually focus without changing it.\n if (visualFocusItemIndex > -1) {\n return;\n }\n }\n\n let newIndex;\n\n // We will change the visual focused item index according to the direction of the pressed arrow\n if (direction === nextArrow) {\n newIndex = getNextSelectableIndex({ isItemSelectable, visualFocusItemIndex, itemsCount });\n } else if (direction === backArrow) {\n newIndex = getPreviousSelectableIndex({ isItemSelectable, visualFocusItemIndex, itemsCount });\n }\n\n if (newIndex > -1 && newIndex !== visualFocusItemIndex) setVisualFocusItemIndex(newIndex);\n },\n [\n focusedElementRef,\n triggeredByKeyboard,\n nextArrow,\n backArrow,\n visualFocusItemIndex,\n setVisualFocusItemIndex,\n isItemSelectable,\n itemsCount\n ]\n );\n const onArrowBack = useCallback(() => {\n onArrowKeyEvent(backArrow);\n }, [backArrow, onArrowKeyEvent]);\n\n const onArrowNext = useCallback(() => {\n onArrowKeyEvent(nextArrow);\n }, [nextArrow, onArrowKeyEvent]);\n\n useKeyEvent({\n keys: [nextArrow],\n callback: onArrowNext,\n ...listenerOptions\n });\n\n useKeyEvent({\n keys: [backArrow],\n callback: onArrowBack,\n ...listenerOptions\n });\n}\n\nexport function useSupportPressItemKeyboardNavigation({\n visualFocusItemIndex,\n focusedElementRef,\n itemsCount,\n setVisualFocusItemIndex,\n onItemClick,\n isItemSelectable,\n listenerOptions = undefined,\n isIgnoreSpaceAsItemSelection = false\n}: {\n visualFocusItemIndex: number;\n focusedElementRef: MutableRefObject<HTMLElement>;\n itemsCount: number;\n setVisualFocusItemIndex: (index: number) => void;\n onItemClick: (event: React.MouseEvent | React.KeyboardEvent, index: number) => void;\n isItemSelectable: (index: number) => boolean;\n listenerOptions: Omit<UseKeyEventArgs, \"keys\" | \"callback\">;\n isIgnoreSpaceAsItemSelection: boolean;\n}) {\n const pressKeys = useMemo(\n () => (isIgnoreSpaceAsItemSelection ? [ENTER_KEY] : [ENTER_KEY, SPACE_KEY]),\n [isIgnoreSpaceAsItemSelection]\n );\n\n const baseOnClickCallback = useCallback(\n (event: React.KeyboardEvent, itemIndex: number) => {\n const hasValidIndex = itemIndex >= 0 && itemIndex < itemsCount;\n if (!onItemClick || !hasValidIndex || !isItemSelectable(itemIndex)) return;\n if (visualFocusItemIndex !== itemIndex) setVisualFocusItemIndex(itemIndex);\n onItemClick(event, itemIndex);\n },\n [itemsCount, onItemClick, isItemSelectable, visualFocusItemIndex, setVisualFocusItemIndex]\n );\n\n const keyboardOnSelectCallback = useCallback(\n (event: React.KeyboardEvent) => {\n // we desire to change the trigger the active item on click callback only if the user pressed on the keyboard arrows keys while\n // the focusedElementRef is naturally focus\n if (focusedElementRef.current.contains(document.activeElement)) {\n baseOnClickCallback(event, visualFocusItemIndex);\n }\n },\n [baseOnClickCallback, focusedElementRef, visualFocusItemIndex]\n );\n\n useKeyEvent({\n keys: pressKeys,\n callback: keyboardOnSelectCallback,\n ...listenerOptions\n });\n}\n\nexport function useCleanVisualFocusOnBlur({\n focusedElementRef,\n visualFocusItemIndex,\n setVisualFocusItemIndex\n}: {\n focusedElementRef: MutableRefObject<HTMLElement>;\n visualFocusItemIndex: number;\n setVisualFocusItemIndex: (index: number) => void;\n}) {\n const previousFocusedElementRef = usePrevious(focusedElementRef);\n\n const onBlurCallback = useCallback(() => {\n if (visualFocusItemIndex !== -1) {\n setVisualFocusItemIndex(-1);\n }\n }, [setVisualFocusItemIndex, visualFocusItemIndex]);\n\n // if element unmount act like element got blur event\n useEffect(() => {\n // if element unmount\n if (focusedElementRef?.current === null && previousFocusedElementRef?.current !== null) {\n onBlurCallback();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [focusedElementRef.current, previousFocusedElementRef, onBlurCallback]);\n\n useEventListener({\n eventName: \"blur\",\n ref: focusedElementRef,\n callback: onBlurCallback\n });\n}\n\nexport function useSetDefaultItemOnFocusEvent({\n focusedElementRef,\n isItemSelectable,\n visualFocusItemIndex,\n setVisualFocusItemIndex,\n itemsCount,\n defaultVisualFocusItemIndex = -1\n}: {\n focusedElementRef: MutableRefObject<HTMLElement>;\n isItemSelectable: (index: number) => boolean;\n visualFocusItemIndex: number;\n setVisualFocusItemIndex: (index: number) => void;\n itemsCount: number;\n defaultVisualFocusItemIndex: number;\n}) {\n const triggeredByKeyboard = useRef(false);\n\n const onFocusByKeyboard = useCallback(() => {\n triggeredByKeyboard.current = true;\n if (visualFocusItemIndex !== defaultVisualFocusItemIndex) {\n let newVisualFocusIndex;\n if (isItemSelectable(defaultVisualFocusItemIndex)) {\n newVisualFocusIndex = defaultVisualFocusItemIndex;\n } else {\n newVisualFocusIndex = getNextSelectableIndex({\n isItemSelectable,\n itemsCount,\n visualFocusItemIndex: defaultVisualFocusItemIndex\n });\n }\n setVisualFocusItemIndex(newVisualFocusIndex);\n }\n }, [\n defaultVisualFocusItemIndex,\n isItemSelectable,\n itemsCount,\n setVisualFocusItemIndex,\n triggeredByKeyboard,\n visualFocusItemIndex\n ]);\n const onFocusByMouse = useCallback(() => {\n triggeredByKeyboard.current = false;\n }, [triggeredByKeyboard]);\n useListenFocusTriggers({ ref: focusedElementRef, onFocusByKeyboard, onFocusByMouse });\n\n return { triggeredByKeyboard };\n}\n\nexport function useKeepFocusOnItemWhenListChanged({\n visualFocusItemIndex,\n itemsIds,\n isItemSelectable,\n setVisualFocusItemIndex\n}: {\n visualFocusItemIndex: number;\n itemsIds: string[];\n isItemSelectable: (index: number) => boolean;\n setVisualFocusItemIndex: (index: number) => void;\n}) {\n const prevItemIds = usePrevious(itemsIds);\n\n // When item list changed, keep the focus on the same item\n useEffect(() => {\n // When the list is changing the index of the focused item is point to a different item then before and\n // this is why we want to search for the new index of the item and change the index to point to it.\n let overrideIndexAfterListChanged;\n const isListChanged = prevItemIds !== undefined && prevItemIds !== itemsIds;\n if (isListChanged && prevItemIds !== undefined && visualFocusItemIndex !== -1) {\n const focusedItemId = prevItemIds[visualFocusItemIndex];\n overrideIndexAfterListChanged = itemsIds.indexOf(focusedItemId);\n } else {\n overrideIndexAfterListChanged = visualFocusItemIndex;\n }\n\n if (overrideIndexAfterListChanged !== visualFocusItemIndex) {\n if (isItemSelectable(overrideIndexAfterListChanged)) {\n setVisualFocusItemIndex(overrideIndexAfterListChanged);\n } else {\n const closestSelectableIndex = getNextSelectableIndex({\n isItemSelectable,\n visualFocusItemIndex: overrideIndexAfterListChanged,\n itemsCount: itemsIds.length\n });\n setVisualFocusItemIndex(closestSelectableIndex);\n }\n }\n }, [visualFocusItemIndex, itemsIds, isItemSelectable, setVisualFocusItemIndex, prevItemIds]);\n}\n"],"names":["ArrowDirection","ENTER_KEY","useSupportArrowsKeyboardNavigation","_ref","itemsCount","focusedElementRef","visualFocusItemIndex","setVisualFocusItemIndex","isHorizontalList","isItemSelectable","listenerOptions","triggeredByKeyboard","nextArrow","RIGHT","DOWN","backArrow","LEFT","UP","onArrowKeyEvent","useCallback","direction","newIndex","document","activeElement","current","getNextSelectableIndex","getPreviousSelectableIndex","onArrowBack","onArrowNext","useKeyEvent","Object","assign","keys","callback","useSupportPressItemKeyboardNavigation","_ref2","onItemClick","_ref2$listenerOptions","undefined","_ref2$isIgnoreSpaceAs","isIgnoreSpaceAsItemSelection","pressKeys","useMemo","baseOnClickCallback","event","itemIndex","keyboardOnSelectCallback","contains","useCleanVisualFocusOnBlur","_ref3","previousFocusedElementRef","usePrevious","onBlurCallback","useEffect","useEventListener","eventName","ref","useSetDefaultItemOnFocusEvent","_ref4","_ref4$defaultVisualFo","defaultVisualFocusItemIndex","useRef","onFocusByKeyboard","newVisualFocusIndex","onFocusByMouse","useListenFocusTriggers","useKeepFocusOnItemWhenListChanged","_ref5","itemsIds","prevItemIds","overrideIndexAfterListChanged","indexOf","closestSelectableIndex","length"],"mappings":"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"}
1
+ {"version":3,"file":"useActiveDescendantListFocusHooks.js","sources":["../../../../../src/hooks/useActiveDescendantListFocus/useActiveDescendantListFocusHooks.ts"],"sourcesContent":["import { type MutableRefObject } from \"react\";\nimport type React from \"react\";\nimport { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport useKeyEvent, { type UseKeyEventArgs } from \"../useKeyEvent\";\nimport useEventListener from \"../useEventListener\";\nimport { usePrevious } from \"@vibe/hooks\";\nimport { getNextSelectableIndex, getPreviousSelectableIndex } from \"./useActiveDescendantListFocusHelpers\";\nimport useListenFocusTriggers from \"../useListenFocusTriggers\";\n\nenum ArrowDirection {\n UP = \"ArrowUp\",\n DOWN = \"ArrowDown\",\n RIGHT = \"ArrowRight\",\n LEFT = \"ArrowLeft\"\n}\n\nconst ENTER_KEY = \"Enter\";\nconst SPACE_KEY = \" \";\n\nexport function useSupportArrowsKeyboardNavigation({\n itemsCount,\n focusedElementRef,\n visualFocusItemIndex,\n setVisualFocusItemIndex,\n isHorizontalList,\n isItemSelectable,\n listenerOptions,\n triggeredByKeyboard\n}: {\n itemsCount: number;\n focusedElementRef: MutableRefObject<HTMLElement>;\n visualFocusItemIndex: number;\n setVisualFocusItemIndex: (index: number) => void;\n isHorizontalList: boolean;\n isItemSelectable: (index: number) => boolean;\n triggeredByKeyboard: MutableRefObject<boolean>;\n listenerOptions: Omit<UseKeyEventArgs, \"keys\" | \"callback\">;\n}) {\n const nextArrow = isHorizontalList ? ArrowDirection.RIGHT : ArrowDirection.DOWN;\n const backArrow = isHorizontalList ? ArrowDirection.LEFT : ArrowDirection.UP;\n\n const onArrowKeyEvent = useCallback(\n (direction: ArrowDirection) => {\n // we desire to change the visual focus item only if the user pressed on the keyboard arrows keys while\n // the focusedElementRef is naturally focus\n if (document.activeElement !== focusedElementRef.current) {\n return;\n }\n\n // If the focusedElementRef is naturally focus but this is the first keyboard interaction of the user, we will mark future user interactions as trigger by keyboard (until the next mouse interaction)\n // that from now on the interactions are trigger by keyboard (until the next mouse interaction)\n if (!triggeredByKeyboard.current) {\n triggeredByKeyboard.current = true;\n\n // If the focusedElementRef is naturally focus but this is the first keyboard interaction of the user, we want only to display the item\n // which right now visually focus without changing it.\n if (visualFocusItemIndex > -1) {\n return;\n }\n }\n\n let newIndex;\n\n // We will change the visual focused item index according to the direction of the pressed arrow\n if (direction === nextArrow) {\n newIndex = getNextSelectableIndex({ isItemSelectable, visualFocusItemIndex, itemsCount });\n } else if (direction === backArrow) {\n newIndex = getPreviousSelectableIndex({ isItemSelectable, visualFocusItemIndex, itemsCount });\n }\n\n if (newIndex > -1 && newIndex !== visualFocusItemIndex) setVisualFocusItemIndex(newIndex);\n },\n [\n focusedElementRef,\n triggeredByKeyboard,\n nextArrow,\n backArrow,\n visualFocusItemIndex,\n setVisualFocusItemIndex,\n isItemSelectable,\n itemsCount\n ]\n );\n const onArrowBack = useCallback(() => {\n onArrowKeyEvent(backArrow);\n }, [backArrow, onArrowKeyEvent]);\n\n const onArrowNext = useCallback(() => {\n onArrowKeyEvent(nextArrow);\n }, [nextArrow, onArrowKeyEvent]);\n\n useKeyEvent({\n keys: [nextArrow],\n callback: onArrowNext,\n ...listenerOptions\n });\n\n useKeyEvent({\n keys: [backArrow],\n callback: onArrowBack,\n ...listenerOptions\n });\n}\n\nexport function useSupportPressItemKeyboardNavigation({\n visualFocusItemIndex,\n focusedElementRef,\n itemsCount,\n setVisualFocusItemIndex,\n onItemClick,\n isItemSelectable,\n listenerOptions = undefined,\n isIgnoreSpaceAsItemSelection = false\n}: {\n visualFocusItemIndex: number;\n focusedElementRef: MutableRefObject<HTMLElement>;\n itemsCount: number;\n setVisualFocusItemIndex: (index: number) => void;\n onItemClick: (event: React.MouseEvent | React.KeyboardEvent, index: number) => void;\n isItemSelectable: (index: number) => boolean;\n listenerOptions: Omit<UseKeyEventArgs, \"keys\" | \"callback\">;\n isIgnoreSpaceAsItemSelection: boolean;\n}) {\n const pressKeys = useMemo(\n () => (isIgnoreSpaceAsItemSelection ? [ENTER_KEY] : [ENTER_KEY, SPACE_KEY]),\n [isIgnoreSpaceAsItemSelection]\n );\n\n const baseOnClickCallback = useCallback(\n (event: React.KeyboardEvent, itemIndex: number) => {\n const hasValidIndex = itemIndex >= 0 && itemIndex < itemsCount;\n if (!onItemClick || !hasValidIndex || !isItemSelectable(itemIndex)) return;\n if (visualFocusItemIndex !== itemIndex) setVisualFocusItemIndex(itemIndex);\n onItemClick(event, itemIndex);\n },\n [itemsCount, onItemClick, isItemSelectable, visualFocusItemIndex, setVisualFocusItemIndex]\n );\n\n const keyboardOnSelectCallback = useCallback(\n (event: React.KeyboardEvent) => {\n // we desire to change the trigger the active item on click callback only if the user pressed on the keyboard arrows keys while\n // the focusedElementRef is naturally focus\n if (focusedElementRef.current.contains(document.activeElement)) {\n baseOnClickCallback(event, visualFocusItemIndex);\n }\n },\n [baseOnClickCallback, focusedElementRef, visualFocusItemIndex]\n );\n\n useKeyEvent({\n keys: pressKeys,\n callback: keyboardOnSelectCallback,\n ...listenerOptions\n });\n}\n\nexport function useCleanVisualFocusOnBlur({\n focusedElementRef,\n visualFocusItemIndex,\n setVisualFocusItemIndex\n}: {\n focusedElementRef: MutableRefObject<HTMLElement>;\n visualFocusItemIndex: number;\n setVisualFocusItemIndex: (index: number) => void;\n}) {\n const previousFocusedElementRef = usePrevious(focusedElementRef);\n\n const onBlurCallback = useCallback(() => {\n if (visualFocusItemIndex !== -1) {\n setVisualFocusItemIndex(-1);\n }\n }, [setVisualFocusItemIndex, visualFocusItemIndex]);\n\n // if element unmount act like element got blur event\n useEffect(() => {\n // if element unmount\n if (focusedElementRef?.current === null && previousFocusedElementRef?.current !== null) {\n onBlurCallback();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [focusedElementRef.current, previousFocusedElementRef, onBlurCallback]);\n\n useEventListener({\n eventName: \"blur\",\n ref: focusedElementRef,\n callback: onBlurCallback\n });\n}\n\nexport function useSetDefaultItemOnFocusEvent({\n focusedElementRef,\n isItemSelectable,\n visualFocusItemIndex,\n setVisualFocusItemIndex,\n itemsCount,\n defaultVisualFocusItemIndex = -1\n}: {\n focusedElementRef: MutableRefObject<HTMLElement>;\n isItemSelectable: (index: number) => boolean;\n visualFocusItemIndex: number;\n setVisualFocusItemIndex: (index: number) => void;\n itemsCount: number;\n defaultVisualFocusItemIndex: number;\n}) {\n const triggeredByKeyboard = useRef(false);\n\n const onFocusByKeyboard = useCallback(() => {\n triggeredByKeyboard.current = true;\n if (visualFocusItemIndex !== defaultVisualFocusItemIndex) {\n let newVisualFocusIndex;\n if (isItemSelectable(defaultVisualFocusItemIndex)) {\n newVisualFocusIndex = defaultVisualFocusItemIndex;\n } else {\n newVisualFocusIndex = getNextSelectableIndex({\n isItemSelectable,\n itemsCount,\n visualFocusItemIndex: defaultVisualFocusItemIndex\n });\n }\n setVisualFocusItemIndex(newVisualFocusIndex);\n }\n }, [\n defaultVisualFocusItemIndex,\n isItemSelectable,\n itemsCount,\n setVisualFocusItemIndex,\n triggeredByKeyboard,\n visualFocusItemIndex\n ]);\n const onFocusByMouse = useCallback(() => {\n triggeredByKeyboard.current = false;\n }, [triggeredByKeyboard]);\n useListenFocusTriggers({ ref: focusedElementRef, onFocusByKeyboard, onFocusByMouse });\n\n return { triggeredByKeyboard };\n}\n\nexport function useKeepFocusOnItemWhenListChanged({\n visualFocusItemIndex,\n itemsIds,\n isItemSelectable,\n setVisualFocusItemIndex\n}: {\n visualFocusItemIndex: number;\n itemsIds: string[];\n isItemSelectable: (index: number) => boolean;\n setVisualFocusItemIndex: (index: number) => void;\n}) {\n const prevItemIds = usePrevious(itemsIds);\n\n // When item list changed, keep the focus on the same item\n useEffect(() => {\n // When the list is changing the index of the focused item is point to a different item then before and\n // this is why we want to search for the new index of the item and change the index to point to it.\n let overrideIndexAfterListChanged;\n const isListChanged = prevItemIds !== undefined && prevItemIds !== itemsIds;\n if (isListChanged && prevItemIds !== undefined && visualFocusItemIndex !== -1) {\n const focusedItemId = prevItemIds[visualFocusItemIndex];\n overrideIndexAfterListChanged = itemsIds.indexOf(focusedItemId);\n } else {\n overrideIndexAfterListChanged = visualFocusItemIndex;\n }\n\n if (overrideIndexAfterListChanged !== visualFocusItemIndex) {\n if (isItemSelectable(overrideIndexAfterListChanged)) {\n setVisualFocusItemIndex(overrideIndexAfterListChanged);\n } else {\n const closestSelectableIndex = getNextSelectableIndex({\n isItemSelectable,\n visualFocusItemIndex: overrideIndexAfterListChanged,\n itemsCount: itemsIds.length\n });\n setVisualFocusItemIndex(closestSelectableIndex);\n }\n }\n }, [visualFocusItemIndex, itemsIds, isItemSelectable, setVisualFocusItemIndex, prevItemIds]);\n}\n"],"names":["ArrowDirection","ENTER_KEY","useSupportArrowsKeyboardNavigation","_ref","itemsCount","focusedElementRef","visualFocusItemIndex","setVisualFocusItemIndex","isHorizontalList","isItemSelectable","listenerOptions","triggeredByKeyboard","nextArrow","RIGHT","DOWN","backArrow","LEFT","UP","onArrowKeyEvent","useCallback","direction","newIndex","document","activeElement","current","getNextSelectableIndex","getPreviousSelectableIndex","onArrowBack","onArrowNext","useKeyEvent","Object","assign","keys","callback","useSupportPressItemKeyboardNavigation","_ref2","onItemClick","_ref2$listenerOptions","undefined","_ref2$isIgnoreSpaceAs","isIgnoreSpaceAsItemSelection","pressKeys","useMemo","baseOnClickCallback","event","itemIndex","keyboardOnSelectCallback","contains","useCleanVisualFocusOnBlur","_ref3","previousFocusedElementRef","usePrevious","onBlurCallback","useEffect","useEventListener","eventName","ref","useSetDefaultItemOnFocusEvent","_ref4","_ref4$defaultVisualFo","defaultVisualFocusItemIndex","useRef","onFocusByKeyboard","newVisualFocusIndex","onFocusByMouse","useListenFocusTriggers","useKeepFocusOnItemWhenListChanged","_ref5","itemsIds","prevItemIds","overrideIndexAfterListChanged","indexOf","closestSelectableIndex","length"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useState as e,useEffect as o,useCallback as u}from"react";import{useEventListener as c}from"@vibe/shared";import a from"../usePrevious/index.js";function l(l){var n=l.ref,t=l.focusCallback,f=l.blurCallback,i=e(!1),s=r(i,2),b=s[0],m=s[1],v=a(b);o((function(){void 0!==v&&(b?t&&t():f&&f())}),[f,t,b,v]);var p=u((function(){n.current.focus()}),[n]),d=u((function(){n.current.blur()}),[n]);return c({eventName:"focus",ref:n,callback:function(){m(!0)}}),c({eventName:"blur",ref:n,callback:function(){m(!1)}}),{isFocused:b,focus:p,blur:d}}export{l as default};
1
+ import{slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useState as o,useEffect as e,useCallback as u}from"react";import{useEventListener as c}from"@vibe/shared";import{usePrevious as a}from"@vibe/hooks";function l(l){var t=l.ref,f=l.focusCallback,n=l.blurCallback,i=o(!1),s=r(i,2),b=s[0],m=s[1],v=a(b);e((function(){void 0!==v&&(b?f&&f():n&&n())}),[n,f,b,v]);var p=u((function(){t.current.focus()}),[t]),d=u((function(){t.current.blur()}),[t]);return c({eventName:"focus",ref:t,callback:function(){m(!0)}}),c({eventName:"blur",ref:t,callback:function(){m(!1)}}),{isFocused:b,focus:p,blur:d}}export{l as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../src/hooks/useSetFocus/index.ts"],"sourcesContent":["import { type RefObject, useCallback, useEffect, useState } from \"react\";\nimport useEventListener from \"../useEventListener\";\nimport usePrevious from \"../../hooks/usePrevious\";\n\n// TODO: [breaking] rename to useFocus? and maybe change signature to be like useHover?\nexport default function useSetFocus({\n ref,\n focusCallback,\n blurCallback\n}: {\n ref: RefObject<HTMLElement>;\n focusCallback?: () => void;\n blurCallback?: () => void;\n}) {\n const [isFocused, setIsFocused] = useState(false);\n const isFocusedPrev = usePrevious(isFocused);\n\n useEffect(() => {\n if (isFocusedPrev === undefined) {\n // Don't call callback on first render\n return;\n }\n\n // Calling back from here to be sure that isFocused value have already been updated\n if (isFocused) {\n focusCallback && focusCallback();\n } else {\n blurCallback && blurCallback();\n }\n }, [blurCallback, focusCallback, isFocused, isFocusedPrev]);\n\n const focus = useCallback(() => {\n ref.current.focus();\n }, [ref]);\n\n const blur = useCallback(() => {\n ref.current.blur();\n }, [ref]);\n\n const onFocus = () => {\n setIsFocused(true);\n };\n\n const onBlur = () => {\n setIsFocused(false);\n };\n\n useEventListener({\n eventName: \"focus\",\n ref,\n callback: onFocus\n });\n\n useEventListener({\n eventName: \"blur\",\n ref,\n callback: onBlur\n });\n\n return { isFocused, focus, blur };\n}\n"],"names":["useSetFocus","_ref","ref","focusCallback","blurCallback","_useState","useState","_useState2","_slicedToArray","isFocused","setIsFocused","isFocusedPrev","usePrevious","useEffect","undefined","focus","useCallback","current","blur","useEventListener","eventName","callback"],"mappings":"uOAKc,SAAUA,EAAWC,GAQlC,IAPCC,EAAGD,EAAHC,IACAC,EAAaF,EAAbE,cACAC,EAAYH,EAAZG,aAMAC,EAAkCC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAA1CI,EAASF,EAAA,GAAEG,EAAYH,EAAA,GACxBI,EAAgBC,EAAYH,GAElCI,GAAU,gBACcC,IAAlBH,IAMAF,EACFN,GAAiBA,IAEjBC,GAAgBA,IAEnB,GAAE,CAACA,EAAcD,EAAeM,EAAWE,IAE5C,IAAMI,EAAQC,GAAY,WACxBd,EAAIe,QAAQF,OACd,GAAG,CAACb,IAEEgB,EAAOF,GAAY,WACvBd,EAAIe,QAAQC,MACd,GAAG,CAAChB,IAsBJ,OAZAiB,EAAiB,CACfC,UAAW,QACXlB,IAAAA,EACAmB,SAXc,WACdX,GAAa,MAafS,EAAiB,CACfC,UAAW,OACXlB,IAAAA,EACAmB,SAba,WACbX,GAAa,MAeR,CAAED,UAAAA,EAAWM,MAAAA,EAAOG,KAAAA,EAC7B"}
1
+ {"version":3,"file":"index.js","sources":["../../../../../src/hooks/useSetFocus/index.ts"],"sourcesContent":["import { type RefObject, useCallback, useEffect, useState } from \"react\";\nimport useEventListener from \"../useEventListener\";\nimport { usePrevious } from \"@vibe/hooks\";\n\n// TODO: [breaking] rename to useFocus? and maybe change signature to be like useHover?\nexport default function useSetFocus({\n ref,\n focusCallback,\n blurCallback\n}: {\n ref: RefObject<HTMLElement>;\n focusCallback?: () => void;\n blurCallback?: () => void;\n}) {\n const [isFocused, setIsFocused] = useState(false);\n const isFocusedPrev = usePrevious(isFocused);\n\n useEffect(() => {\n if (isFocusedPrev === undefined) {\n // Don't call callback on first render\n return;\n }\n\n // Calling back from here to be sure that isFocused value have already been updated\n if (isFocused) {\n focusCallback && focusCallback();\n } else {\n blurCallback && blurCallback();\n }\n }, [blurCallback, focusCallback, isFocused, isFocusedPrev]);\n\n const focus = useCallback(() => {\n ref.current.focus();\n }, [ref]);\n\n const blur = useCallback(() => {\n ref.current.blur();\n }, [ref]);\n\n const onFocus = () => {\n setIsFocused(true);\n };\n\n const onBlur = () => {\n setIsFocused(false);\n };\n\n useEventListener({\n eventName: \"focus\",\n ref,\n callback: onFocus\n });\n\n useEventListener({\n eventName: \"blur\",\n ref,\n callback: onBlur\n });\n\n return { isFocused, focus, blur };\n}\n"],"names":["useSetFocus","_ref","ref","focusCallback","blurCallback","_useState","useState","_useState2","_slicedToArray","isFocused","setIsFocused","isFocusedPrev","usePrevious","useEffect","undefined","focus","useCallback","current","blur","useEventListener","eventName","callback"],"mappings":"0OAKc,SAAUA,EAAWC,GAQlC,IAPCC,EAAGD,EAAHC,IACAC,EAAaF,EAAbE,cACAC,EAAYH,EAAZG,aAMAC,EAAkCC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAA1CI,EAASF,EAAA,GAAEG,EAAYH,EAAA,GACxBI,EAAgBC,EAAYH,GAElCI,GAAU,gBACcC,IAAlBH,IAMAF,EACFN,GAAiBA,IAEjBC,GAAgBA,IAEnB,GAAE,CAACA,EAAcD,EAAeM,EAAWE,IAE5C,IAAMI,EAAQC,GAAY,WACxBd,EAAIe,QAAQF,OACd,GAAG,CAACb,IAEEgB,EAAOF,GAAY,WACvBd,EAAIe,QAAQC,MACd,GAAG,CAAChB,IAsBJ,OAZAiB,EAAiB,CACfC,UAAW,QACXlB,IAAAA,EACAmB,SAXc,WACdX,GAAa,MAafS,EAAiB,CACfC,UAAW,OACXlB,IAAAA,EACAmB,SAba,WACbX,GAAa,MAeR,CAAED,UAAAA,EAAWM,MAAAA,EAAOG,KAAAA,EAC7B"}