@vibe/core 3.36.0-alpha-94da6.0 → 3.36.0

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 (617) hide show
  1. package/dist/components/Accordion/Accordion/Accordion.d.ts +3 -15
  2. package/dist/components/Accordion/AccordionItem/AccordionItem.d.ts +9 -17
  3. package/dist/components/AlertBanner/AlertBanner.d.ts +16 -3
  4. package/dist/components/AlertBanner/AlertBannerButton/AlertBannerButton.d.ts +3 -0
  5. package/dist/components/AlertBanner/AlertBannerLink/AlertBannerLink.d.ts +3 -0
  6. package/dist/components/AlertBanner/AlertBannerText/AlertBannerText.d.ts +6 -0
  7. package/dist/components/AttentionBox/AttentionBox.d.ts +36 -4
  8. package/dist/components/Avatar/Avatar.d.ts +70 -3
  9. package/dist/components/Avatar/AvatarBadge.d.ts +10 -2
  10. package/dist/components/Avatar/AvatarContent.d.ts +24 -1
  11. package/dist/components/AvatarGroup/AvatarGroup.d.ts +17 -5
  12. package/dist/components/AvatarGroup/AvatarGroupCounter.d.ts +20 -2
  13. package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContainer.d.ts +20 -3
  14. package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContent.d.ts +10 -2
  15. package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.d.ts +13 -1
  16. package/dist/components/Badge/Badge.d.ts +15 -0
  17. package/dist/components/Badge/Indicator/Indicator.d.ts +3 -0
  18. package/dist/components/BaseInput/BaseInput.types.d.ts +8 -15
  19. package/dist/components/BaseListItem/BaseListItem.types.d.ts +2 -2
  20. package/dist/components/Box/Box.d.ts +75 -0
  21. package/dist/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.d.ts +24 -0
  22. package/dist/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.d.ts +24 -7
  23. package/dist/components/BreadcrumbsBar/BreadcrumbsBar.d.ts +6 -1
  24. package/dist/components/ButtonGroup/ButtonGroup.d.ts +46 -1
  25. package/dist/components/ButtonGroup/ButtonWrapper.d.ts +16 -1
  26. package/dist/components/Checkbox/Checkbox.d.ts +42 -18
  27. package/dist/components/Chips/Chips.d.ts +54 -20
  28. package/dist/components/Clickable/Clickable.d.ts +41 -5
  29. package/dist/components/Clickable/ClickableWrapper.d.ts +9 -0
  30. package/dist/components/ColorPicker/ColorPicker.d.ts +43 -1
  31. package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.d.ts +9 -0
  32. package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.d.ts +39 -0
  33. package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.d.ts +48 -0
  34. package/dist/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.d.ts +33 -1
  35. package/dist/components/Combobox/Combobox.d.ts +78 -25
  36. package/dist/components/Combobox/components/ComboboxCategory/ComboboxCategory.d.ts +6 -0
  37. package/dist/components/Combobox/components/ComboboxConstants.d.ts +156 -0
  38. package/dist/components/Combobox/components/ComboboxItems/ComboboxItems.d.ts +45 -0
  39. package/dist/components/Combobox/components/ComboboxOption/ComboboxOption.d.ts +30 -0
  40. package/dist/components/Counter/Counter.d.ts +33 -14
  41. package/dist/components/DatePicker/DateNavigationItem/DateNavigationItem.d.ts +6 -0
  42. package/dist/components/DatePicker/DatePicker.d.ts +39 -13
  43. package/dist/components/DatePicker/DatePickerHeader/DatePickerHeader.d.ts +18 -0
  44. package/dist/components/DatePicker/YearPicker/YearPicker.d.ts +12 -0
  45. package/dist/components/DatePicker/YearPicker/YearsList.d.ts +12 -0
  46. package/dist/components/DatePicker/types.d.ts +6 -0
  47. package/dist/components/Dialog/Dialog.d.ts +59 -36
  48. package/dist/components/Dialog/DialogContent/DialogContent.d.ts +52 -3
  49. package/dist/components/DialogContentContainer/DialogContentContainer.d.ts +18 -0
  50. package/dist/components/Divider/Divider.d.ts +2 -2
  51. package/dist/components/Dropdown/Dropdown.types.d.ts +97 -63
  52. package/dist/components/EditableHeading/EditableHeading.d.ts +4 -3
  53. package/dist/components/EditableText/EditableText.d.ts +6 -4
  54. package/dist/components/EditableTypography/EditableTypography.d.ts +48 -16
  55. package/dist/components/ExpandCollapse/ExpandCollapse.d.ts +20 -8
  56. package/dist/components/FieldLabel/FieldLabel.d.ts +18 -0
  57. package/dist/components/Flex/Flex.d.ts +36 -2
  58. package/dist/components/FormattedNumber/FormattedNumber.d.ts +8 -8
  59. package/dist/components/GridKeyboardNavigationContext/GridKeyboardNavigationContextConstants.d.ts +3 -0
  60. package/dist/components/Heading/Heading.d.ts +15 -0
  61. package/dist/components/HiddenText/HiddenText.d.ts +3 -0
  62. package/dist/components/Icon/CustomSvgIcon/CustomSvgIcon.d.ts +30 -0
  63. package/dist/components/Icon/FontIcon/FontIcon.d.ts +18 -0
  64. package/dist/components/Icon/Icon.d.ts +32 -8
  65. package/dist/components/IconButton/IconButton.d.ts +37 -27
  66. package/dist/components/Label/Label.d.ts +22 -1
  67. package/dist/components/Label/LabelCelebrationAnimation.d.ts +6 -0
  68. package/dist/components/LayerProvider/LayerContext.d.ts +3 -0
  69. package/dist/components/LayerProvider/LayerProvider.d.ts +7 -1
  70. package/dist/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.d.ts +0 -8
  71. package/dist/components/Link/Link.d.ts +40 -14
  72. package/dist/components/List/List.d.ts +14 -5
  73. package/dist/components/List/VirtualizedListItems/VirtualizedListItems.d.ts +3 -0
  74. package/dist/components/ListItem/ListItem.d.ts +12 -25
  75. package/dist/components/ListItemAvatar/ListItemAvatar.d.ts +7 -1
  76. package/dist/components/ListItemIcon/ListItemIcon.d.ts +5 -2
  77. package/dist/components/ListTitle/ListTitle.d.ts +6 -0
  78. package/dist/components/Loader/Loader.d.ts +12 -2
  79. package/dist/components/Menu/Menu/Menu.d.ts +42 -0
  80. package/dist/components/Menu/MenuGridItem/MenuGridItem.d.ts +33 -5
  81. package/dist/components/Menu/MenuItem/AvatarMenuItem.d.ts +6 -0
  82. package/dist/components/Menu/MenuItem/MenuItem.d.ts +97 -7
  83. package/dist/components/Menu/MenuItem/components/BaseMenuItem/BaseMenuItem.types.d.ts +7 -0
  84. package/dist/components/Menu/MenuItem/components/MenuItemIcon/MenuItemIcon.types.d.ts +7 -6
  85. package/dist/components/Menu/MenuItem/components/MenuItemSubMenu/MenuItemSubMenu.types.d.ts +7 -3
  86. package/dist/components/Menu/MenuItem/components/MenuItemSubMenuIcon/MenuItemSubMenuIcon.types.d.ts +5 -1
  87. package/dist/components/Menu/MenuItemButton/MenuItemButton.d.ts +51 -0
  88. package/dist/components/Menu/MenuTitle/MenuTitle.d.ts +6 -0
  89. package/dist/components/MenuButton/MenuButton.d.ts +67 -19
  90. package/dist/components/Modal/ModalContent/ModalContent.types.d.ts +1 -1
  91. package/dist/components/Modal/ModalMedia/ModalMedia.types.d.ts +1 -1
  92. package/dist/components/Modal/ModalTopActions/ModalTopActions.types.d.ts +5 -5
  93. package/dist/components/Modal/context/ModalContext.types.d.ts +5 -5
  94. package/dist/components/Modal/footers/ModalFooter/ModalFooter.types.d.ts +1 -1
  95. package/dist/components/Modal/footers/ModalFooterBase/ModalFooterBase.types.d.ts +3 -3
  96. package/dist/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.types.d.ts +4 -4
  97. package/dist/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.types.d.ts +1 -1
  98. package/dist/components/Modal/layouts/ModalFooterShadow.types.d.ts +1 -1
  99. package/dist/components/Modal/layouts/ModalLayoutScrollableContent.types.d.ts +2 -2
  100. package/dist/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.types.d.ts +1 -1
  101. package/dist/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.types.d.ts +1 -1
  102. package/dist/components/MultiStepIndicator/MultiStepIndicator.d.ts +30 -0
  103. package/dist/components/MultiStepIndicator/components/StepIndicator/StepIndicator.d.ts +57 -0
  104. package/dist/components/ProgressBars/LinearProgressBar/Bar/Bar.d.ts +17 -6
  105. package/dist/components/ProgressBars/LinearProgressBar/LinearProgressBar.d.ts +19 -22
  106. package/dist/components/ProgressBars/PercentageLabel/PercentageLabel.d.ts +2 -2
  107. package/dist/components/RadioButton/RadioButton.d.ts +45 -16
  108. package/dist/components/Search/Search.types.d.ts +24 -24
  109. package/dist/components/Skeleton/Skeleton.d.ts +16 -1
  110. package/dist/components/SlideTransition/SlideTransition.types.d.ts +12 -0
  111. package/dist/components/Slider/SelectionIndicator.d.ts +6 -0
  112. package/dist/components/Slider/SliderBase/SliderFilledTrack.d.ts +6 -8
  113. package/dist/components/Slider/SliderBase/SliderRail.d.ts +6 -4
  114. package/dist/components/Slider/SliderBase/SliderThumb.d.ts +9 -7
  115. package/dist/components/Slider/SliderBase/SliderTrack.d.ts +1 -2
  116. package/dist/components/Slider/SliderContext.d.ts +13 -8
  117. package/dist/components/Slider/SliderInfix.d.ts +1 -2
  118. package/dist/components/SplitButton/SplitButton.d.ts +25 -2
  119. package/dist/components/Steps/Steps.d.ts +32 -2
  120. package/dist/components/Steps/StepsCommand.d.ts +21 -0
  121. package/dist/components/Steps/StepsDot.d.ts +15 -0
  122. package/dist/components/Steps/StepsGalleryHeader.d.ts +15 -0
  123. package/dist/components/Steps/StepsHeader.d.ts +33 -0
  124. package/dist/components/Steps/StepsNumbersHeader.d.ts +9 -0
  125. package/dist/components/Switch/Switch.d.ts +39 -0
  126. package/dist/components/Table/Table/Table.d.ts +42 -0
  127. package/dist/components/Table/TableBody/TableBody.d.ts +3 -0
  128. package/dist/components/Table/TableCell/TableCell.d.ts +6 -0
  129. package/dist/components/Table/TableCellSkeleton/TableCellSkeleton.d.ts +6 -0
  130. package/dist/components/Table/TableContainer/TableContainer.types.d.ts +6 -0
  131. package/dist/components/Table/TableHeader/TableHeader.d.ts +3 -0
  132. package/dist/components/Table/TableHeaderCell/TableHeaderCell.d.ts +21 -0
  133. package/dist/components/Table/TableRow/TableRow.d.ts +7 -1
  134. package/dist/components/Table/TableRowMenu/TableRowMenu.types.d.ts +6 -0
  135. package/dist/components/Table/TableVirtualizedBody/TableVirtualizedBody.d.ts +15 -0
  136. package/dist/components/Tabs/Tab/Tab.d.ts +27 -3
  137. package/dist/components/Tabs/TabList/TabList.d.ts +15 -0
  138. package/dist/components/Tabs/TabPanel/TabPanel.d.ts +6 -0
  139. package/dist/components/Tabs/TabPanels/TabPanels.d.ts +9 -0
  140. package/dist/components/Tabs/TabsContext/TabsContext.d.ts +6 -0
  141. package/dist/components/Text/Text.d.ts +9 -0
  142. package/dist/components/TextArea/TextArea.types.d.ts +13 -16
  143. package/dist/components/TextField/TextField.d.ts +127 -9
  144. package/dist/components/TextWithHighlight/TextWithHighlight.d.ts +33 -6
  145. package/dist/components/ThemeProvider/ThemeProvider.d.ts +8 -5
  146. package/dist/components/Tipseen/Tipseen.d.ts +64 -6
  147. package/dist/components/Tipseen/TipseenBasicContent.d.ts +9 -0
  148. package/dist/components/Tipseen/TipseenContent.d.ts +25 -1
  149. package/dist/components/Tipseen/TipseenImage.d.ts +12 -0
  150. package/dist/components/Tipseen/TipseenMedia/TipseenMedia.d.ts +3 -0
  151. package/dist/components/Tipseen/TipseenTitle.d.ts +3 -0
  152. package/dist/components/Tipseen/TipseenWizard.d.ts +7 -1
  153. package/dist/components/Toast/Toast.d.ts +37 -8
  154. package/dist/components/Toggle/MockToggle.d.ts +21 -0
  155. package/dist/components/Toggle/Toggle.d.ts +37 -1
  156. package/dist/components/Toggle/ToggleText.d.ts +6 -0
  157. package/dist/components/Tooltip/Tooltip.d.ts +64 -27
  158. package/dist/components/TransitionView/TransitionView.types.d.ts +9 -0
  159. package/dist/components/Typography/Typography.d.ts +12 -6
  160. package/dist/components/VirtualizedGrid/VirtualizedGrid.d.ts +19 -19
  161. package/dist/components/VirtualizedList/VirtualizedList.d.ts +33 -27
  162. package/dist/hooks/useKeyEvent/index.d.ts +30 -0
  163. package/dist/hooks/useSwitch/index.d.ts +12 -0
  164. package/dist/hooks/useWizard/useWizard.types.d.ts +33 -0
  165. package/dist/mocked_classnames/components/Accordion/Accordion/Accordion.d.ts +3 -15
  166. package/dist/mocked_classnames/components/Accordion/AccordionItem/AccordionItem.d.ts +9 -17
  167. package/dist/mocked_classnames/components/AlertBanner/AlertBanner.d.ts +16 -3
  168. package/dist/mocked_classnames/components/AlertBanner/AlertBannerButton/AlertBannerButton.d.ts +3 -0
  169. package/dist/mocked_classnames/components/AlertBanner/AlertBannerLink/AlertBannerLink.d.ts +3 -0
  170. package/dist/mocked_classnames/components/AlertBanner/AlertBannerText/AlertBannerText.d.ts +6 -0
  171. package/dist/mocked_classnames/components/AttentionBox/AttentionBox.d.ts +36 -4
  172. package/dist/mocked_classnames/components/Avatar/Avatar.d.ts +70 -3
  173. package/dist/mocked_classnames/components/Avatar/AvatarBadge.d.ts +10 -2
  174. package/dist/mocked_classnames/components/Avatar/AvatarContent.d.ts +24 -1
  175. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroup.d.ts +17 -5
  176. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounter.d.ts +20 -2
  177. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContainer.d.ts +20 -3
  178. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContent.d.ts +10 -2
  179. package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.d.ts +13 -1
  180. package/dist/mocked_classnames/components/Badge/Badge.d.ts +15 -0
  181. package/dist/mocked_classnames/components/Badge/Indicator/Indicator.d.ts +3 -0
  182. package/dist/mocked_classnames/components/BaseInput/BaseInput.types.d.ts +8 -15
  183. package/dist/mocked_classnames/components/BaseListItem/BaseListItem.types.d.ts +2 -2
  184. package/dist/mocked_classnames/components/Box/Box.d.ts +75 -0
  185. package/dist/mocked_classnames/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.d.ts +24 -0
  186. package/dist/mocked_classnames/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.d.ts +24 -7
  187. package/dist/mocked_classnames/components/BreadcrumbsBar/BreadcrumbsBar.d.ts +6 -1
  188. package/dist/mocked_classnames/components/ButtonGroup/ButtonGroup.d.ts +46 -1
  189. package/dist/mocked_classnames/components/ButtonGroup/ButtonWrapper.d.ts +16 -1
  190. package/dist/mocked_classnames/components/Checkbox/Checkbox.d.ts +42 -18
  191. package/dist/mocked_classnames/components/Chips/Chips.d.ts +54 -20
  192. package/dist/mocked_classnames/components/Clickable/Clickable.d.ts +41 -5
  193. package/dist/mocked_classnames/components/Clickable/ClickableWrapper.d.ts +9 -0
  194. package/dist/mocked_classnames/components/ColorPicker/ColorPicker.d.ts +43 -1
  195. package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.d.ts +9 -0
  196. package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.d.ts +39 -0
  197. package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.d.ts +48 -0
  198. package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.d.ts +33 -1
  199. package/dist/mocked_classnames/components/Combobox/Combobox.d.ts +78 -25
  200. package/dist/mocked_classnames/components/Combobox/components/ComboboxCategory/ComboboxCategory.d.ts +6 -0
  201. package/dist/mocked_classnames/components/Combobox/components/ComboboxConstants.d.ts +156 -0
  202. package/dist/mocked_classnames/components/Combobox/components/ComboboxItems/ComboboxItems.d.ts +45 -0
  203. package/dist/mocked_classnames/components/Combobox/components/ComboboxOption/ComboboxOption.d.ts +30 -0
  204. package/dist/mocked_classnames/components/Counter/Counter.d.ts +33 -14
  205. package/dist/mocked_classnames/components/DatePicker/DateNavigationItem/DateNavigationItem.d.ts +6 -0
  206. package/dist/mocked_classnames/components/DatePicker/DatePicker.d.ts +39 -13
  207. package/dist/mocked_classnames/components/DatePicker/DatePickerHeader/DatePickerHeader.d.ts +18 -0
  208. package/dist/mocked_classnames/components/DatePicker/YearPicker/YearPicker.d.ts +12 -0
  209. package/dist/mocked_classnames/components/DatePicker/YearPicker/YearsList.d.ts +12 -0
  210. package/dist/mocked_classnames/components/DatePicker/types.d.ts +6 -0
  211. package/dist/mocked_classnames/components/Dialog/Dialog.d.ts +59 -36
  212. package/dist/mocked_classnames/components/Dialog/DialogContent/DialogContent.d.ts +52 -3
  213. package/dist/mocked_classnames/components/DialogContentContainer/DialogContentContainer.d.ts +18 -0
  214. package/dist/mocked_classnames/components/Divider/Divider.d.ts +2 -2
  215. package/dist/mocked_classnames/components/Dropdown/Dropdown.types.d.ts +97 -63
  216. package/dist/mocked_classnames/components/EditableHeading/EditableHeading.d.ts +4 -3
  217. package/dist/mocked_classnames/components/EditableText/EditableText.d.ts +6 -4
  218. package/dist/mocked_classnames/components/EditableTypography/EditableTypography.d.ts +48 -16
  219. package/dist/mocked_classnames/components/ExpandCollapse/ExpandCollapse.d.ts +20 -8
  220. package/dist/mocked_classnames/components/FieldLabel/FieldLabel.d.ts +18 -0
  221. package/dist/mocked_classnames/components/Flex/Flex.d.ts +36 -2
  222. package/dist/mocked_classnames/components/FormattedNumber/FormattedNumber.d.ts +8 -8
  223. package/dist/mocked_classnames/components/GridKeyboardNavigationContext/GridKeyboardNavigationContextConstants.d.ts +3 -0
  224. package/dist/mocked_classnames/components/Heading/Heading.d.ts +15 -0
  225. package/dist/mocked_classnames/components/HiddenText/HiddenText.d.ts +3 -0
  226. package/dist/mocked_classnames/components/Icon/CustomSvgIcon/CustomSvgIcon.d.ts +30 -0
  227. package/dist/mocked_classnames/components/Icon/FontIcon/FontIcon.d.ts +18 -0
  228. package/dist/mocked_classnames/components/Icon/Icon.d.ts +32 -8
  229. package/dist/mocked_classnames/components/IconButton/IconButton.d.ts +37 -27
  230. package/dist/mocked_classnames/components/Label/Label.d.ts +22 -1
  231. package/dist/mocked_classnames/components/Label/LabelCelebrationAnimation.d.ts +6 -0
  232. package/dist/mocked_classnames/components/LayerProvider/LayerContext.d.ts +3 -0
  233. package/dist/mocked_classnames/components/LayerProvider/LayerProvider.d.ts +7 -1
  234. package/dist/mocked_classnames/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.d.ts +0 -8
  235. package/dist/mocked_classnames/components/Link/Link.d.ts +40 -14
  236. package/dist/mocked_classnames/components/List/List.d.ts +14 -5
  237. package/dist/mocked_classnames/components/List/VirtualizedListItems/VirtualizedListItems.d.ts +3 -0
  238. package/dist/mocked_classnames/components/ListItem/ListItem.d.ts +12 -25
  239. package/dist/mocked_classnames/components/ListItemAvatar/ListItemAvatar.d.ts +7 -1
  240. package/dist/mocked_classnames/components/ListItemIcon/ListItemIcon.d.ts +5 -2
  241. package/dist/mocked_classnames/components/ListTitle/ListTitle.d.ts +6 -0
  242. package/dist/mocked_classnames/components/Loader/Loader.d.ts +12 -2
  243. package/dist/mocked_classnames/components/Menu/Menu/Menu.d.ts +42 -0
  244. package/dist/mocked_classnames/components/Menu/MenuGridItem/MenuGridItem.d.ts +33 -5
  245. package/dist/mocked_classnames/components/Menu/MenuItem/AvatarMenuItem.d.ts +6 -0
  246. package/dist/mocked_classnames/components/Menu/MenuItem/MenuItem.d.ts +97 -7
  247. package/dist/mocked_classnames/components/Menu/MenuItem/components/BaseMenuItem/BaseMenuItem.types.d.ts +7 -0
  248. package/dist/mocked_classnames/components/Menu/MenuItem/components/MenuItemIcon/MenuItemIcon.types.d.ts +7 -6
  249. package/dist/mocked_classnames/components/Menu/MenuItem/components/MenuItemSubMenu/MenuItemSubMenu.types.d.ts +7 -3
  250. package/dist/mocked_classnames/components/Menu/MenuItem/components/MenuItemSubMenuIcon/MenuItemSubMenuIcon.types.d.ts +5 -1
  251. package/dist/mocked_classnames/components/Menu/MenuItemButton/MenuItemButton.d.ts +51 -0
  252. package/dist/mocked_classnames/components/Menu/MenuTitle/MenuTitle.d.ts +6 -0
  253. package/dist/mocked_classnames/components/MenuButton/MenuButton.d.ts +67 -19
  254. package/dist/mocked_classnames/components/Modal/ModalContent/ModalContent.types.d.ts +1 -1
  255. package/dist/mocked_classnames/components/Modal/ModalMedia/ModalMedia.types.d.ts +1 -1
  256. package/dist/mocked_classnames/components/Modal/ModalTopActions/ModalTopActions.types.d.ts +5 -5
  257. package/dist/mocked_classnames/components/Modal/context/ModalContext.types.d.ts +5 -5
  258. package/dist/mocked_classnames/components/Modal/footers/ModalFooter/ModalFooter.types.d.ts +1 -1
  259. package/dist/mocked_classnames/components/Modal/footers/ModalFooterBase/ModalFooterBase.types.d.ts +3 -3
  260. package/dist/mocked_classnames/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.types.d.ts +4 -4
  261. package/dist/mocked_classnames/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.types.d.ts +1 -1
  262. package/dist/mocked_classnames/components/Modal/layouts/ModalFooterShadow.types.d.ts +1 -1
  263. package/dist/mocked_classnames/components/Modal/layouts/ModalLayoutScrollableContent.types.d.ts +2 -2
  264. package/dist/mocked_classnames/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.types.d.ts +1 -1
  265. package/dist/mocked_classnames/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.types.d.ts +1 -1
  266. package/dist/mocked_classnames/components/MultiStepIndicator/MultiStepIndicator.d.ts +30 -0
  267. package/dist/mocked_classnames/components/MultiStepIndicator/components/StepIndicator/StepIndicator.d.ts +57 -0
  268. package/dist/mocked_classnames/components/ProgressBars/LinearProgressBar/Bar/Bar.d.ts +17 -6
  269. package/dist/mocked_classnames/components/ProgressBars/LinearProgressBar/LinearProgressBar.d.ts +19 -22
  270. package/dist/mocked_classnames/components/ProgressBars/PercentageLabel/PercentageLabel.d.ts +2 -2
  271. package/dist/mocked_classnames/components/RadioButton/RadioButton.d.ts +45 -16
  272. package/dist/mocked_classnames/components/Search/Search.types.d.ts +24 -24
  273. package/dist/mocked_classnames/components/Skeleton/Skeleton.d.ts +16 -1
  274. package/dist/mocked_classnames/components/SlideTransition/SlideTransition.types.d.ts +12 -0
  275. package/dist/mocked_classnames/components/Slider/SelectionIndicator.d.ts +6 -0
  276. package/dist/mocked_classnames/components/Slider/SliderBase/SliderFilledTrack.d.ts +6 -8
  277. package/dist/mocked_classnames/components/Slider/SliderBase/SliderRail.d.ts +6 -4
  278. package/dist/mocked_classnames/components/Slider/SliderBase/SliderThumb.d.ts +9 -7
  279. package/dist/mocked_classnames/components/Slider/SliderBase/SliderTrack.d.ts +1 -2
  280. package/dist/mocked_classnames/components/Slider/SliderContext.d.ts +13 -8
  281. package/dist/mocked_classnames/components/Slider/SliderInfix.d.ts +1 -2
  282. package/dist/mocked_classnames/components/SplitButton/SplitButton.d.ts +25 -2
  283. package/dist/mocked_classnames/components/Steps/Steps.d.ts +32 -2
  284. package/dist/mocked_classnames/components/Steps/StepsCommand.d.ts +21 -0
  285. package/dist/mocked_classnames/components/Steps/StepsDot.d.ts +15 -0
  286. package/dist/mocked_classnames/components/Steps/StepsGalleryHeader.d.ts +15 -0
  287. package/dist/mocked_classnames/components/Steps/StepsHeader.d.ts +33 -0
  288. package/dist/mocked_classnames/components/Steps/StepsNumbersHeader.d.ts +9 -0
  289. package/dist/mocked_classnames/components/Switch/Switch.d.ts +39 -0
  290. package/dist/mocked_classnames/components/Table/Table/Table.d.ts +42 -0
  291. package/dist/mocked_classnames/components/Table/TableBody/TableBody.d.ts +3 -0
  292. package/dist/mocked_classnames/components/Table/TableCell/TableCell.d.ts +6 -0
  293. package/dist/mocked_classnames/components/Table/TableCellSkeleton/TableCellSkeleton.d.ts +6 -0
  294. package/dist/mocked_classnames/components/Table/TableContainer/TableContainer.types.d.ts +6 -0
  295. package/dist/mocked_classnames/components/Table/TableHeader/TableHeader.d.ts +3 -0
  296. package/dist/mocked_classnames/components/Table/TableHeaderCell/TableHeaderCell.d.ts +21 -0
  297. package/dist/mocked_classnames/components/Table/TableRow/TableRow.d.ts +7 -1
  298. package/dist/mocked_classnames/components/Table/TableRowMenu/TableRowMenu.types.d.ts +6 -0
  299. package/dist/mocked_classnames/components/Table/TableVirtualizedBody/TableVirtualizedBody.d.ts +15 -0
  300. package/dist/mocked_classnames/components/Tabs/Tab/Tab.d.ts +27 -3
  301. package/dist/mocked_classnames/components/Tabs/TabList/TabList.d.ts +15 -0
  302. package/dist/mocked_classnames/components/Tabs/TabPanel/TabPanel.d.ts +6 -0
  303. package/dist/mocked_classnames/components/Tabs/TabPanels/TabPanels.d.ts +9 -0
  304. package/dist/mocked_classnames/components/Tabs/TabsContext/TabsContext.d.ts +6 -0
  305. package/dist/mocked_classnames/components/Text/Text.d.ts +9 -0
  306. package/dist/mocked_classnames/components/TextArea/TextArea.types.d.ts +13 -16
  307. package/dist/mocked_classnames/components/TextField/TextField.d.ts +127 -9
  308. package/dist/mocked_classnames/components/TextWithHighlight/TextWithHighlight.d.ts +33 -6
  309. package/dist/mocked_classnames/components/ThemeProvider/ThemeProvider.d.ts +8 -5
  310. package/dist/mocked_classnames/components/Tipseen/Tipseen.d.ts +64 -6
  311. package/dist/mocked_classnames/components/Tipseen/TipseenBasicContent.d.ts +9 -0
  312. package/dist/mocked_classnames/components/Tipseen/TipseenContent.d.ts +25 -1
  313. package/dist/mocked_classnames/components/Tipseen/TipseenImage.d.ts +12 -0
  314. package/dist/mocked_classnames/components/Tipseen/TipseenMedia/TipseenMedia.d.ts +3 -0
  315. package/dist/mocked_classnames/components/Tipseen/TipseenTitle.d.ts +3 -0
  316. package/dist/mocked_classnames/components/Tipseen/TipseenWizard.d.ts +7 -1
  317. package/dist/mocked_classnames/components/Toast/Toast.d.ts +37 -8
  318. package/dist/mocked_classnames/components/Toggle/MockToggle.d.ts +21 -0
  319. package/dist/mocked_classnames/components/Toggle/Toggle.d.ts +37 -1
  320. package/dist/mocked_classnames/components/Toggle/ToggleText.d.ts +6 -0
  321. package/dist/mocked_classnames/components/Tooltip/Tooltip.d.ts +64 -27
  322. package/dist/mocked_classnames/components/TransitionView/TransitionView.types.d.ts +9 -0
  323. package/dist/mocked_classnames/components/Typography/Typography.d.ts +12 -6
  324. package/dist/mocked_classnames/components/VirtualizedGrid/VirtualizedGrid.d.ts +19 -19
  325. package/dist/mocked_classnames/components/VirtualizedList/VirtualizedList.d.ts +33 -27
  326. package/dist/mocked_classnames/hooks/useKeyEvent/index.d.ts +30 -0
  327. package/dist/mocked_classnames/hooks/useSwitch/index.d.ts +12 -0
  328. package/dist/mocked_classnames/hooks/useWizard/useWizard.types.d.ts +33 -0
  329. package/dist/mocked_classnames/src/components/Accordion/Accordion/Accordion.js.map +1 -1
  330. package/dist/mocked_classnames/src/components/Accordion/AccordionItem/AccordionItem.js.map +1 -1
  331. package/dist/mocked_classnames/src/components/AlertBanner/AlertBanner.js.map +1 -1
  332. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js.map +1 -1
  333. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerLink/AlertBannerLink.js.map +1 -1
  334. package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerText/AlertBannerText.js.map +1 -1
  335. package/dist/mocked_classnames/src/components/AttentionBox/AttentionBox.js.map +1 -1
  336. package/dist/mocked_classnames/src/components/Avatar/Avatar.js.map +1 -1
  337. package/dist/mocked_classnames/src/components/Avatar/AvatarBadge.js.map +1 -1
  338. package/dist/mocked_classnames/src/components/Avatar/AvatarContent.js.map +1 -1
  339. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroup.js.map +1 -1
  340. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounter.js.map +1 -1
  341. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js.map +1 -1
  342. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.js.map +1 -1
  343. package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.js.map +1 -1
  344. package/dist/mocked_classnames/src/components/Badge/Badge.js.map +1 -1
  345. package/dist/mocked_classnames/src/components/Badge/Indicator/Indicator.js.map +1 -1
  346. package/dist/mocked_classnames/src/components/Box/Box.js.map +1 -1
  347. package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.js.map +1 -1
  348. package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.js.map +1 -1
  349. package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbsBar.js.map +1 -1
  350. package/dist/mocked_classnames/src/components/Button/Button.js +1 -1
  351. package/dist/mocked_classnames/src/components/Button/Button.js.map +1 -1
  352. package/dist/mocked_classnames/src/components/ButtonGroup/ButtonGroup.js.map +1 -1
  353. package/dist/mocked_classnames/src/components/ButtonGroup/ButtonWrapper.js.map +1 -1
  354. package/dist/mocked_classnames/src/components/Checkbox/Checkbox.js.map +1 -1
  355. package/dist/mocked_classnames/src/components/Chips/Chips.js.map +1 -1
  356. package/dist/mocked_classnames/src/components/Clickable/Clickable.js.map +1 -1
  357. package/dist/mocked_classnames/src/components/Clickable/ClickableWrapper.js.map +1 -1
  358. package/dist/mocked_classnames/src/components/ColorPicker/ColorPicker.js.map +1 -1
  359. package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.js.map +1 -1
  360. package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.js.map +1 -1
  361. package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.js.map +1 -1
  362. package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.js.map +1 -1
  363. package/dist/mocked_classnames/src/components/Combobox/Combobox.js.map +1 -1
  364. package/dist/mocked_classnames/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js.map +1 -1
  365. package/dist/mocked_classnames/src/components/Combobox/components/ComboboxConstants.js.map +1 -1
  366. package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.js.map +1 -1
  367. package/dist/mocked_classnames/src/components/Combobox/components/ComboboxOption/ComboboxOption.js.map +1 -1
  368. package/dist/mocked_classnames/src/components/Counter/Counter.js.map +1 -1
  369. package/dist/mocked_classnames/src/components/DatePicker/DateNavigationItem/DateNavigationItem.js.map +1 -1
  370. package/dist/mocked_classnames/src/components/DatePicker/DatePicker.js.map +1 -1
  371. package/dist/mocked_classnames/src/components/DatePicker/DatePickerHeader/DatePickerHeader.js.map +1 -1
  372. package/dist/mocked_classnames/src/components/DatePicker/YearPicker/YearPicker.js.map +1 -1
  373. package/dist/mocked_classnames/src/components/DatePicker/YearPicker/YearsList.js.map +1 -1
  374. package/dist/mocked_classnames/src/components/DatePicker/types.js.map +1 -1
  375. package/dist/mocked_classnames/src/components/Dialog/Dialog.js.map +1 -1
  376. package/dist/mocked_classnames/src/components/Dialog/DialogContent/DialogContent.js.map +1 -1
  377. package/dist/mocked_classnames/src/components/DialogContentContainer/DialogContentContainer.js.map +1 -1
  378. package/dist/mocked_classnames/src/components/Divider/Divider.js.map +1 -1
  379. package/dist/mocked_classnames/src/components/Dropdown/Dropdown.js +1 -1
  380. package/dist/mocked_classnames/src/components/Dropdown/Dropdown.js.map +1 -1
  381. package/dist/mocked_classnames/src/components/EditableHeading/EditableHeading.js.map +1 -1
  382. package/dist/mocked_classnames/src/components/EditableText/EditableText.js.map +1 -1
  383. package/dist/mocked_classnames/src/components/EditableTypography/EditableTypography.js.map +1 -1
  384. package/dist/mocked_classnames/src/components/ExpandCollapse/ExpandCollapse.js.map +1 -1
  385. package/dist/mocked_classnames/src/components/FieldLabel/FieldLabel.js.map +1 -1
  386. package/dist/mocked_classnames/src/components/Flex/Flex.js.map +1 -1
  387. package/dist/mocked_classnames/src/components/FormattedNumber/FormattedNumber.js.map +1 -1
  388. package/dist/mocked_classnames/src/components/Heading/Heading.js.map +1 -1
  389. package/dist/mocked_classnames/src/components/HiddenText/HiddenText.js.map +1 -1
  390. package/dist/mocked_classnames/src/components/Icon/CustomSvgIcon/CustomSvgIcon.js.map +1 -1
  391. package/dist/mocked_classnames/src/components/Icon/FontIcon/FontIcon.js.map +1 -1
  392. package/dist/mocked_classnames/src/components/Icon/Icon.js.map +1 -1
  393. package/dist/mocked_classnames/src/components/IconButton/IconButton.js.map +1 -1
  394. package/dist/mocked_classnames/src/components/Label/Label.js.map +1 -1
  395. package/dist/mocked_classnames/src/components/Label/LabelCelebrationAnimation.js.map +1 -1
  396. package/dist/mocked_classnames/src/components/LayerProvider/LayerContext.js.map +1 -1
  397. package/dist/mocked_classnames/src/components/LayerProvider/LayerProvider.js.map +1 -1
  398. package/dist/mocked_classnames/src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.js.map +1 -1
  399. package/dist/mocked_classnames/src/components/Link/Link.js.map +1 -1
  400. package/dist/mocked_classnames/src/components/List/List.js.map +1 -1
  401. package/dist/mocked_classnames/src/components/List/VirtualizedListItems/VirtualizedListItems.js.map +1 -1
  402. package/dist/mocked_classnames/src/components/ListItem/ListItem.js.map +1 -1
  403. package/dist/mocked_classnames/src/components/ListItemAvatar/ListItemAvatar.js.map +1 -1
  404. package/dist/mocked_classnames/src/components/ListItemIcon/ListItemIcon.js.map +1 -1
  405. package/dist/mocked_classnames/src/components/ListTitle/ListTitle.js.map +1 -1
  406. package/dist/mocked_classnames/src/components/Loader/Loader.js.map +1 -1
  407. package/dist/mocked_classnames/src/components/Menu/Menu/Menu.js.map +1 -1
  408. package/dist/mocked_classnames/src/components/Menu/MenuGridItem/MenuGridItem.js.map +1 -1
  409. package/dist/mocked_classnames/src/components/Menu/MenuItem/AvatarMenuItem.js.map +1 -1
  410. package/dist/mocked_classnames/src/components/Menu/MenuItem/MenuItem.js.map +1 -1
  411. package/dist/mocked_classnames/src/components/Menu/MenuItemButton/MenuItemButton.js.map +1 -1
  412. package/dist/mocked_classnames/src/components/Menu/MenuTitle/MenuTitle.js.map +1 -1
  413. package/dist/mocked_classnames/src/components/MenuButton/MenuButton.js.map +1 -1
  414. package/dist/mocked_classnames/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js +1 -1
  415. package/dist/mocked_classnames/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js.map +1 -1
  416. package/dist/mocked_classnames/src/components/MultiStepIndicator/MultiStepIndicator.js.map +1 -1
  417. package/dist/mocked_classnames/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.js.map +1 -1
  418. package/dist/mocked_classnames/src/components/ProgressBars/LinearProgressBar/Bar/Bar.js.map +1 -1
  419. package/dist/mocked_classnames/src/components/ProgressBars/LinearProgressBar/LinearProgressBar.js.map +1 -1
  420. package/dist/mocked_classnames/src/components/ProgressBars/PercentageLabel/PercentageLabel.js.map +1 -1
  421. package/dist/mocked_classnames/src/components/RadioButton/RadioButton.js.map +1 -1
  422. package/dist/mocked_classnames/src/components/Skeleton/Skeleton.js.map +1 -1
  423. package/dist/mocked_classnames/src/components/Slider/SelectionIndicator.js.map +1 -1
  424. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderFilledTrack.js.map +1 -1
  425. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderRail.js.map +1 -1
  426. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderThumb.js.map +1 -1
  427. package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderTrack.js.map +1 -1
  428. package/dist/mocked_classnames/src/components/Slider/SliderContext.js.map +1 -1
  429. package/dist/mocked_classnames/src/components/Slider/SliderInfix.js.map +1 -1
  430. package/dist/mocked_classnames/src/components/SplitButton/SplitButton.js.map +1 -1
  431. package/dist/mocked_classnames/src/components/Steps/Steps.js.map +1 -1
  432. package/dist/mocked_classnames/src/components/Steps/StepsCommand.js.map +1 -1
  433. package/dist/mocked_classnames/src/components/Steps/StepsDot.js.map +1 -1
  434. package/dist/mocked_classnames/src/components/Steps/StepsGalleryHeader.js.map +1 -1
  435. package/dist/mocked_classnames/src/components/Steps/StepsHeader.js.map +1 -1
  436. package/dist/mocked_classnames/src/components/Steps/StepsNumbersHeader.js.map +1 -1
  437. package/dist/mocked_classnames/src/components/Switch/Switch.js.map +1 -1
  438. package/dist/mocked_classnames/src/components/Table/Table/Table.js.map +1 -1
  439. package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.js.map +1 -1
  440. package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.js.map +1 -1
  441. package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map +1 -1
  442. package/dist/mocked_classnames/src/components/Table/TableHeader/TableHeader.js.map +1 -1
  443. package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.js.map +1 -1
  444. package/dist/mocked_classnames/src/components/Table/TableRow/TableRow.js.map +1 -1
  445. package/dist/mocked_classnames/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js.map +1 -1
  446. package/dist/mocked_classnames/src/components/Tabs/Tab/Tab.js.map +1 -1
  447. package/dist/mocked_classnames/src/components/Tabs/TabList/TabList.js.map +1 -1
  448. package/dist/mocked_classnames/src/components/Tabs/TabPanel/TabPanel.js.map +1 -1
  449. package/dist/mocked_classnames/src/components/Tabs/TabPanels/TabPanels.js.map +1 -1
  450. package/dist/mocked_classnames/src/components/Tabs/TabsContext/TabsContext.js.map +1 -1
  451. package/dist/mocked_classnames/src/components/Text/Text.js.map +1 -1
  452. package/dist/mocked_classnames/src/components/TextField/TextField.js.map +1 -1
  453. package/dist/mocked_classnames/src/components/TextWithHighlight/TextWithHighlight.js.map +1 -1
  454. package/dist/mocked_classnames/src/components/ThemeProvider/ThemeProvider.js.map +1 -1
  455. package/dist/mocked_classnames/src/components/Tipseen/Tipseen.js.map +1 -1
  456. package/dist/mocked_classnames/src/components/Tipseen/TipseenBasicContent.js.map +1 -1
  457. package/dist/mocked_classnames/src/components/Tipseen/TipseenContent.js.map +1 -1
  458. package/dist/mocked_classnames/src/components/Tipseen/TipseenImage.js.map +1 -1
  459. package/dist/mocked_classnames/src/components/Tipseen/TipseenMedia/TipseenMedia.js.map +1 -1
  460. package/dist/mocked_classnames/src/components/Tipseen/TipseenTitle.js.map +1 -1
  461. package/dist/mocked_classnames/src/components/Tipseen/TipseenWizard.js.map +1 -1
  462. package/dist/mocked_classnames/src/components/Toast/Toast.js.map +1 -1
  463. package/dist/mocked_classnames/src/components/Toggle/MockToggle.js.map +1 -1
  464. package/dist/mocked_classnames/src/components/Toggle/Toggle.js.map +1 -1
  465. package/dist/mocked_classnames/src/components/Toggle/ToggleText.js.map +1 -1
  466. package/dist/mocked_classnames/src/components/Tooltip/Tooltip.js.map +1 -1
  467. package/dist/mocked_classnames/src/components/Typography/Typography.js.map +1 -1
  468. package/dist/mocked_classnames/src/components/VirtualizedGrid/VirtualizedGrid.js.map +1 -1
  469. package/dist/mocked_classnames/src/components/VirtualizedList/VirtualizedList.js.map +1 -1
  470. package/dist/mocked_classnames/src/hooks/useKeyEvent/index.js.map +1 -1
  471. package/dist/mocked_classnames/src/hooks/useSwitch/index.js.map +1 -1
  472. package/dist/mocked_classnames/types/VibeComponentProps.d.ts +9 -0
  473. package/dist/src/components/Accordion/Accordion/Accordion.js.map +1 -1
  474. package/dist/src/components/Accordion/AccordionItem/AccordionItem.js.map +1 -1
  475. package/dist/src/components/AlertBanner/AlertBanner.js.map +1 -1
  476. package/dist/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js.map +1 -1
  477. package/dist/src/components/AlertBanner/AlertBannerLink/AlertBannerLink.js.map +1 -1
  478. package/dist/src/components/AlertBanner/AlertBannerText/AlertBannerText.js.map +1 -1
  479. package/dist/src/components/AttentionBox/AttentionBox.js.map +1 -1
  480. package/dist/src/components/Avatar/Avatar.js.map +1 -1
  481. package/dist/src/components/Avatar/AvatarBadge.js.map +1 -1
  482. package/dist/src/components/Avatar/AvatarContent.js.map +1 -1
  483. package/dist/src/components/AvatarGroup/AvatarGroup.js.map +1 -1
  484. package/dist/src/components/AvatarGroup/AvatarGroupCounter.js.map +1 -1
  485. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js.map +1 -1
  486. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.js.map +1 -1
  487. package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.js.map +1 -1
  488. package/dist/src/components/Badge/Badge.js.map +1 -1
  489. package/dist/src/components/Badge/Indicator/Indicator.js.map +1 -1
  490. package/dist/src/components/Box/Box.js.map +1 -1
  491. package/dist/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.js.map +1 -1
  492. package/dist/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.js.map +1 -1
  493. package/dist/src/components/BreadcrumbsBar/BreadcrumbsBar.js.map +1 -1
  494. package/dist/src/components/Button/Button.js +1 -1
  495. package/dist/src/components/Button/Button.js.map +1 -1
  496. package/dist/src/components/ButtonGroup/ButtonGroup.js.map +1 -1
  497. package/dist/src/components/ButtonGroup/ButtonWrapper.js.map +1 -1
  498. package/dist/src/components/Checkbox/Checkbox.js.map +1 -1
  499. package/dist/src/components/Chips/Chips.js.map +1 -1
  500. package/dist/src/components/Clickable/Clickable.js.map +1 -1
  501. package/dist/src/components/Clickable/ClickableWrapper.js.map +1 -1
  502. package/dist/src/components/ColorPicker/ColorPicker.js.map +1 -1
  503. package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.js.map +1 -1
  504. package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.js.map +1 -1
  505. package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.js.map +1 -1
  506. package/dist/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.js.map +1 -1
  507. package/dist/src/components/Combobox/Combobox.js.map +1 -1
  508. package/dist/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js.map +1 -1
  509. package/dist/src/components/Combobox/components/ComboboxConstants.js.map +1 -1
  510. package/dist/src/components/Combobox/components/ComboboxItems/ComboboxItems.js.map +1 -1
  511. package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.js.map +1 -1
  512. package/dist/src/components/Counter/Counter.js.map +1 -1
  513. package/dist/src/components/DatePicker/DateNavigationItem/DateNavigationItem.js.map +1 -1
  514. package/dist/src/components/DatePicker/DatePicker.js.map +1 -1
  515. package/dist/src/components/DatePicker/DatePickerHeader/DatePickerHeader.js.map +1 -1
  516. package/dist/src/components/DatePicker/YearPicker/YearPicker.js.map +1 -1
  517. package/dist/src/components/DatePicker/YearPicker/YearsList.js.map +1 -1
  518. package/dist/src/components/DatePicker/types.js.map +1 -1
  519. package/dist/src/components/Dialog/Dialog.js.map +1 -1
  520. package/dist/src/components/Dialog/DialogContent/DialogContent.js.map +1 -1
  521. package/dist/src/components/DialogContentContainer/DialogContentContainer.js.map +1 -1
  522. package/dist/src/components/Divider/Divider.js.map +1 -1
  523. package/dist/src/components/Dropdown/Dropdown.js +1 -1
  524. package/dist/src/components/Dropdown/Dropdown.js.map +1 -1
  525. package/dist/src/components/EditableHeading/EditableHeading.js.map +1 -1
  526. package/dist/src/components/EditableText/EditableText.js.map +1 -1
  527. package/dist/src/components/EditableTypography/EditableTypography.js.map +1 -1
  528. package/dist/src/components/ExpandCollapse/ExpandCollapse.js.map +1 -1
  529. package/dist/src/components/FieldLabel/FieldLabel.js.map +1 -1
  530. package/dist/src/components/Flex/Flex.js.map +1 -1
  531. package/dist/src/components/FormattedNumber/FormattedNumber.js.map +1 -1
  532. package/dist/src/components/Heading/Heading.js.map +1 -1
  533. package/dist/src/components/HiddenText/HiddenText.js.map +1 -1
  534. package/dist/src/components/Icon/CustomSvgIcon/CustomSvgIcon.js.map +1 -1
  535. package/dist/src/components/Icon/FontIcon/FontIcon.js.map +1 -1
  536. package/dist/src/components/Icon/Icon.js.map +1 -1
  537. package/dist/src/components/IconButton/IconButton.js.map +1 -1
  538. package/dist/src/components/Label/Label.js.map +1 -1
  539. package/dist/src/components/Label/LabelCelebrationAnimation.js.map +1 -1
  540. package/dist/src/components/LayerProvider/LayerContext.js.map +1 -1
  541. package/dist/src/components/LayerProvider/LayerProvider.js.map +1 -1
  542. package/dist/src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.js.map +1 -1
  543. package/dist/src/components/Link/Link.js.map +1 -1
  544. package/dist/src/components/List/List.js.map +1 -1
  545. package/dist/src/components/List/VirtualizedListItems/VirtualizedListItems.js.map +1 -1
  546. package/dist/src/components/ListItem/ListItem.js.map +1 -1
  547. package/dist/src/components/ListItemAvatar/ListItemAvatar.js.map +1 -1
  548. package/dist/src/components/ListItemIcon/ListItemIcon.js.map +1 -1
  549. package/dist/src/components/ListTitle/ListTitle.js.map +1 -1
  550. package/dist/src/components/Loader/Loader.js.map +1 -1
  551. package/dist/src/components/Menu/Menu/Menu.js.map +1 -1
  552. package/dist/src/components/Menu/MenuGridItem/MenuGridItem.js.map +1 -1
  553. package/dist/src/components/Menu/MenuItem/AvatarMenuItem.js.map +1 -1
  554. package/dist/src/components/Menu/MenuItem/MenuItem.js.map +1 -1
  555. package/dist/src/components/Menu/MenuItemButton/MenuItemButton.js.map +1 -1
  556. package/dist/src/components/Menu/MenuTitle/MenuTitle.js.map +1 -1
  557. package/dist/src/components/MenuButton/MenuButton.js.map +1 -1
  558. package/dist/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js +1 -1
  559. package/dist/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js.map +1 -1
  560. package/dist/src/components/MultiStepIndicator/MultiStepIndicator.js.map +1 -1
  561. package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.js.map +1 -1
  562. package/dist/src/components/ProgressBars/LinearProgressBar/Bar/Bar.js.map +1 -1
  563. package/dist/src/components/ProgressBars/LinearProgressBar/LinearProgressBar.js.map +1 -1
  564. package/dist/src/components/ProgressBars/PercentageLabel/PercentageLabel.js.map +1 -1
  565. package/dist/src/components/RadioButton/RadioButton.js.map +1 -1
  566. package/dist/src/components/Skeleton/Skeleton.js.map +1 -1
  567. package/dist/src/components/Slider/SelectionIndicator.js.map +1 -1
  568. package/dist/src/components/Slider/SliderBase/SliderFilledTrack.js.map +1 -1
  569. package/dist/src/components/Slider/SliderBase/SliderRail.js.map +1 -1
  570. package/dist/src/components/Slider/SliderBase/SliderThumb.js.map +1 -1
  571. package/dist/src/components/Slider/SliderBase/SliderTrack.js.map +1 -1
  572. package/dist/src/components/Slider/SliderContext.js.map +1 -1
  573. package/dist/src/components/Slider/SliderInfix.js.map +1 -1
  574. package/dist/src/components/SplitButton/SplitButton.js.map +1 -1
  575. package/dist/src/components/Steps/Steps.js.map +1 -1
  576. package/dist/src/components/Steps/StepsCommand.js.map +1 -1
  577. package/dist/src/components/Steps/StepsDot.js.map +1 -1
  578. package/dist/src/components/Steps/StepsGalleryHeader.js.map +1 -1
  579. package/dist/src/components/Steps/StepsHeader.js.map +1 -1
  580. package/dist/src/components/Steps/StepsNumbersHeader.js.map +1 -1
  581. package/dist/src/components/Switch/Switch.js.map +1 -1
  582. package/dist/src/components/Table/Table/Table.js.map +1 -1
  583. package/dist/src/components/Table/TableBody/TableBody.js.map +1 -1
  584. package/dist/src/components/Table/TableCell/TableCell.js.map +1 -1
  585. package/dist/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map +1 -1
  586. package/dist/src/components/Table/TableHeader/TableHeader.js.map +1 -1
  587. package/dist/src/components/Table/TableHeaderCell/TableHeaderCell.js.map +1 -1
  588. package/dist/src/components/Table/TableRow/TableRow.js.map +1 -1
  589. package/dist/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js.map +1 -1
  590. package/dist/src/components/Tabs/Tab/Tab.js.map +1 -1
  591. package/dist/src/components/Tabs/TabList/TabList.js.map +1 -1
  592. package/dist/src/components/Tabs/TabPanel/TabPanel.js.map +1 -1
  593. package/dist/src/components/Tabs/TabPanels/TabPanels.js.map +1 -1
  594. package/dist/src/components/Tabs/TabsContext/TabsContext.js.map +1 -1
  595. package/dist/src/components/Text/Text.js.map +1 -1
  596. package/dist/src/components/TextField/TextField.js.map +1 -1
  597. package/dist/src/components/TextWithHighlight/TextWithHighlight.js.map +1 -1
  598. package/dist/src/components/ThemeProvider/ThemeProvider.js.map +1 -1
  599. package/dist/src/components/Tipseen/Tipseen.js.map +1 -1
  600. package/dist/src/components/Tipseen/TipseenBasicContent.js.map +1 -1
  601. package/dist/src/components/Tipseen/TipseenContent.js.map +1 -1
  602. package/dist/src/components/Tipseen/TipseenImage.js.map +1 -1
  603. package/dist/src/components/Tipseen/TipseenMedia/TipseenMedia.js.map +1 -1
  604. package/dist/src/components/Tipseen/TipseenTitle.js.map +1 -1
  605. package/dist/src/components/Tipseen/TipseenWizard.js.map +1 -1
  606. package/dist/src/components/Toast/Toast.js.map +1 -1
  607. package/dist/src/components/Toggle/MockToggle.js.map +1 -1
  608. package/dist/src/components/Toggle/Toggle.js.map +1 -1
  609. package/dist/src/components/Toggle/ToggleText.js.map +1 -1
  610. package/dist/src/components/Tooltip/Tooltip.js.map +1 -1
  611. package/dist/src/components/Typography/Typography.js.map +1 -1
  612. package/dist/src/components/VirtualizedGrid/VirtualizedGrid.js.map +1 -1
  613. package/dist/src/components/VirtualizedList/VirtualizedList.js.map +1 -1
  614. package/dist/src/hooks/useKeyEvent/index.js.map +1 -1
  615. package/dist/src/hooks/useSwitch/index.js.map +1 -1
  616. package/dist/types/VibeComponentProps.d.ts +9 -0
  617. package/package.json +3 -2
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbItem.js","sources":["../../../../../../src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { useRef } from \"react\";\nimport useIsOverflowing from \"../../../hooks/useIsOverflowing/useIsOverflowing\";\nimport Tooltip from \"../../../components/Tooltip/Tooltip\";\nimport { BreadcrumbContent } from \"./BreadcrumbContent/BreadcrumbContent\";\nimport { SubIcon, VibeComponentProps } from \"../../../types\";\nimport styles from \"./BreadcrumbItem.module.scss\";\n\nexport interface BreadcrumbItemProps extends VibeComponentProps {\n /** The display text. */\n text?: string;\n /** Should item be disabled. */\n disabled?: boolean;\n /** Should item be clickable - this should be recieved from the breadcrumbsBar ( Navigation/Indication bar ). */\n isClickable?: boolean;\n /** If the item is clickable and the type of navigation is a link, this is the link */\n link?: string;\n /** If the item is clickable and the type of navigation is a function, this is the function */\n onClick?: () => void;\n /** Should be the current Item - mainly effects the item`s style. */\n isCurrent?: boolean;\n /** An Icon - If no icon needed then should be left empty. */\n icon?: SubIcon;\n showText?: boolean;\n}\n\nconst BreadcrumbItem: React.FC<BreadcrumbItemProps> = ({\n className,\n text = \"\",\n disabled,\n isClickable = false,\n link,\n onClick,\n isCurrent = false,\n icon,\n id,\n showText = true,\n \"data-testid\": dataTestId\n}) => {\n const componentRef = useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing({ ref: componentRef });\n\n return (\n <Tooltip\n disableDialogSlide={true}\n withoutDialog={false}\n content={(isOverflowing || !showText) && text}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n addKeyboardHideShowTriggersByDefault={!showText}\n >\n <li\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.BREADCRUMB_ITEM, id)}\n className={cx(styles.breadcrumbItemWrapper, className, {\n [styles.disabled]: disabled\n })}\n >\n <BreadcrumbContent\n ref={componentRef}\n isClickable={isClickable}\n link={link}\n onClick={onClick}\n text={text}\n icon={icon}\n isCurrent={isCurrent}\n disabled={disabled}\n showText={showText}\n />\n </li>\n </Tooltip>\n );\n};\n\nexport default BreadcrumbItem;\n"],"names":["BreadcrumbItem","_ref","className","_ref$text","text","disabled","_ref$isClickable","isClickable","link","onClick","_ref$isCurrent","isCurrent","icon","id","_ref$showText","showText","dataTestId","componentRef","useRef","isOverflowing","useIsOverflowing","ref","React","createElement","Tooltip","disableDialogSlide","withoutDialog","content","showTrigger","hideTrigger","addKeyboardHideShowTriggersByDefault","getTestId","ComponentDefaultTestId","BREADCRUMB_ITEM","cx","styles","breadcrumbItemWrapper","_defineProperty","BreadcrumbContent"],"mappings":"wcA2BA,IAAMA,EAAgD,SAAlCC,GAYf,IAXHC,EAASD,EAATC,UAASC,EAAAF,EACTG,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAQJ,EAARI,SAAQC,EAAAL,EACRM,YAAAA,OAAc,IAAHD,GAAQA,EACnBE,EAAIP,EAAJO,KACAC,EAAOR,EAAPQ,QAAOC,EAAAT,EACPU,UAAAA,OAAY,IAAHD,GAAQA,EACjBE,EAAIX,EAAJW,KACAC,EAAEZ,EAAFY,GAAEC,EAAAb,EACFc,SAAAA,OAAW,IAAHD,GAAOA,EACAE,EAAUf,EAAzB,eAEMgB,EAAeC,EAAwB,MACvCC,EAAgBC,EAAiB,CAAEC,IAAKJ,IAE9C,OACEK,EAACC,cAAAC,EACC,CAAAC,oBAAoB,EACpBC,eAAe,EACfC,SAAUR,IAAkBJ,IAAaX,EACzCwB,YAAa,CAAC,cACdC,YAAa,CAAC,cACdC,sCAAuCf,GAEvCO,EACEC,cAAA,KAAA,CAAAV,GAAIA,EACS,cAAAG,GAAce,EAAUC,EAAuBC,gBAAiBpB,GAC7EX,UAAWgC,EAAGC,EAAOC,sBAAuBlC,EAASmC,KAClDF,EAAO9B,SAAWA,KAGrBiB,EAAAC,cAACe,EACC,CAAAjB,IAAKJ,EACLV,YAAaA,EACbC,KAAMA,EACNC,QAASA,EACTL,KAAMA,EACNQ,KAAMA,EACND,UAAWA,EACXN,SAAUA,EACVU,SAAUA,KAKpB"}
1
+ {"version":3,"file":"BreadcrumbItem.js","sources":["../../../../../../src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { useRef } from \"react\";\nimport useIsOverflowing from \"../../../hooks/useIsOverflowing/useIsOverflowing\";\nimport Tooltip from \"../../../components/Tooltip/Tooltip\";\nimport { BreadcrumbContent } from \"./BreadcrumbContent/BreadcrumbContent\";\nimport { SubIcon, VibeComponentProps } from \"../../../types\";\nimport styles from \"./BreadcrumbItem.module.scss\";\n\nexport interface BreadcrumbItemProps extends VibeComponentProps {\n /**\n * The display text of the breadcrumb item.\n */\n text?: string;\n /**\n * If true, the item is disabled.\n */\n disabled?: boolean;\n /**\n * If true, the item is clickable.\n */\n isClickable?: boolean;\n /**\n * The URL the item links to if navigation is handled via a link.\n */\n link?: string;\n /**\n * Callback fired when the item is clicked.\n */\n onClick?: () => void;\n /**\n * If true, applies styling for the current page.\n */\n isCurrent?: boolean;\n /**\n * The icon displayed next to the text.\n */\n icon?: SubIcon;\n /**\n * If true, the breadcrumb text is shown.\n */\n showText?: boolean;\n}\n\nconst BreadcrumbItem: React.FC<BreadcrumbItemProps> = ({\n className,\n text = \"\",\n disabled,\n isClickable = false,\n link,\n onClick,\n isCurrent = false,\n icon,\n id,\n showText = true,\n \"data-testid\": dataTestId\n}) => {\n const componentRef = useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing({ ref: componentRef });\n\n return (\n <Tooltip\n disableDialogSlide={true}\n withoutDialog={false}\n content={(isOverflowing || !showText) && text}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n addKeyboardHideShowTriggersByDefault={!showText}\n >\n <li\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.BREADCRUMB_ITEM, id)}\n className={cx(styles.breadcrumbItemWrapper, className, {\n [styles.disabled]: disabled\n })}\n >\n <BreadcrumbContent\n ref={componentRef}\n isClickable={isClickable}\n link={link}\n onClick={onClick}\n text={text}\n icon={icon}\n isCurrent={isCurrent}\n disabled={disabled}\n showText={showText}\n />\n </li>\n </Tooltip>\n );\n};\n\nexport default BreadcrumbItem;\n"],"names":["BreadcrumbItem","_ref","className","_ref$text","text","disabled","_ref$isClickable","isClickable","link","onClick","_ref$isCurrent","isCurrent","icon","id","_ref$showText","showText","dataTestId","componentRef","useRef","isOverflowing","useIsOverflowing","ref","React","createElement","Tooltip","disableDialogSlide","withoutDialog","content","showTrigger","hideTrigger","addKeyboardHideShowTriggersByDefault","getTestId","ComponentDefaultTestId","BREADCRUMB_ITEM","cx","styles","breadcrumbItemWrapper","_defineProperty","BreadcrumbContent"],"mappings":"wcA4CA,IAAMA,EAAgD,SAAlCC,GAYf,IAXHC,EAASD,EAATC,UAASC,EAAAF,EACTG,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAQJ,EAARI,SAAQC,EAAAL,EACRM,YAAAA,OAAc,IAAHD,GAAQA,EACnBE,EAAIP,EAAJO,KACAC,EAAOR,EAAPQ,QAAOC,EAAAT,EACPU,UAAAA,OAAY,IAAHD,GAAQA,EACjBE,EAAIX,EAAJW,KACAC,EAAEZ,EAAFY,GAAEC,EAAAb,EACFc,SAAAA,OAAW,IAAHD,GAAOA,EACAE,EAAUf,EAAzB,eAEMgB,EAAeC,EAAwB,MACvCC,EAAgBC,EAAiB,CAAEC,IAAKJ,IAE9C,OACEK,EAACC,cAAAC,EACC,CAAAC,oBAAoB,EACpBC,eAAe,EACfC,SAAUR,IAAkBJ,IAAaX,EACzCwB,YAAa,CAAC,cACdC,YAAa,CAAC,cACdC,sCAAuCf,GAEvCO,EACEC,cAAA,KAAA,CAAAV,GAAIA,EACS,cAAAG,GAAce,EAAUC,EAAuBC,gBAAiBpB,GAC7EX,UAAWgC,EAAGC,EAAOC,sBAAuBlC,EAASmC,KAClDF,EAAO9B,SAAWA,KAGrBiB,EAAAC,cAACe,EACC,CAAAjB,IAAKJ,EACLV,YAAaA,EACbC,KAAMA,EACNC,QAASA,EACTL,KAAMA,EACNQ,KAAMA,EACND,UAAWA,EACXN,SAAUA,EACVU,SAAUA,KAKpB"}
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbsBar.js","sources":["../../../../../src/components/BreadcrumbsBar/BreadcrumbsBar.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { FC, ReactElement } from \"react\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { NavigationChevronRight } from \"@vibe/icons\";\nimport { BreadcrumbsBarType as BreadcrumbsBarTypeEnum } from \"./BreadcrumbsConstants\";\nimport { BreadcrumbsBarType } from \"./Breadcrumbs.types\";\nimport { BreadcrumbItemProps } from \"./BreadcrumbItem/BreadcrumbItem\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./BreadcrumbsBar.module.scss\";\n\nexport interface BreadcrumbBarProps extends VibeComponentProps {\n /** The type of the bar is responsible for whether it will be navigational or for indication only */\n type: BreadcrumbsBarType;\n children: ReactElement<BreadcrumbItemProps> | ReactElement<BreadcrumbItemProps>[];\n}\n\nconst BreadcrumbsBar: FC<BreadcrumbBarProps> & { types?: typeof BreadcrumbsBarTypeEnum } = ({\n className,\n children,\n type = \"indication\",\n id,\n \"data-testid\": dataTestId\n}: BreadcrumbBarProps) => (\n <nav\n aria-label=\"Breadcrumb\"\n className={cx(styles.breadcrumbsBar, className)}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.BREADCRUMBS_BAR, id)}\n >\n <ol>\n {children &&\n React.Children.map(children, (child, index) =>\n React.isValidElement(child)\n ? [\n index > 0 && <NavigationChevronRight className={styles.separatorIcon} size=\"14\" aria-hidden=\"true\" />,\n React.cloneElement(child, {\n ...child?.props,\n isClickable: type !== \"indication\"\n })\n ]\n : null\n )}\n </ol>\n </nav>\n);\n\nexport default withStaticProps(BreadcrumbsBar, {\n types: BreadcrumbsBarTypeEnum\n});\n"],"names":["withStaticProps","_ref","children","_ref$type","type","id","dataTestId","React","createElement","className","cx","styles","breadcrumbsBar","getTestId","ComponentDefaultTestId","BREADCRUMBS_BAR","Children","map","child","index","isValidElement","NavigationChevronRight","separatorIcon","size","cloneElement","Object","assign","props","isClickable","types","BreadcrumbsBarTypeEnum"],"mappings":"uZAgBA,IA8BeA,EAAAA,GA9B4E,SAAvEC,GAAA,IAElBC,EAAQD,EAARC,SAAQC,EAAAF,EACRG,KAAAA,OAAO,IAAHD,EAAG,aAAYA,EACnBE,EAAEJ,EAAFI,GACeC,EAAUL,EAAzB,eAAa,OAEbM,EACaC,cAAA,MAAA,CAAA,aAAA,aACXC,UAAWC,EAAGC,EAAOC,eARdX,EAATQ,WASEJ,GAAIA,EAAE,cACOC,GAAcO,EAAUC,EAAuBC,gBAAiBV,IAE7EE,EAAAC,cAAA,KAAA,KACGN,GACCK,EAAMS,SAASC,IAAIf,GAAU,SAACgB,EAAOC,GAAK,OACxCZ,EAAMa,eAAeF,GACjB,CACEC,EAAQ,GAAKZ,EAACC,cAAAa,GAAuBZ,UAAWE,EAAOW,cAAeC,KAAK,KAAI,cAAa,SAC5FhB,EAAMiB,aAAaN,EACdO,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAR,aAAK,EAALA,EAAOS,OACV,CAAAC,YAAsB,eAATxB,MAGjB,IAAI,KAGV,GAGuC,CAC7CyB,MAAOC"}
1
+ {"version":3,"file":"BreadcrumbsBar.js","sources":["../../../../../src/components/BreadcrumbsBar/BreadcrumbsBar.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { FC, ReactElement } from \"react\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { NavigationChevronRight } from \"@vibe/icons\";\nimport { BreadcrumbsBarType as BreadcrumbsBarTypeEnum } from \"./BreadcrumbsConstants\";\nimport { BreadcrumbsBarType } from \"./Breadcrumbs.types\";\nimport { BreadcrumbItemProps } from \"./BreadcrumbItem/BreadcrumbItem\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./BreadcrumbsBar.module.scss\";\n\nexport interface BreadcrumbBarProps extends VibeComponentProps {\n /**\n * The type of the breadcrumb bar, determining if it is navigational or for indication only.\n */\n type: BreadcrumbsBarType;\n /**\n * The breadcrumb items displayed in the bar.\n */\n children: ReactElement<BreadcrumbItemProps> | ReactElement<BreadcrumbItemProps>[];\n}\n\nconst BreadcrumbsBar: FC<BreadcrumbBarProps> & { types?: typeof BreadcrumbsBarTypeEnum } = ({\n className,\n children,\n type = \"indication\",\n id,\n \"data-testid\": dataTestId\n}: BreadcrumbBarProps) => (\n <nav\n aria-label=\"Breadcrumb\"\n className={cx(styles.breadcrumbsBar, className)}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.BREADCRUMBS_BAR, id)}\n >\n <ol>\n {children &&\n React.Children.map(children, (child, index) =>\n React.isValidElement(child)\n ? [\n index > 0 && <NavigationChevronRight className={styles.separatorIcon} size=\"14\" aria-hidden=\"true\" />,\n React.cloneElement(child, {\n ...child?.props,\n isClickable: type !== \"indication\"\n })\n ]\n : null\n )}\n </ol>\n </nav>\n);\n\nexport default withStaticProps(BreadcrumbsBar, {\n types: BreadcrumbsBarTypeEnum\n});\n"],"names":["withStaticProps","_ref","children","_ref$type","type","id","dataTestId","React","createElement","className","cx","styles","breadcrumbsBar","getTestId","ComponentDefaultTestId","BREADCRUMBS_BAR","Children","map","child","index","isValidElement","NavigationChevronRight","separatorIcon","size","cloneElement","Object","assign","props","isClickable","types","BreadcrumbsBarTypeEnum"],"mappings":"uZAqBA,IA8BeA,EAAAA,GA9B4E,SAAvEC,GAAA,IAElBC,EAAQD,EAARC,SAAQC,EAAAF,EACRG,KAAAA,OAAO,IAAHD,EAAG,aAAYA,EACnBE,EAAEJ,EAAFI,GACeC,EAAUL,EAAzB,eAAa,OAEbM,EACaC,cAAA,MAAA,CAAA,aAAA,aACXC,UAAWC,EAAGC,EAAOC,eARdX,EAATQ,WASEJ,GAAIA,EAAE,cACOC,GAAcO,EAAUC,EAAuBC,gBAAiBV,IAE7EE,EAAAC,cAAA,KAAA,KACGN,GACCK,EAAMS,SAASC,IAAIf,GAAU,SAACgB,EAAOC,GAAK,OACxCZ,EAAMa,eAAeF,GACjB,CACEC,EAAQ,GAAKZ,EAACC,cAAAa,GAAuBZ,UAAWE,EAAOW,cAAeC,KAAK,KAAI,cAAa,SAC5FhB,EAAMiB,aAAaN,EACdO,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAR,aAAK,EAALA,EAAOS,OACV,CAAAC,YAAsB,eAATxB,MAGjB,IAAI,KAGV,GAGuC,CAC7CyB,MAAOC"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as a,useRef as o,useEffect as n,useCallback as r,useMemo as i}from"react";import{camelCase as s}from"lodash-es";import l from"classnames";import{SIZES as c}from"../../constants/sizes.js";import u from"../../hooks/useMergeRef.js";import{NOOP as d}from"../../utils/function-utils.js";import m from"../Icon/Icon.js";import p from"../Loader/Loader.js";import{BUTTON_ICON_SIZE as f,SMALL_BUTTON_ICON_SIZE as g,ButtonColor as y,ButtonType as b,ButtonInputType as v}from"./ButtonConstants.js";import{TRANSPARENT_COLOR as h,getParentBackgroundColorNotTransparent as C}from"./helper/dom-helpers.js";import{getTestId as j}from"../../tests/testIds.js";import{withStaticProps as x}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{getStyle as F}from"../../helpers/typesciptCssModulesHelper.js";import{ComponentDefaultTestId as N,ComponentVibeId as k}from"../../tests/constants.js";import E from"./Button.module.scss.js";import{useButtonLoading as I}from"./helper/useButtonLoading.js";var B=a((function(a,c){var d=a.className,y=a.children,b=a.kind,v=a.onClick,h=a.name,x=a.size,B=a.color,P=a.disabled,S=a.rightIcon,T=a.leftIcon,L=a.success,O=a.successText,z=a.successIcon,M=a.style,w=a.loading,D=a.loaderClassName,U=a.active,A=a.activeButtonClassName,H=a.id,R=a.marginRight,_=a.marginLeft,q=a.type,G=a.onMouseDown,J=a.ariaLabel,K=a.rightFlat,Q=a.leftFlat,V=a.preventClickAnimation,W=a.noSidePadding,X=a.onFocus,Y=a.onBlur,Z=a.ariaLabeledBy,$=a.defaultTextColorOnPrimaryColor,ee=a.ariaHasPopup,te=a.ariaExpanded,ae=a.ariaControls,oe=a["aria-describedby"],ne=a["aria-hidden"],re=a["aria-pressed"],ie=a.blurOnMouseUp,se=a["data-testid"],le=a.insetFocus,ce=a.tabIndex,ue=o(null),de=u(c,ue),me=I({isLoading:w}).loading;n((function(){if(("on-primary-color"===B||"fixed-light"===B)&&"primary"===b&&ue.current){var e=ue.current;e.style.color=C(e,$)}}),[b,ue,B,$]);var pe=r((function(){var e=ue.current;!P&&e&&ie&&e.blur()}),[P,ue,ie]),fe=r((function(e){P||me||L?e.preventDefault():v&&v(e)}),[v,P,me,L]),ge=r((function(e){P||me||L?e.preventDefault():G&&G(e)}),[G,P,me,L]),ye=i((function(){var t,a=L?"positive":B;return l(d,E.button,F(E,s("size-"+x)),F(E,s("kind-"+b)),F(E,s("color-"+a)),(e(e(e(e(e(e(e(e(e(e(t={},E.success,L),F(E,s("color-"+a+"-active")),U),A,U),E.marginRight,R),E.marginLeft,_),E.rightFlat,K),E.leftFlat,Q),E.preventClickAnimation,V),E.noSidePadding,W),E.disabled,P),e(t,E.insetFocusStyle,le)))}),[L,B,d,x,b,U,A,R,_,K,Q,V,W,P,le]),be=i((function(){return{ref:de,type:q,className:ye,name:h,onMouseUp:pe,style:M,onClick:fe,id:H,onFocus:X,onBlur:Y,tabIndex:P||ne?-1:ce,"data-testid":se||j(N.BUTTON,H),"data-vibe":k.BUTTON,onMouseDown:ge,"aria-disabled":P,"aria-busy":me,"aria-labelledby":Z,"aria-label":J,"aria-haspopup":ee,"aria-expanded":te,"aria-controls":ae,"aria-describedby":oe,"aria-hidden":ne,"aria-pressed":re}}),[de,q,ye,h,pe,M,fe,H,X,Y,ce,se,ge,P,me,Z,J,ee,te,ae,oe,ne,re]),ve=r((function(e){if("function"==typeof e)switch(x){case"xxs":case"xs":return g;default:return f}}),[x]),he=i((function(){return t.Children.toArray(y).some(Boolean)}),[y]),Ce=i((function(){return t.createElement(t.Fragment,null,T?t.createElement(m,{iconType:"font",icon:T,iconSize:ve(T),className:l(e({},E.leftIcon,he)),ignoreFocusStyle:!0}):null,y,S?t.createElement(m,{iconType:"font",icon:S,iconSize:ve(S),className:l(e({},E.rightIcon,he)),ignoreFocusStyle:!0}):null)}),[y,he,ve,T,S]);return me?t.createElement("button",Object.assign({},be,{key:"".concat(H,"-loading")}),t.createElement("span",{className:l(E.loader,D)},t.createElement(p,{className:E.loaderSvg}),t.createElement("span",{"aria-hidden":!0,className:E.textPlaceholder},Ce))):L?t.createElement("button",Object.assign({},be,{key:"".concat(H,"-success")}),t.createElement("span",{className:E.successContent},z?t.createElement(m,{iconType:"font",icon:z,iconSize:ve(z),className:l(e({},E.leftIcon,!!O)),ignoreFocusStyle:!0}):null,O),t.createElement("span",{"aria-hidden":"true",className:E.textPlaceholder},Ce)):t.createElement("button",Object.assign({},be,{key:"".concat(H,"-button")}),Ce)}));B.defaultProps={className:void 0,name:void 0,style:void 0,id:void 0,kind:"primary",onClick:d,size:"medium",color:"primary",disabled:!1,rightIcon:null,leftIcon:null,success:!1,successText:"",successIcon:null,loading:!1,loaderClassName:void 0,active:!1,marginRight:!1,marginLeft:!1,type:"button",onMouseDown:d,rightFlat:!1,leftFlat:!1,preventClickAnimation:!1,noSidePadding:!1,onFocus:d,onBlur:d,defaultTextColorOnPrimaryColor:h,ariaHasPopup:void 0,blurOnMouseUp:!0,ariaExpanded:void 0,ariaControls:void 0,ariaLabel:void 0,ariaLabeledBy:void 0,insetFocus:!1};var P=x(B,{sizes:c,colors:y,kinds:b,types:v,inputTags:v});export{P as default};
1
+ import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as a,useRef as o,useEffect as n,useCallback as r,useMemo as i}from"react";import{camelCase as s}from"lodash-es";import l from"classnames";import{SIZES as c}from"../../constants/sizes.js";import u from"../../hooks/useMergeRef.js";import{NOOP as d}from"../../utils/function-utils.js";import m from"../Icon/Icon.js";import p from"../Loader/Loader.js";import{BUTTON_ICON_SIZE as f,SMALL_BUTTON_ICON_SIZE as g,ButtonColor as y,ButtonType as b,ButtonInputType as v}from"./ButtonConstants.js";import{TRANSPARENT_COLOR as h,getParentBackgroundColorNotTransparent as C}from"./helper/dom-helpers.js";import{getTestId as j}from"../../tests/testIds.js";import{withStaticProps as x}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{getStyle as F}from"../../helpers/typesciptCssModulesHelper.js";import{ComponentDefaultTestId as N,ComponentVibeId as k}from"../../tests/constants.js";import E from"./Button.module.scss.js";import{useButtonLoading as I}from"./helper/useButtonLoading.js";var B=a((function(a,c){var d=a.className,y=a.children,b=a.kind,v=a.onClick,h=a.name,x=a.size,B=a.color,P=a.disabled,S=a.rightIcon,T=a.leftIcon,L=a.success,O=a.successText,z=a.successIcon,M=a.style,w=a.loading,D=a.loaderClassName,U=a.active,A=a.activeButtonClassName,H=a.id,R=a.marginRight,_=a.marginLeft,q=a.type,G=a.onMouseDown,J=a.ariaLabel,K=a.rightFlat,Q=a.leftFlat,V=a.preventClickAnimation,W=a.noSidePadding,X=a.onFocus,Y=a.onBlur,Z=a.ariaLabeledBy,$=a.defaultTextColorOnPrimaryColor,ee=a.ariaHasPopup,te=a.ariaExpanded,ae=a.ariaControls,oe=a["aria-describedby"],ne=a["aria-hidden"],re=a["aria-pressed"],ie=a.blurOnMouseUp,se=a["data-testid"],le=a.insetFocus,ce=a.tabIndex,ue=o(null),de=u(c,ue),me=I({isLoading:w}).loading;n((function(){if(("on-primary-color"===B||"fixed-light"===B)&&"primary"===b&&ue.current){var e=ue.current;e.style.color=C(e,$)}}),[b,ue,B,$]);var pe=r((function(){var e=ue.current;!P&&e&&ie&&e.blur()}),[P,ue,ie]),fe=r((function(e){P||me||L?e.preventDefault():v&&v(e)}),[v,P,me,L]),ge=r((function(e){P||me||L?e.preventDefault():G&&G(e)}),[G,P,me,L]),ye=i((function(){var t,a=L?"positive":B;return l(d,E.button,F(E,s("size-"+x)),F(E,s("kind-"+b)),F(E,s("color-"+a)),(e(e(e(e(e(e(e(e(e(e(t={},E.success,L),F(E,s("color-"+a+"-active")),U),A,U),E.marginRight,R),E.marginLeft,_),E.rightFlat,K),E.leftFlat,Q),E.preventClickAnimation,V),E.noSidePadding,W),E.disabled,P),e(t,E.insetFocusStyle,le)))}),[L,B,d,x,b,U,A,R,_,K,Q,V,W,P,le]),be=i((function(){return{ref:de,type:q,className:ye,name:h,onMouseUp:pe,style:M,onClick:fe,id:H,onFocus:X,onBlur:Y,tabIndex:P||ne?-1:ce,"data-testid":se||j(N.BUTTON,H),"data-vibe":k.BUTTON,onMouseDown:ge,"aria-disabled":P,"aria-busy":me,"aria-labelledby":Z,"aria-label":J,"aria-haspopup":ee,"aria-expanded":te,"aria-controls":ae,"aria-describedby":oe,"aria-hidden":ne,"aria-pressed":re}}),[de,q,ye,h,pe,M,fe,H,X,Y,ce,se,ge,P,me,Z,J,ee,te,ae,oe,ne,re]),ve=r((function(e){if("function"==typeof e)switch(x){case"xxs":case"xs":return g;default:return f}}),[x]),he=i((function(){return t.Children.toArray(y).some(Boolean)}),[y]),Ce=i((function(){return t.createElement(t.Fragment,null,T?t.createElement(m,{iconType:"font",icon:T,iconSize:ve(T),className:l(e({},E.leftIcon,he)),ignoreFocusStyle:!0}):null,y,S?t.createElement(m,{iconType:"font",icon:S,iconSize:ve(S),className:l(e({},E.rightIcon,he)),ignoreFocusStyle:!0}):null)}),[y,he,ve,T,S]);return me?t.createElement("button",Object.assign({},be,{key:"".concat(H,"-loading")}),t.createElement("span",{className:l(E.loader,D)},t.createElement(p,{className:E.loaderSvg}),t.createElement("span",{"aria-hidden":!0,className:E.textPlaceholder},Ce))):L?t.createElement("button",Object.assign({},be,{key:"".concat(H,"-success")}),t.createElement("span",{className:E.successContent},z?t.createElement(m,{iconType:"font",icon:z,iconSize:ve(z),className:l(e({},E.leftIcon,!!O)),ignoreFocusStyle:!0}):null,O),t.createElement("span",{"aria-hidden":"true",className:E.textPlaceholder},Ce)):t.createElement("button",Object.assign({},be,{key:"".concat(H,"-button")}),Ce)}));B.defaultProps={name:void 0,style:void 0,kind:"primary",onClick:d,size:"medium",color:"primary",disabled:!1,rightIcon:null,leftIcon:null,success:!1,successText:"",successIcon:null,loading:!1,loaderClassName:void 0,active:!1,marginRight:!1,marginLeft:!1,type:"button",onMouseDown:d,rightFlat:!1,leftFlat:!1,preventClickAnimation:!1,noSidePadding:!1,onFocus:d,onBlur:d,defaultTextColorOnPrimaryColor:h,ariaHasPopup:void 0,blurOnMouseUp:!0,ariaExpanded:void 0,ariaControls:void 0,ariaLabel:void 0,ariaLabeledBy:void 0,insetFocus:!1};var P=x(B,{sizes:c,colors:y,kinds:b,types:v,inputTags:v});export{P as default};
2
2
  //# sourceMappingURL=Button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type */\nimport React, { AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { SIZES } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport Icon from \"../../components/Icon/Icon\";\nimport Loader from \"../../components/Loader/Loader\";\nimport {\n BUTTON_ICON_SIZE,\n ButtonColor as ButtonColorEnum,\n ButtonInputType as ButtonInputTypeEnum,\n ButtonType as ButtonTypeEnum,\n SMALL_BUTTON_ICON_SIZE\n} from \"./ButtonConstants\";\nimport { ButtonColor, ButtonInputType, ButtonType, ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n children: React.ReactNode;\n /** Custom class names to pass to the component */\n className?: string;\n activeButtonClassName?: string;\n /** The button's kind */\n kind?: ButtonType;\n /** Callback function to run when the button is clicked */\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /** Blur on button click */\n blurOnMouseUp?: boolean;\n /** Name of the button - for form submit usages */\n name?: string;\n /** The button's size */\n size?: ButtonSize;\n /** The button's color */\n color?: ButtonColor;\n /** The button's type */\n type?: ButtonInputType;\n /** Whether the button should be disabled or not */\n disabled?: boolean;\n /** Icon to place on the right */\n rightIcon?: SubIcon;\n /** Icon to place on the left */\n leftIcon?: SubIcon;\n /** the success props are used when you have async action and wants to display a success message */\n success?: boolean;\n /** Success icon name */\n successIcon?: SubIcon;\n /** Success text */\n successText?: string;\n /** loading boolean which switches the text to a loader */\n loading?: boolean;\n /** className which is applied to loader container **/\n loaderClassName?: string;\n style?: React.CSSProperties;\n /** displays the active state */\n active?: boolean;\n /** id to pass to the button */\n id?: string;\n /** adds 8px margin to the right */\n marginRight?: boolean;\n /** adds 8px margin to the left */\n marginLeft?: boolean;\n /** element id to describe the button accordingly */\n ariaLabeledBy?: string;\n /** aria label to provide important when providing only Icon */\n ariaLabel?: string;\n /** aria for a button popup */\n ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n /** aria to be set if the popup is open */\n ariaExpanded?: boolean;\n /** aria controls - receives id for the controlled region */\n ariaControls?: string;\n \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n /**\n * aria to be used for screen reader to know if the button is hidden\n */\n \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n /**\n * Indicates the current \"pressed\" state of toggle buttons\n */\n \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n /** On Button Focus callback */\n onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n /** On Button Blur callback */\n onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n rightFlat?: boolean;\n leftFlat?: boolean;\n preventClickAnimation?: boolean;\n noSidePadding?: boolean;\n /** default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) */\n defaultTextColorOnPrimaryColor?: string;\n \"data-testid\"?: string;\n /** Change the focus indicator from around the button to within it */\n insetFocus?: boolean;\n /** Specifies the tab order of an element */\n tabIndex?: number;\n}\n\nconst Button: VibeComponent<ButtonProps, unknown> & {\n sizes?: typeof SIZES;\n colors?: typeof ButtonColorEnum;\n kinds?: typeof ButtonTypeEnum;\n types?: typeof ButtonInputTypeEnum;\n inputTags?: typeof ButtonInputTypeEnum;\n} = forwardRef<unknown, ButtonProps>(\n (\n {\n className,\n children,\n kind,\n onClick,\n name,\n size,\n color,\n disabled,\n rightIcon,\n leftIcon,\n success,\n successText,\n successIcon,\n style,\n loading: isLoading,\n loaderClassName,\n active,\n activeButtonClassName,\n id,\n marginRight,\n marginLeft,\n type,\n onMouseDown,\n ariaLabel,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n onFocus,\n onBlur,\n ariaLabeledBy,\n defaultTextColorOnPrimaryColor,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed,\n blurOnMouseUp,\n \"data-testid\": dataTestId,\n insetFocus,\n tabIndex\n }: ButtonProps,\n ref\n ) => {\n const buttonRef = useRef<HTMLButtonElement>(null);\n const mergedRef = useMergeRef(ref, buttonRef);\n\n const { loading } = useButtonLoading({ isLoading });\n\n useEffect(() => {\n if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n if (kind !== \"primary\") return;\n if (!buttonRef.current) return;\n\n const buttonElement = buttonRef.current;\n buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n const onMouseUp = useCallback(() => {\n const button = buttonRef.current;\n if (disabled || !button) {\n return;\n }\n if (blurOnMouseUp) {\n button.blur();\n }\n }, [disabled, buttonRef, blurOnMouseUp]);\n\n const onButtonClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled || loading || success) {\n event.preventDefault();\n return;\n }\n\n if (onClick) {\n onClick(event);\n }\n },\n [onClick, disabled, loading, success]\n );\n\n const onMouseDownClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled || loading || success) {\n event.preventDefault();\n return;\n }\n\n if (onMouseDown) {\n onMouseDown(event);\n }\n },\n [onMouseDown, disabled, loading, success]\n );\n\n const classNames = useMemo(() => {\n const calculatedColor = success ? \"positive\" : color;\n return cx(\n className,\n styles.button,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n {\n [styles.success]: success,\n [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n [activeButtonClassName]: active,\n [styles.marginRight]: marginRight,\n [styles.marginLeft]: marginLeft,\n [styles.rightFlat]: rightFlat,\n [styles.leftFlat]: leftFlat,\n [styles.preventClickAnimation]: preventClickAnimation,\n [styles.noSidePadding]: noSidePadding,\n [styles.disabled]: disabled,\n [styles.insetFocusStyle]: insetFocus\n }\n );\n }, [\n success,\n color,\n className,\n size,\n kind,\n active,\n activeButtonClassName,\n marginRight,\n marginLeft,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n disabled,\n insetFocus\n ]);\n\n const buttonProps = useMemo(() => {\n const props: Record<string, unknown> = {\n ref: mergedRef,\n type,\n className: classNames,\n name,\n onMouseUp,\n style,\n onClick: onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex: disabled || ariaHidden ? -1 : tabIndex,\n \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.BUTTON, id),\n \"data-vibe\": ComponentVibeId.BUTTON,\n onMouseDown: onMouseDownClicked,\n \"aria-disabled\": disabled,\n \"aria-busy\": loading,\n \"aria-labelledby\": ariaLabeledBy,\n \"aria-label\": ariaLabel,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-expanded\": ariaExpanded,\n \"aria-controls\": ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed\n };\n return props;\n }, [\n mergedRef,\n type,\n classNames,\n name,\n onMouseUp,\n style,\n onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex,\n dataTestId,\n onMouseDownClicked,\n disabled,\n loading,\n ariaLabeledBy,\n ariaLabel,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n ariaDescribedBy,\n ariaHidden,\n ariaPressed\n ]);\n\n const iconSize = useCallback(\n (icon: SubIcon) => {\n if (typeof icon !== \"function\") return;\n switch (size) {\n case \"xxs\":\n case \"xs\":\n return SMALL_BUTTON_ICON_SIZE;\n default:\n return BUTTON_ICON_SIZE;\n }\n },\n [size]\n );\n\n const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n const buttonContent = useMemo(\n () => (\n <>\n {leftIcon ? (\n <Icon\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize(leftIcon)}\n className={cx({\n [styles.leftIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n {children}\n {rightIcon ? (\n <Icon\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize(rightIcon)}\n className={cx({\n [styles.rightIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n </>\n ),\n [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n );\n\n if (loading) {\n return (\n <button {...buttonProps} key={`${id}-loading`}>\n <span className={cx(styles.loader, loaderClassName)}>\n <Loader className={styles.loaderSvg} />\n <span aria-hidden className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </span>\n </button>\n );\n }\n\n if (success) {\n return (\n <button {...buttonProps} key={`${id}-success`}>\n <span className={styles.successContent}>\n {successIcon ? (\n <Icon\n iconType=\"font\"\n icon={successIcon}\n iconSize={iconSize(successIcon)}\n className={cx({\n [styles.leftIcon]: !!successText\n })}\n ignoreFocusStyle\n />\n ) : null}\n {successText}\n </span>\n <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </button>\n );\n }\n\n return (\n <button {...buttonProps} key={`${id}-button`}>\n {buttonContent}\n </button>\n );\n }\n);\n\nButton.defaultProps = {\n className: undefined,\n name: undefined,\n style: undefined,\n id: undefined,\n kind: \"primary\",\n onClick: NOOP,\n size: \"medium\",\n color: \"primary\",\n disabled: false,\n rightIcon: null,\n leftIcon: null,\n success: false,\n successText: \"\",\n successIcon: null,\n loading: false,\n loaderClassName: undefined,\n active: false,\n marginRight: false,\n marginLeft: false,\n type: \"button\",\n onMouseDown: NOOP,\n rightFlat: false,\n leftFlat: false,\n preventClickAnimation: false,\n noSidePadding: false,\n onFocus: NOOP,\n onBlur: NOOP,\n defaultTextColorOnPrimaryColor: TRANSPARENT_COLOR,\n ariaHasPopup: undefined,\n blurOnMouseUp: true,\n ariaExpanded: undefined,\n ariaControls: undefined,\n ariaLabel: undefined,\n ariaLabeledBy: undefined,\n insetFocus: false\n};\n\nexport default withStaticProps(Button, {\n sizes: SIZES,\n colors: ButtonColorEnum,\n kinds: ButtonTypeEnum,\n types: ButtonInputTypeEnum,\n inputTags: ButtonInputTypeEnum\n});\n"],"names":["Button","forwardRef","_ref","ref","className","children","kind","onClick","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","isLoading","loading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","ariaHasPopup","ariaExpanded","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","_cx","calculatedColor","cx","styles","getStyle","camelCase","_defineProperty","insetFocusStyle","buttonProps","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","SMALL_BUTTON_ICON_SIZE","BUTTON_ICON_SIZE","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","iconType","ignoreFocusStyle","key","concat","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign","defaultProps","undefined","NOOP","TRANSPARENT_COLOR","withStaticProps","sizes","SIZES","colors","ButtonColorEnum","kinds","ButtonTypeEnum","types","ButtonInputTypeEnum","inputTags"],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sources":["../../../../../src/components/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type */\nimport React, { AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { SIZES } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport Icon from \"../../components/Icon/Icon\";\nimport Loader from \"../../components/Loader/Loader\";\nimport {\n BUTTON_ICON_SIZE,\n ButtonColor as ButtonColorEnum,\n ButtonInputType as ButtonInputTypeEnum,\n ButtonType as ButtonTypeEnum,\n SMALL_BUTTON_ICON_SIZE\n} from \"./ButtonConstants\";\nimport { ButtonColor, ButtonInputType, ButtonType, ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n children: React.ReactNode;\n /** Custom class names to pass to the component */\n className?: string;\n activeButtonClassName?: string;\n /** The button's kind */\n kind?: ButtonType;\n /** Callback function to run when the button is clicked */\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /** Blur on button click */\n blurOnMouseUp?: boolean;\n /** Name of the button - for form submit usages */\n name?: string;\n /** The button's size */\n size?: ButtonSize;\n /** The button's color */\n color?: ButtonColor;\n /** The button's type */\n type?: ButtonInputType;\n /** Whether the button should be disabled or not */\n disabled?: boolean;\n /** Icon to place on the right */\n rightIcon?: SubIcon;\n /** Icon to place on the left */\n leftIcon?: SubIcon;\n /** the success props are used when you have async action and wants to display a success message */\n success?: boolean;\n /** Success icon name */\n successIcon?: SubIcon;\n /** Success text */\n successText?: string;\n /** loading boolean which switches the text to a loader */\n loading?: boolean;\n /** className which is applied to loader container **/\n loaderClassName?: string;\n style?: React.CSSProperties;\n /** displays the active state */\n active?: boolean;\n /** id to pass to the button */\n id?: string;\n /** adds 8px margin to the right */\n marginRight?: boolean;\n /** adds 8px margin to the left */\n marginLeft?: boolean;\n /** element id to describe the button accordingly */\n ariaLabeledBy?: string;\n /** aria label to provide important when providing only Icon */\n ariaLabel?: string;\n /** aria for a button popup */\n ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n /** aria to be set if the popup is open */\n ariaExpanded?: boolean;\n /** aria controls - receives id for the controlled region */\n ariaControls?: string;\n \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n /**\n * aria to be used for screen reader to know if the button is hidden\n */\n \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n /**\n * Indicates the current \"pressed\" state of toggle buttons\n */\n \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n /** On Button Focus callback */\n onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n /** On Button Blur callback */\n onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n rightFlat?: boolean;\n leftFlat?: boolean;\n preventClickAnimation?: boolean;\n noSidePadding?: boolean;\n /** default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) */\n defaultTextColorOnPrimaryColor?: string;\n \"data-testid\"?: string;\n /** Change the focus indicator from around the button to within it */\n insetFocus?: boolean;\n /** Specifies the tab order of an element */\n tabIndex?: number;\n}\n\nconst Button: VibeComponent<ButtonProps, unknown> & {\n sizes?: typeof SIZES;\n colors?: typeof ButtonColorEnum;\n kinds?: typeof ButtonTypeEnum;\n types?: typeof ButtonInputTypeEnum;\n inputTags?: typeof ButtonInputTypeEnum;\n} = forwardRef<unknown, ButtonProps>(\n (\n {\n className,\n children,\n kind,\n onClick,\n name,\n size,\n color,\n disabled,\n rightIcon,\n leftIcon,\n success,\n successText,\n successIcon,\n style,\n loading: isLoading,\n loaderClassName,\n active,\n activeButtonClassName,\n id,\n marginRight,\n marginLeft,\n type,\n onMouseDown,\n ariaLabel,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n onFocus,\n onBlur,\n ariaLabeledBy,\n defaultTextColorOnPrimaryColor,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed,\n blurOnMouseUp,\n \"data-testid\": dataTestId,\n insetFocus,\n tabIndex\n }: ButtonProps,\n ref\n ) => {\n const buttonRef = useRef<HTMLButtonElement>(null);\n const mergedRef = useMergeRef(ref, buttonRef);\n\n const { loading } = useButtonLoading({ isLoading });\n\n useEffect(() => {\n if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n if (kind !== \"primary\") return;\n if (!buttonRef.current) return;\n\n const buttonElement = buttonRef.current;\n buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n const onMouseUp = useCallback(() => {\n const button = buttonRef.current;\n if (disabled || !button) {\n return;\n }\n if (blurOnMouseUp) {\n button.blur();\n }\n }, [disabled, buttonRef, blurOnMouseUp]);\n\n const onButtonClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled || loading || success) {\n event.preventDefault();\n return;\n }\n\n if (onClick) {\n onClick(event);\n }\n },\n [onClick, disabled, loading, success]\n );\n\n const onMouseDownClicked = useCallback(\n (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (disabled || loading || success) {\n event.preventDefault();\n return;\n }\n\n if (onMouseDown) {\n onMouseDown(event);\n }\n },\n [onMouseDown, disabled, loading, success]\n );\n\n const classNames = useMemo(() => {\n const calculatedColor = success ? \"positive\" : color;\n return cx(\n className,\n styles.button,\n getStyle(styles, camelCase(\"size-\" + size)),\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n {\n [styles.success]: success,\n [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n [activeButtonClassName]: active,\n [styles.marginRight]: marginRight,\n [styles.marginLeft]: marginLeft,\n [styles.rightFlat]: rightFlat,\n [styles.leftFlat]: leftFlat,\n [styles.preventClickAnimation]: preventClickAnimation,\n [styles.noSidePadding]: noSidePadding,\n [styles.disabled]: disabled,\n [styles.insetFocusStyle]: insetFocus\n }\n );\n }, [\n success,\n color,\n className,\n size,\n kind,\n active,\n activeButtonClassName,\n marginRight,\n marginLeft,\n rightFlat,\n leftFlat,\n preventClickAnimation,\n noSidePadding,\n disabled,\n insetFocus\n ]);\n\n const buttonProps = useMemo(() => {\n const props: Record<string, unknown> = {\n ref: mergedRef,\n type,\n className: classNames,\n name,\n onMouseUp,\n style,\n onClick: onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex: disabled || ariaHidden ? -1 : tabIndex,\n \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.BUTTON, id),\n \"data-vibe\": ComponentVibeId.BUTTON,\n onMouseDown: onMouseDownClicked,\n \"aria-disabled\": disabled,\n \"aria-busy\": loading,\n \"aria-labelledby\": ariaLabeledBy,\n \"aria-label\": ariaLabel,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-expanded\": ariaExpanded,\n \"aria-controls\": ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed\n };\n return props;\n }, [\n mergedRef,\n type,\n classNames,\n name,\n onMouseUp,\n style,\n onButtonClicked,\n id,\n onFocus,\n onBlur,\n tabIndex,\n dataTestId,\n onMouseDownClicked,\n disabled,\n loading,\n ariaLabeledBy,\n ariaLabel,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n ariaDescribedBy,\n ariaHidden,\n ariaPressed\n ]);\n\n const iconSize = useCallback(\n (icon: SubIcon) => {\n if (typeof icon !== \"function\") return;\n switch (size) {\n case \"xxs\":\n case \"xs\":\n return SMALL_BUTTON_ICON_SIZE;\n default:\n return BUTTON_ICON_SIZE;\n }\n },\n [size]\n );\n\n const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n const buttonContent = useMemo(\n () => (\n <>\n {leftIcon ? (\n <Icon\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize(leftIcon)}\n className={cx({\n [styles.leftIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n {children}\n {rightIcon ? (\n <Icon\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize(rightIcon)}\n className={cx({\n [styles.rightIcon]: hasRenderableChildren\n })}\n ignoreFocusStyle\n />\n ) : null}\n </>\n ),\n [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n );\n\n if (loading) {\n return (\n <button {...buttonProps} key={`${id}-loading`}>\n <span className={cx(styles.loader, loaderClassName)}>\n <Loader className={styles.loaderSvg} />\n <span aria-hidden className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </span>\n </button>\n );\n }\n\n if (success) {\n return (\n <button {...buttonProps} key={`${id}-success`}>\n <span className={styles.successContent}>\n {successIcon ? (\n <Icon\n iconType=\"font\"\n icon={successIcon}\n iconSize={iconSize(successIcon)}\n className={cx({\n [styles.leftIcon]: !!successText\n })}\n ignoreFocusStyle\n />\n ) : null}\n {successText}\n </span>\n <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n {buttonContent}\n </span>\n </button>\n );\n }\n\n return (\n <button {...buttonProps} key={`${id}-button`}>\n {buttonContent}\n </button>\n );\n }\n);\n\nButton.defaultProps = {\n name: undefined,\n style: undefined,\n kind: \"primary\",\n onClick: NOOP,\n size: \"medium\",\n color: \"primary\",\n disabled: false,\n rightIcon: null,\n leftIcon: null,\n success: false,\n successText: \"\",\n successIcon: null,\n loading: false,\n loaderClassName: undefined,\n active: false,\n marginRight: false,\n marginLeft: false,\n type: \"button\",\n onMouseDown: NOOP,\n rightFlat: false,\n leftFlat: false,\n preventClickAnimation: false,\n noSidePadding: false,\n onFocus: NOOP,\n onBlur: NOOP,\n defaultTextColorOnPrimaryColor: TRANSPARENT_COLOR,\n ariaHasPopup: undefined,\n blurOnMouseUp: true,\n ariaExpanded: undefined,\n ariaControls: undefined,\n ariaLabel: undefined,\n ariaLabeledBy: undefined,\n insetFocus: false\n};\n\nexport default withStaticProps(Button, {\n sizes: SIZES,\n colors: ButtonColorEnum,\n kinds: ButtonTypeEnum,\n types: ButtonInputTypeEnum,\n inputTags: ButtonInputTypeEnum\n});\n"],"names":["Button","forwardRef","_ref","ref","className","children","kind","onClick","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","isLoading","loading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","ariaHasPopup","ariaExpanded","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","_cx","calculatedColor","cx","styles","getStyle","camelCase","_defineProperty","insetFocusStyle","buttonProps","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","SMALL_BUTTON_ICON_SIZE","BUTTON_ICON_SIZE","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","iconType","ignoreFocusStyle","key","concat","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign","defaultProps","undefined","NOOP","TRANSPARENT_COLOR","withStaticProps","sizes","SIZES","colors","ButtonColorEnum","kinds","ButtonTypeEnum","types","ButtonInputTypeEnum","inputTags"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonGroup.js","sources":["../../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport Button from \"../Button/Button\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { ButtonValue } from \"./ButtonGroupConstants\";\nimport { ButtonWrapper } from \"./ButtonWrapper\";\nimport { SIZES } from \"../../constants\";\nimport { ButtonType as ButtonTypeEnum } from \"../Button/ButtonConstants\";\nimport { ButtonType, ButtonSize } from \"../Button/Button.types\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./ButtonGroup.module.scss\";\nimport { TooltipPositions } from \"../Tooltip/Tooltip.types\";\n\ntype ButtonGroupOption = {\n icon?: SubIcon;\n leftIcon?: SubIcon;\n ariaLabel?: string;\n subText?: string;\n value: ButtonValue;\n text: string;\n disabled?: boolean;\n tooltipContent?: string;\n};\n\nexport interface ButtonGroupProps extends VibeComponentProps {\n options: Array<ButtonGroupOption>;\n value?: ButtonValue;\n onSelect?: (value: ButtonValue, name: string) => void;\n size?: ButtonSize;\n kind?: Extract<ButtonType, \"secondary\" | \"tertiary\">;\n name?: string;\n disabled?: boolean;\n groupAriaLabel?: string;\n /**\n * Where the tooltip should be in reference to the children: Top, Left, Right, Bottom ...\n */\n tooltipPosition?: TooltipPositions;\n tooltipHideDelay?: number;\n tooltipShowDelay?: number;\n tooltipContainerSelector?: string;\n tooltipMoveBy?: MoveBy;\n children?: React.ReactNode;\n fullWidth?: boolean;\n blurOnMouseUp?: boolean;\n}\n\nconst ButtonGroup: VibeComponent<ButtonGroupProps, HTMLDivElement> & {\n sizes?: typeof SIZES;\n kinds?: typeof ButtonTypeEnum;\n} = forwardRef(\n (\n {\n className,\n options,\n name = \"\",\n disabled = false,\n value = \"\",\n onSelect,\n size = \"small\",\n kind = \"secondary\",\n groupAriaLabel = \"\",\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp = true,\n id,\n \"data-testid\": dataTestId,\n fullWidth = false\n }: ButtonGroupProps,\n ref\n ) => {\n const inputRef = useRef();\n const mergedRef = useMergeRef(ref, inputRef);\n\n const [valueState, setValueState] = useState(value);\n const prevValue = usePrevious(value);\n\n const onClick = useCallback(\n (option: ButtonGroupOption) => {\n const isDisabled = disabled || option.disabled;\n if (!isDisabled) {\n setValueState(option.value);\n if (onSelect) {\n onSelect(option.value, name);\n }\n }\n },\n [onSelect, disabled, name]\n );\n\n const selectedOption = useMemo(() => {\n return options.find(option => option.value === valueState);\n }, [options, valueState]);\n\n const Buttons = useMemo(() => {\n return options.map((option, index) => {\n const isSelected = option.value === valueState;\n return (\n <ButtonWrapper\n key={option.value}\n size={size}\n onClick={() => onClick(option)}\n rightIcon={option.icon}\n leftIcon={option.leftIcon}\n active={isSelected}\n rightFlat={index !== options.length - 1}\n leftFlat={index !== 0}\n kind=\"tertiary\"\n preventClickAnimation\n ariaLabel={option.ariaLabel}\n tooltipContent={option.tooltipContent}\n tooltipPosition={tooltipPosition}\n tooltipHideDelay={tooltipHideDelay}\n tooltipShowDelay={tooltipShowDelay}\n tooltipContainerSelector={tooltipContainerSelector}\n tooltipMoveBy={tooltipMoveBy}\n blurOnMouseUp={blurOnMouseUp}\n className={cx(styles.button, styles.optionText, {\n [styles.selected]: isSelected,\n [styles.disabled]: disabled,\n [styles.buttonDisabled]: option.disabled,\n [styles.fullWidth]: fullWidth\n })}\n activeButtonClassName={styles.activeButton}\n >\n {option.text}\n </ButtonWrapper>\n );\n });\n }, [\n options,\n valueState,\n size,\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp,\n disabled,\n fullWidth,\n onClick\n ]);\n\n // Effects\n useEffect(() => {\n // Update value if changed from props\n if (value !== prevValue && value !== valueState) {\n setValueState(value);\n }\n }, [value, prevValue, valueState, setValueState]);\n\n return (\n <div\n className={cx(styles.buttonGroup, className, getStyle(styles, camelCase(\"kind-\" + kind)), {\n [styles.disabled]: disabled\n })}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.BUTTON_GROUP, id)}\n data-vibe={ComponentVibeId.BUTTON_GROUP}\n ref={mergedRef}\n >\n <div role=\"group\" aria-label={groupAriaLabel} className={cx(styles.buttonsContainer)} aria-disabled={disabled}>\n {Buttons}\n </div>\n {selectedOption && selectedOption.subText && (\n <div className={cx(styles.subTextContainer)}>{selectedOption.subText}</div>\n )}\n </div>\n );\n }\n);\n\nexport default withStaticProps(ButtonGroup, { sizes: Button.sizes, kinds: Button.kinds });\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","options","_ref$name","name","_ref$disabled","disabled","_ref$value","value","onSelect","_ref$size","size","_ref$kind","kind","_ref$groupAriaLabel","groupAriaLabel","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","_ref$blurOnMouseUp","blurOnMouseUp","id","dataTestId","_ref$fullWidth","fullWidth","inputRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","valueState","setValueState","prevValue","usePrevious","onClick","useCallback","option","selectedOption","useMemo","find","Buttons","map","index","isSelected","React","createElement","ButtonWrapper","key","rightIcon","icon","leftIcon","active","rightFlat","length","leftFlat","preventClickAnimation","ariaLabel","tooltipContent","cx","styles","button","optionText","_defineProperty","selected","buttonDisabled","activeButtonClassName","activeButton","text","useEffect","buttonGroup","getStyle","camelCase","getTestId","ComponentDefaultTestId","BUTTON_GROUP","ComponentVibeId","role","buttonsContainer","subText","subTextContainer","sizes","Button","kinds"],"mappings":"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"}
1
+ {"version":3,"file":"ButtonGroup.js","sources":["../../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport Button from \"../Button/Button\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { ButtonValue } from \"./ButtonGroupConstants\";\nimport { ButtonWrapper } from \"./ButtonWrapper\";\nimport { SIZES } from \"../../constants\";\nimport { ButtonType as ButtonTypeEnum } from \"../Button/ButtonConstants\";\nimport { ButtonType, ButtonSize } from \"../Button/Button.types\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./ButtonGroup.module.scss\";\nimport { TooltipPositions } from \"../Tooltip/Tooltip.types\";\n\ntype ButtonGroupOption = {\n icon?: SubIcon;\n leftIcon?: SubIcon;\n ariaLabel?: string;\n subText?: string;\n value: ButtonValue;\n text: string;\n disabled?: boolean;\n tooltipContent?: string;\n};\n\nexport interface ButtonGroupProps extends VibeComponentProps {\n /**\n * The list of button options.\n */\n options: Array<ButtonGroupOption>;\n /**\n * The currently selected button value.\n */\n value?: ButtonValue;\n /**\n * Callback fired when a button is selected.\n */\n onSelect?: (value: ButtonValue, name: string) => void;\n /**\n * The size of the buttons.\n */\n size?: ButtonSize;\n /**\n * The style variant of the buttons.\n */\n kind?: Extract<ButtonType, \"secondary\" | \"tertiary\">;\n /**\n * The name of the button group.\n */\n name?: string;\n /**\n * If true, disables all buttons in the group.\n */\n disabled?: boolean;\n /**\n * The label of the button group for accessibility.\n */\n groupAriaLabel?: string;\n /**\n * The position of the tooltip relative to the button.\n */\n tooltipPosition?: TooltipPositions;\n /**\n * The delay in milliseconds before the tooltip hides.\n */\n tooltipHideDelay?: number;\n /**\n * The delay in milliseconds before the tooltip shows.\n */\n tooltipShowDelay?: number;\n /**\n * CSS selector for the tooltip container.\n */\n tooltipContainerSelector?: string;\n /**\n * Adjusts the tooltip position.\n */\n tooltipMoveBy?: MoveBy;\n /**\n * The content inside the button group.\n */\n children?: React.ReactNode;\n /**\n * If true, makes the button group take the full width of its container.\n */\n fullWidth?: boolean;\n /**\n * If true, removes focus from the button after clicking.\n */\n blurOnMouseUp?: boolean;\n}\n\nconst ButtonGroup: VibeComponent<ButtonGroupProps, HTMLDivElement> & {\n sizes?: typeof SIZES;\n kinds?: typeof ButtonTypeEnum;\n} = forwardRef(\n (\n {\n className,\n options,\n name = \"\",\n disabled = false,\n value = \"\",\n onSelect,\n size = \"small\",\n kind = \"secondary\",\n groupAriaLabel = \"\",\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp = true,\n id,\n \"data-testid\": dataTestId,\n fullWidth = false\n }: ButtonGroupProps,\n ref\n ) => {\n const inputRef = useRef();\n const mergedRef = useMergeRef(ref, inputRef);\n\n const [valueState, setValueState] = useState(value);\n const prevValue = usePrevious(value);\n\n const onClick = useCallback(\n (option: ButtonGroupOption) => {\n const isDisabled = disabled || option.disabled;\n if (!isDisabled) {\n setValueState(option.value);\n if (onSelect) {\n onSelect(option.value, name);\n }\n }\n },\n [onSelect, disabled, name]\n );\n\n const selectedOption = useMemo(() => {\n return options.find(option => option.value === valueState);\n }, [options, valueState]);\n\n const Buttons = useMemo(() => {\n return options.map((option, index) => {\n const isSelected = option.value === valueState;\n return (\n <ButtonWrapper\n key={option.value}\n size={size}\n onClick={() => onClick(option)}\n rightIcon={option.icon}\n leftIcon={option.leftIcon}\n active={isSelected}\n rightFlat={index !== options.length - 1}\n leftFlat={index !== 0}\n kind=\"tertiary\"\n preventClickAnimation\n ariaLabel={option.ariaLabel}\n tooltipContent={option.tooltipContent}\n tooltipPosition={tooltipPosition}\n tooltipHideDelay={tooltipHideDelay}\n tooltipShowDelay={tooltipShowDelay}\n tooltipContainerSelector={tooltipContainerSelector}\n tooltipMoveBy={tooltipMoveBy}\n blurOnMouseUp={blurOnMouseUp}\n className={cx(styles.button, styles.optionText, {\n [styles.selected]: isSelected,\n [styles.disabled]: disabled,\n [styles.buttonDisabled]: option.disabled,\n [styles.fullWidth]: fullWidth\n })}\n activeButtonClassName={styles.activeButton}\n >\n {option.text}\n </ButtonWrapper>\n );\n });\n }, [\n options,\n valueState,\n size,\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n blurOnMouseUp,\n disabled,\n fullWidth,\n onClick\n ]);\n\n // Effects\n useEffect(() => {\n // Update value if changed from props\n if (value !== prevValue && value !== valueState) {\n setValueState(value);\n }\n }, [value, prevValue, valueState, setValueState]);\n\n return (\n <div\n className={cx(styles.buttonGroup, className, getStyle(styles, camelCase(\"kind-\" + kind)), {\n [styles.disabled]: disabled\n })}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.BUTTON_GROUP, id)}\n data-vibe={ComponentVibeId.BUTTON_GROUP}\n ref={mergedRef}\n >\n <div role=\"group\" aria-label={groupAriaLabel} className={cx(styles.buttonsContainer)} aria-disabled={disabled}>\n {Buttons}\n </div>\n {selectedOption && selectedOption.subText && (\n <div className={cx(styles.subTextContainer)}>{selectedOption.subText}</div>\n )}\n </div>\n );\n }\n);\n\nexport default withStaticProps(ButtonGroup, { sizes: Button.sizes, kinds: Button.kinds });\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","options","_ref$name","name","_ref$disabled","disabled","_ref$value","value","onSelect","_ref$size","size","_ref$kind","kind","_ref$groupAriaLabel","groupAriaLabel","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","_ref$blurOnMouseUp","blurOnMouseUp","id","dataTestId","_ref$fullWidth","fullWidth","inputRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","valueState","setValueState","prevValue","usePrevious","onClick","useCallback","option","selectedOption","useMemo","find","Buttons","map","index","isSelected","React","createElement","ButtonWrapper","key","rightIcon","icon","leftIcon","active","rightFlat","length","leftFlat","preventClickAnimation","ariaLabel","tooltipContent","cx","styles","button","optionText","_defineProperty","selected","buttonDisabled","activeButtonClassName","activeButton","text","useEffect","buttonGroup","getStyle","camelCase","getTestId","ComponentDefaultTestId","BUTTON_GROUP","ComponentVibeId","role","buttonsContainer","subText","subTextContainer","sizes","Button","kinds"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonWrapper.js","sources":["../../../../../src/components/ButtonGroup/ButtonWrapper.tsx"],"sourcesContent":["import React from \"react\";\nimport { isNil } from \"lodash-es\";\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport Tooltip from \"../Tooltip/Tooltip\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { TooltipPositions } from \"../Tooltip/Tooltip.types\";\n\nexport interface ButtonWrapperProps extends ButtonProps {\n tooltipContent?: string;\n /**\n * Where the tooltip should be in reference to the children: Top, Left, Right, Bottom ...\n */\n tooltipPosition?: TooltipPositions;\n tooltipHideDelay?: number;\n tooltipShowDelay?: number;\n tooltipContainerSelector?: string;\n tooltipMoveBy?: MoveBy;\n}\n\nexport const ButtonWrapper = ({\n tooltipContent,\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n ...otherProps\n}: ButtonWrapperProps) => {\n let button = <Button {...otherProps} />;\n if (!isNil(tooltipContent)) {\n button = (\n <Tooltip\n moveBy={tooltipMoveBy}\n position={tooltipPosition}\n hideDelay={tooltipHideDelay}\n showDelay={tooltipShowDelay}\n content={tooltipContent}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n containerSelector={tooltipContainerSelector}\n >\n {button}\n </Tooltip>\n );\n }\n\n return button;\n};\n"],"names":["ButtonWrapper","_a","tooltipContent","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","otherProps","__rest","button","React","createElement","Button","Object","assign","isNil","Tooltip","moveBy","position","hideDelay","showDelay","content","showTrigger","hideTrigger","containerSelector"],"mappings":"wLAmBaA,EAAgB,SAACC,GAAA,IAC5BC,EAOmBD,EAPnBC,eACAC,EAMmBF,EANnBE,gBACAC,EAKmBH,EALnBG,iBACAC,EAImBJ,EAJnBI,iBACAC,EAGmBL,EAHnBK,yBACAC,EAEmBN,EAFnBM,cACGC,EAAUC,EAAAR,EAPe,uHASxBS,EAASC,EAAAC,cAACC,EAAWC,OAAAC,OAAA,CAAA,EAAAP,IAkBzB,OAjBKQ,EAAMd,KACTQ,EACEC,EAACC,cAAAK,GACCC,OAAQX,EACRY,SAAUhB,EACViB,UAAWhB,EACXiB,UAAWhB,EACXiB,QAASpB,EACTqB,YAAa,CAAC,cACdC,YAAa,CAAC,cACdC,kBAAmBnB,GAElBI,IAKAA,CACT"}
1
+ {"version":3,"file":"ButtonWrapper.js","sources":["../../../../../src/components/ButtonGroup/ButtonWrapper.tsx"],"sourcesContent":["import React from \"react\";\nimport { isNil } from \"lodash-es\";\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport Tooltip from \"../Tooltip/Tooltip\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { TooltipPositions } from \"../Tooltip/Tooltip.types\";\n\nexport interface ButtonWrapperProps extends ButtonProps {\n /**\n * The content of the tooltip.\n */\n tooltipContent?: string;\n /**\n * The position of the tooltip relative to the button.\n */\n tooltipPosition?: TooltipPositions;\n /**\n * The delay in milliseconds before the tooltip hides.\n */\n tooltipHideDelay?: number;\n /**\n * The delay in milliseconds before the tooltip shows.\n */\n tooltipShowDelay?: number;\n /**\n * CSS selector for the tooltip container.\n */\n tooltipContainerSelector?: string;\n /**\n * Adjusts the tooltip position.\n */\n tooltipMoveBy?: MoveBy;\n}\n\nexport const ButtonWrapper = ({\n tooltipContent,\n tooltipPosition,\n tooltipHideDelay,\n tooltipShowDelay,\n tooltipContainerSelector,\n tooltipMoveBy,\n ...otherProps\n}: ButtonWrapperProps) => {\n let button = <Button {...otherProps} />;\n if (!isNil(tooltipContent)) {\n button = (\n <Tooltip\n moveBy={tooltipMoveBy}\n position={tooltipPosition}\n hideDelay={tooltipHideDelay}\n showDelay={tooltipShowDelay}\n content={tooltipContent}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n containerSelector={tooltipContainerSelector}\n >\n {button}\n </Tooltip>\n );\n }\n\n return button;\n};\n"],"names":["ButtonWrapper","_a","tooltipContent","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","otherProps","__rest","button","React","createElement","Button","Object","assign","isNil","Tooltip","moveBy","position","hideDelay","showDelay","content","showTrigger","hideTrigger","containerSelector"],"mappings":"wLAkCaA,EAAgB,SAACC,GAAA,IAC5BC,EAOmBD,EAPnBC,eACAC,EAMmBF,EANnBE,gBACAC,EAKmBH,EALnBG,iBACAC,EAImBJ,EAJnBI,iBACAC,EAGmBL,EAHnBK,yBACAC,EAEmBN,EAFnBM,cACGC,EAAUC,EAAAR,EAPe,uHASxBS,EAASC,EAAAC,cAACC,EAAWC,OAAAC,OAAA,CAAA,EAAAP,IAkBzB,OAjBKQ,EAAMd,KACTQ,EACEC,EAACC,cAAAK,GACCC,OAAQX,EACRY,SAAUhB,EACViB,UAAWhB,EACXiB,UAAWhB,EACXiB,QAASpB,EACTqB,YAAa,CAAC,cACdC,YAAa,CAAC,cACdC,kBAAmBnB,GAElBI,IAKAA,CACT"}
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","sources":["../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { isNil, noop as NOOP } from \"lodash-es\";\nimport Icon from \"../Icon/Icon\";\nimport { Check, Remove } from \"@vibe/icons\";\nimport { useSupportFirefoxLabelClick } from \"./hooks/useSupportFirefoxLabelClick\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { VibeComponent, VibeComponentProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Checkbox.module.scss\";\n\nexport interface CheckBoxProps extends VibeComponentProps {\n /** A classname to be added to the wrapping element */\n className?: string;\n /** A classname to be added to the checkbox element label */\n checkboxClassName?: string;\n /** A classname to be added to the label element */\n labelClassName?: string;\n /** A11y prop to describe the content for screen readers */\n ariaLabel?: string;\n /** The content to be rendered within the option */\n label?: React.ReactNode | Array<React.ReactNode>;\n /** A11y prop - An Id of an element which describes this option */\n ariaLabelledBy?: string;\n /** callback function when the value changes */\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n /** Use this when you want to control the component, this will set the state of the component */\n checked?: boolean;\n /** An in between state to display a non selected */\n indeterminate?: boolean;\n /** is autoFocus */\n autoFocus?: boolean;\n /** Set the option to be disabled */\n disabled?: boolean;\n /** the default value which the checkbox will start from */\n defaultChecked?: boolean;\n /** The input control's value. When specified in the HTML, this is the initial value, and from then on it can be altered or retrieved at any time using JavaScript to access the respective HTMLInputElement object's value property. The value attribute is always optional, though should be considered mandatory for checkbox, radio, and hidden.l */\n value?: string;\n /** A string specifying a name for the input control. This name is submitted along with the control's value when the form data is submitted. */\n name?: string;\n /** An id to be added the input element */\n id?: string;\n /** Specifies the tab order of the input element */\n tabIndex?: number;\n}\n\nconst Checkbox: VibeComponent<CheckBoxProps, HTMLInputElement> = forwardRef(\n (\n {\n className,\n checkboxClassName,\n labelClassName,\n ariaLabel,\n label,\n ariaLabelledBy,\n onChange = NOOP,\n checked,\n autoFocus,\n indeterminate = false,\n disabled = false,\n defaultChecked,\n tabIndex,\n value = \"\",\n name = \"\",\n id,\n \"data-testid\": dataTestId\n }: CheckBoxProps,\n ref\n ) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedInputRef = useMergeRef(ref, inputRef);\n const iconContainerRef = useRef<HTMLDivElement>(null);\n\n const onMouseUpCallback = useCallback(() => {\n const input = inputRef.current;\n if (!input) return;\n\n window.requestAnimationFrame(() => {\n window.requestAnimationFrame(() => {\n input.blur();\n });\n });\n }, [inputRef]);\n let overrideDefaultChecked = defaultChecked;\n\n // If component did not receive default checked and checked props, choose default checked as\n // default behavior (handle isChecked logic inside input) and set default value\n if (isNil(overrideDefaultChecked) && isNil(checked)) {\n overrideDefaultChecked = false;\n }\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = indeterminate;\n }\n }, [inputRef, indeterminate]);\n\n const { onClickCapture: onClickCaptureLabel } = useSupportFirefoxLabelClick({ inputRef });\n\n const finalAriaLabel = useMemo(() => {\n if (ariaLabel) return ariaLabel;\n if (typeof label === \"string\") return label;\n return \"\";\n }, [ariaLabel, label]);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <label\n className={cx(styles.wrapper, className)}\n onMouseUp={onMouseUpCallback}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n htmlFor={id}\n onClickCapture={onClickCaptureLabel}\n >\n <input\n ref={mergedInputRef}\n id={id}\n className={styles.input}\n value={value}\n name={name}\n type=\"checkbox\"\n autoFocus={autoFocus}\n onChange={onChange}\n defaultChecked={overrideDefaultChecked}\n disabled={disabled}\n aria-label={finalAriaLabel}\n aria-labelledby={ariaLabelledBy}\n checked={checked}\n tabIndex={tabIndex}\n />\n <div\n className={cx(styles.checkbox, checkboxClassName)}\n ref={iconContainerRef}\n data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n data-vibe={ComponentVibeId.CHECKBOX}\n >\n <Icon\n className={styles.icon}\n iconType=\"svg\"\n icon={indeterminate ? Remove : Check}\n ignoreFocusStyle\n ariaHidden={true}\n iconSize=\"16\"\n />\n </div>\n {label === false ? null : (\n <Text\n element=\"span\"\n type=\"text2\"\n className={cx(styles.label, labelClassName)}\n data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n >\n {label}\n </Text>\n )}\n </label>\n );\n }\n);\n\nexport default Checkbox;\n"],"names":["Checkbox","forwardRef","_ref","ref","className","checkboxClassName","labelClassName","ariaLabel","label","ariaLabelledBy","_ref$onChange","onChange","NOOP","checked","autoFocus","_ref$indeterminate","indeterminate","_ref$disabled","disabled","defaultChecked","tabIndex","_ref$value","value","_ref$name","name","id","dataTestId","inputRef","useRef","mergedInputRef","useMergeRef","iconContainerRef","onMouseUpCallback","useCallback","input","current","window","requestAnimationFrame","blur","overrideDefaultChecked","isNil","useEffect","onClickCaptureLabel","useSupportFirefoxLabelClick","onClickCapture","finalAriaLabel","useMemo","React","createElement","cx","styles","wrapper","onMouseUp","getTestId","ComponentDefaultTestId","CHECKBOX","htmlFor","type","checkbox","CHECKBOX_CHECKBOX","ComponentVibeId","Icon","icon","iconType","Remove","Check","ignoreFocusStyle","ariaHidden","iconSize","Text","element","CHECKBOX_LABEL"],"mappings":"0nBAgDMA,IAAAA,EAA2DC,GAC/D,SAAAC,EAoBEC,GACE,IAnBAC,EAASF,EAATE,UACAC,EAAiBH,EAAjBG,kBACAC,EAAcJ,EAAdI,eACAC,EAASL,EAATK,UACAC,EAAKN,EAALM,MACAC,EAAcP,EAAdO,eAAcC,EAAAR,EACdS,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EACfG,EAAOX,EAAPW,QACAC,EAASZ,EAATY,UAASC,EAAAb,EACTc,cAAAA,OAAgB,IAAHD,GAAQA,EAAAE,EAAAf,EACrBgB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAcjB,EAAdiB,eACAC,EAAQlB,EAARkB,SAAQC,EAAAnB,EACRoB,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACVsB,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAEvB,EAAFuB,GACeC,EAAUxB,EAAzB,eAIIyB,EAAWC,EAAyB,MACpCC,EAAiBC,EAAY3B,EAAKwB,GAClCI,EAAmBH,EAAuB,MAE1CI,EAAoBC,GAAY,WACpC,IAAMC,EAAQP,EAASQ,QAClBD,GAELE,OAAOC,uBAAsB,WAC3BD,OAAOC,uBAAsB,WAC3BH,EAAMI,MACR,GACF,GACF,GAAG,CAACX,IACAY,EAAyBpB,EAIzBqB,EAAMD,IAA2BC,EAAM3B,KACzC0B,GAAyB,GAG3BE,GAAU,WACJd,EAASQ,UACXR,EAASQ,QAAQnB,cAAgBA,EAErC,GAAG,CAACW,EAAUX,IAEd,IAAwB0B,EAAwBC,EAA4B,CAAEhB,SAAAA,IAAtEiB,eAEFC,EAAiBC,GAAQ,WAC7B,OAAIvC,IACiB,iBAAVC,EAA2BA,EAC/B,GACT,GAAG,CAACD,EAAWC,IAEf,OAEEuC,EAAAC,cAAA,QAAA,CACE5C,UAAW6C,EAAGC,EAAOC,QAAS/C,GAC9BgD,UAAWpB,EACE,cAAAN,GAAc2B,EAAUC,EAAuBC,SAAU9B,GACtE+B,QAAS/B,EACTmB,eAAgBF,GAEhBK,EACEC,cAAA,QAAA,CAAA7C,IAAK0B,EACLJ,GAAIA,EACJrB,UAAW8C,EAAOhB,MAClBZ,MAAOA,EACPE,KAAMA,EACNiC,KAAK,WACL3C,UAAWA,EACXH,SAAUA,EACVQ,eAAgBoB,EAChBrB,SAAUA,EACE,aAAA2B,EACK,kBAAApC,EACjBI,QAASA,EACTO,SAAUA,IAEZ2B,EACEC,cAAA,MAAA,CAAA5C,UAAW6C,EAAGC,EAAOQ,SAAUrD,GAC/BF,IAAK4B,EACQ,cAAAsB,EAAUC,EAAuBK,kBAAmBlC,GAAG,YACzDmC,EAAgBL,UAE3BR,EAAAC,cAACa,EAAI,CACHzD,UAAW8C,EAAOY,KAClBC,SAAS,MACTD,KAAM9C,EAAgBgD,EAASC,EAC/BC,kBAAgB,EAChBC,YAAY,EACZC,SAAS,SAGF,IAAV5D,EAAkB,KACjBuC,gBAACsB,EAAI,CACHC,QAAQ,OACRb,KAAK,QACLrD,UAAW6C,EAAGC,EAAO1C,MAAOF,GAAe,cAC9B+C,EAAUC,EAAuBiB,eAAgB9C,IAE7DjB,GAKX"}
1
+ {"version":3,"file":"Checkbox.js","sources":["../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { isNil, noop as NOOP } from \"lodash-es\";\nimport Icon from \"../Icon/Icon\";\nimport { Check, Remove } from \"@vibe/icons\";\nimport { useSupportFirefoxLabelClick } from \"./hooks/useSupportFirefoxLabelClick\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { VibeComponent, VibeComponentProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Checkbox.module.scss\";\n\nexport interface CheckBoxProps extends VibeComponentProps {\n /**\n * Class name applied to the checkbox element.\n */\n checkboxClassName?: string;\n /**\n * Class name applied to the label element.\n */\n labelClassName?: string;\n /**\n * The label of the checkbox for accessibility.\n */\n ariaLabel?: string;\n /**\n * The content displayed next to the checkbox.\n */\n label?: React.ReactNode | Array<React.ReactNode>;\n /**\n * The ID of an element describing the checkbox.\n */\n ariaLabelledBy?: string;\n /**\n * Callback fired when the checkbox value changes.\n */\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * If true, controls the checked state of the checkbox.\n */\n checked?: boolean;\n /**\n * If true, displays an indeterminate state.\n */\n indeterminate?: boolean;\n /**\n * If true, the checkbox automatically receives focus.\n */\n autoFocus?: boolean;\n /**\n * If true, the checkbox is disabled.\n */\n disabled?: boolean;\n /**\n * The initial checked state of the checkbox.\n */\n defaultChecked?: boolean;\n /**\n * The value submitted with the form when checked.\n */\n value?: string;\n /**\n * The name of the checkbox, used for form submission.\n */\n name?: string;\n /**\n * The tab order of the checkbox.\n */\n tabIndex?: number;\n}\n\nconst Checkbox: VibeComponent<CheckBoxProps, HTMLInputElement> = forwardRef(\n (\n {\n className,\n checkboxClassName,\n labelClassName,\n ariaLabel,\n label,\n ariaLabelledBy,\n onChange = NOOP,\n checked,\n autoFocus,\n indeterminate = false,\n disabled = false,\n defaultChecked,\n tabIndex,\n value = \"\",\n name = \"\",\n id,\n \"data-testid\": dataTestId\n }: CheckBoxProps,\n ref\n ) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedInputRef = useMergeRef(ref, inputRef);\n const iconContainerRef = useRef<HTMLDivElement>(null);\n\n const onMouseUpCallback = useCallback(() => {\n const input = inputRef.current;\n if (!input) return;\n\n window.requestAnimationFrame(() => {\n window.requestAnimationFrame(() => {\n input.blur();\n });\n });\n }, [inputRef]);\n let overrideDefaultChecked = defaultChecked;\n\n // If component did not receive default checked and checked props, choose default checked as\n // default behavior (handle isChecked logic inside input) and set default value\n if (isNil(overrideDefaultChecked) && isNil(checked)) {\n overrideDefaultChecked = false;\n }\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = indeterminate;\n }\n }, [inputRef, indeterminate]);\n\n const { onClickCapture: onClickCaptureLabel } = useSupportFirefoxLabelClick({ inputRef });\n\n const finalAriaLabel = useMemo(() => {\n if (ariaLabel) return ariaLabel;\n if (typeof label === \"string\") return label;\n return \"\";\n }, [ariaLabel, label]);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <label\n className={cx(styles.wrapper, className)}\n onMouseUp={onMouseUpCallback}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n htmlFor={id}\n onClickCapture={onClickCaptureLabel}\n >\n <input\n ref={mergedInputRef}\n id={id}\n className={styles.input}\n value={value}\n name={name}\n type=\"checkbox\"\n autoFocus={autoFocus}\n onChange={onChange}\n defaultChecked={overrideDefaultChecked}\n disabled={disabled}\n aria-label={finalAriaLabel}\n aria-labelledby={ariaLabelledBy}\n checked={checked}\n tabIndex={tabIndex}\n />\n <div\n className={cx(styles.checkbox, checkboxClassName)}\n ref={iconContainerRef}\n data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n data-vibe={ComponentVibeId.CHECKBOX}\n >\n <Icon\n className={styles.icon}\n iconType=\"svg\"\n icon={indeterminate ? Remove : Check}\n ignoreFocusStyle\n ariaHidden={true}\n iconSize=\"16\"\n />\n </div>\n {label === false ? null : (\n <Text\n element=\"span\"\n type=\"text2\"\n className={cx(styles.label, labelClassName)}\n data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n >\n {label}\n </Text>\n )}\n </label>\n );\n }\n);\n\nexport default Checkbox;\n"],"names":["Checkbox","forwardRef","_ref","ref","className","checkboxClassName","labelClassName","ariaLabel","label","ariaLabelledBy","_ref$onChange","onChange","NOOP","checked","autoFocus","_ref$indeterminate","indeterminate","_ref$disabled","disabled","defaultChecked","tabIndex","_ref$value","value","_ref$name","name","id","dataTestId","inputRef","useRef","mergedInputRef","useMergeRef","iconContainerRef","onMouseUpCallback","useCallback","input","current","window","requestAnimationFrame","blur","overrideDefaultChecked","isNil","useEffect","onClickCaptureLabel","useSupportFirefoxLabelClick","onClickCapture","finalAriaLabel","useMemo","React","createElement","cx","styles","wrapper","onMouseUp","getTestId","ComponentDefaultTestId","CHECKBOX","htmlFor","type","checkbox","CHECKBOX_CHECKBOX","ComponentVibeId","Icon","icon","iconType","Remove","Check","ignoreFocusStyle","ariaHidden","iconSize","Text","element","CHECKBOX_LABEL"],"mappings":"0nBAwEMA,IAAAA,EAA2DC,GAC/D,SAAAC,EAoBEC,GACE,IAnBAC,EAASF,EAATE,UACAC,EAAiBH,EAAjBG,kBACAC,EAAcJ,EAAdI,eACAC,EAASL,EAATK,UACAC,EAAKN,EAALM,MACAC,EAAcP,EAAdO,eAAcC,EAAAR,EACdS,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EACfG,EAAOX,EAAPW,QACAC,EAASZ,EAATY,UAASC,EAAAb,EACTc,cAAAA,OAAgB,IAAHD,GAAQA,EAAAE,EAAAf,EACrBgB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAcjB,EAAdiB,eACAC,EAAQlB,EAARkB,SAAQC,EAAAnB,EACRoB,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACVsB,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAEvB,EAAFuB,GACeC,EAAUxB,EAAzB,eAIIyB,EAAWC,EAAyB,MACpCC,EAAiBC,EAAY3B,EAAKwB,GAClCI,EAAmBH,EAAuB,MAE1CI,EAAoBC,GAAY,WACpC,IAAMC,EAAQP,EAASQ,QAClBD,GAELE,OAAOC,uBAAsB,WAC3BD,OAAOC,uBAAsB,WAC3BH,EAAMI,MACR,GACF,GACF,GAAG,CAACX,IACAY,EAAyBpB,EAIzBqB,EAAMD,IAA2BC,EAAM3B,KACzC0B,GAAyB,GAG3BE,GAAU,WACJd,EAASQ,UACXR,EAASQ,QAAQnB,cAAgBA,EAErC,GAAG,CAACW,EAAUX,IAEd,IAAwB0B,EAAwBC,EAA4B,CAAEhB,SAAAA,IAAtEiB,eAEFC,EAAiBC,GAAQ,WAC7B,OAAIvC,IACiB,iBAAVC,EAA2BA,EAC/B,GACT,GAAG,CAACD,EAAWC,IAEf,OAEEuC,EAAAC,cAAA,QAAA,CACE5C,UAAW6C,EAAGC,EAAOC,QAAS/C,GAC9BgD,UAAWpB,EACE,cAAAN,GAAc2B,EAAUC,EAAuBC,SAAU9B,GACtE+B,QAAS/B,EACTmB,eAAgBF,GAEhBK,EACEC,cAAA,QAAA,CAAA7C,IAAK0B,EACLJ,GAAIA,EACJrB,UAAW8C,EAAOhB,MAClBZ,MAAOA,EACPE,KAAMA,EACNiC,KAAK,WACL3C,UAAWA,EACXH,SAAUA,EACVQ,eAAgBoB,EAChBrB,SAAUA,EACE,aAAA2B,EACK,kBAAApC,EACjBI,QAASA,EACTO,SAAUA,IAEZ2B,EACEC,cAAA,MAAA,CAAA5C,UAAW6C,EAAGC,EAAOQ,SAAUrD,GAC/BF,IAAK4B,EACQ,cAAAsB,EAAUC,EAAuBK,kBAAmBlC,GAAG,YACzDmC,EAAgBL,UAE3BR,EAAAC,cAACa,EAAI,CACHzD,UAAW8C,EAAOY,KAClBC,SAAS,MACTD,KAAM9C,EAAgBgD,EAASC,EAC/BC,kBAAgB,EAChBC,YAAY,EACZC,SAAS,SAGF,IAAV5D,EAAkB,KACjBuC,gBAACsB,EAAI,CACHC,QAAQ,OACRb,KAAK,QACLrD,UAAW6C,EAAGC,EAAO1C,MAAOF,GAAe,cAC9B+C,EAAUC,EAAuBiB,eAAgB9C,IAE7DjB,GAKX"}
@@ -1 +1 @@
1
- {"version":3,"file":"Chips.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import React, { forwardRef, RefObject, useCallback, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport Icon from \"../Icon/Icon\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { getCSSVar } from \"../../services/themes\";\nimport { ElementAllowedColor as ElementAllowedColorEnum } from \"../../utils/colors-vars-map\";\nimport { ElementAllowedColor, getElementColor } from \"../../types/Colors\";\nimport Avatar from \"../Avatar/Avatar\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Text from \"../Text/Text\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { AvatarType as AvatarTypeEnum } from \"../Avatar/AvatarConstants\";\nimport { AvatarType } from \"../Avatar/Avatar.types\";\nimport { ElementContent, SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport useHover from \"../../hooks/useHover/useHover\";\nimport useSetFocus from \"../../hooks/useSetFocus\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Chips.module.scss\";\n\nconst CHIPS_AVATAR_SIZE = 18;\n\nexport interface ChipsProps extends VibeComponentProps {\n label?: ElementContent;\n disabled?: boolean;\n readOnly?: boolean;\n \"data-testid\"?: string;\n /**\n * A React element that is positioned to the right of the text\n */\n rightRenderer?: ElementContent;\n /**\n * A React element that is positioned to the left of the text\n */\n leftRenderer?: ElementContent;\n /** Icon to place on the right */\n rightIcon?: SubIcon;\n /** Icon to place on the left */\n leftIcon?: SubIcon;\n /** Img to place as avatar on the right */\n rightAvatar?: string;\n /** the type of right avatar */\n rightAvatarType?: AvatarType;\n /** Img to place as avatar on the left */\n leftAvatar?: string;\n /** the type of left avatar */\n leftAvatarType?: AvatarType;\n /** ClassName for left or right icon */\n iconClassName?: string;\n /** ClassName for left or right avatar */\n avatarClassName?: string;\n color?: Exclude<ElementAllowedColor, \"dark_indigo\" | \"blackish\">;\n /** Size for font icon */\n iconSize?: number | string;\n onDelete?: (id: string, event: React.MouseEvent<HTMLSpanElement>) => void;\n /**\n * Disables the Chip's entry animation\n */\n noAnimation?: boolean;\n /**\n * Allow user to select text\n */\n allowTextSelection?: boolean;\n /**\n * Callback function to be called when the user clicks the component.\n */\n onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /**\n * Callback function to be called when the user clicks the component.\n */\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /**\n * Applies when element has onClick or onMouseDown props\n */\n ariaLabel?: string;\n /**\n * Disable click behaviors\n */\n disableClickableBehavior?: boolean;\n /**\n * Show border, the border color is `--text-color-on-primary`, should be when the chip is a colored background like\n * selected-color\n */\n showBorder?: boolean;\n closeButtonAriaLabel?: string;\n}\n\nconst Chips: VibeComponent<ChipsProps, HTMLDivElement> & {\n colors?: typeof ElementAllowedColorEnum;\n avatarTypes?: typeof AvatarTypeEnum;\n} = forwardRef<HTMLDivElement, ChipsProps>(\n (\n {\n className,\n avatarClassName,\n iconClassName,\n id,\n label = \"\",\n leftIcon = null,\n rightIcon = null,\n leftAvatar = null,\n rightAvatar = null,\n disabled = false,\n readOnly = false,\n allowTextSelection = false,\n color = \"primary\",\n iconSize = 18,\n onDelete = (_id: string, _e: React.MouseEvent<HTMLSpanElement>) => {},\n onMouseDown,\n onClick,\n noAnimation = true,\n ariaLabel,\n \"data-testid\": dataTestId,\n disableClickableBehavior = false,\n leftAvatarType = \"img\",\n rightAvatarType = \"img\",\n showBorder = false,\n leftRenderer,\n rightRenderer,\n closeButtonAriaLabel = \"Remove\"\n }: ChipsProps,\n ref\n ) => {\n const componentDataTestId = dataTestId || getTestId(ComponentDefaultTestId.CHIP, id);\n const hasClickableWrapper = (!!onClick || !!onMouseDown) && !disableClickableBehavior;\n const hasCloseButton = !readOnly && !disabled;\n const overrideAriaLabel = ariaLabel || (typeof label === \"string\" && label) || \"\";\n\n const iconButtonRef = useRef(null);\n const componentRef = useRef(null);\n\n const [hoverRef, isHovered] = useHover<HTMLDivElement>();\n const { isFocused } = useSetFocus({ ref: componentRef });\n\n const mergedRef = useMergeRef<HTMLDivElement>(ref, componentRef, hoverRef);\n\n const overrideClassName = cx(styles.chips, className, {\n [styles.disabled]: disabled,\n [styles.noAnimation]: noAnimation,\n [styles.withUserSelect]: allowTextSelection,\n [styles.border]: showBorder\n });\n const clickableClassName = cx(styles.clickable, overrideClassName, {\n [styles.disabled]: disabled,\n [styles.disableTextSelection]: !allowTextSelection\n });\n\n const backgroundColorStyle = useMemo(() => {\n let cssVar;\n if (disabled) {\n cssVar = getCSSVar(\"disabled-background-color\");\n } else if (hasClickableWrapper && (isHovered || isFocused)) {\n cssVar = getElementColor(color, true, true);\n } else {\n cssVar = getElementColor(color, true);\n }\n return { backgroundColor: cssVar };\n }, [disabled, hasClickableWrapper, isHovered, isFocused, color]);\n\n const onDeleteCallback = useCallback(\n (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n e.stopPropagation();\n if (onDelete) {\n onDelete(id, e);\n }\n },\n [id, onDelete]\n );\n\n const onClickCallback = useCallback(\n (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n if (onClick !== undefined && (e.target as HTMLElement) !== iconButtonRef.current) {\n e.preventDefault();\n onClick(e);\n }\n },\n [onClick]\n );\n\n const clickableProps = useClickableProps(\n {\n onClick: onClickCallback,\n onMouseDown,\n disabled,\n id,\n \"data-testid\": componentDataTestId,\n ariaLabel: overrideAriaLabel,\n ariaHidden: false,\n ariaHasPopup: false,\n ariaExpanded: false\n },\n mergedRef\n );\n const wrapperProps = hasClickableWrapper\n ? {\n ...clickableProps,\n ref: clickableProps.ref as RefObject<HTMLDivElement>,\n className: clickableClassName,\n style: backgroundColorStyle\n }\n : {\n className: overrideClassName,\n \"aria-label\": overrideAriaLabel,\n style: backgroundColorStyle,\n ref: mergedRef,\n onClick: onClickCallback,\n onMouseDown,\n id: id,\n \"data-testid\": componentDataTestId\n };\n\n const leftAvatarProps = leftAvatarType === \"text\" ? { text: leftAvatar } : { src: leftAvatar };\n const rightAvatarProps = leftAvatarType === \"text\" ? { text: rightAvatar } : { src: rightAvatar };\n\n return (\n <div {...wrapperProps}>\n {leftAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.left, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={leftAvatarType}\n key={id}\n {...leftAvatarProps}\n />\n ) : null}\n {leftIcon ? (\n <Icon\n className={cx(styles.icon, styles.left, iconClassName)}\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {leftRenderer && <div className={cx(styles.customRenderer, styles.left)}>{leftRenderer}</div>}\n <Text type=\"text2\" className={styles.label}>\n {label}\n </Text>\n {rightIcon ? (\n <Icon\n className={cx(styles.icon, styles.right, iconClassName)}\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {rightAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.right, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={rightAvatarType}\n key={id}\n {...rightAvatarProps}\n />\n ) : null}\n {rightRenderer && <div className={cx(styles.customRenderer, styles.right)}>{rightRenderer}</div>}\n {hasCloseButton && (\n <IconButton\n size=\"xxs\"\n color=\"on-primary-color\"\n className={cx(styles.icon, styles.close)}\n ariaLabel={closeButtonAriaLabel}\n hideTooltip\n icon={CloseSmall}\n onClick={onDeleteCallback}\n data-testid={`${componentDataTestId}-close`}\n ref={iconButtonRef}\n />\n )}\n </div>\n );\n }\n);\n\nexport default withStaticProps(Chips, {\n colors: ElementAllowedColorEnum,\n avatarTypes: AvatarTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","avatarClassName","iconClassName","id","_ref$label","label","_ref$leftIcon","leftIcon","_ref$rightIcon","rightIcon","_ref$leftAvatar","leftAvatar","_ref$rightAvatar","rightAvatar","_ref$disabled","disabled","_ref$readOnly","readOnly","_ref$allowTextSelecti","allowTextSelection","_ref$color","color","_ref$iconSize","iconSize","_ref$onDelete","onDelete","_id","_e","onMouseDown","onClick","_ref$noAnimation","noAnimation","ariaLabel","_ref$disableClickable","disableClickableBehavior","_ref$leftAvatarType","leftAvatarType","_ref$rightAvatarType","rightAvatarType","_ref$showBorder","showBorder","leftRenderer","rightRenderer","_ref$closeButtonAriaL","closeButtonAriaLabel","componentDataTestId","getTestId","ComponentDefaultTestId","CHIP","hasClickableWrapper","hasCloseButton","overrideAriaLabel","iconButtonRef","useRef","componentRef","_useHover","useHover","_useHover2","_slicedToArray","hoverRef","isHovered","isFocused","useSetFocus","mergedRef","useMergeRef","overrideClassName","cx","styles","chips","_defineProperty","withUserSelect","border","clickableClassName","clickable","disableTextSelection","backgroundColorStyle","useMemo","backgroundColor","getCSSVar","getElementColor","onDeleteCallback","useCallback","e","stopPropagation","onClickCallback","undefined","target","current","preventDefault","clickableProps","useClickableProps","ariaHidden","ariaHasPopup","ariaExpanded","wrapperProps","style","leftAvatarProps","text","src","rightAvatarProps","React","createElement","Avatar","withoutBorder","avatar","left","customSize","type","key","Icon","icon","iconType","ignoreFocusStyle","customRenderer","Text","right","IconButton","size","close","hideTooltip","CloseSmall","colors","ElementAllowedColorEnum","avatarTypes","AvatarTypeEnum"],"mappings":"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"}
1
+ {"version":3,"file":"Chips.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import React, { forwardRef, RefObject, useCallback, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport Icon from \"../Icon/Icon\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { getCSSVar } from \"../../services/themes\";\nimport { ElementAllowedColor as ElementAllowedColorEnum } from \"../../utils/colors-vars-map\";\nimport { ElementAllowedColor, getElementColor } from \"../../types/Colors\";\nimport Avatar from \"../Avatar/Avatar\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Text from \"../Text/Text\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { AvatarType as AvatarTypeEnum } from \"../Avatar/AvatarConstants\";\nimport { AvatarType } from \"../Avatar/Avatar.types\";\nimport { ElementContent, SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport useHover from \"../../hooks/useHover/useHover\";\nimport useSetFocus from \"../../hooks/useSetFocus\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Chips.module.scss\";\n\nconst CHIPS_AVATAR_SIZE = 18;\n\nexport interface ChipsProps extends VibeComponentProps {\n /**\n * The text or content displayed inside the chip.\n */\n label?: ElementContent;\n /**\n * If true, the chip is disabled.\n */\n disabled?: boolean;\n /**\n * If true, the chip is read-only and cannot be deleted.\n */\n readOnly?: boolean;\n /**\n * A React element displayed on the right side.\n */\n rightRenderer?: ElementContent;\n /**\n * A React element displayed on the left side.\n */\n leftRenderer?: ElementContent;\n /**\n * Icon displayed on the right side.\n */\n rightIcon?: SubIcon;\n /**\n * Icon displayed on the left side.\n */\n leftIcon?: SubIcon;\n /**\n * Image URL or text for an avatar displayed on the right.\n */\n rightAvatar?: string;\n /**\n * The type of avatar displayed on the right.\n */\n rightAvatarType?: AvatarType;\n /**\n * Image URL or text for an avatar displayed on the left.\n */\n leftAvatar?: string;\n /**\n * The type of avatar displayed on the left.\n */\n leftAvatarType?: AvatarType;\n /**\n * Class name applied to left or right icons.\n */\n iconClassName?: string;\n /**\n * Class name applied to left or right avatars.\n */\n avatarClassName?: string;\n /**\n * The background color of the chip.\n */\n color?: Exclude<ElementAllowedColor, \"dark_indigo\" | \"blackish\">;\n /**\n * The size of the icons inside the chip.\n */\n iconSize?: number | string;\n /**\n * Callback fired when the chip is deleted.\n */\n onDelete?: (id: string, event: React.MouseEvent<HTMLSpanElement>) => void;\n /**\n * If true, disables the chip's entry animation.\n */\n noAnimation?: boolean;\n /**\n * If true, allows the user to select text inside the chip.\n */\n allowTextSelection?: boolean;\n /**\n * Callback fired when the mouse button is pressed on the chip.\n */\n onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /**\n * Callback fired when the chip is clicked.\n */\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n /**\n * The label of the chip for accessibility.\n */\n ariaLabel?: string;\n /**\n * If true, disables all click behaviors.\n */\n disableClickableBehavior?: boolean;\n /**\n * If true, displays a border around the chip.\n */\n showBorder?: boolean;\n /**\n * The label for the close button.\n */\n closeButtonAriaLabel?: string;\n}\n\nconst Chips: VibeComponent<ChipsProps, HTMLDivElement> & {\n colors?: typeof ElementAllowedColorEnum;\n avatarTypes?: typeof AvatarTypeEnum;\n} = forwardRef<HTMLDivElement, ChipsProps>(\n (\n {\n className,\n avatarClassName,\n iconClassName,\n id,\n label = \"\",\n leftIcon = null,\n rightIcon = null,\n leftAvatar = null,\n rightAvatar = null,\n disabled = false,\n readOnly = false,\n allowTextSelection = false,\n color = \"primary\",\n iconSize = 18,\n onDelete = (_id: string, _e: React.MouseEvent<HTMLSpanElement>) => {},\n onMouseDown,\n onClick,\n noAnimation = true,\n ariaLabel,\n \"data-testid\": dataTestId,\n disableClickableBehavior = false,\n leftAvatarType = \"img\",\n rightAvatarType = \"img\",\n showBorder = false,\n leftRenderer,\n rightRenderer,\n closeButtonAriaLabel = \"Remove\"\n }: ChipsProps,\n ref\n ) => {\n const componentDataTestId = dataTestId || getTestId(ComponentDefaultTestId.CHIP, id);\n const hasClickableWrapper = (!!onClick || !!onMouseDown) && !disableClickableBehavior;\n const hasCloseButton = !readOnly && !disabled;\n const overrideAriaLabel = ariaLabel || (typeof label === \"string\" && label) || \"\";\n\n const iconButtonRef = useRef(null);\n const componentRef = useRef(null);\n\n const [hoverRef, isHovered] = useHover<HTMLDivElement>();\n const { isFocused } = useSetFocus({ ref: componentRef });\n\n const mergedRef = useMergeRef<HTMLDivElement>(ref, componentRef, hoverRef);\n\n const overrideClassName = cx(styles.chips, className, {\n [styles.disabled]: disabled,\n [styles.noAnimation]: noAnimation,\n [styles.withUserSelect]: allowTextSelection,\n [styles.border]: showBorder\n });\n const clickableClassName = cx(styles.clickable, overrideClassName, {\n [styles.disabled]: disabled,\n [styles.disableTextSelection]: !allowTextSelection\n });\n\n const backgroundColorStyle = useMemo(() => {\n let cssVar;\n if (disabled) {\n cssVar = getCSSVar(\"disabled-background-color\");\n } else if (hasClickableWrapper && (isHovered || isFocused)) {\n cssVar = getElementColor(color, true, true);\n } else {\n cssVar = getElementColor(color, true);\n }\n return { backgroundColor: cssVar };\n }, [disabled, hasClickableWrapper, isHovered, isFocused, color]);\n\n const onDeleteCallback = useCallback(\n (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n e.stopPropagation();\n if (onDelete) {\n onDelete(id, e);\n }\n },\n [id, onDelete]\n );\n\n const onClickCallback = useCallback(\n (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n if (onClick !== undefined && (e.target as HTMLElement) !== iconButtonRef.current) {\n e.preventDefault();\n onClick(e);\n }\n },\n [onClick]\n );\n\n const clickableProps = useClickableProps(\n {\n onClick: onClickCallback,\n onMouseDown,\n disabled,\n id,\n \"data-testid\": componentDataTestId,\n ariaLabel: overrideAriaLabel,\n ariaHidden: false,\n ariaHasPopup: false,\n ariaExpanded: false\n },\n mergedRef\n );\n const wrapperProps = hasClickableWrapper\n ? {\n ...clickableProps,\n ref: clickableProps.ref as RefObject<HTMLDivElement>,\n className: clickableClassName,\n style: backgroundColorStyle\n }\n : {\n className: overrideClassName,\n \"aria-label\": overrideAriaLabel,\n style: backgroundColorStyle,\n ref: mergedRef,\n onClick: onClickCallback,\n onMouseDown,\n id: id,\n \"data-testid\": componentDataTestId\n };\n\n const leftAvatarProps = leftAvatarType === \"text\" ? { text: leftAvatar } : { src: leftAvatar };\n const rightAvatarProps = leftAvatarType === \"text\" ? { text: rightAvatar } : { src: rightAvatar };\n\n return (\n <div {...wrapperProps}>\n {leftAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.left, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={leftAvatarType}\n key={id}\n {...leftAvatarProps}\n />\n ) : null}\n {leftIcon ? (\n <Icon\n className={cx(styles.icon, styles.left, iconClassName)}\n iconType=\"font\"\n icon={leftIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {leftRenderer && <div className={cx(styles.customRenderer, styles.left)}>{leftRenderer}</div>}\n <Text type=\"text2\" className={styles.label}>\n {label}\n </Text>\n {rightIcon ? (\n <Icon\n className={cx(styles.icon, styles.right, iconClassName)}\n iconType=\"font\"\n icon={rightIcon}\n iconSize={iconSize}\n ignoreFocusStyle\n />\n ) : null}\n {rightAvatar ? (\n <Avatar\n withoutBorder\n className={cx(styles.avatar, styles.right, avatarClassName)}\n customSize={CHIPS_AVATAR_SIZE}\n type={rightAvatarType}\n key={id}\n {...rightAvatarProps}\n />\n ) : null}\n {rightRenderer && <div className={cx(styles.customRenderer, styles.right)}>{rightRenderer}</div>}\n {hasCloseButton && (\n <IconButton\n size=\"xxs\"\n color=\"on-primary-color\"\n className={cx(styles.icon, styles.close)}\n ariaLabel={closeButtonAriaLabel}\n hideTooltip\n icon={CloseSmall}\n onClick={onDeleteCallback}\n data-testid={`${componentDataTestId}-close`}\n ref={iconButtonRef}\n />\n )}\n </div>\n );\n }\n);\n\nexport default withStaticProps(Chips, {\n colors: ElementAllowedColorEnum,\n avatarTypes: AvatarTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","avatarClassName","iconClassName","id","_ref$label","label","_ref$leftIcon","leftIcon","_ref$rightIcon","rightIcon","_ref$leftAvatar","leftAvatar","_ref$rightAvatar","rightAvatar","_ref$disabled","disabled","_ref$readOnly","readOnly","_ref$allowTextSelecti","allowTextSelection","_ref$color","color","_ref$iconSize","iconSize","_ref$onDelete","onDelete","_id","_e","onMouseDown","onClick","_ref$noAnimation","noAnimation","ariaLabel","_ref$disableClickable","disableClickableBehavior","_ref$leftAvatarType","leftAvatarType","_ref$rightAvatarType","rightAvatarType","_ref$showBorder","showBorder","leftRenderer","rightRenderer","_ref$closeButtonAriaL","closeButtonAriaLabel","componentDataTestId","getTestId","ComponentDefaultTestId","CHIP","hasClickableWrapper","hasCloseButton","overrideAriaLabel","iconButtonRef","useRef","componentRef","_useHover","useHover","_useHover2","_slicedToArray","hoverRef","isHovered","isFocused","useSetFocus","mergedRef","useMergeRef","overrideClassName","cx","styles","chips","_defineProperty","withUserSelect","border","clickableClassName","clickable","disableTextSelection","backgroundColorStyle","useMemo","backgroundColor","getCSSVar","getElementColor","onDeleteCallback","useCallback","e","stopPropagation","onClickCallback","undefined","target","current","preventDefault","clickableProps","useClickableProps","ariaHidden","ariaHasPopup","ariaExpanded","wrapperProps","style","leftAvatarProps","text","src","rightAvatarProps","React","createElement","Avatar","withoutBorder","avatar","left","customSize","type","key","Icon","icon","iconType","ignoreFocusStyle","customRenderer","Text","right","IconButton","size","close","hideTooltip","CloseSmall","colors","ElementAllowedColorEnum","avatarTypes","AvatarTypeEnum"],"mappings":"8/BAoBA,IAmSeA,EAAAA,EA3LXC,GACF,SAAAC,EA8BEC,GACE,IA7BAC,EAASF,EAATE,UACAC,EAAeH,EAAfG,gBACAC,EAAaJ,EAAbI,cACAC,EAAEL,EAAFK,GAAEC,EAAAN,EACFO,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAR,EACVS,SAAAA,OAAW,IAAHD,EAAG,KAAIA,EAAAE,EAAAV,EACfW,UAAAA,OAAY,IAAHD,EAAG,KAAIA,EAAAE,EAAAZ,EAChBa,WAAAA,OAAa,IAAHD,EAAG,KAAIA,EAAAE,EAAAd,EACjBe,YAAAA,OAAc,IAAHD,EAAG,KAAIA,EAAAE,EAAAhB,EAClBiB,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAlB,EAChBmB,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAApB,EAChBqB,mBAAAA,OAAqB,IAAHD,GAAQA,EAAAE,EAAAtB,EAC1BuB,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAxB,EACjByB,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAA1B,EACb2B,SAAAA,OAAQ,IAAAD,EAAG,SAACE,EAAaC,GAA2C,EAACH,EACrEI,EAAW9B,EAAX8B,YACAC,EAAO/B,EAAP+B,QAAOC,EAAAhC,EACPiC,YAAAA,OAAc,IAAHD,GAAOA,EAClBE,EAASlC,EAATkC,UACaC,GAAAnC,EACboC,yBAAAA,QAA2B,IAAHD,IAAQA,GAAAE,GAAArC,EAChCsC,eAAAA,QAAiB,IAAHD,GAAG,MAAKA,GAAAE,GAAAvC,EACtBwC,gBAAAA,QAAkB,IAAHD,GAAG,MAAKA,GAAAE,GAAAzC,EACvB0C,WAAAA,QAAa,IAAHD,IAAQA,GAClBE,GAAY3C,EAAZ2C,aACAC,GAAa5C,EAAb4C,cAAaC,GAAA7C,EACb8C,qBAAAA,QAAuB,IAAHD,GAAG,SAAQA,GAI3BE,GAXqB/C,EAAzB,gBAWwCgD,EAAUC,EAAuBC,KAAM7C,GAC3E8C,MAAyBpB,IAAaD,GAAiBM,IACvDgB,IAAkBjC,IAAaF,EAC/BoC,GAAoBnB,GAA+B,iBAAV3B,GAAsBA,GAAU,GAEzE+C,GAAgBC,EAAO,MACvBC,GAAeD,EAAO,MAE5BE,GAA8BC,IAA0BC,GAAAC,EAAAH,GAAA,GAAjDI,GAAQF,GAAA,GAAEG,GAASH,GAAA,GAClBI,GAAcC,EAAY,CAAE/D,IAAKuD,KAAjCO,UAEFE,GAAYC,EAA4BjE,EAAKuD,GAAcK,IAE3DM,GAAoBC,EAAGC,EAAOC,MAAOpE,EAASqE,EAAAA,EAAAA,EAAAA,EAAA,CAAA,EACjDF,EAAOpD,SAAWA,GAClBoD,EAAOpC,YAAcA,GACrBoC,EAAOG,eAAiBnD,GACxBgD,EAAOI,OAAS/B,KAEbgC,GAAqBN,EAAGC,EAAOM,UAAWR,GAAiBI,EAAAA,EAC9DF,CAAAA,EAAAA,EAAOpD,SAAWA,GAClBoD,EAAOO,sBAAwBvD,IAG5BwD,GAAuBC,GAAQ,WASnC,MAAO,CAAEC,gBAPL9D,EACO+D,EAAU,6BACV7B,KAAwBW,IAAaC,IACrCkB,EAAgB1D,GAAO,GAAM,GAE7B0D,EAAgB1D,GAAO,GAGpC,GAAG,CAACN,EAAUkC,GAAqBW,GAAWC,GAAWxC,IAEnD2D,GAAmBC,GACvB,SAACC,GACCA,EAAEC,kBACE1D,GACFA,EAAStB,EAAI+E,EAEjB,GACA,CAAC/E,EAAIsB,IAGD2D,GAAkBH,GACtB,SAACC,QACiBG,IAAZxD,GAA0BqD,EAAEI,SAA2BlC,GAAcmC,UACvEL,EAAEM,iBACF3D,EAAQqD,GAEZ,GACA,CAACrD,IAGG4D,GAAiBC,EACrB,CACE7D,QAASuD,GACTxD,YAAAA,EACAb,SAAAA,EACAZ,GAAAA,EACA,cAAe0C,GACfb,UAAWmB,GACXwC,YAAY,EACZC,cAAc,EACdC,cAAc,GAEhB9B,IAEI+B,GAAe7C,kCAEZwC,IAAc,CACjB1F,IAAK0F,GAAe1F,IACpBC,UAAWwE,GACXuB,MAAOpB,KAET,CACE3E,UAAWiE,GACX,aAAcd,GACd4C,MAAOpB,GACP5E,IAAKgE,GACLlC,QAASuD,GACTxD,YAAAA,EACAzB,GAAIA,EACJ,cAAe0C,IAGfmD,GAAqC,SAAnB5D,GAA4B,CAAE6D,KAAMtF,GAAe,CAAEuF,IAAKvF,GAC5EwF,GAAsC,SAAnB/D,GAA4B,CAAE6D,KAAMpF,GAAgB,CAAEqF,IAAKrF,GAEpF,OACEuF,uCAASN,IACNnF,EACCyF,EAACC,cAAAC,iBACCC,eAAa,EACbvG,UAAWkE,EAAGC,EAAOqC,OAAQrC,EAAOsC,KAAMxG,GAC1CyG,WA1Oc,GA2OdC,KAAMvE,GACNwE,IAAKzG,GACD6F,KAEJ,KACHzF,EACC6F,EAACC,cAAAQ,GACC7G,UAAWkE,EAAGC,EAAO2C,KAAM3C,EAAOsC,KAAMvG,GACxC6G,SAAS,OACTD,KAAMvG,EACNgB,SAAUA,EACVyF,kBAAgB,IAEhB,KACHvE,IAAgB2D,EAAKC,cAAA,MAAA,CAAArG,UAAWkE,EAAGC,EAAO8C,eAAgB9C,EAAOsC,OAAQhE,IAC1E2D,EAAAC,cAACa,EAAI,CAACP,KAAK,QAAQ3G,UAAWmE,EAAO9D,OAClCA,GAEFI,EACC2F,EAACC,cAAAQ,GACC7G,UAAWkE,EAAGC,EAAO2C,KAAM3C,EAAOgD,MAAOjH,GACzC6G,SAAS,OACTD,KAAMrG,EACNc,SAAUA,EACVyF,kBAAgB,IAEhB,KACHnG,EACCuF,EAACC,cAAAC,iBACCC,eAAa,EACbvG,UAAWkE,EAAGC,EAAOqC,OAAQrC,EAAOgD,MAAOlH,GAC3CyG,WA1Qc,GA2QdC,KAAMrE,GACNsE,IAAKzG,GACDgG,KAEJ,KACHzD,IAAiB0D,EAAKC,cAAA,MAAA,CAAArG,UAAWkE,EAAGC,EAAO8C,eAAgB9C,EAAOgD,QAASzE,IAC3EQ,IACCkD,EAACC,cAAAe,GACCC,KAAK,MACLhG,MAAM,mBACNrB,UAAWkE,EAAGC,EAAO2C,KAAM3C,EAAOmD,OAClCtF,UAAWY,GACX2E,aAAW,EACXT,KAAMU,EACN3F,QAASmD,2BACOnC,GAA2B,UAC3C9C,IAAKqD,KAKf,IAGoC,CACpCqE,OAAQC,EACRC,YAAaC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Clickable.js","sources":["../../../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { AriaRole, forwardRef } from \"react\";\nimport { noop as NOOP } from \"lodash-es\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Clickable.module.scss\";\n\nexport interface ClickableProps extends VibeComponentProps {\n /**\n * The type of the clickable element wrapper (for example div or span)\n */\n elementType?: keyof JSX.IntrinsicElements | string;\n className?: string;\n id?: string;\n children?: React.ReactNode;\n role?: AriaRole;\n onClick?: (event: React.MouseEvent | React.KeyboardEvent) => void;\n enableTextSelection?: boolean;\n onMouseDown?: (event: React.MouseEvent) => void;\n onMouseEnter?: (event: React.MouseEvent) => void;\n onMouseLeave?: (event: React.MouseEvent) => void;\n ariaLabel?: string;\n /**\n * Is the element and its content should be hidden from screen readers and other assistive technologies\n */\n ariaHidden?: boolean;\n // TODO: [breaking] remove string type\n ariaHasPopup?: boolean | string;\n ariaExpanded?: boolean;\n // TODO: [breaking] remove string type\n tabIndex?: string | number;\n disabled?: boolean;\n style?: React.CSSProperties;\n \"data-testid\"?: string;\n}\n\nconst Clickable: VibeComponent<ClickableProps, HTMLElement> = forwardRef(\n (\n {\n elementType = \"div\",\n className = \"\",\n id,\n children,\n role = \"button\",\n onClick = NOOP,\n enableTextSelection = false,\n onMouseDown = NOOP,\n onMouseEnter = NOOP,\n onMouseLeave = NOOP,\n ariaLabel,\n ariaHidden,\n ariaHasPopup,\n ariaExpanded,\n tabIndex = \"0\",\n disabled = false,\n style,\n \"data-testid\": dataTestId\n }: ClickableProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const clickableProps = useClickableProps(\n {\n onClick,\n onMouseDown,\n onMouseEnter,\n onMouseLeave,\n disabled,\n id,\n \"data-testid\": dataTestId,\n role,\n tabIndex,\n ariaLabel,\n ariaHidden,\n ariaHasPopup,\n ariaExpanded\n },\n ref\n );\n const overrideClassName = cx(styles.clickable, className, {\n [styles.disabled]: disabled,\n [styles.disableTextSelection]: !enableTextSelection\n });\n\n return React.createElement(\n elementType,\n {\n ...clickableProps,\n className: overrideClassName,\n style: style\n },\n children\n );\n }\n);\n\nexport default Clickable;\n"],"names":["Clickable","forwardRef","_ref","ref","_ref$elementType","elementType","_ref$className","className","children","_ref$role","role","_ref$onClick","onClick","_ref$enableTextSelect","enableTextSelection","_ref$onMouseDown","onMouseDown","_ref$onMouseEnter","onMouseEnter","_ref$onMouseLeave","onMouseLeave","_ref$tabIndex","tabIndex","_ref$disabled","disabled","style","clickableProps","useClickableProps","NOOP","id","ariaLabel","ariaHidden","ariaHasPopup","ariaExpanded","overrideClassName","cx","styles","clickable","_defineProperty","disableTextSelection","React","createElement","Object","assign"],"mappings":"6RAqCMA,IAAAA,EAAwDC,GAC5D,SAAAC,EAqBEC,GACE,IAAAC,EAAAF,EApBAG,YAAAA,OAAc,IAAHD,EAAG,MAAKA,EAAAE,EAAAJ,EACnBK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAEdE,EAAQN,EAARM,SAAQC,EAAAP,EACRQ,KAAeC,EAAAT,EACfU,QAAcC,EAAAX,EACdY,oBAAAA,OAAsB,IAAHD,GAAQA,EAAAE,EAAAb,EAC3Bc,YAAkBC,EAAAf,EAClBgB,aAAmBC,EAAAjB,EACnBkB,aAIYC,EAAAnB,EACZoB,SAAcC,EAAArB,EACdsB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAKvB,EAALuB,MAKIC,EAAiBC,EACrB,CACEf,aAlBQgB,IAAHjB,EAAGiB,EAAIjB,EAmBZK,iBAjBYY,IAAHb,EAAGa,EAAIb,EAkBhBG,kBAjBaU,IAAHX,EAAGW,EAAIX,EAkBjBG,kBAjBaQ,IAAHT,EAAGS,EAAIT,EAkBjBK,SAAAA,EACAK,GA1BA3B,EAAF2B,GA2BE,cAZuB3B,EAAzB,eAaEQ,UA1BK,IAAHD,EAAG,SAAQA,EA2Bba,cAjBS,IAAHD,EAAG,IAAGA,EAkBZS,UAtBO5B,EAAT4B,UAuBEC,WAtBQ7B,EAAV6B,WAuBEC,aAtBU9B,EAAZ8B,aAuBEC,aAtBU/B,EAAZ+B,cAwBA9B,GAEI+B,EAAoBC,EAAGC,EAAOC,UAAW9B,EAAS+B,EAAAA,EACrDF,CAAAA,EAAAA,EAAOZ,SAAWA,GAClBY,EAAOG,sBAAwBzB,IAGlC,OAAO0B,EAAMC,cACXpC,EAAWqC,OAAAC,OAAAD,OAAAC,OAAA,GAENjB,GACH,CAAAnB,UAAW2B,EACXT,MAAOA,IAETjB,EAEJ"}
1
+ {"version":3,"file":"Clickable.js","sources":["../../../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { AriaRole, forwardRef } from \"react\";\nimport { noop as NOOP } from \"lodash-es\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport styles from \"./Clickable.module.scss\";\n\nexport interface ClickableProps extends VibeComponentProps {\n /**\n * The HTML element or custom component used as the root.\n */\n elementType?: keyof JSX.IntrinsicElements | string;\n /**\n * The content inside the clickable element.\n */\n children?: React.ReactNode;\n /**\n * The ARIA role of the element.\n */\n role?: AriaRole;\n /**\n * Callback fired when the element is clicked.\n */\n onClick?: (event: React.MouseEvent | React.KeyboardEvent) => void;\n /**\n * If true, allows text selection inside the element.\n */\n enableTextSelection?: boolean;\n /**\n * Callback fired when the mouse button is pressed down on the element.\n */\n onMouseDown?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when the mouse enters the element.\n */\n onMouseEnter?: (event: React.MouseEvent) => void;\n /**\n * Callback fired when the mouse leaves the element.\n */\n onMouseLeave?: (event: React.MouseEvent) => void;\n /**\n * The label of the element for accessibility.\n */\n ariaLabel?: string;\n /**\n * If true, hides the element from assistive technologies.\n */\n ariaHidden?: boolean;\n // TODO: [breaking] remove string type\n /**\n * Indicates the presence of a popup associated with the element.\n */\n ariaHasPopup?: boolean | string;\n /**\n * If true, indicates that the associated popup is open.\n */\n ariaExpanded?: boolean;\n // TODO: [breaking] remove string type\n /**\n * The tab order of the element.\n */\n tabIndex?: string | number;\n /**\n * If true, the element is disabled.\n */\n disabled?: boolean;\n /**\n * Inline styles applied to the element.\n */\n style?: React.CSSProperties;\n}\n\nconst Clickable: VibeComponent<ClickableProps, HTMLElement> = forwardRef(\n (\n {\n elementType = \"div\",\n className = \"\",\n id,\n children,\n role = \"button\",\n onClick = NOOP,\n enableTextSelection = false,\n onMouseDown = NOOP,\n onMouseEnter = NOOP,\n onMouseLeave = NOOP,\n ariaLabel,\n ariaHidden,\n ariaHasPopup,\n ariaExpanded,\n tabIndex = \"0\",\n disabled = false,\n style,\n \"data-testid\": dataTestId\n }: ClickableProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const clickableProps = useClickableProps(\n {\n onClick,\n onMouseDown,\n onMouseEnter,\n onMouseLeave,\n disabled,\n id,\n \"data-testid\": dataTestId,\n role,\n tabIndex,\n ariaLabel,\n ariaHidden,\n ariaHasPopup,\n ariaExpanded\n },\n ref\n );\n const overrideClassName = cx(styles.clickable, className, {\n [styles.disabled]: disabled,\n [styles.disableTextSelection]: !enableTextSelection\n });\n\n return React.createElement(\n elementType,\n {\n ...clickableProps,\n className: overrideClassName,\n style: style\n },\n children\n );\n }\n);\n\nexport default Clickable;\n"],"names":["Clickable","forwardRef","_ref","ref","_ref$elementType","elementType","_ref$className","className","children","_ref$role","role","_ref$onClick","onClick","_ref$enableTextSelect","enableTextSelection","_ref$onMouseDown","onMouseDown","_ref$onMouseEnter","onMouseEnter","_ref$onMouseLeave","onMouseLeave","_ref$tabIndex","tabIndex","_ref$disabled","disabled","style","clickableProps","useClickableProps","NOOP","id","ariaLabel","ariaHidden","ariaHasPopup","ariaExpanded","overrideClassName","cx","styles","clickable","_defineProperty","disableTextSelection","React","createElement","Object","assign"],"mappings":"6RAyEMA,IAAAA,EAAwDC,GAC5D,SAAAC,EAqBEC,GACE,IAAAC,EAAAF,EApBAG,YAAAA,OAAc,IAAHD,EAAG,MAAKA,EAAAE,EAAAJ,EACnBK,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAEdE,EAAQN,EAARM,SAAQC,EAAAP,EACRQ,KAAeC,EAAAT,EACfU,QAAcC,EAAAX,EACdY,oBAAAA,OAAsB,IAAHD,GAAQA,EAAAE,EAAAb,EAC3Bc,YAAkBC,EAAAf,EAClBgB,aAAmBC,EAAAjB,EACnBkB,aAIYC,EAAAnB,EACZoB,SAAcC,EAAArB,EACdsB,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAKvB,EAALuB,MAKIC,EAAiBC,EACrB,CACEf,aAlBQgB,IAAHjB,EAAGiB,EAAIjB,EAmBZK,iBAjBYY,IAAHb,EAAGa,EAAIb,EAkBhBG,kBAjBaU,IAAHX,EAAGW,EAAIX,EAkBjBG,kBAjBaQ,IAAHT,EAAGS,EAAIT,EAkBjBK,SAAAA,EACAK,GA1BA3B,EAAF2B,GA2BE,cAZuB3B,EAAzB,eAaEQ,UA1BK,IAAHD,EAAG,SAAQA,EA2Bba,cAjBS,IAAHD,EAAG,IAAGA,EAkBZS,UAtBO5B,EAAT4B,UAuBEC,WAtBQ7B,EAAV6B,WAuBEC,aAtBU9B,EAAZ8B,aAuBEC,aAtBU/B,EAAZ+B,cAwBA9B,GAEI+B,EAAoBC,EAAGC,EAAOC,UAAW9B,EAAS+B,EAAAA,EACrDF,CAAAA,EAAAA,EAAOZ,SAAWA,GAClBY,EAAOG,sBAAwBzB,IAGlC,OAAO0B,EAAMC,cACXpC,EAAWqC,OAAAC,OAAAD,OAAAC,OAAA,GAENjB,GACH,CAAAnB,UAAW2B,EACXT,MAAOA,IAETjB,EAEJ"}
@@ -1 +1 @@
1
- {"version":3,"file":"ClickableWrapper.js","sources":["../../../../../src/components/Clickable/ClickableWrapper.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport Clickable from \"./Clickable\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport { ClickableProps } from \"../Clickable/Clickable\";\n\nexport interface ClickableWrapperProps extends VibeComponentProps {\n children: React.ReactNode;\n isClickable: boolean;\n clickableProps: ClickableProps;\n}\n\nconst ClickableWrapper: VibeComponent<ClickableWrapperProps, HTMLElement> = forwardRef(\n ({ children, isClickable = true, clickableProps = {} }: ClickableWrapperProps, ref) => {\n if (!isClickable) {\n return <>{children}</>;\n }\n\n return (\n <Clickable {...clickableProps} ref={ref}>\n {children}\n </Clickable>\n );\n }\n);\n\nexport default ClickableWrapper;\n"],"names":["ClickableWrapper","forwardRef","_ref","ref","children","_ref$isClickable","isClickable","_ref$clickableProps","clickableProps","React","createElement","Clickable","Object","assign","Fragment"],"mappings":"oEAYMA,IAAAA,EAAsEC,GAC1E,SAAAC,EAA+EC,GAAO,IAAnFC,EAAQF,EAARE,SAAQC,EAAAH,EAAEI,YAAkBC,EAAAL,EAAEM,eAC/B,YADyB,IAAHH,GAAOA,EAM3BI,EAAAC,cAACC,EAASC,OAAAC,OAAA,CAAA,OANiC,IAAAN,EAAG,CAAA,EAAEA,EAMnB,CAAEJ,IAAKA,IACjCC,GALIK,EAAAC,cAAAD,EAAAK,SAAA,KAAGV,EAQd"}
1
+ {"version":3,"file":"ClickableWrapper.js","sources":["../../../../../src/components/Clickable/ClickableWrapper.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport Clickable from \"./Clickable\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport { ClickableProps } from \"../Clickable/Clickable\";\n\nexport interface ClickableWrapperProps extends VibeComponentProps {\n /**\n * The content inside the wrapper.\n */\n children: React.ReactNode;\n /**\n * If true, wraps the content in a `Clickable` component.\n */\n isClickable: boolean;\n /**\n * Props passed to the `Clickable` component.\n */\n clickableProps: ClickableProps;\n}\n\nconst ClickableWrapper: VibeComponent<ClickableWrapperProps, HTMLElement> = forwardRef(\n ({ children, isClickable = true, clickableProps = {} }: ClickableWrapperProps, ref) => {\n if (!isClickable) {\n return <>{children}</>;\n }\n\n return (\n <Clickable {...clickableProps} ref={ref}>\n {children}\n </Clickable>\n );\n }\n);\n\nexport default ClickableWrapper;\n"],"names":["ClickableWrapper","forwardRef","_ref","ref","children","_ref$isClickable","isClickable","_ref$clickableProps","clickableProps","React","createElement","Clickable","Object","assign","Fragment"],"mappings":"oEAqBMA,IAAAA,EAAsEC,GAC1E,SAAAC,EAA+EC,GAAO,IAAnFC,EAAQF,EAARE,SAAQC,EAAAH,EAAEI,YAAkBC,EAAAL,EAAEM,eAC/B,YADyB,IAAHH,GAAOA,EAM3BI,EAAAC,cAACC,EAASC,OAAAC,OAAA,CAAA,OANiC,IAAAN,EAAG,CAAA,EAAEA,EAMnB,CAAEJ,IAAKA,IACjCC,GALIK,EAAAC,cAAAD,EAAAK,SAAA,KAAGV,EAQd"}
@@ -1 +1 @@
1
- {"version":3,"file":"ColorPicker.js","sources":["../../../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useRef } from \"react\";\nimport { BaseSizes } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport { ColorStyle as ColorStyleEnum } from \"../../utils/colors-vars-map\";\nimport { NoColor } from \"@vibe/icons\";\nimport ColorPickerContent from \"./components/ColorPickerContent/ColorPickerContent\";\nimport { ColorShapes as ColorShapesEnum, DEFAULT_NUMBER_OF_COLORS_IN_LINE } from \"./ColorPickerConstants\";\nimport { ColorShapes, ColorPickerSizes, ColorPickerValue, ColorPickerArrayValueOnly } from \"./ColorPicker.types\";\nimport { calculateColorPickerDialogWidth } from \"./services/ColorPickerStyleService\";\nimport { VibeComponentProps, VibeComponent, SubIcon, withStaticProps } from \"../../types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./ColorPicker.module.scss\";\nimport { ColorStyle } from \"../../types/Colors\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ColorPickerProps extends VibeComponentProps {\n value?: ColorPickerValue;\n onSave?: (value: ColorPickerArrayValueOnly) => void;\n ColorIndicatorIcon?: SubIcon;\n SelectedIndicatorIcon?: SubIcon;\n /**\n * Hide color icon\n */\n NoColorIcon?: SubIcon;\n colorStyle?: ColorStyle;\n noColorText?: string;\n shouldRenderIndicatorWithoutBackground?: boolean;\n isBlackListMode?: boolean;\n colorsList?: ColorPickerArrayValueOnly;\n isMultiselect?: boolean;\n colorSize?: ColorPickerSizes;\n numberOfColorsInLine?: number;\n focusOnMount?: boolean;\n colorShape?: ColorShapes;\n /**\n * Used to force the component render the colorList prop as is. Usually, this flag should not be used. It's intended only for edge cases.\n * Usually, only \"monday colors\" will be rendered (unless blacklist mode is used). This flag will override this behavior.\n */\n forceUseRawColorList?: boolean;\n /**\n * Used to enable color name tooltip on each color in the component.\n * When \"tooltipContentByColor\" is supplied, it will override the color name tooltip.\n *\n */\n showColorNameTooltip?: boolean;\n}\n\nconst ColorPicker: VibeComponent<ColorPickerProps> & {\n sizes?: typeof BaseSizes;\n colorStyles?: typeof ColorStyleEnum;\n colorSizes?: typeof BaseSizes;\n colorShapes?: typeof ColorShapesEnum;\n} = forwardRef(\n (\n {\n className,\n onSave = NOOP,\n value = \"\",\n noColorText,\n colorStyle = \"regular\",\n ColorIndicatorIcon,\n SelectedIndicatorIcon,\n shouldRenderIndicatorWithoutBackground,\n NoColorIcon = NoColor,\n isBlackListMode = true,\n colorsList = [],\n isMultiselect,\n colorSize = \"medium\",\n numberOfColorsInLine = DEFAULT_NUMBER_OF_COLORS_IN_LINE,\n focusOnMount,\n colorShape = \"square\",\n forceUseRawColorList,\n showColorNameTooltip,\n id,\n \"data-testid\": dataTestId\n }: ColorPickerProps,\n ref\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n const onChange = useCallback(onSave, [onSave]);\n\n const width = calculateColorPickerDialogWidth(colorSize as BaseSizes, numberOfColorsInLine);\n\n return (\n <DialogContentContainer\n ref={mergedRef}\n className={cx(styles.colorPicker, styles.colorPickerDialogContent, className)}\n ariaLabelledby=\"Color Picker Dialog\"\n ariaDescribedby=\"Pick color\"\n style={{ width }}\n >\n <ColorPickerContent\n onValueChange={onChange}\n value={value}\n noColorText={noColorText}\n shouldRenderIndicatorWithoutBackground={ColorIndicatorIcon && shouldRenderIndicatorWithoutBackground}\n colorStyle={colorStyle}\n ColorIndicatorIcon={ColorIndicatorIcon}\n SelectedIndicatorIcon={SelectedIndicatorIcon}\n NoColorIcon={NoColorIcon}\n colorsList={colorsList}\n isBlackListMode={isBlackListMode}\n isMultiselect={isMultiselect}\n colorSize={colorSize}\n numberOfColorsInLine={numberOfColorsInLine}\n focusOnMount={focusOnMount}\n colorShape={colorShape}\n forceUseRawColorList={forceUseRawColorList}\n showColorNameTooltip={showColorNameTooltip}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.COLOR_PICKER, id)}\n data-vibe={ComponentVibeId.COLOR_PICKER}\n />\n </DialogContentContainer>\n );\n }\n);\n\nexport default withStaticProps(ColorPicker, {\n sizes: BaseSizes,\n colorStyles: ColorStyleEnum,\n colorSizes: BaseSizes,\n colorShapes: ColorShapesEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","_ref$onSave","onSave","NOOP","_ref$value","value","noColorText","_ref$colorStyle","colorStyle","ColorIndicatorIcon","SelectedIndicatorIcon","shouldRenderIndicatorWithoutBackground","_ref$NoColorIcon","NoColorIcon","NoColor","_ref$isBlackListMode","isBlackListMode","_ref$colorsList","colorsList","isMultiselect","_ref$colorSize","colorSize","_ref$numberOfColorsIn","numberOfColorsInLine","DEFAULT_NUMBER_OF_COLORS_IN_LINE","focusOnMount","_ref$colorShape","colorShape","forceUseRawColorList","showColorNameTooltip","id","dataTestId","componentRef","useRef","mergedRef","useMergeRef","onChange","useCallback","width","calculateColorPickerDialogWidth","React","createElement","DialogContentContainer","cx","styles","colorPicker","colorPickerDialogContent","ariaLabelledby","ariaDescribedby","style","ColorPickerContent","onValueChange","getTestId","ComponentDefaultTestId","COLOR_PICKER","ComponentVibeId","sizes","BaseSizes","colorStyles","ColorStyleEnum","colorSizes","colorShapes","ColorShapesEnum"],"mappings":"s5BAkDA,IAyEeA,EAAAA,EApEXC,GACF,SAAAC,EAuBEC,GACE,IAtBAC,EAASF,EAATE,UAASC,EAAAH,EACTI,OAAAA,OAASC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAN,EACbO,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EACVE,EAAWR,EAAXQ,YAAWC,EAAAT,EACXU,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAkBX,EAAlBW,mBACAC,EAAqBZ,EAArBY,sBACAC,EAAsCb,EAAtCa,uCAAsCC,EAAAd,EACtCe,YAAAA,OAAcC,IAAHF,EAAGE,EAAOF,EAAAG,EAAAjB,EACrBkB,gBAAAA,OAAkB,IAAHD,GAAOA,EAAAE,EAAAnB,EACtBoB,WAAAA,OAAa,IAAHD,EAAG,GAAEA,EACfE,EAAarB,EAAbqB,cAAaC,EAAAtB,EACbuB,UAAAA,OAAY,IAAHD,EAAG,SAAQA,EAAAE,EAAAxB,EACpByB,qBAAAA,OAAuBC,IAAHF,EAAGE,EAAgCF,EACvDG,EAAY3B,EAAZ2B,aAAYC,EAAA5B,EACZ6B,WAAAA,OAAa,IAAHD,EAAG,SAAQA,EACrBE,EAAoB9B,EAApB8B,qBACAC,EAAoB/B,EAApB+B,qBACAC,EAAEhC,EAAFgC,GACeC,EAAUjC,EAAzB,eAIIkC,EAAeC,EAAO,MACtBC,EAAYC,EAAYpC,EAAKiC,GAE7BI,EAAWC,EAAYnC,EAAQ,CAACA,IAEhCoC,EAAQC,EAAgClB,EAAwBE,GAEtE,OACEiB,EAAAC,cAACC,EAAsB,CACrB3C,IAAKmC,EACLlC,UAAW2C,EAAGC,EAAOC,YAAaD,EAAOE,yBAA0B9C,GACnE+C,eAAe,sBACfC,gBAAgB,aAChBC,MAAO,CAAEX,MAAAA,IAETE,EAACC,cAAAS,GACCC,cAAef,EACf/B,MAAOA,EACPC,YAAaA,EACbK,uCAAwCF,GAAsBE,EAC9DH,WAAYA,EACZC,mBAAoBA,EACpBC,sBAAuBA,EACvBG,YAAaA,EACbK,WAAYA,EACZF,gBAAiBA,EACjBG,cAAeA,EACfE,UAAWA,EACXE,qBAAsBA,EACtBE,aAAcA,EACdE,WAAYA,EACZC,qBAAsBA,EACtBC,qBAAsBA,EACtBC,GAAIA,EAAE,cACOC,GAAcqB,EAAUC,EAAuBC,aAAcxB,GAC/D,YAAAyB,EAAgBD,eAInC,IAG0C,CAC1CE,MAAOC,EACPC,YAAaC,EACbC,WAAYH,EACZI,YAAaC"}
1
+ {"version":3,"file":"ColorPicker.js","sources":["../../../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useRef } from \"react\";\nimport { BaseSizes } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport { ColorStyle as ColorStyleEnum } from \"../../utils/colors-vars-map\";\nimport { NoColor } from \"@vibe/icons\";\nimport ColorPickerContent from \"./components/ColorPickerContent/ColorPickerContent\";\nimport { ColorShapes as ColorShapesEnum, DEFAULT_NUMBER_OF_COLORS_IN_LINE } from \"./ColorPickerConstants\";\nimport { ColorShapes, ColorPickerSizes, ColorPickerValue, ColorPickerArrayValueOnly } from \"./ColorPicker.types\";\nimport { calculateColorPickerDialogWidth } from \"./services/ColorPickerStyleService\";\nimport { VibeComponentProps, VibeComponent, SubIcon, withStaticProps } from \"../../types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./ColorPicker.module.scss\";\nimport { ColorStyle } from \"../../types/Colors\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ColorPickerProps extends VibeComponentProps {\n /**\n * The selected color(s).\n */\n value?: ColorPickerValue;\n /**\n * Callback fired when the selected color(s) change.\n */\n onSave?: (value: ColorPickerArrayValueOnly) => void;\n /**\n * Icon displayed as an indicator inside the color.\n */\n ColorIndicatorIcon?: SubIcon;\n /**\n * Icon displayed when a color is selected.\n */\n SelectedIndicatorIcon?: SubIcon;\n /**\n * Icon used for clearing the color selection.\n */\n NoColorIcon?: SubIcon;\n /**\n * The style applied to the colors.\n */\n colorStyle?: ColorStyle;\n /**\n * Text displayed for the \"no color\" option.\n */\n noColorText?: string;\n /**\n * If true, renders the color indicator without a background.\n */\n shouldRenderIndicatorWithoutBackground?: boolean;\n /**\n * If true, treats the color list as a blacklist rather than a whitelist.\n */\n isBlackListMode?: boolean;\n /**\n * The list of colors available for selection.\n */\n colorsList?: ColorPickerArrayValueOnly;\n /**\n * If true, allows selecting multiple colors.\n */\n isMultiselect?: boolean;\n /**\n * The size of the color items.\n */\n colorSize?: ColorPickerSizes;\n /**\n * The number of colors displayed per row.\n */\n numberOfColorsInLine?: number;\n /**\n * If true, the first color is focused when the component mounts.\n */\n focusOnMount?: boolean;\n /**\n * The shape of the color items.\n */\n colorShape?: ColorShapes;\n /**\n * Used to force the component render the colorList prop as is. Usually, this flag should not be used. It's intended only for edge cases.\n * Usually, only \"monday colors\" will be rendered (unless blacklist mode is used). This flag will override this behavior.\n */\n forceUseRawColorList?: boolean;\n /**\n * Used to enable color name tooltip on each color in the component.\n * When \"tooltipContentByColor\" is supplied, it will override the color name tooltip.\n *\n */\n showColorNameTooltip?: boolean;\n}\n\nconst ColorPicker: VibeComponent<ColorPickerProps> & {\n sizes?: typeof BaseSizes;\n colorStyles?: typeof ColorStyleEnum;\n colorSizes?: typeof BaseSizes;\n colorShapes?: typeof ColorShapesEnum;\n} = forwardRef(\n (\n {\n className,\n onSave = NOOP,\n value = \"\",\n noColorText,\n colorStyle = \"regular\",\n ColorIndicatorIcon,\n SelectedIndicatorIcon,\n shouldRenderIndicatorWithoutBackground,\n NoColorIcon = NoColor,\n isBlackListMode = true,\n colorsList = [],\n isMultiselect,\n colorSize = \"medium\",\n numberOfColorsInLine = DEFAULT_NUMBER_OF_COLORS_IN_LINE,\n focusOnMount,\n colorShape = \"square\",\n forceUseRawColorList,\n showColorNameTooltip,\n id,\n \"data-testid\": dataTestId\n }: ColorPickerProps,\n ref\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n const onChange = useCallback(onSave, [onSave]);\n\n const width = calculateColorPickerDialogWidth(colorSize as BaseSizes, numberOfColorsInLine);\n\n return (\n <DialogContentContainer\n ref={mergedRef}\n className={cx(styles.colorPicker, styles.colorPickerDialogContent, className)}\n ariaLabelledby=\"Color Picker Dialog\"\n ariaDescribedby=\"Pick color\"\n style={{ width }}\n >\n <ColorPickerContent\n onValueChange={onChange}\n value={value}\n noColorText={noColorText}\n shouldRenderIndicatorWithoutBackground={ColorIndicatorIcon && shouldRenderIndicatorWithoutBackground}\n colorStyle={colorStyle}\n ColorIndicatorIcon={ColorIndicatorIcon}\n SelectedIndicatorIcon={SelectedIndicatorIcon}\n NoColorIcon={NoColorIcon}\n colorsList={colorsList}\n isBlackListMode={isBlackListMode}\n isMultiselect={isMultiselect}\n colorSize={colorSize}\n numberOfColorsInLine={numberOfColorsInLine}\n focusOnMount={focusOnMount}\n colorShape={colorShape}\n forceUseRawColorList={forceUseRawColorList}\n showColorNameTooltip={showColorNameTooltip}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.COLOR_PICKER, id)}\n data-vibe={ComponentVibeId.COLOR_PICKER}\n />\n </DialogContentContainer>\n );\n }\n);\n\nexport default withStaticProps(ColorPicker, {\n sizes: BaseSizes,\n colorStyles: ColorStyleEnum,\n colorSizes: BaseSizes,\n colorShapes: ColorShapesEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","_ref$onSave","onSave","NOOP","_ref$value","value","noColorText","_ref$colorStyle","colorStyle","ColorIndicatorIcon","SelectedIndicatorIcon","shouldRenderIndicatorWithoutBackground","_ref$NoColorIcon","NoColorIcon","NoColor","_ref$isBlackListMode","isBlackListMode","_ref$colorsList","colorsList","isMultiselect","_ref$colorSize","colorSize","_ref$numberOfColorsIn","numberOfColorsInLine","DEFAULT_NUMBER_OF_COLORS_IN_LINE","focusOnMount","_ref$colorShape","colorShape","forceUseRawColorList","showColorNameTooltip","id","dataTestId","componentRef","useRef","mergedRef","useMergeRef","onChange","useCallback","width","calculateColorPickerDialogWidth","React","createElement","DialogContentContainer","cx","styles","colorPicker","colorPickerDialogContent","ariaLabelledby","ariaDescribedby","style","ColorPickerContent","onValueChange","getTestId","ComponentDefaultTestId","COLOR_PICKER","ComponentVibeId","sizes","BaseSizes","colorStyles","ColorStyleEnum","colorSizes","colorShapes","ColorShapesEnum"],"mappings":"s5BA4FA,IAyEeA,EAAAA,EApEXC,GACF,SAAAC,EAuBEC,GACE,IAtBAC,EAASF,EAATE,UAASC,EAAAH,EACTI,OAAAA,OAASC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAN,EACbO,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EACVE,EAAWR,EAAXQ,YAAWC,EAAAT,EACXU,WAAAA,OAAa,IAAHD,EAAG,UAASA,EACtBE,EAAkBX,EAAlBW,mBACAC,EAAqBZ,EAArBY,sBACAC,EAAsCb,EAAtCa,uCAAsCC,EAAAd,EACtCe,YAAAA,OAAcC,IAAHF,EAAGE,EAAOF,EAAAG,EAAAjB,EACrBkB,gBAAAA,OAAkB,IAAHD,GAAOA,EAAAE,EAAAnB,EACtBoB,WAAAA,OAAa,IAAHD,EAAG,GAAEA,EACfE,EAAarB,EAAbqB,cAAaC,EAAAtB,EACbuB,UAAAA,OAAY,IAAHD,EAAG,SAAQA,EAAAE,EAAAxB,EACpByB,qBAAAA,OAAuBC,IAAHF,EAAGE,EAAgCF,EACvDG,EAAY3B,EAAZ2B,aAAYC,EAAA5B,EACZ6B,WAAAA,OAAa,IAAHD,EAAG,SAAQA,EACrBE,EAAoB9B,EAApB8B,qBACAC,EAAoB/B,EAApB+B,qBACAC,EAAEhC,EAAFgC,GACeC,EAAUjC,EAAzB,eAIIkC,EAAeC,EAAO,MACtBC,EAAYC,EAAYpC,EAAKiC,GAE7BI,EAAWC,EAAYnC,EAAQ,CAACA,IAEhCoC,EAAQC,EAAgClB,EAAwBE,GAEtE,OACEiB,EAAAC,cAACC,EAAsB,CACrB3C,IAAKmC,EACLlC,UAAW2C,EAAGC,EAAOC,YAAaD,EAAOE,yBAA0B9C,GACnE+C,eAAe,sBACfC,gBAAgB,aAChBC,MAAO,CAAEX,MAAAA,IAETE,EAACC,cAAAS,GACCC,cAAef,EACf/B,MAAOA,EACPC,YAAaA,EACbK,uCAAwCF,GAAsBE,EAC9DH,WAAYA,EACZC,mBAAoBA,EACpBC,sBAAuBA,EACvBG,YAAaA,EACbK,WAAYA,EACZF,gBAAiBA,EACjBG,cAAeA,EACfE,UAAWA,EACXE,qBAAsBA,EACtBE,aAAcA,EACdE,WAAYA,EACZC,qBAAsBA,EACtBC,qBAAsBA,EACtBC,GAAIA,EAAE,cACOC,GAAcqB,EAAUC,EAAuBC,aAAcxB,GAC/D,YAAAyB,EAAgBD,eAInC,IAG0C,CAC1CE,MAAOC,EACPC,YAAaC,EACbC,WAAYH,EACZI,YAAaC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ColorPickerClearButton.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.tsx"],"sourcesContent":["import React from \"react\";\nimport useGridKeyboardNavigation from \"../../../../hooks/useGridKeyboardNavigation/useGridKeyboardNavigation\";\nimport Button from \"../../../Button/Button\";\nimport { VibeComponentProps, VibeComponent, SubIcon } from \"../../../../types\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport styles from \"./ColorPickerClearButton.module.scss\";\n\nexport interface ColorPickerClearButtonProps extends VibeComponentProps {\n onClick: () => void;\n text?: string;\n Icon: SubIcon;\n}\n\nexport const ColorPickerClearButton: VibeComponent<ColorPickerClearButtonProps> = React.forwardRef(\n ({ onClick, text, Icon }: ColorPickerClearButtonProps, ref) => {\n const { onSelectionAction } = useGridKeyboardNavigation({\n ref: ref as React.MutableRefObject<HTMLElement>,\n itemsCount: 1,\n numberOfItemsInLine: 1,\n onItemClicked: onClick,\n getItemByIndex: NOOP //hack - we don't really have a grid, it's just for keyboard navigation outside the clear button\n });\n\n return (\n <Button\n ref={ref}\n size=\"small\"\n kind=\"tertiary\"\n onClick={() => onSelectionAction(-1)} //hack - we don't really have a grid, it's just for keyboard navigation outside the clear button\n blurOnMouseUp={false}\n className={styles.clearColorButton}\n >\n <Icon size=\"16\" className={styles.clearColorIcon} />\n {text || \"Clear\"}\n </Button>\n );\n }\n);\n"],"names":["ColorPickerClearButton","React","forwardRef","_ref","ref","text","Icon","onSelectionAction","useGridKeyboardNavigation","itemsCount","numberOfItemsInLine","onItemClicked","onClick","getItemByIndex","NOOP","createElement","Button","size","kind","blurOnMouseUp","className","styles","clearColorButton","clearColorIcon"],"mappings":"wQAaO,IAAMA,EAAqEC,EAAMC,YACtF,SAAAC,EAAuDC,GAAO,IAAlDC,EAAIF,EAAJE,KAAMC,EAAIH,EAAJG,KACRC,EAAsBC,EAA0B,CACtDJ,IAAKA,EACLK,WAAY,EACZC,oBAAqB,EACrBC,cALMR,EAAPS,QAMCC,eAAgBC,IALVP,kBAQR,OACEN,EAAAc,cAACC,EAAM,CACLZ,IAAKA,EACLa,KAAK,QACLC,KAAK,WACLN,QAAS,WAAA,OAAML,GAAmB,EAAE,EACpCY,eAAe,EACfC,UAAWC,EAAOC,kBAElBrB,EAACc,cAAAT,EAAK,CAAAW,KAAK,KAAKG,UAAWC,EAAOE,iBACjClB,GAAQ,QAGf"}
1
+ {"version":3,"file":"ColorPickerClearButton.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.tsx"],"sourcesContent":["import React from \"react\";\nimport useGridKeyboardNavigation from \"../../../../hooks/useGridKeyboardNavigation/useGridKeyboardNavigation\";\nimport Button from \"../../../Button/Button\";\nimport { VibeComponentProps, VibeComponent, SubIcon } from \"../../../../types\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport styles from \"./ColorPickerClearButton.module.scss\";\n\nexport interface ColorPickerClearButtonProps extends VibeComponentProps {\n /**\n * Callback fired when the clear button is clicked.\n */\n onClick: () => void;\n /**\n * The text displayed inside the button.\n */\n text?: string;\n /**\n * The icon displayed inside the button.\n */\n Icon: SubIcon;\n}\n\nexport const ColorPickerClearButton: VibeComponent<ColorPickerClearButtonProps> = React.forwardRef(\n ({ onClick, text, Icon }: ColorPickerClearButtonProps, ref) => {\n const { onSelectionAction } = useGridKeyboardNavigation({\n ref: ref as React.MutableRefObject<HTMLElement>,\n itemsCount: 1,\n numberOfItemsInLine: 1,\n onItemClicked: onClick,\n getItemByIndex: NOOP //hack - we don't really have a grid, it's just for keyboard navigation outside the clear button\n });\n\n return (\n <Button\n ref={ref}\n size=\"small\"\n kind=\"tertiary\"\n onClick={() => onSelectionAction(-1)} //hack - we don't really have a grid, it's just for keyboard navigation outside the clear button\n blurOnMouseUp={false}\n className={styles.clearColorButton}\n >\n <Icon size=\"16\" className={styles.clearColorIcon} />\n {text || \"Clear\"}\n </Button>\n );\n }\n);\n"],"names":["ColorPickerClearButton","React","forwardRef","_ref","ref","text","Icon","onSelectionAction","useGridKeyboardNavigation","itemsCount","numberOfItemsInLine","onItemClicked","onClick","getItemByIndex","NOOP","createElement","Button","size","kind","blurOnMouseUp","className","styles","clearColorButton","clearColorIcon"],"mappings":"wQAsBO,IAAMA,EAAqEC,EAAMC,YACtF,SAAAC,EAAuDC,GAAO,IAAlDC,EAAIF,EAAJE,KAAMC,EAAIH,EAAJG,KACRC,EAAsBC,EAA0B,CACtDJ,IAAKA,EACLK,WAAY,EACZC,oBAAqB,EACrBC,cALMR,EAAPS,QAMCC,eAAgBC,IALVP,kBAQR,OACEN,EAAAc,cAACC,EAAM,CACLZ,IAAKA,EACLa,KAAK,QACLC,KAAK,WACLN,QAAS,WAAA,OAAML,GAAmB,EAAE,EACpCY,eAAe,EACfC,UAAWC,EAAOC,kBAElBrB,EAACc,cAAAT,EAAK,CAAAW,KAAK,KAAKG,UAAWC,EAAOE,iBACjClB,GAAQ,QAGf"}
@@ -1 +1 @@
1
- {"version":3,"file":"ColorPickerColorsGrid.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport useGridKeyboardNavigation from \"../../../../hooks/useGridKeyboardNavigation/useGridKeyboardNavigation\";\nimport ColorPickerItemComponent from \"../ColorPickerItemComponent/ColorPickerItemComponent\";\nimport { CONTENT_COLORS_VALUES } from \"../../../../utils/colors-vars-map\";\nimport { ColorPickerArrayValueOnly, ColorPickerValueOnly } from \"../../ColorPicker.types\";\nimport { ColorShapes, ColorPickerSizes } from \"../../ColorPicker.types\";\nimport { SubIcon, VibeComponent, VibeComponentProps } from \"../../../../types\";\nimport styles from \"./ColorPickerColorsGrid.module.scss\";\nimport { ColorStyle } from \"../../../../types/Colors\";\n\nconst formatColorNameForTooltip = (color: ColorPickerValueOnly) => {\n return color.replace(/-|_/g, \" \").replace(/(?:^|\\s)\\S/g, function (a) {\n return a.toUpperCase();\n });\n};\n\nconst calculateColorTooltip = (\n color: ColorPickerValueOnly,\n tooltipContentByColor?: Partial<Record<CONTENT_COLORS_VALUES, string> & Record<string, string>>\n) => {\n if (tooltipContentByColor && tooltipContentByColor[color]) {\n return tooltipContentByColor[color];\n } else {\n return formatColorNameForTooltip(color);\n }\n};\n\nexport interface ColorPickerColorsGridProps extends VibeComponentProps {\n onColorClicked?: (color: ColorPickerValueOnly) => void;\n colorsToRender?: ColorPickerArrayValueOnly;\n ColorIndicatorIcon?: SubIcon;\n SelectedIndicatorIcon?: SubIcon;\n colorStyle?: ColorStyle;\n value?: string | string[];\n shouldRenderIndicatorWithoutBackground?: boolean;\n colorSize?: ColorPickerSizes;\n numberOfColorsInLine?: number;\n tooltipContentByColor?: Partial<Record<CONTENT_COLORS_VALUES, string> & Record<string, string>>;\n focusOnMount?: boolean;\n colorShape?: ColorShapes;\n showColorNameTooltip?: boolean;\n}\n\nexport const ColorPickerColorsGrid: VibeComponent<ColorPickerColorsGridProps, HTMLUListElement> = React.forwardRef(\n (\n {\n onColorClicked,\n colorsToRender,\n numberOfColorsInLine,\n focusOnMount,\n value,\n colorStyle,\n ColorIndicatorIcon,\n shouldRenderIndicatorWithoutBackground,\n SelectedIndicatorIcon,\n colorSize,\n tooltipContentByColor,\n colorShape,\n showColorNameTooltip: showColorNameTooltip,\n id,\n \"data-testid\": dataTestId\n }: ColorPickerColorsGridProps,\n ref\n ) => {\n const getItemByIndex = useCallback((index: number) => colorsToRender[index], [colorsToRender]);\n\n const { activeIndex, onSelectionAction } = useGridKeyboardNavigation({\n focusOnMount,\n ref: ref as React.MutableRefObject<HTMLUListElement>,\n onItemClicked: onColorClicked,\n itemsCount: colorsToRender.length,\n numberOfItemsInLine: numberOfColorsInLine,\n getItemByIndex\n });\n\n return (\n <ul className={styles.colorsGrid} ref={ref} tabIndex={-1} id={id} data-testid={dataTestId}>\n {colorsToRender.map((color, index) => {\n return (\n <ColorPickerItemComponent\n key={color}\n color={color}\n onColorClicked={() => onSelectionAction(index)}\n shouldRenderIndicatorWithoutBackground={ColorIndicatorIcon && shouldRenderIndicatorWithoutBackground}\n colorStyle={colorStyle}\n ColorIndicatorIcon={ColorIndicatorIcon}\n SelectedIndicatorIcon={SelectedIndicatorIcon}\n isSelected={Array.isArray(value) ? value.includes(color) : value === color}\n isActive={index === activeIndex}\n colorSize={colorSize}\n tooltipContent={showColorNameTooltip ? calculateColorTooltip(color, tooltipContentByColor) : undefined}\n colorShape={colorShape}\n />\n );\n })}\n </ul>\n );\n }\n);\n"],"names":["calculateColorTooltip","color","tooltipContentByColor","replace","a","toUpperCase","formatColorNameForTooltip","ColorPickerColorsGrid","React","forwardRef","_ref","ref","onColorClicked","colorsToRender","numberOfColorsInLine","focusOnMount","value","colorStyle","ColorIndicatorIcon","shouldRenderIndicatorWithoutBackground","SelectedIndicatorIcon","colorSize","colorShape","showColorNameTooltip","id","dataTestId","getItemByIndex","useCallback","index","_useGridKeyboardNavig","useGridKeyboardNavigation","onItemClicked","itemsCount","length","numberOfItemsInLine","activeIndex","onSelectionAction","createElement","className","styles","colorsGrid","tabIndex","map","ColorPickerItemComponent","key","isSelected","Array","isArray","includes","isActive","tooltipContent","undefined"],"mappings":"4PAUA,IAMMA,EAAwB,SAC5BC,EACAC,GAEA,OAAIA,GAAyBA,EAAsBD,GAC1CC,EAAsBD,GAXC,SAACA,GACjC,OAAOA,EAAME,QAAQ,OAAQ,KAAKA,QAAQ,eAAe,SAAUC,GACjE,OAAOA,EAAEC,aACX,GACF,CASWC,CAA0BL,EAErC,EAkBaM,EAAqFC,EAAMC,YACtG,SAAAC,EAkBEC,GACE,IAjBAC,EAAcF,EAAdE,eACAC,EAAcH,EAAdG,eACAC,EAAoBJ,EAApBI,qBACAC,EAAYL,EAAZK,aACAC,EAAKN,EAALM,MACAC,EAAUP,EAAVO,WACAC,EAAkBR,EAAlBQ,mBACAC,EAAsCT,EAAtCS,uCACAC,EAAqBV,EAArBU,sBACAC,EAASX,EAATW,UACAnB,EAAqBQ,EAArBR,sBACAoB,EAAUZ,EAAVY,WACsBC,EAAoBb,EAA1Ca,qBACAC,EAAEd,EAAFc,GACeC,EAAUf,EAAzB,eAIIgB,EAAiBC,GAAY,SAACC,GAAa,OAAKf,EAAee,KAAQ,CAACf,IAE9EgB,EAA2CC,EAA0B,CACnEf,aAAAA,EACAJ,IAAKA,EACLoB,cAAenB,EACfoB,WAAYnB,EAAeoB,OAC3BC,oBAAqBpB,EACrBY,eAAAA,IANMS,EAAWN,EAAXM,YAAaC,EAAiBP,EAAjBO,kBASrB,OACE5B,EAAA6B,cAAA,KAAA,CAAIC,UAAWC,EAAOC,WAAY7B,IAAKA,EAAK8B,UAAW,EAAGjB,GAAIA,EAAiB,cAAAC,GAC5EZ,EAAe6B,KAAI,SAACzC,EAAO2B,GAC1B,OACEpB,gBAACmC,EAAwB,CACvBC,IAAK3C,EACLA,MAAOA,EACPW,eAAgB,WAAA,OAAMwB,EAAkBR,EAAM,EAC9CT,uCAAwCD,GAAsBC,EAC9DF,WAAYA,EACZC,mBAAoBA,EACpBE,sBAAuBA,EACvByB,WAAYC,MAAMC,QAAQ/B,GAASA,EAAMgC,SAAS/C,GAASe,IAAUf,EACrEgD,SAAUrB,IAAUO,EACpBd,UAAWA,EACX6B,eAAgB3B,EAAuBvB,EAAsBC,EAAOC,QAAyBiD,EAC7F7B,WAAYA,GAGjB,IAGP"}
1
+ {"version":3,"file":"ColorPickerColorsGrid.js","sources":["../../../../../../../src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport useGridKeyboardNavigation from \"../../../../hooks/useGridKeyboardNavigation/useGridKeyboardNavigation\";\nimport ColorPickerItemComponent from \"../ColorPickerItemComponent/ColorPickerItemComponent\";\nimport { CONTENT_COLORS_VALUES } from \"../../../../utils/colors-vars-map\";\nimport { ColorPickerArrayValueOnly, ColorPickerValueOnly } from \"../../ColorPicker.types\";\nimport { ColorShapes, ColorPickerSizes } from \"../../ColorPicker.types\";\nimport { SubIcon, VibeComponent, VibeComponentProps } from \"../../../../types\";\nimport styles from \"./ColorPickerColorsGrid.module.scss\";\nimport { ColorStyle } from \"../../../../types/Colors\";\n\nconst formatColorNameForTooltip = (color: ColorPickerValueOnly) => {\n return color.replace(/-|_/g, \" \").replace(/(?:^|\\s)\\S/g, function (a) {\n return a.toUpperCase();\n });\n};\n\nconst calculateColorTooltip = (\n color: ColorPickerValueOnly,\n tooltipContentByColor?: Partial<Record<CONTENT_COLORS_VALUES, string> & Record<string, string>>\n) => {\n if (tooltipContentByColor && tooltipContentByColor[color]) {\n return tooltipContentByColor[color];\n } else {\n return formatColorNameForTooltip(color);\n }\n};\n\nexport interface ColorPickerColorsGridProps extends VibeComponentProps {\n /**\n * Callback fired when a color is clicked.\n */\n onColorClicked?: (color: ColorPickerValueOnly) => void;\n /**\n * The list of colors to be displayed.\n */\n colorsToRender?: ColorPickerArrayValueOnly;\n /**\n * Icon displayed as an indicator inside the color.\n */\n ColorIndicatorIcon?: SubIcon;\n /**\n * Icon displayed when a color is selected.\n */\n SelectedIndicatorIcon?: SubIcon;\n /**\n * The style applied to the colors.\n */\n colorStyle?: ColorStyle;\n /**\n * The currently selected color or colors.\n */\n value?: string | string[];\n /**\n * If true, renders the color indicator without a background.\n */\n shouldRenderIndicatorWithoutBackground?: boolean;\n /**\n * The size of the color items.\n */\n colorSize?: ColorPickerSizes;\n /**\n * The number of colors per row.\n */\n numberOfColorsInLine?: number;\n /**\n * Custom tooltip content for specific colors.\n */\n tooltipContentByColor?: Partial<Record<CONTENT_COLORS_VALUES, string> & Record<string, string>>;\n /**\n * If true, the first color is focused when the component mounts.\n */\n focusOnMount?: boolean;\n /**\n * The shape of the color items.\n */\n colorShape?: ColorShapes;\n /**\n * If true, displays a tooltip with the color name.\n */\n showColorNameTooltip?: boolean;\n}\n\nexport const ColorPickerColorsGrid: VibeComponent<ColorPickerColorsGridProps, HTMLUListElement> = React.forwardRef(\n (\n {\n onColorClicked,\n colorsToRender,\n numberOfColorsInLine,\n focusOnMount,\n value,\n colorStyle,\n ColorIndicatorIcon,\n shouldRenderIndicatorWithoutBackground,\n SelectedIndicatorIcon,\n colorSize,\n tooltipContentByColor,\n colorShape,\n showColorNameTooltip: showColorNameTooltip,\n id,\n \"data-testid\": dataTestId\n }: ColorPickerColorsGridProps,\n ref\n ) => {\n const getItemByIndex = useCallback((index: number) => colorsToRender[index], [colorsToRender]);\n\n const { activeIndex, onSelectionAction } = useGridKeyboardNavigation({\n focusOnMount,\n ref: ref as React.MutableRefObject<HTMLUListElement>,\n onItemClicked: onColorClicked,\n itemsCount: colorsToRender.length,\n numberOfItemsInLine: numberOfColorsInLine,\n getItemByIndex\n });\n\n return (\n <ul className={styles.colorsGrid} ref={ref} tabIndex={-1} id={id} data-testid={dataTestId}>\n {colorsToRender.map((color, index) => {\n return (\n <ColorPickerItemComponent\n key={color}\n color={color}\n onColorClicked={() => onSelectionAction(index)}\n shouldRenderIndicatorWithoutBackground={ColorIndicatorIcon && shouldRenderIndicatorWithoutBackground}\n colorStyle={colorStyle}\n ColorIndicatorIcon={ColorIndicatorIcon}\n SelectedIndicatorIcon={SelectedIndicatorIcon}\n isSelected={Array.isArray(value) ? value.includes(color) : value === color}\n isActive={index === activeIndex}\n colorSize={colorSize}\n tooltipContent={showColorNameTooltip ? calculateColorTooltip(color, tooltipContentByColor) : undefined}\n colorShape={colorShape}\n />\n );\n })}\n </ul>\n );\n }\n);\n"],"names":["calculateColorTooltip","color","tooltipContentByColor","replace","a","toUpperCase","formatColorNameForTooltip","ColorPickerColorsGrid","React","forwardRef","_ref","ref","onColorClicked","colorsToRender","numberOfColorsInLine","focusOnMount","value","colorStyle","ColorIndicatorIcon","shouldRenderIndicatorWithoutBackground","SelectedIndicatorIcon","colorSize","colorShape","showColorNameTooltip","id","dataTestId","getItemByIndex","useCallback","index","_useGridKeyboardNavig","useGridKeyboardNavigation","onItemClicked","itemsCount","length","numberOfItemsInLine","activeIndex","onSelectionAction","createElement","className","styles","colorsGrid","tabIndex","map","ColorPickerItemComponent","key","isSelected","Array","isArray","includes","isActive","tooltipContent","undefined"],"mappings":"4PAUA,IAMMA,EAAwB,SAC5BC,EACAC,GAEA,OAAIA,GAAyBA,EAAsBD,GAC1CC,EAAsBD,GAXC,SAACA,GACjC,OAAOA,EAAME,QAAQ,OAAQ,KAAKA,QAAQ,eAAe,SAAUC,GACjE,OAAOA,EAAEC,aACX,GACF,CASWC,CAA0BL,EAErC,EAyDaM,EAAqFC,EAAMC,YACtG,SAAAC,EAkBEC,GACE,IAjBAC,EAAcF,EAAdE,eACAC,EAAcH,EAAdG,eACAC,EAAoBJ,EAApBI,qBACAC,EAAYL,EAAZK,aACAC,EAAKN,EAALM,MACAC,EAAUP,EAAVO,WACAC,EAAkBR,EAAlBQ,mBACAC,EAAsCT,EAAtCS,uCACAC,EAAqBV,EAArBU,sBACAC,EAASX,EAATW,UACAnB,EAAqBQ,EAArBR,sBACAoB,EAAUZ,EAAVY,WACsBC,EAAoBb,EAA1Ca,qBACAC,EAAEd,EAAFc,GACeC,EAAUf,EAAzB,eAIIgB,EAAiBC,GAAY,SAACC,GAAa,OAAKf,EAAee,KAAQ,CAACf,IAE9EgB,EAA2CC,EAA0B,CACnEf,aAAAA,EACAJ,IAAKA,EACLoB,cAAenB,EACfoB,WAAYnB,EAAeoB,OAC3BC,oBAAqBpB,EACrBY,eAAAA,IANMS,EAAWN,EAAXM,YAAaC,EAAiBP,EAAjBO,kBASrB,OACE5B,EAAA6B,cAAA,KAAA,CAAIC,UAAWC,EAAOC,WAAY7B,IAAKA,EAAK8B,UAAW,EAAGjB,GAAIA,EAAiB,cAAAC,GAC5EZ,EAAe6B,KAAI,SAACzC,EAAO2B,GAC1B,OACEpB,gBAACmC,EAAwB,CACvBC,IAAK3C,EACLA,MAAOA,EACPW,eAAgB,WAAA,OAAMwB,EAAkBR,EAAM,EAC9CT,uCAAwCD,GAAsBC,EAC9DF,WAAYA,EACZC,mBAAoBA,EACpBE,sBAAuBA,EACvByB,WAAYC,MAAMC,QAAQ/B,GAASA,EAAMgC,SAAS/C,GAASe,IAAUf,EACrEgD,SAAUrB,IAAUO,EACpBd,UAAWA,EACX6B,eAAgB3B,EAAuBvB,EAAsBC,EAAOC,QAAyBiD,EAC7F7B,WAAYA,GAGjB,IAGP"}