@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.
- package/dist/components/Accordion/Accordion/Accordion.d.ts +3 -15
- package/dist/components/Accordion/AccordionItem/AccordionItem.d.ts +9 -17
- package/dist/components/AlertBanner/AlertBanner.d.ts +16 -3
- package/dist/components/AlertBanner/AlertBannerButton/AlertBannerButton.d.ts +3 -0
- package/dist/components/AlertBanner/AlertBannerLink/AlertBannerLink.d.ts +3 -0
- package/dist/components/AlertBanner/AlertBannerText/AlertBannerText.d.ts +6 -0
- package/dist/components/AttentionBox/AttentionBox.d.ts +36 -4
- package/dist/components/Avatar/Avatar.d.ts +70 -3
- package/dist/components/Avatar/AvatarBadge.d.ts +10 -2
- package/dist/components/Avatar/AvatarContent.d.ts +24 -1
- package/dist/components/AvatarGroup/AvatarGroup.d.ts +17 -5
- package/dist/components/AvatarGroup/AvatarGroupCounter.d.ts +20 -2
- package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContainer.d.ts +20 -3
- package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContent.d.ts +10 -2
- package/dist/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.d.ts +13 -1
- package/dist/components/Badge/Badge.d.ts +15 -0
- package/dist/components/Badge/Indicator/Indicator.d.ts +3 -0
- package/dist/components/BaseInput/BaseInput.types.d.ts +8 -15
- package/dist/components/BaseListItem/BaseListItem.types.d.ts +2 -2
- package/dist/components/Box/Box.d.ts +75 -0
- package/dist/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.d.ts +24 -0
- package/dist/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.d.ts +24 -7
- package/dist/components/BreadcrumbsBar/BreadcrumbsBar.d.ts +6 -1
- package/dist/components/ButtonGroup/ButtonGroup.d.ts +46 -1
- package/dist/components/ButtonGroup/ButtonWrapper.d.ts +16 -1
- package/dist/components/Checkbox/Checkbox.d.ts +42 -18
- package/dist/components/Chips/Chips.d.ts +54 -20
- package/dist/components/Clickable/Clickable.d.ts +41 -5
- package/dist/components/Clickable/ClickableWrapper.d.ts +9 -0
- package/dist/components/ColorPicker/ColorPicker.d.ts +43 -1
- package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.d.ts +9 -0
- package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.d.ts +39 -0
- package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.d.ts +48 -0
- package/dist/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.d.ts +33 -1
- package/dist/components/Combobox/Combobox.d.ts +78 -25
- package/dist/components/Combobox/components/ComboboxCategory/ComboboxCategory.d.ts +6 -0
- package/dist/components/Combobox/components/ComboboxConstants.d.ts +156 -0
- package/dist/components/Combobox/components/ComboboxItems/ComboboxItems.d.ts +45 -0
- package/dist/components/Combobox/components/ComboboxOption/ComboboxOption.d.ts +30 -0
- package/dist/components/Counter/Counter.d.ts +33 -14
- package/dist/components/DatePicker/DateNavigationItem/DateNavigationItem.d.ts +6 -0
- package/dist/components/DatePicker/DatePicker.d.ts +39 -13
- package/dist/components/DatePicker/DatePickerHeader/DatePickerHeader.d.ts +18 -0
- package/dist/components/DatePicker/YearPicker/YearPicker.d.ts +12 -0
- package/dist/components/DatePicker/YearPicker/YearsList.d.ts +12 -0
- package/dist/components/DatePicker/types.d.ts +6 -0
- package/dist/components/Dialog/Dialog.d.ts +59 -36
- package/dist/components/Dialog/DialogContent/DialogContent.d.ts +52 -3
- package/dist/components/DialogContentContainer/DialogContentContainer.d.ts +18 -0
- package/dist/components/Divider/Divider.d.ts +2 -2
- package/dist/components/Dropdown/Dropdown.types.d.ts +97 -63
- package/dist/components/EditableHeading/EditableHeading.d.ts +4 -3
- package/dist/components/EditableText/EditableText.d.ts +6 -4
- package/dist/components/EditableTypography/EditableTypography.d.ts +48 -16
- package/dist/components/ExpandCollapse/ExpandCollapse.d.ts +20 -8
- package/dist/components/FieldLabel/FieldLabel.d.ts +18 -0
- package/dist/components/Flex/Flex.d.ts +36 -2
- package/dist/components/FormattedNumber/FormattedNumber.d.ts +8 -8
- package/dist/components/GridKeyboardNavigationContext/GridKeyboardNavigationContextConstants.d.ts +3 -0
- package/dist/components/Heading/Heading.d.ts +15 -0
- package/dist/components/HiddenText/HiddenText.d.ts +3 -0
- package/dist/components/Icon/CustomSvgIcon/CustomSvgIcon.d.ts +30 -0
- package/dist/components/Icon/FontIcon/FontIcon.d.ts +18 -0
- package/dist/components/Icon/Icon.d.ts +32 -8
- package/dist/components/IconButton/IconButton.d.ts +37 -27
- package/dist/components/Label/Label.d.ts +22 -1
- package/dist/components/Label/LabelCelebrationAnimation.d.ts +6 -0
- package/dist/components/LayerProvider/LayerContext.d.ts +3 -0
- package/dist/components/LayerProvider/LayerProvider.d.ts +7 -1
- package/dist/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.d.ts +0 -8
- package/dist/components/Link/Link.d.ts +40 -14
- package/dist/components/List/List.d.ts +14 -5
- package/dist/components/List/VirtualizedListItems/VirtualizedListItems.d.ts +3 -0
- package/dist/components/ListItem/ListItem.d.ts +12 -25
- package/dist/components/ListItemAvatar/ListItemAvatar.d.ts +7 -1
- package/dist/components/ListItemIcon/ListItemIcon.d.ts +5 -2
- package/dist/components/ListTitle/ListTitle.d.ts +6 -0
- package/dist/components/Loader/Loader.d.ts +12 -2
- package/dist/components/Menu/Menu/Menu.d.ts +42 -0
- package/dist/components/Menu/MenuGridItem/MenuGridItem.d.ts +33 -5
- package/dist/components/Menu/MenuItem/AvatarMenuItem.d.ts +6 -0
- package/dist/components/Menu/MenuItem/MenuItem.d.ts +97 -7
- package/dist/components/Menu/MenuItem/components/BaseMenuItem/BaseMenuItem.types.d.ts +7 -0
- package/dist/components/Menu/MenuItem/components/MenuItemIcon/MenuItemIcon.types.d.ts +7 -6
- package/dist/components/Menu/MenuItem/components/MenuItemSubMenu/MenuItemSubMenu.types.d.ts +7 -3
- package/dist/components/Menu/MenuItem/components/MenuItemSubMenuIcon/MenuItemSubMenuIcon.types.d.ts +5 -1
- package/dist/components/Menu/MenuItemButton/MenuItemButton.d.ts +51 -0
- package/dist/components/Menu/MenuTitle/MenuTitle.d.ts +6 -0
- package/dist/components/MenuButton/MenuButton.d.ts +67 -19
- package/dist/components/Modal/ModalContent/ModalContent.types.d.ts +1 -1
- package/dist/components/Modal/ModalMedia/ModalMedia.types.d.ts +1 -1
- package/dist/components/Modal/ModalTopActions/ModalTopActions.types.d.ts +5 -5
- package/dist/components/Modal/context/ModalContext.types.d.ts +5 -5
- package/dist/components/Modal/footers/ModalFooter/ModalFooter.types.d.ts +1 -1
- package/dist/components/Modal/footers/ModalFooterBase/ModalFooterBase.types.d.ts +3 -3
- package/dist/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.types.d.ts +4 -4
- package/dist/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.types.d.ts +1 -1
- package/dist/components/Modal/layouts/ModalFooterShadow.types.d.ts +1 -1
- package/dist/components/Modal/layouts/ModalLayoutScrollableContent.types.d.ts +2 -2
- package/dist/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.types.d.ts +1 -1
- package/dist/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.types.d.ts +1 -1
- package/dist/components/MultiStepIndicator/MultiStepIndicator.d.ts +30 -0
- package/dist/components/MultiStepIndicator/components/StepIndicator/StepIndicator.d.ts +57 -0
- package/dist/components/ProgressBars/LinearProgressBar/Bar/Bar.d.ts +17 -6
- package/dist/components/ProgressBars/LinearProgressBar/LinearProgressBar.d.ts +19 -22
- package/dist/components/ProgressBars/PercentageLabel/PercentageLabel.d.ts +2 -2
- package/dist/components/RadioButton/RadioButton.d.ts +45 -16
- package/dist/components/Search/Search.types.d.ts +24 -24
- package/dist/components/Skeleton/Skeleton.d.ts +16 -1
- package/dist/components/SlideTransition/SlideTransition.types.d.ts +12 -0
- package/dist/components/Slider/SelectionIndicator.d.ts +6 -0
- package/dist/components/Slider/SliderBase/SliderFilledTrack.d.ts +6 -8
- package/dist/components/Slider/SliderBase/SliderRail.d.ts +6 -4
- package/dist/components/Slider/SliderBase/SliderThumb.d.ts +9 -7
- package/dist/components/Slider/SliderBase/SliderTrack.d.ts +1 -2
- package/dist/components/Slider/SliderContext.d.ts +13 -8
- package/dist/components/Slider/SliderInfix.d.ts +1 -2
- package/dist/components/SplitButton/SplitButton.d.ts +25 -2
- package/dist/components/Steps/Steps.d.ts +32 -2
- package/dist/components/Steps/StepsCommand.d.ts +21 -0
- package/dist/components/Steps/StepsDot.d.ts +15 -0
- package/dist/components/Steps/StepsGalleryHeader.d.ts +15 -0
- package/dist/components/Steps/StepsHeader.d.ts +33 -0
- package/dist/components/Steps/StepsNumbersHeader.d.ts +9 -0
- package/dist/components/Switch/Switch.d.ts +39 -0
- package/dist/components/Table/Table/Table.d.ts +42 -0
- package/dist/components/Table/TableBody/TableBody.d.ts +3 -0
- package/dist/components/Table/TableCell/TableCell.d.ts +6 -0
- package/dist/components/Table/TableCellSkeleton/TableCellSkeleton.d.ts +6 -0
- package/dist/components/Table/TableContainer/TableContainer.types.d.ts +6 -0
- package/dist/components/Table/TableHeader/TableHeader.d.ts +3 -0
- package/dist/components/Table/TableHeaderCell/TableHeaderCell.d.ts +21 -0
- package/dist/components/Table/TableRow/TableRow.d.ts +7 -1
- package/dist/components/Table/TableRowMenu/TableRowMenu.types.d.ts +6 -0
- package/dist/components/Table/TableVirtualizedBody/TableVirtualizedBody.d.ts +15 -0
- package/dist/components/Tabs/Tab/Tab.d.ts +27 -3
- package/dist/components/Tabs/TabList/TabList.d.ts +15 -0
- package/dist/components/Tabs/TabPanel/TabPanel.d.ts +6 -0
- package/dist/components/Tabs/TabPanels/TabPanels.d.ts +9 -0
- package/dist/components/Tabs/TabsContext/TabsContext.d.ts +6 -0
- package/dist/components/Text/Text.d.ts +9 -0
- package/dist/components/TextArea/TextArea.types.d.ts +13 -16
- package/dist/components/TextField/TextField.d.ts +127 -9
- package/dist/components/TextWithHighlight/TextWithHighlight.d.ts +33 -6
- package/dist/components/ThemeProvider/ThemeProvider.d.ts +8 -5
- package/dist/components/Tipseen/Tipseen.d.ts +64 -6
- package/dist/components/Tipseen/TipseenBasicContent.d.ts +9 -0
- package/dist/components/Tipseen/TipseenContent.d.ts +25 -1
- package/dist/components/Tipseen/TipseenImage.d.ts +12 -0
- package/dist/components/Tipseen/TipseenMedia/TipseenMedia.d.ts +3 -0
- package/dist/components/Tipseen/TipseenTitle.d.ts +3 -0
- package/dist/components/Tipseen/TipseenWizard.d.ts +7 -1
- package/dist/components/Toast/Toast.d.ts +37 -8
- package/dist/components/Toggle/MockToggle.d.ts +21 -0
- package/dist/components/Toggle/Toggle.d.ts +37 -1
- package/dist/components/Toggle/ToggleText.d.ts +6 -0
- package/dist/components/Tooltip/Tooltip.d.ts +64 -27
- package/dist/components/TransitionView/TransitionView.types.d.ts +9 -0
- package/dist/components/Typography/Typography.d.ts +12 -6
- package/dist/components/VirtualizedGrid/VirtualizedGrid.d.ts +19 -19
- package/dist/components/VirtualizedList/VirtualizedList.d.ts +33 -27
- package/dist/hooks/useKeyEvent/index.d.ts +30 -0
- package/dist/hooks/useSwitch/index.d.ts +12 -0
- package/dist/hooks/useWizard/useWizard.types.d.ts +33 -0
- package/dist/mocked_classnames/components/Accordion/Accordion/Accordion.d.ts +3 -15
- package/dist/mocked_classnames/components/Accordion/AccordionItem/AccordionItem.d.ts +9 -17
- package/dist/mocked_classnames/components/AlertBanner/AlertBanner.d.ts +16 -3
- package/dist/mocked_classnames/components/AlertBanner/AlertBannerButton/AlertBannerButton.d.ts +3 -0
- package/dist/mocked_classnames/components/AlertBanner/AlertBannerLink/AlertBannerLink.d.ts +3 -0
- package/dist/mocked_classnames/components/AlertBanner/AlertBannerText/AlertBannerText.d.ts +6 -0
- package/dist/mocked_classnames/components/AttentionBox/AttentionBox.d.ts +36 -4
- package/dist/mocked_classnames/components/Avatar/Avatar.d.ts +70 -3
- package/dist/mocked_classnames/components/Avatar/AvatarBadge.d.ts +10 -2
- package/dist/mocked_classnames/components/Avatar/AvatarContent.d.ts +24 -1
- package/dist/mocked_classnames/components/AvatarGroup/AvatarGroup.d.ts +17 -5
- package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounter.d.ts +20 -2
- package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContainer.d.ts +20 -3
- package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContent.d.ts +10 -2
- package/dist/mocked_classnames/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.d.ts +13 -1
- package/dist/mocked_classnames/components/Badge/Badge.d.ts +15 -0
- package/dist/mocked_classnames/components/Badge/Indicator/Indicator.d.ts +3 -0
- package/dist/mocked_classnames/components/BaseInput/BaseInput.types.d.ts +8 -15
- package/dist/mocked_classnames/components/BaseListItem/BaseListItem.types.d.ts +2 -2
- package/dist/mocked_classnames/components/Box/Box.d.ts +75 -0
- package/dist/mocked_classnames/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.d.ts +24 -0
- package/dist/mocked_classnames/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.d.ts +24 -7
- package/dist/mocked_classnames/components/BreadcrumbsBar/BreadcrumbsBar.d.ts +6 -1
- package/dist/mocked_classnames/components/ButtonGroup/ButtonGroup.d.ts +46 -1
- package/dist/mocked_classnames/components/ButtonGroup/ButtonWrapper.d.ts +16 -1
- package/dist/mocked_classnames/components/Checkbox/Checkbox.d.ts +42 -18
- package/dist/mocked_classnames/components/Chips/Chips.d.ts +54 -20
- package/dist/mocked_classnames/components/Clickable/Clickable.d.ts +41 -5
- package/dist/mocked_classnames/components/Clickable/ClickableWrapper.d.ts +9 -0
- package/dist/mocked_classnames/components/ColorPicker/ColorPicker.d.ts +43 -1
- package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.d.ts +9 -0
- package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.d.ts +39 -0
- package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.d.ts +48 -0
- package/dist/mocked_classnames/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.d.ts +33 -1
- package/dist/mocked_classnames/components/Combobox/Combobox.d.ts +78 -25
- package/dist/mocked_classnames/components/Combobox/components/ComboboxCategory/ComboboxCategory.d.ts +6 -0
- package/dist/mocked_classnames/components/Combobox/components/ComboboxConstants.d.ts +156 -0
- package/dist/mocked_classnames/components/Combobox/components/ComboboxItems/ComboboxItems.d.ts +45 -0
- package/dist/mocked_classnames/components/Combobox/components/ComboboxOption/ComboboxOption.d.ts +30 -0
- package/dist/mocked_classnames/components/Counter/Counter.d.ts +33 -14
- package/dist/mocked_classnames/components/DatePicker/DateNavigationItem/DateNavigationItem.d.ts +6 -0
- package/dist/mocked_classnames/components/DatePicker/DatePicker.d.ts +39 -13
- package/dist/mocked_classnames/components/DatePicker/DatePickerHeader/DatePickerHeader.d.ts +18 -0
- package/dist/mocked_classnames/components/DatePicker/YearPicker/YearPicker.d.ts +12 -0
- package/dist/mocked_classnames/components/DatePicker/YearPicker/YearsList.d.ts +12 -0
- package/dist/mocked_classnames/components/DatePicker/types.d.ts +6 -0
- package/dist/mocked_classnames/components/Dialog/Dialog.d.ts +59 -36
- package/dist/mocked_classnames/components/Dialog/DialogContent/DialogContent.d.ts +52 -3
- package/dist/mocked_classnames/components/DialogContentContainer/DialogContentContainer.d.ts +18 -0
- package/dist/mocked_classnames/components/Divider/Divider.d.ts +2 -2
- package/dist/mocked_classnames/components/Dropdown/Dropdown.types.d.ts +97 -63
- package/dist/mocked_classnames/components/EditableHeading/EditableHeading.d.ts +4 -3
- package/dist/mocked_classnames/components/EditableText/EditableText.d.ts +6 -4
- package/dist/mocked_classnames/components/EditableTypography/EditableTypography.d.ts +48 -16
- package/dist/mocked_classnames/components/ExpandCollapse/ExpandCollapse.d.ts +20 -8
- package/dist/mocked_classnames/components/FieldLabel/FieldLabel.d.ts +18 -0
- package/dist/mocked_classnames/components/Flex/Flex.d.ts +36 -2
- package/dist/mocked_classnames/components/FormattedNumber/FormattedNumber.d.ts +8 -8
- package/dist/mocked_classnames/components/GridKeyboardNavigationContext/GridKeyboardNavigationContextConstants.d.ts +3 -0
- package/dist/mocked_classnames/components/Heading/Heading.d.ts +15 -0
- package/dist/mocked_classnames/components/HiddenText/HiddenText.d.ts +3 -0
- package/dist/mocked_classnames/components/Icon/CustomSvgIcon/CustomSvgIcon.d.ts +30 -0
- package/dist/mocked_classnames/components/Icon/FontIcon/FontIcon.d.ts +18 -0
- package/dist/mocked_classnames/components/Icon/Icon.d.ts +32 -8
- package/dist/mocked_classnames/components/IconButton/IconButton.d.ts +37 -27
- package/dist/mocked_classnames/components/Label/Label.d.ts +22 -1
- package/dist/mocked_classnames/components/Label/LabelCelebrationAnimation.d.ts +6 -0
- package/dist/mocked_classnames/components/LayerProvider/LayerContext.d.ts +3 -0
- package/dist/mocked_classnames/components/LayerProvider/LayerProvider.d.ts +7 -1
- package/dist/mocked_classnames/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.d.ts +0 -8
- package/dist/mocked_classnames/components/Link/Link.d.ts +40 -14
- package/dist/mocked_classnames/components/List/List.d.ts +14 -5
- package/dist/mocked_classnames/components/List/VirtualizedListItems/VirtualizedListItems.d.ts +3 -0
- package/dist/mocked_classnames/components/ListItem/ListItem.d.ts +12 -25
- package/dist/mocked_classnames/components/ListItemAvatar/ListItemAvatar.d.ts +7 -1
- package/dist/mocked_classnames/components/ListItemIcon/ListItemIcon.d.ts +5 -2
- package/dist/mocked_classnames/components/ListTitle/ListTitle.d.ts +6 -0
- package/dist/mocked_classnames/components/Loader/Loader.d.ts +12 -2
- package/dist/mocked_classnames/components/Menu/Menu/Menu.d.ts +42 -0
- package/dist/mocked_classnames/components/Menu/MenuGridItem/MenuGridItem.d.ts +33 -5
- package/dist/mocked_classnames/components/Menu/MenuItem/AvatarMenuItem.d.ts +6 -0
- package/dist/mocked_classnames/components/Menu/MenuItem/MenuItem.d.ts +97 -7
- package/dist/mocked_classnames/components/Menu/MenuItem/components/BaseMenuItem/BaseMenuItem.types.d.ts +7 -0
- package/dist/mocked_classnames/components/Menu/MenuItem/components/MenuItemIcon/MenuItemIcon.types.d.ts +7 -6
- package/dist/mocked_classnames/components/Menu/MenuItem/components/MenuItemSubMenu/MenuItemSubMenu.types.d.ts +7 -3
- package/dist/mocked_classnames/components/Menu/MenuItem/components/MenuItemSubMenuIcon/MenuItemSubMenuIcon.types.d.ts +5 -1
- package/dist/mocked_classnames/components/Menu/MenuItemButton/MenuItemButton.d.ts +51 -0
- package/dist/mocked_classnames/components/Menu/MenuTitle/MenuTitle.d.ts +6 -0
- package/dist/mocked_classnames/components/MenuButton/MenuButton.d.ts +67 -19
- package/dist/mocked_classnames/components/Modal/ModalContent/ModalContent.types.d.ts +1 -1
- package/dist/mocked_classnames/components/Modal/ModalMedia/ModalMedia.types.d.ts +1 -1
- package/dist/mocked_classnames/components/Modal/ModalTopActions/ModalTopActions.types.d.ts +5 -5
- package/dist/mocked_classnames/components/Modal/context/ModalContext.types.d.ts +5 -5
- package/dist/mocked_classnames/components/Modal/footers/ModalFooter/ModalFooter.types.d.ts +1 -1
- package/dist/mocked_classnames/components/Modal/footers/ModalFooterBase/ModalFooterBase.types.d.ts +3 -3
- package/dist/mocked_classnames/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.types.d.ts +4 -4
- package/dist/mocked_classnames/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.types.d.ts +1 -1
- package/dist/mocked_classnames/components/Modal/layouts/ModalFooterShadow.types.d.ts +1 -1
- package/dist/mocked_classnames/components/Modal/layouts/ModalLayoutScrollableContent.types.d.ts +2 -2
- package/dist/mocked_classnames/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.types.d.ts +1 -1
- package/dist/mocked_classnames/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.types.d.ts +1 -1
- package/dist/mocked_classnames/components/MultiStepIndicator/MultiStepIndicator.d.ts +30 -0
- package/dist/mocked_classnames/components/MultiStepIndicator/components/StepIndicator/StepIndicator.d.ts +57 -0
- package/dist/mocked_classnames/components/ProgressBars/LinearProgressBar/Bar/Bar.d.ts +17 -6
- package/dist/mocked_classnames/components/ProgressBars/LinearProgressBar/LinearProgressBar.d.ts +19 -22
- package/dist/mocked_classnames/components/ProgressBars/PercentageLabel/PercentageLabel.d.ts +2 -2
- package/dist/mocked_classnames/components/RadioButton/RadioButton.d.ts +45 -16
- package/dist/mocked_classnames/components/Search/Search.types.d.ts +24 -24
- package/dist/mocked_classnames/components/Skeleton/Skeleton.d.ts +16 -1
- package/dist/mocked_classnames/components/SlideTransition/SlideTransition.types.d.ts +12 -0
- package/dist/mocked_classnames/components/Slider/SelectionIndicator.d.ts +6 -0
- package/dist/mocked_classnames/components/Slider/SliderBase/SliderFilledTrack.d.ts +6 -8
- package/dist/mocked_classnames/components/Slider/SliderBase/SliderRail.d.ts +6 -4
- package/dist/mocked_classnames/components/Slider/SliderBase/SliderThumb.d.ts +9 -7
- package/dist/mocked_classnames/components/Slider/SliderBase/SliderTrack.d.ts +1 -2
- package/dist/mocked_classnames/components/Slider/SliderContext.d.ts +13 -8
- package/dist/mocked_classnames/components/Slider/SliderInfix.d.ts +1 -2
- package/dist/mocked_classnames/components/SplitButton/SplitButton.d.ts +25 -2
- package/dist/mocked_classnames/components/Steps/Steps.d.ts +32 -2
- package/dist/mocked_classnames/components/Steps/StepsCommand.d.ts +21 -0
- package/dist/mocked_classnames/components/Steps/StepsDot.d.ts +15 -0
- package/dist/mocked_classnames/components/Steps/StepsGalleryHeader.d.ts +15 -0
- package/dist/mocked_classnames/components/Steps/StepsHeader.d.ts +33 -0
- package/dist/mocked_classnames/components/Steps/StepsNumbersHeader.d.ts +9 -0
- package/dist/mocked_classnames/components/Switch/Switch.d.ts +39 -0
- package/dist/mocked_classnames/components/Table/Table/Table.d.ts +42 -0
- package/dist/mocked_classnames/components/Table/TableBody/TableBody.d.ts +3 -0
- package/dist/mocked_classnames/components/Table/TableCell/TableCell.d.ts +6 -0
- package/dist/mocked_classnames/components/Table/TableCellSkeleton/TableCellSkeleton.d.ts +6 -0
- package/dist/mocked_classnames/components/Table/TableContainer/TableContainer.types.d.ts +6 -0
- package/dist/mocked_classnames/components/Table/TableHeader/TableHeader.d.ts +3 -0
- package/dist/mocked_classnames/components/Table/TableHeaderCell/TableHeaderCell.d.ts +21 -0
- package/dist/mocked_classnames/components/Table/TableRow/TableRow.d.ts +7 -1
- package/dist/mocked_classnames/components/Table/TableRowMenu/TableRowMenu.types.d.ts +6 -0
- package/dist/mocked_classnames/components/Table/TableVirtualizedBody/TableVirtualizedBody.d.ts +15 -0
- package/dist/mocked_classnames/components/Tabs/Tab/Tab.d.ts +27 -3
- package/dist/mocked_classnames/components/Tabs/TabList/TabList.d.ts +15 -0
- package/dist/mocked_classnames/components/Tabs/TabPanel/TabPanel.d.ts +6 -0
- package/dist/mocked_classnames/components/Tabs/TabPanels/TabPanels.d.ts +9 -0
- package/dist/mocked_classnames/components/Tabs/TabsContext/TabsContext.d.ts +6 -0
- package/dist/mocked_classnames/components/Text/Text.d.ts +9 -0
- package/dist/mocked_classnames/components/TextArea/TextArea.types.d.ts +13 -16
- package/dist/mocked_classnames/components/TextField/TextField.d.ts +127 -9
- package/dist/mocked_classnames/components/TextWithHighlight/TextWithHighlight.d.ts +33 -6
- package/dist/mocked_classnames/components/ThemeProvider/ThemeProvider.d.ts +8 -5
- package/dist/mocked_classnames/components/Tipseen/Tipseen.d.ts +64 -6
- package/dist/mocked_classnames/components/Tipseen/TipseenBasicContent.d.ts +9 -0
- package/dist/mocked_classnames/components/Tipseen/TipseenContent.d.ts +25 -1
- package/dist/mocked_classnames/components/Tipseen/TipseenImage.d.ts +12 -0
- package/dist/mocked_classnames/components/Tipseen/TipseenMedia/TipseenMedia.d.ts +3 -0
- package/dist/mocked_classnames/components/Tipseen/TipseenTitle.d.ts +3 -0
- package/dist/mocked_classnames/components/Tipseen/TipseenWizard.d.ts +7 -1
- package/dist/mocked_classnames/components/Toast/Toast.d.ts +37 -8
- package/dist/mocked_classnames/components/Toggle/MockToggle.d.ts +21 -0
- package/dist/mocked_classnames/components/Toggle/Toggle.d.ts +37 -1
- package/dist/mocked_classnames/components/Toggle/ToggleText.d.ts +6 -0
- package/dist/mocked_classnames/components/Tooltip/Tooltip.d.ts +64 -27
- package/dist/mocked_classnames/components/TransitionView/TransitionView.types.d.ts +9 -0
- package/dist/mocked_classnames/components/Typography/Typography.d.ts +12 -6
- package/dist/mocked_classnames/components/VirtualizedGrid/VirtualizedGrid.d.ts +19 -19
- package/dist/mocked_classnames/components/VirtualizedList/VirtualizedList.d.ts +33 -27
- package/dist/mocked_classnames/hooks/useKeyEvent/index.d.ts +30 -0
- package/dist/mocked_classnames/hooks/useSwitch/index.d.ts +12 -0
- package/dist/mocked_classnames/hooks/useWizard/useWizard.types.d.ts +33 -0
- package/dist/mocked_classnames/src/components/Accordion/Accordion/Accordion.js.map +1 -1
- package/dist/mocked_classnames/src/components/Accordion/AccordionItem/AccordionItem.js.map +1 -1
- package/dist/mocked_classnames/src/components/AlertBanner/AlertBanner.js.map +1 -1
- package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js.map +1 -1
- package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerLink/AlertBannerLink.js.map +1 -1
- package/dist/mocked_classnames/src/components/AlertBanner/AlertBannerText/AlertBannerText.js.map +1 -1
- package/dist/mocked_classnames/src/components/AttentionBox/AttentionBox.js.map +1 -1
- package/dist/mocked_classnames/src/components/Avatar/Avatar.js.map +1 -1
- package/dist/mocked_classnames/src/components/Avatar/AvatarBadge.js.map +1 -1
- package/dist/mocked_classnames/src/components/Avatar/AvatarContent.js.map +1 -1
- package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounter.js.map +1 -1
- package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js.map +1 -1
- package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.js.map +1 -1
- package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.js.map +1 -1
- package/dist/mocked_classnames/src/components/Badge/Badge.js.map +1 -1
- package/dist/mocked_classnames/src/components/Badge/Indicator/Indicator.js.map +1 -1
- package/dist/mocked_classnames/src/components/Box/Box.js.map +1 -1
- package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.js.map +1 -1
- package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.js.map +1 -1
- package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbsBar.js.map +1 -1
- package/dist/mocked_classnames/src/components/Button/Button.js +1 -1
- package/dist/mocked_classnames/src/components/Button/Button.js.map +1 -1
- package/dist/mocked_classnames/src/components/ButtonGroup/ButtonGroup.js.map +1 -1
- package/dist/mocked_classnames/src/components/ButtonGroup/ButtonWrapper.js.map +1 -1
- package/dist/mocked_classnames/src/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/mocked_classnames/src/components/Chips/Chips.js.map +1 -1
- package/dist/mocked_classnames/src/components/Clickable/Clickable.js.map +1 -1
- package/dist/mocked_classnames/src/components/Clickable/ClickableWrapper.js.map +1 -1
- package/dist/mocked_classnames/src/components/ColorPicker/ColorPicker.js.map +1 -1
- package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.js.map +1 -1
- package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.js.map +1 -1
- package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.js.map +1 -1
- package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.js.map +1 -1
- package/dist/mocked_classnames/src/components/Combobox/Combobox.js.map +1 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js.map +1 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxConstants.js.map +1 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxItems/ComboboxItems.js.map +1 -1
- package/dist/mocked_classnames/src/components/Combobox/components/ComboboxOption/ComboboxOption.js.map +1 -1
- package/dist/mocked_classnames/src/components/Counter/Counter.js.map +1 -1
- package/dist/mocked_classnames/src/components/DatePicker/DateNavigationItem/DateNavigationItem.js.map +1 -1
- package/dist/mocked_classnames/src/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/mocked_classnames/src/components/DatePicker/DatePickerHeader/DatePickerHeader.js.map +1 -1
- package/dist/mocked_classnames/src/components/DatePicker/YearPicker/YearPicker.js.map +1 -1
- package/dist/mocked_classnames/src/components/DatePicker/YearPicker/YearsList.js.map +1 -1
- package/dist/mocked_classnames/src/components/DatePicker/types.js.map +1 -1
- package/dist/mocked_classnames/src/components/Dialog/Dialog.js.map +1 -1
- package/dist/mocked_classnames/src/components/Dialog/DialogContent/DialogContent.js.map +1 -1
- package/dist/mocked_classnames/src/components/DialogContentContainer/DialogContentContainer.js.map +1 -1
- package/dist/mocked_classnames/src/components/Divider/Divider.js.map +1 -1
- package/dist/mocked_classnames/src/components/Dropdown/Dropdown.js +1 -1
- package/dist/mocked_classnames/src/components/Dropdown/Dropdown.js.map +1 -1
- package/dist/mocked_classnames/src/components/EditableHeading/EditableHeading.js.map +1 -1
- package/dist/mocked_classnames/src/components/EditableText/EditableText.js.map +1 -1
- package/dist/mocked_classnames/src/components/EditableTypography/EditableTypography.js.map +1 -1
- package/dist/mocked_classnames/src/components/ExpandCollapse/ExpandCollapse.js.map +1 -1
- package/dist/mocked_classnames/src/components/FieldLabel/FieldLabel.js.map +1 -1
- package/dist/mocked_classnames/src/components/Flex/Flex.js.map +1 -1
- package/dist/mocked_classnames/src/components/FormattedNumber/FormattedNumber.js.map +1 -1
- package/dist/mocked_classnames/src/components/Heading/Heading.js.map +1 -1
- package/dist/mocked_classnames/src/components/HiddenText/HiddenText.js.map +1 -1
- package/dist/mocked_classnames/src/components/Icon/CustomSvgIcon/CustomSvgIcon.js.map +1 -1
- package/dist/mocked_classnames/src/components/Icon/FontIcon/FontIcon.js.map +1 -1
- package/dist/mocked_classnames/src/components/Icon/Icon.js.map +1 -1
- package/dist/mocked_classnames/src/components/IconButton/IconButton.js.map +1 -1
- package/dist/mocked_classnames/src/components/Label/Label.js.map +1 -1
- package/dist/mocked_classnames/src/components/Label/LabelCelebrationAnimation.js.map +1 -1
- package/dist/mocked_classnames/src/components/LayerProvider/LayerContext.js.map +1 -1
- package/dist/mocked_classnames/src/components/LayerProvider/LayerProvider.js.map +1 -1
- package/dist/mocked_classnames/src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.js.map +1 -1
- package/dist/mocked_classnames/src/components/Link/Link.js.map +1 -1
- package/dist/mocked_classnames/src/components/List/List.js.map +1 -1
- package/dist/mocked_classnames/src/components/List/VirtualizedListItems/VirtualizedListItems.js.map +1 -1
- package/dist/mocked_classnames/src/components/ListItem/ListItem.js.map +1 -1
- package/dist/mocked_classnames/src/components/ListItemAvatar/ListItemAvatar.js.map +1 -1
- package/dist/mocked_classnames/src/components/ListItemIcon/ListItemIcon.js.map +1 -1
- package/dist/mocked_classnames/src/components/ListTitle/ListTitle.js.map +1 -1
- package/dist/mocked_classnames/src/components/Loader/Loader.js.map +1 -1
- package/dist/mocked_classnames/src/components/Menu/Menu/Menu.js.map +1 -1
- package/dist/mocked_classnames/src/components/Menu/MenuGridItem/MenuGridItem.js.map +1 -1
- package/dist/mocked_classnames/src/components/Menu/MenuItem/AvatarMenuItem.js.map +1 -1
- package/dist/mocked_classnames/src/components/Menu/MenuItem/MenuItem.js.map +1 -1
- package/dist/mocked_classnames/src/components/Menu/MenuItemButton/MenuItemButton.js.map +1 -1
- package/dist/mocked_classnames/src/components/Menu/MenuTitle/MenuTitle.js.map +1 -1
- package/dist/mocked_classnames/src/components/MenuButton/MenuButton.js.map +1 -1
- package/dist/mocked_classnames/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js +1 -1
- package/dist/mocked_classnames/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js.map +1 -1
- package/dist/mocked_classnames/src/components/MultiStepIndicator/MultiStepIndicator.js.map +1 -1
- package/dist/mocked_classnames/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.js.map +1 -1
- package/dist/mocked_classnames/src/components/ProgressBars/LinearProgressBar/Bar/Bar.js.map +1 -1
- package/dist/mocked_classnames/src/components/ProgressBars/LinearProgressBar/LinearProgressBar.js.map +1 -1
- package/dist/mocked_classnames/src/components/ProgressBars/PercentageLabel/PercentageLabel.js.map +1 -1
- package/dist/mocked_classnames/src/components/RadioButton/RadioButton.js.map +1 -1
- package/dist/mocked_classnames/src/components/Skeleton/Skeleton.js.map +1 -1
- package/dist/mocked_classnames/src/components/Slider/SelectionIndicator.js.map +1 -1
- package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderFilledTrack.js.map +1 -1
- package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderRail.js.map +1 -1
- package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderThumb.js.map +1 -1
- package/dist/mocked_classnames/src/components/Slider/SliderBase/SliderTrack.js.map +1 -1
- package/dist/mocked_classnames/src/components/Slider/SliderContext.js.map +1 -1
- package/dist/mocked_classnames/src/components/Slider/SliderInfix.js.map +1 -1
- package/dist/mocked_classnames/src/components/SplitButton/SplitButton.js.map +1 -1
- package/dist/mocked_classnames/src/components/Steps/Steps.js.map +1 -1
- package/dist/mocked_classnames/src/components/Steps/StepsCommand.js.map +1 -1
- package/dist/mocked_classnames/src/components/Steps/StepsDot.js.map +1 -1
- package/dist/mocked_classnames/src/components/Steps/StepsGalleryHeader.js.map +1 -1
- package/dist/mocked_classnames/src/components/Steps/StepsHeader.js.map +1 -1
- package/dist/mocked_classnames/src/components/Steps/StepsNumbersHeader.js.map +1 -1
- package/dist/mocked_classnames/src/components/Switch/Switch.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/Table/Table.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/TableHeader/TableHeader.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/TableRow/TableRow.js.map +1 -1
- package/dist/mocked_classnames/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tabs/Tab/Tab.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tabs/TabList/TabList.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tabs/TabPanel/TabPanel.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tabs/TabPanels/TabPanels.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tabs/TabsContext/TabsContext.js.map +1 -1
- package/dist/mocked_classnames/src/components/Text/Text.js.map +1 -1
- package/dist/mocked_classnames/src/components/TextField/TextField.js.map +1 -1
- package/dist/mocked_classnames/src/components/TextWithHighlight/TextWithHighlight.js.map +1 -1
- package/dist/mocked_classnames/src/components/ThemeProvider/ThemeProvider.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tipseen/Tipseen.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tipseen/TipseenBasicContent.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tipseen/TipseenContent.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tipseen/TipseenImage.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tipseen/TipseenMedia/TipseenMedia.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tipseen/TipseenTitle.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tipseen/TipseenWizard.js.map +1 -1
- package/dist/mocked_classnames/src/components/Toast/Toast.js.map +1 -1
- package/dist/mocked_classnames/src/components/Toggle/MockToggle.js.map +1 -1
- package/dist/mocked_classnames/src/components/Toggle/Toggle.js.map +1 -1
- package/dist/mocked_classnames/src/components/Toggle/ToggleText.js.map +1 -1
- package/dist/mocked_classnames/src/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/mocked_classnames/src/components/Typography/Typography.js.map +1 -1
- package/dist/mocked_classnames/src/components/VirtualizedGrid/VirtualizedGrid.js.map +1 -1
- package/dist/mocked_classnames/src/components/VirtualizedList/VirtualizedList.js.map +1 -1
- package/dist/mocked_classnames/src/hooks/useKeyEvent/index.js.map +1 -1
- package/dist/mocked_classnames/src/hooks/useSwitch/index.js.map +1 -1
- package/dist/mocked_classnames/types/VibeComponentProps.d.ts +9 -0
- package/dist/src/components/Accordion/Accordion/Accordion.js.map +1 -1
- package/dist/src/components/Accordion/AccordionItem/AccordionItem.js.map +1 -1
- package/dist/src/components/AlertBanner/AlertBanner.js.map +1 -1
- package/dist/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.js.map +1 -1
- package/dist/src/components/AlertBanner/AlertBannerLink/AlertBannerLink.js.map +1 -1
- package/dist/src/components/AlertBanner/AlertBannerText/AlertBannerText.js.map +1 -1
- package/dist/src/components/AttentionBox/AttentionBox.js.map +1 -1
- package/dist/src/components/Avatar/Avatar.js.map +1 -1
- package/dist/src/components/Avatar/AvatarBadge.js.map +1 -1
- package/dist/src/components/Avatar/AvatarContent.js.map +1 -1
- package/dist/src/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/src/components/AvatarGroup/AvatarGroupCounter.js.map +1 -1
- package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js.map +1 -1
- package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContent.js.map +1 -1
- package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContentVirtualizedList.js.map +1 -1
- package/dist/src/components/Badge/Badge.js.map +1 -1
- package/dist/src/components/Badge/Indicator/Indicator.js.map +1 -1
- package/dist/src/components/Box/Box.js.map +1 -1
- package/dist/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.js.map +1 -1
- package/dist/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.js.map +1 -1
- package/dist/src/components/BreadcrumbsBar/BreadcrumbsBar.js.map +1 -1
- package/dist/src/components/Button/Button.js +1 -1
- package/dist/src/components/Button/Button.js.map +1 -1
- package/dist/src/components/ButtonGroup/ButtonGroup.js.map +1 -1
- package/dist/src/components/ButtonGroup/ButtonWrapper.js.map +1 -1
- package/dist/src/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/src/components/Chips/Chips.js.map +1 -1
- package/dist/src/components/Clickable/Clickable.js.map +1 -1
- package/dist/src/components/Clickable/ClickableWrapper.js.map +1 -1
- package/dist/src/components/ColorPicker/ColorPicker.js.map +1 -1
- package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.js.map +1 -1
- package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.js.map +1 -1
- package/dist/src/components/ColorPicker/components/ColorPickerContent/ColorPickerContent.js.map +1 -1
- package/dist/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.js.map +1 -1
- package/dist/src/components/Combobox/Combobox.js.map +1 -1
- package/dist/src/components/Combobox/components/ComboboxCategory/ComboboxCategory.js.map +1 -1
- package/dist/src/components/Combobox/components/ComboboxConstants.js.map +1 -1
- package/dist/src/components/Combobox/components/ComboboxItems/ComboboxItems.js.map +1 -1
- package/dist/src/components/Combobox/components/ComboboxOption/ComboboxOption.js.map +1 -1
- package/dist/src/components/Counter/Counter.js.map +1 -1
- package/dist/src/components/DatePicker/DateNavigationItem/DateNavigationItem.js.map +1 -1
- package/dist/src/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/src/components/DatePicker/DatePickerHeader/DatePickerHeader.js.map +1 -1
- package/dist/src/components/DatePicker/YearPicker/YearPicker.js.map +1 -1
- package/dist/src/components/DatePicker/YearPicker/YearsList.js.map +1 -1
- package/dist/src/components/DatePicker/types.js.map +1 -1
- package/dist/src/components/Dialog/Dialog.js.map +1 -1
- package/dist/src/components/Dialog/DialogContent/DialogContent.js.map +1 -1
- package/dist/src/components/DialogContentContainer/DialogContentContainer.js.map +1 -1
- package/dist/src/components/Divider/Divider.js.map +1 -1
- package/dist/src/components/Dropdown/Dropdown.js +1 -1
- package/dist/src/components/Dropdown/Dropdown.js.map +1 -1
- package/dist/src/components/EditableHeading/EditableHeading.js.map +1 -1
- package/dist/src/components/EditableText/EditableText.js.map +1 -1
- package/dist/src/components/EditableTypography/EditableTypography.js.map +1 -1
- package/dist/src/components/ExpandCollapse/ExpandCollapse.js.map +1 -1
- package/dist/src/components/FieldLabel/FieldLabel.js.map +1 -1
- package/dist/src/components/Flex/Flex.js.map +1 -1
- package/dist/src/components/FormattedNumber/FormattedNumber.js.map +1 -1
- package/dist/src/components/Heading/Heading.js.map +1 -1
- package/dist/src/components/HiddenText/HiddenText.js.map +1 -1
- package/dist/src/components/Icon/CustomSvgIcon/CustomSvgIcon.js.map +1 -1
- package/dist/src/components/Icon/FontIcon/FontIcon.js.map +1 -1
- package/dist/src/components/Icon/Icon.js.map +1 -1
- package/dist/src/components/IconButton/IconButton.js.map +1 -1
- package/dist/src/components/Label/Label.js.map +1 -1
- package/dist/src/components/Label/LabelCelebrationAnimation.js.map +1 -1
- package/dist/src/components/LayerProvider/LayerContext.js.map +1 -1
- package/dist/src/components/LayerProvider/LayerProvider.js.map +1 -1
- package/dist/src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.js.map +1 -1
- package/dist/src/components/Link/Link.js.map +1 -1
- package/dist/src/components/List/List.js.map +1 -1
- package/dist/src/components/List/VirtualizedListItems/VirtualizedListItems.js.map +1 -1
- package/dist/src/components/ListItem/ListItem.js.map +1 -1
- package/dist/src/components/ListItemAvatar/ListItemAvatar.js.map +1 -1
- package/dist/src/components/ListItemIcon/ListItemIcon.js.map +1 -1
- package/dist/src/components/ListTitle/ListTitle.js.map +1 -1
- package/dist/src/components/Loader/Loader.js.map +1 -1
- package/dist/src/components/Menu/Menu/Menu.js.map +1 -1
- package/dist/src/components/Menu/MenuGridItem/MenuGridItem.js.map +1 -1
- package/dist/src/components/Menu/MenuItem/AvatarMenuItem.js.map +1 -1
- package/dist/src/components/Menu/MenuItem/MenuItem.js.map +1 -1
- package/dist/src/components/Menu/MenuItemButton/MenuItemButton.js.map +1 -1
- package/dist/src/components/Menu/MenuTitle/MenuTitle.js.map +1 -1
- package/dist/src/components/MenuButton/MenuButton.js.map +1 -1
- package/dist/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js +1 -1
- package/dist/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js.map +1 -1
- package/dist/src/components/MultiStepIndicator/MultiStepIndicator.js.map +1 -1
- package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.js.map +1 -1
- package/dist/src/components/ProgressBars/LinearProgressBar/Bar/Bar.js.map +1 -1
- package/dist/src/components/ProgressBars/LinearProgressBar/LinearProgressBar.js.map +1 -1
- package/dist/src/components/ProgressBars/PercentageLabel/PercentageLabel.js.map +1 -1
- package/dist/src/components/RadioButton/RadioButton.js.map +1 -1
- package/dist/src/components/Skeleton/Skeleton.js.map +1 -1
- package/dist/src/components/Slider/SelectionIndicator.js.map +1 -1
- package/dist/src/components/Slider/SliderBase/SliderFilledTrack.js.map +1 -1
- package/dist/src/components/Slider/SliderBase/SliderRail.js.map +1 -1
- package/dist/src/components/Slider/SliderBase/SliderThumb.js.map +1 -1
- package/dist/src/components/Slider/SliderBase/SliderTrack.js.map +1 -1
- package/dist/src/components/Slider/SliderContext.js.map +1 -1
- package/dist/src/components/Slider/SliderInfix.js.map +1 -1
- package/dist/src/components/SplitButton/SplitButton.js.map +1 -1
- package/dist/src/components/Steps/Steps.js.map +1 -1
- package/dist/src/components/Steps/StepsCommand.js.map +1 -1
- package/dist/src/components/Steps/StepsDot.js.map +1 -1
- package/dist/src/components/Steps/StepsGalleryHeader.js.map +1 -1
- package/dist/src/components/Steps/StepsHeader.js.map +1 -1
- package/dist/src/components/Steps/StepsNumbersHeader.js.map +1 -1
- package/dist/src/components/Switch/Switch.js.map +1 -1
- package/dist/src/components/Table/Table/Table.js.map +1 -1
- package/dist/src/components/Table/TableBody/TableBody.js.map +1 -1
- package/dist/src/components/Table/TableCell/TableCell.js.map +1 -1
- package/dist/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map +1 -1
- package/dist/src/components/Table/TableHeader/TableHeader.js.map +1 -1
- package/dist/src/components/Table/TableHeaderCell/TableHeaderCell.js.map +1 -1
- package/dist/src/components/Table/TableRow/TableRow.js.map +1 -1
- package/dist/src/components/Table/TableVirtualizedBody/TableVirtualizedBody.js.map +1 -1
- package/dist/src/components/Tabs/Tab/Tab.js.map +1 -1
- package/dist/src/components/Tabs/TabList/TabList.js.map +1 -1
- package/dist/src/components/Tabs/TabPanel/TabPanel.js.map +1 -1
- package/dist/src/components/Tabs/TabPanels/TabPanels.js.map +1 -1
- package/dist/src/components/Tabs/TabsContext/TabsContext.js.map +1 -1
- package/dist/src/components/Text/Text.js.map +1 -1
- package/dist/src/components/TextField/TextField.js.map +1 -1
- package/dist/src/components/TextWithHighlight/TextWithHighlight.js.map +1 -1
- package/dist/src/components/ThemeProvider/ThemeProvider.js.map +1 -1
- package/dist/src/components/Tipseen/Tipseen.js.map +1 -1
- package/dist/src/components/Tipseen/TipseenBasicContent.js.map +1 -1
- package/dist/src/components/Tipseen/TipseenContent.js.map +1 -1
- package/dist/src/components/Tipseen/TipseenImage.js.map +1 -1
- package/dist/src/components/Tipseen/TipseenMedia/TipseenMedia.js.map +1 -1
- package/dist/src/components/Tipseen/TipseenTitle.js.map +1 -1
- package/dist/src/components/Tipseen/TipseenWizard.js.map +1 -1
- package/dist/src/components/Toast/Toast.js.map +1 -1
- package/dist/src/components/Toggle/MockToggle.js.map +1 -1
- package/dist/src/components/Toggle/Toggle.js.map +1 -1
- package/dist/src/components/Toggle/ToggleText.js.map +1 -1
- package/dist/src/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/src/components/Typography/Typography.js.map +1 -1
- package/dist/src/components/VirtualizedGrid/VirtualizedGrid.js.map +1 -1
- package/dist/src/components/VirtualizedList/VirtualizedList.js.map +1 -1
- package/dist/src/hooks/useKeyEvent/index.js.map +1 -1
- package/dist/src/hooks/useSwitch/index.js.map +1 -1
- package/dist/types/VibeComponentProps.d.ts +9 -0
- package/package.json +3 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStepIndicator.js","sources":["../../../../../src/components/MultiStepIndicator/MultiStepIndicator.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../components/Divider/Divider\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport StepIndicator from \"./components/StepIndicator/StepIndicator\";\nimport {\n MultiStepType as MultiStepTypeEnum,\n Size as SizeEnum,\n StepStatus as StepStatusEnum,\n TextPlacement as TextPlacementEnum\n} from \"./MultiStepConstants\";\nimport { MultiStepType, MultiStepSize, TextPlacement, Step } from \"./MultiStep.types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./MultiStepIndicator.module.scss\";\n\nexport interface MultiStepIndicatorProps extends VibeComponentProps {\n steps?: Step[];\n type?: MultiStepType;\n stepComponentClassName?: string;\n dividerComponentClassName?: string;\n fulfilledStepIcon?: SubIcon;\n fulfilledStepIconType?: \"svg\" | \"font\";\n isFulfilledStepDisplayNumber?: boolean;\n onClick?: (stepNumber: number) => void;\n textPlacement?: TextPlacement;\n size?: MultiStepSize;\n}\n\nconst MultiStepIndicator: VibeComponent<MultiStepIndicatorProps, HTMLOListElement> & {\n types?: typeof MultiStepTypeEnum;\n stepStatuses?: typeof StepStatusEnum;\n textPlacements?: typeof TextPlacementEnum;\n sizes?: typeof SizeEnum;\n} = forwardRef(\n (\n {\n className,\n steps = [],\n type = \"primary\",\n stepComponentClassName,\n dividerComponentClassName,\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n textPlacement = \"horizontal\",\n id,\n size,\n \"data-testid\": dataTestId\n }: MultiStepIndicatorProps,\n ref\n ) => {\n const finalSize = textPlacement === \"vertical\" ? \"regular\" : size;\n\n const renderHorizontalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <React.Fragment key={`${step.titleText}_${index}`}>\n <StepIndicator\n {...step}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n size={finalSize}\n />\n {index !== steps.length - 1 && (\n <Divider\n className={cx(styles.divider, dividerComponentClassName, {\n [styles.compact]: finalSize === \"compact\"\n })}\n />\n )}\n </React.Fragment>\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length,\n finalSize\n ]\n );\n\n const renderVerticalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <StepIndicator\n {...step}\n key={`${step.titleText}_${index}`}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFollowedByDivider={index !== steps.length - 1}\n stepDividerClassName={cx(styles.divider, dividerComponentClassName)}\n isVertical\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n />\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length\n ]\n );\n\n const stepRenderer = useMemo(\n () => (textPlacement === \"vertical\" ? renderVerticalStepIndicator : renderHorizontalStepIndicator),\n [textPlacement, renderVerticalStepIndicator, renderHorizontalStepIndicator]\n );\n\n return (\n <ol\n ref={ref}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.MULTI_STEP_INDICATOR, id)}\n className={cx(styles.wrapper, className)}\n >\n {steps.map(stepRenderer)}\n </ol>\n );\n }\n);\n\nexport default withStaticProps(MultiStepIndicator, {\n types: MultiStepTypeEnum,\n stepStatuses: StepStatusEnum,\n textPlacements: TextPlacementEnum,\n sizes: SizeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","_ref$steps","steps","_ref$type","type","stepComponentClassName","dividerComponentClassName","_ref$fulfilledStepIco","fulfilledStepIcon","Check","_ref$fulfilledStepIco2","fulfilledStepIconType","_ref$isFulfilledStepD","isFulfilledStepDisplayNumber","_ref$onClick","onClick","NOOP","_ref$textPlacement","textPlacement","id","dataTestId","finalSize","size","renderHorizontalStepIndicator","useCallback","step","index","React","createElement","Fragment","key","concat","titleText","StepIndicator","Object","assign","stepNumber","length","Divider","cx","styles","divider","_defineProperty","compact","renderVerticalStepIndicator","isFollowedByDivider","stepDividerClassName","isVertical","stepRenderer","useMemo","getTestId","ComponentDefaultTestId","MULTI_STEP_INDICATOR","wrapper","map","types","MultiStepTypeEnum","stepStatuses","StepStatusEnum","textPlacements","TextPlacementEnum","sizes","SizeEnum"],"mappings":"
|
|
1
|
+
{"version":3,"file":"MultiStepIndicator.js","sources":["../../../../../src/components/MultiStepIndicator/MultiStepIndicator.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../components/Divider/Divider\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport StepIndicator from \"./components/StepIndicator/StepIndicator\";\nimport {\n MultiStepType as MultiStepTypeEnum,\n Size as SizeEnum,\n StepStatus as StepStatusEnum,\n TextPlacement as TextPlacementEnum\n} from \"./MultiStepConstants\";\nimport { MultiStepType, MultiStepSize, TextPlacement, Step } from \"./MultiStep.types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./MultiStepIndicator.module.scss\";\n\nexport interface MultiStepIndicatorProps extends VibeComponentProps {\n /**\n * The list of steps in the multi-step indicator.\n */\n steps?: Step[];\n /**\n * The visual style of the multi-step indicator.\n */\n type?: MultiStepType;\n /**\n * Class name applied to each step component.\n */\n stepComponentClassName?: string;\n /**\n * Class name applied to the divider between steps.\n */\n dividerComponentClassName?: string;\n /**\n * The icon used for fulfilled steps.\n */\n fulfilledStepIcon?: SubIcon;\n /**\n * The type of the fulfilled step icon.\n */\n fulfilledStepIconType?: \"svg\" | \"font\";\n /**\n * If true, displays the step number instead of the fulfilled step icon.\n */\n isFulfilledStepDisplayNumber?: boolean;\n /**\n * Callback fired when a step is clicked.\n */\n onClick?: (stepNumber: number) => void;\n /**\n * The placement of the step text.\n */\n textPlacement?: TextPlacement;\n /**\n * The size of the multi-step indicator.\n */\n size?: MultiStepSize;\n}\n\nconst MultiStepIndicator: VibeComponent<MultiStepIndicatorProps, HTMLOListElement> & {\n types?: typeof MultiStepTypeEnum;\n stepStatuses?: typeof StepStatusEnum;\n textPlacements?: typeof TextPlacementEnum;\n sizes?: typeof SizeEnum;\n} = forwardRef(\n (\n {\n className,\n steps = [],\n type = \"primary\",\n stepComponentClassName,\n dividerComponentClassName,\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n textPlacement = \"horizontal\",\n id,\n size,\n \"data-testid\": dataTestId\n }: MultiStepIndicatorProps,\n ref\n ) => {\n const finalSize = textPlacement === \"vertical\" ? \"regular\" : size;\n\n const renderHorizontalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <React.Fragment key={`${step.titleText}_${index}`}>\n <StepIndicator\n {...step}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n size={finalSize}\n />\n {index !== steps.length - 1 && (\n <Divider\n className={cx(styles.divider, dividerComponentClassName, {\n [styles.compact]: finalSize === \"compact\"\n })}\n />\n )}\n </React.Fragment>\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length,\n finalSize\n ]\n );\n\n const renderVerticalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <StepIndicator\n {...step}\n key={`${step.titleText}_${index}`}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFollowedByDivider={index !== steps.length - 1}\n stepDividerClassName={cx(styles.divider, dividerComponentClassName)}\n isVertical\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n />\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length\n ]\n );\n\n const stepRenderer = useMemo(\n () => (textPlacement === \"vertical\" ? renderVerticalStepIndicator : renderHorizontalStepIndicator),\n [textPlacement, renderVerticalStepIndicator, renderHorizontalStepIndicator]\n );\n\n return (\n <ol\n ref={ref}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.MULTI_STEP_INDICATOR, id)}\n className={cx(styles.wrapper, className)}\n >\n {steps.map(stepRenderer)}\n </ol>\n );\n }\n);\n\nexport default withStaticProps(MultiStepIndicator, {\n types: MultiStepTypeEnum,\n stepStatuses: StepStatusEnum,\n textPlacements: TextPlacementEnum,\n sizes: SizeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","_ref$steps","steps","_ref$type","type","stepComponentClassName","dividerComponentClassName","_ref$fulfilledStepIco","fulfilledStepIcon","Check","_ref$fulfilledStepIco2","fulfilledStepIconType","_ref$isFulfilledStepD","isFulfilledStepDisplayNumber","_ref$onClick","onClick","NOOP","_ref$textPlacement","textPlacement","id","dataTestId","finalSize","size","renderHorizontalStepIndicator","useCallback","step","index","React","createElement","Fragment","key","concat","titleText","StepIndicator","Object","assign","stepNumber","length","Divider","cx","styles","divider","_defineProperty","compact","renderVerticalStepIndicator","isFollowedByDivider","stepDividerClassName","isVertical","stepRenderer","useMemo","getTestId","ComponentDefaultTestId","MULTI_STEP_INDICATOR","wrapper","map","types","MultiStepTypeEnum","stepStatuses","StepStatusEnum","textPlacements","TextPlacementEnum","sizes","SizeEnum"],"mappings":"0uBA6DA,IAiHeA,EAAAA,EA5GXC,GACF,SAAAC,EAgBEC,GACE,IAfAC,EAASF,EAATE,UAASC,EAAAH,EACTI,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EACVM,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAChBE,EAAsBP,EAAtBO,uBACAC,EAAyBR,EAAzBQ,0BAAyBC,EAAAT,EACzBU,kBAAAA,OAAoBC,IAAHF,EAAGE,EAAKF,EAAAG,EAAAZ,EACzBa,sBAAAA,OAAwB,IAAHD,EAAG,MAAKA,EAAAE,EAAAd,EAC7Be,6BAAAA,OAA+B,IAAHD,GAAQA,EAAAE,EAAAhB,EACpCiB,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAnB,EACdoB,cAAAA,OAAgB,IAAHD,EAAG,aAAYA,EAC5BE,EAAErB,EAAFqB,GAEeC,EAAUtB,EAAzB,eAIIuB,EAA8B,aAAlBH,EAA+B,UAL3CpB,EAAJwB,KAOIC,EAAgCC,GACpC,SAACC,EAAYC,GACX,OACEC,EAAAC,cAACD,EAAME,SAAS,CAAAC,IAAG,GAAAC,OAAKN,EAAKO,UAAS,KAAAD,OAAIL,IACxCC,EAAAC,cAACK,EACKC,OAAAC,OAAA,CAAA,EAAAV,EACJ,CAAAW,WAAYV,EAAQ,EACpBtB,KAAMA,EACNC,uBAAwBA,EACxBG,kBAAmBA,EACnBG,sBAAuBA,EACvBI,QAASA,EACTF,6BAA8BA,EAC9BS,KAAMD,KAEPK,IAAUxB,EAAMmC,OAAS,GACxBV,EAACC,cAAAU,GACCtC,UAAWuC,EAAGC,EAAOC,QAASnC,EAAyBoC,EAAA,CAAA,EACpDF,EAAOG,QAAwB,YAAdtB,MAM7B,GACD,CACEN,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,OACNhB,IAIEuB,EAA8BpB,GAClC,SAACC,EAAYC,GACX,OACEC,EAAAC,cAACK,EAAaC,OAAAC,OAAA,CAAA,EACRV,EACJ,CAAAK,IAAG,GAAAC,OAAKN,EAAKO,UAASD,KAAAA,OAAIL,GAC1BU,WAAYV,EAAQ,EACpBtB,KAAMA,EACNC,uBAAwBA,EACxBG,kBAAmBA,EACnBG,sBAAuBA,EACvBI,QAASA,EACT8B,oBAAqBnB,IAAUxB,EAAMmC,OAAS,EAC9CS,qBAAsBP,EAAGC,EAAOC,QAASnC,GACzCyC,cACAlC,6BAA8BA,IAGnC,GACD,CACEE,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,SAIJW,EAAeC,GACnB,WAAA,MAAyB,aAAlB/B,EAA+B0B,EAA8BrB,CAA8B,GAClG,CAACL,EAAe0B,EAA6BrB,IAG/C,OACEI,EACEC,cAAA,KAAA,CAAA7B,IAAKA,EACLoB,GAAIA,EACS,cAAAC,GAAc8B,EAAUC,EAAuBC,qBAAsBjC,GAClFnB,UAAWuC,EAAGC,EAAOa,QAASrD,IAE7BE,EAAMoD,IAAIN,GAGjB,IAGiD,CACjDO,MAAOC,EACPC,aAAcC,EACdC,eAAgBC,EAChBC,MAAOC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepIndicator.js","sources":["../../../../../../../src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { keyCodes } from \"../../../../constants/keyCodes\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../../../hooks/useEventListener\";\nimport useKeyEvent from \"../../../../hooks/useKeyEvent\";\nimport Icon from \"../../../../components/Icon/Icon\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../../../components/Divider/Divider\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport HiddenText from \"../../../../components/HiddenText/HiddenText\";\nimport Clickable from \"../../../../components/Clickable/Clickable\";\nimport { MultiStepSize, MultiStepType, StepStatus } from \"../../MultiStep.types\";\nimport styles from \"./StepIndicator.module.scss\";\nimport classNames from \"classnames\";\nimport { SubIcon, VibeComponentProps } from \"../../../../types\";\n\nconst KEYS = [keyCodes.ENTER, keyCodes.SPACE];\n\nexport interface StepCircleDisplayProps {\n status: StepStatus;\n isFulfilledStepDisplayNumber: boolean;\n fulfilledStepIcon: SubIcon;\n fulfilledStepIconType: \"svg\" | \"font\";\n stepNumber: number;\n}\n\nconst StepCircleDisplay: React.FC<StepCircleDisplayProps> = ({\n status,\n isFulfilledStepDisplayNumber,\n fulfilledStepIcon,\n fulfilledStepIconType,\n stepNumber\n}) => {\n return status === \"fulfilled\" && !isFulfilledStepDisplayNumber ? (\n <Icon\n icon={fulfilledStepIcon}\n className={classNames(styles.numberContainerTextCheckIcon)}\n iconType={fulfilledStepIconType}\n ignoreFocusStyle\n ariaHidden={true}\n />\n ) : (\n <>{stepNumber}</>\n );\n};\n\nexport interface StepIndicatorProps extends VibeComponentProps {\n status: StepStatus;\n titleText: string;\n subtitleText?: string;\n stepNumber?: number;\n stepComponentClassName?: string;\n type?: MultiStepType;\n fulfilledStepIcon?: SubIcon;\n fulfilledStepIconType?: \"svg\" | \"font\";\n isFulfilledStepDisplayNumber?: boolean;\n onClick?: (stepNumber: number) => void;\n isFollowedByDivider?: boolean;\n stepDividerClassName?: string;\n isVertical?: boolean;\n size?: MultiStepSize;\n}\n\nconst StepIndicator: React.FC<StepIndicatorProps> = ({\n stepComponentClassName,\n stepNumber = 1,\n status = \"pending\",\n titleText = \"Heading text\",\n subtitleText = \"Subtitle text\",\n type = \"primary\",\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n isFollowedByDivider = false,\n stepDividerClassName,\n isVertical = false,\n id,\n size = \"regular\",\n \"data-testid\": dataTestId\n}: StepIndicatorProps) => {\n // Animations state\n const [statusChangeAnimationState, setStatusChangeAnimationState] = useState(false);\n\n // Refs\n const componentRef = useRef(null);\n const prevStatusRef = useRef(status);\n\n // Callbacks for modifying animation state\n const enableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(true);\n }, [setStatusChangeAnimationState]);\n\n const disableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(false);\n }, [setStatusChangeAnimationState]);\n\n const isStatusTransition = useCallback(() => prevStatusRef.current !== status, [prevStatusRef, status]);\n\n const handleClick = useCallback(() => {\n if (onClick) onClick(stepNumber);\n }, [onClick, stepNumber]);\n\n // Event listeners for removing animation.\n useEventListener({\n eventName: \"animationend\",\n callback: disableStatusChangeAnimation,\n ref: componentRef\n });\n\n useKeyEvent({\n keys: KEYS,\n callback: handleClick,\n ref: componentRef\n });\n\n // Effect - triggering animation when necessary.\n useEffect(() => {\n if (isStatusTransition()) {\n enableStatusChangeAnimation();\n }\n }, [status, isStatusTransition, enableStatusChangeAnimation]);\n\n // Effect - updating previous status ref value (for animation) after component update.\n useEffect(() => {\n prevStatusRef.current = status;\n }, [status]);\n\n const ariaLabel = useMemo(() => {\n return `Step ${stepNumber}: ${titleText} - ${subtitleText}, status: ${status}`;\n }, [status, titleText, stepNumber, subtitleText]);\n\n const getClassNamesWithSuffix = (suffix: string) => {\n return [\n getStyle(styles, camelCase(suffix || \"indicator\")),\n getStyle(styles, camelCase(`type-${type}${suffix}`)),\n getStyle(styles, camelCase(`status-${status}${suffix}`)),\n getStyle(styles, camelCase(`size-${size}${suffix}`))\n ];\n };\n\n return (\n <Clickable\n tabIndex=\"-1\"\n elementType=\"li\"\n className={cx(...getClassNamesWithSuffix(\"\"), stepComponentClassName, {\n [styles.withAnimation]: statusChangeAnimationState,\n [styles.clickable]: onClick,\n [styles.textPlacementVertical]: isVertical\n })}\n aria-label={ariaLabel}\n onClick={handleClick}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.STEP_INDICATOR, id)}\n >\n <div className={cx(...getClassNamesWithSuffix(\"__number-divider-container\"))}>\n <div\n className={cx(...getClassNamesWithSuffix(\"__number-container\"))}\n ref={componentRef}\n tabIndex={0}\n role=\"button\"\n >\n <SwitchTransition mode=\"out-in\">\n <CSSTransition<undefined>\n // CSSTransition needs to be specified with the generic parameter to decide type for addEndListener's callback\n // otherwise, addEndListener cb has only `done` param (ts error)\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n key={status}\n >\n <span className={cx(...getClassNamesWithSuffix(\"__number-container__text\"))}>\n <StepCircleDisplay\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n stepNumber={stepNumber}\n status={status}\n />\n </span>\n </CSSTransition>\n </SwitchTransition>\n </div>\n {isFollowedByDivider && isVertical && <Divider className={cx(styles.divider, stepDividerClassName)} />}\n </div>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container\"))}>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container__title\"))}>\n <HiddenText text={status} /> {/* for accessibility */}\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__title__text\"))}>{titleText}</span>\n </div>\n {size !== \"compact\" ? (\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__subtitle__text\"))}>{subtitleText}</span>\n ) : null}\n </div>\n </Clickable>\n );\n};\n\nexport default StepIndicator;\n"],"names":["KEYS","keyCodes","ENTER","SPACE","StepCircleDisplay","_ref","fulfilledStepIcon","fulfilledStepIconType","status","isFulfilledStepDisplayNumber","React","createElement","Fragment","stepNumber","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","iconType","ignoreFocusStyle","ariaHidden","StepIndicator","_ref2","stepComponentClassName","_ref2$stepNumber","_ref2$status","_ref2$titleText","titleText","_ref2$subtitleText","subtitleText","_ref2$type","type","_ref2$fulfilledStepIc","Check","_ref2$fulfilledStepIc2","_ref2$isFulfilledStep","_ref2$onClick","onClick","NOOP","_ref2$isFollowedByDiv","isFollowedByDivider","stepDividerClassName","_ref2$isVertical","isVertical","id","_ref2$size","size","dataTestId","_useState","useState","_useState2","_slicedToArray","statusChangeAnimationState","setStatusChangeAnimationState","componentRef","useRef","prevStatusRef","enableStatusChangeAnimation","useCallback","disableStatusChangeAnimation","isStatusTransition","current","handleClick","useEventListener","eventName","callback","ref","useKeyEvent","keys","useEffect","ariaLabel","useMemo","concat","getClassNamesWithSuffix","suffix","getStyle","camelCase","Clickable","tabIndex","elementType","cx","apply","_toConsumableArray","_defineProperty","withAnimation","clickable","textPlacementVertical","getTestId","ComponentDefaultTestId","STEP_INDICATOR","role","SwitchTransition","mode","CSSTransition","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","node","done","addEventListener","key","Divider","divider","HiddenText","text"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"StepIndicator.js","sources":["../../../../../../../src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { keyCodes } from \"../../../../constants/keyCodes\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../../../hooks/useEventListener\";\nimport useKeyEvent from \"../../../../hooks/useKeyEvent\";\nimport Icon from \"../../../../components/Icon/Icon\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../../../components/Divider/Divider\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport HiddenText from \"../../../../components/HiddenText/HiddenText\";\nimport Clickable from \"../../../../components/Clickable/Clickable\";\nimport { MultiStepSize, MultiStepType, StepStatus } from \"../../MultiStep.types\";\nimport styles from \"./StepIndicator.module.scss\";\nimport classNames from \"classnames\";\nimport { SubIcon, VibeComponentProps } from \"../../../../types\";\n\nconst KEYS = [keyCodes.ENTER, keyCodes.SPACE];\n\nexport interface StepCircleDisplayProps {\n /**\n * The status of the step.\n */\n status: StepStatus;\n /**\n * If true, displays the step number instead of the fulfilled step icon.\n */\n isFulfilledStepDisplayNumber: boolean;\n /**\n * The icon displayed when the step is fulfilled.\n */\n fulfilledStepIcon: SubIcon;\n /**\n * The type of icon used.\n */\n fulfilledStepIconType: \"svg\" | \"font\";\n /**\n * The step number in the sequence.\n */\n stepNumber: number;\n}\n\nconst StepCircleDisplay: React.FC<StepCircleDisplayProps> = ({\n status,\n isFulfilledStepDisplayNumber,\n fulfilledStepIcon,\n fulfilledStepIconType,\n stepNumber\n}) => {\n return status === \"fulfilled\" && !isFulfilledStepDisplayNumber ? (\n <Icon\n icon={fulfilledStepIcon}\n className={classNames(styles.numberContainerTextCheckIcon)}\n iconType={fulfilledStepIconType}\n ignoreFocusStyle\n ariaHidden={true}\n />\n ) : (\n <>{stepNumber}</>\n );\n};\n\nexport interface StepIndicatorProps extends VibeComponentProps {\n /**\n * The status of the step.\n */\n status: StepStatus;\n /**\n * The main title text for the step.\n */\n titleText: string;\n /**\n * The subtitle text for the step.\n */\n subtitleText?: string;\n /**\n * The number of the step in the sequence.\n */\n stepNumber?: number;\n /**\n * Class name applied to the step component.\n */\n stepComponentClassName?: string;\n /**\n * The visual style of the step indicator.\n */\n type?: MultiStepType;\n /**\n * The icon used for a fulfilled step.\n */\n fulfilledStepIcon?: SubIcon;\n /**\n * The type of icon used.\n */\n fulfilledStepIconType?: \"svg\" | \"font\";\n /**\n * If true, displays the step number instead of the fulfilled step icon.\n */\n isFulfilledStepDisplayNumber?: boolean;\n /**\n * Callback fired when the step is clicked.\n */\n onClick?: (stepNumber: number) => void;\n /**\n * If true, adds a divider after the step.\n */\n isFollowedByDivider?: boolean;\n /**\n * Class name applied to the step divider.\n */\n stepDividerClassName?: string;\n /**\n * If true, the step indicator is displayed vertically.\n */\n isVertical?: boolean;\n /**\n * The size of the step indicator.\n */\n size?: MultiStepSize;\n}\n\nconst StepIndicator: React.FC<StepIndicatorProps> = ({\n stepComponentClassName,\n stepNumber = 1,\n status = \"pending\",\n titleText = \"Heading text\",\n subtitleText = \"Subtitle text\",\n type = \"primary\",\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n isFollowedByDivider = false,\n stepDividerClassName,\n isVertical = false,\n id,\n size = \"regular\",\n \"data-testid\": dataTestId\n}: StepIndicatorProps) => {\n // Animations state\n const [statusChangeAnimationState, setStatusChangeAnimationState] = useState(false);\n\n // Refs\n const componentRef = useRef(null);\n const prevStatusRef = useRef(status);\n\n // Callbacks for modifying animation state\n const enableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(true);\n }, [setStatusChangeAnimationState]);\n\n const disableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(false);\n }, [setStatusChangeAnimationState]);\n\n const isStatusTransition = useCallback(() => prevStatusRef.current !== status, [prevStatusRef, status]);\n\n const handleClick = useCallback(() => {\n if (onClick) onClick(stepNumber);\n }, [onClick, stepNumber]);\n\n // Event listeners for removing animation.\n useEventListener({\n eventName: \"animationend\",\n callback: disableStatusChangeAnimation,\n ref: componentRef\n });\n\n useKeyEvent({\n keys: KEYS,\n callback: handleClick,\n ref: componentRef\n });\n\n // Effect - triggering animation when necessary.\n useEffect(() => {\n if (isStatusTransition()) {\n enableStatusChangeAnimation();\n }\n }, [status, isStatusTransition, enableStatusChangeAnimation]);\n\n // Effect - updating previous status ref value (for animation) after component update.\n useEffect(() => {\n prevStatusRef.current = status;\n }, [status]);\n\n const ariaLabel = useMemo(() => {\n return `Step ${stepNumber}: ${titleText} - ${subtitleText}, status: ${status}`;\n }, [status, titleText, stepNumber, subtitleText]);\n\n const getClassNamesWithSuffix = (suffix: string) => {\n return [\n getStyle(styles, camelCase(suffix || \"indicator\")),\n getStyle(styles, camelCase(`type-${type}${suffix}`)),\n getStyle(styles, camelCase(`status-${status}${suffix}`)),\n getStyle(styles, camelCase(`size-${size}${suffix}`))\n ];\n };\n\n return (\n <Clickable\n tabIndex=\"-1\"\n elementType=\"li\"\n className={cx(...getClassNamesWithSuffix(\"\"), stepComponentClassName, {\n [styles.withAnimation]: statusChangeAnimationState,\n [styles.clickable]: onClick,\n [styles.textPlacementVertical]: isVertical\n })}\n aria-label={ariaLabel}\n onClick={handleClick}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.STEP_INDICATOR, id)}\n >\n <div className={cx(...getClassNamesWithSuffix(\"__number-divider-container\"))}>\n <div\n className={cx(...getClassNamesWithSuffix(\"__number-container\"))}\n ref={componentRef}\n tabIndex={0}\n role=\"button\"\n >\n <SwitchTransition mode=\"out-in\">\n <CSSTransition<undefined>\n // CSSTransition needs to be specified with the generic parameter to decide type for addEndListener's callback\n // otherwise, addEndListener cb has only `done` param (ts error)\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n key={status}\n >\n <span className={cx(...getClassNamesWithSuffix(\"__number-container__text\"))}>\n <StepCircleDisplay\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n stepNumber={stepNumber}\n status={status}\n />\n </span>\n </CSSTransition>\n </SwitchTransition>\n </div>\n {isFollowedByDivider && isVertical && <Divider className={cx(styles.divider, stepDividerClassName)} />}\n </div>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container\"))}>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container__title\"))}>\n <HiddenText text={status} /> {/* for accessibility */}\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__title__text\"))}>{titleText}</span>\n </div>\n {size !== \"compact\" ? (\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__subtitle__text\"))}>{subtitleText}</span>\n ) : null}\n </div>\n </Clickable>\n );\n};\n\nexport default StepIndicator;\n"],"names":["KEYS","keyCodes","ENTER","SPACE","StepCircleDisplay","_ref","fulfilledStepIcon","fulfilledStepIconType","status","isFulfilledStepDisplayNumber","React","createElement","Fragment","stepNumber","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","iconType","ignoreFocusStyle","ariaHidden","StepIndicator","_ref2","stepComponentClassName","_ref2$stepNumber","_ref2$status","_ref2$titleText","titleText","_ref2$subtitleText","subtitleText","_ref2$type","type","_ref2$fulfilledStepIc","Check","_ref2$fulfilledStepIc2","_ref2$isFulfilledStep","_ref2$onClick","onClick","NOOP","_ref2$isFollowedByDiv","isFollowedByDivider","stepDividerClassName","_ref2$isVertical","isVertical","id","_ref2$size","size","dataTestId","_useState","useState","_useState2","_slicedToArray","statusChangeAnimationState","setStatusChangeAnimationState","componentRef","useRef","prevStatusRef","enableStatusChangeAnimation","useCallback","disableStatusChangeAnimation","isStatusTransition","current","handleClick","useEventListener","eventName","callback","ref","useKeyEvent","keys","useEffect","ariaLabel","useMemo","concat","getClassNamesWithSuffix","suffix","getStyle","camelCase","Clickable","tabIndex","elementType","cx","apply","_toConsumableArray","_defineProperty","withAnimation","clickable","textPlacementVertical","getTestId","ComponentDefaultTestId","STEP_INDICATOR","role","SwitchTransition","mode","CSSTransition","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","node","done","addEventListener","key","Divider","divider","HiddenText","text"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bar.js","sources":["../../../../../../../src/components/ProgressBars/LinearProgressBar/Bar/Bar.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { FC, useMemo } from \"react\";\nimport { calculatePercentage } from \"../LinearProgressBarHelpers\";\nimport VibeComponentProps from \"src/types/VibeComponentProps\";\nimport { LinearProgressBarStyle } from \"../LinearProgressBar.types\";\nimport styles from \"./Bar.module.scss\";\n\nexport type BarType = \"primary\" | \"secondary\";\n\nexport interface BarProps extends VibeComponentProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"Bar.js","sources":["../../../../../../../src/components/ProgressBars/LinearProgressBar/Bar/Bar.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { FC, useMemo } from \"react\";\nimport { calculatePercentage } from \"../LinearProgressBarHelpers\";\nimport VibeComponentProps from \"src/types/VibeComponentProps\";\nimport { LinearProgressBarStyle } from \"../LinearProgressBar.types\";\nimport styles from \"./Bar.module.scss\";\n\nexport type BarType = \"primary\" | \"secondary\";\n\nexport interface BarProps extends VibeComponentProps {\n /**\n * Determines the visual style of the progress bar.\n */\n barStyle?: LinearProgressBarStyle;\n /**\n * The minimum value of the progress bar.\n */\n min?: number;\n /**\n * The maximum value of the progress bar.\n */\n max?: number;\n /**\n * The current progress value.\n */\n value?: number;\n /**\n * If true, enables animation effects.\n */\n animated?: boolean;\n /**\n * Base class name for the bar.\n */\n baseClass?: string;\n /**\n * The ARIA label describing the progress bar.\n */\n barLabelName?: string;\n /**\n * Custom color for the progress bar.\n */\n color?: string;\n /**\n * The type of the bar.\n */\n type?: BarType;\n}\n\nconst Bar: FC<BarProps> = ({\n value,\n type,\n barStyle,\n animated,\n min,\n max,\n color,\n barLabelName,\n id,\n \"data-testid\": dataTestId,\n className\n}) => {\n const classNames = useMemo(() => {\n return cx(styles.bar, getStyle(styles, camelCase(\"type__\" + type + \"--\" + barStyle)), className, {\n [styles.animate]: animated\n });\n }, [type, barStyle, animated, className]);\n\n const valuePercentage = useMemo(() => {\n if (value === null || value === undefined) return 0;\n return calculatePercentage(value, min, max);\n }, [value, min, max]);\n\n if (!value) return null;\n\n return (\n <div\n role=\"progressbar\"\n aria-label={barLabelName}\n aria-valuenow={valuePercentage}\n aria-valuemin={0}\n aria-valuemax={100}\n className={classNames}\n style={{\n width: `${valuePercentage}%`,\n ...(color && { backgroundColor: color })\n }}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.BAR, id)}\n />\n );\n};\n\nexport default Bar;\n"],"names":["Bar","_ref","value","type","barStyle","animated","min","max","color","barLabelName","id","dataTestId","className","classNames","useMemo","cx","styles","bar","getStyle","camelCase","_defineProperty","animate","valuePercentage","calculatePercentage","React","createElement","role","style","width","concat","backgroundColor","getTestId","ComponentDefaultTestId","BAR"],"mappings":"mcAmDA,IAAMA,EAAoB,SAAjBC,GAYJ,IAXHC,EAAKD,EAALC,MACAC,EAAIF,EAAJE,KACAC,EAAQH,EAARG,SACAC,EAAQJ,EAARI,SACAC,EAAGL,EAAHK,IACAC,EAAGN,EAAHM,IACAC,EAAKP,EAALO,MACAC,EAAYR,EAAZQ,aACAC,EAAET,EAAFS,GACeC,EAAUV,EAAzB,eACAW,EAASX,EAATW,UAEMC,EAAaC,GAAQ,WACzB,OAAOC,EAAGC,EAAOC,IAAKC,EAASF,EAAQG,EAAU,SAAWhB,EAAO,KAAOC,IAAYQ,EAASQ,EAC5FJ,CAAAA,EAAAA,EAAOK,QAAUhB,GAErB,GAAE,CAACF,EAAMC,EAAUC,EAAUO,IAExBU,EAAkBR,GAAQ,WAC9B,OAAIZ,QAA8C,EAC3CqB,EAAoBrB,EAAOI,EAAKC,EACxC,GAAE,CAACL,EAAOI,EAAKC,IAEhB,OAAKL,EAGHsB,EACEC,cAAA,MAAA,CAAAC,KAAK,2BACOjB,EAAY,gBACTa,EAAe,gBACf,EAAC,gBACD,IACfV,UAAWC,EACXc,qBACEC,MAAK,GAAAC,OAAKP,EAAe,MACrBd,GAAS,CAAEsB,gBAAiBtB,IAElCE,GAAIA,EAAE,cACOC,GAAcoB,EAAUC,EAAuBC,IAAKvB,KAflD,IAkBrB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinearProgressBar.js","sources":["../../../../../../src/components/ProgressBars/LinearProgressBar/LinearProgressBar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { SIZES } from \"../../../constants\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport PercentageLabel from \"../PercentageLabel/PercentageLabel\";\nimport {\n ProgressBarStyle as ProgressBarStyleEnum,\n ProgressBarType as ProgressBarTypeEnum\n} from \"./LinearProgressBarConstants\";\nimport { LinearProgressBarSize, LinearProgressBarStyle } from \"./LinearProgressBar.types\";\nimport { calculatePercentage, getProgressBarClassNames } from \"./LinearProgressBarHelpers\";\nimport Bar from \"./Bar/Bar\";\nimport { VibeComponent, VibeComponentProps, withStaticProps } from \"../../../types\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport styles from \"./LinearProgressBar.module.scss\";\n\nexport interface LinearProgressBarProps extends VibeComponentProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"LinearProgressBar.js","sources":["../../../../../../src/components/ProgressBars/LinearProgressBar/LinearProgressBar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { SIZES } from \"../../../constants\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport PercentageLabel from \"../PercentageLabel/PercentageLabel\";\nimport {\n ProgressBarStyle as ProgressBarStyleEnum,\n ProgressBarType as ProgressBarTypeEnum\n} from \"./LinearProgressBarConstants\";\nimport { LinearProgressBarSize, LinearProgressBarStyle } from \"./LinearProgressBar.types\";\nimport { calculatePercentage, getProgressBarClassNames } from \"./LinearProgressBarHelpers\";\nimport Bar from \"./Bar/Bar\";\nimport { VibeComponent, VibeComponentProps, withStaticProps } from \"../../../types\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport styles from \"./LinearProgressBar.module.scss\";\n\nexport interface LinearProgressBarProps extends VibeComponentProps {\n /**\n * Determines the visual style of the progress bar.\n */\n barStyle?: LinearProgressBarStyle;\n /**\n * The minimum value of the progress bar.\n */\n min?: number;\n /**\n * The maximum value of the progress bar.\n */\n max?: number;\n /**\n * The current progress value.\n */\n value?: number;\n /**\n * The secondary progress value.\n */\n valueSecondary?: number;\n /**\n * If true, enables animation effects.\n */\n animated?: boolean;\n /**\n * The size of the progress bar.\n */\n size?: LinearProgressBarSize;\n /**\n * If true, displays the progress percentage.\n */\n indicateProgress?: boolean;\n /**\n * If true, enables multiple progress bars.\n * **Note:** `value`, `valueSecondary`, and `barStyle` will not be used.\n */\n multi?: boolean;\n /**\n * An array of bar values and colors for multi-bar mode.\n */\n multiValues?: {\n /**\n * The progress value for a bar.\n */\n value?: number;\n /**\n * The bar color in hex format (`#000000` - `#ffffff`).\n */\n color?: string;\n }[];\n /**\n * The ARIA label for the progress bar.\n */\n ariaLabel?: string;\n /**\n * If true, makes the progress bar span the full container width.\n */\n fullWidth?: boolean;\n}\n\nconst LinearProgressBar: VibeComponent<LinearProgressBarProps, HTMLDivElement> & {\n styles?: typeof ProgressBarStyleEnum;\n barStyles?: typeof ProgressBarStyleEnum;\n types?: typeof ProgressBarTypeEnum;\n barTypes?: typeof ProgressBarTypeEnum;\n sizes?: typeof SIZES;\n} = forwardRef(\n (\n {\n min = 0,\n max = 100,\n value = 0,\n valueSecondary = 0,\n animated = true,\n barStyle = \"primary\",\n className,\n size = \"small\",\n indicateProgress = false,\n multi = false,\n multiValues = [],\n ariaLabel = \"\",\n id,\n fullWidth = false,\n \"data-testid\": dataTestId\n }: LinearProgressBarProps,\n ref\n ) => {\n const wrapperClassName = useMemo(() => {\n return cx(\n styles.wrapper,\n {\n [getStyle(styles, size.toString())]: size,\n [styles.fullWidth]: fullWidth\n },\n className\n );\n }, [size, fullWidth, className]);\n\n const valuePercentage = useMemo(() => {\n if (multi) {\n const firstValue = multiValues && multiValues.length && multiValues[0].value;\n if (firstValue === null || firstValue === undefined) return 0;\n return calculatePercentage(firstValue, min, max);\n }\n if (value === null || value === undefined) return 0;\n return calculatePercentage(value, min, max);\n }, [value, min, max, multi, multiValues]);\n\n const renderMultiBars = useMemo(() => {\n if (!multi) return null;\n return (\n <>\n {[...multiValues].reverse().map(({ value: baseValue, color }, i) => (\n <Bar\n className={getProgressBarClassNames(baseValue)}\n barStyle=\"none\"\n value={baseValue}\n animated={animated}\n type=\"primary\"\n color={color}\n min={min}\n max={max}\n id={`bar_${color}_${i}`}\n key={`bar_${color}_${i}`}\n />\n ))}\n </>\n );\n }, [min, max, animated, multiValues, multi]);\n\n const renderPercentage = indicateProgress ? (\n <PercentageLabel forElement=\"linear-progress-bar\" value={valuePercentage} />\n ) : null;\n\n const renderBaseBars = !multi ? (\n <>\n <Bar\n className={getProgressBarClassNames(value)}\n barLabelName={ariaLabel}\n barStyle={barStyle}\n value={valueSecondary}\n animated={animated}\n type=\"secondary\"\n min={min}\n max={max}\n data-testid={ComponentDefaultTestId.BAR_SECONDARY}\n />\n <Bar\n className={getProgressBarClassNames(value)}\n barStyle={barStyle}\n value={value}\n animated={animated}\n type=\"primary\"\n min={min}\n max={max}\n data-testid={ComponentDefaultTestId.BAR_PRIMARY}\n />\n </>\n ) : null;\n\n return (\n <div\n className={wrapperClassName}\n ref={ref}\n id={id}\n data-testsid={dataTestId || getTestId(ComponentDefaultTestId.LINEAR_PROGRESS_BAR, id)}\n >\n <div className={styles.container}>\n {renderBaseBars}\n {renderMultiBars}\n </div>\n {renderPercentage}\n </div>\n );\n }\n);\n\nexport default withStaticProps(LinearProgressBar, {\n styles: ProgressBarStyleEnum,\n barStyles: ProgressBarStyleEnum,\n types: ProgressBarTypeEnum,\n barTypes: ProgressBarTypeEnum,\n sizes: SIZES\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","_ref$min","min","_ref$max","max","_ref$value","value","_ref$valueSecondary","valueSecondary","_ref$animated","animated","_ref$barStyle","barStyle","className","_ref$size","size","_ref$indicateProgress","indicateProgress","_ref$multi","multi","_ref$multiValues","multiValues","_ref$ariaLabel","ariaLabel","id","_ref$fullWidth","fullWidth","dataTestId","wrapperClassName","useMemo","cx","styles","wrapper","_defineProperty","getStyle","valuePercentage","firstValue","length","calculatePercentage","renderMultiBars","React","createElement","Fragment","_toConsumableArray","reverse","map","_ref2","i","baseValue","color","Bar","getProgressBarClassNames","type","concat","key","renderPercentage","PercentageLabel","forElement","renderBaseBars","barLabelName","ComponentDefaultTestId","BAR_SECONDARY","BAR_PRIMARY","getTestId","LINEAR_PROGRESS_BAR","container","ProgressBarStyleEnum","barStyles","types","ProgressBarTypeEnum","barTypes","sizes","SIZES"],"mappings":"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"}
|
package/dist/mocked_classnames/src/components/ProgressBars/PercentageLabel/PercentageLabel.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PercentageLabel.js","sources":["../../../../../../src/components/ProgressBars/PercentageLabel/PercentageLabel.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport styles from \"./PercentageLabel.module.scss\";\n\nexport interface PercentageLabelProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"PercentageLabel.js","sources":["../../../../../../src/components/ProgressBars/PercentageLabel/PercentageLabel.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport styles from \"./PercentageLabel.module.scss\";\n\nexport interface PercentageLabelProps {\n /**\n * The ID of the element this label is associated with.\n */\n forElement: string;\n /**\n * The percentage value to display.\n */\n value: number;\n}\n\nconst PercentageLabel: FC<PercentageLabelProps> = ({ forElement = \"\", value = 0 }) => {\n if (value === null || value === undefined) return null;\n return (\n <label htmlFor={forElement} className={styles.label}>\n {`${value.toFixed()}%`}\n </label>\n );\n};\n\nexport default PercentageLabel;\n"],"names":["PercentageLabel","_ref","_ref$forElement","forElement","_ref$value","value","React","htmlFor","className","styles","label","concat","toFixed"],"mappings":"qEAcA,IAAMA,EAA4C,SAA7BC,GAAgE,IAAAC,EAAAD,EAAhCE,WAAeC,EAAAH,EAAEI,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAC7E,OAAIC,QAA8C,KAEhDC,yBAAOC,aAHuD,IAAHL,EAAG,GAAEA,EAGpCM,UAAWC,EAAOC,OAC3C,GAAAC,OAAGN,EAAMO,UAAS,KAGzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioButton.js","sources":["../../../../../src/components/RadioButton/RadioButton.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useMemo, useRef } from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Clickable from \"../Clickable/Clickable\";\nimport Text from \"../Text/Text\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport Tooltip from \"../Tooltip/Tooltip\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./RadioButton.module.scss\";\n\nexport interface RadioButtonProps extends VibeComponentProps {\n
|
|
1
|
+
{"version":3,"file":"RadioButton.js","sources":["../../../../../src/components/RadioButton/RadioButton.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useMemo, useRef } from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Clickable from \"../Clickable/Clickable\";\nimport Text from \"../Text/Text\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport Tooltip from \"../Tooltip/Tooltip\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./RadioButton.module.scss\";\n\nexport interface RadioButtonProps extends VibeComponentProps {\n /**\n * Class name applied to the label text.\n */\n labelClassName?: string;\n /**\n * Class name applied to the radio button element.\n */\n radioButtonClassName?: string;\n /**\n * The label text displayed next to the radio button.\n */\n text?: string;\n /**\n * The value associated with the radio button.\n */\n value?: string;\n /**\n * The name of the radio button group.\n */\n name?: string;\n /**\n * If true, the radio button automatically receives focus on mount.\n */\n autoFocus?: boolean;\n /**\n * If true, the radio button is disabled.\n */\n disabled?: boolean;\n /**\n * The reason why the radio button is disabled, displayed in a tooltip.\n */\n disabledReason?: string;\n /**\n * If true, the radio button is checked by default.\n */\n defaultChecked?: boolean;\n /**\n * The child elements inside the radio button.\n */\n children?: React.ReactNode;\n /**\n * Callback fired when the radio button selection changes.\n */\n onSelect?: (event: React.ChangeEvent<HTMLInputElement | null>) => void;\n /**\n * If provided, controls the checked state of the radio button.\n */\n checked?: boolean;\n /**\n * If true, clicking on children will trigger selection.\n */\n retainChildClick?: boolean;\n /**\n * The tab index applied to the children.\n */\n childrenTabIndex?: string;\n /**\n * If true, disables the label animation.\n */\n noLabelAnimation?: boolean;\n}\n\nconst RadioButton: VibeComponent<RadioButtonProps, HTMLElement> & object = forwardRef(\n (\n {\n className,\n text = \"\",\n value = \"\",\n name = \"\",\n /**\n * Radio button label class name\n */\n labelClassName,\n /**\n * Radio button marker class name\n */\n radioButtonClassName,\n disabled = false,\n autoFocus,\n disabledReason,\n defaultChecked = false,\n children,\n onSelect,\n checked,\n retainChildClick = true,\n childrenTabIndex = \"0\",\n noLabelAnimation = false,\n id,\n \"data-testid\": dataTestId\n }: RadioButtonProps,\n ref: React.ForwardedRef<HTMLInputElement>\n ) => {\n const inputRef = useRef<HTMLInputElement | null>();\n const mergedRef = useMergeRef(ref, inputRef);\n\n const onChildClick = useCallback(() => {\n if (disabled || !retainChildClick) return;\n if (inputRef.current) {\n inputRef.current.checked = true;\n }\n if (onSelect) {\n onSelect(null);\n }\n }, [onSelect, inputRef, disabled, retainChildClick]);\n\n const checkedProps = useMemo(() => {\n if (checked !== undefined) {\n return { checked };\n }\n return { defaultChecked };\n }, [checked, defaultChecked]);\n\n const tooltipContent = disabled ? disabledReason : null;\n\n return (\n <Tooltip content={tooltipContent}>\n <label\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.RADIO_BUTTON, id)}\n className={cx(styles.radioButton, className, {\n [styles.disabled]: disabled,\n disabled: disabled\n })}\n >\n <span className={cx(styles.inputContainer)}>\n <input\n className={cx(styles.input)}\n type=\"radio\"\n value={value}\n name={name}\n autoFocus={autoFocus}\n disabled={disabled}\n {...checkedProps}\n onChange={onSelect}\n ref={mergedRef}\n />\n <span\n data-testid={getTestId(ComponentDefaultTestId.RADIO_BUTTON_CONTROL, id)}\n className={cx(styles.control, radioButtonClassName, {\n [styles.labelAnimation]: !noLabelAnimation\n })}\n />\n </span>\n {text && (\n <Text\n element=\"span\"\n type=\"text2\"\n className={labelClassName}\n data-testid={getTestId(ComponentDefaultTestId.RADIO_BUTTON_LABEL, id)}\n >\n {text}\n </Text>\n )}\n {children && (\n <Clickable onClick={onChildClick} tabIndex={childrenTabIndex}>\n {children}\n </Clickable>\n )}\n </label>\n </Tooltip>\n );\n }\n);\n\nexport default RadioButton;\n"],"names":["RadioButton","forwardRef","_ref","ref","className","_ref$text","text","_ref$value","value","_ref$name","name","labelClassName","radioButtonClassName","_ref$disabled","disabled","autoFocus","disabledReason","_ref$defaultChecked","defaultChecked","children","onSelect","checked","_ref$retainChildClick","retainChildClick","_ref$childrenTabIndex","childrenTabIndex","_ref$noLabelAnimation","noLabelAnimation","id","dataTestId","inputRef","useRef","mergedRef","useMergeRef","onChildClick","useCallback","current","checkedProps","useMemo","undefined","React","createElement","Tooltip","content","getTestId","ComponentDefaultTestId","RADIO_BUTTON","cx","styles","radioButton","_defineProperty","inputContainer","Object","assign","input","type","onChange","RADIO_BUTTON_CONTROL","control","labelAnimation","Text","element","RADIO_BUTTON_LABEL","Clickable","onClick","tabIndex"],"mappings":"4cA0EMA,IAAAA,EAAqEC,GACzE,SAAAC,EA2BEC,GACE,IA1BAC,EAASF,EAATE,UAASC,EAAAH,EACTI,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EACTM,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAP,EACVQ,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAITE,EAAcT,EAAdS,eAIAC,EAAoBV,EAApBU,qBAAoBC,EAAAX,EACpBY,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAASb,EAATa,UACAC,EAAcd,EAAdc,eAAcC,EAAAf,EACdgB,eAAAA,OAAiB,IAAHD,GAAQA,EACtBE,EAAQjB,EAARiB,SACAC,EAAQlB,EAARkB,SACAC,EAAOnB,EAAPmB,QAAOC,EAAApB,EACPqB,iBAAAA,OAAmB,IAAHD,GAAOA,EAAAE,EAAAtB,EACvBuB,iBAAAA,OAAmB,IAAHD,EAAG,IAAGA,EAAAE,EAAAxB,EACtByB,iBAAAA,OAAmB,IAAHD,GAAQA,EACxBE,EAAE1B,EAAF0B,GACeC,EAAU3B,EAAzB,eAII4B,EAAWC,IACXC,EAAYC,EAAY9B,EAAK2B,GAE7BI,EAAeC,GAAY,YAC3BrB,GAAaS,IACbO,EAASM,UACXN,EAASM,QAAQf,SAAU,GAEzBD,GACFA,EAAS,MAEZ,GAAE,CAACA,EAAUU,EAAUhB,EAAUS,IAE5Bc,EAAeC,GAAQ,WAC3B,YAAgBC,IAAZlB,EACK,CAAEA,QAAAA,GAEJ,CAAEH,eAAAA,EACX,GAAG,CAACG,EAASH,IAIb,OACEsB,EAACC,cAAAC,EAAQ,CAAAC,QAHY7B,EAAWE,EAAiB,MAI/CwB,EACeC,cAAA,QAAA,CAAA,cAAAZ,GAAce,EAAUC,EAAuBC,aAAclB,GAC1ExB,UAAW2C,EAAGC,EAAOC,YAAa7C,EAAS8C,EAAAA,EAAA,CAAA,EACxCF,EAAOlC,SAAWA,GAAQ,WACjBA,KAGZ0B,EAAAC,cAAA,OAAA,CAAMrC,UAAW2C,EAAGC,EAAOG,iBACzBX,EAAAC,cAAA,QAAAW,OAAAC,OAAA,CACEjD,UAAW2C,EAAGC,EAAOM,OACrBC,KAAK,QACL/C,MAAOA,EACPE,KAAMA,EACNK,UAAWA,EACXD,SAAUA,GACNuB,EAAY,CAChBmB,SAAUpC,EACVjB,IAAK6B,KAEPQ,EAAAC,cAAA,OAAA,CAAA,cACeG,EAAUC,EAAuBY,qBAAsB7B,GACpExB,UAAW2C,EAAGC,EAAOU,QAAS9C,EAAoBsC,KAC/CF,EAAOW,gBAAkBhC,OAI/BrB,GACCkC,EAACC,cAAAmB,EACC,CAAAC,QAAQ,OACRN,KAAK,QACLnD,UAAWO,EACE,cAAAiC,EAAUC,EAAuBiB,mBAAoBlC,IAEjEtB,GAGJa,GACCqB,EAAAC,cAACsB,EAAU,CAAAC,QAAS9B,EAAc+B,SAAUxC,GACzCN,IAMb"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.js","sources":["../../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { FC } from \"react\";\nimport {\n SKELETON_SIZES,\n SkeletonType as SkeletonTypeEnum,\n SKELETON_CUSTOM_SIZE,\n TextSkeletonSize as TextSkeletonSizeEnum\n} from \"./SkeletonConstants\";\n\nimport { SkeletonType, SkeletonSizeType } from \"./Skelton.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./Skeleton.module.scss\";\n\nexport interface SkeletonProps extends VibeComponentProps {\n type?: SkeletonType;\n size?: SkeletonSizeType;\n width?: number;\n height?: number;\n wrapperClassName?: string;\n /**\n *
|
|
1
|
+
{"version":3,"file":"Skeleton.js","sources":["../../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { FC } from \"react\";\nimport {\n SKELETON_SIZES,\n SkeletonType as SkeletonTypeEnum,\n SKELETON_CUSTOM_SIZE,\n TextSkeletonSize as TextSkeletonSizeEnum\n} from \"./SkeletonConstants\";\n\nimport { SkeletonType, SkeletonSizeType } from \"./Skelton.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./Skeleton.module.scss\";\n\nexport interface SkeletonProps extends VibeComponentProps {\n /**\n * The type of skeleton.\n */\n type?: SkeletonType;\n /**\n * The predefined size of the skeleton.\n */\n size?: SkeletonSizeType;\n /**\n * The width of the skeleton in pixels.\n */\n width?: number;\n /**\n * The height of the skeleton in pixels.\n */\n height?: number;\n /**\n * Class name applied to the wrapper element.\n */\n wrapperClassName?: string;\n /**\n * If true, the skeleton will take up the full width of its container.\n */\n fullWidth?: boolean;\n}\n\nconst Skeleton: FC<SkeletonProps> & {\n types?: typeof SkeletonTypeEnum;\n sizes?: typeof SKELETON_SIZES;\n} = ({\n type = \"rectangle\",\n size = \"custom\",\n className,\n wrapperClassName,\n width,\n height,\n fullWidth = false,\n id,\n \"data-testid\": dataTestId\n}) => {\n const skeletonType = (Object.values(SkeletonTypeEnum) as string[]).includes(type) ? type : \"rectangle\";\n\n // Skeleton has sizes only for text type, other types support only custom size\n const skeletonSize = (Object.values(TextSkeletonSizeEnum) as string[]).includes(size) ? size : SKELETON_CUSTOM_SIZE;\n\n return (\n <div\n id={id}\n className={cx(styles.skeleton, wrapperClassName, { [styles.fullWidth]: fullWidth })}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.SKELETON, id)}\n >\n <div\n className={cx(styles[skeletonType], getStyle(styles, camelCase(skeletonType + \"-\" + skeletonSize)), className, {\n [styles.fullWidth]: fullWidth\n })}\n style={{ width, height }}\n />\n </div>\n );\n};\n\nexport default withStaticProps(Skeleton, {\n types: SkeletonTypeEnum,\n sizes: SKELETON_SIZES\n});\n"],"names":["withStaticProps","_ref","_ref$type","type","_ref$size","size","className","wrapperClassName","width","height","_ref$fullWidth","fullWidth","id","dataTestId","skeletonType","Object","values","SkeletonTypeEnum","includes","skeletonSize","TextSkeletonSizeEnum","SKELETON_CUSTOM_SIZE","React","createElement","cx","styles","skeleton","_defineProperty","getTestId","ComponentDefaultTestId","SKELETON","getStyle","camelCase","style","types","sizes","SKELETON_SIZES"],"mappings":"qkBA2CA,IAmCeA,EAAAA,GAhCX,SAHUC,GAaT,IAAAC,EAAAD,EATHE,KAAAA,OAAO,IAAHD,EAAG,YAAWA,EAAAE,EAAAH,EAClBI,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAASL,EAATK,UACAC,EAAgBN,EAAhBM,iBACAC,EAAKP,EAALO,MACAC,EAAMR,EAANQ,OAAMC,EAAAT,EACNU,UAAAA,OAAY,IAAHD,GAAQA,EACjBE,EAAEX,EAAFW,GACeC,EAAUZ,EAAzB,eAEMa,EAAgBC,OAAOC,OAAOC,GAA+BC,SAASf,GAAQA,EAAO,YAGrFgB,EAAgBJ,OAAOC,OAAOI,GAAmCF,SAASb,GAAQA,EAAOgB,EAE/F,OACEC,EACEC,cAAA,MAAA,CAAAX,GAAIA,EACJN,UAAWkB,EAAGC,EAAOC,SAAUnB,EAAgBoB,KAAKF,EAAOd,UAAYA,IAC1D,cAAAE,GAAce,EAAUC,EAAuBC,SAAUlB,IAEtEU,EACEC,cAAA,MAAA,CAAAjB,UAAWkB,EAAGC,EAAOX,GAAeiB,EAASN,EAAQO,EAAUlB,EAAe,IAAMK,IAAgBb,EAASqB,EAC1GF,CAAAA,EAAAA,EAAOd,UAAYA,IAEtBsB,MAAO,CAAEzB,MAAAA,EAAOC,OAAAA,KAIxB,GAEyC,CACvCyB,MAAOjB,EACPkB,MAAOC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectionIndicator.js","sources":["../../../../../src/components/Slider/SelectionIndicator.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { debounce } from \"lodash-es\";\nimport TextField from \"../TextField/TextField\";\nimport { useSliderActions, useSliderSelection } from \"./SliderContext\";\nimport { InfixKind } from \"./Slider.types\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./SelectionIndicator.module.scss\";\n\nconst VALUE_UPDATE_DELAY = 300;\n\nfunction getCurrentLabel(isPostfix: boolean, ranged: boolean, value: number | number[], valueText: string | string[]) {\n if (!ranged) {\n return [value as number, valueText as string];\n }\n if (isPostfix) {\n return [(value as number[])[1], (valueText as string[])[1]];\n }\n return [(value as number[])[0], (valueText as string[])[0]];\n}\n\nfunction parseValue(valueText: string) {\n return valueText.replace(/\\D/g, \"\");\n}\n\nexport interface SelectionIndicatorProps extends VibeComponentProps {\n kind?: InfixKind;\n key?: InfixKind;\n}\n\nconst SelectionIndicator: React.FC<SelectionIndicatorProps> = ({ kind = \"prefix\" }) => {\n const isPostfix = kind === \"postfix\";\n const { ranged, value, valueText } = useSliderSelection();\n const [, currentTextValue] = getCurrentLabel(isPostfix, ranged, value, valueText);\n const { changeThumbValue } = useSliderActions();\n const handleChange = useMemo(\n () =>\n debounce(newValueText => {\n const newValue = parseValue(newValueText);\n const thumbIndex = isPostfix ? 1 : 0;\n changeThumbValue(newValue, thumbIndex, true);\n }, VALUE_UPDATE_DELAY),\n [changeThumbValue, isPostfix]\n );\n return <TextField onChange={handleChange} value={String(currentTextValue)} className={styles.selectionIndicator} />;\n};\n\nexport default SelectionIndicator;\n"],"names":["SelectionIndicator","_ref","_ref$kind","kind","isPostfix","_useSliderSelection","useSliderSelection","_getCurrentLabel","ranged","value","valueText","getCurrentLabel","currentTextValue","_slicedToArray","changeThumbValue","useSliderActions","handleChange","useMemo","debounce","newValueText","newValue","replace","parseValue","React","createElement","TextField","onChange","String","className","styles","selectionIndicator"],"mappings":"
|
|
1
|
+
{"version":3,"file":"SelectionIndicator.js","sources":["../../../../../src/components/Slider/SelectionIndicator.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { debounce } from \"lodash-es\";\nimport TextField from \"../TextField/TextField\";\nimport { useSliderActions, useSliderSelection } from \"./SliderContext\";\nimport { InfixKind } from \"./Slider.types\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./SelectionIndicator.module.scss\";\n\nconst VALUE_UPDATE_DELAY = 300;\n\nfunction getCurrentLabel(isPostfix: boolean, ranged: boolean, value: number | number[], valueText: string | string[]) {\n if (!ranged) {\n return [value as number, valueText as string];\n }\n if (isPostfix) {\n return [(value as number[])[1], (valueText as string[])[1]];\n }\n return [(value as number[])[0], (valueText as string[])[0]];\n}\n\nfunction parseValue(valueText: string) {\n return valueText.replace(/\\D/g, \"\");\n}\n\nexport interface SelectionIndicatorProps extends VibeComponentProps {\n /**\n * Determines whether the selection indicator is a prefix or postfix.\n */\n kind?: InfixKind;\n /**\n * The key for the selection indicator (used for React key uniqueness).\n */\n key?: InfixKind;\n}\n\nconst SelectionIndicator: React.FC<SelectionIndicatorProps> = ({ kind = \"prefix\" }) => {\n const isPostfix = kind === \"postfix\";\n const { ranged, value, valueText } = useSliderSelection();\n const [, currentTextValue] = getCurrentLabel(isPostfix, ranged, value, valueText);\n const { changeThumbValue } = useSliderActions();\n const handleChange = useMemo(\n () =>\n debounce(newValueText => {\n const newValue = parseValue(newValueText);\n const thumbIndex = isPostfix ? 1 : 0;\n changeThumbValue(newValue, thumbIndex, true);\n }, VALUE_UPDATE_DELAY),\n [changeThumbValue, isPostfix]\n );\n return <TextField onChange={handleChange} value={String(currentTextValue)} className={styles.selectionIndicator} />;\n};\n\nexport default SelectionIndicator;\n"],"names":["SelectionIndicator","_ref","_ref$kind","kind","isPostfix","_useSliderSelection","useSliderSelection","_getCurrentLabel","ranged","value","valueText","getCurrentLabel","currentTextValue","_slicedToArray","changeThumbValue","useSliderActions","handleChange","useMemo","debounce","newValueText","newValue","replace","parseValue","React","createElement","TextField","onChange","String","className","styles","selectionIndicator"],"mappings":"iUAmCA,IAAMA,EAAwD,SAAtCC,GAA8D,IAAAC,EAAAD,EAArBE,KACzDC,EAAqB,kBAD2C,IAAHF,EAAG,SAAQA,GAE9EG,EAAqCC,IACrCC,EA5BF,SAAyBH,EAAoBI,EAAiBC,EAA0BC,GACtF,OAAKF,EAGDJ,EACK,CAAEK,EAAmB,GAAKC,EAAuB,IAEnD,CAAED,EAAmB,GAAKC,EAAuB,IAL/C,CAACD,EAAiBC,EAM7B,CAoB+BC,CAAgBP,EAD/BC,EAANG,OAAaH,EAALI,MAAgBJ,EAATK,WACdE,EAAwEC,EAAAN,EAAA,GAAxD,GACjBO,EAAqBC,IAArBD,iBACFE,EAAeC,GACnB,WAAA,OACEC,GAAS,SAAAC,GACP,IAAMC,EAvBd,SAAoBV,GAClB,OAAOA,EAAUW,QAAQ,MAAO,GAClC,CAqByBC,CAAWH,GAE5BL,EAAiBM,EADEhB,EAAY,EAAI,GACI,EACxC,GAtCoB,IAsCC,GACxB,CAACU,EAAkBV,IAErB,OAAOmB,EAAAC,cAACC,EAAU,CAAAC,SAAUV,EAAcP,MAAcG,EAAPe,GAA0BC,UAAWC,EAAOC,oBAC/F"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderFilledTrack.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderFilledTrack.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./SliderFilledTrack.module.scss\";\nimport { SliderColor } from \"../Slider.types\";\n\nfunction defineFilledTrackProps(dimension: number, offset: number, reverse: boolean) {\n if (reverse) {\n return {\n right: `${offset}%`,\n width: `${dimension - offset}%`\n };\n }\n return {\n left: `${offset}%`,\n width: `${dimension - offset}%`\n };\n}\n\nexport interface SliderFilledTrackProps extends VibeComponentProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"SliderFilledTrack.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderFilledTrack.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./SliderFilledTrack.module.scss\";\nimport { SliderColor } from \"../Slider.types\";\n\nfunction defineFilledTrackProps(dimension: number, offset: number, reverse: boolean) {\n if (reverse) {\n return {\n right: `${offset}%`,\n width: `${dimension - offset}%`\n };\n }\n return {\n left: `${offset}%`,\n width: `${dimension - offset}%`\n };\n}\n\nexport interface SliderFilledTrackProps extends VibeComponentProps {\n /**\n * The size of the filled track, based on the selected value.\n */\n dimension?: number;\n /**\n * The offset from the start of the track.\n */\n offset?: number;\n /**\n * If true, the filled track starts from the end instead of the beginning.\n */\n reverse?: boolean;\n /**\n * The color of the filled track.\n */\n color: SliderColor;\n}\n\nconst SliderFilledTrack: FC<SliderFilledTrackProps> = ({\n className,\n dimension = 0,\n offset = 0,\n reverse = false,\n color\n}) => {\n const filledTrackStyle = defineFilledTrackProps(dimension, offset, reverse);\n return <div className={cx(styles.filledTrack, getStyle(styles, color), className)} style={filledTrackStyle} />;\n};\n\nexport default SliderFilledTrack;\n"],"names":["SliderFilledTrack","_ref","className","_ref$dimension","dimension","_ref$offset","offset","_ref$reverse","reverse","color","filledTrackStyle","right","concat","width","left","defineFilledTrackProps","React","createElement","cx","styles","filledTrack","getStyle","style"],"mappings":"0KAuCA,IAAMA,EAAgD,SAA/BC,GAMlB,IALHC,EAASD,EAATC,UAASC,EAAAF,EACTG,UAAaC,EAAAJ,EACbK,OAAUC,EAAAN,EACVO,QACAC,EAAKR,EAALQ,MAEMC,EAvCR,SAAgCN,EAAmBE,EAAgBE,GACjE,OAAIA,EACK,CACLG,MAAKC,GAAAA,OAAKN,EAAS,KACnBO,MAAKD,GAAAA,OAAKR,EAAYE,EAAM,MAGzB,CACLQ,KAAIF,GAAAA,OAAKN,EAAS,KAClBO,MAAKD,GAAAA,OAAKR,EAAYE,EAAM,KAEhC,CA4B2BS,MALb,IAAHZ,EAAG,EAACA,OACJ,IAAHE,EAAG,EAACA,OACA,IAAHE,GAAQA,GAIf,OAAOS,EAAAC,cAAA,MAAA,CAAKf,UAAWgB,EAAGC,EAAOC,YAAaC,EAASF,EAAQV,GAAQP,GAAYoB,MAAOZ,GAC5F"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderRail.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderRail.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef, ReactElement } from \"react\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport { useSliderUi } from \"../SliderContext\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { VibeComponent } from \"../../../types\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./SliderRail.module.scss\";\nimport { SliderSize } from \"../Slider.types\";\n\nexport interface SliderRailProps extends VibeComponentProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"SliderRail.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderRail.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef, ReactElement } from \"react\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport { useSliderUi } from \"../SliderContext\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { VibeComponent } from \"../../../types\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./SliderRail.module.scss\";\nimport { SliderSize } from \"../Slider.types\";\n\nexport interface SliderRailProps extends VibeComponentProps {\n /**\n * Callback fired when the rail is clicked.\n */\n onClick?: (event: React.MouseEvent) => void;\n /**\n * The child elements inside the slider rail.\n */\n children?: ReactElement | ReactElement[];\n /**\n * The size of the slider rail.\n */\n size: SliderSize;\n}\n\nconst SliderRail: VibeComponent<SliderRailProps, unknown> = forwardRef<unknown, SliderRailProps>(\n ({ className, children, onClick = NOOP, size }: SliderRailProps, ref: ForwardedRef<HTMLDivElement>) => {\n const { shapeTestId } = useSliderUi();\n function handleClick(e: React.MouseEvent) {\n onClick(e);\n }\n\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n <div\n data-testid={shapeTestId(\"rail\")}\n className={cx(styles.rail, getStyle(styles, size), className)}\n onClick={handleClick}\n ref={ref}\n >\n {children}\n </div>\n );\n }\n);\n\nexport default SliderRail;\n"],"names":["SliderRail","forwardRef","_ref","ref","className","children","_ref$onClick","onClick","NOOP","size","_useSliderUi","useSliderUi","React","createElement","shapeTestId","cx","styles","rail","getStyle","e"],"mappings":"8RAyBMA,IAAAA,EAAsDC,GAC1D,SAAAC,EAAiEC,GAAqC,IAAnGC,EAASF,EAATE,UAAWC,EAAQH,EAARG,SAAQC,EAAAJ,EAAEK,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAEG,EAAIP,EAAJO,KACtCC,EAAwBC,IAKxB,OAEEC,EAAAC,cAAA,MAAA,CAAA,eACeC,EAREJ,EAAXI,aAQqB,QACzBV,UAAWW,EAAGC,EAAOC,KAAMC,EAASF,EAAQP,GAAOL,GACnDG,QATJ,SAAqBY,GACnBZ,EAAQY,EACV,EAQIhB,IAAKA,GAEJE,EAGP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderThumb.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderThumb.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef } from \"react\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport Tooltip from \"../../Tooltip/Tooltip\";\nimport { TOOLTIP_SHOW_DELAY } from \"../SliderConstants\";\nimport { useSliderActions, useSliderSelection, useSliderUi } from \"../SliderContext\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport styles from \"./SliderThumb.module.scss\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { SliderColor, SliderSize } from \"../Slider.types\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface SliderThumbProps extends VibeComponentProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"SliderThumb.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderThumb.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef } from \"react\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport Tooltip from \"../../Tooltip/Tooltip\";\nimport { TOOLTIP_SHOW_DELAY } from \"../SliderConstants\";\nimport { useSliderActions, useSliderSelection, useSliderUi } from \"../SliderContext\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport styles from \"./SliderThumb.module.scss\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { SliderColor, SliderSize } from \"../Slider.types\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface SliderThumbProps extends VibeComponentProps {\n /**\n * The index of the thumb (used in range sliders).\n */\n index?: number;\n /**\n * Callback fired when the thumb is moved.\n */\n onMove?: (event: PointerEvent) => void;\n /**\n * The position of the thumb, represented as an offset percentage from the start of the track.\n */\n position?: number;\n /**\n * The size of the slider thumb.\n */\n size: SliderSize;\n /**\n * The color theme of the slider thumb.\n */\n color: SliderColor;\n}\n\nconst SliderThumb: FC<SliderThumbProps> = ({ className, index = 0, onMove = NOOP, position = 0, size, color }) => {\n const { max, min, ranged, value: valueOrValues, valueText: valueOrValuesText } = useSliderSelection();\n const value = ranged ? (valueOrValues as unknown as number[])[index] : (valueOrValues as number);\n const valueText = ranged ? (valueOrValuesText as unknown as string[])[index] : (valueOrValuesText as string);\n const {\n active,\n ariaLabel,\n ariaLabelledby,\n disabled,\n dragging,\n focused,\n shapeTestId,\n showValue,\n valueLabelPosition,\n valueLabelColor\n } = useSliderUi();\n const { setActive, setFocused, setDragging } = useSliderActions();\n const ref = useRef(null);\n\n function handleBlur() {\n setFocused(null);\n setActive(null);\n }\n\n function handleFocus() {\n setFocused(index);\n setActive(index);\n }\n\n function handlePointerLeave() {\n setActive(null);\n }\n\n function handlePointerDown(e: React.PointerEvent) {\n e.stopPropagation();\n setDragging(index);\n document.addEventListener(\"pointermove\", onMove);\n document.addEventListener(\"pointerup\", stopMove);\n }\n\n function stopMove() {\n setDragging(null);\n document.removeEventListener(\"pointermove\", onMove);\n document.removeEventListener(\"pointerup\", stopMove);\n }\n\n useEffect(() => {\n if (focused === index && ref && ref.current) {\n ref.current.focus();\n }\n }, [focused, index]);\n\n return (\n <Tooltip\n open={active === index || dragging === index}\n content={showValue ? null : valueText}\n position=\"top\"\n showDelay={TOOLTIP_SHOW_DELAY}\n addKeyboardHideShowTriggersByDefault={false}\n >\n <div\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n aria-valuemax={max}\n aria-valuemin={min}\n aria-valuenow={value}\n aria-valuetext={valueText}\n aria-disabled={disabled}\n className={cx(\n styles.thumb,\n getStyle(styles, color),\n getStyle(styles, size),\n {\n [styles.dragging]: dragging === index,\n [styles.focused]: focused,\n [styles.notDisabledThumb]: !disabled\n },\n className\n )}\n data-testid={shapeTestId(`thumb-${index}`)}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onPointerDown={handlePointerDown}\n onPointerLeave={handlePointerLeave}\n ref={ref}\n role=\"slider\"\n style={{ left: `${position}%` }}\n tabIndex={disabled ? -1 : 0}\n >\n {showValue && (\n <label\n className={cx(\n styles.label,\n getStyle(styles, camelCase(\"color-\" + valueLabelColor)),\n getStyle(styles, camelCase(\"position-\" + valueLabelPosition))\n )}\n >\n {valueText}\n </label>\n )}\n </div>\n </Tooltip>\n );\n};\n\nexport default SliderThumb;\n"],"names":["SliderThumb","_ref","className","_ref$index","index","_ref$onMove","onMove","NOOP","_ref$position","position","size","color","_useSliderSelection","useSliderSelection","max","min","ranged","valueOrValues","value","valueOrValuesText","valueText","_useSliderUi","useSliderUi","active","ariaLabel","ariaLabelledby","disabled","dragging","focused","shapeTestId","showValue","valueLabelPosition","valueLabelColor","_useSliderActions","useSliderActions","setActive","setFocused","setDragging","ref","useRef","stopMove","document","removeEventListener","useEffect","current","focus","React","createElement","Tooltip","open","content","showDelay","TOOLTIP_SHOW_DELAY","addKeyboardHideShowTriggersByDefault","cx","styles","thumb","getStyle","_defineProperty","notDisabledThumb","concat","onFocus","onBlur","onPointerDown","e","stopPropagation","addEventListener","onPointerLeave","role","style","left","tabIndex","label","camelCase"],"mappings":"ojBAmCA,IAAMA,EAAoC,SAAzBC,GAAgG,IAApEC,EAASD,EAATC,UAASC,EAAAF,EAAEG,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAJ,EAAEK,OAAAA,OAASC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAP,EAAEQ,SAAAA,OAAW,IAAHD,EAAG,EAACA,EAAEE,EAAIT,EAAJS,KAAMC,EAAKV,EAALU,MACpGC,EAAiFC,IAAzEC,EAAGF,EAAHE,IAAKC,EAAGH,EAAHG,IAAKC,EAAMJ,EAANI,OAAeC,EAAaL,EAApBM,MAAiCC,EAAiBP,EAA5BQ,UAC1CF,EAAQF,EAAUC,EAAsCb,GAAUa,EAClEG,EAAYJ,EAAUG,EAA0Cf,GAAUe,EAChFE,EAWIC,IAVFC,EAAMF,EAANE,OACAC,EAASH,EAATG,UACAC,EAAcJ,EAAdI,eACAC,EAAQL,EAARK,SACAC,EAAQN,EAARM,SACAC,EAAOP,EAAPO,QACAC,EAAWR,EAAXQ,YACAC,EAAST,EAATS,UACAC,EAAkBV,EAAlBU,mBACAC,EAAeX,EAAfW,gBAEFC,EAA+CC,IAAvCC,EAASF,EAATE,UAAWC,EAAUH,EAAVG,WAAYC,EAAWJ,EAAXI,YACzBC,EAAMC,EAAO,MAuBnB,SAASC,IACPH,EAAY,MACZI,SAASC,oBAAoB,cAAepC,GAC5CmC,SAASC,oBAAoB,YAAaF,EAC5C,CAQA,OANAG,GAAU,WACJf,IAAYxB,GAASkC,GAAOA,EAAIM,SAClCN,EAAIM,QAAQC,OAEhB,GAAG,CAACjB,EAASxB,IAGX0C,EAACC,cAAAC,EACC,CAAAC,KAAM1B,IAAWnB,GAASuB,IAAavB,EACvC8C,QAASpB,EAAY,KAAOV,EAC5BX,SAAS,MACT0C,UAAWC,EACXC,sCAAsC,GAEtCP,EAAAC,cAAA,MAAA,CAAA,aACcvB,EAAS,kBACJC,EAAc,gBAChBX,EACA,gBAAAC,EACA,gBAAAG,mBACCE,EAAS,gBACVM,EACfxB,UAAWoD,EACTC,EAAOC,MACPC,EAASF,EAAQ5C,GACjB8C,EAASF,EAAQ7C,GAAKgD,EAAAA,EAAAA,EAAA,CAAA,EAEnBH,EAAO5B,SAAWA,IAAavB,GAC/BmD,EAAO3B,QAAUA,GACjB2B,EAAOI,kBAAoBjC,GAE9BxB,GAEW,cAAA2B,EAAW,SAAA+B,OAAUxD,IAClCyD,QAxDN,WACEzB,EAAWhC,GACX+B,EAAU/B,EACZ,EAsDM0D,OA9DN,WACE1B,EAAW,MACXD,EAAU,KACZ,EA4DM4B,cAjDN,SAA2BC,GACzBA,EAAEC,kBACF5B,EAAYjC,GACZqC,SAASyB,iBAAiB,cAAe5D,GACzCmC,SAASyB,iBAAiB,YAAa1B,EACzC,EA6CM2B,eAtDN,WACEhC,EAAU,KACZ,EAqDMG,IAAKA,EACL8B,KAAK,SACLC,MAAO,CAAEC,KAAI,GAAAV,OAAKnD,EAAQ,MAC1B8D,SAAU7C,GAAY,EAAI,GAEzBI,GACCgB,EAAAC,cAAA,QAAA,CACE7C,UAAWoD,EACTC,EAAOiB,MACPf,EAASF,EAAQkB,EAAU,SAAWzC,IACtCyB,EAASF,EAAQkB,EAAU,YAAc1C,MAG1CX,IAMb"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderTrack.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderTrack.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./SliderTrack.module.scss\";\nimport { SliderColor } from \"../Slider.types\";\n\nexport interface SliderTrackProps extends VibeComponentProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"SliderTrack.js","sources":["../../../../../../src/components/Slider/SliderBase/SliderTrack.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./SliderTrack.module.scss\";\nimport { SliderColor } from \"../Slider.types\";\n\nexport interface SliderTrackProps extends VibeComponentProps {\n /**\n * The color of the slider track.\n */\n color: SliderColor;\n}\n\nconst SliderTrack: FC<SliderTrackProps> = React.memo(({ className, color }) => {\n return <div className={cx(styles.track, getStyle(styles, color), className)} />;\n});\n\nexport default SliderTrack;\n"],"names":["SliderTrack","React","memo","_ref","className","cx","styles","track","getStyle","color"],"mappings":"oKAcMA,IAAAA,EAAoCC,EAAMC,MAAK,SAAAC,GAAyB,IAAtBC,EAASD,EAATC,UACtD,OAAOH,uBAAKG,UAAWC,EAAGC,EAAOC,MAAOC,EAASF,EADqBH,EAALM,OACAL,IACnE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderContext.js","sources":["../../../../../src/components/Slider/SliderContext.tsx"],"sourcesContent":["import React, { createContext, ReactElement, useContext, useMemo, useState } from \"react\";\nimport { createTestIdHelper } from \"../../helpers/testid-helper\";\nimport { useDragging, useSliderActionsContextValue, useSliderValues } from \"./SliderHooks\";\nimport { SliderProps } from \"./Slider\";\nimport { SliderContextActions, SliderContextInfix, SliderContextSelection, SliderContextUI } from \"./SliderConstants\";\nimport { IconType } from \"../Icon\";\n\nconst UiContext = createContext({});\nconst SelectionContext = createContext({});\nconst ActionsContext = createContext({});\nconst InfixContext = createContext({});\n\nexport interface SliderProviderProps extends SliderProps {\n children?: ReactElement | ReactElement[];\n infixOptions?: {\n /**\n *
|
|
1
|
+
{"version":3,"file":"SliderContext.js","sources":["../../../../../src/components/Slider/SliderContext.tsx"],"sourcesContent":["import React, { createContext, ReactElement, useContext, useMemo, useState } from \"react\";\nimport { createTestIdHelper } from \"../../helpers/testid-helper\";\nimport { useDragging, useSliderActionsContextValue, useSliderValues } from \"./SliderHooks\";\nimport { SliderProps } from \"./Slider\";\nimport { SliderContextActions, SliderContextInfix, SliderContextSelection, SliderContextUI } from \"./SliderConstants\";\nimport { IconType } from \"../Icon\";\n\nconst UiContext = createContext({});\nconst SelectionContext = createContext({});\nconst ActionsContext = createContext({});\nconst InfixContext = createContext({});\n\nexport interface SliderProviderProps extends SliderProps {\n /**\n * The child elements inside the slider provider.\n */\n children?: ReactElement | ReactElement[];\n /**\n * Configuration options for prefix, postfix, and selection indicator.\n */\n infixOptions?: {\n /**\n * If true, displays the selected value from the slider range.\n */\n indicateSelection?: boolean;\n /**\n * Configuration for the prefix (start) element, which can be:\n * - A React component, text, number, or node.\n * - An object with an icon.\n * - A function that receives the value and valueText.\n */\n prefix?: { icon: IconType } | string | ((value: number, valueText: string) => void) | ReactElement;\n /**\n * Configuration for the postfix (end) element, similar to prefix.\n */\n postfix?: { icon: IconType } | string | ((value: number, valueText: string) => void) | ReactElement;\n /**\n * The width of the selection indicator.\n */\n selectionIndicatorWidth?: string;\n };\n}\n\nexport function SliderProvider({\n children,\n ariaLabel,\n ariaLabelledby,\n color,\n \"data-testid\": dataTestId,\n defaultValue,\n disabled,\n max,\n min,\n onChange,\n ranged,\n showValue,\n valueLabelPosition,\n valueLabelColor,\n size,\n step,\n value,\n valueFormatter,\n valueText,\n infixOptions\n}: SliderProviderProps) {\n const shapeTestId = createTestIdHelper(dataTestId);\n const { actualValue, actualValueText, getSelectedValue, setSelectedValue } = useSliderValues(\n defaultValue,\n value,\n valueFormatter,\n valueText\n );\n\n const [active, setActive] = useState<number>(null);\n const [focused, setFocused] = useState<number>(null);\n const [dragging, setDragging, getDragging] = useDragging();\n\n const uiContextValue: SliderContextUI = useMemo(\n () => ({\n active,\n ariaLabel,\n ariaLabelledby,\n color,\n disabled,\n dragging,\n focused,\n size,\n shapeTestId,\n showValue,\n valueLabelPosition,\n valueLabelColor\n }),\n [\n active,\n ariaLabel,\n ariaLabelledby,\n color,\n disabled,\n dragging,\n focused,\n size,\n shapeTestId,\n showValue,\n valueLabelPosition,\n valueLabelColor\n ]\n );\n\n const selectionContextValue: SliderContextSelection = useMemo(\n () => ({\n max,\n min,\n ranged,\n step,\n value: actualValue,\n valueText: actualValueText\n }),\n [max, min, ranged, step, actualValue, actualValueText]\n );\n\n const actionsContextValue: SliderContextActions = useSliderActionsContextValue(\n actualValue,\n focused,\n getDragging,\n getSelectedValue,\n max,\n min,\n onChange,\n ranged,\n setActive,\n setFocused,\n setDragging,\n setSelectedValue,\n step\n );\n\n return (\n <UiContext.Provider value={uiContextValue}>\n <SelectionContext.Provider value={selectionContextValue}>\n <ActionsContext.Provider value={actionsContextValue}>\n <InfixContext.Provider value={infixOptions}>{children}</InfixContext.Provider>\n </ActionsContext.Provider>\n </SelectionContext.Provider>\n </UiContext.Provider>\n );\n}\n\nexport function useSliderUi(): SliderContextUI {\n return useContext(UiContext) as SliderContextUI;\n}\n\nexport function useSliderInfix(): SliderContextInfix {\n return useContext(InfixContext) as SliderContextInfix;\n}\n\nexport function useSliderSelection(): SliderContextSelection {\n return useContext(SelectionContext) as SliderContextSelection;\n}\n\nexport function useSliderActions(): SliderContextActions {\n return useContext(ActionsContext) as SliderContextActions;\n}\n"],"names":["UiContext","createContext","SelectionContext","ActionsContext","InfixContext","SliderProvider","_ref","children","ariaLabel","ariaLabelledby","color","defaultValue","disabled","max","min","onChange","ranged","showValue","valueLabelPosition","valueLabelColor","size","step","value","valueFormatter","valueText","infixOptions","shapeTestId","createTestIdHelper","_useSliderValues","useSliderValues","actualValue","actualValueText","getSelectedValue","setSelectedValue","_useState","useState","_useState2","_slicedToArray","active","setActive","_useState3","_useState4","focused","setFocused","_useDragging","useDragging","_useDragging2","dragging","setDragging","getDragging","uiContextValue","useMemo","selectionContextValue","actionsContextValue","useSliderActionsContextValue","React","Provider","createElement","useSliderUi","useContext","useSliderInfix","useSliderSelection","useSliderActions"],"mappings":"6UAOA,IAAMA,EAAYC,EAAc,CAAA,GAC1BC,EAAmBD,EAAc,CAAA,GACjCE,EAAiBF,EAAc,CAAA,GAC/BG,EAAeH,EAAc,CAAA,GAiC7B,SAAUI,EAAcC,GAqBR,IApBpBC,EAAQD,EAARC,SACAC,EAASF,EAATE,UACAC,EAAcH,EAAdG,eACAC,EAAKJ,EAALI,MAEAC,EAAYL,EAAZK,aACAC,EAAQN,EAARM,SACAC,EAAGP,EAAHO,IACAC,EAAGR,EAAHQ,IACAC,EAAQT,EAARS,SACAC,EAAMV,EAANU,OACAC,EAASX,EAATW,UACAC,EAAkBZ,EAAlBY,mBACAC,EAAeb,EAAfa,gBACAC,EAAId,EAAJc,KACAC,EAAIf,EAAJe,KACAC,EAAKhB,EAALgB,MACAC,EAAcjB,EAAdiB,eACAC,EAASlB,EAATkB,UACAC,EAAYnB,EAAZmB,aAEMC,EAAcC,EAjBKrB,EAAzB,gBAkBAsB,EAA6EC,EAC3ElB,EACAW,EACAC,EACAC,GAJMM,EAAWF,EAAXE,YAAaC,EAAeH,EAAfG,gBAAiBC,EAAgBJ,EAAhBI,iBAAkBC,EAAgBL,EAAhBK,iBAOxDC,EAA4BC,EAAiB,MAAKC,EAAAC,EAAAH,EAAA,GAA3CI,EAAMF,EAAA,GAAEG,EAASH,EAAA,GACxBI,EAA8BL,EAAiB,MAAKM,EAAAJ,EAAAG,EAAA,GAA7CE,EAAOD,EAAA,GAAEE,EAAUF,EAAA,GAC1BG,EAA6CC,IAAaC,EAAAT,EAAAO,EAAA,GAAnDG,EAAQD,EAAA,GAAEE,EAAWF,EAAA,GAAEG,EAAWH,EAAA,GAEnCI,EAAkCC,GACtC,WAAA,MAAO,CACLb,OAAAA,EACA9B,UAAAA,EACAC,eAAAA,EACAC,MAAAA,EACAE,SAAAA,EACAmC,SAAAA,EACAL,QAAAA,EACAtB,KAAAA,EACAM,YAAAA,EACAT,UAAAA,EACAC,mBAAAA,EACAC,gBAAAA,EACA,GACF,CACEmB,EACA9B,EACAC,EACAC,EACAE,EACAmC,EACAL,EACAtB,EACAM,EACAT,EACAC,EACAC,IAIEiC,EAAgDD,GACpD,WAAA,MAAO,CACLtC,IAAAA,EACAC,IAAAA,EACAE,OAAAA,EACAK,KAAAA,EACAC,MAAOQ,EACPN,UAAWO,EACZ,GACD,CAAClB,EAAKC,EAAKE,EAAQK,EAAMS,EAAaC,IAGlCsB,EAA4CC,EAChDxB,EACAY,EACAO,EACAjB,EACAnB,EACAC,EACAC,EACAC,EACAuB,EACAI,EACAK,EACAf,EACAZ,GAGF,OACEkC,gBAACvD,EAAUwD,SAAS,CAAAlC,MAAO4B,GACzBK,EAAAE,cAACvD,EAAiBsD,SAAS,CAAAlC,MAAO8B,GAChCG,EAAAE,cAACtD,EAAeqD,SAAS,CAAAlC,MAAO+B,GAC9BE,EAAAE,cAACrD,EAAaoD,SAAQ,CAAClC,MAAOG,GAAelB,KAKvD,UAEgBmD,IACd,OAAOC,EAAW3D,EACpB,UAEgB4D,IACd,OAAOD,EAAWvD,EACpB,UAEgByD,IACd,OAAOF,EAAWzD,EACpB,UAEgB4D,IACd,OAAOH,EAAWxD,EACpB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderInfix.js","sources":["../../../../../src/components/Slider/SliderInfix.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { InfixKind as InfixKindEnum } from \"./SliderConstants\";\nimport { useSliderInfixComponent } from \"./SliderInfixHooks\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./SliderInfix.module.scss\";\nimport { InfixKind } from \"./Slider.types\";\n\nexport interface SliderInfixProps extends VibeComponentProps {\n /**\n *
|
|
1
|
+
{"version":3,"file":"SliderInfix.js","sources":["../../../../../src/components/Slider/SliderInfix.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { InfixKind as InfixKindEnum } from \"./SliderConstants\";\nimport { useSliderInfixComponent } from \"./SliderInfixHooks\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./SliderInfix.module.scss\";\nimport { InfixKind } from \"./Slider.types\";\n\nexport interface SliderInfixProps extends VibeComponentProps {\n /**\n * Specifies the type of infix (prefix or postfix).\n */\n kind?: InfixKind;\n}\n\nconst SliderInfix: FC<SliderInfixProps> & { kinds?: typeof InfixKindEnum } = ({ kind = SliderInfix.kinds.PREFIX }) => {\n const [isShow, modificators, InfixComponent, inlineStyle] = useSliderInfixComponent(kind);\n return (\n isShow && (\n <div\n className={cx(\n styles.infix,\n getStyle(styles, kind),\n modificators.map(m => getStyle(styles, m))\n )}\n style={inlineStyle}\n >\n {InfixComponent}\n </div>\n )\n );\n};\n\nexport default withStaticProps(SliderInfix, {\n kinds: InfixKindEnum\n});\n"],"names":["withStaticProps","SliderInfix","_ref","_ref$kind","kind","kinds","PREFIX","_useSliderInfixCompon","useSliderInfixComponent","_useSliderInfixCompon2","_slicedToArray","modificators","InfixComponent","inlineStyle","React","className","cx","styles","infix","getStyle","map","m","style","InfixKindEnum"],"mappings":"ycAgBA,IAkBeA,EAAAA,GAlB8D,SAAvEC,EAAWC,GAAoG,IAAAC,EAAAD,EAArCE,KAAAA,OAAOH,IAAHE,EAAGF,EAAYI,MAAMC,OAAMH,EAC7GI,EAA4DC,EAAwBJ,GAAKK,EAAAC,EAAAH,EAAA,GAA1EI,EAAYF,EAAA,GAAEG,EAAcH,EAAA,GAAEI,EAAWJ,EAAA,GACxD,OADaA,EAAA,IAGTK,uBACEC,UAAWC,EACTC,EAAOC,MACPC,EAASF,EAAQb,GACjBO,EAAaS,KAAI,SAAAC,GAAC,OAAIF,EAASF,EAAQI,EAAE,KAE3CC,MAAOT,GAEND,EAIT,GAE4C,CAC1CP,MAAOkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SplitButton.js","sources":["../../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\n// Libraries import\nimport React, { FC, ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\n// Constants import\nimport {\n DEFAULT_DIALOG_HIDE_TRIGGER,\n DEFAULT_DIALOG_SHOW_TRIGGER,\n DIALOG_MOVE_BY,\n ENTER_KEYS,\n SECONDARY_BUTTON_ARIA_LABEL,\n SECONDARY_BUTTON_WRAPPER_CLASSNAME,\n SplitButtonSecondaryContentPosition,\n SplitButtonSecondaryContentPositionType\n} from \"./SplitButtonConstants\";\nimport { withStaticProps } from \"../../types\";\nimport { AnimationType, DialogPosition, HideShowEvent } from \"../Dialog/DialogConstants\";\n// Utils import\nimport { NOOP } from \"../../utils/function-utils\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\n// Hooks import\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport useEventListener from \"../../hooks/useEventListener\";\n// Components import\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport Dialog, { DialogEvent } from \"../Dialog/Dialog\";\nimport { DropdownChevronDown } from \"@vibe/icons\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport styles from \"./SplitButton.module.scss\";\nimport { DialogSize, DialogTriggerEvent } from \"../Dialog\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface SplitButtonProps extends ButtonProps {\n /*\n * The element or renderer which display inside the dialog which open by clicking on the split button's secondary button.\n */\n secondaryDialogContent?: ReactElement | (() => string | ReactElement);\n onSecondaryDialogDidShow?: () => void;\n onSecondaryDialogDidHide?: () => void;\n zIndex?: number;\n /*\n * Class name to provide the element which wraps the popover/modal/dialog\n */\n secondaryDialogClassName?: string;\n secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;\n /*\n Popover Container padding size\n */\n dialogPaddingSize?: DialogSize;\n /**\n * the container selector in which to append the dialog\n * for examples: \"body\" , \".my-class\", \"#my-id\"\n */\n dialogContainerSelector?: string;\n shouldCloseOnClickInsideDialog?: boolean;\n}\n\nconst SplitButton: FC<SplitButtonProps> & {\n secondaryPositions?: typeof SplitButtonSecondaryContentPosition;\n secondaryDialogPositions?: typeof SplitButtonSecondaryContentPosition;\n sizes?: typeof Button.sizes;\n colors?: typeof Button.colors;\n kinds?: typeof Button.kinds;\n inputTags?: typeof Button.inputTags;\n dialogPaddingSizes?: typeof DialogContentContainer.sizes;\n} = ({\n secondaryDialogContent,\n onSecondaryDialogDidShow = NOOP,\n onSecondaryDialogDidHide = NOOP,\n shouldCloseOnClickInsideDialog,\n zIndex = null,\n secondaryDialogClassName,\n secondaryDialogPosition = \"bottom-start\",\n dialogContainerSelector,\n dialogPaddingSize = \"medium\",\n disabled,\n // success mode not working right now, need to fix it in different pr\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n success,\n loading,\n kind,\n color,\n className,\n leftIcon,\n rightIcon,\n onClick,\n children,\n marginLeft,\n marginRight,\n active,\n id,\n \"data-testid\": dataTestId,\n ...buttonProps\n}: SplitButtonProps) => {\n // State //\n const [isDialogOpen, setDialogOpen] = useState(false);\n const [isHovered, setIsHover] = useState(false);\n const [isActive, setIsActive] = useState(false);\n\n // Refs //\n const ref = useRef(null);\n const secondaryButtonRef = useRef(null);\n\n // Callbacks //\n const setHovered = useCallback(() => setIsHover(true), [setIsHover]);\n const setNotHovered = useCallback(() => setIsHover(false), [setIsHover]);\n\n const shouldSetActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (disabled) return false;\n return !isInsideClass(e.target as HTMLElement, SECONDARY_BUTTON_WRAPPER_CLASSNAME);\n },\n [disabled]\n );\n\n const setActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n const setNotActive = useCallback(() => setIsActive(false), [setIsActive]);\n const setActiveOnEnter = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n\n const showDialog = useCallback(() => {\n setDialogOpen(true);\n onSecondaryDialogDidShow();\n }, [setDialogOpen, onSecondaryDialogDidShow]);\n\n const hideDialog = useCallback(\n (_: DialogEvent, eventName: DialogTriggerEvent) => {\n setDialogOpen(false);\n onSecondaryDialogDidHide();\n if (eventName === \"esckey\") {\n secondaryButtonRef.current.focus();\n }\n },\n [setDialogOpen, onSecondaryDialogDidHide]\n );\n\n // Event listeners //\n\n // Used to set both buttons as hovered no matter what button was hovered\n useEventListener({ eventName: \"mouseenter\", callback: setHovered, ref });\n useEventListener({ eventName: \"mouseleave\", callback: setNotHovered, ref });\n\n useEventListener({ eventName: \"mousedown\", callback: setActive, ref });\n useEventListener({ eventName: \"mouseup\", callback: setNotActive, ref });\n\n // Used to finish active transition if clicked on enter\n useEventListener({ eventName: \"transitionend\", callback: setNotActive, ref });\n\n // Key events\n useKeyEvent({ keys: ENTER_KEYS, ref, callback: setActiveOnEnter });\n\n const classNames = useMemo(\n () =>\n cx(\n styles.button,\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.mainActive]: active,\n [styles.active]: isActive,\n [styles.splitContentOpen]: isDialogOpen,\n [styles.hovered]: isHovered,\n [styles.disabled]: disabled\n },\n className\n ),\n [className, kind, color, active, isActive, isDialogOpen, isHovered, disabled]\n );\n\n const dialogShowTrigger = useMemo(() => (disabled ? [] : DEFAULT_DIALOG_SHOW_TRIGGER), [disabled]);\n\n const dialogHideTrigger = useMemo(() => {\n if (shouldCloseOnClickInsideDialog) return [...DEFAULT_DIALOG_HIDE_TRIGGER, HideShowEvent.CONTENT_CLICK];\n return DEFAULT_DIALOG_HIDE_TRIGGER;\n }, [shouldCloseOnClickInsideDialog]);\n\n const actionsContent = useCallback(() => {\n const content = typeof secondaryDialogContent === \"function\" ? secondaryDialogContent() : secondaryDialogContent;\n return (\n <DialogContentContainer type={DialogContentContainer.types.POPOVER} size={dialogPaddingSize}>\n {content}\n </DialogContentContainer>\n );\n }, [secondaryDialogContent, dialogPaddingSize]);\n\n const animationEdgePosition = useMemo(() => {\n if (secondaryDialogPosition === \"bottom\") {\n return \"\";\n }\n if (secondaryDialogPosition === \"bottom-start\") {\n return \"bottom\";\n }\n\n return \"top\";\n }, [secondaryDialogPosition]);\n\n return (\n <div\n className={classNames}\n ref={ref}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.SPLIT_BUTTON, id)}\n data-vibe={ComponentVibeId.SPLIT_BUTTON}\n >\n <Button\n {\n ...buttonProps /* We are enriching button with other props so we must use spreading */\n }\n preventClickAnimation\n leftIcon={leftIcon}\n rightIcon={rightIcon}\n rightFlat\n color={color}\n kind={kind}\n active={active}\n onClick={onClick}\n className={styles.mainButton}\n marginLeft={marginLeft}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n loading={loading}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_PRIMARY_BUTTON, id)}\n >\n {children}\n </Button>\n <div className={styles.secondaryButtonWrapper}>\n <Dialog\n wrapperClassName={secondaryDialogClassName}\n zIndex={zIndex}\n content={actionsContent}\n position={secondaryDialogPosition as DialogPosition}\n containerSelector={dialogContainerSelector}\n startingEdge={animationEdgePosition}\n animationType={AnimationType.EXPAND}\n moveBy={DIALOG_MOVE_BY}\n onDialogDidShow={showDialog}\n onDialogDidHide={hideDialog}\n showTrigger={dialogShowTrigger}\n hideTrigger={dialogHideTrigger}\n >\n <Button\n {...buttonProps}\n ref={secondaryButtonRef}\n preventClickAnimation\n leftFlat\n noSidePadding\n color={color}\n kind={kind}\n className={styles.secondaryButton}\n active={isDialogOpen}\n marginRight={marginRight}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n ariaLabel={SECONDARY_BUTTON_ARIA_LABEL}\n ariaHasPopup\n ariaExpanded={isDialogOpen}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_SECONDARY_BUTTON, id)}\n >\n <div className={styles.secondaryButtonIconWrapper}>\n <DropdownChevronDown aria-hidden=\"true\" />\n </div>\n </Button>\n </Dialog>\n </div>\n </div>\n );\n};\n\nSplitButton.defaultProps = {\n ...Button.defaultProps,\n onSecondaryDialogDidShow: NOOP,\n onSecondaryDialogDidHide: NOOP,\n zIndex: null,\n secondaryDialogClassName: \"\",\n secondaryDialogPosition: \"bottom-start\",\n dialogPaddingSize: DialogContentContainer.sizes.MEDIUM\n};\n\nexport default withStaticProps(SplitButton, {\n secondaryPositions: SplitButtonSecondaryContentPosition,\n secondaryDialogPositions: SplitButtonSecondaryContentPosition,\n sizes: Button.sizes,\n colors: Button.colors,\n kinds: Button.kinds,\n inputTags: Button.inputTags,\n dialogPaddingSizes: DialogContentContainer.sizes\n});\n"],"names":["SplitButton","_a","secondaryDialogContent","_a$onSecondaryDialogD","onSecondaryDialogDidShow","NOOP","_a$onSecondaryDialogD2","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","_a$zIndex","zIndex","secondaryDialogClassName","_a$secondaryDialogPos","secondaryDialogPosition","dialogContainerSelector","_a$dialogPaddingSize","dialogPaddingSize","disabled","loading","kind","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","dataTestId","buttonProps","__rest","_useState","useState","_useState2","_slicedToArray","isDialogOpen","setDialogOpen","_useState3","_useState4","isHovered","setIsHover","_useState5","_useState6","isActive","setIsActive","ref","useRef","secondaryButtonRef","setHovered","useCallback","setNotHovered","shouldSetActive","e","isInsideClass","target","SECONDARY_BUTTON_WRAPPER_CLASSNAME","setActive","setNotActive","setActiveOnEnter","showDialog","hideDialog","_","eventName","current","focus","useEventListener","callback","useKeyEvent","keys","ENTER_KEYS","classNames","useMemo","cx","styles","button","getStyle","camelCase","_defineProperty","mainActive","splitContentOpen","hovered","dialogShowTrigger","DEFAULT_DIALOG_SHOW_TRIGGER","dialogHideTrigger","concat","_toConsumableArray","DEFAULT_DIALOG_HIDE_TRIGGER","HideShowEvent","CONTENT_CLICK","actionsContent","content","React","createElement","DialogContentContainer","type","types","POPOVER","size","animationEdgePosition","getTestId","ComponentDefaultTestId","SPLIT_BUTTON","ComponentVibeId","Button","Object","assign","preventClickAnimation","rightFlat","mainButton","onFocus","onBlur","SPLIT_BUTTON_PRIMARY_BUTTON","secondaryButtonWrapper","Dialog","wrapperClassName","position","containerSelector","startingEdge","animationType","AnimationType","EXPAND","moveBy","DIALOG_MOVE_BY","onDialogDidShow","onDialogDidHide","showTrigger","hideTrigger","leftFlat","noSidePadding","secondaryButton","ariaLabel","SECONDARY_BUTTON_ARIA_LABEL","ariaHasPopup","ariaExpanded","SPLIT_BUTTON_SECONDARY_BUTTON","secondaryButtonIconWrapper","DropdownChevronDown","defaultProps","sizes","MEDIUM","withStaticProps","secondaryPositions","SplitButtonSecondaryContentPosition","secondaryDialogPositions","colors","kinds","inputTags","dialogPaddingSizes"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SplitButton.js","sources":["../../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\n// Libraries import\nimport React, { FC, ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\n// Constants import\nimport {\n DEFAULT_DIALOG_HIDE_TRIGGER,\n DEFAULT_DIALOG_SHOW_TRIGGER,\n DIALOG_MOVE_BY,\n ENTER_KEYS,\n SECONDARY_BUTTON_ARIA_LABEL,\n SECONDARY_BUTTON_WRAPPER_CLASSNAME,\n SplitButtonSecondaryContentPosition,\n SplitButtonSecondaryContentPositionType\n} from \"./SplitButtonConstants\";\nimport { withStaticProps } from \"../../types\";\nimport { AnimationType, DialogPosition, HideShowEvent } from \"../Dialog/DialogConstants\";\n// Utils import\nimport { NOOP } from \"../../utils/function-utils\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\n// Hooks import\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport useEventListener from \"../../hooks/useEventListener\";\n// Components import\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport Dialog, { DialogEvent } from \"../Dialog/Dialog\";\nimport { DropdownChevronDown } from \"@vibe/icons\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport styles from \"./SplitButton.module.scss\";\nimport { DialogSize, DialogTriggerEvent } from \"../Dialog\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface SplitButtonProps extends ButtonProps {\n /**\n * The element or renderer that is displayed inside the dialog opened by clicking the secondary button.\n */\n secondaryDialogContent?: ReactElement | (() => string | ReactElement);\n /**\n * Callback fired when the secondary dialog is shown.\n */\n onSecondaryDialogDidShow?: () => void;\n /**\n * Callback fired when the secondary dialog is hidden.\n */\n onSecondaryDialogDidHide?: () => void;\n /**\n * The z-index applied to the secondary dialog.\n */\n zIndex?: number;\n /**\n * Class name applied to the wrapper of the secondary dialog.\n */\n secondaryDialogClassName?: string;\n /**\n * The position of the secondary dialog.\n */\n secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;\n /**\n * The padding size inside the secondary dialog.\n */\n dialogPaddingSize?: DialogSize;\n /**\n * The CSS selector of the container where the dialog should be rendered.\n */\n dialogContainerSelector?: string;\n /**\n * If true, clicking inside the dialog will close it.\n */\n shouldCloseOnClickInsideDialog?: boolean;\n}\n\nconst SplitButton: FC<SplitButtonProps> & {\n secondaryPositions?: typeof SplitButtonSecondaryContentPosition;\n secondaryDialogPositions?: typeof SplitButtonSecondaryContentPosition;\n sizes?: typeof Button.sizes;\n colors?: typeof Button.colors;\n kinds?: typeof Button.kinds;\n inputTags?: typeof Button.inputTags;\n dialogPaddingSizes?: typeof DialogContentContainer.sizes;\n} = ({\n secondaryDialogContent,\n onSecondaryDialogDidShow = NOOP,\n onSecondaryDialogDidHide = NOOP,\n shouldCloseOnClickInsideDialog,\n zIndex = null,\n secondaryDialogClassName,\n secondaryDialogPosition = \"bottom-start\",\n dialogContainerSelector,\n dialogPaddingSize = \"medium\",\n disabled,\n // success mode not working right now, need to fix it in different pr\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n success,\n loading,\n kind,\n color,\n className,\n leftIcon,\n rightIcon,\n onClick,\n children,\n marginLeft,\n marginRight,\n active,\n id,\n \"data-testid\": dataTestId,\n ...buttonProps\n}: SplitButtonProps) => {\n // State //\n const [isDialogOpen, setDialogOpen] = useState(false);\n const [isHovered, setIsHover] = useState(false);\n const [isActive, setIsActive] = useState(false);\n\n // Refs //\n const ref = useRef(null);\n const secondaryButtonRef = useRef(null);\n\n // Callbacks //\n const setHovered = useCallback(() => setIsHover(true), [setIsHover]);\n const setNotHovered = useCallback(() => setIsHover(false), [setIsHover]);\n\n const shouldSetActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (disabled) return false;\n return !isInsideClass(e.target as HTMLElement, SECONDARY_BUTTON_WRAPPER_CLASSNAME);\n },\n [disabled]\n );\n\n const setActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n const setNotActive = useCallback(() => setIsActive(false), [setIsActive]);\n const setActiveOnEnter = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n\n const showDialog = useCallback(() => {\n setDialogOpen(true);\n onSecondaryDialogDidShow();\n }, [setDialogOpen, onSecondaryDialogDidShow]);\n\n const hideDialog = useCallback(\n (_: DialogEvent, eventName: DialogTriggerEvent) => {\n setDialogOpen(false);\n onSecondaryDialogDidHide();\n if (eventName === \"esckey\") {\n secondaryButtonRef.current.focus();\n }\n },\n [setDialogOpen, onSecondaryDialogDidHide]\n );\n\n // Event listeners //\n\n // Used to set both buttons as hovered no matter what button was hovered\n useEventListener({ eventName: \"mouseenter\", callback: setHovered, ref });\n useEventListener({ eventName: \"mouseleave\", callback: setNotHovered, ref });\n\n useEventListener({ eventName: \"mousedown\", callback: setActive, ref });\n useEventListener({ eventName: \"mouseup\", callback: setNotActive, ref });\n\n // Used to finish active transition if clicked on enter\n useEventListener({ eventName: \"transitionend\", callback: setNotActive, ref });\n\n // Key events\n useKeyEvent({ keys: ENTER_KEYS, ref, callback: setActiveOnEnter });\n\n const classNames = useMemo(\n () =>\n cx(\n styles.button,\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.mainActive]: active,\n [styles.active]: isActive,\n [styles.splitContentOpen]: isDialogOpen,\n [styles.hovered]: isHovered,\n [styles.disabled]: disabled\n },\n className\n ),\n [className, kind, color, active, isActive, isDialogOpen, isHovered, disabled]\n );\n\n const dialogShowTrigger = useMemo(() => (disabled ? [] : DEFAULT_DIALOG_SHOW_TRIGGER), [disabled]);\n\n const dialogHideTrigger = useMemo(() => {\n if (shouldCloseOnClickInsideDialog) return [...DEFAULT_DIALOG_HIDE_TRIGGER, HideShowEvent.CONTENT_CLICK];\n return DEFAULT_DIALOG_HIDE_TRIGGER;\n }, [shouldCloseOnClickInsideDialog]);\n\n const actionsContent = useCallback(() => {\n const content = typeof secondaryDialogContent === \"function\" ? secondaryDialogContent() : secondaryDialogContent;\n return (\n <DialogContentContainer type={DialogContentContainer.types.POPOVER} size={dialogPaddingSize}>\n {content}\n </DialogContentContainer>\n );\n }, [secondaryDialogContent, dialogPaddingSize]);\n\n const animationEdgePosition = useMemo(() => {\n if (secondaryDialogPosition === \"bottom\") {\n return \"\";\n }\n if (secondaryDialogPosition === \"bottom-start\") {\n return \"bottom\";\n }\n\n return \"top\";\n }, [secondaryDialogPosition]);\n\n return (\n <div\n className={classNames}\n ref={ref}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.SPLIT_BUTTON, id)}\n data-vibe={ComponentVibeId.SPLIT_BUTTON}\n >\n <Button\n {\n ...buttonProps /* We are enriching button with other props so we must use spreading */\n }\n preventClickAnimation\n leftIcon={leftIcon}\n rightIcon={rightIcon}\n rightFlat\n color={color}\n kind={kind}\n active={active}\n onClick={onClick}\n className={styles.mainButton}\n marginLeft={marginLeft}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n loading={loading}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_PRIMARY_BUTTON, id)}\n >\n {children}\n </Button>\n <div className={styles.secondaryButtonWrapper}>\n <Dialog\n wrapperClassName={secondaryDialogClassName}\n zIndex={zIndex}\n content={actionsContent}\n position={secondaryDialogPosition as DialogPosition}\n containerSelector={dialogContainerSelector}\n startingEdge={animationEdgePosition}\n animationType={AnimationType.EXPAND}\n moveBy={DIALOG_MOVE_BY}\n onDialogDidShow={showDialog}\n onDialogDidHide={hideDialog}\n showTrigger={dialogShowTrigger}\n hideTrigger={dialogHideTrigger}\n >\n <Button\n {...buttonProps}\n ref={secondaryButtonRef}\n preventClickAnimation\n leftFlat\n noSidePadding\n color={color}\n kind={kind}\n className={styles.secondaryButton}\n active={isDialogOpen}\n marginRight={marginRight}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n ariaLabel={SECONDARY_BUTTON_ARIA_LABEL}\n ariaHasPopup\n ariaExpanded={isDialogOpen}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_SECONDARY_BUTTON, id)}\n >\n <div className={styles.secondaryButtonIconWrapper}>\n <DropdownChevronDown aria-hidden=\"true\" />\n </div>\n </Button>\n </Dialog>\n </div>\n </div>\n );\n};\n\nSplitButton.defaultProps = {\n ...Button.defaultProps,\n onSecondaryDialogDidShow: NOOP,\n onSecondaryDialogDidHide: NOOP,\n zIndex: null,\n secondaryDialogClassName: \"\",\n secondaryDialogPosition: \"bottom-start\",\n dialogPaddingSize: DialogContentContainer.sizes.MEDIUM\n};\n\nexport default withStaticProps(SplitButton, {\n secondaryPositions: SplitButtonSecondaryContentPosition,\n secondaryDialogPositions: SplitButtonSecondaryContentPosition,\n sizes: Button.sizes,\n colors: Button.colors,\n kinds: Button.kinds,\n inputTags: Button.inputTags,\n dialogPaddingSizes: DialogContentContainer.sizes\n});\n"],"names":["SplitButton","_a","secondaryDialogContent","_a$onSecondaryDialogD","onSecondaryDialogDidShow","NOOP","_a$onSecondaryDialogD2","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","_a$zIndex","zIndex","secondaryDialogClassName","_a$secondaryDialogPos","secondaryDialogPosition","dialogContainerSelector","_a$dialogPaddingSize","dialogPaddingSize","disabled","loading","kind","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","dataTestId","buttonProps","__rest","_useState","useState","_useState2","_slicedToArray","isDialogOpen","setDialogOpen","_useState3","_useState4","isHovered","setIsHover","_useState5","_useState6","isActive","setIsActive","ref","useRef","secondaryButtonRef","setHovered","useCallback","setNotHovered","shouldSetActive","e","isInsideClass","target","SECONDARY_BUTTON_WRAPPER_CLASSNAME","setActive","setNotActive","setActiveOnEnter","showDialog","hideDialog","_","eventName","current","focus","useEventListener","callback","useKeyEvent","keys","ENTER_KEYS","classNames","useMemo","cx","styles","button","getStyle","camelCase","_defineProperty","mainActive","splitContentOpen","hovered","dialogShowTrigger","DEFAULT_DIALOG_SHOW_TRIGGER","dialogHideTrigger","concat","_toConsumableArray","DEFAULT_DIALOG_HIDE_TRIGGER","HideShowEvent","CONTENT_CLICK","actionsContent","content","React","createElement","DialogContentContainer","type","types","POPOVER","size","animationEdgePosition","getTestId","ComponentDefaultTestId","SPLIT_BUTTON","ComponentVibeId","Button","Object","assign","preventClickAnimation","rightFlat","mainButton","onFocus","onBlur","SPLIT_BUTTON_PRIMARY_BUTTON","secondaryButtonWrapper","Dialog","wrapperClassName","position","containerSelector","startingEdge","animationType","AnimationType","EXPAND","moveBy","DIALOG_MOVE_BY","onDialogDidShow","onDialogDidHide","showTrigger","hideTrigger","leftFlat","noSidePadding","secondaryButton","ariaLabel","SECONDARY_BUTTON_ARIA_LABEL","ariaHasPopup","ariaExpanded","SPLIT_BUTTON_SECONDARY_BUTTON","secondaryButtonIconWrapper","DropdownChevronDown","defaultProps","sizes","MEDIUM","withStaticProps","secondaryPositions","SplitButtonSecondaryContentPosition","secondaryDialogPositions","colors","kinds","inputTags","dialogPaddingSizes"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Steps.js","sources":["../../../../../src/components/Steps/Steps.tsx"],"sourcesContent":["import React, { forwardRef, ReactElement, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { StepsHeader } from \"./StepsHeader\";\nimport { StepsColor as StepsColorEnum, StepsType as StepsTypeEnum } from \"./StepsConstants\";\nimport { StepsColor, StepsType } from \"./Steps.types\";\nimport { ButtonProps } from \"../Button/Button\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { withStaticProps, VibeComponent, VibeComponentProps } from \"../../types\";\nimport styles from \"./Steps.module.scss\";\n\nexport interface StepsProps extends VibeComponentProps {\n /**\n * The index of the
|
|
1
|
+
{"version":3,"file":"Steps.js","sources":["../../../../../src/components/Steps/Steps.tsx"],"sourcesContent":["import React, { forwardRef, ReactElement, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { StepsHeader } from \"./StepsHeader\";\nimport { StepsColor as StepsColorEnum, StepsType as StepsTypeEnum } from \"./StepsConstants\";\nimport { StepsColor, StepsType } from \"./Steps.types\";\nimport { ButtonProps } from \"../Button/Button\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { withStaticProps, VibeComponent, VibeComponentProps } from \"../../types\";\nimport styles from \"./Steps.module.scss\";\n\nexport interface StepsProps extends VibeComponentProps {\n /**\n * The index of the currently active step.\n */\n activeStepIndex?: number;\n /**\n * Callback fired when the active step changes.\n */\n onChangeActiveStep?: (e: React.MouseEvent, stepIndex: number) => void;\n /**\n * If true, hides the navigation buttons.\n */\n areNavigationButtonsHidden?: boolean;\n /**\n * The list of steps in the steps component.\n */\n steps?: ReactElement[];\n /**\n * The visual style of the steps component.\n */\n type?: StepsType;\n /**\n * The color theme of the steps component.\n */\n color?: StepsColor;\n /**\n * If true, the content is displayed above the step navigation.\n */\n isContentOnTop?: boolean;\n /**\n * If true, hides the icons in the navigation buttons.\n */\n areButtonsIconsHidden?: boolean;\n /**\n * Props applied to the back button.\n */\n backButtonProps?: Partial<ButtonProps>;\n /**\n * Props applied to the next button.\n */\n nextButtonProps?: Partial<ButtonProps>;\n /**\n * Props applied to the finish button.\n */\n finishButtonProps?: Partial<ButtonProps>;\n /**\n * Callback fired when the finish button is clicked.\n */\n onFinish?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n}\n\nconst Steps: VibeComponent<StepsProps> & { types?: typeof StepsTypeEnum; colors?: typeof StepsColorEnum } = forwardRef(\n (\n {\n className,\n id,\n \"data-testid\": dataTestId,\n steps = [],\n activeStepIndex = 0,\n type = \"gallery\",\n onChangeActiveStep = NOOP,\n onFinish,\n color,\n areNavigationButtonsHidden = false,\n isContentOnTop = false,\n backButtonProps = {},\n nextButtonProps = {},\n finishButtonProps = {},\n areButtonsIconsHidden = false\n }: StepsProps,\n ref\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <div\n ref={mergedRef}\n className={cx(styles.steps, className)}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.STEPS, id)}\n >\n {isContentOnTop && steps[activeStepIndex]}\n <StepsHeader\n onChangeActiveStep={onChangeActiveStep}\n type={type}\n activeStepIndex={activeStepIndex}\n stepsCount={steps.length}\n areNavigationButtonsHidden={areNavigationButtonsHidden}\n color={color}\n backButtonProps={backButtonProps}\n nextButtonProps={nextButtonProps}\n finishButtonProps={finishButtonProps}\n areButtonsIconsHidden={areButtonsIconsHidden}\n onFinish={onFinish}\n className={cx({\n [styles.contentOnTop]: isContentOnTop,\n [styles.contentOnBottom]: !isContentOnTop\n })}\n />\n {!isContentOnTop && steps[activeStepIndex]}\n </div>\n );\n }\n);\n\nexport default withStaticProps(Steps, {\n types: StepsTypeEnum,\n colors: StepsColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","id","dataTestId","_ref$steps","steps","_ref$activeStepIndex","activeStepIndex","_ref$type","type","_ref$onChangeActiveSt","onChangeActiveStep","NOOP","onFinish","color","_ref$areNavigationBut","areNavigationButtonsHidden","_ref$isContentOnTop","isContentOnTop","_ref$backButtonProps","backButtonProps","_ref$nextButtonProps","nextButtonProps","_ref$finishButtonProp","finishButtonProps","_ref$areButtonsIconsH","areButtonsIconsHidden","componentRef","useRef","mergedRef","useMergeRef","React","createElement","cx","styles","getTestId","ComponentDefaultTestId","STEPS","StepsHeader","stepsCount","length","_defineProperty","contentOnTop","contentOnBottom","types","StepsTypeEnum","colors","StepsColorEnum"],"mappings":"ukBA+DA,IAuDeA,EAAAA,EAvD6FC,GAC1G,SAAAC,EAkBEC,GACE,IAjBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GACeC,EAAUJ,EAAzB,eAAaK,EAAAL,EACbM,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAP,EACVQ,gBAAAA,OAAkB,IAAHD,EAAG,EAACA,EAAAE,EAAAT,EACnBU,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAAAE,EAAAX,EAChBY,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EACzBG,EAAQd,EAARc,SACAC,EAAKf,EAALe,MAAKC,EAAAhB,EACLiB,2BAAAA,OAA6B,IAAHD,GAAQA,EAAAE,EAAAlB,EAClCmB,eAAAA,OAAiB,IAAHD,GAAQA,EAAAE,EAAApB,EACtBqB,gBAAAA,OAAe,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAtB,EACpBuB,gBAAAA,OAAe,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAxB,EACpByB,kBAAAA,OAAiB,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAA1B,EACtB2B,sBAAAA,OAAwB,IAAHD,GAAQA,EAIzBE,EAAeC,EAAO,MACtBC,EAAYC,EAAY9B,EAAK2B,GAEnC,OACEI,EAAAC,cAAA,MAAA,CACEhC,IAAK6B,EACL5B,UAAWgC,EAAGC,EAAO7B,MAAOJ,GAC5BC,GAAIA,EAAE,cACOC,GAAcgC,EAAUC,EAAuBC,MAAOnC,IAElEgB,GAAkBb,EAAME,GACzBwB,EAACC,cAAAM,GACC3B,mBAAoBA,EACpBF,KAAMA,EACNF,gBAAiBA,EACjBgC,WAAYlC,EAAMmC,OAClBxB,2BAA4BA,EAC5BF,MAAOA,EACPM,gBAAiBA,EACjBE,gBAAiBA,EACjBE,kBAAmBA,EACnBE,sBAAuBA,EACvBb,SAAUA,EACVZ,UAAWgC,EAAEQ,EAAAA,KACVP,EAAOQ,aAAexB,GACtBgB,EAAOS,iBAAmBzB,OAG7BA,GAAkBb,EAAME,GAGhC,IAGoC,CACpCqC,MAAOC,EACPC,OAAQC"}
|