@sapudex/web-components 2.4.0 → 2.4.2

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 (147) hide show
  1. package/dist/AssetsVariables.js +6 -1
  2. package/dist/AssetsVariables.js.map +1 -1
  3. package/dist/MastheadCountrySelector.d.ts +9 -0
  4. package/dist/MastheadCountrySelector.js +16 -3
  5. package/dist/MastheadCountrySelector.js.map +1 -1
  6. package/dist/MastheadItem.d.ts +21 -8
  7. package/dist/MastheadItem.js +52 -22
  8. package/dist/MastheadItem.js.map +1 -1
  9. package/dist/MastheadMenu.d.ts +3 -0
  10. package/dist/MastheadMenu.js +3 -0
  11. package/dist/MastheadMenu.js.map +1 -1
  12. package/dist/MastheadMenuItem.d.ts +1 -1
  13. package/dist/MastheadMenuItem.js +1 -1
  14. package/dist/MastheadMenuItem.js.map +1 -1
  15. package/dist/MastheadMobileMenu.d.ts +6 -0
  16. package/dist/MastheadMobileMenu.js +13 -2
  17. package/dist/MastheadMobileMenu.js.map +1 -1
  18. package/dist/MastheadProfileMenu.d.ts +4 -4
  19. package/dist/MastheadProfileMenu.js +7 -0
  20. package/dist/MastheadProfileMenu.js.map +1 -1
  21. package/dist/MastheadShell.d.ts +12 -4
  22. package/dist/MastheadShell.js +19 -10
  23. package/dist/MastheadShell.js.map +1 -1
  24. package/dist/MediaPlayer.d.ts +0 -1
  25. package/dist/MediaPlayer.js +0 -1
  26. package/dist/MediaPlayer.js.map +1 -1
  27. package/dist/MessageStripTemplate.js +1 -1
  28. package/dist/MessageStripTemplate.js.map +1 -1
  29. package/dist/SecondaryNavigation.d.ts +11 -0
  30. package/dist/SecondaryNavigation.js +11 -0
  31. package/dist/SecondaryNavigation.js.map +1 -1
  32. package/dist/assets/{InputSuggestions-CYW_6A8K.js → InputSuggestions-BaPMxFm1.js} +1 -1
  33. package/dist/assets/{ListItemStandardExpandableTextTemplate-BDrgWGjT.js → ListItemStandardExpandableTextTemplate-87ypSvqu.js} +1 -1
  34. package/dist/assets/{bundle.esm-DRCvw6Ji.js → bundle.esm-CoBHnkfj.js} +239 -234
  35. package/dist/assets/messagebundle_en-DXEe5nWA.js +1 -0
  36. package/dist/css/themes/Button.css +1 -1
  37. package/dist/css/themes/MastheadItem.css +1 -1
  38. package/dist/css/themes/MastheadProfileMenu.css +1 -1
  39. package/dist/css/themes/Modal.css +1 -1
  40. package/dist/css/themes/RatingIndicator.css +1 -1
  41. package/dist/css/themes/Search.css +1 -1
  42. package/dist/css/themes/Slider.css +1 -1
  43. package/dist/css/themes/TabInOverflow.css +1 -1
  44. package/dist/custom-elements-internal.json +151 -138
  45. package/dist/custom-elements.json +135 -122
  46. package/dist/generated/assets/i18n/messagebundle_en.json +1 -1
  47. package/dist/generated/i18n/i18n-defaults.d.ts +2 -1
  48. package/dist/generated/i18n/i18n-defaults.js +2 -1
  49. package/dist/generated/i18n/i18n-defaults.js.map +1 -1
  50. package/dist/generated/templates/MastheadCountrySelectorTemplate.lit.js +3 -3
  51. package/dist/generated/templates/MastheadCountrySelectorTemplate.lit.js.map +1 -1
  52. package/dist/generated/templates/MastheadItemTemplate.lit.js +6 -6
  53. package/dist/generated/templates/MastheadItemTemplate.lit.js.map +1 -1
  54. package/dist/generated/templates/MastheadMenuItemTemplate.lit.js +1 -1
  55. package/dist/generated/templates/MastheadMenuItemTemplate.lit.js.map +1 -1
  56. package/dist/generated/templates/MastheadMenuTemplate.lit.js +2 -2
  57. package/dist/generated/templates/MastheadMenuTemplate.lit.js.map +1 -1
  58. package/dist/generated/templates/MastheadMobileMenuTemplate.lit.js +14 -14
  59. package/dist/generated/templates/MastheadMobileMenuTemplate.lit.js.map +1 -1
  60. package/dist/generated/templates/MastheadProfileMenuTemplate.lit.js +1 -1
  61. package/dist/generated/templates/MastheadProfileMenuTemplate.lit.js.map +1 -1
  62. package/dist/generated/templates/MastheadShellTemplate.lit.js +2 -2
  63. package/dist/generated/templates/MastheadShellTemplate.lit.js.map +1 -1
  64. package/dist/generated/templates/SecondaryNavigationTemplate.lit.js +1 -1
  65. package/dist/generated/templates/SecondaryNavigationTemplate.lit.js.map +1 -1
  66. package/dist/generated/themes/Button.css.d.ts +1 -1
  67. package/dist/generated/themes/Button.css.js +1 -1
  68. package/dist/generated/themes/Button.css.js.map +1 -1
  69. package/dist/generated/themes/MastheadItem.css.d.ts +1 -1
  70. package/dist/generated/themes/MastheadItem.css.js +1 -1
  71. package/dist/generated/themes/MastheadItem.css.js.map +1 -1
  72. package/dist/generated/themes/MastheadProfileMenu.css.d.ts +1 -1
  73. package/dist/generated/themes/MastheadProfileMenu.css.js +1 -1
  74. package/dist/generated/themes/MastheadProfileMenu.css.js.map +1 -1
  75. package/dist/generated/themes/Modal.css.d.ts +1 -1
  76. package/dist/generated/themes/Modal.css.js +1 -1
  77. package/dist/generated/themes/Modal.css.js.map +1 -1
  78. package/dist/generated/themes/RatingIndicator.css.d.ts +1 -1
  79. package/dist/generated/themes/RatingIndicator.css.js +1 -1
  80. package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
  81. package/dist/generated/themes/Search.css.d.ts +1 -1
  82. package/dist/generated/themes/Search.css.js +1 -1
  83. package/dist/generated/themes/Search.css.js.map +1 -1
  84. package/dist/generated/themes/Slider.css.d.ts +1 -1
  85. package/dist/generated/themes/Slider.css.js +1 -1
  86. package/dist/generated/themes/Slider.css.js.map +1 -1
  87. package/dist/generated/themes/TabInOverflow.css.d.ts +1 -1
  88. package/dist/generated/themes/TabInOverflow.css.js +1 -1
  89. package/dist/generated/themes/TabInOverflow.css.js.map +1 -1
  90. package/dist/messagebundle.properties +3 -0
  91. package/dist/messagebundle_en.properties +1 -0
  92. package/dist/types/AnalyticsName.d.ts +5 -0
  93. package/dist/types/AnalyticsName.js +7 -0
  94. package/dist/types/AnalyticsName.js.map +1 -0
  95. package/dist/types/EventRibbon.d.ts +38 -13
  96. package/dist/types/EventRibbon.js +39 -12
  97. package/dist/types/EventRibbon.js.map +1 -1
  98. package/dist/vscode.html-custom-data.json +6 -25
  99. package/dist/web-types.json +13 -15
  100. package/package.json +1 -1
  101. package/src/AssetsVariables.ts +6 -1
  102. package/src/MastheadCountrySelector.hbs +3 -0
  103. package/src/MastheadCountrySelector.ts +24 -4
  104. package/src/MastheadItem.hbs +22 -14
  105. package/src/MastheadItem.ts +71 -26
  106. package/src/MastheadMenu.hbs +6 -1
  107. package/src/MastheadMenu.ts +5 -0
  108. package/src/MastheadMenuItem.hbs +1 -1
  109. package/src/MastheadMenuItem.ts +2 -2
  110. package/src/MastheadMobileMenu.hbs +24 -9
  111. package/src/MastheadMobileMenu.ts +19 -3
  112. package/src/MastheadProfileMenu.hbs +2 -0
  113. package/src/MastheadProfileMenu.ts +11 -5
  114. package/src/MastheadShell.hbs +2 -0
  115. package/src/MastheadShell.ts +31 -14
  116. package/src/MediaPlayer.ts +0 -1
  117. package/src/MessageStripTemplate.tsx +1 -0
  118. package/src/SecondaryNavigation.hbs +6 -1
  119. package/src/SecondaryNavigation.ts +22 -0
  120. package/src/generated/i18n/i18n-defaults.ts +2 -2
  121. package/src/generated/templates/MastheadCountrySelectorTemplate.lit.ts +3 -3
  122. package/src/generated/templates/MastheadItemTemplate.lit.ts +6 -6
  123. package/src/generated/templates/MastheadMenuItemTemplate.lit.ts +1 -1
  124. package/src/generated/templates/MastheadMenuTemplate.lit.ts +2 -2
  125. package/src/generated/templates/MastheadMobileMenuTemplate.lit.ts +14 -14
  126. package/src/generated/templates/MastheadProfileMenuTemplate.lit.ts +1 -1
  127. package/src/generated/templates/MastheadShellTemplate.lit.ts +2 -2
  128. package/src/generated/templates/SecondaryNavigationTemplate.lit.ts +1 -1
  129. package/src/generated/themes/Button.css.ts +1 -1
  130. package/src/generated/themes/MastheadItem.css.ts +1 -1
  131. package/src/generated/themes/MastheadProfileMenu.css.ts +1 -1
  132. package/src/generated/themes/Modal.css.ts +1 -1
  133. package/src/generated/themes/RatingIndicator.css.ts +1 -1
  134. package/src/generated/themes/Search.css.ts +1 -1
  135. package/src/generated/themes/Slider.css.ts +1 -1
  136. package/src/generated/themes/TabInOverflow.css.ts +1 -1
  137. package/src/i18n/messagebundle.properties +3 -0
  138. package/src/i18n/messagebundle_en.properties +1 -0
  139. package/src/themes/Button.css +1 -0
  140. package/src/themes/MastheadItem.css +15 -0
  141. package/src/themes/MastheadProfileMenu.css +2 -1
  142. package/src/themes/Modal.css +2 -2
  143. package/src/themes/Search.css +2 -1
  144. package/src/themes/TabInOverflow.css +1 -1
  145. package/src/types/AnalyticsName.ts +6 -0
  146. package/src/types/EventRibbon.ts +38 -13
  147. package/dist/assets/messagebundle_en-BK8-Eyic.js +0 -1
@@ -24,8 +24,13 @@ const variablesOverwrite = `:root {
24
24
  ${getScopedVarName("--_ui5_calendar_header_padding")}: 0;
25
25
  ${getScopedVarName("--_ui5_calendar_left_right_padding")}: 0;
26
26
  ${getScopedVarName("--_ui5_calendar_top_bottom_padding")}: 0;
27
+
28
+ /* Avatar */
29
+ [udex-avatar].dark {
30
+ ${getScopedVarName("--_ui5_avatar_outline")}: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--udexColorNeutralWhite, #FFFFFF);
31
+ }
27
32
 
28
- udex-search {
33
+ [udex-search] {
29
34
  ${getScopedVarName("--_ui5_button_pressed_focused_border_color")}: transparent;
30
35
  }
31
36
 
@@ -1 +1 @@
1
- {"version":3,"file":"AssetsVariables.js","sourceRoot":"","sources":["../src/AssetsVariables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qDAAqD,CAAC;AAEvF,MAAM,kBAAkB,GAAG;;IAEvB,gBAAgB,CAAC,mCAAmC,CAAC;;;IAGrD,gBAAgB,CAAC,2BAA2B,CAAC;;;IAG7C,gBAAgB,CAAC,0BAA0B,CAAC;;;IAG5C,gBAAgB,CAAC,sCAAsC,CAAC;IACxD,gBAAgB,CAAC,kCAAkC,CAAC;;;IAGpD,gBAAgB,CAAC,4CAA4C,CAAC;IAC9D,gBAAgB,CAAC,gCAAgC,CAAC;IAClD,gBAAgB,CAAC,wCAAwC,CAAC;IAC1D,gBAAgB,CAAC,uCAAuC,CAAC;IACzD,gBAAgB,CAAC,6CAA6C,CAAC;IAC/D,gBAAgB,CAAC,oDAAoD,CAAC;IACtE,gBAAgB,CAAC,gDAAgD,CAAC;IAClE,gBAAgB,CAAC,gCAAgC,CAAC;IAClD,gBAAgB,CAAC,oCAAoC,CAAC;IACtD,gBAAgB,CAAC,oCAAoC,CAAC;;;MAGpD,gBAAgB,CAAC,4CAA4C,CAAC;;;;;;;MAO9D,gBAAgB,CAAC,uBAAuB,CAAC;MACzC,gBAAgB,CAAC,wBAAwB,CAAC;MAC1C,gBAAgB,CAAC,oCAAoC,CAAC;MACtD,gBAAgB,CAAC,oCAAoC,CAAC;MACtD,gBAAgB,CAAC,+BAA+B,CAAC;MACjD,gBAAgB,CAAC,2CAA2C,CAAC;MAC7D,gBAAgB,CAAC,8BAA8B,CAAC;MAChD,gBAAgB,CAAC,+BAA+B,CAAC;MACjD,gBAAgB,CAAC,iCAAiC,CAAC;MACnD,gBAAgB,CAAC,uCAAuC,CAAC;MACzD,gBAAgB,CAAC,iCAAiC,CAAC;MACnD,gBAAgB,CAAC,gCAAgC,CAAC;MAClD,gBAAgB,CAAC,gCAAgC,CAAC;MAClD,gBAAgB,CAAC,+BAA+B,CAAC;MACjD,gBAAgB,CAAC,oCAAoC,CAAC;MACtD,gBAAgB,CAAC,oCAAoC,CAAC;;CAE3D,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import { getScopedVarName } from \"@ui5/webcomponents-base/dist/CustomElementsScope.js\";\n\nconst variablesOverwrite = `:root {\n /* Browser Scrollbar */\n ${getScopedVarName(\"--browser_scrollbar_border_radius\")}: var(--udexRadiusM, 8px);\n\n /* Tooltip */\n ${getScopedVarName(\"--_ui5_popover_box_shadow\")}: 0px 0px 0px 1px var(--udexColorGrey4);\n\n /* Tokenizer */\n ${getScopedVarName(\"--_ui5_tokenizer_padding\")}: var(--udexSpacer12, 12px);\n\n /* Carousel */\n ${getScopedVarName(\"--ui5_carousel_active_dot_background\")}: var(--udexColorBlue8, #0057D2);\n ${getScopedVarName(\"--ui5_carousel_active_dot_border\")}: 1px solid var(--udexColorBlue8, #0057D2);\n\n /* Calendar & Date Picker */\n ${getScopedVarName(\"--_ui5_daypicker_daynames_container_height\")}: 42px;\n ${getScopedVarName(\"--_ui5_daypicker_dayname_color\")}: var(--udexColorGrey6, #5B738B);\n ${getScopedVarName(\"--_ui5_daypicker_item_now_border_color\")}: var(--udexColorPink8, #A100C2);\n ${getScopedVarName(\"--_ui5_daypicker_item_weeekend_filter\")}: none;\n ${getScopedVarName(\"--_ui5_daypicker_item_select_between_border\")}: 1px solid var(--udexColorBlue9, #0040B0);\n ${getScopedVarName(\"--_ui5_calendar_header_middle_button_focus_outline\")}: 1px solid var(--udexColorBlue9, #0040B0);\n ${getScopedVarName(\"--_ui5_calendar_header_arrow_button_box_shadow\")}: none;\n ${getScopedVarName(\"--_ui5_calendar_header_padding\")}: 0;\n ${getScopedVarName(\"--_ui5_calendar_left_right_padding\")}: 0;\n ${getScopedVarName(\"--_ui5_calendar_top_bottom_padding\")}: 0;\n\n udex-search {\n ${getScopedVarName(\"--_ui5_button_pressed_focused_border_color\")}: transparent;\n }\n\n .sapUiSizeCompact,\n .ui5-content-density-compact,\n [data-ui5-compact-size] {\n /* Calendar & Date Picker */\n ${getScopedVarName(\"--_ui5_calendar_width\")}: 371px;\n ${getScopedVarName(\"--_ui5_calendar_height\")}: auto;\n ${getScopedVarName(\"--_ui5_calendar_top_bottom_padding\")}: var(--udexSpacer8, 8px);\n ${getScopedVarName(\"--_ui5_calendar_left_right_padding\")}: var(--udexSpacer8, 8px);\n ${getScopedVarName(\"--_ui5_calendar_header_height\")}: 42px;\n ${getScopedVarName(\"--_ui5_calendar_header_arrow_button_width\")}: 42px;\n ${getScopedVarName(\"--_ui5_day_picker_item_width\")}: 42px;\n ${getScopedVarName(\"--_ui5_day_picker_item_height\")}: 42px;\n ${getScopedVarName(\"--_ui5_daypicker_weekname_color\")}: var(--udexColorGrey6, #5B738B);\n ${getScopedVarName(\"--_ui5_daypicker_item_weeekend_filter\")}: none;\n ${getScopedVarName(\"--_ui5_month_picker_item_height\")}: 36px;\n ${getScopedVarName(\"--_ui5_monthpicker_item_margin\")}: -8px 0 var(--udexSpacer16, 16px) 0;\n ${getScopedVarName(\"--_ui5_year_picker_item_height\")}: 36px;\n ${getScopedVarName(\"--_ui5_yearpicker_item_margin\")}: -8px 0 var(--udexSpacer16, 16px) 0;\n ${getScopedVarName(\"--_ui5_calendar_left_right_padding\")}: 0;\n ${getScopedVarName(\"--_ui5_calendar_top_bottom_padding\")}: 0;\n }\n`;\n\nexport default variablesOverwrite;\n"]}
1
+ {"version":3,"file":"AssetsVariables.js","sourceRoot":"","sources":["../src/AssetsVariables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qDAAqD,CAAC;AAEvF,MAAM,kBAAkB,GAAG;;IAEvB,gBAAgB,CAAC,mCAAmC,CAAC;;;IAGrD,gBAAgB,CAAC,2BAA2B,CAAC;;;IAG7C,gBAAgB,CAAC,0BAA0B,CAAC;;;IAG5C,gBAAgB,CAAC,sCAAsC,CAAC;IACxD,gBAAgB,CAAC,kCAAkC,CAAC;;;IAGpD,gBAAgB,CAAC,4CAA4C,CAAC;IAC9D,gBAAgB,CAAC,gCAAgC,CAAC;IAClD,gBAAgB,CAAC,wCAAwC,CAAC;IAC1D,gBAAgB,CAAC,uCAAuC,CAAC;IACzD,gBAAgB,CAAC,6CAA6C,CAAC;IAC/D,gBAAgB,CAAC,oDAAoD,CAAC;IACtE,gBAAgB,CAAC,gDAAgD,CAAC;IAClE,gBAAgB,CAAC,gCAAgC,CAAC;IAClD,gBAAgB,CAAC,oCAAoC,CAAC;IACtD,gBAAgB,CAAC,oCAAoC,CAAC;;;;MAIpD,gBAAgB,CAAC,uBAAuB,CAAC;;;;MAIzC,gBAAgB,CAAC,4CAA4C,CAAC;;;;;;;MAO9D,gBAAgB,CAAC,uBAAuB,CAAC;MACzC,gBAAgB,CAAC,wBAAwB,CAAC;MAC1C,gBAAgB,CAAC,oCAAoC,CAAC;MACtD,gBAAgB,CAAC,oCAAoC,CAAC;MACtD,gBAAgB,CAAC,+BAA+B,CAAC;MACjD,gBAAgB,CAAC,2CAA2C,CAAC;MAC7D,gBAAgB,CAAC,8BAA8B,CAAC;MAChD,gBAAgB,CAAC,+BAA+B,CAAC;MACjD,gBAAgB,CAAC,iCAAiC,CAAC;MACnD,gBAAgB,CAAC,uCAAuC,CAAC;MACzD,gBAAgB,CAAC,iCAAiC,CAAC;MACnD,gBAAgB,CAAC,gCAAgC,CAAC;MAClD,gBAAgB,CAAC,gCAAgC,CAAC;MAClD,gBAAgB,CAAC,+BAA+B,CAAC;MACjD,gBAAgB,CAAC,oCAAoC,CAAC;MACtD,gBAAgB,CAAC,oCAAoC,CAAC;;CAE3D,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import { getScopedVarName } from \"@ui5/webcomponents-base/dist/CustomElementsScope.js\";\n\nconst variablesOverwrite = `:root {\n /* Browser Scrollbar */\n ${getScopedVarName(\"--browser_scrollbar_border_radius\")}: var(--udexRadiusM, 8px);\n\n /* Tooltip */\n ${getScopedVarName(\"--_ui5_popover_box_shadow\")}: 0px 0px 0px 1px var(--udexColorGrey4);\n\n /* Tokenizer */\n ${getScopedVarName(\"--_ui5_tokenizer_padding\")}: var(--udexSpacer12, 12px);\n\n /* Carousel */\n ${getScopedVarName(\"--ui5_carousel_active_dot_background\")}: var(--udexColorBlue8, #0057D2);\n ${getScopedVarName(\"--ui5_carousel_active_dot_border\")}: 1px solid var(--udexColorBlue8, #0057D2);\n\n /* Calendar & Date Picker */\n ${getScopedVarName(\"--_ui5_daypicker_daynames_container_height\")}: 42px;\n ${getScopedVarName(\"--_ui5_daypicker_dayname_color\")}: var(--udexColorGrey6, #5B738B);\n ${getScopedVarName(\"--_ui5_daypicker_item_now_border_color\")}: var(--udexColorPink8, #A100C2);\n ${getScopedVarName(\"--_ui5_daypicker_item_weeekend_filter\")}: none;\n ${getScopedVarName(\"--_ui5_daypicker_item_select_between_border\")}: 1px solid var(--udexColorBlue9, #0040B0);\n ${getScopedVarName(\"--_ui5_calendar_header_middle_button_focus_outline\")}: 1px solid var(--udexColorBlue9, #0040B0);\n ${getScopedVarName(\"--_ui5_calendar_header_arrow_button_box_shadow\")}: none;\n ${getScopedVarName(\"--_ui5_calendar_header_padding\")}: 0;\n ${getScopedVarName(\"--_ui5_calendar_left_right_padding\")}: 0;\n ${getScopedVarName(\"--_ui5_calendar_top_bottom_padding\")}: 0;\n \n /* Avatar */\n [udex-avatar].dark {\n ${getScopedVarName(\"--_ui5_avatar_outline\")}: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--udexColorNeutralWhite, #FFFFFF);\n }\n\n [udex-search] {\n ${getScopedVarName(\"--_ui5_button_pressed_focused_border_color\")}: transparent;\n }\n\n .sapUiSizeCompact,\n .ui5-content-density-compact,\n [data-ui5-compact-size] {\n /* Calendar & Date Picker */\n ${getScopedVarName(\"--_ui5_calendar_width\")}: 371px;\n ${getScopedVarName(\"--_ui5_calendar_height\")}: auto;\n ${getScopedVarName(\"--_ui5_calendar_top_bottom_padding\")}: var(--udexSpacer8, 8px);\n ${getScopedVarName(\"--_ui5_calendar_left_right_padding\")}: var(--udexSpacer8, 8px);\n ${getScopedVarName(\"--_ui5_calendar_header_height\")}: 42px;\n ${getScopedVarName(\"--_ui5_calendar_header_arrow_button_width\")}: 42px;\n ${getScopedVarName(\"--_ui5_day_picker_item_width\")}: 42px;\n ${getScopedVarName(\"--_ui5_day_picker_item_height\")}: 42px;\n ${getScopedVarName(\"--_ui5_daypicker_weekname_color\")}: var(--udexColorGrey6, #5B738B);\n ${getScopedVarName(\"--_ui5_daypicker_item_weeekend_filter\")}: none;\n ${getScopedVarName(\"--_ui5_month_picker_item_height\")}: 36px;\n ${getScopedVarName(\"--_ui5_monthpicker_item_margin\")}: -8px 0 var(--udexSpacer16, 16px) 0;\n ${getScopedVarName(\"--_ui5_year_picker_item_height\")}: 36px;\n ${getScopedVarName(\"--_ui5_yearpicker_item_margin\")}: -8px 0 var(--udexSpacer16, 16px) 0;\n ${getScopedVarName(\"--_ui5_calendar_left_right_padding\")}: 0;\n ${getScopedVarName(\"--_ui5_calendar_top_bottom_padding\")}: 0;\n }\n`;\n\nexport default variablesOverwrite;\n"]}
@@ -2,12 +2,16 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
2
2
  import "@ui5/webcomponents-icons/dist/slim-arrow-right.js";
3
3
  import UDExMastheadMenuItem from "./MastheadMenuItem.js";
4
4
  import { Mode as UDExSearchMode } from "./Search.js";
5
+ import AnalyticsName from "./types/AnalyticsName.js";
6
+ import type UDExMastheadShell from "./MastheadShell.js";
5
7
  type UDExMastheadCountrySelectorRegionClickEventDetail = {
6
8
  item: {
7
9
  title: string;
8
10
  countries: Array<Country>;
9
11
  };
10
12
  originalEvent: Event;
13
+ analyticsName: AnalyticsName;
14
+ sourceNode: HTMLElement;
11
15
  };
12
16
  type UDExMastheadCountrySelectorItemClickEventDetail = {
13
17
  item: {
@@ -16,9 +20,12 @@ type UDExMastheadCountrySelectorItemClickEventDetail = {
16
20
  url: string;
17
21
  };
18
22
  originalEvent: Event;
23
+ analyticsName: AnalyticsName;
24
+ sourceNode: HTMLElement;
19
25
  };
20
26
  type UDExMastheadCountrySelectorSearchEventDetail = {
21
27
  value: string;
28
+ analyticsName: AnalyticsName;
22
29
  };
23
30
  export type Region = {
24
31
  title: string;
@@ -153,5 +160,7 @@ declare class UDExMastheadCountrySelector extends UI5Element {
153
160
  get isRtlDirection(): boolean;
154
161
  get homeSearchMode(): UDExSearchMode;
155
162
  get isSingleMode(): boolean;
163
+ get isMobile(): boolean;
164
+ get mastheadShell(): UDExMastheadShell;
156
165
  }
157
166
  export default UDExMastheadCountrySelector;
@@ -16,6 +16,8 @@ import { isUp, isDown, isRight, isLeft, isEnd, isHome, } from "@ui5/webcomponent
16
16
  import UDExMastheadMenuItem from "./MastheadMenuItem.js";
17
17
  import UDExSearch, { Mode as UDExSearchMode } from "./Search.js";
18
18
  import MastheadCountrySelectorTemplate from "./generated/templates/MastheadCountrySelectorTemplate.lit.js";
19
+ import AnalyticsName from "./types/AnalyticsName.js";
20
+ import { BreakpointUtils } from "./utils/Breakpoints.js";
19
21
  // Styles
20
22
  import MastheadCountrySelectorCss from "./generated/themes/MastheadCountrySelector.css.js";
21
23
  /**
@@ -121,6 +123,7 @@ let UDExMastheadCountrySelector = class UDExMastheadCountrySelector extends UI5E
121
123
  this._shouldFocusBackBtn = false;
122
124
  this.fireDecoratorEvent("country-selector-search", {
123
125
  value: e.detail.value,
126
+ analyticsName: AnalyticsName.Header,
124
127
  });
125
128
  this.refreshRendering();
126
129
  }
@@ -152,7 +155,7 @@ let UDExMastheadCountrySelector = class UDExMastheadCountrySelector extends UI5E
152
155
  }
153
156
  handleOutsideClick() {
154
157
  document.addEventListener("mousedown", (e) => {
155
- if (e.target !== this) {
158
+ if (e.target !== this && !this.isMobile) {
156
159
  this.handleSearchReset();
157
160
  this._isActiveRegionOpen = false;
158
161
  this.setActiveRegion(null);
@@ -227,13 +230,15 @@ let UDExMastheadCountrySelector = class UDExMastheadCountrySelector extends UI5E
227
230
  regionItems[this._activeRegionIndex].focus();
228
231
  }
229
232
  fireEventRegionItemClick(e) {
230
- const { label } = e.target;
233
+ const item = e.target;
231
234
  this.fireDecoratorEvent("region-item-click", {
232
235
  item: {
233
- title: label,
236
+ title: item.label,
234
237
  countries: this._activeRegion?.countries || [],
235
238
  },
236
239
  originalEvent: e,
240
+ analyticsName: AnalyticsName.Header,
241
+ sourceNode: item.shadowRoot?.querySelector(".udex-masthead-menu-item"),
237
242
  });
238
243
  }
239
244
  fireEventCountryItemClick(e) {
@@ -246,6 +251,8 @@ let UDExMastheadCountrySelector = class UDExMastheadCountrySelector extends UI5E
246
251
  url: url || "",
247
252
  },
248
253
  originalEvent: e,
254
+ analyticsName: AnalyticsName.Header,
255
+ sourceNode: item.shadowRoot?.querySelector(".udex-masthead-menu-item"),
249
256
  });
250
257
  }
251
258
  setActiveRegion(region) {
@@ -279,6 +286,12 @@ let UDExMastheadCountrySelector = class UDExMastheadCountrySelector extends UI5E
279
286
  get isSingleMode() {
280
287
  return this.regionsData.length === 1;
281
288
  }
289
+ get isMobile() {
290
+ return BreakpointUtils.isAtMost("M") || this.mastheadShell?._isMobileMode;
291
+ }
292
+ get mastheadShell() {
293
+ return document.querySelector("[udex-masthead-shell]");
294
+ }
282
295
  };
283
296
  __decorate([
284
297
  property({ type: String })
@@ -1 +1 @@
1
- {"version":3,"file":"MastheadCountrySelector.js","sourceRoot":"","sources":["../src/MastheadCountrySelector.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,KAAK,MAAM,yDAAyD,CAAC;AAC5E,OAAO,OAAO,MAAM,iCAAiC,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,mDAAmD,CAAC;AAC3D,OAAO,EACL,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAC7C,MAAM,sCAAsC,CAAC;AAC9C,OAAO,oBAAoB,MAAM,uBAAuB,CAAC;AACzD,OAAO,UAAU,EAAE,EAAE,IAAI,IAAI,cAAc,EAAE,MAAM,aAAa,CAAC;AAEjE,OAAO,+BAA+B,MAAM,8DAA8D,CAAC;AAE3G,SAAS;AACT,OAAO,0BAA0B,MAAM,mDAAmD,CAAC;AAkC3F;;;;;;;;;;;;;;;;GAgBG;AA8BH,IAAM,2BAA2B,GAAjC,MAAM,2BAA4B,SAAQ,UAAU;IA6FlD;QACE,KAAK,EAAE,CAAC;QATR,mBAAc,GAAG,KAAK,CAAC;QAUvB,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;IAC7B,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAC3B,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAE1B,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAChC,CAAC;IACH,CAAC;IAED,UAAU;QACR,IAAI,SAAS,EAAE,EAAE,CAAC;YAChB,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED,iBAAiB,CAAC,CAAc;QAC9B,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QAC9B,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;IACnC,CAAC;IAED,aAAa,CAAC,CAAgB;QAC5B,MAAM,IAAI,GAAG,CAAC,CAAC,MAA8B,CAAC;QAE9C,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,CAAC;YACjC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;YAC3B,OAAO;QACT,CAAC;QAED,IAAI,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;YACrC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;YACtB,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;YACxB,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC;YACzB,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;YACxB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;YACtB,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QACvB,CAAC;IACH,CAAC;IAED,kBAAkB,CAAC,CAAgB;QACjC,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACtC,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;QAC9B,CAAC;QACD,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACtC,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;QAC9B,CAAC;IACH,CAAC;IAED,gBAAgB,CAAC,CAAgB;QAC/B,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACvC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;YAC9B,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED,eAAe,CAAC,CAAgB;QAC9B,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACrC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;YAC9B,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED,aAAa,CAAC,CAAgB;QAC5B,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;YACZ,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC;IACH,CAAC;IAED,eAAe,CAAC,CAAgB;QAC9B,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;YACd,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;QACxB,CAAC;IACH,CAAC;IAED,YAAY,CAAC,CAAc;QACzB,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,IAAI,EAAY,CAAC;QAEjE,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,SAAS,EAAE,CAAC;YACzD,IAAI,CAAC,kBAAkB,CAAC,EAAE,CAAC,CAAC;YAC5B,OAAO;QACT,CAAC;QAED,IAAI,CAAC,UAAU,EAAE,CAAC;YAChB,IAAI,CAAC,kBAAkB,CAAC,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC;QAC7D,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,YAAY,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACnI,CAAC;QAED,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;QACjC,IAAI,CAAC,kBAAkB,CAAC,yBAAyB,EAAE;YACjD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK;SACtB,CAAC,CAAC;QACH,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,kBAAkB,CAAC,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,SAAS,IAAI,EAAE,CAAC,CAAC,CAAC;QAClE,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAED,eAAe;QACb,IAAI,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAC7B,IAAI,CAAC,YAAY,EAAE,CAAC;QACtB,CAAC;QAED,IAAI,IAAI,CAAC,yBAAyB,EAAE,CAAC;YACnC,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;IACH,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC;IAC7C,CAAC;IAED,eAAe;QACb,MAAM,eAAe,GAAW,MAAM;aACnC,gBAAgB,CAAC,IAAI,CAAC;aACtB,gBAAgB,CAAC,WAAW,CAAC,CAAC;QACjC,IAAI,CAAC,eAAe,EAAE,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAC1B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,UAAU,GAAG,eAAe,CAAC;QACpC,CAAC;IACH,CAAC;IAED,kBAAkB;QAChB,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,CAAC,CAAQ,EAAQ,EAAE;YACxD,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,EAAE,CAAC;gBACtB,IAAI,CAAC,iBAAiB,EAAE,CAAC;gBACzB,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;gBACjC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;YAC7B,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAED,qBAAqB,CAAC,CAA8B;QAClD,MAAM,IAAI,GAAG,CAAC,CAAC,MAA8B,CAAC;QAC9C,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAClD,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;QACnC,IAAI,CAAC,kBAAkB,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;QAChD,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC;QAChC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,KAAK,CAAC;QACrC,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC;QAChC,IAAI,CAAC,yBAAyB,GAAG,KAAK,CAAC;IACzC,CAAC;IAED,aAAa;QACX,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;QACjC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QAC3B,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC;IACxC,CAAC;IAED,iBAAiB,CAAC,CAAgB;QAChC,MAAM,YAAY,GAAI,CAAC,CAAC,MAA+B,CAAC,KAAK,CAAC;QAC9D,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;QAC5C,MAAM,SAAS,GAAG,YAAY,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC;QAC1E,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QAEvC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC;QAC1C,QAAQ,CAAC,SAAS,GAAG,GAAG,CAAC;QACzB,QAAQ,CAAC,KAAK,EAAE,CAAC;IACnB,CAAC;IAED,aAAa,CAAC,CAAgB;QAC5B,MAAM,YAAY,GAAI,CAAC,CAAC,MAA+B,CAAC,KAAK,CAAC;QAC9D,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;QAC5C,MAAM,SAAS,GAAG,YAAY,GAAG,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC;QAC1E,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QAEvC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC;QAC1C,QAAQ,CAAC,SAAS,GAAG,GAAG,CAAC;QACzB,QAAQ,CAAC,KAAK,EAAE,CAAC;IACnB,CAAC;IAED,YAAY,CAAC,CAAgB;QAC3B,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;YACb,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,MAAM,YAAY,GAAI,CAAC,CAAC,MAA+B,CAAC,KAAK,CAAC;YAC9D,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;YAC5C,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;YAE3C,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC;YAC1C,QAAQ,CAAC,SAAS,GAAG,GAAG,CAAC;YACzB,QAAQ,CAAC,KAAK,EAAE,CAAC;QACnB,CAAC;IACH,CAAC;IAED,aAAa,CAAC,CAAgB;QAC5B,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;YACd,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,MAAM,YAAY,GAAI,CAAC,CAAC,MAA+B,CAAC,KAAK,CAAC;YAC9D,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YAEhC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC;YAC1C,SAAS,CAAC,SAAS,GAAG,GAAG,CAAC;YAC1B,SAAS,CAAC,KAAK,EAAE,CAAC;QACpB,CAAC;IACH,CAAC;IAED,sBAAsB;QACpB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;QAC1C,IAAI,CAAC,kBAAkB,CAAC,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;QAC5D,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC;IAClC,CAAC;IAED,YAAY;QACV,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAc,mDAAmD,CAAC,IAAI,IAAI,CAAC;QACzH,OAAO,EAAE,KAAK,EAAE,CAAC;IACnB,CAAC;IAED,kBAAkB;QAChB,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,EAAE,gBAAgB,CAAc,8CAA8C,CAAC,IAAI,EAAE,CAAC;QACzH,WAAW,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,KAAK,EAAE,CAAC;IAC/C,CAAC;IAED,wBAAwB,CAAC,CAA8B;QACrD,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,MAA8B,CAAC;QAEnD,IAAI,CAAC,kBAAkB,CAAC,mBAAmB,EAAE;YAC3C,IAAI,EAAE;gBACJ,KAAK,EAAE,KAAK;gBACZ,SAAS,EAAE,IAAI,CAAC,aAAa,EAAE,SAAS,IAAI,EAAE;aAC/C;YACD,aAAa,EAAE,CAAC;SACjB,CAAC,CAAC;IACL,CAAC;IAED,yBAAyB,CAAC,CAA8B;QACtD,MAAM,IAAI,GAAG,CAAC,CAAC,MAA8B,CAAC;QAC9C,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;QAE5B,IAAI,CAAC,kBAAkB,CAAC,oBAAoB,EAAE;YAC5C,IAAI,EAAE;gBACJ,YAAY,EAAE,KAAK;gBACnB,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,IAAI,EAAE;gBACrD,GAAG,EAAE,GAAG,IAAI,EAAE;aACf;YACD,aAAa,EAAE,CAAC;SACjB,CAAC,CAAC;IACL,CAAC;IAED,eAAe,CAAC,MAAqB;QACnC,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC;IAC9B,CAAC;IAED,kBAAkB,CAAC,SAAyB;QAC1C,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;IACpC,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACjC,IAAI,IAAI,CAAC,kBAAkB,GAAG,CAAC,IAAI,IAAI,CAAC,yBAAyB,EAAE,CAAC;gBAClE,IAAI,CAAC,SAAS,GAAG,KAAK,KAAK,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;gBAChE,OAAO;YACT,CAAC;YAED,IAAI,CAAC,SAAS,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;QAC5C,CAAC,CAAC,CAAC;IACL,CAAC;IAED,IAAI,KAAK;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,EAAE,gBAAgB,CAAuB,uCAAuC,CAAC,CAAC;QAC/G,OAAO,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACxC,CAAC;IAED,IAAI,WAAW;QACb,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAkB,CAAC,CAAC,CAAC,EAAE,CAAC;IACvE,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,UAAU,KAAK,KAAK,CAAC;IACnC,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,cAAc,CAAC,UAAU,CAAC;IACnC,CAAC;IAED,IAAI,YAAY;QACd,OAAO,IAAI,CAAC,WAAW,CAAC,MAAM,KAAK,CAAC,CAAC;IACvC,CAAC;CACF,CAAA;AAhXG;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gEACJ;AASrB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iEACH;AAStB;IADD,QAAQ,EAAE;4DACQ;AASjB;IADD,QAAQ,EAAE;gEACY;AASrB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0EACM;AAShC;IADD,QAAQ,EAAE;kEACc;AAQvB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wEACI;AAQ9B;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kEACF;AAQxB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+DACL;AAGpB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;mEACtB;AArFrB,2BAA2B;IA7BhC,aAAa,CAAC;QACb,GAAG,EAAE,gCAAgC;QACrC,QAAQ,EAAE,SAAS;QACnB,MAAM,EAAE,0BAA0B;QAClC,QAAQ,EAAE,+BAA+B;QACzC,YAAY,EAAE,CAAC,OAAO,EAAE,oBAAoB,EAAE,UAAU,CAAC;KAC1D,CAAC;IAEF;;;;OAIG;;IACF,KAAK,CAAC,mBAAmB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAE9C;;;;OAIG;;IACF,KAAK,CAAC,oBAAoB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAE/C;;;;OAIG;;IACF,KAAK,CAAC,yBAAyB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;GAE9C,2BAA2B,CA6XhC;AAED,2BAA2B,CAAC,MAAM,EAAE,CAAC;AAErC,eAAe,2BAA2B,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport UI5Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\nimport {\n isUp, isDown, isRight, isLeft, isEnd, isHome,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport UDExMastheadMenuItem from \"./MastheadMenuItem.js\";\nimport UDExSearch, { Mode as UDExSearchMode } from \"./Search.js\";\n\nimport MastheadCountrySelectorTemplate from \"./generated/templates/MastheadCountrySelectorTemplate.lit.js\";\n\n// Styles\nimport MastheadCountrySelectorCss from \"./generated/themes/MastheadCountrySelector.css.js\";\n\ntype UDExMastheadCountrySelectorRegionClickEventDetail = {\n item: {\n title: string,\n countries: Array<Country>,\n },\n originalEvent: Event,\n}\n\ntype UDExMastheadCountrySelectorItemClickEventDetail = {\n item: {\n displayTitle: string,\n countryCode: string,\n url: string,\n },\n originalEvent: Event,\n}\n\ntype UDExMastheadCountrySelectorSearchEventDetail = {\n value: string,\n}\n\nexport type Region = {\n title: string,\n countries: Array<Country>,\n};\n\nexport type Country = {\n displayTitle: string,\n countryCode: string,\n url: string,\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>masthead-country-selector</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/MastheadCountrySelector.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @public\n */\n@customElement({\n tag: \"udex-masthead-country-selector\",\n renderer: litRender,\n styles: MastheadCountrySelectorCss,\n template: MastheadCountrySelectorTemplate,\n dependencies: [UI5Icon, UDExMastheadMenuItem, UDExSearch],\n})\n\n/**\n * Fires when region item is clicked\n *\n * @public\n */\n@event(\"region-item-click\", { bubbles: true })\n\n/**\n * Fires when region item is clicked\n *\n * @public\n */\n@event(\"country-item-click\", { bubbles: true })\n\n/**\n * Fired event when the user typed to search field.\n *\n * @public\n */\n@event(\"country-selector-search\", { bubbles: true })\n\nclass UDExMastheadCountrySelector extends UI5Element {\n eventDetails!: {\n \"country-item-click\": UDExMastheadCountrySelectorItemClickEventDetail,\n \"country-selector-search\": UDExMastheadCountrySelectorSearchEventDetail,\n \"region-item-click\": UDExMastheadCountrySelectorRegionClickEventDetail\n };\n /**\n * Defines title of the regions menu\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n regionTitle!: string;\n\n /**\n * Defines title of the countries menu\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n countryTitle!: string;\n\n /**\n * Defines the object of the regions\n *\n * @default \"\"\n * @public\n */\n @property()\n regions!: string;\n\n /**\n * Defines the label of the search\n *\n * @default \"en-US\"\n * @public\n */\n @property()\n searchLabel!: string;\n\n /**\n * Defines display the voice button for the search field.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n showSearchVoiceButton!: boolean;\n\n /**\n * Defines the language voice of the search\n *\n * @default \"\"\n * @public\n */\n @property()\n languageVoice!: string;\n\n /**\n * Defines the country list of the region is opened\n *\n * @private\n */\n @property({ type: Boolean })\n _isActiveRegionOpen!: boolean;\n\n /**\n * Defines the mobile mode for component\n *\n * @private\n */\n @property({ type: Boolean })\n _isMobileMode!: boolean;\n\n /**\n * Defines direction of the component.\n *\n * @private\n */\n @property({ type: String })\n _direction!: string;\n\n @property({ type: Boolean, noAttribute: true })\n _requestRender = false;\n\n _activeRegion!: Region | null;\n _activeCountries!: Array<Country>;\n _shouldFocusBackBtn!: boolean;\n _shouldFocusRegionByIndex!: boolean;\n _activeRegionIndex!: number;\n\n constructor() {\n super();\n this._activeCountries = [];\n }\n\n onAfterRendering(): void {\n this.handleFocusItem();\n this.setTabIndexForItems();\n this.handleDirection();\n this.handleOutsideClick();\n\n if (this.isSingleMode) {\n this.handleSingleRegionMode();\n }\n }\n\n onEnterDOM(): void {\n if (isDesktop()) {\n this.setAttribute(\"desktop\", \"\");\n }\n }\n\n handleRegionClick(e: CustomEvent): void {\n this.openCountriesByRegion(e);\n this.fireEventRegionItemClick(e);\n }\n\n handleKeyDown(e: KeyboardEvent): void {\n const item = e.target as UDExMastheadMenuItem;\n\n if (item.hasAttribute(\"is-back\")) {\n this.handleBackKeyboard(e);\n return;\n }\n\n if (item.hasAttribute(\"is-nav-item\")) {\n this.handleUpArrow(e);\n this.handleDownArrow(e);\n this.handleRightArrow(e);\n this.handleLeftArrow(e);\n this.handleHomeKey(e);\n this.handleEndKey(e);\n }\n }\n\n handleBackKeyboard(e: KeyboardEvent): void {\n if (isLeft(e) && !this.isRtlDirection) {\n return this.backToRegions();\n }\n if (isRight(e) && this.isRtlDirection) {\n return this.backToRegions();\n }\n }\n\n handleRightArrow(e: KeyboardEvent): void {\n if (isRight(e) && !this.isRtlDirection) {\n this.openCountriesByRegion(e);\n this.fireEventRegionItemClick(e);\n }\n }\n\n handleLeftArrow(e: KeyboardEvent): void {\n if (isLeft(e) && this.isRtlDirection) {\n this.openCountriesByRegion(e);\n this.fireEventRegionItemClick(e);\n }\n }\n\n handleUpArrow(e: KeyboardEvent): void {\n if (isUp(e)) {\n e.preventDefault();\n this.focusPreviousItem(e);\n }\n }\n\n handleDownArrow(e: KeyboardEvent): void {\n if (isDown(e)) {\n e.preventDefault();\n this.focusNextItem(e);\n }\n }\n\n handleSearch(e: CustomEvent): void {\n const searchTerm = e.detail.value.toLowerCase().trim() as string;\n\n if (!this._activeRegion || !this._activeRegion.countries) {\n this.setActiveCountries([]);\n return;\n }\n\n if (!searchTerm) {\n this.setActiveCountries([...this._activeRegion.countries]);\n } else {\n this.setActiveCountries(this._activeRegion.countries.filter(country => country.displayTitle.toLowerCase().includes(searchTerm)));\n }\n\n this._shouldFocusBackBtn = false;\n this.fireDecoratorEvent(\"country-selector-search\", {\n value: e.detail.value,\n });\n this.refreshRendering();\n }\n\n handleSearchReset(): void {\n this.setActiveCountries([...this._activeRegion?.countries || []]);\n this.refreshRendering();\n }\n\n handleFocusItem(): void {\n if (this._shouldFocusBackBtn) {\n this.focusBackBtn();\n }\n\n if (this._shouldFocusRegionByIndex) {\n this.focusRegionByIndex();\n }\n }\n\n refreshRendering(): void {\n this._requestRender = !this._requestRender;\n }\n\n handleDirection() {\n const directionStyles: string = window\n .getComputedStyle(this)\n .getPropertyValue(\"direction\");\n if (!directionStyles) {\n this._direction = \"ltr\";\n } else {\n this._direction = directionStyles;\n }\n }\n\n handleOutsideClick(): void {\n document.addEventListener(\"mousedown\", (e: Event): void => {\n if (e.target !== this) {\n this.handleSearchReset();\n this._isActiveRegionOpen = false;\n this.setActiveRegion(null);\n }\n });\n }\n\n openCountriesByRegion(e: CustomEvent | KeyboardEvent): void {\n const item = e.target as UDExMastheadMenuItem;\n const activeRegion = this.regionsData[item.index];\n this.setActiveRegion(activeRegion);\n this.setActiveCountries(activeRegion.countries);\n this._isActiveRegionOpen = true;\n this._activeRegionIndex = item.index;\n this._shouldFocusBackBtn = true;\n this._shouldFocusRegionByIndex = false;\n }\n\n backToRegions(): void {\n this._isActiveRegionOpen = false;\n this.setActiveRegion(null);\n this._shouldFocusRegionByIndex = true;\n }\n\n focusPreviousItem(e: KeyboardEvent): void {\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const lastItemIndex = this.items.length - 1;\n const prevIndex = currentIndex - 1 < 0 ? lastItemIndex : currentIndex - 1;\n const prevItem = this.items[prevIndex];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n prevItem._tabIndex = \"0\";\n prevItem.focus();\n }\n\n focusNextItem(e: KeyboardEvent): void {\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const lastItemIndex = this.items.length - 1;\n const nextIndex = currentIndex + 1 > lastItemIndex ? 0 : currentIndex + 1;\n const nextItem = this.items[nextIndex];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n nextItem._tabIndex = \"0\";\n nextItem.focus();\n }\n\n handleEndKey(e: KeyboardEvent): void {\n if (isEnd(e)) {\n e.preventDefault();\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const lastItemIndex = this.items.length - 1;\n const lastItem = this.items[lastItemIndex];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n lastItem._tabIndex = \"0\";\n lastItem.focus();\n }\n }\n\n handleHomeKey(e: KeyboardEvent): void {\n if (isHome(e)) {\n e.preventDefault();\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const firstItem = this.items[0];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n firstItem._tabIndex = \"0\";\n firstItem.focus();\n }\n }\n\n handleSingleRegionMode(): void {\n this.setActiveRegion(this.regionsData[0]);\n this.setActiveCountries([...this.regionsData[0].countries]);\n this._isActiveRegionOpen = true;\n }\n\n focusBackBtn(): void {\n const backBtn = this.shadowRoot?.querySelector<HTMLElement>(\".udex-masthead-country-selector__region-back-item\") || null;\n backBtn?.focus();\n }\n\n focusRegionByIndex(): void {\n const regionItems = this.shadowRoot?.querySelectorAll<HTMLElement>(\".udex-masthead-country-selector__item_region\") || [];\n regionItems[this._activeRegionIndex].focus();\n }\n\n fireEventRegionItemClick(e: CustomEvent | KeyboardEvent): void {\n const { label } = e.target as UDExMastheadMenuItem;\n\n this.fireDecoratorEvent(\"region-item-click\", {\n item: {\n title: label,\n countries: this._activeRegion?.countries || [],\n },\n originalEvent: e,\n });\n }\n\n fireEventCountryItemClick(e: CustomEvent | KeyboardEvent): void {\n const item = e.target as UDExMastheadMenuItem;\n const { label, url } = item;\n\n this.fireDecoratorEvent(\"country-item-click\", {\n item: {\n displayTitle: label,\n countryCode: item.getAttribute(\"_country-code\") || \"\",\n url: url || \"\",\n },\n originalEvent: e,\n });\n }\n\n setActiveRegion(region: Region | null): void {\n this._activeRegion = region;\n }\n\n setActiveCountries(countries: Array<Country>): void {\n this._activeCountries = countries;\n }\n\n setTabIndexForItems(): void {\n this.items.forEach((item, index) => {\n if (this._activeRegionIndex > 0 && this._shouldFocusRegionByIndex) {\n item._tabIndex = index === this._activeRegionIndex ? \"0\" : \"-1\";\n return;\n }\n\n item._tabIndex = index === 0 ? \"0\" : \"-1\";\n });\n }\n\n get items(): Array<UDExMastheadMenuItem> {\n const items = this.shadowRoot?.querySelectorAll<UDExMastheadMenuItem>(\".udex-masthead-country-selector__item\");\n return items ? Array.from(items) : [];\n }\n\n get regionsData(): Array<Region> {\n return this.regions ? JSON.parse(this.regions) as Array<Region> : [];\n }\n\n get isRtlDirection(): boolean {\n return this._direction === \"rtl\";\n }\n\n get homeSearchMode(): UDExSearchMode {\n return UDExSearchMode.HomeSearch;\n }\n\n get isSingleMode(): boolean {\n return this.regionsData.length === 1;\n }\n}\n\nUDExMastheadCountrySelector.define();\n\nexport default UDExMastheadCountrySelector;\n"]}
1
+ {"version":3,"file":"MastheadCountrySelector.js","sourceRoot":"","sources":["../src/MastheadCountrySelector.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport UI5Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\nimport {\n isUp, isDown, isRight, isLeft, isEnd, isHome,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport UDExMastheadMenuItem from \"./MastheadMenuItem.js\";\nimport UDExSearch, { Mode as UDExSearchMode } from \"./Search.js\";\nimport MastheadCountrySelectorTemplate from \"./generated/templates/MastheadCountrySelectorTemplate.lit.js\";\nimport AnalyticsName from \"./types/AnalyticsName.js\";\nimport { BreakpointUtils } from \"./utils/Breakpoints.js\";\nimport type UDExMastheadShell from \"./MastheadShell.js\";\n\n// Styles\nimport MastheadCountrySelectorCss from \"./generated/themes/MastheadCountrySelector.css.js\";\n\ntype UDExMastheadCountrySelectorRegionClickEventDetail = {\n item: {\n title: string,\n countries: Array<Country>,\n },\n originalEvent: Event,\n analyticsName: AnalyticsName,\n sourceNode: HTMLElement,\n}\n\ntype UDExMastheadCountrySelectorItemClickEventDetail = {\n item: {\n displayTitle: string,\n countryCode: string,\n url: string,\n },\n originalEvent: Event,\n analyticsName: AnalyticsName,\n sourceNode: HTMLElement,\n}\n\ntype UDExMastheadCountrySelectorSearchEventDetail = {\n value: string,\n analyticsName: AnalyticsName,\n}\n\nexport type Region = {\n title: string,\n countries: Array<Country>,\n};\n\nexport type Country = {\n displayTitle: string,\n countryCode: string,\n url: string,\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>masthead-country-selector</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/MastheadCountrySelector.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @public\n */\n@customElement({\n tag: \"udex-masthead-country-selector\",\n renderer: litRender,\n styles: MastheadCountrySelectorCss,\n template: MastheadCountrySelectorTemplate,\n dependencies: [UI5Icon, UDExMastheadMenuItem, UDExSearch],\n})\n\n/**\n * Fires when region item is clicked\n *\n * @public\n */\n@event(\"region-item-click\", { bubbles: true })\n\n/**\n * Fires when region item is clicked\n *\n * @public\n */\n@event(\"country-item-click\", { bubbles: true })\n\n/**\n * Fired event when the user typed to search field.\n *\n * @public\n */\n@event(\"country-selector-search\", { bubbles: true })\n\nclass UDExMastheadCountrySelector extends UI5Element {\n eventDetails!: {\n \"country-item-click\": UDExMastheadCountrySelectorItemClickEventDetail,\n \"country-selector-search\": UDExMastheadCountrySelectorSearchEventDetail,\n \"region-item-click\": UDExMastheadCountrySelectorRegionClickEventDetail\n };\n /**\n * Defines title of the regions menu\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n regionTitle!: string;\n\n /**\n * Defines title of the countries menu\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n countryTitle!: string;\n\n /**\n * Defines the object of the regions\n *\n * @default \"\"\n * @public\n */\n @property()\n regions!: string;\n\n /**\n * Defines the label of the search\n *\n * @default \"en-US\"\n * @public\n */\n @property()\n searchLabel!: string;\n\n /**\n * Defines display the voice button for the search field.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n showSearchVoiceButton!: boolean;\n\n /**\n * Defines the language voice of the search\n *\n * @default \"\"\n * @public\n */\n @property()\n languageVoice!: string;\n\n /**\n * Defines the country list of the region is opened\n *\n * @private\n */\n @property({ type: Boolean })\n _isActiveRegionOpen!: boolean;\n\n /**\n * Defines the mobile mode for component\n *\n * @private\n */\n @property({ type: Boolean })\n _isMobileMode!: boolean;\n\n /**\n * Defines direction of the component.\n *\n * @private\n */\n @property({ type: String })\n _direction!: string;\n\n @property({ type: Boolean, noAttribute: true })\n _requestRender = false;\n\n _activeRegion!: Region | null;\n _activeCountries!: Array<Country>;\n _shouldFocusBackBtn!: boolean;\n _shouldFocusRegionByIndex!: boolean;\n _activeRegionIndex!: number;\n\n constructor() {\n super();\n this._activeCountries = [];\n }\n\n onAfterRendering(): void {\n this.handleFocusItem();\n this.setTabIndexForItems();\n this.handleDirection();\n this.handleOutsideClick();\n\n if (this.isSingleMode) {\n this.handleSingleRegionMode();\n }\n }\n\n onEnterDOM(): void {\n if (isDesktop()) {\n this.setAttribute(\"desktop\", \"\");\n }\n }\n\n handleRegionClick(e: CustomEvent): void {\n this.openCountriesByRegion(e);\n this.fireEventRegionItemClick(e);\n }\n\n handleKeyDown(e: KeyboardEvent): void {\n const item = e.target as UDExMastheadMenuItem;\n\n if (item.hasAttribute(\"is-back\")) {\n this.handleBackKeyboard(e);\n return;\n }\n\n if (item.hasAttribute(\"is-nav-item\")) {\n this.handleUpArrow(e);\n this.handleDownArrow(e);\n this.handleRightArrow(e);\n this.handleLeftArrow(e);\n this.handleHomeKey(e);\n this.handleEndKey(e);\n }\n }\n\n handleBackKeyboard(e: KeyboardEvent): void {\n if (isLeft(e) && !this.isRtlDirection) {\n return this.backToRegions();\n }\n if (isRight(e) && this.isRtlDirection) {\n return this.backToRegions();\n }\n }\n\n handleRightArrow(e: KeyboardEvent): void {\n if (isRight(e) && !this.isRtlDirection) {\n this.openCountriesByRegion(e);\n this.fireEventRegionItemClick(e);\n }\n }\n\n handleLeftArrow(e: KeyboardEvent): void {\n if (isLeft(e) && this.isRtlDirection) {\n this.openCountriesByRegion(e);\n this.fireEventRegionItemClick(e);\n }\n }\n\n handleUpArrow(e: KeyboardEvent): void {\n if (isUp(e)) {\n e.preventDefault();\n this.focusPreviousItem(e);\n }\n }\n\n handleDownArrow(e: KeyboardEvent): void {\n if (isDown(e)) {\n e.preventDefault();\n this.focusNextItem(e);\n }\n }\n\n handleSearch(e: CustomEvent): void {\n const searchTerm = e.detail.value.toLowerCase().trim() as string;\n\n if (!this._activeRegion || !this._activeRegion.countries) {\n this.setActiveCountries([]);\n return;\n }\n\n if (!searchTerm) {\n this.setActiveCountries([...this._activeRegion.countries]);\n } else {\n this.setActiveCountries(this._activeRegion.countries.filter(country => country.displayTitle.toLowerCase().includes(searchTerm)));\n }\n\n this._shouldFocusBackBtn = false;\n this.fireDecoratorEvent(\"country-selector-search\", {\n value: e.detail.value,\n analyticsName: AnalyticsName.Header,\n });\n this.refreshRendering();\n }\n\n handleSearchReset(): void {\n this.setActiveCountries([...this._activeRegion?.countries || []]);\n this.refreshRendering();\n }\n\n handleFocusItem(): void {\n if (this._shouldFocusBackBtn) {\n this.focusBackBtn();\n }\n\n if (this._shouldFocusRegionByIndex) {\n this.focusRegionByIndex();\n }\n }\n\n refreshRendering(): void {\n this._requestRender = !this._requestRender;\n }\n\n handleDirection() {\n const directionStyles: string = window\n .getComputedStyle(this)\n .getPropertyValue(\"direction\");\n if (!directionStyles) {\n this._direction = \"ltr\";\n } else {\n this._direction = directionStyles;\n }\n }\n\n handleOutsideClick(): void {\n document.addEventListener(\"mousedown\", (e: Event): void => {\n if (e.target !== this && !this.isMobile) {\n this.handleSearchReset();\n this._isActiveRegionOpen = false;\n this.setActiveRegion(null);\n }\n });\n }\n\n openCountriesByRegion(e: CustomEvent | KeyboardEvent): void {\n const item = e.target as UDExMastheadMenuItem;\n const activeRegion = this.regionsData[item.index];\n this.setActiveRegion(activeRegion);\n this.setActiveCountries(activeRegion.countries);\n this._isActiveRegionOpen = true;\n this._activeRegionIndex = item.index;\n this._shouldFocusBackBtn = true;\n this._shouldFocusRegionByIndex = false;\n }\n\n backToRegions(): void {\n this._isActiveRegionOpen = false;\n this.setActiveRegion(null);\n this._shouldFocusRegionByIndex = true;\n }\n\n focusPreviousItem(e: KeyboardEvent): void {\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const lastItemIndex = this.items.length - 1;\n const prevIndex = currentIndex - 1 < 0 ? lastItemIndex : currentIndex - 1;\n const prevItem = this.items[prevIndex];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n prevItem._tabIndex = \"0\";\n prevItem.focus();\n }\n\n focusNextItem(e: KeyboardEvent): void {\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const lastItemIndex = this.items.length - 1;\n const nextIndex = currentIndex + 1 > lastItemIndex ? 0 : currentIndex + 1;\n const nextItem = this.items[nextIndex];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n nextItem._tabIndex = \"0\";\n nextItem.focus();\n }\n\n handleEndKey(e: KeyboardEvent): void {\n if (isEnd(e)) {\n e.preventDefault();\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const lastItemIndex = this.items.length - 1;\n const lastItem = this.items[lastItemIndex];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n lastItem._tabIndex = \"0\";\n lastItem.focus();\n }\n }\n\n handleHomeKey(e: KeyboardEvent): void {\n if (isHome(e)) {\n e.preventDefault();\n const currentIndex = (e.target as UDExMastheadMenuItem).index;\n const firstItem = this.items[0];\n\n this.items[currentIndex]._tabIndex = \"-1\";\n firstItem._tabIndex = \"0\";\n firstItem.focus();\n }\n }\n\n handleSingleRegionMode(): void {\n this.setActiveRegion(this.regionsData[0]);\n this.setActiveCountries([...this.regionsData[0].countries]);\n this._isActiveRegionOpen = true;\n }\n\n focusBackBtn(): void {\n const backBtn = this.shadowRoot?.querySelector<HTMLElement>(\".udex-masthead-country-selector__region-back-item\") || null;\n backBtn?.focus();\n }\n\n focusRegionByIndex(): void {\n const regionItems = this.shadowRoot?.querySelectorAll<HTMLElement>(\".udex-masthead-country-selector__item_region\") || [];\n regionItems[this._activeRegionIndex].focus();\n }\n\n fireEventRegionItemClick(e: CustomEvent | KeyboardEvent): void {\n const item = e.target as UDExMastheadMenuItem;\n\n this.fireDecoratorEvent(\"region-item-click\", {\n item: {\n title: item.label,\n countries: this._activeRegion?.countries || [],\n },\n originalEvent: e,\n analyticsName: AnalyticsName.Header,\n sourceNode: item.shadowRoot?.querySelector(\".udex-masthead-menu-item\") as HTMLElement,\n });\n }\n\n fireEventCountryItemClick(e: CustomEvent | KeyboardEvent): void {\n const item = e.target as UDExMastheadMenuItem;\n const { label, url } = item;\n\n this.fireDecoratorEvent(\"country-item-click\", {\n item: {\n displayTitle: label,\n countryCode: item.getAttribute(\"_country-code\") || \"\",\n url: url || \"\",\n },\n originalEvent: e,\n analyticsName: AnalyticsName.Header,\n sourceNode: item.shadowRoot?.querySelector(\".udex-masthead-menu-item\") as HTMLElement,\n });\n }\n\n setActiveRegion(region: Region | null): void {\n this._activeRegion = region;\n }\n\n setActiveCountries(countries: Array<Country>): void {\n this._activeCountries = countries;\n }\n\n setTabIndexForItems(): void {\n this.items.forEach((item, index) => {\n if (this._activeRegionIndex > 0 && this._shouldFocusRegionByIndex) {\n item._tabIndex = index === this._activeRegionIndex ? \"0\" : \"-1\";\n return;\n }\n\n item._tabIndex = index === 0 ? \"0\" : \"-1\";\n });\n }\n\n get items(): Array<UDExMastheadMenuItem> {\n const items = this.shadowRoot?.querySelectorAll<UDExMastheadMenuItem>(\".udex-masthead-country-selector__item\");\n return items ? Array.from(items) : [];\n }\n\n get regionsData(): Array<Region> {\n return this.regions ? JSON.parse(this.regions) as Array<Region> : [];\n }\n\n get isRtlDirection(): boolean {\n return this._direction === \"rtl\";\n }\n\n get homeSearchMode(): UDExSearchMode {\n return UDExSearchMode.HomeSearch;\n }\n\n get isSingleMode(): boolean {\n return this.regionsData.length === 1;\n }\n\n get isMobile(): boolean {\n return BreakpointUtils.isAtMost(\"M\") || this.mastheadShell?._isMobileMode;\n }\n\n get mastheadShell(): UDExMastheadShell {\n return document.querySelector<UDExMastheadShell>(\"[udex-masthead-shell]\")!;\n }\n}\n\nUDExMastheadCountrySelector.define();\n\nexport default UDExMastheadCountrySelector;\n"]}
@@ -5,6 +5,7 @@ import type UDExAvatar from "./Avatar.js";
5
5
  import "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
6
6
  import type UDExMastheadShell from "./MastheadShell.js";
7
7
  import { UDExTarget } from "./types/common.js";
8
+ import AnalyticsName from "./types/AnalyticsName.js";
8
9
  export declare enum UDExMastheadDropdownItemAction {
9
10
  Open = "Open",
10
11
  Close = "Close",
@@ -33,10 +34,13 @@ export type MenuItem = {
33
34
  type UDExMastheadItemItemClickEventDetail = {
34
35
  originalEvent: PointerEvent;
35
36
  item: UDExMastheadItem;
37
+ analyticsName: AnalyticsName;
38
+ sourceNode: HTMLElement;
36
39
  };
37
40
  export type UDExMastheadDropdownEventDetail = {
38
41
  title: string;
39
42
  action: UDExMastheadDropdownItemAction;
43
+ analyticsName: AnalyticsName;
40
44
  };
41
45
  /**
42
46
  * @class
@@ -75,13 +79,6 @@ declare class UDExMastheadItem extends UI5Element implements IMastheadItem {
75
79
  * @public
76
80
  */
77
81
  menuTitle: string;
78
- /**
79
- * Defines the text of item.
80
- *
81
- * @public
82
- * @default ""
83
- */
84
- text: string;
85
82
  /**
86
83
  * Defines the selected item.
87
84
  *
@@ -169,6 +166,12 @@ declare class UDExMastheadItem extends UI5Element implements IMastheadItem {
169
166
  * @private
170
167
  */
171
168
  _isMobileMode: boolean;
169
+ /**
170
+ * Defines the label for analytics
171
+ *
172
+ * @public
173
+ */
174
+ label: string;
172
175
  /**
173
176
  * Slot for the dropdown
174
177
  *
@@ -183,14 +186,18 @@ declare class UDExMastheadItem extends UI5Element implements IMastheadItem {
183
186
  * @public
184
187
  */
185
188
  content?: Array<HTMLElement>;
189
+ _preventFocusOut: boolean;
186
190
  static i18nBundle: I18nBundle;
187
191
  _profileAvatar: UDExAvatar;
188
192
  _mastheadShell: UDExMastheadShell;
189
- _isEscPress: boolean;
190
193
  onEnterDOM(): void;
194
+ onBeforeRendering(): void;
191
195
  onAfterRendering(): void;
192
196
  handleOutsideClick(): void;
197
+ handleMouseDown(): void;
198
+ handleMouseUp(): void;
193
199
  handleFocusout(e: FocusEvent): void;
200
+ handleFocusOutForDropdowns(e: FocusEvent): void;
194
201
  handleKeyDown(e: KeyboardEvent): void;
195
202
  handleKeyEscape(): void;
196
203
  handleKeyEscapeMobile(): void;
@@ -206,6 +213,11 @@ declare class UDExMastheadItem extends UI5Element implements IMastheadItem {
206
213
  closeDropdown(): void;
207
214
  getDomElement(selector: string): HTMLElement | undefined | null;
208
215
  getSubItems(): Array<MenuItem>;
216
+ private isFocusOutPrevented;
217
+ private isProfileButtonTarget;
218
+ private isNavItemTarget;
219
+ private isRelatedTargetOutside;
220
+ private shouldCloseDropdown;
209
221
  get mastheadShell(): UDExMastheadShell;
210
222
  get additionalClass(): string;
211
223
  get profileAvatar(): UDExAvatar;
@@ -222,6 +234,7 @@ declare class UDExMastheadItem extends UI5Element implements IMastheadItem {
222
234
  get isExploreBtn(): boolean;
223
235
  get isCountrySelectorBtn(): boolean;
224
236
  get isCartBtn(): boolean;
237
+ get isSearchBtn(): boolean;
225
238
  get isSupportBtn(): boolean;
226
239
  get accessibleLabel(): string;
227
240
  get isMobile(): boolean;
@@ -16,13 +16,14 @@ import "@ui5/webcomponents-icons/dist/search.js";
16
16
  import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
17
17
  import { isEscape } from "@ui5/webcomponents-base/dist/Keys.js";
18
18
  import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
19
- import { OPENS_IN_A_NEW_WINDOW, PROFILE, CART, COUNTRY_SELECTOR, SUPPORT, } from "./generated/i18n/i18n-defaults.js";
19
+ import { OPENS_IN_A_NEW_WINDOW, PROFILE, CART, COUNTRY_SELECTOR, SUPPORT, SEARCH, } from "./generated/i18n/i18n-defaults.js";
20
20
  import UDExMastheadMenu from "./MastheadMenu.js";
21
21
  import "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
22
22
  import MastheadItemTemplate from "./generated/templates/MastheadItemTemplate.lit.js";
23
23
  import { UDExTarget } from "./types/common.js";
24
24
  import { BreakpointUtils } from "./utils/Breakpoints.js";
25
25
  import parseArrayFromString from "./utils/parseArrayFromString.js";
26
+ import AnalyticsName from "./types/AnalyticsName.js";
26
27
  // Styles
27
28
  import MastheadItemCss from "./generated/themes/MastheadItem.css.js";
28
29
  export var UDExMastheadDropdownItemAction;
@@ -65,13 +66,6 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
65
66
  * @public
66
67
  */
67
68
  this.menuTitle = "";
68
- /**
69
- * Defines the text of item.
70
- *
71
- * @public
72
- * @default ""
73
- */
74
- this.text = "";
75
69
  /**
76
70
  * Defines the icon in the item.
77
71
  *
@@ -98,6 +92,9 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
98
92
  this.setAttribute("desktop", "");
99
93
  }
100
94
  }
95
+ onBeforeRendering() {
96
+ this.label = this.eventItemTitle;
97
+ }
101
98
  onAfterRendering() {
102
99
  this._profileAvatar = this.profileAvatar;
103
100
  this._mastheadShell = this.mastheadShell;
@@ -106,13 +103,12 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
106
103
  this.setDropdownInsetStart();
107
104
  }
108
105
  this.handleOutsideClick();
109
- this._isEscPress = false;
110
106
  }
111
107
  handleOutsideClick() {
112
108
  document.addEventListener("click", (e) => {
113
109
  const target = e.target;
114
110
  const item = target.closest("[udex-masthead-item]");
115
- if (item !== this && !this.isMobile) {
111
+ if (item !== this && !this.isMobile && this.selected) {
116
112
  if (this.isDropdownOpened) {
117
113
  this.fireDropdownCloseEvent(this.eventItemTitle, UDExMastheadDropdownItemAction.ClickOutside);
118
114
  }
@@ -120,12 +116,22 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
120
116
  }
121
117
  });
122
118
  }
119
+ handleMouseDown() {
120
+ this._preventFocusOut = true;
121
+ }
122
+ handleMouseUp() {
123
+ this._preventFocusOut = false;
124
+ }
123
125
  handleFocusout(e) {
124
- if (e.relatedTarget === null || this._isEscPress) {
126
+ if (this.isFocusOutPrevented(e)) {
125
127
  return;
126
128
  }
127
- const eTarget = e.target;
128
- if (!this.isMobile && eTarget.getAttribute("slot") === "dropdown") {
129
+ this.handleFocusOutForDropdowns(e);
130
+ }
131
+ handleFocusOutForDropdowns(e) {
132
+ const relatedTarget = e.relatedTarget;
133
+ const target = e.target;
134
+ if (this.shouldCloseDropdown(relatedTarget, target)) {
129
135
  this.closeDropdown();
130
136
  }
131
137
  }
@@ -140,7 +146,6 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
140
146
  }
141
147
  }
142
148
  handleKeyEscape() {
143
- this._isEscPress = true;
144
149
  this.closeDropdown();
145
150
  if (this.isProfileBtn) {
146
151
  this._profileAvatar.focus();
@@ -175,15 +180,17 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
175
180
  }
176
181
  }
177
182
  fireDropdownCloseEvent(title, action) {
178
- this.fireDecoratorEvent("dropdown-closed", { title, action });
183
+ this.fireDecoratorEvent("dropdown-closed", { title, action, analyticsName: AnalyticsName.Header });
179
184
  }
180
185
  fireDropdownOpenEvent(title, action) {
181
- this.fireDecoratorEvent("dropdown-opened", { title, action });
186
+ this.fireDecoratorEvent("dropdown-opened", { title, action, analyticsName: AnalyticsName.Header });
182
187
  }
183
188
  fireItemClickEvent(e) {
184
189
  this.fireDecoratorEvent("item-click", {
185
190
  item: this,
186
191
  originalEvent: e,
192
+ analyticsName: AnalyticsName.Header,
193
+ sourceNode: e.currentTarget,
187
194
  });
188
195
  }
189
196
  setDropdownInsetStart() {
@@ -225,7 +232,7 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
225
232
  }
226
233
  closeDropdown() {
227
234
  this.selected = false;
228
- this.fireDropdownCloseEvent(this.eventItemTitle, UDExMastheadDropdownItemAction.Close);
235
+ this.fireDropdownCloseEvent(this.accessibleName || this.eventItemTitle, UDExMastheadDropdownItemAction.Close);
229
236
  }
230
237
  getDomElement(selector) {
231
238
  return this.shadowRoot?.querySelector(`${selector}`);
@@ -233,6 +240,23 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
233
240
  getSubItems() {
234
241
  return parseArrayFromString(this.subItems);
235
242
  }
243
+ isFocusOutPrevented(e) {
244
+ return this.isMobile || e.relatedTarget === null || this._preventFocusOut;
245
+ }
246
+ isProfileButtonTarget(relatedTarget) {
247
+ return (relatedTarget?.tagName === "UDEX-AVATAR" || relatedTarget?.tagName === "UDEX-MASTHEAD-ITEM") && this.isProfileBtn;
248
+ }
249
+ isNavItemTarget(target) {
250
+ return target.getAttribute("slot") === "dropdown" && !this.isProfileBtn;
251
+ }
252
+ isRelatedTargetOutside(relatedTarget) {
253
+ return relatedTarget?.closest("[udex-masthead-item]") === null;
254
+ }
255
+ shouldCloseDropdown(relatedTarget, target) {
256
+ return this.isRelatedTargetOutside(relatedTarget)
257
+ || this.isProfileButtonTarget(relatedTarget)
258
+ || this.isNavItemTarget(target);
259
+ }
236
260
  get mastheadShell() {
237
261
  return document.querySelector("[udex-masthead-shell]");
238
262
  }
@@ -293,6 +317,9 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
293
317
  get isCartBtn() {
294
318
  return this.getAttribute("slot") === "cart";
295
319
  }
320
+ get isSearchBtn() {
321
+ return this.icon === "search";
322
+ }
296
323
  get isSupportBtn() {
297
324
  return this.getAttribute("slot") === "support";
298
325
  }
@@ -309,8 +336,8 @@ let UDExMastheadItem = UDExMastheadItem_1 = class UDExMastheadItem extends UI5El
309
336
  return UDExMastheadItem_1.i18nBundle.getText(OPENS_IN_A_NEW_WINDOW);
310
337
  }
311
338
  get eventItemTitle() {
312
- if (this.accessibleName) {
313
- return this.accessibleName.trim();
339
+ if (this.isSearchBtn) {
340
+ return UDExMastheadItem_1.i18nBundle.getText(SEARCH);
314
341
  }
315
342
  if (this.isCartBtn) {
316
343
  return UDExMastheadItem_1.i18nBundle.getText(CART);
@@ -333,9 +360,6 @@ __decorate([
333
360
  __decorate([
334
361
  property({ type: String })
335
362
  ], UDExMastheadItem.prototype, "menuTitle", void 0);
336
- __decorate([
337
- property({ type: String })
338
- ], UDExMastheadItem.prototype, "text", void 0);
339
363
  __decorate([
340
364
  property({ type: Boolean })
341
365
  ], UDExMastheadItem.prototype, "selected", void 0);
@@ -375,12 +399,18 @@ __decorate([
375
399
  __decorate([
376
400
  property({ type: Boolean })
377
401
  ], UDExMastheadItem.prototype, "_isMobileMode", void 0);
402
+ __decorate([
403
+ property({ type: String })
404
+ ], UDExMastheadItem.prototype, "label", void 0);
378
405
  __decorate([
379
406
  slot({ type: HTMLElement })
380
407
  ], UDExMastheadItem.prototype, "dropdown", void 0);
381
408
  __decorate([
382
409
  slot({ type: HTMLElement, "default": true })
383
410
  ], UDExMastheadItem.prototype, "content", void 0);
411
+ __decorate([
412
+ property({ type: Boolean })
413
+ ], UDExMastheadItem.prototype, "_preventFocusOut", void 0);
384
414
  __decorate([
385
415
  i18n("@sapudex/web-components")
386
416
  ], UDExMastheadItem, "i18nBundle", void 0);