@sapudex/web-components 2.7.2 → 2.9.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 (96) hide show
  1. package/bundle.esm.js +2 -0
  2. package/cypress/specs/EventRibbon.cy.tsx +25 -6
  3. package/cypress/specs/LinkList.cy.tsx +49 -0
  4. package/cypress/specs/LinkListItem.cy.tsx +102 -0
  5. package/cypress/support/component-imports.instrumented.ts +4 -0
  6. package/cypress/support/component-imports.src.ts +4 -0
  7. package/dist/EventRibbon.d.ts +15 -1
  8. package/dist/EventRibbon.js +11 -3
  9. package/dist/EventRibbon.js.map +1 -1
  10. package/dist/EventRibbonTemplate.js +5 -1
  11. package/dist/EventRibbonTemplate.js.map +1 -1
  12. package/dist/LinkList.d.ts +58 -0
  13. package/dist/LinkList.js +89 -0
  14. package/dist/LinkList.js.map +1 -0
  15. package/dist/LinkListItem.d.ts +78 -0
  16. package/dist/LinkListItem.js +97 -0
  17. package/dist/LinkListItem.js.map +1 -0
  18. package/dist/LinkListItemTemplate.d.ts +2 -0
  19. package/dist/LinkListItemTemplate.js +17 -0
  20. package/dist/LinkListItemTemplate.js.map +1 -0
  21. package/dist/LinkListTemplate.d.ts +2 -0
  22. package/dist/LinkListTemplate.js +5 -0
  23. package/dist/LinkListTemplate.js.map +1 -0
  24. package/dist/Tile.d.ts +2 -2
  25. package/dist/Tile.js +3 -3
  26. package/dist/Tile.js.map +1 -1
  27. package/dist/TileTemplate.d.ts +2 -0
  28. package/dist/TileTemplate.js +7 -0
  29. package/dist/TileTemplate.js.map +1 -0
  30. package/dist/assets/{InputSuggestions-D0OZo5eY.js → InputSuggestions-BmjyLzkP.js} +1 -1
  31. package/dist/assets/{ListItemStandardExpandableTextTemplate-BOc_KoW1.js → ListItemStandardExpandableTextTemplate-CDt3iORy.js} +1 -1
  32. package/dist/assets/{bundle.esm-BLn1Dq6A.js → bundle.esm-Dz11sAJe.js} +205 -203
  33. package/dist/css/themes/EventRibbon.css +1 -1
  34. package/dist/css/themes/LinkList.css +1 -0
  35. package/dist/css/themes/LinkListItem.css +1 -0
  36. package/dist/css/themes/ListGroupHeader.css +1 -1
  37. package/dist/css/themes/ListItem.css +1 -1
  38. package/dist/css/themes/ProgressBar.css +1 -1
  39. package/dist/css/themes/RatingIndicator.css +1 -1
  40. package/dist/css/themes/Slider.css +1 -1
  41. package/dist/custom-elements-internal.json +345 -2
  42. package/dist/custom-elements.json +327 -2
  43. package/dist/generated/themes/EventRibbon.css.d.ts +1 -1
  44. package/dist/generated/themes/EventRibbon.css.js +1 -1
  45. package/dist/generated/themes/EventRibbon.css.js.map +1 -1
  46. package/dist/generated/themes/LinkList.css.d.ts +2 -0
  47. package/dist/generated/themes/LinkList.css.js +8 -0
  48. package/dist/generated/themes/LinkList.css.js.map +1 -0
  49. package/dist/generated/themes/LinkListItem.css.d.ts +2 -0
  50. package/dist/generated/themes/LinkListItem.css.js +8 -0
  51. package/dist/generated/themes/LinkListItem.css.js.map +1 -0
  52. package/dist/generated/themes/ListGroupHeader.css.d.ts +1 -1
  53. package/dist/generated/themes/ListGroupHeader.css.js +1 -1
  54. package/dist/generated/themes/ListGroupHeader.css.js.map +1 -1
  55. package/dist/generated/themes/ListItem.css.d.ts +1 -1
  56. package/dist/generated/themes/ListItem.css.js +1 -1
  57. package/dist/generated/themes/ListItem.css.js.map +1 -1
  58. package/dist/generated/themes/ProgressBar.css.d.ts +1 -1
  59. package/dist/generated/themes/ProgressBar.css.js +1 -1
  60. package/dist/generated/themes/ProgressBar.css.js.map +1 -1
  61. package/dist/generated/themes/RatingIndicator.css.d.ts +1 -1
  62. package/dist/generated/themes/RatingIndicator.css.js +1 -1
  63. package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
  64. package/dist/generated/themes/Slider.css.d.ts +1 -1
  65. package/dist/generated/themes/Slider.css.js +1 -1
  66. package/dist/generated/themes/Slider.css.js.map +1 -1
  67. package/dist/vscode.html-custom-data.json +83 -1
  68. package/dist/web-types.json +163 -3
  69. package/package.json +1 -1
  70. package/src/EventRibbon.ts +24 -5
  71. package/src/EventRibbonTemplate.tsx +17 -6
  72. package/src/LinkList.ts +93 -0
  73. package/src/LinkListItem.ts +126 -0
  74. package/src/LinkListItemTemplate.tsx +52 -0
  75. package/src/LinkListTemplate.tsx +13 -0
  76. package/src/Tile.ts +5 -5
  77. package/src/TileTemplate.tsx +31 -0
  78. package/src/generated/themes/EventRibbon.css.ts +1 -1
  79. package/src/generated/themes/LinkList.css.ts +9 -0
  80. package/src/generated/themes/LinkListItem.css.ts +9 -0
  81. package/src/generated/themes/ListGroupHeader.css.ts +1 -1
  82. package/src/generated/themes/ListItem.css.ts +1 -1
  83. package/src/generated/themes/ProgressBar.css.ts +1 -1
  84. package/src/generated/themes/RatingIndicator.css.ts +1 -1
  85. package/src/generated/themes/Slider.css.ts +1 -1
  86. package/src/themes/EventRibbon.css +34 -28
  87. package/src/themes/LinkList.css +53 -0
  88. package/src/themes/LinkListItem.css +84 -0
  89. package/src/themes/ListGroupHeader.css +1 -1
  90. package/src/themes/ListItem.css +2 -2
  91. package/src/themes/ProgressBar.css +2 -1
  92. package/dist/generated/templates/TileTemplate.lit.d.ts +0 -3
  93. package/dist/generated/templates/TileTemplate.lit.js +0 -9
  94. package/dist/generated/templates/TileTemplate.lit.js.map +0 -1
  95. package/src/Tile.hbs +0 -21
  96. package/src/generated/templates/TileTemplate.lit.ts +0 -13
@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
5
 
6
6
  registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
7
  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);
8
- export default `:host{--udex-event-ribbon-dark-text-color: var(--udexColorNeutralWhite);--udex-event-ribbon-light-text-color: var(--udexColorNeutralBlack);--udex-event-ribbon-light-grey1-default-background-color: var(--udexColorGrey1);--udex-event-ribbon-light-grey1-hover-background-color: var(--udexColorGrey2);--udex-event-ribbon-light-grey2-default-background-color: var(--udexColorGrey2);--udex-event-ribbon-light-grey2-hover-background-color: var(--udexColorGrey3);--udex-event-ribbon-light-grey3-default-background-color: var(--udexColorGrey3);--udex-event-ribbon-light-grey3-hover-background-color: var(--udexColorGrey4);--udex-event-ribbon-light-grey4-default-background-color: var(--udexColorGrey4);--udex-event-ribbon-light-grey4-hover-background-color: var(--udexColorGrey5);--udex-event-ribbon-light-blue1-default-background-color: var(--udexColorBlue1);--udex-event-ribbon-light-blue1-hover-background-color: var(--udexColorBlue2);--udex-event-ribbon-light-blue2-default-background-color: var(--udexColorBlue2);--udex-event-ribbon-light-blue2-hover-background-color: var(--udexColorBlue3);--udex-event-ribbon-light-blue3-default-background-color: var(--udexColorBlue3);--udex-event-ribbon-light-blue3-hover-background-color: var(--udexColorBlue4);--udex-event-ribbon-light-blue4-default-background-color: var(--udexColorBlue4);--udex-event-ribbon-light-blue4-hover-background-color: var(--udexColorBlue5);--udex-event-ribbon-light-teal1-default-background-color: var(--udexColorTeal1);--udex-event-ribbon-light-teal1-hover-background-color: var(--udexColorTeal2);--udex-event-ribbon-light-teal2-default-background-color: var(--udexColorTeal2);--udex-event-ribbon-light-teal2-hover-background-color: var(--udexColorTeal3);--udex-event-ribbon-light-teal3-default-background-color: var(--udexColorTeal3);--udex-event-ribbon-light-teal3-hover-background-color: var(--udexColorTeal4);--udex-event-ribbon-light-teal4-default-background-color: var(--udexColorTeal4);--udex-event-ribbon-light-teal4-hover-background-color: var(--udexColorTeal5);--udex-event-ribbon-light-green1-default-background-color: var(--udexColorGreen1);--udex-event-ribbon-light-green1-hover-background-color: var(--udexColorGreen2);--udex-event-ribbon-light-green2-default-background-color: var(--udexColorGreen2);--udex-event-ribbon-light-green2-hover-background-color: var(--udexColorGreen3);--udex-event-ribbon-light-green3-default-background-color: var(--udexColorGreen3);--udex-event-ribbon-light-green3-hover-background-color: var(--udexColorGreen4);--udex-event-ribbon-light-green4-default-background-color: var(--udexColorGreen4);--udex-event-ribbon-light-green4-hover-background-color: var(--udexColorGreen5);--udex-event-ribbon-light-mango1-default-background-color: var(--udexColorMango1);--udex-event-ribbon-light-mango1-hover-background-color: var(--udexColorMango2);--udex-event-ribbon-light-mango2-default-background-color: var(--udexColorMango2);--udex-event-ribbon-light-mango2-hover-background-color: var(--udexColorMango3);--udex-event-ribbon-light-mango3-default-background-color: var(--udexColorMango3);--udex-event-ribbon-light-mango3-hover-background-color: var(--udexColorMango4);--udex-event-ribbon-light-mango4-default-background-color: var(--udexColorMango4);--udex-event-ribbon-light-mango4-hover-background-color: var(--udexColorMango5);--udex-event-ribbon-light-red1-default-background-color: var(--udexColorRed1);--udex-event-ribbon-light-red1-hover-background-color: var(--udexColorRed2);--udex-event-ribbon-light-red2-default-background-color: var(--udexColorRed2);--udex-event-ribbon-light-red2-hover-background-color: var(--udexColorRed3);--udex-event-ribbon-light-red3-default-background-color: var(--udexColorRed3);--udex-event-ribbon-light-red3-hover-background-color: var(--udexColorRed4);--udex-event-ribbon-light-red4-default-background-color: var(--udexColorRed4);--udex-event-ribbon-light-red4-hover-background-color: var(--udexColorRed5);--udex-event-ribbon-light-raspberry1-default-background-color: var(--udexColorRaspberry1);--udex-event-ribbon-light-raspberry1-hover-background-color: var(--udexColorRaspberry2);--udex-event-ribbon-light-raspberry2-default-background-color: var(--udexColorRaspberry2);--udex-event-ribbon-light-raspberry2-hover-background-color: var(--udexColorRaspberry3);--udex-event-ribbon-light-raspberry3-default-background-color: var(--udexColorRaspberry3);--udex-event-ribbon-light-raspberry3-hover-background-color: var(--udexColorRaspberry4);--udex-event-ribbon-light-raspberry4-default-background-color: var(--udexColorRaspberry4);--udex-event-ribbon-light-raspberry4-hover-background-color: var(--udexColorRaspberry5);--udex-event-ribbon-light-pink1-default-background-color: var(--udexColorPink1);--udex-event-ribbon-light-pink1-hover-background-color: var(--udexColorPink2);--udex-event-ribbon-light-pink2-default-background-color: var(--udexColorPink2);--udex-event-ribbon-light-pink2-hover-background-color: var(--udexColorPink3);--udex-event-ribbon-light-pink3-default-background-color: var(--udexColorPink3);--udex-event-ribbon-light-pink3-hover-background-color: var(--udexColorPink4);--udex-event-ribbon-light-pink4-default-background-color: var(--udexColorPink4);--udex-event-ribbon-light-pink4-hover-background-color: var(--udexColorPink5);--udex-event-ribbon-light-indigo1-default-background-color: var(--udexColorIndigo1);--udex-event-ribbon-light-indigo1-hover-background-color: var(--udexColorIndigo2);--udex-event-ribbon-light-indigo2-default-background-color: var(--udexColorIndigo2);--udex-event-ribbon-light-indigo2-hover-background-color: var(--udexColorIndigo3);--udex-event-ribbon-light-indigo3-default-background-color: var(--udexColorIndigo3);--udex-event-ribbon-light-indigo3-hover-background-color: var(--udexColorIndigo4);--udex-event-ribbon-light-indigo4-default-background-color: var(--udexColorIndigo4);--udex-event-ribbon-light-indigo4-hover-background-color: var(--udexColorIndigo5);--udex-event-ribbon-dark-grey1-default-background-color: var(--udexColorGrey7);--udex-event-ribbon-dark-grey1-hover-background-color: var(--udexColorGrey8);--udex-event-ribbon-dark-grey2-default-background-color: var(--udexColorGrey8);--udex-event-ribbon-dark-grey2-hover-background-color: var(--udexColorGrey9);--udex-event-ribbon-dark-grey3-default-background-color: var(--udexColorGrey9);--udex-event-ribbon-dark-grey3-hover-background-color: var(--udexColorGrey10);--udex-event-ribbon-dark-grey4-default-background-color: var(--udexColorGrey10);--udex-event-ribbon-dark-grey4-hover-background-color: var(--udexColorGrey11);--udex-event-ribbon-dark-blue1-default-background-color: var(--udexColorBlue7);--udex-event-ribbon-dark-blue1-hover-background-color: var(--udexColorBlue8);--udex-event-ribbon-dark-blue2-default-background-color: var(--udexColorBlue8);--udex-event-ribbon-dark-blue2-hover-background-color: var(--udexColorBlue9);--udex-event-ribbon-dark-blue3-default-background-color: var(--udexColorBlue9);--udex-event-ribbon-dark-blue3-hover-background-color: var(--udexColorBlue10);--udex-event-ribbon-dark-blue4-default-background-color: var(--udexColorBlue10);--udex-event-ribbon-dark-blue4-hover-background-color: var(--udexColorBlue11);--udex-event-ribbon-dark-teal1-default-background-color: var(--udexColorTeal7);--udex-event-ribbon-dark-teal1-hover-background-color: var(--udexColorTeal8);--udex-event-ribbon-dark-teal2-default-background-color: var(--udexColorTeal8);--udex-event-ribbon-dark-teal2-hover-background-color: var(--udexColorTeal9);--udex-event-ribbon-dark-teal3-default-background-color: var(--udexColorTeal9);--udex-event-ribbon-dark-teal3-hover-background-color: var(--udexColorTeal10);--udex-event-ribbon-dark-teal4-default-background-color: var(--udexColorTeal10);--udex-event-ribbon-dark-teal4-hover-background-color: var(--udexColorTeal11);--udex-event-ribbon-dark-green1-default-background-color: var(--udexColorGreen7);--udex-event-ribbon-dark-green1-hover-background-color: var(--udexColorGreen8);--udex-event-ribbon-dark-green2-default-background-color: var(--udexColorGreen8);--udex-event-ribbon-dark-green2-hover-background-color: var(--udexColorGreen9);--udex-event-ribbon-dark-green3-default-background-color: var(--udexColorGreen9);--udex-event-ribbon-dark-green3-hover-background-color: var(--udexColorGreen10);--udex-event-ribbon-dark-green4-default-background-color: var(--udexColorGreen10);--udex-event-ribbon-dark-green4-hover-background-color: var(--udexColorGreen11);--udex-event-ribbon-dark-mango1-default-background-color: var(--udexColorMango7);--udex-event-ribbon-dark-mango1-hover-background-color: var(--udexColorMango8);--udex-event-ribbon-dark-mango2-default-background-color: var(--udexColorMango8);--udex-event-ribbon-dark-mango2-hover-background-color: var(--udexColorMango9);--udex-event-ribbon-dark-mango3-default-background-color: var(--udexColorMango9);--udex-event-ribbon-dark-mango3-hover-background-color: var(--udexColorMango10);--udex-event-ribbon-dark-mango4-default-background-color: var(--udexColorMango10);--udex-event-ribbon-dark-mango4-hover-background-color: var(--udexColorMango11);--udex-event-ribbon-dark-red1-default-background-color: var(--udexColorRed7);--udex-event-ribbon-dark-red1-hover-background-color: var(--udexColorRed8);--udex-event-ribbon-dark-red2-default-background-color: var(--udexColorRed8);--udex-event-ribbon-dark-red2-hover-background-color: var(--udexColorRed9);--udex-event-ribbon-dark-red3-default-background-color: var(--udexColorRed9);--udex-event-ribbon-dark-red3-hover-background-color: var(--udexColorRed10);--udex-event-ribbon-dark-red4-default-background-color: var(--udexColorRed10);--udex-event-ribbon-dark-red4-hover-background-color: var(--udexColorRed11);--udex-event-ribbon-dark-raspberry1-default-background-color: var(--udexColorRaspberry7);--udex-event-ribbon-dark-raspberry1-hover-background-color: var(--udexColorRaspberry8);--udex-event-ribbon-dark-raspberry2-default-background-color: var(--udexColorRaspberry8);--udex-event-ribbon-dark-raspberry2-hover-background-color: var(--udexColorRaspberry9);--udex-event-ribbon-dark-raspberry3-default-background-color: var(--udexColorRaspberry9);--udex-event-ribbon-dark-raspberry3-hover-background-color: var(--udexColorRaspberry10);--udex-event-ribbon-dark-raspberry4-default-background-color: var(--udexColorRaspberry10);--udex-event-ribbon-dark-raspberry4-hover-background-color: var(--udexColorRaspberry11);--udex-event-ribbon-dark-pink1-default-background-color: var(--udexColorPink7);--udex-event-ribbon-dark-pink1-hover-background-color: var(--udexColorPink8);--udex-event-ribbon-dark-pink2-default-background-color: var(--udexColorPink8);--udex-event-ribbon-dark-pink2-hover-background-color: var(--udexColorPink9);--udex-event-ribbon-dark-pink3-default-background-color: var(--udexColorPink9);--udex-event-ribbon-dark-pink3-hover-background-color: var(--udexColorPink10);--udex-event-ribbon-dark-pink4-default-background-color: var(--udexColorPink10);--udex-event-ribbon-dark-pink4-hover-background-color: var(--udexColorPink11);--udex-event-ribbon-dark-indigo1-default-background-color: var(--udexColorIndigo7);--udex-event-ribbon-dark-indigo1-hover-background-color: var(--udexColorIndigo8);--udex-event-ribbon-dark-indigo2-default-background-color: var(--udexColorIndigo8);--udex-event-ribbon-dark-indigo2-hover-background-color: var(--udexColorIndigo9);--udex-event-ribbon-dark-indigo3-default-background-color: var(--udexColorIndigo9);--udex-event-ribbon-dark-indigo3-hover-background-color: var(--udexColorIndigo10);--udex-event-ribbon-dark-indigo4-default-background-color: var(--udexColorIndigo10);--udex-event-ribbon-dark-indigo4-hover-background-color: var(--udexColorIndigo11);--udex-event-ribbon-background-color: transparent;--udex-event-ribbon-hover-background-color: transparent;--udex-event-ribbon-margin-xl: 84px;--udex-event-ribbon-margin-m-l: 72px;--udex-event-ribbon-margin-s: 48px;--udex-event-ribbon-margin-xs: 24px;--udex-event-ribbon-logo-width: auto;--udex-event-ribbon-logo-height: auto;--udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-xl)) - (11 * var(--udexGridXLGutters))) / 12)}.udex-event-ribbon__container{box-sizing:border-box;position:relative;overflow:hidden;text-decoration:none;background-color:var(--udex-event-ribbon-background-color);color:var(--udex-event-ribbon-light-text-color);height:70px;font-family:var(--sapFontFamily, sans-serif);border-radius:var(--udexSpacer12, 12px);padding-block:var(--udexSpacer12, 12px);padding-inline:var(--udexSpacer36, 36px);margin-block:var(--udexSpacer56, 56px) 84px;margin-inline:auto;max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-xl));display:flex;align-items:center;gap:var(--udexSpacer32, 32px)}.udex-event-ribbon__container-with-background-image{background-image:var(--udex-event-ribbon-background-image);background-blend-mode:multiply;background-position:center;background-size:100%;background-repeat:no-repeat;transition:background ease-out .3s}.udex-event-ribbon__container:focus,.udex-event-ribbon__container:focus-visible{outline:solid var(--udexSpacer2, 2px) var(--udexColorBlue9, #0040B0);outline-offset:2px}.udex-event-ribbon__container:hover{background-color:var(--udex-event-ribbon-hover-background-color)}.udex-event-ribbon__container-with-background-image:hover{background-size:112%}:host([mode="dark"]) .udex-event-ribbon__container{color:var(--udex-event-ribbon-dark-text-color)}.udex-event-ribbon__logo{position:relative;display:flex;justify-content:flex-end;width:calc((var(--udex-event-ribbon-column-width) * 3 + 3 * var(--udexGridXLGutters)) - 36px)}.udex-event-ribbon__logo img{max-height:42px;height:var(--udex-event-ribbon-logo-height);width:var(--udex-event-ribbon-logo-width);max-width:100%}:host([mode="dark"]) .udex-event-ribbon__logo img{filter:brightness(0) invert(1)}.udex-event-ribbon__text{position:inherit;margin:0;padding:0;font-size:var(--udexTypographyBodyXSFontSize);line-height:1.5;width:calc(6 * var(--udex-event-ribbon-column-width) + 5 * var(--udexGridXLGutters));max-height:100%;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;text-overflow:ellipsis}.udex-event-ribbon__link-container{position:inherit;display:flex;align-items:center;gap:var(--udexSpacer8, 8px)}.udex-event-ribbon__link-container span{line-height:1.5;font-size:var(--udexTypographyBodyXSFontSize)}[ui5-icon]{width:20px;height:20px;flex-shrink:0;color:inherit}@media (max-width: 1599px){:host{--udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-m-l)) - (11 * var(--udexGridXLGutters))) / 12)}.udex-event-ribbon__container{max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-m-l))}}@media (max-width: 1279px){.udex-event-ribbon__container{margin-block:var(--udexSpacer40, 40px) 64px;gap:var(--udexSpacer24, 24px);padding-inline:var(--udexSpacer24, 24px)}.udex-event-ribbon__logo{width:calc((var(--udex-event-ribbon-column-width) * 3 + 3 * var(--udexGridXLGutters)) - 24px)}}@media (max-width: 979px){:host{--udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-s)) - (11 * var(--udexGridSGutters))) / 12)}.udex-event-ribbon__container{flex-direction:column;height:fit-content;padding-block:var(--udexSpacer16, 16px);gap:var(--udexSpacer8, 8px);align-items:flex-start;margin-block:var(--udexSpacer40, 40px) 64px;max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-s))}.udex-event-ribbon__text{width:100%}.udex-event-ribbon__logo{justify-content:flex-start;width:100%}}@media (max-width: 639px){:host{--udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-xs)) - (11 * var(--udexGridXSGutters))) / 12)}.udex-event-ribbon__container{padding-inline:var(--udexSpacer16, 16px);margin-block:var(--udexSpacer32, 32px) var(--udexSpacer56, 56px);max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-xs))}}
8
+ export default `:host{--udex-event-ribbon-dark-text-color: var(--udexColorNeutralWhite);--udex-event-ribbon-light-text-color: var(--udexColorNeutralBlack);--udex-event-ribbon-light-grey1-default-background-color: var(--udexColorGrey1);--udex-event-ribbon-light-grey1-hover-background-color: var(--udexColorGrey2);--udex-event-ribbon-light-grey2-default-background-color: var(--udexColorGrey2);--udex-event-ribbon-light-grey2-hover-background-color: var(--udexColorGrey3);--udex-event-ribbon-light-grey3-default-background-color: var(--udexColorGrey3);--udex-event-ribbon-light-grey3-hover-background-color: var(--udexColorGrey4);--udex-event-ribbon-light-grey4-default-background-color: var(--udexColorGrey4);--udex-event-ribbon-light-grey4-hover-background-color: var(--udexColorGrey5);--udex-event-ribbon-light-blue1-default-background-color: var(--udexColorBlue1);--udex-event-ribbon-light-blue1-hover-background-color: var(--udexColorBlue2);--udex-event-ribbon-light-blue2-default-background-color: var(--udexColorBlue2);--udex-event-ribbon-light-blue2-hover-background-color: var(--udexColorBlue3);--udex-event-ribbon-light-blue3-default-background-color: var(--udexColorBlue3);--udex-event-ribbon-light-blue3-hover-background-color: var(--udexColorBlue4);--udex-event-ribbon-light-blue4-default-background-color: var(--udexColorBlue4);--udex-event-ribbon-light-blue4-hover-background-color: var(--udexColorBlue5);--udex-event-ribbon-light-teal1-default-background-color: var(--udexColorTeal1);--udex-event-ribbon-light-teal1-hover-background-color: var(--udexColorTeal2);--udex-event-ribbon-light-teal2-default-background-color: var(--udexColorTeal2);--udex-event-ribbon-light-teal2-hover-background-color: var(--udexColorTeal3);--udex-event-ribbon-light-teal3-default-background-color: var(--udexColorTeal3);--udex-event-ribbon-light-teal3-hover-background-color: var(--udexColorTeal4);--udex-event-ribbon-light-teal4-default-background-color: var(--udexColorTeal4);--udex-event-ribbon-light-teal4-hover-background-color: var(--udexColorTeal5);--udex-event-ribbon-light-green1-default-background-color: var(--udexColorGreen1);--udex-event-ribbon-light-green1-hover-background-color: var(--udexColorGreen2);--udex-event-ribbon-light-green2-default-background-color: var(--udexColorGreen2);--udex-event-ribbon-light-green2-hover-background-color: var(--udexColorGreen3);--udex-event-ribbon-light-green3-default-background-color: var(--udexColorGreen3);--udex-event-ribbon-light-green3-hover-background-color: var(--udexColorGreen4);--udex-event-ribbon-light-green4-default-background-color: var(--udexColorGreen4);--udex-event-ribbon-light-green4-hover-background-color: var(--udexColorGreen5);--udex-event-ribbon-light-mango1-default-background-color: var(--udexColorMango1);--udex-event-ribbon-light-mango1-hover-background-color: var(--udexColorMango2);--udex-event-ribbon-light-mango2-default-background-color: var(--udexColorMango2);--udex-event-ribbon-light-mango2-hover-background-color: var(--udexColorMango3);--udex-event-ribbon-light-mango3-default-background-color: var(--udexColorMango3);--udex-event-ribbon-light-mango3-hover-background-color: var(--udexColorMango4);--udex-event-ribbon-light-mango4-default-background-color: var(--udexColorMango4);--udex-event-ribbon-light-mango4-hover-background-color: var(--udexColorMango5);--udex-event-ribbon-light-red1-default-background-color: var(--udexColorRed1);--udex-event-ribbon-light-red1-hover-background-color: var(--udexColorRed2);--udex-event-ribbon-light-red2-default-background-color: var(--udexColorRed2);--udex-event-ribbon-light-red2-hover-background-color: var(--udexColorRed3);--udex-event-ribbon-light-red3-default-background-color: var(--udexColorRed3);--udex-event-ribbon-light-red3-hover-background-color: var(--udexColorRed4);--udex-event-ribbon-light-red4-default-background-color: var(--udexColorRed4);--udex-event-ribbon-light-red4-hover-background-color: var(--udexColorRed5);--udex-event-ribbon-light-raspberry1-default-background-color: var(--udexColorRaspberry1);--udex-event-ribbon-light-raspberry1-hover-background-color: var(--udexColorRaspberry2);--udex-event-ribbon-light-raspberry2-default-background-color: var(--udexColorRaspberry2);--udex-event-ribbon-light-raspberry2-hover-background-color: var(--udexColorRaspberry3);--udex-event-ribbon-light-raspberry3-default-background-color: var(--udexColorRaspberry3);--udex-event-ribbon-light-raspberry3-hover-background-color: var(--udexColorRaspberry4);--udex-event-ribbon-light-raspberry4-default-background-color: var(--udexColorRaspberry4);--udex-event-ribbon-light-raspberry4-hover-background-color: var(--udexColorRaspberry5);--udex-event-ribbon-light-pink1-default-background-color: var(--udexColorPink1);--udex-event-ribbon-light-pink1-hover-background-color: var(--udexColorPink2);--udex-event-ribbon-light-pink2-default-background-color: var(--udexColorPink2);--udex-event-ribbon-light-pink2-hover-background-color: var(--udexColorPink3);--udex-event-ribbon-light-pink3-default-background-color: var(--udexColorPink3);--udex-event-ribbon-light-pink3-hover-background-color: var(--udexColorPink4);--udex-event-ribbon-light-pink4-default-background-color: var(--udexColorPink4);--udex-event-ribbon-light-pink4-hover-background-color: var(--udexColorPink5);--udex-event-ribbon-light-indigo1-default-background-color: var(--udexColorIndigo1);--udex-event-ribbon-light-indigo1-hover-background-color: var(--udexColorIndigo2);--udex-event-ribbon-light-indigo2-default-background-color: var(--udexColorIndigo2);--udex-event-ribbon-light-indigo2-hover-background-color: var(--udexColorIndigo3);--udex-event-ribbon-light-indigo3-default-background-color: var(--udexColorIndigo3);--udex-event-ribbon-light-indigo3-hover-background-color: var(--udexColorIndigo4);--udex-event-ribbon-light-indigo4-default-background-color: var(--udexColorIndigo4);--udex-event-ribbon-light-indigo4-hover-background-color: var(--udexColorIndigo5);--udex-event-ribbon-dark-grey1-default-background-color: var(--udexColorGrey7);--udex-event-ribbon-dark-grey1-hover-background-color: var(--udexColorGrey8);--udex-event-ribbon-dark-grey2-default-background-color: var(--udexColorGrey8);--udex-event-ribbon-dark-grey2-hover-background-color: var(--udexColorGrey9);--udex-event-ribbon-dark-grey3-default-background-color: var(--udexColorGrey9);--udex-event-ribbon-dark-grey3-hover-background-color: var(--udexColorGrey10);--udex-event-ribbon-dark-grey4-default-background-color: var(--udexColorGrey10);--udex-event-ribbon-dark-grey4-hover-background-color: var(--udexColorGrey11);--udex-event-ribbon-dark-blue1-default-background-color: var(--udexColorBlue7);--udex-event-ribbon-dark-blue1-hover-background-color: var(--udexColorBlue8);--udex-event-ribbon-dark-blue2-default-background-color: var(--udexColorBlue8);--udex-event-ribbon-dark-blue2-hover-background-color: var(--udexColorBlue9);--udex-event-ribbon-dark-blue3-default-background-color: var(--udexColorBlue9);--udex-event-ribbon-dark-blue3-hover-background-color: var(--udexColorBlue10);--udex-event-ribbon-dark-blue4-default-background-color: var(--udexColorBlue10);--udex-event-ribbon-dark-blue4-hover-background-color: var(--udexColorBlue11);--udex-event-ribbon-dark-teal1-default-background-color: var(--udexColorTeal7);--udex-event-ribbon-dark-teal1-hover-background-color: var(--udexColorTeal8);--udex-event-ribbon-dark-teal2-default-background-color: var(--udexColorTeal8);--udex-event-ribbon-dark-teal2-hover-background-color: var(--udexColorTeal9);--udex-event-ribbon-dark-teal3-default-background-color: var(--udexColorTeal9);--udex-event-ribbon-dark-teal3-hover-background-color: var(--udexColorTeal10);--udex-event-ribbon-dark-teal4-default-background-color: var(--udexColorTeal10);--udex-event-ribbon-dark-teal4-hover-background-color: var(--udexColorTeal11);--udex-event-ribbon-dark-green1-default-background-color: var(--udexColorGreen7);--udex-event-ribbon-dark-green1-hover-background-color: var(--udexColorGreen8);--udex-event-ribbon-dark-green2-default-background-color: var(--udexColorGreen8);--udex-event-ribbon-dark-green2-hover-background-color: var(--udexColorGreen9);--udex-event-ribbon-dark-green3-default-background-color: var(--udexColorGreen9);--udex-event-ribbon-dark-green3-hover-background-color: var(--udexColorGreen10);--udex-event-ribbon-dark-green4-default-background-color: var(--udexColorGreen10);--udex-event-ribbon-dark-green4-hover-background-color: var(--udexColorGreen11);--udex-event-ribbon-dark-mango1-default-background-color: var(--udexColorMango7);--udex-event-ribbon-dark-mango1-hover-background-color: var(--udexColorMango8);--udex-event-ribbon-dark-mango2-default-background-color: var(--udexColorMango8);--udex-event-ribbon-dark-mango2-hover-background-color: var(--udexColorMango9);--udex-event-ribbon-dark-mango3-default-background-color: var(--udexColorMango9);--udex-event-ribbon-dark-mango3-hover-background-color: var(--udexColorMango10);--udex-event-ribbon-dark-mango4-default-background-color: var(--udexColorMango10);--udex-event-ribbon-dark-mango4-hover-background-color: var(--udexColorMango11);--udex-event-ribbon-dark-red1-default-background-color: var(--udexColorRed7);--udex-event-ribbon-dark-red1-hover-background-color: var(--udexColorRed8);--udex-event-ribbon-dark-red2-default-background-color: var(--udexColorRed8);--udex-event-ribbon-dark-red2-hover-background-color: var(--udexColorRed9);--udex-event-ribbon-dark-red3-default-background-color: var(--udexColorRed9);--udex-event-ribbon-dark-red3-hover-background-color: var(--udexColorRed10);--udex-event-ribbon-dark-red4-default-background-color: var(--udexColorRed10);--udex-event-ribbon-dark-red4-hover-background-color: var(--udexColorRed11);--udex-event-ribbon-dark-raspberry1-default-background-color: var(--udexColorRaspberry7);--udex-event-ribbon-dark-raspberry1-hover-background-color: var(--udexColorRaspberry8);--udex-event-ribbon-dark-raspberry2-default-background-color: var(--udexColorRaspberry8);--udex-event-ribbon-dark-raspberry2-hover-background-color: var(--udexColorRaspberry9);--udex-event-ribbon-dark-raspberry3-default-background-color: var(--udexColorRaspberry9);--udex-event-ribbon-dark-raspberry3-hover-background-color: var(--udexColorRaspberry10);--udex-event-ribbon-dark-raspberry4-default-background-color: var(--udexColorRaspberry10);--udex-event-ribbon-dark-raspberry4-hover-background-color: var(--udexColorRaspberry11);--udex-event-ribbon-dark-pink1-default-background-color: var(--udexColorPink7);--udex-event-ribbon-dark-pink1-hover-background-color: var(--udexColorPink8);--udex-event-ribbon-dark-pink2-default-background-color: var(--udexColorPink8);--udex-event-ribbon-dark-pink2-hover-background-color: var(--udexColorPink9);--udex-event-ribbon-dark-pink3-default-background-color: var(--udexColorPink9);--udex-event-ribbon-dark-pink3-hover-background-color: var(--udexColorPink10);--udex-event-ribbon-dark-pink4-default-background-color: var(--udexColorPink10);--udex-event-ribbon-dark-pink4-hover-background-color: var(--udexColorPink11);--udex-event-ribbon-dark-indigo1-default-background-color: var(--udexColorIndigo7);--udex-event-ribbon-dark-indigo1-hover-background-color: var(--udexColorIndigo8);--udex-event-ribbon-dark-indigo2-default-background-color: var(--udexColorIndigo8);--udex-event-ribbon-dark-indigo2-hover-background-color: var(--udexColorIndigo9);--udex-event-ribbon-dark-indigo3-default-background-color: var(--udexColorIndigo9);--udex-event-ribbon-dark-indigo3-hover-background-color: var(--udexColorIndigo10);--udex-event-ribbon-dark-indigo4-default-background-color: var(--udexColorIndigo10);--udex-event-ribbon-dark-indigo4-hover-background-color: var(--udexColorIndigo11);--udex-event-ribbon-background-color: transparent;--udex-event-ribbon-hover-background-color: transparent;--udex-event-ribbon-margin-xl: 84px;--udex-event-ribbon-margin-m-l: 72px;--udex-event-ribbon-margin-s: 48px;--udex-event-ribbon-margin-xs: 24px;--udex-event-ribbon-logo-height: auto;--udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-xl)) - (11 * var(--udexGridXLGutters))) / 12)}.udex-event-ribbon__container{box-sizing:border-box;position:relative;overflow:hidden;text-decoration:none;background-color:var(--udex-event-ribbon-background-color);color:var(--udex-event-ribbon-light-text-color);height:70px;font-family:var(--sapFontFamily, sans-serif);border-radius:var(--udexSpacer12, 12px);padding-block:var(--udexSpacer12, 12px);padding-inline:var(--udexSpacer36, 36px);margin-block:var(--udexSpacer56, 56px) 84px;margin-inline:auto;max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-xl));display:flex;align-items:center;gap:var(--udexSpacer32, 32px)}.udex-event-ribbon__container-with-background-image{background-image:var(--udex-event-ribbon-background-image);background-blend-mode:multiply;background-position:center;background-size:100%;background-repeat:no-repeat;transition:background ease-out .3s}.udex-event-ribbon__container:focus,.udex-event-ribbon__container:focus-visible{outline:solid var(--udexSpacer2, 2px) var(--udexColorBlue9, #0040B0);outline-offset:2px}.udex-event-ribbon__container:hover{background-color:var(--udex-event-ribbon-hover-background-color)}.udex-event-ribbon__container-with-background-image:hover{background-size:112%}:host([mode="dark"]) .udex-event-ribbon__container{color:var(--udex-event-ribbon-dark-text-color)}.udex-event-ribbon__logo{position:relative;display:flex;justify-content:flex-end;width:24.8%}:host([event-logo="sapphire"]){--udex-event-ribbon-logo-height: 40px}:host([event-logo="connect"]){--udex-event-ribbon-logo-height: 18px}:host([event-logo="now"]){--udex-event-ribbon-logo-height: 24px}:host([event-logo="teched"]){--udex-event-ribbon-logo-height: 21px}.udex-event-ribbon__logo-img{max-height:42px;height:var(--udex-event-ribbon-logo-height);max-width:100%}:host([mode="dark"]) .udex-event-ribbon__logo-img{filter:brightness(0) invert(1)}.udex-event-ribbon__text{position:inherit;margin:0;padding:0;font-size:var(--udexTypographyBodyXSFontSize);line-height:var(--udexTypographyBodyLineHeight);width:51%;max-height:100%;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;text-overflow:ellipsis}.udex-event-ribbon__link-container{position:inherit;display:flex;align-items:center;gap:var(--udexSpacer8, 8px);width:21%}.udex-event-ribbon__link-text{line-height:var(--udexTypographyBodyLineHeight);font-size:var(--udexTypographyBodyXSFontSize);white-space:nowrap}[ui5-icon]{width:20px;height:20px;flex-shrink:0;color:inherit}@media (max-width: 1599px){.udex-event-ribbon__container{max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-m-l))}}@media (max-width: 1279px){.udex-event-ribbon__container{margin-block:var(--udexSpacer40, 40px) var(--udexSpacer64, 64px);gap:var(--udexSpacer24, 24px);padding-inline:var(--udexSpacer24, 24px)}}@media (max-width: 979px){.udex-event-ribbon__container{flex-direction:column;height:fit-content;padding-block:var(--udexSpacer16, 16px);gap:var(--udexSpacer8, 8px);align-items:flex-start;margin-block:var(--udexSpacer40, 40px) var(--udexSpacer64, 64px);max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-s))}.udex-event-ribbon__link-container,.udex-event-ribbon__text{width:100%}.udex-event-ribbon__logo{justify-content:flex-start;width:100%}.udex-event-ribbon__link-text{white-space:normal}}@media (max-width: 639px){.udex-event-ribbon__container{padding-inline:var(--udexSpacer16, 16px);margin-block:var(--udexSpacer32, 32px) var(--udexSpacer56, 56px);max-width:calc(100vw - 2 * var(--udex-event-ribbon-margin-xs))}}
9
9
  `
@@ -0,0 +1,9 @@
1
+ import { registerThemePropertiesLoader } from "@ui5/webcomponents-base/dist/asset-registries/Themes.js";
2
+
3
+ import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js";
4
+ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
+
6
+ registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
+ 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);
8
+ export default `:host{--udex-link-list-columns-xl: 4;--udex-link-list-columns-l: 4;--udex-link-list-columns-m: 3;--udex-link-list-columns-s: 2;--udex-link-list-columns-xs: 1;--udex-link-list-column-gap-xl: var(--udexSpacer48);--udex-link-list-column-gap-l: var(--udexSpacer48);--udex-link-list-column-gap-m: var(--udexSpacer48);--udex-link-list-column-gap-s: var(--udexSpacer16);--udex-link-list-column-gap-xs: var(--udexSpacer16);--udex-link-list-row-gap: inherit;--udex-link-list-grid: grid}.udex-link-list{display:var(--udex-link-list-grid);grid-template-columns:repeat(var(--udex-link-list-columns-xl),1fr);column-gap:var(--udex-link-list-column-gap-xl);row-gap:var(--udex-link-list-row-gap)}:host([type="TileS"]) .udex-link-list{--udex-link-list-row-gap: var(--udexSpacer20)}:host([type="TileL"]) .udex-link-list{--udex-link-list-row-gap: var(--udexSpacer40)}@media (max-width: 1599px){.udex-link-list{grid-template-columns:repeat(var(--udex-link-list-columns-l),1fr)}}@media (max-width: 1279px){.udex-link-list{grid-template-columns:repeat(var(--udex-link-list-columns-m),1fr)}}@media (max-width: 979px){.udex-link-list{grid-template-columns:repeat(var(--udex-link-list-columns-s),1fr)}}@media (max-width: 639px){.udex-link-list{grid-template-columns:repeat(var(--udex-link-list-columns-xs),1fr)}}
9
+ `
@@ -0,0 +1,9 @@
1
+ import { registerThemePropertiesLoader } from "@ui5/webcomponents-base/dist/asset-registries/Themes.js";
2
+
3
+ import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/sap_horizon/parameters-bundle.css.js";
4
+ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
+
6
+ registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
+ 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);
8
+ export default `:host{--udex-link-list-item-tile-icon-l-size: 40px;--udex-link-list-item-tile-icon-s-size: 24px;--udex-link-list-item-tile-based-l-min-height: 148px;--udex-link-list-item-tile-text-color: var(--udexColorGrey9, #223548);--udex-link-list-item-tile-icon-color: var(--udexColorBlue8, #0057D2)}.udex-link-list-item{display:flex;flex-direction:column;align-items:self-start;height:100%}.udex-link-list-item__divider{padding:var(--udexSpacer4) 0;margin-top:auto;width:100%}[udex-tile]::part(tile){height:100%;box-sizing:border-box}[udex-tile]{display:block;width:100%;height:100%}.udex-link-list-item__tile-l{--udex-tile-content-padding-vertical: var(--udexSpacer24);--udex-tile-content-padding-horizontal: var(--udexSpacer24)}.udex-link-list-item__tile-l::part(tile){min-height:var(--udex-link-list-item-tile-based-l-min-height)}.udex-link-list-item__tile-s{--udex-tile-content-padding-vertical: var(--udexSpacer16);--udex-tile-content-padding-horizontal: var(--udexSpacer16)}.udex-link-list-item__tile-icon-l{color:var(--udex-link-list-item-tile-icon-color);width:var(--udex-link-list-item-tile-icon-l-size);height:var(--udex-link-list-item-tile-icon-l-size);margin-bottom:var(--udexSpacer16)}.udex-link-list-item__tile-icon-s{color:var(--udex-link-list-item-tile-icon-color);width:var(--udex-link-list-item-tile-icon-s-size);min-width:var(--udex-link-list-item-tile-icon-s-size);height:var(--udex-link-list-item-tile-icon-s-size);margin-inline-end:var(--udexSpacer24)}.udex-link-list-item__tile-text-l{font-family:var(--sapFontFamily);line-height:var(--udexTypographyHeadingLineHeight);font-size:var(--udexTypographyHeadingMediumXXSFontSize);font-weight:var(--udexTypographyFontWeightMedium)}.udex-link-list-item__tile-text-s{font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodySFontSize);font-weight:var(--udexTypographyFontWeightRegular);line-height:var(--udexTypographyBodyLineHeight)}.udex-link-list-item__tile-holder-l,.udex-link-list-item__tile-holder-s{color:var(--udex-link-list-item-tile-text-color);display:flex}.udex-link-list-item__tile-holder-l{flex-direction:column}
9
+ `
@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
5
 
6
6
  registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
7
  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);
8
- export default `:host{--udex-list-item-group-header-padding-vertical: var(--udexSpacer8, 8px);--udex-list-item-group-header-padding-horizontal: var(--udexSpacer12, 12px);--udex-list-item-group-header-supporting-text-color: var(--sapContent_LabelColor, #223548);--udex-list-item-group-header-border-color: var(--sapList_BorderColor, #A9B4BE)}.udex-list__header{font-weight:var(--udexTypographyFontWeightMedium, 500);display:flex;flex-direction:column}.udex-list__supporting-text{font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 21px);font-weight:var(--udexTypographyFontWeightRegular, 400);color:var(--udex-list-item-group-header-supporting-text-color);padding-top:var(--udexSpacer8, 8px)}.udex-list__group-list{list-style-type:none;padding:0;margin:0}.udex-list__header,.udex-list__group-header{font-weight:var(--udexTypographyFontWeightMedium, 500)}.udex-list__group-list.udex-list__sticky{padding-top:59px}.udex-list__group-content{display:flex;border-bottom:1px solid var(--udex-list-item-group-header-border-color);padding:var(--udex-list-item-group-header-padding-vertical) var(--udex-list-item-group-header-padding-horizontal)}.udex-list__number{margin-inline-end:var(--udexSpacer8, 8px)}.udex-list__circle{display:block;min-width:20px;height:22px;position:relative}:host([mode="SingleContent"])::part(group-item){padding:var(--udexSpacer4, 4px) 0}:host([mode="MultiSelect"]) .udex-list__group-header{border-bottom:1px solid var(--udex-list-item-group-header-border-color)}.udex-list__group_large{font-size:var(--udexTypographyBodyLFontSize, 20px);line-height:var(--udexTypographyHeadingLineHeight, 22px);font-weight:var(--udexTypographyFontWeightMedium, 500)}.udex-list__group_large.udex-list__supporting-text{font-size:var(--udexTypographyBodySFontSize, 16px);line-height:var(--udexTypographyBodyLineHeight, 24px);font-weight:var(--udexTypographyFontWeightRegular, 400)}.udex-list__icon{margin-inline-end:var(--udexSpacer8, 8px);padding-top:2px;min-width:18px;height:18px}.udex-list__inactive-header{font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodySFontSize, 16px);line-height:var(--udexTypographyBodyLineHeight, 24px);font-weight:var(--udexTypographyFontWeightMedium, 500);padding:var(--udexSpacer8, 8px) var(--udexSpacer20, 20px);border-bottom:1px solid var(--sapList_BorderColor, #A9B4BE);display:flex;flex-direction:column}
8
+ export default `:host{--udex-list-item-group-header-padding-vertical: var(--udexSpacer8, 8px);--udex-list-item-group-header-padding-horizontal: var(--udexSpacer12, 12px);--udex-list-item-group-header-supporting-text-color: var(--sapContent_LabelColor, #223548);--udex-list-item-group-header-border-color: var(--sapList_BorderColor, #A9B4BE)}.udex-list__header{font-weight:var(--udexTypographyFontWeightMedium, 500);display:flex;flex-direction:column}.udex-list__supporting-text{font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 21px);font-weight:var(--udexTypographyFontWeightRegular, 400);color:var(--udex-list-item-group-header-supporting-text-color);padding-top:var(--udexSpacer2, 2px)}.udex-list__group-list{list-style-type:none;padding:0;margin:0}.udex-list__header,.udex-list__group-header{font-weight:var(--udexTypographyFontWeightMedium, 500)}.udex-list__group-list.udex-list__sticky{padding-top:59px}.udex-list__group-content{display:flex;border-bottom:1px solid var(--udex-list-item-group-header-border-color);padding:var(--udex-list-item-group-header-padding-vertical) var(--udex-list-item-group-header-padding-horizontal)}.udex-list__number{margin-inline-end:var(--udexSpacer8, 8px)}.udex-list__circle{display:block;min-width:20px;height:22px;position:relative}:host([mode="SingleContent"])::part(group-item){padding:var(--udexSpacer4, 4px) 0}:host([mode="MultiSelect"]) .udex-list__group-header{border-bottom:1px solid var(--udex-list-item-group-header-border-color)}.udex-list__group_large{font-size:var(--udexTypographyBodyLFontSize, 20px);line-height:var(--udexTypographyHeadingLineHeight, 22px);font-weight:var(--udexTypographyFontWeightMedium, 500)}.udex-list__group_large.udex-list__supporting-text{font-size:var(--udexTypographyBodySFontSize, 16px);line-height:var(--udexTypographyBodyLineHeight, 24px);font-weight:var(--udexTypographyFontWeightRegular, 400)}.udex-list__icon{margin-inline-end:var(--udexSpacer8, 8px);padding-top:2px;min-width:18px;height:18px}.udex-list__inactive-header{font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodySFontSize, 16px);line-height:var(--udexTypographyBodyLineHeight, 24px);font-weight:var(--udexTypographyFontWeightMedium, 500);padding:var(--udexSpacer8, 8px) var(--udexSpacer20, 20px);border-bottom:1px solid var(--sapList_BorderColor, #A9B4BE);display:flex;flex-direction:column}
9
9
  `
@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
5
 
6
6
  registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
7
  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);
8
- export default `:host{--udex-list-item-padding-vertical: var(--udexSpacer8, 8px);--udex-list-item-padding-horizontal: var(--udexSpacer12, 12px);--udex-list-item-background-active: var(--sapList_Active_Background, #EAECEE);--udex-list-item-border-color-active: var(--sapList_BorderColor, #A9B4BE);--udex-list-item-color-active: var(--sapList_Active_TextColor, #000);--udex-list-item-supporting-text-color-active: var(--sapContent_LabelColor, #475E75);--udex-list-item-background-selected-hover: var(--sapButton_Selected_Hover_Background, #D1EFFF);--udex-list-item-border-color-selected-hover: var(--udexColorBlue8, #0057D2);--udex-list-item-background-default: var(--sapList_Background, #FFF);--udex-list-item-color-default: var(--sapList_HeaderTextColor, #223548);--udex-list-item-supporting-text-color-default: var(--sapContent_LabelColor, #475E75);--udex-list-item-supporting-text-color-hover: var(--sapContent_LabelColor, #475E75);--udex-list-item-background-hover: var(--sapList_Hover_Background, #F5F6F7);--udex-list-item-color-hover: var(--sapList_HeaderTextColor, #223548);--udex-list-item-border-color-selected: var(--sapList_SelectionBorderColor, #0070F2);--udex-list-item-background-selected: var(--sapList_SelectionBackgroundColor, #EBF8FF);--udex-list-item-color-selected: var(--sapList_HeaderTextColor, #223548);--udex-list-item-supporting-text-color-selected: var(--sapContent_LabelColor, #475E75);--udex-list-item-divider-border-color: var(--sapList_BorderColor, #A9B4BE);--udex-list-item-divider-border-color-hover: var(--sapList_BorderColor, #A9B4BE);--udex-list-item-outline-border-color: var(--udexColorBlue10, #002A86);--udex-list-item-disabled-opacity: var(--sapContent_DisabledOpacity, .4);background:var(--udex-list-item-background-default);color:var(--udex-list-item-color-default);display:block;border-bottom:1px solid transparent;position:relative}:host([disabled]:not([mode="SingleContent"])){opacity:var(--udex-list-item-disabled-opacity);pointer-events:none}:host(:not([disabled]):not([mode="SingleContent"])){cursor:pointer}:host([active]) .udex-list__supporting-text{color:var(--udex-list-item-supporting-text-color-active)}:host([active][selected]){background:var(--udex-list-item-background-active)}:host(:not([disabled]):not([selected]):not([mode="SingleContent"]):hover){background:var(--udex-list-item-background-hover);color:var(--udex-list-item-color-hover)}:host(:not([mode="SingleContent"]):not([disabled])[desktop]) .udex-list__item:focus:before,:host(:not([mode="SingleContent"]):not([disabled])) .udex-list__item:focus-visible:before{content:"";position:absolute;inset:0;outline:var(--udexRadiusXXS) solid var(--udex-list-item-outline-border-color);outline-offset:-4px;border-radius:var(--udexRadiusM, 8px);pointer-events:none}:host([active]){background:var(--udex-list-item-background-active);color:var(--udex-list-item-color-active)}:host(:hover[active][focused]:not([mode="SingleContent"])){background:var(--udex-list-item-background-active);border-color:var(--udex-list-item-border-color-active);color:var(--udex-list-item-color-active)}:host(:not([disabled]):hover) .udex-list__supporting-text{color:var(--udex-list-item-supporting-text-color-hover)}:host([selected]:not([mode="SingleContent"])){background:var(--udex-list-item-background-selected);border-color:var(--udex-list-item-border-color-selected);color:var(--udex-list-item-color-selected)}:host(:hover[selected]:not([disabled]):not([mode="SingleContent"])){background:var(--udex-list-item-background-selected-hover);border-color:var(--udex-list-item-border-color-selected-hover)}:host([selected]) .udex-list__supporting-text{color:var(--udex-list-item-supporting-text-color-selected)}:host([divider]){border-color:var(--udex-list-item-divider-border-color)}:host([divider]):hover{border-color:var(--udex-list-item-divider-border-color-hover)}:host([additional-text-state="Success"])::part(additional-text){color:var(--udexColorGreen9, #1E592F)}:host([additional-text-state="Error"])::part(additional-text){color:var(--udexColorRed9, #840606)}:host([additional-text-state="Information"])::part(additional-text){color:var(--udexColorBlue9, #0040B0)}:host([additional-text-state="Warning"])::part(additional-text){color:var(--udexColorMango9, #8D2A00)}:host::part(checkbox),:host::part(radio){padding-inline-end:var(--udexSpacer12, 12px);min-width:42px}:host([mode="SingleContent"])::part(item){padding:var(--udexSpacer4, 4px) 0;border:none}:host([mode="SingleContent"])::part(avatar){padding-inline-start:var(--udexSpacer12, 12px)}:host::part(additional-text){margin-inline-start:0;margin-inline-end:var(--udexSpacer8, 8px)}:host([mode="SingleContent"])::part(button){padding:0}:host(.udex-list__sticky){position:absolute;top:0;right:12px;left:0;z-index:1;border-radius:var(--udexRadiusM, 8px) 0 0}::slotted([udex-list]){padding-top:var(--udexSpacer12, 12px);display:block}::slotted(b){display:inherit}::slotted([udex-button]:hover:not([active])){background-color:var(--udex-button-color-tertiary-standard-default-background)}.udex-list__item:focus-visible{outline:none}.udex-list__item{padding:var(--udexSpacer8, 8px) var(--udexSpacer12, 12px);display:flex;align-items:center}.udex-list__content-wrap{display:flex;width:100%}.udex-list__number{margin-inline-end:var(--udexSpacer8, 8px)}.udex-list__circle{display:block;min-width:20px;height:22px;position:relative}.udex-list__supporting-text{font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 21px);font-weight:var(--udexTypographyFontWeightRegular, 400);color:var(--udex-list-item-supporting-text-color-default);padding-top:var(--udexSpacer8, 8px)}.udex-list__content{display:flex;align-items:center;flex:auto}.udex-list__text-holder{display:flex;flex-direction:column;flex-basis:100%}.udex-list__add-text{font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 21px);padding-inline-start:var(--udexSpacer12, 12px);white-space:nowrap}.udex-list__icon{margin-inline-end:var(--udexSpacer8, 8px);padding-top:2px;min-width:18px;height:18px}.udex-list__avatar{display:flex;align-items:center;margin-inline-end:var(--udexSpacer8, 8px)}.udex-list__item.udex-list__sticky.udex-list__item_controlled .udex-list__checkbox,.udex-list__item.udex-searchable-list__header.udex-list__item_controlled .udex-list__checkbox,.udex-list__item .udex-list__radio,.udex-list__item .udex-list__checkbox{pointer-events:none}.udex-list__item.udex-list__item_controlled .udex-list__radio,.udex-list__item.udex-list__item_controlled .udex-list__checkbox{pointer-events:auto}.udex-list__item_large{font-size:var(--udexTypographyBodyLFontSize, 20px);line-height:var(--udexTypographyHeadingLineHeight, 22px);font-weight:var(--udexTypographyFontWeightMedium, 500)}.udex-list__item_large .udex-list__supporting-text{font-size:var(--udexTypographyBodySFontSize, 16px);line-height:var(--udexTypographyBodyLineHeight, 24px)}.udex-list__flag-wrap{min-width:30px;margin-inline-end:var(--udexSpacer12, 12px);position:relative}.udex-list__flag{background-image:url(https://cdn.udex.services.sap.com/dds/design-tokens/assets/country_flag_iso3166.webp);width:30px;height:20px;margin-inline-end:var(--udexSpacer12, 12px);position:absolute;top:50%;transform:translateY(-50%)}.hidden{display:none}
8
+ export default `:host{--udex-list-item-padding-vertical: var(--udexSpacer8, 8px);--udex-list-item-padding-horizontal: var(--udexSpacer12, 12px);--udex-list-item-background-active: var(--sapList_Active_Background, #EAECEE);--udex-list-item-border-color-active: var(--sapList_BorderColor, #A9B4BE);--udex-list-item-color-active: var(--sapList_Active_TextColor, #000);--udex-list-item-supporting-text-color-active: var(--sapContent_LabelColor, #475E75);--udex-list-item-background-selected-hover: var(--sapButton_Selected_Hover_Background, #D1EFFF);--udex-list-item-border-color-selected-hover: var(--udexColorBlue8, #0057D2);--udex-list-item-background-default: var(--sapList_Background, #FFF);--udex-list-item-color-default: var(--sapList_HeaderTextColor, #223548);--udex-list-item-supporting-text-color-default: var(--sapContent_LabelColor, #475E75);--udex-list-item-supporting-text-color-hover: var(--sapContent_LabelColor, #475E75);--udex-list-item-background-hover: var(--sapList_Hover_Background, #F5F6F7);--udex-list-item-color-hover: var(--sapList_HeaderTextColor, #223548);--udex-list-item-border-color-selected: var(--sapList_SelectionBorderColor, #0070F2);--udex-list-item-background-selected: var(--sapList_SelectionBackgroundColor, #EBF8FF);--udex-list-item-color-selected: var(--sapList_HeaderTextColor, #223548);--udex-list-item-supporting-text-color-selected: var(--sapContent_LabelColor, #475E75);--udex-list-item-divider-border-color: var(--sapList_BorderColor, #A9B4BE);--udex-list-item-divider-border-color-hover: var(--sapList_BorderColor, #A9B4BE);--udex-list-item-outline-border-color: var(--udexColorBlue10, #002A86);--udex-list-item-disabled-opacity: var(--sapContent_DisabledOpacity, .4);background:var(--udex-list-item-background-default);color:var(--udex-list-item-color-default);display:block;border-bottom:1px solid transparent;position:relative}:host([disabled]:not([mode="SingleContent"])){opacity:var(--udex-list-item-disabled-opacity);pointer-events:none}:host(:not([disabled]):not([mode="SingleContent"])){cursor:pointer}:host([active]) .udex-list__supporting-text{color:var(--udex-list-item-supporting-text-color-active)}:host([active][selected]){background:var(--udex-list-item-background-active)}:host(:not([disabled]):not([selected]):not([mode="SingleContent"]):hover){background:var(--udex-list-item-background-hover);color:var(--udex-list-item-color-hover)}:host(:not([mode="SingleContent"]):not([disabled])[desktop]) .udex-list__item:focus:before,:host(:not([mode="SingleContent"]):not([disabled])) .udex-list__item:focus-visible:before{content:"";position:absolute;inset:0;outline:var(--udexRadiusXXS) solid var(--udex-list-item-outline-border-color);outline-offset:-4px;border-radius:var(--udexRadiusM, 8px);pointer-events:none}:host([active]){background:var(--udex-list-item-background-active);color:var(--udex-list-item-color-active)}:host(:hover[active][focused]:not([mode="SingleContent"])){background:var(--udex-list-item-background-active);border-color:var(--udex-list-item-border-color-active);color:var(--udex-list-item-color-active)}:host(:not([disabled]):hover) .udex-list__supporting-text{color:var(--udex-list-item-supporting-text-color-hover)}:host([selected]:not([mode="SingleContent"])){background:var(--udex-list-item-background-selected);border-color:var(--udex-list-item-border-color-selected);color:var(--udex-list-item-color-selected)}:host(:hover[selected]:not([disabled]):not([mode="SingleContent"])){background:var(--udex-list-item-background-selected-hover);border-color:var(--udex-list-item-border-color-selected-hover)}:host([selected]) .udex-list__supporting-text{color:var(--udex-list-item-supporting-text-color-selected)}:host([divider]){border-color:var(--udex-list-item-divider-border-color)}:host([divider]):hover{border-color:var(--udex-list-item-divider-border-color-hover)}:host([additional-text-state="Success"])::part(additional-text){color:var(--udexColorGreen9, #1E592F)}:host([additional-text-state="Error"])::part(additional-text){color:var(--udexColorRed9, #840606)}:host([additional-text-state="Information"])::part(additional-text){color:var(--udexColorBlue9, #0040B0)}:host([additional-text-state="Warning"])::part(additional-text){color:var(--udexColorMango9, #8D2A00)}:host::part(checkbox),:host::part(radio){padding-inline-end:var(--udexSpacer12, 12px);min-width:42px}:host([mode="SingleContent"])::part(item){padding:var(--udexSpacer4, 4px) 0;border:none}:host([mode="SingleContent"])::part(avatar){padding-inline-start:var(--udexSpacer12, 12px)}:host::part(additional-text){margin-inline-start:0;margin-inline-end:var(--udexSpacer8, 8px)}:host([mode="SingleContent"])::part(button){padding:0}:host(.udex-list__sticky){position:absolute;top:0;right:12px;left:0;z-index:1;border-radius:var(--udexRadiusM, 8px) 0 0}::slotted([udex-list]){padding-top:var(--udexSpacer12, 12px);display:block}::slotted(b){display:inherit}::slotted([udex-button]:hover:not([active])){background-color:var(--udex-button-color-tertiary-standard-default-background)}.udex-list__item:focus-visible{outline:none}.udex-list__item{padding:var(--udexSpacer8, 8px) var(--udexSpacer12, 12px);display:flex;align-items:center}.udex-list__content-wrap{display:flex;width:100%}.udex-list__number{margin-inline-end:var(--udexSpacer8, 8px)}.udex-list__circle{display:block;min-width:20px;height:22px;position:relative}.udex-list__supporting-text{font-family:var(--sapFontFamily, sans-serif);font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyBodyLineHeight, 21px);font-weight:var(--udexTypographyFontWeightRegular, 400);color:var(--udex-list-item-supporting-text-color-default);padding-top:var(--udexSpacer2, 2px)}.udex-list__content{display:flex;align-items:center;flex:auto}.udex-list__text-holder{display:flex;flex-direction:column;flex-basis:100%}.udex-list__add-text{font-size:var(--udexTypographyBodyXSFontSize, 14px);line-height:var(--udexTypographyHeadingLineHeight, 21px);padding-inline-start:var(--udexSpacer12, 12px);white-space:nowrap}.udex-list__icon{margin-inline-end:var(--udexSpacer8, 8px);padding-top:2px;min-width:18px;height:18px}.udex-list__avatar{display:flex;align-items:center;margin-inline-end:var(--udexSpacer8, 8px)}.udex-list__item.udex-list__sticky.udex-list__item_controlled .udex-list__checkbox,.udex-list__item.udex-searchable-list__header.udex-list__item_controlled .udex-list__checkbox,.udex-list__item .udex-list__radio,.udex-list__item .udex-list__checkbox{pointer-events:none}.udex-list__item.udex-list__item_controlled .udex-list__radio,.udex-list__item.udex-list__item_controlled .udex-list__checkbox{pointer-events:auto}.udex-list__item_large{font-size:var(--udexTypographyBodyLFontSize, 20px);line-height:var(--udexTypographyHeadingLineHeight, 22px);font-weight:var(--udexTypographyFontWeightMedium, 500)}.udex-list__item_large .udex-list__supporting-text{font-size:var(--udexTypographyBodySFontSize, 16px);line-height:var(--udexTypographyBodyLineHeight, 24px)}.udex-list__flag-wrap{min-width:30px;margin-inline-end:var(--udexSpacer12, 12px);position:relative}.udex-list__flag{background-image:url(https://cdn.udex.services.sap.com/dds/design-tokens/assets/country_flag_iso3166.webp);width:30px;height:20px;margin-inline-end:var(--udexSpacer12, 12px);position:absolute;top:50%;transform:translateY(-50%)}.hidden{display:none}
9
9
  `
@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
5
 
6
6
  registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
7
  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);
8
- export default `:host{--udex-progress-bar-point-size: .375rem;--udex-progress-bar-padding-end: 24px;--udex-progress-bar-root-height: .5rem;--udex-progress-bar-height: .75rem;--udex-progress-bar-border-radius: var(--udexRadiusS, 6px);--udex-progress-bar-icon-size: 1.125rem;--udex-progress-bar-icon-right-position: -24px}.ui5-progress-indicator-icon{width:var(--udex-progress-bar-icon-size);height:var(--udex-progress-bar-icon-size);inset-inline-end:var(--udex-progress-bar-icon-right-position)}.ui5-progress-indicator-bar{height:var(--udex-progress-bar-height);border-radius:var(--udex-progress-bar-border-radius)}.ui5-progress-indicator-root{height:var(--udex-progress-bar-root-height)}:host(:not([hidden])){padding-inline-end:var(--udex-progress-bar-padding-end)}:host::part(remaining-bar):after{width:var(--udex-progress-bar-point-size, .375rem);height:var(--udex-progress-bar-point-size, .375rem)}:host([value-state="Error"]) .ui5-progress-indicator-root{background:var(--sapProgress_NegativeBackground, #FFB2D2)}:host([value-state="Error"]) .ui5-progress-indicator-bar,:host([value-state="Error"]) .ui5-progress-indicator-remaining-bar:before,:host([value-state="Error"]) .ui5-progress-indicator-remaining-bar:after{background:var(--sapProgress_Value_NegativeBackground, #D20A0A)}:host([value-state="Error"]) .ui5-progress-indicator-icon{color:var(--sapProgress_Value_NegativeBackground, #D20A0A)}:host([value-state="Success"]) .ui5-progress-indicator-root{background:var(--sapProgress_PositiveBackground, #BDE986)}:host([value-state="Success"]) .ui5-progress-indicator-bar,:host([value-state="Success"]) .ui5-progress-indicator-remaining-bar:before,:host([value-state="Success"]) .ui5-progress-indicator-remaining-bar:after{background:var(--sapProgress_Value_PositiveBackground, #188918)}:host([value-state="Success"]) .ui5-progress-indicator-icon{color:var(--sapProgress_Value_PositiveBackground, #188918)}:host([value-state="Warning"]) .ui5-progress-indicator-root{background:var(--sapProgress_CriticalBackground, #FFDF72)}:host([value-state="Warning"]) .ui5-progress-indicator-bar,:host([value-state="Warning"]) .ui5-progress-indicator-remaining-bar:before,:host([value-state="Warning"]) .ui5-progress-indicator-remaining-bar:after{background:var(--sapProgress_Value_CriticalBackground, #C35500)}:host([value-state="Warning"]) .ui5-progress-indicator-icon{color:var(--sapProgress_Value_CriticalBackground, #C35500)}:host([disabled]) .ui5-progress-indicator-root{opacity:var(--sapContent_DisabledOpacity, .4)}.ui5-progress-indicator-bar{border-radius:var(--udexRadiusS, 6px)}
8
+ export default `:host{--udex-progress-bar-point-size: .375rem;--udex-progress-bar-padding-end: 24px;--udex-progress-bar-root-height: .5rem;--udex-progress-bar-height: .75rem;--udex-progress-bar-border-radius: var(--udexRadiusS, 6px);--udex-progress-bar-icon-size: 1.125rem;--udex-progress-bar-icon-right-position: -24px}.ui5-progress-indicator-icon{width:var(--udex-progress-bar-icon-size);height:var(--udex-progress-bar-icon-size);inset-inline-end:var(--udex-progress-bar-icon-right-position)}.ui5-progress-indicator-bar{height:var(--udex-progress-bar-height);border-radius:var(--udex-progress-bar-border-radius)}.ui5-progress-indicator-root{height:var(--udex-progress-bar-root-height)}:host(:not([hidden])){padding-inline-end:var(--udex-progress-bar-padding-end)}.ui5-progress-indicator-remaining-bar:before,.ui5-progress-indicator-remaining-bar:after{width:var(--udex-progress-bar-point-size, .375rem);height:var(--udex-progress-bar-point-size, .375rem)}:host([value-state="Error"]) .ui5-progress-indicator-root{background:var(--sapProgress_NegativeBackground, #FFB2D2)}:host([value-state="Error"]) .ui5-progress-indicator-bar,:host([value-state="Error"]) .ui5-progress-indicator-remaining-bar:before,:host([value-state="Error"]) .ui5-progress-indicator-remaining-bar:after{background:var(--sapProgress_Value_NegativeBackground, #D20A0A)}:host([value-state="Error"]) .ui5-progress-indicator-icon{color:var(--sapProgress_Value_NegativeBackground, #D20A0A)}:host([value-state="Success"]) .ui5-progress-indicator-root{background:var(--sapProgress_PositiveBackground, #BDE986)}:host([value-state="Success"]) .ui5-progress-indicator-bar,:host([value-state="Success"]) .ui5-progress-indicator-remaining-bar:before,:host([value-state="Success"]) .ui5-progress-indicator-remaining-bar:after{background:var(--sapProgress_Value_PositiveBackground, #188918)}:host([value-state="Success"]) .ui5-progress-indicator-icon{color:var(--sapProgress_Value_PositiveBackground, #188918)}:host([value-state="Warning"]) .ui5-progress-indicator-root{background:var(--sapProgress_CriticalBackground, #FFDF72)}:host([value-state="Warning"]) .ui5-progress-indicator-bar,:host([value-state="Warning"]) .ui5-progress-indicator-remaining-bar:before,:host([value-state="Warning"]) .ui5-progress-indicator-remaining-bar:after{background:var(--sapProgress_Value_CriticalBackground, #C35500)}:host([value-state="Warning"]) .ui5-progress-indicator-icon{color:var(--sapProgress_Value_CriticalBackground, #C35500)}:host([disabled]) .ui5-progress-indicator-root{opacity:var(--sapContent_DisabledOpacity, .4)}.ui5-progress-indicator-bar{border-radius:var(--udexRadiusS, 6px)}
9
9
  `
@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
5
 
6
6
  registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
7
  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);
8
- export default `:host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-7-2_rating_indicator_component_spacing);cursor:pointer}:host([disabled]){opacity:var(--udex_rating_indicator_disabled_opacity);cursor:initial;outline:none}:host([readonly]){cursor:initial}:host([disabled]) .udex-rating-indicator__item-unsel,:host([readonly]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_readonly_item_width);height:var(--udex_rating_indicator_readonly_item_height);padding-inline:0}:host([disabled]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_disabled-unrated_color)}:host([readonly]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_read-only-unrated_color)}:host([_focused]){outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);outline-offset:.125rem;border-radius:.25rem}[ui5-icon]{display:flex;text-shadow:var(--sapContent_TextShadow)}.udex-rating-indicator{font-family:var(--sapFontFamily);font-size:var(--sapFontSize, 16px);padding:0;outline:none;position:relative;display:inline-flex;gap:12px;align-items:center}.udex-rating-indicator__total{color:var(--udexColorGrey6);line-height:24px}.udex-rating-indicator__list{list-style-type:none;display:flex;align-items:center;margin:0;padding:0}.udex-rating-indicator__item{position:relative;width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_items_gap)}.udex-rating-indicator__item [ui5-icon]{width:100%;height:100%;color:inherit;user-select:none}.udex-rating-indicator__item.udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_color)}.udex-rating-indicator__item.udex-rating-indicator__item-sel,.udex-rating-indicator__item.udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_color)}.udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{position:absolute;inset-inline-start:50%;color:var(--udex-rating_indicator_rated_color)}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-sel,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__half-icon,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_hover_color)}:host(:not([readonly]):not([disabled])) .ui5-rating-indicator-root:hover{opacity:1}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_hover_color)}.udex-rating-indicator__half-icon-wrapper{width:100%;height:100%;position:absolute;inset-inline-start:-50%;top:0;z-index:32;overflow:hidden}.udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator--mobile .udex-rating-indicator__item{padding:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel,:host([disabled]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel{padding-left:var(--udex_rating_indicator_mobile_item_padding);padding-right:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_mobile_items_gap)}
8
+ export default `:host{--udex_rating_indicator_readonly_item_width: 1.5rem;--udex_rating_indicator_readonly_item_height: 1.5rem;--udex_rating_indicator_item_width: 1.5rem;--udex_rating_indicator_item_height: 1.5rem;--udex_rating_indicator_mobile_item_padding: 10px;--udex_rating_indicator_disabled_opacity: .4;--udex-rating_indicator_items_gap: 8px;--udex-rating_indicator_mobile_items_gap: 8px;--udex-rating_indicator_rated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_unrated_color: var(--sapContent_RatedColor, #E76500);--udex-rating_indicator_read-only-unrated_color: var(--udexColorGrey6 ,#5B738B);--udex-rating_indicator_disabled-unrated_color: var(--udexColorMango6, #E76500);--udex-rating_indicator_rated_hover_color: var(--udexColorMango7, #C35500);--udex-rating_indicator_unrated_hover_color: var(--udexColorMango7, #C35500)}:host(:not([hidden])){display:inline-flex;margin:var(--_ui5-v2-9-0_rating_indicator_component_spacing);cursor:pointer}:host([disabled]){opacity:var(--udex_rating_indicator_disabled_opacity);cursor:initial;outline:none}:host([readonly]){cursor:initial}:host([disabled]) .udex-rating-indicator__item-unsel,:host([readonly]) .udex-rating-indicator__item-unsel{width:var(--udex_rating_indicator_readonly_item_width);height:var(--udex_rating_indicator_readonly_item_height);padding-inline:0}:host([disabled]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_disabled-unrated_color)}:host([readonly]) .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_read-only-unrated_color)}:host([_focused]){outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);outline-offset:.125rem;border-radius:.25rem}[ui5-icon]{display:flex;text-shadow:var(--sapContent_TextShadow)}.udex-rating-indicator{font-family:var(--sapFontFamily);font-size:var(--sapFontSize, 16px);padding:0;outline:none;position:relative;display:inline-flex;gap:12px;align-items:center}.udex-rating-indicator__total{color:var(--udexColorGrey6);line-height:24px}.udex-rating-indicator__list{list-style-type:none;display:flex;align-items:center;margin:0;padding:0}.udex-rating-indicator__item{position:relative;width:var(--udex_rating_indicator_item_width);height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_items_gap)}.udex-rating-indicator__item [ui5-icon]{width:100%;height:100%;color:inherit;user-select:none}.udex-rating-indicator__item.udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_color)}.udex-rating-indicator__item.udex-rating-indicator__item-sel,.udex-rating-indicator__item.udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_color)}.udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{position:absolute;inset-inline-start:50%;color:var(--udex-rating_indicator_rated_color)}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-sel,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__half-icon,:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-half{color:var(--udex-rating_indicator_rated_hover_color)}:host(:not([readonly]):not([disabled])) .ui5-rating-indicator-root:hover{opacity:1}:host(:not([readonly]):not([disabled])) .udex-rating-indicator:hover .udex-rating-indicator__item-unsel{color:var(--udex-rating_indicator_unrated_hover_color)}.udex-rating-indicator__half-icon-wrapper{width:100%;height:100%;position:absolute;inset-inline-start:-50%;top:0;z-index:32;overflow:hidden}.udex-rating-indicator--mobile .udex-rating-indicator__half-icon-wrapper{top:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item [ui5-icon].udex-rating-indicator__half-icon{height:var(--udex_rating_indicator_item_height)}.udex-rating-indicator--mobile .udex-rating-indicator__item{padding:var(--udex_rating_indicator_mobile_item_padding)}:host([readonly]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel,:host([disabled]) .udex-rating-indicator--mobile .udex-rating-indicator__item-unsel{padding-left:var(--udex_rating_indicator_mobile_item_padding);padding-right:var(--udex_rating_indicator_mobile_item_padding)}.udex-rating-indicator--mobile .udex-rating-indicator__item:not(:last-child){margin-inline-end:var(--udex-rating_indicator_mobile_items_gap)}
9
9
  `
@@ -5,5 +5,5 @@ import defaultTheme from "./sap_horizon/parameters-bundle.css.js";
5
5
 
6
6
  registerThemePropertiesLoader("@" + "ui5" + "/" + "webcomponents-theming", "sap_horizon", async () => defaultThemeBase);
7
7
  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);
8
- 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-7-2_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)}
8
+ 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-9-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)}
9
9
  `
@@ -246,7 +246,6 @@
246
246
  --udex-event-ribbon-margin-s: 48px;
247
247
  --udex-event-ribbon-margin-xs: 24px;
248
248
 
249
- --udex-event-ribbon-logo-width: auto;
250
249
  --udex-event-ribbon-logo-height: auto;
251
250
 
252
251
  --udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-xl)) - (11 * var(--udexGridXLGutters))) / 12);
@@ -303,17 +302,32 @@
303
302
  position: relative;
304
303
  display: flex;
305
304
  justify-content: flex-end;
306
- width: calc((var(--udex-event-ribbon-column-width) * 3 + 3 * var(--udexGridXLGutters)) - 36px);
305
+ width: 24.8%;
307
306
  }
308
307
 
309
- .udex-event-ribbon__logo img {
308
+ :host([event-logo='sapphire']) {
309
+ --udex-event-ribbon-logo-height: 40px;
310
+ }
311
+
312
+ :host([event-logo='connect']) {
313
+ --udex-event-ribbon-logo-height: 18px;
314
+ }
315
+
316
+ :host([event-logo='now']) {
317
+ --udex-event-ribbon-logo-height: 24px;
318
+ }
319
+
320
+ :host([event-logo='teched']) {
321
+ --udex-event-ribbon-logo-height: 21px;
322
+ }
323
+
324
+ .udex-event-ribbon__logo-img {
310
325
  max-height: 42px;
311
326
  height: var(--udex-event-ribbon-logo-height);
312
- width: var(--udex-event-ribbon-logo-width);
313
327
  max-width: 100%;
314
328
  }
315
329
 
316
- :host([mode="dark"]) .udex-event-ribbon__logo img {
330
+ :host([mode="dark"]) .udex-event-ribbon__logo-img {
317
331
  filter: brightness(0) invert(1);
318
332
  }
319
333
 
@@ -322,8 +336,8 @@
322
336
  margin: 0;
323
337
  padding: 0;
324
338
  font-size: var(--udexTypographyBodyXSFontSize);
325
- line-height: 1.5;
326
- width: calc(6 * var(--udex-event-ribbon-column-width) + 5 * var(--udexGridXLGutters));
339
+ line-height: var(--udexTypographyBodyLineHeight);
340
+ width: 51%;
327
341
  max-height: 100%;
328
342
  display: -webkit-box;
329
343
  -webkit-box-orient: vertical;
@@ -337,12 +351,14 @@
337
351
  position: inherit;
338
352
  display: flex;
339
353
  align-items: center;
340
- gap: var(--udexSpacer8, 8px)
354
+ gap: var(--udexSpacer8, 8px);
355
+ width: 21%;
341
356
  }
342
357
 
343
- .udex-event-ribbon__link-container span {
344
- line-height: 1.5;
358
+ .udex-event-ribbon__link-text {
359
+ line-height: var(--udexTypographyBodyLineHeight);
345
360
  font-size: var(--udexTypographyBodyXSFontSize);
361
+ white-space: nowrap;
346
362
  }
347
363
 
348
364
  [ui5-icon] {
@@ -353,9 +369,6 @@
353
369
  }
354
370
 
355
371
  @media (max-width: 1599px) {
356
- :host {
357
- --udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-m-l)) - (11 * var(--udexGridXLGutters))) / 12);
358
- }
359
372
  .udex-event-ribbon__container {
360
373
  max-width: calc(100vw - 2 * var(--udex-event-ribbon-margin-m-l));
361
374
  }
@@ -363,31 +376,24 @@
363
376
 
364
377
  @media (max-width: 1279px) {
365
378
  .udex-event-ribbon__container {
366
- margin-block: var(--udexSpacer40, 40px) 64px;
379
+ margin-block: var(--udexSpacer40, 40px) var(--udexSpacer64, 64px);
367
380
  gap: var(--udexSpacer24, 24px);
368
381
  padding-inline: var(--udexSpacer24, 24px);
369
382
  }
370
-
371
- .udex-event-ribbon__logo {
372
- width: calc((var(--udex-event-ribbon-column-width) * 3 + 3 * var(--udexGridXLGutters)) - 24px);
373
- }
374
383
  }
375
384
 
376
385
  @media (max-width: 979px) {
377
- :host {
378
- --udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-s)) - (11 * var(--udexGridSGutters))) / 12);
379
- }
380
-
381
386
  .udex-event-ribbon__container {
382
387
  flex-direction: column;
383
388
  height: fit-content;
384
389
  padding-block: var(--udexSpacer16, 16px);
385
390
  gap: var(--udexSpacer8, 8px);
386
391
  align-items: flex-start;
387
- margin-block: var(--udexSpacer40, 40px) 64px;
392
+ margin-block: var(--udexSpacer40, 40px) var(--udexSpacer64, 64px);
388
393
  max-width: calc(100vw - 2 * var(--udex-event-ribbon-margin-s));
389
394
  }
390
395
 
396
+ .udex-event-ribbon__link-container,
391
397
  .udex-event-ribbon__text {
392
398
  width: 100%;
393
399
  }
@@ -396,16 +402,16 @@
396
402
  justify-content: flex-start;
397
403
  width: 100%;
398
404
  }
399
- }
400
405
 
401
- @media (max-width: 639px) {
402
- :host {
403
- --udex-event-ribbon-column-width: calc((100vw - (2 * var(--udex-event-ribbon-margin-xs)) - (11 * var(--udexGridXSGutters))) / 12);
406
+ .udex-event-ribbon__link-text {
407
+ white-space: normal;
404
408
  }
409
+ }
405
410
 
411
+ @media (max-width: 639px) {
406
412
  .udex-event-ribbon__container {
407
413
  padding-inline: var(--udexSpacer16, 16px);
408
414
  margin-block: var(--udexSpacer32, 32px) var(--udexSpacer56, 56px);
409
415
  max-width: calc(100vw - 2 * var(--udex-event-ribbon-margin-xs));
410
416
  }
411
- }
417
+ }
@@ -0,0 +1,53 @@
1
+ :host {
2
+ --udex-link-list-columns-xl: 4;
3
+ --udex-link-list-columns-l: 4;
4
+ --udex-link-list-columns-m: 3;
5
+ --udex-link-list-columns-s: 2;
6
+ --udex-link-list-columns-xs: 1;
7
+ --udex-link-list-column-gap-xl: var(--udexSpacer48);
8
+ --udex-link-list-column-gap-l: var(--udexSpacer48);
9
+ --udex-link-list-column-gap-m: var(--udexSpacer48);
10
+ --udex-link-list-column-gap-s: var(--udexSpacer16);
11
+ --udex-link-list-column-gap-xs: var(--udexSpacer16);
12
+ --udex-link-list-row-gap: inherit;
13
+ --udex-link-list-grid: grid;
14
+ }
15
+
16
+ .udex-link-list {
17
+ display: var(--udex-link-list-grid);
18
+ grid-template-columns: repeat(var(--udex-link-list-columns-xl), 1fr);
19
+ column-gap: var(--udex-link-list-column-gap-xl);
20
+ row-gap: var(--udex-link-list-row-gap);
21
+ }
22
+
23
+ :host([type="TileS"]) .udex-link-list {
24
+ --udex-link-list-row-gap: var(--udexSpacer20);
25
+ }
26
+
27
+ :host([type="TileL"]) .udex-link-list {
28
+ --udex-link-list-row-gap: var(--udexSpacer40);
29
+ }
30
+
31
+ @media (max-width: 1599px) {
32
+ .udex-link-list {
33
+ grid-template-columns: repeat(var(--udex-link-list-columns-l), 1fr);
34
+ }
35
+ }
36
+
37
+ @media (max-width: 1279px) {
38
+ .udex-link-list {
39
+ grid-template-columns: repeat(var(--udex-link-list-columns-m), 1fr);
40
+ }
41
+ }
42
+
43
+ @media (max-width: 979px) {
44
+ .udex-link-list {
45
+ grid-template-columns: repeat(var(--udex-link-list-columns-s), 1fr);
46
+ }
47
+ }
48
+
49
+ @media (max-width: 639px) {
50
+ .udex-link-list {
51
+ grid-template-columns: repeat(var(--udex-link-list-columns-xs), 1fr);
52
+ }
53
+ }
@@ -0,0 +1,84 @@
1
+ :host {
2
+ --udex-link-list-item-tile-icon-l-size: 40px;
3
+ --udex-link-list-item-tile-icon-s-size: 24px;
4
+ --udex-link-list-item-tile-based-l-min-height: 148px;
5
+ --udex-link-list-item-tile-text-color: var(--udexColorGrey9, #223548);
6
+ --udex-link-list-item-tile-icon-color: var(--udexColorBlue8, #0057D2);
7
+ }
8
+
9
+ .udex-link-list-item {
10
+ display: flex;
11
+ flex-direction: column;
12
+ align-items: self-start;
13
+ height: 100%;
14
+ }
15
+
16
+ .udex-link-list-item__divider {
17
+ padding: var(--udexSpacer4) 0;
18
+ margin-top: auto;
19
+ width: 100%;
20
+ }
21
+
22
+ [udex-tile]::part(tile) {
23
+ height: 100%;
24
+ box-sizing: border-box;
25
+ }
26
+
27
+ [udex-tile] {
28
+ display: block;
29
+ width: 100%;
30
+ height: 100%;
31
+ }
32
+
33
+ .udex-link-list-item__tile-l {
34
+ --udex-tile-content-padding-vertical: var(--udexSpacer24);
35
+ --udex-tile-content-padding-horizontal: var(--udexSpacer24);
36
+ }
37
+
38
+ .udex-link-list-item__tile-l::part(tile) {
39
+ min-height: var(--udex-link-list-item-tile-based-l-min-height);
40
+ }
41
+
42
+ .udex-link-list-item__tile-s {
43
+ --udex-tile-content-padding-vertical: var(--udexSpacer16);
44
+ --udex-tile-content-padding-horizontal: var(--udexSpacer16);
45
+ }
46
+
47
+ .udex-link-list-item__tile-icon-l {
48
+ color: var(--udex-link-list-item-tile-icon-color);
49
+ width: var(--udex-link-list-item-tile-icon-l-size);
50
+ height: var(--udex-link-list-item-tile-icon-l-size);
51
+ margin-bottom: var(--udexSpacer16);
52
+ }
53
+
54
+ .udex-link-list-item__tile-icon-s {
55
+ color: var(--udex-link-list-item-tile-icon-color);
56
+ width: var(--udex-link-list-item-tile-icon-s-size);
57
+ min-width: var(--udex-link-list-item-tile-icon-s-size);
58
+ height: var(--udex-link-list-item-tile-icon-s-size);
59
+ margin-inline-end: var(--udexSpacer24);
60
+ }
61
+
62
+ .udex-link-list-item__tile-text-l {
63
+ font-family: var(--sapFontFamily);
64
+ line-height: var(--udexTypographyHeadingLineHeight);
65
+ font-size: var(--udexTypographyHeadingMediumXXSFontSize);
66
+ font-weight: var(--udexTypographyFontWeightMedium);
67
+ }
68
+
69
+ .udex-link-list-item__tile-text-s {
70
+ font-family: var(--sapFontFamily, sans-serif);
71
+ font-size: var(--udexTypographyBodySFontSize);
72
+ font-weight: var(--udexTypographyFontWeightRegular);
73
+ line-height: var(--udexTypographyBodyLineHeight);
74
+ }
75
+
76
+ .udex-link-list-item__tile-holder-l,
77
+ .udex-link-list-item__tile-holder-s {
78
+ color: var(--udex-link-list-item-tile-text-color);
79
+ display: flex;
80
+ }
81
+
82
+ .udex-link-list-item__tile-holder-l {
83
+ flex-direction: column;
84
+ }
@@ -17,7 +17,7 @@
17
17
  line-height: var(--udexTypographyBodyLineHeight, 21px);
18
18
  font-weight: var(--udexTypographyFontWeightRegular, 400);
19
19
  color: var(--udex-list-item-group-header-supporting-text-color);
20
- padding-top: var(--udexSpacer8, 8px);
20
+ padding-top: var(--udexSpacer2, 2px);
21
21
  }
22
22
 
23
23
  .udex-list__group-list {
@@ -199,7 +199,7 @@
199
199
  line-height: var(--udexTypographyBodyLineHeight, 21px);
200
200
  font-weight: var(--udexTypographyFontWeightRegular, 400);
201
201
  color: var(--udex-list-item-supporting-text-color-default);
202
- padding-top: var(--udexSpacer8, 8px);
202
+ padding-top: var(--udexSpacer2, 2px);
203
203
  }
204
204
 
205
205
  .udex-list__content {
@@ -275,4 +275,4 @@
275
275
 
276
276
  .hidden {
277
277
  display: none;
278
- }
278
+ }
@@ -27,7 +27,8 @@
27
27
  padding-inline-end: var(--udex-progress-bar-padding-end);
28
28
  }
29
29
 
30
- :host::part(remaining-bar):after {
30
+ .ui5-progress-indicator-remaining-bar:before,
31
+ .ui5-progress-indicator-remaining-bar:after {
31
32
  width: var(--udex-progress-bar-point-size, 0.375rem);
32
33
  height: var(--udex-progress-bar-point-size, 0.375rem);
33
34
  }
@@ -1,3 +0,0 @@
1
- import type Tile from "../../Tile.js";
2
- declare function template(this: Tile): import("lit-html").TemplateResult;
3
- export default template;
@@ -1,9 +0,0 @@
1
- /* eslint no-unused-vars: 0 */
2
- import { html, ifDefined } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
3
- import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
4
- function block0(context, tags, suffix) { return html `${this.interactive ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix)}`; }
5
- function block1(context, tags, suffix) { return html `<span class="hidden" id="tileDescription">${ifDefined(this.accessibleName)}</span><a class="udex-tile" part="tile" href="${ifDefined(this.href)}" target="${ifDefined(this.target)}" role="link" aria-describedby="tileDescription" @keydown="${this._onkeydown}" @click="${this._onclick}"><slot></slot></a>`; }
6
- function block2(context, tags, suffix) { return html `<div class="udex-tile" part="tile" @click="${this._onclick}"><slot></slot></div>`; }
7
- function template() { return block0.call(this, this, this.constructor.tagsToScope, getCustomElementsScopingSuffix()); }
8
- export default template;
9
- //# sourceMappingURL=TileTemplate.lit.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TileTemplate.lit.js","sourceRoot":"","sources":["../../../src/generated/templates/TileTemplate.lit.ts"],"names":[],"mappings":"AAAA,8BAA8B;AAC9B,OAAO,EAAE,IAAI,EAAmC,SAAS,EAAwB,MAAM,sDAAsD,CAAC;AAC9I,OAAO,EAAE,8BAA8B,EAAE,MAAM,0DAA0D,CAAC;AAK1G,SAAS,MAAM,CAAc,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,GAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAE,EAAE,CAAC,CAAA,CAAC;AAC1N,SAAS,MAAM,CAAc,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,6CAA6C,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,iDAAiD,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,8DAA8D,IAAI,CAAC,UAAU,aAAa,IAAI,CAAC,QAAQ,qBAAqB,CAAC,CAAA,CAAC;AAC5Z,SAAS,MAAM,CAAc,OAAmB,EAAE,IAAc,EAAE,MAA0B,IAAI,OAAO,IAAI,CAAA,8CAA8C,IAAI,CAAC,QAAQ,uBAAuB,CAAC,CAAA,CAAC;AAE/L,SAAS,QAAQ,KAAe,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAG,IAAI,CAAC,WAAiC,CAAC,WAAW,EAAE,8BAA8B,EAAE,CAAC,CAAC,CAAC,CAAC;AACxJ,eAAe,QAAQ,CAAC","sourcesContent":["/* eslint no-unused-vars: 0 */\nimport { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getCustomElementsScopingSuffix } from \"@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js\";\nimport type UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type Tile from \"../../Tile.js\";\nimport type { ClassMapValue } from \"@ui5/webcomponents-base/dist/types.js\";\n\t\nfunction block0 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.interactive ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }`;}\nfunction block1 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class=\"hidden\" id=\"tileDescription\">${ifDefined(this.accessibleName)}</span><a class=\"udex-tile\" part=\"tile\" href=\"${ifDefined(this.href)}\" target=\"${ifDefined(this.target)}\" role=\"link\" aria-describedby=\"tileDescription\" @keydown=\"${this._onkeydown}\" @click=\"${this._onclick}\"><slot></slot></a>`;}\nfunction block2 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class=\"udex-tile\" part=\"tile\" @click=\"${this._onclick}\"><slot></slot></div>`;}\n\nfunction template(this: Tile) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }\nexport default template;"]}
package/src/Tile.hbs DELETED
@@ -1,21 +0,0 @@
1
- {{#if interactive}}
2
- <span class="hidden" id="tileDescription">{{accessibleName}}</span>
3
- <a
4
- class="udex-tile"
5
- part="tile"
6
- href="{{href}}"
7
- target="{{target}}"
8
- role="link"
9
- aria-describedby="tileDescription"
10
- @keydown="{{_onkeydown}}"
11
- @click="{{_onclick}}">
12
- <slot></slot>
13
- </a>
14
- {{else}}
15
- <div
16
- class="udex-tile"
17
- part="tile"
18
- @click="{{_onclick}}">
19
- <slot></slot>
20
- </div>
21
- {{/if}}
@@ -1,13 +0,0 @@
1
- /* eslint no-unused-vars: 0 */
2
- import { html, svg, repeat, classMap, styleMap, ifDefined, unsafeHTML, scopeTag } from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
3
- import { getCustomElementsScopingSuffix } from "@ui5/webcomponents-base/dist/CustomElementsScopeUtils.js";
4
- import type UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
5
- import type Tile from "../../Tile.js";
6
- import type { ClassMapValue } from "@ui5/webcomponents-base/dist/types.js";
7
-
8
- function block0 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`${ this.interactive ? block1.call(this, context, tags, suffix) : block2.call(this, context, tags, suffix) }`;}
9
- function block1 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<span class="hidden" id="tileDescription">${ifDefined(this.accessibleName)}</span><a class="udex-tile" part="tile" href="${ifDefined(this.href)}" target="${ifDefined(this.target)}" role="link" aria-describedby="tileDescription" @keydown="${this._onkeydown}" @click="${this._onclick}"><slot></slot></a>`;}
10
- function block2 (this: Tile, context: UI5Element, tags: string[], suffix: string | undefined) { return html`<div class="udex-tile" part="tile" @click="${this._onclick}"><slot></slot></div>`;}
11
-
12
- function template(this: Tile) { return block0.call(this, this, (this.constructor as typeof UI5Element).tagsToScope, getCustomElementsScopingSuffix()); }
13
- export default template;