@bikdotai/bik-component-library 0.0.805-beta.18 → 0.0.805-beta.3
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/cjs/components/BikGiftedChat/Bubble/Bubble.js +1 -1
- package/dist/cjs/components/BikGiftedChat/Bubble/Bubble.js.map +1 -1
- package/dist/cjs/components/BikGiftedChat/GiftedChat/GiftedChat.js +1 -1
- package/dist/cjs/components/BikGiftedChat/GiftedChat/GiftedChat.js.map +1 -1
- package/dist/cjs/components/BikGiftedChat/GiftedChat/types.js.map +1 -1
- package/dist/cjs/components/avatar/Avatar.js +1 -1
- package/dist/cjs/components/avatar/Avatar.js.map +1 -1
- package/dist/cjs/components/avatar/Avatar.styled.js +3 -3
- package/dist/cjs/components/avatar/Avatar.styled.js.map +1 -1
- package/dist/cjs/components/avatar/AvatarHelper.js +1 -1
- package/dist/cjs/components/avatar/AvatarHelper.js.map +1 -1
- package/dist/cjs/components/bik-layout/BikSidebar.js.map +1 -1
- package/dist/cjs/components/button/Button.js +1 -1
- package/dist/cjs/components/button/Button.js.map +1 -1
- package/dist/cjs/components/button/Button.styled.js +1 -1
- package/dist/cjs/components/button/Button.styled.js.map +1 -1
- package/dist/cjs/components/button/themes.js +1 -1
- package/dist/cjs/components/button/themes.js.map +1 -1
- package/dist/cjs/components/country-code-picker/CountryCodePicker.js.map +1 -1
- package/dist/cjs/components/country-code-picker/CountryPicker.js.map +1 -1
- package/dist/cjs/components/dropdown/Dropdown.js +1 -1
- package/dist/cjs/components/dropdown/Dropdown.js.map +1 -1
- package/dist/cjs/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/cjs/components/dropdown/DropdownPopover/index.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js +5 -6
- package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/description/Description.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/description/Description.styled.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +7 -7
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.js +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.js +4 -8
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js.map +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js +1 -1
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js.map +1 -1
- package/dist/cjs/components/dropdown-button/DropdownButton.js +1 -1
- package/dist/cjs/components/dropdown-button/DropdownButton.js.map +1 -1
- package/dist/cjs/components/dropdown-button/DropdownButton.style.js +6 -10
- package/dist/cjs/components/dropdown-button/DropdownButton.style.js.map +1 -1
- package/dist/cjs/components/fab-menu/FABMenu.js.map +1 -1
- package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
- package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.js.map +1 -1
- package/dist/cjs/components/feature-announcements/MajorUpdatePopup.js +1 -1
- package/dist/cjs/components/feature-announcements/MajorUpdatePopup.js.map +1 -1
- package/dist/cjs/components/feature-announcements/MinorUpdatePopup.js +1 -1
- package/dist/cjs/components/feature-announcements/MinorUpdatePopup.js.map +1 -1
- package/dist/cjs/components/icon-button/IconButton.js +1 -1
- package/dist/cjs/components/icon-button/IconButton.js.map +1 -1
- package/dist/cjs/components/icon-button/IconButton.styled.js +3 -3
- package/dist/cjs/components/icon-button/IconButton.styled.js.map +1 -1
- package/dist/cjs/components/icon-button/theme.js +1 -1
- package/dist/cjs/components/icon-button/theme.js.map +1 -1
- package/dist/cjs/components/input/Input.js +1 -1
- package/dist/cjs/components/input/Input.js.map +1 -1
- package/dist/cjs/components/input/Input.styled.js +1 -1
- package/dist/cjs/components/input/Input.styled.js.map +1 -1
- package/dist/cjs/components/list-item/ListItem.js +1 -1
- package/dist/cjs/components/list-item/ListItem.js.map +1 -1
- package/dist/cjs/components/list-item/ListItem.styled.js +1 -1
- package/dist/cjs/components/list-item/ListItem.styled.js.map +1 -1
- package/dist/cjs/components/list-item/themes.js +1 -1
- package/dist/cjs/components/list-item/themes.js.map +1 -1
- package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.js.map +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuItem.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuItem.js.map +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuList.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuList.js.map +1 -1
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.js.map +1 -1
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.js +30 -33
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.js.map +1 -1
- package/dist/cjs/components/tag/Tag.js +1 -1
- package/dist/cjs/components/tag/Tag.js.map +1 -1
- package/dist/cjs/components/tag/Tag.styled.js +1 -1
- package/dist/cjs/components/tag/Tag.styled.js.map +1 -1
- package/dist/cjs/components/tag/model.js.map +1 -1
- package/dist/cjs/components/whats-new/WhatsNew.js +1 -1
- package/dist/cjs/components/whats-new/WhatsNew.js.map +1 -1
- package/dist/cjs/components/whats-new/WhatsNewButton.js +1 -1
- package/dist/cjs/components/whats-new/WhatsNewButton.js.map +1 -1
- package/dist/cjs/components/whats-new/WhatsNewPanel.js +1 -1
- package/dist/cjs/components/whats-new/WhatsNewPanel.js.map +1 -1
- package/dist/cjs/constants/Theme.js +1 -1
- package/dist/cjs/constants/Theme.js.map +1 -1
- package/dist/cjs/icons/Arrows/Chevron/ChevronUp.js +1 -1
- package/dist/cjs/icons/Arrows/Chevron/ChevronUp.js.map +1 -1
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/src/components/BikGiftedChat/GiftedChat/types.d.ts +2 -6
- package/dist/cjs/src/components/avatar/Avatar.d.ts +2 -3
- package/dist/cjs/src/components/avatar/AvatarHelper.d.ts +4 -5
- package/dist/cjs/src/components/bik-layout/index.d.ts +0 -2
- package/dist/cjs/src/components/button/Button.styled.d.ts +1 -1
- package/dist/cjs/src/components/button/model.d.ts +3 -3
- package/dist/cjs/src/components/button/themes.d.ts +2 -2
- package/dist/cjs/src/components/country-code-picker/CountryCodePicker.d.ts +1 -1
- package/dist/cjs/src/components/country-code-picker/CountryPicker.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/description/Description.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/description/Description.styled.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts +1 -2
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.d.ts +1 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts +0 -1
- package/dist/cjs/src/components/dropdown/OpenedDropdown/utils/iterationOnOptions.d.ts +0 -2
- package/dist/cjs/src/components/dropdown/hooks/useDropdown.d.ts +0 -2
- package/dist/cjs/src/components/dropdown/type.d.ts +1 -2
- package/dist/cjs/src/components/dropdown-button/DropdownButton.d.ts +1 -3
- package/dist/cjs/src/components/dropdown-button/DropdownButton.style.d.ts +2 -9
- package/dist/cjs/src/components/fab-menu/FABMenu.d.ts +1 -1
- package/dist/cjs/src/components/feature-announcements/types/feature.types.d.ts +1 -1
- package/dist/cjs/src/components/icon-button/IconButton.styled.d.ts +1 -3
- package/dist/cjs/src/components/icon-button/model.d.ts +1 -12
- package/dist/cjs/src/components/input/Input.model.d.ts +1 -2
- package/dist/cjs/src/components/input/Input.styled.d.ts +1 -16
- package/dist/cjs/src/components/list-item/List.model.d.ts +1 -1
- package/dist/cjs/src/components/list-item/ListItem.styled.d.ts +1 -1
- package/dist/cjs/src/components/list-item/themes.d.ts +2 -2
- package/dist/cjs/src/components/multi-level-dropdown/GroupedMenuList.d.ts +0 -1
- package/dist/cjs/src/components/multi-level-dropdown/MenuItem.d.ts +0 -1
- package/dist/cjs/src/components/multi-level-dropdown/MenuList.d.ts +0 -1
- package/dist/cjs/src/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +3 -13
- package/dist/cjs/src/components/multi-level-dropdown/type.d.ts +0 -1
- package/dist/cjs/src/components/tag/Tag.d.ts +1 -1
- package/dist/cjs/src/components/tag/Tag.stories.d.ts +5 -5
- package/dist/cjs/src/components/tag/Tag.styled.d.ts +1 -3
- package/dist/cjs/src/components/tag/model.d.ts +1 -5
- package/dist/cjs/src/components/whats-new/WhatsNew.d.ts +0 -2
- package/dist/cjs/src/components/whats-new/WhatsNew.types.d.ts +0 -2
- package/dist/cjs/src/constants/Theme.d.ts +0 -6
- package/dist/cjs/src/icons/Arrows/Chevron/ChevronUp.d.ts +2 -1
- package/dist/cjs/src/index.d.ts +0 -1
- package/dist/esm/components/BikGiftedChat/Bubble/Bubble.js +1 -1
- package/dist/esm/components/BikGiftedChat/Bubble/Bubble.js.map +1 -1
- package/dist/esm/components/BikGiftedChat/GiftedChat/GiftedChat.js +1 -1
- package/dist/esm/components/BikGiftedChat/GiftedChat/GiftedChat.js.map +1 -1
- package/dist/esm/components/BikGiftedChat/GiftedChat/types.js.map +1 -1
- package/dist/esm/components/avatar/Avatar.js +1 -1
- package/dist/esm/components/avatar/Avatar.js.map +1 -1
- package/dist/esm/components/avatar/Avatar.styled.js +6 -6
- package/dist/esm/components/avatar/Avatar.styled.js.map +1 -1
- package/dist/esm/components/avatar/AvatarHelper.js +1 -1
- package/dist/esm/components/avatar/AvatarHelper.js.map +1 -1
- package/dist/esm/components/bik-layout/BikSidebar.js.map +1 -1
- package/dist/esm/components/button/Button.js +1 -1
- package/dist/esm/components/button/Button.js.map +1 -1
- package/dist/esm/components/button/Button.styled.js +1 -1
- package/dist/esm/components/button/Button.styled.js.map +1 -1
- package/dist/esm/components/button/themes.js +1 -1
- package/dist/esm/components/button/themes.js.map +1 -1
- package/dist/esm/components/country-code-picker/CountryCodePicker.js.map +1 -1
- package/dist/esm/components/country-code-picker/CountryPicker.js.map +1 -1
- package/dist/esm/components/dropdown/Dropdown.js +1 -1
- package/dist/esm/components/dropdown/Dropdown.js.map +1 -1
- package/dist/esm/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/esm/components/dropdown/DropdownPopover/index.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js +2 -3
- package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.styled.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.js +2 -6
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js.map +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js +1 -1
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js.map +1 -1
- package/dist/esm/components/dropdown-button/DropdownButton.js +1 -1
- package/dist/esm/components/dropdown-button/DropdownButton.js.map +1 -1
- package/dist/esm/components/dropdown-button/DropdownButton.style.js +4 -8
- package/dist/esm/components/dropdown-button/DropdownButton.style.js.map +1 -1
- package/dist/esm/components/fab-menu/FABMenu.js.map +1 -1
- package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
- package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.js.map +1 -1
- package/dist/esm/components/feature-announcements/MajorUpdatePopup.js +1 -1
- package/dist/esm/components/feature-announcements/MajorUpdatePopup.js.map +1 -1
- package/dist/esm/components/feature-announcements/MinorUpdatePopup.js +1 -1
- package/dist/esm/components/feature-announcements/MinorUpdatePopup.js.map +1 -1
- package/dist/esm/components/icon-button/IconButton.js +1 -1
- package/dist/esm/components/icon-button/IconButton.js.map +1 -1
- package/dist/esm/components/icon-button/IconButton.styled.js +1 -1
- package/dist/esm/components/icon-button/IconButton.styled.js.map +1 -1
- package/dist/esm/components/icon-button/theme.js +1 -1
- package/dist/esm/components/icon-button/theme.js.map +1 -1
- package/dist/esm/components/input/Input.js +1 -1
- package/dist/esm/components/input/Input.js.map +1 -1
- package/dist/esm/components/input/Input.styled.js +1 -1
- package/dist/esm/components/input/Input.styled.js.map +1 -1
- package/dist/esm/components/list-item/ListItem.js +1 -1
- package/dist/esm/components/list-item/ListItem.js.map +1 -1
- package/dist/esm/components/list-item/ListItem.styled.js +1 -1
- package/dist/esm/components/list-item/ListItem.styled.js.map +1 -1
- package/dist/esm/components/list-item/themes.js +1 -1
- package/dist/esm/components/list-item/themes.js.map +1 -1
- package/dist/esm/components/multi-level-dropdown/GroupedMenuList.js +1 -1
- package/dist/esm/components/multi-level-dropdown/GroupedMenuList.js.map +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuItem.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuItem.js.map +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuList.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuList.js.map +1 -1
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.js +1 -1
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.js.map +1 -1
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.js +29 -32
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.js.map +1 -1
- package/dist/esm/components/tag/Tag.js +1 -1
- package/dist/esm/components/tag/Tag.js.map +1 -1
- package/dist/esm/components/tag/Tag.styled.js +1 -1
- package/dist/esm/components/tag/Tag.styled.js.map +1 -1
- package/dist/esm/components/tag/model.js.map +1 -1
- package/dist/esm/components/whats-new/WhatsNew.js +1 -1
- package/dist/esm/components/whats-new/WhatsNew.js.map +1 -1
- package/dist/esm/components/whats-new/WhatsNewButton.js +1 -1
- package/dist/esm/components/whats-new/WhatsNewButton.js.map +1 -1
- package/dist/esm/components/whats-new/WhatsNewPanel.js +1 -1
- package/dist/esm/components/whats-new/WhatsNewPanel.js.map +1 -1
- package/dist/esm/constants/Theme.js +1 -1
- package/dist/esm/constants/Theme.js.map +1 -1
- package/dist/esm/icons/Arrows/Chevron/ChevronUp.js +1 -1
- package/dist/esm/icons/Arrows/Chevron/ChevronUp.js.map +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/src/components/BikGiftedChat/GiftedChat/types.d.ts +2 -6
- package/dist/esm/src/components/avatar/Avatar.d.ts +2 -3
- package/dist/esm/src/components/avatar/AvatarHelper.d.ts +4 -5
- package/dist/esm/src/components/bik-layout/index.d.ts +0 -2
- package/dist/esm/src/components/button/Button.styled.d.ts +1 -1
- package/dist/esm/src/components/button/model.d.ts +3 -3
- package/dist/esm/src/components/button/themes.d.ts +2 -2
- package/dist/esm/src/components/country-code-picker/CountryCodePicker.d.ts +1 -1
- package/dist/esm/src/components/country-code-picker/CountryPicker.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/description/Description.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/description/Description.styled.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts +1 -2
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.d.ts +1 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts +0 -1
- package/dist/esm/src/components/dropdown/OpenedDropdown/utils/iterationOnOptions.d.ts +0 -2
- package/dist/esm/src/components/dropdown/hooks/useDropdown.d.ts +0 -2
- package/dist/esm/src/components/dropdown/type.d.ts +1 -2
- package/dist/esm/src/components/dropdown-button/DropdownButton.d.ts +1 -3
- package/dist/esm/src/components/dropdown-button/DropdownButton.style.d.ts +2 -9
- package/dist/esm/src/components/fab-menu/FABMenu.d.ts +1 -1
- package/dist/esm/src/components/feature-announcements/types/feature.types.d.ts +1 -1
- package/dist/esm/src/components/icon-button/IconButton.styled.d.ts +1 -3
- package/dist/esm/src/components/icon-button/model.d.ts +1 -12
- package/dist/esm/src/components/input/Input.model.d.ts +1 -2
- package/dist/esm/src/components/input/Input.styled.d.ts +1 -16
- package/dist/esm/src/components/list-item/List.model.d.ts +1 -1
- package/dist/esm/src/components/list-item/ListItem.styled.d.ts +1 -1
- package/dist/esm/src/components/list-item/themes.d.ts +2 -2
- package/dist/esm/src/components/multi-level-dropdown/GroupedMenuList.d.ts +0 -1
- package/dist/esm/src/components/multi-level-dropdown/MenuItem.d.ts +0 -1
- package/dist/esm/src/components/multi-level-dropdown/MenuList.d.ts +0 -1
- package/dist/esm/src/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +3 -13
- package/dist/esm/src/components/multi-level-dropdown/type.d.ts +0 -1
- package/dist/esm/src/components/tag/Tag.d.ts +1 -1
- package/dist/esm/src/components/tag/Tag.stories.d.ts +5 -5
- package/dist/esm/src/components/tag/Tag.styled.d.ts +1 -3
- package/dist/esm/src/components/tag/model.d.ts +1 -5
- package/dist/esm/src/components/whats-new/WhatsNew.d.ts +0 -2
- package/dist/esm/src/components/whats-new/WhatsNew.types.d.ts +0 -2
- package/dist/esm/src/constants/Theme.d.ts +0 -6
- package/dist/esm/src/icons/Arrows/Chevron/ChevronUp.d.ts +2 -1
- package/dist/esm/src/index.d.ts +0 -1
- package/package.json +2 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.js +0 -2
- package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.js.map +0 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +0 -2
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.js.map +0 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +0 -294
- package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.js.map +0 -1
- package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +0 -2
- package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js.map +0 -1
- package/dist/cjs/components/dual-icon-button/DualIconButton.js +0 -2
- package/dist/cjs/components/dual-icon-button/DualIconButton.js.map +0 -1
- package/dist/cjs/components/dual-icon-button/DualIconButton.styled.js +0 -26
- package/dist/cjs/components/dual-icon-button/DualIconButton.styled.js.map +0 -1
- package/dist/cjs/src/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +0 -33
- package/dist/cjs/src/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +0 -27
- package/dist/cjs/src/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +0 -13
- package/dist/cjs/src/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +0 -44
- package/dist/cjs/src/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +0 -3
- package/dist/cjs/src/components/dual-icon-button/DualIconButton.d.ts +0 -3
- package/dist/cjs/src/components/dual-icon-button/DualIconButton.styled.d.ts +0 -7
- package/dist/cjs/src/components/dual-icon-button/index.d.ts +0 -2
- package/dist/cjs/src/components/dual-icon-button/model.d.ts +0 -12
- package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.js +0 -2
- package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.js.map +0 -1
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +0 -2
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.js.map +0 -1
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +0 -294
- package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.js.map +0 -1
- package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +0 -2
- package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js.map +0 -1
- package/dist/esm/components/dual-icon-button/DualIconButton.js +0 -2
- package/dist/esm/components/dual-icon-button/DualIconButton.js.map +0 -1
- package/dist/esm/components/dual-icon-button/DualIconButton.styled.js +0 -26
- package/dist/esm/components/dual-icon-button/DualIconButton.styled.js.map +0 -1
- package/dist/esm/src/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +0 -33
- package/dist/esm/src/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +0 -27
- package/dist/esm/src/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +0 -13
- package/dist/esm/src/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +0 -44
- package/dist/esm/src/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +0 -3
- package/dist/esm/src/components/dual-icon-button/DualIconButton.d.ts +0 -3
- package/dist/esm/src/components/dual-icon-button/DualIconButton.styled.d.ts +0 -7
- package/dist/esm/src/components/dual-icon-button/index.d.ts +0 -2
- package/dist/esm/src/components/dual-icon-button/model.d.ts +0 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BikSidebar.js","sources":["../../../../src/components/bik-layout/BikSidebar.tsx"],"sourcesContent":["import BikIcon from '@src/assets/icons/Bik_logo.svg';\nimport LockedIcon from '@src/assets/icons/locked.svg';\nimport { Fragment, useCallback, useEffect, useMemo, useState } from 'react';\nimport React from 'react';\nimport CircularProgressBar from '@src/components/progress-bar/CircularProgressBar';\nimport { COLORS } from '@src/constants/Theme';\nimport { NavigationHyperlink } from '../navigation-hyperlink/NavigationHyperlink';\nimport { Menu } from './Sidebar.model';\nimport { SidebarPopup } from './SidebarPopup';\nimport {\n\tMainSideBarMenuWrapper,\n\tSibeBarMenuItem,\n\tSideBarContainer,\n} from './SidebarStyles';\nimport { SimpleSidebar } from './SimpleSidebar';\n\nexport interface MenuItem {\n\tkey: string | number;\n\tdisplayName: string;\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Main Icon element that is to display\n\tactiveIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Icon element to pass when the menu is active\n\thoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; //Icon element to pass when the menu is hovered upon\n\tisLastSticky?: boolean; // to stick any menu at the end of the list\n\tis2ndLastSticky?: boolean; // to stick any menu at 2nd last end of list\n\tchildren?: Menu[];\n\tshowAccessUpgradePanel?: boolean;\n\tpath?: string;\n\tlayout?: 'fullScreen' | 'popup' | string | undefined;\n\tisNew?: boolean;\n\tisLocked?: boolean;\n}\n\nexport interface BikSidebarProps {\n\tlogoSvg?: JSX.Element;\n\tallMenuList: MenuItem[];\n\tactiveMainMenu: MenuItem;\n\tactiveSubMenu: Menu;\n\trouter: any;\n\tonClickingMainMenu: (menu: MenuItem) => void;\n\tonClickingSubMenu: (subMenu: Menu) => void;\n\tonClickingAccessUpgradePanel?: () => void;\n\tonClickingPopupMenuItem?: (menu: Menu) => void;\n\tpopupMinHeight?: number;\n\tisNewSidebar?: boolean;\n\tonboardingPercentage?: number;\n\tmenuStyle?: React.CSSProperties;\n}\n\ninterface GetSideBarMenuItemProps {\n\toption: MenuItem;\n\tindex: number;\n\tonClickMainMenuLogic: (option: MenuItem) => void;\n\tsetHandleHoverForFullLayout: (option: MenuItem) => void;\n\tisDisabled: boolean;\n\tsetHoveredComp: (comp: any) => void;\n\tsetPopupMenu: (menu: any) => void;\n\tmainActiveMenu: MenuItem | undefined;\n\thoveredComp: MenuItem | undefined;\n\tpopupMenu: MenuItem | undefined;\n}\n\nexport const BikSidebar: React.FC<BikSidebarProps> = (bikSidebarProps) => {\n\tconst {\n\t\tlogoSvg,\n\t\tallMenuList,\n\t\tactiveMainMenu,\n\t\tactiveSubMenu,\n\t\trouter,\n\t\tonClickingMainMenu,\n\t\tonClickingSubMenu,\n\t\tonClickingAccessUpgradePanel,\n\t\tonClickingPopupMenuItem,\n\t\tpopupMinHeight,\n\t\tisNewSidebar,\n\t\tmenuStyle,\n\t} = bikSidebarProps;\n\tconst [mainActiveMenu, setMainActiveMenu] =\n\t\tuseState<MenuItem>(activeMainMenu);\n\tconst [hoveredComp, setHoveredComp] = useState<MenuItem>();\n\tconst [subActiveMenu, setSubActiveMenu] = useState<Menu>(activeSubMenu);\n\tconst [isDisabled, setIsDisabled] = useState(false);\n\tconst [popupMenu, setPopupMenu] = useState<MenuItem>();\n\tconst [popupMenuTop, setPopupMenuTop] = useState<number>();\n\tconst [sidebarEachMenuTop, setSidebarEachMenuTop] = useState<number>();\n\tconst [autoCloseTimer, setAutoCloseTimer] = useState<NodeJS.Timeout | null>(\n\t\tnull,\n\t);\n\tconst numberOfStickyOptions = useMemo(\n\t\t() =>\n\t\t\tallMenuList.filter((menu) => menu.is2ndLastSticky || menu.isLastSticky)\n\t\t\t\t.length,\n\t\t[allMenuList],\n\t);\n\n\tuseEffect(() => {\n\t\tsetMainActiveMenu(activeMainMenu);\n\t}, [activeMainMenu]);\n\n\tuseEffect(() => {\n\t\tsetSubActiveMenu(activeSubMenu);\n\t}, [activeSubMenu]);\n\n\tconst onClickMainMenuLogic = useCallback(\n\t\t(option: MenuItem) => {\n\t\t\tif (option?.layout === 'popup') {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetPopupMenu(undefined);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetIsDisabled(true);\n\t\t\tsetMainActiveMenu(option);\n\t\t\tif (!option.path) {\n\t\t\t\tonClickingMainMenu(option);\n\t\t\t}\n\t\t\toption?.children?.length\n\t\t\t\t? setSubActiveMenu(option?.children[0])\n\t\t\t\t: setSubActiveMenu({} as Menu);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsDisabled(false);\n\t\t\t}, 1000);\n\t\t},\n\t\t[onClickingMainMenu],\n\t);\n\n\tconst setHandleHoverForFullLayout = useCallback((option: MenuItem) => {\n\t\tclearRemnantTimers();\n\t\tsetHoveredComp(undefined);\n\t\tsetPopupMenu(undefined);\n\t\tif (option?.layout == 'popup') {\n\t\t\tconst top = determineElementTop();\n\t\t\ttop && setPopupMenuTop(top);\n\t\t\tsetPopupMenu(option);\n\t\t} else {\n\t\t\tconst targetElement = document.getElementById(\n\t\t\t\toption.displayName?.split(' ')?.join('') || option.key.toString(),\n\t\t\t);\n\t\t\tif (targetElement) {\n\t\t\t\tconst topValue = calculateTopSideBarPosition(targetElement);\n\t\t\t\tsetSidebarEachMenuTop(topValue);\n\t\t\t}\n\t\t\tsetHoveredComp(option);\n\t\t\tinitiateAutoClose();\n\t\t}\n\t}, []);\n\tconst calculateTopSideBarPosition = (targetElement: HTMLElement) => {\n\t\tconst targetRect = targetElement.getBoundingClientRect();\n\t\tlet topValue = targetRect.top;\n\t\tconst innerStickyElements = targetElement.querySelectorAll('div');\n\t\tlet innerStickyElement = null as HTMLElement | null;\n\t\tconst innerHeight = window.innerHeight;\n\t\tif (innerHeight <= 768) {\n\t\t\treturn topValue;\n\t\t}\n\t\tinnerStickyElements.forEach((element) => {\n\t\t\tif (element.className.includes('sticky')) {\n\t\t\t\tinnerStickyElement = element;\n\t\t\t}\n\t\t});\n\t\tif (innerStickyElement) {\n\t\t\tconst windowHeight = window.innerHeight;\n\t\t\tconst distanceToBottom = windowHeight - targetRect.bottom;\n\t\t\ttopValue = targetRect.top + distanceToBottom - 200; // sample height for lower elements\n\t\t}\n\t\treturn topValue;\n\t};\n\n\tuseEffect(() => {\n\t\tconst handleResize = () => {\n\t\t\tconst newTop = determineElementTop();\n\t\t\tnewTop && setPopupMenuTop(newTop);\n\t\t\tdetermineSideMenuTopWhileResize();\n\t\t};\n\t\twindow.addEventListener('resize', handleResize);\n\t\treturn () => {\n\t\t\twindow.removeEventListener('resize', handleResize);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\tconst determineSideMenuTopWhileResize = () => {\n\t\tconst openSideMenuElement = document.getElementById('_sub-menu');\n\t\tconst openSideMenuElementHeight =\n\t\t\topenSideMenuElement?.getBoundingClientRect().height;\n\t\tif (openSideMenuElementHeight) {\n\t\t\tsetSidebarEachMenuTop(window.innerHeight - openSideMenuElementHeight);\n\t\t}\n\t};\n\tconst determineElementTop = () => {\n\t\tif (popupMenu) {\n\t\t\tconst currentId =\n\t\t\t\tpopupMenu.displayName?.split(' ')?.join('') + '_sub' ||\n\t\t\t\tpopupMenu.key.toString() + '_sub';\n\n\t\t\tconst targetElement = document.getElementById(currentId);\n\t\t\tif (targetElement) {\n\t\t\t\tconst sideMenuRect = targetElement.getBoundingClientRect();\n\t\t\t\tlet divBoxTop = sideMenuRect.top;\n\t\t\t\tconst popupHeight = popupMinHeight ?? 320;\n\t\t\t\tif (sideMenuRect.bottom + popupHeight > window.innerHeight) {\n\t\t\t\t\tdivBoxTop -= sideMenuRect.bottom + popupHeight - window.innerHeight;\n\t\t\t\t}\n\t\t\t\treturn divBoxTop;\n\t\t\t}\n\t\t\treturn null;\n\t\t}\n\t};\n\n\tconst initiateAutoClose = () => {\n\t\tclearRemnantTimers();\n\t\tconst timer = setTimeout(() => setHoveredComp(undefined), 10000); // 10-second delay\n\t\tsetAutoCloseTimer(timer);\n\t};\n\n\tconst clearRemnantTimers = () => {\n\t\tclearTimeout(autoCloseTimer!);\n\t};\n\n\treturn (\n\t\t<SideBarContainer>\n\t\t\t<div\n\t\t\t\tclassName=\"bik-header-logo\"\n\t\t\t\tonClick={() => undefined}\n\t\t\t\tonKeyDown={() => undefined}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{logoSvg ? logoSvg : <BikIcon />}\n\t\t\t</div>\n\t\t\t<MainSideBarMenuWrapper style={menuStyle}>\n\t\t\t\t{allMenuList?.map((option, index) => (\n\t\t\t\t\t<Fragment key={index}>\n\t\t\t\t\t\t{option.path ? (\n\t\t\t\t\t\t\t<NavigationHyperlink href={option.path} router={router}>\n\t\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</NavigationHyperlink>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{option.layout === 'popup' && popupMenu?.children?.length && (\n\t\t\t\t\t\t\t\t<SidebarPopup\n\t\t\t\t\t\t\t\t\ttop={popupMenuTop ?? undefined}\n\t\t\t\t\t\t\t\t\tmenuList={popupMenu?.children}\n\t\t\t\t\t\t\t\t\tonClickingPopupMenu={(popupMenuSelected) => {\n\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem &&\n\t\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem(popupMenuSelected);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => setPopupMenu(undefined)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{hoveredComp?.children?.length && (\n\t\t\t\t\t\t\t\t<SimpleSidebar\n\t\t\t\t\t\t\t\t\tmenuList={hoveredComp?.children}\n\t\t\t\t\t\t\t\t\tactiveMenu={subActiveMenu}\n\t\t\t\t\t\t\t\t\tonMouseEnterOnMenu={() => clearRemnantTimers()}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => {\n\t\t\t\t\t\t\t\t\t\tclearRemnantTimers();\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tleft={isNewSidebar ? 92 : 88}\n\t\t\t\t\t\t\t\t\tpostion={'fixed'}\n\t\t\t\t\t\t\t\t\theader={hoveredComp.displayName}\n\t\t\t\t\t\t\t\t\ttheme={'brand'}\n\t\t\t\t\t\t\t\t\trouter={router}\n\t\t\t\t\t\t\t\t\tshowAccessUpgradePanel={hoveredComp.showAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\tonMenuClick={(menuSelected, reDirect) => {\n\t\t\t\t\t\t\t\t\t\tsetSubActiveMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t\tsetMainActiveMenu(hoveredComp);\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t\treDirect && onClickingSubMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonUpgrade={onClickingAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\ttop={\n\t\t\t\t\t\t\t\t\t\tisNewSidebar\n\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisNewSidebar={isNewSidebar}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t</Fragment>\n\t\t\t\t))}\n\t\t\t\t{typeof bikSidebarProps.onboardingPercentage === 'number' && (\n\t\t\t\t\t<SibeBarMenuItem>\n\t\t\t\t\t\t<div className=\"main--sidebar\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tid={'bik-onboarding__checklist'}\n\t\t\t\t\t\t\t\tclassName={`sidebar-menu-item ${\n\t\t\t\t\t\t\t\t\tnumberOfStickyOptions === 0\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu'\n\t\t\t\t\t\t\t\t\t\t: numberOfStickyOptions === 1\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu-int'\n\t\t\t\t\t\t\t\t\t\t: 'sticky-menu-three'\n\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CircularProgressBar\n\t\t\t\t\t\t\t\t\tpercentage={bikSidebarProps.onboardingPercentage}\n\t\t\t\t\t\t\t\t\twidth={48}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</SibeBarMenuItem>\n\t\t\t\t)}\n\t\t\t</MainSideBarMenuWrapper>\n\t\t</SideBarContainer>\n\t);\n};\n\nconst IconComponent: React.FC<{\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisActive: boolean;\n\tactiveStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\thoverStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisHovered: boolean;\n}> = (iconComponentProps) => {\n\tconst { icon, isActive, activeStateIcon, hoverStateIcon, isHovered } =\n\t\ticonComponentProps;\n\tconst Icon = icon;\n\tconst ActiveIcon = activeStateIcon;\n\tconst HoverIcon = hoverStateIcon;\n\treturn (\n\t\t<>\n\t\t\t{isActive ? (\n\t\t\t\t<ActiveIcon width={20} height={20} />\n\t\t\t) : isHovered ? (\n\t\t\t\t<HoverIcon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t) : (\n\t\t\t\t<Icon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nconst EachSidebarMenuItem: React.FC<GetSideBarMenuItemProps> = ({\n\toption,\n\tindex,\n\tonClickMainMenuLogic,\n\tsetHandleHoverForFullLayout,\n\tisDisabled,\n\tsetHoveredComp,\n\tsetPopupMenu,\n\tmainActiveMenu,\n\thoveredComp,\n\tpopupMenu,\n}) => {\n\treturn (\n\t\t<SibeBarMenuItem>\n\t\t\t<div\n\t\t\t\tid={option.displayName?.split(' ')?.join('') || option.key.toString()}\n\t\t\t\tclassName=\"main--sidebar\"\n\t\t\t\tkey={index}\n\t\t\t\tonClick={() => onClickMainMenuLogic(option)}\n\t\t\t\tonMouseEnter={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseOver={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={() => {\n\t\t\t\t\tif (!option?.children?.length) {\n\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonFocus={() => {\n\t\t\t\t\t// do nothing\n\t\t\t\t}}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{option.isNew && (\n\t\t\t\t\t<div className={`new-tag ${option.isLastSticky ? 'tag-sticky' : ''}`}>\n\t\t\t\t\t\tNEW\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t{option.isLocked && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={`locked--channel ${\n\t\t\t\t\t\t\toption.isLastSticky ? 'tag-sticky' : ''\n\t\t\t\t\t\t} ${option.is2ndLastSticky ? 'tag-sticky-2' : ''}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<LockedIcon height={16} width={16} />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tkey={index}\n\t\t\t\t\tid={\n\t\t\t\t\t\toption.displayName?.split(' ')?.join('') + '_sub' ||\n\t\t\t\t\t\toption.key.toString() + '_sub'\n\t\t\t\t\t}\n\t\t\t\t\tclassName={`sidebar-menu-item \n\t\t\t\t\t${mainActiveMenu?.key === option.key ? 'main-menu-active-class' : ''} \n\t\t\t\t\t${option.isLastSticky ? 'sticky-menu-int' : ''} \n\t\t\t\t\t${option.is2ndLastSticky ? 'sticky-menu' : ''} \n\t\t\t\t\t${option.key === hoveredComp?.key ? 'sidebar-menu-item-hover' : ''} \n\t\t\t\t\t${option.isNew ? 'new-menu-item' : ''}`}\n\t\t\t\t>\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\ticon={option.icon}\n\t\t\t\t\t\tisActive={option.key == mainActiveMenu?.key}\n\t\t\t\t\t\tactiveStateIcon={\n\t\t\t\t\t\t\toption.activeIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\thoverStateIcon={\n\t\t\t\t\t\t\toption.hoverIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisHovered={\n\t\t\t\t\t\t\toption.key == hoveredComp?.key || option.key == popupMenu?.key\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"menu-item-container\">\n\t\t\t\t\t\t<p\n\t\t\t\t\t\t\tclassName={`menu-item-text ${\n\t\t\t\t\t\t\t\toption?.key === mainActiveMenu?.key\n\t\t\t\t\t\t\t\t\t? 'active-menu-item-text'\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{option.displayName}\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</SibeBarMenuItem>\n\t);\n};\n"],"names":["BikSidebar","IconComponent","iconComponentProps","icon","isActive","activeStateIcon","hoverStateIcon","isHovered","Icon","ActiveIcon","HoverIcon","_jsx","_Fragment","children","jsx","width","height","color","COLORS","surface","standard","EachSidebarMenuItem","_ref","option","index","onClickMainMenuLogic","setHandleHoverForFullLayout","isDisabled","setHoveredComp","setPopupMenu","mainActiveMenu","hoveredComp","popupMenu","SibeBarMenuItem","_jsxs","id","_b","_a","displayName","split","join","key","toString","className","onClick","onMouseEnter","onMouseOver","onMouseLeave","length","undefined","onFocus","isNew","Object","assign","isLastSticky","isLocked","is2ndLastSticky","LockedIcon","_d","_c","_e","activeIcon","hoverIcon","_f","bikSidebarProps","logoSvg","allMenuList","activeMainMenu","activeSubMenu","router","onClickingMainMenu","onClickingSubMenu","onClickingAccessUpgradePanel","onClickingPopupMenuItem","popupMinHeight","isNewSidebar","menuStyle","setMainActiveMenu","useState","subActiveMenu","setSubActiveMenu","setIsDisabled","popupMenuTop","setPopupMenuTop","sidebarEachMenuTop","setSidebarEachMenuTop","autoCloseTimer","setAutoCloseTimer","numberOfStickyOptions","useMemo","filter","menu","useEffect","useCallback","layout","path","setTimeout","clearRemnantTimers","top","determineElementTop","targetElement","document","getElementById","topValue","calculateTopSideBarPosition","initiateAutoClose","targetRect","getBoundingClientRect","innerStickyElements","querySelectorAll","innerStickyElement","window","innerHeight","forEach","element","includes","distanceToBottom","bottom","handleResize","newTop","determineSideMenuTopWhileResize","addEventListener","removeEventListener","openSideMenuElement","openSideMenuElementHeight","currentId","sideMenuRect","divBoxTop","popupHeight","timer","clearTimeout","SideBarContainer","onKeyDown","BikIcon","jsxs","MainSideBarMenuWrapper","style","map","Fragment","NavigationHyperlink","href","SidebarPopup","menuList","onClickingPopupMenu","popupMenuSelected","onMouseLeaveOnMenu","SimpleSidebar","activeMenu","onMouseEnterOnMenu","left","postion","header","theme","showAccessUpgradePanel","onMenuClick","menuSelected","reDirect","onUpgrade","onboardingPercentage","CircularProgressBar","percentage"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BikSidebar.js","sources":["../../../../src/components/bik-layout/BikSidebar.tsx"],"sourcesContent":["import BikIcon from '@src/assets/icons/Bik_logo.svg';\nimport LockedIcon from '@src/assets/icons/locked.svg';\nimport { Fragment, useCallback, useEffect, useMemo, useState } from 'react';\nimport React from 'react';\nimport CircularProgressBar from '@src/components/progress-bar/CircularProgressBar';\nimport { COLORS } from '@src/constants/Theme';\nimport { NavigationHyperlink } from '../navigation-hyperlink/NavigationHyperlink';\nimport { Menu } from './Sidebar.model';\nimport { SidebarPopup } from './SidebarPopup';\nimport {\n\tMainSideBarMenuWrapper,\n\tSibeBarMenuItem,\n\tSideBarContainer,\n} from './SidebarStyles';\nimport { SimpleSidebar } from './SimpleSidebar';\n\nexport interface MenuItem {\n\tkey: string | number;\n\tdisplayName: string;\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Main Icon element that is to display\n\tactiveIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Icon element to pass when the menu is active\n\thoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; //Icon element to pass when the menu is hovered upon\n\tisLastSticky?: boolean; // to stick any menu at the end of the list\n\tis2ndLastSticky?: boolean; // to stick any menu at 2nd last end of list\n\tchildren?: Menu[];\n\tshowAccessUpgradePanel?: boolean;\n\tpath?: string;\n\tlayout?: 'fullScreen' | 'popup' | string | undefined;\n\tisNew?: boolean;\n\tisLocked?: boolean;\n}\n\nexport interface BikSidebarProps {\n\tlogoSvg?: JSX.Element;\n\tallMenuList: MenuItem[];\n\tactiveMainMenu: MenuItem;\n\tactiveSubMenu: Menu;\n\trouter: any;\n\tonClickingMainMenu: (menu: MenuItem) => void;\n\tonClickingSubMenu: (subMenu: Menu) => void;\n\tonClickingAccessUpgradePanel?: () => void;\n\tonClickingPopupMenuItem?: (menu: Menu) => void;\n\tpopupMinHeight?: number;\n\tisNewSidebar?: boolean;\n\tonboardingPercentage?: number;\n\tmenuStyle?: React.CSSProperties;\n}\n\ninterface GetSideBarMenuItemProps {\n\toption: MenuItem;\n\tindex: number;\n\tonClickMainMenuLogic: (option: MenuItem) => void;\n\tsetHandleHoverForFullLayout: (option: MenuItem) => void;\n\tisDisabled: boolean;\n\tsetHoveredComp: (comp: any) => void;\n\tsetPopupMenu: (menu: any) => void;\n\tmainActiveMenu: MenuItem | undefined;\n\thoveredComp: MenuItem | undefined;\n\tpopupMenu: MenuItem | undefined;\n}\n\nexport const BikSidebar: React.FC<BikSidebarProps> = (bikSidebarProps) => {\n\tconst {\n\t\tlogoSvg,\n\t\tallMenuList,\n\t\tactiveMainMenu,\n\t\tactiveSubMenu,\n\t\trouter,\n\t\tonClickingMainMenu,\n\t\tonClickingSubMenu,\n\t\tonClickingAccessUpgradePanel,\n\t\tonClickingPopupMenuItem,\n\t\tpopupMinHeight,\n\t\tisNewSidebar,\n\t\tmenuStyle,\n\t} = bikSidebarProps;\n\tconst [mainActiveMenu, setMainActiveMenu] =\n\t\tuseState<MenuItem>(activeMainMenu);\n\tconst [hoveredComp, setHoveredComp] = useState<MenuItem>();\n\tconst [subActiveMenu, setSubActiveMenu] = useState<Menu>(activeSubMenu);\n\tconst [isDisabled, setIsDisabled] = useState(false);\n\tconst [popupMenu, setPopupMenu] = useState<MenuItem>();\n\tconst [popupMenuTop, setPopupMenuTop] = useState<number>();\n\tconst [sidebarEachMenuTop, setSidebarEachMenuTop] = useState<number>();\n\tconst [autoCloseTimer, setAutoCloseTimer] = useState<NodeJS.Timeout | null>(\n\t\tnull,\n\t);\n\tconst numberOfStickyOptions = useMemo(\n\t\t() =>\n\t\t\tallMenuList.filter((menu) => menu.is2ndLastSticky || menu.isLastSticky)\n\t\t\t\t.length,\n\t\t[allMenuList],\n\t);\n\n\tuseEffect(() => {\n\t\tsetMainActiveMenu(activeMainMenu);\n\t}, [activeMainMenu]);\n\n\tuseEffect(() => {\n\t\tsetSubActiveMenu(activeSubMenu);\n\t}, [activeSubMenu]);\n\n\tconst onClickMainMenuLogic = useCallback(\n\t\t(option: MenuItem) => {\n\t\t\tif (option?.layout === 'popup') {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetPopupMenu(undefined);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetIsDisabled(true);\n\t\t\tsetMainActiveMenu(option);\n\t\t\tif (!option.path) {\n\t\t\t\tonClickingMainMenu(option);\n\t\t\t}\n\t\t\toption?.children?.length\n\t\t\t\t? setSubActiveMenu(option?.children[0])\n\t\t\t\t: setSubActiveMenu({} as Menu);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsDisabled(false);\n\t\t\t}, 1000);\n\t\t},\n\t\t[onClickingMainMenu],\n\t);\n\n\tconst setHandleHoverForFullLayout = useCallback((option: MenuItem) => {\n\t\tclearRemnantTimers();\n\t\tsetHoveredComp(undefined);\n\t\tsetPopupMenu(undefined);\n\t\tif (option?.layout == 'popup') {\n\t\t\tconst top = determineElementTop();\n\t\t\ttop && setPopupMenuTop(top);\n\t\t\tsetPopupMenu(option);\n\t\t} else {\n\t\t\tconst targetElement = document.getElementById(\n\t\t\t\toption.displayName?.split(' ')?.join('') || option.key.toString(),\n\t\t\t);\n\t\t\tif (targetElement) {\n\t\t\t\tconst topValue = calculateTopSideBarPosition(targetElement);\n\t\t\t\tsetSidebarEachMenuTop(topValue);\n\t\t\t}\n\t\t\tsetHoveredComp(option);\n\t\t\tinitiateAutoClose();\n\t\t}\n\t}, []);\n\tconst calculateTopSideBarPosition = (targetElement: HTMLElement) => {\n\t\tconst targetRect = targetElement.getBoundingClientRect();\n\t\tlet topValue = targetRect.top;\n\t\tconst innerStickyElements = targetElement.querySelectorAll('div');\n\t\tlet innerStickyElement = null as HTMLElement | null;\n\t\tconst innerHeight = window.innerHeight;\n\t\tif (innerHeight <= 768) {\n\t\t\treturn topValue;\n\t\t}\n\t\tinnerStickyElements.forEach((element) => {\n\t\t\tif (element.className.includes('sticky')) {\n\t\t\t\tinnerStickyElement = element;\n\t\t\t}\n\t\t});\n\t\tif (innerStickyElement) {\n\t\t\tconst windowHeight = window.innerHeight;\n\t\t\tconst distanceToBottom = windowHeight - targetRect.bottom;\n\t\t\ttopValue = targetRect.top + distanceToBottom - 200; // sample height for lower elements\n\t\t}\n\t\treturn topValue;\n\t};\n\n\tuseEffect(() => {\n\t\tconst handleResize = () => {\n\t\t\tconst newTop = determineElementTop();\n\t\t\tnewTop && setPopupMenuTop(newTop);\n\t\t\tdetermineSideMenuTopWhileResize();\n\t\t};\n\t\twindow.addEventListener('resize', handleResize);\n\t\treturn () => {\n\t\t\twindow.removeEventListener('resize', handleResize);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\tconst determineSideMenuTopWhileResize = () => {\n\t\tconst openSideMenuElement = document.getElementById('_sub-menu');\n\t\tconst openSideMenuElementHeight =\n\t\t\topenSideMenuElement?.getBoundingClientRect().height;\n\t\tif (openSideMenuElementHeight) {\n\t\t\tsetSidebarEachMenuTop(window.innerHeight - openSideMenuElementHeight);\n\t\t}\n\t};\n\tconst determineElementTop = () => {\n\t\tif (popupMenu) {\n\t\t\tconst currentId =\n\t\t\t\tpopupMenu.displayName?.split(' ')?.join('') + '_sub' ||\n\t\t\t\tpopupMenu.key.toString() + '_sub';\n\n\t\t\tconst targetElement = document.getElementById(currentId);\n\t\t\tif (targetElement) {\n\t\t\t\tconst sideMenuRect = targetElement.getBoundingClientRect();\n\t\t\t\tlet divBoxTop = sideMenuRect.top;\n\t\t\t\tconst popupHeight = popupMinHeight ?? 320;\n\t\t\t\tif (sideMenuRect.bottom + popupHeight > window.innerHeight) {\n\t\t\t\t\tdivBoxTop -= sideMenuRect.bottom + popupHeight - window.innerHeight;\n\t\t\t\t}\n\t\t\t\treturn divBoxTop;\n\t\t\t}\n\t\t\treturn null;\n\t\t}\n\t};\n\n\tconst initiateAutoClose = () => {\n\t\tclearRemnantTimers();\n\t\tconst timer = setTimeout(() => setHoveredComp(undefined), 10000); // 10-second delay\n\t\tsetAutoCloseTimer(timer);\n\t};\n\n\tconst clearRemnantTimers = () => {\n\t\tclearTimeout(autoCloseTimer!);\n\t};\n\n\treturn (\n\t\t<SideBarContainer>\n\t\t\t<div\n\t\t\t\tclassName=\"bik-header-logo\"\n\t\t\t\tonClick={() => undefined}\n\t\t\t\tonKeyDown={() => undefined}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{logoSvg ? logoSvg : <BikIcon />}\n\t\t\t</div>\n\t\t\t<MainSideBarMenuWrapper style={menuStyle}>\n\t\t\t\t{allMenuList?.map((option, index) => (\n\t\t\t\t\t<Fragment key={index}>\n\t\t\t\t\t\t{option.path ? (\n\t\t\t\t\t\t\t<NavigationHyperlink href={option.path} router={router}>\n\t\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</NavigationHyperlink>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{option.layout === 'popup' && popupMenu?.children?.length && (\n\t\t\t\t\t\t\t\t<SidebarPopup\n\t\t\t\t\t\t\t\t\ttop={popupMenuTop ?? undefined}\n\t\t\t\t\t\t\t\t\tmenuList={popupMenu?.children}\n\t\t\t\t\t\t\t\t\tonClickingPopupMenu={(popupMenuSelected) => {\n\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem &&\n\t\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem(popupMenuSelected);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => setPopupMenu(undefined)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{hoveredComp?.children?.length && (\n\t\t\t\t\t\t\t\t<SimpleSidebar\n\t\t\t\t\t\t\t\t\tmenuList={hoveredComp?.children}\n\t\t\t\t\t\t\t\t\tactiveMenu={subActiveMenu}\n\t\t\t\t\t\t\t\t\tonMouseEnterOnMenu={() => clearRemnantTimers()}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => {\n\t\t\t\t\t\t\t\t\t\tclearRemnantTimers();\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tleft={isNewSidebar ? 92 : 88}\n\t\t\t\t\t\t\t\t\tpostion={'fixed'}\n\t\t\t\t\t\t\t\t\theader={hoveredComp.displayName}\n\t\t\t\t\t\t\t\t\ttheme={'brand'}\n\t\t\t\t\t\t\t\t\trouter={router}\n\t\t\t\t\t\t\t\t\tshowAccessUpgradePanel={hoveredComp.showAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\tonMenuClick={(menuSelected, reDirect) => {\n\t\t\t\t\t\t\t\t\t\tsetSubActiveMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t\tsetMainActiveMenu(hoveredComp);\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t\treDirect && onClickingSubMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonUpgrade={onClickingAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\ttop={\n\t\t\t\t\t\t\t\t\t\tisNewSidebar\n\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisNewSidebar={isNewSidebar}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t</Fragment>\n\t\t\t\t))}\n\t\t\t\t{typeof bikSidebarProps.onboardingPercentage === 'number' && (\n\t\t\t\t\t<SibeBarMenuItem>\n\t\t\t\t\t\t<div className=\"main--sidebar\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tid={'bik-onboarding__checklist'}\n\t\t\t\t\t\t\t\tclassName={`sidebar-menu-item ${\n\t\t\t\t\t\t\t\t\tnumberOfStickyOptions === 0\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu'\n\t\t\t\t\t\t\t\t\t\t: numberOfStickyOptions === 1\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu-int'\n\t\t\t\t\t\t\t\t\t\t: 'sticky-menu-three'\n\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CircularProgressBar\n\t\t\t\t\t\t\t\t\tpercentage={bikSidebarProps.onboardingPercentage}\n\t\t\t\t\t\t\t\t\twidth={48}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</SibeBarMenuItem>\n\t\t\t\t)}\n\t\t\t</MainSideBarMenuWrapper>\n\t\t</SideBarContainer>\n\t);\n};\n\nconst IconComponent: React.FC<{\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisActive: boolean;\n\tactiveStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\thoverStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisHovered: boolean;\n}> = (iconComponentProps) => {\n\tconst { icon, isActive, activeStateIcon, hoverStateIcon, isHovered } =\n\t\ticonComponentProps;\n\tconst Icon = icon;\n\tconst ActiveIcon = activeStateIcon;\n\tconst HoverIcon = hoverStateIcon;\n\treturn (\n\t\t<>\n\t\t\t{isActive ? (\n\t\t\t\t<ActiveIcon width={20} height={20} />\n\t\t\t) : isHovered ? (\n\t\t\t\t<HoverIcon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t) : (\n\t\t\t\t<Icon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nconst EachSidebarMenuItem: React.FC<GetSideBarMenuItemProps> = ({\n\toption,\n\tindex,\n\tonClickMainMenuLogic,\n\tsetHandleHoverForFullLayout,\n\tisDisabled,\n\tsetHoveredComp,\n\tsetPopupMenu,\n\tmainActiveMenu,\n\thoveredComp,\n\tpopupMenu,\n}) => {\n\treturn (\n\t\t<SibeBarMenuItem>\n\t\t\t<div\n\t\t\t\tid={option.displayName?.split(' ')?.join('') || option.key.toString()}\n\t\t\t\tclassName=\"main--sidebar\"\n\t\t\t\tkey={index}\n\t\t\t\tonClick={() => onClickMainMenuLogic(option)}\n\t\t\t\tonMouseEnter={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseOver={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={() => {\n\t\t\t\t\tif (!option?.children?.length) {\n\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonFocus={() => {}}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{option.isNew && (\n\t\t\t\t\t<div className={`new-tag ${option.isLastSticky ? 'tag-sticky' : ''}`}>\n\t\t\t\t\t\tNEW\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t{option.isLocked && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={`locked--channel ${\n\t\t\t\t\t\t\toption.isLastSticky ? 'tag-sticky' : ''\n\t\t\t\t\t\t} ${option.is2ndLastSticky ? 'tag-sticky-2' : ''}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<LockedIcon height={16} width={16} />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tkey={index}\n\t\t\t\t\tid={\n\t\t\t\t\t\toption.displayName?.split(' ')?.join('') + '_sub' ||\n\t\t\t\t\t\toption.key.toString() + '_sub'\n\t\t\t\t\t}\n\t\t\t\t\tclassName={`sidebar-menu-item \n\t\t\t\t\t${mainActiveMenu?.key === option.key ? 'main-menu-active-class' : ''} \n\t\t\t\t\t${option.isLastSticky ? 'sticky-menu-int' : ''} \n\t\t\t\t\t${option.is2ndLastSticky ? 'sticky-menu' : ''} \n\t\t\t\t\t${option.key === hoveredComp?.key ? 'sidebar-menu-item-hover' : ''} \n\t\t\t\t\t${option.isNew ? 'new-menu-item' : ''}`}\n\t\t\t\t>\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\ticon={option.icon}\n\t\t\t\t\t\tisActive={option.key == mainActiveMenu?.key}\n\t\t\t\t\t\tactiveStateIcon={\n\t\t\t\t\t\t\toption.activeIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\thoverStateIcon={\n\t\t\t\t\t\t\toption.hoverIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisHovered={\n\t\t\t\t\t\t\toption.key == hoveredComp?.key || option.key == popupMenu?.key\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"menu-item-container\">\n\t\t\t\t\t\t<p\n\t\t\t\t\t\t\tclassName={`menu-item-text ${\n\t\t\t\t\t\t\t\toption?.key === mainActiveMenu?.key\n\t\t\t\t\t\t\t\t\t? 'active-menu-item-text'\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{option.displayName}\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</SibeBarMenuItem>\n\t);\n};\n"],"names":["BikSidebar","IconComponent","iconComponentProps","icon","isActive","activeStateIcon","hoverStateIcon","isHovered","Icon","ActiveIcon","HoverIcon","_jsx","_Fragment","children","jsx","width","height","color","COLORS","surface","standard","EachSidebarMenuItem","_ref","option","index","onClickMainMenuLogic","setHandleHoverForFullLayout","isDisabled","setHoveredComp","setPopupMenu","mainActiveMenu","hoveredComp","popupMenu","SibeBarMenuItem","_jsxs","id","_b","_a","displayName","split","join","key","toString","className","onClick","onMouseEnter","onMouseOver","onMouseLeave","length","undefined","onFocus","isNew","Object","assign","isLastSticky","isLocked","is2ndLastSticky","LockedIcon","jsxs","_d","_c","_e","activeIcon","hoverIcon","_f","bikSidebarProps","logoSvg","allMenuList","activeMainMenu","activeSubMenu","router","onClickingMainMenu","onClickingSubMenu","onClickingAccessUpgradePanel","onClickingPopupMenuItem","popupMinHeight","isNewSidebar","menuStyle","setMainActiveMenu","useState","subActiveMenu","setSubActiveMenu","setIsDisabled","popupMenuTop","setPopupMenuTop","sidebarEachMenuTop","setSidebarEachMenuTop","autoCloseTimer","setAutoCloseTimer","numberOfStickyOptions","useMemo","filter","menu","useEffect","useCallback","layout","path","setTimeout","clearRemnantTimers","top","determineElementTop","targetElement","document","getElementById","topValue","calculateTopSideBarPosition","initiateAutoClose","targetRect","getBoundingClientRect","innerStickyElements","querySelectorAll","innerStickyElement","window","innerHeight","forEach","element","includes","distanceToBottom","bottom","handleResize","newTop","determineSideMenuTopWhileResize","addEventListener","removeEventListener","openSideMenuElement","openSideMenuElementHeight","currentId","sideMenuRect","divBoxTop","popupHeight","timer","clearTimeout","SideBarContainer","onKeyDown","BikIcon","MainSideBarMenuWrapper","style","map","Fragment","NavigationHyperlink","href","SidebarPopup","menuList","onClickingPopupMenu","popupMenuSelected","onMouseLeaveOnMenu","SimpleSidebar","activeMenu","onMouseEnterOnMenu","left","postion","header","theme","showAccessUpgradePanel","onMenuClick","menuSelected","reDirect","onUpgrade","onboardingPercentage","CircularProgressBar","percentage"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),s=require("../spinner/Spinner.js"),o=require("./Button.styled.js"),i=require("./themes.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=r(n);const c=n.forwardRef(((r,c)=>{var{version:l,id:d,buttonType:u="primary",size:b="small",buttonText:m,disabled:j,IconComponent:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),s=require("../spinner/Spinner.js"),o=require("./Button.styled.js"),i=require("./themes.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=r(n);const c=n.forwardRef(((r,c)=>{var{version:l,id:d,buttonType:u="primary",size:b="small",buttonText:m,disabled:j,IconComponent:g,LeadingIcon:x,TrailingIcon:h,isLoading:p,inverse:v,onClick:C,matchParentWidth:y,subtitle:I,darkMode:f,activated:N,error:O,buttonTextColor:T,buttonFontSize:z,customIconColor:k,buttonColor:B,LeadingIconStyles:S}=r,L=e.__rest(r,["version","id","buttonType","size","buttonText","disabled","IconComponent","LeadingIcon","TrailingIcon","isLoading","inverse","onClick","matchParentWidth","subtitle","darkMode","activated","error","buttonTextColor","buttonFontSize","customIconColor","buttonColor","LeadingIconStyles"]);const q=i.GetButtonTextComponent(b,u,j),_=i.getButtonIconColor(b,u,v,j,p,f),M=n.useCallback((()=>{const e="chip"===b?16:20;return{height:e,width:e,color:k||_,style:{display:"block"},className:"icon"}}),[b,k,_]);return t.jsx(o.Button,Object.assign({"data-test":L["data-test"],version:l,onClick:p?()=>{}:C,ref:c,id:d,disabled:j,size:b,buttonType:u,isLoading:p,inverse:v,matchParentWidth:y,darkMode:f,activated:N,error:O,buttonColor:B},L,{children:t.jsxs("div",Object.assign({className:"button-container"},{children:[u.startsWith("dash")&&t.jsx(o.ButtonCustomDashedBorder,{}),t.jsx("div",Object.assign({className:"overlay-container"},{children:p&&t.jsx(s.Spinner,{className:"spinner",size:"small",color:i.SpinnerColorMap(u,v)})})),g&&t.jsx("div",Object.assign({className:"icon-component"},{children:a.default.createElement(g,M())})),x&&t.jsx("div",Object.assign({className:"icon-leading",style:Object.assign({zIndex:1},S)},{children:a.default.createElement(x,M())})),m?t.jsxs(q,Object.assign({className:"text",style:{color:T,fontSize:z}},{children:[m,t.jsx("div",Object.assign({className:"text-subtitle"},{children:I}))]})):t.jsx(t.Fragment,{}),h&&t.jsx("div",Object.assign({className:"icon-trailing",style:{zIndex:1}},{children:a.default.createElement(h,M())}))]}))}))}));c.displayName="Button",exports.Button=c;
|
|
2
2
|
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import { forwardRef, useCallback } from 'react';\nimport React from 'react';\nimport { Spinner } from '../spinner';\nimport * as Sc from './Button.styled';\nimport { ButtonProps } from './model';\nimport {\n\tgetButtonIconColor,\n\tGetButtonTextComponent,\n\tSpinnerColorMap,\n} from './themes';\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\tversion,\n\t\t\tid,\n\t\t\tbuttonType = 'primary',\n\t\t\tsize = 'small',\n\t\t\tbuttonText,\n\t\t\tdisabled,\n\t\t\tIconComponent,\n\t\t\tLeadingIcon,\n\t\t\tTrailingIcon,\n\t\t\tisLoading,\n\t\t\tinverse,\n\t\t\tonClick,\n\t\t\tmatchParentWidth,\n\t\t\tsubtitle,\n\t\t\tdarkMode,\n\t\t\tactivated,\n\t\t\terror,\n\t\t\tbuttonTextColor,\n\t\t\tbuttonFontSize,\n\t\t\tcustomIconColor,\n\t\t\tbuttonColor,\n\t\t\tLeadingIconStyles,\n\t\t\t...rest\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ButtonTextElement = GetButtonTextComponent(\n\t\t\tsize,\n\t\t\tbuttonType,\n\t\t\tdisabled,\n\t\t);\n\n\t\tconst iconColor = getButtonIconColor(\n\t\t\tsize,\n\t\t\tbuttonType,\n\t\t\tinverse,\n\t\t\tdisabled,\n\t\t\tisLoading,\n\t\t\tdarkMode,\n\t\t);\n\n\t\tconst getIconProps = useCallback(() => {\n\t\t\tconst iconSize = size === 'chip'
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import { forwardRef, useCallback } from 'react';\nimport React from 'react';\nimport { Spinner } from '../spinner';\nimport * as Sc from './Button.styled';\nimport { ButtonProps } from './model';\nimport {\n\tgetButtonIconColor,\n\tGetButtonTextComponent,\n\tSpinnerColorMap,\n} from './themes';\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\tversion,\n\t\t\tid,\n\t\t\tbuttonType = 'primary',\n\t\t\tsize = 'small',\n\t\t\tbuttonText,\n\t\t\tdisabled,\n\t\t\tIconComponent,\n\t\t\tLeadingIcon,\n\t\t\tTrailingIcon,\n\t\t\tisLoading,\n\t\t\tinverse,\n\t\t\tonClick,\n\t\t\tmatchParentWidth,\n\t\t\tsubtitle,\n\t\t\tdarkMode,\n\t\t\tactivated,\n\t\t\terror,\n\t\t\tbuttonTextColor,\n\t\t\tbuttonFontSize,\n\t\t\tcustomIconColor,\n\t\t\tbuttonColor,\n\t\t\tLeadingIconStyles,\n\t\t\t...rest\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst ButtonTextElement = GetButtonTextComponent(\n\t\t\tsize,\n\t\t\tbuttonType,\n\t\t\tdisabled,\n\t\t);\n\n\t\tconst iconColor = getButtonIconColor(\n\t\t\tsize,\n\t\t\tbuttonType,\n\t\t\tinverse,\n\t\t\tdisabled,\n\t\t\tisLoading,\n\t\t\tdarkMode,\n\t\t);\n\n\t\tconst getIconProps = useCallback(() => {\n\t\t\tconst iconSize = size === 'chip' ? 16 : 20;\n\t\t\treturn {\n\t\t\t\theight: iconSize,\n\t\t\t\twidth: iconSize,\n\t\t\t\tcolor: customIconColor ? customIconColor : iconColor,\n\t\t\t\tstyle: { display: 'block' },\n\t\t\t\tclassName: 'icon',\n\t\t\t};\n\t\t}, [size, customIconColor, iconColor]);\n\n\t\treturn (\n\t\t\t<Sc.Button\n\t\t\t\tdata-test={rest['data-test']}\n\t\t\t\tversion={version}\n\t\t\t\tonClick={\n\t\t\t\t\tisLoading\n\t\t\t\t\t\t? () => {\n\t\t\t\t\t\t\t\t// Do nothing\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: onClick\n\t\t\t\t}\n\t\t\t\tref={ref}\n\t\t\t\tid={id}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tsize={size}\n\t\t\t\tbuttonType={buttonType}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\tinverse={inverse}\n\t\t\t\tmatchParentWidth={matchParentWidth}\n\t\t\t\tdarkMode={darkMode}\n\t\t\t\tactivated={activated}\n\t\t\t\terror={error}\n\t\t\t\tbuttonColor={buttonColor}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t<div className=\"button-container\">\n\t\t\t\t\t{buttonType.startsWith('dash') && <Sc.ButtonCustomDashedBorder />}\n\t\t\t\t\t<div className=\"overlay-container\">\n\t\t\t\t\t\t{isLoading && (\n\t\t\t\t\t\t\t<Spinner\n\t\t\t\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tcolor={SpinnerColorMap(buttonType, inverse)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t{IconComponent && (\n\t\t\t\t\t\t<div className=\"icon-component\">\n\t\t\t\t\t\t\t{React.createElement(IconComponent, getIconProps())}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t{LeadingIcon && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\tstyle={{ zIndex: 1, ...LeadingIconStyles }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(LeadingIcon, getIconProps())}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t{buttonText ? (\n\t\t\t\t\t\t<ButtonTextElement\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: buttonTextColor,\n\t\t\t\t\t\t\t\tfontSize: buttonFontSize,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{buttonText}\n\t\t\t\t\t\t\t<div className=\"text-subtitle\">{subtitle}</div>\n\t\t\t\t\t\t</ButtonTextElement>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<></>\n\t\t\t\t\t)}\n\t\t\t\t\t{TrailingIcon && (\n\t\t\t\t\t\t<div className=\"icon-trailing\" style={{ zIndex: 1 }}>\n\t\t\t\t\t\t\t{React.createElement(TrailingIcon, getIconProps())}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Sc.Button>\n\t\t);\n\t},\n);\n\nButton.displayName = 'Button';\n"],"names":["Button","forwardRef","_a","ref","version","id","buttonType","size","buttonText","disabled","IconComponent","LeadingIcon","TrailingIcon","isLoading","inverse","onClick","matchParentWidth","subtitle","darkMode","activated","error","buttonTextColor","buttonFontSize","customIconColor","buttonColor","LeadingIconStyles","rest","__rest","ButtonTextElement","GetButtonTextComponent","iconColor","getButtonIconColor","getIconProps","useCallback","iconSize","height","width","color","style","display","className","_jsx","Sc","children","_jsxs","jsxs","Object","assign","startsWith","jsx","Spinner","SpinnerColorMap","React","createElement","zIndex","fontSize","_Fragment","displayName"],"mappings":"+UAWO,MAAMA,EAASC,EAAUA,YAC/B,CACCC,EAyBAC,SAzBAC,QACCA,EAAOC,GACPA,EAAEC,WACFA,EAAa,UAASC,KACtBA,EAAO,QAAOC,WACdA,EAAUC,SACVA,EAAQC,cACRA,EAAaC,YACbA,EAAWC,aACXA,EAAYC,UACZA,EAASC,QACTA,EAAOC,QACPA,EAAOC,iBACPA,EAAgBC,SAChBA,EAAQC,SACRA,EAAQC,UACRA,EAASC,MACTA,EAAKC,gBACLA,EAAeC,eACfA,EAAcC,gBACdA,EAAeC,YACfA,EAAWC,kBACXA,KACGC,EAvBJC,EAAAA,OAAAzB,EAAA,CAAA,UAAA,KAAA,aAAA,OAAA,aAAA,WAAA,gBAAA,cAAA,eAAA,YAAA,UAAA,UAAA,mBAAA,WAAA,WAAA,YAAA,QAAA,kBAAA,iBAAA,kBAAA,cAAA,sBA2BA,MAAM0B,EAAoBC,EAAsBA,uBAC/CtB,EACAD,EACAG,GAGKqB,EAAYC,EAAkBA,mBACnCxB,EACAD,EACAQ,EACAL,EACAI,EACAK,GAGKc,EAAeC,EAAAA,aAAY,KAChC,MAAMC,EAAoB,SAAT3B,EAAkB,GAAK,GACxC,MAAO,CACN4B,OAAQD,EACRE,MAAOF,EACPG,MAAOd,GAAoCO,EAC3CQ,MAAO,CAAEC,QAAS,SAClBC,UAAW,OACX,GACC,CAACjC,EAAMgB,EAAiBO,IAE3B,OACCW,MAACC,EAAAA,kCACWhB,EAAK,aAChBtB,QAASA,EACTW,QACCF,EACG,OAGAE,EAEJZ,IAAKA,EACLE,GAAIA,EACJI,SAAUA,EACVF,KAAMA,EACND,WAAYA,EACZO,UAAWA,EACXC,QAASA,EACTE,iBAAkBA,EAClBE,SAAUA,EACVC,UAAWA,EACXC,MAAOA,EACPI,YAAaA,GACTE,EAEJ,CAAAiB,SAAAC,EAAAC,KAAA,MAAAC,OAAAC,OAAA,CAAKP,UAAU,+BACblC,EAAW0C,WAAW,SAAWP,EAACQ,IAAAP,2BAA2B,CAAA,GAC9DD,EAAAQ,IAAA,MAAAH,OAAAC,OAAA,CAAKP,UAAU,+BACb3B,GACA4B,EAACQ,IAAAC,UACA,CAAAV,UAAU,UACVjC,KAAK,QACL8B,MAAOc,EAAAA,gBAAgB7C,EAAYQ,QAIrCJ,GACA+B,EAAAA,IAAK,MAAAK,OAAAC,OAAA,CAAAP,UAAU,4BACbY,EAAAA,QAAMC,cAAc3C,EAAesB,QAGrCrB,GACA8B,EAAAA,yBACCD,UAAU,eACVF,MAASQ,OAAAC,OAAA,CAAAO,OAAQ,GAAM7B,IAAiB,CAAAkB,SAEvCS,EAAAA,QAAMC,cAAc1C,EAAaqB,QAGnCxB,EACAoC,EAAAA,KAAChB,EACAkB,OAAAC,OAAA,CAAAP,UAAU,OACVF,MAAO,CACND,MAAOhB,EACPkC,SAAUjC,IAGV,CAAAqB,SAAA,CAAAnC,EACDiC,EAAAA,IAAK,MAAAK,OAAAC,OAAA,CAAAP,UAAU,iBAAe,CAAAG,SAAE1B,SAGjCwB,MAAKe,EAAAA,SAAA,CAAA,GAEL5C,GACA6B,MAAA,MAAAK,OAAAC,OAAA,CAAKP,UAAU,gBAAgBF,MAAO,CAAEgB,OAAQ,IAC9C,CAAAX,SAAAS,EAAAA,QAAMC,cAAczC,EAAcoB,cAI3B,IAKfhC,EAAOyD,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@emotion/styled/base"),c=require("react/jsx-runtime"),d=require("../../constants/Theme.js"),n=require("./themes.js");function b(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}const l=b(t).default("button","production"===process.env.NODE_ENV?{target:"exlualr0"}:{target:"exlualr0",label:"Button"})("all:unset;outline:none;cursor:pointer;display:flex;gap:8.83px;border-radius:",(t=>"text"==t.buttonType?"0":"4px"),";overflow:hidden;",(t=>t.matchParentWidth?"flex-grow: 1;":"")," background-color:",(t=>n.getBackgroundColor(t.buttonType,t.size,t.inverse,t.darkMode,t.buttonColor)),";",(t=>{var c;return t.buttonType.startsWith("dash")?`.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tpadding: ${n.getPadding(t.buttonType,t.size)};\n\t\t\t\t}`:`padding: ${n.getPadding(t.buttonType,t.size)};\n\t${n.getBorder(null!==(c=t.version)&&void 0!==c?c:"1.0",t.buttonType,t.size,t.inverse,t.error)}`})," .icon-component{height:",(t=>"chip"===t.size||"xs"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size||"xs"===t.size?"16px":"20px"),";}.icon-trailing{height:",(t=>"chip"===t.size||"xs"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size||"xs"===t.size?"16px":"20px"),";}.text{color:",(t=>n.getColor(t.buttonType,t.size,t.inverse,t.darkMode)),";}.icon-leading{height:",(t=>"chip"===t.size||"xs"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size||"xs"===t.size?"16px":"20px"),";}",(t=>n.getDashedBorderStyling(t.buttonType,t.size,t.isLoading?d.COLORS.stroke.brandLightAlt:t.error?d.COLORS.stroke.negative.vibrant:void 0))," .overlay-container{display:none;}",(t=>!t.disabled&&!t.isLoading&&t.activated&&("dashBold"==t.buttonType||"dashRegular"==t.buttonType)&&`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t.text {\n\t\t\tcolor: ${d.COLORS.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${d.COLORS.background.brand};\n\t\t}\n\t\t\n\t}\n\t${n.getClickEffect(t.buttonType,t.size,t.inverse)}\n\t${n.getDashedBorderStyling(t.buttonType,t.size,d.COLORS.content.brand)}\n\t`)," :disabled{cursor:",(t=>"text"===t.buttonType?"auto":"not-allowed"),";",(t=>n.getDashedBorderStyling(t.buttonType,t.size,d.COLORS.stroke.primary)),";.overlay-container{display:none!important;}",(t=>n.generateDisabledStyling(t.buttonType,t.size,t.inverse))," .text{color:",(t=>n.getDisabledTextColor(t.inverse)),"!important;}}",(t=>!t.disabled&&!t.isLoading&&`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${"chip"===t.size&&`.text {\n\t\t\t\t\t\tcolor: ${d.COLORS.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${d.COLORS.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`}\n\t\t\t\t}\n\n\n\t\t\t${n.getClickEffect(t.buttonType,t.size,t.inverse)}\n\t\t\t${n.getDashedBorderStyling(t.buttonType,t.size,d.COLORS.content.brand)}\n\t\t}`)," ",(t=>t.isLoading?`\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${n.getLoadingBorder(t.buttonType,t.size,t.inverse)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${t.buttonColor?`background-color: ${n.getLoadingButtonBackgroundCustom(t.buttonColor,15)};`:""}\n\t\t\tpadding: ${n.getPadding(t.buttonType,t.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${n.getLoadingBackground(t.buttonType,t.size,t.inverse,t.buttonColor)}\n\t\t\t\t.spinner {\n\t\t\t\t\tline-height: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}`:`:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\tpadding: ${n.getPadding(t.buttonType,t.size)};\n\t\t\t\t{${t.buttonColor?`background-color: ${n.getHoverButtonBackgroundCustom(t.buttonColor,15)}`:""}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${n.getHoverButtonBackground(t.buttonType,t.inverse)}\n\t\t\t\t}\n\t\t\t\t${"chip"===t.size&&"text"!==t.buttonType?t.darkMode?`background-color: ${d.COLORS.stroke.primary};`:`background-color: ${d.COLORS.surface.hovered};`:""}\n\t\t\t\t${"special"===t.buttonType?`background-color: ${d.COLORS.background.brandLight};`:"secondaryGray"===t.buttonType?`background-color: ${d.COLORS.surface.hovered};`:""}\n\t\t\t\t${"primary"!==t.buttonType||"chip"===t.size||"xs"===t.size||t.inverse||t.buttonColor?"":`background-color: ${d.COLORS.background.inverse};`}\n\t\t\t}\n\t\t\t${"text"===t.buttonType?n.getHoverButtonTextDecorationStyle(t.buttonType,t.disabled):""}\n\t\t\t${t.inverse?n.generateInverseHoverBackground(t.buttonType,t.disabled):""}\n\t\t}`)," .button-container{display:flex;gap:8.33px;",(t=>t.matchParentWidth?"margin: auto;":""),";}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJ1dHRvbi5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlvQyIsImZpbGUiOiJCdXR0b24uc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4LCBGcmFnbWVudCBhcyBfRnJhZ21lbnQsIGpzeHMgYXMgX2pzeHMgfSBmcm9tIFwicmVhY3QvanN4LXJ1bnRpbWVcIjtcclxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xyXG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzL1RoZW1lXCI7XHJcbmltcG9ydCB7IGdlbmVyYXRlRGlzYWJsZWRTdHlsaW5nLCBnZW5lcmF0ZUludmVyc2VIb3ZlckJhY2tncm91bmQsIGdldEJhY2tncm91bmRDb2xvciwgZ2V0Qm9yZGVyLCBnZXRDbGlja0VmZmVjdCwgZ2V0Q29sb3IsIGdldERhc2hlZEJvcmRlclN0eWxpbmcsIGdldERpc2FibGVkVGV4dENvbG9yLCBnZXRIb3ZlckJ1dHRvbkJhY2tncm91bmQsIGdldEhvdmVyQnV0dG9uQmFja2dyb3VuZEN1c3RvbSwgZ2V0SG92ZXJCdXR0b25UZXh0RGVjb3JhdGlvblN0eWxlLCBnZXRMb2FkaW5nQmFja2dyb3VuZCwgZ2V0TG9hZGluZ0JvcmRlciwgZ2V0TG9hZGluZ0J1dHRvbkJhY2tncm91bmRDdXN0b20sIGdldFBhZGRpbmcsIH0gZnJvbSAnLi90aGVtZXMnO1xyXG5leHBvcnQgY29uc3QgQnV0dG9uID0gc3R5bGVkLmJ1dHRvbiBgXG5cdGFsbDogdW5zZXQ7XG5cdG91dGxpbmU6IG5vbmU7XG5cdGN1cnNvcjogcG9pbnRlcjtcblx0ZGlzcGxheTogZmxleDtcblx0Z2FwOiA4LjgzcHg7XG5cdGJvcmRlci1yYWRpdXM6ICR7KHByb3BzKSA9PiAocHJvcHMuYnV0dG9uVHlwZSA9PSAndGV4dCcgPyAnMCcgOiAnNHB4Jyl9O1xuXHRvdmVyZmxvdzogaGlkZGVuO1xuXHQkeyhwcm9wcykgPT4gKHByb3BzLm1hdGNoUGFyZW50V2lkdGggPyBgZmxleC1ncm93OiAxO2AgOiAnJyl9XG5cdGJhY2tncm91bmQtY29sb3I6ICR7KHByb3BzKSA9PiBnZXRCYWNrZ3JvdW5kQ29sb3IocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSwgcHJvcHMuZGFya01vZGUsIHByb3BzLmJ1dHRvbkNvbG9yKX07XG5cblx0JHsocHJvcHMpID0+IHtcclxuICAgIHZhciBfYTtcclxuICAgIHJldHVybiBwcm9wcy5idXR0b25UeXBlLnN0YXJ0c1dpdGgoJ2Rhc2gnKVxyXG4gICAgICAgID8gYC5idXR0b24tY29udGFpbmVyIHtcblx0XHRcdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0XHRcdHdpZHRoOiAxMDAlO1xuXHRcdFx0XHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHRcdFx0XHRib3JkZXItcmFkaXVzOiA0cHg7XG5cdFx0XHRcdFx0b3ZlcmZsb3c6IGhpZGRlbjtcblx0XHRcdFx0XHQke3Byb3BzLm1hdGNoUGFyZW50V2lkdGggPyAnanVzdGlmeS1jb250ZW50OiBjZW50ZXI7JyA6ICcnfVxuXHRcdFx0XHRcdHBhZGRpbmc6ICR7Z2V0UGFkZGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplKX07XG5cdFx0XHRcdH1gXHJcbiAgICAgICAgOiBgcGFkZGluZzogJHtnZXRQYWRkaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUpfTtcblx0JHtnZXRCb3JkZXIoKF9hID0gcHJvcHMudmVyc2lvbikgIT09IG51bGwgJiYgX2EgIT09IHZvaWQgMCA/IF9hIDogJzEuMCcsIHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UsIHByb3BzLmVycm9yKX1gO1xyXG59fVxuXG5cdC5pY29uLWNvbXBvbmVudCB7XG5cdFx0aGVpZ2h0OiAkeyhwcm9wcykgPT4gcHJvcHMuc2l6ZSA9PT0gJ2NoaXAnIHx8IHByb3BzLnNpemUgPT09ICd4cycgPyAnMTZweCcgOiAnMjBweCd9O1xuXHRcdHdpZHRoOiAkeyhwcm9wcykgPT4gcHJvcHMuc2l6ZSA9PT0gJ2NoaXAnIHx8IHByb3BzLnNpemUgPT09ICd4cycgPyAnMTZweCcgOiAnMjBweCd9O1xuXHR9XG5cblx0Lmljb24tdHJhaWxpbmcge1xuXHRcdGhlaWdodDogJHsocHJvcHMpID0+IHByb3BzLnNpemUgPT09ICdjaGlwJyB8fCBwcm9wcy5zaXplID09PSAneHMnID8gJzE2cHgnIDogJzIwcHgnfTtcblx0XHR3aWR0aDogJHsocHJvcHMpID0+IHByb3BzLnNpemUgPT09ICdjaGlwJyB8fCBwcm9wcy5zaXplID09PSAneHMnID8gJzE2cHgnIDogJzIwcHgnfTtcblx0fVxuXG5cdC50ZXh0IHtcblx0XHRjb2xvcjogJHsocHJvcHMpID0+IGdldENvbG9yKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UsIHByb3BzLmRhcmtNb2RlKX07XG5cdH1cblxuXHQuaWNvbi1sZWFkaW5nIHtcblx0XHRoZWlnaHQ6ICR7KHByb3BzKSA9PiBwcm9wcy5zaXplID09PSAnY2hpcCcgfHwgcHJvcHMuc2l6ZSA9PT0gJ3hzJyA/ICcxNnB4JyA6ICcyMHB4J307XG5cdFx0d2lkdGg6ICR7KHByb3BzKSA9PiBwcm9wcy5zaXplID09PSAnY2hpcCcgfHwgcHJvcHMuc2l6ZSA9PT0gJ3hzJyA/ICcxNnB4JyA6ICcyMHB4J307XG5cdH1cblxuXHQkeyhwcm9wcykgPT4gZ2V0RGFzaGVkQm9yZGVyU3R5bGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplLCBwcm9wcy5pc0xvYWRpbmdcclxuICAgID8gQ09MT1JTLnN0cm9rZS5icmFuZExpZ2h0QWx0XHJcbiAgICA6IHByb3BzLmVycm9yXHJcbiAgICAgICAgPyBDT0xPUlMuc3Ryb2tlLm5lZ2F0aXZlLnZpYnJhbnRcclxuICAgICAgICA6IHVuZGVmaW5lZCl9XG5cblx0Lm92ZXJsYXktY29udGFpbmVyIHtcblx0XHRkaXNwbGF5OiBub25lO1xuXHR9XG5cblx0JHsocHJvcHMpID0+ICFwcm9wcy5kaXNhYmxlZCAmJlxyXG4gICAgIXByb3BzLmlzTG9hZGluZyAmJlxyXG4gICAgcHJvcHMuYWN0aXZhdGVkICYmXHJcbiAgICAocHJvcHMuYnV0dG9uVHlwZSA9PSAnZGFzaEJvbGQnIHx8IHByb3BzLmJ1dHRvblR5cGUgPT0gJ2Rhc2hSZWd1bGFyJykgJiZcclxuICAgIGBcblx0LmJ1dHRvbi1jb250YWluZXIge1xuXHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0JHtwcm9wcy5tYXRjaFBhcmVudFdpZHRoID8gJ2p1c3RpZnktY29udGVudDogY2VudGVyOycgOiAnJ31cblx0XHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0d2lkdGg6IDEwMCU7XG5cdFx0Lm92ZXJsYXktY29udGFpbmVyIHtcblx0XHRcdGRpc3BsYXk6IG5vbmUgIWltcG9ydGFudDtcblx0XHR9XG5cdFx0JHtgLnRleHQge1xuXHRcdFx0Y29sb3I6ICR7Q09MT1JTLmNvbnRlbnQuYnJhbmR9ICFpbXBvcnRhbnQ7XG5cdFx0fVxuXHRcdC5pY29uIHtcblx0XHRcdGNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmJyYW5kfTtcblx0XHR9XG5cdFx0YH1cblx0fVxuXHQke2dldENsaWNrRWZmZWN0KHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UpfVxuXHQke2dldERhc2hlZEJvcmRlclN0eWxpbmcocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgQ09MT1JTLmNvbnRlbnQuYnJhbmQpfVxuXHRgfVxuXG5cdDpkaXNhYmxlZCB7XG5cdFx0Lm92ZXJsYXktY29udGFpbmVyIHtcblx0XHRcdGRpc3BsYXk6IG5vbmUgIWltcG9ydGFudDtcblx0XHR9XG5cdFx0Y3Vyc29yOiAkeyhwcm9wcykgPT4gcHJvcHMuYnV0dG9uVHlwZSA9PT0gJ3RleHQnID8gJ2F1dG8nIDogJ25vdC1hbGxvd2VkJ307XG5cdFx0JHsocHJvcHMpID0+IGdlbmVyYXRlRGlzYWJsZWRTdHlsaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UpfVxuXHRcdC50ZXh0IHtcblx0XHRcdGNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0RGlzYWJsZWRUZXh0Q29sb3IocHJvcHMuaW52ZXJzZSl9ICFpbXBvcnRhbnQ7XG5cdFx0fVxuXHRcdCR7KHByb3BzKSA9PiBnZXREYXNoZWRCb3JkZXJTdHlsaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIENPTE9SUy5zdHJva2UucHJpbWFyeSl9XG5cdH1cblxuXHQkeyhwcm9wcykgPT4gIXByb3BzLmRpc2FibGVkICYmXHJcbiAgICAhcHJvcHMuaXNMb2FkaW5nICYmXHJcbiAgICBgOmFjdGl2ZSB7XG5cdFx0XHRcdC5idXR0b24tY29udGFpbmVyIHtcblx0XHRcdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0XHRcdCR7cHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/ICdqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsnIDogJyd9XG5cdFx0XHRcdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdFx0XHRcdHdpZHRoOiAxMDAlO1xuXHRcdFx0XHRcdC5vdmVybGF5LWNvbnRhaW5lciB7XG5cdFx0XHRcdFx0XHRkaXNwbGF5OiBub25lICFpbXBvcnRhbnQ7XG5cdFx0XHRcdFx0fVxuXHRcdFx0XHRcdCR7cHJvcHMuc2l6ZSA9PT0gJ2NoaXAnICYmXHJcbiAgICAgICAgYC50ZXh0IHtcblx0XHRcdFx0XHRcdGNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmludmVyc2VMaWdodH0gIWltcG9ydGFudDtcblx0XHRcdFx0XHR9XG5cdFx0XHRcdFx0Lmljb24ge1xuXHRcdFx0XHRcdFx0Y29sb3I6ICR7Q09MT1JTLmJhY2tncm91bmQuaW52ZXJzZUxpZ2h0fTtcblx0XHRcdFx0XHR9XG5cdFx0XHRcdFx0YH1cblx0XHRcdFx0fVxuXG5cblx0XHRcdCR7Z2V0Q2xpY2tFZmZlY3QocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSl9XG5cdFx0XHQke2dldERhc2hlZEJvcmRlclN0eWxpbmcocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgQ09MT1JTLmNvbnRlbnQuYnJhbmQpfVxuXHRcdH1gfVxuXG5cdCR7KHByb3BzKSA9PiBcclxuLy8gZG8gbm90IGxvYWQgaG92ZXIgc3R5bGVzIGZvciBsb2FkaW5nIHN0YXRlIGFuZCBhbHNvIGFjdGl2ZSBzdGF0ZVxyXG4hcHJvcHMuaXNMb2FkaW5nXHJcbiAgICA/IGA6bm90KDphY3RpdmUpOm5vdCg6ZGlzYWJsZWQpOmhvdmVyIHtcblx0XHRcdHBhZGRpbmc6IDA7XG5cdFx0XHQuYnV0dG9uLWNvbnRhaW5lciB7XG5cdFx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0XHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHRcdCR7cHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/ICdqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsnIDogJyd9XG5cdFx0XHRcdHBhZGRpbmc6ICR7Z2V0UGFkZGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplKX07XG5cdFx0XHRcdHske3Byb3BzLmJ1dHRvbkNvbG9yXHJcbiAgICAgICAgPyBgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRIb3ZlckJ1dHRvbkJhY2tncm91bmRDdXN0b20ocHJvcHMuYnV0dG9uQ29sb3IsIDE1KX1gXHJcbiAgICAgICAgOiAnJ319XG5cdFx0XHRcdC5vdmVybGF5LWNvbnRhaW5lciB7XG5cdFx0XHRcdFx0ZGlzcGxheTogYmxvY2s7XG5cdFx0XHRcdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdFx0XHRcdHBhZGRpbmc6IDA7XG5cdFx0XHRcdFx0dG9wOiAwO1xuXHRcdFx0XHRcdGxlZnQ6IDA7XG5cdFx0XHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHRcdFx0aGVpZ2h0OiAxMDAlO1xuXHRcdFx0XHRcdCR7Z2V0SG92ZXJCdXR0b25CYWNrZ3JvdW5kKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLmludmVyc2UpfVxuXHRcdFx0XHR9XG5cdFx0XHRcdCR7cHJvcHMuc2l6ZSA9PT0gJ2NoaXAnICYmIHByb3BzLmJ1dHRvblR5cGUgIT09ICd0ZXh0J1xyXG4gICAgICAgID8gcHJvcHMuZGFya01vZGVcclxuICAgICAgICAgICAgPyBgYmFja2dyb3VuZC1jb2xvcjogJHtDT0xPUlMuc3Ryb2tlLnByaW1hcnl9O2BcclxuICAgICAgICAgICAgOiBgYmFja2dyb3VuZC1jb2xvcjogJHtDT0xPUlMuc3VyZmFjZS5ob3ZlcmVkfTtgXHJcbiAgICAgICAgOiAnJ31cblx0XHRcdFx0JHtwcm9wcy5idXR0b25UeXBlID09PSAnc3BlY2lhbCdcclxuICAgICAgICA/IGBiYWNrZ3JvdW5kLWNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmJyYW5kTGlnaHR9O2BcclxuICAgICAgICA6IHByb3BzLmJ1dHRvblR5cGUgPT09ICdzZWNvbmRhcnlHcmF5J1xyXG4gICAgICAgICAgICA/IGBiYWNrZ3JvdW5kLWNvbG9yOiAke0NPTE9SUy5zdXJmYWNlLmhvdmVyZWR9O2BcclxuICAgICAgICAgICAgOiAnJ31cblx0XHRcdFx0JHtwcm9wcy5idXR0b25UeXBlID09PSAncHJpbWFyeScgJiZcclxuICAgICAgICBwcm9wcy5zaXplICE9PSAnY2hpcCcgJiZcclxuICAgICAgICBwcm9wcy5zaXplICE9PSAneHMnICYmXHJcbiAgICAgICAgIXByb3BzLmludmVyc2UgJiZcclxuICAgICAgICAhcHJvcHMuYnV0dG9uQ29sb3JcclxuICAgICAgICA/IGBiYWNrZ3JvdW5kLWNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmludmVyc2V9O2BcclxuICAgICAgICA6ICcnfVxuXHRcdFx0fVxuXHRcdFx0JHtwcm9wcy5idXR0b25UeXBlID09PSAndGV4dCdcclxuICAgICAgICA/IGdldEhvdmVyQnV0dG9uVGV4dERlY29yYXRpb25TdHlsZShwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5kaXNhYmxlZClcclxuICAgICAgICA6ICcnfVxuXHRcdFx0JHtwcm9wcy5pbnZlcnNlXHJcbiAgICAgICAgPyBnZW5lcmF0ZUludmVyc2VIb3ZlckJhY2tncm91bmQocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuZGlzYWJsZWQpXHJcbiAgICAgICAgOiAnJ31cblx0XHR9YFxyXG4gICAgOiBgXG5cdFx0XHRjdXJzb3I6IG5vdC1hbGxvd2VkO1xuXHRcdFx0cGFkZGluZzogMDtcblx0XHQke2dldExvYWRpbmdCb3JkZXIocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSl9XG5cblx0XHQuYnV0dG9uLWNvbnRhaW5lciB7XG5cdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHQudGV4dCB7XG5cdFx0XHRcdG9wYWNpdHk6IDA7XG5cdFx0XHR9XG5cdFx0XHQke3Byb3BzLmJ1dHRvbkNvbG9yXHJcbiAgICAgICAgPyBgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRMb2FkaW5nQnV0dG9uQmFja2dyb3VuZEN1c3RvbShwcm9wcy5idXR0b25Db2xvciwgMTUpfTtgXHJcbiAgICAgICAgOiAnJ31cblx0XHRcdHBhZGRpbmc6ICR7Z2V0UGFkZGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplKX07XG5cdFx0XHQub3ZlcmxheS1jb250YWluZXIge1xuXHRcdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0XHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRcdFx0XHRqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblx0XHRcdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdFx0XHRwYWRkaW5nOiAwO1xuXHRcdFx0XHR0b3A6IDA7XG5cdFx0XHRcdGxlZnQ6IDA7XG5cdFx0XHRcdHdpZHRoOiAxMDAlO1xuXHRcdFx0XHRoZWlnaHQ6IDEwMCU7XG5cdFx0XHRcdCR7Z2V0TG9hZGluZ0JhY2tncm91bmQocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSwgcHJvcHMuYnV0dG9uQ29sb3IpfVxuXHRcdFx0XHQuc3Bpbm5lciB7XG5cdFx0XHRcdFx0bGluZS1oZWlnaHQ6IDA7XG5cdFx0XHRcdH1cblx0XHRcdH1cblx0XHR9YH1cblxuXHRcdC5idXR0b24tY29udGFpbmVyIHtcblx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdGdhcDogOC4zM3B4O1xuXHRcdCR7KHByb3BzKSA9PiAocHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/ICdtYXJnaW46IGF1dG87JyA6ICcnKX1cblx0fVxuYDtcclxuZXhwb3J0IGNvbnN0IEJ1dHRvbkN1c3RvbURhc2hlZEJvcmRlciA9ICgpID0+IHtcclxuICAgIHJldHVybiAoX2pzeHMoX0ZyYWdtZW50LCB7IGNoaWxkcmVuOiBbX2pzeChcImRpdlwiLCB7IGNsYXNzTmFtZTogXCJsaW5lLXRvcFwiIH0pLCBfanN4KFwiZGl2XCIsIHsgY2xhc3NOYW1lOiBcImxpbmUtbGVmdFwiIH0pLCBfanN4KFwiZGl2XCIsIHsgY2xhc3NOYW1lOiBcImxpbmUtYm90dG9tXCIgfSksIF9qc3goXCJkaXZcIiwgeyBjbGFzc05hbWU6IFwibGluZS1yaWdodFwiIH0pXSB9KSk7XHJcbn07XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPUJ1dHRvbi5zdHlsZWQuanMubWFwIl19 */"));exports.Button=l,exports.ButtonCustomDashedBorder=()=>c.jsxs(c.Fragment,{children:[c.jsx("div",{className:"line-top"}),c.jsx("div",{className:"line-left"}),c.jsx("div",{className:"line-bottom"}),c.jsx("div",{className:"line-right"})]});
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@emotion/styled/base"),c=require("react/jsx-runtime"),d=require("../../constants/Theme.js"),n=require("./themes.js");function b(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}const l=b(t).default("button","production"===process.env.NODE_ENV?{target:"exlualr0"}:{target:"exlualr0",label:"Button"})("all:unset;cursor:pointer;display:flex;gap:8.83px;border-radius:",(t=>"text"==t.buttonType?"0":"4px"),";overflow:hidden;",(t=>t.matchParentWidth?"flex-grow: 1;":"")," background-color:",(t=>n.getBackgroundColor(t.buttonType,t.size,t.inverse,t.darkMode,t.buttonColor)),";",(t=>{var c;return t.buttonType.startsWith("dash")?`.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tpadding: ${n.getPadding(t.buttonType,t.size)};\n\t\t\t\t}`:`padding: ${n.getPadding(t.buttonType,t.size)};\n\t${n.getBorder(null!==(c=t.version)&&void 0!==c?c:"1.0",t.buttonType,t.size,t.inverse,t.error)}`})," .icon-component{height:",(t=>"chip"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size?"16px":"20px"),";}.icon-trailing{height:",(t=>"chip"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size?"16px":"20px"),";}.text{color:",(t=>n.getColor(t.buttonType,t.size,t.inverse,t.darkMode)),";}.icon-leading{height:",(t=>"chip"===t.size?"16px":"20px"),";width:",(t=>"chip"===t.size?"16px":"20px"),";}",(t=>n.getDashedBorderStyling(t.buttonType,t.size,t.isLoading?d.COLORS.stroke.brandLightAlt:t.error?d.COLORS.stroke.negative.vibrant:void 0))," .overlay-container{display:none;}",(t=>!t.disabled&&!t.isLoading&&t.activated&&("dashBold"==t.buttonType||"dashRegular"==t.buttonType)&&`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t.text {\n\t\t\tcolor: ${d.COLORS.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${d.COLORS.background.brand};\n\t\t}\n\t\t\n\t}\n\t${n.getClickEffect(t.buttonType,t.size,t.inverse)}\n\t${n.getDashedBorderStyling(t.buttonType,t.size,d.COLORS.content.brand)}\n\t`)," :disabled{cursor:",(t=>"text"===t.buttonType?"auto":"not-allowed"),";",(t=>n.getDashedBorderStyling(t.buttonType,t.size,d.COLORS.stroke.primary)),";.overlay-container{display:none!important;}",(t=>n.generateDisabledStyling(t.buttonType,t.size,t.inverse))," .text{color:",(t=>n.getDisabledTextColor(t.inverse)),"!important;}}",(t=>!t.disabled&&!t.isLoading&&`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${"chip"===t.size&&`.text {\n\t\t\t\t\t\tcolor: ${d.COLORS.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${d.COLORS.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`}\n\t\t\t\t}\n\n\n\t\t\t${n.getClickEffect(t.buttonType,t.size,t.inverse)}\n\t\t\t${n.getDashedBorderStyling(t.buttonType,t.size,d.COLORS.content.brand)}\n\t\t}`)," ",(t=>t.isLoading?`\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${n.getLoadingBorder(t.buttonType,t.size,t.inverse)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${t.buttonColor?`background-color: ${n.getLoadingButtonBackgroundCustom(t.buttonColor,15)};`:""}\n\t\t\tpadding: ${n.getPadding(t.buttonType,t.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: block;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\tpadding-top: 1px;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${n.getLoadingBackground(t.buttonType,t.size,t.inverse,t.buttonColor)}\n\t\t\t\t.spinner {\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\ttop: calc(50% - 14px);\n\t\t\t\t\tleft: calc(50% - 7px);\n\t\t\t\t}\n\n\t\t\t}\n\t\t}`:`:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${t.matchParentWidth?"justify-content: center;":""}\n\t\t\t\tpadding: ${n.getPadding(t.buttonType,t.size)};\n\t\t\t\t{${t.buttonColor?`background-color: ${n.getHoverButtonBackgroundCustom(t.buttonColor,15)}`:""}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${n.getHoverButtonBackground(t.buttonType,t.inverse)}\n\t\t\t\t}\n\t\t\t\t${"chip"===t.size&&"text"!==t.buttonType?t.darkMode?`background-color: ${d.COLORS.stroke.primary};`:`background-color: ${d.COLORS.surface.hovered};`:""}\n\t\t\t\t${"primary"!==t.buttonType||"chip"===t.size||t.inverse||t.buttonColor?"":`background-color: ${d.COLORS.background.inverse};`}\n\t\t\t}\n\t\t\t${"text"===t.buttonType?n.getHoverButtonTextDecorationStyle(t.buttonType,t.disabled):""}\n\t\t\t${t.inverse?n.generateInverseHoverBackground(t.buttonType,t.disabled):""}\n\t\t}`)," .button-container{display:flex;gap:8.33px;",(t=>t.matchParentWidth?"margin: auto;":""),";}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJ1dHRvbi5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlvQyIsImZpbGUiOiJCdXR0b24uc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4LCBGcmFnbWVudCBhcyBfRnJhZ21lbnQsIGpzeHMgYXMgX2pzeHMgfSBmcm9tIFwicmVhY3QvanN4LXJ1bnRpbWVcIjtcclxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xyXG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzL1RoZW1lXCI7XHJcbmltcG9ydCB7IGdlbmVyYXRlRGlzYWJsZWRTdHlsaW5nLCBnZW5lcmF0ZUludmVyc2VIb3ZlckJhY2tncm91bmQsIGdldEJhY2tncm91bmRDb2xvciwgZ2V0Qm9yZGVyLCBnZXRDbGlja0VmZmVjdCwgZ2V0Q29sb3IsIGdldERhc2hlZEJvcmRlclN0eWxpbmcsIGdldERpc2FibGVkVGV4dENvbG9yLCBnZXRIb3ZlckJ1dHRvbkJhY2tncm91bmQsIGdldEhvdmVyQnV0dG9uQmFja2dyb3VuZEN1c3RvbSwgZ2V0SG92ZXJCdXR0b25UZXh0RGVjb3JhdGlvblN0eWxlLCBnZXRMb2FkaW5nQmFja2dyb3VuZCwgZ2V0TG9hZGluZ0JvcmRlciwgZ2V0TG9hZGluZ0J1dHRvbkJhY2tncm91bmRDdXN0b20sIGdldFBhZGRpbmcsIH0gZnJvbSAnLi90aGVtZXMnO1xyXG5leHBvcnQgY29uc3QgQnV0dG9uID0gc3R5bGVkLmJ1dHRvbiBgXG5cdGFsbDogdW5zZXQ7XG5cdGN1cnNvcjogcG9pbnRlcjtcblx0ZGlzcGxheTogZmxleDtcblx0Z2FwOiA4LjgzcHg7XG5cdGJvcmRlci1yYWRpdXM6ICR7KHByb3BzKSA9PiAocHJvcHMuYnV0dG9uVHlwZSA9PSAndGV4dCcgPyAnMCcgOiAnNHB4Jyl9O1xuXHRvdmVyZmxvdzogaGlkZGVuO1xuXHQkeyhwcm9wcykgPT4gKHByb3BzLm1hdGNoUGFyZW50V2lkdGggPyBgZmxleC1ncm93OiAxO2AgOiAnJyl9XG5cdGJhY2tncm91bmQtY29sb3I6ICR7KHByb3BzKSA9PiBnZXRCYWNrZ3JvdW5kQ29sb3IocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSwgcHJvcHMuZGFya01vZGUsIHByb3BzLmJ1dHRvbkNvbG9yKX07XG5cblx0JHsocHJvcHMpID0+IHtcclxuICAgIHZhciBfYTtcclxuICAgIHJldHVybiBwcm9wcy5idXR0b25UeXBlLnN0YXJ0c1dpdGgoJ2Rhc2gnKVxyXG4gICAgICAgID8gYC5idXR0b24tY29udGFpbmVyIHtcblx0XHRcdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0XHRcdHdpZHRoOiAxMDAlO1xuXHRcdFx0XHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHRcdFx0XHRib3JkZXItcmFkaXVzOiA0cHg7XG5cdFx0XHRcdFx0b3ZlcmZsb3c6IGhpZGRlbjtcblx0XHRcdFx0XHQke3Byb3BzLm1hdGNoUGFyZW50V2lkdGggPyAnanVzdGlmeS1jb250ZW50OiBjZW50ZXI7JyA6ICcnfVxuXHRcdFx0XHRcdHBhZGRpbmc6ICR7Z2V0UGFkZGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplKX07XG5cdFx0XHRcdH1gXHJcbiAgICAgICAgOiBgcGFkZGluZzogJHtnZXRQYWRkaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUpfTtcblx0JHtnZXRCb3JkZXIoKF9hID0gcHJvcHMudmVyc2lvbikgIT09IG51bGwgJiYgX2EgIT09IHZvaWQgMCA/IF9hIDogJzEuMCcsIHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UsIHByb3BzLmVycm9yKX1gO1xyXG59fVxuXG5cdC5pY29uLWNvbXBvbmVudCB7XG5cdFx0aGVpZ2h0OiAkeyhwcm9wcykgPT4gKHByb3BzLnNpemUgPT09ICdjaGlwJyA/ICcxNnB4JyA6ICcyMHB4Jyl9O1xuXHRcdHdpZHRoOiAkeyhwcm9wcykgPT4gKHByb3BzLnNpemUgPT09ICdjaGlwJyA/ICcxNnB4JyA6ICcyMHB4Jyl9O1xuXHR9XG5cblx0Lmljb24tdHJhaWxpbmcge1xuXHRcdGhlaWdodDogJHsocHJvcHMpID0+IChwcm9wcy5zaXplID09PSAnY2hpcCcgPyAnMTZweCcgOiAnMjBweCcpfTtcblx0XHR3aWR0aDogJHsocHJvcHMpID0+IChwcm9wcy5zaXplID09PSAnY2hpcCcgPyAnMTZweCcgOiAnMjBweCcpfTtcblx0fVxuXG5cdC50ZXh0IHtcblx0XHRjb2xvcjogJHsocHJvcHMpID0+IGdldENvbG9yKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UsIHByb3BzLmRhcmtNb2RlKX07XG5cdH1cblxuXHQuaWNvbi1sZWFkaW5nIHtcblx0XHRoZWlnaHQ6ICR7KHByb3BzKSA9PiAocHJvcHMuc2l6ZSA9PT0gJ2NoaXAnID8gJzE2cHgnIDogJzIwcHgnKX07XG5cdFx0d2lkdGg6ICR7KHByb3BzKSA9PiAocHJvcHMuc2l6ZSA9PT0gJ2NoaXAnID8gJzE2cHgnIDogJzIwcHgnKX07XG5cdH1cblxuXHQkeyhwcm9wcykgPT4gZ2V0RGFzaGVkQm9yZGVyU3R5bGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplLCBwcm9wcy5pc0xvYWRpbmdcclxuICAgID8gQ09MT1JTLnN0cm9rZS5icmFuZExpZ2h0QWx0XHJcbiAgICA6IHByb3BzLmVycm9yXHJcbiAgICAgICAgPyBDT0xPUlMuc3Ryb2tlLm5lZ2F0aXZlLnZpYnJhbnRcclxuICAgICAgICA6IHVuZGVmaW5lZCl9XG5cblx0Lm92ZXJsYXktY29udGFpbmVyIHtcblx0XHRkaXNwbGF5OiBub25lO1xuXHR9XG5cblx0JHsocHJvcHMpID0+ICFwcm9wcy5kaXNhYmxlZCAmJlxyXG4gICAgIXByb3BzLmlzTG9hZGluZyAmJlxyXG4gICAgcHJvcHMuYWN0aXZhdGVkICYmXHJcbiAgICAocHJvcHMuYnV0dG9uVHlwZSA9PSAnZGFzaEJvbGQnIHx8IHByb3BzLmJ1dHRvblR5cGUgPT0gJ2Rhc2hSZWd1bGFyJykgJiZcclxuICAgIGBcblx0LmJ1dHRvbi1jb250YWluZXIge1xuXHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0JHtwcm9wcy5tYXRjaFBhcmVudFdpZHRoID8gJ2p1c3RpZnktY29udGVudDogY2VudGVyOycgOiAnJ31cblx0XHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0d2lkdGg6IDEwMCU7XG5cdFx0Lm92ZXJsYXktY29udGFpbmVyIHtcblx0XHRcdGRpc3BsYXk6IG5vbmUgIWltcG9ydGFudDtcblx0XHR9XG5cdFx0JHtgLnRleHQge1xuXHRcdFx0Y29sb3I6ICR7Q09MT1JTLmNvbnRlbnQuYnJhbmR9ICFpbXBvcnRhbnQ7XG5cdFx0fVxuXHRcdC5pY29uIHtcblx0XHRcdGNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmJyYW5kfTtcblx0XHR9XG5cdFx0YH1cblx0fVxuXHQke2dldENsaWNrRWZmZWN0KHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UpfVxuXHQke2dldERhc2hlZEJvcmRlclN0eWxpbmcocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgQ09MT1JTLmNvbnRlbnQuYnJhbmQpfVxuXHRgfVxuXG5cdDpkaXNhYmxlZCB7XG5cdFx0Lm92ZXJsYXktY29udGFpbmVyIHtcblx0XHRcdGRpc3BsYXk6IG5vbmUgIWltcG9ydGFudDtcblx0XHR9XG5cdFx0Y3Vyc29yOiAkeyhwcm9wcykgPT4gcHJvcHMuYnV0dG9uVHlwZSA9PT0gJ3RleHQnID8gJ2F1dG8nIDogJ25vdC1hbGxvd2VkJ307XG5cdFx0JHsocHJvcHMpID0+IGdlbmVyYXRlRGlzYWJsZWRTdHlsaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIHByb3BzLmludmVyc2UpfVxuXHRcdC50ZXh0IHtcblx0XHRcdGNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0RGlzYWJsZWRUZXh0Q29sb3IocHJvcHMuaW52ZXJzZSl9ICFpbXBvcnRhbnQ7XG5cdFx0fVxuXHRcdCR7KHByb3BzKSA9PiBnZXREYXNoZWRCb3JkZXJTdHlsaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUsIENPTE9SUy5zdHJva2UucHJpbWFyeSl9XG5cdH1cblxuXHQkeyhwcm9wcykgPT4gIXByb3BzLmRpc2FibGVkICYmXHJcbiAgICAhcHJvcHMuaXNMb2FkaW5nICYmXHJcbiAgICBgOmFjdGl2ZSB7XG5cdFx0XHRcdC5idXR0b24tY29udGFpbmVyIHtcblx0XHRcdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdFx0XHRcdCR7cHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/ICdqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsnIDogJyd9XG5cdFx0XHRcdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdFx0XHRcdHdpZHRoOiAxMDAlO1xuXHRcdFx0XHRcdC5vdmVybGF5LWNvbnRhaW5lciB7XG5cdFx0XHRcdFx0XHRkaXNwbGF5OiBub25lICFpbXBvcnRhbnQ7XG5cdFx0XHRcdFx0fVxuXHRcdFx0XHRcdCR7cHJvcHMuc2l6ZSA9PT0gJ2NoaXAnICYmXHJcbiAgICAgICAgYC50ZXh0IHtcblx0XHRcdFx0XHRcdGNvbG9yOiAke0NPTE9SUy5iYWNrZ3JvdW5kLmludmVyc2VMaWdodH0gIWltcG9ydGFudDtcblx0XHRcdFx0XHR9XG5cdFx0XHRcdFx0Lmljb24ge1xuXHRcdFx0XHRcdFx0Y29sb3I6ICR7Q09MT1JTLmJhY2tncm91bmQuaW52ZXJzZUxpZ2h0fTtcblx0XHRcdFx0XHR9XG5cdFx0XHRcdFx0YH1cblx0XHRcdFx0fVxuXG5cblx0XHRcdCR7Z2V0Q2xpY2tFZmZlY3QocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgcHJvcHMuaW52ZXJzZSl9XG5cdFx0XHQke2dldERhc2hlZEJvcmRlclN0eWxpbmcocHJvcHMuYnV0dG9uVHlwZSwgcHJvcHMuc2l6ZSwgQ09MT1JTLmNvbnRlbnQuYnJhbmQpfVxuXHRcdH1gfVxuXG5cdCR7KHByb3BzKSA9PiBcclxuLy8gZG8gbm90IGxvYWQgaG92ZXIgc3R5bGVzIGZvciBsb2FkaW5nIHN0YXRlIGFuZCBhbHNvIGFjdGl2ZSBzdGF0ZVxyXG4hcHJvcHMuaXNMb2FkaW5nXHJcbiAgICA/IGA6bm90KDphY3RpdmUpOm5vdCg6ZGlzYWJsZWQpOmhvdmVyIHtcblx0XHRcdHBhZGRpbmc6IDA7XG5cdFx0XHQuYnV0dG9uLWNvbnRhaW5lciB7XG5cdFx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0XHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHRcdCR7cHJvcHMubWF0Y2hQYXJlbnRXaWR0aCA/ICdqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsnIDogJyd9XG5cdFx0XHRcdHBhZGRpbmc6ICR7Z2V0UGFkZGluZyhwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplKX07XG5cdFx0XHRcdHske3Byb3BzLmJ1dHRvbkNvbG9yXHJcbiAgICAgICAgPyBgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRIb3ZlckJ1dHRvbkJhY2tncm91bmRDdXN0b20ocHJvcHMuYnV0dG9uQ29sb3IsIDE1KX1gXHJcbiAgICAgICAgOiAnJ319XG5cdFx0XHRcdC5vdmVybGF5LWNvbnRhaW5lciB7XG5cdFx0XHRcdFx0ZGlzcGxheTogYmxvY2s7XG5cdFx0XHRcdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdFx0XHRcdHBhZGRpbmc6IDA7XG5cdFx0XHRcdFx0dG9wOiAwO1xuXHRcdFx0XHRcdGxlZnQ6IDA7XG5cdFx0XHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHRcdFx0aGVpZ2h0OiAxMDAlO1xuXHRcdFx0XHRcdCR7Z2V0SG92ZXJCdXR0b25CYWNrZ3JvdW5kKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLmludmVyc2UpfVxuXHRcdFx0XHR9XG5cdFx0XHRcdCR7cHJvcHMuc2l6ZSA9PT0gJ2NoaXAnICYmIHByb3BzLmJ1dHRvblR5cGUgIT09ICd0ZXh0J1xyXG4gICAgICAgID8gcHJvcHMuZGFya01vZGVcclxuICAgICAgICAgICAgPyBgYmFja2dyb3VuZC1jb2xvcjogJHtDT0xPUlMuc3Ryb2tlLnByaW1hcnl9O2BcclxuICAgICAgICAgICAgOiBgYmFja2dyb3VuZC1jb2xvcjogJHtDT0xPUlMuc3VyZmFjZS5ob3ZlcmVkfTtgXHJcbiAgICAgICAgOiAnJ31cblx0XHRcdFx0JHtwcm9wcy5idXR0b25UeXBlID09PSAncHJpbWFyeScgJiZcclxuICAgICAgICBwcm9wcy5zaXplICE9PSAnY2hpcCcgJiZcclxuICAgICAgICAhcHJvcHMuaW52ZXJzZSAmJlxyXG4gICAgICAgICFwcm9wcy5idXR0b25Db2xvclxyXG4gICAgICAgID8gYGJhY2tncm91bmQtY29sb3I6ICR7Q09MT1JTLmJhY2tncm91bmQuaW52ZXJzZX07YFxyXG4gICAgICAgIDogJyd9XG5cdFx0XHR9XG5cdFx0XHQke3Byb3BzLmJ1dHRvblR5cGUgPT09ICd0ZXh0J1xyXG4gICAgICAgID8gZ2V0SG92ZXJCdXR0b25UZXh0RGVjb3JhdGlvblN0eWxlKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLmRpc2FibGVkKVxyXG4gICAgICAgIDogJyd9XG5cdFx0XHQke3Byb3BzLmludmVyc2VcclxuICAgICAgICA/IGdlbmVyYXRlSW52ZXJzZUhvdmVyQmFja2dyb3VuZChwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5kaXNhYmxlZClcclxuICAgICAgICA6ICcnfVxuXHRcdH1gXHJcbiAgICA6IGBcblx0XHRcdGN1cnNvcjogbm90LWFsbG93ZWQ7XG5cdFx0XHRwYWRkaW5nOiAwO1xuXHRcdCR7Z2V0TG9hZGluZ0JvcmRlcihwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplLCBwcm9wcy5pbnZlcnNlKX1cblxuXHRcdC5idXR0b24tY29udGFpbmVyIHtcblx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0XHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0XHR3aWR0aDogMTAwJTtcblx0XHRcdC50ZXh0IHtcblx0XHRcdFx0b3BhY2l0eTogMDtcblx0XHRcdH1cblx0XHRcdCR7cHJvcHMuYnV0dG9uQ29sb3JcclxuICAgICAgICA/IGBiYWNrZ3JvdW5kLWNvbG9yOiAke2dldExvYWRpbmdCdXR0b25CYWNrZ3JvdW5kQ3VzdG9tKHByb3BzLmJ1dHRvbkNvbG9yLCAxNSl9O2BcclxuICAgICAgICA6ICcnfVxuXHRcdFx0cGFkZGluZzogJHtnZXRQYWRkaW5nKHByb3BzLmJ1dHRvblR5cGUsIHByb3BzLnNpemUpfTtcblx0XHRcdC5vdmVybGF5LWNvbnRhaW5lciB7XG5cdFx0XHRcdGRpc3BsYXk6IGJsb2NrO1xuXHRcdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHRcdHBhZGRpbmc6IDA7XG5cdFx0XHRcdHBhZGRpbmctdG9wOiAxcHg7XG5cdFx0XHRcdHRvcDogMDtcblx0XHRcdFx0bGVmdDogMDtcblx0XHRcdFx0d2lkdGg6IDEwMCU7XG5cdFx0XHRcdGhlaWdodDogMTAwJTtcblx0XHRcdFx0JHtnZXRMb2FkaW5nQmFja2dyb3VuZChwcm9wcy5idXR0b25UeXBlLCBwcm9wcy5zaXplLCBwcm9wcy5pbnZlcnNlLCBwcm9wcy5idXR0b25Db2xvcil9XG5cdFx0XHRcdC5zcGlubmVyIHtcblx0XHRcdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHRcdFx0dG9wOiBjYWxjKDUwJSAtIDE0cHgpO1xuXHRcdFx0XHRcdGxlZnQ6IGNhbGMoNTAlIC0gN3B4KTtcblx0XHRcdFx0fVxuXG5cdFx0XHR9XG5cdFx0fWB9XG5cblx0XHQuYnV0dG9uLWNvbnRhaW5lciB7XG5cdFx0ZGlzcGxheTogZmxleDtcblx0XHRnYXA6IDguMzNweDtcblx0XHQkeyhwcm9wcykgPT4gKHByb3BzLm1hdGNoUGFyZW50V2lkdGggPyAnbWFyZ2luOiBhdXRvOycgOiAnJyl9XG5cdH1cbmA7XHJcbmV4cG9ydCBjb25zdCBCdXR0b25DdXN0b21EYXNoZWRCb3JkZXIgPSAoKSA9PiB7XHJcbiAgICByZXR1cm4gKF9qc3hzKF9GcmFnbWVudCwgeyBjaGlsZHJlbjogW19qc3goXCJkaXZcIiwgeyBjbGFzc05hbWU6IFwibGluZS10b3BcIiB9KSwgX2pzeChcImRpdlwiLCB7IGNsYXNzTmFtZTogXCJsaW5lLWxlZnRcIiB9KSwgX2pzeChcImRpdlwiLCB7IGNsYXNzTmFtZTogXCJsaW5lLWJvdHRvbVwiIH0pLCBfanN4KFwiZGl2XCIsIHsgY2xhc3NOYW1lOiBcImxpbmUtcmlnaHRcIiB9KV0gfSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1CdXR0b24uc3R5bGVkLmpzLm1hcCJdfQ== */"));exports.Button=l,exports.ButtonCustomDashedBorder=()=>c.jsxs(c.Fragment,{children:[c.jsx("div",{className:"line-top"}),c.jsx("div",{className:"line-left"}),c.jsx("div",{className:"line-bottom"}),c.jsx("div",{className:"line-right"})]});
|
|
2
2
|
//# sourceMappingURL=Button.styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.styled.js","sources":["../../../../src/components/button/Button.styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { COLORS } from '@src/constants/Theme';\nimport { Size, Type } from './model';\nimport {\n\tgenerateDisabledStyling,\n\tgenerateInverseHoverBackground,\n\tgetBackgroundColor,\n\tgetBorder,\n\tgetClickEffect,\n\tgetColor,\n\tgetDashedBorderStyling,\n\tgetDisabledTextColor,\n\tgetHoverButtonBackground,\n\tgetHoverButtonBackgroundCustom,\n\tgetHoverButtonTextDecorationStyle,\n\tgetLoadingBackground,\n\tgetLoadingBorder,\n\tgetLoadingButtonBackgroundCustom,\n\tgetPadding,\n} from './themes';\n\nexport const Button = styled.button<{\n\tsize: Size;\n\tbuttonType: Type;\n\tisLoading?: boolean;\n\tinverse?: boolean;\n\tdisabled?: boolean;\n\tmatchParentWidth?: boolean;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tdarkMode?: boolean;\n\tactivated?: boolean;\n\terror?: boolean;\n\tbuttonColor?: string;\n}>`\n\tall: unset;\n\toutline: none;\n\tcursor: pointer;\n\tdisplay: flex;\n\tgap: 8.83px;\n\tborder-radius: ${(props) => (props.buttonType == 'text' ? '0' : '4px')};\n\toverflow: hidden;\n\t${(props) => (props.matchParentWidth ? `flex-grow: 1;` : '')}\n\tbackground-color: ${(props) =>\n\t\tgetBackgroundColor(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.inverse,\n\t\t\tprops.darkMode,\n\t\t\tprops.buttonColor,\n\t\t)};\n\n\t${(props) =>\n\t\tprops.buttonType.startsWith('dash')\n\t\t\t? `.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t}`\n\t\t\t: `padding: ${getPadding(props.buttonType, props.size)};\n\t${getBorder(\n\t\tprops.version ?? '1.0',\n\t\tprops.buttonType,\n\t\tprops.size,\n\t\tprops.inverse,\n\t\tprops.error,\n\t)}`}\n\n\t.icon-component {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' || props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' || props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t.icon-trailing {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' || props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' || props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t.text {\n\t\tcolor: ${(props) =>\n\t\t\tgetColor(props.buttonType, props.size, props.inverse, props.darkMode)};\n\t}\n\n\t.icon-leading {\n\t\theight: ${(props) =>\n\t\t\tprops.size === 'chip' || props.size === 'xs' ? '16px' : '20px'};\n\t\twidth: ${(props) =>\n\t\t\tprops.size === 'chip' || props.size === 'xs' ? '16px' : '20px'};\n\t}\n\n\t${(props) =>\n\t\tgetDashedBorderStyling(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.isLoading\n\t\t\t\t? COLORS.stroke.brandLightAlt\n\t\t\t\t: props.error\n\t\t\t\t? COLORS.stroke.negative.vibrant\n\t\t\t\t: undefined,\n\t\t)}\n\n\t.overlay-container {\n\t\tdisplay: none;\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\tprops.activated &&\n\t\t(props.buttonType == 'dashBold' || props.buttonType == 'dashRegular') &&\n\t\t`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t${`.text {\n\t\t\tcolor: ${COLORS.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${COLORS.background.brand};\n\t\t}\n\t\t`}\n\t}\n\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t`}\n\n\t:disabled {\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\tcursor: ${(props) =>\n\t\t\tprops.buttonType === 'text' ? 'auto' : 'not-allowed'};\n\t\t${(props) =>\n\t\t\tgenerateDisabledStyling(props.buttonType, props.size, props.inverse)}\n\t\t.text {\n\t\t\tcolor: ${(props) => getDisabledTextColor(props.inverse)} !important;\n\t\t}\n\t\t${(props) =>\n\t\t\tgetDashedBorderStyling(\n\t\t\t\tprops.buttonType,\n\t\t\t\tprops.size,\n\t\t\t\tCOLORS.stroke.primary,\n\t\t\t)}\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\t`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${\n\t\t\t\t\t\tprops.size === 'chip' &&\n\t\t\t\t\t\t`.text {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\t}\n\t\t\t\t}\n\n\n\t\t\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t\t\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t\t}`}\n\n\t${(props) =>\n\t\t// do not load hover styles for loading state and also active state\n\t\t!props.isLoading\n\t\t\t? `:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t{${\n\t\t\t\t\tprops.buttonColor\n\t\t\t\t\t\t? `background-color: ${getHoverButtonBackgroundCustom(\n\t\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t\t15,\n\t\t\t\t\t\t )}`\n\t\t\t\t\t\t: ''\n\t\t\t\t}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${getHoverButtonBackground(props.buttonType, props.inverse)}\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.size === 'chip' && props.buttonType !== 'text'\n\t\t\t\t\t\t? props.darkMode\n\t\t\t\t\t\t\t? `background-color: ${COLORS.stroke.primary};`\n\t\t\t\t\t\t\t: `background-color: ${COLORS.surface.hovered};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.buttonType === 'special'\n\t\t\t\t\t\t? `background-color: ${COLORS.background.brandLight};`\n\t\t\t\t\t\t: props.buttonType === 'secondaryGray'\n\t\t\t\t\t\t? `background-color: ${COLORS.surface.hovered};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.buttonType === 'primary' &&\n\t\t\t\t\tprops.size !== 'chip' &&\n\t\t\t\t\tprops.size !== 'xs' &&\n\t\t\t\t\t!props.inverse &&\n\t\t\t\t\t!props.buttonColor\n\t\t\t\t\t\t? `background-color: ${COLORS.background.inverse};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonType === 'text'\n\t\t\t\t\t? getHoverButtonTextDecorationStyle(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.inverse\n\t\t\t\t\t? generateInverseHoverBackground(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t}`\n\t\t\t: `\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${getLoadingBorder(props.buttonType, props.size, props.inverse)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonColor\n\t\t\t\t\t? `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t15,\n\t\t\t\t\t )};`\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${getLoadingBackground(\n\t\t\t\t\tprops.buttonType,\n\t\t\t\t\tprops.size,\n\t\t\t\t\tprops.inverse,\n\t\t\t\t\tprops.buttonColor,\n\t\t\t\t)}\n\t\t\t\t.spinner {\n\t\t\t\t\tline-height: 0;\n\t\t\t\t}\n\t\t\t}\n\t\t}`}\n\n\t\t.button-container {\n\t\tdisplay: flex;\n\t\tgap: 8.33px;\n\t\t${(props) => (props.matchParentWidth ? 'margin: auto;' : '')}\n\t}\n`;\n\nexport const ButtonCustomDashedBorder = () => {\n\treturn (\n\t\t<>\n\t\t\t<div className=\"line-top\"></div>\n\t\t\t<div className=\"line-left\"></div>\n\t\t\t<div className=\"line-bottom\"></div>\n\t\t\t<div className=\"line-right\"></div>\n\t\t</>\n\t);\n};\n"],"names":["Button","process","env","NODE_ENV","target","label","_styled","props","buttonType","matchParentWidth","getBackgroundColor","size","inverse","darkMode","buttonColor","startsWith","getPadding","getBorder","_a","version","error","getColor","getDashedBorderStyling","isLoading","COLORS","stroke","brandLightAlt","negative","vibrant","undefined","disabled","activated","content","brand","background","getClickEffect","primary","generateDisabledStyling","getDisabledTextColor","inverseLight","getLoadingBorder","getLoadingButtonBackgroundCustom","getLoadingBackground","getHoverButtonBackgroundCustom","getHoverButtonBackground","surface","hovered","brandLight","getHoverButtonTextDecorationStyle","generateInverseHoverBackground","ButtonCustomDashedBorder","_jsxs","_Fragment","children","_jsx","jsx","className"],"mappings":"gRAqBO,MAAMA,OAAM,iBAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,UAAAC,CAkBAC,gFAAAA,GAA+B,QAApBA,EAAMC,WAAuB,IAAM,4BAE7DD,GAAWA,EAAME,iBAAkC,gBAAG,IAAG,sBACvCF,GACpBG,EAAkBA,mBACjBH,EAAMC,WACND,EAAMI,KACNJ,EAAMK,QACNL,EAAMM,SACNN,EAAMO,cAGLP,KAAAA,UACF,OAAAA,EAAMC,WAAWO,WAAW,QACzB,+KAMER,EAAME,iBAAmB,2BAA6B,0BAC7CO,EAAUA,WAACT,EAAMC,WAAYD,EAAMI,oBAElC,YAAAK,EAAUA,WAACT,EAAMC,WAAYD,EAAMI,aACjDM,EAASA,kBACVC,EAAAX,EAAMY,uBAAW,MACjBZ,EAAMC,WACND,EAAMI,KACNJ,EAAMK,QACNL,EAAMa,QACJ,GAAA,4BAGSb,GACK,SAAfA,EAAMI,MAAkC,OAAfJ,EAAMI,KAAgB,OAAS,QAAM,WACrDJ,GACM,SAAfA,EAAMI,MAAkC,OAAfJ,EAAMI,KAAgB,OAAS,QAAM,4BAIpDJ,GACK,SAAfA,EAAMI,MAAkC,OAAfJ,EAAMI,KAAgB,OAAS,QAC/CJ,WAAAA,GACM,SAAfA,EAAMI,MAAkC,OAAfJ,EAAMI,KAAgB,OAAS,0BAI/CJ,GACTc,EAAAA,SAASd,EAAMC,WAAYD,EAAMI,KAAMJ,EAAMK,QAASL,EAAMM,WAIlDN,2BAAAA,GACK,SAAfA,EAAMI,MAAkC,OAAfJ,EAAMI,KAAgB,OAAS,QAAM,WACrDJ,GACM,SAAfA,EAAMI,MAAkC,OAAfJ,EAAMI,KAAgB,OAAS,QAGvDJ,MAAAA,GACFe,EAAsBA,uBACrBf,EAAMC,WACND,EAAMI,KACNJ,EAAMgB,UACHC,EAAMA,OAACC,OAAOC,cACdnB,EAAMa,MACNI,EAAMA,OAACC,OAAOE,SAASC,aACvBC,IAOFtB,sCAAAA,IACDA,EAAMuB,WACNvB,EAAMgB,WACPhB,EAAMwB,YACe,YAApBxB,EAAMC,YAAgD,eAApBD,EAAMC,aACzC,oDAGED,EAAME,iBAAmB,2BAA6B,8IAO9Ce,EAAMA,OAACQ,QAAQC,uDAGfT,EAAMA,OAACU,WAAWD,+BAI3BE,EAAAA,eAAe5B,EAAMC,WAAYD,EAAMI,KAAMJ,EAAMK,eACnDU,EAAsBA,uBAACf,EAAMC,WAAYD,EAAMI,KAAMa,EAAMA,OAACQ,QAAQC,cAO1D1B,sBAAAA,GACW,SAArBA,EAAMC,WAAwB,OAAS,eAAa,KAMlDD,GACFe,EAAAA,uBACCf,EAAMC,WACND,EAAMI,KACNa,EAAAA,OAAOC,OAAOW,0DATb7B,GACF8B,EAAAA,wBAAwB9B,EAAMC,WAAYD,EAAMI,KAAMJ,EAAMK,UAAQ,iBAE1DL,GAAU+B,EAAAA,qBAAqB/B,EAAMK,UAAQ,iBAUtDL,IACDA,EAAMuB,WACNvB,EAAMgB,WACP,+EAGKhB,EAAME,iBAAmB,2BAA6B,4JAOxC,SAAfF,EAAMI,MACN,+BACSa,EAAMA,OAACU,WAAWK,gFAGlBf,EAAMA,OAACU,WAAWK,kEAO5BJ,EAAAA,eAAe5B,EAAMC,WAAYD,EAAMI,KAAMJ,EAAMK,mBACnDU,EAAsBA,uBAACf,EAAMC,WAAYD,EAAMI,KAAMa,EAAMA,OAACQ,QAAQC,sBAGrE1B,GAEDA,EAAMgB,UA8DJ,wDAGDiB,EAAAA,iBAAiBjC,EAAMC,WAAYD,EAAMI,KAAMJ,EAAMK,gKAUrDL,EAAMO,YACkB,qBAAA2B,EAAgCA,iCACrDlC,EAAMO,YACN,OAEA,sBAEOE,EAAUA,WAACT,EAAMC,WAAYD,EAAMI,yQAW3C+B,EAAoBA,qBACrBnC,EAAMC,WACND,EAAMI,KACNJ,EAAMK,QACNL,EAAMO,yFAhGN,0KAMCP,EAAME,iBAAmB,2BAA6B,wBAC7CO,EAAUA,WAACT,EAAMC,WAAYD,EAAMI,oBAE7CJ,EAAMO,YACkB,qBAAA6B,EAA8BA,+BACnDpC,EAAMO,YACN,MAEA,yNAUD8B,EAAwBA,yBAACrC,EAAMC,WAAYD,EAAMK,gCAGpC,SAAfL,EAAMI,MAAwC,SAArBJ,EAAMC,WAC5BD,EAAMM,SACgB,qBAAAW,EAAAA,OAAOC,OAAOW,WACd,qBAAAZ,SAAOqB,QAAQC,WACrC,eAGkB,YAArBvC,EAAMC,WACkB,qBAAAgB,SAAOU,WAAWa,cAClB,kBAArBxC,EAAMC,WACe,qBAAAgB,EAAAA,OAAOqB,QAAQC,WACpC,eAGkB,YAArBvC,EAAMC,YACS,SAAfD,EAAMI,MACS,OAAfJ,EAAMI,MACLJ,EAAMK,SACNL,EAAMO,YAEJ,GADqB,qBAAAU,SAAOU,WAAWtB,8BAKtB,SAArBL,EAAMC,WACHwC,EAAiCA,kCAACzC,EAAMC,WAAYD,EAAMuB,UAC1D,aAGHvB,EAAMK,QACHqC,iCAA+B1C,EAAMC,WAAYD,EAAMuB,UACvD,4DAiDFvB,GAAWA,EAAME,iBAAmB,gBAAkB,UAE1D,eAF6DR,QAAAC,IAAAC,SAE7D,GAAA,8zUAEuC+C,IAEtCC,EAAAA,KACCC,EAAAA,SAAA,CAAAC,SAAA,CAAAC,EAAAC,IAAA,MAAA,CAAKC,UAAU,aACfF,EAAAC,IAAA,MAAA,CAAKC,UAAU,cACfF,EAAAC,IAAA,MAAA,CAAKC,UAAU,gBACfF,EAAAC,IAAA,MAAA,CAAKC,UAAU"}
|
|
1
|
+
{"version":3,"file":"Button.styled.js","sources":["../../../../src/components/button/Button.styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { COLORS } from '@src/constants/Theme';\nimport { Size, Type } from './model';\nimport {\n\tgenerateDisabledStyling,\n\tgenerateInverseHoverBackground,\n\tgetBackgroundColor,\n\tgetBorder,\n\tgetClickEffect,\n\tgetColor,\n\tgetDashedBorderStyling,\n\tgetDisabledTextColor,\n\tgetHoverButtonBackground,\n\tgetHoverButtonBackgroundCustom,\n\tgetHoverButtonTextDecorationStyle,\n\tgetLoadingBackground,\n\tgetLoadingBorder,\n\tgetLoadingButtonBackgroundCustom,\n\tgetPadding,\n} from './themes';\n\nexport const Button = styled.button<{\n\tsize: Size;\n\tbuttonType: Type;\n\tisLoading?: boolean;\n\tinverse?: boolean;\n\tdisabled?: boolean;\n\tmatchParentWidth?: boolean;\n\tversion?: '1.0' | '2.0';\n\tdarkMode?: boolean;\n\tactivated?: boolean;\n\terror?: boolean;\n\tbuttonColor?: string;\n}>`\n\tall: unset;\n\tcursor: pointer;\n\tdisplay: flex;\n\tgap: 8.83px;\n\tborder-radius: ${(props) => (props.buttonType == 'text' ? '0' : '4px')};\n\toverflow: hidden;\n\t${(props) => (props.matchParentWidth ? `flex-grow: 1;` : '')}\n\tbackground-color: ${(props) =>\n\t\tgetBackgroundColor(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.inverse,\n\t\t\tprops.darkMode,\n\t\t\tprops.buttonColor,\n\t\t)};\n\n\t${(props) =>\n\t\tprops.buttonType.startsWith('dash')\n\t\t\t? `.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\tborder-radius: 4px;\n\t\t\t\t\toverflow: hidden;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t}`\n\t\t\t: `padding: ${getPadding(props.buttonType, props.size)};\n\t${getBorder(\n\t\tprops.version ?? '1.0',\n\t\tprops.buttonType,\n\t\tprops.size,\n\t\tprops.inverse,\n\t\tprops.error,\n\t)}`}\n\n\t.icon-component {\n\t\theight: ${(props) => (props.size === 'chip' ? '16px' : '20px')};\n\t\twidth: ${(props) => (props.size === 'chip' ? '16px' : '20px')};\n\t}\n\n\t.icon-trailing {\n\t\theight: ${(props) => (props.size === 'chip' ? '16px' : '20px')};\n\t\twidth: ${(props) => (props.size === 'chip' ? '16px' : '20px')};\n\t}\n\n\t.text {\n\t\tcolor: ${(props) =>\n\t\t\tgetColor(props.buttonType, props.size, props.inverse, props.darkMode)};\n\t}\n\n\t.icon-leading {\n\t\theight: ${(props) => (props.size === 'chip' ? '16px' : '20px')};\n\t\twidth: ${(props) => (props.size === 'chip' ? '16px' : '20px')};\n\t}\n\n\t${(props) =>\n\t\tgetDashedBorderStyling(\n\t\t\tprops.buttonType,\n\t\t\tprops.size,\n\t\t\tprops.isLoading\n\t\t\t\t? COLORS.stroke.brandLightAlt\n\t\t\t\t: props.error\n\t\t\t\t? COLORS.stroke.negative.vibrant\n\t\t\t\t: undefined,\n\t\t)}\n\n\t.overlay-container {\n\t\tdisplay: none;\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\tprops.activated &&\n\t\t(props.buttonType == 'dashBold' || props.buttonType == 'dashRegular') &&\n\t\t`\n\t.button-container {\n\t\tdisplay: flex;\n\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\t${`.text {\n\t\t\tcolor: ${COLORS.content.brand} !important;\n\t\t}\n\t\t.icon {\n\t\t\tcolor: ${COLORS.background.brand};\n\t\t}\n\t\t`}\n\t}\n\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t`}\n\n\t:disabled {\n\t\t.overlay-container {\n\t\t\tdisplay: none !important;\n\t\t}\n\t\tcursor: ${(props) =>\n\t\t\tprops.buttonType === 'text' ? 'auto' : 'not-allowed'};\n\t\t${(props) =>\n\t\t\tgenerateDisabledStyling(props.buttonType, props.size, props.inverse)}\n\t\t.text {\n\t\t\tcolor: ${(props) => getDisabledTextColor(props.inverse)} !important;\n\t\t}\n\t\t${(props) =>\n\t\t\tgetDashedBorderStyling(\n\t\t\t\tprops.buttonType,\n\t\t\t\tprops.size,\n\t\t\t\tCOLORS.stroke.primary,\n\t\t\t)}\n\t}\n\n\t${(props) =>\n\t\t!props.disabled &&\n\t\t!props.isLoading &&\n\t\t`:active {\n\t\t\t\t.button-container {\n\t\t\t\t\tdisplay: flex;\n\t\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\t\tposition: relative;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\t.overlay-container {\n\t\t\t\t\t\tdisplay: none !important;\n\t\t\t\t\t}\n\t\t\t\t\t${\n\t\t\t\t\t\tprops.size === 'chip' &&\n\t\t\t\t\t\t`.text {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight} !important;\n\t\t\t\t\t}\n\t\t\t\t\t.icon {\n\t\t\t\t\t\tcolor: ${COLORS.background.inverseLight};\n\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\t}\n\t\t\t\t}\n\n\n\t\t\t${getClickEffect(props.buttonType, props.size, props.inverse)}\n\t\t\t${getDashedBorderStyling(props.buttonType, props.size, COLORS.content.brand)}\n\t\t}`}\n\n\t${(props) =>\n\t\t// do not load hover styles for loading state and also active state\n\t\t!props.isLoading\n\t\t\t? `:not(:active):not(:disabled):hover {\n\t\t\tpadding: 0;\n\t\t\t.button-container {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t\twidth: 100%;\n\t\t\t\t${props.matchParentWidth ? 'justify-content: center;' : ''}\n\t\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t\t{${\n\t\t\t\t\tprops.buttonColor\n\t\t\t\t\t\t? `background-color: ${getHoverButtonBackgroundCustom(\n\t\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t\t15,\n\t\t\t\t\t\t )}`\n\t\t\t\t\t\t: ''\n\t\t\t\t}}\n\t\t\t\t.overlay-container {\n\t\t\t\t\tdisplay: block;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tpadding: 0;\n\t\t\t\t\ttop: 0;\n\t\t\t\t\tleft: 0;\n\t\t\t\t\twidth: 100%;\n\t\t\t\t\theight: 100%;\n\t\t\t\t\t${getHoverButtonBackground(props.buttonType, props.inverse)}\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.size === 'chip' && props.buttonType !== 'text'\n\t\t\t\t\t\t? props.darkMode\n\t\t\t\t\t\t\t? `background-color: ${COLORS.stroke.primary};`\n\t\t\t\t\t\t\t: `background-color: ${COLORS.surface.hovered};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\t${\n\t\t\t\t\tprops.buttonType === 'primary' &&\n\t\t\t\t\tprops.size !== 'chip' &&\n\t\t\t\t\t!props.inverse &&\n\t\t\t\t\t!props.buttonColor\n\t\t\t\t\t\t? `background-color: ${COLORS.background.inverse};`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonType === 'text'\n\t\t\t\t\t? getHoverButtonTextDecorationStyle(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.inverse\n\t\t\t\t\t? generateInverseHoverBackground(props.buttonType, props.disabled)\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t}`\n\t\t\t: `\n\t\t\tcursor: not-allowed;\n\t\t\tpadding: 0;\n\t\t${getLoadingBorder(props.buttonType, props.size, props.inverse)}\n\n\t\t.button-container {\n\t\t\tdisplay: flex;\n\t\t\tposition: relative;\n\t\t\twidth: 100%;\n\t\t\t.text {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t${\n\t\t\t\tprops.buttonColor\n\t\t\t\t\t? `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\t\t\t\tprops.buttonColor,\n\t\t\t\t\t\t\t15,\n\t\t\t\t\t )};`\n\t\t\t\t\t: ''\n\t\t\t}\n\t\t\tpadding: ${getPadding(props.buttonType, props.size)};\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: block;\n\t\t\t\tposition: absolute;\n\t\t\t\tpadding: 0;\n\t\t\t\tpadding-top: 1px;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\t${getLoadingBackground(\n\t\t\t\t\tprops.buttonType,\n\t\t\t\t\tprops.size,\n\t\t\t\t\tprops.inverse,\n\t\t\t\t\tprops.buttonColor,\n\t\t\t\t)}\n\t\t\t\t.spinner {\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\ttop: calc(50% - 14px);\n\t\t\t\t\tleft: calc(50% - 7px);\n\t\t\t\t}\n\n\t\t\t}\n\t\t}`}\n\n\t\t.button-container {\n\t\tdisplay: flex;\n\t\tgap: 8.33px;\n\t\t${(props) => (props.matchParentWidth ? 'margin: auto;' : '')}\n\t}\n`;\n\nexport const ButtonCustomDashedBorder = () => {\n\treturn (\n\t\t<>\n\t\t\t<div className=\"line-top\"></div>\n\t\t\t<div className=\"line-left\"></div>\n\t\t\t<div className=\"line-bottom\"></div>\n\t\t\t<div className=\"line-right\"></div>\n\t\t</>\n\t);\n};\n"],"names":["Button","process","env","NODE_ENV","target","label","_styled","props","buttonType","matchParentWidth","getBackgroundColor","size","inverse","darkMode","buttonColor","startsWith","getPadding","getBorder","_a","version","error","getColor","getDashedBorderStyling","isLoading","COLORS","stroke","brandLightAlt","negative","vibrant","undefined","disabled","activated","content","brand","background","getClickEffect","primary","generateDisabledStyling","getDisabledTextColor","inverseLight","getLoadingBorder","getLoadingButtonBackgroundCustom","getLoadingBackground","getHoverButtonBackgroundCustom","getHoverButtonBackground","surface","hovered","getHoverButtonTextDecorationStyle","generateInverseHoverBackground","ButtonCustomDashedBorder","_jsxs","_Fragment","children","_jsx","jsx","className"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../constants/Theme.js"),r=require("../TypographyStyle.js");const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../constants/Theme.js"),r=require("../TypographyStyle.js");const n=(r,n,e)=>e?t.COLORS.stroke.negative.vibrant:n?t.COLORS.surface.standard:"secondary"==r?t.COLORS.stroke.brand:t.COLORS.content.placeholder,e=t=>"medium"===t?"5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px":"6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px",o=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),o=(n>>16)+e,a=(n>>8&255)+e,i=(255&n)+e;return`#${(16777216+(Math.min(o,255)<<16)+(Math.min(a,255)<<8)+Math.min(i,255)).toString(16).slice(1)}`};exports.GetButtonTextComponent=(t,n,e)=>e||"ai"!==n?"dashRegular"===n?r.BodySecondary:"chip"===t?r.BodyCaption:"small"===t?r.ButtonRegular:r.ButtonLarge:"small"===t?r.ButtonRegularAI:r.ButtonLargeAI,exports.SpinnerColorMap=(r,n)=>n?"primary"===r?t.COLORS.content.primary:t.COLORS.content.primaryInverse:"destructive"===r?t.COLORS.content.negative:t.COLORS.content.brand,exports.generateDisabledStyling=(r,n,e)=>"chip"===n?"background-color: transparent;":"primary"===r||"destructive"===r?e?"background-color: rgba(255,255,255,0.3);":`background-color: ${t.COLORS.background.inactive};`:"secondary"===r?e?"border: 1px solid rgba(255, 255, 255, 0.5);":`border: 1px solid ${t.COLORS.stroke.primary};`:"",exports.generateInverseHoverBackground=(r,n)=>n?"":"primary"===r?`background-color: ${t.COLORS.stroke.warning.lightAlt};`:"background-color: rgba(255, 255, 255, 0.1)",exports.getBackgroundColor=(r,n,e,o,a)=>{if("chip"===n)return"text"===r?"transparent":o?t.COLORS.surface.hovered:t.COLORS.surface.subdued;switch(r){case"primary":return a||(e?t.COLORS.background.warning.vibrant:t.COLORS.background.inverseLight);case"destructive":return t.COLORS.background.negative.vibrant;default:return"transparent"}},exports.getBorder=(r,e,o,a,i)=>"text"==e?"border: none;":"chip"===o?`border: ${"2.0"===r?.5:1}px solid ${t.COLORS.stroke.primary};`:a?"secondary"===e?`border: ${"2.0"===r?.5:1}px solid ${n(e,a,i)};`:"border: none;":"secondary"===e?`border: ${"2.0"===r?.5:1}px solid ${n(e,!1,i)};`:"border: none;",exports.getBorderColor=n,exports.getButtonIconColor=(r,n,e,o,a,i)=>"chip"===r?o?t.COLORS.content.inactive:i?t.COLORS.content.primary:t.COLORS.content.secondary:a?"transparent":"primary"===n||"destructive"===n?e?o?"rgba(255, 255, 255, 0.5)":t.COLORS.content.primary:o?t.COLORS.content.inactive:t.COLORS.content.primaryInverse:"secondary"===n||"tertiary"===n?e?o?"rgba(255, 255, 255, 0.5)":t.COLORS.content.primaryInverse:o?t.COLORS.content.inactive:t.COLORS.content.brand:"tertiaryGray"===n||n.startsWith("dash")?o?t.COLORS.content.inactive:t.COLORS.content.secondary:void 0,exports.getClickEffect=(r,n,e)=>"text"===r?`background-color: ${t.COLORS.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.COLORS.content.brand};`:"chip"===n?`border: 1px solid ${t.COLORS.stroke.brandLightAlt};\n\t\tbackground-color: ${t.COLORS.background.brandLight};`:"primary"===r||"destructive"===r?e?`background-color: ${t.COLORS.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`:"box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);":"secondary"===r||"tertiary"===r||"tertiaryGray"===r||r.startsWith("dash")?e?`background-color: ${t.COLORS.background.inverseLight} !important;`:`background-color: ${t.COLORS.background.brandLight};`:void 0,exports.getColor=(r,n,e,o)=>{if("chip"===n)return"text"===r?e?t.COLORS.content.inactive:t.COLORS.content.brand:o?t.COLORS.content.primary:t.COLORS.content.secondary;switch(r){case"primary":return e?t.COLORS.content.primary:t.COLORS.content.primaryInverse;case"tertiaryGray":case"dashBold":case"dashRegular":return t.COLORS.content.secondary;case"destructive":return t.COLORS.content.primaryInverse;case"ai":return t.COLORS.content.ai;default:return e?t.COLORS.content.primaryInverse:t.COLORS.stroke.brand}},exports.getDashedBorderStyling=function(t,r){let o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:n(t,!1);return`\n\t.line-top {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\n\t\t);\n\t}\n\t.line-right {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\n\t\t);\n\t}\n\t.line-bottom {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tbottom: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\n\t\t);\n\t}\n\t.line-left {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${o},\n\t\t\t${o}\n\t\t\t\t${e(r)}\n\t\t);\n\t}\n\t`},exports.getDisabledTextColor=r=>r?"rgba(255, 255, 255, 0.5)":t.COLORS.content.inactive,exports.getHoverButtonBackground=(r,n)=>"ai"===r?`background: ${t.COLORS.surface.aiLight};`:"text"===r?"background-color:transparent;":n||"primary"===r?"":"background-color: #000000;\n\t\t\t\topacity: 0.03;",exports.getHoverButtonBackgroundCustom=(t,r)=>{const n=parseInt(t.replace("#",""),16),e=Math.round(2.55*r),o=(n>>16)-e,a=(n>>8&255)-e,i=(255&n)-e;return`#${(16777216+(Math.max(o,0)<<16)+(Math.max(a,0)<<8)+Math.max(i,0)).toString(16).slice(1)}`},exports.getHoverButtonTextDecorationStyle=(r,n)=>n?"":`text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${t.COLORS.content.brand};`,exports.getLinearGradientValue=e,exports.getLoadingBackground=(r,n,e,a)=>"chip"===n?`background-color: ${t.COLORS.background.base};`:"primary"===r?a?`background-color: ${o(a,50)};`:`background-color: ${e?t.COLORS.background.warning.vibrant:t.COLORS.background.brandLight};`:"destructive"===r?`background-color: ${t.COLORS.background.negative.light};`:"background-color: transparent;",exports.getLoadingBorder=(r,n,e)=>"chip"===n?"border: none;":"secondary"===r?e?`border: 1px solid ${t.COLORS.content.secondary};`:`border: 1px solid ${t.COLORS.stroke.brandLightAlt};`:"",exports.getLoadingButtonBackgroundCustom=o,exports.getPadding=(t,r)=>{if("text"===t)return"0px";if("chip"===r)return"4px 8px";if("small"===r)switch(t){case"tertiary":case"tertiaryGray":return"6px 4px";default:return"6px 12px"}else if("medium"===r)switch(t){case"tertiary":case"tertiaryGray":return"10px 4px";default:return"10px 12px"}else if("large"===r)switch(t){case"tertiary":case"tertiaryGray":return"14px 4px";default:return"14px 12px"}};
|
|
2
2
|
//# sourceMappingURL=themes.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themes.js","sources":["../../../../src/components/button/themes.tsx"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tButtonLarge,\n\tButtonLargeAI,\n\tButtonRegular,\n\tButtonRegularAI,\n} from '../TypographyStyle';\nimport { Size, Type } from './model';\n\nexport const getBackgroundColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n\tbuttonColor?: string,\n): string => {\n\tif (type === 'special') return COLORS.background.brandVeryLight;\n\tif (type === 'secondaryGray') return 'transparent';\n\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn 'transparent';\n\t\t}\n\t\treturn darkMode ? COLORS.surface.hovered : COLORS.surface.subdued;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn buttonColor\n\t\t\t\t? buttonColor\n\t\t\t\t: inverse\n\t\t\t\t? COLORS.background.warning.vibrant\n\t\t\t\t: COLORS.background.inverseLight;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.background.negative.vibrant;\n\t\tcase 'tertiary':\n\t\t\treturn 'transparent';\n\t\tdefault:\n\t\t\treturn 'transparent';\n\t}\n};\n\nexport const getColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n): string => {\n\tif (type === 'special') return COLORS.background.inverseLight;\n\tif (type === 'secondaryGray') return COLORS.content.secondary;\n\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn inverse ? COLORS.content.inactive : COLORS.content.brand;\n\t\t}\n\t\treturn darkMode ? COLORS.content.primary : COLORS.content.secondary;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn inverse ? COLORS.content.primary : COLORS.content.primaryInverse;\n\t\tcase 'tertiaryGray':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.content.primaryInverse;\n\t\tcase 'dashBold':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'dashRegular':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'ai':\n\t\t\treturn COLORS.content.ai;\n\t\tdefault:\n\t\t\treturn inverse ? COLORS.content.primaryInverse : COLORS.stroke.brand;\n\t}\n};\n\nexport const getDisabledTextColor = (inverse?: boolean) => {\n\tif (inverse) {\n\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t}\n\treturn COLORS.content.inactive;\n};\n\nexport const getPadding = (type: Type, size: Size) => {\n\tif (type === 'text') {\n\t\treturn '0px';\n\t} else if (size === 'xs') {\n\t\tconst hasBorder =\n\t\t\ttype === 'secondary' || type === 'special' || type === 'secondaryGray';\n\t\treturn hasBorder ? '3px 6px' : '4px 6px';\n\t} else if (size === 'chip') {\n\t\treturn '4px 8px';\n\t} else if (size === 'small') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '6px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '6px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '6px 12px';\n\t\t}\n\t} else if (size === 'medium') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '10px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '10px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '10px 12px';\n\t\t}\n\t} else if (size === 'large') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '14px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '14px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '14px 12px';\n\t\t}\n\t}\n};\nexport const GetButtonTextComponent = (\n\tsize: Size,\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (!disabled && type === 'ai') {\n\t\tif (size === 'small') {\n\t\t\treturn ButtonRegularAI;\n\t\t} else {\n\t\t\treturn ButtonLargeAI;\n\t\t}\n\t}\n\n\tif (type === 'dashRegular') {\n\t\treturn BodySecondary;\n\t}\n\tif (size === 'chip' || size === 'xs') {\n\t\treturn BodyCaption;\n\t} else if (size === 'small') {\n\t\treturn ButtonRegular;\n\t}\n\treturn ButtonLarge;\n};\n\nexport const getBorderColor = (\n\ttype: Type,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (error) {\n\t\treturn COLORS.stroke.negative.vibrant;\n\t}\n\n\tif (inverse) {\n\t\treturn COLORS.surface.standard;\n\t}\n\tif (type == 'secondary') {\n\t\treturn COLORS.stroke.brand;\n\t}\n\treturn COLORS.content.placeholder;\n};\n\nexport const getBorder = (\n\tversion: '1.0' | '2.0' | '3.0',\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (type == 'text') {\n\t\treturn 'border: none;';\n\t}\n\tif (type === 'special') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${\n\t\t\tCOLORS.stroke.primary\n\t\t};`;\n\t}\n\tif (inverse) {\n\t\tif (type === 'secondary') {\n\t\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\t\ttype,\n\t\t\t\tinverse,\n\t\t\t\terror,\n\t\t\t)};`;\n\t\t}\n\t\treturn 'border: none;';\n\t}\n\n\tif (type === 'secondary') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\ttype,\n\t\t\tfalse,\n\t\t\terror,\n\t\t)};`;\n\t}\n\treturn 'border: none;';\n};\n\nexport const getLinearGradientValue = (size: Size): string => {\n\tif (size === 'medium') {\n\t\treturn `5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px`;\n\t}\n\treturn `6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px`;\n};\n\n/**\n * Adjusts the brightness of a given hex color by a specified percentage.\n * Below function is used to generate a hover effect for button backgrounds.\n *\n * @param {string} color - The hex color code to be adjusted (e.g., \"#ff0000\").\n * @param {number} percent - The percentage by which to darken the color. Positive values darken the color.\n * @returns {string} - The adjusted hex color code.\n *\n * @example\n * // Darken the color #ff0000 (red) by 10%\n * const darkerRed = getHoverButtonBackgroundCustom(\"#ff0000\", 10);\n * console.log(darkerRed); // Output might be \"#e60000\"\n */\n\nexport const getHoverButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) - amt,\n\t\tG = ((num >> 8) & 0x00ff) - amt,\n\t\tB = (num & 0x0000ff) - amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.max(R, 0) << 16) +\n\t\t(Math.max(G, 0) << 8) +\n\t\tMath.max(B, 0)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\n/**\n * Generates a new color by adjusting the brightness of the given color by a specified percentage.\n *\n * @param color - The original color in hexadecimal format (e.g., \"#RRGGBB\").\n * @param percent - The percentage to adjust the brightness. Positive values will lighten the color, while negative values will darken it.\n * @returns The new color in hexadecimal format after adjusting the brightness.\n *\n * @example\n * // Lighten the color by 20%\n * const newColor = getLoadingButtonBackgroundCustom(\"#ff0000\", 20); // \"#ff3333\"\n *\n * @example\n * // Darken the color by 10%\n * const newColor = getLoadingButtonBackgroundCustom(\"#00ff00\", -10); // \"#00e600\"\n */\nexport const getLoadingButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) + amt,\n\t\tG = ((num >> 8) & 0x00ff) + amt,\n\t\tB = (num & 0x0000ff) + amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.min(R, 255) << 16) +\n\t\t(Math.min(G, 255) << 8) +\n\t\tMath.min(B, 255)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\nexport const getHoverButtonBackground = (type: Type, inverse?: boolean) => {\n\tif (type === 'ai') {\n\t\treturn `background: ${COLORS.surface.aiLight};`;\n\t}\n\n\tif (type === 'text') {\n\t\treturn `background-color:transparent;`;\n\t}\n\tif (type === 'special' || type === 'secondaryGray') {\n\t\treturn '';\n\t}\n\tif (!inverse && type !== 'primary') {\n\t\treturn `background-color: #000000;\n\t\t\t\topacity: 0.03;`;\n\t}\n\n\treturn ``;\n};\n\nexport const getHoverButtonTextDecorationStyle = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\treturn `text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n};\n\nexport const generateInverseHoverBackground = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\tif (type === 'primary') {\n\t\treturn `background-color: ${COLORS.stroke.warning.lightAlt};`;\n\t}\n\treturn `background-color: rgba(255, 255, 255, 0.1)`;\n};\n\nexport const generateDisabledStyling = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n) => {\n\tif (type === 'special') {\n\t\treturn `background-color: ${COLORS.background.base}; border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `background-color: transparent;`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\treturn inverse\n\t\t\t? 'background-color: rgba(255,255,255,0.3);'\n\t\t\t: `background-color: ${COLORS.background.inactive};`;\n\t} else if (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid rgba(255, 255, 255, 0.5);`\n\t\t\t: `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\treturn '';\n};\n\nexport const getDashedBorderStyling = (\n\ttype: Type,\n\tsize: Size,\n\tborderColor: string = getBorderColor(type, false),\n) => {\n\treturn `\n\t.line-top {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-right {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-bottom {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tbottom: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-left {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t`;\n};\n\nexport const getClickEffect = (type: Type, size: Size, inverse?: boolean) => {\n\tif (type === 'text') {\n\t\treturn `background-color: ${COLORS.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n\t}\n\tif (type === 'special') {\n\t\treturn `background-color: ${COLORS.background.brandLight}; border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `background-color: ${COLORS.surface.hovered}; border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};\n\t\tbackground-color: ${COLORS.background.brandLight};`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\treturn `background-color: ${COLORS.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`;\n\t\t}\n\t\treturn 'box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);';\n\t} else if (\n\t\ttype === 'secondary' ||\n\t\ttype === 'tertiary' ||\n\t\ttype === 'tertiaryGray' ||\n\t\ttype.startsWith('dash')\n\t) {\n\t\treturn inverse\n\t\t\t? `background-color: ${COLORS.background.inverseLight} !important;`\n\t\t\t: `background-color: ${COLORS.background.brandLight};`;\n\t}\n};\nexport const getLoadingBackground = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tbuttonColor?: string,\n) => {\n\tif (type === 'special') {\n\t\treturn `background-color: ${COLORS.background.brandVeryLight};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `background-color: ${COLORS.surface.subdued};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `background-color: ${COLORS.background.base};`;\n\t}\n\tif (type === 'primary') {\n\t\tif (buttonColor) {\n\t\t\treturn `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\tbuttonColor,\n\t\t\t\t50,\n\t\t\t)};`;\n\t\t}\n\t\treturn `background-color: ${\n\t\t\tinverse ? COLORS.background.warning.vibrant : COLORS.background.brandLight\n\t\t};`;\n\t}\n\tif (type === 'destructive') {\n\t\treturn `background-color: ${COLORS.background.negative.light};`;\n\t}\n\treturn 'background-color: transparent;';\n};\n\nexport const getLoadingBorder = (type: Type, size: Size, inverse?: boolean) => {\n\tif (type === 'special') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: none;`;\n\t}\n\tif (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid ${COLORS.content.secondary};`\n\t\t\t: `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\treturn '';\n};\n\nexport const SpinnerColorMap = (type: Type, inverse?: boolean) => {\n\tif (type === 'secondaryGray') return COLORS.content.secondary;\n\tif (inverse) {\n\t\tif (type === 'primary') {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t}\n\tif (type === 'destructive') {\n\t\treturn COLORS.content.negative;\n\t}\n\treturn COLORS.content.brand;\n};\n\nexport const getButtonIconColor = (\n\tsize: Size,\n\ttype: Type,\n\tinverse?: boolean,\n\tdisabled?: boolean,\n\tisLoading?: boolean,\n\tdarkMode?: boolean,\n) => {\n\tif (size === 'chip') {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t} else if (darkMode) {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n\tif (isLoading) {\n\t\treturn 'transparent';\n\t}\n\tif (type === 'special') {\n\t\treturn disabled ? COLORS.content.inactive : COLORS.background.inverseLight;\n\t}\n\tif (type === 'secondaryGray') {\n\t\treturn disabled ? COLORS.content.inactive : COLORS.content.secondary;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t} else if (type === 'secondary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiaryGray' || type.startsWith('dash')) {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n};\n"],"names":["getBackgroundColor","getBorderColor","type","inverse","error","COLORS","stroke","negative","vibrant","surface","standard","brand","content","placeholder","getLinearGradientValue","size","getLoadingButtonBackgroundCustom","color","percent","num","parseInt","replace","amt","Math","round","R","G","B","min","toString","slice","GetButtonTextComponent","disabled","BodySecondary","BodyCaption","ButtonRegular","ButtonLarge","ButtonRegularAI","ButtonLargeAI","SpinnerColorMap","secondary","primary","primaryInverse","generateDisabledStyling","background","base","inactive","generateInverseHoverBackground","warning","lightAlt","darkMode","buttonColor","brandVeryLight","hovered","subdued","inverseLight","getBorder","version","brandLightAlt","getButtonIconColor","isLoading","startsWith","getClickEffect","brandLight","getColor","ai","borderColor","arguments","length","undefined","getHoverButtonBackground","aiLight","getHoverButtonBackgroundCustom","max","getHoverButtonTextDecorationStyle","getLoadingBackground","light","getLoadingBorder","getPadding"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"themes.js","sources":["../../../../src/components/button/themes.tsx"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tButtonLarge,\n\tButtonLargeAI,\n\tButtonRegular,\n\tButtonRegularAI,\n} from '../TypographyStyle';\nimport { Size, Type } from './model';\n\nexport const getBackgroundColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n\tbuttonColor?: string,\n): string => {\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn 'transparent';\n\t\t}\n\t\treturn darkMode ? COLORS.surface.hovered : COLORS.surface.subdued;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn buttonColor\n\t\t\t\t? buttonColor\n\t\t\t\t: inverse\n\t\t\t\t? COLORS.background.warning.vibrant\n\t\t\t\t: COLORS.background.inverseLight;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.background.negative.vibrant;\n\t\tcase 'tertiary':\n\t\t\treturn 'transparent';\n\t\tdefault:\n\t\t\treturn 'transparent';\n\t}\n};\n\nexport const getColor = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tdarkMode?: boolean,\n): string => {\n\tif (size === 'chip') {\n\t\tif (type === 'text') {\n\t\t\treturn inverse ? COLORS.content.inactive : COLORS.content.brand;\n\t\t}\n\t\treturn darkMode ? COLORS.content.primary : COLORS.content.secondary;\n\t}\n\tswitch (type) {\n\t\tcase 'primary':\n\t\t\treturn inverse ? COLORS.content.primary : COLORS.content.primaryInverse;\n\t\tcase 'tertiaryGray':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'destructive':\n\t\t\treturn COLORS.content.primaryInverse;\n\t\tcase 'dashBold':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'dashRegular':\n\t\t\treturn COLORS.content.secondary;\n\t\tcase 'ai':\n\t\t\treturn COLORS.content.ai;\n\t\tdefault:\n\t\t\treturn inverse ? COLORS.content.primaryInverse : COLORS.stroke.brand;\n\t}\n};\n\nexport const getDisabledTextColor = (inverse?: boolean) => {\n\tif (inverse) {\n\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t}\n\treturn COLORS.content.inactive;\n};\n\nexport const getPadding = (type: Type, size: Size) => {\n\tif (type === 'text') {\n\t\treturn '0px';\n\t} else if (size === 'chip') {\n\t\treturn '4px 8px';\n\t} else if (size === 'small') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '6px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '6px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '6px 12px';\n\t\t}\n\t} else if (size === 'medium') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '10px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '10px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '10px 12px';\n\t\t}\n\t} else if (size === 'large') {\n\t\tswitch (type) {\n\t\t\tcase 'tertiary':\n\t\t\t\treturn '14px 4px';\n\t\t\tcase 'tertiaryGray':\n\t\t\t\treturn '14px 4px';\n\t\t\tdefault:\n\t\t\t\treturn '14px 12px';\n\t\t}\n\t}\n};\nexport const GetButtonTextComponent = (\n\tsize: Size,\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (!disabled && type === 'ai') {\n\t\tif (size === 'small') {\n\t\t\treturn ButtonRegularAI;\n\t\t} else {\n\t\t\treturn ButtonLargeAI;\n\t\t}\n\t}\n\n\tif (type === 'dashRegular') {\n\t\treturn BodySecondary;\n\t}\n\tif (size === 'chip') {\n\t\treturn BodyCaption;\n\t} else if (size === 'small') {\n\t\treturn ButtonRegular;\n\t}\n\treturn ButtonLarge;\n};\n\nexport const getBorderColor = (\n\ttype: Type,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (error) {\n\t\treturn COLORS.stroke.negative.vibrant;\n\t}\n\n\tif (inverse) {\n\t\treturn COLORS.surface.standard;\n\t}\n\tif (type == 'secondary') {\n\t\treturn COLORS.stroke.brand;\n\t}\n\treturn COLORS.content.placeholder;\n};\n\nexport const getBorder = (\n\tversion: '1.0' | '2.0',\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\terror?: boolean,\n): string => {\n\tif (type == 'text') {\n\t\treturn 'border: none;';\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${\n\t\t\tCOLORS.stroke.primary\n\t\t};`;\n\t}\n\tif (inverse) {\n\t\tif (type === 'secondary') {\n\t\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\t\ttype,\n\t\t\t\tinverse,\n\t\t\t\terror,\n\t\t\t)};`;\n\t\t}\n\t\treturn 'border: none;';\n\t}\n\n\tif (type === 'secondary') {\n\t\treturn `border: ${version === '2.0' ? 0.5 : 1}px solid ${getBorderColor(\n\t\t\ttype,\n\t\t\tfalse,\n\t\t\terror,\n\t\t)};`;\n\t}\n\treturn 'border: none;';\n};\n\nexport const getLinearGradientValue = (size: Size): string => {\n\tif (size === 'medium') {\n\t\treturn `5px,\n\t\ttransparent 5px,\n\t\ttransparent 10px`;\n\t}\n\treturn `6px,\n\t\ttransparent 6px,\n\t\ttransparent 12px`;\n};\n\n/**\n * Adjusts the brightness of a given hex color by a specified percentage.\n * Below function is used to generate a hover effect for button backgrounds.\n *\n * @param {string} color - The hex color code to be adjusted (e.g., \"#ff0000\").\n * @param {number} percent - The percentage by which to darken the color. Positive values darken the color.\n * @returns {string} - The adjusted hex color code.\n *\n * @example\n * // Darken the color #ff0000 (red) by 10%\n * const darkerRed = getHoverButtonBackgroundCustom(\"#ff0000\", 10);\n * console.log(darkerRed); // Output might be \"#e60000\"\n */\n\nexport const getHoverButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) - amt,\n\t\tG = ((num >> 8) & 0x00ff) - amt,\n\t\tB = (num & 0x0000ff) - amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.max(R, 0) << 16) +\n\t\t(Math.max(G, 0) << 8) +\n\t\tMath.max(B, 0)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\n/**\n * Generates a new color by adjusting the brightness of the given color by a specified percentage.\n *\n * @param color - The original color in hexadecimal format (e.g., \"#RRGGBB\").\n * @param percent - The percentage to adjust the brightness. Positive values will lighten the color, while negative values will darken it.\n * @returns The new color in hexadecimal format after adjusting the brightness.\n *\n * @example\n * // Lighten the color by 20%\n * const newColor = getLoadingButtonBackgroundCustom(\"#ff0000\", 20); // \"#ff3333\"\n *\n * @example\n * // Darken the color by 10%\n * const newColor = getLoadingButtonBackgroundCustom(\"#00ff00\", -10); // \"#00e600\"\n */\nexport const getLoadingButtonBackgroundCustom = (\n\tcolor: string,\n\tpercent: number,\n) => {\n\tconst num = parseInt(color.replace('#', ''), 16),\n\t\tamt = Math.round(2.55 * percent),\n\t\tR = (num >> 16) + amt,\n\t\tG = ((num >> 8) & 0x00ff) + amt,\n\t\tB = (num & 0x0000ff) + amt;\n\n\treturn `#${(\n\t\t0x1000000 +\n\t\t(Math.min(R, 255) << 16) +\n\t\t(Math.min(G, 255) << 8) +\n\t\tMath.min(B, 255)\n\t)\n\t\t.toString(16)\n\t\t.slice(1)}`;\n};\n\nexport const getHoverButtonBackground = (type: Type, inverse?: boolean) => {\n\tif (type === 'ai') {\n\t\treturn `background: ${COLORS.surface.aiLight};`;\n\t}\n\n\tif (type === 'text') {\n\t\treturn `background-color:transparent;`;\n\t}\n\tif (!inverse && type !== 'primary') {\n\t\treturn `background-color: #000000;\n\t\t\t\topacity: 0.03;`;\n\t}\n\n\treturn ``;\n};\n\nexport const getHoverButtonTextDecorationStyle = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\treturn `text-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n};\n\nexport const generateInverseHoverBackground = (\n\ttype: Type,\n\tdisabled?: boolean,\n) => {\n\tif (disabled) {\n\t\treturn '';\n\t}\n\tif (type === 'primary') {\n\t\treturn `background-color: ${COLORS.stroke.warning.lightAlt};`;\n\t}\n\treturn `background-color: rgba(255, 255, 255, 0.1)`;\n};\n\nexport const generateDisabledStyling = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n) => {\n\tif (size === 'chip') {\n\t\treturn `background-color: transparent;`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\treturn inverse\n\t\t\t? 'background-color: rgba(255,255,255,0.3);'\n\t\t\t: `background-color: ${COLORS.background.inactive};`;\n\t} else if (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid rgba(255, 255, 255, 0.5);`\n\t\t\t: `border: 1px solid ${COLORS.stroke.primary};`;\n\t}\n\treturn '';\n};\n\nexport const getDashedBorderStyling = (\n\ttype: Type,\n\tsize: Size,\n\tborderColor: string = getBorderColor(type, false),\n) => {\n\treturn `\n\t.line-top {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-right {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-bottom {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tbottom: 0;\n\t\theight: 1px;\n\t\twidth: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto right,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t.line-left {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 0;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground: repeating-linear-gradient(\n\t\t\tto bottom,\n\t\t\t${borderColor},\n\t\t\t${borderColor}\n\t\t\t\t${getLinearGradientValue(size)}\n\t\t);\n\t}\n\t`;\n};\n\nexport const getClickEffect = (type: Type, size: Size, inverse?: boolean) => {\n\tif (type === 'text') {\n\t\treturn `background-color: ${COLORS.background.brandLight};\n\t\t\ttext-decoration-line: underline;\n\t\t\ttext-decoration-color: ${COLORS.content.brand};`;\n\t}\n\tif (size === 'chip') {\n\t\treturn `border: 1px solid ${COLORS.stroke.brandLightAlt};\n\t\tbackground-color: ${COLORS.background.brandLight};`;\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\treturn `background-color: ${COLORS.background.warning.vibrant} !important;\n\t\t\tbox-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);\n\t\t\t`;\n\t\t}\n\t\treturn 'box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);';\n\t} else if (\n\t\ttype === 'secondary' ||\n\t\ttype === 'tertiary' ||\n\t\ttype === 'tertiaryGray' ||\n\t\ttype.startsWith('dash')\n\t) {\n\t\treturn inverse\n\t\t\t? `background-color: ${COLORS.background.inverseLight} !important;`\n\t\t\t: `background-color: ${COLORS.background.brandLight};`;\n\t}\n};\nexport const getLoadingBackground = (\n\ttype: Type,\n\tsize: Size,\n\tinverse?: boolean,\n\tbuttonColor?: string,\n) => {\n\tif (size === 'chip') {\n\t\treturn `background-color: ${COLORS.background.base};`;\n\t}\n\tif (type === 'primary') {\n\t\tif (buttonColor) {\n\t\t\treturn `background-color: ${getLoadingButtonBackgroundCustom(\n\t\t\t\tbuttonColor,\n\t\t\t\t50,\n\t\t\t)};`;\n\t\t}\n\t\treturn `background-color: ${\n\t\t\tinverse ? COLORS.background.warning.vibrant : COLORS.background.brandLight\n\t\t};`;\n\t}\n\tif (type === 'destructive') {\n\t\treturn `background-color: ${COLORS.background.negative.light};`;\n\t}\n\treturn 'background-color: transparent;';\n};\n\nexport const getLoadingBorder = (type: Type, size: Size, inverse?: boolean) => {\n\tif (size === 'chip') {\n\t\treturn `border: none;`;\n\t}\n\tif (type === 'secondary') {\n\t\treturn inverse\n\t\t\t? `border: 1px solid ${COLORS.content.secondary};`\n\t\t\t: `border: 1px solid ${COLORS.stroke.brandLightAlt};`;\n\t}\n\treturn '';\n};\n\nexport const SpinnerColorMap = (type: Type, inverse?: boolean) => {\n\tif (inverse) {\n\t\tif (type === 'primary') {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t}\n\tif (type === 'destructive') {\n\t\treturn COLORS.content.negative;\n\t}\n\treturn COLORS.content.brand;\n};\n\nexport const getButtonIconColor = (\n\tsize: Size,\n\ttype: Type,\n\tinverse?: boolean,\n\tdisabled?: boolean,\n\tisLoading?: boolean,\n\tdarkMode?: boolean,\n) => {\n\tif (size === 'chip') {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t} else if (darkMode) {\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n\tif (isLoading) {\n\t\treturn 'transparent';\n\t}\n\tif (type === 'primary' || type === 'destructive') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primary;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.primaryInverse;\n\t} else if (type === 'secondary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiary') {\n\t\tif (inverse) {\n\t\t\tif (disabled) {\n\t\t\t\treturn 'rgba(255, 255, 255, 0.5)';\n\t\t\t}\n\t\t\treturn COLORS.content.primaryInverse;\n\t\t}\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.brand;\n\t} else if (type === 'tertiaryGray' || type.startsWith('dash')) {\n\t\tif (disabled) {\n\t\t\treturn COLORS.content.inactive;\n\t\t}\n\t\treturn COLORS.content.secondary;\n\t}\n};\n"],"names":["getBackgroundColor","getBorderColor","type","inverse","error","COLORS","stroke","negative","vibrant","surface","standard","brand","content","placeholder","getLinearGradientValue","size","getLoadingButtonBackgroundCustom","color","percent","num","parseInt","replace","amt","Math","round","R","G","B","min","toString","slice","GetButtonTextComponent","disabled","BodySecondary","BodyCaption","ButtonRegular","ButtonLarge","ButtonRegularAI","ButtonLargeAI","SpinnerColorMap","primary","primaryInverse","generateDisabledStyling","background","inactive","generateInverseHoverBackground","warning","lightAlt","darkMode","buttonColor","hovered","subdued","inverseLight","getBorder","version","getButtonIconColor","isLoading","secondary","startsWith","getClickEffect","brandLight","brandLightAlt","getColor","ai","borderColor","arguments","length","undefined","getHoverButtonBackground","aiLight","getHoverButtonBackgroundCustom","max","getHoverButtonTextDecorationStyle","getLoadingBackground","base","light","getLoadingBorder","getPadding"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CountryCodePicker.js","sources":["../../../../src/components/country-code-picker/CountryCodePicker.tsx"],"sourcesContent":["import { Placement, PositioningStrategy } from '@popperjs/core';\nimport DownIcon from '@src/assets/icons/chevronDown.svg';\nimport React, { useEffect, useState } from 'react';\nimport {\n\tCountriesData,\n\tCountryCode,\n} from '@src/components/country-code-picker/CountryCodePicker.modal';\nimport {\n\tStyledCountryPickerOption,\n\tStyledCountryPickerWrapper,\n} from '@src/components/country-code-picker/CountryCodePicker.styled';\nimport { DropdownPopover } from '@src/components/dropdown';\nimport { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const CountryCodePicker: React.FC<{\n\tversion: '1.0' | '2.0'
|
|
1
|
+
{"version":3,"file":"CountryCodePicker.js","sources":["../../../../src/components/country-code-picker/CountryCodePicker.tsx"],"sourcesContent":["import { Placement, PositioningStrategy } from '@popperjs/core';\nimport DownIcon from '@src/assets/icons/chevronDown.svg';\nimport React, { useEffect, useState } from 'react';\nimport {\n\tCountriesData,\n\tCountryCode,\n} from '@src/components/country-code-picker/CountryCodePicker.modal';\nimport {\n\tStyledCountryPickerOption,\n\tStyledCountryPickerWrapper,\n} from '@src/components/country-code-picker/CountryCodePicker.styled';\nimport { DropdownPopover } from '@src/components/dropdown';\nimport { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const CountryCodePicker: React.FC<{\n\tversion: '1.0' | '2.0';\n\tonCountrySelect: (country: CountryCode) => void;\n\tselectedCountry: CountryCode;\n\tpopoverWidth?: string;\n\theight?: string;\n\tplacement?: Placement;\n\tplacementStrategy?: PositioningStrategy;\n\tdisabled?: boolean;\n\thideFlagImage?: boolean;\n\tcontainerStyles?: React.CSSProperties;\n\tcodeColor?: string;\n\tdialColor?: string;\n\tcountryTextStyle?: React.CSSProperties;\n\tonDropdownClick?: () => void;\n}> = (props) => {\n\tconst [selectedCountry, setSelectedCountry] = useState<{\n\t\tname: string;\n\t\tdial: string;\n\t\tcode: string;\n\t}>(\n\t\tprops.selectedCountry ?? {\n\t\t\tname: 'India',\n\t\t\tdial: '+91',\n\t\t\tcode: 'IN',\n\t\t},\n\t);\n\tconst selectedFlag = `https://flagcdn.com/${selectedCountry.code?.toLowerCase()}.svg`;\n\n\tuseEffect(() => {\n\t\tif (props.selectedCountry) {\n\t\t\tsetSelectedCountry(props.selectedCountry);\n\t\t}\n\t}, [props.selectedCountry?.code]);\n\n\tconst getCountryOptions = (): DropdownOption[] => {\n\t\treturn CountriesData.map((country) => {\n\t\t\tconst flag = `https://flagcdn.com/${country.code?.toLowerCase()}.svg`;\n\t\t\treturn {\n\t\t\t\tvalue: country.code,\n\t\t\t\tlabel: country.dial,\n\t\t\t\tsearchKey: country.name,\n\t\t\t\tcustomComponent: (\n\t\t\t\t\t<StyledCountryPickerOption>\n\t\t\t\t\t\t{!props.hideFlagImage && (\n\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\tsrc={flag}\n\t\t\t\t\t\t\t\tclassName=\"country-flag__option\"\n\t\t\t\t\t\t\t\talt={country.name}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<BodySecondary style={props.countryTextStyle ?? {}}>\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: props.codeColor ?? COLORS.text.primary,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{country.code}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t{' '}\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: props.dialColor ?? COLORS.text.primary,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{country.dial}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</StyledCountryPickerOption>\n\t\t\t\t),\n\t\t\t\tselected: selectedCountry.code === country.code,\n\t\t\t};\n\t\t});\n\t};\n\n\treturn (\n\t\t<DropdownPopover\n\t\t\tversion={props.version}\n\t\t\tisSearchable\n\t\t\twidth={props.popoverWidth ?? '200px'}\n\t\t\tplacement={props.placement ?? 'bottom-start'}\n\t\t\tstrategy={props.placementStrategy ?? 'absolute'}\n\t\t\toptions={getCountryOptions()}\n\t\t\tdisabled={props.disabled}\n\t\t\tonSelect={(option) => {\n\t\t\t\tconst matchingOption = CountriesData.filter(\n\t\t\t\t\t(country) => country.code === (option as SingleOption).value,\n\t\t\t\t);\n\t\t\t\tsetSelectedCountry(matchingOption[0]);\n\t\t\t\tprops.onCountrySelect(matchingOption[0]);\n\t\t\t}}\n\t\t>\n\t\t\t<StyledCountryPickerWrapper\n\t\t\t\theight={props.height}\n\t\t\t\tstyle={props.containerStyles}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tconsole.log('hello');\n\t\t\t\t\tprops.onDropdownClick?.();\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div className=\"content__wrapper\">\n\t\t\t\t\t{!props.hideFlagImage && (\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tsrc={selectedFlag}\n\t\t\t\t\t\t\tclassName=\"country-flag__selected-option\"\n\t\t\t\t\t\t\talt={selectedCountry.name}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t<BodySecondary style={props.countryTextStyle ?? {}}>\n\t\t\t\t\t\t{selectedCountry.dial}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</div>\n\t\t\t\t<DownIcon width={24} height={24} color={COLORS.content.primary} />\n\t\t\t</StyledCountryPickerWrapper>\n\t\t</DropdownPopover>\n\t);\n};\n"],"names":["props","selectedCountry","setSelectedCountry","useState","_a","name","dial","code","selectedFlag","_b","toLowerCase","useEffect","_c","_jsx","DropdownPopover","Object","assign","version","isSearchable","width","_d","popoverWidth","placement","_e","strategy","_f","placementStrategy","options","CountriesData","map","country","flag","value","label","searchKey","customComponent","_jsxs","jsxs","StyledCountryPickerOption","children","hideFlagImage","src","className","alt","BodySecondary","style","countryTextStyle","jsx","color","codeColor","COLORS","text","primary","dialColor","selected","disabled","onSelect","option","matchingOption","filter","onCountrySelect","StyledCountryPickerWrapper","height","containerStyles","onClick","console","log","onDropdownClick","call","_g","DownIcon","content"],"mappings":"qwCA+BMA,sBACL,MAAOC,EAAiBC,GAAsBC,EAAAA,SAKpB,QAAzBC,EAAAJ,EAAMC,uBAAmB,IAAAG,EAAAA,EAAA,CACxBC,KAAM,QACNC,KAAM,MACNC,KAAM,OAGFC,EAAe,uBAA6C,QAAtBC,EAAAR,EAAgBM,YAAM,IAAAE,OAAA,EAAAA,EAAAC,oBAElEC,EAAAA,WAAU,KACLX,EAAMC,iBACTC,EAAmBF,EAAMC,gBACzB,GACC,CAAwB,QAAvBW,EAAAZ,EAAMC,uBAAiB,IAAAW,OAAA,EAAAA,EAAAL,OA2C3B,OACCM,MAACC,EAAAA,gBACAC,OAAAC,OAAA,CAAAC,QAASjB,EAAMiB,QACfC,cAAY,EACZC,MAAyB,QAAlBC,EAAApB,EAAMqB,oBAAY,IAAAD,EAAAA,EAAI,QAC7BE,kBAAWC,EAAAvB,EAAMsB,yBAAa,eAC9BE,SAAqC,QAA3BC,EAAAzB,EAAM0B,yBAAqB,IAAAD,EAAAA,EAAA,WACrCE,QA/CMC,EAAaA,cAACC,KAAKC,gBACzB,MAAMC,EAAO,uBAAqC,QAAd3B,EAAA0B,EAAQvB,YAAM,IAAAH,OAAA,EAAAA,EAAAM,oBAClD,MAAO,CACNsB,MAAOF,EAAQvB,KACf0B,MAAOH,EAAQxB,KACf4B,UAAWJ,EAAQzB,KACnB8B,gBACCC,EAAAC,KAACC,4BACC,CAAAC,SAAA,EAACvC,EAAMwC,eACP3B,EAAAA,IAAA,MAAA,CACC4B,IAAKV,EACLW,UAAU,uBACVC,IAAKb,EAAQzB,OAIf+B,EAAAC,KAACO,gBAAc7B,OAAAC,OAAA,CAAA6B,MAA6B,QAAtBpC,EAAAT,EAAM8C,wBAAgB,IAAArC,EAAAA,EAAI,IAC/C,CAAA8B,SAAA,CAAA1B,EAAAkC,IAAA,OAAAhC,OAAAC,OAAA,CACC6B,MAAO,CACNG,cAAOpC,EAAAZ,EAAMiD,yBAAaC,EAAMA,OAACC,KAAKC,UAGtC,CAAAb,SAAAT,EAAQvB,QAET,KACDM,EAAAA,IACC,OAAAE,OAAAC,OAAA,CAAA6B,MAAO,CACNG,cAAO5B,EAAApB,EAAMqD,yBAAaH,EAAMA,OAACC,KAAKC,UACtC,CAAAb,SAEAT,EAAQxB,eAKbgD,SAAUrD,EAAgBM,OAASuB,EAAQvB,KAC3C,IAYDgD,SAAUvD,EAAMuD,SAChBC,SAAWC,IACV,MAAMC,EAAiB9B,EAAaA,cAAC+B,QACnC7B,GAAYA,EAAQvB,OAAUkD,EAAwBzB,QAExD9B,EAAmBwD,EAAe,IAClC1D,EAAM4D,gBAAgBF,EAAe,GAAG,aAGzCtB,EAACC,KAAAwB,4CACAC,OAAQ9D,EAAM8D,OACdjB,MAAO7C,EAAM+D,gBACbC,QAASA,WACRC,QAAQC,IAAI,SACS,QAArB9D,EAAAJ,EAAMmE,uBAAe,IAAA/D,GAAAA,EAAAgE,KAAApE,EAAI,GAG1B,CAAAuC,SAAA,CAAAH,EAAAC,KAAA,MAAAtB,OAAAC,OAAA,CAAK0B,UAAU,oBACb,CAAAH,SAAA,EAACvC,EAAMwC,eACP3B,EAAAA,IAAA,MAAA,CACC4B,IAAKjC,EACLkC,UAAU,gCACVC,IAAK1C,EAAgBI,OAGvBQ,EAACkC,IAAAH,+BAAcC,MAAiC,QAA1BwB,EAAArE,EAAM8C,wBAAoB,IAAAuB,EAAAA,EAAA,CAAA,aAC9CpE,EAAgBK,YAGnBO,EAACkC,IAAAuB,WAASnD,MAAO,GAAI2C,OAAQ,GAAId,MAAOE,EAAAA,OAAOqB,QAAQnB,gBAEvC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CountryPicker.js","sources":["../../../../src/components/country-code-picker/CountryPicker.tsx"],"sourcesContent":["import { Placement, PositioningStrategy } from '@popperjs/core';\nimport DownIcon from '@src/assets/icons/chevronDown.svg';\nimport React, { useMemo, useState } from 'react';\nimport {\n\tCountriesData,\n\tCountryCode,\n} from '@src/components/country-code-picker/CountryCodePicker.modal';\nimport {\n\tStyledCountryOption,\n\tStyledCountryPickerContainer,\n} from '@src/components/country-code-picker/CountryPicker.styled';\nimport { DropdownPopover } from '@src/components/dropdown';\nimport { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\n/**\n * Props for the CountryPicker component\n */\nexport interface CountryPickerProps {\n\t/**\n\t * Version of the dropdown popover to use\n\t */\n\tversion: '1.0' | '2.0'
|
|
1
|
+
{"version":3,"file":"CountryPicker.js","sources":["../../../../src/components/country-code-picker/CountryPicker.tsx"],"sourcesContent":["import { Placement, PositioningStrategy } from '@popperjs/core';\nimport DownIcon from '@src/assets/icons/chevronDown.svg';\nimport React, { useMemo, useState } from 'react';\nimport {\n\tCountriesData,\n\tCountryCode,\n} from '@src/components/country-code-picker/CountryCodePicker.modal';\nimport {\n\tStyledCountryOption,\n\tStyledCountryPickerContainer,\n} from '@src/components/country-code-picker/CountryPicker.styled';\nimport { DropdownPopover } from '@src/components/dropdown';\nimport { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\n/**\n * Props for the CountryPicker component\n */\nexport interface CountryPickerProps {\n\t/**\n\t * Version of the dropdown popover to use\n\t */\n\tversion: '1.0' | '2.0';\n\t/**\n\t * Callback function when a country is selected\n\t */\n\tonCountrySelect: (country: CountryCode) => void;\n\t/**\n\t * Currently selected country\n\t */\n\tselectedCountry?: CountryCode;\n\t/**\n\t * Width of the popover dropdown\n\t * @default \"300px\"\n\t */\n\tpopoverWidth?: string;\n\t/**\n\t * Height of the picker container\n\t */\n\theight?: string;\n\t/**\n\t * Placement of the dropdown relative to the trigger\n\t * @default \"bottom-start\"\n\t */\n\tplacement?: Placement;\n\t/**\n\t * Positioning strategy for the dropdown\n\t * @default \"absolute\"\n\t */\n\tplacementStrategy?: PositioningStrategy;\n\t/**\n\t * Whether the picker is disabled\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Whether to hide the flag image\n\t * @default false\n\t */\n\thideFlagImage?: boolean;\n\t/**\n\t * Custom styles for the container\n\t */\n\tcontainerStyles?: React.CSSProperties;\n\t/**\n\t * Placeholder text when no country is selected\n\t * @default \"Select a country\"\n\t */\n\tplaceholder?: string;\n\t/**\n\t * Whether to show country code alongside name\n\t * @default true\n\t */\n\tshowCountryCode?: boolean;\n\t/**\n\t * Custom text style for the country name\n\t */\n\tcountryTextStyle?: React.CSSProperties;\n\t/**\n\t * Callback when dropdown is clicked\n\t */\n\tonDropdownClick?: () => void;\n}\n\nexport const CountryPicker: React.FC<CountryPickerProps> = ({\n\tversion,\n\tonCountrySelect,\n\tselectedCountry,\n\tpopoverWidth = '300px',\n\theight,\n\tplacement = 'bottom-start',\n\tplacementStrategy = 'absolute',\n\tdisabled = false,\n\thideFlagImage = false,\n\tcontainerStyles,\n\tplaceholder = 'Select a country',\n\tshowCountryCode = true,\n\tcountryTextStyle,\n\tonDropdownClick,\n}) => {\n\tconst [internalSelectedCountry, setInternalSelectedCountry] = useState<\n\t\tCountryCode | undefined\n\t>(selectedCountry);\n\n\t// Derive the current selected country (controlled vs uncontrolled)\n\tconst currentCountry = selectedCountry ?? internalSelectedCountry;\n\n\tconst selectedFlag = currentCountry\n\t\t? `https://flagcdn.com/${currentCountry.code?.toLowerCase()}.svg`\n\t\t: undefined;\n\n\tconst getCountryOptions = useMemo((): DropdownOption[] => {\n\t\treturn CountriesData.map((country) => {\n\t\t\tconst flag = `https://flagcdn.com/${country.code?.toLowerCase()}.svg`;\n\t\t\treturn {\n\t\t\t\tvalue: country.code,\n\t\t\t\tlabel: country.name,\n\t\t\t\tsearchKey: country.name,\n\t\t\t\tcustomComponent: (\n\t\t\t\t\t<StyledCountryOption>\n\t\t\t\t\t\t{!hideFlagImage && (\n\t\t\t\t\t\t\t<img src={flag} className=\"country-flag\" alt={country.name} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<div className=\"country-info\">\n\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t...countryTextStyle,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{country.name}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t{showCountryCode && (\n\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.secondary,\n\t\t\t\t\t\t\t\t\t\tfontSize: '12px',\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{country.code}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</StyledCountryOption>\n\t\t\t\t),\n\t\t\t\tselected: currentCountry?.code === country.code,\n\t\t\t};\n\t\t});\n\t}, [currentCountry?.code, hideFlagImage, showCountryCode, countryTextStyle]);\n\n\tconst handleCountrySelect = (option: SingleOption) => {\n\t\tconst matchingCountry = CountriesData.find(\n\t\t\t(country) => country.code === option.value,\n\t\t);\n\t\tif (matchingCountry) {\n\t\t\t// Only update internal state if in uncontrolled mode\n\t\t\tif (selectedCountry === undefined) {\n\t\t\t\tsetInternalSelectedCountry(matchingCountry);\n\t\t\t}\n\t\t\tonCountrySelect(matchingCountry);\n\t\t}\n\t};\n\n\treturn (\n\t\t<DropdownPopover\n\t\t\tversion={version}\n\t\t\tisSearchable\n\t\t\twidth={popoverWidth}\n\t\t\tplacement={placement}\n\t\t\tstrategy={placementStrategy}\n\t\t\toptions={getCountryOptions}\n\t\t\tdisabled={disabled}\n\t\t\tonSelect={(option) => handleCountrySelect(option as SingleOption)}\n\t\t>\n\t\t\t<StyledCountryPickerContainer\n\t\t\t\theight={height}\n\t\t\t\tstyle={containerStyles}\n\t\t\t\tonClick={onDropdownClick}\n\t\t\t\tdisabled={disabled}\n\t\t\t>\n\t\t\t\t<div className=\"content__wrapper\">\n\t\t\t\t\t{currentCountry ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{!hideFlagImage && selectedFlag && (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\tsrc={selectedFlag}\n\t\t\t\t\t\t\t\t\tclassName=\"country-flag\"\n\t\t\t\t\t\t\t\t\talt={currentCountry.name}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<BodySecondary style={countryTextStyle}>\n\t\t\t\t\t\t\t\t{currentCountry.name}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.text.disabled,\n\t\t\t\t\t\t\t\t...countryTextStyle,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{placeholder}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<DownIcon\n\t\t\t\t\twidth={24}\n\t\t\t\t\theight={24}\n\t\t\t\t\tcolor={disabled ? COLORS.text.disabled : COLORS.content.primary}\n\t\t\t\t/>\n\t\t\t</StyledCountryPickerContainer>\n\t\t</DropdownPopover>\n\t);\n};\n"],"names":["_ref","version","onCountrySelect","selectedCountry","popoverWidth","height","placement","placementStrategy","disabled","hideFlagImage","containerStyles","placeholder","showCountryCode","countryTextStyle","onDropdownClick","internalSelectedCountry","setInternalSelectedCountry","useState","currentCountry","selectedFlag","_a","code","toLowerCase","undefined","getCountryOptions","useMemo","CountriesData","map","country","flag","value","label","name","searchKey","customComponent","_jsxs","jsxs","StyledCountryOption","children","_jsx","src","className","alt","Object","assign","jsx","BodySecondary","style","color","COLORS","text","primary","secondary","fontSize","selected","DropdownPopover","isSearchable","width","strategy","options","onSelect","option","matchingCountry","find","handleCountrySelect","StyledCountryPickerContainer","onClick","_Fragment","DownIcon","content"],"mappings":"6vCAqF2DA,IAetD,IAfuDC,QAC3DA,EAAOC,gBACPA,EAAeC,gBACfA,EAAeC,aACfA,EAAe,QAAOC,OACtBA,EAAMC,UACNA,EAAY,eAAcC,kBAC1BA,EAAoB,WAAUC,SAC9BA,GAAW,EAAKC,cAChBA,GAAgB,EAAKC,gBACrBA,EAAeC,YACfA,EAAc,mBAAkBC,gBAChCA,GAAkB,EAAIC,iBACtBA,EAAgBC,gBAChBA,GACAd,QACA,MAAOe,EAAyBC,GAA8BC,EAAQA,SAEpEd,GAGIe,EAAiBf,QAAAA,EAAmBY,EAEpCI,EAAeD,yBACwB,QAAnBE,EAAAF,EAAeG,YAAI,IAAAD,OAAA,EAAAA,EAAEE,yBAC5CC,EAEGC,EAAoBC,EAAAA,SAAQ,IAC1BC,EAAaA,cAACC,KAAKC,UACzB,MAAMC,EAAO,uBAAqC,QAAdT,EAAAQ,EAAQP,YAAM,IAAAD,OAAA,EAAAA,EAAAE,oBAClD,MAAO,CACNQ,MAAOF,EAAQP,KACfU,MAAOH,EAAQI,KACfC,UAAWL,EAAQI,KACnBE,gBACCC,EAAAC,KAACC,sBAAmB,CAAAC,SAAA,EACjB7B,GACD8B,EAAAA,IAAK,MAAA,CAAAC,IAAKX,EAAMY,UAAU,eAAeC,IAAKd,EAAQI,OAEvDG,EAAAC,KAAA,MAAAO,OAAAC,OAAA,CAAKH,UAAU,gBACd,CAAAH,SAAA,CAAAC,EAAAM,IAACC,gBAAaH,OAAAC,OAAA,CACbG,MAAKJ,OAAAC,OAAA,CACJI,MAAOC,EAAAA,OAAOC,KAAKC,SAChBtC,IAAgB,CAAAyB,SAGnBV,EAAQI,QAETpB,GACA2B,EAAAA,IAACO,EAAAA,cACAH,OAAAC,OAAA,CAAAG,MAAO,CACNC,MAAOC,EAAAA,OAAOC,KAAKE,UACnBC,SAAU,SACV,CAAAf,SAEAV,EAAQP,eAMdiC,UAAUpC,aAAc,EAAdA,EAAgBG,QAASO,EAAQP,KAC3C,KAEA,CAACH,eAAAA,EAAgBG,KAAMZ,EAAeG,EAAiBC,IAe1D,OACC0B,MAACgB,EAAAA,gBACAZ,OAAAC,OAAA,CAAA3C,QAASA,EACTuD,cAAY,EACZC,MAAOrD,EACPE,UAAWA,EACXoD,SAAUnD,EACVoD,QAASnC,EACThB,SAAUA,EACVoD,SAAWC,GAtBgBA,KAC5B,MAAMC,EAAkBpC,EAAaA,cAACqC,MACpCnC,GAAYA,EAAQP,OAASwC,EAAO/B,QAElCgC,SAEqBvC,IAApBpB,GACHa,EAA2B8C,GAE5B5D,EAAgB4D,GAChB,EAYsBE,CAAoBH,IAAuB,CAAAvB,SAEjEH,OAAC8B,+BAA4BtB,OAAAC,OAAA,CAC5BvC,OAAQA,EACR0C,MAAOrC,EACPwD,QAASpD,EACTN,SAAUA,GAAQ,CAAA8B,SAAA,CAElBC,EAAKM,IAAA,MAAAF,OAAAC,OAAA,CAAAH,UAAU,oBAAkB,CAAAH,SAC/BpB,EACAiB,EAAAC,KAAA+B,WAAA,CAAA7B,SAAA,EACG7B,GAAiBU,GAClBoB,EAAAA,IACC,MAAA,CAAAC,IAAKrB,EACLsB,UAAU,eACVC,IAAKxB,EAAec,OAGtBO,MAACO,gBAAaH,OAAAC,OAAA,CAACG,MAAOlC,aACpBK,EAAec,WAIlBO,EAACM,IAAAC,gBACAH,OAAAC,OAAA,CAAAG,qBACCC,MAAOC,EAAAA,OAAOC,KAAK1C,UAChBK,IAAgB,CAAAyB,SAGnB3B,QAIJ4B,MAAC6B,UAAQ,CACRX,MAAO,GACPpD,OAAQ,GACR2C,MAAOxC,EAAWyC,SAAOC,KAAK1C,SAAWyC,EAAAA,OAAOoB,QAAQlB,gBAGzC"}
|