@swisspost/design-system-components 10.7.0 → 10.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (333) hide show
  1. package/README.md +1 -1
  2. package/dist/cjs/{create-validator-decorator-D7nAb9KJ.js → create-validator-decorator-DVm_SDrR.js} +1 -1
  3. package/dist/cjs/{index-DWIlRT6N.js → index-DY4QxKNv.js} +5 -5
  4. package/dist/cjs/is-focus-visible-B3CqVQsX.js +19 -0
  5. package/dist/cjs/loader.cjs.js +2 -2
  6. package/dist/cjs/{one-of-B8RUgrZk.js → one-of-qu7_EPxf.js} +1 -1
  7. package/dist/cjs/{package-BtKYhTNj.js → package-kgRYEtTJ.js} +1 -1
  8. package/dist/cjs/{pattern-B6VoDk_m.js → pattern-EpwCKMyC.js} +1 -1
  9. package/dist/cjs/post-accordion_2.cjs.entry.js +6 -6
  10. package/dist/cjs/post-autocomplete.cjs.entry.js +5 -5
  11. package/dist/cjs/post-avatar.cjs.entry.js +85 -61
  12. package/dist/cjs/post-back-to-top.cjs.entry.js +6 -6
  13. package/dist/cjs/post-banner.cjs.entry.js +5 -5
  14. package/dist/cjs/post-breadcrumb-item.cjs.entry.js +8 -8
  15. package/dist/cjs/post-breadcrumbs.cjs.entry.js +7 -7
  16. package/dist/cjs/post-closebutton_14.cjs.entry.js +545 -607
  17. package/dist/cjs/post-collapsible_2.cjs.entry.js +13 -7
  18. package/dist/cjs/post-components.cjs.js +2 -2
  19. package/dist/cjs/post-date-picker.cjs.entry.js +24 -9
  20. package/dist/cjs/post-footer.cjs.entry.js +6 -6
  21. package/dist/cjs/post-linkarea.cjs.entry.js +3 -3
  22. package/dist/cjs/post-listbox-option.cjs.entry.js +4 -4
  23. package/dist/cjs/post-listbox.cjs.entry.js +4 -4
  24. package/dist/cjs/post-number-input.cjs.entry.js +5 -5
  25. package/dist/cjs/post-pagination.cjs.entry.js +6 -6
  26. package/dist/cjs/post-popover-trigger.cjs.entry.js +5 -5
  27. package/dist/cjs/post-popover.cjs.entry.js +9 -9
  28. package/dist/cjs/post-progressbar.cjs.entry.js +4 -4
  29. package/dist/cjs/post-rating.cjs.entry.js +6 -6
  30. package/dist/cjs/post-side-navigation-trigger.cjs.entry.js +6 -6
  31. package/dist/cjs/post-side-navigation.cjs.entry.js +14 -9
  32. package/dist/cjs/post-stepper-item.cjs.entry.js +3 -3
  33. package/dist/cjs/post-stepper.cjs.entry.js +7 -7
  34. package/dist/cjs/post-tab-item.cjs.entry.js +6 -6
  35. package/dist/cjs/post-tab-panel.cjs.entry.js +6 -6
  36. package/dist/cjs/post-tabs.cjs.entry.js +37 -9
  37. package/dist/cjs/post-tooltip-trigger.cjs.entry.js +6 -6
  38. package/dist/cjs/post-tooltip.cjs.entry.js +8 -6
  39. package/dist/cjs/{required-bXtlqqaA.js → required-Dgzo-rb5.js} +1 -1
  40. package/dist/cjs/{type-BqLE7Uui.js → type-DBRxpBZI.js} +1 -1
  41. package/dist/cjs/{url-CUy3C3sH.js → url-Dl1JABeP.js} +1 -1
  42. package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
  43. package/dist/collection/components/post-avatar/avatar-utils.js +1 -2
  44. package/dist/collection/components/post-avatar/post-avatar.js +77 -59
  45. package/dist/collection/components/post-back-to-top/post-back-to-top.css +1 -1
  46. package/dist/collection/components/post-banner/post-banner.css +1 -1
  47. package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.css +1 -1
  48. package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.css +1 -1
  49. package/dist/collection/components/post-closebutton/post-closebutton.css +1 -1
  50. package/dist/collection/components/post-collapsible/post-collapsible.js +9 -3
  51. package/dist/collection/components/post-date-picker/post-date-picker.css +1 -1
  52. package/dist/collection/components/post-date-picker/post-date-picker.js +18 -3
  53. package/dist/collection/components/post-footer/post-footer.css +1 -1
  54. package/dist/collection/components/post-header/post-header.css +1 -1
  55. package/dist/collection/components/post-header/post-header.js +100 -18
  56. package/dist/collection/components/post-icon/post-icon.css +1 -1
  57. package/dist/collection/components/post-icon/post-icon.js +1 -2
  58. package/dist/collection/components/post-language-menu/post-language-menu.css +1 -1
  59. package/dist/collection/components/post-language-menu/post-language-menu.js +2 -2
  60. package/dist/collection/components/post-linkarea/post-linkarea.js +1 -1
  61. package/dist/collection/components/post-listbox/post-listbox.css +1 -1
  62. package/dist/collection/components/post-listbox/post-listbox.js +1 -1
  63. package/dist/collection/components/post-listbox-option/post-listbox-option.js +2 -2
  64. package/dist/collection/components/post-logo/post-logo.css +1 -1
  65. package/dist/collection/components/post-logo/post-logo.js +1 -1
  66. package/dist/collection/components/post-mainnavigation/post-mainnavigation.css +1 -1
  67. package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +1 -1
  68. package/dist/collection/components/post-megadropdown/post-megadropdown.css +1 -1
  69. package/dist/collection/components/post-megadropdown/post-megadropdown.js +34 -16
  70. package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.css +1 -1
  71. package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +1 -1
  72. package/dist/collection/components/post-menu/post-menu.css +1 -1
  73. package/dist/collection/components/post-menu/post-menu.js +3 -14
  74. package/dist/collection/components/post-menu-item/post-menu-item.css +1 -1
  75. package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +1 -1
  76. package/dist/collection/components/post-number-input/post-number-input.css +2 -2
  77. package/dist/collection/components/post-number-input/post-number-input.js +2 -2
  78. package/dist/collection/components/post-pagination/post-pagination.css +1 -1
  79. package/dist/collection/components/post-popover/post-popover.css +1 -1
  80. package/dist/collection/components/post-popover/post-popover.js +2 -2
  81. package/dist/collection/components/post-popover-trigger/post-popover-trigger.js +1 -1
  82. package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
  83. package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +211 -323
  84. package/dist/collection/components/post-progressbar/post-progressbar.js +1 -1
  85. package/dist/collection/components/post-rating/post-rating.js +1 -1
  86. package/dist/collection/components/post-side-navigation/post-side-navigation.css +1 -1
  87. package/dist/collection/components/post-side-navigation/post-side-navigation.js +7 -3
  88. package/dist/collection/components/post-side-navigation-trigger/post-side-navigation-trigger.js +1 -1
  89. package/dist/collection/components/post-stepper/post-stepper.js +1 -1
  90. package/dist/collection/components/post-stepper-item/post-stepper-item.js +1 -1
  91. package/dist/collection/components/post-tab-item/post-tab-item.js +2 -2
  92. package/dist/collection/components/post-tab-panel/post-tab-panel.js +1 -1
  93. package/dist/collection/components/post-tabs/post-tabs.css +1 -1
  94. package/dist/collection/components/post-tabs/post-tabs.js +31 -3
  95. package/dist/collection/components/post-togglebutton/post-togglebutton.js +1 -1
  96. package/dist/collection/components/post-tooltip/post-tooltip.css +1 -1
  97. package/dist/collection/components/post-tooltip/post-tooltip.js +3 -1
  98. package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js +1 -1
  99. package/dist/collection/test-setup.js +28 -0
  100. package/dist/collection/utils/floating-ui/middleware/flip.js +77 -0
  101. package/dist/collection/utils/floating-ui/middleware/safe-space.js +52 -0
  102. package/dist/collection/utils/floating-ui/util.js +10 -0
  103. package/dist/collection/utils/index.js +1 -0
  104. package/dist/collection/utils/is-focus-visible.js +15 -0
  105. package/dist/components/is-focus-visible.js +1 -0
  106. package/dist/components/package.js +1 -1
  107. package/dist/components/post-accordion-item2.js +1 -1
  108. package/dist/components/post-avatar.js +1 -1
  109. package/dist/components/post-back-to-top.js +1 -1
  110. package/dist/components/post-banner.js +1 -1
  111. package/dist/components/post-breadcrumb-item.js +1 -1
  112. package/dist/components/post-breadcrumbs.js +1 -1
  113. package/dist/components/post-closebutton2.js +1 -1
  114. package/dist/components/post-collapsible2.js +1 -1
  115. package/dist/components/post-date-picker.js +1 -1
  116. package/dist/components/post-footer.js +1 -1
  117. package/dist/components/post-header.js +1 -1
  118. package/dist/components/post-icon2.js +1 -1
  119. package/dist/components/post-language-menu.js +1 -1
  120. package/dist/components/post-linkarea.js +1 -1
  121. package/dist/components/post-listbox-option.js +1 -1
  122. package/dist/components/post-listbox.js +1 -1
  123. package/dist/components/post-logo.js +1 -1
  124. package/dist/components/post-mainnavigation.js +1 -1
  125. package/dist/components/post-megadropdown-trigger.js +1 -1
  126. package/dist/components/post-megadropdown.js +1 -1
  127. package/dist/components/post-menu-item2.js +1 -1
  128. package/dist/components/post-menu-trigger2.js +1 -1
  129. package/dist/components/post-menu2.js +1 -1
  130. package/dist/components/post-number-input.js +1 -1
  131. package/dist/components/post-pagination.js +1 -1
  132. package/dist/components/post-popover-trigger.js +1 -1
  133. package/dist/components/post-popover.js +1 -1
  134. package/dist/components/post-popovercontainer2.js +1 -1
  135. package/dist/components/post-progressbar.js +1 -1
  136. package/dist/components/post-rating.js +1 -1
  137. package/dist/components/post-side-navigation-trigger.js +1 -1
  138. package/dist/components/post-side-navigation.js +1 -1
  139. package/dist/components/post-stepper-item.js +1 -1
  140. package/dist/components/post-stepper.js +1 -1
  141. package/dist/components/post-tab-item.js +1 -1
  142. package/dist/components/post-tab-panel.js +1 -1
  143. package/dist/components/post-tabs.js +1 -1
  144. package/dist/components/post-togglebutton2.js +1 -1
  145. package/dist/components/post-tooltip-trigger.js +1 -1
  146. package/dist/components/post-tooltip.js +1 -1
  147. package/dist/components/react/index.js +1 -1
  148. package/dist/components/react/p-BWwWKRO5.js +1 -0
  149. package/dist/components/react/p-CAL337jJ.js +1 -0
  150. package/dist/components/react/p-CBVthgj-.js +1 -0
  151. package/dist/components/react/{p-DS46v3ju.js → p-CLkb55ud.js} +1 -1
  152. package/dist/components/react/{p-C8_zqgAP.js → p-CYBXVnUJ.js} +1 -1
  153. package/dist/components/react/p-Ci-TsJYj.js +1 -0
  154. package/dist/components/react/p-CtgMQs_Q.js +1 -0
  155. package/dist/components/react/p-D4LBzsbB.js +1 -0
  156. package/dist/components/react/p-D5lqOfVk.js +1 -0
  157. package/dist/components/react/p-DGpWjdFJ.js +1 -0
  158. package/dist/components/react/{p-BBv5JYsW.js → p-DSk0Nq8U.js} +1 -1
  159. package/dist/components/react/{p-1y1rv5Tw.js → p-Db3d6dKF.js} +1 -1
  160. package/dist/components/react/p-DkDIUTRi.js +1 -0
  161. package/dist/components/react/post-accordion-item.js +1 -1
  162. package/dist/components/react/post-accordion.js +1 -1
  163. package/dist/components/react/post-autocomplete.js +1 -1
  164. package/dist/components/react/post-avatar.js +1 -1
  165. package/dist/components/react/post-back-to-top.js +1 -1
  166. package/dist/components/react/post-banner.js +1 -1
  167. package/dist/components/react/post-breadcrumb-item.js +1 -1
  168. package/dist/components/react/post-breadcrumbs.js +1 -1
  169. package/dist/components/react/post-closebutton.js +1 -1
  170. package/dist/components/react/post-collapsible-trigger.js +1 -1
  171. package/dist/components/react/post-collapsible.js +1 -1
  172. package/dist/components/react/post-date-picker.js +1 -1
  173. package/dist/components/react/post-footer.js +1 -1
  174. package/dist/components/react/post-header.js +1 -1
  175. package/dist/components/react/post-icon.js +1 -1
  176. package/dist/components/react/post-language-menu-item.js +1 -1
  177. package/dist/components/react/post-language-menu.js +1 -1
  178. package/dist/components/react/post-linkarea.js +1 -1
  179. package/dist/components/react/post-listbox-option.js +1 -1
  180. package/dist/components/react/post-listbox.js +1 -1
  181. package/dist/components/react/post-logo.js +1 -1
  182. package/dist/components/react/post-mainnavigation.js +1 -1
  183. package/dist/components/react/post-megadropdown-trigger.js +1 -1
  184. package/dist/components/react/post-megadropdown.js +1 -1
  185. package/dist/components/react/post-menu-item.js +1 -1
  186. package/dist/components/react/post-menu-trigger.js +1 -1
  187. package/dist/components/react/post-menu.js +1 -1
  188. package/dist/components/react/post-number-input.js +1 -1
  189. package/dist/components/react/post-pagination.js +1 -1
  190. package/dist/components/react/post-popover-trigger.js +1 -1
  191. package/dist/components/react/post-popover.js +1 -1
  192. package/dist/components/react/post-popovercontainer.js +1 -1
  193. package/dist/components/react/post-progressbar.js +1 -1
  194. package/dist/components/react/post-rating.js +1 -1
  195. package/dist/components/react/post-side-navigation-trigger.js +1 -1
  196. package/dist/components/react/post-side-navigation.js +1 -1
  197. package/dist/components/react/post-stepper-item.js +1 -1
  198. package/dist/components/react/post-stepper.js +1 -1
  199. package/dist/components/react/post-tab-item.js +1 -1
  200. package/dist/components/react/post-tab-panel.js +1 -1
  201. package/dist/components/react/post-tabs.js +1 -1
  202. package/dist/components/react/post-togglebutton.js +1 -1
  203. package/dist/components/react/post-tooltip-trigger.js +1 -1
  204. package/dist/components/react/post-tooltip.js +1 -1
  205. package/dist/docs.json +67 -45
  206. package/dist/esm/{create-validator-decorator-DFpQtJzK.js → create-validator-decorator-Cp_NUmrr.js} +1 -1
  207. package/dist/esm/{index-Bs0zeM5Q.js → index-D0jX3Fts.js} +5 -5
  208. package/dist/esm/is-focus-visible-BWwWKRO5.js +17 -0
  209. package/dist/esm/loader.js +3 -3
  210. package/dist/esm/{one-of-DQCfaZpw.js → one-of-B9locHPx.js} +1 -1
  211. package/dist/esm/{package-BBz9PVf0.js → package-CAL337jJ.js} +1 -1
  212. package/dist/esm/{pattern-3lnaFlkk.js → pattern-BL3OBU8C.js} +1 -1
  213. package/dist/esm/post-accordion_2.entry.js +6 -6
  214. package/dist/esm/post-autocomplete.entry.js +5 -5
  215. package/dist/esm/post-avatar.entry.js +85 -61
  216. package/dist/esm/post-back-to-top.entry.js +6 -6
  217. package/dist/esm/post-banner.entry.js +5 -5
  218. package/dist/esm/post-breadcrumb-item.entry.js +8 -8
  219. package/dist/esm/post-breadcrumbs.entry.js +7 -7
  220. package/dist/esm/post-closebutton_14.entry.js +545 -607
  221. package/dist/esm/post-collapsible_2.entry.js +13 -7
  222. package/dist/esm/post-components.js +3 -3
  223. package/dist/esm/post-date-picker.entry.js +24 -9
  224. package/dist/esm/post-footer.entry.js +6 -6
  225. package/dist/esm/post-linkarea.entry.js +3 -3
  226. package/dist/esm/post-listbox-option.entry.js +4 -4
  227. package/dist/esm/post-listbox.entry.js +4 -4
  228. package/dist/esm/post-number-input.entry.js +5 -5
  229. package/dist/esm/post-pagination.entry.js +6 -6
  230. package/dist/esm/post-popover-trigger.entry.js +5 -5
  231. package/dist/esm/post-popover.entry.js +9 -9
  232. package/dist/esm/post-progressbar.entry.js +4 -4
  233. package/dist/esm/post-rating.entry.js +6 -6
  234. package/dist/esm/post-side-navigation-trigger.entry.js +6 -6
  235. package/dist/esm/post-side-navigation.entry.js +14 -9
  236. package/dist/esm/post-stepper-item.entry.js +3 -3
  237. package/dist/esm/post-stepper.entry.js +7 -7
  238. package/dist/esm/post-tab-item.entry.js +6 -6
  239. package/dist/esm/post-tab-panel.entry.js +6 -6
  240. package/dist/esm/post-tabs.entry.js +37 -9
  241. package/dist/esm/post-tooltip-trigger.entry.js +6 -6
  242. package/dist/esm/post-tooltip.entry.js +8 -6
  243. package/dist/esm/{required-NuzPg5jZ.js → required-CDaQB1gC.js} +1 -1
  244. package/dist/esm/{type-ChnksJ25.js → type-CQ7XuPCZ.js} +1 -1
  245. package/dist/esm/{url-BCk3ZU-x.js → url-B-86gtTK.js} +1 -1
  246. package/dist/post-components/{p-63e570c4.entry.js → p-077be898.entry.js} +1 -1
  247. package/dist/post-components/{p-6a2f47af.entry.js → p-184bd61c.entry.js} +1 -1
  248. package/dist/post-components/p-1933e4fa.entry.js +1 -0
  249. package/dist/post-components/p-21e6f82a.entry.js +1 -0
  250. package/dist/post-components/{p-c2de3702.entry.js → p-2220db4c.entry.js} +1 -1
  251. package/dist/post-components/p-2aff3873.entry.js +1 -0
  252. package/dist/post-components/p-2b475cd7.entry.js +1 -0
  253. package/dist/post-components/p-33a898ec.entry.js +1 -0
  254. package/dist/post-components/p-405c1fff.entry.js +1 -0
  255. package/dist/post-components/{p-bd128657.entry.js → p-5efaca25.entry.js} +1 -1
  256. package/dist/post-components/p-6a9661d9.entry.js +1 -0
  257. package/dist/post-components/{p-f275b872.entry.js → p-7dd192b3.entry.js} +1 -1
  258. package/dist/post-components/p-8e5052d5.entry.js +1 -0
  259. package/dist/post-components/p-9440738d.entry.js +1 -0
  260. package/dist/post-components/{p-31550a50.entry.js → p-965a02fb.entry.js} +1 -1
  261. package/dist/post-components/{p-61a45246.entry.js → p-9740719e.entry.js} +1 -1
  262. package/dist/post-components/p-9af8f5af.entry.js +1 -0
  263. package/dist/post-components/{p-DeUk3rcv.js → p-BCPv4bcY.js} +1 -1
  264. package/dist/post-components/p-BWwWKRO5.js +1 -0
  265. package/dist/post-components/p-CAL337jJ.js +1 -0
  266. package/dist/post-components/{p-D1s6tESz.js → p-CP3LjuFR.js} +1 -1
  267. package/dist/post-components/p-D0jX3Fts.js +2 -0
  268. package/dist/post-components/{p-Bl-_v3aT.js → p-D6mVqZLg.js} +1 -1
  269. package/dist/post-components/{p-BwhzbRIR.js → p-DSaWK_q-.js} +1 -1
  270. package/dist/post-components/p-VPHnF9fB.js +1 -0
  271. package/dist/post-components/p-a6971c1c.entry.js +1 -0
  272. package/dist/post-components/p-a7d8f328.entry.js +1 -0
  273. package/dist/post-components/{p-f784e149.entry.js → p-bb9a0e1e.entry.js} +1 -1
  274. package/dist/post-components/{p-e6a4146b.entry.js → p-bf8c7dca.entry.js} +1 -1
  275. package/dist/post-components/p-c3351def.entry.js +1 -0
  276. package/dist/post-components/{p-31a97aae.entry.js → p-c87f33f0.entry.js} +1 -1
  277. package/dist/post-components/{p-64480e3a.entry.js → p-e30b534d.entry.js} +1 -1
  278. package/dist/post-components/{p-43240818.entry.js → p-e73eabac.entry.js} +1 -1
  279. package/dist/post-components/{p-f566768e.entry.js → p-e84fe883.entry.js} +1 -1
  280. package/dist/post-components/{p-aa33141b.entry.js → p-eaa28736.entry.js} +1 -1
  281. package/dist/post-components/{p-451ec8ee.entry.js → p-f2cb8ed1.entry.js} +1 -1
  282. package/dist/post-components/{p-58b66607.entry.js → p-ffbf2375.entry.js} +1 -1
  283. package/dist/post-components/p-gv9b-Z15.js +1 -0
  284. package/dist/post-components/post-components.css +2 -2
  285. package/dist/post-components/post-components.esm.js +1 -1
  286. package/dist/types/components/post-avatar/avatar-utils.d.ts +0 -2
  287. package/dist/types/components/post-avatar/post-avatar.d.ts +11 -9
  288. package/dist/types/components/post-date-picker/post-date-picker.d.ts +2 -0
  289. package/dist/types/components/post-header/post-header.d.ts +14 -0
  290. package/dist/types/components/post-language-menu/post-language-menu.d.ts +3 -0
  291. package/dist/types/components/post-megadropdown/post-megadropdown.d.ts +1 -1
  292. package/dist/types/components/post-menu/post-menu.d.ts +0 -1
  293. package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +74 -69
  294. package/dist/types/components/post-tabs/post-tabs.d.ts +4 -0
  295. package/dist/types/components.d.ts +39 -26
  296. package/dist/types/utils/floating-ui/middleware/flip.d.ts +14 -0
  297. package/dist/types/utils/floating-ui/middleware/safe-space.d.ts +10 -0
  298. package/dist/types/utils/floating-ui/util.d.ts +4 -0
  299. package/dist/types/utils/index.d.ts +1 -0
  300. package/dist/types/utils/is-focus-visible.d.ts +5 -0
  301. package/dist/vrt/helpers/header-test-config.js +2 -1
  302. package/hydrate/index.js +659 -634
  303. package/hydrate/index.mjs +659 -634
  304. package/package.json +22 -21
  305. package/dist/components/react/p-BBz9PVf0.js +0 -1
  306. package/dist/components/react/p-BgEY7xhT.js +0 -1
  307. package/dist/components/react/p-C3J7fIWx.js +0 -1
  308. package/dist/components/react/p-C5ibTdH5.js +0 -1
  309. package/dist/components/react/p-CUKzje9q.js +0 -1
  310. package/dist/components/react/p-DTBtJCjk.js +0 -1
  311. package/dist/components/react/p-XUkUhxaz.js +0 -1
  312. package/dist/components/react/p-ialuSSl2.js +0 -1
  313. package/dist/post-components/p-10e430c3.entry.js +0 -1
  314. package/dist/post-components/p-32e1e951.entry.js +0 -1
  315. package/dist/post-components/p-4f08b99b.entry.js +0 -1
  316. package/dist/post-components/p-54432b47.entry.js +0 -1
  317. package/dist/post-components/p-5d7de657.entry.js +0 -1
  318. package/dist/post-components/p-63dd9a76.entry.js +0 -1
  319. package/dist/post-components/p-96d07f2b.entry.js +0 -1
  320. package/dist/post-components/p-9a1e8b1d.entry.js +0 -1
  321. package/dist/post-components/p-BBz9PVf0.js +0 -1
  322. package/dist/post-components/p-Bs0zeM5Q.js +0 -2
  323. package/dist/post-components/p-DH-eJVHZ.js +0 -1
  324. package/dist/post-components/p-Dk-DtPZn.js +0 -1
  325. package/dist/post-components/p-aff180f5.entry.js +0 -1
  326. package/dist/post-components/p-d5327dd1.entry.js +0 -1
  327. package/dist/post-components/p-e1817744.entry.js +0 -1
  328. package/dist/post-components/p-f6da5e69.entry.js +0 -1
  329. package/dist/post-components/p-f917527c.entry.js +0 -1
  330. package/dist/types/home/runner/work/design-system/design-system/packages/components/.stencil/vrt/helpers/header-variants.config.d.ts +0 -23
  331. package/dist/vrt/helpers/header-variants.config.js +0 -157
  332. /package/dist/collection/utils/{floating-ui.js → floating-ui/platform/safe-area.js} +0 -0
  333. /package/dist/types/utils/{floating-ui.d.ts → floating-ui/platform/safe-area.d.ts} +0 -0
@@ -1,21 +1,22 @@
1
- import { r as registerInstance, h, H as Host, a as getElement, c as createEvent } from './index-Bs0zeM5Q.js';
1
+ import { r as registerInstance, h, H as Host, a as getElement, c as createEvent } from './index-D0jX3Fts.js';
2
2
  import { b as breakpoint } from './breakpoints-I1j7a0bW.js';
3
3
  import { f as findClosestAcrossShadow, E as EventFrom } from './event-from-BEcxHjuM.js';
4
- import { v as version } from './package-BBz9PVf0.js';
5
- import { O as OneOf } from './one-of-DQCfaZpw.js';
6
- import { R as Required } from './required-NuzPg5jZ.js';
4
+ import { v as version } from './package-CAL337jJ.js';
5
+ import { O as OneOf } from './one-of-B9locHPx.js';
6
+ import { R as Required } from './required-CDaQB1gC.js';
7
7
  import { f as fade } from './fade-DsgPYmAa.js';
8
8
  import { g as getDeepFocusableChildren, a as getFocusableChildren } from './get-focusable-children-DxYnH2ye.js';
9
9
  import { t as throttle } from './index-bR8vy6-s.js';
10
- import { T as Type } from './type-ChnksJ25.js';
10
+ import { T as Type } from './type-CQ7XuPCZ.js';
11
11
  import { n as nanoid } from './nanoid-8LXe8Zt_.js';
12
- import { P as Pattern } from './pattern-3lnaFlkk.js';
13
- import { U as Url } from './url-BCk3ZU-x.js';
12
+ import { P as Pattern } from './pattern-BL3OBU8C.js';
13
+ import { U as Url } from './url-B-86gtTK.js';
14
14
  import { r as resolveEasing } from './utils-CoDiS_Ik.js';
15
15
  import { f as fadeSlide } from './fade-slide-CvOvauo9.js';
16
16
  import { P as PLACEMENT_TYPES } from './placement-DRiVosES.js';
17
17
  import { g as getRoot } from './get-root-08F-DB-d.js';
18
- import './create-validator-decorator-DFpQtJzK.js';
18
+ import { i as isFocusVisible } from './is-focus-visible-BWwWKRO5.js';
19
+ import './create-validator-decorator-Cp_NUmrr.js';
19
20
 
20
21
  const CLOSABLE_TARGETS = [
21
22
  {
@@ -59,7 +60,7 @@ const BUTTON_TYPES = ['button', 'reset'];
59
60
  const PLACEMENT = ['manual', 'auto'];
60
61
  const SIZE = ['default', 'small'];
61
62
 
62
- const postClosebuttonCss = () => `.btn{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;min-height:var(--post-device-sizing-interactive-button-height-1);gap:var(--post-device-spacing-gap-inline-10);padding:0 var(--post-device-spacing-padding-inline-6)}.btn:not(:disabled):hover{text-decoration:none}.btn:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.btn{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}.btn: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){.btn:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn: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){.btn:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn{border-width:1px !important;transition:none}.btn:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.btn>post-icon{width:var(--post-device-sizing-interactive-button-icon-4);height:var(--post-device-sizing-interactive-button-icon-4)}.btn-primary{box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-primary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-primary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-primary:disabled{border-color:var(--post-scheme-color-interactive-button-primary-disabled-stroke);color:var(--post-scheme-color-interactive-button-primary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-disabled-bg)}.btn-primary:not(:disabled):hover,.btn-primary.pretend-hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}.btn-default{box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-secondary-enabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-default:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-default:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-default:disabled{border-color:var(--post-scheme-color-interactive-button-secondary-disabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-disabled-bg)}.btn-default:not(:disabled):hover,.btn-default.pretend-hover{border-color:var(--post-scheme-color-interactive-button-secondary-hover-stroke);color:var(--post-scheme-color-interactive-button-secondary-hover-fg);background-color:var(--post-scheme-color-interactive-button-secondary-hover-bg)}.btn-secondary{box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-secondary-enabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-secondary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-secondary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-secondary:disabled{border-color:var(--post-scheme-color-interactive-button-secondary-disabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-disabled-bg)}.btn-secondary:not(:disabled):hover,.btn-secondary.pretend-hover{border-color:var(--post-scheme-color-interactive-button-secondary-hover-stroke);color:var(--post-scheme-color-interactive-button-secondary-hover-fg);background-color:var(--post-scheme-color-interactive-button-secondary-hover-bg)}.btn-tertiary{border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-tertiary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-tertiary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-tertiary:disabled{border-color:var(--post-scheme-color-interactive-button-tertiary-disabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-disabled-bg)}.btn-tertiary:not(:disabled):hover,.btn-tertiary.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}.btn-link{border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link:disabled,.btn-link.disabled{text-decoration:none}}.btn-link:disabled{border-color:var(--post-scheme-color-interactive-button-tertiary-disabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-disabled-fg)}.btn-link:not(:disabled):hover,.btn-link.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}.btn-sm{min-height:var(--post-device-sizing-interactive-button-height-4);gap:var(--post-device-spacing-gap-inline-11);padding:0 var(--post-device-spacing-padding-inline-7)}.btn-sm>post-icon{width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5)}.btn-lg{min-height:var(--post-device-sizing-interactive-button-height-2);gap:var(--post-device-spacing-gap-inline-1);padding:0 var(--post-device-spacing-padding-inline-5)}.btn-lg>post-icon{width:var(--post-device-sizing-interactive-button-icon-3);height:var(--post-device-sizing-interactive-button-icon-3)}.btn-link{-webkit-text-decoration:var(--post-core-text-decoration-underline);text-decoration:var(--post-core-text-decoration-underline);border:0 none;border-radius:0;min-height:0;font-size:inherit;font-weight:inherit;padding:0}.btn-link{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}.btn-link:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn-link:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.btn-link:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}.btn-icon{padding:0;width:var(--post-device-sizing-interactive-button-height-1);height:var(--post-device-sizing-interactive-button-height-1);min-height:0;vertical-align:text-bottom}.btn-icon.btn-link{width:var(--post-device-sizing-interactive-button-icon-4);height:var(--post-device-sizing-interactive-button-icon-4)}.btn-icon>post-icon{display:block;width:var(--post-device-sizing-interactive-button-icon-4);height:var(--post-device-sizing-interactive-button-icon-4)}.btn-icon.btn-sm{padding:0;width:var(--post-device-sizing-interactive-button-height-4);height:var(--post-device-sizing-interactive-button-height-4);min-height:0;vertical-align:text-bottom}.btn-icon.btn-sm.btn-link{width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5)}.btn-icon.btn-sm>post-icon{display:block;width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5)}.btn-icon.btn-lg{padding:0;width:var(--post-device-sizing-interactive-button-height-2);height:var(--post-device-sizing-interactive-button-height-2);min-height:0;vertical-align:text-bottom}.btn-icon.btn-lg.btn-link{width:var(--post-device-sizing-interactive-button-icon-3);height:var(--post-device-sizing-interactive-button-icon-3)}.btn-icon.btn-lg>post-icon{display:block;width:var(--post-device-sizing-interactive-button-icon-3);height:var(--post-device-sizing-interactive-button-icon-3)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:host .btn{background-color:var(--post-scheme-color-interactive-primary-enabled-bg1)}:host .btn:not(:disabled):hover,:host .btn.pretend-hover{background-color:var(--post-scheme-color-interactive-primary-hover-bg)}:host(:not([placement])),:host([placement=auto]){position:absolute;inset-block-start:0;inset-inline-end:0;transform:translate(50%, -50%)}:host([size=small]) .btn{height:var(--post-device-sizing-interactive-button-height-7);width:var(--post-device-sizing-interactive-button-height-7)}`;
63
+ const postClosebuttonCss = () => `.btn{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;white-space:normal;overflow-wrap:anywhere;text-wrap:pretty;text-align:center;min-height:var(--post-device-sizing-interactive-button-height-1);gap:var(--post-device-spacing-gap-inline-10);padding:0 var(--post-device-spacing-padding-inline-6);border-radius:calc(var(--post-device-sizing-interactive-button-height-1) / 2)}.btn:not(:disabled):hover{text-decoration:none}.btn:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.btn{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}.btn: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){.btn:focus-visible{outline-color:Highlight !important}}.pretend-focus.btn{outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.pretend-focus.btn{outline-color:Highlight !important}}.btn:has(: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){.btn:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn: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){.btn:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn{border-width:1px !important;transition:none}.btn:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.btn>post-icon{width:var(--post-device-sizing-interactive-button-icon-4);height:var(--post-device-sizing-interactive-button-icon-4);flex-shrink:0}.btn-primary{box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-primary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-primary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-primary:disabled{border-color:var(--post-scheme-color-interactive-button-primary-disabled-stroke);color:var(--post-scheme-color-interactive-button-primary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-disabled-bg)}.btn-primary:not(:disabled):hover,.btn-primary.pretend-hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}.btn-default{box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-secondary-enabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-default:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-default:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-default:disabled{border-color:var(--post-scheme-color-interactive-button-secondary-disabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-disabled-bg)}.btn-default:not(:disabled):hover,.btn-default.pretend-hover{border-color:var(--post-scheme-color-interactive-button-secondary-hover-stroke);color:var(--post-scheme-color-interactive-button-secondary-hover-fg);background-color:var(--post-scheme-color-interactive-button-secondary-hover-bg)}.btn-secondary{box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-secondary-enabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-secondary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-secondary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-secondary:disabled{border-color:var(--post-scheme-color-interactive-button-secondary-disabled-stroke);color:var(--post-scheme-color-interactive-button-secondary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-secondary-disabled-bg)}.btn-secondary:not(:disabled):hover,.btn-secondary.pretend-hover{border-color:var(--post-scheme-color-interactive-button-secondary-hover-stroke);color:var(--post-scheme-color-interactive-button-secondary-hover-fg);background-color:var(--post-scheme-color-interactive-button-secondary-hover-bg)}.btn-tertiary{border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-tertiary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover{background-color:Highlight !important}.btn-tertiary:not(:disabled,.disabled):not(a.btn-tertiary.px-0):hover>post-icon{color:HighlightText !important}}.btn-tertiary:disabled{border-color:var(--post-scheme-color-interactive-button-tertiary-disabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-disabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-disabled-bg)}.btn-tertiary:not(:disabled):hover,.btn-tertiary.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}.btn-link{border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link:disabled,.btn-link.disabled{text-decoration:none}}.btn-link:disabled{border-color:var(--post-scheme-color-interactive-button-tertiary-disabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-disabled-fg)}.btn-link:not(:disabled):hover,.btn-link.pretend-hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}.btn-sm{min-height:var(--post-device-sizing-interactive-button-height-4);gap:var(--post-device-spacing-gap-inline-11);padding:0 var(--post-device-spacing-padding-inline-7);border-radius:calc(var(--post-device-sizing-interactive-button-height-4) / 2)}.btn-sm>post-icon{width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5);flex-shrink:0}.btn-lg{min-height:var(--post-device-sizing-interactive-button-height-2);gap:var(--post-device-spacing-gap-inline-1);padding:0 var(--post-device-spacing-padding-inline-5);border-radius:calc(var(--post-device-sizing-interactive-button-height-2) / 2)}.btn-lg>post-icon{width:var(--post-device-sizing-interactive-button-icon-3);height:var(--post-device-sizing-interactive-button-icon-3);flex-shrink:0}.btn-link{-webkit-text-decoration:var(--post-core-text-decoration-underline);text-decoration:var(--post-core-text-decoration-underline);border:0 none;border-radius:0;min-height:0;font-size:inherit;font-weight:inherit;padding:0}.btn-link{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}.btn-link:focus-visible{outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link:focus-visible{outline-color:Highlight !important}}.btn-link.pretend-focus{outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link.pretend-focus{outline-color:Highlight !important}}.btn-link:has(:focus-visible){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn-link:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-link:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.btn-link:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}.btn-link:disabled{color:var(--post-scheme-color-interactive-primary-disabled-fg1);text-decoration-style:var(--post-core-border-style-dash)}.btn-icon{padding:0;width:var(--post-device-sizing-interactive-button-height-1);height:var(--post-device-sizing-interactive-button-height-1);min-height:0;vertical-align:text-bottom}.btn-icon.btn-link{width:var(--post-device-sizing-interactive-button-icon-4);height:var(--post-device-sizing-interactive-button-icon-4)}.btn-icon>post-icon{display:block;width:var(--post-device-sizing-interactive-button-icon-4);height:var(--post-device-sizing-interactive-button-icon-4)}.btn-icon.btn-sm{padding:0;width:var(--post-device-sizing-interactive-button-height-4);height:var(--post-device-sizing-interactive-button-height-4);min-height:0;vertical-align:text-bottom}.btn-icon.btn-sm.btn-link{width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5)}.btn-icon.btn-sm>post-icon{display:block;width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5)}.btn-icon.btn-lg{padding:0;width:var(--post-device-sizing-interactive-button-height-2);height:var(--post-device-sizing-interactive-button-height-2);min-height:0;vertical-align:text-bottom}.btn-icon.btn-lg.btn-link{width:var(--post-device-sizing-interactive-button-icon-3);height:var(--post-device-sizing-interactive-button-icon-3)}.btn-icon.btn-lg>post-icon{display:block;width:var(--post-device-sizing-interactive-button-icon-3);height:var(--post-device-sizing-interactive-button-icon-3)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:host .btn{background-color:var(--post-scheme-color-interactive-primary-enabled-bg1)}:host .btn:not(:disabled):hover,:host .btn.pretend-hover{background-color:var(--post-scheme-color-interactive-primary-hover-bg)}:host(:not([placement])),:host([placement=auto]){position:absolute;inset-block-start:0;inset-inline-end:0;transform:translate(50%, -50%)}:host([size=small]) .btn{height:var(--post-device-sizing-interactive-button-height-7);width:var(--post-device-sizing-interactive-button-height-7)}`;
63
64
 
64
65
  var __decorate$b = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
65
66
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -168,7 +169,7 @@ function slide(el, direction, options = {}) {
168
169
  return animateSlide(el, keyframes, options);
169
170
  }
170
171
 
171
- const postHeaderCss = () => `:host{--post-global-header-top:calc( var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height) );--post-header-top:calc(var(--post-header-reduced-height) - var(--post-header-expanded-height));--post-logo-height:calc( var(--post-global-header-expanded-height) - var(--post-header-scroll-top, 0px) );--post-global-controls-top:clamp( 1000 * (var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height)), calc( -1 * min(var(--post-header-scroll-top, 0px) / 4, var(--post-global-header-reduced-height)) ), 0px )}@media screen and (min-width: 1024px){:host{--post-header-gap:8px;--post-global-header-padding-inline-start:4px;--post-global-header-padding-inline-end:8px;--post-local-header-padding-inline-start:12px;--post-local-header-padding-inline-end:8px}}@media screen and (min-width: 600px)and (max-width: 1023.98px){:host{--post-header-gap:12px 8px;--post-global-header-padding-inline-start:4px;--post-global-header-padding-inline-end:4px;--post-local-header-padding-inline-start:12px;--post-local-header-padding-inline-end:4px;--post-local-header-padding-block:12px;--post-burger-menu-padding-inline:40px;--post-burger-menu-body-gap:32px;--post-burger-menu-footer-gap:24px}}@media screen and (min-width: 600px)and (max-width: 779.98px){:host{--post-burger-menu-padding-inline:16px}}@media screen and (min-width: 0)and (max-width: 599.98px){:host{--post-header-gap:12px 8px;--post-global-header-padding-inline-start:0px;--post-global-header-padding-inline-end:8px;--post-local-header-padding-inline-start:8px;--post-local-header-padding-inline-end:8px;--post-local-header-padding-block:8px;--post-burger-menu-padding-inline:16px;--post-burger-menu-body-gap:24px;--post-burger-menu-footer-gap:16px}}:host(:not([full-width])),:host([full-width=false]){--post-header-content-max-width:1440px}:host([data-expanded]),:host([data-menu-extended]){--post-header-top:0;--post-global-header-top:-0.001px;--post-global-controls-top:0;--post-global-header-reduced-height:var(--post-global-header-expanded-height)}*,::before,::after{box-sizing:border-box}:host,header,.global-header,.local-header{transition:inset-block-start 150ms cubic-bezier(0.4, 0, 0.2, 1)}.section,.sliding-controls{display:flex;align-items:center;justify-content:space-between;gap:var(--post-header-gap);flex-wrap:wrap}.section{max-width:var(--post-header-content-max-width);margin-inline:auto}:host{display:block;position:sticky;inset-block-start:var(--post-header-top);z-index:1020;box-shadow:var(--post-device-elevation-300)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host{border-bottom:1px solid}}.global-header{z-index:2;position:sticky;inset-block-start:var(--post-global-header-top);background-color:#fc0}.global-header::before{position:absolute;z-index:-1;left:0;bottom:0;width:100%;height:100dvh;content:"";background-color:#fc0}.global-header .section{height:var(--post-global-header-expanded-height);padding-inline-start:var(--post-global-header-padding-inline-start);padding-inline-end:var(--post-global-header-padding-inline-end)}.global-header .logo{align-self:flex-end;width:var(--post-global-header-expanded-height);height:var(--post-logo-height);min-height:var(--post-global-header-reduced-height);max-height:100%;margin-inline-end:calc(20px - var(--post-header-gap));margin-inline-start:clamp(var(--post-logo-expanded-offset),var(--post-logo-expanded-offset) + (var(--post-logo-reduced-offset) - var(--post-logo-expanded-offset))*min(var(--post-header-scroll-top, 0px),var(--post-global-header-expanded-height) - var(--post-global-header-reduced-height))/max(1px,var(--post-global-header-expanded-height) - var(--post-global-header-reduced-height)),var(--post-logo-reduced-offset))}.global-header .sliding-controls{flex-grow:1;justify-content:flex-end;position:relative;inset-block-start:var(--post-global-controls-top)}.global-header .audience{margin-inline-end:auto}@media screen and (max-width: 1023.98px){.global-header slot:where([name=audience],[name=global-nav-secondary]){display:none}}.local-header{position:relative;background-color:#fff;min-height:var(--post-local-header-expanded-min-height);display:var(--post-local-header-display, flex);align-items:var(--post-local-header-align-items, center)}.local-header .section{width:100%;padding-inline-start:var(--post-local-header-padding-inline-start);padding-inline-end:var(--post-local-header-padding-inline-end);padding-block:var(--post-local-header-padding-block)}@media screen and (min-width: 1024px){.local-header .section{display:grid;grid-template:var(--post-local-header-grid-template)}}@media screen and (max-width: 1023.98px){.local-header .section{display:flex;align-self:center}}@media screen and (max-width: 1023.98px)and (max-width: 599.98px){.local-header .section{justify-content:end}}.local-header:where(.megadropdown-open)::after,.local-header:has(~.burger-menu.extended)::after{content:"";display:block;position:absolute;inset-inline:0;inset-block-end:0;height:1px;background-color:#e1e0dc}.local-header .local-nav{flex:0 0 auto}@media screen and (max-width: 1023.98px){.local-header slot[name=main-nav]{display:none}}.burger-button{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:4px 10px;gap:6px;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);display:var(--post-burger-button-display, flex)}.burger-button:not(:disabled):hover{text-decoration:none}.burger-button:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.burger-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}.burger-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){.burger-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.burger-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){.burger-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.burger-button{border-width:1px !important;transition:none}.burger-button:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.burger-button:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}.burger-button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}.burger-button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}@media screen and (min-width: 0)and (max-width: 599.98px){.burger-button{padding:10px}.burger-button>:not(post-icon){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.burger-button>post-icon{font-size:1.5rem}}@media screen and (min-width: 1024px){.burger-button{display:none}}.burger-menu{z-index:-1;position:absolute;inset-inline:0;inset-block-start:100%;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));overflow:hidden auto;display:flex;flex-direction:column;background-color:#fafafa}.burger-menu.extended.second-level-open{overflow:hidden}.burger-menu:not(.extended){transform:translateY(-100%);display:none}.burger-menu:not(.extended)>*{display:none}.burger-menu .burger-menu-body,.burger-menu .burger-menu-footer{display:flex;flex-direction:column;padding-inline:var(--post-burger-menu-padding-inline)}.burger-menu .burger-menu-body{flex-grow:1;padding-block:24px;gap:var(--post-burger-menu-body-gap)}.burger-menu .burger-menu-footer{background-color:#f0efed;padding-block-start:16px;padding-block-end:max(24px, env(safe-area-inset-bottom, 0px));gap:var(--post-burger-menu-footer-gap)}.burger-menu .local-nav{min-height:56px;display:flex;align-items:center;justify-content:flex-end;padding-inline:4px}`;
172
+ const postHeaderCss = () => `:host{--post-global-header-top:calc( var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height) );--post-header-top:calc(var(--post-header-reduced-height) - var(--post-header-expanded-height));--post-logo-height:calc( var(--post-global-header-expanded-height) - var(--post-header-scroll-top, 0px) );--post-global-controls-top:clamp( 1000 * (var(--post-global-header-reduced-height) - var(--post-global-header-expanded-height)), calc( -1 * min(var(--post-header-scroll-top, 0px) / 4, var(--post-global-header-reduced-height)) ), 0px )}@media screen and (min-width: 1024px){:host{--post-header-gap:8px;--post-global-header-padding-inline-start:4px;--post-global-header-padding-inline-end:8px;--post-local-header-padding-inline-start:12px;--post-local-header-padding-inline-end:8px}}@media screen and (min-width: 600px)and (max-width: 1023.98px){:host{--post-header-gap:12px 8px;--post-global-header-padding-inline-start:4px;--post-global-header-padding-inline-end:4px;--post-local-header-padding-inline-start:12px;--post-local-header-padding-inline-end:4px;--post-local-header-padding-block:12px;--post-burger-menu-padding-inline:40px;--post-burger-menu-body-gap:32px;--post-burger-menu-footer-gap:24px}}@media screen and (min-width: 600px)and (max-width: 779.98px){:host{--post-burger-menu-padding-inline:16px}}@media screen and (min-width: 0)and (max-width: 599.98px){:host{--post-header-gap:12px 8px;--post-global-header-padding-inline-start:0px;--post-global-header-padding-inline-end:8px;--post-local-header-padding-inline-start:8px;--post-local-header-padding-inline-end:8px;--post-local-header-padding-block:8px;--post-burger-menu-padding-inline:16px;--post-burger-menu-body-gap:24px;--post-burger-menu-footer-gap:16px}}:host(:not([full-width])),:host([full-width=false]){--post-header-content-max-width:1440px}:host([data-expanded]),:host([data-menu-extended]){--post-header-top:0;--post-global-header-top:-0.001px;--post-global-controls-top:0;--post-global-header-reduced-height:var(--post-global-header-expanded-height)}*,::before,::after{box-sizing:border-box}:host,header,.global-header,.local-header{transition:inset-block-start 150ms cubic-bezier(0.4, 0, 0.2, 1)}.section,.sliding-controls{display:flex;align-items:center;justify-content:space-between;gap:var(--post-header-gap);flex-wrap:wrap}.section{max-width:var(--post-header-content-max-width);margin-inline:auto}:host{display:block;position:sticky;inset-block-start:var(--post-header-top);z-index:1020;box-shadow:var(--post-device-elevation-300)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host{border-bottom:1px solid}}.scroll-max{position:absolute;inset-block-start:0;inset-inline-start:0;inline-size:var(--post-header-scroll-max, 0);block-size:0;visibility:hidden;pointer-events:none}.global-header{z-index:2;position:sticky;inset-block-start:var(--post-global-header-top);background-color:#fc0}.global-header::before{position:absolute;z-index:-1;left:0;bottom:0;width:100%;height:100dvh;content:"";background-color:#fc0}.global-header .section{height:var(--post-global-header-expanded-height);padding-inline-start:var(--post-global-header-padding-inline-start);padding-inline-end:var(--post-global-header-padding-inline-end)}.global-header .logo{align-self:flex-end;width:var(--post-global-header-expanded-height);height:var(--post-logo-height);min-height:var(--post-global-header-reduced-height);max-height:100%;margin-inline-end:calc(20px - var(--post-header-gap));margin-inline-start:clamp(var(--post-logo-expanded-offset),var(--post-logo-expanded-offset) + (var(--post-logo-reduced-offset) - var(--post-logo-expanded-offset))*min(var(--post-header-scroll-top, 0px),var(--post-global-header-expanded-height) - var(--post-global-header-reduced-height))/max(1px,var(--post-global-header-expanded-height) - var(--post-global-header-reduced-height)),var(--post-logo-reduced-offset))}.global-header .sliding-controls{flex-grow:1;justify-content:flex-end;position:relative;inset-block-start:var(--post-global-controls-top)}.global-header .audience{margin-inline-end:auto}@media screen and (max-width: 1023.98px){.global-header slot:where([name=audience],[name=global-nav-secondary]){display:none}}.local-header{position:relative;background-color:#fff;min-height:var(--post-local-header-expanded-min-height);display:var(--post-local-header-display, flex);align-items:var(--post-local-header-align-items, center)}.local-header .section{width:100%;padding-inline-start:var(--post-local-header-padding-inline-start);padding-inline-end:var(--post-local-header-padding-inline-end);padding-block:var(--post-local-header-padding-block)}@media screen and (min-width: 1024px){.local-header .section{display:grid;grid-template:var(--post-local-header-grid-template)}}@media screen and (max-width: 1023.98px){.local-header .section{display:flex;align-self:center}}@media screen and (max-width: 1023.98px)and (max-width: 599.98px){.local-header .section{justify-content:end}}.local-header:where(.megadropdown-open)::after,.local-header:has(~.burger-menu.extended)::after{content:"";display:block;position:absolute;inset-inline:0;inset-block-end:0;height:1px;background-color:#e1e0dc}.local-header .local-nav{flex:0 0 auto}@media screen and (max-width: 1023.98px){.local-header slot[name=main-nav]{display:none}}.burger-button{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:4px 10px;gap:6px;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);display:var(--post-burger-button-display, flex)}.burger-button:not(:disabled):hover{text-decoration:none}.burger-button:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.burger-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}.burger-button: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){.burger-button:focus-visible{outline-color:Highlight !important}}.burger-button.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){.burger-button.pretend-focus{outline-color:Highlight !important}}.burger-button:has(: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){.burger-button:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.burger-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){.burger-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.burger-button{border-width:1px !important;transition:none}.burger-button:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.burger-button:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}.burger-button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}.burger-button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}@media screen and (min-width: 0)and (max-width: 599.98px){.burger-button{padding:10px}.burger-button>:not(post-icon){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.burger-button>post-icon{font-size:1.5rem}}@media screen and (min-width: 1024px){.burger-button{display:none}}.burger-menu{z-index:-1;position:absolute;inset-inline:0;inset-block-start:100%;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));overflow:hidden auto;display:flex;flex-direction:column;background-color:#fafafa}.burger-menu.extended.second-level-open{overflow:hidden}.burger-menu:not(.extended){transform:translateY(-100%);display:none}.burger-menu:not(.extended)>*{display:none}.burger-menu .burger-menu-body,.burger-menu .burger-menu-footer{display:flex;flex-direction:column;padding-inline:var(--post-burger-menu-padding-inline)}.burger-menu .burger-menu-body{flex-grow:1;padding-block:24px;gap:var(--post-burger-menu-body-gap)}.burger-menu .burger-menu-footer{background-color:#f0efed;padding-block-start:16px;padding-block-end:max(24px, env(safe-area-inset-bottom, 0px));gap:var(--post-burger-menu-footer-gap)}.burger-menu .local-nav{min-height:56px;display:flex;align-items:center;justify-content:flex-end;padding-inline:4px}`;
172
173
 
173
174
  var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
174
175
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -182,7 +183,8 @@ var __decorate$a = (undefined && undefined.__decorate) || function (decorators,
182
183
  };
183
184
  const PostHeader = class {
184
185
  get hasBurgerMenu() {
185
- return this.device !== 'desktop' && this.hasMainNav;
186
+ return (this.device !== 'desktop' &&
187
+ (this.hasMainNav || this.hasAudience || this.hasGlobalNavSecondary));
186
188
  }
187
189
  get scrollParent() {
188
190
  const frozenScrollParent = document.querySelector('[data-post-scroll-locked]');
@@ -212,6 +214,8 @@ const PostHeader = class {
212
214
  }
213
215
  constructor(hostRef) {
214
216
  registerInstance(this, hostRef);
217
+ this.scrollMax = Infinity;
218
+ this.scrollPosition = 0;
215
219
  this.throttledResize = throttle(50, () => this.updateLocalHeaderHeight());
216
220
  this.animationOptions = {
217
221
  duration: 350,
@@ -220,6 +224,8 @@ const PostHeader = class {
220
224
  this.device = breakpoint.get('device');
221
225
  this.hasTitle = true;
222
226
  this.hasMainNav = true;
227
+ this.hasAudience = true;
228
+ this.hasGlobalNavSecondary = true;
223
229
  this.hasLocalNav = true;
224
230
  this.burgerMenuExtended = false;
225
231
  this.megadropdownOpen = false;
@@ -241,9 +247,14 @@ const PostHeader = class {
241
247
  this.closeBurgerMenu();
242
248
  }
243
249
  };
250
+ this.onScroll = () => {
251
+ this.handleScrollEvent();
252
+ this.collapseIfNotKeyboardFocused();
253
+ };
244
254
  this.handleScrollEvent = this.handleScrollEvent.bind(this);
245
255
  this.updateScrollParentHeight = this.updateScrollParentHeight.bind(this);
246
256
  this.updateLocalHeaderHeight = this.updateLocalHeaderHeight.bind(this);
257
+ this.updateScrollMax = this.updateScrollMax.bind(this);
247
258
  this.keyboardHandler = this.keyboardHandler.bind(this);
248
259
  this.handleLinkClick = this.handleLinkClick.bind(this);
249
260
  this.checkSlottedContent = this.checkSlottedContent.bind(this);
@@ -251,15 +262,16 @@ const PostHeader = class {
251
262
  }
252
263
  connectedCallback() {
253
264
  globalThis.addEventListener('resize', this.throttledResize, { passive: true });
254
- globalThis.addEventListener('scroll', this.handleScrollEvent, {
265
+ globalThis.addEventListener('scroll', this.onScroll, {
255
266
  passive: true,
256
267
  });
257
- this.scrollParent.addEventListener('scroll', this.handleScrollEvent, {
268
+ this.scrollParent.addEventListener('scroll', this.onScroll, {
258
269
  passive: true,
259
270
  });
260
271
  document.addEventListener('postToggleMegadropdown', this.megadropdownStateHandler);
261
272
  globalThis.addEventListener('postBreakpoint:device', this.breakpointChange);
262
273
  this.handleScrollParentResize();
274
+ this.handleScrollMaxResize();
263
275
  this.lockBody(false, this.burgerMenuExtended, 'burgerMenuExtended');
264
276
  }
265
277
  componentWillRender() {
@@ -270,6 +282,7 @@ const PostHeader = class {
270
282
  componentDidRender() {
271
283
  this.getFocusableElements();
272
284
  this.handleLocalHeaderResize();
285
+ this.handleScrollMaxResize();
273
286
  // When a megadropdown is open on desktop and the user resizes to mobile, we set
274
287
  // burgerMenuExtended = true but burgerMenuButton doesn't exist yet — it only renders
275
288
  // on mobile/tablet. Syncing here ensures it gets the correct toggled state on resize.
@@ -286,9 +299,9 @@ const PostHeader = class {
286
299
  const scrollParent = this.scrollParent;
287
300
  globalThis.removeEventListener('postBreakpoint:device', this.breakpointChange);
288
301
  globalThis.removeEventListener('resize', this.throttledResize);
289
- globalThis.removeEventListener('scroll', this.handleScrollEvent);
302
+ globalThis.removeEventListener('scroll', this.onScroll);
290
303
  if (scrollParent)
291
- scrollParent.removeEventListener('scroll', this.handleScrollEvent);
304
+ scrollParent.removeEventListener('scroll', this.onScroll);
292
305
  document.removeEventListener('postToggleMegadropdown', this.megadropdownStateHandler);
293
306
  this.host.removeEventListener('keydown', this.keyboardHandler);
294
307
  if (this.host.shadowRoot) {
@@ -302,6 +315,11 @@ const PostHeader = class {
302
315
  this.localHeaderResizeObserver.disconnect();
303
316
  this.localHeaderResizeObserver = null;
304
317
  }
318
+ if (this.scrollMaxResizeObserver) {
319
+ this.scrollMaxResizeObserver.disconnect();
320
+ this.scrollMaxResizeObserver = null;
321
+ }
322
+ this.lastScrollTop = undefined;
305
323
  if (this.slottedContentObserver) {
306
324
  this.slottedContentObserver.disconnect();
307
325
  this.slottedContentObserver = null;
@@ -381,9 +399,46 @@ const PostHeader = class {
381
399
  });
382
400
  this.megadropdownOpen = false;
383
401
  }
402
+ // The header only stays expanded to keep keyboard focus visible
403
+ // once focus is no longer keyboard focus (e.g. after a click), it can collapse on scroll
404
+ collapseIfNotKeyboardFocused() {
405
+ if (!('expanded' in this.host.dataset))
406
+ return;
407
+ if (this.getDeepActiveElement()?.matches(':focus-visible'))
408
+ return;
409
+ delete this.host.dataset.expanded;
410
+ }
411
+ getScrollPosition() {
412
+ const scrollParent = this.scrollParent;
413
+ return scrollParent === document.body ? globalThis.scrollY : scrollParent.scrollTop;
414
+ }
415
+ // Focusing a control of the collapsed header scrolls it into view before the focus events are dispatched
416
+ // the scroll event is not dispatched yet, so scrollPosition is still the position before the focus
417
+ // Never skip the scroll when the position is unchanged: an instant scroll cancels a pending smooth scroll
418
+ restoreScrollPosition() {
419
+ const scrollParent = this.scrollParent;
420
+ const scrollContainer = scrollParent === document.body ? globalThis : scrollParent;
421
+ scrollContainer.scrollTo({ top: this.scrollPosition, behavior: 'instant' });
422
+ }
384
423
  handleScrollEvent() {
385
- const scrollTop = this.scrollParent === document.body ? window.scrollY : this.scrollParent.scrollTop;
386
- document.documentElement.style.setProperty('--post-header-scroll-top', `${Math.max(scrollTop, 0)}px`);
424
+ this.scrollPosition = this.getScrollPosition();
425
+ // Once the header is fully reduced, writing a new value would only trigger
426
+ // a style recalculation of the whole page without any visual change
427
+ const value = Math.min(Math.max(this.scrollPosition, 0), this.scrollMax);
428
+ if (value === this.lastScrollTop)
429
+ return;
430
+ this.lastScrollTop = value;
431
+ document.documentElement.style.setProperty('--post-header-scroll-top', `${value}px`);
432
+ }
433
+ updateScrollMax() {
434
+ if (!this.scrollMaxElement)
435
+ return;
436
+ // Never limit the scroll value when the header styles are not loaded
437
+ const isScrollMaxDefined = getComputedStyle(this.host).getPropertyValue('--post-header-scroll-max').trim() !== '';
438
+ this.scrollMax = isScrollMaxDefined
439
+ ? Math.ceil(this.scrollMaxElement.getBoundingClientRect().width)
440
+ : Infinity;
441
+ this.handleScrollEvent();
387
442
  }
388
443
  updateLocalHeaderHeight() {
389
444
  const localHeaderElement = this.host.shadowRoot.querySelector('.local-header');
@@ -424,16 +479,34 @@ const PostHeader = class {
424
479
  this.localHeaderResizeObserver.observe(localHeader);
425
480
  }
426
481
  }
482
+ handleScrollMaxResize() {
483
+ if (!this.scrollMaxElement || this.scrollMaxResizeObserver)
484
+ return;
485
+ // The ResizeObserver is not called for an initial size of 0px (e.g. on mobile)
486
+ this.updateScrollMax();
487
+ this.scrollMaxResizeObserver = new ResizeObserver(this.updateScrollMax);
488
+ this.scrollMaxResizeObserver.observe(this.scrollMaxElement);
489
+ }
427
490
  handleSlottedContentChanges() {
428
491
  if (!this.slottedContentObserver) {
429
492
  this.checkSlottedContent();
430
493
  this.slottedContentObserver = new MutationObserver(this.checkSlottedContent);
431
- this.slottedContentObserver.observe(this.host, { childList: true });
494
+ this.slottedContentObserver.observe(this.host, {
495
+ childList: true,
496
+ subtree: true,
497
+ attributes: true,
498
+ attributeFilter: ['slot'],
499
+ });
432
500
  }
433
501
  }
502
+ slotHasNavigationItems(slotName, selector) {
503
+ return Array.from(this.host.querySelectorAll(`:scope > [slot="${slotName}"]`)).some(element => element.matches(selector) || !!element.querySelector(selector));
504
+ }
434
505
  checkSlottedContent() {
435
506
  this.hasTitle = !!this.host.querySelector('[slot="title"]');
436
- this.hasMainNav = !!this.host.querySelector('[slot="main-nav"]');
507
+ this.hasMainNav = this.slotHasNavigationItems('main-nav', 'a:not(post-megadropdown *), post-megadropdown-trigger');
508
+ this.hasAudience = this.slotHasNavigationItems('audience', 'a, button');
509
+ this.hasGlobalNavSecondary = this.slotHasNavigationItems('global-nav-secondary', 'a, button');
437
510
  this.hasLocalNav = !!this.host.querySelector('[slot="local-nav"]');
438
511
  }
439
512
  switchLanguageSwitchMode() {
@@ -443,16 +516,25 @@ const PostHeader = class {
443
516
  });
444
517
  }
445
518
  onFocusChange(event) {
446
- // Ignore focus moving between elements of the header (e.g. into the language menu flyout)
447
- if (event.type === 'focusout' && this.isWithinHeader(event.relatedTarget))
519
+ if (event.type === 'focusout') {
520
+ // Ignore focus moving between elements of the header (e.g. into the language menu flyout)
521
+ if (this.isWithinHeader(event.relatedTarget))
522
+ return;
523
+ delete this.host.dataset.expanded;
448
524
  return;
525
+ }
526
+ // Mouse focus never changes the state
527
+ // collapsing here would move the controls away from the pointer before the click completes
449
528
  const isFocusVisible = this.getDeepActiveElement()?.matches(':focus-visible');
450
- const isFocusedInHeader = event.type === 'focusin';
451
- // Only expand when focus is in the part that collapses on scroll
529
+ if (!isFocusVisible)
530
+ return;
531
+ // Keyboard focus: expanded only while focus is in the part that collapses on scroll
452
532
  const collapsiblePart = this.device === 'desktop' ? this.globalHeader : this.localHeader;
453
533
  const isInCollapsiblePart = event.composedPath().includes(collapsiblePart);
454
- const isHeaderExpanded = isFocusVisible && isFocusedInHeader && isInCollapsiblePart;
455
- this.host.toggleAttribute('data-expanded', isHeaderExpanded);
534
+ this.host.toggleAttribute('data-expanded', isInCollapsiblePart);
535
+ // The header is now expanded, so the focused control stays visible at the previous position
536
+ if (isInCollapsiblePart)
537
+ this.restoreScrollPosition();
456
538
  }
457
539
  isWithinHeader(target) {
458
540
  return target instanceof Node && (target === this.host || this.host.contains(target));
@@ -475,11 +557,10 @@ const PostHeader = class {
475
557
  }
476
558
  render() {
477
559
  const onDesktop = this.device === 'desktop';
478
- const onTabletAndMobile = this.device !== 'desktop';
479
- return (h(Host, { key: 'b56ff059c4b6b855a4b05012822d29b59893db1e', "data-version": version, "data-color-scheme": "light", "data-burger-menu": this.hasBurgerMenu, "data-menu-extended": this.burgerMenuExtended }, h("header", { key: 'f8b6e0fc7f56e4b07e2efa518a83cbac1ca99aa1' }, h("div", { key: '46a213668dafe872c97ecc1eba14aa26f43e9d7b', ref: el => (this.globalHeader = el), class: "global-header" }, h("div", { key: '4b2e823d1b3029dec5fbe00bdc85cdac2d9620b7', class: "section" }, h("div", { key: 'd82d6fe19a4bb0fa5803e34f203e23bf0e50a54c', class: "logo" }, h("slot", { key: 'b7658b72eb94cd41f616c035b5bbdc5c74f54553', name: "post-logo" })), h("div", { key: '7e85473a77094a2636c33536dd97e8a1cbaef808', class: "sliding-controls" }, onDesktop && (h("div", { key: 'c517e32382d0d79152f41ba0027466a9d4248a31', class: "audience" }, h("slot", { key: '35904084eae6c4ac4181b3b60ce884413195c8f0', name: "audience" }))), h("slot", { key: '1de9359402c52f416c44607282f5a3f47af246b8', name: "global-nav-primary" }), (onDesktop || !this.hasMainNav) && [
560
+ return (h(Host, { key: '54f311b0483a77983c8a260a730e12b10f936f2d', "data-version": version, "data-color-scheme": "light", "data-burger-menu": this.hasBurgerMenu, "data-menu-extended": this.burgerMenuExtended }, h("span", { key: '464d6e58d8e3beec6ae8a306510e669cb2e2fec9', class: "scroll-max", "aria-hidden": "true", ref: el => (this.scrollMaxElement = el) }), h("header", { key: '1819b5300843eb4c66141a97c46832cd1ca54466' }, h("div", { key: 'e1fd6075137cb64ef6d0835d1317659da19a17f6', ref: el => (this.globalHeader = el), class: "global-header" }, h("div", { key: 'd1833a01d27a59ef9ef3203734e14f8bfe4a1541', class: "section" }, h("div", { key: '299fcbb952c0402f239a721459a2ea48a5959131', class: "logo" }, h("slot", { key: 'cb0b192d7d12dd4ba7a5bcdfea2a9f51232ebc45', name: "post-logo" })), h("div", { key: '69a54116557786db7a1c6401c9fdff4808b64ee2', class: "sliding-controls" }, onDesktop && (h("div", { key: '3e81349af69790454a0ff80d058cc1d1d34d27a2', class: "audience" }, h("slot", { key: '37a1d787da40f9bd3188aa5b640262b802a27310', name: "audience" }))), h("slot", { key: '6af478e6aa380ead70df3b6202b1b8de0573f786', name: "global-nav-primary" }), (onDesktop || !this.hasBurgerMenu) && [
480
561
  h("slot", { key: "global-nav-secondary", name: "global-nav-secondary" }),
481
562
  h("slot", { key: "language-menu", name: "language-menu" }),
482
- ], h("slot", { key: 'd0d23f956bac35b11fc4131320312e2a585b1a4b', name: "post-login" }), onTabletAndMobile && this.hasMainNav && (h("post-togglebutton", { key: '572e58fdc028cff601ee2338b8fd3f8d06f5dbea', class: "burger-button", ref: el => (this.burgerMenuButton = el), onClick: () => this.toggleBurgerMenu() }, h("span", { key: '154559ace747114de3459dd4c0648bad420c2264' }, this.textMenu), h("post-icon", { key: '5d6092bc43f79873881f5f0f1bb06931dbcf078a', "aria-hidden": "true", name: "burger", "data-showwhen": "untoggled" }), h("post-icon", { key: 'e10de4db6a93d712a5b9d2e8d3f97d2e7bc6f981', "aria-hidden": "true", name: "closex", "data-showwhen": "toggled" })))))), h("div", { key: 'dc13f512041dbe8036c1a7932647c58bceae9115', ref: el => (this.localHeader = el), class: { 'local-header': true, 'megadropdown-open': this.megadropdownOpen } }, h("div", { key: 'f0e2e41c8cd1aceb429779d36c262ae2a6c7046b', class: "section" }, h("slot", { key: '217a18a42179e9e5cdad5020487a1b9f6cdad55f', name: "side-nav" }), h("slot", { key: 'e9659713979eb9b4036a73a9096800e965b7d743', name: "title" }), this.hasTitle && h("slot", { key: 'b369555b161852eb1fd7f7bd3d416e3b6e7c011d', name: "local-nav" }), onDesktop && h("slot", { key: 'ecbc8c9e1eab8d08f8dd57a942621a8fc8035bde', name: "main-nav" }), onDesktop && !this.hasTitle && h("slot", { key: 'f8819094ba68ccda390b9eb97b422c9b41297f6e', name: "local-nav" }))), this.hasBurgerMenu && this.renderBurgerMenu())));
563
+ ], h("slot", { key: '9f1afec759f7c0ec8448077eb81164e5f2f2a86e', name: "post-login" }), (this.hasBurgerMenu) && (h("post-togglebutton", { key: '746afc808afffe295478d5ae8effdad99f551f44', class: "burger-button", ref: el => (this.burgerMenuButton = el), onClick: () => this.toggleBurgerMenu() }, h("span", { key: '4ea61aa1d259b38254914b8f78b4edbd5dbaab2a' }, this.textMenu), h("post-icon", { key: '711fd906af8578dc7ecdb90d2d238828e7f184e6', "aria-hidden": "true", name: "burger", "data-showwhen": "untoggled" }), h("post-icon", { key: '9797c5b101b734f47f35572fb63def04fd63c349', "aria-hidden": "true", name: "closex", "data-showwhen": "toggled" })))))), h("div", { key: '8e202c4085f060843bbb0e99c1b7af190fdb7c1d', ref: el => (this.localHeader = el), class: { 'local-header': true, 'megadropdown-open': this.megadropdownOpen } }, h("div", { key: '18035a103958aadc9187d33a938be44a8e13a2d6', class: "section" }, h("slot", { key: '77cb8436bea9bfae7a5ab2bcd5594dc92dc6a3ab', name: "side-nav" }), h("slot", { key: '4875e26bc0cc181e7b19771aafe56d27dd451844', name: "title" }), this.hasTitle && h("slot", { key: 'c3d1d22045c19a4ed860ae88e9ebb3d6279341af', name: "local-nav" }), onDesktop && h("slot", { key: '8e65de4132f2b7905b126849e2703da3e9b0a1a0', name: "main-nav" }), onDesktop && !this.hasTitle && h("slot", { key: '76b439a83965fe0669de37c1f2a29993abdbad30', name: "local-nav" }))), this.hasBurgerMenu && this.renderBurgerMenu())));
483
564
  }
484
565
  get host() { return getElement(this); }
485
566
  static get watchers() { return {
@@ -513,7 +594,7 @@ const ANIMATION_KEYS = [
513
594
  'throb',
514
595
  ];
515
596
 
516
- const postIconCss = () => `:host{display:inline-block;width:1em;height:1em;vertical-align:-0.15em}span{display:block;width:100%;height:100%;fill:currentColor;forced-color-adjust:preserve-parent-color;background-color:currentColor;-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100%;mask-size:100%}: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)}}`;
597
+ const postIconCss = () => `:host{display:inline-block;width:1em;height:1em;vertical-align:-0.15em}span{display:block;width:100%;height:100%;fill:currentColor;forced-color-adjust:preserve-parent-color;background-color:currentColor;mask-position:center center;mask-repeat:no-repeat;mask-size:100%}: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)}}`;
517
598
 
518
599
  var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
519
600
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -600,7 +681,6 @@ const PostIcon = class {
600
681
  getStyles() {
601
682
  const url = this.getUrl();
602
683
  return Object.fromEntries(Object.entries({
603
- '-webkit-mask-image': `url(${url})`,
604
684
  'mask-image': `url('${url}')`,
605
685
  'transform': (this.scale && !Number.isNaN(Number(this.scale)) ? 'scale(' + this.scale + ')' : '') +
606
686
  (this.rotate && !Number.isNaN(Number(this.rotate))
@@ -609,7 +689,7 @@ const PostIcon = class {
609
689
  }).filter(([_key, value]) => value !== null));
610
690
  }
611
691
  render() {
612
- return (h(Host, { key: '405ccfde4206c14f044575d0b23998d93a03ffb6', "data-version": version }, h("span", { key: 'ad70ccf63add4b881ef6096ae460e13fba09f508', style: this.getStyles() })));
692
+ return (h(Host, { key: '2d49a76d0f02832caf330d3419aea80f0aefb4d1', "data-version": version }, h("span", { key: 'bf5ee6b7fc3e7acf2b23d7787928f59b49ce73d5', style: this.getStyles() })));
613
693
  }
614
694
  get host() { return getElement(this); }
615
695
  };
@@ -633,7 +713,7 @@ PostIcon.style = postIconCss();
633
713
 
634
714
  const SWITCH_VARIANTS = ['list', 'menu'];
635
715
 
636
- const postLanguageMenuCss = () => `:host{display:flex}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.post-language-menu-dropdown-container{display:flex;flex-direction:column}.post-language-menu-trigger{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:4px 10px;gap:6px;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);text-transform:uppercase;line-height:inherit;cursor:pointer}.post-language-menu-trigger:not(:disabled):hover{text-decoration:none}.post-language-menu-trigger:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.post-language-menu-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-menu-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-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.post-language-menu-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-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-menu-trigger{border-width:1px !important;transition:none}.post-language-menu-trigger:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.post-language-menu-trigger:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}.post-language-menu-trigger:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}.post-language-menu-trigger:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}.post-language-menu-trigger post-icon{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.post-language-menu-trigger:is([aria-current],[aria-pressed=true],[aria-expanded=true]) post-icon{transform:rotate(180deg)}.post-language-menu-list{display:flex;gap:8px;margin-top:16px}`;
716
+ const postLanguageMenuCss = () => `:host{display:flex}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.post-language-menu-dropdown-container{display:flex;flex-direction:column}.post-language-menu-trigger{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:4px 10px;gap:6px;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);text-transform:uppercase;line-height:inherit;cursor:pointer}.post-language-menu-trigger:not(:disabled):hover{text-decoration:none}.post-language-menu-trigger:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.post-language-menu-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-menu-trigger: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){.post-language-menu-trigger:focus-visible{outline-color:Highlight !important}}.post-language-menu-trigger.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-menu-trigger.pretend-focus{outline-color:Highlight !important}}.post-language-menu-trigger:has(: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){.post-language-menu-trigger:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.post-language-menu-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-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.post-language-menu-trigger{border-width:1px !important;transition:none}.post-language-menu-trigger:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.post-language-menu-trigger:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}.post-language-menu-trigger:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}.post-language-menu-trigger:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}.post-language-menu-trigger post-icon{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.post-language-menu-trigger:is([aria-current],[aria-pressed=true],[aria-expanded=true]) post-icon{transform:rotate(180deg)}.post-language-menu-list{display:flex;gap:8px;margin-top:16px}`;
637
717
 
638
718
  var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
639
719
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -815,7 +895,7 @@ __decorate$7([
815
895
  ], PostLanguageMenuItem.prototype, "url", void 0);
816
896
  PostLanguageMenuItem.style = postLanguageMenuItemCss();
817
897
 
818
- 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}.logo-link{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}.logo-link: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){.logo-link:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.logo-link: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){.logo-link:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.logo-link{outline-offset:var(--post-device-spacing-padding-28) !important}.logo-link:focus,.logo-link:focus-visible{border-radius:var(--post-device-border-radius-focus)}`;
898
+ 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}.logo-link{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}.logo-link: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){.logo-link:focus-visible{outline-color:Highlight !important}}.logo-link.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){.logo-link.pretend-focus{outline-color:Highlight !important}}.logo-link:has(: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){.logo-link:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.logo-link: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){.logo-link:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.logo-link{outline-offset:var(--post-device-spacing-padding-28) !important}.logo-link:focus,.logo-link:focus-visible{border-radius:var(--post-device-border-radius-focus)}`;
819
899
 
820
900
  var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
821
901
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -842,7 +922,7 @@ const PostLogo = class {
842
922
  render() {
843
923
  const logoLink = this.url && (typeof this.url === 'string' ? this.url : this.url.href);
844
924
  const LogoTag = logoLink ? 'a' : 'span';
845
- return (h(Host, { key: '1f69b0ddc0ecf2fde47423cd7824fcbe76e4a529', "data-version": version }, h(LogoTag, { key: '096736bd50a6dd43e02a104e7e81897cb286db60', class: `logo ${logoLink ? 'logo-link' : ''}`, ...(logoLink ? { href: logoLink } : {}) }, h("span", { key: 'bc49b9591424f02744f771eb1079911f02ceca33', class: "description" }, h("slot", { key: 'ea905eac805e2a9940bfe50aa222bef738d15d27', onSlotchange: () => this.checkDescription() })), h("svg", { key: '482d94c38347017269dabd0ab3d15f4ede14f187', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, h("g", { key: 'fcd3dc56e8a0e448abe65b557639a8bea8ca580f', id: "Logo" }, h("rect", { key: '11ed7bad596ee07301f1c1101ddded089ef2bf99', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), h("polygon", { key: '6ab9d28c8492c746a2620cff62dbd92a59a00aff', 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" }), h("path", { key: '8b96cee7ee8ad1ec3c22aaf7928f7a711c05c828', 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" }))))));
925
+ return (h(Host, { key: '84ece8e71d7dec66aa634d9a8a37d6bf3197c1b6', "data-version": version }, h(LogoTag, { key: '1531c6e8f32d42e63f5482d2983f18e4c9a23b1a', class: `logo ${logoLink ? 'logo-link' : ''}`, ...(logoLink ? { href: logoLink } : {}) }, h("span", { key: 'd45d33329e30de0de9de56f2d588995a7f97d01e', class: "description" }, h("slot", { key: 'e8665c8d739dc2a2968bf1193c26ba1d1e731b38', onSlotchange: () => this.checkDescription() })), h("svg", { key: 'bb3f534952e29e2e43816c5a5dd55541d05bee26', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 72 72", "aria-hidden": "true" }, h("g", { key: '9ca05c263f6c9f41cc5406ccfd030a713ffe0254', id: "Logo" }, h("rect", { key: '30a59adc0eec11af2d90180da1f5a95b03175d21', fill: "#ffcc00", x: "0", y: "0", width: "72", height: "72" }), h("polygon", { key: 'b1cbe7c575d36cf26a1cc41c9124625c2d1e5ef1', 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" }), h("path", { key: '398027f23c8c9a4cf2bc7f8d7c8aa4ec0466f0be', 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" }))))));
846
926
  }
847
927
  get host() { return getElement(this); }
848
928
  };
@@ -851,7 +931,7 @@ __decorate$6([
851
931
  ], PostLogo.prototype, "url", void 0);
852
932
  PostLogo.style = postLogoCss();
853
933
 
854
- const postMainnavigationCss = () => `:host{display:flex;user-select:none;max-width:var(--post-header-content-max-width)}@media screen and (min-width: 1024px){:host{width:fit-content;margin-inline-start:calc(-1*var(--post-local-header-padding-inline-start));margin-inline-end:calc(-1*var(--post-local-header-padding-inline-end));overflow:hidden}}nav{flex:1 1 auto}@media screen and (min-width: 1024px){nav{scroll-behavior:smooth;max-width:100vw;overflow:hidden;height:var(--post-main-navigation-height)}}.scroll-control{z-index:1;cursor:pointer;padding:16px;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}.scroll-control.scroll-left{margin-inline-end:-48px}.scroll-control.scroll-right{margin-inline-start:-48px}.scroll-control.d-none{display:none}.scroll-control post-icon{font-size:16px}`;
934
+ const postMainnavigationCss = () => `:host{display:flex;user-select:none;max-width:var(--post-header-content-max-width)}@media screen and (min-width: 1024px){:host{width:fit-content;margin-inline-start:calc(-1*var(--post-local-header-padding-inline-start));margin-inline-end:calc(-1*var(--post-local-header-padding-inline-end));overflow:hidden}}nav{flex:1 1 auto}@media screen and (min-width: 1024px){nav{scroll-behavior:smooth;max-width:100vw;overflow:hidden;height:var(--post-main-navigation-height)}}.scroll-control{z-index:1;cursor:pointer;padding:16px;background:#fff;box-shadow:var(--post-device-elevation-500);line-height:1}.scroll-control:hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}.scroll-control.scroll-left{margin-inline-end:-48px}.scroll-control.scroll-right{margin-inline-start:-48px}.scroll-control.d-none{display:none}.scroll-control post-icon{font-size:16px}`;
855
935
 
856
936
  var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
857
937
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -982,7 +1062,7 @@ const PostMainnavigation = class {
982
1062
  }, NAVBAR_DISABLE_DURATION);
983
1063
  }
984
1064
  render() {
985
- return (h(Host, { key: 'cf7b2328a41b41ca28956120b8042590655e7bb2', version: version, class: this.canScroll ? 'scrollable' : '' }, h("div", { key: 'a25c55cf7b11a11ce86fb134dd57dbdad3d30301', "aria-hidden": "true", class: { 'scroll-control scroll-left': true, 'd-none': !this.canScrollLeft }, onMouseDown: e => this.handleScrollButtonClick(e, 'left') }, h("post-icon", { key: '013778591637d5ee0ac2cd2bf3f23c677ba2a13f', "aria-hidden": "true", name: "chevronleft" })), h("nav", { key: 'a007b7be57429580de35865e5eff0c54378d0a8e', ref: el => (this.navbar = el), "aria-label": this.textMain }, h("slot", { key: 'bc8e1db18430ee43b5963539fbaa65e1fb1b0c55' })), h("div", { key: 'cdb413fedc9a90c712db0fe5d6ab760a426ff632', "aria-hidden": "true", class: { 'scroll-control scroll-right': true, 'd-none': !this.canScrollRight }, onMouseDown: e => this.handleScrollButtonClick(e, 'right') }, h("post-icon", { key: 'b2df569a79881b3a044556ba9c0f2e2b0646e78b', "aria-hidden": "true", name: "chevronright" }))));
1065
+ return (h(Host, { key: '2e9f2361426298f620411b1d064e166992ba326e', version: version, class: this.canScroll ? 'scrollable' : '' }, h("div", { key: '10103d153e37fd591c2ce062ef7455228adbf5b9', "aria-hidden": "true", class: { 'scroll-control scroll-left': true, 'd-none': !this.canScrollLeft }, onMouseDown: e => this.handleScrollButtonClick(e, 'left') }, h("post-icon", { key: '8bb9b82626d05c1fe8f4fd1bb9f8e6d6be59ad8a', "aria-hidden": "true", name: "chevronleft" })), h("nav", { key: '6905afe8c2dfcf0f2411b45237b52d63f187d2c9', ref: el => (this.navbar = el), "aria-label": this.textMain }, h("slot", { key: '2db905e52b1604d9c6097734d055100a58625f09' })), h("div", { key: 'f8ec4f906f1c99fec2198bb350ac1735c2de8469', "aria-hidden": "true", class: { 'scroll-control scroll-right': true, 'd-none': !this.canScrollRight }, onMouseDown: e => this.handleScrollButtonClick(e, 'right') }, h("post-icon", { key: 'afed8c1778691ca5b849d78ee20d51a4b8c02fe6', "aria-hidden": "true", name: "chevronright" }))));
986
1066
  }
987
1067
  get host() { return getElement(this); }
988
1068
  };
@@ -992,7 +1072,7 @@ __decorate$5([
992
1072
  ], PostMainnavigation.prototype, "textMain", void 0);
993
1073
  PostMainnavigation.style = postMainnavigationCss();
994
1074
 
995
- const postMegadropdownCss = () => `*,::before,::after{box-sizing:border-box}.megadropdown{position:absolute;inset-inline:0;overflow-y:auto;box-shadow:var(--post-device-elevation-300)}@media screen and (min-width: 1024px){.megadropdown{max-height:calc(100vh - var(--post-header-height) - 48px);background-color:#f0efed;z-index:-1;inset-block-start:100%}.megadropdown.slide-in{animation:slide-down 350ms forwards}.megadropdown.slide-out{animation:slide-up 350ms forwards}}@media screen and (max-width: 1023.98px){.megadropdown{background-color:#fafafa;z-index:1;inset-block-start:var(--post-header-navigation-current-inset);overscroll-behavior:contain}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown{border-block-end:1px solid CanvasText}}.section{width:100%;max-width:var(--post-header-content-max-width);margin-inline:auto;position:relative}@media screen and (min-width: 1024px){.section{padding:48px 40px 40px}}@media screen and (max-width: 1023.98px){.section{display:flex;flex-direction:column;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));padding-inline:var(--post-burger-menu-padding-inline);padding-block-start:24px}}@media screen and (max-width: 1023.98px){.section .megadropdown-content{padding-block-end:max(24px, env(safe-area-inset-bottom, 0px))}}.megadropdown-title{margin-block:0 16px;font-weight:950}@media screen and (min-width: 600px)and (max-width: 1023.98px){.megadropdown-title{font-size:1.25rem}}@media screen and (min-width: 0)and (max-width: 599.98px){.megadropdown-title{font-size:1.125rem}}.back-button{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;min-height:var(--post-device-sizing-interactive-button-height-4);gap:var(--post-device-spacing-gap-inline-11);padding:0 var(--post-device-spacing-padding-inline-7);border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);order:-1;width:fit-content;padding-inline:0}.back-button:not(:disabled):hover{text-decoration:none}.back-button:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.back-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}.back-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){.back-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.back-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){.back-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.back-button{border-width:1px !important;transition:none}.back-button:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.back-button>post-icon{width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5)}.back-button:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}@media screen and (min-width: 600px)and (max-width: 1023.98px){.back-button{margin-block-end:32px}}@media screen and (min-width: 0)and (max-width: 599.98px){.back-button{margin-block-end:24px}}.close-button{position:absolute;inset-block-start:8px;inset-inline-end:8px}@media screen and (max-width: 1023.98px){.close-button{display:none}}`;
1075
+ const postMegadropdownCss = () => `*,::before,::after{box-sizing:border-box}.megadropdown{position:absolute;inset-inline:0;overflow-y:auto;box-shadow:var(--post-device-elevation-300)}@media screen and (min-width: 1024px){.megadropdown{max-height:calc(100vh - var(--post-header-height) - 48px);background-color:#f0efed;z-index:-1;inset-block-start:100%}.megadropdown.slide-in{animation:slide-down 350ms forwards}.megadropdown.slide-out{animation:slide-up 350ms forwards}}@media screen and (max-width: 1023.98px){.megadropdown{background-color:#fafafa;z-index:1;inset-block-start:var(--post-header-navigation-current-inset);overscroll-behavior:contain}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.megadropdown{border-block-end:1px solid CanvasText}}.section{width:100%;max-width:var(--post-header-content-max-width);margin-inline:auto;position:relative}@media screen and (min-width: 1024px){.section{padding:48px 40px 40px}}@media screen and (max-width: 1023.98px){.section{display:flex;flex-direction:column;height:calc(min(var(--post-header-scroll-parent-height, 100dvh),100dvh) - var(--post-header-height));padding-inline:var(--post-burger-menu-padding-inline);padding-block-start:24px}}@media screen and (max-width: 1023.98px){.section .megadropdown-content{padding-block-end:max(24px, env(safe-area-inset-bottom, 0px))}}.megadropdown-title{margin-block:0 16px;font-weight:950}@media screen and (min-width: 600px)and (max-width: 1023.98px){.megadropdown-title{font-size:1.25rem}}@media screen and (min-width: 0)and (max-width: 599.98px){.megadropdown-title{font-size:1.125rem}}.back-button{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;min-height:var(--post-device-sizing-interactive-button-height-4);gap:var(--post-device-spacing-gap-inline-11);padding:0 var(--post-device-spacing-padding-inline-7);border-radius:calc(var(--post-device-sizing-interactive-button-height-4) / 2);border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);order:-1;width:fit-content;padding-inline:0}.back-button:not(:disabled):hover{text-decoration:none}.back-button:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}.back-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}.back-button: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){.back-button:focus-visible{outline-color:Highlight !important}}.back-button.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){.back-button.pretend-focus{outline-color:Highlight !important}}.back-button:has(: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){.back-button:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.back-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){.back-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.back-button{border-width:1px !important;transition:none}.back-button:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}.back-button>post-icon{width:var(--post-device-sizing-interactive-button-icon-5);height:var(--post-device-sizing-interactive-button-icon-5);flex-shrink:0}.back-button:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}@media screen and (min-width: 600px)and (max-width: 1023.98px){.back-button{margin-block-end:32px}}@media screen and (min-width: 0)and (max-width: 599.98px){.back-button{margin-block-end:24px}}.close-button{position:absolute;inset-block-start:8px;inset-inline-end:8px}@media screen and (max-width: 1023.98px){.close-button{display:none}}`;
996
1076
 
997
1077
  var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
998
1078
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -1015,7 +1095,7 @@ const PostMegadropdown = class {
1015
1095
  registerInstance(this, hostRef);
1016
1096
  this.postToggleMegadropdown = createEvent(this, "postToggleMegadropdown");
1017
1097
  this.currentAnimation = null;
1018
- this.isAnimating = false;
1098
+ this.animationDirection = null;
1019
1099
  this.fsAnimationOptions = {
1020
1100
  translate: -10,
1021
1101
  duration: 350,
@@ -1043,7 +1123,7 @@ const PostMegadropdown = class {
1043
1123
  return;
1044
1124
  }
1045
1125
  // Ignore clicks on the trigger or its contents to prevent running hide() twice
1046
- if (this.megadropdownTrigger.contains(target)) {
1126
+ if (this.megadropdownTrigger?.contains(target)) {
1047
1127
  return;
1048
1128
  }
1049
1129
  if (target instanceof HTMLElement) {
@@ -1085,9 +1165,9 @@ const PostMegadropdown = class {
1085
1165
  * Toggles the dropdown visibility based on its current state.
1086
1166
  */
1087
1167
  async toggle() {
1088
- if (this.isAnimating) {
1168
+ if (this.animationDirection) {
1089
1169
  // If this is already animating towards a future state -> reverse intent
1090
- return this.isVisible ? this.show() : this.hide();
1170
+ return this.animationDirection === 'in' ? this.hide() : this.show();
1091
1171
  }
1092
1172
  return this.isVisible ? this.hide() : this.show();
1093
1173
  }
@@ -1143,6 +1223,9 @@ const PostMegadropdown = class {
1143
1223
  this.forceClose();
1144
1224
  return;
1145
1225
  }
1226
+ // Already closed or already closing
1227
+ if (!this.isVisible || this.animationDirection === 'out')
1228
+ return;
1146
1229
  // Update trigger state
1147
1230
  this.postToggleMegadropdown.emit({ isVisible: false, focusParent: focusParent });
1148
1231
  try {
@@ -1179,23 +1262,34 @@ const PostMegadropdown = class {
1179
1262
  }
1180
1263
  // Run the respective animation
1181
1264
  createAnimation(direction) {
1265
+ // Keep the last frame of the closing animation until the container is hidden,
1266
+ // otherwise it snaps back to full opacity for a frame before display: none is applied
1267
+ const fill = direction === 'out' ? 'forwards' : 'none';
1182
1268
  if (this.device === 'desktop') {
1183
- return fadeSlide(this.animatedContainer, direction, this.fsAnimationOptions);
1269
+ return fadeSlide(this.animatedContainer, direction, { ...this.fsAnimationOptions, fill });
1184
1270
  }
1185
1271
  return slide(this.animatedContainer, direction, {
1186
1272
  translate: 100,
1187
1273
  duration: 350,
1188
1274
  easing: direction === 'in' ? 'ease-in' : 'ease-out',
1275
+ fill,
1189
1276
  });
1190
1277
  }
1191
1278
  async animate(direction) {
1192
1279
  this.cancelAnimation();
1193
1280
  this.currentAnimation = this.createAnimation(direction);
1194
- // Flag isAnimating used to avoid toggle() de-sync
1195
- this.isAnimating = true;
1196
- await this.currentAnimation.finished;
1197
- this.isAnimating = false;
1198
- this.currentAnimation = null;
1281
+ // Used to avoid toggle() de-sync and double hide() calls
1282
+ this.animationDirection = direction;
1283
+ try {
1284
+ await this.currentAnimation.finished;
1285
+ }
1286
+ finally {
1287
+ if (this.animationDirection === direction)
1288
+ this.animationDirection = null;
1289
+ }
1290
+ // The closing animation is kept (fill: forwards) and cancelled by the next animate() call
1291
+ if (direction === 'in')
1292
+ this.currentAnimation = null;
1199
1293
  }
1200
1294
  cancelAnimation() {
1201
1295
  this.currentAnimation?.cancel();
@@ -1236,11 +1330,15 @@ const PostMegadropdown = class {
1236
1330
  }
1237
1331
  }
1238
1332
  handleTabOutside(e) {
1239
- if (e.key === 'Tab' && this.device === 'desktop') {
1240
- if (this.isVisible && !this.host.contains(e.target)) {
1241
- this.hide(false);
1242
- }
1243
- }
1333
+ if (e.key !== 'Tab' || this.device !== 'desktop' || !this.isVisible)
1334
+ return;
1335
+ const target = e.target;
1336
+ if (this.host.contains(target))
1337
+ return;
1338
+ // Focus on the own trigger keeps it open, Enter / Space on the trigger closes it
1339
+ if (this.megadropdownTrigger?.contains(target))
1340
+ return;
1341
+ this.hide(false);
1244
1342
  }
1245
1343
  /**
1246
1344
  * Sets up a MutationObserver on the host to watch for changes
@@ -1288,7 +1386,7 @@ const PostMegadropdown = class {
1288
1386
  }
1289
1387
  render() {
1290
1388
  const containerStyle = this.isVisible ? {} : { display: 'none' };
1291
- return (h(Host, { key: 'c0854fff62bf5e8de1597e46051aea5f300ee686', version: version }, h("div", { key: '1f4f66b74d7129481d76f1eec15a924b2c37718c', ref: el => (this.animatedContainer = el), class: "megadropdown", style: containerStyle }, h("div", { key: 'af743442fe3ad6211cddccddf5d0803de9f501b5', class: "section" }, this.device !== 'desktop' && this.megadropdownTitle && (h("p", { key: '35a03b2ee32498aa157140d4e6916cbf66655e5c', class: "megadropdown-title" }, this.megadropdownTitle)), h("div", { key: '6c4efb52e7bb04c4f40d5b3f739ca69771c48602', class: "megadropdown-content" }, h("slot", { key: '2b3200495cf23fe049734de9de9a5a1f4c9b09f3' })), this.device === 'desktop' ? (h("post-closebutton", { onClick: () => this.hide(true), class: "close-button", size: "small", placement: "manual" }, this.textClose)) : (h("button", { onClick: () => this.hide(true), class: "back-button" }, h("post-icon", { name: "arrowleft" }), this.textBack))))));
1389
+ return (h(Host, { key: '9be9668e8fa4599cdbd8299d6e317d7207254558', version: version }, h("div", { key: '1e655c82f2bdfb5f796c77e25e553869b0afd5f6', ref: el => (this.animatedContainer = el), class: "megadropdown", style: containerStyle }, h("div", { key: '9da73fb287424b30cafe0d8c899407dc752391b4', class: "section" }, this.device !== 'desktop' && this.megadropdownTitle && (h("p", { key: '86b94b9b304b490ad5a688ef9be2707b857c43a8', class: "megadropdown-title" }, this.megadropdownTitle)), h("div", { key: 'c49520cc0027cc62d6a5fce2bd8eda32989cdfef', class: "megadropdown-content" }, h("slot", { key: '1f7169574e12f8395f6b5eacfc03f1171238c5e9' })), this.device === 'desktop' ? (h("post-closebutton", { onClick: () => this.hide(true), class: "close-button", size: "small", placement: "manual" }, this.textClose)) : (h("button", { onClick: () => this.hide(true), class: "back-button" }, h("post-icon", { name: "arrowleft" }), this.textBack))))));
1292
1390
  }
1293
1391
  get host() { return getElement(this); }
1294
1392
  };
@@ -1302,7 +1400,7 @@ __decorate$4([
1302
1400
  ], PostMegadropdown.prototype, "textBack", void 0);
1303
1401
  PostMegadropdown.style = postMegadropdownCss();
1304
1402
 
1305
- const postMegadropdownTriggerCss = () => `button{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:4px 10px;gap:6px;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg)}button:not(:disabled):hover{text-decoration:none}button:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}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}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){button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){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){button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button{border-width:1px !important;transition:none}button:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}button:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}button{--post-nav-item-border-width:1px;width:100%;justify-content:start;position:relative;padding:12px 12px calc(12px - var(--post-nav-item-border-width)) 8px;gap:16px;border-radius:0;line-height:1.5;outline-color:currentColor !important;border-bottom:var(--post-nav-item-border-width) solid currentColor;height:100%}button:hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg);border-bottom-color:rgba(0,0,0,0)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:none}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}button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline:none !important}button:is(:focus-visible,:has(:focus-visible),.pretend-focus)::after{content:"";position:absolute;inset:calc(-1*var(--post-device-spacing-padding-28));border-width:var(--post-device-border-width-focus);border-style:var(--post-core-border-style-solid);border-color:var(--post-scheme-color-interactive-focus-stroke);border-radius:var(--post-device-border-radius-focus);pointer-events:none}button:is(:focus-visible,:has(:focus-visible),.pretend-focus):hover::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}button:is(:focus-visible,:has(:focus-visible),.pretend-focus):is([aria-current],[aria-pressed=true],[aria-expanded=true],.active)::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline:none !important}button:is(:focus-visible,:focus-within,.pretend-focus)::after{content:"";position:absolute;inset:calc(-1*var(--post-device-spacing-padding-28));border-width:var(--post-device-border-width-focus);border-style:var(--post-core-border-style-solid);border-color:var(--post-scheme-color-interactive-focus-stroke);border-radius:var(--post-device-border-radius-focus);pointer-events:none}button:is(:focus-visible,:focus-within,.pretend-focus):hover::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}button:is(:focus-visible,:focus-within,.pretend-focus):is([aria-current],[aria-pressed=true],[aria-expanded=true],.active)::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}button>post-icon:where(:last-child){margin-inline-start:auto}@media screen and (min-width: 0)and (max-width: 599.98px){button{padding:9.5px 12px calc(9.5px - var(--post-nav-item-border-width)) 8px;gap:8px;font-size:.875rem}button>post-icon{font-size:1rem}}@media screen and (min-width: 600px)and (max-width: 1023.98px){button>post-icon{font-size:1.5rem}}@media screen and (min-width: 1024px){button{padding:16px 12px;gap:8px;border-bottom:0}}:host{position:relative;display:inline-block}button post-icon{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true]) post-icon{transform:rotate(180deg)}button>span{position:relative}button>span>span[aria-hidden]{font-weight:700;visibility:hidden}button>span>span[aria-hidden]:where(span:empty+*){visibility:visible}button>span>span:not([aria-hidden]){position:absolute;inset:0}@media screen and (min-width: 1024px){button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){font-weight:700}button[aria-expanded=true]{background-color:#f0efed;color:#050400;z-index:2}button[aria-expanded=true]:hover{box-shadow:inset 0 -0.7px 0 0 #f0efed}button[aria-expanded=true]{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}button[aria-expanded=true]:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}button[aria-expanded=true]:is(:focus-visible,:has(:focus-visible),.pretend-focus)::after{border-color:var(--post-scheme-color-interactive-focus-stroke)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){button[aria-expanded=true]:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@media screen and (min-width: 1024px){@supports not selector(:has(:focus-visible)){button[aria-expanded=true]:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}button[aria-expanded=true]:is(:focus-visible,:focus-within,.pretend-focus)::after{border-color:var(--post-scheme-color-interactive-focus-stroke)}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){button[aria-expanded=true]:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}}@media screen and (max-width: 1023.98px){button post-icon{margin-inline-start:auto;transform:rotate(-90deg) !important}}`;
1403
+ const postMegadropdownTriggerCss = () => `button{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-size:var(--post-device-font-size-6);font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:4px 10px;gap:6px;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg)}button:not(:disabled):hover{text-decoration:none}button:disabled{border-style:var(--post-core-border-style-dash);cursor:unset}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}button: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){button:focus-visible{outline-color:Highlight !important}}button.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){button.pretend-focus{outline-color:Highlight !important}}button:has(: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){button:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){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){button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button{border-width:1px !important;transition:none}button:is(button){background-color:ButtonFace !important;border-color:ButtonBorder !important}}button:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);color:var(--post-scheme-color-interactive-button-primary-enabled-fg);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg)}button{--post-nav-item-border-width:1px;width:100%;justify-content:start;position:relative;padding:12px 12px calc(12px - var(--post-nav-item-border-width)) 8px;gap:16px;border-radius:0;line-height:1.5;outline-color:currentColor !important;border-bottom:var(--post-nav-item-border-width) solid currentColor;height:100%}button:hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);color:var(--post-scheme-color-interactive-button-primary-hover-fg);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg);border-bottom-color:rgba(0,0,0,0)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:none}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}button:focus-visible{outline-style:var(--post-core-border-style-solid) !important;outline:none !important}button:focus-visible::after{content:"";position:absolute;inset:calc(-1*var(--post-device-spacing-padding-28));border-width:var(--post-device-border-width-focus);border-style:var(--post-core-border-style-solid);border-color:var(--post-scheme-color-interactive-focus-stroke);border-radius:var(--post-device-border-radius-focus);pointer-events:none}button:focus-visible:hover::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}button:focus-visible:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active)::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button:focus-visible{outline-color:Highlight !important}}button.pretend-focus{outline-style:var(--post-core-border-style-solid) !important;outline:none !important}button.pretend-focus::after{content:"";position:absolute;inset:calc(-1*var(--post-device-spacing-padding-28));border-width:var(--post-device-border-width-focus);border-style:var(--post-core-border-style-solid);border-color:var(--post-scheme-color-interactive-focus-stroke);border-radius:var(--post-device-border-radius-focus);pointer-events:none}button.pretend-focus:hover::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}button.pretend-focus:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active)::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button.pretend-focus{outline-color:Highlight !important}}button:has(:focus-visible){outline-style:var(--post-core-border-style-solid) !important;outline:none !important}button:has(:focus-visible)::after{content:"";position:absolute;inset:calc(-1*var(--post-device-spacing-padding-28));border-width:var(--post-device-border-width-focus);border-style:var(--post-core-border-style-solid);border-color:var(--post-scheme-color-interactive-focus-stroke);border-radius:var(--post-device-border-radius-focus);pointer-events:none}button:has(:focus-visible):hover::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}button:has(:focus-visible):is([aria-current],[aria-pressed=true],[aria-expanded=true],.active)::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button:has(:focus-visible){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline:none !important}button:is(:focus-visible,:focus-within,.pretend-focus)::after{content:"";position:absolute;inset:calc(-1*var(--post-device-spacing-padding-28));border-width:var(--post-device-border-width-focus);border-style:var(--post-core-border-style-solid);border-color:var(--post-scheme-color-interactive-focus-stroke);border-radius:var(--post-device-border-radius-focus);pointer-events:none}button:is(:focus-visible,:focus-within,.pretend-focus):hover::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}button:is(:focus-visible,:focus-within,.pretend-focus):is([aria-current],[aria-pressed=true],[aria-expanded=true],.active)::after{border-color:var(--post-scheme-color-interactive-focus-stroke-inverted)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}button>post-icon:where(:last-child){margin-inline-start:auto}@media screen and (min-width: 0)and (max-width: 599.98px){button{padding:9.5px 12px calc(9.5px - var(--post-nav-item-border-width)) 8px;gap:8px;font-size:.875rem}button>post-icon{font-size:1rem}}@media screen and (min-width: 600px)and (max-width: 1023.98px){button>post-icon{font-size:1.5rem}}@media screen and (min-width: 1024px){button{padding:16px 12px;gap:8px;border-bottom:0}}:host{position:relative;display:inline-block}button post-icon{transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}button:is([aria-current],[aria-pressed=true],[aria-expanded=true]) post-icon{transform:rotate(180deg)}button>span{position:relative}button>span>span[aria-hidden]{font-weight:700;visibility:hidden}button>span>span[aria-hidden]:where(span:empty+*){visibility:visible}button>span>span:not([aria-hidden]){position:absolute;inset:0}@media screen and (min-width: 1024px){button:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){font-weight:700}button[aria-expanded=true]{background-color:#f0efed;color:#050400;z-index:2}button[aria-expanded=true]:hover{box-shadow:inset 0 -0.7px 0 0 #f0efed}button[aria-expanded=true]{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}button[aria-expanded=true]:focus-visible{outline-style:var(--post-core-border-style-solid) !important;outline-style:none !important}button[aria-expanded=true]:focus-visible::after{border-color:var(--post-scheme-color-interactive-focus-stroke)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){button[aria-expanded=true]:focus-visible{outline-color:Highlight !important}}@media screen and (min-width: 1024px){button[aria-expanded=true].pretend-focus{outline-style:var(--post-core-border-style-solid) !important;outline-style:none !important}button[aria-expanded=true].pretend-focus::after{border-color:var(--post-scheme-color-interactive-focus-stroke)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){button[aria-expanded=true].pretend-focus{outline-color:Highlight !important}}@media screen and (min-width: 1024px){button[aria-expanded=true]:has(:focus-visible){outline-style:var(--post-core-border-style-solid) !important;outline-style:none !important}button[aria-expanded=true]:has(:focus-visible)::after{border-color:var(--post-scheme-color-interactive-focus-stroke)}}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){button[aria-expanded=true]:has(:focus-visible){outline-color:Highlight !important}}@media screen and (min-width: 1024px){@supports not selector(:has(:focus-visible)){button[aria-expanded=true]:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;outline-style:none !important}button[aria-expanded=true]:is(:focus-visible,:focus-within,.pretend-focus)::after{border-color:var(--post-scheme-color-interactive-focus-stroke)}@media screen and (min-width: 1024px)and (forced-colors: active),screen and (min-width: 1024px)and (-ms-high-contrast: active),screen and (min-width: 1024px)and (-ms-high-contrast: white-on-black){button[aria-expanded=true]:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}}@media screen and (max-width: 1023.98px){button post-icon{margin-inline-start:auto;transform:rotate(-90deg) !important}}`;
1306
1404
 
1307
1405
  var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
1308
1406
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -1373,7 +1471,7 @@ const PostMegadropdownTrigger = class {
1373
1471
  this.megadropdown.toggle();
1374
1472
  }
1375
1473
  render() {
1376
- return (h(Host, { key: '7e6201e3cdea96113bbebdeeb805acff557c8bbb', "data-version": version }, h("button", { key: '1863f48dbd6e98b7a2b226b7c3b25b16a38c644b', ref: el => (this.interactiveButton = el), type: "button", "aria-haspopup": "menu", "aria-expanded": this.isMegadropdownExpanded.toString(), onClick: this.onClick.bind(this), onKeyDown: this.onKeyDown.bind(this), class: { active: this.active } }, h("span", { key: 'dee7e77e45914a3e40a9f5027570bef0035dfdf2' }, h("span", { key: '362865f7946f14f45ecdb240e81f09370e3f6d10', innerHTML: this.slottedContent }), h("span", { key: 'd61eb63433aa65631f787646df2c6705c3d6e7a1', "aria-hidden": "true" }, h("slot", { key: 'c831f7299fe3c80b8229c861e01e09a2ee481bc8' }))), h("post-icon", { key: 'bcc8ed53293e16d4571e989a491760f98425b298', name: "chevrondown" }))));
1474
+ return (h(Host, { key: '40d8afcb6b0ec482c0a13f7b78493a66243e03a5', "data-version": version }, h("button", { key: '6c1362cd4e1af22d26cf9ae74af4092cd083360c', ref: el => (this.interactiveButton = el), type: "button", "aria-haspopup": "menu", "aria-expanded": this.isMegadropdownExpanded.toString(), onClick: this.onClick.bind(this), onKeyDown: this.onKeyDown.bind(this), class: { active: this.active } }, h("span", { key: '6bd7d94da2055c1c6fb933402f2478a3cee12cc7' }, h("span", { key: '8109bdcc23c4a0f8c0861b774a974dde75b464f3', innerHTML: this.slottedContent }), h("span", { key: 'edd54adde0d7af4eb9cf7796183d01705d217500', "aria-hidden": "true" }, h("slot", { key: 'dbcc08bb882273f1074dd8963a4b86f67deb0c0a' }))), h("post-icon", { key: '7437573a492181cc3e5ddd59ac3695dc94d43e09', name: "chevrondown" }))));
1377
1475
  }
1378
1476
  get host() { return getElement(this); }
1379
1477
  };
@@ -1386,7 +1484,7 @@ __decorate$3([
1386
1484
  ], PostMegadropdownTrigger.prototype, "onMegadropdownToggled", null);
1387
1485
  PostMegadropdownTrigger.style = postMegadropdownTriggerCss();
1388
1486
 
1389
- const postMenuCss = () => `:host{display:block}:where([part=post-menu]){display:flex;flex-direction:column;padding-block:8px}::slotted([slot=header]){margin-top:-8px;padding:16px;display:flex;align-items:center;gap:8px;border-block-end:1px solid #050400;font-weight:700}@media screen and (max-width: 1023.98px){::slotted([slot=header]){padding:12px 16px}}@media screen and (max-width: 779.98px){::slotted([slot=header]){padding:8px 16px}}post-popovercontainer::part(post-popovercontainer-content){background-color:#fff}`;
1487
+ const postMenuCss = () => `:host{display:block}:where([part=post-menu]){display:flex;flex-direction:column;padding-block:8px;overflow-y:auto;overscroll-behavior:contain}::slotted([slot=header]){margin-top:-8px;padding:16px;display:flex;align-items:center;gap:8px;border-block-end:1px solid #050400;font-weight:700}@media screen and (max-width: 1023.98px){::slotted([slot=header]){padding:12px 16px}}@media screen and (max-width: 779.98px){::slotted([slot=header]){padding:8px 16px}}post-popovercontainer::part(post-popovercontainer-content){background-color:#fff}`;
1390
1488
 
1391
1489
  var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
1392
1490
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -1506,7 +1604,7 @@ const PostMenu = class {
1506
1604
  this.lastFocusedElement = this.root?.activeElement;
1507
1605
  // Only focus the first item if the trigger was keyboard-focus-visible
1508
1606
  // that's the browser's own signal for a keyboard-driven interaction.
1509
- if (this.wasFocusVisible(this.lastFocusedElement)) {
1607
+ if (isFocusVisible(this.lastFocusedElement)) {
1510
1608
  requestAnimationFrame(() => {
1511
1609
  const menuItems = this.getSlottedItems();
1512
1610
  if (menuItems.length > 0) {
@@ -1519,17 +1617,6 @@ const PostMenu = class {
1519
1617
  this.lastFocusedElement.focus();
1520
1618
  }
1521
1619
  }
1522
- wasFocusVisible(element) {
1523
- if (!element)
1524
- return false;
1525
- try {
1526
- return element.matches(':focus-visible');
1527
- }
1528
- catch {
1529
- // Not supported, fall back to always focusing
1530
- return true;
1531
- }
1532
- }
1533
1620
  controlKeyDownHandler(e) {
1534
1621
  const menuItems = this.getSlottedItems();
1535
1622
  if (menuItems.length === 0) {
@@ -1581,7 +1668,7 @@ const PostMenu = class {
1581
1668
  ]));
1582
1669
  }
1583
1670
  render() {
1584
- return (h(Host, { key: '22441c2bef0402f10e77b96b8a5d48a0648615f7', "data-version": version }, h("post-popovercontainer", { key: '8b37fe55d58a3a486e947266348b55408999a8bb', onPostShow: this.handlePostShown.bind(this), onPostBeforeToggle: this.handlePostBeforeToggle.bind(this), placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '2679eb9c4a95585b8aaf74e29f026c84b10aa6f3', part: "post-menu" }, h("slot", { key: '0da58a1bde1bdb4c1f8b7b19ca8cbde14d7946fc', name: "header" }), h("slot", { key: '801f7bc59d4d3267728b9adf0750dbea76a7652c' })))));
1671
+ return (h(Host, { key: '424d6a6b439f05d8fecca4814f2aeba53e7333b9', "data-version": version }, h("post-popovercontainer", { key: '0dce87ba2c4731ac458105a10a80514c2db07b52', autoHide: true, autoResize: true, onPostShow: this.handlePostShown.bind(this), onPostBeforeToggle: this.handlePostBeforeToggle.bind(this), placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '693bbd1e352d8c52f76dae4fba41558ef1ad4308', part: "post-menu" }, h("slot", { key: '7e3a24f00f99c99120ca75bf8a0b34aad27cbac3', name: "header" }), h("slot", { key: '1d9d360db4880ebc6e35cf2ac6cbdd738289f102' })))));
1585
1672
  }
1586
1673
  get host() { return getElement(this); }
1587
1674
  };
@@ -1600,7 +1687,7 @@ __decorate$2([
1600
1687
  ], PostMenu.prototype, "handlePostBeforeToggle", null);
1601
1688
  PostMenu.style = postMenuCss();
1602
1689
 
1603
- const postMenuItemCss = () => `post-menu-item button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;width:100%}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button{background-color:ButtonFace !important}post-menu-item button:hover{background-color:Highlight !important}}post-menu-item button,post-menu-item a{position:relative;display:flex;align-items:center;padding:8px 12px 8px 16px;gap:12px;font-size:.875rem;color:#050400;border-radius:0;text-decoration:none}@media screen and (min-width: 780px){post-menu-item button,post-menu-item a{font-size:1rem;padding-block:12px;gap:16px}}@media screen and (min-width: 1024px){post-menu-item button,post-menu-item a{font-size:1.25rem;padding-block:13px}}post-menu-item button:focus-visible,post-menu-item a:focus-visible{outline-offset:2px !important;border-radius:4px}post-menu-item button:hover,post-menu-item a:hover{background-color:#504f4b;color:#fff}post-menu-item button post-icon,post-menu-item a post-icon{width:16px;height:16px;margin-block:4px}@media screen and (min-width: 780px){post-menu-item button post-icon,post-menu-item a post-icon{width:24px;height:24px;margin:0}}`;
1690
+ const postMenuItemCss = () => `post-menu-item button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;width:100%}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button{background-color:ButtonFace !important}post-menu-item button:hover{background-color:Highlight !important}}post-menu-item button,post-menu-item a{position:relative;display:flex;align-items:center;padding:8px 12px 8px 16px;gap:12px;font-size:.875rem;color:#050400;border-radius:0;text-decoration:none}@media screen and (min-width: 780px){post-menu-item button,post-menu-item a{font-size:1rem;padding-block:12px;gap:16px}}@media screen and (min-width: 1024px){post-menu-item button,post-menu-item a{font-size:1.25rem;padding-block:13px}}post-menu-item button:focus-visible,post-menu-item a:focus-visible{outline:none !important}post-menu-item button.pretend-focus,post-menu-item a.pretend-focus{outline:none !important}post-menu-item button:has(:focus-visible),post-menu-item a:has(:focus-visible){outline:none !important}@supports not selector(:has(:focus-visible)){post-menu-item button:is(:focus-visible,:focus-within,.pretend-focus),post-menu-item a:is(:focus-visible,:focus-within,.pretend-focus){outline:none !important}}post-menu-item button::after,post-menu-item a::after{content:"";position:absolute;inset:0;width:100%;height:100%;border-radius:calc(var(--post-device-border-radius-focus) - var(--post-device-spacing-padding-44))}post-menu-item button::after,post-menu-item a::after{outline-offset:var(--post-device-spacing-padding-44) !important;outline:#050400 none var(--post-device-border-width-focus) !important}post-menu-item button:focus-visible::after,post-menu-item a:focus-visible::after{outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button:focus-visible::after,post-menu-item a:focus-visible::after{outline-color:Highlight !important}}post-menu-item button.pretend-focus::after,post-menu-item a.pretend-focus::after{outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button.pretend-focus::after,post-menu-item a.pretend-focus::after{outline-color:Highlight !important}}post-menu-item button:has(:focus-visible)::after,post-menu-item a:has(:focus-visible)::after{outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button:has(:focus-visible)::after,post-menu-item a:has(:focus-visible)::after{outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-menu-item button:is(:focus-visible,:focus-within,.pretend-focus)::after,post-menu-item a:is(:focus-visible,:focus-within,.pretend-focus)::after{outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-item button:is(:focus-visible,:focus-within,.pretend-focus)::after,post-menu-item a:is(:focus-visible,:focus-within,.pretend-focus)::after{outline-color:Highlight !important}}}post-menu-item button:hover,post-menu-item a:hover{background-color:#504f4b;color:#fff}post-menu-item button:hover:focus-visible::after,post-menu-item a:hover:focus-visible::after{outline-color:#fff !important}post-menu-item button:hover.pretend-focus::after,post-menu-item a:hover.pretend-focus::after{outline-color:#fff !important}post-menu-item button:hover:has(:focus-visible)::after,post-menu-item a:hover:has(:focus-visible)::after{outline-color:#fff !important}@supports not selector(:has(:focus-visible)){post-menu-item button:hover:is(:focus-visible,:focus-within,.pretend-focus)::after,post-menu-item a:hover:is(:focus-visible,:focus-within,.pretend-focus)::after{outline-color:#fff !important}}post-menu-item button post-icon,post-menu-item a post-icon{width:16px;height:16px;margin-block:4px}@media screen and (min-width: 780px){post-menu-item button post-icon,post-menu-item a post-icon{width:24px;height:24px;margin:0}}`;
1604
1691
 
1605
1692
  const PostMenuItem = class {
1606
1693
  constructor(hostRef) {
@@ -1680,7 +1767,7 @@ const PostMenuTrigger = class {
1680
1767
  return null;
1681
1768
  }
1682
1769
  render() {
1683
- return (h(Host, { key: 'f75522d28e9a45c80846a191cff3ea2eb51b5bde', "data-version": version }, h("slot", { key: 'bc70e3ddc8dc372611c00a4cda52cd35ede02a3f' })));
1770
+ return (h(Host, { key: '8f43fe80dd56550141481f157a06caf559494291', "data-version": version }, h("slot", { key: '1b5d220cff9894918aedc54b0585df75095dcb0e' })));
1684
1771
  }
1685
1772
  get host() { return getElement(this); }
1686
1773
  };
@@ -1690,6 +1777,21 @@ __decorate$1([
1690
1777
  ], PostMenuTrigger.prototype, "for", void 0);
1691
1778
  PostMenuTrigger.style = postMenuTriggerCss();
1692
1779
 
1780
+ const duration = 250;
1781
+ const easing = 'ease-out';
1782
+ function popIn(el) {
1783
+ if (!el)
1784
+ return;
1785
+ return el.animate([
1786
+ { transform: 'scale(0.9)', opacity: 0 },
1787
+ { transform: 'scale(1)', opacity: 1 },
1788
+ ], {
1789
+ duration,
1790
+ easing,
1791
+ fill: 'forwards',
1792
+ });
1793
+ }
1794
+
1693
1795
  /**
1694
1796
  * Custom positioning reference element.
1695
1797
  * @see https://floating-ui.com/docs/virtual-elements
@@ -1735,23 +1837,6 @@ function getSideAxis(placement) {
1735
1837
  function getAlignmentAxis(placement) {
1736
1838
  return getOppositeAxis(getSideAxis(placement));
1737
1839
  }
1738
- function getAlignmentSides(placement, rects, rtl) {
1739
- if (rtl === void 0) {
1740
- rtl = false;
1741
- }
1742
- const alignment = getAlignment(placement);
1743
- const alignmentAxis = getAlignmentAxis(placement);
1744
- const length = getAxisLength(alignmentAxis);
1745
- let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
1746
- if (rects.reference[length] > rects.floating[length]) {
1747
- mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
1748
- }
1749
- return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
1750
- }
1751
- function getExpandedPlacements(placement) {
1752
- const oppositePlacement = getOppositePlacement(placement);
1753
- return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
1754
- }
1755
1840
  function getOppositeAlignmentPlacement(placement) {
1756
1841
  return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
1757
1842
  }
@@ -1777,7 +1862,7 @@ function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
1777
1862
  let list = getSideList(getSide(placement), direction === 'start', rtl);
1778
1863
  if (alignment) {
1779
1864
  list = list.map(side => side + "-" + alignment);
1780
- if (flipAlignment) {
1865
+ {
1781
1866
  list = list.concat(list.map(getOppositeAlignmentPlacement));
1782
1867
  }
1783
1868
  }
@@ -1883,7 +1968,7 @@ function computeCoordsFromPlacement(_ref, placement, rtl) {
1883
1968
  * - 0 = lies flush with the boundary
1884
1969
  * @see https://floating-ui.com/docs/detectOverflow
1885
1970
  */
1886
- async function detectOverflow(state, options) {
1971
+ async function detectOverflow$1(state, options) {
1887
1972
  var _await$platform$isEle;
1888
1973
  if (options === void 0) {
1889
1974
  options = {};
@@ -1956,7 +2041,7 @@ const computePosition$1 = async (reference, floating, config) => {
1956
2041
  } = config;
1957
2042
  const platformWithDetectOverflow = platform.detectOverflow ? platform : {
1958
2043
  ...platform,
1959
- detectOverflow
2044
+ detectOverflow: detectOverflow$1
1960
2045
  };
1961
2046
  const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
1962
2047
  let rects = await platform.getElementRects({
@@ -2116,138 +2201,6 @@ const arrow$1 = options => ({
2116
2201
  }
2117
2202
  });
2118
2203
 
2119
- /**
2120
- * Optimizes the visibility of the floating element by flipping the `placement`
2121
- * in order to keep it in view when the preferred placement(s) will overflow the
2122
- * clipping boundary. Alternative to `autoPlacement`.
2123
- * @see https://floating-ui.com/docs/flip
2124
- */
2125
- const flip$1 = function (options) {
2126
- if (options === void 0) {
2127
- options = {};
2128
- }
2129
- return {
2130
- name: 'flip',
2131
- options,
2132
- async fn(state) {
2133
- var _middlewareData$arrow, _middlewareData$flip;
2134
- const {
2135
- placement,
2136
- middlewareData,
2137
- rects,
2138
- initialPlacement,
2139
- platform,
2140
- elements
2141
- } = state;
2142
- const {
2143
- mainAxis: checkMainAxis = true,
2144
- crossAxis: checkCrossAxis = true,
2145
- fallbackPlacements: specifiedFallbackPlacements,
2146
- fallbackStrategy = 'bestFit',
2147
- fallbackAxisSideDirection = 'none',
2148
- flipAlignment = true,
2149
- ...detectOverflowOptions
2150
- } = evaluate(options, state);
2151
-
2152
- // If a reset by the arrow was caused due to an alignment offset being
2153
- // added, we should skip any logic now since `flip()` has already done its
2154
- // work.
2155
- // https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
2156
- if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
2157
- return {};
2158
- }
2159
- const side = getSide(placement);
2160
- const initialSideAxis = getSideAxis(initialPlacement);
2161
- const isBasePlacement = getSide(initialPlacement) === initialPlacement;
2162
- const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
2163
- const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
2164
- const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
2165
- if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
2166
- fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
2167
- }
2168
- const placements = [initialPlacement, ...fallbackPlacements];
2169
- const overflow = await platform.detectOverflow(state, detectOverflowOptions);
2170
- const overflows = [];
2171
- let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
2172
- if (checkMainAxis) {
2173
- overflows.push(overflow[side]);
2174
- }
2175
- if (checkCrossAxis) {
2176
- const sides = getAlignmentSides(placement, rects, rtl);
2177
- overflows.push(overflow[sides[0]], overflow[sides[1]]);
2178
- }
2179
- overflowsData = [...overflowsData, {
2180
- placement,
2181
- overflows
2182
- }];
2183
-
2184
- // One or more sides is overflowing.
2185
- if (!overflows.every(side => side <= 0)) {
2186
- var _middlewareData$flip2, _overflowsData$filter;
2187
- const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
2188
- const nextPlacement = placements[nextIndex];
2189
- if (nextPlacement) {
2190
- const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
2191
- if (!ignoreCrossAxisOverflow ||
2192
- // We leave the current main axis only if every placement on that axis
2193
- // overflows the main axis.
2194
- overflowsData.every(d => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
2195
- // Try next placement and re-run the lifecycle.
2196
- return {
2197
- data: {
2198
- index: nextIndex,
2199
- overflows: overflowsData
2200
- },
2201
- reset: {
2202
- placement: nextPlacement
2203
- }
2204
- };
2205
- }
2206
- }
2207
-
2208
- // First, find the candidates that fit on the mainAxis side of overflow,
2209
- // then find the placement that fits the best on the main crossAxis side.
2210
- 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;
2211
-
2212
- // Otherwise fallback.
2213
- if (!resetPlacement) {
2214
- switch (fallbackStrategy) {
2215
- case 'bestFit':
2216
- {
2217
- var _overflowsData$filter2;
2218
- const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
2219
- if (hasFallbackAxisSideDirection) {
2220
- const currentSideAxis = getSideAxis(d.placement);
2221
- return currentSideAxis === initialSideAxis ||
2222
- // Create a bias to the `y` side axis due to horizontal
2223
- // reading directions favoring greater width.
2224
- currentSideAxis === 'y';
2225
- }
2226
- return true;
2227
- }).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$filter2[0];
2228
- if (placement) {
2229
- resetPlacement = placement;
2230
- }
2231
- break;
2232
- }
2233
- case 'initialPlacement':
2234
- resetPlacement = initialPlacement;
2235
- break;
2236
- }
2237
- }
2238
- if (placement !== resetPlacement) {
2239
- return {
2240
- reset: {
2241
- placement: resetPlacement
2242
- }
2243
- };
2244
- }
2245
- }
2246
- return {};
2247
- }
2248
- };
2249
- };
2250
-
2251
2204
  function getSideOffsets(overflow, rect) {
2252
2205
  return {
2253
2206
  top: overflow.top - rect.height,
@@ -3130,7 +3083,7 @@ function getDocumentRect(html) {
3130
3083
  // calculation is affected by unusual styles.
3131
3084
  // Most scrollbars leave 15-18px of space.
3132
3085
  const SCROLLBAR_MAX = 25;
3133
- function getViewportRect(element, strategy, rootBoundary) {
3086
+ function getViewportRect$1(element, strategy, rootBoundary) {
3134
3087
  if (rootBoundary === void 0) {
3135
3088
  rootBoundary = 'viewport';
3136
3089
  }
@@ -3208,7 +3161,7 @@ function getInnerBoundingClientRect(element, strategy) {
3208
3161
  function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
3209
3162
  let rect;
3210
3163
  if (clippingAncestor === 'viewport' || clippingAncestor === 'layoutViewport') {
3211
- rect = getViewportRect(element, strategy, clippingAncestor);
3164
+ rect = getViewportRect$1(element, strategy, clippingAncestor);
3212
3165
  } else if (clippingAncestor === 'document') {
3213
3166
  rect = getDocumentRect(getDocumentElement(element));
3214
3167
  } else if (isElement(clippingAncestor)) {
@@ -3604,6 +3557,16 @@ function autoUpdate(reference, floating, update, options) {
3604
3557
  };
3605
3558
  }
3606
3559
 
3560
+ /**
3561
+ * Resolves with an object of overflow side offsets that determine how much the
3562
+ * element is overflowing a given clipping boundary on each side.
3563
+ * - positive = overflowing the boundary by that number of pixels
3564
+ * - negative = how many pixels left before it will overflow
3565
+ * - 0 = lies flush with the boundary
3566
+ * @see https://floating-ui.com/docs/detectOverflow
3567
+ */
3568
+ const detectOverflow = detectOverflow$1;
3569
+
3607
3570
  /**
3608
3571
  * Modifies the placement by translating the floating element along the
3609
3572
  * specified axes.
@@ -3620,14 +3583,6 @@ const offset = offset$1;
3620
3583
  */
3621
3584
  const shift = shift$1;
3622
3585
 
3623
- /**
3624
- * Optimizes the visibility of the floating element by flipping the `placement`
3625
- * in order to keep it in view when the preferred placement(s) will overflow the
3626
- * clipping boundary. Alternative to `autoPlacement`.
3627
- * @see https://floating-ui.com/docs/flip
3628
- */
3629
- const flip = flip$1;
3630
-
3631
3586
  /**
3632
3587
  * Provides data that allows you to change the size of the floating element —
3633
3588
  * for instance, prevent it from overflowing the clipping boundary or match the
@@ -3683,19 +3638,211 @@ const computePosition = (reference, floating, options) => {
3683
3638
  });
3684
3639
  };
3685
3640
 
3686
- const duration = 250;
3687
- const easing = 'ease-out';
3688
- function popIn(el) {
3689
- if (!el)
3641
+ /**
3642
+ * Returns the nth side in clockwise direction relative to the given side.
3643
+ */
3644
+ function getRelativeSide(side, n) {
3645
+ return sides[(sides.indexOf(side) + n) % 4];
3646
+ }
3647
+ const getNextSide = (side) => getRelativeSide(side, 1);
3648
+ const getOppositeSide = (side) => getRelativeSide(side, 2);
3649
+ const getPreviousSide = (side) => getRelativeSide(side, 3);
3650
+
3651
+ const FLIP_MIDDLEWARE = 'post-flip';
3652
+ /**
3653
+ * Changes the placement of the floating element to keep it in view.
3654
+ *
3655
+ * Unlike the Floating UI `flip` middleware, placements are measured against `minSize` rather than
3656
+ * against the current size of the floating element, and the placement with the smallest deficit is
3657
+ * used when none of them fits.
3658
+ */
3659
+ function flip(options = {}) {
3660
+ return {
3661
+ name: FLIP_MIDDLEWARE,
3662
+ options,
3663
+ async fn(state) {
3664
+ const { middlewareData, placement } = state;
3665
+ // see https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
3666
+ if (middlewareData.arrow?.alignmentOffset)
3667
+ return {};
3668
+ const { minSize = {}, ...detectOverflowOptions } = evaluate(options, state);
3669
+ const gap = Math.abs(middlewareData.offset?.[getSideAxis(placement)] ?? 0);
3670
+ const side = getSide(placement);
3671
+ const referenceOverflow = await detectOverflow(state, {
3672
+ ...detectOverflowOptions,
3673
+ elementContext: 'reference',
3674
+ });
3675
+ const floatingOverflow = await detectOverflow(state, {
3676
+ ...detectOverflowOptions,
3677
+ elementContext: 'floating',
3678
+ });
3679
+ // The floating element fits at its current placement, there is nothing left to do.
3680
+ if (Math.max(referenceOverflow[side], floatingOverflow[side]) <= 0)
3681
+ return {};
3682
+ const previous = middlewareData[FLIP_MIDDLEWARE];
3683
+ const measurement = { overflow: referenceOverflow, minSize, gap };
3684
+ let deficits = previous?.deficits ?? [];
3685
+ const placements = previous?.placements ?? (await getPlacements(state, measurement));
3686
+ if (deficits.length < placements.length) {
3687
+ deficits = [...deficits, getDeficit(side, measurement)];
3688
+ }
3689
+ const data = { placements, deficits };
3690
+ // If there are still placements to try, move on to the next one.
3691
+ if (deficits.length < placements.length) {
3692
+ return { data, reset: { placement: placements[deficits.length] } };
3693
+ }
3694
+ // If none of the placements fit, fall back to the one that loses the least space.
3695
+ const fallback = data.placements[data.deficits.indexOf(Math.min(...data.deficits))];
3696
+ return fallback === placement ? { data } : { data, reset: { placement: fallback } };
3697
+ },
3698
+ };
3699
+ }
3700
+ /**
3701
+ * Returns the placements to try, ordered from most to least promising.
3702
+ */
3703
+ async function getPlacements(state, measurement) {
3704
+ const { placement, platform, elements } = state;
3705
+ const { overflow } = measurement;
3706
+ const side = getSide(placement);
3707
+ const placements = [placement, getOppositePlacement(placement)];
3708
+ const mainAxisDeficit = Math.min(getDeficit(side, measurement), getDeficit(getOppositeSide(side), measurement));
3709
+ if (mainAxisDeficit <= 0)
3710
+ return placements;
3711
+ const rtl = (await platform.isRTL?.(elements.floating)) ?? false;
3712
+ const crossAxisPlacements = getOppositeAxisPlacements(placement, true, 'start', rtl);
3713
+ // Try the side with the most available space first.
3714
+ crossAxisPlacements.sort((a, b) => overflow[getSide(a)] - overflow[getSide(b)]);
3715
+ return [...placements, ...crossAxisPlacements];
3716
+ }
3717
+ /**
3718
+ * Returns the amount of space required to display the floating element at its minimum size on the
3719
+ * given side of the reference element.
3720
+ */
3721
+ function getDeficit(side, { minSize, overflow, gap }) {
3722
+ const minLength = minSize[getAxisLength(getSideAxis(side))] ?? 0;
3723
+ return gap + minLength + overflow[side];
3724
+ }
3725
+
3726
+ /**
3727
+ * This utility is covered by the end-to-end tests under 'clipping' in `popovercontainer.cy.ts`.
3728
+ */
3729
+ const CLIPPING_RECT_CACHE = Symbol('Clipping Rect Cache');
3730
+ /**
3731
+ * A custom floating UI platform that restricts clipping rectangles to the safe area.
3732
+ */
3733
+ const safeAreaPlatform = { ...platform, getClippingRect };
3734
+ /**
3735
+ * Computes the clipping rectangle of an element while accounting for the safe area.
3736
+ */
3737
+ async function getClippingRect(...args) {
3738
+ const element = args[0].element;
3739
+ // Check whether the clipping rectangle of the given element has already been computed during
3740
+ // this pass.
3741
+ const hit = this[CLIPPING_RECT_CACHE].get(element);
3742
+ if (hit)
3743
+ return hit;
3744
+ // Compute the clipping rectangle with the Floating UI DOM platform, then restrict it to the safe
3745
+ // area.
3746
+ const clippingRect = await platform.getClippingRect.apply(this, args);
3747
+ applySafeArea(clippingRect, element);
3748
+ this[CLIPPING_RECT_CACHE].set(element, clippingRect);
3749
+ return clippingRect;
3750
+ }
3751
+ /**
3752
+ * Restricts the `clippingRect` computed for `element` to the safe area, modifying it in place.
3753
+ *
3754
+ * The safe area only applies to elements that the header can actually cover, which excludes
3755
+ * elements without a header on their page, elements on a top layer and elements within the header.
3756
+ */
3757
+ function applySafeArea(clippingRect, element) {
3758
+ const headerElement = element.ownerDocument.querySelector('post-header');
3759
+ if (headerElement === null)
3690
3760
  return;
3691
- return el.animate([
3692
- { transform: 'scale(0.9)', opacity: 0 },
3693
- { transform: 'scale(1)', opacity: 1 },
3694
- ], {
3695
- duration,
3696
- easing,
3697
- fill: 'forwards',
3761
+ let parent = element;
3762
+ while (!isLastTraversableNode(parent)) {
3763
+ parent = getParentNode(parent);
3764
+ if (!isHTMLElement(parent))
3765
+ continue;
3766
+ // Do not apply the safe area of the header to
3767
+ // - elements that are on a top layer, such as a dialog.
3768
+ // - elements that are located within the header itself.
3769
+ if (isTopLayer(parent) || parent === headerElement)
3770
+ return;
3771
+ }
3772
+ const headerRect = headerElement.getBoundingClientRect();
3773
+ const top = Math.max(clippingRect.y, headerRect.bottom);
3774
+ clippingRect.height -= top - clippingRect.y;
3775
+ clippingRect.y = top;
3776
+ }
3777
+ /**
3778
+ * Computes the coordinates that will position the `floating` element next to a given `reference`
3779
+ * element while accounting for the safe area.
3780
+ *
3781
+ * The safe area is the part of the viewport that the header does not cover. Restricting the
3782
+ * clipping rectangles to it makes floating elements behave as if they were clipped by the header.
3783
+ */
3784
+ const computePositionWithSafeArea = (reference, floating, options) => {
3785
+ // Adapted from https://github.com/floating-ui/floating-ui/blob/27629b74ba36ab8ceb2a968051927b9b69511a3b/packages/dom/src/index.ts#L15
3786
+ options ??= {};
3787
+ return computePosition(reference, floating, {
3788
+ ...options,
3789
+ platform: {
3790
+ ...safeAreaPlatform,
3791
+ ...options.platform,
3792
+ [CLIPPING_RECT_CACHE]: new Map(),
3793
+ },
3794
+ });
3795
+ };
3796
+
3797
+ const SAFE_SPACE_MIDDLEWARE = 'post-safe-space';
3798
+ /**
3799
+ * Computes the safe space, the area the pointer can travel through to get from the reference to
3800
+ * the floating element.
3801
+ */
3802
+ function safeSpace() {
3803
+ return {
3804
+ name: SAFE_SPACE_MIDDLEWARE,
3805
+ async fn(state) {
3806
+ const { placement, rects, x, y } = state;
3807
+ const side = getSide(placement);
3808
+ const reference = await getViewportRect(state, rects.reference);
3809
+ const floating = await getViewportRect(state, { ...rects.floating, x, y });
3810
+ const path = [
3811
+ ...getPathAlongSide(floating, getOppositeSide(side)),
3812
+ ...getPathAlongSide(reference, side),
3813
+ ];
3814
+ const points = [];
3815
+ for (let i = 0; i < path.length; i += 2) {
3816
+ points.push(`${path[i]}px ${path[i + 1]}px`);
3817
+ }
3818
+ const data = { polygon: `polygon(${points.join(', ')})` };
3819
+ return { data };
3820
+ },
3821
+ };
3822
+ }
3823
+ /**
3824
+ * Converts a rectangle from the floating element's offset parent's coordinate system to viewport
3825
+ * coordinates.
3826
+ */
3827
+ async function getViewportRect({ elements, platform, strategy }, rect) {
3828
+ const viewportRect = await platform.convertOffsetParentRelativeRectToViewportRelativeRect?.({
3829
+ offsetParent: await platform.getOffsetParent?.(elements.floating),
3830
+ rect,
3831
+ elements,
3832
+ strategy,
3698
3833
  });
3834
+ return rectToClientRect(viewportRect ?? rect);
3835
+ }
3836
+ /**
3837
+ * Returns the path along the specified side of the given rectangle.
3838
+ *
3839
+ * The path is a list of coordinates in the form of [x₁, y₁, x₂, y₂] and is given in clockwise order.
3840
+ */
3841
+ function getPathAlongSide(rect, side) {
3842
+ const self = rect[side];
3843
+ const prev = rect[getPreviousSide(side)];
3844
+ const next = rect[getNextSide(side)];
3845
+ return getSideAxis(side) === 'x' ? [self, prev, self, next] : [prev, self, next, self];
3699
3846
  }
3700
3847
 
3701
3848
  // src/events.ts
@@ -4490,78 +4637,7 @@ function apply() {
4490
4637
  injectStyles(document);
4491
4638
  }
4492
4639
 
4493
- /**
4494
- * This utility is covered by the end-to-end tests under 'clipping' in `popovercontainer.cy.ts`.
4495
- */
4496
- const CLIPPING_RECT_CACHE = Symbol('Clipping Rect Cache');
4497
- /**
4498
- * A custom floating UI platform that restricts clipping rectangles to the safe area.
4499
- */
4500
- const safeAreaPlatform = { ...platform, getClippingRect };
4501
- /**
4502
- * Computes the clipping rectangle of an element while accounting for the safe area.
4503
- */
4504
- async function getClippingRect(...args) {
4505
- const element = args[0].element;
4506
- // Check whether the clipping rectangle of the given element has already been computed during
4507
- // this pass.
4508
- const hit = this[CLIPPING_RECT_CACHE].get(element);
4509
- if (hit)
4510
- return hit;
4511
- // Compute the clipping rectangle with the Floating UI DOM platform, then restrict it to the safe
4512
- // area.
4513
- const clippingRect = await platform.getClippingRect.apply(this, args);
4514
- applySafeArea(clippingRect, element);
4515
- this[CLIPPING_RECT_CACHE].set(element, clippingRect);
4516
- return clippingRect;
4517
- }
4518
- /**
4519
- * Restricts the `clippingRect` computed for `element` to the safe area, modifying it in place.
4520
- *
4521
- * The safe area only applies to elements that the header can actually cover, which excludes
4522
- * elements without a header on their page, elements on a top layer and elements within the header.
4523
- */
4524
- function applySafeArea(clippingRect, element) {
4525
- const headerElement = element.ownerDocument.querySelector('post-header');
4526
- if (headerElement === null)
4527
- return;
4528
- let parent = element;
4529
- while (!isLastTraversableNode(parent)) {
4530
- parent = getParentNode(parent);
4531
- if (!isHTMLElement(parent))
4532
- continue;
4533
- // Do not apply the safe area of the header to
4534
- // - elements that are on a top layer, such as a dialog.
4535
- // - elements that are located within the header itself.
4536
- if (isTopLayer(parent) || parent === headerElement)
4537
- return;
4538
- }
4539
- const headerRect = headerElement.getBoundingClientRect();
4540
- const top = Math.max(clippingRect.y, headerRect.bottom);
4541
- clippingRect.height -= top - clippingRect.y;
4542
- clippingRect.y = top;
4543
- }
4544
- /**
4545
- * Computes the coordinates that will position the `floating` element next to a given `reference`
4546
- * element while accounting for the safe area.
4547
- *
4548
- * The safe area is the part of the viewport that the header does not cover. Restricting the
4549
- * clipping rectangles to it makes floating elements behave as if they were clipped by the header.
4550
- */
4551
- const computePositionWithSafeArea = (reference, floating, options) => {
4552
- // Adapted from https://github.com/floating-ui/floating-ui/blob/27629b74ba36ab8ceb2a968051927b9b69511a3b/packages/dom/src/index.ts#L15
4553
- options ??= {};
4554
- return computePosition(reference, floating, {
4555
- ...options,
4556
- platform: {
4557
- ...safeAreaPlatform,
4558
- ...options.platform,
4559
- [CLIPPING_RECT_CACHE]: new Map(),
4560
- },
4561
- });
4562
- };
4563
-
4564
- const postPopovercontainerCss = () => `@layer polyfill{@supports not selector(:popover-open){:host([popover]:not(.\\:popover-open)){display:none}}}:host{background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:host>div{box-shadow:var(--post-device-elevation-300);width:max-content;max-width:100%;color:var(--post-current-fg);background-color:var(--post-current-bg);border-radius:4px;position:relative}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host>div{border:2px solid rgba(0,0,0,0)}}:host [part=post-popovercontainer-border-mask]{display:none;position:absolute;inset:0;border-radius:4px;pointer-events:none}:host .arrow{--post-popovercontainer-arrow-border: var(--post-popovercontainer-arrow-border-width, 0px) solid var(--post-popovercontainer-arrow-border-color, transparent);position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:host .arrow[dynamic-placement=top]{border-bottom-right-radius:2px;border-bottom:var(--post-popovercontainer-arrow-border);border-right:var(--post-popovercontainer-arrow-border)}:host .arrow[dynamic-placement=right]{border-bottom-left-radius:2px;border-bottom:var(--post-popovercontainer-arrow-border);border-left:var(--post-popovercontainer-arrow-border)}:host .arrow[dynamic-placement=bottom]{border-top-left-radius:2px;border-top:var(--post-popovercontainer-arrow-border);border-left:var(--post-popovercontainer-arrow-border)}:host .arrow[dynamic-placement=left]{border-top-right-radius:2px;border-top:var(--post-popovercontainer-arrow-border);border-right:var(--post-popovercontainer-arrow-border)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .arrow[dynamic-placement=top]{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0);bottom:-0.3796735336rem !important}:host .arrow[dynamic-placement=left]{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0);right:-0.3796735336rem !important}:host .arrow[dynamic-placement=right]{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0);left:-0.3796735336rem !important}:host .arrow[dynamic-placement=bottom]{border-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0);top:-0.3796735336rem !important}}:host([tooltip]){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:host([safe-space])::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:auto}:host([safe-space=triangle])::after{clip-path:polygon(var(--post-safe-space-cursor-x, 0) var(--post-safe-space-cursor-y, 0), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)))}:host([safe-space=trapezoid])::after{clip-path:polygon(var(--post-safe-space-trigger-x-start, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-start, 0)), var(--post-safe-space-trigger-x-end, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-end, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)))}:host(:not(:has(.arrow)))>div{box-shadow:var(--post-device-elevation-300)}:host(:has(.arrow))>div{filter:drop-shadow(1px 2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(2px 4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(4px 8px 12px hsla(225, 7%, 11%, 0.15))}:host(:has(.arrow[dynamic-placement=top]))>div{filter:drop-shadow(0px -2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(0px -4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(0px -8px 12px hsla(225, 7%, 11%, 0.15))}:host(:has(.arrow[dynamic-placement=left]))>div{filter:drop-shadow(-2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(-4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(-8px 0px 12px hsla(225, 7%, 11%, 0.15))}:host(:has(.arrow[dynamic-placement=right]))>div{filter:drop-shadow(2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(8px 0px 12px hsla(225, 7%, 11%, 0.15))}`;
4640
+ const postPopovercontainerCss = () => `@layer polyfill{@supports not selector(:popover-open){:host([popover]:not(.\\:popover-open)){display:none}}}:host{background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:host [part=post-popovercontainer-content]{box-sizing:border-box;box-shadow:var(--post-device-elevation-300);width:max-content;max-width:var(--post-popovercontainer-available-width);max-height:var(--post-popovercontainer-available-height);color:var(--post-current-fg);background-color:var(--post-current-bg);border-radius:4px;position:relative;display:flex}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host [part=post-popovercontainer-content]{border:2px solid rgba(0,0,0,0)}}:host [part=post-popovercontainer-border-mask]{display:none;position:absolute;inset:0;border-radius:4px;pointer-events:none}:host .arrow{--post-popovercontainer-arrow-border: var(--post-popovercontainer-arrow-border-width, 0px) solid var(--post-popovercontainer-arrow-border-color, transparent);position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:host .arrow[data-side=top]{border-bottom-right-radius:2px;border-bottom:var(--post-popovercontainer-arrow-border);border-right:var(--post-popovercontainer-arrow-border)}:host .arrow[data-side=right]{border-bottom-left-radius:2px;border-bottom:var(--post-popovercontainer-arrow-border);border-left:var(--post-popovercontainer-arrow-border)}:host .arrow[data-side=bottom]{border-top-left-radius:2px;border-top:var(--post-popovercontainer-arrow-border);border-left:var(--post-popovercontainer-arrow-border)}:host .arrow[data-side=left]{border-top-right-radius:2px;border-top:var(--post-popovercontainer-arrow-border);border-right:var(--post-popovercontainer-arrow-border)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){:host .arrow[data-side=top]{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0);bottom:-0.3796735336rem !important}:host .arrow[data-side=left]{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0);right:-0.3796735336rem !important}:host .arrow[data-side=right]{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0);left:-0.3796735336rem !important}:host .arrow[data-side=bottom]{border-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0);top:-0.3796735336rem !important}}:host([tooltip]){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:host([safe-space])::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:auto;clip-path:var(--post-popovercontainer-safe-space, polygon(0 0, 0 0, 0 0))}:host(:not(:has(.arrow)))>div{box-shadow:var(--post-device-elevation-300)}:host(:has(.arrow))>div{filter:drop-shadow(1px 2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(2px 4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(4px 8px 12px hsla(225, 7%, 11%, 0.15))}:host(:has(.arrow[data-side=top]))>div{filter:drop-shadow(0px -2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(0px -4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(0px -8px 12px hsla(225, 7%, 11%, 0.15))}:host(:has(.arrow[data-side=left]))>div{filter:drop-shadow(-2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(-4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(-8px 0px 12px hsla(225, 7%, 11%, 0.15))}:host(:has(.arrow[data-side=right]))>div{filter:drop-shadow(2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(8px 0px 12px hsla(225, 7%, 11%, 0.15))}`;
4565
4641
 
4566
4642
  var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
4567
4643
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -4573,34 +4649,10 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
4573
4649
  r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
4574
4650
  return c > 3 && r && Object.defineProperty(target, key, r), r;
4575
4651
  };
4576
- const ANIMATIONS = {
4577
- 'pop-in': popIn,
4578
- };
4652
+ const AVAILABLE_WIDTH_PROPERTY = '--post-popovercontainer-available-width';
4653
+ const AVAILABLE_HEIGHT_PROPERTY = '--post-popovercontainer-available-height';
4654
+ const SAFE_SPACE_PROPERTY = '--post-popovercontainer-safe-space';
4579
4655
  const PostPopovercontainer = class {
4580
- static {
4581
- this.STATIC_SIDES = {
4582
- top: 'bottom',
4583
- right: 'left',
4584
- bottom: 'top',
4585
- left: 'right',
4586
- };
4587
- }
4588
- static {
4589
- this.PROPERTIES_TO_CLEAR = [
4590
- '--post-safe-space-popover-x',
4591
- '--post-safe-space-popover-y',
4592
- '--post-safe-space-popover-x-start',
4593
- '--post-safe-space-popover-x-end',
4594
- '--post-safe-space-popover-y-start',
4595
- '--post-safe-space-popover-y-end',
4596
- '--post-safe-space-trigger-x',
4597
- '--post-safe-space-trigger-y',
4598
- '--post-safe-space-trigger-x-start',
4599
- '--post-safe-space-trigger-x-end',
4600
- '--post-safe-space-trigger-y-start',
4601
- '--post-safe-space-trigger-y-end',
4602
- ];
4603
- }
4604
4656
  constructor(hostRef) {
4605
4657
  registerInstance(this, hostRef);
4606
4658
  this.postBeforeShow = createEvent(this, "postBeforeShow");
@@ -4608,37 +4660,25 @@ const PostPopovercontainer = class {
4608
4660
  this.postHide = createEvent(this, "postHide");
4609
4661
  this.postBeforeToggle = createEvent(this, "postBeforeToggle");
4610
4662
  this.postToggle = createEvent(this, "postToggle");
4663
+ /** The element the popover is anchored to */
4664
+ this.anchorRef = null;
4665
+ this.arrowRef = null;
4666
+ this.hasBeenOpened = false;
4611
4667
  this.toggleTimeoutId = null;
4612
- this.hasOpenedOnce = true;
4668
+ this.runningAnimation = null;
4669
+ this.stopAutoUpdate = null;
4613
4670
  /**
4614
- * Defines the placement of the popovercontainer according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.
4615
- * Popovercontainers are automatically flipped to the opposite side if there is not enough available space and are shifted
4616
- * towards the viewport if they would overlap edge boundaries.
4671
+ * Placement of the popover according to the floating-ui options.
4617
4672
  */
4618
4673
  this.placement = 'top';
4619
4674
  /**
4620
- * Gap between the edge of the page and the popovercontainer
4675
+ * Gap between the edge of the viewport and the popover.
4621
4676
  */
4622
4677
  this.edgeGap = 8;
4623
4678
  /**
4624
- * Whether or not to display a little pointer arrow
4679
+ * Show a little indicator arrow
4625
4680
  */
4626
4681
  this.arrow = false;
4627
- /**
4628
- * Animation style
4629
- */
4630
- this.animation = 'pop-in';
4631
- this.currentAnimation = null;
4632
- this.boundMouseTrackingHandler = this.mouseTrackingHandler.bind(this);
4633
- }
4634
- /**
4635
- * Updates cursor position for safe space feature when popover is open.
4636
- * Sets CSS custom properties for dynamic styling of safe area.
4637
- * @param event MouseEvent with cursor position
4638
- */
4639
- mouseTrackingHandler(event) {
4640
- this.host.style.setProperty('--post-safe-space-cursor-x', `${event.clientX}px`);
4641
- this.host.style.setProperty('--post-safe-space-cursor-y', `${event.clientY}px`);
4642
4682
  }
4643
4683
  connectedCallback() {
4644
4684
  if (!isSupported()) {
@@ -4649,296 +4689,197 @@ const PostPopovercontainer = class {
4649
4689
  this.host.addEventListener('beforetoggle', this.handleToggle.bind(this));
4650
4690
  }
4651
4691
  disconnectedCallback() {
4652
- if (typeof this.clearAutoUpdate === 'function') {
4653
- this.clearAutoUpdate();
4654
- }
4692
+ this.cleanup();
4655
4693
  this.host.removeEventListener('beforetoggle', this.handleToggle.bind(this));
4656
4694
  }
4695
+ cleanup() {
4696
+ this.stopAutoUpdate?.();
4697
+ if (this.runningAnimation) {
4698
+ this.runningAnimation.cancel();
4699
+ this.runningAnimation = null;
4700
+ }
4701
+ }
4702
+ isOpen() {
4703
+ return this.host?.matches(':where(:popover-open, .popover-open)');
4704
+ }
4705
+ getContent() {
4706
+ return this.host?.shadowRoot.querySelector('[part="post-popovercontainer-content"]');
4707
+ }
4708
+ getContentMinSize() {
4709
+ const content = this.getContent();
4710
+ if (!content)
4711
+ return {};
4712
+ const { minWidth, minHeight } = getComputedStyle(content);
4713
+ return {
4714
+ width: Number.parseFloat(minWidth) || 0,
4715
+ height: Number.parseFloat(minHeight) || 0,
4716
+ };
4717
+ }
4657
4718
  /**
4658
- * Programmatically display the popovercontainer
4659
- * @param target The element that invokes the popover and to which it is visually anchored.
4719
+ * Shows the popover.
4720
+ * @param anchor the element that the popover is visually anchored to.
4660
4721
  */
4661
- async show(target) {
4662
- if (this.toggleTimeoutId || !target)
4722
+ async show(anchor) {
4723
+ if (this.toggleTimeoutId || !anchor || this.isOpen())
4663
4724
  return;
4664
- this.eventTarget = target;
4665
- this.updatePosition();
4725
+ this.anchorRef = anchor;
4666
4726
  this.host.showPopover();
4667
4727
  }
4668
4728
  /**
4669
- * Programmatically hide the popovercontainer
4729
+ * Hides the popover.
4670
4730
  */
4671
4731
  async hide() {
4672
- if (!this.toggleTimeoutId) {
4673
- this.eventTarget = null;
4674
- this.host.hidePopover();
4675
- this.postHide.emit();
4676
- }
4732
+ if (this.toggleTimeoutId || !this.isOpen())
4733
+ return;
4734
+ this.anchorRef = null;
4735
+ this.host.hidePopover();
4736
+ this.postHide.emit();
4677
4737
  }
4678
4738
  /**
4679
- * Toggle popovercontainer display
4680
- * @param target The element that invokes the popover and to which it is visually anchored.
4681
- * @param force Pass true to always show or false to always hide
4739
+ * Toggles the popover's state from hidden to showing and vice versa.
4740
+ *
4741
+ * If `state` is specified, the popover is forced to be shown if the is set to `true`, or hidden
4742
+ * if it is set to `false`.
4743
+ *
4744
+ * @param anchor the element that the popover is visually anchored to.
4745
+ * @param force the next state of the popover.
4746
+ * @returns the new state of the popover: `true` if it is shown, `false` if it is hidden.
4682
4747
  */
4683
- async toggle(target, force) {
4684
- const isOpen = this.host.matches(':where(:popover-open, .popover-open)');
4685
- const willOpen = force === true || (force === undefined && !isOpen);
4686
- if (willOpen && !target)
4748
+ async toggle(anchor, force) {
4749
+ const isOpen = this.isOpen();
4750
+ if (!this.host || this.toggleTimeoutId)
4687
4751
  return isOpen;
4688
- this.eventTarget = target;
4689
- // Prevent instant double toggle
4690
- if (!this.toggleTimeoutId) {
4691
- this.updatePosition();
4692
- this.host.togglePopover(force);
4693
- this.toggleTimeoutId = null;
4694
- }
4695
- return this.host.matches(':where(:popover-open, .popover-open)');
4752
+ const shouldOpen = force === true || (force === undefined && !isOpen);
4753
+ if (isOpen === shouldOpen || (shouldOpen && !anchor))
4754
+ return isOpen;
4755
+ this.anchorRef = shouldOpen ? anchor : null;
4756
+ this.host.togglePopover(force);
4757
+ this.toggleTimeoutId = null;
4758
+ return this.isOpen();
4696
4759
  }
4697
4760
  /**
4698
- * Handles the popover opening process and emits related events.
4761
+ * Handles the popover's state transition from hidden to showing and vice versa.
4699
4762
  */
4700
- open() {
4701
- const content = this.host.shadowRoot?.querySelector('.popover-content');
4702
- this.startAutoupdates();
4703
- if (content) {
4704
- const animationFn = ANIMATIONS[this.animation];
4705
- // Only run the animation if it corresponds to a valid, registered animation function
4706
- if (typeof animationFn === 'function') {
4707
- this.runOpenAnimation(animationFn, content);
4708
- }
4709
- else {
4710
- // No animation case
4711
- this.postBeforeToggle.emit({ willOpen: true });
4712
- this.postBeforeShow.emit({ first: this.hasOpenedOnce });
4713
- this.postToggle.emit({ isOpen: true });
4714
- this.postShow.emit({ first: this.hasOpenedOnce });
4715
- if (this.hasOpenedOnce)
4716
- this.hasOpenedOnce = false;
4717
- }
4718
- }
4719
- if (this.safeSpace) {
4720
- globalThis.addEventListener('mousemove', this.boundMouseTrackingHandler);
4721
- }
4763
+ async handleToggle(event) {
4764
+ this.toggleTimeoutId = globalThis.setTimeout(() => (this.toggleTimeoutId = null), 10);
4765
+ if (event.newState === 'open')
4766
+ await this.handleOpen();
4767
+ else
4768
+ await this.handleClose();
4722
4769
  }
4723
4770
  /**
4724
- * Handles the popover closing process and emits related events.
4771
+ * Handles the popover's state transition from hidden to showing, emitting related events.
4725
4772
  */
4726
- close() {
4727
- if (typeof this.clearAutoUpdate === 'function') {
4728
- this.clearAutoUpdate();
4729
- }
4730
- if (this.safeSpace) {
4731
- globalThis.removeEventListener('mousemove', this.boundMouseTrackingHandler);
4773
+ async handleOpen() {
4774
+ this.postBeforeToggle.emit({ willOpen: true });
4775
+ this.postBeforeShow.emit({ first: !this.hasBeenOpened });
4776
+ await this.updatePosition(true);
4777
+ this.startAutoUpdate();
4778
+ try {
4779
+ await this.runOpenAnimation();
4732
4780
  }
4733
- // Cancel any running animation
4734
- if (this.currentAnimation) {
4735
- this.currentAnimation.cancel();
4736
- this.currentAnimation = null;
4781
+ catch {
4782
+ return;
4737
4783
  }
4738
- this.postBeforeToggle.emit({ willOpen: false });
4739
- this.postToggle.emit({ isOpen: false });
4740
- this.postHide.emit();
4784
+ this.postToggle.emit({ isOpen: true });
4785
+ this.postShow.emit({ first: !this.hasBeenOpened });
4786
+ this.hasBeenOpened = true;
4741
4787
  }
4742
4788
  /**
4743
- * Runs the animation and emits the toggle/show/hide events in the correct timing
4789
+ * Run the open animation for the popover.
4744
4790
  */
4745
- async runOpenAnimation(animationFn, element) {
4746
- let animation;
4747
- try {
4748
- animation = animationFn(element);
4749
- if (!animation) {
4750
- // Fallback: no animation, just emit open events directly
4751
- this.postBeforeToggle.emit({ willOpen: true });
4752
- this.postBeforeShow.emit({ first: this.hasOpenedOnce });
4753
- this.postToggle.emit({ isOpen: true });
4754
- this.postShow.emit({ first: this.hasOpenedOnce });
4755
- return;
4756
- }
4757
- this.currentAnimation = animation;
4758
- if (animation.playState === 'running') {
4759
- this.postBeforeToggle.emit({ willOpen: true });
4760
- this.postBeforeShow.emit({ first: this.hasOpenedOnce });
4761
- }
4762
- await animation.finished;
4763
- this.postToggle.emit({ isOpen: true });
4764
- this.postShow.emit({ first: this.hasOpenedOnce });
4765
- this.hasOpenedOnce = true;
4766
- }
4767
- catch (err) {
4768
- console.warn('Animation failed or was interrupted:', err);
4769
- // Reset all states to closing
4770
- this.postBeforeToggle.emit({ willOpen: false });
4771
- this.postBeforeShow.emit({ first: this.hasOpenedOnce });
4772
- this.postToggle.emit({ isOpen: false });
4773
- }
4774
- finally {
4775
- if (this.currentAnimation === animation) {
4776
- this.currentAnimation = null;
4777
- }
4778
- }
4791
+ async runOpenAnimation() {
4792
+ const content = this.getContent();
4793
+ if (!content)
4794
+ return;
4795
+ this.runningAnimation = popIn(content);
4796
+ await this.runningAnimation.finished;
4779
4797
  }
4780
4798
  /**
4781
- * Start or stop auto updates based on popovercontainer events.
4782
- * Popovercontainers can be closed or opened with other methods than class members,
4783
- * therefore listening to the toggle event is safer for cleaning up.
4784
- * @param e ToggleEvent
4799
+ * Handles the popover's state transition from showing to hidden, emitting related events.
4785
4800
  */
4786
- handleToggle(e) {
4787
- this.toggleTimeoutId = globalThis.setTimeout(() => (this.toggleTimeoutId = null), 10);
4788
- const isOpen = e.newState === 'open';
4789
- if (isOpen) {
4790
- this.open();
4791
- }
4792
- else {
4793
- this.close();
4794
- }
4801
+ async handleClose() {
4802
+ this.postBeforeToggle.emit({ willOpen: false });
4803
+ this.cleanup();
4804
+ this.host.style.removeProperty(AVAILABLE_WIDTH_PROPERTY);
4805
+ this.host.style.removeProperty(AVAILABLE_HEIGHT_PROPERTY);
4806
+ this.host.style.removeProperty(SAFE_SPACE_PROPERTY);
4807
+ this.postToggle.emit({ isOpen: false });
4808
+ this.postHide.emit();
4795
4809
  }
4796
4810
  /**
4797
- * Start listening for DOM updates, scroll events etc. that have
4798
- * an influence on popovercontainer positioning
4811
+ * Listen for changes that affect the popover's position and update it accordingly.
4799
4812
  */
4800
- startAutoupdates() {
4801
- if (!this.eventTarget || !this.host)
4813
+ startAutoUpdate() {
4814
+ if (!this.host || !this.anchorRef)
4802
4815
  return;
4803
- this.clearAutoUpdate = autoUpdate(this.eventTarget, this.host, this.updatePosition.bind(this));
4816
+ this.stopAutoUpdate = autoUpdate(this.anchorRef, this.host, () => this.updatePosition(this.autoResize));
4804
4817
  }
4805
- async updatePosition() {
4806
- const { x, y, middlewareData, placement } = await this.calculatePosition();
4807
- // Hide the popover if the target is outside the viewport
4818
+ /**
4819
+ * Updates the position of the popover based on the anchor's position and the specified placement.
4820
+ * @param withSize whether to resize the popover based on the available space.
4821
+ */
4822
+ async updatePosition(withSize = false) {
4823
+ const { x, y, middlewareData, placement } = await this.computePosition(withSize);
4824
+ // Hide the popover if the anchor is outside the scrollport.
4808
4825
  if (middlewareData.hide?.referenceHidden) {
4809
4826
  this.host.hidePopover();
4827
+ return;
4810
4828
  }
4811
- const currentPlacement = placement.split('-')[0];
4812
- this.dynamicPlacement = currentPlacement;
4813
- // Position popover
4829
+ this.side = getSide(placement);
4830
+ // Position the popover.
4814
4831
  this.host.style.left = `${x}px`;
4815
4832
  this.host.style.top = `${y}px`;
4816
- // Position arrow if enabled
4817
- if (this.arrow && middlewareData.arrow) {
4818
- const { x: arrowX, y: arrowY } = middlewareData.arrow;
4819
- const staticSide = PostPopovercontainer.STATIC_SIDES[currentPlacement];
4820
- const arrowSizePx = this.arrowRef.offsetWidth;
4821
- const halfSide = -0.5 * arrowSizePx;
4822
- if (staticSide) {
4823
- Object.assign(this.arrowRef.style, {
4824
- left: arrowX ? `${arrowX}px` : '',
4825
- top: arrowY ? `${arrowY}px` : '',
4826
- [staticSide]: `${halfSide}px`,
4827
- });
4828
- }
4833
+ // Position the indicator arrow.
4834
+ if (middlewareData.arrow) {
4835
+ this.arrowRef.style.left = middlewareData.arrow.x ? `${middlewareData.arrow.x}px` : '';
4836
+ this.arrowRef.style.top = middlewareData.arrow.y ? `${middlewareData.arrow.y}px` : '';
4837
+ this.arrowRef.style[getOppositeSide(this.side)] = `-${this.arrowRef.offsetWidth / 2}px`;
4829
4838
  }
4830
- // Handle safe space if enabled
4831
- if (this.safeSpace && this.eventTarget) {
4832
- await this.updateSafeSpaceBoundaries(currentPlacement);
4839
+ // Set the safe space polygon.
4840
+ if (middlewareData[SAFE_SPACE_MIDDLEWARE]) {
4841
+ this.host.style.setProperty(SAFE_SPACE_PROPERTY, middlewareData[SAFE_SPACE_MIDDLEWARE].polygon);
4833
4842
  }
4834
4843
  }
4835
- async calculatePosition() {
4836
- const gap = this.edgeGap;
4837
- const isAligned = (this.placement || 'top').includes('-');
4838
- const flipMiddleware = [
4839
- // Flip the popover if the target moves outside the viewport
4840
- flip({ elementContext: 'reference', crossAxis: false }),
4841
- // Flip the popover if the popover itself moves outside the viewport
4842
- flip({ elementContext: 'floating', crossAxis: false }),
4843
- ];
4844
- const shiftMiddleware = shift({
4845
- padding: gap,
4846
- limiter: limitShift({
4847
- offset: 32,
4848
- }),
4849
- });
4844
+ async computePosition(withSize) {
4845
+ const padding = this.edgeGap ?? 0;
4850
4846
  const middleware = [
4851
- offset(this.offset ?? (this.arrow ? gap + 4 : gap)),
4847
+ offset(this.offset ?? (this.arrow ? padding + 4 : padding)),
4852
4848
  inline(),
4853
- // Per floating-ui docs: for aligned placements (e.g. bottom-end),
4854
- // flip should come before shift. For non-aligned, shift before flip.
4855
- ...(isAligned ? [...flipMiddleware, shiftMiddleware] : [shiftMiddleware, ...flipMiddleware]),
4856
- size({
4857
- apply({ availableWidth, elements }) {
4858
- Object.assign(elements.floating.style, {
4859
- maxWidth: `${availableWidth - gap * 2}px`,
4860
- });
4861
- },
4862
- }),
4863
4849
  ];
4864
- if (this.arrow) {
4865
- middleware.push(arrow({ element: this.arrowRef, padding: gap }));
4850
+ const flipMiddleware = flip({ padding, minSize: this.getContentMinSize() });
4851
+ const shiftMiddleware = shift({ limiter: limitShift({ offset: 32 }), padding });
4852
+ // `flip` should come before `shift` for edge-aligned placements
4853
+ // (see https://floating-ui.com/docs/flip#combining-with-shift).
4854
+ if (this.placement?.includes('-'))
4855
+ middleware.push(flipMiddleware, shiftMiddleware);
4856
+ else
4857
+ middleware.push(shiftMiddleware, flipMiddleware);
4858
+ if (withSize) {
4859
+ middleware.push(size({
4860
+ padding,
4861
+ apply({ availableWidth, availableHeight, elements }) {
4862
+ elements.floating.style.setProperty(AVAILABLE_WIDTH_PROPERTY, `${Math.max(0, availableWidth)}px`);
4863
+ elements.floating.style.setProperty(AVAILABLE_HEIGHT_PROPERTY, `${Math.max(0, availableHeight)}px`);
4864
+ },
4865
+ }));
4866
4866
  }
4867
- // Automatically hide the popover if the target moves outside the scrollport.
4868
- if (this.autoHide) {
4869
- // Per floating-ui docs: hide should generally be placed at the end.
4867
+ if (this.arrow)
4868
+ middleware.push(arrow({ element: this.arrowRef, padding }));
4869
+ if (this.safeSpace)
4870
+ middleware.push(safeSpace());
4871
+ // `hide` should generally be placed at the end of the middleware chain
4872
+ // (see https://floating-ui.com/docs/hide#order).
4873
+ if (this.autoHide)
4870
4874
  middleware.push(hide({ strategy: 'referenceHidden' }));
4871
- }
4872
- return computePositionWithSafeArea(this.eventTarget, this.host, {
4873
- placement: this.placement || 'top',
4875
+ return computePositionWithSafeArea(this.anchorRef, this.host, {
4876
+ placement: this.placement ?? 'top',
4874
4877
  strategy: 'fixed',
4875
4878
  middleware,
4876
4879
  });
4877
4880
  }
4878
- async updateSafeSpaceBoundaries(currentPlacement) {
4879
- const targetRect = this.eventTarget.getBoundingClientRect();
4880
- const popoverRect = this.host.getBoundingClientRect();
4881
- const isVertical = currentPlacement === 'top' || currentPlacement === 'bottom';
4882
- // Helper function to get positioning data based on placement
4883
- const getPositioningData = (placement, popoverRect, targetRect) => {
4884
- if (placement === 'top' || placement === 'bottom') {
4885
- return {
4886
- popover: {
4887
- y: placement === 'top' ? popoverRect.bottom : popoverRect.top,
4888
- xStart: popoverRect.left,
4889
- xEnd: popoverRect.right,
4890
- },
4891
- trigger: {
4892
- y: placement === 'top' ? targetRect.top : targetRect.bottom,
4893
- xStart: targetRect.left,
4894
- xEnd: targetRect.right,
4895
- },
4896
- };
4897
- }
4898
- else {
4899
- // left or right
4900
- return {
4901
- popover: {
4902
- x: placement === 'left' ? popoverRect.right : popoverRect.left,
4903
- yStart: popoverRect.top,
4904
- yEnd: popoverRect.bottom,
4905
- },
4906
- trigger: {
4907
- x: placement === 'left' ? targetRect.left : targetRect.right,
4908
- yStart: targetRect.top,
4909
- yEnd: targetRect.bottom,
4910
- },
4911
- };
4912
- }
4913
- };
4914
- const posData = getPositioningData(currentPlacement, popoverRect, targetRect);
4915
- // Clear previous values
4916
- PostPopovercontainer.PROPERTIES_TO_CLEAR.forEach(prop => {
4917
- this.host.style.removeProperty(prop);
4918
- });
4919
- if (isVertical) {
4920
- // For top/bottom placement
4921
- this.host.style.setProperty('--post-safe-space-popover-y', `${posData.popover.y}px`);
4922
- this.host.style.setProperty('--post-safe-space-popover-x-start', `${posData.popover.xStart}px`);
4923
- this.host.style.setProperty('--post-safe-space-popover-x-end', `${posData.popover.xEnd}px`);
4924
- this.host.style.setProperty('--post-safe-space-trigger-y', `${posData.trigger.y}px`);
4925
- this.host.style.setProperty('--post-safe-space-trigger-x-start', `${posData.trigger.xStart}px`);
4926
- this.host.style.setProperty('--post-safe-space-trigger-x-end', `${posData.trigger.xEnd}px`);
4927
- }
4928
- else {
4929
- // For left/right placement
4930
- this.host.style.setProperty('--post-safe-space-popover-x', `${posData.popover.x}px`);
4931
- this.host.style.setProperty('--post-safe-space-popover-y-start', `${posData.popover.yStart}px`);
4932
- this.host.style.setProperty('--post-safe-space-popover-y-end', `${posData.popover.yEnd}px`);
4933
- this.host.style.setProperty('--post-safe-space-trigger-x', `${posData.trigger.x}px`);
4934
- this.host.style.setProperty('--post-safe-space-trigger-y-start', `${posData.trigger.yStart}px`);
4935
- this.host.style.setProperty('--post-safe-space-trigger-y-end', `${posData.trigger.yEnd}px`);
4936
- }
4937
- }
4938
4881
  render() {
4939
- return (h(Host, { key: 'f3ea4bfc9a59faa2fbf1e413a1ec648f598a6779', "data-version": version, popover: "auto" }, h("div", { key: 'a328c73c7e08eca1e423fcbe736798188cca2a87', part: "post-popovercontainer-content", class: "popover-content" }, this.arrow && (h("span", { key: '8fad0095fb8d8c903ba84a639b4efc3e321c6aef', "dynamic-placement": this.dynamicPlacement, class: "arrow", ref: el => {
4940
- this.arrowRef = el;
4941
- } })), h("span", { key: 'deadbcc5892ed545a64b4a0e5e0936e0dd1feb70', part: "post-popovercontainer-border-mask" }), h("slot", { key: '48c4db7ab222f3ef18157ce19d8ba15d75441f98' }))));
4882
+ return (h(Host, { key: '2240dfd6d585287ad6c50d7582053c2187dc924d', "data-version": version, popover: "auto" }, h("div", { key: '2793bd5f9dd3e72f5a6bc8344eab48262e6cea71', part: "post-popovercontainer-content" }, this.arrow && (h("span", { key: '3d0913954cead346a850f7d8ed1aaa97cbfa2d83', "data-side": this.side, class: "arrow", ref: el => (this.arrowRef = el) })), h("span", { key: 'c21d5332cfc0c0a7b7a8403f492bb4ba28b509f4', part: "post-popovercontainer-border-mask" }), h("slot", { key: 'eb6112e8dfa783304e286f65386e6e0741c2a571' }))));
4942
4883
  }
4943
4884
  get host() { return getElement(this); }
4944
4885
  };
@@ -4948,9 +4889,6 @@ __decorate([
4948
4889
  __decorate([
4949
4890
  Type('number')
4950
4891
  ], PostPopovercontainer.prototype, "edgeGap", void 0);
4951
- __decorate([
4952
- OneOf(['triangle', 'trapezoid'])
4953
- ], PostPopovercontainer.prototype, "safeSpace", void 0);
4954
4892
  PostPopovercontainer.style = postPopovercontainerCss();
4955
4893
 
4956
4894
  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}`;
@@ -4982,7 +4920,7 @@ const PostTogglebutton = class {
4982
4920
  });
4983
4921
  }
4984
4922
  render() {
4985
- return (h(Host, { key: '81fa9d922480059096e4146c10cf2ef72357b482', "data-version": version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, h("slot", { key: '4e8d793e3867ba4c9c8e17d509652309a79f032a' })));
4923
+ return (h(Host, { key: '6f61a07946f3e67bace0a883b73c424893c4043d', "data-version": version, role: "button", tabindex: "0", "aria-pressed": this.toggled.toString() }, h("slot", { key: 'fd9b93e45da499dbb790ad675f3db36e248c1960' })));
4986
4924
  }
4987
4925
  get host() { return getElement(this); }
4988
4926
  };