@sapudex/web-components 2.25.0 → 2.26.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (136) hide show
  1. package/cypress/fixtures/profile-menu.ts +2 -1
  2. package/cypress/specs/MastheadProfileMenu.cy.tsx +21 -6
  3. package/dist/Badge.js.map +1 -1
  4. package/dist/List.d.ts +9 -0
  5. package/dist/List.js +33 -2
  6. package/dist/List.js.map +1 -1
  7. package/dist/MastheadCountrySelector.d.ts +11 -0
  8. package/dist/MastheadCountrySelector.js +71 -14
  9. package/dist/MastheadCountrySelector.js.map +1 -1
  10. package/dist/MastheadItem.d.ts +2 -0
  11. package/dist/MastheadItem.js +14 -1
  12. package/dist/MastheadItem.js.map +1 -1
  13. package/dist/MastheadMenu.d.ts +14 -0
  14. package/dist/MastheadMenu.js +55 -15
  15. package/dist/MastheadMenu.js.map +1 -1
  16. package/dist/MastheadMobileMenu.d.ts +1 -0
  17. package/dist/MastheadMobileMenu.js +6 -0
  18. package/dist/MastheadMobileMenu.js.map +1 -1
  19. package/dist/MastheadProfileMenu.d.ts +33 -3
  20. package/dist/MastheadProfileMenu.js +93 -5
  21. package/dist/MastheadProfileMenu.js.map +1 -1
  22. package/dist/MastheadShell.d.ts +5 -0
  23. package/dist/MastheadShell.js +25 -7
  24. package/dist/MastheadShell.js.map +1 -1
  25. package/dist/Pagination.d.ts +2 -0
  26. package/dist/Pagination.js +31 -6
  27. package/dist/Pagination.js.map +1 -1
  28. package/dist/PaginationTemplate.js +6 -5
  29. package/dist/PaginationTemplate.js.map +1 -1
  30. package/dist/Tag.js +7 -0
  31. package/dist/Tag.js.map +1 -1
  32. package/dist/Tooltip.js +3 -5
  33. package/dist/Tooltip.js.map +1 -1
  34. package/dist/TooltipTemplate.d.ts +2 -0
  35. package/dist/TooltipTemplate.js +7 -0
  36. package/dist/TooltipTemplate.js.map +1 -0
  37. package/dist/assets/{InputSuggestions-DF_pzCn9.js → InputSuggestions-CG5owMFQ.js} +1 -1
  38. package/dist/assets/{ListItemStandardExpandableTextTemplate-DOYL5Szm.js → ListItemStandardExpandableTextTemplate-DpVr7qdn.js} +1 -1
  39. package/dist/assets/{bundle.esm-CWBg8c5Q.js → bundle.esm-CTkLMr6f.js} +216 -216
  40. package/dist/css/themes/MastheadCountrySelector.css +1 -1
  41. package/dist/css/themes/MastheadItem.css +1 -1
  42. package/dist/css/themes/MastheadMenu.css +1 -1
  43. package/dist/css/themes/MastheadMenuItem.css +1 -1
  44. package/dist/css/themes/MastheadProfileMenu.css +1 -1
  45. package/dist/css/themes/Quote.css +1 -1
  46. package/dist/css/themes/RatingIndicator.css +1 -1
  47. package/dist/css/themes/Search.css +1 -1
  48. package/dist/css/themes/Slider.css +1 -1
  49. package/dist/custom-elements-internal.json +10 -2
  50. package/dist/custom-elements.json +6 -2
  51. package/dist/generated/templates/MastheadCountrySelectorTemplate.lit.js +1 -1
  52. package/dist/generated/templates/MastheadCountrySelectorTemplate.lit.js.map +1 -1
  53. package/dist/generated/templates/MastheadItemTemplate.lit.js +1 -1
  54. package/dist/generated/templates/MastheadItemTemplate.lit.js.map +1 -1
  55. package/dist/generated/templates/MastheadMenuTemplate.lit.js +9 -7
  56. package/dist/generated/templates/MastheadMenuTemplate.lit.js.map +1 -1
  57. package/dist/generated/templates/MastheadProfileMenuTemplate.lit.js +7 -5
  58. package/dist/generated/templates/MastheadProfileMenuTemplate.lit.js.map +1 -1
  59. package/dist/generated/themes/MastheadCountrySelector.css.d.ts +1 -1
  60. package/dist/generated/themes/MastheadCountrySelector.css.js +1 -1
  61. package/dist/generated/themes/MastheadCountrySelector.css.js.map +1 -1
  62. package/dist/generated/themes/MastheadItem.css.d.ts +1 -1
  63. package/dist/generated/themes/MastheadItem.css.js +1 -1
  64. package/dist/generated/themes/MastheadItem.css.js.map +1 -1
  65. package/dist/generated/themes/MastheadMenu.css.d.ts +1 -1
  66. package/dist/generated/themes/MastheadMenu.css.js +1 -1
  67. package/dist/generated/themes/MastheadMenu.css.js.map +1 -1
  68. package/dist/generated/themes/MastheadMenuItem.css.d.ts +1 -1
  69. package/dist/generated/themes/MastheadMenuItem.css.js +1 -1
  70. package/dist/generated/themes/MastheadMenuItem.css.js.map +1 -1
  71. package/dist/generated/themes/MastheadProfileMenu.css.d.ts +1 -1
  72. package/dist/generated/themes/MastheadProfileMenu.css.js +1 -1
  73. package/dist/generated/themes/MastheadProfileMenu.css.js.map +1 -1
  74. package/dist/generated/themes/Quote.css.d.ts +1 -1
  75. package/dist/generated/themes/Quote.css.js +1 -1
  76. package/dist/generated/themes/Quote.css.js.map +1 -1
  77. package/dist/generated/themes/RatingIndicator.css.d.ts +1 -1
  78. package/dist/generated/themes/RatingIndicator.css.js +1 -1
  79. package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
  80. package/dist/generated/themes/Search.css.d.ts +1 -1
  81. package/dist/generated/themes/Search.css.js +1 -1
  82. package/dist/generated/themes/Search.css.js.map +1 -1
  83. package/dist/generated/themes/Slider.css.d.ts +1 -1
  84. package/dist/generated/themes/Slider.css.js +1 -1
  85. package/dist/generated/themes/Slider.css.js.map +1 -1
  86. package/dist/types/List.d.ts +6 -0
  87. package/dist/types/List.js +7 -0
  88. package/dist/types/List.js.map +1 -1
  89. package/dist/vscode.html-custom-data.json +1 -1
  90. package/dist/web-types.json +4 -6
  91. package/package.json +1 -1
  92. package/src/Badge.ts +5 -2
  93. package/src/List.ts +41 -2
  94. package/src/MastheadCountrySelector.hbs +20 -16
  95. package/src/MastheadCountrySelector.ts +83 -16
  96. package/src/MastheadItem.hbs +1 -1
  97. package/src/MastheadItem.ts +16 -1
  98. package/src/MastheadMenu.hbs +33 -12
  99. package/src/MastheadMenu.ts +67 -13
  100. package/src/MastheadMobileMenu.ts +9 -1
  101. package/src/MastheadProfileMenu.hbs +43 -26
  102. package/src/MastheadProfileMenu.ts +124 -7
  103. package/src/MastheadShell.ts +29 -7
  104. package/src/Pagination.ts +32 -6
  105. package/src/PaginationTemplate.tsx +19 -16
  106. package/src/Tag.ts +1 -1
  107. package/src/Tooltip.ts +7 -6
  108. package/src/TooltipTemplate.tsx +29 -0
  109. package/src/generated/templates/MastheadCountrySelectorTemplate.lit.ts +1 -1
  110. package/src/generated/templates/MastheadItemTemplate.lit.ts +1 -1
  111. package/src/generated/templates/MastheadMenuTemplate.lit.ts +9 -7
  112. package/src/generated/templates/MastheadProfileMenuTemplate.lit.ts +7 -5
  113. package/src/generated/themes/MastheadCountrySelector.css.ts +1 -1
  114. package/src/generated/themes/MastheadItem.css.ts +1 -1
  115. package/src/generated/themes/MastheadMenu.css.ts +1 -1
  116. package/src/generated/themes/MastheadMenuItem.css.ts +1 -1
  117. package/src/generated/themes/MastheadProfileMenu.css.ts +1 -1
  118. package/src/generated/themes/Quote.css.ts +1 -1
  119. package/src/generated/themes/RatingIndicator.css.ts +1 -1
  120. package/src/generated/themes/Search.css.ts +1 -1
  121. package/src/generated/themes/Slider.css.ts +1 -1
  122. package/src/themes/Badge.css +0 -1
  123. package/src/themes/MastheadCountrySelector.css +70 -10
  124. package/src/themes/MastheadItem.css +0 -1
  125. package/src/themes/MastheadMenu.css +1 -2
  126. package/src/themes/MastheadMenuItem.css +1 -0
  127. package/src/themes/MastheadProfileMenu.css +113 -17
  128. package/src/themes/Quote.css +1 -1
  129. package/src/themes/Search.css +2 -3
  130. package/src/types/List.ts +7 -0
  131. package/cypress/downloads/downloads.html +0 -0
  132. package/dist/generated/templates/TooltipTemplate.lit.d.ts +0 -3
  133. package/dist/generated/templates/TooltipTemplate.lit.js +0 -8
  134. package/dist/generated/templates/TooltipTemplate.lit.js.map +0 -1
  135. package/src/Tooltip.hbs +0 -22
  136. package/src/generated/templates/TooltipTemplate.lit.ts +0 -12
@@ -1 +1 @@
1
- {"version":3,"file":"Search.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Search.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { 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(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport default `: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-active-outline-color: var(--udexColorBlue10);--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) );--udex-search-prefix-max-width: 140px;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;top:var(--udexSpacer8);transform:translateY(-110%);padding:0 var(--udexSpacer4);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:var(--udex-input-color-background-light)}: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:23px;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;bottom:-2px}: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(-23px)}: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(--udex-search-active-outline-color);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}[udex-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}[udex-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}[udex-button].udex-search__button::part(icon){width:18px;height:18px}[udex-button].udex-search__button::part(button):after{display:none}[udex-button].udex-search__button.udex-search__voice-button:hover{background-color:#0000001a;border:none;box-shadow:none}[udex-button].udex-search__button.udex-search__voice-button.udex-search__voice-button--active,[udex-button][active].udex-search__button.udex-search__voice-button{background:var(--udexColorBlue8, #0057D2);color:var(--udexColorNeutralWhite, #FFFFFF)}[udex-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:var(--udex-search-prefix-max-width);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`"]}
1
+ {"version":3,"file":"Search.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Search.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { 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(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport default `: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-active-outline-color: var(--udexColorBlue10);--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) );--udex-search-prefix-max-width: 140px;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;top:var(--udexSpacer8);transform:translateY(-110%);padding:0 var(--udexSpacer4);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:var(--udex-input-color-background-light)}: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:23px;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;bottom:-2px}: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(-23px)}: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(--udex-search-active-outline-color);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}[udex-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}[udex-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}[udex-button].udex-search__button::part(icon){width:18px;height:18px}[udex-button].udex-search__button::part(button):after{display:none}[udex-button].udex-search__button:hover{background-color:#0000001a;border:none;box-shadow:none}[udex-button][active].udex-search__button{background:var(--udexColorBlue8, #0057D2);color:var(--udexColorNeutralWhite, #FFFFFF)}[udex-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:var(--udex-search-prefix-max-width);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`"]}
@@ -1,2 +1,2 @@
1
- declare const _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-25-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)}\n";
1
+ declare const _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-26-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)}\n";
2
2
  export default _default;
@@ -3,6 +3,6 @@ import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/s
3
3
  import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
4
4
  registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
5
5
  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);
6
- 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-25-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)}
6
+ 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-26-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)}
7
7
  `;
8
8
  //# sourceMappingURL=Slider.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Slider.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { 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(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport 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-25-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)}\n`"]}
1
+ {"version":3,"file":"Slider.css.js","sourceRoot":"","sources":["../../../src/generated/themes/Slider.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yDAAyD,CAAC;AAExG,OAAO,gBAAgB,MAAM,uFAAuF,CAAC;AACrH,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE,6BAA6B,CAAC,GAAG,GAAG,KAAK,GAAG,GAAG,GAAG,uBAAuB,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,gBAAgB,CAAC,CAAC;AACxH,6BAA6B,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,EAAE,aAAa,EAAE,KAAK,IAAI,EAAE,CAAC,YAAY,CAAC,CAAC;AAChN,eAAe;CACd,CAAA","sourcesContent":["import { 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(\"@\" + \"s\" + \"a\" + \"p\" + \"u\" + \"d\" + \"e\" + \"x\" + \"/\" + \"w\" + \"e\" + \"b\" + \"-\" + \"c\" + \"o\" + \"m\" + \"p\" + \"o\" + \"n\" + \"e\" + \"n\" + \"t\" + \"s\", \"sap_horizon\", async () => defaultTheme);\nexport 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-26-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)}\n`"]}
@@ -21,3 +21,9 @@ export declare enum UDExAdditionalTextState {
21
21
  Error = "Error",
22
22
  Information = "Information"
23
23
  }
24
+ export declare enum UDExScrollIntoViewOptions {
25
+ Start = "Start",
26
+ Center = "Center",
27
+ End = "End",
28
+ Nearest = "Nearest"
29
+ }
@@ -25,4 +25,11 @@ export var UDExAdditionalTextState;
25
25
  UDExAdditionalTextState["Error"] = "Error";
26
26
  UDExAdditionalTextState["Information"] = "Information";
27
27
  })(UDExAdditionalTextState || (UDExAdditionalTextState = {}));
28
+ export var UDExScrollIntoViewOptions;
29
+ (function (UDExScrollIntoViewOptions) {
30
+ UDExScrollIntoViewOptions["Start"] = "Start";
31
+ UDExScrollIntoViewOptions["Center"] = "Center";
32
+ UDExScrollIntoViewOptions["End"] = "End";
33
+ UDExScrollIntoViewOptions["Nearest"] = "Nearest";
34
+ })(UDExScrollIntoViewOptions || (UDExScrollIntoViewOptions = {}));
28
35
  //# sourceMappingURL=List.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/types/List.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,YAKX;AALD,WAAY,YAAY;IACtB,6CAA6B,CAAA;IAC7B,2CAA2B,CAAA;IAC3B,+CAA+B,CAAA;IAC/B,yCAAyB,CAAA;AAC3B,CAAC,EALW,YAAY,KAAZ,YAAY,QAKvB;AAED,MAAM,CAAN,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,kCAAa,CAAA;IACb,sCAAiB,CAAA;IACjB,sCAAiB,CAAA;IACjB,kCAAa,CAAA;AACf,CAAC,EALW,iBAAiB,KAAjB,iBAAiB,QAK5B;AAED,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IAC1B,yCAAqB,CAAA;IACrB,mCAAe,CAAA;AACjB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAED,MAAM,CAAN,IAAY,uBAMX;AAND,WAAY,uBAAuB;IACjC,wCAAa,CAAA;IACb,8CAAmB,CAAA;IACnB,8CAAmB,CAAA;IACnB,0CAAe,CAAA;IACf,sDAA2B,CAAA;AAC7B,CAAC,EANW,uBAAuB,KAAvB,uBAAuB,QAMlC","sourcesContent":["export enum UDExListMode {\n SingleSelect = \"SingleSelect\",\n MultiSelect = \"MultiSelect\",\n SingleContent = \"SingleContent\",\n RadioGroup = \"RadioGroup\",\n}\n\nexport enum UDExListStyleType {\n None = \"None\",\n Circle = \"Circle\",\n Number = \"Number\",\n Icon = \"Icon\",\n}\n\nexport enum UDExListItemSize {\n Standard = \"Standard\",\n Large = \"Large\",\n}\n\nexport enum UDExAdditionalTextState {\n None = \"None\",\n Success = \"Success\",\n Warning = \"Warning\",\n Error = \"Error\",\n Information = \"Information\",\n}\n"]}
1
+ {"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/types/List.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,YAKX;AALD,WAAY,YAAY;IACtB,6CAA6B,CAAA;IAC7B,2CAA2B,CAAA;IAC3B,+CAA+B,CAAA;IAC/B,yCAAyB,CAAA;AAC3B,CAAC,EALW,YAAY,KAAZ,YAAY,QAKvB;AAED,MAAM,CAAN,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,kCAAa,CAAA;IACb,sCAAiB,CAAA;IACjB,sCAAiB,CAAA;IACjB,kCAAa,CAAA;AACf,CAAC,EALW,iBAAiB,KAAjB,iBAAiB,QAK5B;AAED,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IAC1B,yCAAqB,CAAA;IACrB,mCAAe,CAAA;AACjB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAED,MAAM,CAAN,IAAY,uBAMX;AAND,WAAY,uBAAuB;IACjC,wCAAa,CAAA;IACb,8CAAmB,CAAA;IACnB,8CAAmB,CAAA;IACnB,0CAAe,CAAA;IACf,sDAA2B,CAAA;AAC7B,CAAC,EANW,uBAAuB,KAAvB,uBAAuB,QAMlC;AAED,MAAM,CAAN,IAAY,yBAKX;AALD,WAAY,yBAAyB;IACnC,4CAAe,CAAA;IACf,8CAAiB,CAAA;IACjB,wCAAW,CAAA;IACX,gDAAmB,CAAA;AACrB,CAAC,EALW,yBAAyB,KAAzB,yBAAyB,QAKpC","sourcesContent":["export enum UDExListMode {\n SingleSelect = \"SingleSelect\",\n MultiSelect = \"MultiSelect\",\n SingleContent = \"SingleContent\",\n RadioGroup = \"RadioGroup\",\n}\n\nexport enum UDExListStyleType {\n None = \"None\",\n Circle = \"Circle\",\n Number = \"Number\",\n Icon = \"Icon\",\n}\n\nexport enum UDExListItemSize {\n Standard = \"Standard\",\n Large = \"Large\",\n}\n\nexport enum UDExAdditionalTextState {\n None = \"None\",\n Success = \"Success\",\n Warning = \"Warning\",\n Error = \"Error\",\n Information = \"Information\",\n}\n\nexport enum UDExScrollIntoViewOptions {\n Start = \"Start\",\n Center = \"Center\",\n End = \"End\",\n Nearest = \"Nearest\",\n}\n"]}
@@ -2161,7 +2161,7 @@
2161
2161
  },
2162
2162
  {
2163
2163
  "name": "udex-masthead-profile-menu",
2164
- "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-profile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadProfileMenu.js\";</code>\n\n\n---\n\n\n\n\n### **Events:**\n - **logout** - Fired when use click Logout link\n- **profile-item-click** - Fires when profile menu item is clicked\n- **add-or-remove-account-click** - Fired when use click add or remove account button\n- **identity-item-click** - Fires when identity item is clicked\n\n### **Slots:**\n - **message** - Placeholder for message strip.",
2164
+ "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-profile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadProfileMenu.js\";</code>\n\n\n---\n\n\n\n\n### **Events:**\n - **logout** - Fired when use click Logout link\n- **profile-item-click** - Fires when profile menu item is clicked\n- **add-or-remove-account-click** - Fired when use click add or remove account button\n- **identity-item-click** - Fires when identity item is clicked\n\n### **Slots:**\n - **message** - Slot for message strip.\n- **logoutButton** - Slot for logout button.",
2165
2165
  "attributes": [
2166
2166
  {
2167
2167
  "name": "identities",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "name": "@sapudex/web-components",
4
- "version": "2.25.0",
4
+ "version": "2.26.0",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -4595,7 +4595,7 @@
4595
4595
  },
4596
4596
  {
4597
4597
  "name": "udex-masthead-profile-menu",
4598
- "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-profile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadProfileMenu.js\";</code>\n---\n\n\n### **Events:**\n - **logout** - Fired when use click Logout link\n- **profile-item-click** - Fires when profile menu item is clicked\n- **add-or-remove-account-click** - Fired when use click add or remove account button\n- **identity-item-click** - Fires when identity item is clicked\n\n### **Slots:**\n - **message** - Placeholder for message strip.",
4598
+ "description": "<h3 class=\"comment-api-title\">Overview</h3>\n\n\n<h3>Usage</h3>\n\nFor the <code>udex-masthead-profile-menu</code>\n<h3>ES6 Module Import</h3>\n\n<code>import \"@sapudex/web-components/dist/MastheadProfileMenu.js\";</code>\n---\n\n\n### **Events:**\n - **logout** - Fired when use click Logout link\n- **profile-item-click** - Fires when profile menu item is clicked\n- **add-or-remove-account-click** - Fired when use click add or remove account button\n- **identity-item-click** - Fires when identity item is clicked\n\n### **Slots:**\n - **message** - Slot for message strip.\n- **logoutButton** - Slot for logout button.",
4599
4599
  "doc-url": "",
4600
4600
  "attributes": [
4601
4601
  {
@@ -4620,10 +4620,8 @@
4620
4620
  }
4621
4621
  ],
4622
4622
  "slots": [
4623
- {
4624
- "name": "message",
4625
- "description": "Placeholder for message strip."
4626
- }
4623
+ { "name": "message", "description": "Slot for message strip." },
4624
+ { "name": "logoutButton", "description": "Slot for logout button." }
4627
4625
  ],
4628
4626
  "events": [
4629
4627
  {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "type": "module",
3
3
  "name": "@sapudex/web-components",
4
- "version": "2.25.0",
4
+ "version": "2.26.0",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
7
7
  },
package/src/Badge.ts CHANGED
@@ -62,6 +62,7 @@ class UDExBadge extends UI5Element {
62
62
  */
63
63
  @property()
64
64
  design: `${UDExTextBadgeDesign}` = UDExTextBadgeDesign.Information;
65
+
65
66
  /**
66
67
  * Defines the design of number type component.
67
68
  *
@@ -70,14 +71,16 @@ class UDExBadge extends UI5Element {
70
71
  */
71
72
  @property()
72
73
  numberDesign: `${UDExNumberBadgeDesign}` = UDExNumberBadgeDesign.Blue;
74
+
73
75
  /**
74
76
  * Defines icon placement if icon was provided
75
77
  *
76
78
  * @default "End"
77
79
  * @public
78
80
  */
79
- @property()
80
- iconPlacement: `${UDExIconPlacement}` = UDExIconPlacement.End;
81
+ @property()
82
+ iconPlacement: `${UDExIconPlacement}` = UDExIconPlacement.End;
83
+
81
84
  /**
82
85
  * Defines icon name
83
86
  *
package/src/List.ts CHANGED
@@ -8,6 +8,7 @@ import {
8
8
  isUp, isDown, isHome, isEnd,
9
9
  } from "@ui5/webcomponents-base/dist/Keys.js";
10
10
  import type UDExListItem from "./ListItem.js";
11
+ import type { UDExScrollIntoViewOptions } from "./types/List.js";
11
12
  import { UDExListStyleType, UDExListMode } from "./types/List.js";
12
13
  import type UDExListGroupHeader from "./ListGroupHeader.js";
13
14
  import type UDExListGroupHeaderBase from "./ListGroupHeaderBase.js";
@@ -162,6 +163,15 @@ class UDExList extends UI5Element {
162
163
  @slot({ type: HTMLElement, "default": true })
163
164
  items!: Array<UDExListItemBase>;
164
165
 
166
+ /**
167
+ * Defines the scroll behavior for the items of the component.
168
+ *
169
+ * @default undefined
170
+ * @private
171
+ */
172
+ @property()
173
+ _scrollIntoView?: `${UDExScrollIntoViewOptions}`;
174
+
165
175
  _focusHandler: UDExListWithFirstLetterFocus = new UDExFirstLetterFocusHandler();
166
176
 
167
177
  @i18n("@sapudex/web-components")
@@ -211,6 +221,9 @@ class UDExList extends UI5Element {
211
221
  if (nonInteractiveHeader && previousSelectIndex === 0) {
212
222
  this.unsetTabIndexByIndex(items, currentSelectedIndex);
213
223
  this.setTabIndexByIndex(items, lastItemIndex);
224
+ if (this._scrollIntoView) {
225
+ this.scrollToItem(items[lastItemIndex]);
226
+ }
214
227
  items[lastItemIndex].focus();
215
228
  return;
216
229
  }
@@ -218,6 +231,9 @@ class UDExList extends UI5Element {
218
231
  if (nonInteractiveHeader) {
219
232
  this.unsetTabIndexByIndex(items, currentSelectedIndex);
220
233
  this.setTabIndexByIndex(items, previousSelectIndex - 1);
234
+ if (this._scrollIntoView) {
235
+ this.scrollToItem(items[previousSelectIndex - 1]);
236
+ }
221
237
  items[previousSelectIndex - 1].focus();
222
238
  return;
223
239
  }
@@ -225,6 +241,9 @@ class UDExList extends UI5Element {
225
241
  if (isHeaderItem) {
226
242
  this.unsetTabIndexByIndex(items, currentSelectedIndex);
227
243
  this.setTabIndexByIndex(items, previousSelectIndex);
244
+ if (this._scrollIntoView) {
245
+ this.scrollToItem(items[previousSelectIndex]);
246
+ }
228
247
  this.focusHeader(items[previousSelectIndex]);
229
248
  return;
230
249
  }
@@ -236,7 +255,12 @@ class UDExList extends UI5Element {
236
255
 
237
256
  this.unsetTabIndexByIndex(items, currentSelectedIndex);
238
257
  this.setTabIndexByIndex(items, previousSelectIndex);
239
- setTimeout(() => { items[previousSelectIndex].focus(); }, 0);
258
+ setTimeout(() => {
259
+ if (this._scrollIntoView) {
260
+ this.scrollToItem(items[previousSelectIndex]);
261
+ }
262
+ items[previousSelectIndex].focus();
263
+ }, 0);
240
264
  }
241
265
 
242
266
  handleDownArrow(e: KeyboardEvent): void {
@@ -250,6 +274,9 @@ class UDExList extends UI5Element {
250
274
  if (nonInteractiveHeader) {
251
275
  this.unsetTabIndexByIndex(items, currentSelectedIndex);
252
276
  this.setTabIndexByIndex(items, nextSelectIndex + 1);
277
+ if (this._scrollIntoView) {
278
+ this.scrollToItem(items[nextSelectIndex + 1]);
279
+ }
253
280
  items[nextSelectIndex + 1].focus();
254
281
  return;
255
282
  }
@@ -257,6 +284,9 @@ class UDExList extends UI5Element {
257
284
  if (isHeaderItem) {
258
285
  this.unsetTabIndexByIndex(items, currentSelectedIndex);
259
286
  this.setTabIndexByIndex(items, nextSelectIndex);
287
+ if (this._scrollIntoView) {
288
+ this.scrollToItem(items[nextSelectIndex]);
289
+ }
260
290
  this.focusHeader(items[nextSelectIndex]);
261
291
  return;
262
292
  }
@@ -268,7 +298,12 @@ class UDExList extends UI5Element {
268
298
 
269
299
  this.unsetTabIndexByIndex(items, currentSelectedIndex);
270
300
  this.setTabIndexByIndex(items, nextSelectIndex);
271
- setTimeout(() => { items[nextSelectIndex].focus(); }, 0);
301
+ setTimeout(() => {
302
+ if (this._scrollIntoView) {
303
+ this.scrollToItem(items[nextSelectIndex]);
304
+ }
305
+ items[nextSelectIndex].focus();
306
+ }, 0);
272
307
  }
273
308
 
274
309
  handleHomeKey(e: KeyboardEvent): void {
@@ -370,6 +405,10 @@ class UDExList extends UI5Element {
370
405
  header.focus();
371
406
  }
372
407
 
408
+ scrollToItem(item: UDExListItemBase): void {
409
+ item.scrollIntoView({ block: this._scrollIntoView?.toLowerCase() as ScrollLogicalPosition });
410
+ }
411
+
373
412
  unsetTabIndexByIndex(items: UDExListItemBase[], index: number): void {
374
413
  items[index]._tabIndex = "-1";
375
414
  }
@@ -25,22 +25,26 @@
25
25
  show-submit-button>
26
26
  </udex-search>
27
27
  <span aria-live="polite" aria-atomic="true" class="hidden">{{_accSearchResultInfo}}</span>
28
- <ul class="udex-masthead-country-selector__list udex-masthead-country-selector__list_countries" role="menu">
29
- {{#each _activeCountries}}
30
- <li role="none">
31
- <udex-masthead-menu-item
32
- class="udex-masthead-country-selector__item udex-masthead-country-selector__item_countries"
33
- @click="{{../handleCountryClick}}"
34
- _country-code="{{this.countryCode}}"
35
- url="{{this.url}}"
36
- label="{{this.displayTitle}}"
37
- index="{{@index}}"
38
- part="menu-item"
39
- is-nav-item>
40
- </udex-masthead-menu-item>
41
- </li>
42
- {{/each}}
43
- </ul>
28
+ <div class="udex-masthead-country-selector__list-container">
29
+ <div class="udex-masthead-country-selector__list-wrap" @scroll={{this.handleCountryListShadowVisible}}>
30
+ <ul class="udex-masthead-country-selector__list udex-masthead-country-selector__list_countries" role="menu">
31
+ {{#each _activeCountries}}
32
+ <li role="none">
33
+ <udex-masthead-menu-item
34
+ class="udex-masthead-country-selector__item udex-masthead-country-selector__item_countries"
35
+ @click="{{../handleCountryClick}}"
36
+ _country-code="{{this.countryCode}}"
37
+ url="{{this.url}}"
38
+ label="{{this.displayTitle}}"
39
+ index="{{@index}}"
40
+ part="menu-item"
41
+ is-nav-item>
42
+ </udex-masthead-menu-item>
43
+ </li>
44
+ {{/each}}
45
+ </ul>
46
+ </div>
47
+ </div>
44
48
  {{else}}
45
49
  <span class="udex-masthead-country-selector__title">{{regionTitle}}</span>
46
50
  <ul class="udex-masthead-country-selector__list" role="menu">
@@ -215,6 +215,8 @@ class UDExMastheadCountrySelector extends UI5Element {
215
215
  _accSearchResultInfo?: string;
216
216
  _activeRegionIndex!: number;
217
217
  _mastheadShell!: UDExMastheadShell;
218
+ _countriesListHolderClassName = "udex-masthead-country-selector__list-wrap";
219
+ _itemClassName = "udex-masthead-country-selector__item";
218
220
 
219
221
  @i18n("@sapudex/web-components")
220
222
  static i18nBundle: I18nBundle;
@@ -234,6 +236,10 @@ class UDExMastheadCountrySelector extends UI5Element {
234
236
  if (this.isSingleMode) {
235
237
  this.handleSingleRegionMode();
236
238
  }
239
+
240
+ if (this._activeCountries) {
241
+ this.checkScrollableCountriesList();
242
+ }
237
243
  }
238
244
 
239
245
  onEnterDOM(): void {
@@ -397,10 +403,10 @@ class UDExMastheadCountrySelector extends UI5Element {
397
403
  const lastItemIndex = this.items.length - 1;
398
404
  const prevIndex = currentIndex - 1 < 0 ? lastItemIndex : currentIndex - 1;
399
405
  const prevItem = this.items[prevIndex];
400
-
401
406
  this.items[currentIndex]._tabIndex = "-1";
402
407
  prevItem._tabIndex = "0";
403
- prevItem.focus();
408
+ prevItem.scrollIntoView({ block: "center" });
409
+ prevItem.focus({ preventScroll: true });
404
410
  }
405
411
 
406
412
  focusNextItem(e: KeyboardEvent): void {
@@ -408,34 +414,53 @@ class UDExMastheadCountrySelector extends UI5Element {
408
414
  const lastItemIndex = this.items.length - 1;
409
415
  const nextIndex = currentIndex + 1 > lastItemIndex ? 0 : currentIndex + 1;
410
416
  const nextItem = this.items[nextIndex];
411
-
412
417
  this.items[currentIndex]._tabIndex = "-1";
413
418
  nextItem._tabIndex = "0";
414
- nextItem.focus();
419
+ nextItem.scrollIntoView({ block: "center" });
420
+ nextItem.focus({ preventScroll: true });
421
+ }
422
+
423
+ focusLastItem(e: KeyboardEvent): void {
424
+ const currentIndex = (e.target as UDExMastheadMenuItem).index;
425
+ const lastItemIndex = this.items.length - 1;
426
+ const lastItem = this.items[lastItemIndex];
427
+
428
+ this.items[currentIndex]._tabIndex = "-1";
429
+ lastItem._tabIndex = "0";
430
+ lastItem.scrollIntoView({ block: "end" });
431
+ lastItem.focus({ preventScroll: true });
432
+ }
433
+
434
+ focusFirstItem(e: KeyboardEvent): void {
435
+ const currentIndex = (e.target as UDExMastheadMenuItem).index;
436
+ const firstItem = this.items[0];
437
+
438
+ this.items[currentIndex]._tabIndex = "-1";
439
+ firstItem._tabIndex = "0";
440
+ firstItem.focus();
415
441
  }
416
442
 
417
443
  handleEndKey(e: KeyboardEvent): void {
418
444
  if (isEnd(e)) {
419
445
  e.preventDefault();
420
- const currentIndex = (e.target as UDExMastheadMenuItem).index;
421
- const lastItemIndex = this.items.length - 1;
422
- const lastItem = this.items[lastItemIndex];
423
446
 
424
- this.items[currentIndex]._tabIndex = "-1";
425
- lastItem._tabIndex = "0";
426
- lastItem.focus();
447
+ if (this.isScrollableCountriesList) {
448
+ this.removeScrollableClassInCountryList();
449
+ }
450
+
451
+ this.focusLastItem(e);
427
452
  }
428
453
  }
429
454
 
430
455
  handleHomeKey(e: KeyboardEvent): void {
431
456
  if (isHome(e)) {
432
457
  e.preventDefault();
433
- const currentIndex = (e.target as UDExMastheadMenuItem).index;
434
- const firstItem = this.items[0];
435
458
 
436
- this.items[currentIndex]._tabIndex = "-1";
437
- firstItem._tabIndex = "0";
438
- firstItem.focus();
459
+ if (this.isScrollableCountriesList) {
460
+ this.addScrollableClassToCountryList();
461
+ }
462
+
463
+ this.focusFirstItem(e);
439
464
  }
440
465
  }
441
466
 
@@ -509,6 +534,48 @@ class UDExMastheadCountrySelector extends UI5Element {
509
534
  this._mastheadShell.mobileBtn?.focus();
510
535
  }
511
536
 
537
+ checkScrollableCountriesList(): void {
538
+ if (this.countryListHolder) {
539
+ requestAnimationFrame(() => {
540
+ if (this.isScrollableCountriesList) {
541
+ this.addScrollableClassToCountryList();
542
+ } else {
543
+ this.removeScrollableClassInCountryList();
544
+ }
545
+ });
546
+ }
547
+ }
548
+
549
+ handleCountryListShadowVisible(): void {
550
+ if (this.scrollBottomCountriesList === 0) {
551
+ this.removeScrollableClassInCountryList();
552
+ } else {
553
+ this.addScrollableClassToCountryList();
554
+ }
555
+ }
556
+
557
+ addScrollableClassToCountryList(): void {
558
+ this.countryListHolder.classList.add(`${this._countriesListHolderClassName}_scrollable`);
559
+ }
560
+
561
+ removeScrollableClassInCountryList(): void {
562
+ this.countryListHolder.classList.remove(`${this._countriesListHolderClassName}_scrollable`);
563
+ }
564
+
565
+ get scrollBottomCountriesList(): number {
566
+ const countriesList = this.countryListHolder;
567
+ return countriesList.scrollHeight - countriesList.scrollTop - countriesList.clientHeight;
568
+ }
569
+
570
+ get isScrollableCountriesList(): boolean {
571
+ const countriesList = this.countryListHolder;
572
+ return countriesList ? countriesList.scrollHeight > countriesList.clientHeight : false;
573
+ }
574
+
575
+ get countryListHolder(): HTMLElement {
576
+ return this.shadowRoot?.querySelector<HTMLElement>(`.${this._countriesListHolderClassName}`) as HTMLElement;
577
+ }
578
+
512
579
  get noMatchesFoundText(): string {
513
580
  return translate(UDExMastheadCountrySelector, NO_MATCHES_FOUND);
514
581
  }
@@ -518,7 +585,7 @@ class UDExMastheadCountrySelector extends UI5Element {
518
585
  }
519
586
 
520
587
  get items(): Array<UDExMastheadMenuItem> {
521
- const items = this.shadowRoot?.querySelectorAll<UDExMastheadMenuItem>(".udex-masthead-country-selector__item");
588
+ const items = this.shadowRoot?.querySelectorAll<UDExMastheadMenuItem>(`.${this._itemClassName}`);
522
589
  return items ? Array.from(items) : [];
523
590
  }
524
591
 
@@ -43,7 +43,7 @@
43
43
  role="{{accessibleRoleName}}"
44
44
  id="{{this._id}}"
45
45
  class="udex-masthead-item__btn {{additionalClass}}"
46
- aria-expanded="{{selected}}"
46
+ aria-expanded="{{buttonAriaExpanded}}"
47
47
  aria-controls="{{this._id}}_dropdown"
48
48
  aria-describedby="{{ariaDescribedBy}}"
49
49
  aria-haspopup="{{hasDropdownSlot}}"
@@ -412,7 +412,7 @@ class UDExMastheadItem extends UI5Element implements IMastheadItem {
412
412
 
413
413
  handleItemClick(e: PointerEvent): void {
414
414
  if (this.isProfileBtn) {
415
- this.profileSlot?.closeIdentitiesPanel();
415
+ this.handleProfileButtonClick();
416
416
  }
417
417
  this.handleSelectedChange();
418
418
  this.fireItemClickEvent(e);
@@ -423,6 +423,15 @@ class UDExMastheadItem extends UI5Element implements IMastheadItem {
423
423
  this.selected = this.isMobile ? true : !this.selected;
424
424
  }
425
425
 
426
+ handleProfileButtonClick(): void {
427
+ const profile = this.profileSlot;
428
+ if (profile) {
429
+ profile.closeIdentitiesPanel();
430
+ profile.scrollToTopProfileMenu();
431
+ profile._requestRender = true;
432
+ }
433
+ }
434
+
426
435
  fireDropdownEvents(): void {
427
436
  if (this.hasDropdownSlot) {
428
437
  const { Open, Close } = UDExMastheadDropdownItemAction;
@@ -677,6 +686,12 @@ class UDExMastheadItem extends UI5Element implements IMastheadItem {
677
686
 
678
687
  return this.firstChild?.nodeValue?.trim() || "";
679
688
  }
689
+
690
+ get buttonAriaExpanded(): boolean | undefined {
691
+ if (!this.isSearchBtn) {
692
+ return this.selected;
693
+ }
694
+ }
680
695
  }
681
696
 
682
697
  UDExMastheadItem.define();