@sapudex/web-components 2.10.0 → 2.11.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: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--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: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--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(--udexColorGrey6 ,#5B738B);--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)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-10-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,: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;gap:12px;align-items:center}.udex-rating-indicator__total{color:var(--udexColorGrey6);line-height:24px}.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)}.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: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--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: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--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(--udexColorGrey6 ,#5B738B);--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)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-11-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,: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;gap:12px;align-items:center}.udex-rating-indicator__total{color:var(--udexColorGrey6);line-height:24px}.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)}.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/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-10-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-11-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)}
 `

package/src/generated/themes/Tag.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-tags-font-size: var(--udexTypographyBodyXXSFontSize, 12px);--udex-tags-medium-font-size: var(--udexTypographyBodyXSFontSize, 14px);--udex-tags-text-color: var(--udexColorGrey9, #223548);--udex-tags-min-height: 16px;--udex-tags-line-height: 18px;--udex-tags-medium-line-height: 21px;--udex-tags-icon-size: 12px;--udex-tags-icon-padding: 2px;--udex-tags-medium-icon-size: 12px;--udex-tags-radius-size: 6px;--udex-tags-text-icon-gap: 3px;--udex-tags-padding-vertical: var(--udexSpacer2, 2px);--udex-tags-padding-horizontal: var(--udexSpacer8, 8px);--udex-tags-grey-default-caption-color: var(--udexColorGrey9, #223548);--udex-tags-grey-default-background-color: var(--sapButton_TokenBackground, var(--udexColorGrey2, #EAECEE));--udex-tags-grey-hover-caption-color: var(--udexColorGrey9, #223548);--udex-tags-grey-hover-background-color: var(--udexColorGrey3, #D5DADD);--udex-tags-grey-selected-caption-color: var(--udexColorBlue8, #0057D2);--udex-tags-grey-selected-background-color: var(--udexColorBlue2, #D1EFFF);--udex-tags-grey-hover-selected-caption-color: var(--udexColorBlue9, #0040B0);--udex-tags-grey-hover-selected-background-color: var(--udexColorBlue3, #A6E0FF);--udex-tags-grey-read-only-caption-color: var(--udexColorGrey6 ,#5B738B);--udex-tags-grey-read-only-background-color: var(--sapNeutralBackground, #FFFFFF);--udex-tags-outlined-default-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-outlined-default-border-color: var(--udexColorGrey4, #A9B4BE);--udex-tags-outlined-default-border-width: 1px;--udex-tags-outlined-default-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-outlined-hover-background-color: var(--udexColorGrey1, #F5F6F7);--udex-tags-outlined-hover-border-color: var(--udexColorGrey4, #A9B4BE);--udex-tags-outlined-hover-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-outlined-selected-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-outlined-selected-border-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-selected-caption-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-hover-selected-background-color: var(--udexColorBlue1 , #EBF8FF);--udex-tags-outlined-hover-selected-border-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-hover-selected-caption-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-read-only-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-outlined-read-only-border-color: var(--udexColorGrey4, #A9B4BE);--udex-tags-outlined-read-only-caption-color: var(--udexColorGrey6 ,#5B738B);--udex-tags-text-only-default-caption-color: var(--udexColorBlue7, #0070F2);--udex-tags-text-only-hover-caption-color: var(--udexColorBlue9, #0040B0);--udex-tags-text-only-hover-selected-caption-color: var(--udexColorBlue11, #00144A);--udex-tags-text-only-read-only-caption-color: var(--udexColorGrey6, #5B738B);--udex-tags-text-only-selected-caption-color: var(--udexColorBlue10, #002A86);--udex-tags-white-default-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-white-default-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-white-hover-background-color: var(--udexColorGrey2, #EAECEE);--udex-tags-white-hover-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-white-hover-selected-background-color: var(--udexColorBlue2, #D1EFFF);--udex-tags-white-hover-selected-caption-color: var(--udexColorBlue8, #0057D2);--udex-tags-white-read-only-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-white-read-only-caption-color: var(--udexColorGrey6, #5B738B);--udex-tags-white-selected-background-color: var(--udexColorBlue1, #EBF8FF);--udex-tags-white-selected-caption-color: var(--udexColorBlue7, #0070F2)}:host([desktop]:not([read-only])) .udex-tag:focus,:host([desktop]:not([read-only])) .udex-tag__btn-icon:focus,:host(:not([read-only])) .udex-tag:focus-visible{outline:solid var(--udexSpacer2, 2px) var(--udexColorBlue9, #0040B0);outline-offset:-2px}:host([read-only]) .udex-tag:focus-visible{outline:none;box-shadow:none}.udex-tag{box-sizing:border-box;font-family:var(--sapFontFamily, sans-serif);font-size:var(--udex-tags-font-size);line-height:var(--udex-tags-line-height);color:var(--udex-tags-text-color);border-radius:var(--udex-tags-radius-size);display:inline-flex;padding:var(--udex-tags-padding-vertical) var(--udex-tags-padding-horizontal);gap:var(--udex-tags-text-icon-gap);align-items:center;overflow:hidden;position:relative;max-width:100%;cursor:pointer}.udex-tag__btn-icon{cursor:pointer;border:none;display:flex;padding:0;align-items:center;justify-content:center;border-radius:var(--udex-tags-radius-size);outline-offset:calc(var(--udexSpacer2) * -1);background:transparent;color:inherit}.udex-tag.udex-tag--nonselectable.udex-tag--has-icon{padding:var(--udexSpacer2) var(--udexSpacer8)}.udex-tag--medium{font-size:var(--udex-tags-medium-font-size);line-height:var(--udex-tags-medium-line-height)}.udex-tag__icon{padding:var(--udex-tags-icon-padding);height:var(--udex-tags-icon-size);width:var(--udex-tags-icon-size);color:inherit;flex-shrink:0}.udex-tag--medium .udex-tag__icon{padding:var(--udex-tags-icon-padding);height:var(--udex-tags-medium-icon-size);width:var(--udex-tags-medium-icon-size)}.udex-tag-grey,.udex-tag-grey.udex-tag--nonselectable,.udex-tag-grey.udex-tag--nonselectable:hover{color:var(--udex-tags-grey-default-caption-color);background-color:var(--udex-tags-grey-default-background-color)}.udex-tag-grey.udex-tag--nonselectable .udex-tag__icon:hover{background-color:var(--udex-tags-grey-hover-background-color)}.udex-tag-grey:hover{color:var(--udex-tags-grey-hover-caption-color);background-color:var(--udex-tags-grey-hover-background-color)}.udex-tag-grey.udex-tag--selected{color:var(--udex-tags-grey-selected-caption-color);background-color:var(--udex-tags-grey-selected-background-color)}.udex-tag--nonselectable{cursor:default}.udex-tag-grey.udex-tag--nonselectable,.udex-tag-grey.udex-tag--nonselectable:hover{color:var(--udex-tags-text-color)}.udex-tag-grey.udex-tag--selected:after{content:"";position:absolute;height:2px;width:100%;bottom:0;left:0;background-color:var(--udex-tags-grey-selected-caption-color)}.udex-tag-grey.udex-tag--selected:hover{color:var(--udex-tags-grey-hover-selected-caption-color);background-color:var(--udex-tags-grey-hover-selected-background-color)}.udex-tag-grey.udex-tag--selected:hover:after{background-color:var(--udex-tags-grey-hover-selected-caption-color)}.udex-tag--readonly{cursor:default}.udex-tag-grey.udex-tag--readonly:hover,.udex-tag-grey.udex-tag--readonly{color:var(--udex-tags-grey-read-only-caption-color);background-color:var(--udex-tags-grey-read-only-background-color)}.udex-tag-outlined,.udex-tag-outlined.udex-tag--nonselectable:hover{color:var(--udex-tags-outlined-default-caption-color);background-color:var(--udex-tags-outlined-default-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-default-border-color)}.udex-tag-outlined.udex-tag--nonselectable .udex-tag__icon:hover{background-color:var(--udex-tags-outlined-hover-background-color)}.udex-tag-outlined:hover{color:var(--udex-tags-outlined-hover-caption-color);background-color:var(--udex-tags-outlined-hover-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-hover-border-color)}.udex-tag-outlined.udex-tag--selected{color:var(--udex-tags-outlined-selected-caption-color);background-color:var(--udex-tags-outlined-selected-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-selected-border-color)}.udex-tag-outlined.udex-tag--selected:after{content:"";position:absolute;height:2px;width:100%;bottom:0;left:0;background-color:var(--udex-tags-outlined-selected-caption-color)}.udex-tag-outlined.udex-tag--selected:hover{color:var(--udex-tags-outlined-hover-selected-caption-color);background-color:var(--udex-tags-outlined-hover-selected-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-hover-selected-border-color)}.udex-tag-outlined.udex-tag--readonly:hover,.udex-tag-outlined.udex-tag--readonly{color:var(--udex-tags-outlined-read-only-caption-color);background-color:var(--udex-tags-outlined-read-only-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-read-only-border-color)}.udex-tag-text,.udex-tag-text.udex-tag--nonselectable.udex-tag--has-icon,.udex-tag-text.udex-tag--nonselectable:hover{color:var(--udex-tags-text-only-default-caption-color);padding:var(--udex-tags-padding-vertical) 0}.udex-tag-text .udex-tag__btn-icon{padding:var(--udexSpacer4) 0}.udex-tag-text.udex-tag--nonselectable .udex-tag__icon:hover,.udex-tag-text:hover{color:var(--udex-tags-text-only-hover-caption-color)}.udex-tag-text.udex-tag--selected{color:var(--udex-tags-text-only-selected-caption-color)}.udex-tag-text.udex-tag--selected:hover{color:var(--udex-tags-text-only-hover-selected-caption-color)}.udex-tag-text.udex-tag--readonly:hover,.udex-tag-text.udex-tag--readonly{color:var(--udex-tags-text-only-read-only-caption-color)}.udex-tag-white,.udex-tag-white.udex-tag--nonselectable:hover{color:var(--udex-tags-white-default-caption-color);background-color:var(--udex-tags-white-default-background-color)}.udex-tag-white.udex-tag--nonselectable .udex-tag__icon:hover{background-color:var(--udex-tags-white-hover-background-color)}.udex-tag-white:hover{color:var(--udex-tags-white-hover-caption-color);background-color:var(--udex-tags-white-hover-background-color)}.udex-tag-white.udex-tag--selected{color:var(--udex-tags-white-selected-caption-color);background-color:var(--udex-tags-white-selected-background-color)}.udex-tag-white.udex-tag--selected:after{content:"";position:absolute;height:2px;width:100%;bottom:0;left:0;background-color:var(--udex-tags-white-selected-caption-color)}.udex-tag-white.udex-tag--selected:hover{color:var(--udex-tags-white-hover-selected-caption-color);background-color:var(--udex-tags-white-hover-selected-background-color)}.udex-tag-white.udex-tag--selected:hover:after{background-color:var(--udex-tags-white-hover-selected-caption-color)}.udex-tag-white.udex-tag--readonly:hover,.udex-tag-white.udex-tag--readonly{color:var(--udex-tags-white-read-only-caption-color );background-color:var(--udex-tags-white-read-only-background-color)}.udex-tag__text b{font-weight:400}.udex-tag__text{overflow:hidden;text-overflow:ellipsis;max-width:100%;white-space:nowrap;min-height:var(--udex-tags-min-height)}.udex-tag--link{text-decoration:none}
+export default `:host{--udex-tags-font-size: var(--udexTypographyBodyXXSFontSize, 12px);--udex-tags-medium-font-size: var(--udexTypographyBodyXSFontSize, 14px);--udex-tags-text-color: var(--udexColorGrey9, #223548);--udex-tags-min-height: 16px;--udex-tags-line-height: 18px;--udex-tags-medium-line-height: 21px;--udex-tags-icon-size: 12px;--udex-tags-icon-color: "inherit";--udex-tags-icon-padding: var(--udexSpacer2, 2px);--udex-tags-medium-icon-size: 12px;--udex-tags-radius-size: var(--udexRadiusS, 6px);--udex-tags-text-icon-gap: 3px;--udex-tags-padding-vertical: var(--udexSpacer2, 2px);--udex-tags-padding-horizontal: var(--udexSpacer8, 8px);--udex-tags-grey-default-caption-color: var(--udexColorGrey9, #223548);--udex-tags-grey-default-background-color: var(--sapButton_TokenBackground, var(--udexColorGrey2, #EAECEE));--udex-tags-grey-hover-caption-color: var(--udexColorGrey9, #223548);--udex-tags-grey-hover-background-color: var(--udexColorGrey3, #D5DADD);--udex-tags-grey-selected-caption-color: var(--udexColorBlue8, #0057D2);--udex-tags-grey-selected-background-color: var(--udexColorBlue2, #D1EFFF);--udex-tags-grey-hover-selected-caption-color: var(--udexColorBlue9, #0040B0);--udex-tags-grey-hover-selected-background-color: var(--udexColorBlue3, #A6E0FF);--udex-tags-grey-read-only-caption-color: var(--udexColorGrey6 ,#5B738B);--udex-tags-grey-read-only-background-color: var(--sapNeutralBackground, #FFFFFF);--udex-tags-outlined-default-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-outlined-default-border-color: var(--udexColorGrey4, #A9B4BE);--udex-tags-outlined-default-border-width: var(--sapButton_BorderWidth);--udex-tags-outlined-default-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-outlined-hover-background-color: var(--udexColorGrey1, #F5F6F7);--udex-tags-outlined-hover-border-color: var(--udexColorGrey4, #A9B4BE);--udex-tags-outlined-hover-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-outlined-selected-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-outlined-selected-border-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-selected-caption-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-hover-selected-background-color: var(--udexColorBlue1 , #EBF8FF);--udex-tags-outlined-hover-selected-border-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-hover-selected-caption-color: var(--udexColorBlue7, #0070F2);--udex-tags-outlined-read-only-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-outlined-read-only-border-color: var(--udexColorGrey4, #A9B4BE);--udex-tags-outlined-read-only-caption-color: var(--udexColorGrey6 ,#5B738B);--udex-tags-text-only-default-caption-color: var(--udexColorBlue7, #0070F2);--udex-tags-text-only-hover-caption-color: var(--udexColorBlue9, #0040B0);--udex-tags-text-only-hover-selected-caption-color: var(--udexColorBlue11, #00144A);--udex-tags-text-only-read-only-caption-color: var(--udexColorGrey6, #5B738B);--udex-tags-text-only-selected-caption-color: var(--udexColorBlue10, #002A86);--udex-tags-white-default-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-white-default-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-white-hover-background-color: var(--udexColorGrey2, #EAECEE);--udex-tags-white-hover-caption-color: var(--udexCoreTextDark, #223548);--udex-tags-white-hover-selected-background-color: var(--udexColorBlue2, #D1EFFF);--udex-tags-white-hover-selected-caption-color: var(--udexColorBlue8, #0057D2);--udex-tags-white-read-only-background-color: var(--udexColorNeutralWhite, #FFFFFF);--udex-tags-white-read-only-caption-color: var(--udexColorGrey6, #5B738B);--udex-tags-white-selected-background-color: var(--udexColorBlue1, #EBF8FF);--udex-tags-white-selected-caption-color: var(--udexColorBlue7, #0070F2)}:host([desktop]:not([read-only])) .udex-tag:focus,:host([desktop]:not([read-only])) .udex-tag__btn-icon:focus,:host(:not([read-only])) .udex-tag:focus-visible{outline:solid var(--udexSpacer2, 2px) var(--udexColorBlue9, #0040B0);outline-offset:-2px}:host([read-only]) .udex-tag:focus-visible{outline:none;box-shadow:none}.udex-tag{box-sizing:border-box;font-family:var(--sapFontFamily, sans-serif);font-size:var(--udex-tags-font-size);line-height:var(--udex-tags-line-height);color:var(--udex-tags-text-color);border-radius:var(--udex-tags-radius-size);display:inline-flex;padding:var(--udex-tags-padding-vertical) var(--udex-tags-padding-horizontal);gap:var(--udex-tags-text-icon-gap);align-items:center;overflow:hidden;position:relative;max-width:100%;cursor:pointer}.udex-tag__btn-icon{cursor:pointer;border:none;display:flex;padding:0;align-items:center;justify-content:center;border-radius:var(--udex-tags-radius-size);outline-offset:calc(var(--udexSpacer2) * -1);background:transparent;color:inherit}.udex-tag.udex-tag--nonselectable.udex-tag--has-icon{padding:var(--udexSpacer2) var(--udexSpacer8)}.udex-tag--medium{font-size:var(--udex-tags-medium-font-size);line-height:var(--udex-tags-medium-line-height)}.udex-tag__icon{padding:var(--udex-tags-icon-padding);height:var(--udex-tags-icon-size);width:var(--udex-tags-icon-size);color:var(--udex-tags-icon-color);flex-shrink:0}.udex-tag--medium .udex-tag__icon{padding:var(--udex-tags-icon-padding);height:var(--udex-tags-medium-icon-size);width:var(--udex-tags-medium-icon-size)}.udex-tag-grey,.udex-tag-grey.udex-tag--nonselectable,.udex-tag-grey.udex-tag--nonselectable:hover{color:var(--udex-tags-grey-default-caption-color);background-color:var(--udex-tags-grey-default-background-color)}.udex-tag-grey.udex-tag--nonselectable .udex-tag__icon:hover{background-color:var(--udex-tags-grey-hover-background-color)}.udex-tag-grey:hover{color:var(--udex-tags-grey-hover-caption-color);background-color:var(--udex-tags-grey-hover-background-color)}.udex-tag-grey.udex-tag--selected{color:var(--udex-tags-grey-selected-caption-color);background-color:var(--udex-tags-grey-selected-background-color)}.udex-tag--nonselectable{cursor:default}.udex-tag-grey.udex-tag--nonselectable,.udex-tag-grey.udex-tag--nonselectable:hover{color:var(--udex-tags-text-color)}.udex-tag-grey.udex-tag--selected:hover{color:var(--udex-tags-grey-hover-selected-caption-color);background-color:var(--udex-tags-grey-hover-selected-background-color)}.udex-tag-grey.udex-tag--selected:hover:after{background-color:var(--udex-tags-grey-hover-selected-caption-color)}.udex-tag--readonly{cursor:default}.udex-tag-grey.udex-tag--readonly:hover,.udex-tag-grey.udex-tag--readonly{color:var(--udex-tags-grey-read-only-caption-color);background-color:var(--udex-tags-grey-read-only-background-color)}.udex-tag-outlined,.udex-tag-outlined.udex-tag--nonselectable:hover{color:var(--udex-tags-outlined-default-caption-color);background-color:var(--udex-tags-outlined-default-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-default-border-color)}.udex-tag-outlined.udex-tag--nonselectable .udex-tag__icon:hover{background-color:var(--udex-tags-outlined-hover-background-color)}.udex-tag-outlined:hover{color:var(--udex-tags-outlined-hover-caption-color);background-color:var(--udex-tags-outlined-hover-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-hover-border-color)}.udex-tag-outlined.udex-tag--selected{color:var(--udex-tags-outlined-selected-caption-color);background-color:var(--udex-tags-outlined-selected-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-selected-border-color)}.udex-tag-outlined.udex-tag--selected:hover{color:var(--udex-tags-outlined-hover-selected-caption-color);background-color:var(--udex-tags-outlined-hover-selected-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-hover-selected-border-color)}.udex-tag-outlined.udex-tag--readonly:hover,.udex-tag-outlined.udex-tag--readonly{color:var(--udex-tags-outlined-read-only-caption-color);background-color:var(--udex-tags-outlined-read-only-background-color);box-shadow:inset 0 0 0 var(--udex-tags-outlined-default-border-width) var(--udex-tags-outlined-read-only-border-color)}.udex-tag-text,.udex-tag-text.udex-tag--nonselectable.udex-tag--has-icon,.udex-tag-text.udex-tag--nonselectable:hover{color:var(--udex-tags-text-only-default-caption-color);padding:var(--udex-tags-padding-vertical) 0}.udex-tag-text .udex-tag__btn-icon{padding:var(--udexSpacer4) 0}.udex-tag-text.udex-tag--nonselectable .udex-tag__icon:hover,.udex-tag-text:hover{color:var(--udex-tags-text-only-hover-caption-color)}.udex-tag-text.udex-tag--selected{color:var(--udex-tags-text-only-selected-caption-color)}.udex-tag-text.udex-tag--selected:hover{color:var(--udex-tags-text-only-hover-selected-caption-color)}.udex-tag-text.udex-tag--readonly:hover,.udex-tag-text.udex-tag--readonly{color:var(--udex-tags-text-only-read-only-caption-color)}.udex-tag-white,.udex-tag-white.udex-tag--nonselectable:hover{color:var(--udex-tags-white-default-caption-color);background-color:var(--udex-tags-white-default-background-color)}.udex-tag-white.udex-tag--nonselectable .udex-tag__icon:hover{background-color:var(--udex-tags-white-hover-background-color)}.udex-tag-white:hover{color:var(--udex-tags-white-hover-caption-color);background-color:var(--udex-tags-white-hover-background-color)}.udex-tag-white.udex-tag--selected{color:var(--udex-tags-white-selected-caption-color);background-color:var(--udex-tags-white-selected-background-color)}.udex-tag-grey.udex-tag--selected:after,.udex-tag-outlined.udex-tag--selected:after,.udex-tag-white.udex-tag--selected:after{content:"";position:absolute;height:2px;width:100%;bottom:0;left:0}.udex-tag-white.udex-tag--selected:after{background-color:var(--udex-tags-white-selected-caption-color)}.udex-tag-grey.udex-tag--selected:after{background-color:var(--udex-tags-grey-selected-caption-color)}.udex-tag-outlined.udex-tag--selected:after{background-color:var(--udex-tags-outlined-selected-caption-color)}.udex-tag-white.udex-tag--selected:hover{color:var(--udex-tags-white-hover-selected-caption-color);background-color:var(--udex-tags-white-hover-selected-background-color)}.udex-tag-white.udex-tag--selected:hover:after{background-color:var(--udex-tags-white-hover-selected-caption-color)}.udex-tag-white.udex-tag--readonly:hover,.udex-tag-white.udex-tag--readonly{color:var(--udex-tags-white-read-only-caption-color );background-color:var(--udex-tags-white-read-only-background-color)}.udex-tag__text b{font-weight:400}.udex-tag__text{overflow:hidden;text-overflow:ellipsis;max-width:100%;white-space:nowrap;min-height:var(--udex-tags-min-height)}.udex-tag--link{text-decoration:none}
 `

package/src/i18n/messagebundle.properties

@@ -247,3 +247,9 @@ CONTACT_US=Contact us
 
 #Social Media Button default aria label
 SOCIAL_MEDIA_BUTTON=Social Media Button
+
+#Promo Tile default aria label
+PROMO_TILE=Promo Tile
+
+#Promo Tile Icon aria label
+PROMO_TILE_ICON=Promo Tile Icon

package/src/i18n/messagebundle_en.properties

@@ -118,3 +118,5 @@ CONTACT_US=Contact us
 SEARCH=Search
 RESULT_RETURNED=results returned.
 SOCIAL_MEDIA_BUTTON=Social Media Button
+PROMO_TILE=Promo Tile
+PROMO_TILE_ICON=Promo Tile Icon

package/src/themes/AccordionItem.css

@@ -1,20 +1,35 @@
 :host {
-  --udex-accordion-item-icon-color: var(--sapContent_MarkerIconColor, var(--udexColorBlue9));
+  --udex-accordion-item-icon-color: var(--udexColorBlue8, #0057D2);
   --udex-accordion-item-headline-color: var(--sapTitleColor, var(--udexCoreHeadingDark));
-  --udex-accordion-item-headline-font-size: var(--sapFontHeader5Size, var(--udexTypographyHeadingMediumXXXSFontSize, 18px));
+  --udex-accordion-item-headline-hover-color: var(--udexColorBlue8, #0057D2);
+  --udex-accordion-item-headline-font-size: var(--sapFontHeader5Size, var(--udexTypographyHeadingMediumXXXSFontSize, 18px)); 
+  --udex-accordion-item-headline-large-font-size: var(--sapFontHeader4Size, var(--udexTypographyHeadingMediumXXSFontSize, 20px)); 
   --udex-accordion-item-title-font-weight: var(--udexTypographyFontWeightMedium, 500);
   --udex-accordion-item-border-color: var(--sapShell_BorderColor, var(--udexColorGrey3));
   --udex-accordion-item-border-width: 1px;
   --udex-accordion-item-background-color: transparent;
-  --udex-accordion-item-hover-background-color: var(--udexColorGrey1, #F5F6F7);
-  --udex-accordion-item-header-padding: var(--udexSpacer12, 12px) var(--udexSpacer12, 12px) var(--udexSpacer12, 12px) var(--udexSpacer8, 8px);
-  --udex-accordion-item-content-margin: var(--udexSpacer12, 12px) var(--udexSpacer16, 16px);
-  --udex-accordion-item-icon-width: 42px;
-  --udex-accordion-item-icon-height: 42px;
+  --udex-accordion-item-hover-background-color: var(--udexColorNeutralWhite0, #FFFFFF00);
+  --udex-accordion-item-header-padding: var(--udexSpacer20, 20px) var(--udexSpacer16, 16px) var(--udexSpacer20, 20px) var(--udexSpacer16, 16px);
+  --udex-accordion-item-icon-width: 16px;
+  --udex-accordion-item-icon-height: 16px;
+  --udex-accordion-item-label-icon-width: 24px;
+  --udex-accordion-item-label-icon-height: 24px;
+  --udex-accordion-item-content-margin: var(--udexSpacer20, 20px) var(--udexSpacer16, 16px);
+  --udex-accordion-item-with-icon-content-margin: var(--udexSpacer20, 20px) var(--udexSpacer16, 16px) var(--udexSpacer20, 20px) calc(var(--udexSpacer16, 16px) + var(--udex-accordion-item-label-icon-width, 24px) + var(--udexSpacer12, 12px));
+  --udex-accordion-item-content-max-height: 1000px;
   font-family: var(--sapFontFamily, sans-serif);
   font-size: var(--sapProgress_FontSize, 16px);
 }
 
+:host {
+  display: block;
+}
+
+[udex-divider] {
+  --udex-divider-padding: 0;
+  --udex-divider-color: var(--udex-accordion-item-border-color);
+}
+
 .udex-accordion-item {
   list-style-type: none;
 }
@@ -32,7 +47,17 @@
   gap: var(--udexSpacer12, 12px);
   padding: var(--udex-accordion-item-header-padding);
   line-height: var(--udexTypographyHeadingLineHeight, 1.1);
-  border-bottom: var(--udex-accordion-item-border-width) solid var(--udex-accordion-item-border-color);
+}
+
+.udex-accordion-item__header--large {
+  font-size: var(--udex-accordion-item-headline-large-font-size);
+}
+
+.udex-accordion-item__header:hover {
+  color: var(--udex-accordion-item-headline-hover-color);
+}
+.udex-accordion-item__header:hover ~ [udex-divider] {
+  --udex-divider-color: var(--udex-accordion-item-headline-hover-color); 
 }
 
 .udex-accordion-item__header:hover {
@@ -45,11 +70,18 @@
   border-radius: var(--udexRadiusM, 8px);
 }
 
+.udex-accordion-item__icon:not(.udex-accordion-item__label-icon) {
+  transform: rotate(90deg);
+}
+
+:host([expanded]) .udex-accordion-item__icon:not(.udex-accordion-item__label-icon) {
+  transform: rotate(-90deg);
+}
+
 .udex-accordion-item__icon {
-  height: var(--udex-button-icon-l-size, 18px);
-  width: var(--udex-button-icon-l-size, 18px);
+  height: var(--udex-button-icon-m-size, 16px);
+  width: var(--udex-button-icon-m-size, 16px);
   color: var(--udex-accordion-item-icon-color);
-  transform: rotate(0);
 }
 
 .udex-accordion-item__icon-wrapper {
@@ -60,16 +92,13 @@
   justify-content: center;
 }
 
-:host(:dir(rtl)) .udex-accordion-item__icon {
-  transform: rotate(0);
+.udex-accordion-item__label-icon-wrapper {
+  min-width: var(--udex-accordion-item-label-icon-width);
+  height: var(--udex-accordion-item-label-icon-height);
 }
 
-:host([expanded]) .udex-accordion-item__icon {
-  transform: rotate(90deg);
-}
-
-:host([expanded]:dir(rtl)) .active .udex-accordion-item__icon {
-  transform: rotate(-90deg);
+.udex-accordion-item__icon-wrapper:not(.udex-accordion-item__label-icon-wrapper) {
+  margin-inline-start: auto;
 }
 
 .udex-accordion-item__title {
@@ -78,15 +107,25 @@
   text-align: left;
   display: flex;
   text-align: start;
+  min-height: 18px;
 }
 
 .udex-accordion-item__content {
-  display: none;
-  margin: var(--udex-accordion-item-content-margin);
+  max-height: 0;
+  overflow: hidden;
+  transition: max-height 200ms ease-in;
+}
+
+.udex-accordion-item__content-inner {
+  padding: var(--udex-accordion-item-content-margin);
+}
+
+.udex-accordion-item--with-title .udex-accordion-item__content-inner {
+  padding: var(--udex-accordion-item-with-icon-content-margin);
 }
 
 :host([expanded]) .udex-accordion-item__content {
-  display: block;
+  max-height: var(--udex-accordion-item-content-max-height);
 }
 
 .udex-accordion-item__badge {

package/src/themes/BreadcrumbsPopover.css

@@ -1,5 +1,5 @@
 :host {
-  --udex-breadcrumbs-item-color: var(--sapNeutralElementColor, var(--udexColorGrey6, #5B738B));
+  --udex-breadcrumbs-item-dropdown-color: var(--udex-breadcrumbs-item-color, var(--udexColorGrey6, #5B738B));
   --udex-breadcrumbs-current-item-color:  var(--udexCoreTextDark, #223548);
   --udex-breadcrumbs-dropdown-item-font-size:  var(--udexTypographyNavigationMediumXSFontSize, 12px);
   --udex-breadcrumbs-dropdown-item-line-height:  var(--udexTypographyNavigationLineHeight, 1.1);
@@ -28,6 +28,7 @@
 .udex-breadcrumbs__popover-content .udex-breadcrumbs__item {
   font-size: var(--udex-breadcrumbs-dropdown-item-font-size);
   line-height: var(--udex-breadcrumbs-dropdown-item-line-height);
+  color: var(--udex-breadcrumbs-item-dropdown-color);
   --udex-link-line-height: var(--udex-breadcrumbs-dropdown-item-line-height);
   --udex-link-icon-height: 12px;
   --udex-link-icon-width: 12px;

package/src/themes/CountrySelector.css

@@ -41,6 +41,10 @@
   padding-right: var(--udexSpacer12);
 }
 
+:host([hide-flag-images]) [udex-text-field]::part(textfield-input) {
+  padding-inline-start: var(--udexSpacer12);
+}
+
 .udex-country-selector__dropdown--hide-flag .udex-country-selector__trigger::after {
   left: var(--udexSpacer12);
   right: var(--udexSpacer32);

package/src/themes/Divider.css

@@ -1,5 +1,6 @@
 :host {
   --udex-divider-color: var(--udexCoreDividerLight, #D5DADD);
+  --udex-divider-padding: var(--udexSpacer2) 0;
 }
 
 .udex-divider {
@@ -8,5 +9,5 @@
 }
 
 .udex-divider-wrapper {
-  padding: var(--udexSpacer2) 0;
+  padding: var(--udex-divider-padding);
 }

package/src/themes/Footer.css

@@ -8,6 +8,10 @@
   --udex-footer-expandable-link-underline-border: var(--sapNeutralBorderColor, #A9B4BE);
   --udex-footer-link-color-heading: var(--sapShell_GroupTitleTextColor, #354A5F);
   --udex-footer-link-color: var(--sapShell_InteractiveTextColor, #354A5F);
+  --udex-footer-tagline-max-width: 235px;
+  --udex-footer-tagline-chinese-max-width: 93px;
+  --udex-footer-logo-max-width: 66px;
+  --udex-footer-logo-chinese-max-width: 139px;
 
   display: block;
   container-type: inline-size;
@@ -60,12 +64,22 @@
 }
 
 .udex-footer__logo {
+  display: flex;
+  align-items: start;
   margin-bottom: var(--udexSpacer48);
 }
 
+.udex-footer__logo a {
+  display: inline-flex;
+}
+
 .udex-footer__logo-image {
   height: 32px;
-  width: 65.6px;
+  max-width: var(--udex-footer-logo-max-width);
+}
+
+.udex-footer__logo-image-chinese {
+  width: var(--udex-footer-logo-chinese-max-width);
 }
 
 .udex-footer__contact-social,
@@ -179,7 +193,6 @@ h3 {
   line-height: var(--udexTypographyBodyLineHeight, 1.5);
   display: inline-block;
   box-sizing: border-box;
-  min-height: 38px;
 }
 
 :host([desktop]) .udex-footer a:focus,
@@ -205,6 +218,20 @@ h3 {
   color: var(--udex-footer-text-color)
 }
 
+.udex-footer__tagline-image,
+.udex-footer__tagline-image-chinese {
+  margin-inline-start: var(--udexSpacer4);
+  width: 100%;
+}
+
+.udex-footer__tagline-image-chinese {
+  max-width: var(--udex-footer-tagline-chinese-max-width);
+}
+
+.udex-footer__tagline-image {
+  max-width: var(--udex-footer-tagline-max-width);
+}
+
 @media (max-width: 1599px) {
   .udex-footer {
     padding: var(--udexSpacer72);
@@ -216,6 +243,15 @@ h3 {
 }
 
 @media (max-width: 1279px) {
+  .udex-footer__action-item {
+    --udex-accordion-item-header-padding: var(--udexSpacer16) var(--udexSpacer12) var(--udexSpacer16) var(--udexSpacer8);
+    --udex-accordion-item-content-margin: var(--udexSpacer12) var(--udexSpacer16) var(--udexSpacer12) var(--udexSpacer8);
+  }
+
+  .udex-footer__links-list li:not(:last-child) {
+    margin-bottom: var(--udexSpacer8);
+  }
+
   .udex-footer__back-to-top-button {
     top: var(--udexSpacer40);
   }
@@ -225,7 +261,7 @@ h3 {
   }
 
   .udex-footer__copyright {
-    padding-top: 0;
+    padding: var(--udexSpacer20) 0;
   }
 
   .udex-footer__content {
@@ -276,10 +312,6 @@ h3 {
 }
 
 @media (max-width: 979px) {
-  .udex-footer__copyright {
-    padding-bottom: var(--udexSpacer4);
-  }
-
   .udex-footer {
     padding: var(--udexSpacer40) var(--udexSpacer48) var(--udexSpacer120) var(--udexSpacer48);
   }
@@ -299,7 +331,7 @@ h3 {
   }
 
   .udex-footer__content {
-    gap: var(--udexSpacer16);
+    gap: var(--udexSpacer32);
   }
 
   .udex-footer__contact {
@@ -311,7 +343,6 @@ h3 {
     --udex-accordion-border-width: 1px;
     --udex-accordion-item-title-font-weight: var(--udexTypographyFontWeightRegular);
     --udex-accordion-item-headline-font-size: var(--udexTypographyHeadingRegularXXXXSFontSize);
-    --udex-accordion-item-header-padding: var(--udexSpacer4) var(--udexSpacer12) var(--udexSpacer4) var(--udexSpacer8);
     --udex-accordion-item-headline-color: var(--udex-footer-expandable-link-text-color);
     --udex-accordion-item-border-color: var(--udex-footer-expandable-link-underline-border);
     display: block;
@@ -322,6 +353,10 @@ h3 {
   .udex-footer__divider {
     display: none;
   }
+
+  .udex-footer__copyright {
+    padding: var(--udexSpacer32) 0 var(--udexSpacer20);
+  }
 }
 
 @media (max-width: 639px) {

package/src/themes/HeroBanner.css

@@ -1,12 +1,11 @@
 :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);
@@ -15,25 +14,26 @@
   --udexHeroBannerPaddingHorizontalS: var(--udexSpacer48);
   --udexHeroBannerPaddingHorizontalXS: var(--udexSpacer24);
   --udexHeroBannerBackgroundVideoColor: trasparent;
-
-  --udexHeroBannerSlotMaxHeight: calc(
-    100% - (2 * var(--udexHeroBannerContentPaddingHorizontal))
-  );
+  --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: relative;
+  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 {
@@ -46,10 +46,7 @@
   width: 100%;
   height: 100%;
   object-fit: var(--udexHeroBannerBackgroundImageObjectFit, contain);
-  object-position: var(
-    --udexHeroBannerVerticalLayoutBackgroundImageAlignment,
-    bottom right
-  );
+  object-position: var(--udexHeroBannerVerticalLayoutBackgroundImageAlignment, bottom right);
   z-index: var(--udexHeroBannerBackroundImageZIndex, 1);
   top: 0;
   left: 0;
@@ -61,10 +58,10 @@
   padding: var(--udexHeroBannerContentPaddingVerticalXLtoM) var(--udexSpacer84);
   height: 100%;
   box-sizing: border-box;
+}
 
-  .udex-hero-banner__background-image {
-    display: none;
-  }
+.udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image {
+  display: none;
 }
 
 .udex-hero-banner__media-button:dir(rtl) {
@@ -113,6 +110,11 @@
   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);
@@ -129,19 +131,26 @@
     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{
+  .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__background-image {
-      display: block;
-    }
+  .udex-hero-banner,
+  #udex-hero-banner__content,
+  #udex-hero-banner__additionalContent {
+    height: auto;
   }
 }
 
@@ -153,10 +162,10 @@
 
   .udex-hero-banner__background-video-wrapper {
     padding: var(--udexHeroBannerContentPaddingVertical) var(--udexHeroBannerPaddingHorizontalXS);
-    
-    .udex-hero-banner__background-image {
-      display: none;
-    }
+  }
+
+  .udex-hero-banner__background-video-wrapper .udex-hero-banner__background-image {
+    display: none;
   }
 }
 
@@ -199,19 +208,12 @@
     display: block;
     width: 100%;
     height: 100%;
-    background: linear-gradient(
-      90deg,
-      rgba(18, 23, 28, 0.765) 0%,
-      rgba(18, 23, 28, 0.09) 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
-    );
+    object-position: var(--udexHeroBannerHorizontalLayoutBackgroundImageAlignment, top right);
   }
-}
+}