@swisspost/design-system-components 9.0.0-next.9 → 10.0.0-next.37

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 (516) hide show
  1. package/dist/.config/bindings.angular.js +4 -0
  2. package/dist/cjs/breakpoints-cdf1b747.js +59 -0
  3. package/dist/cjs/check-non-empty-bd99d236.js +15 -0
  4. package/dist/cjs/check-one-of-75d270b5.js +13 -0
  5. package/dist/cjs/check-type-cdbf6d29.js +21 -0
  6. package/dist/cjs/check-url-220a286c.js +19 -0
  7. package/dist/cjs/event-guard-efabc84f.js +47 -0
  8. package/dist/cjs/fade-72d5ef55.js +14 -0
  9. package/dist/cjs/get-root-8102fecd.js +17 -0
  10. package/dist/cjs/index-23e36ff7.js +37 -0
  11. package/dist/cjs/{index-010dc207.js → index-b60129c4.js} +17 -10
  12. package/dist/cjs/index.browser-4af21c17.js +16 -0
  13. package/dist/cjs/index.cjs.js +36 -31
  14. package/dist/cjs/loader.cjs.js +2 -2
  15. package/dist/cjs/long-press-event-6e62d113.js +266 -0
  16. package/dist/cjs/{package-8e810a59.js → package-8121f093.js} +1 -1
  17. package/dist/cjs/{post-accordion-b9df8522.js → post-accordion-beac7c9f.js} +11 -12
  18. package/dist/cjs/post-accordion-item-4846fbee.js +64 -0
  19. package/dist/cjs/post-accordion-item.cjs.entry.js +10 -7
  20. package/dist/cjs/post-accordion.cjs.entry.js +6 -4
  21. package/dist/cjs/{post-avatar-f7236084.js → post-avatar-a36991fb.js} +10 -13
  22. package/dist/cjs/post-avatar.cjs.entry.js +5 -4
  23. package/dist/cjs/post-back-to-top-32aa9017.js +96 -0
  24. package/dist/cjs/post-back-to-top.cjs.entry.js +7 -6
  25. package/dist/cjs/post-banner-be0e8909.js +92 -0
  26. package/dist/cjs/post-banner.cjs.entry.js +11 -9
  27. package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +8 -7
  28. package/dist/cjs/post-breadcrumbs-6ef82a41.js +120 -0
  29. package/dist/cjs/post-breadcrumbs.cjs.entry.js +13 -0
  30. package/dist/cjs/post-card-control-fe919333.js +269 -0
  31. package/dist/cjs/post-card-control.cjs.entry.js +6 -5
  32. package/dist/cjs/post-closebutton_15.cjs.entry.js +13 -10
  33. package/dist/cjs/{post-collapsible-trigger-143cf84a.js → post-collapsible-trigger-f42be607.js} +59 -60
  34. package/dist/cjs/post-collapsible_2.cjs.entry.js +11 -10
  35. package/dist/cjs/post-components.cjs.js +2 -2
  36. package/dist/cjs/{post-footer-5f7fdf96.js → post-footer-5179aa17.js} +11 -57
  37. package/dist/cjs/post-footer.cjs.entry.js +4 -3
  38. package/dist/cjs/post-linkarea-27125078.js +30 -0
  39. package/dist/cjs/post-linkarea.cjs.entry.js +11 -0
  40. package/dist/cjs/{post-menu-item-bb0b0b9e.js → post-menu-item-d78a9121.js} +11 -17
  41. package/dist/cjs/post-popover-feb1e773.js +135 -0
  42. package/dist/cjs/post-popover.cjs.entry.js +4 -4
  43. package/dist/cjs/{post-rating-1082197c.js → post-rating-6d153a2c.js} +4 -4
  44. package/dist/cjs/post-rating.cjs.entry.js +3 -3
  45. package/dist/cjs/post-tab-header-e4532918.js +34 -0
  46. package/dist/cjs/post-tab-header.cjs.entry.js +6 -4
  47. package/dist/cjs/{post-tab-panel-60f211a5.js → post-tab-panel-40df21ad.js} +5 -4
  48. package/dist/cjs/post-tab-panel.cjs.entry.js +4 -3
  49. package/dist/cjs/{post-tabs-1f797ce4.js → post-tabs-45db2696.js} +13 -15
  50. package/dist/cjs/post-tabs.cjs.entry.js +5 -4
  51. package/dist/cjs/post-tag-0967bb1e.js +47 -0
  52. package/dist/cjs/post-tag.cjs.entry.js +3 -3
  53. package/dist/cjs/post-togglebutton-42b7d166.js +4494 -0
  54. package/dist/cjs/post-tooltip-f833d51d.js +73 -0
  55. package/dist/cjs/{post-tooltip-38c839a4.js → post-tooltip-trigger-3ceac010.js} +143 -456
  56. package/dist/cjs/post-tooltip-trigger.cjs.entry.js +13 -0
  57. package/dist/cjs/post-tooltip.cjs.entry.js +5 -9
  58. package/dist/cjs/{slide-5d51abe8.js → slide-cd1f09b3.js} +8 -8
  59. package/dist/collection/animations/collapse.js +8 -6
  60. package/dist/collection/animations/fade.js +6 -2
  61. package/dist/collection/animations/slide.js +8 -8
  62. package/dist/collection/collection-manifest.json +5 -3
  63. package/dist/collection/components/post-accordion/post-accordion.css +1 -1
  64. package/dist/collection/components/post-accordion/post-accordion.js +6 -8
  65. package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
  66. package/dist/collection/components/post-accordion-item/post-accordion-item.js +12 -12
  67. package/dist/collection/components/post-avatar/post-avatar.css +1 -3
  68. package/dist/collection/components/post-avatar/post-avatar.js +7 -11
  69. package/dist/collection/components/post-back-to-top/post-back-to-top.css +1 -1
  70. package/dist/collection/components/post-back-to-top/post-back-to-top.js +38 -18
  71. package/dist/collection/components/post-banner/post-banner.css +1 -3
  72. package/dist/collection/components/post-banner/post-banner.js +13 -12
  73. package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +11 -8
  74. package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.css +1 -0
  75. package/dist/collection/components/{post-breadcrumb/post-breadcrumb.js → post-breadcrumbs/post-breadcrumbs.js} +20 -21
  76. package/dist/collection/components/post-card-control/post-card-control.css +1 -3
  77. package/dist/collection/components/post-card-control/post-card-control.js +15 -19
  78. package/dist/collection/components/post-closebutton/post-closebutton.css +1 -0
  79. package/dist/collection/components/post-closebutton/post-closebutton.js +12 -1
  80. package/dist/collection/components/post-collapsible/post-collapsible.css +1 -1
  81. package/dist/collection/components/post-collapsible/post-collapsible.js +3 -2
  82. package/dist/collection/components/post-collapsible-trigger/post-collapsible-trigger.js +43 -45
  83. package/dist/collection/components/post-footer/post-footer.js +8 -8
  84. package/dist/collection/components/post-header/post-header.css +1 -1
  85. package/dist/collection/components/post-header/post-header.js +212 -52
  86. package/dist/collection/components/post-icon/post-icon.css +1 -1
  87. package/dist/collection/components/post-icon/post-icon.js +71 -29
  88. package/dist/collection/components/post-language-option/post-language-option.css +1 -3
  89. package/dist/collection/components/post-language-option/post-language-option.js +34 -12
  90. package/dist/collection/components/post-language-switch/post-language-switch.css +1 -1
  91. package/dist/collection/components/post-language-switch/post-language-switch.js +56 -33
  92. package/dist/collection/components/post-language-switch/switch-variants.js +1 -1
  93. package/dist/collection/components/post-linkarea/post-linkarea.css +1 -0
  94. package/dist/collection/components/post-linkarea/post-linkarea.js +30 -0
  95. package/dist/collection/components/post-list/post-list.css +1 -3
  96. package/dist/collection/components/post-list/post-list.js +4 -3
  97. package/dist/collection/components/post-list-item/post-list-item.js +2 -1
  98. package/dist/collection/components/post-logo/post-logo.css +1 -1
  99. package/dist/collection/components/post-logo/post-logo.js +2 -2
  100. package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
  101. package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +157 -25
  102. package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
  103. package/dist/collection/components/post-megadropdown/post-megadropdown.js +179 -55
  104. package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.css +1 -1
  105. package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +41 -12
  106. package/dist/collection/components/post-menu/post-menu.css +1 -3
  107. package/dist/collection/components/post-menu/post-menu.js +44 -30
  108. package/dist/collection/components/post-menu-item/post-menu-item.js +1 -13
  109. package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +16 -10
  110. package/dist/collection/components/post-popover/post-popover.css +1 -3
  111. package/dist/collection/components/post-popover/post-popover.js +23 -16
  112. package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
  113. package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +217 -56
  114. package/dist/collection/components/post-rating/post-rating.css +1 -3
  115. package/dist/collection/components/post-rating/post-rating.js +1 -1
  116. package/dist/collection/components/post-tab-header/post-tab-header.css +1 -3
  117. package/dist/collection/components/post-tab-header/post-tab-header.js +6 -5
  118. package/dist/collection/components/post-tab-panel/post-tab-panel.js +4 -3
  119. package/dist/collection/components/post-tabs/post-tabs.css +1 -1
  120. package/dist/collection/components/post-tabs/post-tabs.js +6 -14
  121. package/dist/collection/components/post-tag/post-tag.css +1 -3
  122. package/dist/collection/components/post-tag/post-tag.js +2 -2
  123. package/dist/collection/components/post-togglebutton/post-togglebutton.js +3 -3
  124. package/dist/collection/components/post-tooltip/post-tooltip.css +1 -1
  125. package/dist/collection/components/post-tooltip/post-tooltip.js +62 -212
  126. package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.css +1 -0
  127. package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js +230 -0
  128. package/dist/collection/index.js +3 -1
  129. package/dist/collection/utils/attribute-observer.js +6 -5
  130. package/dist/collection/utils/breakpoints.js +21 -15
  131. package/dist/collection/utils/component-on-ready.js +4 -4
  132. package/dist/collection/utils/debounce.js +2 -1
  133. package/dist/collection/utils/environment.js +2 -0
  134. package/dist/collection/utils/event-guard.js +43 -0
  135. package/dist/collection/utils/{is-focusable.js → get-focusable-children.js} +10 -3
  136. package/dist/collection/utils/get-root.js +6 -1
  137. package/dist/collection/utils/index.js +5 -0
  138. package/dist/collection/utils/is-motion-reduced.js +2 -1
  139. package/dist/collection/utils/property-checkers/check-non-empty.js +6 -2
  140. package/dist/collection/utils/property-checkers/check-one-of.js +8 -3
  141. package/dist/collection/utils/property-checkers/check-pattern.js +8 -3
  142. package/dist/collection/utils/property-checkers/check-type.js +11 -6
  143. package/dist/collection/utils/property-checkers/check-url.js +11 -6
  144. package/dist/collection/utils/property-checkers/empty-or.js +5 -2
  145. package/dist/collection/utils/sass-export.js +8 -5
  146. package/dist/components/breakpoints.js +56 -0
  147. package/dist/components/check-non-empty.js +6 -2
  148. package/dist/components/check-one-of.js +8 -3
  149. package/dist/components/check-type.js +11 -6
  150. package/dist/components/event-guard.js +45 -0
  151. package/dist/components/fade.js +6 -2
  152. package/dist/components/get-focusable-children.js +35 -0
  153. package/dist/components/get-root.js +7 -1
  154. package/dist/components/index.browser.js +14 -0
  155. package/dist/components/index.js +3 -1
  156. package/dist/components/index2.js +24 -11
  157. package/dist/components/long-press-event.js +264 -0
  158. package/dist/components/package.js +1 -1
  159. package/dist/components/post-accordion-item2.js +14 -13
  160. package/dist/components/post-accordion2.js +8 -9
  161. package/dist/components/post-avatar2.js +8 -11
  162. package/dist/components/post-back-to-top2.js +41 -20
  163. package/dist/components/post-banner2.js +15 -13
  164. package/dist/components/post-breadcrumb-item2.js +9 -9
  165. package/dist/components/post-breadcrumbs.d.ts +11 -0
  166. package/dist/components/post-breadcrumbs.js +6 -0
  167. package/dist/components/post-breadcrumbs2.js +177 -0
  168. package/dist/components/post-card-control2.js +16 -19
  169. package/dist/components/post-closebutton2.js +7 -2
  170. package/dist/components/post-collapsible-trigger2.js +46 -48
  171. package/dist/components/post-collapsible2.js +13 -10
  172. package/dist/components/post-footer2.js +8 -54
  173. package/dist/components/post-header2.js +174 -51
  174. package/dist/components/post-icon2.js +72 -29
  175. package/dist/components/post-language-option2.js +21 -12
  176. package/dist/components/post-language-switch2.js +44 -45
  177. package/dist/components/{post-breadcrumb.d.ts → post-linkarea.d.ts} +4 -4
  178. package/dist/components/post-linkarea.js +6 -0
  179. package/dist/components/post-linkarea2.js +43 -0
  180. package/dist/components/post-list-item2.js +2 -1
  181. package/dist/components/post-list2.js +5 -4
  182. package/dist/components/post-logo2.js +4 -3
  183. package/dist/components/post-mainnavigation2.js +150 -15
  184. package/dist/components/post-megadropdown-trigger2.js +43 -13
  185. package/dist/components/post-megadropdown2.js +136 -39
  186. package/dist/components/post-menu-item2.js +2 -8
  187. package/dist/components/post-menu-trigger2.js +17 -10
  188. package/dist/components/post-menu2.js +43 -54
  189. package/dist/components/post-popover2.js +46 -15
  190. package/dist/components/post-popovercontainer2.js +921 -111
  191. package/dist/components/post-rating2.js +2 -2
  192. package/dist/components/post-tab-header2.js +8 -6
  193. package/dist/components/post-tab-panel2.js +4 -3
  194. package/dist/components/post-tabs2.js +10 -12
  195. package/dist/components/post-tag2.js +2 -2
  196. package/dist/components/post-togglebutton2.js +4 -3
  197. package/dist/components/post-tooltip-trigger.d.ts +11 -0
  198. package/dist/components/post-tooltip-trigger.js +6 -0
  199. package/dist/components/post-tooltip-trigger2.js +4705 -0
  200. package/dist/components/post-tooltip2.js +34 -4960
  201. package/dist/components/slide.js +9 -9
  202. package/dist/docs.json +567 -252
  203. package/dist/esm/breakpoints-7812702e.js +56 -0
  204. package/dist/esm/check-non-empty-258a56b3.js +13 -0
  205. package/dist/esm/check-one-of-0bee20f5.js +11 -0
  206. package/dist/esm/check-type-37d5d307.js +19 -0
  207. package/dist/esm/check-url-17962bc8.js +17 -0
  208. package/dist/esm/event-guard-538ee077.js +45 -0
  209. package/dist/esm/fade-1f3cacf4.js +11 -0
  210. package/dist/esm/get-root-1b1af46f.js +15 -0
  211. package/dist/esm/index-8f8fe5b0.js +32 -0
  212. package/dist/esm/{index-fb8d6be7.js → index-f4d19816.js} +17 -10
  213. package/dist/esm/index.browser-ff103197.js +14 -0
  214. package/dist/esm/index.js +33 -30
  215. package/dist/esm/loader.js +3 -3
  216. package/dist/esm/long-press-event-04d24397.js +264 -0
  217. package/dist/esm/package-d9237b44.js +3 -0
  218. package/dist/esm/{post-accordion-ee54a3ef.js → post-accordion-fdcf7205.js} +11 -12
  219. package/dist/esm/post-accordion-item-e11e3804.js +62 -0
  220. package/dist/esm/post-accordion-item.entry.js +10 -7
  221. package/dist/esm/post-accordion.entry.js +6 -4
  222. package/dist/esm/{post-avatar-5572fa73.js → post-avatar-d360c6d2.js} +10 -13
  223. package/dist/esm/post-avatar.entry.js +5 -4
  224. package/dist/esm/post-back-to-top-85796c8b.js +94 -0
  225. package/dist/esm/post-back-to-top.entry.js +7 -6
  226. package/dist/esm/post-banner-a3090f67.js +90 -0
  227. package/dist/esm/post-banner.entry.js +11 -9
  228. package/dist/esm/post-breadcrumb-item_2.entry.js +8 -7
  229. package/dist/esm/post-breadcrumbs-15ec5a26.js +118 -0
  230. package/dist/esm/post-breadcrumbs.entry.js +5 -0
  231. package/dist/esm/post-card-control-6142534e.js +267 -0
  232. package/dist/esm/post-card-control.entry.js +6 -5
  233. package/dist/esm/post-closebutton_15.entry.js +13 -10
  234. package/dist/esm/{post-collapsible-trigger-1c7833f8.js → post-collapsible-trigger-68306358.js} +59 -60
  235. package/dist/esm/post-collapsible_2.entry.js +11 -10
  236. package/dist/esm/post-components.js +3 -3
  237. package/dist/esm/{post-footer-b18875e7.js → post-footer-d2a3270e.js} +10 -56
  238. package/dist/esm/post-footer.entry.js +4 -3
  239. package/dist/esm/post-linkarea-64998c67.js +28 -0
  240. package/dist/esm/post-linkarea.entry.js +3 -0
  241. package/dist/esm/{post-menu-item-2906384b.js → post-menu-item-95a0a647.js} +11 -17
  242. package/dist/esm/post-popover-c5f81087.js +133 -0
  243. package/dist/esm/post-popover.entry.js +4 -4
  244. package/dist/esm/{post-rating-95cbdbb8.js → post-rating-7bfedafb.js} +4 -4
  245. package/dist/esm/post-rating.entry.js +3 -3
  246. package/dist/esm/post-tab-header-08033da4.js +32 -0
  247. package/dist/esm/post-tab-header.entry.js +6 -4
  248. package/dist/esm/{post-tab-panel-cafd9e04.js → post-tab-panel-be701793.js} +5 -4
  249. package/dist/esm/post-tab-panel.entry.js +4 -3
  250. package/dist/esm/{post-tabs-beef8eae.js → post-tabs-c69e2842.js} +13 -15
  251. package/dist/esm/post-tabs.entry.js +5 -4
  252. package/dist/esm/post-tag-ebac7f3e.js +45 -0
  253. package/dist/esm/post-tag.entry.js +3 -3
  254. package/dist/esm/post-togglebutton-706e3af0.js +4478 -0
  255. package/dist/esm/post-tooltip-9a195d47.js +71 -0
  256. package/dist/esm/{post-tooltip-b298039a.js → post-tooltip-trigger-7d6f234b.js} +143 -456
  257. package/dist/esm/post-tooltip-trigger.entry.js +5 -0
  258. package/dist/esm/post-tooltip.entry.js +5 -9
  259. package/dist/esm/{slide-3422b8a3.js → slide-cd2850ee.js} +9 -9
  260. package/dist/post-components/index.esm.js +1 -1
  261. package/dist/post-components/p-034715ec.js +1 -0
  262. package/dist/post-components/p-0717fe4c.js +1 -0
  263. package/dist/post-components/p-0889c759.js +1 -0
  264. package/dist/post-components/p-0c03547b.js +1 -0
  265. package/dist/post-components/p-0de8d05f.js +1 -0
  266. package/dist/post-components/p-1373a79b.entry.js +1 -0
  267. package/dist/post-components/{p-4f9746f6.js → p-17dc4170.js} +2 -9
  268. package/dist/post-components/p-181c73d5.js +1 -0
  269. package/dist/post-components/p-1a21fd8d.js +1 -0
  270. package/dist/post-components/p-1ab3eba4.entry.js +1 -0
  271. package/dist/post-components/p-2d6c0670.js +1 -0
  272. package/dist/post-components/p-2dc0a2d0.js +1 -0
  273. package/dist/post-components/p-35ad2e11.entry.js +1 -0
  274. package/dist/post-components/p-368c473a.js +1 -0
  275. package/dist/post-components/p-38f778a7.entry.js +1 -0
  276. package/dist/post-components/p-39a8df3c.entry.js +1 -0
  277. package/dist/post-components/p-3c7f6003.js +1 -0
  278. package/dist/post-components/p-474a41bc.entry.js +1 -0
  279. package/dist/post-components/p-64e3de38.js +1 -0
  280. package/dist/post-components/p-69bc8eaf.entry.js +1 -0
  281. package/dist/post-components/p-6b31a76a.js +1 -0
  282. package/dist/post-components/p-722ffaae.js +1 -0
  283. package/dist/post-components/p-72310bf0.entry.js +1 -0
  284. package/dist/post-components/p-7709c14a.js +1 -0
  285. package/dist/post-components/p-804b61b7.entry.js +1 -0
  286. package/dist/post-components/p-85fdc2d3.js +1 -0
  287. package/dist/post-components/p-89247caa.js +1 -0
  288. package/dist/post-components/p-89dc67c7.entry.js +1 -0
  289. package/dist/post-components/p-8db32dab.js +8 -0
  290. package/dist/post-components/p-8f7f5200.entry.js +1 -0
  291. package/dist/post-components/p-964f9581.js +1 -0
  292. package/dist/post-components/p-9b052461.js +1 -0
  293. package/dist/post-components/{p-c0ae9886.js → p-9e461613.js} +2 -2
  294. package/dist/post-components/p-a52b2d34.js +1 -0
  295. package/dist/post-components/p-ab566526.js +1 -0
  296. package/dist/post-components/p-b648e537.entry.js +1 -0
  297. package/dist/post-components/p-bc33a6d9.js +1 -0
  298. package/dist/post-components/p-bcfdbd0b.entry.js +1 -0
  299. package/dist/post-components/p-beb67979.js +1 -0
  300. package/dist/post-components/p-c41868b1.js +1 -0
  301. package/dist/post-components/p-c65f32b0.js +1 -0
  302. package/dist/post-components/p-c71700a7.js +1 -0
  303. package/dist/post-components/p-cb027003.js +1 -0
  304. package/dist/post-components/p-cc5b1437.js +1 -0
  305. package/dist/post-components/p-ceda889e.entry.js +1 -0
  306. package/dist/post-components/p-d45df336.js +1 -0
  307. package/dist/post-components/p-de4d4274.js +1 -0
  308. package/dist/post-components/p-deb9efcf.entry.js +1 -0
  309. package/dist/post-components/p-e585c6fe.js +1 -0
  310. package/dist/post-components/p-e9f1cc46.entry.js +1 -0
  311. package/dist/post-components/p-ee4e776d.entry.js +1 -0
  312. package/dist/post-components/p-ee7c3bcc.entry.js +1 -0
  313. package/dist/post-components/p-f56482fa.entry.js +1 -0
  314. package/dist/post-components/p-f8c652ce.entry.js +1 -0
  315. package/dist/post-components/post-components.esm.js +1 -1
  316. package/dist/types/animations/collapse.d.ts +2 -2
  317. package/dist/types/animations/fade.d.ts +2 -2
  318. package/dist/types/animations/slide.d.ts +2 -2
  319. package/dist/types/components/post-accordion-item/post-accordion-item.d.ts +1 -1
  320. package/dist/types/components/post-avatar/post-avatar.d.ts +1 -1
  321. package/dist/types/components/post-back-to-top/post-back-to-top.d.ts +4 -2
  322. package/dist/types/components/post-banner/post-banner.d.ts +5 -5
  323. package/dist/types/components/post-breadcrumb-item/post-breadcrumb-item.d.ts +4 -0
  324. package/dist/types/components/{post-breadcrumb/post-breadcrumb.d.ts → post-breadcrumbs/post-breadcrumbs.d.ts} +4 -4
  325. package/dist/types/components/post-card-control/post-card-control.d.ts +3 -3
  326. package/dist/types/components/post-collapsible-trigger/post-collapsible-trigger.d.ts +9 -14
  327. package/dist/types/components/post-footer/post-footer.d.ts +2 -2
  328. package/dist/types/components/post-header/post-header.d.ts +38 -10
  329. package/dist/types/components/post-icon/post-icon.d.ts +11 -7
  330. package/dist/types/components/post-language-option/post-language-option.d.ts +9 -5
  331. package/dist/types/components/post-language-switch/post-language-switch.d.ts +16 -8
  332. package/dist/types/components/post-language-switch/switch-variants.d.ts +1 -1
  333. package/dist/types/components/post-linkarea/post-linkarea.d.ts +5 -0
  334. package/dist/types/components/post-mainnavigation/post-mainnavigation.d.ts +36 -9
  335. package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +37 -13
  336. package/dist/types/components/post-megadropdown-trigger/post-megadropdown-trigger.d.ts +9 -1
  337. package/dist/types/components/post-menu/post-menu.d.ts +4 -3
  338. package/dist/types/components/post-menu-item/post-menu-item.d.ts +0 -1
  339. package/dist/types/components/post-menu-trigger/post-menu-trigger.d.ts +4 -3
  340. package/dist/types/components/post-popover/post-popover.d.ts +6 -4
  341. package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +40 -14
  342. package/dist/types/components/post-tab-header/post-tab-header.d.ts +1 -1
  343. package/dist/types/components/post-tabs/post-tabs.d.ts +1 -1
  344. package/dist/types/components/post-tag/post-tag.d.ts +1 -1
  345. package/dist/types/components/post-togglebutton/post-togglebutton.d.ts +1 -1
  346. package/dist/types/components/post-tooltip/post-tooltip.d.ts +21 -34
  347. package/dist/types/components/post-tooltip-trigger/post-tooltip-trigger.d.ts +46 -0
  348. package/dist/types/components.d.ts +181 -94
  349. package/dist/types/home/runner/work/design-system/design-system/packages/components/.stencil/.config/bindings.angular.d.ts +2 -0
  350. package/dist/types/index.d.ts +5 -3
  351. package/dist/types/popover-fn.d.ts +11 -0
  352. package/dist/types/utils/attribute-observer.d.ts +1 -1
  353. package/dist/types/utils/breakpoints.d.ts +1 -0
  354. package/dist/types/utils/component-on-ready.d.ts +1 -1
  355. package/dist/types/utils/environment.d.ts +2 -0
  356. package/dist/types/utils/event-guard.d.ts +4 -0
  357. package/dist/types/utils/get-focusable-children.d.ts +1 -0
  358. package/dist/types/utils/get-root.d.ts +5 -1
  359. package/dist/types/utils/index.d.ts +5 -0
  360. package/dist/types/utils/property-checkers/check-non-empty.d.ts +3 -1
  361. package/dist/types/utils/property-checkers/check-one-of.d.ts +3 -1
  362. package/dist/types/utils/property-checkers/check-pattern.d.ts +3 -1
  363. package/dist/types/utils/property-checkers/check-type.d.ts +3 -1
  364. package/dist/types/utils/property-checkers/check-url.d.ts +3 -1
  365. package/dist/types/utils/property-checkers/index.d.ts +12 -4
  366. package/dist/types/utils/sass-export.d.ts +5 -1
  367. package/loaders/breakpoints.js +56 -0
  368. package/loaders/check-non-empty.js +6 -2
  369. package/loaders/check-one-of.js +8 -3
  370. package/loaders/check-type.js +11 -6
  371. package/loaders/event-guard.js +45 -0
  372. package/loaders/fade.js +6 -2
  373. package/loaders/get-focusable-children.js +35 -0
  374. package/loaders/get-root.js +7 -1
  375. package/loaders/index.browser.js +14 -0
  376. package/loaders/index.d.ts +6 -2
  377. package/loaders/index.js +8 -5
  378. package/loaders/index2.js +25 -12
  379. package/loaders/long-press-event.js +264 -0
  380. package/loaders/package.js +1 -1
  381. package/loaders/post-accordion-item2.js +15 -14
  382. package/loaders/post-accordion.js +8 -9
  383. package/loaders/post-avatar.js +8 -11
  384. package/loaders/post-back-to-top.js +41 -20
  385. package/loaders/post-banner.js +16 -14
  386. package/loaders/post-breadcrumb-item2.js +9 -9
  387. package/loaders/post-breadcrumbs.d.ts +11 -0
  388. package/loaders/post-breadcrumbs.js +180 -0
  389. package/loaders/post-card-control.js +16 -19
  390. package/loaders/post-closebutton.js +7 -2
  391. package/loaders/post-collapsible-trigger2.js +46 -48
  392. package/loaders/post-collapsible2.js +14 -11
  393. package/loaders/post-footer.js +8 -54
  394. package/loaders/post-header.js +174 -51
  395. package/loaders/post-icon2.js +73 -30
  396. package/loaders/post-language-option.js +22 -13
  397. package/loaders/post-language-switch.js +45 -46
  398. package/loaders/{post-breadcrumb.d.ts → post-linkarea.d.ts} +4 -4
  399. package/loaders/post-linkarea.js +46 -0
  400. package/loaders/post-list-item.js +2 -1
  401. package/loaders/post-list.js +5 -4
  402. package/loaders/post-logo.js +4 -3
  403. package/loaders/post-mainnavigation.js +150 -15
  404. package/loaders/post-megadropdown-trigger.js +43 -13
  405. package/loaders/post-megadropdown.js +136 -39
  406. package/loaders/post-menu-item2.js +2 -8
  407. package/loaders/post-menu-trigger2.js +17 -10
  408. package/loaders/post-menu2.js +43 -54
  409. package/loaders/post-popover.js +46 -15
  410. package/loaders/post-popovercontainer2.js +921 -111
  411. package/loaders/post-rating.js +2 -2
  412. package/loaders/post-tab-header.js +8 -6
  413. package/loaders/post-tab-panel.js +4 -3
  414. package/loaders/post-tabs.js +10 -12
  415. package/loaders/post-tag.js +2 -2
  416. package/loaders/post-togglebutton.js +4 -3
  417. package/loaders/post-tooltip-trigger.d.ts +11 -0
  418. package/loaders/post-tooltip-trigger.js +4708 -0
  419. package/loaders/post-tooltip.js +34 -4960
  420. package/loaders/slide.js +9 -9
  421. package/package.json +41 -32
  422. package/dist/cjs/attribute-observer-10f08c04.js +0 -27
  423. package/dist/cjs/check-non-empty-eeaa8f77.js +0 -11
  424. package/dist/cjs/check-one-of-f4f5d0c0.js +0 -8
  425. package/dist/cjs/check-type-64af82a9.js +0 -16
  426. package/dist/cjs/check-url-3ffdd2fb.js +0 -14
  427. package/dist/cjs/debounce-1151afe3.js +0 -12
  428. package/dist/cjs/fade-35a3633a.js +0 -10
  429. package/dist/cjs/get-root-7a3498ef.js +0 -11
  430. package/dist/cjs/index-5d4e0aed.js +0 -29
  431. package/dist/cjs/post-accordion-item-ecc6749f.js +0 -63
  432. package/dist/cjs/post-back-to-top-60762f8e.js +0 -75
  433. package/dist/cjs/post-banner-9662f22c.js +0 -90
  434. package/dist/cjs/post-breadcrumb-b40732fc.js +0 -111
  435. package/dist/cjs/post-breadcrumb.cjs.entry.js +0 -13
  436. package/dist/cjs/post-card-control-039c9a4b.js +0 -272
  437. package/dist/cjs/post-popover-d0ce9dc6.js +0 -104
  438. package/dist/cjs/post-tab-header-4b6d8d54.js +0 -32
  439. package/dist/cjs/post-tag-ddaaaedc.js +0 -47
  440. package/dist/cjs/post-togglebutton-0984a694.js +0 -3239
  441. package/dist/collection/components/post-breadcrumb/post-breadcrumb.css +0 -3
  442. package/dist/collection/components/post-menu-item/post-menu-item.css +0 -1
  443. package/dist/components/attribute-observer.js +0 -25
  444. package/dist/components/debounce.js +0 -10
  445. package/dist/components/post-breadcrumb.js +0 -6
  446. package/dist/components/post-breadcrumb2.js +0 -168
  447. package/dist/esm/attribute-observer-37fa950a.js +0 -25
  448. package/dist/esm/check-non-empty-58bd6b17.js +0 -9
  449. package/dist/esm/check-one-of-6b3ef8eb.js +0 -6
  450. package/dist/esm/check-type-8828dbe4.js +0 -14
  451. package/dist/esm/check-url-a974431e.js +0 -12
  452. package/dist/esm/debounce-abe98cc2.js +0 -10
  453. package/dist/esm/fade-7fd71785.js +0 -7
  454. package/dist/esm/get-root-7af2e0d1.js +0 -9
  455. package/dist/esm/index-b49c9904.js +0 -24
  456. package/dist/esm/package-4d81f3c2.js +0 -3
  457. package/dist/esm/post-accordion-item-e10452dc.js +0 -61
  458. package/dist/esm/post-back-to-top-1d823c43.js +0 -73
  459. package/dist/esm/post-banner-78480475.js +0 -88
  460. package/dist/esm/post-breadcrumb-aaa77f74.js +0 -109
  461. package/dist/esm/post-breadcrumb.entry.js +0 -5
  462. package/dist/esm/post-card-control-862aa961.js +0 -270
  463. package/dist/esm/post-popover-2432bb3f.js +0 -102
  464. package/dist/esm/post-tab-header-dfea00ea.js +0 -30
  465. package/dist/esm/post-tag-a77e7af6.js +0 -45
  466. package/dist/esm/post-togglebutton-395bf3f0.js +0 -3223
  467. package/dist/post-components/p-0711f76d.entry.js +0 -1
  468. package/dist/post-components/p-095a06f6.entry.js +0 -1
  469. package/dist/post-components/p-0b5a5f32.js +0 -1
  470. package/dist/post-components/p-135fa60f.js +0 -1
  471. package/dist/post-components/p-18e38d8a.js +0 -1
  472. package/dist/post-components/p-2737eaf5.js +0 -1
  473. package/dist/post-components/p-2e1ec074.entry.js +0 -1
  474. package/dist/post-components/p-4202b433.entry.js +0 -1
  475. package/dist/post-components/p-45773f59.js +0 -1
  476. package/dist/post-components/p-4953de7e.js +0 -1
  477. package/dist/post-components/p-4a3f67ab.js +0 -1
  478. package/dist/post-components/p-4f67c5f5.entry.js +0 -1
  479. package/dist/post-components/p-5075c672.entry.js +0 -1
  480. package/dist/post-components/p-515e0f96.js +0 -1
  481. package/dist/post-components/p-5467b223.js +0 -1
  482. package/dist/post-components/p-611b3c41.js +0 -1
  483. package/dist/post-components/p-67036798.entry.js +0 -1
  484. package/dist/post-components/p-6adeaa6c.js +0 -1
  485. package/dist/post-components/p-6d953fb2.js +0 -1
  486. package/dist/post-components/p-6edb0ac5.js +0 -1
  487. package/dist/post-components/p-6f8f39ca.js +0 -1
  488. package/dist/post-components/p-7503a623.js +0 -1
  489. package/dist/post-components/p-761b24c7.entry.js +0 -1
  490. package/dist/post-components/p-77c4c1d2.js +0 -1
  491. package/dist/post-components/p-7cf0c2ad.js +0 -1
  492. package/dist/post-components/p-856c14d6.entry.js +0 -1
  493. package/dist/post-components/p-866bf50a.entry.js +0 -1
  494. package/dist/post-components/p-8d621781.js +0 -1
  495. package/dist/post-components/p-8fe2d72c.entry.js +0 -1
  496. package/dist/post-components/p-9ad5088f.entry.js +0 -1
  497. package/dist/post-components/p-a1d2b90e.js +0 -1
  498. package/dist/post-components/p-a521419d.entry.js +0 -1
  499. package/dist/post-components/p-aa538648.js +0 -1
  500. package/dist/post-components/p-afdbee2f.js +0 -1
  501. package/dist/post-components/p-b02817f2.entry.js +0 -1
  502. package/dist/post-components/p-b095519d.js +0 -1
  503. package/dist/post-components/p-b157dcba.entry.js +0 -1
  504. package/dist/post-components/p-b22656b1.js +0 -1
  505. package/dist/post-components/p-bdbd11cb.js +0 -1
  506. package/dist/post-components/p-c537e196.entry.js +0 -1
  507. package/dist/post-components/p-d4f93f2b.js +0 -1
  508. package/dist/post-components/p-dca4246a.entry.js +0 -1
  509. package/dist/post-components/p-f319b026.js +0 -1
  510. package/dist/post-components/p-f4b7b379.js +0 -1
  511. package/dist/post-components/p-fac66087.entry.js +0 -1
  512. package/dist/post-components/p-fc91cbc2.js +0 -1
  513. package/dist/types/utils/is-focusable.d.ts +0 -1
  514. package/loaders/attribute-observer.js +0 -25
  515. package/loaders/debounce.js +0 -10
  516. package/loaders/post-breadcrumb.js +0 -171
@@ -1,3239 +0,0 @@
1
- 'use strict';
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;
1005
-
1006
- /**
1007
- * Custom positioning reference element.
1008
- * @see https://floating-ui.com/docs/virtual-elements
1009
- */
1010
-
1011
- const sides = ['top', 'right', 'bottom', 'left'];
1012
- const alignments = ['start', 'end'];
1013
- const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
1014
- const min = Math.min;
1015
- const max = Math.max;
1016
- const round = Math.round;
1017
- const floor = Math.floor;
1018
- const createCoords = v => ({
1019
- x: v,
1020
- y: v
1021
- });
1022
- const oppositeSideMap = {
1023
- left: 'right',
1024
- right: 'left',
1025
- bottom: 'top',
1026
- top: 'bottom'
1027
- };
1028
- const oppositeAlignmentMap = {
1029
- start: 'end',
1030
- end: 'start'
1031
- };
1032
- function clamp(start, value, end) {
1033
- return max(start, min(value, end));
1034
- }
1035
- function evaluate(value, param) {
1036
- return typeof value === 'function' ? value(param) : value;
1037
- }
1038
- function getSide(placement) {
1039
- return placement.split('-')[0];
1040
- }
1041
- function getAlignment(placement) {
1042
- return placement.split('-')[1];
1043
- }
1044
- function getOppositeAxis(axis) {
1045
- return axis === 'x' ? 'y' : 'x';
1046
- }
1047
- function getAxisLength(axis) {
1048
- return axis === 'y' ? 'height' : 'width';
1049
- }
1050
- function getSideAxis(placement) {
1051
- return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x';
1052
- }
1053
- function getAlignmentAxis(placement) {
1054
- return getOppositeAxis(getSideAxis(placement));
1055
- }
1056
- function getAlignmentSides(placement, rects, rtl) {
1057
- if (rtl === void 0) {
1058
- rtl = false;
1059
- }
1060
- const alignment = getAlignment(placement);
1061
- const alignmentAxis = getAlignmentAxis(placement);
1062
- const length = getAxisLength(alignmentAxis);
1063
- let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
1064
- if (rects.reference[length] > rects.floating[length]) {
1065
- mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
1066
- }
1067
- return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
1068
- }
1069
- function getExpandedPlacements(placement) {
1070
- const oppositePlacement = getOppositePlacement(placement);
1071
- return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
1072
- }
1073
- function getOppositeAlignmentPlacement(placement) {
1074
- return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
1075
- }
1076
- function getSideList(side, isStart, rtl) {
1077
- const lr = ['left', 'right'];
1078
- const rl = ['right', 'left'];
1079
- const tb = ['top', 'bottom'];
1080
- const bt = ['bottom', 'top'];
1081
- switch (side) {
1082
- case 'top':
1083
- case 'bottom':
1084
- if (rtl) return isStart ? rl : lr;
1085
- return isStart ? lr : rl;
1086
- case 'left':
1087
- case 'right':
1088
- return isStart ? tb : bt;
1089
- default:
1090
- return [];
1091
- }
1092
- }
1093
- function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
1094
- const alignment = getAlignment(placement);
1095
- let list = getSideList(getSide(placement), direction === 'start', rtl);
1096
- if (alignment) {
1097
- list = list.map(side => side + "-" + alignment);
1098
- if (flipAlignment) {
1099
- list = list.concat(list.map(getOppositeAlignmentPlacement));
1100
- }
1101
- }
1102
- return list;
1103
- }
1104
- function getOppositePlacement(placement) {
1105
- return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
1106
- }
1107
- function expandPaddingObject(padding) {
1108
- return {
1109
- top: 0,
1110
- right: 0,
1111
- bottom: 0,
1112
- left: 0,
1113
- ...padding
1114
- };
1115
- }
1116
- function getPaddingObject(padding) {
1117
- return typeof padding !== 'number' ? expandPaddingObject(padding) : {
1118
- top: padding,
1119
- right: padding,
1120
- bottom: padding,
1121
- left: padding
1122
- };
1123
- }
1124
- function rectToClientRect(rect) {
1125
- const {
1126
- x,
1127
- y,
1128
- width,
1129
- height
1130
- } = rect;
1131
- return {
1132
- width,
1133
- height,
1134
- top: y,
1135
- left: x,
1136
- right: x + width,
1137
- bottom: y + height,
1138
- x,
1139
- y
1140
- };
1141
- }
1142
-
1143
- function computeCoordsFromPlacement(_ref, placement, rtl) {
1144
- let {
1145
- reference,
1146
- floating
1147
- } = _ref;
1148
- const sideAxis = getSideAxis(placement);
1149
- const alignmentAxis = getAlignmentAxis(placement);
1150
- const alignLength = getAxisLength(alignmentAxis);
1151
- const side = getSide(placement);
1152
- const isVertical = sideAxis === 'y';
1153
- const commonX = reference.x + reference.width / 2 - floating.width / 2;
1154
- const commonY = reference.y + reference.height / 2 - floating.height / 2;
1155
- const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
1156
- let coords;
1157
- switch (side) {
1158
- case 'top':
1159
- coords = {
1160
- x: commonX,
1161
- y: reference.y - floating.height
1162
- };
1163
- break;
1164
- case 'bottom':
1165
- coords = {
1166
- x: commonX,
1167
- y: reference.y + reference.height
1168
- };
1169
- break;
1170
- case 'right':
1171
- coords = {
1172
- x: reference.x + reference.width,
1173
- y: commonY
1174
- };
1175
- break;
1176
- case 'left':
1177
- coords = {
1178
- x: reference.x - floating.width,
1179
- y: commonY
1180
- };
1181
- break;
1182
- default:
1183
- coords = {
1184
- x: reference.x,
1185
- y: reference.y
1186
- };
1187
- }
1188
- switch (getAlignment(placement)) {
1189
- case 'start':
1190
- coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
1191
- break;
1192
- case 'end':
1193
- coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
1194
- break;
1195
- }
1196
- return coords;
1197
- }
1198
-
1199
- /**
1200
- * Computes the `x` and `y` coordinates that will place the floating element
1201
- * next to a given reference element.
1202
- *
1203
- * This export does not have any `platform` interface logic. You will need to
1204
- * write one for the platform you are using Floating UI with.
1205
- */
1206
- const computePosition$1 = async (reference, floating, config) => {
1207
- const {
1208
- placement = 'bottom',
1209
- strategy = 'absolute',
1210
- middleware = [],
1211
- platform
1212
- } = config;
1213
- const validMiddleware = middleware.filter(Boolean);
1214
- const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
1215
- let rects = await platform.getElementRects({
1216
- reference,
1217
- floating,
1218
- strategy
1219
- });
1220
- let {
1221
- x,
1222
- y
1223
- } = computeCoordsFromPlacement(rects, placement, rtl);
1224
- let statefulPlacement = placement;
1225
- let middlewareData = {};
1226
- let resetCount = 0;
1227
- for (let i = 0; i < validMiddleware.length; i++) {
1228
- const {
1229
- name,
1230
- fn
1231
- } = validMiddleware[i];
1232
- const {
1233
- x: nextX,
1234
- y: nextY,
1235
- data,
1236
- reset
1237
- } = await fn({
1238
- x,
1239
- y,
1240
- initialPlacement: placement,
1241
- placement: statefulPlacement,
1242
- strategy,
1243
- middlewareData,
1244
- rects,
1245
- platform,
1246
- elements: {
1247
- reference,
1248
- floating
1249
- }
1250
- });
1251
- x = nextX != null ? nextX : x;
1252
- y = nextY != null ? nextY : y;
1253
- middlewareData = {
1254
- ...middlewareData,
1255
- [name]: {
1256
- ...middlewareData[name],
1257
- ...data
1258
- }
1259
- };
1260
- if (reset && resetCount <= 50) {
1261
- resetCount++;
1262
- if (typeof reset === 'object') {
1263
- if (reset.placement) {
1264
- statefulPlacement = reset.placement;
1265
- }
1266
- if (reset.rects) {
1267
- rects = reset.rects === true ? await platform.getElementRects({
1268
- reference,
1269
- floating,
1270
- strategy
1271
- }) : reset.rects;
1272
- }
1273
- ({
1274
- x,
1275
- y
1276
- } = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
1277
- }
1278
- i = -1;
1279
- }
1280
- }
1281
- return {
1282
- x,
1283
- y,
1284
- placement: statefulPlacement,
1285
- strategy,
1286
- middlewareData
1287
- };
1288
- };
1289
-
1290
- /**
1291
- * Resolves with an object of overflow side offsets that determine how much the
1292
- * element is overflowing a given clipping boundary on each side.
1293
- * - positive = overflowing the boundary by that number of pixels
1294
- * - negative = how many pixels left before it will overflow
1295
- * - 0 = lies flush with the boundary
1296
- * @see https://floating-ui.com/docs/detectOverflow
1297
- */
1298
- async function detectOverflow(state, options) {
1299
- var _await$platform$isEle;
1300
- if (options === void 0) {
1301
- options = {};
1302
- }
1303
- const {
1304
- x,
1305
- y,
1306
- platform,
1307
- rects,
1308
- elements,
1309
- strategy
1310
- } = state;
1311
- const {
1312
- boundary = 'clippingAncestors',
1313
- rootBoundary = 'viewport',
1314
- elementContext = 'floating',
1315
- altBoundary = false,
1316
- padding = 0
1317
- } = evaluate(options, state);
1318
- const paddingObject = getPaddingObject(padding);
1319
- const altContext = elementContext === 'floating' ? 'reference' : 'floating';
1320
- const element = elements[altBoundary ? altContext : elementContext];
1321
- const clippingClientRect = rectToClientRect(await platform.getClippingRect({
1322
- element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
1323
- boundary,
1324
- rootBoundary,
1325
- strategy
1326
- }));
1327
- const rect = elementContext === 'floating' ? {
1328
- ...rects.floating,
1329
- x,
1330
- y
1331
- } : rects.reference;
1332
- const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
1333
- const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
1334
- x: 1,
1335
- y: 1
1336
- } : {
1337
- x: 1,
1338
- y: 1
1339
- };
1340
- const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
1341
- elements,
1342
- rect,
1343
- offsetParent,
1344
- strategy
1345
- }) : rect);
1346
- return {
1347
- top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
1348
- bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
1349
- left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
1350
- right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
1351
- };
1352
- }
1353
-
1354
- /**
1355
- * Provides data to position an inner element of the floating element so that it
1356
- * appears centered to the reference element.
1357
- * @see https://floating-ui.com/docs/arrow
1358
- */
1359
- const arrow$1 = options => ({
1360
- name: 'arrow',
1361
- options,
1362
- async fn(state) {
1363
- const {
1364
- x,
1365
- y,
1366
- placement,
1367
- rects,
1368
- platform,
1369
- elements,
1370
- middlewareData
1371
- } = state;
1372
- // Since `element` is required, we don't Partial<> the type.
1373
- const {
1374
- element,
1375
- padding = 0
1376
- } = evaluate(options, state) || {};
1377
- if (element == null) {
1378
- return {};
1379
- }
1380
- const paddingObject = getPaddingObject(padding);
1381
- const coords = {
1382
- x,
1383
- y
1384
- };
1385
- const axis = getAlignmentAxis(placement);
1386
- const length = getAxisLength(axis);
1387
- const arrowDimensions = await platform.getDimensions(element);
1388
- const isYAxis = axis === 'y';
1389
- const minProp = isYAxis ? 'top' : 'left';
1390
- const maxProp = isYAxis ? 'bottom' : 'right';
1391
- const clientProp = isYAxis ? 'clientHeight' : 'clientWidth';
1392
- const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
1393
- const startDiff = coords[axis] - rects.reference[axis];
1394
- const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
1395
- let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
1396
-
1397
- // DOM platform can return `window` as the `offsetParent`.
1398
- if (!clientSize || !(await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent)))) {
1399
- clientSize = elements.floating[clientProp] || rects.floating[length];
1400
- }
1401
- const centerToReference = endDiff / 2 - startDiff / 2;
1402
-
1403
- // If the padding is large enough that it causes the arrow to no longer be
1404
- // centered, modify the padding so that it is centered.
1405
- const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
1406
- const minPadding = min(paddingObject[minProp], largestPossiblePadding);
1407
- const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
1408
-
1409
- // Make sure the arrow doesn't overflow the floating element if the center
1410
- // point is outside the floating element's bounds.
1411
- const min$1 = minPadding;
1412
- const max = clientSize - arrowDimensions[length] - maxPadding;
1413
- const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
1414
- const offset = clamp(min$1, center, max);
1415
-
1416
- // If the reference is small enough that the arrow's padding causes it to
1417
- // to point to nothing for an aligned placement, adjust the offset of the
1418
- // floating element itself. To ensure `shift()` continues to take action,
1419
- // a single reset is performed when this is true.
1420
- const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
1421
- const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
1422
- return {
1423
- [axis]: coords[axis] + alignmentOffset,
1424
- data: {
1425
- [axis]: offset,
1426
- centerOffset: center - offset - alignmentOffset,
1427
- ...(shouldAddOffset && {
1428
- alignmentOffset
1429
- })
1430
- },
1431
- reset: shouldAddOffset
1432
- };
1433
- }
1434
- });
1435
-
1436
- function getPlacementList(alignment, autoAlignment, allowedPlacements) {
1437
- const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
1438
- return allowedPlacementsSortedByAlignment.filter(placement => {
1439
- if (alignment) {
1440
- return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
1441
- }
1442
- return true;
1443
- });
1444
- }
1445
- /**
1446
- * Optimizes the visibility of the floating element by choosing the placement
1447
- * that has the most space available automatically, without needing to specify a
1448
- * preferred placement. Alternative to `flip`.
1449
- * @see https://floating-ui.com/docs/autoPlacement
1450
- */
1451
- const autoPlacement = function (options) {
1452
- if (options === void 0) {
1453
- options = {};
1454
- }
1455
- return {
1456
- name: 'autoPlacement',
1457
- options,
1458
- async fn(state) {
1459
- var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
1460
- const {
1461
- rects,
1462
- middlewareData,
1463
- placement,
1464
- platform,
1465
- elements
1466
- } = state;
1467
- const {
1468
- crossAxis = false,
1469
- alignment,
1470
- allowedPlacements = placements,
1471
- autoAlignment = true,
1472
- ...detectOverflowOptions
1473
- } = evaluate(options, state);
1474
- const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
1475
- const overflow = await detectOverflow(state, detectOverflowOptions);
1476
- const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
1477
- const currentPlacement = placements$1[currentIndex];
1478
- if (currentPlacement == null) {
1479
- return {};
1480
- }
1481
- const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
1482
-
1483
- // Make `computeCoords` start from the right place.
1484
- if (placement !== currentPlacement) {
1485
- return {
1486
- reset: {
1487
- placement: placements$1[0]
1488
- }
1489
- };
1490
- }
1491
- const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
1492
- const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
1493
- placement: currentPlacement,
1494
- overflows: currentOverflows
1495
- }];
1496
- const nextPlacement = placements$1[currentIndex + 1];
1497
-
1498
- // There are more placements to check.
1499
- if (nextPlacement) {
1500
- return {
1501
- data: {
1502
- index: currentIndex + 1,
1503
- overflows: allOverflows
1504
- },
1505
- reset: {
1506
- placement: nextPlacement
1507
- }
1508
- };
1509
- }
1510
- const placementsSortedByMostSpace = allOverflows.map(d => {
1511
- const alignment = getAlignment(d.placement);
1512
- return [d.placement, alignment && crossAxis ?
1513
- // Check along the mainAxis and main crossAxis side.
1514
- d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
1515
- // Check only the mainAxis.
1516
- d.overflows[0], d.overflows];
1517
- }).sort((a, b) => a[1] - b[1]);
1518
- const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
1519
- // Aligned placements should not check their opposite crossAxis
1520
- // side.
1521
- getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
1522
- const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
1523
- if (resetPlacement !== placement) {
1524
- return {
1525
- data: {
1526
- index: currentIndex + 1,
1527
- overflows: allOverflows
1528
- },
1529
- reset: {
1530
- placement: resetPlacement
1531
- }
1532
- };
1533
- }
1534
- return {};
1535
- }
1536
- };
1537
- };
1538
-
1539
- /**
1540
- * Optimizes the visibility of the floating element by flipping the `placement`
1541
- * in order to keep it in view when the preferred placement(s) will overflow the
1542
- * clipping boundary. Alternative to `autoPlacement`.
1543
- * @see https://floating-ui.com/docs/flip
1544
- */
1545
- const flip$1 = function (options) {
1546
- if (options === void 0) {
1547
- options = {};
1548
- }
1549
- return {
1550
- name: 'flip',
1551
- options,
1552
- async fn(state) {
1553
- var _middlewareData$arrow, _middlewareData$flip;
1554
- const {
1555
- placement,
1556
- middlewareData,
1557
- rects,
1558
- initialPlacement,
1559
- platform,
1560
- elements
1561
- } = state;
1562
- const {
1563
- mainAxis: checkMainAxis = true,
1564
- crossAxis: checkCrossAxis = true,
1565
- fallbackPlacements: specifiedFallbackPlacements,
1566
- fallbackStrategy = 'bestFit',
1567
- fallbackAxisSideDirection = 'none',
1568
- flipAlignment = true,
1569
- ...detectOverflowOptions
1570
- } = evaluate(options, state);
1571
-
1572
- // If a reset by the arrow was caused due to an alignment offset being
1573
- // added, we should skip any logic now since `flip()` has already done its
1574
- // work.
1575
- // https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
1576
- if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
1577
- return {};
1578
- }
1579
- const side = getSide(placement);
1580
- const isBasePlacement = getSide(initialPlacement) === initialPlacement;
1581
- const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
1582
- const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
1583
- if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
1584
- fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
1585
- }
1586
- const placements = [initialPlacement, ...fallbackPlacements];
1587
- const overflow = await detectOverflow(state, detectOverflowOptions);
1588
- const overflows = [];
1589
- let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
1590
- if (checkMainAxis) {
1591
- overflows.push(overflow[side]);
1592
- }
1593
- if (checkCrossAxis) {
1594
- const sides = getAlignmentSides(placement, rects, rtl);
1595
- overflows.push(overflow[sides[0]], overflow[sides[1]]);
1596
- }
1597
- overflowsData = [...overflowsData, {
1598
- placement,
1599
- overflows
1600
- }];
1601
-
1602
- // One or more sides is overflowing.
1603
- if (!overflows.every(side => side <= 0)) {
1604
- var _middlewareData$flip2, _overflowsData$filter;
1605
- const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
1606
- const nextPlacement = placements[nextIndex];
1607
- if (nextPlacement) {
1608
- // Try next placement and re-run the lifecycle.
1609
- return {
1610
- data: {
1611
- index: nextIndex,
1612
- overflows: overflowsData
1613
- },
1614
- reset: {
1615
- placement: nextPlacement
1616
- }
1617
- };
1618
- }
1619
-
1620
- // First, find the candidates that fit on the mainAxis side of overflow,
1621
- // then find the placement that fits the best on the main crossAxis side.
1622
- let resetPlacement = (_overflowsData$filter = overflowsData.filter(d => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
1623
-
1624
- // Otherwise fallback.
1625
- if (!resetPlacement) {
1626
- switch (fallbackStrategy) {
1627
- case 'bestFit':
1628
- {
1629
- var _overflowsData$map$so;
1630
- const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
1631
- if (placement) {
1632
- resetPlacement = placement;
1633
- }
1634
- break;
1635
- }
1636
- case 'initialPlacement':
1637
- resetPlacement = initialPlacement;
1638
- break;
1639
- }
1640
- }
1641
- if (placement !== resetPlacement) {
1642
- return {
1643
- reset: {
1644
- placement: resetPlacement
1645
- }
1646
- };
1647
- }
1648
- }
1649
- return {};
1650
- }
1651
- };
1652
- };
1653
-
1654
- function getSideOffsets(overflow, rect) {
1655
- return {
1656
- top: overflow.top - rect.height,
1657
- right: overflow.right - rect.width,
1658
- bottom: overflow.bottom - rect.height,
1659
- left: overflow.left - rect.width
1660
- };
1661
- }
1662
- function isAnySideFullyClipped(overflow) {
1663
- return sides.some(side => overflow[side] >= 0);
1664
- }
1665
- /**
1666
- * Provides data to hide the floating element in applicable situations, such as
1667
- * when it is not in the same clipping context as the reference element.
1668
- * @see https://floating-ui.com/docs/hide
1669
- */
1670
- const hide = function (options) {
1671
- if (options === void 0) {
1672
- options = {};
1673
- }
1674
- return {
1675
- name: 'hide',
1676
- options,
1677
- async fn(state) {
1678
- const {
1679
- rects
1680
- } = state;
1681
- const {
1682
- strategy = 'referenceHidden',
1683
- ...detectOverflowOptions
1684
- } = evaluate(options, state);
1685
- switch (strategy) {
1686
- case 'referenceHidden':
1687
- {
1688
- const overflow = await detectOverflow(state, {
1689
- ...detectOverflowOptions,
1690
- elementContext: 'reference'
1691
- });
1692
- const offsets = getSideOffsets(overflow, rects.reference);
1693
- return {
1694
- data: {
1695
- referenceHiddenOffsets: offsets,
1696
- referenceHidden: isAnySideFullyClipped(offsets)
1697
- }
1698
- };
1699
- }
1700
- case 'escaped':
1701
- {
1702
- const overflow = await detectOverflow(state, {
1703
- ...detectOverflowOptions,
1704
- altBoundary: true
1705
- });
1706
- const offsets = getSideOffsets(overflow, rects.floating);
1707
- return {
1708
- data: {
1709
- escapedOffsets: offsets,
1710
- escaped: isAnySideFullyClipped(offsets)
1711
- }
1712
- };
1713
- }
1714
- default:
1715
- {
1716
- return {};
1717
- }
1718
- }
1719
- }
1720
- };
1721
- };
1722
-
1723
- function getBoundingRect(rects) {
1724
- const minX = min(...rects.map(rect => rect.left));
1725
- const minY = min(...rects.map(rect => rect.top));
1726
- const maxX = max(...rects.map(rect => rect.right));
1727
- const maxY = max(...rects.map(rect => rect.bottom));
1728
- return {
1729
- x: minX,
1730
- y: minY,
1731
- width: maxX - minX,
1732
- height: maxY - minY
1733
- };
1734
- }
1735
- function getRectsByLine(rects) {
1736
- const sortedRects = rects.slice().sort((a, b) => a.y - b.y);
1737
- const groups = [];
1738
- let prevRect = null;
1739
- for (let i = 0; i < sortedRects.length; i++) {
1740
- const rect = sortedRects[i];
1741
- if (!prevRect || rect.y - prevRect.y > prevRect.height / 2) {
1742
- groups.push([rect]);
1743
- } else {
1744
- groups[groups.length - 1].push(rect);
1745
- }
1746
- prevRect = rect;
1747
- }
1748
- return groups.map(rect => rectToClientRect(getBoundingRect(rect)));
1749
- }
1750
- /**
1751
- * Provides improved positioning for inline reference elements that can span
1752
- * over multiple lines, such as hyperlinks or range selections.
1753
- * @see https://floating-ui.com/docs/inline
1754
- */
1755
- const inline$1 = function (options) {
1756
- if (options === void 0) {
1757
- options = {};
1758
- }
1759
- return {
1760
- name: 'inline',
1761
- options,
1762
- async fn(state) {
1763
- const {
1764
- placement,
1765
- elements,
1766
- rects,
1767
- platform,
1768
- strategy
1769
- } = state;
1770
- // A MouseEvent's client{X,Y} coords can be up to 2 pixels off a
1771
- // ClientRect's bounds, despite the event listener being triggered. A
1772
- // padding of 2 seems to handle this issue.
1773
- const {
1774
- padding = 2,
1775
- x,
1776
- y
1777
- } = evaluate(options, state);
1778
- const nativeClientRects = Array.from((await (platform.getClientRects == null ? void 0 : platform.getClientRects(elements.reference))) || []);
1779
- const clientRects = getRectsByLine(nativeClientRects);
1780
- const fallback = rectToClientRect(getBoundingRect(nativeClientRects));
1781
- const paddingObject = getPaddingObject(padding);
1782
- function getBoundingClientRect() {
1783
- // There are two rects and they are disjoined.
1784
- if (clientRects.length === 2 && clientRects[0].left > clientRects[1].right && x != null && y != null) {
1785
- // Find the first rect in which the point is fully inside.
1786
- return clientRects.find(rect => x > rect.left - paddingObject.left && x < rect.right + paddingObject.right && y > rect.top - paddingObject.top && y < rect.bottom + paddingObject.bottom) || fallback;
1787
- }
1788
-
1789
- // There are 2 or more connected rects.
1790
- if (clientRects.length >= 2) {
1791
- if (getSideAxis(placement) === 'y') {
1792
- const firstRect = clientRects[0];
1793
- const lastRect = clientRects[clientRects.length - 1];
1794
- const isTop = getSide(placement) === 'top';
1795
- const top = firstRect.top;
1796
- const bottom = lastRect.bottom;
1797
- const left = isTop ? firstRect.left : lastRect.left;
1798
- const right = isTop ? firstRect.right : lastRect.right;
1799
- const width = right - left;
1800
- const height = bottom - top;
1801
- return {
1802
- top,
1803
- bottom,
1804
- left,
1805
- right,
1806
- width,
1807
- height,
1808
- x: left,
1809
- y: top
1810
- };
1811
- }
1812
- const isLeftSide = getSide(placement) === 'left';
1813
- const maxRight = max(...clientRects.map(rect => rect.right));
1814
- const minLeft = min(...clientRects.map(rect => rect.left));
1815
- const measureRects = clientRects.filter(rect => isLeftSide ? rect.left === minLeft : rect.right === maxRight);
1816
- const top = measureRects[0].top;
1817
- const bottom = measureRects[measureRects.length - 1].bottom;
1818
- const left = minLeft;
1819
- const right = maxRight;
1820
- const width = right - left;
1821
- const height = bottom - top;
1822
- return {
1823
- top,
1824
- bottom,
1825
- left,
1826
- right,
1827
- width,
1828
- height,
1829
- x: left,
1830
- y: top
1831
- };
1832
- }
1833
- return fallback;
1834
- }
1835
- const resetRects = await platform.getElementRects({
1836
- reference: {
1837
- getBoundingClientRect
1838
- },
1839
- floating: elements.floating,
1840
- strategy
1841
- });
1842
- if (rects.reference.x !== resetRects.reference.x || rects.reference.y !== resetRects.reference.y || rects.reference.width !== resetRects.reference.width || rects.reference.height !== resetRects.reference.height) {
1843
- return {
1844
- reset: {
1845
- rects: resetRects
1846
- }
1847
- };
1848
- }
1849
- return {};
1850
- }
1851
- };
1852
- };
1853
-
1854
- // For type backwards-compatibility, the `OffsetOptions` type was also
1855
- // Derivable.
1856
-
1857
- async function convertValueToCoords(state, options) {
1858
- const {
1859
- placement,
1860
- platform,
1861
- elements
1862
- } = state;
1863
- const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
1864
- const side = getSide(placement);
1865
- const alignment = getAlignment(placement);
1866
- const isVertical = getSideAxis(placement) === 'y';
1867
- const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
1868
- const crossAxisMulti = rtl && isVertical ? -1 : 1;
1869
- const rawValue = evaluate(options, state);
1870
- let {
1871
- mainAxis,
1872
- crossAxis,
1873
- alignmentAxis
1874
- } = typeof rawValue === 'number' ? {
1875
- mainAxis: rawValue,
1876
- crossAxis: 0,
1877
- alignmentAxis: null
1878
- } : {
1879
- mainAxis: 0,
1880
- crossAxis: 0,
1881
- alignmentAxis: null,
1882
- ...rawValue
1883
- };
1884
- if (alignment && typeof alignmentAxis === 'number') {
1885
- crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
1886
- }
1887
- return isVertical ? {
1888
- x: crossAxis * crossAxisMulti,
1889
- y: mainAxis * mainAxisMulti
1890
- } : {
1891
- x: mainAxis * mainAxisMulti,
1892
- y: crossAxis * crossAxisMulti
1893
- };
1894
- }
1895
-
1896
- /**
1897
- * Modifies the placement by translating the floating element along the
1898
- * specified axes.
1899
- * A number (shorthand for `mainAxis` or distance), or an axes configuration
1900
- * object may be passed.
1901
- * @see https://floating-ui.com/docs/offset
1902
- */
1903
- const offset$1 = function (options) {
1904
- if (options === void 0) {
1905
- options = 0;
1906
- }
1907
- return {
1908
- name: 'offset',
1909
- options,
1910
- async fn(state) {
1911
- var _middlewareData$offse, _middlewareData$arrow;
1912
- const {
1913
- x,
1914
- y,
1915
- placement,
1916
- middlewareData
1917
- } = state;
1918
- const diffCoords = await convertValueToCoords(state, options);
1919
-
1920
- // If the placement is the same and the arrow caused an alignment offset
1921
- // then we don't need to change the positioning coordinates.
1922
- if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
1923
- return {};
1924
- }
1925
- return {
1926
- x: x + diffCoords.x,
1927
- y: y + diffCoords.y,
1928
- data: {
1929
- ...diffCoords,
1930
- placement
1931
- }
1932
- };
1933
- }
1934
- };
1935
- };
1936
-
1937
- /**
1938
- * Optimizes the visibility of the floating element by shifting it in order to
1939
- * keep it in view when it will overflow the clipping boundary.
1940
- * @see https://floating-ui.com/docs/shift
1941
- */
1942
- const shift$1 = function (options) {
1943
- if (options === void 0) {
1944
- options = {};
1945
- }
1946
- return {
1947
- name: 'shift',
1948
- options,
1949
- async fn(state) {
1950
- const {
1951
- x,
1952
- y,
1953
- placement
1954
- } = state;
1955
- const {
1956
- mainAxis: checkMainAxis = true,
1957
- crossAxis: checkCrossAxis = false,
1958
- limiter = {
1959
- fn: _ref => {
1960
- let {
1961
- x,
1962
- y
1963
- } = _ref;
1964
- return {
1965
- x,
1966
- y
1967
- };
1968
- }
1969
- },
1970
- ...detectOverflowOptions
1971
- } = evaluate(options, state);
1972
- const coords = {
1973
- x,
1974
- y
1975
- };
1976
- const overflow = await detectOverflow(state, detectOverflowOptions);
1977
- const crossAxis = getSideAxis(getSide(placement));
1978
- const mainAxis = getOppositeAxis(crossAxis);
1979
- let mainAxisCoord = coords[mainAxis];
1980
- let crossAxisCoord = coords[crossAxis];
1981
- if (checkMainAxis) {
1982
- const minSide = mainAxis === 'y' ? 'top' : 'left';
1983
- const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
1984
- const min = mainAxisCoord + overflow[minSide];
1985
- const max = mainAxisCoord - overflow[maxSide];
1986
- mainAxisCoord = clamp(min, mainAxisCoord, max);
1987
- }
1988
- if (checkCrossAxis) {
1989
- const minSide = crossAxis === 'y' ? 'top' : 'left';
1990
- const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
1991
- const min = crossAxisCoord + overflow[minSide];
1992
- const max = crossAxisCoord - overflow[maxSide];
1993
- crossAxisCoord = clamp(min, crossAxisCoord, max);
1994
- }
1995
- const limitedCoords = limiter.fn({
1996
- ...state,
1997
- [mainAxis]: mainAxisCoord,
1998
- [crossAxis]: crossAxisCoord
1999
- });
2000
- return {
2001
- ...limitedCoords,
2002
- data: {
2003
- x: limitedCoords.x - x,
2004
- y: limitedCoords.y - y
2005
- }
2006
- };
2007
- }
2008
- };
2009
- };
2010
- /**
2011
- * Built-in `limiter` that will stop `shift()` at a certain point.
2012
- */
2013
- const limitShift$1 = function (options) {
2014
- if (options === void 0) {
2015
- options = {};
2016
- }
2017
- return {
2018
- options,
2019
- fn(state) {
2020
- const {
2021
- x,
2022
- y,
2023
- placement,
2024
- rects,
2025
- middlewareData
2026
- } = state;
2027
- const {
2028
- offset = 0,
2029
- mainAxis: checkMainAxis = true,
2030
- crossAxis: checkCrossAxis = true
2031
- } = evaluate(options, state);
2032
- const coords = {
2033
- x,
2034
- y
2035
- };
2036
- const crossAxis = getSideAxis(placement);
2037
- const mainAxis = getOppositeAxis(crossAxis);
2038
- let mainAxisCoord = coords[mainAxis];
2039
- let crossAxisCoord = coords[crossAxis];
2040
- const rawOffset = evaluate(offset, state);
2041
- const computedOffset = typeof rawOffset === 'number' ? {
2042
- mainAxis: rawOffset,
2043
- crossAxis: 0
2044
- } : {
2045
- mainAxis: 0,
2046
- crossAxis: 0,
2047
- ...rawOffset
2048
- };
2049
- if (checkMainAxis) {
2050
- const len = mainAxis === 'y' ? 'height' : 'width';
2051
- const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
2052
- const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
2053
- if (mainAxisCoord < limitMin) {
2054
- mainAxisCoord = limitMin;
2055
- } else if (mainAxisCoord > limitMax) {
2056
- mainAxisCoord = limitMax;
2057
- }
2058
- }
2059
- if (checkCrossAxis) {
2060
- var _middlewareData$offse, _middlewareData$offse2;
2061
- const len = mainAxis === 'y' ? 'width' : 'height';
2062
- const isOriginSide = ['top', 'left'].includes(getSide(placement));
2063
- const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
2064
- const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
2065
- if (crossAxisCoord < limitMin) {
2066
- crossAxisCoord = limitMin;
2067
- } else if (crossAxisCoord > limitMax) {
2068
- crossAxisCoord = limitMax;
2069
- }
2070
- }
2071
- return {
2072
- [mainAxis]: mainAxisCoord,
2073
- [crossAxis]: crossAxisCoord
2074
- };
2075
- }
2076
- };
2077
- };
2078
-
2079
- /**
2080
- * Provides data that allows you to change the size of the floating element —
2081
- * for instance, prevent it from overflowing the clipping boundary or match the
2082
- * width of the reference element.
2083
- * @see https://floating-ui.com/docs/size
2084
- */
2085
- const size$1 = function (options) {
2086
- if (options === void 0) {
2087
- options = {};
2088
- }
2089
- return {
2090
- name: 'size',
2091
- options,
2092
- async fn(state) {
2093
- const {
2094
- placement,
2095
- rects,
2096
- platform,
2097
- elements
2098
- } = state;
2099
- const {
2100
- apply = () => {},
2101
- ...detectOverflowOptions
2102
- } = evaluate(options, state);
2103
- const overflow = await detectOverflow(state, detectOverflowOptions);
2104
- const side = getSide(placement);
2105
- const alignment = getAlignment(placement);
2106
- const isYAxis = getSideAxis(placement) === 'y';
2107
- const {
2108
- width,
2109
- height
2110
- } = rects.floating;
2111
- let heightSide;
2112
- let widthSide;
2113
- if (side === 'top' || side === 'bottom') {
2114
- heightSide = side;
2115
- widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
2116
- } else {
2117
- widthSide = side;
2118
- heightSide = alignment === 'end' ? 'top' : 'bottom';
2119
- }
2120
- const overflowAvailableHeight = height - overflow[heightSide];
2121
- const overflowAvailableWidth = width - overflow[widthSide];
2122
- const noShift = !state.middlewareData.shift;
2123
- let availableHeight = overflowAvailableHeight;
2124
- let availableWidth = overflowAvailableWidth;
2125
- if (isYAxis) {
2126
- const maximumClippingWidth = width - overflow.left - overflow.right;
2127
- availableWidth = alignment || noShift ? min(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
2128
- } else {
2129
- const maximumClippingHeight = height - overflow.top - overflow.bottom;
2130
- availableHeight = alignment || noShift ? min(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
2131
- }
2132
- if (noShift && !alignment) {
2133
- const xMin = max(overflow.left, 0);
2134
- const xMax = max(overflow.right, 0);
2135
- const yMin = max(overflow.top, 0);
2136
- const yMax = max(overflow.bottom, 0);
2137
- if (isYAxis) {
2138
- availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
2139
- } else {
2140
- availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
2141
- }
2142
- }
2143
- await apply({
2144
- ...state,
2145
- availableWidth,
2146
- availableHeight
2147
- });
2148
- const nextDimensions = await platform.getDimensions(elements.floating);
2149
- if (width !== nextDimensions.width || height !== nextDimensions.height) {
2150
- return {
2151
- reset: {
2152
- rects: true
2153
- }
2154
- };
2155
- }
2156
- return {};
2157
- }
2158
- };
2159
- };
2160
-
2161
- function getNodeName(node) {
2162
- if (isNode(node)) {
2163
- return (node.nodeName || '').toLowerCase();
2164
- }
2165
- // Mocked nodes in testing environments may not be instances of Node. By
2166
- // returning `#document` an infinite loop won't occur.
2167
- // https://github.com/floating-ui/floating-ui/issues/2317
2168
- return '#document';
2169
- }
2170
- function getWindow(node) {
2171
- var _node$ownerDocument;
2172
- return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
2173
- }
2174
- function getDocumentElement(node) {
2175
- var _ref;
2176
- return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
2177
- }
2178
- function isNode(value) {
2179
- return value instanceof Node || value instanceof getWindow(value).Node;
2180
- }
2181
- function isElement(value) {
2182
- return value instanceof Element || value instanceof getWindow(value).Element;
2183
- }
2184
- function isHTMLElement(value) {
2185
- return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
2186
- }
2187
- function isShadowRoot(value) {
2188
- // Browsers without `ShadowRoot` support.
2189
- if (typeof ShadowRoot === 'undefined') {
2190
- return false;
2191
- }
2192
- return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
2193
- }
2194
- function isOverflowElement(element) {
2195
- const {
2196
- overflow,
2197
- overflowX,
2198
- overflowY,
2199
- display
2200
- } = getComputedStyle$1(element);
2201
- return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
2202
- }
2203
- function isTableElement(element) {
2204
- return ['table', 'td', 'th'].includes(getNodeName(element));
2205
- }
2206
- function isTopLayer(element) {
2207
- return [':popover-open', ':modal'].some(selector => {
2208
- try {
2209
- return element.matches(selector);
2210
- } catch (e) {
2211
- return false;
2212
- }
2213
- });
2214
- }
2215
- function isContainingBlock(elementOrCss) {
2216
- const webkit = isWebKit();
2217
- const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
2218
-
2219
- // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
2220
- 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));
2221
- }
2222
- function getContainingBlock(element) {
2223
- let currentNode = getParentNode(element);
2224
- while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
2225
- if (isContainingBlock(currentNode)) {
2226
- return currentNode;
2227
- } else if (isTopLayer(currentNode)) {
2228
- return null;
2229
- }
2230
- currentNode = getParentNode(currentNode);
2231
- }
2232
- return null;
2233
- }
2234
- function isWebKit() {
2235
- if (typeof CSS === 'undefined' || !CSS.supports) return false;
2236
- return CSS.supports('-webkit-backdrop-filter', 'none');
2237
- }
2238
- function isLastTraversableNode(node) {
2239
- return ['html', 'body', '#document'].includes(getNodeName(node));
2240
- }
2241
- function getComputedStyle$1(element) {
2242
- return getWindow(element).getComputedStyle(element);
2243
- }
2244
- function getNodeScroll(element) {
2245
- if (isElement(element)) {
2246
- return {
2247
- scrollLeft: element.scrollLeft,
2248
- scrollTop: element.scrollTop
2249
- };
2250
- }
2251
- return {
2252
- scrollLeft: element.scrollX,
2253
- scrollTop: element.scrollY
2254
- };
2255
- }
2256
- function getParentNode(node) {
2257
- if (getNodeName(node) === 'html') {
2258
- return node;
2259
- }
2260
- const result =
2261
- // Step into the shadow DOM of the parent of a slotted node.
2262
- node.assignedSlot ||
2263
- // DOM Element detected.
2264
- node.parentNode ||
2265
- // ShadowRoot detected.
2266
- isShadowRoot(node) && node.host ||
2267
- // Fallback.
2268
- getDocumentElement(node);
2269
- return isShadowRoot(result) ? result.host : result;
2270
- }
2271
- function getNearestOverflowAncestor(node) {
2272
- const parentNode = getParentNode(node);
2273
- if (isLastTraversableNode(parentNode)) {
2274
- return node.ownerDocument ? node.ownerDocument.body : node.body;
2275
- }
2276
- if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
2277
- return parentNode;
2278
- }
2279
- return getNearestOverflowAncestor(parentNode);
2280
- }
2281
- function getOverflowAncestors(node, list, traverseIframes) {
2282
- var _node$ownerDocument2;
2283
- if (list === void 0) {
2284
- list = [];
2285
- }
2286
- if (traverseIframes === void 0) {
2287
- traverseIframes = true;
2288
- }
2289
- const scrollableAncestor = getNearestOverflowAncestor(node);
2290
- const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
2291
- const win = getWindow(scrollableAncestor);
2292
- if (isBody) {
2293
- return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], win.frameElement && traverseIframes ? getOverflowAncestors(win.frameElement) : []);
2294
- }
2295
- return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
2296
- }
2297
-
2298
- function getCssDimensions(element) {
2299
- const css = getComputedStyle$1(element);
2300
- // In testing environments, the `width` and `height` properties are empty
2301
- // strings for SVG elements, returning NaN. Fallback to `0` in this case.
2302
- let width = parseFloat(css.width) || 0;
2303
- let height = parseFloat(css.height) || 0;
2304
- const hasOffset = isHTMLElement(element);
2305
- const offsetWidth = hasOffset ? element.offsetWidth : width;
2306
- const offsetHeight = hasOffset ? element.offsetHeight : height;
2307
- const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
2308
- if (shouldFallback) {
2309
- width = offsetWidth;
2310
- height = offsetHeight;
2311
- }
2312
- return {
2313
- width,
2314
- height,
2315
- $: shouldFallback
2316
- };
2317
- }
2318
-
2319
- function unwrapElement(element) {
2320
- return !isElement(element) ? element.contextElement : element;
2321
- }
2322
-
2323
- function getScale(element) {
2324
- const domElement = unwrapElement(element);
2325
- if (!isHTMLElement(domElement)) {
2326
- return createCoords(1);
2327
- }
2328
- const rect = domElement.getBoundingClientRect();
2329
- const {
2330
- width,
2331
- height,
2332
- $
2333
- } = getCssDimensions(domElement);
2334
- let x = ($ ? round(rect.width) : rect.width) / width;
2335
- let y = ($ ? round(rect.height) : rect.height) / height;
2336
-
2337
- // 0, NaN, or Infinity should always fallback to 1.
2338
-
2339
- if (!x || !Number.isFinite(x)) {
2340
- x = 1;
2341
- }
2342
- if (!y || !Number.isFinite(y)) {
2343
- y = 1;
2344
- }
2345
- return {
2346
- x,
2347
- y
2348
- };
2349
- }
2350
-
2351
- const noOffsets = /*#__PURE__*/createCoords(0);
2352
- function getVisualOffsets(element) {
2353
- const win = getWindow(element);
2354
- if (!isWebKit() || !win.visualViewport) {
2355
- return noOffsets;
2356
- }
2357
- return {
2358
- x: win.visualViewport.offsetLeft,
2359
- y: win.visualViewport.offsetTop
2360
- };
2361
- }
2362
- function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
2363
- if (isFixed === void 0) {
2364
- isFixed = false;
2365
- }
2366
- if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
2367
- return false;
2368
- }
2369
- return isFixed;
2370
- }
2371
-
2372
- function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
2373
- if (includeScale === void 0) {
2374
- includeScale = false;
2375
- }
2376
- if (isFixedStrategy === void 0) {
2377
- isFixedStrategy = false;
2378
- }
2379
- const clientRect = element.getBoundingClientRect();
2380
- const domElement = unwrapElement(element);
2381
- let scale = createCoords(1);
2382
- if (includeScale) {
2383
- if (offsetParent) {
2384
- if (isElement(offsetParent)) {
2385
- scale = getScale(offsetParent);
2386
- }
2387
- } else {
2388
- scale = getScale(element);
2389
- }
2390
- }
2391
- const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
2392
- let x = (clientRect.left + visualOffsets.x) / scale.x;
2393
- let y = (clientRect.top + visualOffsets.y) / scale.y;
2394
- let width = clientRect.width / scale.x;
2395
- let height = clientRect.height / scale.y;
2396
- if (domElement) {
2397
- const win = getWindow(domElement);
2398
- const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
2399
- let currentWin = win;
2400
- let currentIFrame = currentWin.frameElement;
2401
- while (currentIFrame && offsetParent && offsetWin !== currentWin) {
2402
- const iframeScale = getScale(currentIFrame);
2403
- const iframeRect = currentIFrame.getBoundingClientRect();
2404
- const css = getComputedStyle$1(currentIFrame);
2405
- const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
2406
- const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
2407
- x *= iframeScale.x;
2408
- y *= iframeScale.y;
2409
- width *= iframeScale.x;
2410
- height *= iframeScale.y;
2411
- x += left;
2412
- y += top;
2413
- currentWin = getWindow(currentIFrame);
2414
- currentIFrame = currentWin.frameElement;
2415
- }
2416
- }
2417
- return rectToClientRect({
2418
- width,
2419
- height,
2420
- x,
2421
- y
2422
- });
2423
- }
2424
-
2425
- function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
2426
- let {
2427
- elements,
2428
- rect,
2429
- offsetParent,
2430
- strategy
2431
- } = _ref;
2432
- const isFixed = strategy === 'fixed';
2433
- const documentElement = getDocumentElement(offsetParent);
2434
- const topLayer = elements ? isTopLayer(elements.floating) : false;
2435
- if (offsetParent === documentElement || topLayer && isFixed) {
2436
- return rect;
2437
- }
2438
- let scroll = {
2439
- scrollLeft: 0,
2440
- scrollTop: 0
2441
- };
2442
- let scale = createCoords(1);
2443
- const offsets = createCoords(0);
2444
- const isOffsetParentAnElement = isHTMLElement(offsetParent);
2445
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
2446
- if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
2447
- scroll = getNodeScroll(offsetParent);
2448
- }
2449
- if (isHTMLElement(offsetParent)) {
2450
- const offsetRect = getBoundingClientRect(offsetParent);
2451
- scale = getScale(offsetParent);
2452
- offsets.x = offsetRect.x + offsetParent.clientLeft;
2453
- offsets.y = offsetRect.y + offsetParent.clientTop;
2454
- }
2455
- }
2456
- return {
2457
- width: rect.width * scale.x,
2458
- height: rect.height * scale.y,
2459
- x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
2460
- y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
2461
- };
2462
- }
2463
-
2464
- function getClientRects(element) {
2465
- return Array.from(element.getClientRects());
2466
- }
2467
-
2468
- function getWindowScrollBarX(element) {
2469
- // If <html> has a CSS width greater than the viewport, then this will be
2470
- // incorrect for RTL.
2471
- return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
2472
- }
2473
-
2474
- // Gets the entire size of the scrollable document area, even extending outside
2475
- // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
2476
- function getDocumentRect(element) {
2477
- const html = getDocumentElement(element);
2478
- const scroll = getNodeScroll(element);
2479
- const body = element.ownerDocument.body;
2480
- const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
2481
- const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
2482
- let x = -scroll.scrollLeft + getWindowScrollBarX(element);
2483
- const y = -scroll.scrollTop;
2484
- if (getComputedStyle$1(body).direction === 'rtl') {
2485
- x += max(html.clientWidth, body.clientWidth) - width;
2486
- }
2487
- return {
2488
- width,
2489
- height,
2490
- x,
2491
- y
2492
- };
2493
- }
2494
-
2495
- function getViewportRect(element, strategy) {
2496
- const win = getWindow(element);
2497
- const html = getDocumentElement(element);
2498
- const visualViewport = win.visualViewport;
2499
- let width = html.clientWidth;
2500
- let height = html.clientHeight;
2501
- let x = 0;
2502
- let y = 0;
2503
- if (visualViewport) {
2504
- width = visualViewport.width;
2505
- height = visualViewport.height;
2506
- const visualViewportBased = isWebKit();
2507
- if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
2508
- x = visualViewport.offsetLeft;
2509
- y = visualViewport.offsetTop;
2510
- }
2511
- }
2512
- return {
2513
- width,
2514
- height,
2515
- x,
2516
- y
2517
- };
2518
- }
2519
-
2520
- // Returns the inner client rect, subtracting scrollbars if present.
2521
- function getInnerBoundingClientRect(element, strategy) {
2522
- const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
2523
- const top = clientRect.top + element.clientTop;
2524
- const left = clientRect.left + element.clientLeft;
2525
- const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
2526
- const width = element.clientWidth * scale.x;
2527
- const height = element.clientHeight * scale.y;
2528
- const x = left * scale.x;
2529
- const y = top * scale.y;
2530
- return {
2531
- width,
2532
- height,
2533
- x,
2534
- y
2535
- };
2536
- }
2537
- function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
2538
- let rect;
2539
- if (clippingAncestor === 'viewport') {
2540
- rect = getViewportRect(element, strategy);
2541
- } else if (clippingAncestor === 'document') {
2542
- rect = getDocumentRect(getDocumentElement(element));
2543
- } else if (isElement(clippingAncestor)) {
2544
- rect = getInnerBoundingClientRect(clippingAncestor, strategy);
2545
- } else {
2546
- const visualOffsets = getVisualOffsets(element);
2547
- rect = {
2548
- ...clippingAncestor,
2549
- x: clippingAncestor.x - visualOffsets.x,
2550
- y: clippingAncestor.y - visualOffsets.y
2551
- };
2552
- }
2553
- return rectToClientRect(rect);
2554
- }
2555
- function hasFixedPositionAncestor(element, stopNode) {
2556
- const parentNode = getParentNode(element);
2557
- if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
2558
- return false;
2559
- }
2560
- return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
2561
- }
2562
-
2563
- // A "clipping ancestor" is an `overflow` element with the characteristic of
2564
- // clipping (or hiding) child elements. This returns all clipping ancestors
2565
- // of the given element up the tree.
2566
- function getClippingElementAncestors(element, cache) {
2567
- const cachedResult = cache.get(element);
2568
- if (cachedResult) {
2569
- return cachedResult;
2570
- }
2571
- let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
2572
- let currentContainingBlockComputedStyle = null;
2573
- const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
2574
- let currentNode = elementIsFixed ? getParentNode(element) : element;
2575
-
2576
- // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
2577
- while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
2578
- const computedStyle = getComputedStyle$1(currentNode);
2579
- const currentNodeIsContaining = isContainingBlock(currentNode);
2580
- if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
2581
- currentContainingBlockComputedStyle = null;
2582
- }
2583
- const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
2584
- if (shouldDropCurrentNode) {
2585
- // Drop non-containing blocks.
2586
- result = result.filter(ancestor => ancestor !== currentNode);
2587
- } else {
2588
- // Record last containing block for next iteration.
2589
- currentContainingBlockComputedStyle = computedStyle;
2590
- }
2591
- currentNode = getParentNode(currentNode);
2592
- }
2593
- cache.set(element, result);
2594
- return result;
2595
- }
2596
-
2597
- // Gets the maximum area that the element is visible in due to any number of
2598
- // clipping ancestors.
2599
- function getClippingRect(_ref) {
2600
- let {
2601
- element,
2602
- boundary,
2603
- rootBoundary,
2604
- strategy
2605
- } = _ref;
2606
- const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
2607
- const clippingAncestors = [...elementClippingAncestors, rootBoundary];
2608
- const firstClippingAncestor = clippingAncestors[0];
2609
- const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
2610
- const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
2611
- accRect.top = max(rect.top, accRect.top);
2612
- accRect.right = min(rect.right, accRect.right);
2613
- accRect.bottom = min(rect.bottom, accRect.bottom);
2614
- accRect.left = max(rect.left, accRect.left);
2615
- return accRect;
2616
- }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
2617
- return {
2618
- width: clippingRect.right - clippingRect.left,
2619
- height: clippingRect.bottom - clippingRect.top,
2620
- x: clippingRect.left,
2621
- y: clippingRect.top
2622
- };
2623
- }
2624
-
2625
- function getDimensions(element) {
2626
- const {
2627
- width,
2628
- height
2629
- } = getCssDimensions(element);
2630
- return {
2631
- width,
2632
- height
2633
- };
2634
- }
2635
-
2636
- function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
2637
- const isOffsetParentAnElement = isHTMLElement(offsetParent);
2638
- const documentElement = getDocumentElement(offsetParent);
2639
- const isFixed = strategy === 'fixed';
2640
- const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
2641
- let scroll = {
2642
- scrollLeft: 0,
2643
- scrollTop: 0
2644
- };
2645
- const offsets = createCoords(0);
2646
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
2647
- if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
2648
- scroll = getNodeScroll(offsetParent);
2649
- }
2650
- if (isOffsetParentAnElement) {
2651
- const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
2652
- offsets.x = offsetRect.x + offsetParent.clientLeft;
2653
- offsets.y = offsetRect.y + offsetParent.clientTop;
2654
- } else if (documentElement) {
2655
- offsets.x = getWindowScrollBarX(documentElement);
2656
- }
2657
- }
2658
- const x = rect.left + scroll.scrollLeft - offsets.x;
2659
- const y = rect.top + scroll.scrollTop - offsets.y;
2660
- return {
2661
- x,
2662
- y,
2663
- width: rect.width,
2664
- height: rect.height
2665
- };
2666
- }
2667
-
2668
- function isStaticPositioned(element) {
2669
- return getComputedStyle$1(element).position === 'static';
2670
- }
2671
-
2672
- function getTrueOffsetParent(element, polyfill) {
2673
- if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
2674
- return null;
2675
- }
2676
- if (polyfill) {
2677
- return polyfill(element);
2678
- }
2679
- return element.offsetParent;
2680
- }
2681
-
2682
- // Gets the closest ancestor positioned element. Handles some edge cases,
2683
- // such as table ancestors and cross browser bugs.
2684
- function getOffsetParent(element, polyfill) {
2685
- const win = getWindow(element);
2686
- if (isTopLayer(element)) {
2687
- return win;
2688
- }
2689
- if (!isHTMLElement(element)) {
2690
- let svgOffsetParent = getParentNode(element);
2691
- while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
2692
- if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
2693
- return svgOffsetParent;
2694
- }
2695
- svgOffsetParent = getParentNode(svgOffsetParent);
2696
- }
2697
- return win;
2698
- }
2699
- let offsetParent = getTrueOffsetParent(element, polyfill);
2700
- while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
2701
- offsetParent = getTrueOffsetParent(offsetParent, polyfill);
2702
- }
2703
- if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
2704
- return win;
2705
- }
2706
- return offsetParent || getContainingBlock(element) || win;
2707
- }
2708
-
2709
- const getElementRects = async function (data) {
2710
- const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
2711
- const getDimensionsFn = this.getDimensions;
2712
- const floatingDimensions = await getDimensionsFn(data.floating);
2713
- return {
2714
- reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
2715
- floating: {
2716
- x: 0,
2717
- y: 0,
2718
- width: floatingDimensions.width,
2719
- height: floatingDimensions.height
2720
- }
2721
- };
2722
- };
2723
-
2724
- function isRTL(element) {
2725
- return getComputedStyle$1(element).direction === 'rtl';
2726
- }
2727
-
2728
- const platform = {
2729
- convertOffsetParentRelativeRectToViewportRelativeRect,
2730
- getDocumentElement,
2731
- getClippingRect,
2732
- getOffsetParent,
2733
- getElementRects,
2734
- getClientRects,
2735
- getDimensions,
2736
- getScale,
2737
- isElement,
2738
- isRTL
2739
- };
2740
-
2741
- // https://samthor.au/2021/observing-dom/
2742
- function observeMove(element, onMove) {
2743
- let io = null;
2744
- let timeoutId;
2745
- const root = getDocumentElement(element);
2746
- function cleanup() {
2747
- var _io;
2748
- clearTimeout(timeoutId);
2749
- (_io = io) == null || _io.disconnect();
2750
- io = null;
2751
- }
2752
- function refresh(skip, threshold) {
2753
- if (skip === void 0) {
2754
- skip = false;
2755
- }
2756
- if (threshold === void 0) {
2757
- threshold = 1;
2758
- }
2759
- cleanup();
2760
- const {
2761
- left,
2762
- top,
2763
- width,
2764
- height
2765
- } = element.getBoundingClientRect();
2766
- if (!skip) {
2767
- onMove();
2768
- }
2769
- if (!width || !height) {
2770
- return;
2771
- }
2772
- const insetTop = floor(top);
2773
- const insetRight = floor(root.clientWidth - (left + width));
2774
- const insetBottom = floor(root.clientHeight - (top + height));
2775
- const insetLeft = floor(left);
2776
- const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
2777
- const options = {
2778
- rootMargin,
2779
- threshold: max(0, min(1, threshold)) || 1
2780
- };
2781
- let isFirstUpdate = true;
2782
- function handleObserve(entries) {
2783
- const ratio = entries[0].intersectionRatio;
2784
- if (ratio !== threshold) {
2785
- if (!isFirstUpdate) {
2786
- return refresh();
2787
- }
2788
- if (!ratio) {
2789
- // If the reference is clipped, the ratio is 0. Throttle the refresh
2790
- // to prevent an infinite loop of updates.
2791
- timeoutId = setTimeout(() => {
2792
- refresh(false, 1e-7);
2793
- }, 1000);
2794
- } else {
2795
- refresh(false, ratio);
2796
- }
2797
- }
2798
- isFirstUpdate = false;
2799
- }
2800
-
2801
- // Older browsers don't support a `document` as the root and will throw an
2802
- // error.
2803
- try {
2804
- io = new IntersectionObserver(handleObserve, {
2805
- ...options,
2806
- // Handle <iframe>s
2807
- root: root.ownerDocument
2808
- });
2809
- } catch (e) {
2810
- io = new IntersectionObserver(handleObserve, options);
2811
- }
2812
- io.observe(element);
2813
- }
2814
- refresh(true);
2815
- return cleanup;
2816
- }
2817
-
2818
- /**
2819
- * Automatically updates the position of the floating element when necessary.
2820
- * Should only be called when the floating element is mounted on the DOM or
2821
- * visible on the screen.
2822
- * @returns cleanup function that should be invoked when the floating element is
2823
- * removed from the DOM or hidden from the screen.
2824
- * @see https://floating-ui.com/docs/autoUpdate
2825
- */
2826
- function autoUpdate(reference, floating, update, options) {
2827
- if (options === void 0) {
2828
- options = {};
2829
- }
2830
- const {
2831
- ancestorScroll = true,
2832
- ancestorResize = true,
2833
- elementResize = typeof ResizeObserver === 'function',
2834
- layoutShift = typeof IntersectionObserver === 'function',
2835
- animationFrame = false
2836
- } = options;
2837
- const referenceEl = unwrapElement(reference);
2838
- const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
2839
- ancestors.forEach(ancestor => {
2840
- ancestorScroll && ancestor.addEventListener('scroll', update, {
2841
- passive: true
2842
- });
2843
- ancestorResize && ancestor.addEventListener('resize', update);
2844
- });
2845
- const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
2846
- let reobserveFrame = -1;
2847
- let resizeObserver = null;
2848
- if (elementResize) {
2849
- resizeObserver = new ResizeObserver(_ref => {
2850
- let [firstEntry] = _ref;
2851
- if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
2852
- // Prevent update loops when using the `size` middleware.
2853
- // https://github.com/floating-ui/floating-ui/issues/1740
2854
- resizeObserver.unobserve(floating);
2855
- cancelAnimationFrame(reobserveFrame);
2856
- reobserveFrame = requestAnimationFrame(() => {
2857
- var _resizeObserver;
2858
- (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
2859
- });
2860
- }
2861
- update();
2862
- });
2863
- if (referenceEl && !animationFrame) {
2864
- resizeObserver.observe(referenceEl);
2865
- }
2866
- resizeObserver.observe(floating);
2867
- }
2868
- let frameId;
2869
- let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
2870
- if (animationFrame) {
2871
- frameLoop();
2872
- }
2873
- function frameLoop() {
2874
- const nextRefRect = getBoundingClientRect(reference);
2875
- if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
2876
- update();
2877
- }
2878
- prevRefRect = nextRefRect;
2879
- frameId = requestAnimationFrame(frameLoop);
2880
- }
2881
- update();
2882
- return () => {
2883
- var _resizeObserver2;
2884
- ancestors.forEach(ancestor => {
2885
- ancestorScroll && ancestor.removeEventListener('scroll', update);
2886
- ancestorResize && ancestor.removeEventListener('resize', update);
2887
- });
2888
- cleanupIo == null || cleanupIo();
2889
- (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
2890
- resizeObserver = null;
2891
- if (animationFrame) {
2892
- cancelAnimationFrame(frameId);
2893
- }
2894
- };
2895
- }
2896
-
2897
- /**
2898
- * Modifies the placement by translating the floating element along the
2899
- * specified axes.
2900
- * A number (shorthand for `mainAxis` or distance), or an axes configuration
2901
- * object may be passed.
2902
- * @see https://floating-ui.com/docs/offset
2903
- */
2904
- const offset = offset$1;
2905
-
2906
- /**
2907
- * Optimizes the visibility of the floating element by choosing the placement
2908
- * that has the most space available automatically, without needing to specify a
2909
- * preferred placement. Alternative to `flip`.
2910
- * @see https://floating-ui.com/docs/autoPlacement
2911
- */
2912
- autoPlacement;
2913
-
2914
- /**
2915
- * Optimizes the visibility of the floating element by shifting it in order to
2916
- * keep it in view when it will overflow the clipping boundary.
2917
- * @see https://floating-ui.com/docs/shift
2918
- */
2919
- const shift = shift$1;
2920
-
2921
- /**
2922
- * Optimizes the visibility of the floating element by flipping the `placement`
2923
- * in order to keep it in view when the preferred placement(s) will overflow the
2924
- * clipping boundary. Alternative to `autoPlacement`.
2925
- * @see https://floating-ui.com/docs/flip
2926
- */
2927
- const flip = flip$1;
2928
-
2929
- /**
2930
- * Provides data that allows you to change the size of the floating element —
2931
- * for instance, prevent it from overflowing the clipping boundary or match the
2932
- * width of the reference element.
2933
- * @see https://floating-ui.com/docs/size
2934
- */
2935
- const size = size$1;
2936
-
2937
- /**
2938
- * Provides data to hide the floating element in applicable situations, such as
2939
- * when it is not in the same clipping context as the reference element.
2940
- * @see https://floating-ui.com/docs/hide
2941
- */
2942
- hide;
2943
-
2944
- /**
2945
- * Provides data to position an inner element of the floating element so that it
2946
- * appears centered to the reference element.
2947
- * @see https://floating-ui.com/docs/arrow
2948
- */
2949
- const arrow = arrow$1;
2950
-
2951
- /**
2952
- * Provides improved positioning for inline reference elements that can span
2953
- * over multiple lines, such as hyperlinks or range selections.
2954
- * @see https://floating-ui.com/docs/inline
2955
- */
2956
- const inline = inline$1;
2957
-
2958
- /**
2959
- * Built-in `limiter` that will stop `shift()` at a certain point.
2960
- */
2961
- const limitShift = limitShift$1;
2962
-
2963
- /**
2964
- * Computes the `x` and `y` coordinates that will place the floating element
2965
- * next to a given reference element.
2966
- */
2967
- const computePosition = (reference, floating, options) => {
2968
- // This caches the expensive `getClippingElementAncestors` function so that
2969
- // multiple lifecycle resets re-use the same result. It only lives for a
2970
- // single call. If other functions become expensive, we can add them as well.
2971
- const cache = new Map();
2972
- const mergedOptions = {
2973
- platform,
2974
- ...options
2975
- };
2976
- const platformWithCache = {
2977
- ...mergedOptions.platform,
2978
- _c: cache
2979
- };
2980
- return computePosition$1(reference, floating, {
2981
- ...mergedOptions,
2982
- platform: platformWithCache
2983
- });
2984
- };
2985
-
2986
- (()=>{var c=class extends Event{oldState;newState;constructor(t,{oldState:o="",newState:r="",...i}={}){super(t,i),this.oldState=String(o||""),this.newState=String(r||"");}},R=new WeakMap;function A(e,t,o){R.set(e,setTimeout(()=>{R.has(e)&&e.dispatchEvent(new c("toggle",{cancelable:!1,oldState:t,newState:o}));},0));}var D=globalThis.ShadowRoot||function(){},z=globalThis.HTMLDialogElement||function(){},M=new WeakMap,p=new WeakMap,h=new WeakMap;function L(e){return h.get(e)||"hidden"}var b=new WeakMap;function O(e){let t=e.popoverTargetElement;if(!(t instanceof HTMLElement))return;let o=L(t);e.popoverTargetAction==="show"&&o==="showing"||e.popoverTargetAction==="hide"&&o==="hidden"||(o==="showing"?m(t,!0,!0):d(t,!1)&&(b.set(t,e),S(t)));}function d(e,t){return !(e.popover!=="auto"&&e.popover!=="manual"||!e.isConnected||t&&L(e)!=="showing"||!t&&L(e)!=="hidden"||e instanceof z&&e.hasAttribute("open")||document.fullscreenElement===e)}function N(e){return e?Array.from(p.get(e.ownerDocument)||[]).indexOf(e)+1:0}function V(e){let t=W(e),o=U(e);return N(t)>N(o)?t:o}function y(e){let t=p.get(e);for(let o of t||[])if(!o.isConnected)t.delete(o);else return o;return null}function v(e){return typeof e.getRootNode=="function"?e.getRootNode():e.parentNode?v(e.parentNode):e}function W(e){for(;e;){if(e instanceof HTMLElement&&e.popover==="auto"&&h.get(e)==="showing")return e;if(e=e.parentElement||v(e),e instanceof D&&(e=e.host),e instanceof Document)return}}function U(e){for(;e;){let t=e.popoverTargetElement;if(t instanceof HTMLElement)return t;if(e=e.parentElement||v(e),e instanceof D&&(e=e.host),e instanceof Document)return}}function G(e){let t=new Map,o=0,r=e.ownerDocument;for(let a of p.get(r)||[])t.set(a,o),o+=1;t.set(e,o),o+=1;let i=null;function l(a){let g=W(a);if(g===null)return null;let n=t.get(g);(i===null||t.get(i)<n)&&(i=g);}return l(e?.parentElement),i}function Q(e){return e.hidden||e instanceof D||(e instanceof HTMLButtonElement||e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement||e instanceof HTMLOptGroupElement||e instanceof HTMLOptionElement||e instanceof HTMLFieldSetElement)&&e.disabled||e instanceof HTMLInputElement&&e.type==="hidden"||e instanceof HTMLAnchorElement&&e.href===""?!1:typeof e.tabIndex=="number"&&e.tabIndex!==-1}function _(e){if(e.shadowRoot&&e.shadowRoot.delegatesFocus!==!0)return null;let t=e;t.shadowRoot&&(t=t.shadowRoot);let o=t.querySelector("[autofocus]");if(o)return o;{let l=t.querySelectorAll("slot");for(let a of l){let g=a.assignedElements({flatten:!0});for(let n of g){if(n.hasAttribute("autofocus"))return n;if(o=n.querySelector("[autofocus]"),o)return o}}}let r=e.ownerDocument.createTreeWalker(t,NodeFilter.SHOW_ELEMENT),i=r.currentNode;for(;i;){if(Q(i))return i;i=r.nextNode();}}function $(e){_(e)?.focus();}var H=new WeakMap;function S(e){if(!d(e,!1))return;let t=e.ownerDocument;if(!e.dispatchEvent(new c("beforetoggle",{cancelable:!0,oldState:"closed",newState:"open"}))||!d(e,!1))return;let o=!1;if(e.popover==="auto"){let i=e.getAttribute("popover"),l=G(e)||t;if(T(l,!1,!0),i!==e.getAttribute("popover")||!d(e,!1))return}y(t)||(o=!0),H.delete(e);let r=t.activeElement;e.classList.add(":popover-open"),h.set(e,"showing"),M.has(t)||M.set(t,new Set),M.get(t).add(e),$(e),e.popover==="auto"&&(p.has(t)||p.set(t,new Set),p.get(t).add(e),q(b.get(e),!0)),o&&r&&e.popover==="auto"&&H.set(e,r),A(e,"closed","open");}function m(e,t=!1,o=!1){if(!d(e,!0))return;let r=e.ownerDocument;if(e.popover==="auto"&&(T(e,t,o),!d(e,!0))||(q(b.get(e),!1),b.delete(e),o&&(e.dispatchEvent(new c("beforetoggle",{oldState:"open",newState:"closed"})),!d(e,!0))))return;M.get(r)?.delete(e),p.get(r)?.delete(e),e.classList.remove(":popover-open"),h.set(e,"hidden"),o&&A(e,"open","closed");let i=H.get(e);i&&(H.delete(e),t&&i.focus());}function F(e,t=!1,o=!1){let r=y(e);for(;r;)m(r,t,o),r=y(e);}function T(e,t,o){let r=e.ownerDocument||e;if(e instanceof Document)return F(r,t,o);let i=null,l=!1;for(let a of p.get(r)||[])if(a===e)l=!0;else if(l){i=a;break}if(!l)return F(r,t,o);for(;i&&L(i)==="showing"&&p.get(r)?.size;)m(i,t,o);}var P=new WeakMap;function x(e){if(!e.isTrusted)return;let t=e.composedPath()[0];if(!t)return;let o=t.ownerDocument;if(!y(o))return;let i=V(t);if(i&&e.type==="pointerdown")P.set(o,i);else if(e.type==="pointerup"){let l=P.get(o)===i;P.delete(o),l&&T(i||o,!1,!0);}}var k=new WeakMap;function q(e,t=!1){if(!e)return;k.has(e)||k.set(e,e.getAttribute("aria-expanded"));let o=e.popoverTargetElement;if(o instanceof HTMLElement&&o.popover==="auto")e.setAttribute("aria-expanded",String(t));else {let r=k.get(e);r?e.setAttribute("aria-expanded",r):e.removeAttribute("aria-expanded");}}var B=globalThis.ShadowRoot||function(){};function j(){return typeof HTMLElement<"u"&&typeof HTMLElement.prototype=="object"&&"popover"in HTMLElement.prototype}function f(e,t,o){let r=e[t];Object.defineProperty(e,t,{value(i){return r.call(this,o(i))}});}var J=/(^|[^\\]):popover-open\b/g,C=`
2987
- :where([popover]) {
2988
- position: fixed;
2989
- z-index: 2147483647;
2990
- inset: 0;
2991
- padding: 0.25em;
2992
- width: fit-content;
2993
- height: fit-content;
2994
- border-width: initial;
2995
- border-color: initial;
2996
- border-image: initial;
2997
- border-style: solid;
2998
- background-color: canvas;
2999
- color: canvastext;
3000
- overflow: auto;
3001
- margin: auto;
3002
- }
3003
-
3004
- :where(dialog[popover][open]) {
3005
- display: revert;
3006
- }
3007
-
3008
- :where([anchor].\\:popover-open) {
3009
- inset: auto;
3010
- }
3011
-
3012
- :where([anchor]:popover-open) {
3013
- inset: auto;
3014
- }
3015
-
3016
- @supports not (background-color: canvas) {
3017
- :where([popover]) {
3018
- background-color: white;
3019
- color: black;
3020
- }
3021
- }
3022
-
3023
- @supports (width: -moz-fit-content) {
3024
- :where([popover]) {
3025
- width: -moz-fit-content;
3026
- height: -moz-fit-content;
3027
- }
3028
- }
3029
-
3030
- @supports not (inset: 0) {
3031
- :where([popover]) {
3032
- top: 0;
3033
- left: 0;
3034
- right: 0;
3035
- bottom: 0;
3036
- }
3037
- }
3038
-
3039
- :where([popover]:not(.\\:popover-open)) {
3040
- display: none;
3041
- }
3042
- `,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
-
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)}";
3045
- const PostPopovercontainerStyle0 = postPopovercontainerCss;
3046
-
3047
- const SIDE_MAP = {
3048
- top: 'bottom',
3049
- right: 'left',
3050
- bottom: 'top',
3051
- left: 'right',
3052
- };
3053
- const PostPopovercontainer = class {
3054
- constructor(hostRef) {
3055
- index.registerInstance(this, hostRef);
3056
- this.postToggle = index.createEvent(this, "postToggle", 7);
3057
- this.placement = 'top';
3058
- this.edgeGap = 8;
3059
- this.arrow = false;
3060
- }
3061
- componentDidLoad() {
3062
- this.host.setAttribute('popover', '');
3063
- this.host.addEventListener('beforetoggle', this.handleToggle.bind(this));
3064
- }
3065
- disconnectedCallback() {
3066
- if (typeof this.clearAutoUpdate === 'function')
3067
- this.clearAutoUpdate();
3068
- }
3069
- /**
3070
- * Programmatically display the tooltip
3071
- * @param target An element with [data-tooltip-target="id"] where the tooltip should be shown
3072
- */
3073
- async show(target) {
3074
- if (!this.toggleTimeoutId) {
3075
- this.eventTarget = target;
3076
- this.calculatePosition();
3077
- this.host.showPopover();
3078
- }
3079
- }
3080
- /**
3081
- * Programmatically hide this tooltip
3082
- */
3083
- async hide() {
3084
- if (!this.toggleTimeoutId) {
3085
- this.eventTarget = null;
3086
- this.host.hidePopover();
3087
- }
3088
- }
3089
- /**
3090
- * Toggle tooltip display
3091
- * @param target An element with [data-tooltip-target="id"] where the tooltip should be shown
3092
- * @param force Pass true to always show or false to always hide
3093
- */
3094
- async toggle(target, force) {
3095
- // Prevent instant double toggle
3096
- if (!this.toggleTimeoutId) {
3097
- this.eventTarget = target;
3098
- this.calculatePosition();
3099
- this.host.togglePopover(force);
3100
- this.toggleTimeoutId = null;
3101
- }
3102
- return this.host.matches(':where(:popover-open, .popover-open');
3103
- }
3104
- /**
3105
- * Start or stop auto updates based on tooltip events.
3106
- * Tooltips can be closed or opened with other methods than class members,
3107
- * therefore listening to the toggle event is safer for cleaning up.
3108
- * @param e ToggleEvent
3109
- */
3110
- handleToggle(e) {
3111
- this.toggleTimeoutId = window.setTimeout(() => (this.toggleTimeoutId = null), 10);
3112
- const isOpen = e.newState === 'open';
3113
- if (isOpen) {
3114
- this.startAutoupdates();
3115
- }
3116
- else {
3117
- if (typeof this.clearAutoUpdate === 'function')
3118
- this.clearAutoUpdate();
3119
- }
3120
- this.postToggle.emit(isOpen);
3121
- }
3122
- /**
3123
- * Start listening for DOM updates, scroll events etc. that have
3124
- * an influence on tooltip positioning
3125
- */
3126
- startAutoupdates() {
3127
- this.clearAutoUpdate = autoUpdate(this.eventTarget, this.host, this.calculatePosition.bind(this));
3128
- }
3129
- async calculatePosition() {
3130
- const gap = this.edgeGap;
3131
- const middleware = [
3132
- flip(),
3133
- inline(),
3134
- shift({
3135
- 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
- limiter: limitShift({
3139
- offset: 32,
3140
- }),
3141
- }),
3142
- size({
3143
- apply({ availableWidth, elements }) {
3144
- Object.assign(elements.floating.style, {
3145
- maxWidth: `${availableWidth - gap * 2}px`,
3146
- });
3147
- },
3148
- }),
3149
- offset(this.arrow ? gap + 4 : gap), // 4px outside of element to account for focus outline + ~arrow size
3150
- ];
3151
- if (this.arrow) {
3152
- middleware.push(arrow({ element: this.arrowRef, padding: gap }));
3153
- }
3154
- const { x, y, middlewareData, placement: currentPlacement, } = await computePosition(this.eventTarget, this.host, {
3155
- placement: this.placement || 'top',
3156
- strategy: 'fixed',
3157
- middleware,
3158
- });
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);
3177
- }
3178
- }
3179
- render() {
3180
- return (index.h(index.Host, { key: '23e391236e263f7ae7c66c994b2847bcba269b37', "data-version": _package.version }, this.arrow && (index.h("span", { key: '6c6053b2fd315a5940a2c3493182249782b2492c', class: "arrow", ref: el => {
3181
- this.arrowRef = el;
3182
- } })), index.h("slot", { key: 'ff998f110f42a22e886eba398285c41d94718bab' })));
3183
- }
3184
- get host() { return index.getElement(this); }
3185
- };
3186
- PostPopovercontainer.style = PostPopovercontainerStyle0;
3187
-
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
- exports.PostPopovercontainer = PostPopovercontainer;
3239
- exports.PostTogglebutton = PostTogglebutton;