@sapudex/web-components 0.114.2 → 0.127.6
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/bundle.esm.js +6 -0
- package/config/wdio.conf.js +19 -8
- package/dist/AccordionItem.d.ts +2 -1
- package/dist/AccordionItem.js +3 -3
- package/dist/AccordionItem.js.map +1 -1
- package/dist/Avatar.d.ts +20 -1
- package/dist/Avatar.js +26 -2
- package/dist/Avatar.js.map +1 -1
- package/dist/AvatarGroup.d.ts +28 -0
- package/dist/AvatarGroup.js +126 -0
- package/dist/AvatarGroup.js.map +1 -0
- package/dist/CountrySelector.d.ts +1 -0
- package/dist/CountrySelector.js +3 -0
- package/dist/CountrySelector.js.map +1 -1
- package/dist/Dropdown.d.ts +11 -1
- package/dist/Dropdown.js +15 -3
- package/dist/Dropdown.js.map +1 -1
- package/dist/FilterMenu.d.ts +21 -5
- package/dist/FilterMenu.js +50 -8
- package/dist/FilterMenu.js.map +1 -1
- package/dist/Footer.d.ts +27 -0
- package/dist/Footer.js +27 -36
- package/dist/Footer.js.map +1 -1
- package/dist/HeroBanner.js +3 -0
- package/dist/HeroBanner.js.map +1 -1
- package/dist/InputGroup.js.map +1 -1
- package/dist/List.d.ts +7 -0
- package/dist/List.js +78 -18
- package/dist/List.js.map +1 -1
- package/dist/ListItem.d.ts +0 -1
- package/dist/ListItem.js +0 -6
- package/dist/ListItem.js.map +1 -1
- package/dist/ListItemBase.d.ts +3 -0
- package/dist/ListItemBase.js +12 -0
- package/dist/ListItemBase.js.map +1 -1
- package/dist/MastheadItem.d.ts +1 -0
- package/dist/MastheadItem.js +5 -11
- package/dist/MastheadItem.js.map +1 -1
- package/dist/MastheadShell.d.ts +8 -0
- package/dist/MastheadShell.js +10 -0
- package/dist/MastheadShell.js.map +1 -1
- package/dist/MessageStrip.js +1 -1
- package/dist/MessageStrip.js.map +1 -1
- package/dist/Pagination.d.ts +3 -0
- package/dist/Pagination.js +16 -4
- package/dist/Pagination.js.map +1 -1
- package/dist/PasswordField.d.ts +14 -4
- package/dist/PasswordField.js +24 -15
- package/dist/PasswordField.js.map +1 -1
- package/dist/PhoneNumberField.d.ts +6 -0
- package/dist/PhoneNumberField.js +6 -1
- package/dist/PhoneNumberField.js.map +1 -1
- package/dist/RatingBar.d.ts +53 -0
- package/dist/RatingBar.js +96 -0
- package/dist/RatingBar.js.map +1 -0
- package/dist/Review.d.ts +71 -0
- package/dist/Review.js +108 -0
- package/dist/Review.js.map +1 -0
- package/dist/Search.d.ts +51 -0
- package/dist/Search.js +65 -11
- package/dist/Search.js.map +1 -1
- package/dist/SearchableListBase.d.ts +1 -1
- package/dist/SearchableListBase.js +1 -1
- package/dist/SearchableListBase.js.map +1 -1
- package/dist/SecondaryNavigation.d.ts +35 -47
- package/dist/SecondaryNavigation.js +158 -167
- package/dist/SecondaryNavigation.js.map +1 -1
- package/dist/SecondaryNavigationItem.d.ts +101 -0
- package/dist/SecondaryNavigationItem.js +297 -0
- package/dist/SecondaryNavigationItem.js.map +1 -0
- package/dist/SecondaryNavigationItemBase.d.ts +82 -0
- package/dist/SecondaryNavigationItemBase.js +104 -0
- package/dist/SecondaryNavigationItemBase.js.map +1 -0
- package/dist/SecondaryNavigationSubItem.d.ts +53 -0
- package/dist/SecondaryNavigationSubItem.js +105 -0
- package/dist/SecondaryNavigationSubItem.js.map +1 -0
- package/dist/SelectBox.d.ts +1 -0
- package/dist/SelectBox.js +15 -1
- package/dist/SelectBox.js.map +1 -1
- package/dist/StatusBadge.d.ts +67 -0
- package/dist/StatusBadge.js +104 -0
- package/dist/StatusBadge.js.map +1 -0
- package/dist/Switch.d.ts +1 -0
- package/dist/Switch.js +3 -0
- package/dist/Switch.js.map +1 -1
- package/dist/Tab.d.ts +8 -0
- package/dist/Tab.js +4 -1
- package/dist/Tab.js.map +1 -1
- package/dist/TabNavigation.d.ts +20 -20
- package/dist/TabNavigation.js +82 -101
- package/dist/TabNavigation.js.map +1 -1
- package/dist/Tag.d.ts +13 -6
- package/dist/Tag.js +34 -20
- package/dist/Tag.js.map +1 -1
- package/dist/TextArea.d.ts +1 -1
- package/dist/TextArea.js +3 -0
- package/dist/TextArea.js.map +1 -1
- package/dist/TextField.d.ts +9 -0
- package/dist/TextField.js +16 -0
- package/dist/TextField.js.map +1 -1
- package/dist/Tooltip.d.ts +2 -2
- package/dist/Tooltip.js +3 -3
- package/dist/Tooltip.js.map +1 -1
- package/dist/assets/bundle.esm-7d53f4f2.js +314 -0
- package/dist/assets/messagebundle_en-6dcc9ab4.js +1 -0
- package/dist/assets/parameters-bundle.css-de55cf62.js +2 -0
- package/dist/css/themes/AccordionItem.css +1 -1
- package/dist/css/themes/Avatar.css +1 -1
- package/dist/css/themes/Badge.css +1 -1
- package/dist/css/themes/Checkbox.css +1 -1
- package/dist/css/themes/CountrySelector.css +1 -1
- package/dist/css/themes/Divider.css +1 -1
- package/dist/css/themes/Dropdown.css +1 -1
- package/dist/css/themes/FilterMenu.css +1 -1
- package/dist/css/themes/Footer.css +1 -1
- package/dist/css/themes/HeroBanner.css +1 -1
- package/dist/css/themes/MastheadShell.css +1 -1
- package/dist/css/themes/MediaPlayer.css +1 -1
- package/dist/css/themes/Modal.css +1 -1
- package/dist/css/themes/Pagination.css +1 -1
- package/dist/css/themes/PhoneNumberField.css +1 -1
- package/dist/css/themes/RatingBar.css +1 -0
- package/dist/css/themes/RatingIndicator.css +1 -1
- package/dist/css/themes/Review.css +1 -0
- package/dist/css/themes/Search.css +1 -1
- package/dist/css/themes/SecondaryNavigation.css +1 -1
- package/dist/css/themes/SecondaryNavigationItem.css +1 -0
- package/dist/css/themes/SecondaryNavigationSubItem.css +1 -0
- package/dist/css/themes/SelectBox.css +1 -1
- package/dist/css/themes/Slider.css +1 -1
- package/dist/css/themes/StatusBadge.css +1 -0
- package/dist/css/themes/StepInput.css +1 -1
- package/dist/css/themes/TabNavigation.css +1 -1
- package/dist/css/themes/Tag.css +1 -1
- package/dist/css/themes/TextField.css +1 -1
- package/dist/css/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css +1 -1
- package/dist/custom-elements-internal.json +1291 -119
- package/dist/custom-elements.json +1298 -199
- package/dist/data/CountryListISO3166.js +162 -162
- package/dist/data/CountryListISO3166.js.map +1 -1
- package/dist/generated/assets/i18n/messagebundle_en.json +1 -1
- package/dist/generated/assets/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.json +1 -1
- package/dist/generated/i18n/i18n-defaults.d.ts +16 -1
- package/dist/generated/i18n/i18n-defaults.js +20 -5
- package/dist/generated/i18n/i18n-defaults.js.map +1 -1
- package/dist/generated/templates/AccordionItemTemplate.lit.js +1 -1
- package/dist/generated/templates/AccordionItemTemplate.lit.js.map +1 -1
- package/dist/generated/templates/CountrySelectorTemplate.lit.js +1 -1
- package/dist/generated/templates/CountrySelectorTemplate.lit.js.map +1 -1
- package/dist/generated/templates/DatePickerTemplate.lit.js +1 -1
- package/dist/generated/templates/DatePickerTemplate.lit.js.map +1 -1
- package/dist/generated/templates/DropdownTemplate.lit.js +2 -2
- package/dist/generated/templates/DropdownTemplate.lit.js.map +1 -1
- package/dist/generated/templates/FilterMenuTemplate.lit.js +3 -3
- package/dist/generated/templates/FilterMenuTemplate.lit.js.map +1 -1
- package/dist/generated/templates/FooterTemplate.lit.js +26 -28
- package/dist/generated/templates/FooterTemplate.lit.js.map +1 -1
- package/dist/generated/templates/HeroBannerTemplate.lit.js +9 -8
- package/dist/generated/templates/HeroBannerTemplate.lit.js.map +1 -1
- package/dist/generated/templates/ListGroupHeaderTemplate.lit.js +4 -4
- package/dist/generated/templates/ListGroupHeaderTemplate.lit.js.map +1 -1
- package/dist/generated/templates/ListItemTemplate.lit.js +1 -1
- package/dist/generated/templates/ListItemTemplate.lit.js.map +1 -1
- package/dist/generated/templates/ListSelectAllTemplate.lit.js +1 -1
- package/dist/generated/templates/ListSelectAllTemplate.lit.js.map +1 -1
- package/dist/generated/templates/MastheadItemTemplate.lit.js +3 -3
- package/dist/generated/templates/MastheadItemTemplate.lit.js.map +1 -1
- package/dist/generated/templates/MastheadShellTemplate.lit.js +2 -2
- package/dist/generated/templates/MastheadShellTemplate.lit.js.map +1 -1
- package/dist/generated/templates/PaginationTemplate.lit.js +1 -1
- package/dist/generated/templates/PaginationTemplate.lit.js.map +1 -1
- package/dist/generated/templates/PasswordFieldTemplate.lit.js +1 -2
- package/dist/generated/templates/PasswordFieldTemplate.lit.js.map +1 -1
- package/dist/generated/templates/PhoneNumberFieldTemplate.lit.js +3 -3
- package/dist/generated/templates/PhoneNumberFieldTemplate.lit.js.map +1 -1
- package/dist/generated/templates/RatingBarTemplate.lit.d.ts +4 -0
- package/dist/generated/templates/RatingBarTemplate.lit.js +6 -0
- package/dist/generated/templates/RatingBarTemplate.lit.js.map +1 -0
- package/dist/generated/templates/ReviewTemplate.lit.d.ts +4 -0
- package/dist/generated/templates/ReviewTemplate.lit.js +10 -0
- package/dist/generated/templates/ReviewTemplate.lit.js.map +1 -0
- package/dist/generated/templates/SearchSuggestionsTemplate.lit.js +1 -1
- package/dist/generated/templates/SearchSuggestionsTemplate.lit.js.map +1 -1
- package/dist/generated/templates/SearchTemplate.lit.js +7 -7
- package/dist/generated/templates/SearchTemplate.lit.js.map +1 -1
- package/dist/generated/templates/SearchableListBaseTemplate.lit.js +2 -2
- package/dist/generated/templates/SearchableListBaseTemplate.lit.js.map +1 -1
- package/dist/generated/templates/SecondaryNavigationItemTemplate.lit.d.ts +4 -0
- package/dist/generated/templates/SecondaryNavigationItemTemplate.lit.js +11 -0
- package/dist/generated/templates/SecondaryNavigationItemTemplate.lit.js.map +1 -0
- package/dist/generated/templates/SecondaryNavigationSubItemTemplate.lit.d.ts +4 -0
- package/dist/generated/templates/SecondaryNavigationSubItemTemplate.lit.js +10 -0
- package/dist/generated/templates/SecondaryNavigationSubItemTemplate.lit.js.map +1 -0
- package/dist/generated/templates/SecondaryNavigationTemplate.lit.js +7 -10
- package/dist/generated/templates/SecondaryNavigationTemplate.lit.js.map +1 -1
- package/dist/generated/templates/SelectBoxTemplate.lit.js +2 -2
- package/dist/generated/templates/SelectBoxTemplate.lit.js.map +1 -1
- package/dist/generated/templates/StatusBadgeTemplate.lit.d.ts +4 -0
- package/dist/generated/templates/StatusBadgeTemplate.lit.js +5 -0
- package/dist/generated/templates/StatusBadgeTemplate.lit.js.map +1 -0
- package/dist/generated/templates/SwitchTemplate.lit.js +2 -2
- package/dist/generated/templates/SwitchTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TabInOverflowTemplate.lit.js +2 -2
- package/dist/generated/templates/TabInOverflowTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TabNavigationPopoverTemplate.lit.js +1 -1
- package/dist/generated/templates/TabNavigationPopoverTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TabNavigationTemplate.lit.js +2 -2
- package/dist/generated/templates/TabNavigationTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TagTemplate.lit.js +9 -3
- package/dist/generated/templates/TagTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TextAreaTemplate.lit.js +1 -1
- package/dist/generated/templates/TextAreaTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TextFieldTemplate.lit.js +2 -2
- package/dist/generated/templates/TextFieldTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TooltipTemplate.lit.js +1 -1
- package/dist/generated/templates/TooltipTemplate.lit.js.map +1 -1
- package/dist/generated/themes/AccordionItem.css.js +1 -1
- package/dist/generated/themes/AccordionItem.css.js.map +1 -1
- package/dist/generated/themes/Avatar.css.js +1 -1
- package/dist/generated/themes/Avatar.css.js.map +1 -1
- package/dist/generated/themes/Badge.css.js +1 -1
- package/dist/generated/themes/Badge.css.js.map +1 -1
- package/dist/generated/themes/Checkbox.css.js +1 -1
- package/dist/generated/themes/Checkbox.css.js.map +1 -1
- package/dist/generated/themes/CountrySelector.css.js +1 -1
- package/dist/generated/themes/CountrySelector.css.js.map +1 -1
- package/dist/generated/themes/Divider.css.js +1 -1
- package/dist/generated/themes/Divider.css.js.map +1 -1
- package/dist/generated/themes/Dropdown.css.js +1 -1
- package/dist/generated/themes/Dropdown.css.js.map +1 -1
- package/dist/generated/themes/FilterMenu.css.js +1 -1
- package/dist/generated/themes/FilterMenu.css.js.map +1 -1
- package/dist/generated/themes/Footer.css.js +1 -1
- package/dist/generated/themes/Footer.css.js.map +1 -1
- package/dist/generated/themes/HeroBanner.css.js +1 -1
- package/dist/generated/themes/HeroBanner.css.js.map +1 -1
- package/dist/generated/themes/MastheadShell.css.js +1 -1
- package/dist/generated/themes/MastheadShell.css.js.map +1 -1
- package/dist/generated/themes/MediaPlayer.css.js +1 -1
- package/dist/generated/themes/MediaPlayer.css.js.map +1 -1
- package/dist/generated/themes/Modal.css.js +1 -1
- package/dist/generated/themes/Modal.css.js.map +1 -1
- package/dist/generated/themes/Pagination.css.js +1 -1
- package/dist/generated/themes/Pagination.css.js.map +1 -1
- package/dist/generated/themes/PhoneNumberField.css.js +1 -1
- package/dist/generated/themes/PhoneNumberField.css.js.map +1 -1
- package/dist/generated/themes/RatingBar.css.js +9 -0
- package/dist/generated/themes/RatingBar.css.js.map +1 -0
- package/dist/generated/themes/RatingIndicator.css.js +1 -1
- package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
- package/dist/generated/themes/Review.css.d.ts +3 -0
- package/dist/generated/themes/Review.css.js +9 -0
- package/dist/generated/themes/Review.css.js.map +1 -0
- package/dist/generated/themes/Search.css.js +1 -1
- package/dist/generated/themes/Search.css.js.map +1 -1
- package/dist/generated/themes/SecondaryNavigation.css.js +1 -1
- package/dist/generated/themes/SecondaryNavigation.css.js.map +1 -1
- package/dist/generated/themes/SecondaryNavigationItem.css.d.ts +3 -0
- package/dist/generated/themes/SecondaryNavigationItem.css.js +9 -0
- package/dist/generated/themes/SecondaryNavigationItem.css.js.map +1 -0
- package/dist/generated/themes/SecondaryNavigationSubItem.css.d.ts +3 -0
- package/dist/generated/themes/SecondaryNavigationSubItem.css.js +9 -0
- package/dist/generated/themes/SecondaryNavigationSubItem.css.js.map +1 -0
- package/dist/generated/themes/SelectBox.css.js +1 -1
- package/dist/generated/themes/SelectBox.css.js.map +1 -1
- package/dist/generated/themes/Slider.css.js +1 -1
- package/dist/generated/themes/Slider.css.js.map +1 -1
- package/dist/generated/themes/StatusBadge.css.d.ts +3 -0
- package/dist/generated/themes/StatusBadge.css.js +9 -0
- package/dist/generated/themes/StatusBadge.css.js.map +1 -0
- package/dist/generated/themes/StepInput.css.js +1 -1
- package/dist/generated/themes/StepInput.css.js.map +1 -1
- package/dist/generated/themes/TabNavigation.css.js +1 -1
- package/dist/generated/themes/TabNavigation.css.js.map +1 -1
- package/dist/generated/themes/Tag.css.js +1 -1
- package/dist/generated/themes/Tag.css.js.map +1 -1
- package/dist/generated/themes/TextField.css.js +1 -1
- package/dist/generated/themes/TextField.css.js.map +1 -1
- package/dist/generated/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.js +1 -1
- package/dist/generated/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.js.map +1 -1
- package/dist/i18n/messagebundle.properties +40 -5
- package/dist/i18n/messagebundle_en.properties +20 -5
- package/dist/vscode.html-custom-data.json +239 -16
- package/dist/web-types.json +405 -25
- package/package.json +8 -8
- package/src/AccordionItem.hbs +1 -4
- package/src/AccordionItem.ts +5 -4
- package/src/Avatar.ts +35 -3
- package/src/AvatarGroup.ts +135 -0
- package/src/CountrySelector.hbs +2 -1
- package/src/CountrySelector.ts +4 -1
- package/src/DatePicker.hbs +0 -1
- package/src/Dropdown.hbs +5 -3
- package/src/Dropdown.ts +24 -3
- package/src/FilterMenu.hbs +8 -1
- package/src/FilterMenu.ts +70 -12
- package/src/Footer.hbs +12 -37
- package/src/Footer.ts +64 -51
- package/src/HeroBanner.hbs +28 -21
- package/src/HeroBanner.ts +3 -0
- package/src/InputGroup.ts +6 -5
- package/src/List.ts +92 -21
- package/src/ListGroupHeader.hbs +9 -5
- package/src/ListItem.hbs +2 -1
- package/src/ListItem.ts +0 -7
- package/src/ListItemBase.ts +14 -0
- package/src/ListSelectAll.hbs +1 -0
- package/src/MastheadItem.hbs +3 -3
- package/src/MastheadItem.ts +10 -4
- package/src/MastheadShell.hbs +4 -0
- package/src/MastheadShell.ts +18 -0
- package/src/MessageStrip.ts +1 -1
- package/src/Pagination.hbs +4 -2
- package/src/Pagination.ts +19 -4
- package/src/PasswordField.hbs +6 -17
- package/src/PasswordField.ts +31 -23
- package/src/PhoneNumberField.hbs +8 -3
- package/src/PhoneNumberField.ts +12 -2
- package/src/RatingBar.hbs +11 -0
- package/src/RatingBar.ts +113 -0
- package/src/Review.hbs +44 -0
- package/src/Review.ts +140 -0
- package/src/Search.hbs +20 -14
- package/src/Search.ts +107 -10
- package/src/SearchSuggestions.hbs +2 -1
- package/src/SearchableListBase.hbs +2 -0
- package/src/SearchableListBase.ts +1 -1
- package/src/SecondaryNavigation.hbs +53 -71
- package/src/SecondaryNavigation.ts +192 -198
- package/src/SecondaryNavigationItem.hbs +64 -0
- package/src/SecondaryNavigationItem.ts +368 -0
- package/src/SecondaryNavigationItemBase.ts +153 -0
- package/src/SecondaryNavigationSubItem.hbs +44 -0
- package/src/SecondaryNavigationSubItem.ts +127 -0
- package/src/SelectBox.hbs +76 -76
- package/src/SelectBox.ts +18 -1
- package/src/StatusBadge.hbs +9 -0
- package/src/StatusBadge.ts +129 -0
- package/src/Switch.hbs +3 -3
- package/src/Switch.ts +4 -0
- package/src/Tab.ts +11 -1
- package/src/TabInOverflow.hbs +3 -2
- package/src/TabNavigation.hbs +12 -10
- package/src/TabNavigation.ts +92 -116
- package/src/TabNavigationPopover.hbs +1 -0
- package/src/Tag.hbs +60 -26
- package/src/Tag.ts +54 -34
- package/src/TextArea.hbs +3 -4
- package/src/TextArea.ts +3 -0
- package/src/TextField.hbs +40 -36
- package/src/TextField.ts +24 -0
- package/src/Tooltip.hbs +2 -2
- package/src/Tooltip.ts +4 -4
- package/src/data/CountryListISO3166.ts +162 -162
- package/src/generated/i18n/i18n-defaults.ts +2 -2
- package/src/generated/templates/AccordionItemTemplate.lit.ts +1 -1
- package/src/generated/templates/CountrySelectorTemplate.lit.ts +1 -1
- package/src/generated/templates/DatePickerTemplate.lit.ts +1 -1
- package/src/generated/templates/DropdownTemplate.lit.ts +2 -2
- package/src/generated/templates/FilterMenuTemplate.lit.ts +3 -3
- package/src/generated/templates/FooterTemplate.lit.ts +26 -28
- package/src/generated/templates/HeroBannerTemplate.lit.ts +9 -8
- package/src/generated/templates/ListGroupHeaderTemplate.lit.ts +4 -4
- package/src/generated/templates/ListItemTemplate.lit.ts +1 -1
- package/src/generated/templates/ListSelectAllTemplate.lit.ts +1 -1
- package/src/generated/templates/MastheadItemTemplate.lit.ts +3 -3
- package/src/generated/templates/MastheadShellTemplate.lit.ts +2 -2
- package/src/generated/templates/PaginationTemplate.lit.ts +1 -1
- package/src/generated/templates/PasswordFieldTemplate.lit.ts +1 -2
- package/src/generated/templates/PhoneNumberFieldTemplate.lit.ts +3 -3
- package/src/generated/templates/RatingBarTemplate.lit.ts +11 -0
- package/src/generated/templates/ReviewTemplate.lit.ts +15 -0
- package/src/generated/templates/SearchSuggestionsTemplate.lit.ts +1 -1
- package/src/generated/templates/SearchTemplate.lit.ts +7 -7
- package/src/generated/templates/SearchableListBaseTemplate.lit.ts +2 -2
- package/src/generated/templates/SecondaryNavigationItemTemplate.lit.ts +16 -0
- package/src/generated/templates/SecondaryNavigationSubItemTemplate.lit.ts +15 -0
- package/src/generated/templates/SecondaryNavigationTemplate.lit.ts +7 -10
- package/src/generated/templates/SelectBoxTemplate.lit.ts +2 -2
- package/src/generated/templates/StatusBadgeTemplate.lit.ts +10 -0
- package/src/generated/templates/SwitchTemplate.lit.ts +2 -2
- package/src/generated/templates/TabInOverflowTemplate.lit.ts +2 -2
- package/src/generated/templates/TabNavigationPopoverTemplate.lit.ts +1 -1
- package/src/generated/templates/TabNavigationTemplate.lit.ts +2 -2
- package/src/generated/templates/TagTemplate.lit.ts +9 -3
- package/src/generated/templates/TextAreaTemplate.lit.ts +1 -1
- package/src/generated/templates/TextFieldTemplate.lit.ts +2 -2
- package/src/generated/templates/TooltipTemplate.lit.ts +1 -1
- package/src/generated/themes/AccordionItem.css.ts +1 -1
- package/src/generated/themes/Avatar.css.ts +1 -1
- package/src/generated/themes/Badge.css.ts +1 -1
- package/src/generated/themes/Checkbox.css.ts +1 -1
- package/src/generated/themes/CountrySelector.css.ts +1 -1
- package/src/generated/themes/Divider.css.ts +1 -1
- package/src/generated/themes/Dropdown.css.ts +1 -1
- package/src/generated/themes/FilterMenu.css.ts +1 -1
- package/src/generated/themes/Footer.css.ts +1 -1
- package/src/generated/themes/HeroBanner.css.ts +1 -1
- package/src/generated/themes/MastheadShell.css.ts +1 -1
- package/src/generated/themes/MediaPlayer.css.ts +1 -1
- package/src/generated/themes/Modal.css.ts +1 -1
- package/src/generated/themes/Pagination.css.ts +1 -1
- package/src/generated/themes/PhoneNumberField.css.ts +1 -1
- package/src/generated/themes/RatingBar.css.ts +13 -0
- package/src/generated/themes/RatingIndicator.css.ts +1 -1
- package/src/generated/themes/Review.css.ts +13 -0
- package/src/generated/themes/Search.css.ts +1 -1
- package/src/generated/themes/SecondaryNavigation.css.ts +1 -1
- package/src/generated/themes/SecondaryNavigationItem.css.ts +13 -0
- package/src/generated/themes/SecondaryNavigationSubItem.css.ts +13 -0
- package/src/generated/themes/SelectBox.css.ts +1 -1
- package/src/generated/themes/Slider.css.ts +1 -1
- package/src/generated/themes/StatusBadge.css.ts +13 -0
- package/src/generated/themes/StepInput.css.ts +1 -1
- package/src/generated/themes/TabNavigation.css.ts +1 -1
- package/src/generated/themes/Tag.css.ts +1 -1
- package/src/generated/themes/TextField.css.ts +1 -1
- package/src/generated/themes/overrides/@ui5/webcomponents/sap_glow/parameters-bundle.css.ts +1 -1
- package/src/i18n/messagebundle.properties +40 -5
- package/src/i18n/messagebundle_en.properties +20 -5
- package/src/themes/AccordionItem.css +6 -4
- package/src/themes/Avatar.css +43 -6
- package/src/themes/Badge.css +1 -1
- package/src/themes/Checkbox.css +12 -0
- package/src/themes/CountrySelector.css +4 -0
- package/src/themes/Divider.css +6 -2
- package/src/themes/Dropdown.css +2 -0
- package/src/themes/FilterMenu.css +10 -0
- package/src/themes/Footer.css +93 -168
- package/src/themes/HeroBanner.css +84 -20
- package/src/themes/MastheadShell.css +25 -29
- package/src/themes/MediaPlayer.css +3 -2
- package/src/themes/Modal.css +6 -0
- package/src/themes/Pagination.css +7 -0
- package/src/themes/PhoneNumberField.css +5 -0
- package/src/themes/RatingBar.css +52 -0
- package/src/themes/Review.css +196 -0
- package/src/themes/Search.css +37 -21
- package/src/themes/SecondaryNavigation.css +64 -293
- package/src/themes/SecondaryNavigationItem.css +221 -0
- package/src/themes/SecondaryNavigationSubItem.css +118 -0
- package/src/themes/SelectBox.css +17 -24
- package/src/themes/StatusBadge.css +135 -0
- package/src/themes/StepInput.css +5 -2
- package/src/themes/TabNavigation.css +7 -1
- package/src/themes/Tag.css +180 -148
- package/src/themes/TextField.css +75 -55
- package/dist/assets/bundle.esm-ab45813e.js +0 -312
- package/dist/assets/messagebundle_en-26cd7a92.js +0 -1
- package/dist/assets/parameters-bundle.css-76ef62fa.js +0 -2
- package/dist/css/themes/PasswordField.css +0 -1
- package/dist/generated/themes/PasswordField.css.js +0 -9
- package/dist/generated/themes/PasswordField.css.js.map +0 -1
- package/src/generated/themes/PasswordField.css.ts +0 -13
- package/src/themes/PasswordField.css +0 -29
- /package/dist/generated/themes/{PasswordField.css.d.ts → RatingBar.css.d.ts} +0 -0
|
@@ -13,25 +13,17 @@ import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
|
|
|
13
13
|
import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
|
|
14
14
|
import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
|
|
15
15
|
import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
|
|
16
|
-
import UI5Icon from "@ui5/webcomponents/dist/Icon.js";
|
|
17
16
|
import Integer from "@ui5/webcomponents-base/dist/types/Integer.js";
|
|
18
|
-
import "@ui5/webcomponents-
|
|
19
|
-
import { isLeft, isRight, isUp, isDown, isEscape, } from "@ui5/webcomponents-base/dist/Keys.js";
|
|
17
|
+
import { isLeft, isRight, isEscape, } from "@ui5/webcomponents-base/dist/Keys.js";
|
|
20
18
|
import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
|
|
19
|
+
import UDExSecondaryNavigationItem from "./SecondaryNavigationItem.js";
|
|
21
20
|
import { MORE } from "./generated/i18n/i18n-defaults.js";
|
|
22
21
|
import SecondaryNavigationTemplate from "./generated/templates/SecondaryNavigationTemplate.lit.js";
|
|
23
22
|
// Styles
|
|
24
23
|
import SecondaryNavigationCss from "./generated/themes/SecondaryNavigation.css.js";
|
|
25
|
-
const
|
|
24
|
+
const canvasContentFont = "16px / 17.6px '72 Brand Variable'";
|
|
26
25
|
const rootClass = "udex-secondary-navigation__root";
|
|
27
|
-
const breakpointSizeS = 979;
|
|
28
|
-
export var Target;
|
|
29
|
-
(function (Target) {
|
|
30
|
-
Target["_blank"] = "_blank";
|
|
31
|
-
Target["_parent"] = "_parent";
|
|
32
|
-
Target["_self"] = "_self";
|
|
33
|
-
Target["_top"] = "_top";
|
|
34
|
-
})(Target || (Target = {}));
|
|
26
|
+
export const breakpointSizeS = 979;
|
|
35
27
|
/**
|
|
36
28
|
* @class
|
|
37
29
|
*
|
|
@@ -64,187 +56,189 @@ let UDExSecondaryNavigation = UDExSecondaryNavigation_1 = class UDExSecondaryNav
|
|
|
64
56
|
if (isDesktop()) {
|
|
65
57
|
this.setAttribute("desktop", "");
|
|
66
58
|
}
|
|
67
|
-
|
|
68
|
-
this.reflowItems();
|
|
69
|
-
}
|
|
70
|
-
ResizeHandler.register(this.rootHolder, this._boundReflowItems);
|
|
59
|
+
ResizeHandler.register(this, this._boundReflowItems);
|
|
71
60
|
}
|
|
72
61
|
onExitDOM() {
|
|
73
|
-
ResizeHandler.deregister(this
|
|
62
|
+
ResizeHandler.deregister(this, this._boundReflowItems);
|
|
74
63
|
}
|
|
75
64
|
onInvalidation(changeInfo) {
|
|
76
65
|
if (changeInfo.name === "navItems") {
|
|
77
|
-
this._navigationList = undefined;
|
|
78
66
|
this.reflowItems();
|
|
79
67
|
}
|
|
80
68
|
}
|
|
81
69
|
onAfterRendering() {
|
|
82
70
|
this._rootHolder = this.rootHolder;
|
|
83
|
-
this._dropdown = this.getDropdown();
|
|
84
71
|
this.handleOutsideClick();
|
|
85
72
|
}
|
|
86
73
|
refreshRendering() {
|
|
87
74
|
this._requestRender = !this._requestRender;
|
|
88
75
|
}
|
|
89
76
|
reflowItems() {
|
|
90
|
-
const availableWidth = this.rootHolder.offsetWidth - this.heading
|
|
77
|
+
const availableWidth = this.rootHolder.offsetWidth - this.heading?.offsetWidth - (this.optionalButtons?.offsetWidth || 0);
|
|
91
78
|
const moreButtonWidth = this.getMoreButtonWidth();
|
|
92
79
|
const itemsGap = 20;
|
|
93
|
-
const widths = this.
|
|
80
|
+
const widths = this.parsedItems.map(item => this.getItemWidth(item));
|
|
94
81
|
const steps = [];
|
|
95
|
-
widths
|
|
82
|
+
widths?.forEach((itemWidth, index) => {
|
|
96
83
|
steps.push((steps.at(-1) || 0) + itemWidth + (index && itemsGap));
|
|
97
84
|
});
|
|
98
85
|
if ((steps.at(-1) || 0) <= availableWidth) {
|
|
99
|
-
this.
|
|
86
|
+
this._visibleItems.splice(0, Infinity, ...this.parsedItems);
|
|
100
87
|
this._showMoreButton = false;
|
|
101
88
|
this.refreshRendering();
|
|
102
89
|
return;
|
|
103
90
|
}
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
handleKeyDown(e) {
|
|
112
|
-
e.stopPropagation();
|
|
113
|
-
this.handleLeftArrow(e);
|
|
114
|
-
this.handleRightArrow(e);
|
|
115
|
-
this.handleEscapeKey(e);
|
|
116
|
-
}
|
|
117
|
-
handleEscapeKey(e) {
|
|
118
|
-
if (isEscape(e)) {
|
|
119
|
-
if (!this.isDesktopScreen) {
|
|
120
|
-
this._rootHolder?.classList.remove(mobileMenuActiveClass);
|
|
121
|
-
this.getMobileButtonMenu().focus();
|
|
122
|
-
}
|
|
123
|
-
else {
|
|
124
|
-
this.onCloseDropdown();
|
|
125
|
-
this.getMoreButton().focus();
|
|
126
|
-
}
|
|
91
|
+
if (this.parsedItems) {
|
|
92
|
+
// @ts-ignore
|
|
93
|
+
const lastVisibleIndex = steps.findLastIndex((size) => size < (availableWidth - moreButtonWidth - itemsGap));
|
|
94
|
+
this._visibleItems.splice(0, Infinity, ...this.parsedItems.slice(0, lastVisibleIndex + 1));
|
|
95
|
+
this._overflowItems.splice(0, Infinity, ...this.parsedItems.slice(lastVisibleIndex + 1));
|
|
96
|
+
this._showMoreButton = true;
|
|
97
|
+
this.refreshRendering();
|
|
127
98
|
}
|
|
128
99
|
}
|
|
129
|
-
|
|
100
|
+
handleKeyDown(e) {
|
|
130
101
|
e.stopPropagation();
|
|
131
|
-
this.handleUpArrow(e);
|
|
132
|
-
this.handleDownArrow(e);
|
|
133
|
-
this.handleEscapeKey(e);
|
|
134
|
-
}
|
|
135
|
-
handleLeftArrow(e) {
|
|
136
102
|
if (isLeft(e)) {
|
|
137
103
|
this.focusPrevNavItem(e);
|
|
138
104
|
}
|
|
139
|
-
}
|
|
140
|
-
handleRightArrow(e) {
|
|
141
105
|
if (isRight(e)) {
|
|
142
106
|
this.focusNextNavItem(e);
|
|
143
107
|
}
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
if (isUp(e)) {
|
|
147
|
-
this.focusPrevNavItem(e);
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
handleDownArrow(e) {
|
|
151
|
-
if (isDown(e)) {
|
|
152
|
-
this.focusNextNavItem(e);
|
|
108
|
+
if (isEscape(e)) {
|
|
109
|
+
e.target.closeDropdown();
|
|
153
110
|
}
|
|
154
111
|
}
|
|
155
|
-
handleOutsideClick() {
|
|
156
|
-
document.addEventListener("click", () => {
|
|
157
|
-
if (this._dropdown) {
|
|
158
|
-
this.onCloseDropdown();
|
|
159
|
-
}
|
|
160
|
-
});
|
|
161
|
-
}
|
|
162
|
-
handleMobileOpen() {
|
|
163
|
-
this.toggleActiveClass();
|
|
164
|
-
this._mobileBtnExpanded = !this._mobileBtnExpanded;
|
|
165
|
-
}
|
|
166
|
-
handleToggleDropdown() {
|
|
167
|
-
this._dropdownMoreIsOpen = !this._dropdownMoreIsOpen;
|
|
168
|
-
}
|
|
169
|
-
toggleActiveClass() {
|
|
170
|
-
this._rootHolder?.classList.toggle(mobileMenuActiveClass);
|
|
171
|
-
}
|
|
172
112
|
focusPrevNavItem(e) {
|
|
173
|
-
const
|
|
174
|
-
const
|
|
175
|
-
const
|
|
176
|
-
const lastItemIndex = this.navigationItems.length - 1;
|
|
113
|
+
const item = e.target;
|
|
114
|
+
const currentSelectedIndex = this.getCurrentIndex(item);
|
|
115
|
+
const lastItemIndex = this.domNavItems.length - 1;
|
|
177
116
|
const previousSelectIndex = currentSelectedIndex - 1 < 0 ? lastItemIndex : currentSelectedIndex - 1;
|
|
178
|
-
|
|
179
|
-
listItem?.focus();
|
|
117
|
+
this.domNavItems[previousSelectIndex]?.focus();
|
|
180
118
|
}
|
|
181
119
|
focusNextNavItem(e) {
|
|
182
|
-
const
|
|
183
|
-
const
|
|
184
|
-
const
|
|
185
|
-
|
|
186
|
-
const listItem = this.getListItemByIndex(nextSelectIndex);
|
|
187
|
-
listItem?.focus();
|
|
188
|
-
}
|
|
189
|
-
onCloseDropdown() {
|
|
190
|
-
this._dropdownMoreIsOpen = false;
|
|
120
|
+
const item = e.target;
|
|
121
|
+
const currentSelectedIndex = this.getCurrentIndex(item);
|
|
122
|
+
const nextSelectIndex = currentSelectedIndex + 1 > this.domNavItems.length - 1 ? 0 : currentSelectedIndex + 1;
|
|
123
|
+
this.domNavItems[nextSelectIndex].focus();
|
|
191
124
|
}
|
|
192
125
|
getItemWidth(item) {
|
|
193
|
-
const
|
|
194
|
-
|
|
195
|
-
context.font = "16px / 17.6px '72 Brand Variable'";
|
|
126
|
+
const context = this.getCanvasContext();
|
|
127
|
+
context.font = canvasContentFont;
|
|
196
128
|
return Math.ceil(context.measureText(item.title).width);
|
|
197
129
|
}
|
|
198
|
-
getCurrentIndex(item) {
|
|
199
|
-
return this.navigationItems.indexOf(item);
|
|
200
|
-
}
|
|
201
|
-
getListItemByIndex(index) {
|
|
202
|
-
return this.navigationItems[index].querySelector(".udex-secondary-navigation__link-btn");
|
|
203
|
-
}
|
|
204
|
-
getDropdown() {
|
|
205
|
-
return this.shadowRoot.querySelector(".udex-secondary-navigation__dropdown");
|
|
206
|
-
}
|
|
207
|
-
getMobileButtonMenu() {
|
|
208
|
-
return this.shadowRoot?.querySelector(".udex-secondary-navigation__mobile-opener");
|
|
209
|
-
}
|
|
210
|
-
getMoreButton() {
|
|
211
|
-
return this.shadowRoot.querySelector(".udex-secondary-navigation__list-item_more > button");
|
|
212
|
-
}
|
|
213
130
|
getMoreButtonWidth() {
|
|
131
|
+
const context = this.getCanvasContext();
|
|
132
|
+
context.font = canvasContentFont;
|
|
133
|
+
return Math.ceil(context.measureText(this.moreButtonText).width);
|
|
134
|
+
}
|
|
135
|
+
getCanvasContext() {
|
|
214
136
|
const canvas = document.createElement("canvas");
|
|
215
|
-
|
|
216
|
-
context.font = "16px / 17.6px '72 Brand Variable'";
|
|
217
|
-
return Math.ceil(context.measureText("More").width) + 4 + 16;
|
|
137
|
+
return canvas.getContext("2d");
|
|
218
138
|
}
|
|
219
|
-
|
|
220
|
-
return
|
|
139
|
+
getCurrentIndex(item) {
|
|
140
|
+
return this.domNavItems.indexOf(item);
|
|
141
|
+
}
|
|
142
|
+
handleItemClick(e) {
|
|
143
|
+
const clickedItem = e.detail.item;
|
|
144
|
+
const { path, target, title, active, subItems, _id, mobileLinkTitle, } = clickedItem;
|
|
145
|
+
const prevented = !this.fireEventItemClick(e, {
|
|
146
|
+
path,
|
|
147
|
+
target,
|
|
148
|
+
title,
|
|
149
|
+
active,
|
|
150
|
+
mobileLinkTitle,
|
|
151
|
+
items: subItems,
|
|
152
|
+
});
|
|
153
|
+
if (prevented) {
|
|
154
|
+
e.preventDefault();
|
|
155
|
+
return;
|
|
156
|
+
}
|
|
157
|
+
this._clickedNavItem = clickedItem;
|
|
158
|
+
this.closePrevDropdown(_id);
|
|
159
|
+
if (!subItems.length) {
|
|
160
|
+
this.setActiveItem(this.parsedItems, clickedItem);
|
|
161
|
+
}
|
|
221
162
|
}
|
|
222
|
-
|
|
223
|
-
const
|
|
224
|
-
const
|
|
225
|
-
const prevented = !this.
|
|
226
|
-
originalEvent: e,
|
|
227
|
-
clickedItem: target,
|
|
228
|
-
clickedIndex,
|
|
229
|
-
}, true);
|
|
163
|
+
handleSubItemClick(e) {
|
|
164
|
+
const item = e.detail.item;
|
|
165
|
+
const { items } = item;
|
|
166
|
+
const prevented = !this.fireEventItemClick(e, item);
|
|
230
167
|
if (prevented) {
|
|
231
168
|
e.preventDefault();
|
|
232
169
|
return;
|
|
233
170
|
}
|
|
234
|
-
if (this.
|
|
235
|
-
this.
|
|
236
|
-
this.navigationList[clickedIndex].active = true;
|
|
237
|
-
this.refreshRendering();
|
|
238
|
-
this.toggleActiveClass();
|
|
171
|
+
if (this.isMobileScreen && !items) {
|
|
172
|
+
this.mobileNav.closeDropdown();
|
|
239
173
|
}
|
|
174
|
+
if (!items) {
|
|
175
|
+
this.setActiveItem(this.parsedItems, item);
|
|
176
|
+
this._clickedNavItem?.closeDropdown();
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
fireEventItemClick(e, { items, target, path, title, active, mobileLinkTitle, }) {
|
|
180
|
+
return this.fireEvent("item-click", {
|
|
181
|
+
originalEvent: e,
|
|
182
|
+
clickedItem: {
|
|
183
|
+
mobileLinkTitle: mobileLinkTitle || "",
|
|
184
|
+
path: path || "",
|
|
185
|
+
active: active || false,
|
|
186
|
+
items: items || [],
|
|
187
|
+
target,
|
|
188
|
+
title,
|
|
189
|
+
},
|
|
190
|
+
clickedIndex: e.detail.index,
|
|
191
|
+
}, true);
|
|
192
|
+
}
|
|
193
|
+
setActiveItem(navItems, clickedItem) {
|
|
194
|
+
const updateNav = (items, { title, path }) => {
|
|
195
|
+
items.forEach(item => {
|
|
196
|
+
if (item.title === title && (item.path === path || !item.path)) {
|
|
197
|
+
item.active = true;
|
|
198
|
+
return;
|
|
199
|
+
}
|
|
200
|
+
delete item.active;
|
|
201
|
+
if (item.items) {
|
|
202
|
+
updateNav(item.items, clickedItem);
|
|
203
|
+
}
|
|
204
|
+
});
|
|
205
|
+
};
|
|
206
|
+
updateNav(navItems, clickedItem);
|
|
207
|
+
this.navItems = JSON.stringify(navItems);
|
|
208
|
+
}
|
|
209
|
+
handleOutsideClick() {
|
|
210
|
+
document.addEventListener("click", (e) => {
|
|
211
|
+
if (this.isMobileScreen && e.target !== this) {
|
|
212
|
+
this.closeMobileDropdown();
|
|
213
|
+
return;
|
|
214
|
+
}
|
|
215
|
+
if (this.isDesktopScreen) {
|
|
216
|
+
this.handleDesktopDropdown(e);
|
|
217
|
+
}
|
|
218
|
+
});
|
|
240
219
|
}
|
|
241
|
-
|
|
242
|
-
|
|
220
|
+
closeMobileDropdown() {
|
|
221
|
+
this.mobileNav?.closeDropdown();
|
|
222
|
+
}
|
|
223
|
+
handleDesktopDropdown(e) {
|
|
224
|
+
const isClickedNavItem = e.composedPath().includes(this._clickedNavItem);
|
|
225
|
+
if (!isClickedNavItem && this._clickedNavItem) {
|
|
226
|
+
this._clickedNavItem.closeDropdown();
|
|
227
|
+
}
|
|
228
|
+
}
|
|
229
|
+
closePrevDropdown(clickedItemId) {
|
|
230
|
+
this.domNavItems.forEach(item => {
|
|
231
|
+
if (clickedItemId !== item._id) {
|
|
232
|
+
item.closeDropdown();
|
|
233
|
+
}
|
|
234
|
+
});
|
|
235
|
+
}
|
|
236
|
+
parseArrayFromString(string) {
|
|
237
|
+
return string ? JSON.parse(string) : [];
|
|
243
238
|
}
|
|
244
239
|
get domNavItems() {
|
|
245
|
-
const
|
|
246
|
-
|
|
247
|
-
return domNavItems ? Array.from(domNavItems) : [];
|
|
240
|
+
const items = this.shadowRoot?.querySelectorAll("udex-secondary-navigation-item");
|
|
241
|
+
return items ? Array.from(items) : [];
|
|
248
242
|
}
|
|
249
243
|
get rootHolder() {
|
|
250
244
|
return (this.shadowRoot ? this.shadowRoot.querySelector(".udex-secondary-navigation__root") : undefined);
|
|
@@ -252,48 +246,42 @@ let UDExSecondaryNavigation = UDExSecondaryNavigation_1 = class UDExSecondaryNav
|
|
|
252
246
|
get heading() {
|
|
253
247
|
return (this.shadowRoot ? this.shadowRoot.querySelector(".udex-secondary-navigation__heading") : undefined);
|
|
254
248
|
}
|
|
249
|
+
get mobileNav() {
|
|
250
|
+
return (this.shadowRoot ? this.shadowRoot.querySelector(".udex-secondary-navigation__mobile-nav") : undefined);
|
|
251
|
+
}
|
|
255
252
|
get optionalButtons() {
|
|
256
253
|
return this.shadowRoot?.querySelector(".udex-secondary-navigation__buttons");
|
|
257
254
|
}
|
|
258
|
-
get linksList() {
|
|
259
|
-
return this.shadowRoot?.querySelector(".udex-secondary-navigation__list");
|
|
260
|
-
}
|
|
261
255
|
get moreButtonText() {
|
|
262
256
|
return UDExSecondaryNavigation_1.i18nBundle.getText(MORE);
|
|
263
257
|
}
|
|
264
|
-
get
|
|
265
|
-
|
|
266
|
-
return activeItem ? activeItem?.title : "";
|
|
258
|
+
get parsedItems() {
|
|
259
|
+
return this.parseArrayFromString(this.navItems);
|
|
267
260
|
}
|
|
268
|
-
get
|
|
269
|
-
|
|
270
|
-
return this._dropdownMoreIsOpen ? `${rootClasses} udex-secondary-navigation__list-item_open` : `${rootClasses}`;
|
|
261
|
+
get visibleItems() {
|
|
262
|
+
return this.isDesktopScreen ? this._visibleItems : this.parsedItems;
|
|
271
263
|
}
|
|
272
|
-
get
|
|
273
|
-
|
|
274
|
-
this._navigationList = this.parseArrayFromString(this.navItems);
|
|
275
|
-
}
|
|
276
|
-
return this._navigationList;
|
|
277
|
-
}
|
|
278
|
-
get items() {
|
|
279
|
-
return this.isDesktopScreen ? this._navItems : this.navigationList;
|
|
280
|
-
}
|
|
281
|
-
get moreIsActive() {
|
|
282
|
-
return this._overflowItems.some(item => item.active);
|
|
264
|
+
get hasBreadcrumbsSlot() {
|
|
265
|
+
return !!this.getSlottedNodes("breadcrumbs").length && this.isDesktopScreen;
|
|
283
266
|
}
|
|
284
267
|
get rootClass() {
|
|
285
|
-
|
|
286
|
-
return `${rootClass} ${centeredClass}`;
|
|
268
|
+
return `${rootClass} ${this.hasBreadcrumbsSlot ? "" : `${rootClass}_centered`}`.trim();
|
|
287
269
|
}
|
|
288
|
-
get
|
|
289
|
-
return
|
|
270
|
+
get hasDesktopButtonsSlot() {
|
|
271
|
+
return this.hasButtons && this.isDesktopScreen;
|
|
290
272
|
}
|
|
291
|
-
get
|
|
273
|
+
get hasMobileButtonsSlot() {
|
|
274
|
+
return this.hasButtons && this.isMobileScreen;
|
|
275
|
+
}
|
|
276
|
+
get hasButtons() {
|
|
292
277
|
return !!this.getSlottedNodes("buttons").length;
|
|
293
278
|
}
|
|
294
279
|
get isDesktopScreen() {
|
|
295
280
|
return window.innerWidth > breakpointSizeS;
|
|
296
281
|
}
|
|
282
|
+
get isMobileScreen() {
|
|
283
|
+
return window.innerWidth <= breakpointSizeS;
|
|
284
|
+
}
|
|
297
285
|
};
|
|
298
286
|
__decorate([
|
|
299
287
|
property({ type: String })
|
|
@@ -310,15 +298,18 @@ __decorate([
|
|
|
310
298
|
__decorate([
|
|
311
299
|
property()
|
|
312
300
|
], UDExSecondaryNavigation.prototype, "title", void 0);
|
|
301
|
+
__decorate([
|
|
302
|
+
property()
|
|
303
|
+
], UDExSecondaryNavigation.prototype, "titleHref", void 0);
|
|
313
304
|
__decorate([
|
|
314
305
|
property({ type: Boolean, noAttribute: true })
|
|
315
|
-
], UDExSecondaryNavigation.prototype, "
|
|
306
|
+
], UDExSecondaryNavigation.prototype, "_selectedMore", void 0);
|
|
316
307
|
__decorate([
|
|
317
|
-
property({ type:
|
|
308
|
+
property({ type: Object, multiple: true, noAttribute: true })
|
|
318
309
|
], UDExSecondaryNavigation.prototype, "_overflowItems", void 0);
|
|
319
310
|
__decorate([
|
|
320
|
-
property({ type:
|
|
321
|
-
], UDExSecondaryNavigation.prototype, "
|
|
311
|
+
property({ type: Object, multiple: true, noAttribute: true })
|
|
312
|
+
], UDExSecondaryNavigation.prototype, "_visibleItems", void 0);
|
|
322
313
|
__decorate([
|
|
323
314
|
property({ type: Boolean, noAttribute: true })
|
|
324
315
|
], UDExSecondaryNavigation.prototype, "_requestRender", void 0);
|
|
@@ -331,7 +322,7 @@ UDExSecondaryNavigation = UDExSecondaryNavigation_1 = __decorate([
|
|
|
331
322
|
renderer: litRender,
|
|
332
323
|
styles: SecondaryNavigationCss,
|
|
333
324
|
template: SecondaryNavigationTemplate,
|
|
334
|
-
dependencies: [
|
|
325
|
+
dependencies: [UDExSecondaryNavigationItem],
|
|
335
326
|
})
|
|
336
327
|
/**
|
|
337
328
|
* Fires when item is clicked
|
|
@@ -346,7 +337,7 @@ UDExSecondaryNavigation = UDExSecondaryNavigation_1 = __decorate([
|
|
|
346
337
|
type: Event,
|
|
347
338
|
},
|
|
348
339
|
clickedItem: {
|
|
349
|
-
type:
|
|
340
|
+
type: Object,
|
|
350
341
|
},
|
|
351
342
|
clickedIndex: {
|
|
352
343
|
type: Integer,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SecondaryNavigation.js","sourceRoot":"","sources":["../src/SecondaryNavigation.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element, { ChangeInfo } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport UI5Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\nimport {\n isLeft,\n isRight,\n isUp,\n isDown,\n isEscape,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { MORE } from \"./generated/i18n/i18n-defaults.js\";\n\nimport SecondaryNavigationTemplate from \"./generated/templates/SecondaryNavigationTemplate.lit.js\";\n\n// Styles\nimport SecondaryNavigationCss from \"./generated/themes/SecondaryNavigation.css.js\";\n\nconst mobileMenuActiveClass = \"udex-secondary-navigation__root_open\";\nconst rootClass = \"udex-secondary-navigation__root\";\nconst breakpointSizeS: number = 979;\n\nexport enum Target {\n _blank = \"_blank\",\n _parent = \"_parent\",\n _self = \"_self\",\n _top = \"_top\",\n}\n\nexport type NavItem = {\n path: string;\n mobileLinkTitle: string;\n target: Target;\n title: string;\n active?: boolean;\n}\n\nexport type SecondaryNavigationItemClickDetail = {\n originalEvent: Event,\n clickedItem: HTMLElement;\n clickedIndex: number;\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-secondary-navigation</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@udex/web-components/dist/SecondaryNavigation.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @public\n */\n@customElement({\n tag: \"udex-secondary-navigation\",\n renderer: litRender,\n styles: SecondaryNavigationCss,\n template: SecondaryNavigationTemplate,\n dependencies: [UI5Icon],\n})\n\n/**\n * Fires when item is clicked\n *\n * @allowPreventDefault\n * @public\n */\n@event<SecondaryNavigationItemClickDetail>(\"item-click\", {\n detail: {\n originalEvent: {\n type: Event,\n },\n clickedItem: {\n type: HTMLElement,\n },\n clickedIndex: {\n type: Integer,\n },\n },\n})\n\nclass UDExSecondaryNavigation extends UI5Element {\n /**\n * Defines an aria label for the mobile menu opener\n *\n * @public\n */\n @property({ type: String })\n mobileMenuOpenerAriaLabel!: string;\n\n /**\n * List of the nav items\n *\n * @default \"[]\"\n * @public\n */\n @property({ type: String, defaultValue: \"[]\" })\n navItems!: string;\n\n /**\n * Slot for breadcrumbs.\n *\n * @slot breadcrumbs\n * @public\n */\n @slot({ type: HTMLElement })\n breadcrumbs!: Array<HTMLElement>;\n\n /**\n * Slot for action buttons.\n *\n * @slot buttons\n * @public\n */\n @slot({ type: HTMLElement })\n buttons!: Array<HTMLElement>;\n\n /**\n * Defines the title of the component.\n *\n * @default \"\"\n * @public\n */\n @property()\n title!: string;\n\n @property({ type: Boolean, noAttribute: true })\n _dropdownMoreIsOpen!: boolean;\n\n @property({ type: HTMLElement, defaultValue: [], noAttribute: true })\n _overflowItems!: Array<NavItem>;\n\n @property({ type: HTMLElement, defaultValue: [], noAttribute: true })\n _navItems!: Array<NavItem>;\n\n @property({ type: Boolean, noAttribute: true })\n _requestRender = false;\n\n @property({ type: Boolean, noAttribute: true })\n _mobileBtnExpanded = false;\n\n _showMoreButton: boolean;\n _navigationList: Array<NavItem> | undefined;\n _dropdown!: HTMLElement | null | undefined;\n _rootHolder!: HTMLElement | null | undefined;\n _boundReflowItems: () => void;\n\n static i18nBundle: any;\n\n static async onDefine(): Promise<void> {\n UDExSecondaryNavigation.i18nBundle = await getI18nBundle(\"udex-secondary-navigation\");\n }\n\n constructor() {\n super();\n this._showMoreButton = true;\n this._boundReflowItems = this.reflowItems.bind(this);\n }\n\n onEnterDOM(): void {\n if (isDesktop()) {\n this.setAttribute(\"desktop\", \"\");\n }\n\n if (this.isDesktopScreen) {\n this.reflowItems();\n }\n\n ResizeHandler.register(this.rootHolder, this._boundReflowItems);\n }\n\n onExitDOM(): void {\n ResizeHandler.deregister(this.rootHolder, this._boundReflowItems);\n }\n\n onInvalidation(changeInfo: ChangeInfo): void {\n if (changeInfo.name === \"navItems\") {\n this._navigationList = undefined;\n this.reflowItems();\n }\n }\n\n onAfterRendering(): void {\n this._rootHolder = this.rootHolder;\n this._dropdown = this.getDropdown();\n\n this.handleOutsideClick();\n }\n\n refreshRendering(): void {\n this._requestRender = !this._requestRender;\n }\n\n reflowItems(): void {\n const availableWidth = this.rootHolder.offsetWidth - this.heading.offsetWidth - (this.optionalButtons?.offsetWidth || 0);\n const moreButtonWidth = this.getMoreButtonWidth();\n const itemsGap = 20;\n\n const widths = this.navigationList.map(item => this.getItemWidth(item));\n\n const steps: Array<number> = [];\n widths.forEach((itemWidth, index) => {\n steps.push((steps.at(-1) || 0) + itemWidth + (index && itemsGap));\n });\n\n if ((steps.at(-1) || 0) <= availableWidth) {\n this._navItems.splice(0, Infinity, ...this.navigationList);\n this._showMoreButton = false;\n this.refreshRendering();\n return;\n }\n\n // @ts-ignore\n const lastVisibleIndex: number = steps.findLastIndex((size: number) => size < (availableWidth - moreButtonWidth - itemsGap));\n this._navItems.splice(0, Infinity, ...this.navigationList.slice(0, lastVisibleIndex + 1));\n this._overflowItems.splice(0, Infinity, ...this.navigationList.slice(lastVisibleIndex + 1));\n this._showMoreButton = true;\n this.refreshRendering();\n }\n\n handleKeyDown(e: KeyboardEvent) {\n e.stopPropagation();\n this.handleLeftArrow(e);\n this.handleRightArrow(e);\n this.handleEscapeKey(e);\n }\n\n handleEscapeKey(e: KeyboardEvent) {\n if (isEscape(e)) {\n if (!this.isDesktopScreen) {\n this._rootHolder?.classList.remove(mobileMenuActiveClass);\n this.getMobileButtonMenu().focus();\n } else {\n this.onCloseDropdown();\n this.getMoreButton().focus();\n }\n }\n }\n\n handleKeyDownDropdown(e: KeyboardEvent) {\n e.stopPropagation();\n this.handleUpArrow(e);\n this.handleDownArrow(e);\n this.handleEscapeKey(e);\n }\n\n handleLeftArrow(e: KeyboardEvent): void {\n if (isLeft(e)) {\n this.focusPrevNavItem(e);\n }\n }\n\n handleRightArrow(e: KeyboardEvent): void {\n if (isRight(e)) {\n this.focusNextNavItem(e);\n }\n }\n\n handleUpArrow(e: KeyboardEvent): void {\n if (isUp(e)) {\n this.focusPrevNavItem(e);\n }\n }\n\n handleDownArrow(e: KeyboardEvent): void {\n if (isDown(e)) {\n this.focusNextNavItem(e);\n }\n }\n\n handleOutsideClick(): void {\n document.addEventListener(\"click\", () => {\n if (this._dropdown) {\n this.onCloseDropdown();\n }\n });\n }\n\n handleMobileOpen(): void {\n this.toggleActiveClass();\n this._mobileBtnExpanded = !this._mobileBtnExpanded;\n }\n\n handleToggleDropdown(): void {\n this._dropdownMoreIsOpen = !this._dropdownMoreIsOpen;\n }\n\n toggleActiveClass() {\n this._rootHolder?.classList.toggle(mobileMenuActiveClass);\n }\n\n focusPrevNavItem(e: KeyboardEvent): void {\n const el = e.target as HTMLElement;\n const currentItem = el.parentElement as HTMLElement;\n const currentSelectedIndex = this.getCurrentIndex(currentItem);\n const lastItemIndex = this.navigationItems.length - 1;\n const previousSelectIndex = currentSelectedIndex - 1 < 0 ? lastItemIndex : currentSelectedIndex - 1;\n const listItem = this.getListItemByIndex(previousSelectIndex);\n listItem?.focus();\n }\n\n focusNextNavItem(e: KeyboardEvent): void {\n const el = e.target as HTMLElement;\n const currentItem = el.parentElement as HTMLElement;\n const currentSelectedIndex = this.getCurrentIndex(currentItem);\n const nextSelectIndex = currentSelectedIndex + 1 > this.navigationItems.length - 1 ? 0 : currentSelectedIndex + 1;\n const listItem = this.getListItemByIndex(nextSelectIndex);\n listItem?.focus();\n }\n\n onCloseDropdown(): void {\n this._dropdownMoreIsOpen = false;\n }\n\n getItemWidth(item: NavItem): number {\n const canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\")!;\n context.font = \"16px / 17.6px '72 Brand Variable'\";\n\n return Math.ceil(context.measureText(item.title).width);\n }\n\n getCurrentIndex(item: HTMLElement): number {\n return this.navigationItems.indexOf(item);\n }\n\n getListItemByIndex(index: number): HTMLElement | null {\n return this.navigationItems[index].querySelector(\".udex-secondary-navigation__link-btn\");\n }\n\n getDropdown(): HTMLElement {\n return this.shadowRoot!.querySelector(\".udex-secondary-navigation__dropdown\")!;\n }\n\n getMobileButtonMenu(): HTMLElement {\n return this.shadowRoot?.querySelector(\".udex-secondary-navigation__mobile-opener\") as HTMLElement;\n }\n\n getMoreButton(): HTMLElement {\n return this.shadowRoot!.querySelector(\".udex-secondary-navigation__list-item_more > button\")!;\n }\n\n getMoreButtonWidth(): number {\n const canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\")!;\n context.font = \"16px / 17.6px '72 Brand Variable'\";\n\n return Math.ceil(context.measureText(\"More\").width) + 4 + 16;\n }\n\n parseArrayFromString<T>(string: string): T[] {\n return string ? JSON.parse(string) as T[] : [];\n }\n\n handleNavigationClick(e: MouseEvent) {\n const target = e.target as HTMLElement;\n const clickedIndex = this.domNavItems.indexOf(target);\n const prevented = !this.fireEvent(\"item-click\", {\n originalEvent: e,\n clickedItem: target,\n clickedIndex,\n }, true);\n\n if (prevented) {\n e.preventDefault();\n return;\n }\n\n if (this.domNavItems.length > 0) {\n this.navigationList.forEach(item => delete item.active);\n this.navigationList[clickedIndex].active = true;\n this.refreshRendering();\n this.toggleActiveClass();\n }\n }\n\n get navigationItems(): Array<HTMLElement> {\n return Array.from(this.shadowRoot!.querySelectorAll(\".udex-secondary-navigation__link-btn-wrap\"));\n }\n\n get domNavItems(): Array<HTMLElement> {\n const navigationItemsSelector = \".udex-secondary-navigation__item:not(.udex-secondary-navigation__link-btn-more), .udex-secondary-navigation__dropdown-item\";\n const domNavItems = this.shadowRoot?.querySelectorAll<HTMLElement>(navigationItemsSelector);\n return domNavItems ? Array.from(domNavItems) : [];\n }\n\n get rootHolder(): HTMLElement {\n return (this.shadowRoot ? this.shadowRoot.querySelector<HTMLElement>(\".udex-secondary-navigation__root\") : undefined)!;\n }\n\n get heading(): HTMLElement {\n return (this.shadowRoot ? this.shadowRoot.querySelector<HTMLElement>(\".udex-secondary-navigation__heading\") : undefined)!;\n }\n\n get optionalButtons() {\n return this.shadowRoot?.querySelector<HTMLElement>(\".udex-secondary-navigation__buttons\");\n }\n\n get linksList() {\n return this.shadowRoot?.querySelector<HTMLElement>(\".udex-secondary-navigation__list\");\n }\n\n get moreButtonText(): string {\n return UDExSecondaryNavigation.i18nBundle.getText(MORE) as string;\n }\n\n get activeItemText(): string {\n const activeItem = this.navigationList.find(item => item.active);\n return activeItem ? activeItem?.title : \"\";\n }\n\n get moreClass(): string {\n const rootClasses = \"udex-secondary-navigation__list-item udex-secondary-navigation__list-item_more\";\n return this._dropdownMoreIsOpen ? `${rootClasses} udex-secondary-navigation__list-item_open` : `${rootClasses}`;\n }\n\n get navigationList(): Array<NavItem> {\n if (!this._navigationList) {\n this._navigationList = this.parseArrayFromString<NavItem>(this.navItems);\n }\n return this._navigationList;\n }\n\n get items(): Array<NavItem> {\n return this.isDesktopScreen ? this._navItems : this.navigationList;\n }\n\n get moreIsActive(): boolean {\n return this._overflowItems.some(item => item.active);\n }\n\n get rootClass(): string {\n const centeredClass = this.hasBreadcrumbsSlot ? \"\" : `${rootClass}_centered`;\n return `${rootClass} ${centeredClass}`;\n }\n\n get hasBreadcrumbsSlot(): boolean {\n return !!this.getSlottedNodes(\"breadcrumbs\").length;\n }\n\n get hasButtonsSlot(): boolean {\n return !!this.getSlottedNodes(\"buttons\").length;\n }\n\n get isDesktopScreen(): boolean {\n return window.innerWidth > breakpointSizeS;\n }\n}\n\nUDExSecondaryNavigation.define();\n\nexport default UDExSecondaryNavigation;\n"]}
|
|
1
|
+
{"version":3,"file":"SecondaryNavigation.js","sourceRoot":"","sources":["../src/SecondaryNavigation.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element, { ChangeInfo } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport {\n isLeft,\n isRight,\n isEscape,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport UDExSecondaryNavigationItem from \"./SecondaryNavigationItem.js\";\nimport UDExSecondaryNavigationSubItem from \"./SecondaryNavigationSubItem.js\";\nimport UDExSecondaryNavigationItemBase, { NavItem } from \"./SecondaryNavigationItemBase.js\";\nimport { MORE } from \"./generated/i18n/i18n-defaults.js\";\n\nimport SecondaryNavigationTemplate from \"./generated/templates/SecondaryNavigationTemplate.lit.js\";\n\n// Styles\nimport SecondaryNavigationCss from \"./generated/themes/SecondaryNavigation.css.js\";\n\nconst canvasContentFont: string = \"16px / 17.6px '72 Brand Variable'\";\nconst rootClass = \"udex-secondary-navigation__root\";\nexport const breakpointSizeS: number = 979;\n\nexport type ItemClickDetail = {\n originalEvent: Event,\n clickedItem: NavItem;\n clickedIndex: number;\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-secondary-navigation</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@udex/web-components/dist/SecondaryNavigation.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @public\n */\n@customElement({\n tag: \"udex-secondary-navigation\",\n renderer: litRender,\n styles: SecondaryNavigationCss,\n template: SecondaryNavigationTemplate,\n dependencies: [UDExSecondaryNavigationItem],\n})\n\n/**\n * Fires when item is clicked\n *\n * @allowPreventDefault\n * @public\n */\n@event<ItemClickDetail>(\"item-click\", {\n detail: {\n originalEvent: {\n type: Event,\n },\n clickedItem: {\n type: Object,\n },\n clickedIndex: {\n type: Integer,\n },\n },\n})\n\nclass UDExSecondaryNavigation extends UI5Element {\n /**\n * Defines an aria label for the mobile menu opener\n *\n * @public\n */\n @property({ type: String })\n mobileMenuOpenerAriaLabel!: string;\n\n /**\n * List of the nav items\n *\n * @default \"[]\"\n * @public\n */\n @property({ type: String, defaultValue: \"[]\" })\n navItems!: string;\n\n /**\n * Slot for breadcrumbs.\n *\n * @slot breadcrumbs\n * @public\n */\n @slot({ type: HTMLElement })\n breadcrumbs!: Array<HTMLElement>;\n\n /**\n * Slot for action buttons.\n *\n * @slot buttons\n * @public\n */\n @slot({ type: HTMLElement })\n buttons!: Array<HTMLElement>;\n\n /**\n * Defines the title of the component.\n *\n * @default \"\"\n * @public\n */\n @property()\n title!: string;\n\n /**\n * Defines the href of the title.\n *\n * @default \"\"\n * @public\n */\n @property()\n titleHref!: string;\n\n @property({ type: Boolean, noAttribute: true })\n _selectedMore!: boolean;\n\n @property({ type: Object, multiple: true, noAttribute: true })\n _overflowItems!: Array<NavItem>;\n\n @property({ type: Object, multiple: true, noAttribute: true })\n _visibleItems!: Array<NavItem>;\n\n @property({ type: Boolean, noAttribute: true })\n _requestRender = false;\n\n @property({ type: Boolean, noAttribute: true })\n _mobileBtnExpanded = false;\n\n _navItems!: Array<NavItem>;\n _showMoreButton: boolean;\n _rootHolder!: HTMLElement | null | undefined;\n _clickedNavItem!: UDExSecondaryNavigationItem;\n _boundReflowItems: () => void;\n\n static i18nBundle: any;\n\n static async onDefine(): Promise<void> {\n UDExSecondaryNavigation.i18nBundle = await getI18nBundle(\"udex-secondary-navigation\");\n }\n\n constructor() {\n super();\n this._showMoreButton = true;\n this._boundReflowItems = this.reflowItems.bind(this);\n }\n\n onEnterDOM(): void {\n if (isDesktop()) {\n this.setAttribute(\"desktop\", \"\");\n }\n\n ResizeHandler.register(this, this._boundReflowItems);\n }\n\n onExitDOM(): void {\n ResizeHandler.deregister(this, this._boundReflowItems);\n }\n\n onInvalidation(changeInfo: ChangeInfo): void {\n if (changeInfo.name === \"navItems\") {\n this.reflowItems();\n }\n }\n\n onAfterRendering(): void {\n this._rootHolder = this.rootHolder;\n this.handleOutsideClick();\n }\n\n refreshRendering(): void {\n this._requestRender = !this._requestRender;\n }\n\n reflowItems(): void {\n const availableWidth = this.rootHolder.offsetWidth - this.heading?.offsetWidth - (this.optionalButtons?.offsetWidth || 0);\n const moreButtonWidth = this.getMoreButtonWidth();\n const itemsGap = 20;\n const widths = this.parsedItems.map(item => this.getItemWidth(item));\n const steps: Array<number> = [];\n\n widths?.forEach((itemWidth, index) => {\n steps.push((steps.at(-1) || 0) + itemWidth + (index && itemsGap));\n });\n\n if ((steps.at(-1) || 0) <= availableWidth) {\n this._visibleItems.splice(0, Infinity, ...this.parsedItems);\n this._showMoreButton = false;\n this.refreshRendering();\n return;\n }\n\n if (this.parsedItems) {\n // @ts-ignore\n const lastVisibleIndex: number = steps.findLastIndex((size: number) => size < (availableWidth - moreButtonWidth - itemsGap));\n this._visibleItems.splice(0, Infinity, ...this.parsedItems.slice(0, lastVisibleIndex + 1));\n this._overflowItems.splice(0, Infinity, ...this.parsedItems.slice(lastVisibleIndex + 1));\n this._showMoreButton = true;\n this.refreshRendering();\n }\n }\n\n handleKeyDown(e: KeyboardEvent): void {\n e.stopPropagation();\n if (isLeft(e)) {\n this.focusPrevNavItem(e);\n }\n if (isRight(e)) {\n this.focusNextNavItem(e);\n }\n if (isEscape(e)) {\n (e.target as UDExSecondaryNavigationItem).closeDropdown();\n }\n }\n\n focusPrevNavItem(e: KeyboardEvent): void {\n const item = e.target as UDExSecondaryNavigationItem;\n const currentSelectedIndex = this.getCurrentIndex(item);\n const lastItemIndex = this.domNavItems.length - 1;\n const previousSelectIndex = currentSelectedIndex - 1 < 0 ? lastItemIndex : currentSelectedIndex - 1;\n this.domNavItems[previousSelectIndex]?.focus();\n }\n\n focusNextNavItem(e: KeyboardEvent): void {\n const item = e.target as UDExSecondaryNavigationItem;\n const currentSelectedIndex = this.getCurrentIndex(item);\n const nextSelectIndex = currentSelectedIndex + 1 > this.domNavItems.length - 1 ? 0 : currentSelectedIndex + 1;\n this.domNavItems[nextSelectIndex].focus();\n }\n\n getItemWidth(item: NavItem): number {\n const context = this.getCanvasContext();\n context.font = canvasContentFont;\n\n return Math.ceil(context.measureText(item.title).width);\n }\n\n getMoreButtonWidth(): number {\n const context = this.getCanvasContext();\n context.font = canvasContentFont;\n\n return Math.ceil(context.measureText(this.moreButtonText).width);\n }\n\n getCanvasContext(): CanvasRenderingContext2D {\n const canvas = document.createElement(\"canvas\");\n return canvas.getContext(\"2d\")!;\n }\n\n getCurrentIndex(item: UDExSecondaryNavigationItem): number {\n return this.domNavItems.indexOf(item);\n }\n\n handleItemClick(e: CustomEvent): void {\n const clickedItem = e.detail.item as UDExSecondaryNavigationItem;\n const {\n path, target, title, active, subItems, _id, mobileLinkTitle,\n } = clickedItem;\n\n const prevented = !this.fireEventItemClick(e, {\n path,\n target,\n title,\n active,\n mobileLinkTitle,\n items: subItems,\n });\n\n if (prevented) {\n e.preventDefault();\n return;\n }\n\n this._clickedNavItem = clickedItem;\n this.closePrevDropdown(_id);\n\n if (!subItems.length) {\n this.setActiveItem(this.parsedItems, clickedItem);\n }\n }\n\n handleSubItemClick(e: CustomEvent): void {\n const item = e.detail.item as UDExSecondaryNavigationSubItem;\n const { items } = item as NavItem;\n const prevented = !this.fireEventItemClick(e, item);\n\n if (prevented) {\n e.preventDefault();\n return;\n }\n\n if (this.isMobileScreen && !items) {\n this.mobileNav.closeDropdown();\n }\n\n if (!items) {\n this.setActiveItem(this.parsedItems, item);\n this._clickedNavItem?.closeDropdown();\n }\n }\n\n fireEventItemClick(\n e: CustomEvent,\n {\n items, target, path, title, active, mobileLinkTitle,\n }: NavItem,\n ): boolean {\n return this.fireEvent(\"item-click\", {\n originalEvent: e,\n clickedItem: {\n mobileLinkTitle: mobileLinkTitle || \"\",\n path: path || \"\",\n active: active || false,\n items: items || [],\n target,\n title,\n },\n clickedIndex: e.detail.index,\n }, true);\n }\n\n setActiveItem(navItems: Array<NavItem>, clickedItem: UDExSecondaryNavigationItemBase): void {\n const updateNav = (items: Array<NavItem>, { title, path }: UDExSecondaryNavigationItemBase) => {\n items.forEach(item => {\n if (item.title === title && (item.path === path || !item.path)) {\n item.active = true;\n return;\n }\n delete item.active;\n\n if (item.items) {\n updateNav(item.items, clickedItem);\n }\n });\n };\n\n updateNav(navItems, clickedItem);\n this.navItems = JSON.stringify(navItems);\n }\n\n handleOutsideClick(): void {\n document.addEventListener(\"click\", (e: MouseEvent) => {\n if (this.isMobileScreen && e.target !== this) {\n this.closeMobileDropdown();\n return;\n }\n\n if (this.isDesktopScreen) {\n this.handleDesktopDropdown(e);\n }\n });\n }\n\n closeMobileDropdown(): void {\n this.mobileNav?.closeDropdown();\n }\n\n handleDesktopDropdown(e: MouseEvent): void {\n const isClickedNavItem = e.composedPath().includes(this._clickedNavItem);\n if (!isClickedNavItem && this._clickedNavItem) {\n this._clickedNavItem.closeDropdown();\n }\n }\n\n closePrevDropdown(clickedItemId: string): void {\n this.domNavItems.forEach(item => {\n if (clickedItemId !== item._id) {\n item.closeDropdown();\n }\n });\n }\n\n parseArrayFromString<T>(string: string): T[] {\n return string ? JSON.parse(string) as T[] : [];\n }\n\n get domNavItems(): Array<UDExSecondaryNavigationItem> {\n const items = this.shadowRoot?.querySelectorAll<UDExSecondaryNavigationItem>(\"udex-secondary-navigation-item\");\n return items ? Array.from(items) : [];\n }\n\n get rootHolder(): HTMLElement {\n return (this.shadowRoot ? this.shadowRoot.querySelector<HTMLElement>(\".udex-secondary-navigation__root\") : undefined)!;\n }\n\n get heading(): HTMLElement {\n return (this.shadowRoot ? this.shadowRoot.querySelector<HTMLElement>(\".udex-secondary-navigation__heading\") : undefined)!;\n }\n\n get mobileNav(): UDExSecondaryNavigationItem {\n return (this.shadowRoot ? this.shadowRoot.querySelector<UDExSecondaryNavigationItem>(\".udex-secondary-navigation__mobile-nav\") : undefined)!;\n }\n\n get optionalButtons(): HTMLElement | null | undefined {\n return this.shadowRoot?.querySelector<HTMLElement>(\".udex-secondary-navigation__buttons\");\n }\n\n get moreButtonText(): string {\n return UDExSecondaryNavigation.i18nBundle.getText(MORE) as string;\n }\n\n get parsedItems(): Array<NavItem> {\n return this.parseArrayFromString<NavItem>(this.navItems);\n }\n\n get visibleItems(): Array<NavItem> {\n return this.isDesktopScreen ? this._visibleItems : this.parsedItems;\n }\n\n get hasBreadcrumbsSlot(): boolean {\n return !!this.getSlottedNodes(\"breadcrumbs\").length && this.isDesktopScreen;\n }\n\n get rootClass(): string {\n return `${rootClass} ${this.hasBreadcrumbsSlot ? \"\" : `${rootClass}_centered`}`.trim();\n }\n\n get hasDesktopButtonsSlot(): boolean {\n return this.hasButtons && this.isDesktopScreen;\n }\n\n get hasMobileButtonsSlot(): boolean {\n return this.hasButtons && this.isMobileScreen;\n }\n\n get hasButtons(): boolean {\n return !!this.getSlottedNodes(\"buttons\").length;\n }\n\n get isDesktopScreen(): boolean {\n return window.innerWidth > breakpointSizeS;\n }\n\n get isMobileScreen(): boolean {\n return window.innerWidth <= breakpointSizeS;\n }\n}\n\nUDExSecondaryNavigation.define();\n\nexport default UDExSecondaryNavigation;\n"]}
|