@swisspost/design-system-components 9.0.0-next.9 → 9.0.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 (466) hide show
  1. package/dist/cjs/{index-5d4e0aed.js → index-824d2b71.js} +12 -2
  2. package/dist/cjs/{index-010dc207.js → index-e1f32cce.js} +17 -30
  3. package/dist/cjs/index.cjs.js +26 -50
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/{package-8e810a59.js → package-3ed88bb9.js} +1 -1
  6. package/dist/cjs/{post-accordion-b9df8522.js → post-accordion-9ef382e8.js} +3 -3
  7. package/dist/cjs/post-accordion-item-5f685bee.js +52 -0
  8. package/dist/cjs/post-accordion-item.cjs.entry.js +4 -5
  9. package/dist/cjs/post-accordion.cjs.entry.js +3 -3
  10. package/dist/cjs/post-alert-88adc668.js +99 -0
  11. package/dist/cjs/{post-banner.cjs.entry.js → post-alert.cjs.entry.js} +5 -6
  12. package/dist/cjs/post-card-control-c6e5c427.js +272 -0
  13. package/dist/cjs/post-card-control.cjs.entry.js +3 -3
  14. package/dist/cjs/{post-collapsible-trigger-143cf84a.js → post-collapsible-trigger-1764e6dc.js} +24 -11
  15. package/dist/cjs/post-collapsible_2.cjs.entry.js +4 -7
  16. package/dist/cjs/post-components.cjs.js +2 -2
  17. package/dist/cjs/post-icon-f735da00.js +139 -0
  18. package/dist/cjs/post-icon.cjs.entry.js +16 -0
  19. package/dist/cjs/post-logo-2cd8ae98.js +39 -0
  20. package/dist/cjs/post-logo.cjs.entry.js +15 -0
  21. package/dist/cjs/post-popover-36c854a4.js +131 -0
  22. package/dist/cjs/post-popover.cjs.entry.js +3 -4
  23. package/dist/cjs/{post-togglebutton-0984a694.js → post-popovercontainer-cb4793c1.js} +148 -1106
  24. package/dist/cjs/post-popovercontainer.cjs.entry.js +11 -0
  25. package/dist/cjs/post-rating-d5073d8d.js +88 -0
  26. package/dist/cjs/post-rating.cjs.entry.js +3 -3
  27. package/dist/cjs/post-tab-header-b756d9b1.js +32 -0
  28. package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
  29. package/dist/cjs/{post-tab-panel-60f211a5.js → post-tab-panel-97b79ecd.js} +3 -3
  30. package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
  31. package/dist/cjs/{post-tabs-1f797ce4.js → post-tabs-834497f2.js} +5 -5
  32. package/dist/cjs/post-tabs.cjs.entry.js +3 -3
  33. package/dist/cjs/post-tag-c70fb945.js +47 -0
  34. package/dist/cjs/post-tag.cjs.entry.js +3 -3
  35. package/dist/cjs/post-tooltip-20ebe011.js +69 -0
  36. package/dist/cjs/{post-tooltip-38c839a4.js → post-tooltip-trigger-6f4c9748.js} +507 -557
  37. package/dist/cjs/post-tooltip-trigger.cjs.entry.js +12 -0
  38. package/dist/cjs/post-tooltip.cjs.entry.js +3 -8
  39. package/dist/collection/collection-manifest.json +4 -21
  40. package/dist/collection/components/post-accordion/post-accordion.css +1 -1
  41. package/dist/collection/components/post-accordion/post-accordion.js +2 -2
  42. package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
  43. package/dist/collection/components/post-accordion-item/post-accordion-item.js +10 -24
  44. package/dist/collection/components/post-alert/alert-types.js +1 -0
  45. package/dist/collection/components/post-alert/post-alert.css +35 -0
  46. package/dist/collection/components/{post-banner/post-banner.js → post-alert/post-alert.js} +68 -39
  47. package/dist/collection/components/post-card-control/post-card-control.css +30 -2
  48. package/dist/collection/components/post-card-control/post-card-control.js +8 -8
  49. package/dist/collection/components/post-collapsible/post-collapsible.js +2 -4
  50. package/dist/collection/components/post-icon/post-icon.css +1 -1
  51. package/dist/collection/components/post-icon/post-icon.js +52 -13
  52. package/dist/collection/components/post-logo/post-logo.js +1 -1
  53. package/dist/collection/components/post-popover/post-popover.css +30 -2
  54. package/dist/collection/components/post-popover/post-popover.js +10 -6
  55. package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +31 -1
  56. package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +180 -52
  57. package/dist/collection/components/post-rating/post-rating.css +29 -1
  58. package/dist/collection/components/post-rating/post-rating.js +1 -1
  59. package/dist/collection/components/post-tab-header/post-tab-header.css +29 -1
  60. package/dist/collection/components/post-tab-header/post-tab-header.js +1 -1
  61. package/dist/collection/components/post-tab-panel/post-tab-panel.js +1 -1
  62. package/dist/collection/components/post-tabs/post-tabs.css +1 -1
  63. package/dist/collection/components/post-tabs/post-tabs.js +2 -2
  64. package/dist/collection/components/post-tag/post-tag.css +29 -1
  65. package/dist/collection/components/post-tag/post-tag.js +2 -2
  66. package/dist/collection/components/post-tooltip/post-tooltip.css +1 -1
  67. package/dist/collection/components/post-tooltip/post-tooltip.js +60 -213
  68. package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.css +1 -0
  69. package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js +230 -0
  70. package/dist/collection/index.js +3 -20
  71. package/dist/components/index.js +3 -20
  72. package/dist/components/index2.js +1 -1
  73. package/dist/components/package.js +1 -1
  74. package/dist/components/post-accordion-item2.js +12 -30
  75. package/dist/components/post-accordion2.js +1 -1
  76. package/dist/components/{post-list.d.ts → post-alert.d.ts} +4 -4
  77. package/dist/components/post-alert.js +6 -0
  78. package/dist/components/post-alert2.js +136 -0
  79. package/dist/components/post-card-control2.js +3 -3
  80. package/dist/components/post-collapsible-trigger2.js +17 -2
  81. package/dist/components/post-collapsible2.js +3 -5
  82. package/dist/components/post-icon2.js +54 -15
  83. package/dist/components/post-logo2.js +1 -1
  84. package/dist/components/post-popover2.js +35 -8
  85. package/dist/components/post-popovercontainer2.js +136 -41
  86. package/dist/components/post-rating2.js +2 -2
  87. package/dist/components/post-tab-header2.js +2 -2
  88. package/dist/components/post-tab-panel2.js +1 -1
  89. package/dist/components/post-tabs2.js +3 -3
  90. package/dist/components/post-tag2.js +2 -2
  91. package/dist/components/{post-breadcrumb-item.d.ts → post-tooltip-trigger.d.ts} +4 -4
  92. package/dist/components/post-tooltip-trigger.js +6 -0
  93. package/dist/components/post-tooltip-trigger2.js +4968 -0
  94. package/dist/components/post-tooltip2.js +32 -4962
  95. package/dist/docs.json +401 -1776
  96. package/dist/esm/{index-b49c9904.js → index-69587a51.js} +12 -2
  97. package/dist/esm/{index-fb8d6be7.js → index-e1b64755.js} +17 -30
  98. package/dist/esm/index.js +20 -27
  99. package/dist/esm/loader.js +3 -3
  100. package/dist/esm/package-983f957d.js +3 -0
  101. package/dist/esm/{post-accordion-ee54a3ef.js → post-accordion-ad570427.js} +3 -3
  102. package/dist/esm/post-accordion-item-4db0aa2a.js +50 -0
  103. package/dist/esm/post-accordion-item.entry.js +4 -5
  104. package/dist/esm/post-accordion.entry.js +3 -3
  105. package/dist/esm/post-alert-1e9fbdfa.js +97 -0
  106. package/dist/esm/post-alert.entry.js +9 -0
  107. package/dist/esm/post-card-control-ccb189a8.js +270 -0
  108. package/dist/esm/post-card-control.entry.js +3 -3
  109. package/dist/esm/{post-collapsible-trigger-1c7833f8.js → post-collapsible-trigger-45fe328a.js} +22 -9
  110. package/dist/esm/post-collapsible_2.entry.js +4 -7
  111. package/dist/esm/post-components.js +3 -3
  112. package/dist/esm/post-icon-3fc4dd7d.js +137 -0
  113. package/dist/esm/post-icon.entry.js +8 -0
  114. package/dist/esm/post-logo-e6cdea13.js +37 -0
  115. package/dist/esm/post-logo.entry.js +7 -0
  116. package/dist/esm/post-popover-afdf4906.js +129 -0
  117. package/dist/esm/post-popover.entry.js +3 -4
  118. package/dist/esm/{post-togglebutton-395bf3f0.js → post-popovercontainer-b19b7606.js} +149 -1093
  119. package/dist/esm/post-popovercontainer.entry.js +3 -0
  120. package/dist/esm/post-rating-f60024fa.js +86 -0
  121. package/dist/esm/post-rating.entry.js +3 -3
  122. package/dist/esm/post-tab-header-333e15d5.js +30 -0
  123. package/dist/esm/post-tab-header.entry.js +3 -3
  124. package/dist/esm/{post-tab-panel-cafd9e04.js → post-tab-panel-0ddb05a2.js} +3 -3
  125. package/dist/esm/post-tab-panel.entry.js +3 -3
  126. package/dist/esm/{post-tabs-beef8eae.js → post-tabs-ab7853cf.js} +5 -5
  127. package/dist/esm/post-tabs.entry.js +3 -3
  128. package/dist/esm/post-tag-4a7d14b9.js +45 -0
  129. package/dist/esm/post-tag.entry.js +3 -3
  130. package/dist/esm/post-tooltip-c03cd719.js +67 -0
  131. package/dist/esm/{post-tooltip-b298039a.js → post-tooltip-trigger-1fefc8ad.js} +507 -557
  132. package/dist/esm/post-tooltip-trigger.entry.js +4 -0
  133. package/dist/esm/post-tooltip.entry.js +3 -8
  134. package/dist/post-components/index.esm.js +1 -1
  135. package/dist/post-components/p-0a45da5e.entry.js +1 -0
  136. package/dist/post-components/p-12e82863.entry.js +1 -0
  137. package/dist/post-components/p-1386b77d.js +1 -0
  138. package/dist/post-components/p-1528b798.js +1 -0
  139. package/dist/post-components/p-18dc1299.entry.js +1 -0
  140. package/dist/post-components/p-1a8f6c84.entry.js +1 -0
  141. package/dist/post-components/p-256453ca.js +1 -0
  142. package/dist/post-components/p-3272ebad.js +1 -0
  143. package/dist/post-components/p-3596035e.js +1 -0
  144. package/dist/post-components/p-3668f4fa.entry.js +1 -0
  145. package/dist/post-components/p-375845d4.js +1 -0
  146. package/dist/post-components/p-381de59d.entry.js +1 -0
  147. package/dist/post-components/{p-c0ae9886.js → p-3eab790d.js} +1 -1
  148. package/dist/post-components/p-4e68c514.js +1 -0
  149. package/dist/post-components/p-4eb5d9a1.entry.js +1 -0
  150. package/dist/post-components/p-61a7d216.js +1 -0
  151. package/dist/post-components/p-788e64fb.js +1 -0
  152. package/dist/post-components/p-7d5b41d1.js +1 -0
  153. package/dist/post-components/p-82ea24e7.js +1 -0
  154. package/dist/post-components/p-85c4d04f.js +1 -0
  155. package/dist/post-components/p-85c6d001.entry.js +1 -0
  156. package/dist/post-components/p-8e555dda.js +15 -0
  157. package/dist/post-components/p-962a6f36.entry.js +1 -0
  158. package/dist/post-components/p-a76c71bc.js +1 -0
  159. package/dist/post-components/p-a7e8fd41.entry.js +1 -0
  160. package/dist/post-components/p-ac216bd0.entry.js +1 -0
  161. package/dist/post-components/p-b17ecbee.entry.js +1 -0
  162. package/dist/post-components/p-bb4227ad.entry.js +1 -0
  163. package/dist/post-components/p-bc294d0b.js +1 -0
  164. package/dist/post-components/p-d0b3c5d3.entry.js +1 -0
  165. package/dist/post-components/p-d4e148d8.entry.js +1 -0
  166. package/dist/post-components/p-d9809281.js +1 -0
  167. package/dist/post-components/p-eb1e7a49.js +1 -0
  168. package/dist/post-components/p-f35291d5.entry.js +1 -0
  169. package/dist/post-components/p-fc3bfe08.js +1 -0
  170. package/dist/post-components/post-components.esm.js +1 -1
  171. package/dist/types/components/post-accordion/post-accordion.d.ts +1 -1
  172. package/dist/types/components/post-accordion-item/post-accordion-item.d.ts +1 -7
  173. package/dist/types/components/post-alert/alert-types.d.ts +2 -0
  174. package/dist/types/components/post-alert/post-alert.d.ts +54 -0
  175. package/dist/types/components/post-card-control/post-card-control.d.ts +7 -7
  176. package/dist/types/components/post-icon/post-icon.d.ts +1 -1
  177. package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +31 -13
  178. package/dist/types/components/post-tag/post-tag.d.ts +1 -1
  179. package/dist/types/components/post-tooltip/post-tooltip.d.ts +20 -34
  180. package/dist/types/components/post-tooltip-trigger/post-tooltip-trigger.d.ts +47 -0
  181. package/dist/types/components.d.ts +124 -590
  182. package/dist/types/index.d.ts +3 -20
  183. package/loaders/index.d.ts +4 -38
  184. package/loaders/index.js +4 -21
  185. package/loaders/index2.js +1 -1
  186. package/loaders/package.js +1 -1
  187. package/loaders/post-accordion-item.js +82 -1
  188. package/loaders/post-accordion.js +1 -1
  189. package/loaders/{post-list.d.ts → post-alert.d.ts} +4 -4
  190. package/loaders/post-alert.js +139 -0
  191. package/loaders/post-card-control.js +3 -3
  192. package/loaders/post-collapsible-trigger2.js +17 -2
  193. package/loaders/post-collapsible2.js +3 -5
  194. package/loaders/post-icon2.js +54 -15
  195. package/loaders/post-logo.js +2 -2
  196. package/loaders/post-popover.js +35 -8
  197. package/loaders/post-popovercontainer2.js +136 -41
  198. package/loaders/post-rating.js +2 -2
  199. package/loaders/post-tab-header.js +2 -2
  200. package/loaders/post-tab-panel.js +1 -1
  201. package/loaders/post-tabs.js +3 -3
  202. package/loaders/post-tag.js +2 -2
  203. package/loaders/{post-avatar.d.ts → post-tooltip-trigger.d.ts} +4 -4
  204. package/loaders/post-tooltip-trigger.js +4971 -0
  205. package/loaders/post-tooltip.js +32 -4962
  206. package/package.json +6 -9
  207. package/dist/cjs/attribute-observer-10f08c04.js +0 -27
  208. package/dist/cjs/check-url-3ffdd2fb.js +0 -14
  209. package/dist/cjs/debounce-1151afe3.js +0 -12
  210. package/dist/cjs/get-root-7a3498ef.js +0 -11
  211. package/dist/cjs/post-accordion-item-ecc6749f.js +0 -63
  212. package/dist/cjs/post-avatar-f7236084.js +0 -148
  213. package/dist/cjs/post-avatar.cjs.entry.js +0 -13
  214. package/dist/cjs/post-back-to-top-60762f8e.js +0 -75
  215. package/dist/cjs/post-back-to-top.cjs.entry.js +0 -15
  216. package/dist/cjs/post-banner-9662f22c.js +0 -90
  217. package/dist/cjs/post-breadcrumb-b40732fc.js +0 -111
  218. package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +0 -17
  219. package/dist/cjs/post-breadcrumb.cjs.entry.js +0 -13
  220. package/dist/cjs/post-card-control-039c9a4b.js +0 -272
  221. package/dist/cjs/post-closebutton_15.cjs.entry.js +0 -33
  222. package/dist/cjs/post-footer-5f7fdf96.js +0 -84
  223. package/dist/cjs/post-footer.cjs.entry.js +0 -11
  224. package/dist/cjs/post-menu-item-bb0b0b9e.js +0 -74
  225. package/dist/cjs/post-popover-d0ce9dc6.js +0 -104
  226. package/dist/cjs/post-rating-1082197c.js +0 -88
  227. package/dist/cjs/post-tab-header-4b6d8d54.js +0 -32
  228. package/dist/cjs/post-tag-ddaaaedc.js +0 -47
  229. package/dist/cjs/slide-5d51abe8.js +0 -28
  230. package/dist/collection/animations/slide.js +0 -23
  231. package/dist/collection/components/post-avatar/post-avatar.css +0 -3
  232. package/dist/collection/components/post-avatar/post-avatar.js +0 -237
  233. package/dist/collection/components/post-back-to-top/post-back-to-top.css +0 -1
  234. package/dist/collection/components/post-back-to-top/post-back-to-top.js +0 -107
  235. package/dist/collection/components/post-banner/banner-types.js +0 -1
  236. package/dist/collection/components/post-banner/post-banner.css +0 -3
  237. package/dist/collection/components/post-breadcrumb/post-breadcrumb.css +0 -3
  238. package/dist/collection/components/post-breadcrumb/post-breadcrumb.js +0 -161
  239. package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.css +0 -1
  240. package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +0 -93
  241. package/dist/collection/components/post-closebutton/post-closebutton.js +0 -12
  242. package/dist/collection/components/post-footer/post-footer.css +0 -1
  243. package/dist/collection/components/post-footer/post-footer.js +0 -75
  244. package/dist/collection/components/post-header/post-header.css +0 -1
  245. package/dist/collection/components/post-header/post-header.js +0 -160
  246. package/dist/collection/components/post-language-option/post-language-option.css +0 -3
  247. package/dist/collection/components/post-language-option/post-language-option.js +0 -215
  248. package/dist/collection/components/post-language-switch/post-language-switch.css +0 -1
  249. package/dist/collection/components/post-language-switch/post-language-switch.js +0 -163
  250. package/dist/collection/components/post-language-switch/switch-variants.js +0 -1
  251. package/dist/collection/components/post-list/post-list.css +0 -3
  252. package/dist/collection/components/post-list/post-list.js +0 -87
  253. package/dist/collection/components/post-list-item/post-list-item.css +0 -1
  254. package/dist/collection/components/post-list-item/post-list-item.js +0 -25
  255. package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +0 -1
  256. package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +0 -52
  257. package/dist/collection/components/post-megadropdown/post-megadropdown.css +0 -1
  258. package/dist/collection/components/post-megadropdown/post-megadropdown.js +0 -151
  259. package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.css +0 -1
  260. package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +0 -104
  261. package/dist/collection/components/post-menu/post-menu.css +0 -3
  262. package/dist/collection/components/post-menu/post-menu.js +0 -280
  263. package/dist/collection/components/post-menu-item/post-menu-item.css +0 -1
  264. package/dist/collection/components/post-menu-item/post-menu-item.js +0 -20
  265. package/dist/collection/components/post-menu-trigger/post-menu-trigger.css +0 -1
  266. package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +0 -114
  267. package/dist/collection/components/post-togglebutton/post-togglebutton.css +0 -1
  268. package/dist/collection/components/post-togglebutton/post-togglebutton.js +0 -74
  269. package/dist/collection/utils/breakpoints.js +0 -46
  270. package/dist/collection/utils/is-focusable.js +0 -26
  271. package/dist/components/attribute-observer.js +0 -25
  272. package/dist/components/debounce.js +0 -10
  273. package/dist/components/get-root.js +0 -9
  274. package/dist/components/post-avatar.d.ts +0 -11
  275. package/dist/components/post-avatar.js +0 -6
  276. package/dist/components/post-avatar2.js +0 -173
  277. package/dist/components/post-back-to-top.d.ts +0 -11
  278. package/dist/components/post-back-to-top.js +0 -6
  279. package/dist/components/post-back-to-top2.js +0 -100
  280. package/dist/components/post-banner.d.ts +0 -11
  281. package/dist/components/post-banner.js +0 -6
  282. package/dist/components/post-banner2.js +0 -125
  283. package/dist/components/post-breadcrumb-item.js +0 -6
  284. package/dist/components/post-breadcrumb-item2.js +0 -82
  285. package/dist/components/post-breadcrumb.d.ts +0 -11
  286. package/dist/components/post-breadcrumb.js +0 -6
  287. package/dist/components/post-breadcrumb2.js +0 -168
  288. package/dist/components/post-closebutton.d.ts +0 -11
  289. package/dist/components/post-closebutton.js +0 -6
  290. package/dist/components/post-closebutton2.js +0 -34
  291. package/dist/components/post-footer.d.ts +0 -11
  292. package/dist/components/post-footer.js +0 -6
  293. package/dist/components/post-footer2.js +0 -124
  294. package/dist/components/post-header.d.ts +0 -11
  295. package/dist/components/post-header.js +0 -6
  296. package/dist/components/post-header2.js +0 -276
  297. package/dist/components/post-language-option.d.ts +0 -11
  298. package/dist/components/post-language-option.js +0 -6
  299. package/dist/components/post-language-option2.js +0 -94
  300. package/dist/components/post-language-switch.d.ts +0 -11
  301. package/dist/components/post-language-switch.js +0 -6
  302. package/dist/components/post-language-switch2.js +0 -146
  303. package/dist/components/post-list-item.d.ts +0 -11
  304. package/dist/components/post-list-item.js +0 -6
  305. package/dist/components/post-list-item2.js +0 -35
  306. package/dist/components/post-list.js +0 -6
  307. package/dist/components/post-list2.js +0 -53
  308. package/dist/components/post-mainnavigation.d.ts +0 -11
  309. package/dist/components/post-mainnavigation.js +0 -6
  310. package/dist/components/post-mainnavigation2.js +0 -48
  311. package/dist/components/post-megadropdown-trigger.d.ts +0 -11
  312. package/dist/components/post-megadropdown-trigger.js +0 -6
  313. package/dist/components/post-megadropdown-trigger2.js +0 -91
  314. package/dist/components/post-megadropdown.d.ts +0 -11
  315. package/dist/components/post-megadropdown.js +0 -6
  316. package/dist/components/post-megadropdown2.js +0 -93
  317. package/dist/components/post-menu-item.d.ts +0 -11
  318. package/dist/components/post-menu-item.js +0 -6
  319. package/dist/components/post-menu-item2.js +0 -33
  320. package/dist/components/post-menu-trigger.d.ts +0 -11
  321. package/dist/components/post-menu-trigger.js +0 -6
  322. package/dist/components/post-menu-trigger2.js +0 -102
  323. package/dist/components/post-menu.d.ts +0 -11
  324. package/dist/components/post-menu.js +0 -6
  325. package/dist/components/post-menu2.js +0 -203
  326. package/dist/components/post-togglebutton.d.ts +0 -11
  327. package/dist/components/post-togglebutton.js +0 -6
  328. package/dist/components/post-togglebutton2.js +0 -61
  329. package/dist/components/slide.js +0 -25
  330. package/dist/esm/attribute-observer-37fa950a.js +0 -25
  331. package/dist/esm/check-url-a974431e.js +0 -12
  332. package/dist/esm/debounce-abe98cc2.js +0 -10
  333. package/dist/esm/get-root-7af2e0d1.js +0 -9
  334. package/dist/esm/package-4d81f3c2.js +0 -3
  335. package/dist/esm/post-accordion-item-e10452dc.js +0 -61
  336. package/dist/esm/post-avatar-5572fa73.js +0 -146
  337. package/dist/esm/post-avatar.entry.js +0 -5
  338. package/dist/esm/post-back-to-top-1d823c43.js +0 -73
  339. package/dist/esm/post-back-to-top.entry.js +0 -7
  340. package/dist/esm/post-banner-78480475.js +0 -88
  341. package/dist/esm/post-banner.entry.js +0 -10
  342. package/dist/esm/post-breadcrumb-aaa77f74.js +0 -109
  343. package/dist/esm/post-breadcrumb-item_2.entry.js +0 -8
  344. package/dist/esm/post-breadcrumb.entry.js +0 -5
  345. package/dist/esm/post-card-control-862aa961.js +0 -270
  346. package/dist/esm/post-closebutton_15.entry.js +0 -11
  347. package/dist/esm/post-footer-b18875e7.js +0 -82
  348. package/dist/esm/post-footer.entry.js +0 -3
  349. package/dist/esm/post-menu-item-2906384b.js +0 -71
  350. package/dist/esm/post-popover-2432bb3f.js +0 -102
  351. package/dist/esm/post-rating-95cbdbb8.js +0 -86
  352. package/dist/esm/post-tab-header-dfea00ea.js +0 -30
  353. package/dist/esm/post-tag-a77e7af6.js +0 -45
  354. package/dist/esm/slide-3422b8a3.js +0 -25
  355. package/dist/post-components/p-0711f76d.entry.js +0 -1
  356. package/dist/post-components/p-095a06f6.entry.js +0 -1
  357. package/dist/post-components/p-0b5a5f32.js +0 -1
  358. package/dist/post-components/p-135fa60f.js +0 -1
  359. package/dist/post-components/p-18e38d8a.js +0 -1
  360. package/dist/post-components/p-2e1ec074.entry.js +0 -1
  361. package/dist/post-components/p-4202b433.entry.js +0 -1
  362. package/dist/post-components/p-45773f59.js +0 -1
  363. package/dist/post-components/p-4953de7e.js +0 -1
  364. package/dist/post-components/p-4f67c5f5.entry.js +0 -1
  365. package/dist/post-components/p-4f9746f6.js +0 -15
  366. package/dist/post-components/p-5075c672.entry.js +0 -1
  367. package/dist/post-components/p-515e0f96.js +0 -1
  368. package/dist/post-components/p-5467b223.js +0 -1
  369. package/dist/post-components/p-67036798.entry.js +0 -1
  370. package/dist/post-components/p-6adeaa6c.js +0 -1
  371. package/dist/post-components/p-6d953fb2.js +0 -1
  372. package/dist/post-components/p-6edb0ac5.js +0 -1
  373. package/dist/post-components/p-6f8f39ca.js +0 -1
  374. package/dist/post-components/p-7503a623.js +0 -1
  375. package/dist/post-components/p-761b24c7.entry.js +0 -1
  376. package/dist/post-components/p-77c4c1d2.js +0 -1
  377. package/dist/post-components/p-7cf0c2ad.js +0 -1
  378. package/dist/post-components/p-856c14d6.entry.js +0 -1
  379. package/dist/post-components/p-866bf50a.entry.js +0 -1
  380. package/dist/post-components/p-8d621781.js +0 -1
  381. package/dist/post-components/p-8fe2d72c.entry.js +0 -1
  382. package/dist/post-components/p-9ad5088f.entry.js +0 -1
  383. package/dist/post-components/p-a1d2b90e.js +0 -1
  384. package/dist/post-components/p-a521419d.entry.js +0 -1
  385. package/dist/post-components/p-aa538648.js +0 -1
  386. package/dist/post-components/p-afdbee2f.js +0 -1
  387. package/dist/post-components/p-b02817f2.entry.js +0 -1
  388. package/dist/post-components/p-b157dcba.entry.js +0 -1
  389. package/dist/post-components/p-b22656b1.js +0 -1
  390. package/dist/post-components/p-bdbd11cb.js +0 -1
  391. package/dist/post-components/p-c537e196.entry.js +0 -1
  392. package/dist/post-components/p-d4f93f2b.js +0 -1
  393. package/dist/post-components/p-dca4246a.entry.js +0 -1
  394. package/dist/post-components/p-f319b026.js +0 -1
  395. package/dist/post-components/p-f4b7b379.js +0 -1
  396. package/dist/post-components/p-fac66087.entry.js +0 -1
  397. package/dist/post-components/p-fc91cbc2.js +0 -1
  398. package/dist/types/animations/slide.d.ts +0 -2
  399. package/dist/types/components/post-avatar/post-avatar.d.ts +0 -51
  400. package/dist/types/components/post-back-to-top/post-back-to-top.d.ts +0 -19
  401. package/dist/types/components/post-banner/banner-types.d.ts +0 -2
  402. package/dist/types/components/post-banner/post-banner.d.ts +0 -49
  403. package/dist/types/components/post-breadcrumb/post-breadcrumb.d.ts +0 -30
  404. package/dist/types/components/post-breadcrumb-item/post-breadcrumb-item.d.ts +0 -16
  405. package/dist/types/components/post-closebutton/post-closebutton.d.ts +0 -7
  406. package/dist/types/components/post-footer/post-footer.d.ts +0 -23
  407. package/dist/types/components/post-header/post-header.d.ts +0 -24
  408. package/dist/types/components/post-language-option/post-language-option.d.ts +0 -45
  409. package/dist/types/components/post-language-switch/post-language-switch.d.ts +0 -31
  410. package/dist/types/components/post-language-switch/switch-variants.d.ts +0 -2
  411. package/dist/types/components/post-list/post-list.d.ts +0 -24
  412. package/dist/types/components/post-list-item/post-list-item.d.ts +0 -8
  413. package/dist/types/components/post-mainnavigation/post-mainnavigation.d.ts +0 -19
  414. package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +0 -35
  415. package/dist/types/components/post-megadropdown-trigger/post-megadropdown-trigger.d.ts +0 -25
  416. package/dist/types/components/post-menu/post-menu.d.ts +0 -48
  417. package/dist/types/components/post-menu-item/post-menu-item.d.ts +0 -4
  418. package/dist/types/components/post-menu-trigger/post-menu-trigger.d.ts +0 -27
  419. package/dist/types/components/post-togglebutton/post-togglebutton.d.ts +0 -15
  420. package/dist/types/utils/breakpoints.d.ts +0 -11
  421. package/dist/types/utils/is-focusable.d.ts +0 -1
  422. package/loaders/attribute-observer.js +0 -25
  423. package/loaders/debounce.js +0 -10
  424. package/loaders/get-root.js +0 -9
  425. package/loaders/post-accordion-item2.js +0 -102
  426. package/loaders/post-avatar.js +0 -176
  427. package/loaders/post-back-to-top.d.ts +0 -11
  428. package/loaders/post-back-to-top.js +0 -103
  429. package/loaders/post-banner.d.ts +0 -11
  430. package/loaders/post-banner.js +0 -128
  431. package/loaders/post-breadcrumb-item.d.ts +0 -11
  432. package/loaders/post-breadcrumb-item.js +0 -6
  433. package/loaders/post-breadcrumb-item2.js +0 -82
  434. package/loaders/post-breadcrumb.d.ts +0 -11
  435. package/loaders/post-breadcrumb.js +0 -171
  436. package/loaders/post-closebutton.d.ts +0 -11
  437. package/loaders/post-closebutton.js +0 -37
  438. package/loaders/post-footer.d.ts +0 -11
  439. package/loaders/post-footer.js +0 -127
  440. package/loaders/post-header.d.ts +0 -11
  441. package/loaders/post-header.js +0 -279
  442. package/loaders/post-language-option.d.ts +0 -11
  443. package/loaders/post-language-option.js +0 -97
  444. package/loaders/post-language-switch.d.ts +0 -11
  445. package/loaders/post-language-switch.js +0 -149
  446. package/loaders/post-list-item.d.ts +0 -11
  447. package/loaders/post-list-item.js +0 -38
  448. package/loaders/post-list.js +0 -56
  449. package/loaders/post-mainnavigation.d.ts +0 -11
  450. package/loaders/post-mainnavigation.js +0 -51
  451. package/loaders/post-megadropdown-trigger.d.ts +0 -11
  452. package/loaders/post-megadropdown-trigger.js +0 -94
  453. package/loaders/post-megadropdown.d.ts +0 -11
  454. package/loaders/post-megadropdown.js +0 -96
  455. package/loaders/post-menu-item.d.ts +0 -11
  456. package/loaders/post-menu-item.js +0 -6
  457. package/loaders/post-menu-item2.js +0 -33
  458. package/loaders/post-menu-trigger.d.ts +0 -11
  459. package/loaders/post-menu-trigger.js +0 -6
  460. package/loaders/post-menu-trigger2.js +0 -102
  461. package/loaders/post-menu.d.ts +0 -11
  462. package/loaders/post-menu.js +0 -6
  463. package/loaders/post-menu2.js +0 -203
  464. package/loaders/post-togglebutton.d.ts +0 -11
  465. package/loaders/post-togglebutton.js +0 -64
  466. package/loaders/slide.js +0 -25
@@ -1,1007 +1,7 @@
1
1
  'use strict';
2
2
 
3
- const index = require('./index-010dc207.js');
4
- const _package = require('./package-8e810a59.js');
5
- const slide = require('./slide-5d51abe8.js');
6
- const index$1 = require('./index-5d4e0aed.js');
7
- const checkNonEmpty = require('./check-non-empty-eeaa8f77.js');
8
- const checkType = require('./check-type-64af82a9.js');
9
- const getRoot = require('./get-root-7a3498ef.js');
10
-
11
- const PostClosebutton = class {
12
- constructor(hostRef) {
13
- index.registerInstance(this, hostRef);
14
- }
15
- render() {
16
- return (index.h(index.Host, { key: 'cb5be35247053b1227c32f7949baca51ccc31081', "data-version": _package.version }, index.h("button", { key: 'b68dc109cc7a9a99b85fc995447bc7c0b0ddc3bf', class: "btn btn-icon-close" }, index.h("post-icon", { key: '9276c885e5b48092a0a24285ec6cd4301a4fc032', "aria-hidden": "true", name: "closex" }), index.h("span", { key: '3e04657ab677186830d80b8dabe769d70b6b8e8e', class: "visually-hidden" }, index.h("slot", { key: 'c2c9e8df9f62516a1b88b1dbc3949287fbaa3991' })))));
17
- }
18
- get host() { return index.getElement(this); }
19
- };
20
-
21
- /* eslint-disable no-undefined,no-param-reassign,no-shadow */
22
-
23
- /**
24
- * Throttle execution of a function. Especially useful for rate limiting
25
- * execution of handlers on events like resize and scroll.
26
- *
27
- * @param {number} delay - A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher)
28
- * are most useful.
29
- * @param {Function} callback - A function to be executed after delay milliseconds. The `this` context and all arguments are passed through,
30
- * as-is, to `callback` when the throttled-function is executed.
31
- * @param {object} [options] - An object to configure options.
32
- * @param {boolean} [options.noTrailing] - Optional, defaults to false. If noTrailing is true, callback will only execute every `delay` milliseconds
33
- * while the throttled-function is being called. If noTrailing is false or unspecified, callback will be executed
34
- * one final time after the last throttled-function call. (After the throttled-function has not been called for
35
- * `delay` milliseconds, the internal counter is reset).
36
- * @param {boolean} [options.noLeading] - Optional, defaults to false. If noLeading is false, the first throttled-function call will execute callback
37
- * immediately. If noLeading is true, the first the callback execution will be skipped. It should be noted that
38
- * callback will never executed if both noLeading = true and noTrailing = true.
39
- * @param {boolean} [options.debounceMode] - If `debounceMode` is true (at begin), schedule `clear` to execute after `delay` ms. If `debounceMode` is
40
- * false (at end), schedule `callback` to execute after `delay` ms.
41
- *
42
- * @returns {Function} A new, throttled, function.
43
- */
44
- function throttle (delay, callback, options) {
45
- var _ref = options || {},
46
- _ref$noTrailing = _ref.noTrailing,
47
- noTrailing = _ref$noTrailing === void 0 ? false : _ref$noTrailing,
48
- _ref$noLeading = _ref.noLeading,
49
- noLeading = _ref$noLeading === void 0 ? false : _ref$noLeading,
50
- _ref$debounceMode = _ref.debounceMode,
51
- debounceMode = _ref$debounceMode === void 0 ? undefined : _ref$debounceMode;
52
- /*
53
- * After wrapper has stopped being called, this timeout ensures that
54
- * `callback` is executed at the proper times in `throttle` and `end`
55
- * debounce modes.
56
- */
57
- var timeoutID;
58
- var cancelled = false;
59
-
60
- // Keep track of the last time `callback` was executed.
61
- var lastExec = 0;
62
-
63
- // Function to clear existing timeout
64
- function clearExistingTimeout() {
65
- if (timeoutID) {
66
- clearTimeout(timeoutID);
67
- }
68
- }
69
-
70
- // Function to cancel next exec
71
- function cancel(options) {
72
- var _ref2 = options || {},
73
- _ref2$upcomingOnly = _ref2.upcomingOnly,
74
- upcomingOnly = _ref2$upcomingOnly === void 0 ? false : _ref2$upcomingOnly;
75
- clearExistingTimeout();
76
- cancelled = !upcomingOnly;
77
- }
78
-
79
- /*
80
- * The `wrapper` function encapsulates all of the throttling / debouncing
81
- * functionality and when executed will limit the rate at which `callback`
82
- * is executed.
83
- */
84
- function wrapper() {
85
- for (var _len = arguments.length, arguments_ = new Array(_len), _key = 0; _key < _len; _key++) {
86
- arguments_[_key] = arguments[_key];
87
- }
88
- var self = this;
89
- var elapsed = Date.now() - lastExec;
90
- if (cancelled) {
91
- return;
92
- }
93
-
94
- // Execute `callback` and update the `lastExec` timestamp.
95
- function exec() {
96
- lastExec = Date.now();
97
- callback.apply(self, arguments_);
98
- }
99
-
100
- /*
101
- * If `debounceMode` is true (at begin) this is used to clear the flag
102
- * to allow future `callback` executions.
103
- */
104
- function clear() {
105
- timeoutID = undefined;
106
- }
107
- if (!noLeading && debounceMode && !timeoutID) {
108
- /*
109
- * Since `wrapper` is being called for the first time and
110
- * `debounceMode` is true (at begin), execute `callback`
111
- * and noLeading != true.
112
- */
113
- exec();
114
- }
115
- clearExistingTimeout();
116
- if (debounceMode === undefined && elapsed > delay) {
117
- if (noLeading) {
118
- /*
119
- * In throttle mode with noLeading, if `delay` time has
120
- * been exceeded, update `lastExec` and schedule `callback`
121
- * to execute after `delay` ms.
122
- */
123
- lastExec = Date.now();
124
- if (!noTrailing) {
125
- timeoutID = setTimeout(debounceMode ? clear : exec, delay);
126
- }
127
- } else {
128
- /*
129
- * In throttle mode without noLeading, if `delay` time has been exceeded, execute
130
- * `callback`.
131
- */
132
- exec();
133
- }
134
- } else if (noTrailing !== true) {
135
- /*
136
- * In trailing throttle mode, since `delay` time has not been
137
- * exceeded, schedule `callback` to execute `delay` ms after most
138
- * recent execution.
139
- *
140
- * If `debounceMode` is true (at begin), schedule `clear` to execute
141
- * after `delay` ms.
142
- *
143
- * If `debounceMode` is false (at end), schedule `callback` to
144
- * execute after `delay` ms.
145
- */
146
- timeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);
147
- }
148
- }
149
- wrapper.cancel = cancel;
150
-
151
- // Return the wrapper function.
152
- return wrapper;
153
- }
154
-
155
- const postHeaderCss = "*,::before,::after{box-sizing:border-box}:host{--global-header-height:72px;--global-header-minimal-height:24px;--main-header-height:56px;--header-height:calc(var(--global-header-height) + var(--main-header-height))}@media screen and (min-width: 1024px){:host{display:block;position:sticky;inset-inline:0;inset-block-start:calc(-1*(var(--global-header-height) + var(--main-header-height) - var(--global-header-minimal-height)));box-shadow:var(--post-core-elevation-3)}}@media screen and (max-width: 1023.99px){:host{--global-header-height:64px;--main-header-height:48px}}.d-flex{display:flex}.space-between{justify-content:space-between}.global-header{background-color:#fc0;display:flex;justify-content:space-between;align-items:center;position:sticky;padding-inline:var(--post-core-dimension-4);height:var(--global-header-height);z-index:1}@media screen and (max-width: 1023.99px){.global-header{inset-block-start:0}}@media screen and (min-width: 1024px){.global-header{padding-inline-end:var(--post-core-dimension-12);top:calc((var(--global-header-height) - var(--global-header-minimal-height))*-1)}}slot[name=post-logo]{align-self:flex-end}.global-sub{display:flex;align-items:center;gap:var(--post-core-dimension-24);height:var(--global-header-height)}.align-end{align-items:flex-end}.logo{flex:1 0 auto;height:var(--global-header-height);width:var(--global-header-height);min-height:var(--global-header-minimal-height);align-self:flex-end}@media screen and (min-width: 1024px){.logo{height:calc(var(--global-header-height) - var(--header-scroll-top))}}::slotted(ul){margin-block:0;list-style:none;display:flex;padding-left:0;gap:1rem}.title-header{display:flex;align-items:center;gap:var(--post-core-dimension-4);height:var(--main-header-height);background:var(--post-core-color-brand-white)}@media screen and (min-width: 1024px){.title-header{padding:var(--post-core-dimension-18) var(--post-core-dimension-16) var(--post-core-dimension-4) var(--post-core-dimension-12)}}@media screen and (max-width: 1023.99px){.title-header{position:sticky;z-index:1;inset-block-start:var(--global-header-height);padding-inline:var(--post-core-dimension-8) var(--post-core-dimension-16)}}:host(:not(:has([slot=title]))) .title-header{display:none}::slotted(h1){margin:0 !important}@media screen and (min-width: 1024px){::slotted(h1){font-size:var(--post-core-font-size-28) !important}}@media screen and (max-width: 1023.99px){::slotted(h1){font-size:var(--post-core-font-size-20) !important}}@media screen and (min-width: 1024px){.mobile-toggle{display:none}}.navigation{background:var(--post-core-color-brand-white)}@media screen and (min-width: 1024px){.navigation{position:sticky;z-index:1;inset-block-start:var(--global-header-minimal-height)}}@media screen and (max-width: 1023.99px){.navigation{position:fixed;inset-inline:0;inset-block-end:calc(100vh - var(--header-height));box-shadow:var(--post-core-elevation-3);min-height:var(--post-core-dimension-10);max-height:calc(100vh - var(--header-height));overflow:auto}::slotted(post-mainnavigation),.navigation-footer{display:none;flex-direction:column;padding-block:var(--post-core-dimension-16) var(--post-core-dimension-24);padding-inline:var(--post-core-dimension-32)}.navigation.extended ::slotted(post-mainnavigation),.navigation.extended .navigation-footer{display:flex}::slotted(post-mainnavigation){background-color:var(--post-core-color-sandgrey-002);gap:var(--post-core-dimension-32)}.navigation-footer{background-color:var(--post-core-color-sandgrey-006);gap:var(--post-core-dimension-24)}}";
156
- const PostHeaderStyle0 = postHeaderCss;
157
-
158
- const PostHeader = class {
159
- constructor(hostRef) {
160
- index.registerInstance(this, hostRef);
161
- this.scrollParent = null;
162
- this.throttledScroll = () => this.handleScrollEvent();
163
- this.throttledResize = throttle(50, () => this.handleResize());
164
- this.device = null;
165
- this.mobileMenuExtended = false;
166
- }
167
- componentWillRender() {
168
- this.scrollParent = this.getScrollParent(this.host);
169
- this.scrollParent.addEventListener('scroll', this.throttledScroll, { passive: true });
170
- window.addEventListener('resize', this.throttledResize, { passive: true });
171
- this.handleResize();
172
- this.handleScrollEvent();
173
- }
174
- frozeBody(isMobileMenuExtended) {
175
- document.body.style.overflow = isMobileMenuExtended ? 'hidden' : '';
176
- }
177
- /**
178
- * Toggles the mobile navigation.
179
- */
180
- async toggleMobileMenu() {
181
- if (this.device === 'desktop')
182
- return;
183
- this.mobileMenuAnimation = this.mobileMenuExtended
184
- ? slide.slideUp(this.mobileMenu)
185
- : slide.slideDown(this.mobileMenu);
186
- // Update the state of the toggle button
187
- const menuButton = this.host.querySelector('post-togglebutton');
188
- menuButton.toggled = !this.mobileMenuExtended;
189
- // Toggle menu visibility before it slides down and after it slides back up
190
- if (this.mobileMenuExtended)
191
- await this.mobileMenuAnimation.finished;
192
- this.mobileMenuExtended = !this.mobileMenuExtended;
193
- if (!this.mobileMenuExtended)
194
- await this.mobileMenuAnimation.finished;
195
- }
196
- handleScrollEvent() {
197
- // Credits: "https://github.com/qeremy/so/blob/master/so.dom.js#L426"
198
- const st = Math.max(0, this.scrollParent instanceof Document
199
- ? this.scrollParent.documentElement.scrollTop
200
- : this.scrollParent.scrollTop);
201
- this.host.style.setProperty('--header-scroll-top', `${st}px`);
202
- }
203
- getScrollParent(node) {
204
- let currentParent = node.parentElement;
205
- while (currentParent) {
206
- if (currentParent.nodeName === 'BODY') {
207
- return document;
208
- }
209
- if (this.isScrollable(currentParent)) {
210
- return currentParent;
211
- }
212
- currentParent = currentParent.parentElement;
213
- }
214
- return document;
215
- }
216
- isScrollable(node) {
217
- if (!(node instanceof HTMLElement || node instanceof SVGElement)) {
218
- return false;
219
- }
220
- const style = getComputedStyle(node);
221
- return ['overflow', 'overflow-x', 'overflow-y'].some(propertyName => {
222
- const value = style.getPropertyValue(propertyName);
223
- return value === 'auto' || value === 'scroll';
224
- });
225
- }
226
- handleResize() {
227
- const previousDevice = this.device;
228
- let newDevice;
229
- const width = window === null || window === void 0 ? void 0 : window.innerWidth;
230
- if (width >= 1024) {
231
- newDevice = 'desktop';
232
- }
233
- else if (width >= 600) {
234
- newDevice = 'tablet';
235
- }
236
- else {
237
- newDevice = 'mobile';
238
- }
239
- // Close any open mobile menu
240
- if (newDevice === 'desktop' && this.mobileMenuExtended) {
241
- this.toggleMobileMenu();
242
- this.mobileMenuAnimation.finish(); // no animation
243
- }
244
- // Apply only on change for doing work only when necessary
245
- if (newDevice !== previousDevice) {
246
- this.device = newDevice;
247
- window.requestAnimationFrame(() => {
248
- this.switchLanguageSwitchMode();
249
- });
250
- }
251
- }
252
- switchLanguageSwitchMode() {
253
- var _a;
254
- const variant = this.device === 'desktop' ? 'dropdown' : 'list';
255
- (_a = this.host.querySelector('post-language-switch')) === null || _a === void 0 ? void 0 : _a.setAttribute('variant', variant);
256
- }
257
- render() {
258
- const navigationClasses = ['navigation'];
259
- if (this.mobileMenuExtended) {
260
- navigationClasses.push('extended');
261
- }
262
- return (index.h(index.Host, { key: 'd96b46b64946ef425059463d127fa1188c99ea58', version: _package.version }, index.h("div", { key: '831ebc53d0f598a99e72d46a1530c2c34c196948', class: "global-header" }, index.h("div", { key: '69f3b3bc47a61810eea3ae60d7b2423af1750416', class: "global-sub" }, index.h("div", { key: 'ad6d36c7e7f029edfdee223ab1df664a1b7002f8', class: "logo" }, index.h("slot", { key: '95adfc2ad9e63fde9eef3cc71b63247e140fba3d', name: "post-logo" }))), index.h("div", { key: '741e62693a4df8558213c85d7a837efb8b0cfa6d', class: "global-sub" }, this.device === 'desktop' && index.h("slot", { key: '992844b617955cb77079a175fcaaf54943a6eef2', name: "meta-navigation" }), index.h("slot", { key: '4384ae4c04d239bf1b1947ba6d1457ae6879a5cf', name: "global-controls" }), this.device === 'desktop' && index.h("slot", { key: 'c5b33b6bfb8c00d44710ec997a80d56720aab760', name: "post-language-switch" }), index.h("div", { key: '25a629a419c94fc4789eb374b87cf7c159b746c6', onClick: () => this.toggleMobileMenu(), class: "mobile-toggle" }, index.h("slot", { key: '3f3078832237abc5a6df79b4a57fe20fae926aa3', name: "post-togglebutton" })))), index.h("div", { key: 'e11ca83bc108d4677e849b7386ad7bd09d8c9331', class: "title-header d-flex space-between align-center" }, index.h("slot", { key: '87430ad15ab09f800b714be45be00a50e5b7dc0a', name: "title" }), index.h("div", { key: '494a198d3ee8185a26b16fce97a85bed01d6b3f7', class: "global-sub" }, index.h("slot", { key: '8a54e3d1366d39c11d64c0de90f35a4330836428', name: "local-controls" }), index.h("slot", { key: '63f841457e0f7b7722a3f8b1ea83ff0d78d9c08e' }))), index.h("div", { key: '90cf667c412d90f8e466e7e7925fa4a2f8223ad8', ref: el => (this.mobileMenu = el), class: navigationClasses.join(' ') }, index.h("slot", { key: 'a046286cb6cc770bfb8fb4439cdacac7c351001b', name: "post-mainnavigation" }), (this.device === 'mobile' || this.device === 'tablet') && (index.h("div", { key: '6e0ad5841ef53daf0c0885b75efdf12d69f4a72d', class: "navigation-footer" }, index.h("slot", { key: '1eaebace0d5e37794867ae2a317a104726bb873a', name: "meta-navigation" }), index.h("slot", { key: '79217cd6fd16d4c6ef3e8aaa656e6dc0a8842b23', name: "post-language-switch" }))))));
263
- }
264
- get host() { return index.getElement(this); }
265
- static get watchers() { return {
266
- "mobileMenuExtended": ["frozeBody"]
267
- }; }
268
- };
269
- PostHeader.style = PostHeaderStyle0;
270
-
271
- const postIconCss = ":host{container-name:post-icon;container-type:inline-size;display:inline-block;width:1em;height:1em;vertical-align:-0.15em}svg{display:block;width:100%;height:100%;fill:currentColor;forced-color-adjust:preserve-parent-color}@container post-icon (max-width: 23.98px){svg{--pis-16: block}}@container post-icon (min-width: 24px) and (max-width: 31.98px){svg{--pis-24: block}}@container post-icon (min-width: 32px) and (max-width: 39.98px){svg{--pis-32: block}}@container post-icon (min-width: 40px) and (max-width: 47.98px){svg{--pis-40: block}}@container post-icon (min-width: 48px) and (max-width: 63.98px){svg{--pis-48: block}}@container post-icon (min-width: 64px){svg{--pis-64: block}}:host([flip-h]:not([flip-h=false])){scale:-1 1}:host([flip-v]:not([flip-v=false])){scale:1 -1}:host([flip-h][flip-v]:not([flip-h=false],[flip-v=false])){scale:-1}:host([animation]){transform-origin:center}:host([animation=cylon]){animation:icon-animation-cylon .75s ease-in-out infinite alternate}:host([animation=cylon-vertical]){animation:icon-animation-cylon-vertical .75s ease-in-out infinite alternate}:host([animation=spin]){animation:icon-animation-spin 2s linear infinite normal}:host([animation=spin-reverse]){animation:icon-animation-spin 2s linear infinite reverse}:host([animation=fade]){animation:icon-animation-fade .75s ease-in-out infinite alternate}:host([animation=throb]){animation:icon-animation-throb .75s ease-in-out infinite alternate}@keyframes icon-animation-cylon{from{transform:translateX(-25%)}to{transform:translateX(25%)}}@keyframes icon-animation-cylon-vertical{from{transform:translateY(25%)}to{transform:translateY(-25%)}}@keyframes icon-animation-fade{from{opacity:.1}to{opacity:1}}@keyframes icon-animation-spin{from{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes icon-animation-throb{from{opacity:.5;transform:scale(0.5)}to{opacity:1;transform:scale(1)}}";
272
- const PostIconStyle0 = postIconCss;
273
-
274
- const CDN_URL = 'https://unpkg.com/@swisspost/design-system-icons/public/post-icons';
275
- const ANIMATION_NAMES = [
276
- 'cylon',
277
- 'cylon-vertical',
278
- 'spin',
279
- 'spin-reverse',
280
- 'fade',
281
- 'throb',
282
- ];
283
- const ANIMATION_KEYS = [...ANIMATION_NAMES];
284
- const PostIcon = class {
285
- constructor(hostRef) {
286
- index.registerInstance(this, hostRef);
287
- this.animation = null;
288
- this.base = null;
289
- this.flipH = false;
290
- this.flipV = false;
291
- this.name = undefined;
292
- this.rotate = null;
293
- this.scale = null;
294
- }
295
- validateAnimation(newValue = this.animation) {
296
- if (newValue !== undefined)
297
- index$1.checkEmptyOrOneOf(newValue, ANIMATION_KEYS, `The post-icon "animation" prop requires one of the following values: ${ANIMATION_KEYS.join(', ')}.`);
298
- }
299
- validateBase(newValue = this.base) {
300
- index$1.checkEmptyOrType(newValue, 'string', 'The post-icon "base" prop should be a string.');
301
- }
302
- validateFlipH(newValue = this.flipH) {
303
- index$1.checkEmptyOrType(newValue, 'boolean', 'The post-icon "flipH" prop should be a boolean.');
304
- }
305
- validateFlipV(newValue = this.flipV) {
306
- index$1.checkEmptyOrType(newValue, 'boolean', 'The post-icon "flipV" prop should be a boolean.');
307
- }
308
- validateName(newValue = this.name) {
309
- checkNonEmpty.checkNonEmpty(newValue, 'The post-icon "name" prop is required!.');
310
- checkType.checkType(newValue, 'string', 'The post-icon "name" prop should be a string.');
311
- }
312
- validateRotate(newValue = this.rotate) {
313
- index$1.checkEmptyOrType(newValue, 'number', 'The post-icon "rotate" prop should be a number.');
314
- }
315
- validateScale(newValue = this.scale) {
316
- index$1.checkEmptyOrType(newValue, 'number', 'The post-icon "scale" prop should be a number.');
317
- }
318
- getPath() {
319
- var _a, _b, _c, _d, _e, _f;
320
- // Construct icon path from different possible sources
321
- const metaBase = (_b = (_a = document.head
322
- .querySelector('meta[name="design-system-settings"][data-post-icon-base]')) === null || _a === void 0 ? void 0 : _a.getAttribute('data-post-icon-base')) !== null && _b !== void 0 ? _b : null;
323
- const baseHref = (_c = document.getElementsByTagName('base')[0]) === null || _c === void 0 ? void 0 : _c.href;
324
- const fileBase = `${(_f = (_e = (_d = this.base) !== null && _d !== void 0 ? _d : metaBase) !== null && _e !== void 0 ? _e : baseHref) !== null && _f !== void 0 ? _f : CDN_URL}/`.replace(/\/\/$/, '/');
325
- const fileName = `${this.name}.svg#i-${this.name}`;
326
- const filePath = `${fileBase}${fileName}`;
327
- return new URL(filePath, window.location.origin).toString();
328
- }
329
- getStyles() {
330
- return Object.entries({
331
- transform: (this.scale && !isNaN(Number(this.scale)) ? 'scale(' + this.scale + ')' : '') +
332
- (this.rotate && !isNaN(Number(this.rotate)) ? ' rotate(' + this.rotate + 'deg)' : ''),
333
- })
334
- .filter(([_key, value]) => value !== null)
335
- .reduce((styles, [key, value]) => Object.assign(styles, { [key]: value }), {});
336
- }
337
- componentDidLoad() {
338
- this.validateBase();
339
- this.validateName();
340
- this.validateFlipH();
341
- this.validateFlipV();
342
- this.validateScale();
343
- this.validateRotate();
344
- this.validateAnimation();
345
- }
346
- render() {
347
- return (index.h(index.Host, { key: '7864661c5ba45508fa3902c49fd0da1d6c026795', "data-version": _package.version }, index.h("svg", { key: '588f70bd81afc4cc5a312388aa6225bc9c853b57', style: this.getStyles() }, index.h("use", { key: 'c4505cf12ddf083ad86b3b9304ffbf37ac3489d1', href: this.getPath() }))));
348
- }
349
- get host() { return index.getElement(this); }
350
- static get watchers() { return {
351
- "animation": ["validateAnimation"],
352
- "base": ["validateBase"],
353
- "flipH": ["validateFlipH"],
354
- "flipV": ["validateFlipV"],
355
- "name": ["validateName"],
356
- "rotate": ["validateRotate"],
357
- "scale": ["validateScale"]
358
- }; }
359
- };
360
- PostIcon.style = PostIconStyle0;
361
-
362
- const postLanguageOptionCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:inline-block;width:fit-content}button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button}a{color:inherit;text-decoration:none}:is(a,button){cursor:pointer;display:flex;align-items:center;justify-content:center;height:100%;width:100%;padding:var(--post-language-option-padding)}.post-language-option-list{border-radius:2px;width:40px;height:40px}.post-language-option-list{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.post-language-option-list:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-option-list:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.post-language-option-list:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-option-list:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.post-language-option-list[aria-current=true],.post-language-option-list[aria-current=page]{background-color:#050400;color:#fff}.post-language-option-dropdown{padding-block:13px;padding-inline:24px;box-sizing:border-box;position:relative}.post-language-option-dropdown[aria-current=true]::after,.post-language-option-dropdown[aria-current=page]::after{content:\"\";left:-2px;height:3px;background-color:#504f4b;width:calc(100% + 4px);display:block;position:absolute;bottom:3px}.post-language-option-dropdown[aria-current=true]:focus::after,.post-language-option-dropdown[aria-current=page]:focus::after{width:calc(100% - 5px);left:2px}";
363
- const PostLanguageOptionStyle0 = postLanguageOptionCss;
364
-
365
- const PostLanguageOption = class {
366
- constructor(hostRef) {
367
- index.registerInstance(this, hostRef);
368
- this.postChange = index.createEvent(this, "postChange", 7);
369
- this.code = undefined;
370
- this.active = undefined;
371
- this.variant = undefined;
372
- this.name = undefined;
373
- this.url = undefined;
374
- }
375
- validateCode(value = this.code) {
376
- checkType.checkType(value, 'string', 'The "code" property of the post-language-option component must be a string.');
377
- }
378
- validateActiveProp(value = this.active) {
379
- index$1.checkEmptyOrType(value, 'boolean', 'The "active" property of the post-language-option component must be a boolean value.');
380
- }
381
- validateName(value = this.name) {
382
- index$1.checkEmptyOrType(value, 'string', 'The "name" property of the post-language-option component must be a string.');
383
- }
384
- validateUrl(value = this.url) {
385
- index$1.checkEmptyOrType(value, 'string', 'The "url" property of the post-language-option component must be a valid URL.');
386
- }
387
- componentDidLoad() {
388
- this.validateCode();
389
- this.validateActiveProp();
390
- this.validateName();
391
- this.validateUrl();
392
- if (!this.name && this.isNameRequired()) {
393
- throw new Error('The "name" property of the post-language-option component is required when the full language name is not displayed.');
394
- }
395
- }
396
- /**
397
- * Selects the language option programmatically.
398
- */
399
- async select() {
400
- this.active = true;
401
- this.emitChange();
402
- }
403
- emitChange() {
404
- this.postChange.emit(this.code);
405
- }
406
- isNameRequired() {
407
- return this.host.textContent.toLowerCase() === this.code.toLowerCase();
408
- }
409
- render() {
410
- const lang = this.code.toLowerCase();
411
- return (index.h(index.Host, { key: '9a3f49ee993b69393ea8f81b671cd5482049ff1c', "data-version": _package.version, role: "listitem" }, this.url ? (index.h("a", { class: this.variant ? `post-language-option-${this.variant}` : '', "aria-current": this.active ? 'page' : undefined, "aria-label": this.name, href: this.url, hrefLang: lang, lang: lang, onClick: () => this.emitChange() }, index.h("slot", null))) : (index.h("button", { class: this.variant ? `post-language-option-${this.variant}` : '', "aria-current": this.active ? 'true' : undefined, "aria-label": this.name, lang: lang, onClick: () => this.emitChange() }, index.h("slot", null)))));
412
- }
413
- get host() { return index.getElement(this); }
414
- static get watchers() { return {
415
- "code": ["validateCode"],
416
- "active": ["validateActiveProp"],
417
- "name": ["validateName"],
418
- "url": ["validateUrl"]
419
- }; }
420
- };
421
- PostLanguageOption.style = PostLanguageOptionStyle0;
422
-
423
- const SWITCH_VARIANTS = ['list', 'dropdown'];
424
-
425
- const urlAlphabet =
426
- 'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict';
427
-
428
- let nanoid = (size = 21) => {
429
- let id = '';
430
- let bytes = crypto.getRandomValues(new Uint8Array((size |= 0)));
431
- while (size--) {
432
- id += urlAlphabet[bytes[size] & 63];
433
- }
434
- return id
435
- };
436
-
437
- const postLanguageSwitchCss = ":host{display:block}.post-language-switch-dropdown-container{display:flex;flex-direction:column}.post-language-switch-trigger{cursor:pointer;padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-decoration:none;display:inline-flex;align-items:center;gap:var(--post-core-dimension-6);border-radius:var(--post-core-dimension-24);font-size:var(--post-core-font-size-16);padding:var(--post-core-dimension-3) var(--post-core-dimension-10)}.post-language-switch-trigger{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.post-language-switch-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.post-language-switch-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-switch-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.post-language-switch-trigger:not(:disabled):hover,.post-language-switch-trigger.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}.post-language-switch-trigger post-icon{height:var(--post-core-dimension-16);width:var(--post-core-dimension-16)}";
438
- const PostLanguageSwitchStyle0 = postLanguageSwitchCss;
439
-
440
- const PostLanguageSwitch = class {
441
- constructor(hostRef) {
442
- index.registerInstance(this, hostRef);
443
- this.menuId = `p${nanoid(11)}`;
444
- this.caption = undefined;
445
- this.description = undefined;
446
- this.variant = 'list';
447
- this.activeLang = undefined;
448
- }
449
- validateCaption(value = this.caption) {
450
- checkType.checkType(value, 'string', 'The "caption" property of the post-language-switch component must be a string.');
451
- }
452
- validateDescription(value = this.description) {
453
- checkType.checkType(value, 'string', 'The "description" property of the post-language-switch component must be a string.');
454
- }
455
- validateVariant(value = this.variant) {
456
- index$1.checkEmptyOrOneOf(value, SWITCH_VARIANTS, `The "variant" property of the post-language-switch component must be: ${SWITCH_VARIANTS.join(', ')}`);
457
- }
458
- connectedCallback() {
459
- this.updateChildrenVariant();
460
- // Get the active language based on children's active state
461
- this.activeLang = Array.from(this.host.querySelectorAll('post-language-option'))
462
- .find(el => el.getAttribute('active') == 'true')
463
- .getAttribute('code');
464
- }
465
- // Update post-language-option variant to have the correct style
466
- updateChildrenVariant() {
467
- this.host.querySelectorAll('post-language-option').forEach(el => {
468
- el.setAttribute('variant', this.variant);
469
- });
470
- }
471
- componentShouldUpdate() {
472
- this.updateChildrenVariant();
473
- }
474
- componentDidLoad() {
475
- this.validateCaption();
476
- this.validateDescription();
477
- this.validateVariant();
478
- // Detects a change in the active language
479
- this.host.addEventListener('postChange', (el) => {
480
- this.activeLang = el.detail;
481
- // Update the active state in the children post-language-option components
482
- this.host.querySelectorAll('post-language-option').forEach(lang => {
483
- if (lang.code && lang.code === this.activeLang) {
484
- lang.setAttribute('active', 'true');
485
- }
486
- else {
487
- lang.setAttribute('active', 'false');
488
- }
489
- });
490
- // Hides the dropdown when an option has been clicked
491
- if (this.variant === 'dropdown') {
492
- const menu = this.host.shadowRoot.querySelector('post-menu');
493
- menu.toggle(menu);
494
- }
495
- });
496
- }
497
- renderList() {
498
- return (index.h(index.Host, { "data-version": _package.version, "aria-label": `${this.caption}, ${this.description}`, "aria-role": "list" }, index.h("slot", null)));
499
- }
500
- renderDropdown() {
501
- return (index.h(index.Host, { "data-version": _package.version }, index.h("post-menu-trigger", { for: this.menuId }, index.h("button", { class: "post-language-switch-trigger", "aria-label": `${this.caption}, ${this.description}` }, this.activeLang.toUpperCase(), index.h("post-icon", { "aria-hidden": "true", name: "chevrondown" }))), index.h("post-menu", { id: this.menuId }, index.h("div", { class: "post-language-switch-dropdown-container" }, index.h("slot", null)))));
502
- }
503
- render() {
504
- return this.variant === 'list' ? this.renderList() : this.renderDropdown();
505
- }
506
- get host() { return index.getElement(this); }
507
- static get watchers() { return {
508
- "caption": ["validateCaption"],
509
- "description": ["validateDescription"],
510
- "variant": ["validateVariant"]
511
- }; }
512
- };
513
- PostLanguageSwitch.style = PostLanguageSwitchStyle0;
514
-
515
- const postListCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */post-list{display:flex;flex-direction:column;gap:var(--post-list-title-gap, 0)}post-list>[role=list]{display:flex;flex-direction:column;gap:var(--post-list-item-gap, 0)}post-list:where([horizontal]:not([horizontal=false])){flex-direction:row;align-items:center}post-list:where([horizontal]:not([horizontal=false]))>[role=list]{flex-direction:row;align-items:center}post-list>.list-title.visually-hidden{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}post-list>.list-title.visually-hidden:not(caption){position:absolute !important}";
516
- const PostListStyle0 = postListCss;
517
-
518
- const PostList = class {
519
- constructor(hostRef) {
520
- index.registerInstance(this, hostRef);
521
- this.titleId = undefined;
522
- this.titleHidden = false;
523
- this.horizontal = false;
524
- }
525
- componentWillLoad() {
526
- /**
527
- * Get the id set on the host element or use a random id by default
528
- */
529
- this.titleId = `title-${this.host.id || crypto.randomUUID()}`;
530
- }
531
- componentDidLoad() {
532
- this.checkTitle();
533
- }
534
- checkTitle() {
535
- if (!this.titleEl.textContent.trim()) {
536
- throw new Error('Please provide a title to the list component. Title is mandatory for accessibility purposes.');
537
- }
538
- }
539
- render() {
540
- return (index.h(index.Host, { key: '4f982e717530514589c5528553b70463d678b676', "data-version": _package.version }, index.h("div", { key: 'cc65ed208f48e7a22482af96fd069d05363f2617', ref: el => (this.titleEl = el), id: this.titleId, class: `list-title${this.titleHidden ? ' visually-hidden' : ''}` }, index.h("slot", { key: '0f8bbeade50b59e53767ce2169dd57bb79644705' })), index.h("div", { key: '7fa5de37a169e6f76928c2088c46ee747427887e', role: "list", "aria-labelledby": this.titleId }, index.h("slot", { key: '86b4d71b83671babb61dd12e842710d67350a09e', name: "post-list-item" }))));
541
- }
542
- get host() { return index.getElement(this); }
543
- };
544
- PostList.style = PostListStyle0;
545
-
546
- const postListItemCss = ":host{display:flex}";
547
- const PostListItemStyle0 = postListItemCss;
548
-
549
- const PostListItem = class {
550
- constructor(hostRef) {
551
- index.registerInstance(this, hostRef);
552
- }
553
- connectedCallback() {
554
- this.host.setAttribute('slot', 'post-list-item');
555
- }
556
- render() {
557
- return (index.h(index.Host, { key: 'aa9a31c64e3e8ba5dcac1d03b54ab3c886149c1f', role: "listitem", slot: "post-list-item" }, index.h("slot", { key: '06353140f8917fc5373de6d56708467af2ef52b2' })));
558
- }
559
- get host() { return index.getElement(this); }
560
- };
561
- PostListItem.style = PostListItemStyle0;
562
-
563
- const postLogoCss = ":host,.logo{display:inline-block}:host,:host .logo>svg,.logo,.logo .logo>svg{height:100%}.description{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}";
564
- const PostLogoStyle0 = postLogoCss;
565
-
566
- const PostLogo = class {
567
- constructor(hostRef) {
568
- index.registerInstance(this, hostRef);
569
- this.url = undefined;
570
- }
571
- validateUrl() {
572
- index$1.checkEmptyOrUrl(this.url, 'The "url" property of the post-logo is invalid');
573
- }
574
- componentDidLoad() {
575
- this.validateUrl();
576
- this.checkDescription();
577
- }
578
- checkDescription() {
579
- if (!this.host.textContent) {
580
- console.warn('Be sure to add descriptive text in the post-logo to ensure good accessibility of the component.');
581
- }
582
- }
583
- render() {
584
- const logoLink = this.url && (typeof this.url === 'string' ? this.url : this.url.href);
585
- const LogoTag = logoLink ? 'a' : 'span';
586
- return (index.h(index.Host, { key: 'b8d47e2530eb39f7b05370b4cea0b728cb00a1fb', "data-version": _package.version, slot: "post-logo" }, index.h(LogoTag, Object.assign({ key: '47a4d88622aab30e652a08827e221dacda36cb48', class: "logo" }, (logoLink ? { href: logoLink } : {})), index.h("span", { key: '4eb6ad1bc6c165197b6bcce8fe1146eb9d48fb21', class: "description" }, index.h("slot", { key: 'c66a4385f19711daab6f4ba87d5f78f59ad8b263', onSlotchange: () => this.checkDescription() })), index.h("svg", { key: '824643e64a3fb0914082f8f78a11753d66c98842', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, index.h("g", { key: 'e4f63d237c1fe1128005f29ea604c865f6b50943', id: "Logo" }, index.h("rect", { key: '34fec89177fb5461318d3e8fcc725f32dd97057a', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), index.h("polygon", { key: '5600de7c21a8e363fffa35710a3f41e4295b76c7', fill: "#ff0000", points: "34,32.3 34,19 19.7,19 19.7,29.1 10,29.1 10,42.9 19.7,42.9 19.7,53 34,53 34,39.7 30.6,39.7 30.6,49.8 23.1,49.8 23.1,39.7 13.4,39.7 13.4,32.3 23.1,32.3 23.1,22.2 30.6,22.2 30.6,32.3" }), index.h("path", { key: '719be82825355704c4eac3c60fb461f6303734f7', d: "M53.56234,31.10526c0,2.41272-1.99154,4.29475-4.51723,4.29475H45.2v-8.3h3.84511C51.66802,27.1,53.56234,28.78889,53.56234,31.10526z M50.69666,19H36v34h9.2V42.9h5.49666c6.75131,0,11.9971-5.15137,11.9971-11.8057C62.69376,24.39136,57.35099,19,50.69666,19z" }))))));
587
- }
588
- get host() { return index.getElement(this); }
589
- static get watchers() { return {
590
- "url": ["validateUrl"]
591
- }; }
592
- };
593
- PostLogo.style = PostLogoStyle0;
594
-
595
- const postMainnavigationCss = "post-mainnavigation post-list-item>a{text-decoration:none;border-radius:0}post-mainnavigation post-list-item post-megadropdown-trigger button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;appearance:button;text-align:start}post-mainnavigation post-list-item post-megadropdown-trigger button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-mainnavigation post-list-item post-megadropdown-trigger button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{display:flex;align-items:center;justify-content:space-between}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}post-mainnavigation post-list-item>a:focus-visible,post-mainnavigation post-list-item>button:focus-visible,post-mainnavigation post-list-item post-megadropdown-trigger button:focus-visible{border-radius:var(--post-core-dimension-4);z-index:1}@media screen and (min-width: 1024px){post-mainnavigation nav{position:relative;max-width:100vw;max-height:var(--post-core-dimension-56);user-select:none}post-mainnavigation post-list{margin-inline:var(--post-core-dimension-4)}post-mainnavigation post-list>[role=list]{flex-direction:row;max-width:100vw;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline:var(--post-core-dimension-12);height:var(--post-core-dimension-56);gap:var(--post-core-dimension-4);font-size:var(--post-core-font-size-16);border-block:0 solid rgba(0,0,0,0);border-block-end-color:currentColor}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button:hover{border-block-width:var(--post-core-dimension-2)}post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>a[aria-expanded=true],post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item>button[aria-expanded=true],post-mainnavigation post-list-item post-megadropdown-trigger button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]{border-block-width:var(--post-core-dimension-4);font-weight:var(--post-core-font-weight-700)}post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{padding-inline-end:var(--post-core-dimension-12);transition:border-block-end-color 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button::after,post-mainnavigation post-list-item post-megadropdown-trigger button::after{content:\"\";-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m23.6 13.2-7.5 7.6-7.6-7.6.9-.9 6.6 6.6 6.6-6.6z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;height:var(--post-core-dimension-24);width:var(--post-core-dimension-24);transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}post-mainnavigation post-list-item>button.selected::after,post-mainnavigation post-list-item>button[aria-expanded=true]::after,post-mainnavigation post-list-item post-megadropdown-trigger button.selected::after,post-mainnavigation post-list-item post-megadropdown-trigger button[aria-expanded=true]::after{transform:rotate(180deg)}post-mainnavigation [slot=back-button]{display:none}}@media screen and (max-width: 1023.99px){post-mainnavigation post-list>[role=list]{transform:none !important}post-mainnavigation post-list-item>a,post-mainnavigation post-list-item>button,post-mainnavigation post-list-item post-megadropdown-trigger button{width:100%;height:var(--post-core-dimension-48);padding-inline-end:var(--post-core-dimension-6);gap:var(--post-core-dimension-16);border-block:var(--post-core-dimension-1) solid rgba(0,0,0,0);border-block-end-color:currentColor;font-weight:var(--post-core-font-weight-700)}post-mainnavigation post-list-item>a:hover,post-mainnavigation post-list-item>a.selected,post-mainnavigation post-list-item>button:hover,post-mainnavigation post-list-item>button.selected,post-mainnavigation post-list-item post-megadropdown-trigger button:hover,post-mainnavigation post-list-item post-megadropdown-trigger button.selected{border-block-width:var(--post-core-dimension-3)}post-mainnavigation post-list-item>a:hover::after,post-mainnavigation post-list-item>button:hover::after,post-mainnavigation post-list-item post-megadropdown-trigger button:hover::after{content:\"\";display:block;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.667 5.333H18.8L29.467 16H0v1.333h29.467L18.8 28h1.867L32 16.667z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.667 5.333H18.8L29.467 16H0v1.333h29.467L18.8 28h1.867L32 16.667z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;width:var(--post-core-dimension-24);height:var(--post-core-dimension-24)}}";
596
- const PostMainnavigationStyle0 = postMainnavigationCss;
597
-
598
- const PostMainnavigation = class {
599
- constructor(hostRef) {
600
- index.registerInstance(this, hostRef);
601
- this.postToggle = index.createEvent(this, "postToggle", 7);
602
- }
603
- /**
604
- * Retrieves a reference to the closest 'post-header' element when the main navigation is added to the DOM.
605
- */
606
- connectedCallback() {
607
- this.header = this.host.closest('post-header');
608
- }
609
- /**
610
- * Cleans up references and disconnects the MutationObserver when the main navigation is removed from the DOM.
611
- */
612
- disconnectedCallback() {
613
- this.header = null;
614
- }
615
- handleBackButtonClick() {
616
- if (this.header)
617
- this.header.toggleMobileMenu();
618
- }
619
- render() {
620
- return (index.h(index.Host, { key: 'f21c438ac0bbcb08e08fd419589bf92b7d8b3a61', slot: "post-mainnavigation" }, index.h("div", { key: '1925f47932d7e842e8b9f059d7ade955c577fa50', onClick: () => this.handleBackButtonClick(), class: "back-button" }, index.h("slot", { key: 'fe18f6859a6d79c7ae701b65a31be1eab9c8b2ac', name: "back-button" })), index.h("nav", { key: 'ad2b0a52bc0bcf78a3c3340ba163ee6167be2c73' }, index.h("slot", { key: '8fc7b01cc0f3729cd2c12c4967ec87891fe0dcf5' }))));
621
- }
622
- get host() { return index.getElement(this); }
623
- };
624
- PostMainnavigation.style = PostMainnavigationStyle0;
625
-
626
- const postMegadropdownCss = "@keyframes slide-in{0%{transform:translateX(100%)}100%{transform:translateX(0%)}}@keyframes slide-out{from{transform:translateX(0%)}to{transform:translateX(100%)}}*,::before,::after{box-sizing:border-box}post-popovercontainer{--post-global-header-height:72px;--post-main-header-height:56px;--post-header-height:calc(var(--post-global-header-height) + var(--post-main-header-height));background-color:#fafafa;border:none;border-top:1px solid #e1e0dc;width:100%;border-radius:0;box-shadow:0 8px 6px rgba(0,0,0,.16)}@media screen and (max-width: 1023.99px){post-popovercontainer{--post-global-header-height:64px;position:absolute;top:var(--post-header-height) !important;bottom:0;left:0;width:100%;height:auto}post-popovercontainer.slide-in{animation:slide-in;animation-duration:350ms;animation-fill-mode:forwards}post-popovercontainer.slide-out{animation:slide-out;animation-duration:350ms;animation-fill-mode:forwards}}.megadropdown{padding:31px 40px 40px}@media screen and (max-width: 1023.99px){.megadropdown{padding:16px 32px 24px}}.megadropdown .megadropdown-content{gap:1.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(min(15vw, 100%), 1fr));grid-auto-rows:1fr auto;grid-auto-flow:dense}@media screen and (max-width: 1023.99px){.megadropdown .megadropdown-content{grid-template-columns:repeat(auto-fit, minmax(min(35vw, 100%), 1fr))}}@media screen and (max-width: 599.99px){.megadropdown .megadropdown-content{grid-template-columns:1fr}}.megadropdown h2{display:none;margin-top:0;margin-bottom:8px;font-weight:900}.megadropdown h2 a{text-decoration:none;font-weight:inherit;border-bottom:0;border-top:0}@media screen and (max-width: 1023.99px){.megadropdown h2{display:block;font-size:20px}}.megadropdown a:hover{border-block-width:0}.megadropdown a:hover::after{content:unset}.megadropdown post-list{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0px}.megadropdown post-list>[role=list]{flex-direction:unset;display:unset}.megadropdown post-list>*{width:100%}.megadropdown post-list .list-title{display:flex;flex-direction:column-reverse;height:100%}.megadropdown post-list .list-title h3{font-size:20px;border-bottom:1px solid #050400;padding:15px 12px 14px 0;display:block;font-weight:900}.megadropdown post-list .list-title h3 a{text-decoration:none;width:100%;font-size:inherit;display:inline-block;font-weight:inherit;height:unset;padding:0;border:0}@media screen and (max-width: 1023.99px){.megadropdown post-list .list-title h3{font-size:16px;padding:12px 12px 11px 0}}.megadropdown post-list-item{border-bottom:1px solid #050400}.megadropdown post-list-item>a{padding:13px 12px 12px 0;display:block;text-decoration:none;width:100%;border-bottom:0;height:auto;border-top:0}@media screen and (max-width: 1023.99px){.megadropdown post-list-item>a{padding:12px 12px 11px 0}}.megadropdown .back-button{display:none;margin-bottom:2rem}.megadropdown .back-button .btn{width:auto}.megadropdown .back-button post-icon{transform:rotate(180deg)}@media screen and (max-width: 1023.99px){.megadropdown .back-button{display:block}}.megadropdown .close-button{position:absolute;top:1rem;right:1rem}@media screen and (max-width: 1023.99px){.megadropdown .close-button{display:none}}";
627
- const PostMegadropdownStyle0 = postMegadropdownCss;
628
-
629
- const PostMegadropdown = class {
630
- constructor(hostRef) {
631
- index.registerInstance(this, hostRef);
632
- this.postToggleMegadropdown = index.createEvent(this, "postToggleMegadropdown", 7);
633
- this.isVisible = false;
634
- this.animationClass = null;
635
- }
636
- componentDidLoad() {
637
- this.popoverRef.addEventListener('postToggle', (event) => {
638
- this.isVisible = event.detail;
639
- this.postToggleMegadropdown.emit(this.isVisible);
640
- });
641
- this.popoverRef.addEventListener('animationend', () => {
642
- if (this.animationClass === 'slide-out') {
643
- this.hide();
644
- }
645
- });
646
- }
647
- /**
648
- * Toggles the dropdown visibility based on its current state.
649
- */
650
- async toggle(target) {
651
- this.isVisible ? this.hide() : await this.show(target);
652
- }
653
- /**
654
- * Displays the popover dropdown
655
- *
656
- * @param target - The HTML element relative to which the popover dropdown should be displayed.
657
- */
658
- async show(target) {
659
- if (this.popoverRef) {
660
- await this.popoverRef.show(target);
661
- this.animationClass = 'slide-in';
662
- }
663
- else {
664
- console.error('show: popoverRef is null or undefined');
665
- }
666
- }
667
- /**
668
- * Hides the popover dropdown
669
- */
670
- hide() {
671
- if (this.popoverRef) {
672
- this.popoverRef.hide();
673
- }
674
- else {
675
- console.error('hide: popoverRef is null or undefined');
676
- }
677
- }
678
- handleBackButtonClick() {
679
- this.animationClass = 'slide-out';
680
- }
681
- handleCloseButtonClick() {
682
- this.popoverRef.hide();
683
- }
684
- render() {
685
- return (index.h(index.Host, { key: 'cfd4e6c7bb87c50e471d304a4b4f086266e1c2fe' }, index.h("post-popovercontainer", { key: '31dc3a5e98a5c60a4db8d47375491a6f3957af0b', class: this.animationClass, placement: "bottom", "edge-gap": "0", ref: el => (this.popoverRef = el) }, index.h("div", { key: '7001d0e108544a0244af088be0bde49f90a3dea3', class: "megadropdown" }, index.h("div", { key: '513b0710163e8f58677b6b50d2ba2d241cf9ff35', onClick: () => this.handleBackButtonClick(), class: "back-button" }, index.h("slot", { key: '5457c0b9bfff045f39f470e600b5aa31036c0807', name: "back-button" })), index.h("div", { key: 'c3314a4ae4f386224a2db7fe32203f72f6a1b284', onClick: () => this.handleCloseButtonClick(), class: "close-button" }, index.h("slot", { key: '8feeec24fe5f2522ba1a54ab0b7c682d3a152086', name: "close-button" })), index.h("slot", { key: '6d9426756a809ed26045c9cd56cacf0f36aa9400', name: "megadropdown-title" }), index.h("div", { key: 'fd3b0ac7998eec76700ccc6668d8b2e3fcc4c63a', class: "megadropdown-content" }, index.h("slot", { key: '23638936fdffa224de9631bfd599c0872202a30d' }))))));
686
- }
687
- get host() { return index.getElement(this); }
688
- };
689
- PostMegadropdown.style = PostMegadropdownStyle0;
690
-
691
- const postMegadropdownTriggerCss = "post-megadropdown-trigger{width:100%}";
692
- const PostMegadropdownTriggerStyle0 = postMegadropdownTriggerCss;
693
-
694
- const PostMegadropdownTrigger = class {
695
- constructor(hostRef) {
696
- index.registerInstance(this, hostRef);
697
- /**
698
- * Reference to the slotted button within the trigger, if present.
699
- * Used to manage click and key events for mega dropdown control.
700
- */
701
- this.slottedButton = null;
702
- this.for = undefined;
703
- this.ariaExpanded = false;
704
- }
705
- /**
706
- * Watch for changes to the `for` property to validate its type and ensure it is a string.
707
- * @param forValue - The new value of the `for` property.
708
- */
709
- validateControlFor(forValue = this.for) {
710
- checkType.checkType(forValue, 'string', 'The "for" property is required and should be a string.');
711
- }
712
- get megadropdown() {
713
- const ref = document.getElementById(this.for);
714
- return ref && ref.localName === 'post-megadropdown'
715
- ? ref
716
- : null;
717
- }
718
- handleToggle() {
719
- if (this.megadropdown) {
720
- this.megadropdown.toggle(this.host);
721
- }
722
- else {
723
- console.warn(`No post-megadropdown found with ID: ${this.for}`);
724
- }
725
- }
726
- componentDidLoad() {
727
- this.validateControlFor();
728
- // Check if the mega dropdown attached to the trigger is expanded or not
729
- document.addEventListener('postToggleMegadropdown', (event) => {
730
- if (event.target.id === this.for) {
731
- this.ariaExpanded = event.detail;
732
- if (this.slottedButton) {
733
- this.slottedButton.setAttribute('aria-expanded', this.ariaExpanded.toString());
734
- }
735
- }
736
- });
737
- this.slottedButton = this.host.querySelector('button');
738
- if (this.slottedButton) {
739
- this.slottedButton.setAttribute('aria-haspopup', 'menu');
740
- this.slottedButton.addEventListener('click', () => {
741
- this.handleToggle();
742
- });
743
- }
744
- else {
745
- console.warn('No button found within post-megadropdown-trigger');
746
- }
747
- }
748
- render() {
749
- return (index.h(index.Host, { key: '4ab919adeaa51fc12d45131fa540c76fb3ba73d9', "data-version": _package.version, "tab-index": "-1" }, index.h("button", { key: 'e7dac321691cdb19a4874fd0b2097227d077af35' }, index.h("slot", { key: 'beffc38d2d35a67e74364c3b40b6d39896aa4de3' }))));
750
- }
751
- get host() { return index.getElement(this); }
752
- static get watchers() { return {
753
- "for": ["validateControlFor"]
754
- }; }
755
- };
756
- PostMegadropdownTrigger.style = PostMegadropdownTriggerStyle0;
757
-
758
- const focusableSelector = `:where(${[
759
- 'button',
760
- 'input:not([type="hidden"])',
761
- '[tabindex]',
762
- 'select',
763
- 'textarea',
764
- '[contenteditable]',
765
- 'a[href]',
766
- 'iframe',
767
- 'audio[controls]',
768
- 'video[controls]',
769
- 'area[href]',
770
- 'details > summary:first-of-type',
771
- ].join(',')})`;
772
- const focusDisablingSelector = `:where(${[
773
- '[inert]',
774
- '[inert] *',
775
- ':disabled',
776
- 'dialog:not([open]) *',
777
- '[popover]:not(:popover-open) *',
778
- 'details:not([open]) > *:not(details > summary:first-of-type)',
779
- 'details:not([open]) > *:not(details > summary:first-of-type) *',
780
- ].join(',')})`;
781
- const isFocusable = (element) => {
782
- return (element === null || element === void 0 ? void 0 : element.matches(focusableSelector)) && !(element === null || element === void 0 ? void 0 : element.matches(focusDisablingSelector));
783
- };
784
-
785
- const postMenuCss = "/*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}post-popovercontainer{padding:var(--post-menu-padding);background-color:var(--post-menu-bg, #ffffff);border-color:var(--post-menu-bg, #ffffff)}";
786
- const PostMenuStyle0 = postMenuCss;
787
-
788
- const PostMenu = class {
789
- constructor(hostRef) {
790
- index.registerInstance(this, hostRef);
791
- this.toggleMenu = index.createEvent(this, "toggleMenu", 7);
792
- this.lastFocusedElement = null;
793
- this.KEYCODES = {
794
- SPACE: ' ',
795
- ENTER: 'Enter',
796
- UP: 'ArrowUp',
797
- DOWN: 'ArrowDown',
798
- TAB: 'Tab',
799
- HOME: 'Home',
800
- END: 'End',
801
- ESCAPE: 'Escape',
802
- };
803
- this.handleKeyDown = (e) => {
804
- e.stopPropagation();
805
- if (e.key === this.KEYCODES.ESCAPE) {
806
- this.toggle(this.host);
807
- return;
808
- }
809
- if (Object.values(this.KEYCODES).includes(e.key)) {
810
- this.controlKeyDownHandler(e);
811
- }
812
- };
813
- this.handleClick = (e) => {
814
- const target = e.target;
815
- if (['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {
816
- this.toggle(this.host);
817
- }
818
- };
819
- this.placement = 'bottom';
820
- this.isVisible = false;
821
- }
822
- connectedCallback() {
823
- this.root = getRoot.getRoot(this.host);
824
- this.host.addEventListener('keydown', this.handleKeyDown);
825
- this.host.addEventListener('click', this.handleClick);
826
- }
827
- disconnectedCallback() {
828
- this.host.removeEventListener('keydown', this.handleKeyDown);
829
- this.host.removeEventListener('click', this.handleClick);
830
- }
831
- componentDidLoad() {
832
- this.popoverRef.addEventListener('postToggle', (event) => {
833
- this.isVisible = event.detail;
834
- this.toggleMenu.emit(this.isVisible);
835
- });
836
- }
837
- /**
838
- * Toggles the menu visibility based on its current state.
839
- */
840
- async toggle(target) {
841
- this.isVisible ? await this.hide() : await this.show(target);
842
- }
843
- /**
844
- * Displays the popover menu, focusing the first menu item.
845
- *
846
- * @param target - The HTML element relative to which the popover menu should be displayed.
847
- */
848
- async show(target) {
849
- if (this.popoverRef) {
850
- await this.popoverRef.show(target);
851
- this.lastFocusedElement = this.root.activeElement; // Use root's activeElement
852
- const menuItems = this.getSlottedItems();
853
- if (menuItems.length > 0) {
854
- menuItems[0].focus();
855
- }
856
- }
857
- else {
858
- console.error('show: popoverRef is null or undefined');
859
- }
860
- }
861
- /**
862
- * Hides the popover menu and restores focus to the previously focused element.
863
- */
864
- async hide() {
865
- if (this.popoverRef) {
866
- await this.popoverRef.hide();
867
- if (this.lastFocusedElement) {
868
- this.lastFocusedElement.focus();
869
- }
870
- }
871
- else {
872
- console.error('hide: popoverRef is null or undefined');
873
- }
874
- }
875
- controlKeyDownHandler(e) {
876
- const menuItems = this.getSlottedItems();
877
- if (!menuItems.length) {
878
- return;
879
- }
880
- const currentFocusedElement = this.root.activeElement; // Use root's activeElement
881
- let currentIndex = menuItems.findIndex(el => el === currentFocusedElement);
882
- switch (e.key) {
883
- case this.KEYCODES.UP:
884
- e.preventDefault();
885
- currentIndex = (currentIndex - 1 + menuItems.length) % menuItems.length;
886
- break;
887
- case this.KEYCODES.DOWN:
888
- e.preventDefault();
889
- currentIndex = (currentIndex + 1) % menuItems.length;
890
- break;
891
- case this.KEYCODES.HOME:
892
- currentIndex = 0;
893
- break;
894
- case this.KEYCODES.END:
895
- currentIndex = menuItems.length - 1;
896
- break;
897
- case this.KEYCODES.SPACE:
898
- case this.KEYCODES.ENTER:
899
- this.toggle(this.host);
900
- return;
901
- case this.KEYCODES.TAB:
902
- this.toggle(this.host);
903
- break;
904
- }
905
- if (menuItems[currentIndex]) {
906
- menuItems[currentIndex].focus();
907
- }
908
- }
909
- getSlottedItems() {
910
- const slot = this.host.shadowRoot.querySelector('slot');
911
- const slottedElements = slot ? slot.assignedElements() : [];
912
- const menuItems = slottedElements
913
- .filter(el => el.tagName === 'POST-MENU-ITEM')
914
- .map(el => {
915
- const slot = el.shadowRoot.querySelector('slot');
916
- const assignedElements = slot ? slot.assignedElements() : [];
917
- return assignedElements.filter(isFocusable);
918
- })
919
- .flat();
920
- return menuItems;
921
- }
922
- render() {
923
- return (index.h(index.Host, { key: '48e04f36dc7a3d8ed81b9570d1a4c931ace3cadd', "data-version": _package.version }, index.h("post-popovercontainer", { key: '58532143bd7a8be7ea77cbd0a929fa74ee0ee890', placement: this.placement, ref: e => (this.popoverRef = e) }, index.h("div", { key: '967bf8aa936611ac6d533d9a8a1e176ee84b2a73', class: "popover-container", part: "popover-container" }, index.h("slot", { key: '4eb6b7fe34e8ea1df0d7cd8de31b57452442c3bb' })))));
924
- }
925
- get host() { return index.getElement(this); }
926
- };
927
- PostMenu.style = PostMenuStyle0;
928
-
929
- const postMenuTriggerCss = ":host{display:inline-block}";
930
- const PostMenuTriggerStyle0 = postMenuTriggerCss;
931
-
932
- const PostMenuTrigger = class {
933
- constructor(hostRef) {
934
- index.registerInstance(this, hostRef);
935
- /**
936
- * Reference to the slotted button within the trigger, if present.
937
- * Used to manage click and key events for menu control.
938
- */
939
- this.slottedButton = null;
940
- this.handleKeyDown = (e) => {
941
- if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
942
- e.preventDefault();
943
- this.handleToggle();
944
- }
945
- };
946
- this.for = undefined;
947
- this.ariaExpanded = false;
948
- }
949
- /**
950
- * Watch for changes to the `for` property to validate its type and ensure it is a string.
951
- * @param forValue - The new value of the `for` property.
952
- */
953
- validateControlFor(forValue = this.for) {
954
- checkType.checkType(forValue, 'string', 'The "for" property is required and should be a string.');
955
- }
956
- get menu() {
957
- const ref = this.root.getElementById(this.for);
958
- return ref && ref.localName === 'post-menu' ? ref : null;
959
- }
960
- handleToggle() {
961
- const menu = this.menu;
962
- if (menu && this.slottedButton) {
963
- this.ariaExpanded = !this.ariaExpanded;
964
- this.slottedButton.setAttribute('aria-expanded', this.ariaExpanded.toString());
965
- menu.toggle(this.host);
966
- }
967
- else {
968
- console.warn(`No post-menu found with ID: ${this.for}`);
969
- }
970
- }
971
- componentDidLoad() {
972
- this.root = getRoot.getRoot(this.host);
973
- this.validateControlFor();
974
- this.slottedButton = this.host.querySelector('button');
975
- // Check if the slottedButton is within a web component
976
- if (!this.slottedButton) {
977
- const webComponent = this.host.querySelector('.menu-trigger-webc');
978
- if (webComponent.shadowRoot) {
979
- const slottedButton = webComponent.shadowRoot.querySelector('button');
980
- if (slottedButton) {
981
- this.slottedButton = slottedButton;
982
- }
983
- }
984
- }
985
- if (this.slottedButton) {
986
- this.slottedButton.setAttribute('aria-haspopup', 'menu');
987
- this.slottedButton.addEventListener('click', () => {
988
- this.handleToggle();
989
- });
990
- this.slottedButton.addEventListener('keydown', this.handleKeyDown);
991
- }
992
- else {
993
- console.warn('No button found within post-menu-trigger');
994
- }
995
- }
996
- render() {
997
- return (index.h(index.Host, { key: '64e9e7e6448160c7b52fc732b5107e94e9776678', "data-version": _package.version, "tab-index": "-1" }, index.h("slot", { key: '711d641147cec0c26c7a3917f9302f1bbbee0d73' })));
998
- }
999
- get host() { return index.getElement(this); }
1000
- static get watchers() { return {
1001
- "for": ["validateControlFor"]
1002
- }; }
1003
- };
1004
- PostMenuTrigger.style = PostMenuTriggerStyle0;
3
+ const index = require('./index-e1f32cce.js');
4
+ const _package = require('./package-3ed88bb9.js');
1005
5
 
1006
6
  /**
1007
7
  * Custom positioning reference element.
@@ -2197,7 +1197,7 @@ function isOverflowElement(element) {
2197
1197
  overflowX,
2198
1198
  overflowY,
2199
1199
  display
2200
- } = getComputedStyle$1(element);
1200
+ } = getComputedStyle(element);
2201
1201
  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
2202
1202
  }
2203
1203
  function isTableElement(element) {
@@ -2214,7 +1214,7 @@ function isTopLayer(element) {
2214
1214
  }
2215
1215
  function isContainingBlock(elementOrCss) {
2216
1216
  const webkit = isWebKit();
2217
- const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
1217
+ const css = isElement(elementOrCss) ? getComputedStyle(elementOrCss) : elementOrCss;
2218
1218
 
2219
1219
  // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
2220
1220
  return css.transform !== 'none' || css.perspective !== 'none' || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
@@ -2238,7 +1238,7 @@ function isWebKit() {
2238
1238
  function isLastTraversableNode(node) {
2239
1239
  return ['html', 'body', '#document'].includes(getNodeName(node));
2240
1240
  }
2241
- function getComputedStyle$1(element) {
1241
+ function getComputedStyle(element) {
2242
1242
  return getWindow(element).getComputedStyle(element);
2243
1243
  }
2244
1244
  function getNodeScroll(element) {
@@ -2296,7 +1296,7 @@ function getOverflowAncestors(node, list, traverseIframes) {
2296
1296
  }
2297
1297
 
2298
1298
  function getCssDimensions(element) {
2299
- const css = getComputedStyle$1(element);
1299
+ const css = getComputedStyle(element);
2300
1300
  // In testing environments, the `width` and `height` properties are empty
2301
1301
  // strings for SVG elements, returning NaN. Fallback to `0` in this case.
2302
1302
  let width = parseFloat(css.width) || 0;
@@ -2401,7 +1401,7 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
2401
1401
  while (currentIFrame && offsetParent && offsetWin !== currentWin) {
2402
1402
  const iframeScale = getScale(currentIFrame);
2403
1403
  const iframeRect = currentIFrame.getBoundingClientRect();
2404
- const css = getComputedStyle$1(currentIFrame);
1404
+ const css = getComputedStyle(currentIFrame);
2405
1405
  const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
2406
1406
  const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
2407
1407
  x *= iframeScale.x;
@@ -2481,7 +1481,7 @@ function getDocumentRect(element) {
2481
1481
  const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
2482
1482
  let x = -scroll.scrollLeft + getWindowScrollBarX(element);
2483
1483
  const y = -scroll.scrollTop;
2484
- if (getComputedStyle$1(body).direction === 'rtl') {
1484
+ if (getComputedStyle(body).direction === 'rtl') {
2485
1485
  x += max(html.clientWidth, body.clientWidth) - width;
2486
1486
  }
2487
1487
  return {
@@ -2557,7 +1557,7 @@ function hasFixedPositionAncestor(element, stopNode) {
2557
1557
  if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
2558
1558
  return false;
2559
1559
  }
2560
- return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
1560
+ return getComputedStyle(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
2561
1561
  }
2562
1562
 
2563
1563
  // A "clipping ancestor" is an `overflow` element with the characteristic of
@@ -2570,12 +1570,12 @@ function getClippingElementAncestors(element, cache) {
2570
1570
  }
2571
1571
  let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
2572
1572
  let currentContainingBlockComputedStyle = null;
2573
- const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
1573
+ const elementIsFixed = getComputedStyle(element).position === 'fixed';
2574
1574
  let currentNode = elementIsFixed ? getParentNode(element) : element;
2575
1575
 
2576
1576
  // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
2577
1577
  while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
2578
- const computedStyle = getComputedStyle$1(currentNode);
1578
+ const computedStyle = getComputedStyle(currentNode);
2579
1579
  const currentNodeIsContaining = isContainingBlock(currentNode);
2580
1580
  if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
2581
1581
  currentContainingBlockComputedStyle = null;
@@ -2666,11 +1666,11 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
2666
1666
  }
2667
1667
 
2668
1668
  function isStaticPositioned(element) {
2669
- return getComputedStyle$1(element).position === 'static';
1669
+ return getComputedStyle(element).position === 'static';
2670
1670
  }
2671
1671
 
2672
1672
  function getTrueOffsetParent(element, polyfill) {
2673
- if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
1673
+ if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
2674
1674
  return null;
2675
1675
  }
2676
1676
  if (polyfill) {
@@ -2722,7 +1722,7 @@ const getElementRects = async function (data) {
2722
1722
  };
2723
1723
 
2724
1724
  function isRTL(element) {
2725
- return getComputedStyle$1(element).direction === 'rtl';
1725
+ return getComputedStyle(element).direction === 'rtl';
2726
1726
  }
2727
1727
 
2728
1728
  const platform = {
@@ -3041,34 +2041,40 @@ const computePosition = (reference, floating, options) => {
3041
2041
  }
3042
2042
  `,E=null;function I(e){if(E===null)try{E=new CSSStyleSheet,E.replaceSync(C);}catch{E=!1;}if(E===!1){let t=document.createElement("style");t.textContent=C,e instanceof Document?e.head.prepend(t):e.prepend(t);}else e.adoptedStyleSheets=[E,...e.adoptedStyleSheets];}function K(){window.ToggleEvent=window.ToggleEvent||c;function e(n){return n?.includes(":popover-open")&&(n=n.replace(J,"$1.\\:popover-open")),n}f(Document.prototype,"querySelector",e),f(Document.prototype,"querySelectorAll",e),f(Element.prototype,"querySelector",e),f(Element.prototype,"querySelectorAll",e),f(Element.prototype,"matches",e),f(Element.prototype,"closest",e),f(DocumentFragment.prototype,"querySelectorAll",e),f(DocumentFragment.prototype,"querySelectorAll",e),Object.defineProperties(HTMLElement.prototype,{popover:{enumerable:!0,configurable:!0,get(){if(!this.hasAttribute("popover"))return null;let n=(this.getAttribute("popover")||"").toLowerCase();return n===""||n=="auto"?"auto":"manual"},set(n){this.setAttribute("popover",n);}},showPopover:{enumerable:!0,configurable:!0,value(){S(this);}},hidePopover:{enumerable:!0,configurable:!0,value(){m(this,!0,!0);}},togglePopover:{enumerable:!0,configurable:!0,value(n){h.get(this)==="showing"&&n===void 0||n===!1?m(this,!0,!0):(n===void 0||n===!0)&&S(this);}}});let t=Element.prototype.attachShadow;t&&Object.defineProperties(Element.prototype,{attachShadow:{enumerable:!0,configurable:!0,writable:!0,value(n){let s=t.call(this,n);return I(s),s}}});let o=HTMLElement.prototype.attachInternals;o&&Object.defineProperties(HTMLElement.prototype,{attachInternals:{enumerable:!0,configurable:!0,writable:!0,value(){let n=o.call(this);return n.shadowRoot&&I(n.shadowRoot),n}}});let r=new WeakMap;function i(n){Object.defineProperties(n.prototype,{popoverTargetElement:{enumerable:!0,configurable:!0,set(s){if(s===null)this.removeAttribute("popovertarget"),r.delete(this);else if(s instanceof Element)this.setAttribute("popovertarget",""),r.set(this,s);else throw new TypeError("popoverTargetElement must be an element or null")},get(){if(this.localName!=="button"&&this.localName!=="input"||this.localName==="input"&&this.type!=="reset"&&this.type!=="image"&&this.type!=="button"||this.disabled||this.form&&this.type==="submit")return null;let s=r.get(this);if(s&&s.isConnected)return s;if(s&&!s.isConnected)return r.delete(this),null;let u=v(this),w=this.getAttribute("popovertarget");return (u instanceof Document||u instanceof B)&&w&&u.getElementById(w)||null}},popoverTargetAction:{enumerable:!0,configurable:!0,get(){let s=(this.getAttribute("popovertargetaction")||"").toLowerCase();return s==="show"||s==="hide"?s:"toggle"},set(s){this.setAttribute("popovertargetaction",s);}}});}i(HTMLButtonElement),i(HTMLInputElement);let l=n=>{if(!n.isTrusted)return;let s=n.composedPath()[0];if(!(s instanceof Element)||s?.shadowRoot)return;let u=v(s);if(!(u instanceof B||u instanceof Document))return;let w=s.closest("[popovertargetaction],[popovertarget]");if(w){O(w),n.preventDefault();return}},a=n=>{let s=n.key,u=n.target;!n.defaultPrevented&&u&&(s==="Escape"||s==="Esc")&&T(u.ownerDocument,!0,!0);};(n=>{n.addEventListener("click",l),n.addEventListener("keydown",a),n.addEventListener("pointerdown",x),n.addEventListener("pointerup",x);})(document),I(document);}j()||K();})();
3043
2043
 
3044
- const postPopovercontainerCss = "@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\\:popover-open){display:none}}}:where(post-popovercontainer){box-shadow:.5px 3px 4px rgba(0,0,0,.1),2px 4px 10px 4px rgba(0,0,0,.12);position:fixed;z-index:1060;width:max-content;margin:0;padding:0;box-sizing:border-box;color:var(--post-contrast-color);background-color:rgb(var(--post-bg-rgb));border:2px solid rgba(0,0,0,0);border-radius:4px;overflow:visible}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-left:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-right:2px solid rgba(0,0,0,0);border-top:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-left:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-right:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}";
2044
+ const postPopovercontainerCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *//*!\n * Copyright 2021 by Swiss Post, Information Technology\n */@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\\:popover-open){display:none}}}:where(post-popovercontainer){background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:where(post-popovercontainer)>div{box-shadow:.5px 3px 4px rgba(0,0,0,.1),2px 4px 10px 4px rgba(0,0,0,.12);width:max-content;display:flex;align-items:center;max-width:100%;color:var(--post-contrast-color);background-color:rgb(var(--post-bg-rgb));border:2px solid rgba(0,0,0,0);border-radius:4px}:where(post-popovercontainer)>div.animate-pop-in{animation:popIn .25s ease-out forwards}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer)[safe-space]::after{content:\"\";position:fixed;inset:0;z-index:-1;pointer-events:auto}:where(post-popovercontainer)[safe-space=triangle]::after{clip-path:polygon(var(--post-safe-space-cursor-x, 0) var(--post-safe-space-cursor-y, 0), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)))}:where(post-popovercontainer)[safe-space=trapezoid]::after{clip-path:polygon(var(--post-safe-space-trigger-x-start, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-start, 0)), var(--post-safe-space-trigger-x-end, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-end, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)))}:where(post-popovercontainer):has(.arrow)>div{filter:drop-shadow(1px 2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(2px 4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(4px 8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.top)>div{filter:drop-shadow(0px -2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(0px -4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(0px -8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.left)>div{filter:drop-shadow(-2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(-4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(-8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.right)>div{filter:drop-shadow(2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}";
3045
2045
  const PostPopovercontainerStyle0 = postPopovercontainerCss;
3046
2046
 
3047
- const SIDE_MAP = {
3048
- top: 'bottom',
3049
- right: 'left',
3050
- bottom: 'top',
3051
- left: 'right',
3052
- };
3053
2047
  const PostPopovercontainer = class {
3054
2048
  constructor(hostRef) {
3055
2049
  index.registerInstance(this, hostRef);
3056
2050
  this.postToggle = index.createEvent(this, "postToggle", 7);
3057
2051
  this.placement = 'top';
3058
2052
  this.edgeGap = 8;
2053
+ this.animation = null;
3059
2054
  this.arrow = false;
2055
+ this.safeSpace = undefined;
2056
+ }
2057
+ /**
2058
+ * Updates cursor position for safe space feature when popover is open.
2059
+ * Sets CSS custom properties for dynamic styling of safe area.
2060
+ * @param event MouseEvent with cursor position
2061
+ */
2062
+ mouseTrackingHandler(event) {
2063
+ this.host.style.setProperty('--post-safe-space-cursor-x', `${event.clientX}px`);
2064
+ this.host.style.setProperty('--post-safe-space-cursor-y', `${event.clientY}px`);
3060
2065
  }
3061
2066
  componentDidLoad() {
3062
2067
  this.host.setAttribute('popover', '');
3063
2068
  this.host.addEventListener('beforetoggle', this.handleToggle.bind(this));
3064
2069
  }
3065
2070
  disconnectedCallback() {
3066
- if (typeof this.clearAutoUpdate === 'function')
2071
+ if (typeof this.clearAutoUpdate === 'function') {
3067
2072
  this.clearAutoUpdate();
2073
+ }
3068
2074
  }
3069
2075
  /**
3070
- * Programmatically display the tooltip
3071
- * @param target An element with [data-tooltip-target="id"] where the tooltip should be shown
2076
+ * Programmatically display the popovercontainer
2077
+ * @param target An element with [data-popover-target="id"] where the popovercontainer should be shown
3072
2078
  */
3073
2079
  async show(target) {
3074
2080
  if (!this.toggleTimeoutId) {
@@ -3078,7 +2084,7 @@ const PostPopovercontainer = class {
3078
2084
  }
3079
2085
  }
3080
2086
  /**
3081
- * Programmatically hide this tooltip
2087
+ * Programmatically hide the popovercontainer
3082
2088
  */
3083
2089
  async hide() {
3084
2090
  if (!this.toggleTimeoutId) {
@@ -3087,8 +2093,8 @@ const PostPopovercontainer = class {
3087
2093
  }
3088
2094
  }
3089
2095
  /**
3090
- * Toggle tooltip display
3091
- * @param target An element with [data-tooltip-target="id"] where the tooltip should be shown
2096
+ * Toggle popovercontainer display
2097
+ * @param target An element with [data-popover-target="id"] where the popovercontainer should be shown
3092
2098
  * @param force Pass true to always show or false to always hide
3093
2099
  */
3094
2100
  async toggle(target, force) {
@@ -3099,11 +2105,11 @@ const PostPopovercontainer = class {
3099
2105
  this.host.togglePopover(force);
3100
2106
  this.toggleTimeoutId = null;
3101
2107
  }
3102
- return this.host.matches(':where(:popover-open, .popover-open');
2108
+ return this.host.matches(':where(:popover-open, .popover-open)');
3103
2109
  }
3104
2110
  /**
3105
- * Start or stop auto updates based on tooltip events.
3106
- * Tooltips can be closed or opened with other methods than class members,
2111
+ * Start or stop auto updates based on popovercontainer events.
2112
+ * Popovercontainers can be closed or opened with other methods than class members,
3107
2113
  * therefore listening to the toggle event is safer for cleaning up.
3108
2114
  * @param e ToggleEvent
3109
2115
  */
@@ -3112,29 +2118,54 @@ const PostPopovercontainer = class {
3112
2118
  const isOpen = e.newState === 'open';
3113
2119
  if (isOpen) {
3114
2120
  this.startAutoupdates();
2121
+ if (this.safeSpace)
2122
+ window.addEventListener('mousemove', this.mouseTrackingHandler.bind(this));
3115
2123
  }
3116
2124
  else {
3117
2125
  if (typeof this.clearAutoUpdate === 'function')
3118
2126
  this.clearAutoUpdate();
2127
+ if (this.safeSpace)
2128
+ window.removeEventListener('mousemove', this.mouseTrackingHandler.bind(this));
3119
2129
  }
3120
2130
  this.postToggle.emit(isOpen);
3121
2131
  }
3122
2132
  /**
3123
2133
  * Start listening for DOM updates, scroll events etc. that have
3124
- * an influence on tooltip positioning
2134
+ * an influence on popovercontainer positioning
3125
2135
  */
3126
2136
  startAutoupdates() {
3127
2137
  this.clearAutoUpdate = autoUpdate(this.eventTarget, this.host, this.calculatePosition.bind(this));
3128
2138
  }
3129
2139
  async calculatePosition() {
2140
+ const { x, y, middlewareData, placement } = await this.computeMainPosition();
2141
+ const currentPlacement = placement.split('-')[0];
2142
+ // Position popover
2143
+ this.host.style.left = `${x}px`;
2144
+ this.host.style.top = `${y}px`;
2145
+ // Position arrow if enabled
2146
+ if (this.arrow && middlewareData.arrow) {
2147
+ const { x: arrowX, y: arrowY } = middlewareData.arrow;
2148
+ const staticSide = PostPopovercontainer.STATIC_SIDES[currentPlacement];
2149
+ if (staticSide) {
2150
+ Object.assign(this.arrowRef.style, {
2151
+ left: arrowX ? `${arrowX}px` : '',
2152
+ top: arrowY ? `${arrowY}px` : '',
2153
+ [staticSide]: '-7px',
2154
+ });
2155
+ }
2156
+ }
2157
+ // Handle safe space if enabled
2158
+ if (this.safeSpace && this.eventTarget) {
2159
+ await this.updateSafeSpaceBoundaries(currentPlacement);
2160
+ }
2161
+ }
2162
+ async computeMainPosition() {
3130
2163
  const gap = this.edgeGap;
3131
2164
  const middleware = [
3132
2165
  flip(),
3133
2166
  inline(),
3134
2167
  shift({
3135
2168
  padding: gap,
3136
- // Prevents shifting away from the anchor too far, while shifting as far as possible
3137
- // https://floating-ui.com/docs/shift#limiter
3138
2169
  limiter: limitShift({
3139
2170
  offset: 32,
3140
2171
  }),
@@ -3146,94 +2177,105 @@ const PostPopovercontainer = class {
3146
2177
  });
3147
2178
  },
3148
2179
  }),
3149
- offset(this.arrow ? gap + 4 : gap), // 4px outside of element to account for focus outline + ~arrow size
2180
+ offset(this.arrow ? gap + 4 : gap),
3150
2181
  ];
3151
2182
  if (this.arrow) {
3152
2183
  middleware.push(arrow({ element: this.arrowRef, padding: gap }));
3153
2184
  }
3154
- const { x, y, middlewareData, placement: currentPlacement, } = await computePosition(this.eventTarget, this.host, {
2185
+ return computePosition(this.eventTarget, this.host, {
3155
2186
  placement: this.placement || 'top',
3156
2187
  strategy: 'fixed',
3157
2188
  middleware,
3158
2189
  });
3159
- // Tooltip
3160
- this.host.style.left = `${x}px`;
3161
- this.host.style.top = `${y}px`;
3162
- // Arrow
3163
- if (this.arrow) {
3164
- // Tutorial: https://codesandbox.io/s/mystifying-kare-ee3hmh?file=/src/index.js
3165
- const side = currentPlacement.split('-')[0];
3166
- const { x: arrowX, y: arrowY } = middlewareData.arrow;
3167
- const staticSide = SIDE_MAP[side];
3168
- const offsetBorderLineJoin = 2;
3169
- Object.assign(this.arrowRef.style, {
3170
- top: arrowY ? `${arrowY}px` : '',
3171
- left: arrowX ? `${arrowX}px` : '',
3172
- [staticSide]: `${-this.arrowRef.offsetWidth / 2 - offsetBorderLineJoin}px`,
3173
- });
3174
- // Add position as a class to be able to style arrow for HCM
3175
- this.arrowRef.classList.remove(...Object.values(SIDE_MAP));
3176
- this.arrowRef.classList.add(staticSide);
2190
+ }
2191
+ async updateSafeSpaceBoundaries(currentPlacement) {
2192
+ const targetRect = this.eventTarget.getBoundingClientRect();
2193
+ const popoverRect = this.host.getBoundingClientRect();
2194
+ const isVertical = currentPlacement === 'top' || currentPlacement === 'bottom';
2195
+ // Helper function to get positioning data based on placement
2196
+ const getPositioningData = (placement, popoverRect, targetRect) => {
2197
+ if (placement === 'top' || placement === 'bottom') {
2198
+ return {
2199
+ popover: {
2200
+ y: placement === 'top' ? popoverRect.bottom : popoverRect.top,
2201
+ xStart: popoverRect.left,
2202
+ xEnd: popoverRect.right,
2203
+ },
2204
+ trigger: {
2205
+ y: placement === 'top' ? targetRect.top : targetRect.bottom,
2206
+ xStart: targetRect.left,
2207
+ xEnd: targetRect.right,
2208
+ },
2209
+ };
2210
+ }
2211
+ else {
2212
+ // left or right
2213
+ return {
2214
+ popover: {
2215
+ x: placement === 'left' ? popoverRect.right : popoverRect.left,
2216
+ yStart: popoverRect.top,
2217
+ yEnd: popoverRect.bottom,
2218
+ },
2219
+ trigger: {
2220
+ x: placement === 'left' ? targetRect.left : targetRect.right,
2221
+ yStart: targetRect.top,
2222
+ yEnd: targetRect.bottom,
2223
+ },
2224
+ };
2225
+ }
2226
+ };
2227
+ const posData = getPositioningData(currentPlacement, popoverRect, targetRect);
2228
+ // Clear previous values
2229
+ PostPopovercontainer.PROPERTIES_TO_CLEAR.forEach(prop => {
2230
+ this.host.style.removeProperty(prop);
2231
+ });
2232
+ if (isVertical) {
2233
+ // For top/bottom placement
2234
+ this.host.style.setProperty('--post-safe-space-popover-y', `${posData.popover.y}px`);
2235
+ this.host.style.setProperty('--post-safe-space-popover-x-start', `${posData.popover.xStart}px`);
2236
+ this.host.style.setProperty('--post-safe-space-popover-x-end', `${posData.popover.xEnd}px`);
2237
+ this.host.style.setProperty('--post-safe-space-trigger-y', `${posData.trigger.y}px`);
2238
+ this.host.style.setProperty('--post-safe-space-trigger-x-start', `${posData.trigger.xStart}px`);
2239
+ this.host.style.setProperty('--post-safe-space-trigger-x-end', `${posData.trigger.xEnd}px`);
2240
+ }
2241
+ else {
2242
+ // For left/right placement
2243
+ this.host.style.setProperty('--post-safe-space-popover-x', `${posData.popover.x}px`);
2244
+ this.host.style.setProperty('--post-safe-space-popover-y-start', `${posData.popover.yStart}px`);
2245
+ this.host.style.setProperty('--post-safe-space-popover-y-end', `${posData.popover.yEnd}px`);
2246
+ this.host.style.setProperty('--post-safe-space-trigger-x', `${posData.trigger.x}px`);
2247
+ this.host.style.setProperty('--post-safe-space-trigger-y-start', `${posData.trigger.yStart}px`);
2248
+ this.host.style.setProperty('--post-safe-space-trigger-y-end', `${posData.trigger.yEnd}px`);
3177
2249
  }
3178
2250
  }
3179
2251
  render() {
3180
- return (index.h(index.Host, { key: '23e391236e263f7ae7c66c994b2847bcba269b37', "data-version": _package.version }, this.arrow && (index.h("span", { key: '6c6053b2fd315a5940a2c3493182249782b2492c', class: "arrow", ref: el => {
2252
+ const animationClass = this.animation ? `animate-${this.animation}` : '';
2253
+ return (index.h(index.Host, { key: '98ea26b46803e8aa98cc2cec53798d994c0ff856', "data-version": _package.version }, index.h("div", { key: '230fa7df2963b36e67a4559f07010f7213240e3c', class: animationClass }, this.arrow && (index.h("span", { key: '58647eb14ef84ff04b04b7dec0bbb38b9bcd4b69', class: "arrow", ref: el => {
3181
2254
  this.arrowRef = el;
3182
- } })), index.h("slot", { key: 'ff998f110f42a22e886eba398285c41d94718bab' })));
2255
+ } })), index.h("slot", { key: 'de0afc53f013ac7d4cdd06e0e2d7746a8e0971dc' }))));
3183
2256
  }
3184
2257
  get host() { return index.getElement(this); }
3185
2258
  };
2259
+ PostPopovercontainer.STATIC_SIDES = {
2260
+ top: 'bottom',
2261
+ right: 'left',
2262
+ bottom: 'top',
2263
+ left: 'right',
2264
+ };
2265
+ PostPopovercontainer.PROPERTIES_TO_CLEAR = [
2266
+ '--post-safe-space-popover-x',
2267
+ '--post-safe-space-popover-y',
2268
+ '--post-safe-space-popover-x-start',
2269
+ '--post-safe-space-popover-x-end',
2270
+ '--post-safe-space-popover-y-start',
2271
+ '--post-safe-space-popover-y-end',
2272
+ '--post-safe-space-trigger-x',
2273
+ '--post-safe-space-trigger-y',
2274
+ '--post-safe-space-trigger-x-start',
2275
+ '--post-safe-space-trigger-x-end',
2276
+ '--post-safe-space-trigger-y-start',
2277
+ '--post-safe-space-trigger-y-end',
2278
+ ];
3186
2279
  PostPopovercontainer.style = PostPopovercontainerStyle0;
3187
2280
 
3188
- const postTogglebuttonCss = ":host{cursor:pointer;outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}:host(:focus-visible){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host(:focus-visible){outline-color:Highlight !important}}:host([aria-pressed=true]) ::slotted([data-showwhen=untoggled]){display:none}:host([aria-pressed=false]) ::slotted([data-showwhen=toggled]){display:none}";
3189
- const PostTogglebuttonStyle0 = postTogglebuttonCss;
3190
-
3191
- const PostTogglebutton = class {
3192
- constructor(hostRef) {
3193
- index.registerInstance(this, hostRef);
3194
- this.handleClick = () => {
3195
- this.toggled = !this.toggled;
3196
- };
3197
- this.handleKeydown = (event) => {
3198
- // perform a click when enter or spaced are pressed to mimic the button behavior
3199
- if (event.key === 'Enter' || event.key === ' ') {
3200
- event.preventDefault(); // prevents the page from scrolling when space is pressed
3201
- this.host.click();
3202
- }
3203
- };
3204
- this.toggled = false;
3205
- }
3206
- validateToggled(value = this.toggled) {
3207
- checkType.checkType(value, 'boolean', 'The "toggled" property of the post-togglebutton must be a boolean.');
3208
- }
3209
- componentWillLoad() {
3210
- this.validateToggled();
3211
- // add event listener to not override listener that might be set on the host
3212
- this.host.addEventListener('click', () => this.handleClick());
3213
- this.host.addEventListener('keydown', (e) => this.handleKeydown(e));
3214
- }
3215
- render() {
3216
- return (index.h(index.Host, { key: 'f20b7e5f7cd14c1b0addf12600df27e7e5dab841', slot: "post-togglebutton", "data-version": _package.version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, index.h("slot", { key: '526540ce9a66fa08f0142e674811fe88e3abcfa6' })));
3217
- }
3218
- get host() { return index.getElement(this); }
3219
- static get watchers() { return {
3220
- "toggled": ["validateToggled"]
3221
- }; }
3222
- };
3223
- PostTogglebutton.style = PostTogglebuttonStyle0;
3224
-
3225
- exports.PostClosebutton = PostClosebutton;
3226
- exports.PostHeader = PostHeader;
3227
- exports.PostIcon = PostIcon;
3228
- exports.PostLanguageOption = PostLanguageOption;
3229
- exports.PostLanguageSwitch = PostLanguageSwitch;
3230
- exports.PostList = PostList;
3231
- exports.PostListItem = PostListItem;
3232
- exports.PostLogo = PostLogo;
3233
- exports.PostMainnavigation = PostMainnavigation;
3234
- exports.PostMegadropdown = PostMegadropdown;
3235
- exports.PostMegadropdownTrigger = PostMegadropdownTrigger;
3236
- exports.PostMenu = PostMenu;
3237
- exports.PostMenuTrigger = PostMenuTrigger;
3238
2281
  exports.PostPopovercontainer = PostPopovercontainer;
3239
- exports.PostTogglebutton = PostTogglebutton;