@sapudex/web-components 0.226.1 → 0.227.0

package/dist/generated/themes/Search.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"Search.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Search.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,4BAA4B,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACzG,6BAA6B,CAAC,yBAAyB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAElG,MAAM,SAAS,GAAc,EAAC,WAAW,EAAC,yBAAyB,EAAC,QAAQ,EAAC,sBAAsB,EAAC,OAAO,EAAC;CAC3G,EAAC,CAAC;AACH,eAAe,SAAS,CAAC","sourcesContent":["import type { StyleData } from \"@ui5/webcomponents-base/dist/types.js\";\nimport { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@ui5/webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@sapudex/web-components\", \"sap_horizon\", async () => defaultTheme);\n\nconst styleData: StyleData = {packageName:\"@sapudex/web-components\",fileName:\"themes/Search.css.ts\",content:`:host{--udex-input-color-border: var(--sapField_BorderColor, var(--udexColorGrey6));--udex-input-color-label: var(--sapField_PlaceholderTextColor, var(--udexColorGrey7));--udex-input-font-family-label: var(--sapFontFamily, sans-serif);--udex-input-font-size-label: var(--sapFontLargeSize, var(--udexTypographyBodySFontSize));--udex-input-font-weight-label: var(--udexTypographyFontWeightRegular, 400);--udex-input-line-height-label: var(--udexTypographyBodyLineHeight, 24px);--udex-input-background-color: var(--sapList_Hover_Background, var(--udexColorGrey1));--udex-input-font-family-label-active: var(--sapFontFamily, sans-serif);--udex-input-font-size-label-active: var(--sapFontSmallSize, var(--udexTypographyBodyXXSFontSize));--udex-input-font-weight-label-active: var(--udexTypographyFontWeightRegular, 400);--udex-input-line-height-label-active: var(--udexTypographyBodyLineHeight, 1.5);--udex-input-color-typed-text: var(--sapField_TextColor, var(--udexCoreTextDark));--udex-input-color-background-light: var(--sapField_Background, var(--udexColorNeutralWhite));--udex-input-color-hover-border: var(--sapField_Hover_BorderColor, var(--udexColorBlue6));--udex-input-color-active-border: var(--sapField_Active_BorderColor, var(--udexColorBlue9));--udex-input-radius: var(--sapField_BorderCornerRadius, var(--udexRadiusXS));--udex-input-padding-horizontal: var(--udexSpacer12, 12px);--udex-input-padding-vertical: 8px;--udex-home-input-padding-left: var(--udexSpacer12, 12px);--udex-home-input-padding-right: var(--udexSpacer8, 8px);--udex-home-input-padding-vertical: 8px;--udex-button-size: var(--sapFontHeader2Size, 28px);--udex-button-color: var(--sapAccentColor10, var(--udexColorGrey7));--udex-button-non-interactive-icon-color: var(--sapContent_NonInteractiveIconColor, var(--udexColorGrey7));--udex-button-non-interactive-icon-size: var(--sapFontHeader5Size, 18px);--udex-dropdown-border-width: auto;--udex-search-container-padding-inline-end: var(--udexSpacer12, 12px);--udex-search-home-container-padding-inline-end: var(--udexSpacer8, 8px);--udex-search-label-inset-inline-start: var(--udexSpacer12, 12px);--udex-search-icons-column-gap: 0;--udex-search-home-icons-column-gap: var(--udexSpacer4, 4px);--udex-search-label-width: calc( 100% - var(--udex-search-label-inset-inline-start) - var(--udex-input-padding-horizontal) - var(--udex-search-container-padding-inline-end) );display:block;width:100%;position:relative}:host([mode=\"Standard\"]) .udex-search__label.udex-search__label--active{display:none}:host(:not([mode=\"Home Search\"])) .udex-search__label.udex-search__label--active.udex-search__label--animation-enabled,:host(:not([mode=\"Home Search\"])) .udex-search-prefix .udex-search__label.udex-search__label--active.udex-search__label--animation-enabled{display:block;inset-block-start:9px;line-height:18px;transform:translateY(-110%);padding:0 4px;font-family:var(--udex-input-font-family-label-active);font-size:var(--udex-input-font-size-label-active);font-weight:var(--udex-input-font-weight-label-active);line-height:var(--udex-input-line-height-label-active);background-color:#fff}:host([mode=\"Home Search\"]) .udex-search__root,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix{--udex-input-radius: var(--udexRadiusXXL, 24px);position:relative;z-index:1}:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix{display:flex;width:100%;position:relative;z-index:1}:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__prefix+.udex-search__container{border-start-start-radius:0;border-start-end-radius:var(--udexRadiusXXL, 24px);border-end-start-radius:0;border-end-end-radius:var(--udexRadiusXXL, 24px);flex-grow:1}:host([mode=\"Home Search\"]) .udex-search__root.udex-search__root--show-popover:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search__root--show-popover-top:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover-top:after{content:\"\";position:absolute;z-index:-1;height:21px;inset-inline:0;inset-block-end:0;background-color:var(--udexColorNeutralWhite, #fff);border-left:1px solid var(--udexColorGrey6, #5B738B);border-right:1px solid var(--udexColorGrey6, #5B738B);box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34, 54, 73, .3));overflow-y:hidden}:host([mode=\"Home Search\"]) .udex-search__root.udex-search__root--show-popover-top:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover-top:after,.udex-search__prefix--show-popover-top:after{transform:translateY(-21px)}:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover:after{inset-inline-start:auto;width:50px}:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover-top:after{inset-inline-start:auto;width:50px}:host([mode=\"Home Search\"]) .udex-search__container:not(.udex-search__container--has-value),:host([mode=\"Home Search\"]) .udex-search__container:not(.udex-search__container--has-value) .udex-search__field,:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__container:not(.udex-search__container--has-value),:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__container:not(.udex-search__container--has-value) .udex-search__field{background-color:var(--udex-input-background-color)}:host([mode=\"Home Search\"]) .udex-search__label.udex-search__label--active,:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__label.udex-search__label--active{display:none}.udex-search__container{padding-inline-end:var(--udex-search-container-padding-inline-end);display:flex;align-items:center;position:relative;z-index:1;border:1px solid var(--udex-input-color-border);border-radius:var(--udex-input-radius);background-color:field}.udex-search-mode-home-search .udex-search__container{padding-inline-end:var(--udex-search-home-container-padding-inline-end)}.udex-search__container:not(.udex-search__container--focus):hover{border-color:var(--udex-input-color-hover-border)}.udex-search__container--focus{border-color:var(--udex-input-color-active-border)}:host(:not([_is-touched])[active]) .udex-search__root:before{content:\"\";position:absolute;inset:-5px;border:2px solid var(--udexColorBlue10);border-radius:var(--udex-input-radius)}:host([mode=\"Home Search\"]:not([_is-touched])[active]) .udex-search__root:before{z-index:-1}.udex-search__field{display:block;width:100%;color:var(--udex-input-color-typed-text);font-size:16px;font-family:var(--sapFontFamily);line-height:24px;padding:var(--udex-input-padding-vertical) var(--udex-input-padding-horizontal);box-sizing:border-box;border:0;border-radius:var(--udex-input-radius);font-weight:var(--udexTypographyFontWeightRegular, 400);background:var(--udex-input-color-background-light)}.udex-search-mode-home-search .udex-search__field{padding:var(--udex-home-input-padding-vertical) var(--udex-home-input-padding-right) var(--udex-home-input-padding-vertical) var(--udex-home-input-padding-left)}.udex-search__field::placeholder{color:var(--udexColorGrey7);font-family:var(--sapFontFamily, sans-serif);font-size:16px}.udex-search__field:focus{outline:none}input[type=search]::-ms-clear{display:none;width:0;height:0}input[type=search]::-ms-reveal{display:none;width:0;height:0}input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}.udex-search__label{position:absolute;inset-inline-start:var(--udex-search-label-inset-inline-start);z-index:2;color:var(--udex-input-color-label);font-family:var(--udex-input-font-family-label);font-size:var(--udex-input-font-size-label);font-weight:var(--udex-input-font-weight-label);line-height:var(--udex-input-line-height-label);transition:transform .15s ease-out,font-size .15s ease-out;overflow:hidden;white-space:nowrap;max-width:var(--udex-search-label-width)}.udex-search__label-with-search-icon,.udex-search__label-with-voice-icon{max-width:calc(var(--udex-search-label-width) - var(--udex-button-size))}.udex-search__label-with-search-icon.udex-search__label-with-voice-icon{max-width:calc(var(--udex-search-label-width) - var(--udex-button-size) * 2 - var(--udex-search-icons-column-gap))}.udex-search__icons{display:flex;align-items:center;column-gap:var(--udex-search-icons-column-gap)}.udex-search-mode-home-search .udex-search__icons{column-gap:var(--udex-search-home-icons-column-gap)}.udex-search__icon{margin-inline:5px;background-color:transparent;border:none;color:var(--udex-button-non-interactive-icon-color);min-width:var(--udex-button-non-interactive-icon-size);height:var(--udex-button-non-interactive-icon-size);border-radius:50%;position:relative;z-index:1;overflow:visible}.udex-search__button{background-color:transparent;border:none;color:var(--udex-button-color);min-width:var(--udex-button-size);height:var(--udex-button-size);border-radius:50%;position:relative;z-index:1;overflow:visible}[udex-control-button]{--udex-control-button-large-height: 40px;--udex-control-button-large-width: 40px}[udex-control-button].udex-search__reset-button{--sapButton_BorderWidth: 0px 1px 0 1px}[udex-control-button].udex-search__submit-button{margin:0px calc((var(--udex-search-container-padding-inline-end)) * -1) 0px 0;--sapButton_BorderWidth: 0 0 0 1px}[ui5-button].udex-search__button::part(button):focus-visible:before{content:\"\";position:absolute;inset-block-start:0;inset-inline-start:0;width:28px;height:28px;border:2px solid var(--udexColorBlue9, #0040B0);border-radius:50%;box-sizing:border-box}[ui5-button].udex-search__button::part(button){padding:0;width:28px;height:28px;line-height:0}[ui5-icon].udex-search__button-icon{color:inherit;width:18px;height:18px}[ui5-button].udex-search__button::part(icon){width:18px;height:18px}[ui5-button].udex-search__button::part(button):after{display:none}[ui5-button].udex-search__button.udex-search__voice-button:hover{background-color:#0000001a;border:none;box-shadow:none}[ui5-button].udex-search__button.udex-search__voice-button.udex-search__voice-button--active,[ui5-button][active].udex-search__button.udex-search__voice-button{background:var(--udexColorBlue8, #0057D2);color:var(--udexColorNeutralWhite, #FFFFFF)}[ui5-button].udex-search__button:focus{outline:none}.udex-search__prefix{position:relative;z-index:1}.udex-search__prefix--show-popover:after,.udex-search__prefix--show-popover-top:after{content:\"\";position:absolute;z-index:-1;height:50%;width:50px;inset-inline-start:0;inset-block-end:0;background-color:var(--udexColorNeutralWhite, #fff);border-left:1px solid var(--udexColorGrey6, #5B738B);border-right:1px solid var(--udexColorGrey6, #5B738B);box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34, 54, 73, .3));overflow-y:hidden}.udex-search__prefix-button{padding-inline:var(--udexSpacer12) var(--udexSpacer8);display:flex;align-items:center;max-width:200px;height:100%;border:1px solid var(--udex-input-color-border);border-inline-end:0;border-start-start-radius:var(--udexRadiusXXL, 24px);border-end-start-radius:var(--udexRadiusXXL, 24px);background-color:var(--sapShell_Navigation_Active_Background, var(--udexColorGrey1));color:var(--sapContent_LabelColor, var(--udexColorGrey7));font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodySFontSize, 16px);font-weight:var(--udexTypographyFontWeightRegular, 400);line-height:var(--udexTypographyBodyLineHeight, 1.5);text-align:start;white-space:nowrap}.udex-search__prefix-button:hover{cursor:pointer;background-color:var(--udexCoreBase);color:var(--udexColorBlue8)}.udex-search__prefix-button:focus,.udex-search__prefix-button:focus-visible{outline:2px solid var(--udexColorBlue10, #002A86);outline-offset:-2px}.udex-search__prefix-button--active{background-color:var(--udexCoreBase);color:var(--udexColorBlue10)}.udex-search__prefix-label{margin-inline-end:var(--udexSpacer4, 4px);max-width:calc(100% - 20px);overflow:hidden;text-overflow:ellipsis}.udex-search__prefix-icon{width:16px;height:16px;color:inherit;flex-shrink:1}.udex-search__prefix-popover{border-start-start-radius:0;border-start-end-radius:0;border:1px solid var(--udexCoreBorderDefault);border-block-start:0;box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3));background-color:var(--udexColorNeutralWhite, #fff);clip-path:inset(0px -10px -10px -10px)}.udex-search__prefix-popover-top{border-end-start-radius:0;border-end-end-radius:0;border:1px solid var(--udexCoreBorderDefault);border-block-end:0;box-shadow:none;background-color:var(--udexColorNeutralWhite, #fff);clip-path:inset(0px -10px -10px -10px)}.udex-search__prefix-popover::part(content),.udex-search__prefix-popover-top::part(content){padding:0}[udex-dropdown]{--udex-dropdown-pane-max-width: 100%}.hidden{display:none}\n`};\nexport default styleData;\n\t"]}
+{"version":3,"file":"Search.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Search.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,4BAA4B,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACzG,6BAA6B,CAAC,yBAAyB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAElG,MAAM,SAAS,GAAc,EAAC,WAAW,EAAC,yBAAyB,EAAC,QAAQ,EAAC,sBAAsB,EAAC,OAAO,EAAC;CAC3G,EAAC,CAAC;AACH,eAAe,SAAS,CAAC","sourcesContent":["import type { StyleData } from \"@ui5/webcomponents-base/dist/types.js\";\nimport { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@ui5/webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@sapudex/web-components\", \"sap_horizon\", async () => defaultTheme);\n\nconst styleData: StyleData = {packageName:\"@sapudex/web-components\",fileName:\"themes/Search.css.ts\",content:`:host{--udex-input-color-border: var(--sapField_BorderColor, var(--udexColorGrey6));--udex-input-color-label: var(--sapField_PlaceholderTextColor, var(--udexColorGrey7));--udex-input-font-family-label: var(--sapFontFamily, sans-serif);--udex-input-font-size-label: var(--sapFontLargeSize, var(--udexTypographyBodySFontSize));--udex-input-font-weight-label: var(--udexTypographyFontWeightRegular, 400);--udex-input-line-height-label: var(--udexTypographyBodyLineHeight, 24px);--udex-input-background-color: var(--sapList_Hover_Background, var(--udexColorGrey1));--udex-input-font-family-label-active: var(--sapFontFamily, sans-serif);--udex-input-font-size-label-active: var(--sapFontSmallSize, var(--udexTypographyBodyXXSFontSize));--udex-input-font-weight-label-active: var(--udexTypographyFontWeightRegular, 400);--udex-input-line-height-label-active: var(--udexTypographyBodyLineHeight, 1.5);--udex-input-color-typed-text: var(--sapField_TextColor, var(--udexCoreTextDark));--udex-input-color-background-light: var(--sapField_Background, var(--udexColorNeutralWhite));--udex-input-color-hover-border: var(--sapField_Hover_BorderColor, var(--udexColorBlue6));--udex-input-color-active-border: var(--sapField_Active_BorderColor, var(--udexColorBlue9));--udex-input-radius: var(--sapField_BorderCornerRadius, var(--udexRadiusXS));--udex-input-padding-horizontal: var(--udexSpacer12, 12px);--udex-input-padding-vertical: 8px;--udex-home-input-padding-left: var(--udexSpacer12, 12px);--udex-home-input-padding-right: var(--udexSpacer8, 8px);--udex-home-input-padding-vertical: 8px;--udex-button-size: var(--sapFontHeader2Size, 28px);--udex-button-color: var(--sapAccentColor10, var(--udexColorGrey7));--udex-button-non-interactive-icon-color: var(--sapContent_NonInteractiveIconColor, var(--udexColorGrey7));--udex-button-non-interactive-icon-size: var(--sapFontHeader5Size, 18px);--udex-dropdown-border-width: auto;--udex-search-container-padding-inline-end: var(--udexSpacer12, 12px);--udex-search-home-container-padding-inline-end: var(--udexSpacer8, 8px);--udex-search-label-inset-inline-start: var(--udexSpacer12, 12px);--udex-search-icons-column-gap: 0;--udex-search-home-icons-column-gap: var(--udexSpacer4, 4px);--udex-search-label-width: calc( 100% - var(--udex-search-label-inset-inline-start) - var(--udex-input-padding-horizontal) - var(--udex-search-container-padding-inline-end) );display:block;width:100%;position:relative}:host([mode=\"Standard\"]) .udex-search__label.udex-search__label--active{display:none}:host(:not([mode=\"Home Search\"])) .udex-search__label.udex-search__label--active.udex-search__label--animation-enabled,:host(:not([mode=\"Home Search\"])) .udex-search-prefix .udex-search__label.udex-search__label--active.udex-search__label--animation-enabled{display:block;inset-block-start:9px;line-height:18px;transform:translateY(-110%);padding:0 4px;font-family:var(--udex-input-font-family-label-active);font-size:var(--udex-input-font-size-label-active);font-weight:var(--udex-input-font-weight-label-active);line-height:var(--udex-input-line-height-label-active);background-color:#fff}:host([mode=\"Home Search\"]) .udex-search__root,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix{--udex-input-radius: var(--udexRadiusXXL, 24px);position:relative;z-index:1}:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix{display:flex;width:100%;position:relative;z-index:1}:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__prefix+.udex-search__container{border-start-start-radius:0;border-start-end-radius:var(--udexRadiusXXL, 24px);border-end-start-radius:0;border-end-end-radius:var(--udexRadiusXXL, 24px);flex-grow:1}:host([mode=\"Home Search\"]) .udex-search__root.udex-search__root--show-popover:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search__root--show-popover-top:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover-top:after{content:\"\";position:absolute;z-index:-1;height:21px;inset-inline:0;inset-block-end:0;background-color:var(--udexColorNeutralWhite, #fff);border-left:1px solid var(--udexColorGrey6, #5B738B);border-right:1px solid var(--udexColorGrey6, #5B738B);box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34, 54, 73, .3));overflow-y:hidden}:host([mode=\"Home Search\"]) .udex-search__root.udex-search__root--show-popover-top:after,:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover-top:after,.udex-search__prefix--show-popover-top:after{transform:translateY(-21px)}:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover:after{inset-inline-start:auto;width:50px}:host([mode=\"Home Search\"]) .udex-search__root.udex-search-prefix.udex-search__root--show-popover-top:after{inset-inline-start:auto;width:50px}:host([mode=\"Home Search\"]) .udex-search__container:not(.udex-search__container--has-value),:host([mode=\"Home Search\"]) .udex-search__container:not(.udex-search__container--has-value) .udex-search__field,:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__container:not(.udex-search__container--has-value),:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__container:not(.udex-search__container--has-value) .udex-search__field{background-color:var(--udex-input-background-color)}:host([mode=\"Home Search\"]) .udex-search__label.udex-search__label--active,:host([mode=\"Home Search\"]) .udex-search-prefix .udex-search__label.udex-search__label--active{display:none}.udex-search__container{padding-inline-end:var(--udex-search-container-padding-inline-end);display:flex;align-items:center;position:relative;z-index:1;border:1px solid var(--udex-input-color-border);border-radius:var(--udex-input-radius);background-color:field}.udex-search-mode-home-search .udex-search__container{padding-inline-end:var(--udex-search-home-container-padding-inline-end)}.udex-search__container:not(.udex-search__container--focus):hover{border-color:var(--udex-input-color-hover-border)}.udex-search__container--focus{border-color:var(--udex-input-color-active-border)}:host(:not([_is-touched])[active]) .udex-search__root:before{content:\"\";position:absolute;inset:-5px;border:2px solid var(--udexColorBlue10);border-radius:var(--udex-input-radius)}:host([mode=\"Home Search\"]:not([_is-touched])[active]) .udex-search__root:before{z-index:-1}.udex-search__field{display:block;width:100%;color:var(--udex-input-color-typed-text);font-size:16px;font-family:var(--sapFontFamily);line-height:24px;padding:var(--udex-input-padding-vertical) var(--udex-input-padding-horizontal);box-sizing:border-box;border:0;border-radius:var(--udex-input-radius);font-weight:var(--udexTypographyFontWeightRegular, 400);background:var(--udex-input-color-background-light)}.udex-search-mode-home-search .udex-search__field{padding:var(--udex-home-input-padding-vertical) var(--udex-home-input-padding-right) var(--udex-home-input-padding-vertical) var(--udex-home-input-padding-left)}.udex-search__field::placeholder{color:var(--udexColorGrey7);font-family:var(--sapFontFamily, sans-serif);font-size:16px}.udex-search__field:focus{outline:none}input[type=search]::-ms-clear{display:none;width:0;height:0}input[type=search]::-ms-reveal{display:none;width:0;height:0}input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}.udex-search__label{position:absolute;inset-inline-start:var(--udex-search-label-inset-inline-start);z-index:2;color:var(--udex-input-color-label);font-family:var(--udex-input-font-family-label);font-size:var(--udex-input-font-size-label);font-weight:var(--udex-input-font-weight-label);line-height:var(--udex-input-line-height-label);transition:transform .15s ease-out,font-size .15s ease-out;overflow:hidden;white-space:nowrap;max-width:var(--udex-search-label-width)}.udex-search__label-with-search-icon,.udex-search__label-with-voice-icon{max-width:calc(var(--udex-search-label-width) - var(--udex-button-size))}.udex-search__label-with-search-icon.udex-search__label-with-voice-icon{max-width:calc(var(--udex-search-label-width) - var(--udex-button-size) * 2 - var(--udex-search-icons-column-gap))}.udex-search__icons{display:flex;align-items:center;column-gap:var(--udex-search-icons-column-gap)}.udex-search-mode-home-search .udex-search__icons{column-gap:var(--udex-search-home-icons-column-gap)}.udex-search__icon{margin-inline:5px;background-color:transparent;border:none;color:var(--udex-button-non-interactive-icon-color);min-width:var(--udex-button-non-interactive-icon-size);height:var(--udex-button-non-interactive-icon-size);border-radius:50%;position:relative;z-index:1;overflow:visible}.udex-search__button{background-color:transparent;border:none;color:var(--udex-button-color);min-width:var(--udex-button-size);height:var(--udex-button-size);border-radius:50%;position:relative;z-index:1;overflow:visible}[udex-control-button]{--udex-control-button-large-height: 40px;--udex-control-button-large-width: 40px}[udex-control-button].udex-search__reset-button{--sapButton_BorderWidth: 0px 1px 0 1px}[udex-control-button].udex-search__submit-button{margin:0px calc((var(--udex-search-container-padding-inline-end)) * -1) 0px 0;--sapButton_BorderWidth: 0 0 0 1px}[ui5-button].udex-search__button::part(button):focus-visible:before{content:\"\";position:absolute;inset-block-start:0;inset-inline-start:0;width:28px;height:28px;border:2px solid var(--udexColorBlue9, #0040B0);border-radius:50%;box-sizing:border-box}[ui5-button].udex-search__button::part(button){padding:0;width:28px;height:28px;line-height:0}[ui5-icon].udex-search__button-icon{color:inherit;width:18px;height:18px}[ui5-button].udex-search__button::part(icon){width:18px;height:18px}[ui5-button].udex-search__button::part(button):after{display:none}[ui5-button].udex-search__button.udex-search__voice-button:hover{background-color:#0000001a;border:none;box-shadow:none}[ui5-button].udex-search__button.udex-search__voice-button.udex-search__voice-button--active,[ui5-button][active].udex-search__button.udex-search__voice-button{background:var(--udexColorBlue8, #0057D2);color:var(--udexColorNeutralWhite, #FFFFFF)}[ui5-button].udex-search__button:focus{outline:none}.udex-search__prefix{position:relative;z-index:1}.udex-search__prefix--show-popover:after,.udex-search__prefix--show-popover-top:after{content:\"\";position:absolute;z-index:-1;height:50%;width:50px;inset-inline-start:0;inset-block-end:0;background-color:var(--udexColorNeutralWhite, #fff);border-left:1px solid var(--udexColorGrey6, #5B738B);border-right:1px solid var(--udexColorGrey6, #5B738B);box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34, 54, 73, .3));overflow-y:hidden}.udex-search__prefix-button{padding-inline:var(--udexSpacer12) var(--udexSpacer8);display:flex;align-items:center;max-width:200px;height:100%;border:1px solid var(--udex-input-color-border);border-inline-end:0;border-start-start-radius:var(--udexRadiusXXL, 24px);border-end-start-radius:var(--udexRadiusXXL, 24px);background-color:var(--sapShell_Navigation_Active_Background, var(--udexColorGrey1));color:var(--sapContent_LabelColor, var(--udexColorGrey7));font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodySFontSize, 16px);font-weight:var(--udexTypographyFontWeightRegular, 400);line-height:var(--udexTypographyBodyLineHeight, 1.5);text-align:start;white-space:nowrap}.udex-search__prefix-button:hover{cursor:pointer;background-color:var(--udexCoreBase);color:var(--udexColorBlue8)}.udex-search__prefix-button:focus,.udex-search__prefix-button:focus-visible{outline:2px solid var(--udexColorBlue10, #002A86);outline-offset:-2px}.udex-search__prefix-button--active{background-color:var(--udexCoreBase);color:var(--udexColorBlue10)}.udex-search__prefix-label{margin-inline-end:var(--udexSpacer4, 4px);max-width:calc(100% - 20px);overflow:hidden;text-overflow:ellipsis}.udex-search__prefix-icon{width:16px;height:16px;color:inherit;flex-shrink:1}.udex-search__prefix-popover{border-start-start-radius:0;border-start-end-radius:0;border:1px solid var(--udexCoreBorderDefault);border-block-start:0;box-shadow:var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,.3));background-color:var(--udexColorNeutralWhite, #fff);clip-path:inset(0px -10px -10px -10px)}.udex-search__prefix-popover-top{border-end-start-radius:0;border-end-end-radius:0;border:1px solid var(--udexCoreBorderDefault);border-block-end:0;box-shadow:none;background-color:var(--udexColorNeutralWhite, #fff);clip-path:inset(0px -10px -10px -10px)}.udex-search__prefix-popover::part(content),.udex-search__prefix-popover-top::part(content){padding:0}[udex-dropdown]{--udex-dropdown-pane-max-width: 100%}.hidden{position:absolute;width:0px;height:0px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0;padding:0}\n`};\nexport default styleData;\n\t"]}

package/dist/generated/themes/Slider.css.js

@@ -3,7 +3,7 @@ import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/s
 import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
 registerThemePropertiesLoader("@ui5/webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
 registerThemePropertiesLoader("@sapudex/web-components", "sap_horizon", async () => defaultTheme);
-const styleData = { packageName: "@sapudex/web-components", fileName: "themes/Slider.css.ts", content: `: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, .5rem)}: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)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v0-226-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)}
+const styleData = { packageName: "@sapudex/web-components", fileName: "themes/Slider.css.ts", content: `: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, .5rem)}: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)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v0-227-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)}
 ` };
 export default styleData;
 //# sourceMappingURL=Slider.css.js.map

package/dist/generated/themes/Slider.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Slider.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,4BAA4B,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACzG,6BAA6B,CAAC,yBAAyB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAElG,MAAM,SAAS,GAAc,EAAC,WAAW,EAAC,yBAAyB,EAAC,QAAQ,EAAC,sBAAsB,EAAC,OAAO,EAAC;CAC3G,EAAC,CAAC;AACH,eAAe,SAAS,CAAC","sourcesContent":["import type { StyleData } from \"@ui5/webcomponents-base/dist/types.js\";\nimport { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@ui5/webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@sapudex/web-components\", \"sap_horizon\", async () => defaultTheme);\n\nconst styleData: StyleData = {packageName:\"@sapudex/web-components\",fileName:\"themes/Slider.css.ts\",content:`: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, .5rem)}: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)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v0-226-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)}\n`};\nexport default styleData;\n\t"]}
+{"version":3,"file":"Slider.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Slider.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,4BAA4B,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACzG,6BAA6B,CAAC,yBAAyB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAElG,MAAM,SAAS,GAAc,EAAC,WAAW,EAAC,yBAAyB,EAAC,QAAQ,EAAC,sBAAsB,EAAC,OAAO,EAAC;CAC3G,EAAC,CAAC;AACH,eAAe,SAAS,CAAC","sourcesContent":["import type { StyleData } from \"@ui5/webcomponents-base/dist/types.js\";\nimport { registerThemePropertiesLoader } from \"@ui5/webcomponents-base/dist/asset-registries/Themes.js\";\n\nimport defaultThemeBase from \"@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js\";\nimport defaultTheme from \"./sap_horizon/parameters-bundle.css.js\";\n\nregisterThemePropertiesLoader(\"@ui5/webcomponents-theming\", \"sap_horizon\", async () => defaultThemeBase);\nregisterThemePropertiesLoader(\"@sapudex/web-components\", \"sap_horizon\", async () => defaultTheme);\n\nconst styleData: StyleData = {packageName:\"@sapudex/web-components\",fileName:\"themes/Slider.css.ts\",content:`: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, .5rem)}: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)}:host([desktop]) .ui5-slider-handle:focus,.ui5-slider-handle:focus-visible{background-color:var(--_ui5-v0-227-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)}\n`};\nexport default styleData;\n\t"]}

package/dist/vscode.html-custom-data.json

@@ -346,6 +346,11 @@
           "values": []
         },
         { "name": "hide-flag-images", "values": [] },
+        {
+          "name": "show-search-input",
+          "description": "Defines if the search input is visible.",
+          "values": []
+        },
         {
           "name": "busy",
           "description": "Defines if the component would display a loading indicator.",
@@ -637,6 +642,11 @@
           "description": "Allows setting a custom role for dropdown trigger.",
           "values": []
         },
+        {
+          "name": "show-search-input",
+          "description": "Defines if the search input is visible.",
+          "values": []
+        },
         {
           "name": "busy",
           "description": "Defines if the component would display a loading indicator.",
@@ -2378,6 +2388,11 @@
       "name": "udex-searchable-list-base",
       "description": "A class to serve as a foundation\nfor the <code>UDExFilterMenu</code> , <code>UDExSelectBox</code> and <code>UDExCountrySelector/code> classes.\n\n\n---\n\n\n\n\n### **Events:**\n - **selection-change** - \n- **select-all** - Fired event when the user clicks on the Select All header.\n- **submit-search** - Fired event when the user clicks on the submitted icon in the search.\n- **reset-search** - Fired event when the user clicks on the reset button in the search.\n- **change-search** - Fired event when the user submitted the value in the search.\n\n### **Methods:**\n - **resetSearch()** - Reset the search value.\n\n### **Slots:**\n - **default** - Slot for items.",
       "attributes": [
+        {
+          "name": "show-search-input",
+          "description": "Defines if the search input is visible.",
+          "values": []
+        },
         {
           "name": "busy",
           "description": "Defines if the component would display a loading indicator.",
@@ -2653,6 +2668,11 @@
             { "name": "Bottom" }
           ]
         },
+        {
+          "name": "show-search-input",
+          "description": "Defines if the search input is visible.",
+          "values": []
+        },
         {
           "name": "busy",
           "description": "Defines if the component would display a loading indicator.",
@@ -3897,6 +3917,11 @@
           "name": "indeterminate",
           "description": "Defines whether the component has unknown number of steps.",
           "values": []
+        },
+        {
+          "name": "accessible-name",
+          "description": "Defines aria-label of the wizard, read by screen readers with the first step.",
+          "values": []
         }
       ],
       "references": []

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@sapudex/web-components",
-  "version": "0.226.1",
+  "version": "0.227.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -640,6 +640,11 @@
               "name": "hide-flag-images",
               "value": { "type": "boolean | undefined" }
             },
+            {
+              "name": "show-search-input",
+              "description": "Defines if the search input is visible.",
+              "value": { "type": "boolean", "default": "false" }
+            },
             {
               "name": "busy",
               "description": "Defines if the component would display a loading indicator.",
@@ -787,6 +792,11 @@
                 "name": "hide-flag-images",
                 "value": { "type": "boolean | undefined" }
               },
+              {
+                "name": "show-search-input",
+                "description": "Defines if the search input is visible.",
+                "value": { "type": "boolean" }
+              },
               {
                 "name": "busy",
                 "description": "Defines if the component would display a loading indicator.",
@@ -1294,6 +1304,11 @@
               "description": "Allows setting a custom role for dropdown trigger.",
               "value": { "type": "string", "default": "\"combobox\"" }
             },
+            {
+              "name": "show-search-input",
+              "description": "Defines if the search input is visible.",
+              "value": { "type": "boolean", "default": "false" }
+            },
             {
               "name": "busy",
               "description": "Defines if the component would display a loading indicator.",
@@ -1466,6 +1481,11 @@
                 "description": "Allows setting a custom role for dropdown trigger.",
                 "value": { "type": "string" }
               },
+              {
+                "name": "show-search-input",
+                "description": "Defines if the search input is visible.",
+                "value": { "type": "boolean" }
+              },
               {
                 "name": "busy",
                 "description": "Defines if the component would display a loading indicator.",
@@ -5462,6 +5482,11 @@
                 "default": "\"Bottom\""
               }
             },
+            {
+              "name": "show-search-input",
+              "description": "Defines if the search input is visible.",
+              "value": { "type": "boolean", "default": "false" }
+            },
             {
               "name": "busy",
               "description": "Defines if the component would display a loading indicator.",
@@ -5599,6 +5624,11 @@
                   "type": "\"Left\" | \"Right\" | \"Top\" | \"Bottom\""
                 }
               },
+              {
+                "name": "show-search-input",
+                "description": "Defines if the search input is visible.",
+                "value": { "type": "boolean" }
+              },
               {
                 "name": "busy",
                 "description": "Defines if the component would display a loading indicator.",
@@ -8109,6 +8139,11 @@
               "name": "indeterminate",
               "description": "Defines whether the component has unknown number of steps.",
               "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "accessible-name",
+              "description": "Defines aria-label of the wizard, read by screen readers with the first step.",
+              "value": { "type": "string" }
             }
           ],
           "events": [],
@@ -8118,6 +8153,11 @@
                 "name": "indeterminate",
                 "description": "Defines whether the component has unknown number of steps.",
                 "value": { "type": "boolean" }
+              },
+              {
+                "name": "accessible-name",
+                "description": "Defines aria-label of the wizard, read by screen readers with the first step.",
+                "value": { "type": "string" }
               }
             ],
             "events": []

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sapudex/web-components",
-  "version": "0.226.1",
+  "version": "0.227.0",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },

package/src/Breadcrumbs.hbs

@@ -2,19 +2,17 @@
     class="udex-breadcrumbs ui5-breadcrumbs-root"
 	aria-label="{{_accessibleNameText}}">
 	<ol @focusin="{{_onfocusin}}">
-		<li class="udex-breadcrumbs__arrow-wrapper ui5-breadcrumbs-dropdown-arrow-link-wrapper">
-			<button
-                @click="{{_toggleDropdown}}"
+        <li class="ui5-breadcrumbs-dropdown-arrow-link-wrapper">
+            <udex-link
+                @ui5-click="{{_toggleDropdown}}"
                 class="udex-breadcrumbs__trigger {{_triggerClass}}"
-				accessible-role="button"
-				aria-label="{{_dropdownArrowAccessibleNameText}}"
-				aria-haspopup="true">
-				<ui5-icon
-            name="slim-arrow-down"
-            title="{{_dropdownArrowAccessibleNameText}}">
-        </ui5-icon>
-			</button>
-		</li>
+                accessible-role="button"
+                aria-label="{{_dropdownArrowAccessibleNameText}}"
+                icon="slim-arrow-down"
+                icon-placement="Start"
+                aria-haspopup="true">
+            </udex-link>
+        </li>
 		{{#each _linksData}}
             <li
                 class="udex-breadcrumbs__link-wrapper ui5-breadcrumbs-link-wrapper"

package/src/Breadcrumbs.ts

@@ -162,6 +162,7 @@ class UDExBreadcrumbs extends UI5Element {
 
   onAfterRendering(): void {
     this._initItemNavigation();
+    this._dropdownArrowLink.forcedTabIndex = "0";
   }
 
   _preprocessItems(): void {
@@ -289,7 +290,7 @@ class UDExBreadcrumbs extends UI5Element {
   }
 
   _focusFirstVisibleItem(): void {
-    Array.from(this.shadowRoot!.querySelectorAll<UDExLink>("[udex-link]"))[0].focus();
+    Array.from(this.shadowRoot!.querySelectorAll<UDExLink>(".udex-breadcrumbs__link-wrapper [udex-link]"))[0].focus();
     this._shouldFocusFirstVisibleItem = false;
   }
 
@@ -305,7 +306,7 @@ class UDExBreadcrumbs extends UI5Element {
    * Getter for the list of links corresponding to the abstract breadcrumb items
    */
   get _links(): Array<UDExLink> {
-    return Array.from(this.shadowRoot!.querySelectorAll<UDExLink>(".udex-breadcrumbs__link-wrapper [ui5-link]"));
+    return Array.from(this.shadowRoot!.querySelectorAll<UDExLink>(".ui5-breadcrumbs-link-wrapper [udex-link]"));
   }
 
   /**

package/src/Button.ts

@@ -60,6 +60,15 @@ class UDExButton extends Button {
   @property({ type: Boolean })
     toggled!: boolean;
 
+  /**
+   * Defines if button has pseudo aria-disabled state
+   *
+   * @default false
+   * @private
+   */
+  @property({ type: Boolean })
+    _ariaDisabled!: boolean;
+
   /**
    * Defines the component design.
    * @default "Primary"

package/src/ListItem.ts

@@ -230,16 +230,16 @@ class UDExListItem extends UDExListItemBase {
    * @slot
    * @public
    */
-  @slot()
-    firstIcon!: Array<HTMLElement>;
+  @slot({ type: UDExButton })
+    firstIcon!: Array<UDExButton>;
   /**
    * Slot for second icon.
    *
    * @slot
    * @public
    */
-  @slot()
-    secondIcon!: Array<HTMLElement>;
+  @slot({ type: UDExButton })
+    secondIcon!: Array<UDExButton>;
 
   /**
   * Defines the role attribute of component

package/src/MastheadItem.ts

@@ -564,7 +564,7 @@ class UDExMastheadItem extends UI5Element implements IMastheadItem {
   }
 
   get isMobile(): boolean {
-    return BreakpointUtils.isBelow("M") || this.mastheadShell?._isMobileMode;
+    return BreakpointUtils.isAtMost("M") || this.mastheadShell?._isMobileMode;
   }
 
   get isTargetBlank(): boolean {

package/src/MastheadShell.ts

@@ -375,6 +375,12 @@ class UDExMastheadShell extends UI5Element {
     this._handleResizeBound = this._handleResize.bind(this);
   }
 
+  onBeforeRendering() {
+    if (this.isMobileMenuMode) {
+      this.setMobileMenuHeight();
+    }
+  }
+
   onAfterRendering() {
     this._rootHolder = this.mastheadHolder;
     this._searchOpener = this.searchOpener;
@@ -402,7 +408,7 @@ class UDExMastheadShell extends UI5Element {
       this.handleMobileMode();
     }
 
-    if (this.isBreakpointSizeM) {
+    if (this.isAtMostBreakpointSizeM) {
       this._isSearchOpened = false;
     }
 
@@ -412,6 +418,10 @@ class UDExMastheadShell extends UI5Element {
       return;
     }
 
+    if (this.isMobileMenuMode) {
+      this.setMobileMenuHeight();
+    }
+
     this._shouldHandleResize = true;
   }
 
@@ -701,6 +711,12 @@ class UDExMastheadShell extends UI5Element {
     });
   }
 
+  setMobileMenuHeight(): void {
+    const mastheadHeight = parseInt(window.getComputedStyle(this).getPropertyValue("--udex-masthead-shell-height"));
+    const mobileMenuHeight = `${window.innerHeight - mastheadHeight}px`;
+    this.style.setProperty("--udex-masthead-shell-mobile-menu-height", mobileMenuHeight);
+  }
+
   removeMobileMode(): void {
     this._isMobileMode = false;
     this.slottedItems.forEach((item: MastheadSlottedItem) => {
@@ -723,7 +739,7 @@ class UDExMastheadShell extends UI5Element {
    */
   openSearch(): void {
     const shouldPreventOpeningSearch = this._isSearchOpened
-      || (this.isBreakpointSizeM && !this.showSearchByDefault)
+      || (this.isAtMostBreakpointSizeM && !this.showSearchByDefault)
       || this._isMobileMode
       || (this.isAtLeastBreakpointSizeM && this.showSearchByDefault);
 
@@ -746,7 +762,7 @@ class UDExMastheadShell extends UI5Element {
    * @public
    */
   openMobileMenu(): void {
-    if (!this._isMobileMenuOpen && (this._isMobileMode || this.isBreakpointSizeM)) {
+    if (!this._isMobileMenuOpen && this.isMobileMenuMode) {
       this.mobileBtn?.handleSelectedChange();
       this.handleOpenMobileMenu();
     }
@@ -861,7 +877,7 @@ class UDExMastheadShell extends UI5Element {
     return !!this.mobileMenu.length;
   }
 
-  get isBreakpointSizeM(): boolean {
+  get isAtMostBreakpointSizeM(): boolean {
     return BreakpointUtils.isAtMost("M");
   }
 
@@ -869,6 +885,10 @@ class UDExMastheadShell extends UI5Element {
     return BreakpointUtils.isAtLeast("M");
   }
 
+  get isMobileMenuMode(): boolean {
+    return this._isMobileMode || this.isAtMostBreakpointSizeM;
+  }
+
   get isMainMenuVisible(): boolean {
     return !this.showSearchByDefault && !this._isSearchOpened;
   }
@@ -878,7 +898,7 @@ class UDExMastheadShell extends UI5Element {
   }
 
   get shouldHandleMobileView(): boolean {
-    return !this.isBreakpointSizeM && !this.showSearchByDefault;
+    return !this.isAtMostBreakpointSizeM && !this.showSearchByDefault;
   }
 
   get mainNavigationAriaLabel(): string {

package/src/Pagination.hbs

@@ -4,7 +4,8 @@
         {{#if absoluteNavigation}}
         <li class="udex-pagination__item--first udex-pagination__item">
             <udex-button
-            ?disabled="{{prevButtonDisbled}}"
+            aria-disabled="{{effectivePrevButtonDisabled}}"
+            ?_aria-disabled="{{_prevButtonPseudoDisabled}}"
             accessible-name="{{firstPageAccessibleName}}"
             size="Large"
             icon="close-command-field"
@@ -15,13 +16,15 @@
         {{/if}}
         <li class="udex-pagination__item--prev udex-pagination__item">
             <udex-button
-            ?disabled="{{prevButtonDisbled}}"
+            aria-disabled="{{effectivePrevButtonDisabled}}"
+            ?_aria-disabled="{{_prevButtonPseudoDisabled}}"
             accessible-name="{{previousPageAccessibleName}}"
             tooltip="{{previousBtnTooltip}}"
             size="Large"
             icon="navigation-left-arrow"
             design="Tertiary"
             @click="{{setPrevPage}}"
+            @focusout="{{handlePrevFocusOut}}"
             ></udex-button>
         </li>
         {{#if typeFull}}
@@ -29,7 +32,7 @@
                 <li class="udex-pagination__item">
                     <a class="udex-pagination__page" href="#" 
                         aria-label="{{accessibleName}}"
-                        @click="{{../onPageClick}}" 
+                        @click="{{../onPageClick}}"
                         ?active="{{active}}"
                         aria-current="{{ariaCurrent}}"
                         index="{{index}}">
@@ -47,19 +50,22 @@
         {{/if}}
         <li class="udex-pagination__item--next udex-pagination__item">
             <udex-button
-            ?disabled="{{nextButtonDisbled}}"
+            aria-disabled="{{effectiveNextButtonDisabled}}"
+            ?_aria-disabled="{{_nextButtonPseudoDisabled}}"
             tooltip="{{nextBtnTooltip}}"
             accessible-name="{{nextPageAccessibleName}}"
             size="Large"
             icon="navigation-right-arrow"
             design="Tertiary"
             @click="{{setNextPage}}"
+            @focusout="{{handleNextFocusOut}}"
             ></udex-button>
         </li>
         {{#if absoluteNavigation}}
             <li class="udex-pagination__item--last udex-pagination__item">
                 <udex-button
-                ?disabled="{{nextButtonDisbled}}"
+                aria-disabled="{{effectiveNextButtonDisabled}}"
+                ?_aria-disabled="{{_nextButtonPseudoDisabled}}"
                 accessible-name="{{lastPageAccessibleName}}"
                 size="Large"
                 icon="open-command-field"

package/src/Pagination.ts

@@ -17,6 +17,7 @@ import {
   PREVIOUS_PAGE,
   NEXT_PAGE,
   CURRENT_PAGE,
+  DISABLED,
 } from "./generated/i18n/i18n-defaults.js";
 import Button from "./Button.js";
 import "@ui5/webcomponents/dist/Icon.js";
@@ -129,6 +130,22 @@ class UDExPagination extends UI5Element {
   @property({ type: String })
     _direction?: string;
 
+  /**
+   * Defines if the previous button is in pseudo-disabled.
+   *
+   * @private
+   */
+  @property({ type: Boolean })
+    _nextButtonPseudoDisabled!: boolean;
+
+  /**
+   * Defines if the previous button is in pseudo-disabled.
+   *
+   * @private
+   */
+  @property({ type: Boolean })
+    _prevButtonPseudoDisabled!: boolean;
+
   _pages: Page[];
   _visiblePages: Page[];
 
@@ -163,11 +180,11 @@ class UDExPagination extends UI5Element {
     this.setupPages(this.pages);
   }
 
-  get nextButtonDisbled(): boolean {
+  get nextButtonDisabled(): boolean {
     return this.currentPageIndex + 1 === this.pages;
   }
 
-  get prevButtonDisbled(): boolean {
+  get prevButtonDisabled(): boolean {
     return this.currentPageIndex === 0;
   }
 
@@ -234,21 +251,29 @@ class UDExPagination extends UI5Element {
   }
 
   get previousPageAccessibleName(): string {
-    if (this.currentPageIndex === 0) { return UDExPagination.i18nBundle.getText(PREVIOUS_PAGE); }
-    return `${UDExPagination.i18nBundle.getText(CURRENT_PAGE)} ${this.currentPageIndex + 1}. ${UDExPagination.i18nBundle.getText(PREVIOUS_PAGE)}. ${this.activatePageAccessibleText} ${this.currentPageIndex}`;
+    const currentPageText = `${UDExPagination.i18nBundle.getText(CURRENT_PAGE)} ${this.currentPageIndex + 1}.`;
+    if (this._prevButtonPseudoDisabled || this.prevButtonDisabled) {
+      const effectiveDisabledText = this._prevButtonPseudoDisabled ? `${UDExPagination.i18nBundle.getText(DISABLED)}` : "";
+      return `${currentPageText} ${UDExPagination.i18nBundle.getText(PREVIOUS_PAGE)} ${effectiveDisabledText}`;
+    }
+    return `${currentPageText} ${UDExPagination.i18nBundle.getText(PREVIOUS_PAGE)}. ${this.activatePageAccessibleText} ${this.currentPageIndex}`;
   }
 
   get previousBtnTooltip(): string {
-    return !this.prevButtonDisbled ? `${UDExPagination.i18nBundle.getText(PREVIOUS_PAGE)}` : "";
+    return !this.prevButtonDisabled ? `${UDExPagination.i18nBundle.getText(PREVIOUS_PAGE)}` : "";
   }
 
   get nextPageAccessibleName(): string {
-    if (this.pages && this.currentPageIndex === (this.pages - 1)) { return UDExPagination.i18nBundle.getText(NEXT_PAGE); }
-    return `${UDExPagination.i18nBundle.getText(CURRENT_PAGE)} ${this.currentPageIndex + 1}. ${UDExPagination.i18nBundle.getText(NEXT_PAGE)}. ${this.activatePageAccessibleText} ${this.currentPageIndex + 2}`;
+    const currentPageText = `${UDExPagination.i18nBundle.getText(CURRENT_PAGE)} ${this.currentPageIndex + 1}.`;
+    if (this._nextButtonPseudoDisabled || this.nextButtonDisabled) {
+      const effectiveDisabledText = this._nextButtonPseudoDisabled ? `${UDExPagination.i18nBundle.getText(DISABLED)}` : "";
+      return `${currentPageText} ${UDExPagination.i18nBundle.getText(NEXT_PAGE)} ${effectiveDisabledText}`;
+    }
+    return `${currentPageText} ${UDExPagination.i18nBundle.getText(NEXT_PAGE)}. ${this.activatePageAccessibleText} ${this.currentPageIndex + 2}`;
   }
 
   get nextBtnTooltip(): string {
-    return !this.nextButtonDisbled ? `${UDExPagination.i18nBundle.getText(NEXT_PAGE)}` : "";
+    return !this.nextButtonDisabled ? `${UDExPagination.i18nBundle.getText(NEXT_PAGE)}` : "";
   }
 
   get pagination(): Page[] {
@@ -282,6 +307,22 @@ class UDExPagination extends UI5Element {
     UDExPagination.i18nBundle = await getI18nBundle("@sapudex/web-components");
   }
 
+  get effectivePrevButtonDisabled(): boolean {
+    return !this._prevButtonPseudoDisabled && this.prevButtonDisabled;
+  }
+
+  get effectiveNextButtonDisabled(): boolean {
+    return !this._nextButtonPseudoDisabled && this.nextButtonDisabled;
+  }
+
+  handlePrevFocusOut(): void {
+    this._prevButtonPseudoDisabled = false;
+  }
+
+  handleNextFocusOut(): void {
+    this._nextButtonPseudoDisabled = false;
+  }
+
   setActive(element: HTMLElement): void {
     const pageIndex = element.getAttribute("index")
       ? parseInt(element.getAttribute("index") || "")
@@ -304,6 +345,7 @@ class UDExPagination extends UI5Element {
 
     this.currentPageIndex = currentPage + 1;
     this._pageFocusedManually = false;
+    this._nextButtonPseudoDisabled = this.currentPageIndex === (this.pages - 1);
 
     this.emitChangeEvent();
   }
@@ -316,6 +358,7 @@ class UDExPagination extends UI5Element {
     }
     this.currentPageIndex -= 1;
     this._pageFocusedManually = false;
+    this._prevButtonPseudoDisabled = this.currentPageIndex === 0;
 
     this.emitChangeEvent();
   }