@sapudex/web-components 0.147.0 → 0.173.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 (492) hide show
  1. package/.eslintignore +1 -0
  2. package/bundle.esm.js +9 -0
  3. package/dist/AvatarGroup.js +0 -6
  4. package/dist/AvatarGroup.js.map +1 -1
  5. package/dist/Badge.d.ts +21 -14
  6. package/dist/Badge.js +20 -26
  7. package/dist/Badge.js.map +1 -1
  8. package/dist/Breadcrumbs.d.ts +23 -21
  9. package/dist/Breadcrumbs.js +58 -40
  10. package/dist/Breadcrumbs.js.map +1 -1
  11. package/dist/BreadcrumbsItem.js +0 -1
  12. package/dist/BreadcrumbsItem.js.map +1 -1
  13. package/dist/Checkbox.js +0 -1
  14. package/dist/Checkbox.js.map +1 -1
  15. package/dist/CountrySelector.d.ts +2 -2
  16. package/dist/CountrySelector.js +20 -12
  17. package/dist/CountrySelector.js.map +1 -1
  18. package/dist/DatePicker.d.ts +2 -2
  19. package/dist/DatePicker.js.map +1 -1
  20. package/dist/Dropdown.js +0 -3
  21. package/dist/Dropdown.js.map +1 -1
  22. package/dist/Footer.d.ts +53 -10
  23. package/dist/Footer.js +41 -11
  24. package/dist/Footer.js.map +1 -1
  25. package/dist/Link.d.ts +2 -5
  26. package/dist/Link.js +4 -8
  27. package/dist/Link.js.map +1 -1
  28. package/dist/List.d.ts +16 -1
  29. package/dist/List.js +154 -100
  30. package/dist/List.js.map +1 -1
  31. package/dist/ListItem.d.ts +1 -0
  32. package/dist/ListItem.js +3 -0
  33. package/dist/ListItem.js.map +1 -1
  34. package/dist/MastheadItem.d.ts +12 -2
  35. package/dist/MastheadItem.js +34 -7
  36. package/dist/MastheadItem.js.map +1 -1
  37. package/dist/MastheadMenu.d.ts +1 -0
  38. package/dist/MastheadMenu.js +13 -4
  39. package/dist/MastheadMenu.js.map +1 -1
  40. package/dist/MastheadMenuItem.d.ts +10 -0
  41. package/dist/MastheadMenuItem.js +24 -3
  42. package/dist/MastheadMenuItem.js.map +1 -1
  43. package/dist/MastheadMobileMenu.js +2 -2
  44. package/dist/MastheadMobileMenu.js.map +1 -1
  45. package/dist/MastheadProfileMenu.js +2 -2
  46. package/dist/MastheadProfileMenu.js.map +1 -1
  47. package/dist/MastheadShell.d.ts +4 -0
  48. package/dist/MastheadShell.js +21 -5
  49. package/dist/MastheadShell.js.map +1 -1
  50. package/dist/Pagination.d.ts +13 -3
  51. package/dist/Pagination.js +90 -57
  52. package/dist/Pagination.js.map +1 -1
  53. package/dist/PhoneNumberField.d.ts +3 -0
  54. package/dist/PhoneNumberField.js +9 -4
  55. package/dist/PhoneNumberField.js.map +1 -1
  56. package/dist/RangeSlider.js +0 -1
  57. package/dist/RangeSlider.js.map +1 -1
  58. package/dist/Search.d.ts +5 -4
  59. package/dist/Search.js +12 -12
  60. package/dist/Search.js.map +1 -1
  61. package/dist/SearchableListBase.d.ts +7 -1
  62. package/dist/SearchableListBase.js +47 -4
  63. package/dist/SearchableListBase.js.map +1 -1
  64. package/dist/SecondaryNavigation.d.ts +2 -2
  65. package/dist/SecondaryNavigation.js +20 -10
  66. package/dist/SecondaryNavigation.js.map +1 -1
  67. package/dist/SecondaryNavigationItem.d.ts +6 -3
  68. package/dist/SecondaryNavigationItem.js +50 -26
  69. package/dist/SecondaryNavigationItem.js.map +1 -1
  70. package/dist/SecondaryNavigationSubItem.d.ts +1 -0
  71. package/dist/SecondaryNavigationSubItem.js +3 -0
  72. package/dist/SecondaryNavigationSubItem.js.map +1 -1
  73. package/dist/SegmentedButton.d.ts +2 -2
  74. package/dist/SegmentedButton.js.map +1 -1
  75. package/dist/SelectBox.js.map +1 -1
  76. package/dist/SideNavigationGroup.js +0 -1
  77. package/dist/SideNavigationGroup.js.map +1 -1
  78. package/dist/SideNavigationItem.js +0 -1
  79. package/dist/SideNavigationItem.js.map +1 -1
  80. package/dist/SideNavigationSubItem.js +0 -1
  81. package/dist/SideNavigationSubItem.js.map +1 -1
  82. package/dist/Slider.js +0 -1
  83. package/dist/Slider.js.map +1 -1
  84. package/dist/TabNavigation.js +2 -2
  85. package/dist/TabNavigation.js.map +1 -1
  86. package/dist/Tag.d.ts +1 -4
  87. package/dist/Tag.js +1 -5
  88. package/dist/Tag.js.map +1 -1
  89. package/dist/Tile.d.ts +1 -1
  90. package/dist/Tile.js +1 -1
  91. package/dist/Tile.js.map +1 -1
  92. package/dist/Toast.d.ts +0 -1
  93. package/dist/Toast.js +4 -3
  94. package/dist/Toast.js.map +1 -1
  95. package/dist/Wizard.js +1 -1
  96. package/dist/Wizard.js.map +1 -1
  97. package/dist/WizardTab.js +0 -1
  98. package/dist/WizardTab.js.map +1 -1
  99. package/dist/assets/{bundle.esm-6e8e301d.js → bundle.esm-c4ffd46a.js} +187 -189
  100. package/dist/assets/messagebundle_ar-bb470511.js +1 -0
  101. package/dist/assets/messagebundle_bg-a533dfab.js +1 -0
  102. package/dist/assets/messagebundle_cs-c70a7f36.js +1 -0
  103. package/dist/assets/messagebundle_da-e292cac5.js +1 -0
  104. package/dist/assets/messagebundle_de-5c108de6.js +1 -0
  105. package/dist/assets/messagebundle_el-44746e0b.js +1 -0
  106. package/dist/assets/messagebundle_en-4997b226.js +1 -0
  107. package/dist/assets/messagebundle_es-c0c1060f.js +1 -0
  108. package/dist/assets/messagebundle_et-a5f15d3b.js +1 -0
  109. package/dist/assets/messagebundle_fi-f4b8eb82.js +1 -0
  110. package/dist/assets/messagebundle_fr-af18ac46.js +1 -0
  111. package/dist/assets/messagebundle_hr-d893e46d.js +1 -0
  112. package/dist/assets/messagebundle_hu-230c58c9.js +1 -0
  113. package/dist/assets/messagebundle_it-5bf1436c.js +1 -0
  114. package/dist/assets/messagebundle_iw-dd60afc4.js +1 -0
  115. package/dist/assets/messagebundle_ko-c450bda3.js +1 -0
  116. package/dist/assets/messagebundle_lt-87ab0529.js +1 -0
  117. package/dist/assets/messagebundle_lv-fc413852.js +1 -0
  118. package/dist/assets/messagebundle_nl-34d7e236.js +1 -0
  119. package/dist/assets/messagebundle_no-f22648fb.js +1 -0
  120. package/dist/assets/messagebundle_pl-10303f09.js +1 -0
  121. package/dist/assets/messagebundle_pt-b7a40c67.js +1 -0
  122. package/dist/assets/messagebundle_ro-94628623.js +1 -0
  123. package/dist/assets/messagebundle_ru-1f6595ba.js +1 -0
  124. package/dist/assets/messagebundle_sk-89eabac1.js +1 -0
  125. package/dist/assets/messagebundle_sl-d56532f1.js +1 -0
  126. package/dist/assets/messagebundle_sr-cf7f3b32.js +1 -0
  127. package/dist/assets/messagebundle_sv-3a3b20d3.js +1 -0
  128. package/dist/assets/messagebundle_tr-33b16d09.js +1 -0
  129. package/dist/assets/messagebundle_uk-82e1f2c1.js +1 -0
  130. package/dist/assets/messagebundle_zh_CN-15ca05aa.js +1 -0
  131. package/dist/assets/messagebundle_zh_TW-ad6445e7.js +1 -0
  132. package/dist/css/themes/Badge.css +1 -1
  133. package/dist/css/themes/BreadcrumbsPopover.css +1 -1
  134. package/dist/css/themes/Button.css +1 -1
  135. package/dist/css/themes/DatePickerPopover.css +1 -1
  136. package/dist/css/themes/FilterMenu.css +1 -1
  137. package/dist/css/themes/Footer.css +1 -1
  138. package/dist/css/themes/MastheadItem.css +1 -1
  139. package/dist/css/themes/MastheadMenu.css +1 -1
  140. package/dist/css/themes/MastheadMenuItem.css +1 -1
  141. package/dist/css/themes/MastheadShell.css +1 -1
  142. package/dist/css/themes/MediaPlayer.css +1 -1
  143. package/dist/css/themes/Modal.css +1 -1
  144. package/dist/css/themes/RatingIndicator.css +1 -1
  145. package/dist/css/themes/ReviewItem.css +1 -1
  146. package/dist/css/themes/Slider.css +1 -1
  147. package/dist/css/themes/TableCell.css +1 -1
  148. package/dist/css/themes/TableCellBase.css +1 -1
  149. package/dist/css/themes/TextArea.css +1 -1
  150. package/dist/custom-elements-internal.json +232 -31
  151. package/dist/custom-elements.json +224 -30
  152. package/dist/features/SearchSuggestionsPopover.d.ts +16 -0
  153. package/dist/features/SearchSuggestionsPopover.js +49 -0
  154. package/dist/features/SearchSuggestionsPopover.js.map +1 -1
  155. package/dist/generated/assets/i18n/messagebundle_ar.json +1 -0
  156. package/dist/generated/assets/i18n/messagebundle_bg.json +1 -0
  157. package/dist/generated/assets/i18n/messagebundle_cs.json +1 -0
  158. package/dist/generated/assets/i18n/messagebundle_da.json +1 -0
  159. package/dist/generated/assets/i18n/messagebundle_de.json +1 -1
  160. package/dist/generated/assets/i18n/messagebundle_el.json +1 -0
  161. package/dist/generated/assets/i18n/messagebundle_en.json +1 -1
  162. package/dist/generated/assets/i18n/messagebundle_es.json +1 -1
  163. package/dist/generated/assets/i18n/messagebundle_et.json +1 -0
  164. package/dist/generated/assets/i18n/messagebundle_fi.json +1 -0
  165. package/dist/generated/assets/i18n/messagebundle_fr.json +1 -1
  166. package/dist/generated/assets/i18n/messagebundle_hr.json +1 -0
  167. package/dist/generated/assets/i18n/messagebundle_hu.json +1 -0
  168. package/dist/generated/assets/i18n/messagebundle_it.json +1 -0
  169. package/dist/generated/assets/i18n/messagebundle_iw.json +1 -0
  170. package/dist/generated/assets/i18n/messagebundle_ko.json +1 -0
  171. package/dist/generated/assets/i18n/messagebundle_lt.json +1 -0
  172. package/dist/generated/assets/i18n/messagebundle_lv.json +1 -0
  173. package/dist/generated/assets/i18n/messagebundle_nl.json +1 -0
  174. package/dist/generated/assets/i18n/messagebundle_no.json +1 -0
  175. package/dist/generated/assets/i18n/messagebundle_pl.json +1 -0
  176. package/dist/generated/assets/i18n/messagebundle_pt.json +1 -0
  177. package/dist/generated/assets/i18n/messagebundle_ro.json +1 -0
  178. package/dist/generated/assets/i18n/messagebundle_ru.json +1 -0
  179. package/dist/generated/assets/i18n/messagebundle_sk.json +1 -0
  180. package/dist/generated/assets/i18n/messagebundle_sl.json +1 -0
  181. package/dist/generated/assets/i18n/messagebundle_sr.json +1 -0
  182. package/dist/generated/assets/i18n/messagebundle_sv.json +1 -0
  183. package/dist/generated/assets/i18n/messagebundle_tr.json +1 -0
  184. package/dist/generated/assets/i18n/messagebundle_uk.json +1 -0
  185. package/dist/generated/assets/i18n/messagebundle_zh_CN.json +1 -0
  186. package/dist/generated/assets/i18n/messagebundle_zh_TW.json +1 -0
  187. package/dist/generated/i18n/i18n-defaults.d.ts +7 -1
  188. package/dist/generated/i18n/i18n-defaults.js +7 -1
  189. package/dist/generated/i18n/i18n-defaults.js.map +1 -1
  190. package/dist/generated/json-imports/i18n-static.js +86 -2
  191. package/dist/generated/json-imports/i18n-static.js.map +1 -1
  192. package/dist/generated/json-imports/i18n.js +58 -2
  193. package/dist/generated/json-imports/i18n.js.map +1 -1
  194. package/dist/generated/templates/BadgeTemplate.lit.js +4 -4
  195. package/dist/generated/templates/BadgeTemplate.lit.js.map +1 -1
  196. package/dist/generated/templates/BreadcrumbsPopoverTemplate.lit.js +3 -3
  197. package/dist/generated/templates/BreadcrumbsPopoverTemplate.lit.js.map +1 -1
  198. package/dist/generated/templates/CountrySelectorTemplate.lit.js +1 -1
  199. package/dist/generated/templates/CountrySelectorTemplate.lit.js.map +1 -1
  200. package/dist/generated/templates/FooterTemplate.lit.js +12 -11
  201. package/dist/generated/templates/FooterTemplate.lit.js.map +1 -1
  202. package/dist/generated/templates/ListItemTemplate.lit.js +2 -2
  203. package/dist/generated/templates/ListItemTemplate.lit.js.map +1 -1
  204. package/dist/generated/templates/ListTemplate.lit.js +3 -3
  205. package/dist/generated/templates/ListTemplate.lit.js.map +1 -1
  206. package/dist/generated/templates/MastheadItemTemplate.lit.js +17 -16
  207. package/dist/generated/templates/MastheadItemTemplate.lit.js.map +1 -1
  208. package/dist/generated/templates/MastheadMenuItemTemplate.lit.js +15 -14
  209. package/dist/generated/templates/MastheadMenuItemTemplate.lit.js.map +1 -1
  210. package/dist/generated/templates/MastheadMenuTemplate.lit.js +3 -3
  211. package/dist/generated/templates/MastheadMenuTemplate.lit.js.map +1 -1
  212. package/dist/generated/templates/MastheadProfileMenuTemplate.lit.js +1 -1
  213. package/dist/generated/templates/MastheadProfileMenuTemplate.lit.js.map +1 -1
  214. package/dist/generated/templates/MastheadShellTemplate.lit.js +10 -9
  215. package/dist/generated/templates/MastheadShellTemplate.lit.js.map +1 -1
  216. package/dist/generated/templates/PaginationTemplate.lit.js +3 -3
  217. package/dist/generated/templates/PaginationTemplate.lit.js.map +1 -1
  218. package/dist/generated/templates/PhoneNumberFieldTemplate.lit.js +1 -1
  219. package/dist/generated/templates/PhoneNumberFieldTemplate.lit.js.map +1 -1
  220. package/dist/generated/templates/RatingBarTemplate.lit.js +1 -1
  221. package/dist/generated/templates/RatingBarTemplate.lit.js.map +1 -1
  222. package/dist/generated/templates/ReviewItemTemplate.lit.js +1 -1
  223. package/dist/generated/templates/ReviewItemTemplate.lit.js.map +1 -1
  224. package/dist/generated/templates/SearchSuggestionsTemplate.lit.js +1 -1
  225. package/dist/generated/templates/SearchSuggestionsTemplate.lit.js.map +1 -1
  226. package/dist/generated/templates/SearchableListBaseTemplate.lit.js +2 -2
  227. package/dist/generated/templates/SearchableListBaseTemplate.lit.js.map +1 -1
  228. package/dist/generated/templates/SecondaryNavigationItemTemplate.lit.js +3 -3
  229. package/dist/generated/templates/SecondaryNavigationItemTemplate.lit.js.map +1 -1
  230. package/dist/generated/templates/SecondaryNavigationSubItemTemplate.lit.js +3 -3
  231. package/dist/generated/templates/SecondaryNavigationSubItemTemplate.lit.js.map +1 -1
  232. package/dist/generated/templates/SecondaryNavigationTemplate.lit.js +1 -1
  233. package/dist/generated/templates/SecondaryNavigationTemplate.lit.js.map +1 -1
  234. package/dist/generated/templates/StepInputTemplate.lit.js +1 -1
  235. package/dist/generated/templates/StepInputTemplate.lit.js.map +1 -1
  236. package/dist/generated/templates/WizardTemplate.lit.js +1 -1
  237. package/dist/generated/templates/WizardTemplate.lit.js.map +1 -1
  238. package/dist/generated/themes/Badge.css.js +1 -1
  239. package/dist/generated/themes/Badge.css.js.map +1 -1
  240. package/dist/generated/themes/BreadcrumbsPopover.css.js +1 -1
  241. package/dist/generated/themes/BreadcrumbsPopover.css.js.map +1 -1
  242. package/dist/generated/themes/Button.css.js +1 -1
  243. package/dist/generated/themes/Button.css.js.map +1 -1
  244. package/dist/generated/themes/DatePickerPopover.css.js +1 -1
  245. package/dist/generated/themes/DatePickerPopover.css.js.map +1 -1
  246. package/dist/generated/themes/FilterMenu.css.js +1 -1
  247. package/dist/generated/themes/FilterMenu.css.js.map +1 -1
  248. package/dist/generated/themes/Footer.css.js +1 -1
  249. package/dist/generated/themes/Footer.css.js.map +1 -1
  250. package/dist/generated/themes/MastheadItem.css.js +1 -1
  251. package/dist/generated/themes/MastheadItem.css.js.map +1 -1
  252. package/dist/generated/themes/MastheadMenu.css.js +1 -1
  253. package/dist/generated/themes/MastheadMenu.css.js.map +1 -1
  254. package/dist/generated/themes/MastheadMenuItem.css.js +1 -1
  255. package/dist/generated/themes/MastheadMenuItem.css.js.map +1 -1
  256. package/dist/generated/themes/MastheadShell.css.js +1 -1
  257. package/dist/generated/themes/MastheadShell.css.js.map +1 -1
  258. package/dist/generated/themes/MediaPlayer.css.js +1 -1
  259. package/dist/generated/themes/MediaPlayer.css.js.map +1 -1
  260. package/dist/generated/themes/Modal.css.js +1 -1
  261. package/dist/generated/themes/Modal.css.js.map +1 -1
  262. package/dist/generated/themes/RatingIndicator.css.js +1 -1
  263. package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
  264. package/dist/generated/themes/ReviewItem.css.js +1 -1
  265. package/dist/generated/themes/ReviewItem.css.js.map +1 -1
  266. package/dist/generated/themes/Slider.css.js +1 -1
  267. package/dist/generated/themes/Slider.css.js.map +1 -1
  268. package/dist/generated/themes/TableCell.css.js +1 -1
  269. package/dist/generated/themes/TableCell.css.js.map +1 -1
  270. package/dist/generated/themes/TableCellBase.css.js +1 -1
  271. package/dist/generated/themes/TableCellBase.css.js.map +1 -1
  272. package/dist/generated/themes/TextArea.css.js +1 -1
  273. package/dist/generated/themes/TextArea.css.js.map +1 -1
  274. package/dist/i18n/messagebundle.properties +10 -0
  275. package/dist/i18n/messagebundle_ar.properties +1 -0
  276. package/dist/i18n/messagebundle_bg.properties +1 -0
  277. package/dist/i18n/messagebundle_cs.properties +1 -0
  278. package/dist/i18n/messagebundle_da.properties +1 -0
  279. package/dist/i18n/messagebundle_de.properties +1 -0
  280. package/dist/i18n/messagebundle_el.properties +1 -0
  281. package/dist/i18n/messagebundle_en.properties +4 -0
  282. package/dist/i18n/messagebundle_es.properties +1 -0
  283. package/dist/i18n/messagebundle_et.properties +1 -0
  284. package/dist/i18n/messagebundle_fi.properties +1 -0
  285. package/dist/i18n/messagebundle_fr.properties +1 -0
  286. package/dist/i18n/messagebundle_hr.properties +1 -0
  287. package/dist/i18n/messagebundle_hu.properties +1 -0
  288. package/dist/i18n/messagebundle_it.properties +1 -0
  289. package/dist/i18n/messagebundle_iw.properties +2 -0
  290. package/dist/i18n/messagebundle_ko.properties +1 -0
  291. package/dist/i18n/messagebundle_lt.properties +1 -0
  292. package/dist/i18n/messagebundle_lv.properties +1 -0
  293. package/dist/i18n/messagebundle_nl.properties +1 -0
  294. package/dist/i18n/messagebundle_no.properties +1 -0
  295. package/dist/i18n/messagebundle_pl.properties +1 -0
  296. package/dist/i18n/messagebundle_pt.properties +1 -0
  297. package/dist/i18n/messagebundle_pt_BR.properties +1 -0
  298. package/dist/i18n/messagebundle_ro.properties +1 -0
  299. package/dist/i18n/messagebundle_ru.properties +1 -0
  300. package/dist/i18n/messagebundle_sk.properties +1 -0
  301. package/dist/i18n/messagebundle_sl.properties +1 -0
  302. package/dist/i18n/messagebundle_sr.properties +2 -0
  303. package/dist/i18n/messagebundle_sv.properties +1 -0
  304. package/dist/i18n/messagebundle_tr.properties +1 -0
  305. package/dist/i18n/messagebundle_uk.properties +1 -0
  306. package/dist/i18n/messagebundle_zh_CN.properties +4 -0
  307. package/dist/i18n/messagebundle_zh_TW.properties +1 -0
  308. package/dist/types/BadgeDesign.d.ts +15 -0
  309. package/dist/types/BadgeDesign.js +18 -0
  310. package/dist/types/BadgeDesign.js.map +1 -0
  311. package/dist/types/IconPlacement.d.ts +5 -0
  312. package/dist/types/IconPlacement.js +7 -0
  313. package/dist/types/IconPlacement.js.map +1 -0
  314. package/dist/types/List.d.ts +8 -0
  315. package/dist/types/List.js.map +1 -1
  316. package/dist/utils/isLetterKeyPressed.d.ts +2 -0
  317. package/dist/utils/isLetterKeyPressed.js +5 -0
  318. package/dist/utils/isLetterKeyPressed.js.map +1 -0
  319. package/dist/utils/listItemLabelStartsWithKeyFocus.d.ts +3 -0
  320. package/dist/utils/listItemLabelStartsWithKeyFocus.js +55 -0
  321. package/dist/utils/listItemLabelStartsWithKeyFocus.js.map +1 -0
  322. package/dist/utils/listItemLabelUtils.d.ts +7 -0
  323. package/dist/utils/listItemLabelUtils.js +36 -0
  324. package/dist/utils/listItemLabelUtils.js.map +1 -0
  325. package/dist/vscode.html-custom-data.json +63 -26
  326. package/dist/web-types.json +113 -38
  327. package/package.json +1 -1
  328. package/src/AvatarGroup.ts +0 -7
  329. package/src/Badge.hbs +16 -5
  330. package/src/Badge.ts +36 -19
  331. package/src/Breadcrumbs.ts +92 -66
  332. package/src/BreadcrumbsItem.ts +0 -1
  333. package/src/BreadcrumbsPopover.hbs +11 -9
  334. package/src/Checkbox.ts +0 -1
  335. package/src/CountrySelector.hbs +0 -1
  336. package/src/CountrySelector.ts +30 -16
  337. package/src/DatePicker.ts +2 -2
  338. package/src/Dropdown.ts +0 -2
  339. package/src/Footer.hbs +52 -28
  340. package/src/Footer.ts +81 -22
  341. package/src/Link.ts +5 -9
  342. package/src/List.hbs +2 -2
  343. package/src/List.ts +182 -112
  344. package/src/ListItem.hbs +2 -2
  345. package/src/ListItem.ts +4 -0
  346. package/src/MastheadItem.hbs +14 -4
  347. package/src/MastheadItem.ts +42 -9
  348. package/src/MastheadMenu.hbs +4 -4
  349. package/src/MastheadMenu.ts +20 -8
  350. package/src/MastheadMenuItem.hbs +10 -2
  351. package/src/MastheadMenuItem.ts +28 -1
  352. package/src/MastheadMobileMenu.ts +2 -2
  353. package/src/MastheadProfileMenu.hbs +1 -0
  354. package/src/MastheadProfileMenu.ts +3 -2
  355. package/src/MastheadShell.hbs +25 -19
  356. package/src/MastheadShell.ts +25 -5
  357. package/src/Pagination.hbs +3 -2
  358. package/src/Pagination.ts +110 -60
  359. package/src/PhoneNumberField.hbs +3 -3
  360. package/src/PhoneNumberField.ts +16 -8
  361. package/src/RangeSlider.ts +0 -1
  362. package/src/RatingBar.hbs +1 -1
  363. package/src/ReviewItem.hbs +1 -1
  364. package/src/Search.hbs +10 -10
  365. package/src/Search.ts +17 -17
  366. package/src/SearchSuggestions.hbs +1 -0
  367. package/src/SearchableListBase.hbs +3 -1
  368. package/src/SearchableListBase.ts +57 -6
  369. package/src/SecondaryNavigation.hbs +1 -0
  370. package/src/SecondaryNavigation.ts +23 -16
  371. package/src/SecondaryNavigationItem.hbs +10 -7
  372. package/src/SecondaryNavigationItem.ts +58 -28
  373. package/src/SecondaryNavigationSubItem.hbs +3 -0
  374. package/src/SecondaryNavigationSubItem.ts +3 -0
  375. package/src/SegmentedButton.ts +2 -2
  376. package/src/SelectBox.ts +1 -1
  377. package/src/SideNavigationGroup.ts +0 -1
  378. package/src/SideNavigationItem.ts +0 -1
  379. package/src/SideNavigationSubItem.ts +0 -1
  380. package/src/Slider.ts +0 -1
  381. package/src/StepInput.hbs +16 -16
  382. package/src/TabNavigation.ts +2 -2
  383. package/src/Tag.ts +1 -5
  384. package/src/Tile.ts +2 -2
  385. package/src/Toast.ts +4 -3
  386. package/src/Wizard.hbs +1 -0
  387. package/src/Wizard.ts +1 -1
  388. package/src/WizardTab.ts +0 -1
  389. package/src/features/SearchSuggestionsPopover.ts +67 -1
  390. package/src/generated/i18n/i18n-defaults.ts +2 -2
  391. package/src/generated/json-imports/i18n-static.ts +86 -2
  392. package/src/generated/json-imports/i18n.ts +59 -3
  393. package/src/generated/templates/BadgeTemplate.lit.ts +3 -3
  394. package/src/generated/templates/BreadcrumbsPopoverTemplate.lit.ts +3 -3
  395. package/src/generated/templates/CountrySelectorTemplate.lit.ts +1 -1
  396. package/src/generated/templates/FooterTemplate.lit.ts +12 -11
  397. package/src/generated/templates/ListItemTemplate.lit.ts +2 -2
  398. package/src/generated/templates/ListTemplate.lit.ts +3 -3
  399. package/src/generated/templates/MastheadItemTemplate.lit.ts +17 -16
  400. package/src/generated/templates/MastheadMenuItemTemplate.lit.ts +15 -14
  401. package/src/generated/templates/MastheadMenuTemplate.lit.ts +3 -3
  402. package/src/generated/templates/MastheadProfileMenuTemplate.lit.ts +1 -1
  403. package/src/generated/templates/MastheadShellTemplate.lit.ts +10 -9
  404. package/src/generated/templates/PaginationTemplate.lit.ts +3 -3
  405. package/src/generated/templates/PhoneNumberFieldTemplate.lit.ts +1 -1
  406. package/src/generated/templates/RatingBarTemplate.lit.ts +1 -1
  407. package/src/generated/templates/ReviewItemTemplate.lit.ts +1 -1
  408. package/src/generated/templates/SearchSuggestionsTemplate.lit.ts +1 -1
  409. package/src/generated/templates/SearchableListBaseTemplate.lit.ts +2 -2
  410. package/src/generated/templates/SecondaryNavigationItemTemplate.lit.ts +3 -3
  411. package/src/generated/templates/SecondaryNavigationSubItemTemplate.lit.ts +3 -3
  412. package/src/generated/templates/SecondaryNavigationTemplate.lit.ts +1 -1
  413. package/src/generated/templates/StepInputTemplate.lit.ts +1 -1
  414. package/src/generated/templates/WizardTemplate.lit.ts +1 -1
  415. package/src/generated/themes/Badge.css.ts +1 -1
  416. package/src/generated/themes/BreadcrumbsPopover.css.ts +1 -1
  417. package/src/generated/themes/Button.css.ts +1 -1
  418. package/src/generated/themes/DatePickerPopover.css.ts +1 -1
  419. package/src/generated/themes/FilterMenu.css.ts +1 -1
  420. package/src/generated/themes/Footer.css.ts +1 -1
  421. package/src/generated/themes/MastheadItem.css.ts +1 -1
  422. package/src/generated/themes/MastheadMenu.css.ts +1 -1
  423. package/src/generated/themes/MastheadMenuItem.css.ts +1 -1
  424. package/src/generated/themes/MastheadShell.css.ts +1 -1
  425. package/src/generated/themes/MediaPlayer.css.ts +1 -1
  426. package/src/generated/themes/Modal.css.ts +1 -1
  427. package/src/generated/themes/RatingIndicator.css.ts +1 -1
  428. package/src/generated/themes/ReviewItem.css.ts +1 -1
  429. package/src/generated/themes/Slider.css.ts +1 -1
  430. package/src/generated/themes/TableCell.css.ts +1 -1
  431. package/src/generated/themes/TableCellBase.css.ts +1 -1
  432. package/src/generated/themes/TextArea.css.ts +1 -1
  433. package/src/i18n/messagebundle.properties +10 -0
  434. package/src/i18n/messagebundle_ar.properties +1 -0
  435. package/src/i18n/messagebundle_bg.properties +1 -0
  436. package/src/i18n/messagebundle_cs.properties +1 -0
  437. package/src/i18n/messagebundle_da.properties +1 -0
  438. package/src/i18n/messagebundle_de.properties +1 -0
  439. package/src/i18n/messagebundle_el.properties +1 -0
  440. package/src/i18n/messagebundle_en.properties +4 -0
  441. package/src/i18n/messagebundle_es.properties +1 -0
  442. package/src/i18n/messagebundle_et.properties +1 -0
  443. package/src/i18n/messagebundle_fi.properties +1 -0
  444. package/src/i18n/messagebundle_fr.properties +1 -0
  445. package/src/i18n/messagebundle_hr.properties +1 -0
  446. package/src/i18n/messagebundle_hu.properties +1 -0
  447. package/src/i18n/messagebundle_it.properties +1 -0
  448. package/src/i18n/messagebundle_iw.properties +2 -0
  449. package/src/i18n/messagebundle_ko.properties +1 -0
  450. package/src/i18n/messagebundle_lt.properties +1 -0
  451. package/src/i18n/messagebundle_lv.properties +1 -0
  452. package/src/i18n/messagebundle_nl.properties +1 -0
  453. package/src/i18n/messagebundle_no.properties +1 -0
  454. package/src/i18n/messagebundle_pl.properties +1 -0
  455. package/src/i18n/messagebundle_pt.properties +1 -0
  456. package/src/i18n/messagebundle_pt_BR.properties +1 -0
  457. package/src/i18n/messagebundle_ro.properties +1 -0
  458. package/src/i18n/messagebundle_ru.properties +1 -0
  459. package/src/i18n/messagebundle_sk.properties +1 -0
  460. package/src/i18n/messagebundle_sl.properties +1 -0
  461. package/src/i18n/messagebundle_sr.properties +2 -0
  462. package/src/i18n/messagebundle_sv.properties +1 -0
  463. package/src/i18n/messagebundle_tr.properties +1 -0
  464. package/src/i18n/messagebundle_uk.properties +1 -0
  465. package/src/i18n/messagebundle_zh_CN.properties +4 -0
  466. package/src/i18n/messagebundle_zh_TW.properties +1 -0
  467. package/src/themes/Badge.css +48 -52
  468. package/src/themes/BreadcrumbsPopover.css +1 -0
  469. package/src/themes/Button.css +13 -0
  470. package/src/themes/DatePickerPopover.css +9 -0
  471. package/src/themes/FilterMenu.css +6 -6
  472. package/src/themes/Footer.css +22 -3
  473. package/src/themes/MastheadItem.css +4 -0
  474. package/src/themes/MastheadMenu.css +1 -1
  475. package/src/themes/MastheadMenuItem.css +4 -0
  476. package/src/themes/MastheadShell.css +5 -0
  477. package/src/themes/MediaPlayer.css +2 -1
  478. package/src/themes/Modal.css +1 -0
  479. package/src/themes/ReviewItem.css +0 -2
  480. package/src/themes/TableCell.css +0 -2
  481. package/src/themes/TableCellBase.css +1 -0
  482. package/src/themes/TextArea.css +1 -1
  483. package/src/types/BadgeDesign.ts +17 -0
  484. package/src/types/IconPlacement.ts +6 -0
  485. package/src/types/List.ts +9 -0
  486. package/src/utils/isLetterKeyPressed.ts +5 -0
  487. package/src/utils/listItemLabelStartsWithKeyFocus.ts +74 -0
  488. package/src/utils/listItemLabelUtils.ts +50 -0
  489. package/dist/assets/messagebundle_de-8158912e.js +0 -1
  490. package/dist/assets/messagebundle_en-c677773a.js +0 -1
  491. package/dist/assets/messagebundle_es-8dab6565.js +0 -1
  492. package/dist/assets/messagebundle_fr-669aca6d.js +0 -1
@@ -18,63 +18,40 @@
18
18
  --udex-info-badge-number-small-line-height: 1.125rem;
19
19
  --udex-info-badge-number-small-height: 1.625rem;
20
20
  --udex-info-badge-number-small-padding: var(--udexSpacer4) var(--udexSpacer8);
21
- --udex-info-badge-color-info-border-color: var(
22
- --sapMessage_InformationBorderColor,
23
- var(--udexColorBlue7, #0070f2)
24
- );
25
- --udex-info-badge-color-info-text-color: var(
26
- --sapInformationColor,
27
- var(--udexColorBlue9, #0040b0)
28
- );
29
- --udex-info-badge-color-info-background: var(
30
- --sapInformationBackground,
31
- var(--udexCoreSemanticInfo1, #ebf8ff)
32
- );
33
- --udex-info-badge-color-success-border-color: var(
34
- --sapMessage_SuccessBorderColor,
35
- var(--udexCoreSemanticSuccess7, #188918)
36
- );
21
+ --udex-badge-icon-color: inherit;
22
+ --udex-badge-icon-size: var(--udexSpacer12, 12px);
23
+
24
+ --udex-neutral-badge-color-neutral-border-color: var(--sapMessage_NeutralBorderColor, var(--udexColorGrey4, #a9b4be));
25
+ --udex-neutral-badge-color-neutral-text-color: var(--udexColorGrey9, #223548);
26
+ --udex-neutral-badge-color-neutral-background: var(--sapNeutralBackground, var(--udexColorNeutralWhite, #ffffff));
27
+
28
+ --udex-info-badge-color-info-border-color: var(--sapMessage_InformationBorderColor, var(--udexColorBlue7, #0070f2));
29
+ --udex-info-badge-color-info-text-color: var(--sapInformationColor, var(--udexColorBlue9, #0040b0));
30
+ --udex-info-badge-color-info-background: var(--sapInformationBackground, var(--udexCoreSemanticInfo1, #ebf8ff));
31
+
32
+ --udex-info-badge-color-success-border-color: var(--sapMessage_SuccessBorderColor, var(--udexCoreSemanticSuccess7, #188918));
37
33
  --udex-info-badge-color-success-text-color: var(--sapSuccessColor, #1e592f);
38
- --udex-info-badge-color-success-background: var(
39
- --sapSuccessBackground,
40
- var(--udexCoreSemanticSuccess1, #f5fae5)
41
- );
42
- --udex-info-badge-color-warning-border-color: var(
43
- --sapWarningBorderColor,
44
- var(--udexCoreSemanticWarning7, #c35500)
45
- );
34
+ --udex-info-badge-color-success-background: var(--sapSuccessBackground, var(--udexCoreSemanticSuccess1, #f5fae5));
35
+
36
+ --udex-info-badge-color-warning-border-color: var(--sapWarningBorderColor, var(--udexCoreSemanticWarning7, #c35500));
46
37
  --udex-info-badge-color-warning-text-color: var(--sapWarningColor, #8d2a00);
47
- --udex-info-badge-color-warning-background: var(
48
- --sapWarningBackground,
49
- var(--udexCoreSemanticWarning1, #fff8d6)
50
- );
51
- --udex-info-badge-color-error-border-color: var(
52
- --sapErrorBorderColor,
53
- var(--udexCoreSemanticError7, #d20a0a)
54
- );
38
+ --udex-info-badge-color-warning-background: var(--sapWarningBackground, var(--udexCoreSemanticWarning1, #fff8d6));
39
+
40
+ --udex-info-badge-color-error-border-color: var(--sapErrorBorderColor, var(--udexCoreSemanticError7, #d20a0a));
55
41
  --udex-info-badge-color-error-text-color: var(--sapErrorColor, #840606);
56
- --udex-info-badge-color-error-background: var(
57
- --sapErrorBackground,
58
- var(--udexCoreSemanticError1, #ffeaf4)
59
- );
60
- --udex-number-badge-color-blue-text-color: var(
61
- --udexColorNeutralWhite,
62
- #ffffff
63
- );
42
+ --udex-info-badge-color-error-background: var(--sapErrorBackground,var(--udexCoreSemanticError1, #ffeaf4));
43
+
44
+ --udex-number-badge-color-blue-text-color: var(--udexColorNeutralWhite,#ffffff);
64
45
  --udex-number-badge-color-blue-background: var(--udexColorBlue7, #0070f2);
65
- --udex-number-badge-color-red-text-color: var(
66
- --udexColorNeutralWhite,
67
- #ffffff
68
- );
69
- --udex-number-badge-color-red-background: var(
70
- --sapNegativeBackgroundColor,
71
- #d20a0a
72
- );
46
+
47
+ --udex-number-badge-color-red-text-color: var(--udexColorNeutralWhite,#ffffff);
48
+ --udex-number-badge-color-red-background: var(--sapNegativeBackgroundColor, #d20a0a);
49
+
73
50
  --udex-number-badge-color-white-text-color: var(--udexColorBlue7, #0070f2);
74
- --udex-number-badge-color-white-background: var(
75
- --udexColorNeutralWhite,
76
- #ffffff
77
- );
51
+ --udex-number-badge-color-white-background: var(--udexColorNeutralWhite, #ffffff);
52
+
53
+ --udex-number-badge-color-neutral-background: var(--udexColorNeutralWhite, #ffffff);
54
+ --udex-number-badge-color-neutral-text-color: var(--udexColorGrey9, #223548);
78
55
  }
79
56
 
80
57
  .udex-badge {
@@ -83,6 +60,13 @@
83
60
  font-size: var(--udex-tags-font-size);
84
61
  display: inline-flex;
85
62
  align-items: center;
63
+ gap: var(--udexSpacer4, 4px);
64
+ }
65
+
66
+ .udex-badge__icon {
67
+ height: var(--udex-badge-icon-size);
68
+ min-width: var(--udex-badge-icon-size);
69
+ color: var(--udex-badge-icon-color);
86
70
  }
87
71
 
88
72
  .udex-badge--text.udex-badge--large {
@@ -110,6 +94,13 @@
110
94
  color: var(--udex-info-badge-color-info-text-color);
111
95
  }
112
96
 
97
+ .udex-badge--text.udex-badge--neutral {
98
+ background: var(--udex-neutral-badge-color-neutral-background);
99
+ box-shadow: inset 0 0 0 var(--udex-info-badge-text-border-width)
100
+ var(--udex-neutral-badge-color-neutral-border-color);
101
+ color: var(--udex-neutral-badge-color-neutral-text-color);
102
+ }
103
+
113
104
  .udex-badge--text.udex-badge--success {
114
105
  background: var(--udex-info-badge-color-success-background);
115
106
  box-shadow: inset 0 0 0 var(--udex-info-badge-text-border-width)
@@ -164,3 +155,8 @@
164
155
  background: var(--udex-number-badge-color-white-background);
165
156
  font-weight: var(--udexTypographyFontWeightMedium);
166
157
  }
158
+
159
+ .udex-badge--number.udex-badge--neutral {
160
+ color: var(--udex-number-badge-color-neutral-text-color);
161
+ background: var(--udex-number-badge-color-neutral-background);
162
+ }
@@ -26,6 +26,7 @@
26
26
  --udex-dropdown-box-shadow: var(--sapContent_Shadow2, 0px 10px 30px 0px rgba(34, 54, 73, 0.25));
27
27
  --udex-dropdown-border-radius: 0;
28
28
  --udex-dropdown-border-width: 0;
29
+ --udex-dropdown-pane-max-width: fit-content;
29
30
  }
30
31
 
31
32
  [ui5-icon] {
@@ -115,6 +115,7 @@
115
115
  --udex-button-invisible-padding-small: 2px 0px;
116
116
  --udex-button-invisible-padding-medium: 4px 0px;
117
117
  --udex-button-invisible-padding-large: 8px 0px;
118
+ --udex-button-invisible-focus-inset: -2px;
118
119
  /* Default */
119
120
  --udex-button-color-invisible-standard-default-background: transparent;
120
121
  --udex-button-color-invisible-standard-default-text-and-icon: var(--udexColorBlue8);
@@ -247,6 +248,17 @@
247
248
  z-index: 1;
248
249
  }
249
250
 
251
+ :host([design="Invisible"][focused]:not([active]):not([toggled]))::part(button):after,
252
+ :host([design="Invisible"][active]:not([toggled]))::part(button):before {
253
+ content: "";
254
+ position: absolute;
255
+ box-sizing: border-box;
256
+ inset: var(--udex-button-invisible-focus-inset);
257
+ border: 2px solid var(--udexColorBlue10);
258
+ border-radius: .375rem;
259
+ z-index: 1;
260
+ }
261
+
250
262
  :host,
251
263
  :host([size="Medium"]) {
252
264
  font-size: 1rem;
@@ -531,6 +543,7 @@
531
543
  background-color: var(--udex-button-color-invisible-standard-default-background);
532
544
  border: none;
533
545
  height: auto;
546
+ overflow: visible;
534
547
  }
535
548
  :host([design="Invisible"][size="Small"])::part(button) {
536
549
  padding: var(--udex-button-invisible-padding-small);
@@ -1,3 +1,12 @@
1
1
  .udex-date-picker__popover {
2
2
  --udex-dropdown-border-width: 0;
3
+ --udex-dropdown-pane-max-width: fit-content;
4
+ }
5
+
6
+
7
+ @media (width < 640px) {
8
+ .udex-date-picker__popover {
9
+ --udex-dropdown-pane-min-width-xs: fit-content;
10
+ --udex-dropdown-pane-max-width-xs: fit-content;
11
+ }
3
12
  }
@@ -150,7 +150,7 @@
150
150
  margin-inline-start: var(--udexSpacer4, 4px);
151
151
  }
152
152
 
153
- ui5-popover {
153
+ [ui5-popover] {
154
154
  border: var(--udex-filter-menu-popover-border-width) solid var(--udex-filter-menu-popover-border-color);
155
155
  border-radius: var(--udex-filter-menu-popover-border-radius);
156
156
  box-shadow: var(--udex-filter-menu-popover-shadow);
@@ -159,17 +159,17 @@ ui5-popover {
159
159
  width: var(--udex-filter-menu-popover-width);
160
160
  }
161
161
 
162
- ui5-popover::part(content) {
162
+ [ui5-popover]::part(content) {
163
163
  padding: 0;
164
164
  overflow: auto;
165
165
  }
166
166
 
167
- ui5-popover::part(header),
168
- ui5-popover::part(footer) {
167
+ [ui5-popover]::part(header),
168
+ [ui5-popover]::part(footer) {
169
169
  padding: var(--udexSpacer16, 16px) var(--udexSpacer12, 12px);
170
170
  }
171
171
 
172
- ui5-popover::part(footer) {
172
+ [ui5-popover]::part(footer) {
173
173
  justify-content: flex-start;
174
174
  border-color: var(--sapField_BorderColor, var(--udexCoreBorderDefault));
175
175
  box-shadow: var(--sapContent_Shadow1, 0px 2px 8px 0px rgba(34,54,73,0.3));
@@ -189,7 +189,7 @@ ui5-popover::part(footer) {
189
189
  }
190
190
 
191
191
  @media (width < 640px) {
192
- ui5-popover {
192
+ [ui5-popover] {
193
193
  min-width: var(--udex-filter-menu-popover-min-width-xs);
194
194
  max-width: var(--udex-filter-menu-popover-max-width-xs);
195
195
  }
@@ -26,7 +26,7 @@
26
26
 
27
27
  .udex-footer {
28
28
  background: var(--udex-footer-background-color);
29
- padding: var(--udexSpacer84);
29
+ padding: var(--udexSpacer72) var(--udexSpacer84);
30
30
  font-family: var(--sapFontFamily);
31
31
  color: var(--udex-footer-text-color);
32
32
  position: relative;
@@ -148,7 +148,7 @@
148
148
  display: flex;
149
149
  flex-wrap: wrap;
150
150
  width: 100%;
151
- padding-top: var(--udexSpacer32);
151
+ padding-top: var(--udexSpacer20);
152
152
  row-gap: var(--udexSpacer12);
153
153
  column-gap: var(--udexSpacer12);
154
154
  }
@@ -216,6 +216,18 @@ h3 {
216
216
  align-items: center;
217
217
  }
218
218
 
219
+ .udex-footer__copyright {
220
+ display: flex;
221
+ flex-direction: column;
222
+ font-size: var(--udexTypographyBodyXSFontSize);
223
+ line-height: var(--udexTypographyBodyLineHeight);
224
+ padding-top: var(--udexSpacer32);
225
+ }
226
+
227
+ :host a.udex-footer__copyright-chinese-link {
228
+ color: var(--udex-footer-text-color)
229
+ }
230
+
219
231
  @media (max-width: 1599px) {
220
232
  .udex-footer {
221
233
  padding: var(--udexSpacer40) var(--udexSpacer72);
@@ -226,6 +238,10 @@ h3 {
226
238
  }
227
239
 
228
240
  @media (max-width: 1279px) {
241
+ .udex-footer__copyright {
242
+ padding-top: 0;
243
+ }
244
+
229
245
  .udex-footer__content {
230
246
  flex-direction: column;
231
247
  flex-wrap: nowrap;
@@ -261,7 +277,6 @@ h3 {
261
277
 
262
278
  .udex-footer__divider {
263
279
  display: block;
264
- margin: var(--udexSpacer20) 0;
265
280
  }
266
281
 
267
282
  .udex-footer__contact > div,
@@ -275,6 +290,10 @@ h3 {
275
290
  }
276
291
 
277
292
  @media (max-width: 979px) {
293
+ .udex-footer__copyright {
294
+ padding-bottom: var(--udexSpacer4);
295
+ }
296
+
278
297
  .udex-footer {
279
298
  padding: var(--udexSpacer40) var(--udexSpacer48) var(--udexSpacer120) var(--udexSpacer48);
280
299
  }
@@ -210,6 +210,10 @@
210
210
  flex-direction: column;
211
211
  }
212
212
 
213
+ .udex-masthead-hidden-text {
214
+ display: none;
215
+ }
216
+
213
217
  @media (max-width: 1279px) {
214
218
  :host {
215
219
  position: initial;
@@ -97,10 +97,10 @@
97
97
 
98
98
  .udex-masthead-menu__list {
99
99
  width: var(--udex-masthead-menu-column-width);
100
+ flex-grow: 1;
100
101
  list-style: none;
101
102
  margin: 0;
102
103
  padding: 0;
103
- flex-grow: 1;
104
104
  }
105
105
 
106
106
  .udex-masthead-menu__list li {
@@ -159,6 +159,10 @@ button.udex-masthead-menu-item {
159
159
  margin-inline-end: auto;
160
160
  }
161
161
 
162
+ .udex-masthead-hidden-text {
163
+ display: none;
164
+ }
165
+
162
166
  @media (max-width: 1279px) {
163
167
  .udex-masthead-menu-item {
164
168
  padding: var(--udex-masthead-menu-item-padding-mobile);
@@ -123,6 +123,9 @@
123
123
  align-items: center;
124
124
  gap: var(--udexSpacer24);
125
125
  max-width: 100%;
126
+ margin: 0;
127
+ padding: 0;
128
+ list-style: none;
126
129
  }
127
130
 
128
131
  .udex-masthead-shell__right-menu {
@@ -152,11 +155,13 @@
152
155
 
153
156
  .udex-masthead-shell__menu-btn {
154
157
  height: 18px;
158
+ order: 1;
155
159
  }
156
160
 
157
161
  .udex-masthead-shell__close-btn {
158
162
  position: relative;
159
163
  margin-inline-start: var(--udexSpacer12);
164
+ order: 2;
160
165
  }
161
166
 
162
167
  .udex-masthead-shell__close-btn:before {
@@ -1,4 +1,5 @@
1
1
  :host {
2
+ --udex-media-player-background-color: #000000;
2
3
  --udex-media-player-height: 500px;
3
4
  --udex-media-player-width: 100%;
4
5
  --udex-media-player-mobile-height: 150px;
@@ -64,7 +65,7 @@
64
65
  }
65
66
 
66
67
  .video-js {
67
- background-color: #000;
68
+ background-color: var(--udex-media-player-background-color);
68
69
  box-sizing: border-box;
69
70
  color: #fff;
70
71
  display: inline-block;
@@ -23,6 +23,7 @@
23
23
 
24
24
  :host .ui5-popup-root .ui5-popup-content {
25
25
  padding: var(--udexModalAndOverlayModalContentPaddingVertical) var(--udexModalAndOverlayModalContentPaddingHorizontal);
26
+ scrollbar-gutter: stable both-edges;
26
27
  }
27
28
 
28
29
  :host([type="basic"]) {
@@ -65,10 +65,8 @@
65
65
  }
66
66
 
67
67
  .udex-review-item__text-expander {
68
- --udex-button-padding-small: 0 3px;
69
68
  font-size: var(--udexTypographyBodySFontSize);
70
69
  font-weight: var(--udexTypographyFontWeightRegular);
71
- padding: var(--udexSpacer8, 8px) 0;
72
70
  }
73
71
 
74
72
  .udex-review-item__text {
@@ -30,6 +30,4 @@
30
30
  height: var(--udex-table-cell-icon-height);
31
31
  margin-inline-end: var(--udexSpacer4);
32
32
  color: var(--udex-table-cell-color);
33
- margin-top: 4px;
34
- margin-bottom: auto;
35
33
  }
@@ -9,6 +9,7 @@
9
9
  border-bottom-width: 1px;
10
10
  border-bottom-style: solid;
11
11
  position: relative;
12
+ word-break: break-word;
12
13
  }
13
14
 
14
15
  :host([_sticky]) {
@@ -74,7 +74,7 @@
74
74
  background: linear-gradient(var(--udex-textarea-color-label-background) 65%, var(--udex-textarea-color-standard-default-background) 35%);
75
75
  }
76
76
 
77
- :host ui5-icon {
77
+ :host [ui5-icon] {
78
78
  color: inherit;
79
79
  vertical-align: top;
80
80
  margin-inline-end: var(--udexSpacer4, 4px);
@@ -0,0 +1,17 @@
1
+ export enum TextBadgeDesign{
2
+ Error = "Error",
3
+ Info = "Info",
4
+ Success = "Success",
5
+ Warning = "Warning",
6
+ Neutral = "Neutral",
7
+ }
8
+
9
+ export enum NumberBadgeDesign{
10
+ Blue = "Blue",
11
+ Red = "Red",
12
+ White = "White",
13
+ Neutral = "Neutral",
14
+ }
15
+
16
+ export const textBadgeOptions = [TextBadgeDesign.Error, TextBadgeDesign.Info, TextBadgeDesign.Neutral, TextBadgeDesign.Success, TextBadgeDesign.Warning];
17
+ export const numberBadgeOptions = [NumberBadgeDesign.Blue, NumberBadgeDesign.Red, NumberBadgeDesign.White, NumberBadgeDesign.Neutral];
@@ -0,0 +1,6 @@
1
+ enum IconPlacement {
2
+ Start = "Start",
3
+ End = "End"
4
+ }
5
+
6
+ export default IconPlacement;
package/src/types/List.ts CHANGED
@@ -24,3 +24,12 @@ export enum AdditionalTextState {
24
24
  Error = "Error",
25
25
  Information = "Information",
26
26
  }
27
+
28
+ export interface LetterPressedHandlerObj {
29
+ getPressedKey: () => string,
30
+ setPressedKey: (arg: string) => void,
31
+ getPressedCount: () => number,
32
+ setPressedCount: (arg: number) => void,
33
+ getLastFoundPosition: () => number,
34
+ setLastFoundPosition: (arg: number) => void,
35
+ }
@@ -0,0 +1,5 @@
1
+ const isLetterKey = (key: string) => {
2
+ return /^[a-zA-Z]$/.test(key);
3
+ };
4
+
5
+ export default isLetterKey;
@@ -0,0 +1,74 @@
1
+ import { LetterPressedHandlerObj } from "../types/List.js";
2
+ import {
3
+ findFirstItemLabelStartsWithLetterKey,
4
+ findNextItemLabelStartsWithKey,
5
+ getSearchedKeyItemsCount,
6
+ } from "./listItemLabelUtils.js";
7
+
8
+ const listItemLabelStartsWithKeyFocus = (letterKey: string, items: Element[], letterKeyHandleObj: LetterPressedHandlerObj) => {
9
+ const searchedKeyItemsCount = getSearchedKeyItemsCount(letterKey, items);
10
+ const {
11
+ setLastFoundPosition,
12
+ } = letterKeyHandleObj;
13
+ if (searchedKeyItemsCount > 0) {
14
+ // updates key pressed state variables
15
+ handleKeyPress(letterKey, letterKeyHandleObj);
16
+ // obtain focus index for listItem element
17
+ const elementFocusIndex = getFocusIndexForElementItem(letterKey, items, searchedKeyItemsCount, letterKeyHandleObj);
18
+ // update searching position for next occurence
19
+ setLastFoundPosition(elementFocusIndex);
20
+ // focuses item with starting letter
21
+ focusListItem(items[elementFocusIndex]);
22
+ }
23
+ };
24
+
25
+ // updates pressed key variables for state
26
+ const handleKeyPress = (letterKey: string, letterKeyHandleObj: LetterPressedHandlerObj) => {
27
+ const {
28
+ getPressedKey, setPressedKey,
29
+ getPressedCount, setPressedCount,
30
+ setLastFoundPosition,
31
+ } = letterKeyHandleObj;
32
+ if (letterKey === getPressedKey()) {
33
+ setPressedCount(getPressedCount() + 1);
34
+ } else {
35
+ setPressedKey(letterKey);
36
+ setPressedCount(1);
37
+ setLastFoundPosition(0);
38
+ }
39
+ };
40
+
41
+ // obtains index for nextElement
42
+ const getFocusIndexForElementItem = (letterKey: string, items: Element[], searchedKeyItemsCount: number, letterKeyHandleObj: LetterPressedHandlerObj) => {
43
+ const {
44
+ getPressedCount, setPressedCount,
45
+ getLastFoundPosition,
46
+ } = letterKeyHandleObj;
47
+
48
+ let focusIndex:number;
49
+
50
+ if (getPressedCount() <= searchedKeyItemsCount) {
51
+ // while in cycle for next item
52
+ const startPosition = (getPressedCount() === 1 ? 0 : getLastFoundPosition() + 1);
53
+ focusIndex = findItemLabelWithLetterIndex(letterKey, items, startPosition) + getLastFoundPosition();
54
+ // move to next position
55
+ if (getPressedCount() !== 1) {
56
+ focusIndex += 1;
57
+ }
58
+ } else {
59
+ // start again
60
+ focusIndex = findItemLabelWithLetterIndex(letterKey, items);
61
+ setPressedCount(1);
62
+ }
63
+ return focusIndex;
64
+ };
65
+
66
+ const focusListItem = (listItem: Element) => {
67
+ (listItem as HTMLElement).focus();
68
+ };
69
+
70
+ const findItemLabelWithLetterIndex = (letterKey: string, items: Element[], startPosition = 0): number => {
71
+ return startPosition === 0 ? findFirstItemLabelStartsWithLetterKey(letterKey, items) : findNextItemLabelStartsWithKey(letterKey, items, startPosition);
72
+ };
73
+
74
+ export default listItemLabelStartsWithKeyFocus;
@@ -0,0 +1,50 @@
1
+ import UDExListItemBase from "../ListItemBase.js";
2
+
3
+ const cleanLabel = (str: string) : string => {
4
+ return str.replace(/<\/?b[^>]*>/g, "");
5
+ };
6
+
7
+ const stringLabelStartsWithLetterKey = (label: string, letterKey:string): boolean => {
8
+ return cleanLabel(label).toLowerCase().startsWith(letterKey);
9
+ };
10
+
11
+ const listBaseItemStartsWithLetterKey = (item: Element, letterKey: string): boolean => {
12
+ return stringLabelStartsWithLetterKey((item as UDExListItemBase)._state?.label as string || "", letterKey);
13
+ };
14
+
15
+ const popOverItemLabelStartsWithLetterKey = (item: Element, letterKey: string): boolean => {
16
+ return stringLabelStartsWithLetterKey((item as UDExListItemBase)?.innerText || "", letterKey);
17
+ };
18
+
19
+ const itemLabelStartsWithLetterKey = (item: Element, letterKey: string): boolean => {
20
+ return listBaseItemStartsWithLetterKey(item as UDExListItemBase, letterKey) || popOverItemLabelStartsWithLetterKey(item, letterKey);
21
+ };
22
+
23
+ const itemCanBeFocused = (item: Element, letterKey: string): boolean => {
24
+ const itemDisabled = (item as UDExListItemBase)?.disabled || false;
25
+ return !itemDisabled && itemLabelStartsWithLetterKey(item, letterKey);
26
+ };
27
+
28
+ // finds first label in list items starting with letterKey
29
+ const findFirstItemLabelStartsWithLetterKey = (letterKey: string, items: Element[]) => {
30
+ const findIndex = items.findIndex(item => itemCanBeFocused(item, letterKey));
31
+ return findIndex > -1 ? findIndex : 0;
32
+ };
33
+
34
+ const findNextItemLabelStartsWithKey = (key: string, items: Element[], start: number): number => {
35
+ return items.slice(start, items.length).findIndex(item => itemCanBeFocused(item, key));
36
+ };
37
+
38
+ // find number of item starting with letterKey
39
+ const getSearchedKeyItemsCount = (letterKey: string, items: Element[]): number => {
40
+ const searchedItemsCountArray = items.map(i => {
41
+ return itemLabelStartsWithLetterKey(i, letterKey) ? i : null;
42
+ }).filter(i => i) as Element[];
43
+ return searchedItemsCountArray.length;
44
+ };
45
+
46
+ export {
47
+ cleanLabel, stringLabelStartsWithLetterKey,
48
+ itemLabelStartsWithLetterKey, findFirstItemLabelStartsWithLetterKey,
49
+ getSearchedKeyItemsCount, findNextItemLabelStartsWithKey,
50
+ };
@@ -1 +0,0 @@
1
- const E="Zählung",T="Vorgeschlagene Suchanfragen",n="Empfohlene Seiten",e="Ungültige Eingabe",_="Warnung ausgegeben",A="Informationseintrag",S="Eintrag erfolgreich validiert",t={COUNT:E,SUGGESTED_TEXT:T,RECOMMENDED_TEXT:n,VALUE_STATE_ERROR:e,VALUE_STATE_WARNING:_,VALUE_STATE_INFORMATION:A,VALUE_STATE_SUCCESS:S};export{E as COUNT,n as RECOMMENDED_TEXT,T as SUGGESTED_TEXT,e as VALUE_STATE_ERROR,A as VALUE_STATE_INFORMATION,S as VALUE_STATE_SUCCESS,_ as VALUE_STATE_WARNING,t as default};
@@ -1 +0,0 @@
1
- const T="Count",E="of",_="Pagination page",A="Selected",S="Unselected",I="Indeterminate",t="Edit",R="Delete",O="Primary",N="Secondary",n="Tertiary",o="Warning",L="Positive",s="Negative",e="Emphasized",c="Default",C="Transparent",U="Attention",P="Date Input",a="Toggled",D="First page",B="Last page",i="Previous page",r="Next page",G="Activate page number",l="Suggested searches",M="Clear",V="Search",d="Clear",u="Voice",W="Submit",g="Available Values",Y="Recommended pages",F="Expand All",p="Collapse All",m="More",X="Attention badge",H="Read more",f="Read less",y="Rating Indicator",b="Rating",h="Required",v="Total",K="Contains Multi-Selectable Items",w="Contains Selectable Items",k="Show Results",Q="Show/Hide Password Button",x="Reset",Z="Message Strip Close Button",q="Information",z="Positive",j="Warning",J="Negative",$="reviews",TT="stars",ET="Select Options",_T="Select All",AT="{0} characters remaining",ST="Field State Error",IT="Field State Warning",tT="Field State Success",RT="Field State Standard",OT="Previous Page",NT="Next Page",nT="No matches found.",oT="Breadcrumb Trail",LT="More",sT="Increase Quantity by",eT="Decrease Quantity by",cT="No data found",CT="Invalid entry",UT="Warning issued",PT="Informative entry",aT="Entry successfully validated",DT="Read only",BT="Logout",iT="Select country",rT="Overview",GT="Link Graphic",lT="Phone number",MT="Contact us",VT="Email",dT="Chat with us",uT="Quick Links",WT="Trending",gT="About SAP",YT="Site Information",FT="Or see our complete list of",pT="local country numbers",mT="Avatar",XT="Open Calendar icon",HT="Edit list item entry",fT="Delete list item entry",yT="back button label",bT="Status Badge",hT="Click to edit profile",vT="Click to open profile information",KT="Warning, potential risk with the profile",wT="There is an error with the profile",kT="Successfully verified profile",QT="Profile",xT="Dropdown trigger",ZT={COUNT:T,OF:E,PAGINATION_PAGE:_,SELECTED:A,UNSELECTED:S,INDETERMINATE:I,EDIT_BUTTON:t,DELETE_BUTTON:R,BUTTON_ARIA_TYPE_PRIMARY:O,BUTTON_ARIA_TYPE_SECONDARY:N,BUTTON_ARIA_TYPE_TERTIARY:n,BUTTON_ARIA_TYPE_WARNING:o,BUTTON_ARIA_TYPE_POSITIVE:L,BUTTON_ARIA_TYPE_NEGATIVE:s,BUTTON_ARIA_EMPHASIZED:e,BUTTON_ARIA_DEFAULT:c,BUTTON_ARIA_TRANSPARENT:C,BUTTON_ARIA_ATTENTION:U,DATEPICKER_DATE_DESCRIPTION:P,TOGGLED:a,FIRST_PAGE:D,LAST_PAGE:B,PREVIOUS_PAGE:i,NEXT_PAGE:r,ACTIVATE_PAGE:G,SUGGESTED_TEXT:l,ACCESSIBLE_NAME_RESET_ICON:M,ACCESSIBLE_NAME_SEARCH_ICON:V,TOOLTIP_RESET_BUTTON:d,TOOLTIP_VOICE_BUTTON:u,TOOLTIP_SUBMIT_BUTTON:W,AVAILABLE_VALUES:g,RECOMMENDED_TEXT:Y,EXPAND_ALL:F,COLLAPSE_ALL:p,MORE:m,ATTENTION_BADGE:X,READ_MORE:H,READ_LESS:f,RATING_INDICATOR_TEXT:y,RATING_INDICATOR_TOOLTIP_TEXT:b,RATING_INDICATOR_ARIA_DESCRIPTION:h,TOTAL:v,ARIA_LABEL_LIST_MULTISELECTABLE:K,ARIA_LABEL_LIST_SELECTABLE:w,SHOW_RESULTS:k,SHOW_HIDE_PASSWORD:Q,RESET:x,MESSAGE_STRIP_CLOSE_BUTTON:Z,MESSAGE_STRIP_INFORMATION:q,MESSAGE_STRIP_SUCCESS:z,MESSAGE_STRIP_WARNING:j,MESSAGE_STRIP_ERROR:J,REVIEWS:$,STARS:TT,SELECT_OPTIONS:ET,SELECT_ALL:_T,TEXTAREA_CHARACTERS_LEFT:AT,VALUE_STATE_TYPE_ERROR:ST,VALUE_STATE_TYPE_WARNING:IT,VALUE_STATE_TYPE_SUCCESS:tT,VALUE_STATE_TYPE_STANDARD:RT,CAROUSEL_PREVIOUS_ARROW_TEXT:OT,CAROUSEL_NEXT_ARROW_TEXT:NT,NO_MATCHES_FOUND:nT,BREADCRUMBS_ARIA_LABEL:oT,BREADCRUMBS_OVERFLOW_ARIA_LABEL:LT,STEPINPUT_INC_ICON_TITLE:sT,STEPINPUT_DEC_ICON_TITLE:eT,TABLE_NO_DATA_FOUND:cT,VALUE_STATE_ERROR:CT,VALUE_STATE_WARNING:UT,VALUE_STATE_INFORMATION:PT,VALUE_STATE_SUCCESS:aT,READ_ONLY:DT,LOGOUT:BT,COUNTRY_SELECT:iT,OVERVIEW:rT,SOCIAL_LINK_ICON:GT,PHONE_NUMBER:lT,CONTACT_US:MT,EMAIL:VT,CHAT_WITH_US:dT,QUICK_LINKS:uT,TRENDING:WT,ABOUT_SAP:gT,SITE_INFORMATION:YT,SEE_COMPLETE_LIST:FT,LOCAL_COUNTRY_NAMES:pT,AVATAR_TEXT:mT,CALENDAR_ICON:XT,LIST_ITEM_EDIT_ICON:HT,LIST_ITEM_DELETE_ICON:fT,BACK_BUTTON_LABEL:yT,STATUS_BADGE_TEXT:bT,STATUS_BADGE_EDIT_TITLE:hT,STATUS_BADGE_INFORMATION_TITLE:vT,STATUS_BADGE_WARNING_TITLE:KT,STATUS_BADGE_ERROR_TITLE:wT,STATUS_BADGE_SUCCESS_TITLE:kT,PROFILE:QT,TRIGGER:xT};export{gT as ABOUT_SAP,M as ACCESSIBLE_NAME_RESET_ICON,V as ACCESSIBLE_NAME_SEARCH_ICON,G as ACTIVATE_PAGE,K as ARIA_LABEL_LIST_MULTISELECTABLE,w as ARIA_LABEL_LIST_SELECTABLE,X as ATTENTION_BADGE,g as AVAILABLE_VALUES,mT as AVATAR_TEXT,yT as BACK_BUTTON_LABEL,oT as BREADCRUMBS_ARIA_LABEL,LT as BREADCRUMBS_OVERFLOW_ARIA_LABEL,U as BUTTON_ARIA_ATTENTION,c as BUTTON_ARIA_DEFAULT,e as BUTTON_ARIA_EMPHASIZED,C as BUTTON_ARIA_TRANSPARENT,s as BUTTON_ARIA_TYPE_NEGATIVE,L as BUTTON_ARIA_TYPE_POSITIVE,O as BUTTON_ARIA_TYPE_PRIMARY,N as BUTTON_ARIA_TYPE_SECONDARY,n as BUTTON_ARIA_TYPE_TERTIARY,o as BUTTON_ARIA_TYPE_WARNING,XT as CALENDAR_ICON,NT as CAROUSEL_NEXT_ARROW_TEXT,OT as CAROUSEL_PREVIOUS_ARROW_TEXT,dT as CHAT_WITH_US,p as COLLAPSE_ALL,MT as CONTACT_US,T as COUNT,iT as COUNTRY_SELECT,P as DATEPICKER_DATE_DESCRIPTION,R as DELETE_BUTTON,t as EDIT_BUTTON,VT as EMAIL,F as EXPAND_ALL,D as FIRST_PAGE,I as INDETERMINATE,B as LAST_PAGE,fT as LIST_ITEM_DELETE_ICON,HT as LIST_ITEM_EDIT_ICON,pT as LOCAL_COUNTRY_NAMES,BT as LOGOUT,Z as MESSAGE_STRIP_CLOSE_BUTTON,J as MESSAGE_STRIP_ERROR,q as MESSAGE_STRIP_INFORMATION,z as MESSAGE_STRIP_SUCCESS,j as MESSAGE_STRIP_WARNING,m as MORE,r as NEXT_PAGE,nT as NO_MATCHES_FOUND,E as OF,rT as OVERVIEW,_ as PAGINATION_PAGE,lT as PHONE_NUMBER,i as PREVIOUS_PAGE,QT as PROFILE,uT as QUICK_LINKS,h as RATING_INDICATOR_ARIA_DESCRIPTION,y as RATING_INDICATOR_TEXT,b as RATING_INDICATOR_TOOLTIP_TEXT,f as READ_LESS,H as READ_MORE,DT as READ_ONLY,Y as RECOMMENDED_TEXT,x as RESET,$ as REVIEWS,FT as SEE_COMPLETE_LIST,A as SELECTED,_T as SELECT_ALL,ET as SELECT_OPTIONS,Q as SHOW_HIDE_PASSWORD,k as SHOW_RESULTS,YT as SITE_INFORMATION,GT as SOCIAL_LINK_ICON,TT as STARS,hT as STATUS_BADGE_EDIT_TITLE,wT as STATUS_BADGE_ERROR_TITLE,vT as STATUS_BADGE_INFORMATION_TITLE,kT as STATUS_BADGE_SUCCESS_TITLE,bT as STATUS_BADGE_TEXT,KT as STATUS_BADGE_WARNING_TITLE,eT as STEPINPUT_DEC_ICON_TITLE,sT as STEPINPUT_INC_ICON_TITLE,l as SUGGESTED_TEXT,cT as TABLE_NO_DATA_FOUND,AT as TEXTAREA_CHARACTERS_LEFT,a as TOGGLED,d as TOOLTIP_RESET_BUTTON,W as TOOLTIP_SUBMIT_BUTTON,u as TOOLTIP_VOICE_BUTTON,v as TOTAL,WT as TRENDING,xT as TRIGGER,S as UNSELECTED,CT as VALUE_STATE_ERROR,PT as VALUE_STATE_INFORMATION,aT as VALUE_STATE_SUCCESS,ST as VALUE_STATE_TYPE_ERROR,RT as VALUE_STATE_TYPE_STANDARD,tT as VALUE_STATE_TYPE_SUCCESS,IT as VALUE_STATE_TYPE_WARNING,UT as VALUE_STATE_WARNING,ZT as default};
@@ -1 +0,0 @@
1
- const E="Cuenta",T="Búsquedas sugeridas",a="Páginas recomendadas",A="Entrada no válida",_="Advertencia enviada",n="Entrada informativa",s="Entrada validada correctamente",t={COUNT:E,SUGGESTED_TEXT:T,RECOMMENDED_TEXT:a,VALUE_STATE_ERROR:A,VALUE_STATE_WARNING:_,VALUE_STATE_INFORMATION:n,VALUE_STATE_SUCCESS:s};export{E as COUNT,a as RECOMMENDED_TEXT,T as SUGGESTED_TEXT,A as VALUE_STATE_ERROR,n as VALUE_STATE_INFORMATION,s as VALUE_STATE_SUCCESS,_ as VALUE_STATE_WARNING,t as default};
@@ -1 +0,0 @@
1
- const E="Comte",T="Recherches suggérées",e="Pages recommandées",A="Entrée non valide",_="Avertissement édité",t="Entrée pour information",n="Entrée validée correctement",s={COUNT:E,SUGGESTED_TEXT:T,RECOMMENDED_TEXT:e,VALUE_STATE_ERROR:A,VALUE_STATE_WARNING:_,VALUE_STATE_INFORMATION:t,VALUE_STATE_SUCCESS:n};export{E as COUNT,e as RECOMMENDED_TEXT,T as SUGGESTED_TEXT,A as VALUE_STATE_ERROR,t as VALUE_STATE_INFORMATION,n as VALUE_STATE_SUCCESS,_ as VALUE_STATE_WARNING,s as default};