@swisspost/design-system-components 10.0.0-next.39 → 10.0.0-next.41

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 (454) hide show
  1. package/dist/cjs/breakpoints-DIH5Oaz7.js +186 -0
  2. package/dist/cjs/event-from-AKK8RQrn.js +107 -0
  3. package/dist/cjs/{get-root-8102fecd.js → get-root-DmyBVSJ_.js} +1 -1
  4. package/dist/cjs/{index-b60129c4.js → index-CRMt-jq2.js} +1172 -313
  5. package/dist/cjs/index.cjs.js +0 -72
  6. package/dist/cjs/loader.cjs.js +3 -6
  7. package/dist/cjs/{package-29dc73af.js → package-C2pR6Vs2.js} +1 -1
  8. package/dist/cjs/post-accordion_2.cjs.entry.js +183 -0
  9. package/dist/cjs/post-avatar.cjs.entry.js +151 -8
  10. package/dist/cjs/post-back-to-top.cjs.entry.js +86 -9
  11. package/dist/cjs/post-banner.cjs.entry.js +81 -9
  12. package/dist/cjs/post-breadcrumb-item_2.cjs.entry.js +62 -8
  13. package/dist/cjs/post-breadcrumbs.cjs.entry.js +119 -7
  14. package/dist/cjs/post-card-control.cjs.entry.js +283 -8
  15. package/dist/cjs/post-closebutton_15.cjs.entry.js +4376 -30
  16. package/dist/cjs/post-collapsible_2.cjs.entry.js +196 -10
  17. package/dist/cjs/post-components.cjs.js +7 -8
  18. package/dist/cjs/post-footer.cjs.entry.js +59 -8
  19. package/dist/cjs/post-linkarea.cjs.entry.js +24 -6
  20. package/dist/cjs/post-popover.cjs.entry.js +151 -8
  21. package/dist/cjs/post-rating.cjs.entry.js +115 -8
  22. package/dist/cjs/post-tab-header.cjs.entry.js +26 -9
  23. package/dist/cjs/post-tab-panel.cjs.entry.js +28 -9
  24. package/dist/cjs/post-tabs.cjs.entry.js +165 -7
  25. package/dist/cjs/post-tag.cjs.entry.js +50 -8
  26. package/dist/cjs/post-tooltip-trigger.cjs.entry.js +5195 -7
  27. package/dist/cjs/post-tooltip.cjs.entry.js +78 -9
  28. package/dist/collection/collection-manifest.json +4 -4
  29. package/dist/collection/components/post-accordion/post-accordion.css +1 -1
  30. package/dist/collection/components/post-accordion/post-accordion.js +39 -23
  31. package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
  32. package/dist/collection/components/post-accordion-item/post-accordion-item.js +26 -12
  33. package/dist/collection/components/post-avatar/post-avatar.js +12 -9
  34. package/dist/collection/components/post-back-to-top/post-back-to-top.js +4 -3
  35. package/dist/collection/components/post-banner/post-banner.js +18 -9
  36. package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js +4 -6
  37. package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.css +1 -1
  38. package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.js +13 -9
  39. package/dist/collection/components/post-card-control/post-card-control.js +33 -16
  40. package/dist/collection/components/post-collapsible/post-collapsible.js +6 -1
  41. package/dist/collection/components/post-collapsible-trigger/post-collapsible-trigger.js +21 -9
  42. package/dist/collection/components/post-footer/post-footer.css +1 -1
  43. package/dist/collection/components/post-footer/post-footer.js +35 -15
  44. package/dist/collection/components/post-header/post-header.css +1 -1
  45. package/dist/collection/components/post-header/post-header.js +28 -16
  46. package/dist/collection/components/post-icon/post-icon.js +66 -54
  47. package/dist/collection/components/post-language-option/post-language-option.css +1 -1
  48. package/dist/collection/components/post-language-option/post-language-option.js +17 -13
  49. package/dist/collection/components/post-language-switch/post-language-switch.css +1 -1
  50. package/dist/collection/components/post-language-switch/post-language-switch.js +43 -24
  51. package/dist/collection/components/post-linkarea/post-linkarea.js +1 -1
  52. package/dist/collection/components/post-list/post-list.js +13 -4
  53. package/dist/collection/components/post-list-item/post-list-item.js +1 -1
  54. package/dist/collection/components/post-logo/post-logo.js +4 -5
  55. package/dist/collection/components/post-mainnavigation/post-mainnavigation.js +1 -1
  56. package/dist/collection/components/post-megadropdown/post-megadropdown.js +12 -6
  57. package/dist/collection/components/post-megadropdown-trigger/post-megadropdown-trigger.js +34 -20
  58. package/dist/collection/components/post-menu/post-menu.css +1 -1
  59. package/dist/collection/components/post-menu/post-menu.js +43 -21
  60. package/dist/collection/components/post-menu-item/post-menu-item.css +1 -0
  61. package/dist/collection/components/post-menu-item/post-menu-item.js +11 -1
  62. package/dist/collection/components/post-menu-trigger/post-menu-trigger.js +9 -5
  63. package/dist/collection/components/post-popover/post-popover.js +20 -6
  64. package/dist/collection/components/post-popovercontainer/post-popovercontainer.css +1 -1
  65. package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +44 -16
  66. package/dist/collection/components/post-rating/post-rating.js +26 -6
  67. package/dist/collection/components/post-tab-header/post-tab-header.js +4 -6
  68. package/dist/collection/components/post-tab-panel/post-tab-panel.js +4 -6
  69. package/dist/collection/components/post-tabs/post-tabs.js +4 -3
  70. package/dist/collection/components/post-tag/post-tag.js +11 -9
  71. package/dist/collection/components/post-togglebutton/post-togglebutton.js +8 -3
  72. package/dist/collection/components/post-tooltip/post-tooltip.js +25 -7
  73. package/dist/collection/components/post-tooltip-trigger/post-tooltip-trigger.js +20 -12
  74. package/dist/collection/index.js +1 -37
  75. package/dist/collection/utils/breakpoints.js +38 -45
  76. package/dist/collection/utils/event-from.js +103 -0
  77. package/dist/collection/utils/index.js +1 -1
  78. package/dist/components/index.js +2315 -37
  79. package/dist/components/p-1KLiMO0w.js +3 -0
  80. package/dist/components/p-8U5GFtQP.js +105 -0
  81. package/dist/components/{post-menu2.js → p-BLhBouGz.js} +51 -30
  82. package/dist/{esm/index-ffccd040.js → components/p-CV7fm1rW.js} +1 -1
  83. package/dist/components/{post-menu-trigger2.js → p-CaPj3whI.js} +14 -12
  84. package/dist/components/{post-breadcrumb-item2.js → p-Cpaqct04.js} +9 -11
  85. package/dist/components/p-CtNCtg2z.js +114 -0
  86. package/dist/components/p-Cx0AiN2A.js +182 -0
  87. package/{loaders/post-collapsible-trigger2.js → dist/components/p-D3LhzIrC.js} +25 -14
  88. package/dist/components/{get-root.js → p-DBHo9yGF.js} +1 -1
  89. package/dist/components/p-DQuPPEca.js +31 -0
  90. package/dist/components/{post-accordion2.js → p-DlEtlaNu.js} +42 -29
  91. package/dist/components/{post-collapsible2.js → p-DphlfQse.js} +11 -8
  92. package/dist/components/{post-popovercontainer2.js → p-elg4VvHg.js} +246 -278
  93. package/{loaders/post-icon2.js → dist/components/p-fmA57Ivd.js} +52 -54
  94. package/dist/components/post-accordion-item.js +1 -1
  95. package/dist/components/post-accordion.js +1 -1
  96. package/dist/components/post-avatar.js +183 -1
  97. package/dist/components/post-back-to-top.js +115 -1
  98. package/dist/components/post-banner.js +120 -1
  99. package/dist/components/post-breadcrumb-item.js +1 -1
  100. package/dist/components/post-breadcrumbs.js +182 -1
  101. package/dist/components/post-card-control.js +322 -1
  102. package/dist/components/post-closebutton.js +37 -1
  103. package/dist/components/post-collapsible-trigger.js +1 -1
  104. package/dist/components/post-collapsible.js +1 -1
  105. package/dist/components/post-footer.js +112 -1
  106. package/dist/components/post-header.js +273 -1
  107. package/dist/components/post-icon.js +1 -1
  108. package/dist/components/post-language-option.js +96 -1
  109. package/dist/components/post-language-switch.js +154 -1
  110. package/dist/components/post-linkarea.js +41 -1
  111. package/dist/components/post-list-item.js +34 -1
  112. package/dist/components/post-list.js +57 -1
  113. package/dist/components/post-logo.js +54 -1
  114. package/dist/components/post-mainnavigation.js +181 -1
  115. package/dist/components/post-megadropdown-trigger.js +132 -1
  116. package/dist/components/post-megadropdown.js +194 -1
  117. package/dist/components/post-menu-item.js +1 -1
  118. package/dist/components/post-menu-trigger.js +1 -1
  119. package/dist/components/post-menu.js +1 -1
  120. package/dist/components/post-popover.js +184 -1
  121. package/dist/components/post-popovercontainer.js +1 -1
  122. package/dist/components/post-rating.js +148 -1
  123. package/dist/components/post-tab-header.js +48 -1
  124. package/dist/components/post-tab-panel.js +50 -1
  125. package/dist/components/post-tabs.js +186 -1
  126. package/dist/components/post-tag.js +82 -1
  127. package/dist/components/post-togglebutton.js +52 -1
  128. package/dist/components/post-tooltip-trigger.js +5218 -1
  129. package/dist/components/post-tooltip.js +110 -1
  130. package/dist/docs.d.ts +8 -0
  131. package/dist/docs.json +426 -118
  132. package/dist/esm/breakpoints-DyVir0ex.js +182 -0
  133. package/dist/esm/event-from-8U5GFtQP.js +105 -0
  134. package/{loaders/get-root.js → dist/esm/get-root-D9QC9-TY.js} +1 -1
  135. package/{loaders/index2.js → dist/esm/index-BWC0gtGU.js} +1 -1
  136. package/dist/esm/{index-f4d19816.js → index-CVhzhVv0.js} +1169 -309
  137. package/dist/esm/index.js +1 -31
  138. package/dist/esm/loader.js +3 -4
  139. package/dist/esm/package-1KLiMO0w.js +3 -0
  140. package/dist/esm/post-accordion_2.entry.js +180 -0
  141. package/dist/esm/post-avatar.entry.js +154 -5
  142. package/dist/esm/post-back-to-top.entry.js +89 -6
  143. package/dist/esm/post-banner.entry.js +85 -7
  144. package/dist/esm/post-breadcrumb-item_2.entry.js +65 -5
  145. package/dist/esm/post-breadcrumbs.entry.js +123 -5
  146. package/dist/esm/post-card-control.entry.js +286 -5
  147. package/dist/esm/post-closebutton_15.entry.js +4362 -10
  148. package/dist/esm/post-collapsible_2.entry.js +199 -7
  149. package/dist/esm/post-components.js +5 -5
  150. package/dist/esm/post-footer.entry.js +62 -5
  151. package/dist/esm/post-linkarea.entry.js +27 -3
  152. package/dist/esm/post-popover.entry.js +155 -6
  153. package/dist/esm/post-rating.entry.js +118 -5
  154. package/dist/esm/post-tab-header.entry.js +29 -6
  155. package/dist/esm/post-tab-panel.entry.js +31 -6
  156. package/dist/esm/post-tabs.entry.js +169 -5
  157. package/dist/esm/post-tag.entry.js +53 -5
  158. package/dist/esm/post-tooltip-trigger.entry.js +5199 -5
  159. package/dist/esm/post-tooltip.entry.js +81 -6
  160. package/dist/post-components/index.esm.js +0 -1
  161. package/dist/post-components/p-0d08ab13.entry.js +1 -0
  162. package/dist/post-components/p-1KLiMO0w.js +1 -0
  163. package/dist/post-components/p-1e006e29.entry.js +1 -0
  164. package/dist/post-components/p-3a5bdb7f.entry.js +1 -0
  165. package/dist/post-components/p-4214b85e.entry.js +1 -0
  166. package/dist/post-components/p-50916d48.entry.js +1 -0
  167. package/dist/post-components/p-5f4126d8.entry.js +1 -0
  168. package/dist/post-components/p-62982420.entry.js +1 -0
  169. package/dist/post-components/p-78f4dd12.entry.js +1 -0
  170. package/dist/post-components/p-7a7d237b.entry.js +1 -0
  171. package/dist/post-components/p-80174475.entry.js +1 -0
  172. package/dist/post-components/p-8U5GFtQP.js +1 -0
  173. package/dist/post-components/p-8d5a4218.entry.js +1 -0
  174. package/dist/post-components/p-8e89ccc1.entry.js +1 -0
  175. package/dist/post-components/p-9003674b.entry.js +1 -0
  176. package/dist/post-components/p-925aee3d.entry.js +1 -0
  177. package/dist/post-components/p-9b446561.entry.js +1 -0
  178. package/dist/post-components/p-9ec29527.entry.js +1 -0
  179. package/dist/post-components/{p-b176309b.js → p-BWC0gtGU.js} +1 -1
  180. package/dist/post-components/{p-6b31a76a.js → p-Bkp2QDth.js} +1 -1
  181. package/dist/post-components/p-CVhzhVv0.js +2 -0
  182. package/dist/post-components/p-DyVir0ex.js +1 -0
  183. package/dist/post-components/p-ec764922.entry.js +1 -0
  184. package/dist/post-components/p-fa550b4a.entry.js +1 -0
  185. package/dist/post-components/p-fb46e260.entry.js +1 -0
  186. package/dist/post-components/post-components.esm.js +1 -1
  187. package/dist/types/components/post-footer/post-footer.d.ts +7 -3
  188. package/dist/types/components/post-header/post-header.d.ts +1 -0
  189. package/dist/types/components/post-icon/post-icon.d.ts +0 -4
  190. package/dist/types/components/post-language-switch/post-language-switch.d.ts +1 -0
  191. package/dist/types/components/post-tag/post-tag.d.ts +1 -1
  192. package/dist/types/components.d.ts +61 -1
  193. package/dist/types/index.d.ts +10 -37
  194. package/dist/types/stencil-public-runtime.d.ts +29 -1
  195. package/dist/types/utils/breakpoints.d.ts +12 -7
  196. package/dist/types/utils/event-from.d.ts +9 -0
  197. package/dist/types/utils/index.d.ts +1 -1
  198. package/hydrate/index.d.ts +273 -0
  199. package/hydrate/index.js +32002 -0
  200. package/hydrate/index.mjs +31994 -0
  201. package/hydrate/package.json +12 -0
  202. package/package.json +45 -17
  203. package/dist/cjs/app-globals-3a1e7e63.js +0 -5
  204. package/dist/cjs/breakpoints-cdf1b747.js +0 -59
  205. package/dist/cjs/event-guard-efabc84f.js +0 -47
  206. package/dist/cjs/heading-levels-608d432e.js +0 -5
  207. package/dist/cjs/post-accordion-c433c493.js +0 -105
  208. package/dist/cjs/post-accordion-item-8d5a301d.js +0 -64
  209. package/dist/cjs/post-accordion-item.cjs.entry.js +0 -16
  210. package/dist/cjs/post-accordion.cjs.entry.js +0 -15
  211. package/dist/cjs/post-avatar-421043df.js +0 -162
  212. package/dist/cjs/post-back-to-top-3cca3803.js +0 -93
  213. package/dist/cjs/post-banner-2e99c9d8.js +0 -87
  214. package/dist/cjs/post-breadcrumbs-1be50860.js +0 -126
  215. package/dist/cjs/post-card-control-0bfdad92.js +0 -290
  216. package/dist/cjs/post-collapsible-trigger-4180b218.js +0 -190
  217. package/dist/cjs/post-footer-92adffac.js +0 -48
  218. package/dist/cjs/post-linkarea-26c457b3.js +0 -30
  219. package/dist/cjs/post-menu-item-d0a53c84.js +0 -68
  220. package/dist/cjs/post-popover-36cead3d.js +0 -150
  221. package/dist/cjs/post-rating-f50a9939.js +0 -109
  222. package/dist/cjs/post-tab-header-f47508da.js +0 -34
  223. package/dist/cjs/post-tab-panel-7c51798b.js +0 -36
  224. package/dist/cjs/post-tabs-2debea01.js +0 -173
  225. package/dist/cjs/post-tag-ac62c57f.js +0 -60
  226. package/dist/cjs/post-togglebutton-43c46511.js +0 -4491
  227. package/dist/cjs/post-tooltip-b7dcfb44.js +0 -74
  228. package/dist/cjs/post-tooltip-trigger-904061b6.js +0 -4685
  229. package/dist/collection/utils/event-guard.js +0 -43
  230. package/dist/components/breakpoints.js +0 -56
  231. package/dist/components/event-guard.js +0 -45
  232. package/dist/components/index2.js +0 -88
  233. package/dist/components/package.js +0 -3
  234. package/dist/components/post-accordion-item2.js +0 -103
  235. package/dist/components/post-avatar2.js +0 -190
  236. package/dist/components/post-back-to-top2.js +0 -118
  237. package/dist/components/post-banner2.js +0 -121
  238. package/dist/components/post-breadcrumbs2.js +0 -184
  239. package/dist/components/post-card-control2.js +0 -325
  240. package/dist/components/post-closebutton2.js +0 -39
  241. package/dist/components/post-collapsible-trigger2.js +0 -125
  242. package/dist/components/post-footer2.js +0 -90
  243. package/dist/components/post-header2.js +0 -397
  244. package/dist/components/post-icon2.js +0 -156
  245. package/dist/components/post-language-option2.js +0 -102
  246. package/dist/components/post-language-switch2.js +0 -143
  247. package/dist/components/post-linkarea2.js +0 -43
  248. package/dist/components/post-list-item2.js +0 -36
  249. package/dist/components/post-list2.js +0 -54
  250. package/dist/components/post-logo2.js +0 -57
  251. package/dist/components/post-mainnavigation2.js +0 -183
  252. package/dist/components/post-megadropdown-trigger2.js +0 -121
  253. package/dist/components/post-megadropdown2.js +0 -190
  254. package/dist/components/post-menu-item2.js +0 -27
  255. package/dist/components/post-popover2.js +0 -178
  256. package/dist/components/post-rating2.js +0 -138
  257. package/dist/components/post-tab-header2.js +0 -52
  258. package/dist/components/post-tab-panel2.js +0 -54
  259. package/dist/components/post-tabs2.js +0 -189
  260. package/dist/components/post-tag2.js +0 -88
  261. package/dist/components/post-togglebutton2.js +0 -51
  262. package/dist/components/post-tooltip-trigger2.js +0 -4703
  263. package/dist/components/post-tooltip2.js +0 -102
  264. package/dist/esm/app-globals-0f993ce5.js +0 -3
  265. package/dist/esm/breakpoints-7812702e.js +0 -56
  266. package/dist/esm/event-guard-538ee077.js +0 -45
  267. package/dist/esm/get-root-1b1af46f.js +0 -15
  268. package/dist/esm/heading-levels-5b7b4349.js +0 -3
  269. package/dist/esm/package-8503eaa8.js +0 -3
  270. package/dist/esm/post-accordion-9365faca.js +0 -103
  271. package/dist/esm/post-accordion-item-2dc8e3b7.js +0 -62
  272. package/dist/esm/post-accordion-item.entry.js +0 -8
  273. package/dist/esm/post-accordion.entry.js +0 -7
  274. package/dist/esm/post-avatar-4f73dc4d.js +0 -160
  275. package/dist/esm/post-back-to-top-8f759d32.js +0 -91
  276. package/dist/esm/post-banner-ad979275.js +0 -85
  277. package/dist/esm/post-breadcrumbs-a20336c7.js +0 -124
  278. package/dist/esm/post-card-control-3c77e778.js +0 -288
  279. package/dist/esm/post-collapsible-trigger-5fd0e193.js +0 -187
  280. package/dist/esm/post-footer-3e117b5a.js +0 -46
  281. package/dist/esm/post-linkarea-16a14609.js +0 -28
  282. package/dist/esm/post-menu-item-b1604fe4.js +0 -65
  283. package/dist/esm/post-popover-49096648.js +0 -148
  284. package/dist/esm/post-rating-405bee8f.js +0 -107
  285. package/dist/esm/post-tab-header-b228c217.js +0 -32
  286. package/dist/esm/post-tab-panel-98110b64.js +0 -34
  287. package/dist/esm/post-tabs-44d9313c.js +0 -171
  288. package/dist/esm/post-tag-99cc9616.js +0 -58
  289. package/dist/esm/post-togglebutton-ea73e63f.js +0 -4475
  290. package/dist/esm/post-tooltip-78cd2988.js +0 -72
  291. package/dist/esm/post-tooltip-trigger-bdb21c45.js +0 -4683
  292. package/dist/post-components/p-0889c759.js +0 -1
  293. package/dist/post-components/p-09dd5aa4.js +0 -1
  294. package/dist/post-components/p-0f9322e5.js +0 -8
  295. package/dist/post-components/p-11572299.js +0 -1
  296. package/dist/post-components/p-19a83519.entry.js +0 -1
  297. package/dist/post-components/p-1afb3c43.entry.js +0 -1
  298. package/dist/post-components/p-214cd032.js +0 -1
  299. package/dist/post-components/p-21e5b028.js +0 -1
  300. package/dist/post-components/p-2320305b.js +0 -1
  301. package/dist/post-components/p-247a1668.js +0 -1
  302. package/dist/post-components/p-2523f97b.entry.js +0 -1
  303. package/dist/post-components/p-2bd3a436.js +0 -1
  304. package/dist/post-components/p-2ce8fbf5.js +0 -1
  305. package/dist/post-components/p-2f879f4e.entry.js +0 -1
  306. package/dist/post-components/p-33e26845.entry.js +0 -1
  307. package/dist/post-components/p-38b1c71e.entry.js +0 -1
  308. package/dist/post-components/p-38d59732.js +0 -1
  309. package/dist/post-components/p-3a67f1ff.js +0 -1
  310. package/dist/post-components/p-41450b6c.entry.js +0 -1
  311. package/dist/post-components/p-4c23ed05.entry.js +0 -1
  312. package/dist/post-components/p-57746c40.js +0 -1
  313. package/dist/post-components/p-6313d72e.entry.js +0 -1
  314. package/dist/post-components/p-64e0b0fc.js +0 -1
  315. package/dist/post-components/p-658a2e34.entry.js +0 -1
  316. package/dist/post-components/p-722ffaae.js +0 -1
  317. package/dist/post-components/p-746d3cd3.entry.js +0 -1
  318. package/dist/post-components/p-79a2dad0.entry.js +0 -1
  319. package/dist/post-components/p-7dd1807c.js +0 -1
  320. package/dist/post-components/p-817fbeaf.js +0 -1
  321. package/dist/post-components/p-85950200.js +0 -1
  322. package/dist/post-components/p-8ebecf22.entry.js +0 -1
  323. package/dist/post-components/p-8ed1cb53.entry.js +0 -1
  324. package/dist/post-components/p-91244b25.js +0 -1
  325. package/dist/post-components/p-91675004.js +0 -1
  326. package/dist/post-components/p-94ebc430.js +0 -1
  327. package/dist/post-components/p-95727a4f.entry.js +0 -1
  328. package/dist/post-components/p-9e461613.js +0 -2
  329. package/dist/post-components/p-a844da3a.entry.js +0 -1
  330. package/dist/post-components/p-af900651.js +0 -1
  331. package/dist/post-components/p-b373659e.entry.js +0 -1
  332. package/dist/post-components/p-b500b245.js +0 -1
  333. package/dist/post-components/p-bf182745.entry.js +0 -1
  334. package/dist/post-components/p-c9b6f9e7.entry.js +0 -1
  335. package/dist/post-components/p-cb7d8f67.entry.js +0 -1
  336. package/dist/post-components/p-e1255160.js +0 -1
  337. package/dist/post-components/p-e28eb73a.js +0 -1
  338. package/dist/types/popover-fn.d.ts +0 -11
  339. package/dist/types/utils/event-guard.d.ts +0 -4
  340. package/loader/package.json +0 -11
  341. package/loaders/breakpoints.js +0 -56
  342. package/loaders/event-guard.js +0 -45
  343. package/loaders/fade.js +0 -11
  344. package/loaders/get-focusable-children.js +0 -35
  345. package/loaders/heading-levels.js +0 -3
  346. package/loaders/index.browser.js +0 -14
  347. package/loaders/index.d.ts +0 -108
  348. package/loaders/index.js +0 -39
  349. package/loaders/long-press-event.js +0 -264
  350. package/loaders/package.js +0 -3
  351. package/loaders/post-accordion-item.d.ts +0 -11
  352. package/loaders/post-accordion-item.js +0 -6
  353. package/loaders/post-accordion-item2.js +0 -103
  354. package/loaders/post-accordion.d.ts +0 -11
  355. package/loaders/post-accordion.js +0 -129
  356. package/loaders/post-avatar.d.ts +0 -11
  357. package/loaders/post-avatar.js +0 -193
  358. package/loaders/post-back-to-top.d.ts +0 -11
  359. package/loaders/post-back-to-top.js +0 -121
  360. package/loaders/post-banner.d.ts +0 -11
  361. package/loaders/post-banner.js +0 -124
  362. package/loaders/post-breadcrumb-item.d.ts +0 -11
  363. package/loaders/post-breadcrumb-item.js +0 -6
  364. package/loaders/post-breadcrumb-item2.js +0 -82
  365. package/loaders/post-breadcrumbs.d.ts +0 -11
  366. package/loaders/post-breadcrumbs.js +0 -187
  367. package/loaders/post-card-control.d.ts +0 -11
  368. package/loaders/post-card-control.js +0 -328
  369. package/loaders/post-closebutton.d.ts +0 -11
  370. package/loaders/post-closebutton.js +0 -42
  371. package/loaders/post-collapsible-trigger.d.ts +0 -11
  372. package/loaders/post-collapsible-trigger.js +0 -6
  373. package/loaders/post-collapsible.d.ts +0 -11
  374. package/loaders/post-collapsible.js +0 -6
  375. package/loaders/post-collapsible2.js +0 -108
  376. package/loaders/post-footer.d.ts +0 -11
  377. package/loaders/post-footer.js +0 -93
  378. package/loaders/post-header.d.ts +0 -11
  379. package/loaders/post-header.js +0 -400
  380. package/loaders/post-icon.d.ts +0 -11
  381. package/loaders/post-icon.js +0 -6
  382. package/loaders/post-language-option.d.ts +0 -11
  383. package/loaders/post-language-option.js +0 -105
  384. package/loaders/post-language-switch.d.ts +0 -11
  385. package/loaders/post-language-switch.js +0 -146
  386. package/loaders/post-linkarea.d.ts +0 -11
  387. package/loaders/post-linkarea.js +0 -46
  388. package/loaders/post-list-item.d.ts +0 -11
  389. package/loaders/post-list-item.js +0 -39
  390. package/loaders/post-list.d.ts +0 -11
  391. package/loaders/post-list.js +0 -57
  392. package/loaders/post-logo.d.ts +0 -11
  393. package/loaders/post-logo.js +0 -60
  394. package/loaders/post-mainnavigation.d.ts +0 -11
  395. package/loaders/post-mainnavigation.js +0 -186
  396. package/loaders/post-megadropdown-trigger.d.ts +0 -11
  397. package/loaders/post-megadropdown-trigger.js +0 -124
  398. package/loaders/post-megadropdown.d.ts +0 -11
  399. package/loaders/post-megadropdown.js +0 -193
  400. package/loaders/post-menu-item.d.ts +0 -11
  401. package/loaders/post-menu-item.js +0 -6
  402. package/loaders/post-menu-item2.js +0 -27
  403. package/loaders/post-menu-trigger.d.ts +0 -11
  404. package/loaders/post-menu-trigger.js +0 -6
  405. package/loaders/post-menu-trigger2.js +0 -109
  406. package/loaders/post-menu.d.ts +0 -11
  407. package/loaders/post-menu.js +0 -6
  408. package/loaders/post-menu2.js +0 -202
  409. package/loaders/post-popover.d.ts +0 -11
  410. package/loaders/post-popover.js +0 -181
  411. package/loaders/post-popovercontainer.d.ts +0 -11
  412. package/loaders/post-popovercontainer.js +0 -6
  413. package/loaders/post-popovercontainer2.js +0 -3051
  414. package/loaders/post-rating.d.ts +0 -11
  415. package/loaders/post-rating.js +0 -141
  416. package/loaders/post-tab-header.d.ts +0 -11
  417. package/loaders/post-tab-header.js +0 -55
  418. package/loaders/post-tab-panel.d.ts +0 -11
  419. package/loaders/post-tab-panel.js +0 -57
  420. package/loaders/post-tabs.d.ts +0 -11
  421. package/loaders/post-tabs.js +0 -192
  422. package/loaders/post-tag.d.ts +0 -11
  423. package/loaders/post-tag.js +0 -91
  424. package/loaders/post-togglebutton.d.ts +0 -11
  425. package/loaders/post-togglebutton.js +0 -54
  426. package/loaders/post-tooltip-trigger.d.ts +0 -11
  427. package/loaders/post-tooltip-trigger.js +0 -4706
  428. package/loaders/post-tooltip.d.ts +0 -11
  429. package/loaders/post-tooltip.js +0 -105
  430. package/loaders/slide.js +0 -25
  431. package/loaders/switch-variants.js +0 -3
  432. /package/dist/cjs/{fade-72d5ef55.js → fade-nS5zzDQS.js} +0 -0
  433. /package/dist/cjs/{index-2b2b85e5.js → index-DtvYdwe1.js} +0 -0
  434. /package/dist/cjs/{index.browser-4af21c17.js → index.browser-Doj636JV.js} +0 -0
  435. /package/dist/cjs/{long-press-event-6e62d113.js → long-press-event-Q8jMUNXD.js} +0 -0
  436. /package/dist/cjs/{placement-b2bb6ec4.js → placement-qEFR9hmI.js} +0 -0
  437. /package/dist/cjs/{slide-cd1f09b3.js → slide-CbBL7A8w.js} +0 -0
  438. /package/dist/components/{index.browser.js → p-BLchVpF6.js} +0 -0
  439. /package/dist/components/{slide.js → p-BuLMaH5t.js} +0 -0
  440. /package/dist/components/{get-focusable-children.js → p-C35MCWIp.js} +0 -0
  441. /package/dist/components/{long-press-event.js → p-C_2k3G1c.js} +0 -0
  442. /package/dist/components/{switch-variants.js → p-DjIHLduJ.js} +0 -0
  443. /package/dist/components/{fade.js → p-SbIC4aZX.js} +0 -0
  444. /package/dist/components/{heading-levels.js → p-r4txK0AC.js} +0 -0
  445. /package/dist/esm/{fade-1f3cacf4.js → fade-SbIC4aZX.js} +0 -0
  446. /package/dist/esm/{index.browser-ff103197.js → index.browser-BLchVpF6.js} +0 -0
  447. /package/dist/esm/{long-press-event-04d24397.js → long-press-event-C_2k3G1c.js} +0 -0
  448. /package/dist/esm/{placement-8d56605d.js → placement-DRiVosES.js} +0 -0
  449. /package/dist/esm/{slide-cd2850ee.js → slide-BuLMaH5t.js} +0 -0
  450. /package/dist/post-components/{p-c65f32b0.js → p-BLchVpF6.js} +0 -0
  451. /package/dist/post-components/{p-9b052461.js → p-BuLMaH5t.js} +0 -0
  452. /package/dist/post-components/{p-8db32dab.js → p-C_2k3G1c.js} +0 -0
  453. /package/dist/post-components/{p-59a38c23.js → p-DRiVosES.js} +0 -0
  454. /package/dist/post-components/{p-64e3de38.js → p-SbIC4aZX.js} +0 -0
@@ -1,3051 +0,0 @@
1
- import { proxyCustomElement, HTMLElement as HTMLElement$1, createEvent, h, Host } from '@stencil/core/internal/client';
2
- import { I as IS_BROWSER } from './breakpoints.js';
3
- import { d as checkEmptyOrOneOf, a as checkEmptyOrType } from './index2.js';
4
- import { v as version } from './package.js';
5
-
6
- const PLACEMENT_TYPES = [
7
- 'top',
8
- 'right',
9
- 'bottom',
10
- 'left',
11
- 'top-start',
12
- 'top-end',
13
- 'right-start',
14
- 'right-end',
15
- 'bottom-start',
16
- 'bottom-end',
17
- 'left-start',
18
- 'left-end',
19
- ];
20
-
21
- /**
22
- * Custom positioning reference element.
23
- * @see https://floating-ui.com/docs/virtual-elements
24
- */
25
-
26
- const sides = ['top', 'right', 'bottom', 'left'];
27
- const alignments = ['start', 'end'];
28
- const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
29
- const min = Math.min;
30
- const max = Math.max;
31
- const round = Math.round;
32
- const floor = Math.floor;
33
- const createCoords = v => ({
34
- x: v,
35
- y: v
36
- });
37
- const oppositeSideMap = {
38
- left: 'right',
39
- right: 'left',
40
- bottom: 'top',
41
- top: 'bottom'
42
- };
43
- const oppositeAlignmentMap = {
44
- start: 'end',
45
- end: 'start'
46
- };
47
- function clamp(start, value, end) {
48
- return max(start, min(value, end));
49
- }
50
- function evaluate(value, param) {
51
- return typeof value === 'function' ? value(param) : value;
52
- }
53
- function getSide(placement) {
54
- return placement.split('-')[0];
55
- }
56
- function getAlignment(placement) {
57
- return placement.split('-')[1];
58
- }
59
- function getOppositeAxis(axis) {
60
- return axis === 'x' ? 'y' : 'x';
61
- }
62
- function getAxisLength(axis) {
63
- return axis === 'y' ? 'height' : 'width';
64
- }
65
- function getSideAxis(placement) {
66
- return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x';
67
- }
68
- function getAlignmentAxis(placement) {
69
- return getOppositeAxis(getSideAxis(placement));
70
- }
71
- function getAlignmentSides(placement, rects, rtl) {
72
- if (rtl === void 0) {
73
- rtl = false;
74
- }
75
- const alignment = getAlignment(placement);
76
- const alignmentAxis = getAlignmentAxis(placement);
77
- const length = getAxisLength(alignmentAxis);
78
- let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
79
- if (rects.reference[length] > rects.floating[length]) {
80
- mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
81
- }
82
- return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
83
- }
84
- function getExpandedPlacements(placement) {
85
- const oppositePlacement = getOppositePlacement(placement);
86
- return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
87
- }
88
- function getOppositeAlignmentPlacement(placement) {
89
- return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
90
- }
91
- function getSideList(side, isStart, rtl) {
92
- const lr = ['left', 'right'];
93
- const rl = ['right', 'left'];
94
- const tb = ['top', 'bottom'];
95
- const bt = ['bottom', 'top'];
96
- switch (side) {
97
- case 'top':
98
- case 'bottom':
99
- if (rtl) return isStart ? rl : lr;
100
- return isStart ? lr : rl;
101
- case 'left':
102
- case 'right':
103
- return isStart ? tb : bt;
104
- default:
105
- return [];
106
- }
107
- }
108
- function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
109
- const alignment = getAlignment(placement);
110
- let list = getSideList(getSide(placement), direction === 'start', rtl);
111
- if (alignment) {
112
- list = list.map(side => side + "-" + alignment);
113
- if (flipAlignment) {
114
- list = list.concat(list.map(getOppositeAlignmentPlacement));
115
- }
116
- }
117
- return list;
118
- }
119
- function getOppositePlacement(placement) {
120
- return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
121
- }
122
- function expandPaddingObject(padding) {
123
- return {
124
- top: 0,
125
- right: 0,
126
- bottom: 0,
127
- left: 0,
128
- ...padding
129
- };
130
- }
131
- function getPaddingObject(padding) {
132
- return typeof padding !== 'number' ? expandPaddingObject(padding) : {
133
- top: padding,
134
- right: padding,
135
- bottom: padding,
136
- left: padding
137
- };
138
- }
139
- function rectToClientRect(rect) {
140
- const {
141
- x,
142
- y,
143
- width,
144
- height
145
- } = rect;
146
- return {
147
- width,
148
- height,
149
- top: y,
150
- left: x,
151
- right: x + width,
152
- bottom: y + height,
153
- x,
154
- y
155
- };
156
- }
157
-
158
- function computeCoordsFromPlacement(_ref, placement, rtl) {
159
- let {
160
- reference,
161
- floating
162
- } = _ref;
163
- const sideAxis = getSideAxis(placement);
164
- const alignmentAxis = getAlignmentAxis(placement);
165
- const alignLength = getAxisLength(alignmentAxis);
166
- const side = getSide(placement);
167
- const isVertical = sideAxis === 'y';
168
- const commonX = reference.x + reference.width / 2 - floating.width / 2;
169
- const commonY = reference.y + reference.height / 2 - floating.height / 2;
170
- const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
171
- let coords;
172
- switch (side) {
173
- case 'top':
174
- coords = {
175
- x: commonX,
176
- y: reference.y - floating.height
177
- };
178
- break;
179
- case 'bottom':
180
- coords = {
181
- x: commonX,
182
- y: reference.y + reference.height
183
- };
184
- break;
185
- case 'right':
186
- coords = {
187
- x: reference.x + reference.width,
188
- y: commonY
189
- };
190
- break;
191
- case 'left':
192
- coords = {
193
- x: reference.x - floating.width,
194
- y: commonY
195
- };
196
- break;
197
- default:
198
- coords = {
199
- x: reference.x,
200
- y: reference.y
201
- };
202
- }
203
- switch (getAlignment(placement)) {
204
- case 'start':
205
- coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
206
- break;
207
- case 'end':
208
- coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
209
- break;
210
- }
211
- return coords;
212
- }
213
-
214
- /**
215
- * Computes the `x` and `y` coordinates that will place the floating element
216
- * next to a given reference element.
217
- *
218
- * This export does not have any `platform` interface logic. You will need to
219
- * write one for the platform you are using Floating UI with.
220
- */
221
- const computePosition$1 = async (reference, floating, config) => {
222
- const {
223
- placement = 'bottom',
224
- strategy = 'absolute',
225
- middleware = [],
226
- platform
227
- } = config;
228
- const validMiddleware = middleware.filter(Boolean);
229
- const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
230
- let rects = await platform.getElementRects({
231
- reference,
232
- floating,
233
- strategy
234
- });
235
- let {
236
- x,
237
- y
238
- } = computeCoordsFromPlacement(rects, placement, rtl);
239
- let statefulPlacement = placement;
240
- let middlewareData = {};
241
- let resetCount = 0;
242
- for (let i = 0; i < validMiddleware.length; i++) {
243
- const {
244
- name,
245
- fn
246
- } = validMiddleware[i];
247
- const {
248
- x: nextX,
249
- y: nextY,
250
- data,
251
- reset
252
- } = await fn({
253
- x,
254
- y,
255
- initialPlacement: placement,
256
- placement: statefulPlacement,
257
- strategy,
258
- middlewareData,
259
- rects,
260
- platform,
261
- elements: {
262
- reference,
263
- floating
264
- }
265
- });
266
- x = nextX != null ? nextX : x;
267
- y = nextY != null ? nextY : y;
268
- middlewareData = {
269
- ...middlewareData,
270
- [name]: {
271
- ...middlewareData[name],
272
- ...data
273
- }
274
- };
275
- if (reset && resetCount <= 50) {
276
- resetCount++;
277
- if (typeof reset === 'object') {
278
- if (reset.placement) {
279
- statefulPlacement = reset.placement;
280
- }
281
- if (reset.rects) {
282
- rects = reset.rects === true ? await platform.getElementRects({
283
- reference,
284
- floating,
285
- strategy
286
- }) : reset.rects;
287
- }
288
- ({
289
- x,
290
- y
291
- } = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
292
- }
293
- i = -1;
294
- }
295
- }
296
- return {
297
- x,
298
- y,
299
- placement: statefulPlacement,
300
- strategy,
301
- middlewareData
302
- };
303
- };
304
-
305
- /**
306
- * Resolves with an object of overflow side offsets that determine how much the
307
- * element is overflowing a given clipping boundary on each side.
308
- * - positive = overflowing the boundary by that number of pixels
309
- * - negative = how many pixels left before it will overflow
310
- * - 0 = lies flush with the boundary
311
- * @see https://floating-ui.com/docs/detectOverflow
312
- */
313
- async function detectOverflow(state, options) {
314
- var _await$platform$isEle;
315
- if (options === void 0) {
316
- options = {};
317
- }
318
- const {
319
- x,
320
- y,
321
- platform,
322
- rects,
323
- elements,
324
- strategy
325
- } = state;
326
- const {
327
- boundary = 'clippingAncestors',
328
- rootBoundary = 'viewport',
329
- elementContext = 'floating',
330
- altBoundary = false,
331
- padding = 0
332
- } = evaluate(options, state);
333
- const paddingObject = getPaddingObject(padding);
334
- const altContext = elementContext === 'floating' ? 'reference' : 'floating';
335
- const element = elements[altBoundary ? altContext : elementContext];
336
- const clippingClientRect = rectToClientRect(await platform.getClippingRect({
337
- element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
338
- boundary,
339
- rootBoundary,
340
- strategy
341
- }));
342
- const rect = elementContext === 'floating' ? {
343
- x,
344
- y,
345
- width: rects.floating.width,
346
- height: rects.floating.height
347
- } : rects.reference;
348
- const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
349
- const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
350
- x: 1,
351
- y: 1
352
- } : {
353
- x: 1,
354
- y: 1
355
- };
356
- const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
357
- elements,
358
- rect,
359
- offsetParent,
360
- strategy
361
- }) : rect);
362
- return {
363
- top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
364
- bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
365
- left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
366
- right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
367
- };
368
- }
369
-
370
- /**
371
- * Provides data to position an inner element of the floating element so that it
372
- * appears centered to the reference element.
373
- * @see https://floating-ui.com/docs/arrow
374
- */
375
- const arrow$1 = options => ({
376
- name: 'arrow',
377
- options,
378
- async fn(state) {
379
- const {
380
- x,
381
- y,
382
- placement,
383
- rects,
384
- platform,
385
- elements,
386
- middlewareData
387
- } = state;
388
- // Since `element` is required, we don't Partial<> the type.
389
- const {
390
- element,
391
- padding = 0
392
- } = evaluate(options, state) || {};
393
- if (element == null) {
394
- return {};
395
- }
396
- const paddingObject = getPaddingObject(padding);
397
- const coords = {
398
- x,
399
- y
400
- };
401
- const axis = getAlignmentAxis(placement);
402
- const length = getAxisLength(axis);
403
- const arrowDimensions = await platform.getDimensions(element);
404
- const isYAxis = axis === 'y';
405
- const minProp = isYAxis ? 'top' : 'left';
406
- const maxProp = isYAxis ? 'bottom' : 'right';
407
- const clientProp = isYAxis ? 'clientHeight' : 'clientWidth';
408
- const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
409
- const startDiff = coords[axis] - rects.reference[axis];
410
- const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
411
- let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
412
-
413
- // DOM platform can return `window` as the `offsetParent`.
414
- if (!clientSize || !(await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent)))) {
415
- clientSize = elements.floating[clientProp] || rects.floating[length];
416
- }
417
- const centerToReference = endDiff / 2 - startDiff / 2;
418
-
419
- // If the padding is large enough that it causes the arrow to no longer be
420
- // centered, modify the padding so that it is centered.
421
- const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
422
- const minPadding = min(paddingObject[minProp], largestPossiblePadding);
423
- const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
424
-
425
- // Make sure the arrow doesn't overflow the floating element if the center
426
- // point is outside the floating element's bounds.
427
- const min$1 = minPadding;
428
- const max = clientSize - arrowDimensions[length] - maxPadding;
429
- const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
430
- const offset = clamp(min$1, center, max);
431
-
432
- // If the reference is small enough that the arrow's padding causes it to
433
- // to point to nothing for an aligned placement, adjust the offset of the
434
- // floating element itself. To ensure `shift()` continues to take action,
435
- // a single reset is performed when this is true.
436
- const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
437
- const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
438
- return {
439
- [axis]: coords[axis] + alignmentOffset,
440
- data: {
441
- [axis]: offset,
442
- centerOffset: center - offset - alignmentOffset,
443
- ...(shouldAddOffset && {
444
- alignmentOffset
445
- })
446
- },
447
- reset: shouldAddOffset
448
- };
449
- }
450
- });
451
-
452
- function getPlacementList(alignment, autoAlignment, allowedPlacements) {
453
- const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
454
- return allowedPlacementsSortedByAlignment.filter(placement => {
455
- if (alignment) {
456
- return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
457
- }
458
- return true;
459
- });
460
- }
461
- /**
462
- * Optimizes the visibility of the floating element by choosing the placement
463
- * that has the most space available automatically, without needing to specify a
464
- * preferred placement. Alternative to `flip`.
465
- * @see https://floating-ui.com/docs/autoPlacement
466
- */
467
- const autoPlacement = function (options) {
468
- if (options === void 0) {
469
- options = {};
470
- }
471
- return {
472
- name: 'autoPlacement',
473
- options,
474
- async fn(state) {
475
- var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
476
- const {
477
- rects,
478
- middlewareData,
479
- placement,
480
- platform,
481
- elements
482
- } = state;
483
- const {
484
- crossAxis = false,
485
- alignment,
486
- allowedPlacements = placements,
487
- autoAlignment = true,
488
- ...detectOverflowOptions
489
- } = evaluate(options, state);
490
- const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
491
- const overflow = await detectOverflow(state, detectOverflowOptions);
492
- const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
493
- const currentPlacement = placements$1[currentIndex];
494
- if (currentPlacement == null) {
495
- return {};
496
- }
497
- const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
498
-
499
- // Make `computeCoords` start from the right place.
500
- if (placement !== currentPlacement) {
501
- return {
502
- reset: {
503
- placement: placements$1[0]
504
- }
505
- };
506
- }
507
- const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
508
- const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
509
- placement: currentPlacement,
510
- overflows: currentOverflows
511
- }];
512
- const nextPlacement = placements$1[currentIndex + 1];
513
-
514
- // There are more placements to check.
515
- if (nextPlacement) {
516
- return {
517
- data: {
518
- index: currentIndex + 1,
519
- overflows: allOverflows
520
- },
521
- reset: {
522
- placement: nextPlacement
523
- }
524
- };
525
- }
526
- const placementsSortedByMostSpace = allOverflows.map(d => {
527
- const alignment = getAlignment(d.placement);
528
- return [d.placement, alignment && crossAxis ?
529
- // Check along the mainAxis and main crossAxis side.
530
- d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
531
- // Check only the mainAxis.
532
- d.overflows[0], d.overflows];
533
- }).sort((a, b) => a[1] - b[1]);
534
- const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
535
- // Aligned placements should not check their opposite crossAxis
536
- // side.
537
- getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
538
- const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
539
- if (resetPlacement !== placement) {
540
- return {
541
- data: {
542
- index: currentIndex + 1,
543
- overflows: allOverflows
544
- },
545
- reset: {
546
- placement: resetPlacement
547
- }
548
- };
549
- }
550
- return {};
551
- }
552
- };
553
- };
554
-
555
- /**
556
- * Optimizes the visibility of the floating element by flipping the `placement`
557
- * in order to keep it in view when the preferred placement(s) will overflow the
558
- * clipping boundary. Alternative to `autoPlacement`.
559
- * @see https://floating-ui.com/docs/flip
560
- */
561
- const flip$1 = function (options) {
562
- if (options === void 0) {
563
- options = {};
564
- }
565
- return {
566
- name: 'flip',
567
- options,
568
- async fn(state) {
569
- var _middlewareData$arrow, _middlewareData$flip;
570
- const {
571
- placement,
572
- middlewareData,
573
- rects,
574
- initialPlacement,
575
- platform,
576
- elements
577
- } = state;
578
- const {
579
- mainAxis: checkMainAxis = true,
580
- crossAxis: checkCrossAxis = true,
581
- fallbackPlacements: specifiedFallbackPlacements,
582
- fallbackStrategy = 'bestFit',
583
- fallbackAxisSideDirection = 'none',
584
- flipAlignment = true,
585
- ...detectOverflowOptions
586
- } = evaluate(options, state);
587
-
588
- // If a reset by the arrow was caused due to an alignment offset being
589
- // added, we should skip any logic now since `flip()` has already done its
590
- // work.
591
- // https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
592
- if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
593
- return {};
594
- }
595
- const side = getSide(placement);
596
- const initialSideAxis = getSideAxis(initialPlacement);
597
- const isBasePlacement = getSide(initialPlacement) === initialPlacement;
598
- const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
599
- const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
600
- const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
601
- if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
602
- fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
603
- }
604
- const placements = [initialPlacement, ...fallbackPlacements];
605
- const overflow = await detectOverflow(state, detectOverflowOptions);
606
- const overflows = [];
607
- let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
608
- if (checkMainAxis) {
609
- overflows.push(overflow[side]);
610
- }
611
- if (checkCrossAxis) {
612
- const sides = getAlignmentSides(placement, rects, rtl);
613
- overflows.push(overflow[sides[0]], overflow[sides[1]]);
614
- }
615
- overflowsData = [...overflowsData, {
616
- placement,
617
- overflows
618
- }];
619
-
620
- // One or more sides is overflowing.
621
- if (!overflows.every(side => side <= 0)) {
622
- var _middlewareData$flip2, _overflowsData$filter;
623
- const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
624
- const nextPlacement = placements[nextIndex];
625
- if (nextPlacement) {
626
- var _overflowsData$;
627
- const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
628
- const hasInitialMainAxisOverflow = ((_overflowsData$ = overflowsData[0]) == null ? void 0 : _overflowsData$.overflows[0]) > 0;
629
- if (!ignoreCrossAxisOverflow || hasInitialMainAxisOverflow) {
630
- // Try next placement and re-run the lifecycle.
631
- return {
632
- data: {
633
- index: nextIndex,
634
- overflows: overflowsData
635
- },
636
- reset: {
637
- placement: nextPlacement
638
- }
639
- };
640
- }
641
- }
642
-
643
- // First, find the candidates that fit on the mainAxis side of overflow,
644
- // then find the placement that fits the best on the main crossAxis side.
645
- 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;
646
-
647
- // Otherwise fallback.
648
- if (!resetPlacement) {
649
- switch (fallbackStrategy) {
650
- case 'bestFit':
651
- {
652
- var _overflowsData$filter2;
653
- const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
654
- if (hasFallbackAxisSideDirection) {
655
- const currentSideAxis = getSideAxis(d.placement);
656
- return currentSideAxis === initialSideAxis ||
657
- // Create a bias to the `y` side axis due to horizontal
658
- // reading directions favoring greater width.
659
- currentSideAxis === 'y';
660
- }
661
- return true;
662
- }).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];
663
- if (placement) {
664
- resetPlacement = placement;
665
- }
666
- break;
667
- }
668
- case 'initialPlacement':
669
- resetPlacement = initialPlacement;
670
- break;
671
- }
672
- }
673
- if (placement !== resetPlacement) {
674
- return {
675
- reset: {
676
- placement: resetPlacement
677
- }
678
- };
679
- }
680
- }
681
- return {};
682
- }
683
- };
684
- };
685
-
686
- function getSideOffsets(overflow, rect) {
687
- return {
688
- top: overflow.top - rect.height,
689
- right: overflow.right - rect.width,
690
- bottom: overflow.bottom - rect.height,
691
- left: overflow.left - rect.width
692
- };
693
- }
694
- function isAnySideFullyClipped(overflow) {
695
- return sides.some(side => overflow[side] >= 0);
696
- }
697
- /**
698
- * Provides data to hide the floating element in applicable situations, such as
699
- * when it is not in the same clipping context as the reference element.
700
- * @see https://floating-ui.com/docs/hide
701
- */
702
- const hide = function (options) {
703
- if (options === void 0) {
704
- options = {};
705
- }
706
- return {
707
- name: 'hide',
708
- options,
709
- async fn(state) {
710
- const {
711
- rects
712
- } = state;
713
- const {
714
- strategy = 'referenceHidden',
715
- ...detectOverflowOptions
716
- } = evaluate(options, state);
717
- switch (strategy) {
718
- case 'referenceHidden':
719
- {
720
- const overflow = await detectOverflow(state, {
721
- ...detectOverflowOptions,
722
- elementContext: 'reference'
723
- });
724
- const offsets = getSideOffsets(overflow, rects.reference);
725
- return {
726
- data: {
727
- referenceHiddenOffsets: offsets,
728
- referenceHidden: isAnySideFullyClipped(offsets)
729
- }
730
- };
731
- }
732
- case 'escaped':
733
- {
734
- const overflow = await detectOverflow(state, {
735
- ...detectOverflowOptions,
736
- altBoundary: true
737
- });
738
- const offsets = getSideOffsets(overflow, rects.floating);
739
- return {
740
- data: {
741
- escapedOffsets: offsets,
742
- escaped: isAnySideFullyClipped(offsets)
743
- }
744
- };
745
- }
746
- default:
747
- {
748
- return {};
749
- }
750
- }
751
- }
752
- };
753
- };
754
-
755
- function getBoundingRect(rects) {
756
- const minX = min(...rects.map(rect => rect.left));
757
- const minY = min(...rects.map(rect => rect.top));
758
- const maxX = max(...rects.map(rect => rect.right));
759
- const maxY = max(...rects.map(rect => rect.bottom));
760
- return {
761
- x: minX,
762
- y: minY,
763
- width: maxX - minX,
764
- height: maxY - minY
765
- };
766
- }
767
- function getRectsByLine(rects) {
768
- const sortedRects = rects.slice().sort((a, b) => a.y - b.y);
769
- const groups = [];
770
- let prevRect = null;
771
- for (let i = 0; i < sortedRects.length; i++) {
772
- const rect = sortedRects[i];
773
- if (!prevRect || rect.y - prevRect.y > prevRect.height / 2) {
774
- groups.push([rect]);
775
- } else {
776
- groups[groups.length - 1].push(rect);
777
- }
778
- prevRect = rect;
779
- }
780
- return groups.map(rect => rectToClientRect(getBoundingRect(rect)));
781
- }
782
- /**
783
- * Provides improved positioning for inline reference elements that can span
784
- * over multiple lines, such as hyperlinks or range selections.
785
- * @see https://floating-ui.com/docs/inline
786
- */
787
- const inline$1 = function (options) {
788
- if (options === void 0) {
789
- options = {};
790
- }
791
- return {
792
- name: 'inline',
793
- options,
794
- async fn(state) {
795
- const {
796
- placement,
797
- elements,
798
- rects,
799
- platform,
800
- strategy
801
- } = state;
802
- // A MouseEvent's client{X,Y} coords can be up to 2 pixels off a
803
- // ClientRect's bounds, despite the event listener being triggered. A
804
- // padding of 2 seems to handle this issue.
805
- const {
806
- padding = 2,
807
- x,
808
- y
809
- } = evaluate(options, state);
810
- const nativeClientRects = Array.from((await (platform.getClientRects == null ? void 0 : platform.getClientRects(elements.reference))) || []);
811
- const clientRects = getRectsByLine(nativeClientRects);
812
- const fallback = rectToClientRect(getBoundingRect(nativeClientRects));
813
- const paddingObject = getPaddingObject(padding);
814
- function getBoundingClientRect() {
815
- // There are two rects and they are disjoined.
816
- if (clientRects.length === 2 && clientRects[0].left > clientRects[1].right && x != null && y != null) {
817
- // Find the first rect in which the point is fully inside.
818
- return clientRects.find(rect => x > rect.left - paddingObject.left && x < rect.right + paddingObject.right && y > rect.top - paddingObject.top && y < rect.bottom + paddingObject.bottom) || fallback;
819
- }
820
-
821
- // There are 2 or more connected rects.
822
- if (clientRects.length >= 2) {
823
- if (getSideAxis(placement) === 'y') {
824
- const firstRect = clientRects[0];
825
- const lastRect = clientRects[clientRects.length - 1];
826
- const isTop = getSide(placement) === 'top';
827
- const top = firstRect.top;
828
- const bottom = lastRect.bottom;
829
- const left = isTop ? firstRect.left : lastRect.left;
830
- const right = isTop ? firstRect.right : lastRect.right;
831
- const width = right - left;
832
- const height = bottom - top;
833
- return {
834
- top,
835
- bottom,
836
- left,
837
- right,
838
- width,
839
- height,
840
- x: left,
841
- y: top
842
- };
843
- }
844
- const isLeftSide = getSide(placement) === 'left';
845
- const maxRight = max(...clientRects.map(rect => rect.right));
846
- const minLeft = min(...clientRects.map(rect => rect.left));
847
- const measureRects = clientRects.filter(rect => isLeftSide ? rect.left === minLeft : rect.right === maxRight);
848
- const top = measureRects[0].top;
849
- const bottom = measureRects[measureRects.length - 1].bottom;
850
- const left = minLeft;
851
- const right = maxRight;
852
- const width = right - left;
853
- const height = bottom - top;
854
- return {
855
- top,
856
- bottom,
857
- left,
858
- right,
859
- width,
860
- height,
861
- x: left,
862
- y: top
863
- };
864
- }
865
- return fallback;
866
- }
867
- const resetRects = await platform.getElementRects({
868
- reference: {
869
- getBoundingClientRect
870
- },
871
- floating: elements.floating,
872
- strategy
873
- });
874
- if (rects.reference.x !== resetRects.reference.x || rects.reference.y !== resetRects.reference.y || rects.reference.width !== resetRects.reference.width || rects.reference.height !== resetRects.reference.height) {
875
- return {
876
- reset: {
877
- rects: resetRects
878
- }
879
- };
880
- }
881
- return {};
882
- }
883
- };
884
- };
885
-
886
- // For type backwards-compatibility, the `OffsetOptions` type was also
887
- // Derivable.
888
-
889
- async function convertValueToCoords(state, options) {
890
- const {
891
- placement,
892
- platform,
893
- elements
894
- } = state;
895
- const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
896
- const side = getSide(placement);
897
- const alignment = getAlignment(placement);
898
- const isVertical = getSideAxis(placement) === 'y';
899
- const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
900
- const crossAxisMulti = rtl && isVertical ? -1 : 1;
901
- const rawValue = evaluate(options, state);
902
-
903
- // eslint-disable-next-line prefer-const
904
- let {
905
- mainAxis,
906
- crossAxis,
907
- alignmentAxis
908
- } = typeof rawValue === 'number' ? {
909
- mainAxis: rawValue,
910
- crossAxis: 0,
911
- alignmentAxis: null
912
- } : {
913
- mainAxis: rawValue.mainAxis || 0,
914
- crossAxis: rawValue.crossAxis || 0,
915
- alignmentAxis: rawValue.alignmentAxis
916
- };
917
- if (alignment && typeof alignmentAxis === 'number') {
918
- crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
919
- }
920
- return isVertical ? {
921
- x: crossAxis * crossAxisMulti,
922
- y: mainAxis * mainAxisMulti
923
- } : {
924
- x: mainAxis * mainAxisMulti,
925
- y: crossAxis * crossAxisMulti
926
- };
927
- }
928
-
929
- /**
930
- * Modifies the placement by translating the floating element along the
931
- * specified axes.
932
- * A number (shorthand for `mainAxis` or distance), or an axes configuration
933
- * object may be passed.
934
- * @see https://floating-ui.com/docs/offset
935
- */
936
- const offset$1 = function (options) {
937
- if (options === void 0) {
938
- options = 0;
939
- }
940
- return {
941
- name: 'offset',
942
- options,
943
- async fn(state) {
944
- var _middlewareData$offse, _middlewareData$arrow;
945
- const {
946
- x,
947
- y,
948
- placement,
949
- middlewareData
950
- } = state;
951
- const diffCoords = await convertValueToCoords(state, options);
952
-
953
- // If the placement is the same and the arrow caused an alignment offset
954
- // then we don't need to change the positioning coordinates.
955
- if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
956
- return {};
957
- }
958
- return {
959
- x: x + diffCoords.x,
960
- y: y + diffCoords.y,
961
- data: {
962
- ...diffCoords,
963
- placement
964
- }
965
- };
966
- }
967
- };
968
- };
969
-
970
- /**
971
- * Optimizes the visibility of the floating element by shifting it in order to
972
- * keep it in view when it will overflow the clipping boundary.
973
- * @see https://floating-ui.com/docs/shift
974
- */
975
- const shift$1 = function (options) {
976
- if (options === void 0) {
977
- options = {};
978
- }
979
- return {
980
- name: 'shift',
981
- options,
982
- async fn(state) {
983
- const {
984
- x,
985
- y,
986
- placement
987
- } = state;
988
- const {
989
- mainAxis: checkMainAxis = true,
990
- crossAxis: checkCrossAxis = false,
991
- limiter = {
992
- fn: _ref => {
993
- let {
994
- x,
995
- y
996
- } = _ref;
997
- return {
998
- x,
999
- y
1000
- };
1001
- }
1002
- },
1003
- ...detectOverflowOptions
1004
- } = evaluate(options, state);
1005
- const coords = {
1006
- x,
1007
- y
1008
- };
1009
- const overflow = await detectOverflow(state, detectOverflowOptions);
1010
- const crossAxis = getSideAxis(getSide(placement));
1011
- const mainAxis = getOppositeAxis(crossAxis);
1012
- let mainAxisCoord = coords[mainAxis];
1013
- let crossAxisCoord = coords[crossAxis];
1014
- if (checkMainAxis) {
1015
- const minSide = mainAxis === 'y' ? 'top' : 'left';
1016
- const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
1017
- const min = mainAxisCoord + overflow[minSide];
1018
- const max = mainAxisCoord - overflow[maxSide];
1019
- mainAxisCoord = clamp(min, mainAxisCoord, max);
1020
- }
1021
- if (checkCrossAxis) {
1022
- const minSide = crossAxis === 'y' ? 'top' : 'left';
1023
- const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
1024
- const min = crossAxisCoord + overflow[minSide];
1025
- const max = crossAxisCoord - overflow[maxSide];
1026
- crossAxisCoord = clamp(min, crossAxisCoord, max);
1027
- }
1028
- const limitedCoords = limiter.fn({
1029
- ...state,
1030
- [mainAxis]: mainAxisCoord,
1031
- [crossAxis]: crossAxisCoord
1032
- });
1033
- return {
1034
- ...limitedCoords,
1035
- data: {
1036
- x: limitedCoords.x - x,
1037
- y: limitedCoords.y - y,
1038
- enabled: {
1039
- [mainAxis]: checkMainAxis,
1040
- [crossAxis]: checkCrossAxis
1041
- }
1042
- }
1043
- };
1044
- }
1045
- };
1046
- };
1047
- /**
1048
- * Built-in `limiter` that will stop `shift()` at a certain point.
1049
- */
1050
- const limitShift$1 = function (options) {
1051
- if (options === void 0) {
1052
- options = {};
1053
- }
1054
- return {
1055
- options,
1056
- fn(state) {
1057
- const {
1058
- x,
1059
- y,
1060
- placement,
1061
- rects,
1062
- middlewareData
1063
- } = state;
1064
- const {
1065
- offset = 0,
1066
- mainAxis: checkMainAxis = true,
1067
- crossAxis: checkCrossAxis = true
1068
- } = evaluate(options, state);
1069
- const coords = {
1070
- x,
1071
- y
1072
- };
1073
- const crossAxis = getSideAxis(placement);
1074
- const mainAxis = getOppositeAxis(crossAxis);
1075
- let mainAxisCoord = coords[mainAxis];
1076
- let crossAxisCoord = coords[crossAxis];
1077
- const rawOffset = evaluate(offset, state);
1078
- const computedOffset = typeof rawOffset === 'number' ? {
1079
- mainAxis: rawOffset,
1080
- crossAxis: 0
1081
- } : {
1082
- mainAxis: 0,
1083
- crossAxis: 0,
1084
- ...rawOffset
1085
- };
1086
- if (checkMainAxis) {
1087
- const len = mainAxis === 'y' ? 'height' : 'width';
1088
- const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
1089
- const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
1090
- if (mainAxisCoord < limitMin) {
1091
- mainAxisCoord = limitMin;
1092
- } else if (mainAxisCoord > limitMax) {
1093
- mainAxisCoord = limitMax;
1094
- }
1095
- }
1096
- if (checkCrossAxis) {
1097
- var _middlewareData$offse, _middlewareData$offse2;
1098
- const len = mainAxis === 'y' ? 'width' : 'height';
1099
- const isOriginSide = ['top', 'left'].includes(getSide(placement));
1100
- const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
1101
- const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
1102
- if (crossAxisCoord < limitMin) {
1103
- crossAxisCoord = limitMin;
1104
- } else if (crossAxisCoord > limitMax) {
1105
- crossAxisCoord = limitMax;
1106
- }
1107
- }
1108
- return {
1109
- [mainAxis]: mainAxisCoord,
1110
- [crossAxis]: crossAxisCoord
1111
- };
1112
- }
1113
- };
1114
- };
1115
-
1116
- /**
1117
- * Provides data that allows you to change the size of the floating element —
1118
- * for instance, prevent it from overflowing the clipping boundary or match the
1119
- * width of the reference element.
1120
- * @see https://floating-ui.com/docs/size
1121
- */
1122
- const size$1 = function (options) {
1123
- if (options === void 0) {
1124
- options = {};
1125
- }
1126
- return {
1127
- name: 'size',
1128
- options,
1129
- async fn(state) {
1130
- var _state$middlewareData, _state$middlewareData2;
1131
- const {
1132
- placement,
1133
- rects,
1134
- platform,
1135
- elements
1136
- } = state;
1137
- const {
1138
- apply = () => {},
1139
- ...detectOverflowOptions
1140
- } = evaluate(options, state);
1141
- const overflow = await detectOverflow(state, detectOverflowOptions);
1142
- const side = getSide(placement);
1143
- const alignment = getAlignment(placement);
1144
- const isYAxis = getSideAxis(placement) === 'y';
1145
- const {
1146
- width,
1147
- height
1148
- } = rects.floating;
1149
- let heightSide;
1150
- let widthSide;
1151
- if (side === 'top' || side === 'bottom') {
1152
- heightSide = side;
1153
- widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
1154
- } else {
1155
- widthSide = side;
1156
- heightSide = alignment === 'end' ? 'top' : 'bottom';
1157
- }
1158
- const maximumClippingHeight = height - overflow.top - overflow.bottom;
1159
- const maximumClippingWidth = width - overflow.left - overflow.right;
1160
- const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
1161
- const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
1162
- const noShift = !state.middlewareData.shift;
1163
- let availableHeight = overflowAvailableHeight;
1164
- let availableWidth = overflowAvailableWidth;
1165
- if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
1166
- availableWidth = maximumClippingWidth;
1167
- }
1168
- if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
1169
- availableHeight = maximumClippingHeight;
1170
- }
1171
- if (noShift && !alignment) {
1172
- const xMin = max(overflow.left, 0);
1173
- const xMax = max(overflow.right, 0);
1174
- const yMin = max(overflow.top, 0);
1175
- const yMax = max(overflow.bottom, 0);
1176
- if (isYAxis) {
1177
- availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
1178
- } else {
1179
- availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
1180
- }
1181
- }
1182
- await apply({
1183
- ...state,
1184
- availableWidth,
1185
- availableHeight
1186
- });
1187
- const nextDimensions = await platform.getDimensions(elements.floating);
1188
- if (width !== nextDimensions.width || height !== nextDimensions.height) {
1189
- return {
1190
- reset: {
1191
- rects: true
1192
- }
1193
- };
1194
- }
1195
- return {};
1196
- }
1197
- };
1198
- };
1199
-
1200
- function hasWindow() {
1201
- return typeof window !== 'undefined';
1202
- }
1203
- function getNodeName(node) {
1204
- if (isNode(node)) {
1205
- return (node.nodeName || '').toLowerCase();
1206
- }
1207
- // Mocked nodes in testing environments may not be instances of Node. By
1208
- // returning `#document` an infinite loop won't occur.
1209
- // https://github.com/floating-ui/floating-ui/issues/2317
1210
- return '#document';
1211
- }
1212
- function getWindow(node) {
1213
- var _node$ownerDocument;
1214
- return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
1215
- }
1216
- function getDocumentElement(node) {
1217
- var _ref;
1218
- return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
1219
- }
1220
- function isNode(value) {
1221
- if (!hasWindow()) {
1222
- return false;
1223
- }
1224
- return value instanceof Node || value instanceof getWindow(value).Node;
1225
- }
1226
- function isElement(value) {
1227
- if (!hasWindow()) {
1228
- return false;
1229
- }
1230
- return value instanceof Element || value instanceof getWindow(value).Element;
1231
- }
1232
- function isHTMLElement(value) {
1233
- if (!hasWindow()) {
1234
- return false;
1235
- }
1236
- return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
1237
- }
1238
- function isShadowRoot(value) {
1239
- if (!hasWindow() || typeof ShadowRoot === 'undefined') {
1240
- return false;
1241
- }
1242
- return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
1243
- }
1244
- function isOverflowElement(element) {
1245
- const {
1246
- overflow,
1247
- overflowX,
1248
- overflowY,
1249
- display
1250
- } = getComputedStyle$1(element);
1251
- return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
1252
- }
1253
- function isTableElement(element) {
1254
- return ['table', 'td', 'th'].includes(getNodeName(element));
1255
- }
1256
- function isTopLayer(element) {
1257
- return [':popover-open', ':modal'].some(selector => {
1258
- try {
1259
- return element.matches(selector);
1260
- } catch (e) {
1261
- return false;
1262
- }
1263
- });
1264
- }
1265
- function isContainingBlock(elementOrCss) {
1266
- const webkit = isWebKit();
1267
- const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
1268
-
1269
- // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
1270
- // https://drafts.csswg.org/css-transforms-2/#individual-transforms
1271
- return ['transform', 'translate', 'scale', 'rotate', 'perspective'].some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
1272
- }
1273
- function getContainingBlock(element) {
1274
- let currentNode = getParentNode(element);
1275
- while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
1276
- if (isContainingBlock(currentNode)) {
1277
- return currentNode;
1278
- } else if (isTopLayer(currentNode)) {
1279
- return null;
1280
- }
1281
- currentNode = getParentNode(currentNode);
1282
- }
1283
- return null;
1284
- }
1285
- function isWebKit() {
1286
- if (typeof CSS === 'undefined' || !CSS.supports) return false;
1287
- return CSS.supports('-webkit-backdrop-filter', 'none');
1288
- }
1289
- function isLastTraversableNode(node) {
1290
- return ['html', 'body', '#document'].includes(getNodeName(node));
1291
- }
1292
- function getComputedStyle$1(element) {
1293
- return getWindow(element).getComputedStyle(element);
1294
- }
1295
- function getNodeScroll(element) {
1296
- if (isElement(element)) {
1297
- return {
1298
- scrollLeft: element.scrollLeft,
1299
- scrollTop: element.scrollTop
1300
- };
1301
- }
1302
- return {
1303
- scrollLeft: element.scrollX,
1304
- scrollTop: element.scrollY
1305
- };
1306
- }
1307
- function getParentNode(node) {
1308
- if (getNodeName(node) === 'html') {
1309
- return node;
1310
- }
1311
- const result =
1312
- // Step into the shadow DOM of the parent of a slotted node.
1313
- node.assignedSlot ||
1314
- // DOM Element detected.
1315
- node.parentNode ||
1316
- // ShadowRoot detected.
1317
- isShadowRoot(node) && node.host ||
1318
- // Fallback.
1319
- getDocumentElement(node);
1320
- return isShadowRoot(result) ? result.host : result;
1321
- }
1322
- function getNearestOverflowAncestor(node) {
1323
- const parentNode = getParentNode(node);
1324
- if (isLastTraversableNode(parentNode)) {
1325
- return node.ownerDocument ? node.ownerDocument.body : node.body;
1326
- }
1327
- if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
1328
- return parentNode;
1329
- }
1330
- return getNearestOverflowAncestor(parentNode);
1331
- }
1332
- function getOverflowAncestors(node, list, traverseIframes) {
1333
- var _node$ownerDocument2;
1334
- if (list === void 0) {
1335
- list = [];
1336
- }
1337
- if (traverseIframes === void 0) {
1338
- traverseIframes = true;
1339
- }
1340
- const scrollableAncestor = getNearestOverflowAncestor(node);
1341
- const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
1342
- const win = getWindow(scrollableAncestor);
1343
- if (isBody) {
1344
- const frameElement = getFrameElement(win);
1345
- return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
1346
- }
1347
- return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
1348
- }
1349
- function getFrameElement(win) {
1350
- return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
1351
- }
1352
-
1353
- function getCssDimensions(element) {
1354
- const css = getComputedStyle$1(element);
1355
- // In testing environments, the `width` and `height` properties are empty
1356
- // strings for SVG elements, returning NaN. Fallback to `0` in this case.
1357
- let width = parseFloat(css.width) || 0;
1358
- let height = parseFloat(css.height) || 0;
1359
- const hasOffset = isHTMLElement(element);
1360
- const offsetWidth = hasOffset ? element.offsetWidth : width;
1361
- const offsetHeight = hasOffset ? element.offsetHeight : height;
1362
- const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
1363
- if (shouldFallback) {
1364
- width = offsetWidth;
1365
- height = offsetHeight;
1366
- }
1367
- return {
1368
- width,
1369
- height,
1370
- $: shouldFallback
1371
- };
1372
- }
1373
-
1374
- function unwrapElement(element) {
1375
- return !isElement(element) ? element.contextElement : element;
1376
- }
1377
-
1378
- function getScale(element) {
1379
- const domElement = unwrapElement(element);
1380
- if (!isHTMLElement(domElement)) {
1381
- return createCoords(1);
1382
- }
1383
- const rect = domElement.getBoundingClientRect();
1384
- const {
1385
- width,
1386
- height,
1387
- $
1388
- } = getCssDimensions(domElement);
1389
- let x = ($ ? round(rect.width) : rect.width) / width;
1390
- let y = ($ ? round(rect.height) : rect.height) / height;
1391
-
1392
- // 0, NaN, or Infinity should always fallback to 1.
1393
-
1394
- if (!x || !Number.isFinite(x)) {
1395
- x = 1;
1396
- }
1397
- if (!y || !Number.isFinite(y)) {
1398
- y = 1;
1399
- }
1400
- return {
1401
- x,
1402
- y
1403
- };
1404
- }
1405
-
1406
- const noOffsets = /*#__PURE__*/createCoords(0);
1407
- function getVisualOffsets(element) {
1408
- const win = getWindow(element);
1409
- if (!isWebKit() || !win.visualViewport) {
1410
- return noOffsets;
1411
- }
1412
- return {
1413
- x: win.visualViewport.offsetLeft,
1414
- y: win.visualViewport.offsetTop
1415
- };
1416
- }
1417
- function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
1418
- if (isFixed === void 0) {
1419
- isFixed = false;
1420
- }
1421
- if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
1422
- return false;
1423
- }
1424
- return isFixed;
1425
- }
1426
-
1427
- function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
1428
- if (includeScale === void 0) {
1429
- includeScale = false;
1430
- }
1431
- if (isFixedStrategy === void 0) {
1432
- isFixedStrategy = false;
1433
- }
1434
- const clientRect = element.getBoundingClientRect();
1435
- const domElement = unwrapElement(element);
1436
- let scale = createCoords(1);
1437
- if (includeScale) {
1438
- if (offsetParent) {
1439
- if (isElement(offsetParent)) {
1440
- scale = getScale(offsetParent);
1441
- }
1442
- } else {
1443
- scale = getScale(element);
1444
- }
1445
- }
1446
- const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
1447
- let x = (clientRect.left + visualOffsets.x) / scale.x;
1448
- let y = (clientRect.top + visualOffsets.y) / scale.y;
1449
- let width = clientRect.width / scale.x;
1450
- let height = clientRect.height / scale.y;
1451
- if (domElement) {
1452
- const win = getWindow(domElement);
1453
- const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
1454
- let currentWin = win;
1455
- let currentIFrame = getFrameElement(currentWin);
1456
- while (currentIFrame && offsetParent && offsetWin !== currentWin) {
1457
- const iframeScale = getScale(currentIFrame);
1458
- const iframeRect = currentIFrame.getBoundingClientRect();
1459
- const css = getComputedStyle$1(currentIFrame);
1460
- const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
1461
- const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
1462
- x *= iframeScale.x;
1463
- y *= iframeScale.y;
1464
- width *= iframeScale.x;
1465
- height *= iframeScale.y;
1466
- x += left;
1467
- y += top;
1468
- currentWin = getWindow(currentIFrame);
1469
- currentIFrame = getFrameElement(currentWin);
1470
- }
1471
- }
1472
- return rectToClientRect({
1473
- width,
1474
- height,
1475
- x,
1476
- y
1477
- });
1478
- }
1479
-
1480
- // If <html> has a CSS width greater than the viewport, then this will be
1481
- // incorrect for RTL.
1482
- function getWindowScrollBarX(element, rect) {
1483
- const leftScroll = getNodeScroll(element).scrollLeft;
1484
- if (!rect) {
1485
- return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
1486
- }
1487
- return rect.left + leftScroll;
1488
- }
1489
-
1490
- function getHTMLOffset(documentElement, scroll, ignoreScrollbarX) {
1491
- if (ignoreScrollbarX === void 0) {
1492
- ignoreScrollbarX = false;
1493
- }
1494
- const htmlRect = documentElement.getBoundingClientRect();
1495
- const x = htmlRect.left + scroll.scrollLeft - (ignoreScrollbarX ? 0 :
1496
- // RTL <body> scrollbar.
1497
- getWindowScrollBarX(documentElement, htmlRect));
1498
- const y = htmlRect.top + scroll.scrollTop;
1499
- return {
1500
- x,
1501
- y
1502
- };
1503
- }
1504
-
1505
- function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
1506
- let {
1507
- elements,
1508
- rect,
1509
- offsetParent,
1510
- strategy
1511
- } = _ref;
1512
- const isFixed = strategy === 'fixed';
1513
- const documentElement = getDocumentElement(offsetParent);
1514
- const topLayer = elements ? isTopLayer(elements.floating) : false;
1515
- if (offsetParent === documentElement || topLayer && isFixed) {
1516
- return rect;
1517
- }
1518
- let scroll = {
1519
- scrollLeft: 0,
1520
- scrollTop: 0
1521
- };
1522
- let scale = createCoords(1);
1523
- const offsets = createCoords(0);
1524
- const isOffsetParentAnElement = isHTMLElement(offsetParent);
1525
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
1526
- if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
1527
- scroll = getNodeScroll(offsetParent);
1528
- }
1529
- if (isHTMLElement(offsetParent)) {
1530
- const offsetRect = getBoundingClientRect(offsetParent);
1531
- scale = getScale(offsetParent);
1532
- offsets.x = offsetRect.x + offsetParent.clientLeft;
1533
- offsets.y = offsetRect.y + offsetParent.clientTop;
1534
- }
1535
- }
1536
- const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll, true) : createCoords(0);
1537
- return {
1538
- width: rect.width * scale.x,
1539
- height: rect.height * scale.y,
1540
- x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
1541
- y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
1542
- };
1543
- }
1544
-
1545
- function getClientRects(element) {
1546
- return Array.from(element.getClientRects());
1547
- }
1548
-
1549
- // Gets the entire size of the scrollable document area, even extending outside
1550
- // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
1551
- function getDocumentRect(element) {
1552
- const html = getDocumentElement(element);
1553
- const scroll = getNodeScroll(element);
1554
- const body = element.ownerDocument.body;
1555
- const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
1556
- const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
1557
- let x = -scroll.scrollLeft + getWindowScrollBarX(element);
1558
- const y = -scroll.scrollTop;
1559
- if (getComputedStyle$1(body).direction === 'rtl') {
1560
- x += max(html.clientWidth, body.clientWidth) - width;
1561
- }
1562
- return {
1563
- width,
1564
- height,
1565
- x,
1566
- y
1567
- };
1568
- }
1569
-
1570
- function getViewportRect(element, strategy) {
1571
- const win = getWindow(element);
1572
- const html = getDocumentElement(element);
1573
- const visualViewport = win.visualViewport;
1574
- let width = html.clientWidth;
1575
- let height = html.clientHeight;
1576
- let x = 0;
1577
- let y = 0;
1578
- if (visualViewport) {
1579
- width = visualViewport.width;
1580
- height = visualViewport.height;
1581
- const visualViewportBased = isWebKit();
1582
- if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
1583
- x = visualViewport.offsetLeft;
1584
- y = visualViewport.offsetTop;
1585
- }
1586
- }
1587
- return {
1588
- width,
1589
- height,
1590
- x,
1591
- y
1592
- };
1593
- }
1594
-
1595
- // Returns the inner client rect, subtracting scrollbars if present.
1596
- function getInnerBoundingClientRect(element, strategy) {
1597
- const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
1598
- const top = clientRect.top + element.clientTop;
1599
- const left = clientRect.left + element.clientLeft;
1600
- const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
1601
- const width = element.clientWidth * scale.x;
1602
- const height = element.clientHeight * scale.y;
1603
- const x = left * scale.x;
1604
- const y = top * scale.y;
1605
- return {
1606
- width,
1607
- height,
1608
- x,
1609
- y
1610
- };
1611
- }
1612
- function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
1613
- let rect;
1614
- if (clippingAncestor === 'viewport') {
1615
- rect = getViewportRect(element, strategy);
1616
- } else if (clippingAncestor === 'document') {
1617
- rect = getDocumentRect(getDocumentElement(element));
1618
- } else if (isElement(clippingAncestor)) {
1619
- rect = getInnerBoundingClientRect(clippingAncestor, strategy);
1620
- } else {
1621
- const visualOffsets = getVisualOffsets(element);
1622
- rect = {
1623
- x: clippingAncestor.x - visualOffsets.x,
1624
- y: clippingAncestor.y - visualOffsets.y,
1625
- width: clippingAncestor.width,
1626
- height: clippingAncestor.height
1627
- };
1628
- }
1629
- return rectToClientRect(rect);
1630
- }
1631
- function hasFixedPositionAncestor(element, stopNode) {
1632
- const parentNode = getParentNode(element);
1633
- if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
1634
- return false;
1635
- }
1636
- return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
1637
- }
1638
-
1639
- // A "clipping ancestor" is an `overflow` element with the characteristic of
1640
- // clipping (or hiding) child elements. This returns all clipping ancestors
1641
- // of the given element up the tree.
1642
- function getClippingElementAncestors(element, cache) {
1643
- const cachedResult = cache.get(element);
1644
- if (cachedResult) {
1645
- return cachedResult;
1646
- }
1647
- let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
1648
- let currentContainingBlockComputedStyle = null;
1649
- const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
1650
- let currentNode = elementIsFixed ? getParentNode(element) : element;
1651
-
1652
- // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
1653
- while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
1654
- const computedStyle = getComputedStyle$1(currentNode);
1655
- const currentNodeIsContaining = isContainingBlock(currentNode);
1656
- if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
1657
- currentContainingBlockComputedStyle = null;
1658
- }
1659
- const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
1660
- if (shouldDropCurrentNode) {
1661
- // Drop non-containing blocks.
1662
- result = result.filter(ancestor => ancestor !== currentNode);
1663
- } else {
1664
- // Record last containing block for next iteration.
1665
- currentContainingBlockComputedStyle = computedStyle;
1666
- }
1667
- currentNode = getParentNode(currentNode);
1668
- }
1669
- cache.set(element, result);
1670
- return result;
1671
- }
1672
-
1673
- // Gets the maximum area that the element is visible in due to any number of
1674
- // clipping ancestors.
1675
- function getClippingRect(_ref) {
1676
- let {
1677
- element,
1678
- boundary,
1679
- rootBoundary,
1680
- strategy
1681
- } = _ref;
1682
- const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
1683
- const clippingAncestors = [...elementClippingAncestors, rootBoundary];
1684
- const firstClippingAncestor = clippingAncestors[0];
1685
- const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
1686
- const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
1687
- accRect.top = max(rect.top, accRect.top);
1688
- accRect.right = min(rect.right, accRect.right);
1689
- accRect.bottom = min(rect.bottom, accRect.bottom);
1690
- accRect.left = max(rect.left, accRect.left);
1691
- return accRect;
1692
- }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
1693
- return {
1694
- width: clippingRect.right - clippingRect.left,
1695
- height: clippingRect.bottom - clippingRect.top,
1696
- x: clippingRect.left,
1697
- y: clippingRect.top
1698
- };
1699
- }
1700
-
1701
- function getDimensions(element) {
1702
- const {
1703
- width,
1704
- height
1705
- } = getCssDimensions(element);
1706
- return {
1707
- width,
1708
- height
1709
- };
1710
- }
1711
-
1712
- function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
1713
- const isOffsetParentAnElement = isHTMLElement(offsetParent);
1714
- const documentElement = getDocumentElement(offsetParent);
1715
- const isFixed = strategy === 'fixed';
1716
- const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
1717
- let scroll = {
1718
- scrollLeft: 0,
1719
- scrollTop: 0
1720
- };
1721
- const offsets = createCoords(0);
1722
-
1723
- // If the <body> scrollbar appears on the left (e.g. RTL systems). Use
1724
- // Firefox with layout.scrollbar.side = 3 in about:config to test this.
1725
- function setLeftRTLScrollbarOffset() {
1726
- offsets.x = getWindowScrollBarX(documentElement);
1727
- }
1728
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
1729
- if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
1730
- scroll = getNodeScroll(offsetParent);
1731
- }
1732
- if (isOffsetParentAnElement) {
1733
- const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
1734
- offsets.x = offsetRect.x + offsetParent.clientLeft;
1735
- offsets.y = offsetRect.y + offsetParent.clientTop;
1736
- } else if (documentElement) {
1737
- setLeftRTLScrollbarOffset();
1738
- }
1739
- }
1740
- if (isFixed && !isOffsetParentAnElement && documentElement) {
1741
- setLeftRTLScrollbarOffset();
1742
- }
1743
- const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
1744
- const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
1745
- const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
1746
- return {
1747
- x,
1748
- y,
1749
- width: rect.width,
1750
- height: rect.height
1751
- };
1752
- }
1753
-
1754
- function isStaticPositioned(element) {
1755
- return getComputedStyle$1(element).position === 'static';
1756
- }
1757
-
1758
- function getTrueOffsetParent(element, polyfill) {
1759
- if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
1760
- return null;
1761
- }
1762
- if (polyfill) {
1763
- return polyfill(element);
1764
- }
1765
- let rawOffsetParent = element.offsetParent;
1766
-
1767
- // Firefox returns the <html> element as the offsetParent if it's non-static,
1768
- // while Chrome and Safari return the <body> element. The <body> element must
1769
- // be used to perform the correct calculations even if the <html> element is
1770
- // non-static.
1771
- if (getDocumentElement(element) === rawOffsetParent) {
1772
- rawOffsetParent = rawOffsetParent.ownerDocument.body;
1773
- }
1774
- return rawOffsetParent;
1775
- }
1776
-
1777
- // Gets the closest ancestor positioned element. Handles some edge cases,
1778
- // such as table ancestors and cross browser bugs.
1779
- function getOffsetParent(element, polyfill) {
1780
- const win = getWindow(element);
1781
- if (isTopLayer(element)) {
1782
- return win;
1783
- }
1784
- if (!isHTMLElement(element)) {
1785
- let svgOffsetParent = getParentNode(element);
1786
- while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
1787
- if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
1788
- return svgOffsetParent;
1789
- }
1790
- svgOffsetParent = getParentNode(svgOffsetParent);
1791
- }
1792
- return win;
1793
- }
1794
- let offsetParent = getTrueOffsetParent(element, polyfill);
1795
- while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
1796
- offsetParent = getTrueOffsetParent(offsetParent, polyfill);
1797
- }
1798
- if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
1799
- return win;
1800
- }
1801
- return offsetParent || getContainingBlock(element) || win;
1802
- }
1803
-
1804
- const getElementRects = async function (data) {
1805
- const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
1806
- const getDimensionsFn = this.getDimensions;
1807
- const floatingDimensions = await getDimensionsFn(data.floating);
1808
- return {
1809
- reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
1810
- floating: {
1811
- x: 0,
1812
- y: 0,
1813
- width: floatingDimensions.width,
1814
- height: floatingDimensions.height
1815
- }
1816
- };
1817
- };
1818
-
1819
- function isRTL(element) {
1820
- return getComputedStyle$1(element).direction === 'rtl';
1821
- }
1822
-
1823
- const platform = {
1824
- convertOffsetParentRelativeRectToViewportRelativeRect,
1825
- getDocumentElement,
1826
- getClippingRect,
1827
- getOffsetParent,
1828
- getElementRects,
1829
- getClientRects,
1830
- getDimensions,
1831
- getScale,
1832
- isElement,
1833
- isRTL
1834
- };
1835
-
1836
- function rectsAreEqual(a, b) {
1837
- return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
1838
- }
1839
-
1840
- // https://samthor.au/2021/observing-dom/
1841
- function observeMove(element, onMove) {
1842
- let io = null;
1843
- let timeoutId;
1844
- const root = getDocumentElement(element);
1845
- function cleanup() {
1846
- var _io;
1847
- clearTimeout(timeoutId);
1848
- (_io = io) == null || _io.disconnect();
1849
- io = null;
1850
- }
1851
- function refresh(skip, threshold) {
1852
- if (skip === void 0) {
1853
- skip = false;
1854
- }
1855
- if (threshold === void 0) {
1856
- threshold = 1;
1857
- }
1858
- cleanup();
1859
- const elementRectForRootMargin = element.getBoundingClientRect();
1860
- const {
1861
- left,
1862
- top,
1863
- width,
1864
- height
1865
- } = elementRectForRootMargin;
1866
- if (!skip) {
1867
- onMove();
1868
- }
1869
- if (!width || !height) {
1870
- return;
1871
- }
1872
- const insetTop = floor(top);
1873
- const insetRight = floor(root.clientWidth - (left + width));
1874
- const insetBottom = floor(root.clientHeight - (top + height));
1875
- const insetLeft = floor(left);
1876
- const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
1877
- const options = {
1878
- rootMargin,
1879
- threshold: max(0, min(1, threshold)) || 1
1880
- };
1881
- let isFirstUpdate = true;
1882
- function handleObserve(entries) {
1883
- const ratio = entries[0].intersectionRatio;
1884
- if (ratio !== threshold) {
1885
- if (!isFirstUpdate) {
1886
- return refresh();
1887
- }
1888
- if (!ratio) {
1889
- // If the reference is clipped, the ratio is 0. Throttle the refresh
1890
- // to prevent an infinite loop of updates.
1891
- timeoutId = setTimeout(() => {
1892
- refresh(false, 1e-7);
1893
- }, 1000);
1894
- } else {
1895
- refresh(false, ratio);
1896
- }
1897
- }
1898
- if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) {
1899
- // It's possible that even though the ratio is reported as 1, the
1900
- // element is not actually fully within the IntersectionObserver's root
1901
- // area anymore. This can happen under performance constraints. This may
1902
- // be a bug in the browser's IntersectionObserver implementation. To
1903
- // work around this, we compare the element's bounding rect now with
1904
- // what it was at the time we created the IntersectionObserver. If they
1905
- // are not equal then the element moved, so we refresh.
1906
- refresh();
1907
- }
1908
- isFirstUpdate = false;
1909
- }
1910
-
1911
- // Older browsers don't support a `document` as the root and will throw an
1912
- // error.
1913
- try {
1914
- io = new IntersectionObserver(handleObserve, {
1915
- ...options,
1916
- // Handle <iframe>s
1917
- root: root.ownerDocument
1918
- });
1919
- } catch (_e) {
1920
- io = new IntersectionObserver(handleObserve, options);
1921
- }
1922
- io.observe(element);
1923
- }
1924
- refresh(true);
1925
- return cleanup;
1926
- }
1927
-
1928
- /**
1929
- * Automatically updates the position of the floating element when necessary.
1930
- * Should only be called when the floating element is mounted on the DOM or
1931
- * visible on the screen.
1932
- * @returns cleanup function that should be invoked when the floating element is
1933
- * removed from the DOM or hidden from the screen.
1934
- * @see https://floating-ui.com/docs/autoUpdate
1935
- */
1936
- function autoUpdate(reference, floating, update, options) {
1937
- if (options === void 0) {
1938
- options = {};
1939
- }
1940
- const {
1941
- ancestorScroll = true,
1942
- ancestorResize = true,
1943
- elementResize = typeof ResizeObserver === 'function',
1944
- layoutShift = typeof IntersectionObserver === 'function',
1945
- animationFrame = false
1946
- } = options;
1947
- const referenceEl = unwrapElement(reference);
1948
- const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
1949
- ancestors.forEach(ancestor => {
1950
- ancestorScroll && ancestor.addEventListener('scroll', update, {
1951
- passive: true
1952
- });
1953
- ancestorResize && ancestor.addEventListener('resize', update);
1954
- });
1955
- const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
1956
- let reobserveFrame = -1;
1957
- let resizeObserver = null;
1958
- if (elementResize) {
1959
- resizeObserver = new ResizeObserver(_ref => {
1960
- let [firstEntry] = _ref;
1961
- if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
1962
- // Prevent update loops when using the `size` middleware.
1963
- // https://github.com/floating-ui/floating-ui/issues/1740
1964
- resizeObserver.unobserve(floating);
1965
- cancelAnimationFrame(reobserveFrame);
1966
- reobserveFrame = requestAnimationFrame(() => {
1967
- var _resizeObserver;
1968
- (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
1969
- });
1970
- }
1971
- update();
1972
- });
1973
- if (referenceEl && !animationFrame) {
1974
- resizeObserver.observe(referenceEl);
1975
- }
1976
- resizeObserver.observe(floating);
1977
- }
1978
- let frameId;
1979
- let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
1980
- if (animationFrame) {
1981
- frameLoop();
1982
- }
1983
- function frameLoop() {
1984
- const nextRefRect = getBoundingClientRect(reference);
1985
- if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) {
1986
- update();
1987
- }
1988
- prevRefRect = nextRefRect;
1989
- frameId = requestAnimationFrame(frameLoop);
1990
- }
1991
- update();
1992
- return () => {
1993
- var _resizeObserver2;
1994
- ancestors.forEach(ancestor => {
1995
- ancestorScroll && ancestor.removeEventListener('scroll', update);
1996
- ancestorResize && ancestor.removeEventListener('resize', update);
1997
- });
1998
- cleanupIo == null || cleanupIo();
1999
- (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
2000
- resizeObserver = null;
2001
- if (animationFrame) {
2002
- cancelAnimationFrame(frameId);
2003
- }
2004
- };
2005
- }
2006
-
2007
- /**
2008
- * Modifies the placement by translating the floating element along the
2009
- * specified axes.
2010
- * A number (shorthand for `mainAxis` or distance), or an axes configuration
2011
- * object may be passed.
2012
- * @see https://floating-ui.com/docs/offset
2013
- */
2014
- const offset = offset$1;
2015
-
2016
- /**
2017
- * Optimizes the visibility of the floating element by choosing the placement
2018
- * that has the most space available automatically, without needing to specify a
2019
- * preferred placement. Alternative to `flip`.
2020
- * @see https://floating-ui.com/docs/autoPlacement
2021
- */
2022
- autoPlacement;
2023
-
2024
- /**
2025
- * Optimizes the visibility of the floating element by shifting it in order to
2026
- * keep it in view when it will overflow the clipping boundary.
2027
- * @see https://floating-ui.com/docs/shift
2028
- */
2029
- const shift = shift$1;
2030
-
2031
- /**
2032
- * Optimizes the visibility of the floating element by flipping the `placement`
2033
- * in order to keep it in view when the preferred placement(s) will overflow the
2034
- * clipping boundary. Alternative to `autoPlacement`.
2035
- * @see https://floating-ui.com/docs/flip
2036
- */
2037
- const flip = flip$1;
2038
-
2039
- /**
2040
- * Provides data that allows you to change the size of the floating element —
2041
- * for instance, prevent it from overflowing the clipping boundary or match the
2042
- * width of the reference element.
2043
- * @see https://floating-ui.com/docs/size
2044
- */
2045
- const size = size$1;
2046
-
2047
- /**
2048
- * Provides data to hide the floating element in applicable situations, such as
2049
- * when it is not in the same clipping context as the reference element.
2050
- * @see https://floating-ui.com/docs/hide
2051
- */
2052
- hide;
2053
-
2054
- /**
2055
- * Provides data to position an inner element of the floating element so that it
2056
- * appears centered to the reference element.
2057
- * @see https://floating-ui.com/docs/arrow
2058
- */
2059
- const arrow = arrow$1;
2060
-
2061
- /**
2062
- * Provides improved positioning for inline reference elements that can span
2063
- * over multiple lines, such as hyperlinks or range selections.
2064
- * @see https://floating-ui.com/docs/inline
2065
- */
2066
- const inline = inline$1;
2067
-
2068
- /**
2069
- * Built-in `limiter` that will stop `shift()` at a certain point.
2070
- */
2071
- const limitShift = limitShift$1;
2072
-
2073
- /**
2074
- * Computes the `x` and `y` coordinates that will place the floating element
2075
- * next to a given reference element.
2076
- */
2077
- const computePosition = (reference, floating, options) => {
2078
- // This caches the expensive `getClippingElementAncestors` function so that
2079
- // multiple lifecycle resets re-use the same result. It only lives for a
2080
- // single call. If other functions become expensive, we can add them as well.
2081
- const cache = new Map();
2082
- const mergedOptions = {
2083
- platform,
2084
- ...options
2085
- };
2086
- const platformWithCache = {
2087
- ...mergedOptions.platform,
2088
- _c: cache
2089
- };
2090
- return computePosition$1(reference, floating, {
2091
- ...mergedOptions,
2092
- platform: platformWithCache
2093
- });
2094
- };
2095
-
2096
- // src/events.ts
2097
- var ToggleEvent = class extends Event {
2098
- oldState;
2099
- newState;
2100
- constructor(type, { oldState = "", newState = "", ...init } = {}) {
2101
- super(type, init);
2102
- this.oldState = String(oldState || "");
2103
- this.newState = String(newState || "");
2104
- }
2105
- };
2106
- var popoverToggleTaskQueue = /* @__PURE__ */ new WeakMap();
2107
- function queuePopoverToggleEventTask(element, oldState, newState) {
2108
- popoverToggleTaskQueue.set(
2109
- element,
2110
- setTimeout(() => {
2111
- if (!popoverToggleTaskQueue.has(element)) return;
2112
- element.dispatchEvent(
2113
- new ToggleEvent("toggle", {
2114
- cancelable: false,
2115
- oldState,
2116
- newState
2117
- })
2118
- );
2119
- }, 0)
2120
- );
2121
- }
2122
-
2123
- // src/popover-helpers.ts
2124
- var ShadowRoot$1 = globalThis.ShadowRoot || function() {
2125
- };
2126
- var HTMLDialogElement = globalThis.HTMLDialogElement || function() {
2127
- };
2128
- var topLayerElements = /* @__PURE__ */ new WeakMap();
2129
- var autoPopoverList = /* @__PURE__ */ new WeakMap();
2130
- var visibilityState = /* @__PURE__ */ new WeakMap();
2131
- function getPopoverVisibilityState(popover) {
2132
- return visibilityState.get(popover) || "hidden";
2133
- }
2134
- var popoverInvoker = /* @__PURE__ */ new WeakMap();
2135
- function popoverTargetAttributeActivationBehavior(element) {
2136
- const popover = element.popoverTargetElement;
2137
- if (!(popover instanceof HTMLElement)) {
2138
- return;
2139
- }
2140
- const visibility = getPopoverVisibilityState(popover);
2141
- if (element.popoverTargetAction === "show" && visibility === "showing") {
2142
- return;
2143
- }
2144
- if (element.popoverTargetAction === "hide" && visibility === "hidden") return;
2145
- if (visibility === "showing") {
2146
- hidePopover(popover, true, true);
2147
- } else if (checkPopoverValidity(popover, false)) {
2148
- popoverInvoker.set(popover, element);
2149
- showPopover(popover);
2150
- }
2151
- }
2152
- function checkPopoverValidity(element, expectedToBeShowing) {
2153
- if (element.popover !== "auto" && element.popover !== "manual") {
2154
- return false;
2155
- }
2156
- if (!element.isConnected) return false;
2157
- if (expectedToBeShowing && getPopoverVisibilityState(element) !== "showing") {
2158
- return false;
2159
- }
2160
- if (!expectedToBeShowing && getPopoverVisibilityState(element) !== "hidden") {
2161
- return false;
2162
- }
2163
- if (element instanceof HTMLDialogElement && element.hasAttribute("open")) {
2164
- return false;
2165
- }
2166
- if (document.fullscreenElement === element) return false;
2167
- return true;
2168
- }
2169
- function getStackPosition(popover) {
2170
- if (!popover) return 0;
2171
- return Array.from(autoPopoverList.get(popover.ownerDocument) || []).indexOf(
2172
- popover
2173
- ) + 1;
2174
- }
2175
- function topMostClickedPopover(target) {
2176
- const clickedPopover = nearestInclusiveOpenPopover(target);
2177
- const invokerPopover = nearestInclusiveTargetPopoverForInvoker(target);
2178
- if (getStackPosition(clickedPopover) > getStackPosition(invokerPopover)) {
2179
- return clickedPopover;
2180
- }
2181
- return invokerPopover;
2182
- }
2183
- function topMostAutoPopover(document2) {
2184
- const documentPopovers = autoPopoverList.get(document2);
2185
- for (const popover of documentPopovers || []) {
2186
- if (!popover.isConnected) {
2187
- documentPopovers.delete(popover);
2188
- } else {
2189
- return popover;
2190
- }
2191
- }
2192
- return null;
2193
- }
2194
- function getRootNode(node) {
2195
- if (typeof node.getRootNode === "function") {
2196
- return node.getRootNode();
2197
- }
2198
- if (node.parentNode) return getRootNode(node.parentNode);
2199
- return node;
2200
- }
2201
- function nearestInclusiveOpenPopover(node) {
2202
- while (node) {
2203
- if (node instanceof HTMLElement && node.popover === "auto" && visibilityState.get(node) === "showing") {
2204
- return node;
2205
- }
2206
- node = node instanceof Element && node.assignedSlot || node.parentElement || getRootNode(node);
2207
- if (node instanceof ShadowRoot$1) node = node.host;
2208
- if (node instanceof Document) return;
2209
- }
2210
- }
2211
- function nearestInclusiveTargetPopoverForInvoker(node) {
2212
- while (node) {
2213
- const nodePopover = node.popoverTargetElement;
2214
- if (nodePopover instanceof HTMLElement) return nodePopover;
2215
- node = node.parentElement || getRootNode(node);
2216
- if (node instanceof ShadowRoot$1) node = node.host;
2217
- if (node instanceof Document) return;
2218
- }
2219
- }
2220
- function topMostPopoverAncestor(newPopover) {
2221
- const popoverPositions = /* @__PURE__ */ new Map();
2222
- let i = 0;
2223
- for (const popover of autoPopoverList.get(newPopover.ownerDocument) || []) {
2224
- popoverPositions.set(popover, i);
2225
- i += 1;
2226
- }
2227
- popoverPositions.set(newPopover, i);
2228
- i += 1;
2229
- let topMostPopoverAncestor2 = null;
2230
- function checkAncestor(candidate) {
2231
- const candidateAncestor = nearestInclusiveOpenPopover(candidate);
2232
- if (candidateAncestor === null) return null;
2233
- const candidatePosition = popoverPositions.get(candidateAncestor);
2234
- if (topMostPopoverAncestor2 === null || popoverPositions.get(topMostPopoverAncestor2) < candidatePosition) {
2235
- topMostPopoverAncestor2 = candidateAncestor;
2236
- }
2237
- }
2238
- checkAncestor(newPopover.parentElement || getRootNode(newPopover));
2239
- return topMostPopoverAncestor2;
2240
- }
2241
- function isFocusable(focusTarget) {
2242
- if (focusTarget.hidden || focusTarget instanceof ShadowRoot$1) return false;
2243
- if (focusTarget instanceof HTMLButtonElement || focusTarget instanceof HTMLInputElement || focusTarget instanceof HTMLSelectElement || focusTarget instanceof HTMLTextAreaElement || focusTarget instanceof HTMLOptGroupElement || focusTarget instanceof HTMLOptionElement || focusTarget instanceof HTMLFieldSetElement) {
2244
- if (focusTarget.disabled) return false;
2245
- }
2246
- if (focusTarget instanceof HTMLInputElement && focusTarget.type === "hidden") {
2247
- return false;
2248
- }
2249
- if (focusTarget instanceof HTMLAnchorElement && focusTarget.href === "") {
2250
- return false;
2251
- }
2252
- return typeof focusTarget.tabIndex === "number" && focusTarget.tabIndex !== -1;
2253
- }
2254
- function focusDelegate(focusTarget) {
2255
- if (focusTarget.shadowRoot && focusTarget.shadowRoot.delegatesFocus !== true) {
2256
- return null;
2257
- }
2258
- let whereToLook = focusTarget;
2259
- if (whereToLook.shadowRoot) {
2260
- whereToLook = whereToLook.shadowRoot;
2261
- }
2262
- let autoFocusDelegate = whereToLook.querySelector("[autofocus]");
2263
- if (autoFocusDelegate) {
2264
- return autoFocusDelegate;
2265
- } else {
2266
- const slots = whereToLook.querySelectorAll("slot");
2267
- for (const slot of slots) {
2268
- const assignedElements = slot.assignedElements({ flatten: true });
2269
- for (const el of assignedElements) {
2270
- if (el.hasAttribute("autofocus")) {
2271
- return el;
2272
- } else {
2273
- autoFocusDelegate = el.querySelector("[autofocus]");
2274
- if (autoFocusDelegate) {
2275
- return autoFocusDelegate;
2276
- }
2277
- }
2278
- }
2279
- }
2280
- }
2281
- const walker = focusTarget.ownerDocument.createTreeWalker(
2282
- whereToLook,
2283
- NodeFilter.SHOW_ELEMENT
2284
- );
2285
- let descendant = walker.currentNode;
2286
- while (descendant) {
2287
- if (isFocusable(descendant)) {
2288
- return descendant;
2289
- }
2290
- descendant = walker.nextNode();
2291
- }
2292
- }
2293
- function popoverFocusingSteps(subject) {
2294
- focusDelegate(subject)?.focus();
2295
- }
2296
- var previouslyFocusedElements = /* @__PURE__ */ new WeakMap();
2297
- function showPopover(element) {
2298
- if (!checkPopoverValidity(element, false)) {
2299
- return;
2300
- }
2301
- const document2 = element.ownerDocument;
2302
- if (!element.dispatchEvent(
2303
- new ToggleEvent("beforetoggle", {
2304
- cancelable: true,
2305
- oldState: "closed",
2306
- newState: "open"
2307
- })
2308
- )) {
2309
- return;
2310
- }
2311
- if (!checkPopoverValidity(element, false)) {
2312
- return;
2313
- }
2314
- let shouldRestoreFocus = false;
2315
- if (element.popover === "auto") {
2316
- const originalType = element.getAttribute("popover");
2317
- const ancestor = topMostPopoverAncestor(element) || document2;
2318
- hideAllPopoversUntil(ancestor, false, true);
2319
- if (originalType !== element.getAttribute("popover") || !checkPopoverValidity(element, false)) {
2320
- return;
2321
- }
2322
- }
2323
- if (!topMostAutoPopover(document2)) {
2324
- shouldRestoreFocus = true;
2325
- }
2326
- previouslyFocusedElements.delete(element);
2327
- const originallyFocusedElement = document2.activeElement;
2328
- element.classList.add(":popover-open");
2329
- visibilityState.set(element, "showing");
2330
- if (!topLayerElements.has(document2)) {
2331
- topLayerElements.set(document2, /* @__PURE__ */ new Set());
2332
- }
2333
- topLayerElements.get(document2).add(element);
2334
- popoverFocusingSteps(element);
2335
- if (element.popover === "auto") {
2336
- if (!autoPopoverList.has(document2)) {
2337
- autoPopoverList.set(document2, /* @__PURE__ */ new Set());
2338
- }
2339
- autoPopoverList.get(document2).add(element);
2340
- setInvokerAriaExpanded(popoverInvoker.get(element), true);
2341
- }
2342
- if (shouldRestoreFocus && originallyFocusedElement && element.popover === "auto") {
2343
- previouslyFocusedElements.set(element, originallyFocusedElement);
2344
- }
2345
- queuePopoverToggleEventTask(element, "closed", "open");
2346
- }
2347
- function hidePopover(element, focusPreviousElement = false, fireEvents = false) {
2348
- if (!checkPopoverValidity(element, true)) {
2349
- return;
2350
- }
2351
- const document2 = element.ownerDocument;
2352
- if (element.popover === "auto") {
2353
- hideAllPopoversUntil(element, focusPreviousElement, fireEvents);
2354
- if (!checkPopoverValidity(element, true)) {
2355
- return;
2356
- }
2357
- }
2358
- setInvokerAriaExpanded(popoverInvoker.get(element), false);
2359
- popoverInvoker.delete(element);
2360
- if (fireEvents) {
2361
- element.dispatchEvent(
2362
- new ToggleEvent("beforetoggle", {
2363
- oldState: "open",
2364
- newState: "closed"
2365
- })
2366
- );
2367
- if (!checkPopoverValidity(element, true)) {
2368
- return;
2369
- }
2370
- }
2371
- topLayerElements.get(document2)?.delete(element);
2372
- autoPopoverList.get(document2)?.delete(element);
2373
- element.classList.remove(":popover-open");
2374
- visibilityState.set(element, "hidden");
2375
- if (fireEvents) {
2376
- queuePopoverToggleEventTask(element, "open", "closed");
2377
- }
2378
- const previouslyFocusedElement = previouslyFocusedElements.get(element);
2379
- if (previouslyFocusedElement) {
2380
- previouslyFocusedElements.delete(element);
2381
- if (focusPreviousElement) {
2382
- previouslyFocusedElement.focus();
2383
- }
2384
- }
2385
- }
2386
- function closeAllOpenPopovers(document2, focusPreviousElement = false, fireEvents = false) {
2387
- let popover = topMostAutoPopover(document2);
2388
- while (popover) {
2389
- hidePopover(popover, focusPreviousElement, fireEvents);
2390
- popover = topMostAutoPopover(document2);
2391
- }
2392
- }
2393
- function hideAllPopoversUntil(endpoint, focusPreviousElement, fireEvents) {
2394
- const document2 = endpoint.ownerDocument || endpoint;
2395
- if (endpoint instanceof Document) {
2396
- return closeAllOpenPopovers(document2, focusPreviousElement, fireEvents);
2397
- }
2398
- let lastToHide = null;
2399
- let foundEndpoint = false;
2400
- for (const popover of autoPopoverList.get(document2) || []) {
2401
- if (popover === endpoint) {
2402
- foundEndpoint = true;
2403
- } else if (foundEndpoint) {
2404
- lastToHide = popover;
2405
- break;
2406
- }
2407
- }
2408
- if (!foundEndpoint) {
2409
- return closeAllOpenPopovers(document2, focusPreviousElement, fireEvents);
2410
- }
2411
- while (lastToHide && getPopoverVisibilityState(lastToHide) === "showing" && autoPopoverList.get(document2)?.size) {
2412
- hidePopover(lastToHide, focusPreviousElement, fireEvents);
2413
- }
2414
- }
2415
- var popoverPointerDownTargets = /* @__PURE__ */ new WeakMap();
2416
- function lightDismissOpenPopovers(event) {
2417
- if (!event.isTrusted) return;
2418
- const target = event.composedPath()[0];
2419
- if (!target) return;
2420
- const document2 = target.ownerDocument;
2421
- const topMostPopover = topMostAutoPopover(document2);
2422
- if (!topMostPopover) return;
2423
- const ancestor = topMostClickedPopover(target);
2424
- if (ancestor && event.type === "pointerdown") {
2425
- popoverPointerDownTargets.set(document2, ancestor);
2426
- } else if (event.type === "pointerup") {
2427
- const sameTarget = popoverPointerDownTargets.get(document2) === ancestor;
2428
- popoverPointerDownTargets.delete(document2);
2429
- if (sameTarget) {
2430
- hideAllPopoversUntil(ancestor || document2, false, true);
2431
- }
2432
- }
2433
- }
2434
- var initialAriaExpandedValue = /* @__PURE__ */ new WeakMap();
2435
- function setInvokerAriaExpanded(el, force = false) {
2436
- if (!el) return;
2437
- if (!initialAriaExpandedValue.has(el)) {
2438
- initialAriaExpandedValue.set(el, el.getAttribute("aria-expanded"));
2439
- }
2440
- const popover = el.popoverTargetElement;
2441
- if (popover instanceof HTMLElement && popover.popover === "auto") {
2442
- el.setAttribute("aria-expanded", String(force));
2443
- } else {
2444
- const initialValue = initialAriaExpandedValue.get(el);
2445
- if (!initialValue) {
2446
- el.removeAttribute("aria-expanded");
2447
- } else {
2448
- el.setAttribute("aria-expanded", initialValue);
2449
- }
2450
- }
2451
- }
2452
-
2453
- // src/popover.ts
2454
- var ShadowRoot2 = globalThis.ShadowRoot || function() {
2455
- };
2456
- function isSupported() {
2457
- return typeof HTMLElement !== "undefined" && typeof HTMLElement.prototype === "object" && "popover" in HTMLElement.prototype;
2458
- }
2459
- function patchSelectorFn(object, name, mapper) {
2460
- const original = object[name];
2461
- Object.defineProperty(object, name, {
2462
- value(selector) {
2463
- return original.call(this, mapper(selector));
2464
- }
2465
- });
2466
- }
2467
- var nonEscapedPopoverSelector = /(^|[^\\]):popover-open\b/g;
2468
- function hasLayerSupport() {
2469
- return typeof globalThis.CSSLayerBlockRule === "function";
2470
- }
2471
- function getStyles() {
2472
- const useLayer = hasLayerSupport();
2473
- return `
2474
- ${useLayer ? "@layer popover-polyfill {" : ""}
2475
- :where([popover]) {
2476
- position: fixed;
2477
- z-index: 2147483647;
2478
- inset: 0;
2479
- padding: 0.25em;
2480
- width: fit-content;
2481
- height: fit-content;
2482
- border-width: initial;
2483
- border-color: initial;
2484
- border-image: initial;
2485
- border-style: solid;
2486
- background-color: canvas;
2487
- color: canvastext;
2488
- overflow: auto;
2489
- margin: auto;
2490
- }
2491
-
2492
- :where([popover]:not(.\\:popover-open)) {
2493
- display: none;
2494
- }
2495
-
2496
- :where(dialog[popover].\\:popover-open) {
2497
- display: block;
2498
- }
2499
-
2500
- :where(dialog[popover][open]) {
2501
- display: revert;
2502
- }
2503
-
2504
- :where([anchor].\\:popover-open) {
2505
- inset: auto;
2506
- }
2507
-
2508
- :where([anchor]:popover-open) {
2509
- inset: auto;
2510
- }
2511
-
2512
- @supports not (background-color: canvas) {
2513
- :where([popover]) {
2514
- background-color: white;
2515
- color: black;
2516
- }
2517
- }
2518
-
2519
- @supports (width: -moz-fit-content) {
2520
- :where([popover]) {
2521
- width: -moz-fit-content;
2522
- height: -moz-fit-content;
2523
- }
2524
- }
2525
-
2526
- @supports not (inset: 0) {
2527
- :where([popover]) {
2528
- top: 0;
2529
- left: 0;
2530
- right: 0;
2531
- bottom: 0;
2532
- }
2533
- }
2534
- ${useLayer ? "}" : ""}
2535
- `;
2536
- }
2537
- var popoverStyleSheet = null;
2538
- function injectStyles(root) {
2539
- const styles = getStyles();
2540
- if (popoverStyleSheet === null) {
2541
- try {
2542
- popoverStyleSheet = new CSSStyleSheet();
2543
- popoverStyleSheet.replaceSync(styles);
2544
- } catch {
2545
- popoverStyleSheet = false;
2546
- }
2547
- }
2548
- if (popoverStyleSheet === false) {
2549
- const sheet = document.createElement("style");
2550
- sheet.textContent = styles;
2551
- if (root instanceof Document) {
2552
- root.head.prepend(sheet);
2553
- } else {
2554
- root.prepend(sheet);
2555
- }
2556
- } else {
2557
- root.adoptedStyleSheets = [popoverStyleSheet, ...root.adoptedStyleSheets];
2558
- }
2559
- }
2560
- function apply() {
2561
- if (typeof window === "undefined") return;
2562
- window.ToggleEvent = window.ToggleEvent || ToggleEvent;
2563
- function rewriteSelector(selector) {
2564
- if (selector?.includes(":popover-open")) {
2565
- selector = selector.replace(
2566
- nonEscapedPopoverSelector,
2567
- "$1.\\:popover-open"
2568
- );
2569
- }
2570
- return selector;
2571
- }
2572
- patchSelectorFn(Document.prototype, "querySelector", rewriteSelector);
2573
- patchSelectorFn(Document.prototype, "querySelectorAll", rewriteSelector);
2574
- patchSelectorFn(Element.prototype, "querySelector", rewriteSelector);
2575
- patchSelectorFn(Element.prototype, "querySelectorAll", rewriteSelector);
2576
- patchSelectorFn(Element.prototype, "matches", rewriteSelector);
2577
- patchSelectorFn(Element.prototype, "closest", rewriteSelector);
2578
- patchSelectorFn(
2579
- DocumentFragment.prototype,
2580
- "querySelectorAll",
2581
- rewriteSelector
2582
- );
2583
- Object.defineProperties(HTMLElement.prototype, {
2584
- popover: {
2585
- enumerable: true,
2586
- configurable: true,
2587
- get() {
2588
- if (!this.hasAttribute("popover")) return null;
2589
- const value = (this.getAttribute("popover") || "").toLowerCase();
2590
- if (value === "" || value == "auto") return "auto";
2591
- return "manual";
2592
- },
2593
- set(value) {
2594
- if (value === null) {
2595
- this.removeAttribute("popover");
2596
- } else {
2597
- this.setAttribute("popover", value);
2598
- }
2599
- }
2600
- },
2601
- showPopover: {
2602
- enumerable: true,
2603
- configurable: true,
2604
- value() {
2605
- showPopover(this);
2606
- }
2607
- },
2608
- hidePopover: {
2609
- enumerable: true,
2610
- configurable: true,
2611
- value() {
2612
- hidePopover(this, true, true);
2613
- }
2614
- },
2615
- togglePopover: {
2616
- enumerable: true,
2617
- configurable: true,
2618
- value(force) {
2619
- if (visibilityState.get(this) === "showing" && force === void 0 || force === false) {
2620
- hidePopover(this, true, true);
2621
- } else if (force === void 0 || force === true) {
2622
- showPopover(this);
2623
- }
2624
- }
2625
- }
2626
- });
2627
- const originalAttachShadow = Element.prototype.attachShadow;
2628
- if (originalAttachShadow) {
2629
- Object.defineProperties(Element.prototype, {
2630
- attachShadow: {
2631
- enumerable: true,
2632
- configurable: true,
2633
- writable: true,
2634
- value(options) {
2635
- const shadowRoot = originalAttachShadow.call(this, options);
2636
- injectStyles(shadowRoot);
2637
- return shadowRoot;
2638
- }
2639
- }
2640
- });
2641
- }
2642
- const originalAttachInternals = HTMLElement.prototype.attachInternals;
2643
- if (originalAttachInternals) {
2644
- Object.defineProperties(HTMLElement.prototype, {
2645
- attachInternals: {
2646
- enumerable: true,
2647
- configurable: true,
2648
- writable: true,
2649
- value() {
2650
- const internals = originalAttachInternals.call(this);
2651
- if (internals.shadowRoot) {
2652
- injectStyles(internals.shadowRoot);
2653
- }
2654
- return internals;
2655
- }
2656
- }
2657
- });
2658
- }
2659
- const popoverTargetAssociatedElements = /* @__PURE__ */ new WeakMap();
2660
- function applyPopoverInvokerElementMixin(ElementClass) {
2661
- Object.defineProperties(ElementClass.prototype, {
2662
- popoverTargetElement: {
2663
- enumerable: true,
2664
- configurable: true,
2665
- set(targetElement) {
2666
- if (targetElement === null) {
2667
- this.removeAttribute("popovertarget");
2668
- popoverTargetAssociatedElements.delete(this);
2669
- } else if (!(targetElement instanceof Element)) {
2670
- throw new TypeError(
2671
- `popoverTargetElement must be an element or null`
2672
- );
2673
- } else {
2674
- this.setAttribute("popovertarget", "");
2675
- popoverTargetAssociatedElements.set(this, targetElement);
2676
- }
2677
- },
2678
- get() {
2679
- if (this.localName !== "button" && this.localName !== "input") {
2680
- return null;
2681
- }
2682
- if (this.localName === "input" && this.type !== "reset" && this.type !== "image" && this.type !== "button") {
2683
- return null;
2684
- }
2685
- if (this.disabled) {
2686
- return null;
2687
- }
2688
- if (this.form && this.type === "submit") {
2689
- return null;
2690
- }
2691
- const targetElement = popoverTargetAssociatedElements.get(this);
2692
- if (targetElement && targetElement.isConnected) {
2693
- return targetElement;
2694
- } else if (targetElement && !targetElement.isConnected) {
2695
- popoverTargetAssociatedElements.delete(this);
2696
- return null;
2697
- }
2698
- const root = getRootNode(this);
2699
- const idref = this.getAttribute("popovertarget");
2700
- if ((root instanceof Document || root instanceof ShadowRoot2) && idref) {
2701
- return root.getElementById(idref) || null;
2702
- }
2703
- return null;
2704
- }
2705
- },
2706
- popoverTargetAction: {
2707
- enumerable: true,
2708
- configurable: true,
2709
- get() {
2710
- const value = (this.getAttribute("popovertargetaction") || "").toLowerCase();
2711
- if (value === "show" || value === "hide") return value;
2712
- return "toggle";
2713
- },
2714
- set(value) {
2715
- this.setAttribute("popovertargetaction", value);
2716
- }
2717
- }
2718
- });
2719
- }
2720
- applyPopoverInvokerElementMixin(HTMLButtonElement);
2721
- applyPopoverInvokerElementMixin(HTMLInputElement);
2722
- const handleInvokerActivation = (event) => {
2723
- const composedPath = event.composedPath();
2724
- const target = composedPath[0];
2725
- if (!(target instanceof Element) || target?.shadowRoot) {
2726
- return;
2727
- }
2728
- const root = getRootNode(target);
2729
- if (!(root instanceof ShadowRoot2 || root instanceof Document)) {
2730
- return;
2731
- }
2732
- const invoker = composedPath.find(
2733
- (el) => el.matches?.("[popovertargetaction],[popovertarget]")
2734
- );
2735
- if (invoker) {
2736
- popoverTargetAttributeActivationBehavior(invoker);
2737
- event.preventDefault();
2738
- return;
2739
- }
2740
- };
2741
- const onKeydown = (event) => {
2742
- const key = event.key;
2743
- const target = event.target;
2744
- if (!event.defaultPrevented && target && (key === "Escape" || key === "Esc")) {
2745
- hideAllPopoversUntil(target.ownerDocument, true, true);
2746
- }
2747
- };
2748
- const addEventListeners = (root) => {
2749
- root.addEventListener("click", handleInvokerActivation);
2750
- root.addEventListener("keydown", onKeydown);
2751
- root.addEventListener("pointerdown", lightDismissOpenPopovers);
2752
- root.addEventListener("pointerup", lightDismissOpenPopovers);
2753
- };
2754
- addEventListeners(document);
2755
- injectStyles(document);
2756
- }
2757
-
2758
- const postPopovercontainerCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}@layer polyfill{@supports not selector(:popover-open){[popover]:not(.\\:popover-open){display:none}}}:where(post-popovercontainer){background-color:rgba(0,0,0,0);border:rgba(0,0,0,0);position:fixed;margin:0;padding:0;overflow:visible}:where(post-popovercontainer)>div{box-shadow:var(--post-device-elevation-300);width:max-content;max-width:100%;color:var(--post-current-palette-fg);background-color:var(--post-current-palette-bg);border:2px solid rgba(0,0,0,0);border-radius:4px}:where(post-popovercontainer)>div.animate-pop-in{animation:popIn .25s ease-out forwards}:where(post-popovercontainer)[tooltip]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}:where(post-popovercontainer)[safe-space]::after{content:\"\";position:fixed;inset:0;z-index:-1;pointer-events:auto}:where(post-popovercontainer)[safe-space=triangle]::after{clip-path:polygon(var(--post-safe-space-cursor-x, 0) var(--post-safe-space-cursor-y, 0), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)))}:where(post-popovercontainer)[safe-space=trapezoid]::after{clip-path:polygon(var(--post-safe-space-trigger-x-start, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-start, 0)), var(--post-safe-space-trigger-x-end, var(--post-safe-space-trigger-x, 0)) var(--post-safe-space-trigger-y, var(--post-safe-space-trigger-y-end, 0)), var(--post-safe-space-popover-x-end, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-end, 0)), var(--post-safe-space-popover-x-start, var(--post-safe-space-popover-x, 0)) var(--post-safe-space-popover-y, var(--post-safe-space-popover-y-start, 0)))}:where(post-popovercontainer):not(:has(.arrow))>div{box-shadow:var(--post-device-elevation-300)}:where(post-popovercontainer):has(.arrow)>div{filter:drop-shadow(1px 2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(2px 4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(4px 8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.top)>div{filter:drop-shadow(0px -2px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(0px -4px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(0px -8px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.left)>div{filter:drop-shadow(-2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(-4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(-8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer):has(.arrow.right)>div{filter:drop-shadow(2px 0px 3px hsla(216, 9%, 11%, 0.15)) drop-shadow(4px 0px 6px hsla(225, 17%, 9%, 0.15)) drop-shadow(8px 0px 12px hsla(225, 7%, 11%, 0.15))}:where(post-popovercontainer) .arrow{position:absolute;width:.5825rem;height:.5825rem;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1}:where(post-popovercontainer) .arrow.top{border-block-start:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.right{border-block-start:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.left{border-block-end:2px solid rgba(0,0,0,0);border-inline-start:2px solid rgba(0,0,0,0)}:where(post-popovercontainer) .arrow.bottom{border-block-end:2px solid rgba(0,0,0,0);border-inline-end:2px solid rgba(0,0,0,0)}";
2759
- const PostPopovercontainerStyle0 = postPopovercontainerCss;
2760
-
2761
- const PostPopovercontainer = /*@__PURE__*/ proxyCustomElement(class PostPopovercontainer extends HTMLElement$1 {
2762
- constructor() {
2763
- super();
2764
- this.__registerHost();
2765
- this.postToggle = createEvent(this, "postToggle", 7);
2766
- this.placement = 'top';
2767
- this.edgeGap = 8;
2768
- this.animation = null;
2769
- this.arrow = false;
2770
- this.manualClose = false;
2771
- this.safeSpace = undefined;
2772
- }
2773
- validatePlacement() {
2774
- checkEmptyOrOneOf(this, 'placement', PLACEMENT_TYPES);
2775
- }
2776
- validateEdgeGap() {
2777
- checkEmptyOrType(this, 'edgeGap', 'number');
2778
- }
2779
- validateSafeSpace() {
2780
- checkEmptyOrOneOf(this, 'safeSpace', ['triangle', 'trapezoid']);
2781
- }
2782
- /**
2783
- * Updates cursor position for safe space feature when popover is open.
2784
- * Sets CSS custom properties for dynamic styling of safe area.
2785
- * @param event MouseEvent with cursor position
2786
- */
2787
- mouseTrackingHandler(event) {
2788
- this.host.style.setProperty('--post-safe-space-cursor-x', `${event.clientX}px`);
2789
- this.host.style.setProperty('--post-safe-space-cursor-y', `${event.clientY}px`);
2790
- }
2791
- connectedCallback() {
2792
- if (IS_BROWSER && !isSupported()) {
2793
- apply();
2794
- }
2795
- }
2796
- componentDidLoad() {
2797
- this.host.addEventListener('beforetoggle', this.handleToggle.bind(this));
2798
- }
2799
- disconnectedCallback() {
2800
- if (typeof this.clearAutoUpdate === 'function') {
2801
- this.clearAutoUpdate();
2802
- }
2803
- }
2804
- /**
2805
- * Programmatically display the popovercontainer
2806
- * @param target An element with [data-popover-target="id"] where the popovercontainer should be shown
2807
- */
2808
- async show(target) {
2809
- if (!this.toggleTimeoutId) {
2810
- this.eventTarget = target;
2811
- this.calculatePosition();
2812
- this.host.showPopover();
2813
- }
2814
- }
2815
- /**
2816
- * Programmatically hide the popovercontainer
2817
- */
2818
- async hide() {
2819
- if (!this.toggleTimeoutId) {
2820
- this.eventTarget = null;
2821
- this.host.hidePopover();
2822
- }
2823
- }
2824
- /**
2825
- * Toggle popovercontainer display
2826
- * @param target An element with [data-popover-target="id"] where the popovercontainer should be shown
2827
- * @param force Pass true to always show or false to always hide
2828
- */
2829
- async toggle(target, force) {
2830
- // Prevent instant double toggle
2831
- if (!this.toggleTimeoutId) {
2832
- this.eventTarget = target;
2833
- this.calculatePosition();
2834
- this.host.togglePopover(force);
2835
- this.toggleTimeoutId = null;
2836
- }
2837
- return this.host.matches(':where(:popover-open, .popover-open)');
2838
- }
2839
- /**
2840
- * Start or stop auto updates based on popovercontainer events.
2841
- * Popovercontainers can be closed or opened with other methods than class members,
2842
- * therefore listening to the toggle event is safer for cleaning up.
2843
- * @param e ToggleEvent
2844
- */
2845
- handleToggle(e) {
2846
- this.toggleTimeoutId = window.setTimeout(() => (this.toggleTimeoutId = null), 10);
2847
- const isOpen = e.newState === 'open';
2848
- if (isOpen) {
2849
- this.startAutoupdates();
2850
- if (this.safeSpace)
2851
- window.addEventListener('mousemove', this.mouseTrackingHandler.bind(this));
2852
- }
2853
- else {
2854
- if (typeof this.clearAutoUpdate === 'function')
2855
- this.clearAutoUpdate();
2856
- if (this.safeSpace)
2857
- window.removeEventListener('mousemove', this.mouseTrackingHandler.bind(this));
2858
- }
2859
- this.postToggle.emit(isOpen);
2860
- }
2861
- /**
2862
- * Start listening for DOM updates, scroll events etc. that have
2863
- * an influence on popovercontainer positioning
2864
- */
2865
- startAutoupdates() {
2866
- this.clearAutoUpdate = autoUpdate(this.eventTarget, this.host, this.calculatePosition.bind(this));
2867
- }
2868
- /**
2869
- * Retrieves the dynamic height of the header
2870
- */
2871
- getHeaderHeight() {
2872
- const header = document.querySelector('post-header');
2873
- return header ? parseFloat(getComputedStyle(header).height) : 0;
2874
- }
2875
- async calculatePosition() {
2876
- const { x, y, middlewareData, placement } = await this.computeMainPosition();
2877
- const currentPlacement = placement.split('-')[0];
2878
- // Position popover
2879
- this.host.style.left = `${x}px`;
2880
- this.host.style.top = `${y}px`;
2881
- // Position arrow if enabled
2882
- if (this.arrow && middlewareData.arrow) {
2883
- const { x: arrowX, y: arrowY } = middlewareData.arrow;
2884
- const staticSide = PostPopovercontainer.STATIC_SIDES[currentPlacement];
2885
- if (staticSide) {
2886
- Object.assign(this.arrowRef.style, {
2887
- left: arrowX ? `${arrowX}px` : '',
2888
- top: arrowY ? `${arrowY}px` : '',
2889
- [staticSide]: '-7px',
2890
- });
2891
- }
2892
- }
2893
- // Handle safe space if enabled
2894
- if (this.safeSpace && this.eventTarget) {
2895
- await this.updateSafeSpaceBoundaries(currentPlacement);
2896
- }
2897
- }
2898
- async computeMainPosition() {
2899
- const gap = this.edgeGap;
2900
- const middleware = [
2901
- flip({
2902
- padding: this.getHeaderHeight(),
2903
- }),
2904
- inline(),
2905
- shift({
2906
- padding: gap,
2907
- limiter: limitShift({
2908
- offset: 32,
2909
- }),
2910
- }),
2911
- size({
2912
- apply({ availableWidth, elements }) {
2913
- Object.assign(elements.floating.style, {
2914
- maxWidth: `${availableWidth - gap * 2}px`,
2915
- });
2916
- },
2917
- }),
2918
- offset(this.arrow ? gap + 4 : gap),
2919
- ];
2920
- if (this.arrow) {
2921
- middleware.push(arrow({ element: this.arrowRef, padding: gap }));
2922
- }
2923
- return computePosition(this.eventTarget, this.host, {
2924
- placement: this.placement || 'top',
2925
- strategy: 'fixed',
2926
- middleware,
2927
- });
2928
- }
2929
- async updateSafeSpaceBoundaries(currentPlacement) {
2930
- const targetRect = this.eventTarget.getBoundingClientRect();
2931
- const popoverRect = this.host.getBoundingClientRect();
2932
- const isVertical = currentPlacement === 'top' || currentPlacement === 'bottom';
2933
- // Helper function to get positioning data based on placement
2934
- const getPositioningData = (placement, popoverRect, targetRect) => {
2935
- if (placement === 'top' || placement === 'bottom') {
2936
- return {
2937
- popover: {
2938
- y: placement === 'top' ? popoverRect.bottom : popoverRect.top,
2939
- xStart: popoverRect.left,
2940
- xEnd: popoverRect.right,
2941
- },
2942
- trigger: {
2943
- y: placement === 'top' ? targetRect.top : targetRect.bottom,
2944
- xStart: targetRect.left,
2945
- xEnd: targetRect.right,
2946
- },
2947
- };
2948
- }
2949
- else {
2950
- // left or right
2951
- return {
2952
- popover: {
2953
- x: placement === 'left' ? popoverRect.right : popoverRect.left,
2954
- yStart: popoverRect.top,
2955
- yEnd: popoverRect.bottom,
2956
- },
2957
- trigger: {
2958
- x: placement === 'left' ? targetRect.left : targetRect.right,
2959
- yStart: targetRect.top,
2960
- yEnd: targetRect.bottom,
2961
- },
2962
- };
2963
- }
2964
- };
2965
- const posData = getPositioningData(currentPlacement, popoverRect, targetRect);
2966
- // Clear previous values
2967
- PostPopovercontainer.PROPERTIES_TO_CLEAR.forEach(prop => {
2968
- this.host.style.removeProperty(prop);
2969
- });
2970
- if (isVertical) {
2971
- // For top/bottom placement
2972
- this.host.style.setProperty('--post-safe-space-popover-y', `${posData.popover.y}px`);
2973
- this.host.style.setProperty('--post-safe-space-popover-x-start', `${posData.popover.xStart}px`);
2974
- this.host.style.setProperty('--post-safe-space-popover-x-end', `${posData.popover.xEnd}px`);
2975
- this.host.style.setProperty('--post-safe-space-trigger-y', `${posData.trigger.y}px`);
2976
- this.host.style.setProperty('--post-safe-space-trigger-x-start', `${posData.trigger.xStart}px`);
2977
- this.host.style.setProperty('--post-safe-space-trigger-x-end', `${posData.trigger.xEnd}px`);
2978
- }
2979
- else {
2980
- // For left/right placement
2981
- this.host.style.setProperty('--post-safe-space-popover-x', `${posData.popover.x}px`);
2982
- this.host.style.setProperty('--post-safe-space-popover-y-start', `${posData.popover.yStart}px`);
2983
- this.host.style.setProperty('--post-safe-space-popover-y-end', `${posData.popover.yEnd}px`);
2984
- this.host.style.setProperty('--post-safe-space-trigger-x', `${posData.trigger.x}px`);
2985
- this.host.style.setProperty('--post-safe-space-trigger-y-start', `${posData.trigger.yStart}px`);
2986
- this.host.style.setProperty('--post-safe-space-trigger-y-end', `${posData.trigger.yEnd}px`);
2987
- }
2988
- }
2989
- render() {
2990
- const animationClass = this.animation ? `animate-${this.animation}` : '';
2991
- return (h(Host, { key: '7b5c3ad89739db0387473db9228014ca9596b8a3', "data-version": version, popover: this.manualClose ? 'manual' : 'auto' }, h("div", { key: '0db14a34b3bb8e248bb0adead08afc9b7007edf6', class: animationClass }, this.arrow && (h("span", { key: 'e7061112aebb882194b79e82535074f34ddbbfd1', class: "arrow", ref: el => {
2992
- this.arrowRef = el;
2993
- } })), h("slot", { key: 'efc25097a97f87a9eb742379d8a70b0fc2c78682' }))));
2994
- }
2995
- get host() { return this; }
2996
- static get watchers() { return {
2997
- "placement": ["validatePlacement"],
2998
- "edgeGap": ["validateEdgeGap"],
2999
- "safeSpace": ["validateSafeSpace"]
3000
- }; }
3001
- static get style() { return PostPopovercontainerStyle0; }
3002
- }, [4, "post-popovercontainer", {
3003
- "placement": [1],
3004
- "edgeGap": [2, "edge-gap"],
3005
- "animation": [1],
3006
- "arrow": [4],
3007
- "manualClose": [4, "manual-close"],
3008
- "safeSpace": [513, "safe-space"],
3009
- "show": [64],
3010
- "hide": [64],
3011
- "toggle": [64]
3012
- }, undefined, {
3013
- "placement": ["validatePlacement"],
3014
- "edgeGap": ["validateEdgeGap"],
3015
- "safeSpace": ["validateSafeSpace"]
3016
- }]);
3017
- PostPopovercontainer.STATIC_SIDES = {
3018
- top: 'bottom',
3019
- right: 'left',
3020
- bottom: 'top',
3021
- left: 'right',
3022
- };
3023
- PostPopovercontainer.PROPERTIES_TO_CLEAR = [
3024
- '--post-safe-space-popover-x',
3025
- '--post-safe-space-popover-y',
3026
- '--post-safe-space-popover-x-start',
3027
- '--post-safe-space-popover-x-end',
3028
- '--post-safe-space-popover-y-start',
3029
- '--post-safe-space-popover-y-end',
3030
- '--post-safe-space-trigger-x',
3031
- '--post-safe-space-trigger-y',
3032
- '--post-safe-space-trigger-x-start',
3033
- '--post-safe-space-trigger-x-end',
3034
- '--post-safe-space-trigger-y-start',
3035
- '--post-safe-space-trigger-y-end',
3036
- ];
3037
- function defineCustomElement() {
3038
- if (typeof customElements === "undefined") {
3039
- return;
3040
- }
3041
- const components = ["post-popovercontainer"];
3042
- components.forEach(tagName => { switch (tagName) {
3043
- case "post-popovercontainer":
3044
- if (!customElements.get(tagName)) {
3045
- customElements.define(tagName, PostPopovercontainer);
3046
- }
3047
- break;
3048
- } });
3049
- }
3050
-
3051
- export { PLACEMENT_TYPES as P, PostPopovercontainer as a, defineCustomElement as d };