@sapudex/web-components 2.32.0 → 2.32.1

package/src/HeroBannerTemplate.tsx

@@ -1,8 +1,13 @@
 import type HeroBanner from "./HeroBanner.js";
 import UI5Icon from "@ui5/webcomponents/dist/Icon.js";
+import "@ui5/webcomponents-icons/dist/play.js";
+import "@ui5/webcomponents-icons/dist/pause.js";
+import playIcon from "@ui5/webcomponents-icons/play.js";
+import pauseIcon from "@ui5/webcomponents-icons/pause.js";
 
 export default function HeroBannerTemplate(this: HeroBanner) {
   const rootClass = "udex-hero-banner";
+  const btnIcon = this._isVideoRunning ? playIcon : pauseIcon;
 
   return (
     <div
@@ -55,7 +60,7 @@ export default function HeroBannerTemplate(this: HeroBanner) {
             aria-label="Play / Pause button"
             role="button"
             onClick={this._toggleMediaButton}>
-            <UI5Icon name={this.mediaButtonIconName}></UI5Icon>
+            <UI5Icon name={btnIcon}></UI5Icon>
           </button>
         </div>
       ) : (

package/src/SelectBase.ts

@@ -194,7 +194,7 @@ class UDExSelectBase extends UDExSearchableListBase {
   }
 
   onInvalidation({ name }: ChangeInfo): void {
-    if (name === "default" && this.modeSingleSelect) {
+    if (name === "default" && this.modeSingleSelect && !this._inputValue) {
       this.setSelectOption();
     }
   }
@@ -340,6 +340,7 @@ class UDExSelectBase extends UDExSearchableListBase {
     e.stopPropagation();
     e.preventDefault();
     this._selectedOption = "";
+    this._inputValue = e.key;
     this._search.value = e.key;
     this._search.focus();
     this.onSearch(this._search.value);

package/src/StepInput.ts

@@ -294,6 +294,18 @@ class UDExStepInput extends UI5Element {
     this._setButtonState();
   }
 
+  onAfterRendering() {
+    this._skipLiveAnnouncement = false;
+  }
+
+  // Plain (non-reactive) flag — set before a re-render when focus is being
+  // redirected to the input so the live region stays silent for that render.
+  private _skipLiveAnnouncement = false;
+
+  get _liveRegionText() {
+    return this._skipLiveAnnouncement ? "" : this._valuePrecisioned;
+  }
+
   get input() {
     return this.inputOuter.shadowRoot!.querySelector("input")!;
   }
@@ -405,6 +417,10 @@ class UDExStepInput extends UI5Element {
     if (!this._incIconInactive) {
       this._modifyValue(this.step, true);
       this._previousValue = this.value;
+      if (this._incIconDisabled) {
+        this._skipLiveAnnouncement = true;
+        this.input.focus();
+      }
     }
   }
 
@@ -412,6 +428,10 @@ class UDExStepInput extends UI5Element {
     if (!this._decIconInactive) {
       this._modifyValue(-this.step, true);
       this._previousValue = this.value;
+      if (this._decIconDisabled) {
+        this._skipLiveAnnouncement = true;
+        this.input.focus();
+      }
     }
   }
 

package/src/StepInputTemplate.tsx

@@ -60,6 +60,6 @@ export default function StepInputTemplate(this: UDExStepInput) {
         ></UDExControlButton>
       </>)
     }
-    <div class="hidden" aria-live="polite">{this._valuePrecisioned}</div>
+    <div class="hidden" aria-live="polite">{this._liveRegionText}</div>
   </div>);
 }

package/src/generated/themes/FilterMenu.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udex-filter-menu-trigger-color-default: var(--sapTextColor, #223548);--udex-filter-menu-trigger-color-hover: var(--sapHoverColor, #0070f2);--udex-filter-menu-trigger-color-active: var(--sapShell_Active_TextColor, #0040b0);--udex-filter-menu-trigger-color-disabled: var(--sapTextColor, #223548);--udex-filter-menu-trigger-icon-default: var(--sapContent_IconColor, #223548);--udex-filter-menu-trigger-icon-hover: var(--sapHoverColor, #0070f2);--udex-filter-menu-trigger-icon-active: var(--sapSelectedColor, #0040b0);--udex-filter-menu-trigger-icon-disabled: var(--sapContent_IconColor, #223548);--udex-filter-menu-trigger-prefix-color-default: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-prefix-color-hover: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-prefix-color-active: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-prefix-color-disabled: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-selection-bar-background: var(--udexColorBlue8, #0057D2);--udex-filter-menu-trigger-outline-border-color: var(--udexColorBlue10, #002A86);--udex-filter-menu-popover-left-offset: 0px;--udex-filter-menu-popover-min-width-xs: calc(100% - var(--udex-filter-menu-popover-left-offset));--udex-filter-menu-popover-max-width-xs: 100%;--udex-filter-menu-popover-width: fit-content;--udex-filter-menu-popover-min-width: 320px;--udex-filter-menu-popover-max-width: 640px;--udex-filter-menu-popover-shadow: var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3));--udex-filter-menu-popover-border-color: var(--sapField_BorderColor, var(--udexCoreBorderDefault));--udex-filter-menu-popover-border-width: var(--sapElement_BorderWidth, 1px);--udex-filter-menu-popover-border-radius: var(--udexRadiusM, 8px);display:inline-block}:host([desktop]) .udex-filter-menu__trigger:focus,.udex-filter-menu__trigger:focus-visible{outline:2px solid var(--udex-filter-menu-trigger-outline-border-color);outline-offset:var(--udexSpacer2, 2px);border-radius:var(--udexRadiusM, 8px)}.udex-filter-menu__trigger{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 1.5);display:inline-flex;align-items:center;padding:5px 0;position:relative;background:none;border:none}.udex-filter-menu__trigger-wrap{cursor:pointer;display:inline-flex;align-items:center}.udex-filter-menu__trigger-wrap[disabled]{pointer-events:none}.udex-filter-menu__trigger-wrap[disabled]:hover .udex-filter-menu__trigger-name,.udex-filter-menu__trigger-wrap[disabled] .udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-disabled);opacity:var(--sapContent_DisabledOpacity, .4)}.udex-filter-menu__trigger-wrap[disabled] .udex-filter-menu__trigger-prefix{color:var(--udex-filter-menu-trigger-prefix-color-disabled)}.udex-filter-menu__trigger-wrap[disabled]:hover .udex-filter-menu__trigger-icon,.udex-filter-menu__trigger-wrap[disabled] .udex-filter-menu__trigger-icon{color:var(--udex-filter-menu-trigger-icon-disabled);opacity:var(--sapContent_DisabledOpacity, .4)}.udex-filter-menu__trigger-prefix{margin-right:var(--udexSpacer8, 8px);color:var(--udex-filter-menu-trigger-prefix-color-default)}.udex-filter-menu__trigger-wrap:hover .udex-filter-menu__trigger-prefix{color:var(--udex-filter-menu-trigger-prefix-color-hover)}.udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-default)}.udex-filter-menu__trigger:before{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;border-radius:2px 2px 0;background:var(--udex-filter-menu-trigger-selection-bar-background);opacity:0}.udex-filter-menu__trigger-active .udex-filter-menu__trigger-prefix{color:var(--udex-filter-menu-trigger-prefix-color-active)}.udex-filter-menu__trigger-active:before{opacity:1}.udex-filter-menu__trigger-icon{width:16px;height:16px;margin-inline-start:var(--udexSpacer8, 8px);color:var(--udex-filter-menu-trigger-icon-default)}.udex-filter-menu__trigger-wrap:hover .udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-hover)}.udex-filter-menu__trigger-wrap:hover .udex-filter-menu__trigger-icon{color:var(--udex-filter-menu-trigger-icon-hover)}.udex-filter-menu__trigger-active .udex-filter-menu__trigger-icon{transform:rotate(180deg);color:var(--udex-filter-menu-trigger-icon-active)}.udex-filter-menu__trigger-active .udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-active)}.udex-filter-menu__search{width:100%}.udex-filter-menu__footer{width:100%;display:flex;gap:10px}.udex-filter-menu__badge{margin-inline-start:var(--udexSpacer4, 4px)}[ui5-popover]{border:var(--udex-filter-menu-popover-border-width) solid var(--udex-filter-menu-popover-border-color);border-radius:var(--udex-filter-menu-popover-border-radius);box-shadow:var(--udex-filter-menu-popover-shadow);min-width:var(--udex-filter-menu-popover-min-width);max-width:var(--udex-filter-menu-popover-max-width);width:var(--udex-filter-menu-popover-width)}[ui5-popover]::part(content){padding:0;overflow:auto}[ui5-popover]::part(header),[ui5-popover]::part(footer){padding:var(--udexSpacer16, 16px) var(--udexSpacer12, 12px)}[ui5-popover]::part(footer){justify-content:flex-start;border-color:var(--sapField_BorderColor, var(--udexCoreBorderDefault));box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3))}::slotted([slot="header"]){width:100%}.udex-no-result{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 1.5);color:var(--sapContent_TitleColor, #000000);padding:0 var(--udexSpacer12, 12px) var(--udexSpacer16, 16px)}@media (width < 640px){[ui5-popover]{min-width:var(--udex-filter-menu-popover-min-width-xs);max-width:var(--udex-filter-menu-popover-max-width-xs)}}
+export default `:host{--udex-filter-menu-trigger-color-default: var(--sapTextColor, #223548);--udex-filter-menu-trigger-color-hover: var(--sapHoverColor, #0070f2);--udex-filter-menu-trigger-color-active: var(--sapShell_Active_TextColor, #0040b0);--udex-filter-menu-trigger-color-disabled: var(--sapTextColor, #223548);--udex-filter-menu-trigger-icon-default: var(--sapContent_IconColor, #223548);--udex-filter-menu-trigger-icon-hover: var(--sapHoverColor, #0070f2);--udex-filter-menu-trigger-icon-active: var(--sapSelectedColor, #0040b0);--udex-filter-menu-trigger-icon-disabled: var(--sapContent_IconColor, #223548);--udex-filter-menu-trigger-prefix-color-default: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-prefix-color-hover: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-prefix-color-active: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-prefix-color-disabled: var(--sapShell_NeutralColor, #475e75);--udex-filter-menu-trigger-selection-bar-background: var(--udexColorBlue8, #0057D2);--udex-filter-menu-trigger-outline-border-color: var(--udexColorBlue10, #002A86);--udex-filter-menu-popover-left-offset: 0px;--udex-filter-menu-popover-min-width-xs: calc(100% - var(--udex-filter-menu-popover-left-offset));--udex-filter-menu-popover-max-width-xs: 100%;--udex-filter-menu-popover-width: fit-content;--udex-filter-menu-popover-min-width: 320px;--udex-filter-menu-popover-max-width: 640px;--udex-filter-menu-popover-shadow: var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3));--udex-filter-menu-popover-border-color: var(--sapField_BorderColor, var(--udexCoreBorderDefault));--udex-filter-menu-popover-border-width: var(--sapElement_BorderWidth, 1px);--udex-filter-menu-popover-border-radius: var(--udexRadiusM, 8px);display:inline-block}:host([desktop]) .udex-filter-menu__trigger:focus,.udex-filter-menu__trigger:focus-visible{outline:2px solid var(--udex-filter-menu-trigger-outline-border-color);outline-offset:var(--udexSpacer2, 2px);border-radius:var(--udexRadiusM, 8px)}.udex-filter-menu__trigger{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 1.5);display:inline-flex;align-items:center;padding:5px 0;position:relative;background:none;border:none}.udex-filter-menu__trigger-wrap{cursor:pointer;display:inline-flex;align-items:center}.udex-filter-menu__trigger-wrap[disabled]{pointer-events:none}.udex-filter-menu__trigger-wrap[disabled]:hover .udex-filter-menu__trigger-name,.udex-filter-menu__trigger-wrap[disabled] .udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-disabled);opacity:var(--sapContent_DisabledOpacity, .4)}.udex-filter-menu__trigger-wrap[disabled] .udex-filter-menu__trigger-prefix{color:var(--udex-filter-menu-trigger-prefix-color-disabled)}.udex-filter-menu__trigger-wrap[disabled]:hover .udex-filter-menu__trigger-icon,.udex-filter-menu__trigger-wrap[disabled] .udex-filter-menu__trigger-icon{color:var(--udex-filter-menu-trigger-icon-disabled);opacity:var(--sapContent_DisabledOpacity, .4)}.udex-filter-menu__trigger-prefix{margin-right:var(--udexSpacer8, 8px);color:var(--udex-filter-menu-trigger-prefix-color-default)}.udex-filter-menu__trigger-wrap:hover .udex-filter-menu__trigger-prefix{color:var(--udex-filter-menu-trigger-prefix-color-hover)}.udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-default)}.udex-filter-menu__trigger:before{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;border-radius:2px 2px 0;background:var(--udex-filter-menu-trigger-selection-bar-background);opacity:0}.udex-filter-menu__trigger-active .udex-filter-menu__trigger-prefix{color:var(--udex-filter-menu-trigger-prefix-color-active)}.udex-filter-menu__trigger-active:before{opacity:1}.udex-filter-menu__trigger-icon{width:16px;height:16px;margin-inline-start:var(--udexSpacer8, 8px);color:var(--udex-filter-menu-trigger-icon-default)}.udex-filter-menu__trigger-wrap:hover .udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-hover)}.udex-filter-menu__trigger-wrap:hover .udex-filter-menu__trigger-icon{color:var(--udex-filter-menu-trigger-icon-hover)}.udex-filter-menu__trigger-active .udex-filter-menu__trigger-icon{transform:rotate(180deg);color:var(--udex-filter-menu-trigger-icon-active)}.udex-filter-menu__trigger-active .udex-filter-menu__trigger-name{color:var(--udex-filter-menu-trigger-color-active)}.udex-filter-menu__search{width:100%}.udex-filter-menu__footer{width:100%;display:flex;gap:10px}.udex-filter-menu__badge{margin-inline-start:var(--udexSpacer4, 4px)}[ui5-popover]{border:var(--udex-filter-menu-popover-border-width) solid var(--udex-filter-menu-popover-border-color);border-radius:var(--udex-filter-menu-popover-border-radius);box-shadow:var(--udex-filter-menu-popover-shadow);min-width:var(--udex-filter-menu-popover-min-width);max-width:var(--udex-filter-menu-popover-max-width);width:var(--udex-filter-menu-popover-width)}[ui5-popover]::part(content){padding:0;overflow:auto}[ui5-popover]::part(header),[ui5-popover]::part(footer){padding:var(--udexSpacer16, 16px) var(--udexSpacer12, 12px)}[ui5-popover]::part(footer){justify-content:flex-start;border-color:var(--sapField_BorderColor, var(--udexCoreBorderDefault));box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3))}::slotted([slot="header"]){width:100%}:host([show-search-input]) .udex-no-result{padding:0 var(--udexSpacer12, 12px) var(--udexSpacer16, 16px)}.udex-no-result{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 1.5);color:var(--sapContent_TitleColor, #000000);padding:var(--udexSpacer16, 16px) var(--udexSpacer12, 12px) var(--udexSpacer16, 16px)}@media (width < 640px){[ui5-popover]{min-width:var(--udex-filter-menu-popover-min-width-xs);max-width:var(--udex-filter-menu-popover-max-width-xs)}}
 `

package/src/generated/themes/HeroBanner.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udexHeroBannerMinHeight: 200px;--udexHeroBannerHeight: auto;--udexHeroBannerBackgroundImageObjectFit: contain;--udexHeroBannerVerticalLayoutBackgroundImageAlignment: bottom right;--udexHeroBannerHorizontalLayoutBackgroundImageAlignment: top right;--udexHeroBannerBackroundImageZIndex: 1;--udexHeroBannerBackroundVideoZIndex: 1;--udexHeroBannerContentZIndex: 2;--udexHeroBannerContentPaddingHorizontal: var(--udexGridXSMargins, 24px);--udexHeroBannerContentPaddingVertical: var(--udexGridXSMargins, 24px);--udexHeroBannerContentPaddingVerticalXLtoM: var(--udexSpacer56, 56px);--udexHeroBannerPaddingHorizontalLandM: var(--udexSpacer72);--udexHeroBannerPaddingHorizontalS: var(--udexSpacer48);--udexHeroBannerPaddingHorizontalXS: var(--udexSpacer24);--udexHeroBannerBackgroundVideoColor: trasparent;--udexHeroBannerContainerPosition: relative;--udexHeroBannerSlotMaxHeight: calc(100% - (2 * var(--udexHeroBannerContentPaddingHorizontal)));--udex-hero-banner-container-xl-max-width: 1432px;--udex-hero-banner-container-l-max-width: 1456px}.udex-hero-banner{position:relative;container-type:inline-size;min-height:var(--udexHeroBannerMinHeight, 200px);height:var(--udexHeroBannerHeight, auto)}.udex-hero-banner__container{position:var(--udexHeroBannerContainerPosition);max-width:var(--udex-hero-banner-container-xl-max-width);padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexSpacer84);margin:0 auto;height:100%;box-sizing:border-box}.udex-hero-banner--video{color:var(--udexColorNeutralWhite);justify-content:center}.udex-hero-banner__background-image{position:absolute;width:100%;height:100%;object-fit:var(--udexHeroBannerBackgroundImageObjectFit, contain);object-position:var(--udexHeroBannerVerticalLayoutBackgroundImageAlignment, bottom right);z-index:var(--udexHeroBannerBackroundImageZIndex, 1);top:0;left:0}.udex-hero-banner__background-video-wrapper{position:relative;width:100%;padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexSpacer84);height:100%;box-sizing:border-box}.udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image{display:none}.udex-hero-banner__media-button:dir(rtl){left:0;right:initial}.udex-hero-banner__media-button:hover{cursor:pointer;background:var(--udexColorNeutralBlack70)}.udex-hero-banner__media-button ui5-icon{color:var(--udexColorNeutralWhite);display:flex;align-items:center;justify-content:center;height:1.5rem;width:1.5rem}.udex-hero-banner__background-image:dir(rtl),.udex-hero-banner__background-video-overlay:dir(rtl){transform:scaleX(-1)}.udex-hero-banner__background-video,.udex-hero-banner__background-video-overlay,.udex-hero-banner__media-button{display:none}#udex-hero-banner__content,#udex-hero-banner__additionalContent{position:relative;display:flex;max-height:var(--udexHeroBannerSlotMaxHeight);flex-basis:100%;flex-grow:1;z-index:var(--udexHeroBannerContentZIndex, 2);padding:0}.udex-hero-banner__content-container{display:flex;gap:var(--udexSpacer48, 48px);padding:0}#udex-hero-banner__content,#udex-hero-banner__additionalContent{height:var(--udexHeroBannerHeight, auto)}@media (max-width: 1599px){.udex-hero-banner__container{padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexHeroBannerPaddingHorizontalLandM);max-width:var(--udex-hero-banner-container-l-max-width)}.udex-hero-banner__background-video-wrapper{padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexHeroBannerPaddingHorizontalLandM)}}@media (max-width: 979px){.udex-hero-banner__container{padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalS);max-width:100%}.udex-hero-banner__content-container{display:flex;flex-direction:column;gap:var(--udexSpacer32, 32px)}.udex-hero-banner__background-video-wrapper{padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalS);background-color:var(--udexHeroBannerBackgroundVideoColor)}.udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image{display:block}.udex-hero-banner,#udex-hero-banner__content,#udex-hero-banner__additionalContent{height:auto}}@media (max-width: 639px){.udex-hero-banner__container{max-width:100%;padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalXS)}.udex-hero-banner__background-video-wrapper{padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalXS)}.udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image{display:none}}@media (min-width: 980px){.udex-hero-banner--video{height:28.125rem}.udex-hero-banner__media-button{border:3px solid var(--udexColorNeutralWhite);color:var(--udexColorNeutralWhite);background:var(--udexColorNeutralBlack40);display:flex;justify-content:center;align-items:center;border-radius:50%;padding:0;width:3rem;height:3rem;position:absolute;bottom:0;right:0;margin:var(--udexHeroBannerContentPaddingHorizontal);z-index:3}.udex-hero-banner__background-video{position:absolute;display:block;width:100%;object-fit:cover;object-position:center;height:100%;top:0;left:0}.udex-hero-banner__background-video-overlay{position:absolute;display:block;width:100%;height:100%;background:linear-gradient(90deg,rgba(18,23,28,.765) 0%,rgba(18,23,28,.09) 100%);top:0;left:0}.udex-hero-banner__background-image{object-position:var(--udexHeroBannerHorizontalLayoutBackgroundImageAlignment, top right)}}
+export default `:host{--udexHeroBannerMinHeight: 200px;--udexHeroBannerHeight: auto;--udexHeroBannerBackgroundImageObjectFit: contain;--udexHeroBannerVerticalLayoutBackgroundImageAlignment: bottom right;--udexHeroBannerHorizontalLayoutBackgroundImageAlignment: top right;--udexHeroBannerBackroundImageZIndex: 1;--udexHeroBannerBackroundVideoZIndex: 1;--udexHeroBannerContentZIndex: 2;--udexHeroBannerContentPaddingHorizontal: var(--udexGridXSMargins, 24px);--udexHeroBannerContentPaddingVertical: 40px;--udexHeroBannerContentPaddingVerticalXLtoM: var(--udexSpacer56, 56px);--udexHeroBannerPaddingHorizontalLandM: var(--udexSpacer72);--udexHeroBannerPaddingVerticalBottomS: var(--udexSpacer48);--udexHeroBannerPaddingVerticalBottomXS: var(--udexSpacer48);--udexHeroBannerPaddingHorizontalS: var(--udexSpacer48);--udexHeroBannerPaddingHorizontalXS: var(--udexSpacer24);--udexHeroBannerBackgroundVideoColor: trasparent;--udexHeroBannerContainerPosition: relative;--udexHeroBannerSlotMaxHeight: calc(100% - (2 * var(--udexHeroBannerContentPaddingHorizontal)));--udex-hero-banner-container-xl-max-width: 1432px;--udex-hero-banner-container-l-max-width: 1456px}.udex-hero-banner{position:relative;container-type:inline-size;min-height:var(--udexHeroBannerMinHeight, 200px);height:var(--udexHeroBannerHeight, auto)}.udex-hero-banner__container{position:var(--udexHeroBannerContainerPosition);max-width:var(--udex-hero-banner-container-xl-max-width);padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexSpacer84);margin:0 auto;height:100%;box-sizing:border-box}.udex-hero-banner--video{color:var(--udexColorNeutralWhite);justify-content:center}.udex-hero-banner__background-image{position:absolute;width:100%;height:100%;object-fit:var(--udexHeroBannerBackgroundImageObjectFit, contain);object-position:var(--udexHeroBannerVerticalLayoutBackgroundImageAlignment, bottom right);z-index:var(--udexHeroBannerBackroundImageZIndex, 1);top:0;left:0}.udex-hero-banner__background-video-wrapper{position:relative;width:100%;padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexSpacer84);height:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center}.udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image{display:none}.udex-hero-banner__background-image:dir(rtl),.udex-hero-banner__background-video-overlay:dir(rtl){transform:scaleX(-1)}#udex-hero-banner__content,#udex-hero-banner__additionalContent{position:relative;display:flex;max-height:var(--udexHeroBannerSlotMaxHeight);flex-basis:100%;flex-grow:1;z-index:var(--udexHeroBannerContentZIndex, 2);padding:0}.udex-hero-banner__content-container{display:flex;gap:var(--udexSpacer48, 48px);padding:0}#udex-hero-banner__content,#udex-hero-banner__additionalContent{height:var(--udexHeroBannerHeight, auto)}.udex-hero-banner--video{height:28.125rem}.udex-hero-banner__media-button{border:none;display:flex;justify-content:center;align-items:center;border-radius:50%;padding:0;width:3rem;height:3rem;position:absolute;bottom:var(--udexSpacer48);right:var(--udexSpacer84);z-index:3;overflow:hidden;cursor:pointer}.udex-hero-banner__media-button:before{content:"";position:absolute;inset:0;background:var(--udexColorNeutralBlack);opacity:.8;border-radius:50%;z-index:-1}.udex-hero-banner__media-button:dir(rtl){left:var(--udexSpacer84);right:auto}.udex-hero-banner__media-button:hover [ui5-icon]{color:var(--udexColorGrey4)}.udex-hero-banner__media-button [ui5-icon]{color:var(--udexColorNeutralWhite);height:100%;width:100%}.udex-hero-banner__background-video{position:absolute;display:block;width:100%;object-fit:cover;object-position:center;height:100%;top:0;left:0}.udex-hero-banner__background-video-overlay{position:absolute;display:block;width:100%;height:100%;background:linear-gradient(90deg,rgba(18,23,28,.765) 0%,rgba(18,23,28,.09) 100%);top:0;left:0}.udex-hero-banner__background-image{object-position:var(--udexHeroBannerHorizontalLayoutBackgroundImageAlignment, top right)}@media (max-width: 1599px){.udex-hero-banner__container{padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexHeroBannerPaddingHorizontalLandM);max-width:var(--udex-hero-banner-container-l-max-width)}.udex-hero-banner__background-video-wrapper{padding:var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexHeroBannerPaddingHorizontalLandM)}.udex-hero-banner__media-button{right:var(--udexSpacer72)}.udex-hero-banner__media-button:dir(rtl){left:var(--udexSpacer72)}}@media (max-width: 979px){.udex-hero-banner__background-video,.udex-hero-banner__background-video-overlay,.udex-hero-banner__media-button{display:none}.udex-hero-banner__container{padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalS);max-width:100%}.udex-hero-banner__content-container{display:flex;flex-direction:column;gap:var(--udexSpacer32, 32px)}.udex-hero-banner__background-video-wrapper{padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalS) var(--udexHeroBannerPaddingVerticalBottomS);background-color:var(--udexHeroBannerBackgroundVideoColor)}.udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image{display:block}.udex-hero-banner,#udex-hero-banner__content,#udex-hero-banner__additionalContent{height:auto}}@media (max-width: 639px){.udex-hero-banner__container{max-width:100%;padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalXS)}.udex-hero-banner__background-video-wrapper{padding:var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalXS) var(--udexHeroBannerPaddingVerticalBottomXS)}.udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image{display:none}}
 `

package/src/generated/themes/Modal.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udex-modal-and-overlay-modal-content-padding-horizontal: var(--udexGridSGutters, 32px);--udex-modal-and-overlay-modal-content-padding-vertical: var(--udexGridXSMargins, 24px);--udex-modal-and-overlay-modal-footer-padding-horizontal: var(--udexGridSGutters, 32px);--udex-modal-and-overlay-modal-footer-padding-vertical: var(--udexGridXSMargins, 24px);--udex-modal-and-overlay-modal-header-padding-horizontal: var(--udexGridSGutters, 32px);--udex-modal-and-overlay-modal-header-padding-vertical: var(--udexGridXSMargins, 24px);--udex-modal-border-radius: 20px;--udex-modal-browser-scrollbar-border-radius: var(--udexRadiusM, 8px);--udex-modal-block-layer-background: color-mix(in oklch, transparent, var(--sapBlockLayer_Background) 60%)}:host .ui5-block-layer{background:var(--udex-modal-block-layer-background)}:host .ui5-popup-root .ui5-popup-footer-root{padding:var(--udex-modal-and-overlay-modal-footer-padding-vertical) var(--udex-modal-and-overlay-modal-footer-padding-horizontal)}:host,:host .ui5-popup-root{border-radius:var(--udex-modal-border-radius)}:host .ui5-popup-root .ui5-popup-header-root{padding:var(--udex-modal-and-overlay-modal-header-padding-vertical) var(--udex-modal-and-overlay-modal-header-padding-horizontal)}:host .ui5-popup-root .ui5-popup-content{padding:var(--udex-modal-and-overlay-modal-content-padding-vertical) calc(var(--udex-modal-and-overlay-modal-content-padding-horizontal) - var(--sapScrollBar_Dimension, 12px)) var(--udex-modal-and-overlay-modal-content-padding-vertical) var(--udex-modal-and-overlay-modal-content-padding-horizontal);scrollbar-gutter:stable}:host([type="basic"]){--sapObjectHeader_BorderColor: transparent;--sapPageFooter_BorderColor: transparent}:host([type="basic"]) .ui5-popup-root .ui5-popup-content{padding:0 calc(var(--udex-modal-and-overlay-modal-content-padding-horizontal) - var(--sapScrollBar_Dimension, 12px)) 0 var(--udex-modal-and-overlay-modal-content-padding-horizontal);scrollbar-gutter:stable}:host ::slotted([slot="header"][ui5-bar]){height:32px}:host ::slotted([slot="footer"]){height:auto}@media (max-width: 979px){:host(:not([type="basic"])){max-width:100%;max-height:100%}}
+export default `:host{--udex-modal-and-overlay-modal-content-padding-horizontal: var(--udexGridSGutters, 32px);--udex-modal-and-overlay-modal-content-padding-vertical: var(--udexGridXSMargins, 24px);--udex-modal-and-overlay-modal-footer-padding-horizontal: var(--udexGridSGutters, 32px);--udex-modal-and-overlay-modal-footer-padding-vertical: var(--udexGridXSMargins, 24px);--udex-modal-and-overlay-modal-header-padding-horizontal: var(--udexGridSGutters, 32px);--udex-modal-and-overlay-modal-header-padding-vertical: var(--udexGridXSMargins, 24px);--udex-modal-border-radius: 20px;--udex-modal-browser-scrollbar-border-radius: var(--udexRadiusM, 8px);--udex-modal-block-layer-background: color-mix(in oklch, transparent, var(--sapBlockLayer_Background) 60%)}:host .ui5-block-layer{background:var(--udex-modal-block-layer-background)}:host .ui5-popup-root .ui5-popup-footer-root{padding:var(--udex-modal-and-overlay-modal-footer-padding-vertical) var(--udex-modal-and-overlay-modal-footer-padding-horizontal)}:host,:host .ui5-popup-root{border-radius:var(--udex-modal-border-radius)}:host .ui5-popup-root .ui5-popup-header-root{padding:var(--udex-modal-and-overlay-modal-header-padding-vertical) var(--udex-modal-and-overlay-modal-header-padding-horizontal)}:host .ui5-popup-root .ui5-popup-content{padding:var(--udex-modal-and-overlay-modal-content-padding-vertical) calc(var(--udex-modal-and-overlay-modal-content-padding-horizontal) - var(--sapScrollBar_Dimension, 12px)) var(--udex-modal-and-overlay-modal-content-padding-vertical) var(--udex-modal-and-overlay-modal-content-padding-horizontal);scrollbar-gutter:stable}:host([type="basic"]){--sapObjectHeader_BorderColor: transparent;--sapPageFooter_BorderColor: transparent}:host([type="basic"]) .ui5-popup-root .ui5-popup-content{padding:0 calc(var(--udex-modal-and-overlay-modal-content-padding-horizontal) - var(--sapScrollBar_Dimension, 12px)) 0 var(--udex-modal-and-overlay-modal-content-padding-horizontal);scrollbar-gutter:stable}:host ::slotted([slot="header"][ui5-bar]){height:32px}:host ::slotted([slot="footer"]){height:auto}@media (max-width: 979px){:host(:not([type="basic"])){min-width:100%;min-height:100%;--udex-modal-border-radius: 0}}
 `

package/src/generated/themes/RatingIndicator.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udex_rating_indicator_readonly_item_width: 1rem;--udex_rating_indicator_readonly_item_height: 1rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: var(--udexSpacer8);--udex-rating_indicator_mobile_items_gap: var(--udexSpacer2);--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey4 ,#A9B4BE);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_total_count_color: var(--sapTextColor, #223548);--udex-rating_indicator_rating_font_size: 18px;--udex-rating_indicator_rating_line_height: 27px}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-32-0_rating_indicator_component_spacing);cursor:pointer}:host([disabled]){opacity:var(--udex_rating_indicator_disabled_opacity);cursor:initial;outline:none}:host([readonly]){cursor:initial}:host([disabled]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_width);padding-inline:0}:host([readonly]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_readonly_item_width);height:var(--udex_rating_indicator_readonly_item_height);padding-inline:0}:host([disabled]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_disabled-unrated_color)}:host([readonly]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_read-only-unrated_color)}:host([_focused]){outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);outline-offset:.125rem;border-radius:.25rem}[ui5-icon]{display:flex;text-shadow:var(--sapContent_TextShadow)}.udex-rating-indicator{font-family:var(--sapFontFamily);font-size:var(--sapFontSize, 16px);padding:0;outline:none;position:relative;display:inline-flex;align-items:center}.udex-rating-indicator__total{color:var(--udex-rating_indicator_total_count_color);font-size:var(--udex-rating_indicator_rating_font_size);line-height:var(--udex-rating_indicator_rating_line_height);padding-inline-start:var(--udexSpacer12)}.udex-rating-indicator__list{list-style-type:none;display:flex;align-items:center;margin:0;padding:0}.udex-rating-indicator__item{position:relative;width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_items_gap)}.udex-rating-indicator__item [ui5-icon]{width:100%;height:100%;color:inherit;user-select:none}.udex-rating-indicator__item.udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_color)}.udex-rating-indicator__item.udex-rating-indicator__item-sel,.udex-rating-indicator__item.udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_color)}.udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{position:absolute;inset-inline-start:50%;color:var(--udex-rating_indicator_rated_color)}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-sel,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__half-icon,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_hover_color)}:host(:not([readonly]):not([disabled])) .ui5-rating-indicator-root:hover{opacity:1}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_hover_color)}.udex-rating-indicator__half-icon-wrapper{width:100%;height:100%;position:absolute;inset-inline-start:-50%;top:0;z-index:32;overflow:hidden}.udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator--mobile .udex-rating-indicator__item{padding:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel,:host([disabled]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel{padding-left:var(--udex_rating_indicator_mobile_item_padding);padding-right:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:6px;width:16px;left:2px}.udex-rating-indicator--mobile .udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_mobile_items_gap)}
+export default `:host{--udex_rating_indicator_readonly_item_width: 1rem;--udex_rating_indicator_readonly_item_height: 1rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: var(--udexSpacer8);--udex-rating_indicator_mobile_items_gap: var(--udexSpacer2);--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey4 ,#A9B4BE);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_total_count_color: var(--sapTextColor, #223548);--udex-rating_indicator_rating_font_size: 18px;--udex-rating_indicator_rating_line_height: 27px}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-32-1_rating_indicator_component_spacing);cursor:pointer}:host([disabled]){opacity:var(--udex_rating_indicator_disabled_opacity);cursor:initial;outline:none}:host([readonly]){cursor:initial}:host([disabled]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_width);padding-inline:0}:host([readonly]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_readonly_item_width);height:var(--udex_rating_indicator_readonly_item_height);padding-inline:0}:host([disabled]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_disabled-unrated_color)}:host([readonly]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_read-only-unrated_color)}:host([_focused]){outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);outline-offset:.125rem;border-radius:.25rem}[ui5-icon]{display:flex;text-shadow:var(--sapContent_TextShadow)}.udex-rating-indicator{font-family:var(--sapFontFamily);font-size:var(--sapFontSize, 16px);padding:0;outline:none;position:relative;display:inline-flex;align-items:center}.udex-rating-indicator__total{color:var(--udex-rating_indicator_total_count_color);font-size:var(--udex-rating_indicator_rating_font_size);line-height:var(--udex-rating_indicator_rating_line_height);padding-inline-start:var(--udexSpacer12)}.udex-rating-indicator__list{list-style-type:none;display:flex;align-items:center;margin:0;padding:0}.udex-rating-indicator__item{position:relative;width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_items_gap)}.udex-rating-indicator__item [ui5-icon]{width:100%;height:100%;color:inherit;user-select:none}.udex-rating-indicator__item.udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_color)}.udex-rating-indicator__item.udex-rating-indicator__item-sel,.udex-rating-indicator__item.udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_color)}.udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{position:absolute;inset-inline-start:50%;color:var(--udex-rating_indicator_rated_color)}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-sel,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__half-icon,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_hover_color)}:host(:not([readonly]):not([disabled])) .ui5-rating-indicator-root:hover{opacity:1}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_hover_color)}.udex-rating-indicator__half-icon-wrapper{width:100%;height:100%;position:absolute;inset-inline-start:-50%;top:0;z-index:32;overflow:hidden}.udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator--mobile .udex-rating-indicator__item{padding:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel,:host([disabled]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel{padding-left:var(--udex_rating_indicator_mobile_item_padding);padding-right:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:6px;width:16px;left:2px}.udex-rating-indicator--mobile .udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_mobile_items_gap)}
 `

package/src/generated/themes/SecondaryNavigationItem.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udex-secondary-navigation-item-color: var(--sapTextColor, #223548);--udex-secondary-navigation-item-hover-color: var(--udexColorBlue8, #0057D2);--udex-secondary-navigation-item-active-color: var(--udexColorBlue9, #0040B0);--udex-secondary-navigation-item-font-size: var(--udexTypographyBodyXSFontSize, 14px);--udex-secondary-navigation-item-mobile-font-size: var(--udexTypographyBodySFontSize, 16px);--udex-secondary-navigation-item-line-height: 1.1;--udex-secondary-navigation-item-active-border-color: var(--udexColorBlue7, #0070f2);--udex-secondary-navigation-item-dropdown-shadow: 0 10px 30px 0 #22364940;--udex-secondary-navigation-item-dropdown-background: #FFF;--udex-secondary-navigation-item-title-min-height: 64px;--udex-secondary-navigation-item-dropdown-min-width: 240px;--udex-secondary-navigation-item-dropdown-max-width: 360px;--udex-secondary-navigation-item-dropdown-max-height: 100%;--udex-secondary-navigation-item-mobile-dropdown-shadow: 0 2px 8px 0 var(--udexColorGrey2, #EAECEE);--udex-secondary-navigation-item-mobile-heading-shadow: 0 2px 4px 0 var(--udexColorGrey2, #EAECEE);--udex-secondary-navigation-item-mobile-title-color: var(--udexColorGrey9, #223548);--udex-secondary-navigation-item-mobile-title-font-size: var(--udexTypographyBodySFontSize, 16px);--udex-secondary-navigation-item-mobile-title-line-height: var(--udexTypographyHeadingLineHeight, 1.1);--udex-secondary-navigation-item-mobile-title-font-weight: var(--udexTypographyFontWeightMedium, 500)}.udex-secondary-navigation__dropdown-list{padding:var(--udexSpacer12) 0;margin:0;list-style:none}.udex-secondary-navigation__item{color:var(--udex-secondary-navigation-item-color);font-family:var(--sapFontFamily);font-size:var(--udex-secondary-navigation-item-font-size);line-height:var(--udex-secondary-navigation-item-line-height);display:flex;align-items:flex-start;height:100%;text-decoration:none;background:none;cursor:pointer;border:none;padding:0;white-space:nowrap}.udex-secondary-navigation__item:focus{outline:none}:host([desktop]) .udex-secondary-navigation__item:focus,.udex-secondary-navigation__item:focus-visible{outline:var(--udexRadiusXXS) solid var(--udexColorBlue10);border-radius:var(--udexRadiusXXS)}.udex-secondary-navigation__item:hover .udex-secondary-navigation__item-icon,.udex-secondary-navigation__item:hover{color:var(--udex-secondary-navigation-item-hover-color)}.udex-secondary-navigation__item:active .udex-secondary-navigation__item-icon,.udex-secondary-navigation__item:active{color:var(--udex-secondary-navigation-item-active-color)}[active].udex-secondary-navigation__item:before{border-radius:var(--udexRadiusXXS) var(--udexRadiusXXS) 0 0;background:var(--udex-secondary-navigation-item-active-border-color);content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px}:host([is-open]) .udex-secondary-navigation__item-icon{transform:rotateX(180deg)}.udex-secondary-navigation__item-icon{margin-inline-start:var(--udexSpacer4);transition:.25s transform;max-width:16px;height:16px}.udex-secondary-navigation__dropdown,.udex-secondary-navigation__dropdown[data-horizontal-align=left]:dir(rtl){position:absolute;top:100%;margin-top:1px;left:calc(var(--udexSpacer16) * -1);right:auto;box-shadow:var(--udex-secondary-navigation-item-dropdown-shadow);min-width:var(--udex-secondary-navigation-item-dropdown-min-width);max-width:var(--udex-secondary-navigation-item-dropdown-max-width);background:var(--udex-secondary-navigation-item-dropdown-background)}.udex-secondary-navigation__dropdown[data-horizontal-align=right]{left:auto;right:calc(var(--udexSpacer16) * -1)}.udex-secondary-navigation__dropdown:dir(rtl){right:calc(var(--udexSpacer16) * -1);left:auto}.udex-secondary-navigation__item-sub-title{display:none}.udex-secondary-navigation__item-text-wrap{display:flex;align-items:center;white-space:nowrap}@media (max-width: 979px){:host{width:100%;min-height:100%}.udex-secondary-navigation__item-icon{transform:translateY(-50%);position:absolute;right:0;top:50%;width:22px;max-width:22px;height:22px;margin:0}.udex-secondary-navigation__item-icon:dir(rtl){right:auto;left:0}.udex-secondary-navigation__dropdown{position:relative;box-shadow:none;min-width:initial;max-width:initial;left:initial;margin-top:initial;top:initial;overflow-y:auto;max-height:calc(var(--udex-secondary-navigation-item-dropdown-max-height) - var(--udexSpacer24))}.udex-secondary-navigation__dropdown:dir(rtl){right:0}.udex-secondary-navigation__item{font-size:var(--udex-secondary-navigation-item-mobile-font-size);font-weight:var(--udex-secondary-navigation-item-mobile-title-font-weight);color:var(--udex-secondary-navigation-item-mobile-title-color);box-shadow:var(--udex-secondary-navigation-item-mobile-heading-shadow);background:var(--udex-secondary-navigation-item-dropdown-background);padding:var(--udexSpacer12) var(--udexSpacer48);position:relative;box-sizing:border-box;white-space:normal;min-height:var(--udex-secondary-navigation-item-title-min-height);width:100%;z-index:1;display:flex;align-items:center;height:fit-content}.udex-secondary-navigation__item-sub-title{font-family:var(--sapFontFamily);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);font-weight:400;display:block}.udex-secondary-navigation__dropdown{border-radius:0 0 var(--udexRadiusM) var(--udexRadiusM);box-shadow:var(--udex-secondary-navigation-item-mobile-dropdown-shadow)}[active].udex-secondary-navigation__item:before{display:none}:host([desktop]) .udex-secondary-navigation__item:focus{outline:none}:host([desktop]) .udex-secondary-navigation__item:focus-visible,.udex-secondary-navigation__item:focus-visible{outline-offset:calc(var(--udexSpacer4) * -1);outline:var(--udexRadiusXXS) solid var(--udexColorBlue10)}:host([is-open]) .udex-secondary-navigation__item-icon{transform:translateY(-50%) rotateX(180deg)}.udex-secondary-navigation__item-text-wrap{display:flex;align-items:baseline;flex-direction:column;white-space:normal;position:relative;text-align:left;width:100%;padding-inline-end:42px;gap:6px}.udex-secondary-navigation__item-text-wrap:dir(rtl){align-items:flex-start;text-align:right}.udex-secondary-navigation__item:hover .udex-secondary-navigation__item-icon,.udex-secondary-navigation__item:hover{color:var(--udex-secondary-navigation-item-color)}}@media (max-width: 639px){.udex-secondary-navigation__item{padding:var(--udexSpacer12) var(--udexSpacer24)}}
+export default `:host{--udex-secondary-navigation-item-color: var(--sapTextColor, #223548);--udex-secondary-navigation-item-hover-color: var(--udexColorBlue8, #0057D2);--udex-secondary-navigation-item-active-color: var(--udexColorBlue9, #0040B0);--udex-secondary-navigation-item-font-size: var(--udexTypographyBodyXSFontSize, 14px);--udex-secondary-navigation-item-mobile-font-size: var(--udexTypographyBodySFontSize, 16px);--udex-secondary-navigation-item-line-height: 1.1;--udex-secondary-navigation-item-active-border-color: var(--udexColorBlue7, #0070f2);--udex-secondary-navigation-item-dropdown-shadow: 0 10px 30px 0 #22364940;--udex-secondary-navigation-item-dropdown-background: #FFF;--udex-secondary-navigation-item-title-min-height: 64px;--udex-secondary-navigation-item-dropdown-min-width: 240px;--udex-secondary-navigation-item-dropdown-max-width: 360px;--udex-secondary-navigation-item-dropdown-max-height: 100%;--udex-secondary-navigation-item-mobile-dropdown-shadow: 0 2px 8px 0 var(--udexColorGrey2, #EAECEE);--udex-secondary-navigation-item-mobile-heading-shadow: 0 2px 4px 0 var(--udexColorGrey2, #EAECEE);--udex-secondary-navigation-item-mobile-title-color: var(--udexColorGrey9, #223548);--udex-secondary-navigation-item-mobile-title-font-size: var(--udexTypographyBodySFontSize, 16px);--udex-secondary-navigation-item-mobile-title-line-height: var(--udexTypographyHeadingLineHeight, 1.1);--udex-secondary-navigation-item-mobile-title-font-weight: var(--udexTypographyFontWeightMedium, 500)}.udex-secondary-navigation__dropdown-list{padding:var(--udexSpacer12) 0;margin:0;list-style:none}.udex-secondary-navigation__item{color:var(--udex-secondary-navigation-item-color);font-family:var(--sapFontFamily);font-size:var(--udex-secondary-navigation-item-font-size);line-height:var(--udex-secondary-navigation-item-line-height);display:flex;align-items:flex-start;height:100%;text-decoration:none;background:none;cursor:pointer;border:none;padding:0;white-space:nowrap}.udex-secondary-navigation__item:focus{outline:none}:host([desktop]) .udex-secondary-navigation__item:focus,.udex-secondary-navigation__item:focus-visible{outline:var(--udexRadiusXXS) solid var(--udexColorBlue10);border-radius:var(--udexRadiusXXS)}.udex-secondary-navigation__item:hover .udex-secondary-navigation__item-icon,.udex-secondary-navigation__item:hover{color:var(--udex-secondary-navigation-item-hover-color)}.udex-secondary-navigation__item:active .udex-secondary-navigation__item-icon,.udex-secondary-navigation__item:active{color:var(--udex-secondary-navigation-item-active-color)}[active].udex-secondary-navigation__item:before{border-radius:var(--udexRadiusXXS) var(--udexRadiusXXS) 0 0;background:var(--udex-secondary-navigation-item-active-border-color);content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px}:host([is-open]) .udex-secondary-navigation__item-icon{transform:rotateX(180deg)}.udex-secondary-navigation__item-icon{margin-inline-start:var(--udexSpacer4);transition:.25s transform;max-width:16px;height:16px}.udex-secondary-navigation__dropdown,.udex-secondary-navigation__dropdown[data-horizontal-align=left]:dir(rtl){position:absolute;top:100%;margin-top:1px;left:calc(var(--udexSpacer16) * -1);right:auto;box-shadow:var(--udex-secondary-navigation-item-dropdown-shadow);min-width:var(--udex-secondary-navigation-item-dropdown-min-width);max-width:var(--udex-secondary-navigation-item-dropdown-max-width);background:var(--udex-secondary-navigation-item-dropdown-background)}.udex-secondary-navigation__dropdown[data-horizontal-align=right]{left:auto;right:calc(var(--udexSpacer16) * -1)}.udex-secondary-navigation__dropdown:dir(rtl){right:calc(var(--udexSpacer16) * -1);left:auto}.udex-secondary-navigation__item-sub-title{display:none}.udex-secondary-navigation__item-text-wrap{display:flex;align-items:center;white-space:nowrap}@media (max-width: 979px){:host{width:100%;min-height:100%}.udex-secondary-navigation__item-icon{transform:translateY(-50%);position:absolute;right:0;top:50%;width:22px;max-width:22px;height:22px;margin:0}.udex-secondary-navigation__item-icon:dir(rtl){right:auto;left:0}.udex-secondary-navigation__dropdown{position:relative;box-shadow:none;min-width:initial;max-width:initial;left:initial;margin-top:initial;top:initial;overflow-y:auto;max-height:calc(var(--udex-secondary-navigation-item-dropdown-max-height) - var(--udexSpacer24))}.udex-secondary-navigation__dropdown:dir(rtl){right:0}.udex-secondary-navigation__item{font-size:var(--udex-secondary-navigation-item-mobile-font-size);font-weight:var(--udex-secondary-navigation-item-mobile-title-font-weight);color:var(--udex-secondary-navigation-item-mobile-title-color);box-shadow:var(--udex-secondary-navigation-item-mobile-heading-shadow);background:var(--udex-secondary-navigation-item-dropdown-background);padding:var(--udexSpacer12) var(--udexSpacer48);position:relative;box-sizing:border-box;white-space:normal;min-height:var(--udex-secondary-navigation-item-title-min-height);width:100%;z-index:1;display:flex;align-items:center;height:fit-content}.udex-secondary-navigation__item-sub-title{font-family:var(--sapFontFamily);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);font-weight:400;display:block}.udex-secondary-navigation__dropdown{border-radius:0 0 var(--udexRadiusM) var(--udexRadiusM);box-shadow:var(--udex-secondary-navigation-item-mobile-dropdown-shadow)}[active].udex-secondary-navigation__item:before{display:none}:host([desktop]) .udex-secondary-navigation__item:focus{outline:none}:host([desktop]) .udex-secondary-navigation__item:focus-visible,.udex-secondary-navigation__item:focus-visible{outline-offset:calc(var(--udexSpacer4) * -1);outline:var(--udexRadiusXXS) solid var(--udexColorBlue10)}:host([is-open]) .udex-secondary-navigation__item-icon{transform:translateY(-50%) rotateX(180deg)}.udex-secondary-navigation__item-text-wrap{display:flex;align-items:baseline;flex-direction:column;white-space:normal;position:relative;text-align:left;width:100%;padding-inline-end:42px;gap:6px}.udex-secondary-navigation__item-text-wrap:dir(rtl){align-items:flex-start;text-align:right}.udex-secondary-navigation__item:hover .udex-secondary-navigation__item-icon,.udex-secondary-navigation__item:hover{color:var(--udex-secondary-navigation-item-color)}.udex-secondary-navigation__dropdown-list{padding:var(--udexSpacer16) 0}}@media (max-width: 639px){.udex-secondary-navigation__item{padding:var(--udexSpacer12) var(--udexSpacer24)}}
 `

package/src/generated/themes/Slider.css.ts

@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 
 registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@" + "s" + "a" + "p" + "u" + "d" + "e" + "x" + "/" + "w" + "e" + "b" + "-" + "c" + "o" + "m" + "p" + "o" + "n" + "e" + "n" + "t" + "s", "sap_horizon", async () => defaultTheme);
-export default `:host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-32-0_range_slider_handle_background_focus)}:host .ui5-slider-inner .ui5-slider-labels{top:34px}:host .ui5-slider-inner .ui5-slider-labels li{height:1.375rem;font-family:var(--sapFontFamily);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px)}[slider-icon]{color:var(--udex-slider-color-handle-default-icon)}.ui5-slider-root:focus .ui5-slider-inner .ui5-slider-handle,.ui5-slider-handle:focus{border:var(--udex-slider-handle-focus-border)}.ui5-slider-labels li{color:var(--udex-slider-label-color)}.ui5-slider-tickmarks li{border-inline-start:1px solid var(--udex-slider-tickmark-bg)}.ui5-slider-tickmarks li.ui5-slider-tickmark-in-range{border-inline-start:1px solid var(--udex-slider-tickmark-in-range-bg)}:host(:not([hidden])) .ui5-slider-handle-container .ui5-slider-tooltip{bottom:var(--udex-slider-tooltip-bottom);border:var(--udex-slider-tooltip-border);border-radius:var(--udex-slider-tooltip-border-radius);font-size:var(--udex-slider-tooltip-font-size);color:var(--udex-slider-tooltip-color);height:var(--udex-slider-tooltip-height);min-width:var(--udex-slider-tooltip-min-width)}[slider-icon]{width:var(--udex-slider-handle-icon-size);height:var(--udex-slider-handle-icon-size)}.ui5-slider-progress-container:after{background-color:var(--udex-slider-progress-after-background)}.ui5-slider-progress-container:before{inset-inline-start:var(--udex-slider-start-end-point-left)}.ui5-slider-progress-container:after{inset-inline-end:var(--udex-slider-start-end-point-right)}.ui5-slider-handle-container{margin-inline-start:calc(-1 * var(--udex-slider-handle-width) / 2);top:var(--udex-slider-handle-top)}.ui5-slider-handle{height:var(--udex-slider-handle-height);width:var(--udex-slider-handle-width)}
+export default `:host{--udex-slider-color-track-start-point: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-track-active: var(--sapSlider_Selected_Background, #0070f2);--udex-slider-color-handle-focus-range: var(--sapSlider_Selected_BorderColor, #0070f2);--udex-slider-color-handle-active-background: var(--sapSlider_Active_HandleBackground, #ffffff);--udex-slider-color-handle-default-icon: var(--sapContent_Selected_ForegroundColor, #0040b0);--udex-slider-radius-range-size: var(--udexRadiusM, 8px);--udex-slider-handle-width: 2.75rem;--udex-slider-handle-top: -.875rem;--udex-slider-handle-height: var(--udexSpacer32, 2rem);--udex-slider-start-end-point-left: -.875rem;--udex-slider-start-end-point-right: -.875rem;--udex-slider-progress-after-background: var(--sapContent_MeasureIndicatorColor,#5b738b);--udex-slider-handle-icon-size: var(--udexSpacer20, 1.25rem);--udex-slider-tooltip-bottom: 2.5rem;--udex-slider-tooltip-border: 1px solid var(--sapField_BorderColor, #5B738B);--udex-slider-tooltip-border-radius: var(--udexSpacer4, .25rem);--udex-slider-tooltip-font-size: var(--udexTypographyNavigationRegularMFontSize,14px);--udex-slider-tooltip-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-tooltip-height: var(--udexSpacer32, 2rem);--udex-slider-tooltip-min-width: 2.75rem;--udex-slider-tickmark-in-range-bg: var(--sapSlider_Selected_BorderColor,#0070f2);--udex-slider-tickmark-bg: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-label-color: var(--sapContent_MeasureIndicatorColor, #5b738b);--udex-slider-handle-focus-border: 2px solid var(--sapSlider_Active_HandleBorderColor);--udex-slider-progress-focus-top: -1.18rem;--udex-slider-progress-focus-left:calc(-1.375rem - 5px);--udex-slider-progress-focus-height: 42px;--udex-slider-progress-focus-width:calc(100% + 2.75rem + 10px)}:host{font-family:var(--sapFontFamily);font-weight:var(--udexTypographyFontWeightRegular, 400);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 1.1);color:var(--sapContent_MeasureIndicatorColor, #5b738b);height:74px}.ui5-slider-progress-container:before{background-color:var(--udex-slider-color-track-start-point)}.ui5-slider-progress{background-color:var(--udex-slider-color-track-active)}.ui5-slider-progress:focus:after{border:2px solid var(--udex-slider-color-handle-focus-range);border-radius:var(--udex-slider-radius-range-size);top:var(--udex-slider-progress-focus-top);height:var(--udex-slider-progress-focus-height);width:var(--udex-slider-progress-focus-width);left:var(--udex-slider-progress-focus-left)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v2-32-1_range_slider_handle_background_focus)}:host .ui5-slider-inner .ui5-slider-labels{top:34px}:host .ui5-slider-inner .ui5-slider-labels li{height:1.375rem;font-family:var(--sapFontFamily);font-size:var(--udexTypographyNavigationRegularMFontSize, 14px)}[slider-icon]{color:var(--udex-slider-color-handle-default-icon)}.ui5-slider-root:focus .ui5-slider-inner .ui5-slider-handle,.ui5-slider-handle:focus{border:var(--udex-slider-handle-focus-border)}.ui5-slider-labels li{color:var(--udex-slider-label-color)}.ui5-slider-tickmarks li{border-inline-start:1px solid var(--udex-slider-tickmark-bg)}.ui5-slider-tickmarks li.ui5-slider-tickmark-in-range{border-inline-start:1px solid var(--udex-slider-tickmark-in-range-bg)}:host(:not([hidden])) .ui5-slider-handle-container .ui5-slider-tooltip{bottom:var(--udex-slider-tooltip-bottom);border:var(--udex-slider-tooltip-border);border-radius:var(--udex-slider-tooltip-border-radius);font-size:var(--udex-slider-tooltip-font-size);color:var(--udex-slider-tooltip-color);height:var(--udex-slider-tooltip-height);min-width:var(--udex-slider-tooltip-min-width)}[slider-icon]{width:var(--udex-slider-handle-icon-size);height:var(--udex-slider-handle-icon-size)}.ui5-slider-progress-container:after{background-color:var(--udex-slider-progress-after-background)}.ui5-slider-progress-container:before{inset-inline-start:var(--udex-slider-start-end-point-left)}.ui5-slider-progress-container:after{inset-inline-end:var(--udex-slider-start-end-point-right)}.ui5-slider-handle-container{margin-inline-start:calc(-1 * var(--udex-slider-handle-width) / 2);top:var(--udex-slider-handle-top)}.ui5-slider-handle{height:var(--udex-slider-handle-height);width:var(--udex-slider-handle-width)}
 `

package/src/themes/FilterMenu.css

@@ -179,13 +179,17 @@
   width: 100%;
 }
 
+:host([show-search-input]) .udex-no-result {
+  padding: 0 var(--udexSpacer12, 12px) var(--udexSpacer16, 16px);
+}
+
 .udex-no-result {
   font-family: var(--sapFontFamily);
   font-weight: var(--udexTypographyFontWeightRegular, 400);
   font-size: var(--udexTypographyBodyXSFontSize, 14px);
   line-height: var(--udexTypographyBodyLineHeight, 1.5);
   color: var(--sapContent_TitleColor, #000000);
-  padding: 0 var(--udexSpacer12, 12px) var(--udexSpacer16, 16px);
+  padding: var(--udexSpacer16, 16px) var(--udexSpacer12, 12px) var(--udexSpacer16, 16px);
 }
 
 @media (width < 640px) {

package/src/themes/HeroBanner.css

@@ -8,9 +8,11 @@
   --udexHeroBannerBackroundVideoZIndex: 1;
   --udexHeroBannerContentZIndex: 2;
   --udexHeroBannerContentPaddingHorizontal: var(--udexGridXSMargins, 24px);
-  --udexHeroBannerContentPaddingVertical: var(--udexGridXSMargins, 24px);
+  --udexHeroBannerContentPaddingVertical: 40px;
   --udexHeroBannerContentPaddingVerticalXLtoM: var(--udexSpacer56, 56px);
   --udexHeroBannerPaddingHorizontalLandM: var(--udexSpacer72);
+  --udexHeroBannerPaddingVerticalBottomS: var(--udexSpacer48);
+  --udexHeroBannerPaddingVerticalBottomXS: var(--udexSpacer48);
   --udexHeroBannerPaddingHorizontalS: var(--udexSpacer48);
   --udexHeroBannerPaddingHorizontalXS: var(--udexSpacer24);
   --udexHeroBannerBackgroundVideoColor: trasparent;
@@ -58,41 +60,20 @@
   padding: var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexSpacer84);
   height: 100%;
   box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
 }
 
 .udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image {
   display: none;
 }
 
-.udex-hero-banner__media-button:dir(rtl) {
-  left: 0;
-  right: initial;
-}
-
-.udex-hero-banner__media-button:hover {
-  cursor: pointer;
-  background: var(--udexColorNeutralBlack70);
-}
-
-.udex-hero-banner__media-button ui5-icon {
-  color: var(--udexColorNeutralWhite);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 1.5rem;
-  width: 1.5rem;
-}
 .udex-hero-banner__background-image:dir(rtl),
 .udex-hero-banner__background-video-overlay:dir(rtl) {
   transform: scaleX(-1);
 }
 
-.udex-hero-banner__background-video,
-.udex-hero-banner__background-video-overlay,
-.udex-hero-banner__media-button {
-  display: none;
-}
-
 #udex-hero-banner__content,
 #udex-hero-banner__additionalContent {
   position: relative;
@@ -115,6 +96,77 @@
   height: var(--udexHeroBannerHeight, auto);
 }
 
+.udex-hero-banner--video {
+  height: 28.125rem; /* 450px */
+}
+
+.udex-hero-banner__media-button {
+  border: none;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 50%;
+  padding: 0;
+  width: 3rem;
+  height: 3rem;
+  position: absolute;
+  bottom: var(--udexSpacer48);
+  right: var(--udexSpacer84);
+  z-index: 3;
+  overflow: hidden;
+  cursor: pointer;
+}
+
+.udex-hero-banner__media-button:before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background: var(--udexColorNeutralBlack);
+  opacity: 0.8;
+  border-radius: 50%;
+  z-index: -1;
+}
+
+.udex-hero-banner__media-button:dir(rtl) {
+  left: var(--udexSpacer84);
+  right: auto;
+}
+
+.udex-hero-banner__media-button:hover [ui5-icon] {
+  color: var(--udexColorGrey4);
+}
+
+.udex-hero-banner__media-button [ui5-icon] {
+  color: var(--udexColorNeutralWhite);
+  height: 100%;
+  width: 100%;
+}
+
+.udex-hero-banner__background-video {
+  position: absolute;
+  display: block;
+  width: 100%;
+  object-fit: cover;
+  object-position: center;
+  height: 100%;
+  top: 0;
+  left: 0;
+}
+
+.udex-hero-banner__background-video-overlay {
+  position: absolute;
+  display: block;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg, rgba(18, 23, 28, 0.765) 0%, rgba(18, 23, 28, 0.09) 100%);
+  top: 0;
+  left: 0;
+}
+
+.udex-hero-banner__background-image {
+  object-position: var(--udexHeroBannerHorizontalLayoutBackgroundImageAlignment, top right);
+}
+
 @media (max-width: 1599px) {
   .udex-hero-banner__container {
     padding: var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexHeroBannerPaddingHorizontalLandM);
@@ -124,9 +176,23 @@
   .udex-hero-banner__background-video-wrapper {
     padding: var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexHeroBannerPaddingHorizontalLandM);
   }
+
+  .udex-hero-banner__media-button {
+    right: var(--udexSpacer72);
+  }
+
+  .udex-hero-banner__media-button:dir(rtl) {
+    left: var(--udexSpacer72);
+  }
 }
 
 @media (max-width: 979px) {
+  .udex-hero-banner__background-video,
+  .udex-hero-banner__background-video-overlay,
+  .udex-hero-banner__media-button {
+    display: none;
+  }
+
   .udex-hero-banner__container {
     padding: var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalS);
     max-width: 100%;
@@ -139,7 +205,7 @@
   }
 
   .udex-hero-banner__background-video-wrapper {
-    padding: var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalS);
+    padding: var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalS) var(--udexHeroBannerPaddingVerticalBottomS);
     background-color: var(--udexHeroBannerBackgroundVideoColor);
   }
 
@@ -161,59 +227,10 @@
   }
 
   .udex-hero-banner__background-video-wrapper {
-    padding: var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalXS);
+    padding: var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalXS) var(--udexHeroBannerPaddingVerticalBottomXS);
   }
 
   .udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image {
     display: none;
   }
 }
-
-@media (min-width: 980px) {
-  .udex-hero-banner--video {
-    height: 28.125rem; /* 450px */
-  }
-
-  .udex-hero-banner__media-button {
-    border: 3px solid var(--udexColorNeutralWhite);
-    color: var(--udexColorNeutralWhite);
-    background: var(--udexColorNeutralBlack40);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border-radius: 50%;
-    padding: 0;
-    width: 3rem;
-    height: 3rem;
-    position: absolute;
-    bottom: 0;
-    right: 0;
-    margin: var(--udexHeroBannerContentPaddingHorizontal);
-    z-index: 3;
-  }
-
-  .udex-hero-banner__background-video {
-    position: absolute;
-    display: block;
-    width: 100%;
-    object-fit: cover;
-    object-position: center;
-    height: 100%;
-    top: 0;
-    left: 0;
-  }
-
-  .udex-hero-banner__background-video-overlay {
-    position: absolute;
-    display: block;
-    width: 100%;
-    height: 100%;
-    background: linear-gradient(90deg, rgba(18, 23, 28, 0.765) 0%, rgba(18, 23, 28, 0.09) 100%);
-    top: 0;
-    left: 0;
-  }
-
-  .udex-hero-banner__background-image {
-    object-position: var(--udexHeroBannerHorizontalLayoutBackgroundImageAlignment, top right);
-  }
-}

package/src/themes/Modal.css

@@ -52,7 +52,8 @@
 
 @media (max-width: 979px) {
   :host(:not([type="basic"])) {
-    max-width: 100%;
-    max-height: 100%;
+    min-width: 100%;
+    min-height: 100%;
+    --udex-modal-border-radius: 0;
   }
 }

package/src/themes/SecondaryNavigationItem.css

@@ -190,7 +190,6 @@
     display: none;
   }
 
-
   :host([desktop]) .udex-secondary-navigation__item:focus {
     outline: none;
   }
@@ -226,6 +225,10 @@
   .udex-secondary-navigation__item:hover {
     color: var(--udex-secondary-navigation-item-color);
   }
+
+  .udex-secondary-navigation__dropdown-list {
+    padding: var(--udexSpacer16) 0;
+  }
 }
 
 @media (max-width: 639px) {

package/dist/generated/templates/HeroBannerTemplate.lit.d.ts

@@ -1,3 +0,0 @@
-import type HeroBanner from "../../HeroBanner.js";
-declare function template(this: HeroBanner): import("lit-html").TemplateResult;
-export default template;

package/dist/generated/templates/HeroBannerTemplate.lit.js

@@ -1,15 +0,0 @@
-/* eslint no-unused-vars: 0 */
-import { html, ifDefined, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
-import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
-function block0(context, tags, suffix) { return html `<div class="${ifDefined(this.heroBannerClasses)}" part="wrapper" style="background-color: ${ifDefined(this.wrapperBackgroundColor)}; ${ifDefined(this.wrapperBackgroundImage)}">${this.hasBackgroundVideo ? block1.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix)}</div>${this.hasMediaContent ? block8.call(this, context, tags, suffix) : undefined} `; }
-function block1(context, tags, suffix) { return suffix ? html `<div class="udex-hero-banner__background-video-wrapper" tabindex="0" @keydown="${this._handleKeydown}"><video ?autoplay="${this.shouldVideoAutoplay}" muted loop playsinline part="background-video" class="udex-hero-banner__background-video" alt="${ifDefined(this.backgroundVideoLabel)}"><source src="${ifDefined(this.backgroundVideo)}" type="video/mp4" /></video><div class="udex-hero-banner__background-video-overlay"></div>${this.hasBackgroundImage ? block2.call(this, context, tags, suffix) : undefined}<div class="udex-hero-banner__content-container"><slot id="udex-hero-banner__content" name="content" part="content"></slot><slot id="udex-hero-banner__additionalContent" name="additionalContent" part="additionalContent"></slot></div><button class="udex-hero-banner__media-button" aria-label="Play / Pause button" role="button" @click="${this._toggleMediaButton}"><${scopeTag("ui5-icon", tags, suffix)} name="${ifDefined(this.mediaButtonIconName)}"></${scopeTag("ui5-icon", tags, suffix)}></button></div>` : html `<div class="udex-hero-banner__background-video-wrapper" tabindex="0" @keydown="${this._handleKeydown}"><video ?autoplay="${this.shouldVideoAutoplay}" muted loop playsinline part="background-video" class="udex-hero-banner__background-video" alt="${ifDefined(this.backgroundVideoLabel)}"><source src="${ifDefined(this.backgroundVideo)}" type="video/mp4" /></video><div class="udex-hero-banner__background-video-overlay"></div>${this.hasBackgroundImage ? block2.call(this, context, tags, suffix) : undefined}<div class="udex-hero-banner__content-container"><slot id="udex-hero-banner__content" name="content" part="content"></slot><slot id="udex-hero-banner__additionalContent" name="additionalContent" part="additionalContent"></slot></div><button class="udex-hero-banner__media-button" aria-label="Play / Pause button" role="button" @click="${this._toggleMediaButton}"><ui5-icon name="${ifDefined(this.mediaButtonIconName)}"></ui5-icon></button></div>`; }
-function block2(context, tags, suffix) { return html `<picture><img loading="${ifDefined(this.backgroundImageLoadingStrategy)}" src="${ifDefined(this.backgroundImage)}" part="background-image" class="udex-hero-banner__background-image" alt="${ifDefined(this.backgroundImageLabel)}" /></picture>`; }
-function block3(context, tags, suffix) { return html `<div class="udex-hero-banner__container">${this.hasCustomBackgroundPicture ? block4.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix)}<div class="udex-hero-banner__content-container"><slot id="udex-hero-banner__content" name="content" part="content"></slot>${this.hasAdditionalContent ? block7.call(this, context, tags, suffix) : undefined}</div></div>`; }
-function block4(context, tags, suffix) { return html `<slot name="backgroundPicture"></slot>`; }
-function block5(context, tags, suffix) { return html `${this.hasBackgroundImage ? block6.call(this, context, tags, suffix) : undefined}`; }
-function block6(context, tags, suffix) { return html `<picture><img loading="${ifDefined(this.backgroundImageLoadingStrategy)}" src="${ifDefined(this.backgroundImage)}" part="background-image" class="udex-hero-banner__background-image" alt="${ifDefined(this.backgroundImageLabel)}" /></picture>`; }
-function block7(context, tags, suffix) { return html `<slot id="udex-hero-banner__additionalContent" name="additionalContent" part="additionalContent"></slot>`; }
-function block8(context, tags, suffix) { return html `<slot id="udex-hero-banner__mediaContent" name="mediaContent" part="mediaContent"></slot>`; }
-function template() { return block0.call(this, this, this.constructor.tagsToScope, getCustomElementsScopingSuffix()); }
-export default template;
-//# sourceMappingURL=HeroBannerTemplate.lit.js.map

package/dist/generated/templates/HeroBannerTemplate.lit.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HeroBannerTemplate.lit.js","sourceRoot":"","sources":["../../../src/generated/templates/HeroBannerTemplate.lit.ts"],"names":[],"mappings":"AAAA,8BAA8B;AAC9B,OAAO,EAAE,IAAI,EAAmC,SAAS,EAAc,QAAQ,EAAE,MAAM,sDAAsD,CAAC;AAC9I,OAAO,EAAE,8BAA8B,EAAE,MAAM,0DAA0D,CAAC;AAK1G,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,eAAe,SAAS,CAAC,IAAI,CAAC,iBAAiB,CAAC,6CAA6C,SAAS,CAAC,IAAI,CAAC,sBAAsB,CAAC,KAAK,SAAS,CAAC,IAAI,CAAC,sBAAsB,CAAC,KAAM,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAE,SAAU,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,GAAG,CAAC,CAAA,CAAC;AAC9e,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,kFAAkF,IAAI,CAAC,cAAc,uBAAuB,IAAI,CAAC,mBAAmB,oGAAoG,SAAS,CAAC,IAAI,CAAC,oBAAoB,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC,8FAA+F,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,kVAAkV,IAAI,CAAC,kBAAkB,MAAM,QAAQ,CAAC,UAAU,EAAE,IAAI,EAAE,MAAM,CAAC,UAAU,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,QAAQ,CAAC,UAAU,EAAE,IAAI,EAAE,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAA,kFAAkF,IAAI,CAAC,cAAc,uBAAuB,IAAI,CAAC,mBAAmB,oGAAoG,SAAS,CAAC,IAAI,CAAC,oBAAoB,CAAC,kBAAkB,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC,8FAA+F,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,kVAAkV,IAAI,CAAC,kBAAkB,qBAAqB,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,8BAA8B,CAAC,CAAA,CAAC;AACjjE,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,0BAA0B,SAAS,CAAC,IAAI,CAAC,8BAA8B,CAAC,UAAU,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC,6EAA6E,SAAS,CAAC,IAAI,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,CAAA,CAAC;AACrW,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,4CAA6C,IAAI,CAAC,0BAA0B,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAE,8HAA+H,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,cAAc,CAAC,CAAA,CAAC;AACpf,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,wCAAwC,CAAC,CAAA,CAAC;AAC3J,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,GAAI,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,SAAU,EAAE,CAAC,CAAA,CAAC;AACxM,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,0BAA0B,SAAS,CAAC,IAAI,CAAC,8BAA8B,CAAC,UAAU,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC,6EAA6E,SAAS,CAAC,IAAI,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,CAAA,CAAC;AACrW,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,0GAA0G,CAAC,CAAA,CAAC;AAC7N,SAAS,MAAM,CAAoB,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,2FAA2F,CAAC,CAAA,CAAC;AAE9M,SAAS,QAAQ,KAAqB,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAG,IAAI,CAAC,WAAiC,CAAC,WAAW,EAAE,8BAA8B,EAAE,CAAC,CAAC,CAAC,CAAC;AAC9J,eAAe,QAAQ,CAAC","sourcesContent":["/* eslint no-unused-vars: 0 */\nimport { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getCustomElementsScopingSuffix } from \"@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js\";\nimport type UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type HeroBanner from \"../../HeroBanner.js\";\nimport type { ClassMapValue } from \"@ui5/webcomponents-base/dist/types.js\";\n\t\nfunction block0 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class=\"${ifDefined(this.heroBannerClasses)}\" part=\"wrapper\" style=\"background-color: ${ifDefined(this.wrapperBackgroundColor)}; ${ifDefined(this.wrapperBackgroundImage)}\">${ this.hasBackgroundVideo ? block1.call(this, context, tags, suffix) : block3.call(this, context, tags, suffix) }</div>${ this.hasMediaContent ? block8.call(this, context, tags, suffix) : undefined } `;}\nfunction block1 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return suffix ? html`<div class=\"udex-hero-banner__background-video-wrapper\" tabindex=\"0\" @keydown=\"${this._handleKeydown}\"><video ?autoplay=\"${this.shouldVideoAutoplay}\" muted loop playsinline part=\"background-video\" class=\"udex-hero-banner__background-video\" alt=\"${ifDefined(this.backgroundVideoLabel)}\"><source src=\"${ifDefined(this.backgroundVideo)}\" type=\"video/mp4\" /></video><div class=\"udex-hero-banner__background-video-overlay\"></div>${ this.hasBackgroundImage ? block2.call(this, context, tags, suffix) : undefined }<div class=\"udex-hero-banner__content-container\"><slot id=\"udex-hero-banner__content\" name=\"content\" part=\"content\"></slot><slot id=\"udex-hero-banner__additionalContent\" name=\"additionalContent\" part=\"additionalContent\"></slot></div><button class=\"udex-hero-banner__media-button\" aria-label=\"Play / Pause button\" role=\"button\" @click=\"${this._toggleMediaButton}\"><${scopeTag(\"ui5-icon\", tags, suffix)} name=\"${ifDefined(this.mediaButtonIconName)}\"></${scopeTag(\"ui5-icon\", tags, suffix)}></button></div>` : html`<div class=\"udex-hero-banner__background-video-wrapper\" tabindex=\"0\" @keydown=\"${this._handleKeydown}\"><video ?autoplay=\"${this.shouldVideoAutoplay}\" muted loop playsinline part=\"background-video\" class=\"udex-hero-banner__background-video\" alt=\"${ifDefined(this.backgroundVideoLabel)}\"><source src=\"${ifDefined(this.backgroundVideo)}\" type=\"video/mp4\" /></video><div class=\"udex-hero-banner__background-video-overlay\"></div>${ this.hasBackgroundImage ? block2.call(this, context, tags, suffix) : undefined }<div class=\"udex-hero-banner__content-container\"><slot id=\"udex-hero-banner__content\" name=\"content\" part=\"content\"></slot><slot id=\"udex-hero-banner__additionalContent\" name=\"additionalContent\" part=\"additionalContent\"></slot></div><button class=\"udex-hero-banner__media-button\" aria-label=\"Play / Pause button\" role=\"button\" @click=\"${this._toggleMediaButton}\"><ui5-icon name=\"${ifDefined(this.mediaButtonIconName)}\"></ui5-icon></button></div>`;}\nfunction block2 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<picture><img loading=\"${ifDefined(this.backgroundImageLoadingStrategy)}\" src=\"${ifDefined(this.backgroundImage)}\" part=\"background-image\" class=\"udex-hero-banner__background-image\" alt=\"${ifDefined(this.backgroundImageLabel)}\" /></picture>`;}\nfunction block3 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class=\"udex-hero-banner__container\">${ this.hasCustomBackgroundPicture ? block4.call(this, context, tags, suffix) : block5.call(this, context, tags, suffix) }<div class=\"udex-hero-banner__content-container\"><slot id=\"udex-hero-banner__content\" name=\"content\" part=\"content\"></slot>${ this.hasAdditionalContent ? block7.call(this, context, tags, suffix) : undefined }</div></div>`;}\nfunction block4 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot name=\"backgroundPicture\"></slot>`;}\nfunction block5 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.hasBackgroundImage ? block6.call(this, context, tags, suffix) : undefined }`;}\nfunction block6 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<picture><img loading=\"${ifDefined(this.backgroundImageLoadingStrategy)}\" src=\"${ifDefined(this.backgroundImage)}\" part=\"background-image\" class=\"udex-hero-banner__background-image\" alt=\"${ifDefined(this.backgroundImageLabel)}\" /></picture>`;}\nfunction block7 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot id=\"udex-hero-banner__additionalContent\" name=\"additionalContent\" part=\"additionalContent\"></slot>`;}\nfunction block8 (this: HeroBanner, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<slot id=\"udex-hero-banner__mediaContent\" name=\"mediaContent\" part=\"mediaContent\"></slot>`;}\n\nfunction template(this: HeroBanner) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }\nexport default template;"]}