@arc-ui/components 12.0.0-beta.6 → 12.0.0-beta7

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 (293) hide show
  1. package/dist/Alert/Alert.cjs.js +3 -3
  2. package/dist/Alert/Alert.esm.js +3 -3
  3. package/dist/Alert/styles.css +1 -1
  4. package/dist/Avatar/Avatar.cjs.js +4 -4
  5. package/dist/Avatar/Avatar.esm.js +4 -4
  6. package/dist/AvatarGroup/AvatarGroup.cjs.js +4 -4
  7. package/dist/AvatarGroup/AvatarGroup.esm.js +4 -4
  8. package/dist/Badge/Badge.cjs.js +5 -12
  9. package/dist/Badge/Badge.esm.js +4 -11
  10. package/dist/Box/Box.cjs.js +6 -24
  11. package/dist/Box/Box.esm.js +5 -23
  12. package/dist/Box/styles.css +1 -1
  13. package/dist/BrandLogo/BrandLogo.cjs.js +2 -2
  14. package/dist/BrandLogo/BrandLogo.esm.js +2 -2
  15. package/dist/Breadcrumbs/Breadcrumbs.cjs.js +3 -3
  16. package/dist/Breadcrumbs/Breadcrumbs.esm.js +3 -3
  17. package/dist/Button/Button.cjs.js +4 -4
  18. package/dist/Button/Button.esm.js +4 -4
  19. package/dist/Button/styles.css +1 -1
  20. package/dist/ButtonV2/ButtonV2.cjs.js +4 -4
  21. package/dist/ButtonV2/ButtonV2.esm.js +4 -4
  22. package/dist/ButtonV2/styles.css +1 -1
  23. package/dist/Calendar/Calendar.cjs.js +6 -6
  24. package/dist/Calendar/Calendar.esm.js +6 -6
  25. package/dist/Calendar/styles.css +1 -1
  26. package/dist/CardFooter/CardFooter.cjs.js +3 -3
  27. package/dist/CardFooter/CardFooter.esm.js +3 -3
  28. package/dist/CardFooter/styles.css +1 -1
  29. package/dist/CardHeading/CardHeading.cjs.js +3 -3
  30. package/dist/CardHeading/CardHeading.esm.js +3 -3
  31. package/dist/Carousel/Carousel.cjs.js +457 -0
  32. package/dist/Carousel/Carousel.esm.js +431 -0
  33. package/dist/Carousel/package.json +7 -0
  34. package/dist/Carousel/styles.css +1 -0
  35. package/dist/Checkbox/Checkbox.cjs.js +6 -6
  36. package/dist/Checkbox/Checkbox.esm.js +6 -6
  37. package/dist/Checkbox/styles.css +1 -1
  38. package/dist/ContentSwitcher/ContentSwitcher.cjs.js +20 -0
  39. package/dist/ContentSwitcher/ContentSwitcher.esm.js +12 -0
  40. package/dist/ContentSwitcher/package.json +7 -0
  41. package/dist/ContentSwitcher/styles.css +1 -0
  42. package/dist/ContentSwitcherDropdown/ContentSwitcherDropdown.cjs.js +23 -0
  43. package/dist/ContentSwitcherDropdown/ContentSwitcherDropdown.esm.js +15 -0
  44. package/dist/ContentSwitcherDropdown/package.json +7 -0
  45. package/dist/ContentSwitcherDropdown/styles.css +1 -0
  46. package/dist/DatePicker/DatePicker.cjs.js +11 -11
  47. package/dist/DatePicker/DatePicker.esm.js +11 -11
  48. package/dist/Disclosure/Disclosure.cjs.js +3 -3
  49. package/dist/Disclosure/Disclosure.esm.js +3 -3
  50. package/dist/Disclosure/styles.css +1 -1
  51. package/dist/DisclosureMini/DisclosureMini.cjs.js +4 -4
  52. package/dist/DisclosureMini/DisclosureMini.esm.js +4 -4
  53. package/dist/Elevation/styles.css +1 -1
  54. package/dist/Filter/Filter.cjs.js +2 -2
  55. package/dist/Filter/Filter.esm.js +2 -2
  56. package/dist/FormControl/FormControl.cjs.js +5 -5
  57. package/dist/FormControl/FormControl.esm.js +5 -5
  58. package/dist/Grid/styles.css +1 -1
  59. package/dist/Group/Group.cjs.js +2 -2
  60. package/dist/Group/Group.esm.js +2 -2
  61. package/dist/Heading/Heading.cjs.js +2 -2
  62. package/dist/Heading/Heading.esm.js +2 -2
  63. package/dist/HeroBanner/HeroBanner.cjs.js +63 -0
  64. package/dist/HeroBanner/HeroBanner.esm.js +55 -0
  65. package/dist/HeroBanner/package.json +7 -0
  66. package/dist/HeroBanner/styles.css +1 -0
  67. package/dist/HeroButton/HeroButton.cjs.js +4 -4
  68. package/dist/HeroButton/HeroButton.esm.js +4 -4
  69. package/dist/HeroButton/styles.css +1 -1
  70. package/dist/Icon/Icon.cjs.js +2 -2
  71. package/dist/Icon/Icon.esm.js +2 -2
  72. package/dist/ImpactCard/ImpactCard.cjs.js +6 -7
  73. package/dist/ImpactCard/ImpactCard.esm.js +6 -7
  74. package/dist/ImpactCard/styles.css +1 -1
  75. package/dist/InformationCard/InformationCard.cjs.js +31 -45
  76. package/dist/InformationCard/InformationCard.esm.js +31 -45
  77. package/dist/InformationCard/styles.css +1 -1
  78. package/dist/Link/Link.cjs.js +2 -2
  79. package/dist/Link/Link.esm.js +2 -2
  80. package/dist/Link/styles.css +1 -1
  81. package/dist/Markup/Markup.cjs.js +1 -1
  82. package/dist/Markup/Markup.esm.js +1 -1
  83. package/dist/MediaCard/MediaCard.cjs.js +8 -8
  84. package/dist/MediaCard/MediaCard.esm.js +8 -8
  85. package/dist/MediaCard/styles.css +1 -1
  86. package/dist/Modal/Modal.cjs.js +7 -7
  87. package/dist/Modal/Modal.esm.js +7 -7
  88. package/dist/Pagination/Pagination.cjs.js +2 -2
  89. package/dist/Pagination/Pagination.esm.js +2 -2
  90. package/dist/PaginationSimple/PaginationSimple.cjs.js +2 -2
  91. package/dist/PaginationSimple/PaginationSimple.esm.js +2 -2
  92. package/dist/Poster/Poster.cjs.js +2 -2
  93. package/dist/Poster/Poster.esm.js +2 -2
  94. package/dist/ProgressBar/ProgressBar.cjs.js +4 -4
  95. package/dist/ProgressBar/ProgressBar.esm.js +4 -4
  96. package/dist/ProgressStepper/ProgressStepper.cjs.js +3 -3
  97. package/dist/ProgressStepper/ProgressStepper.esm.js +3 -3
  98. package/dist/ProgressStepper/styles.css +1 -1
  99. package/dist/RadioGroup/RadioGroup.cjs.js +6 -6
  100. package/dist/RadioGroup/RadioGroup.esm.js +6 -6
  101. package/dist/RadioGroup/styles.css +1 -1
  102. package/dist/Rule/Rule.cjs.js +1 -1
  103. package/dist/Rule/Rule.esm.js +1 -1
  104. package/dist/Rule/styles.css +1 -1
  105. package/dist/ScrollToTop/ScrollToTop.cjs.js +2 -2
  106. package/dist/ScrollToTop/ScrollToTop.esm.js +2 -2
  107. package/dist/ScrollToTop/styles.css +1 -1
  108. package/dist/Select/Select.cjs.js +26 -2201
  109. package/dist/Select/Select.esm.js +16 -2172
  110. package/dist/Select/styles.css +1 -1
  111. package/dist/SiteFooter/SiteFooter.cjs.js +5 -5
  112. package/dist/SiteFooter/SiteFooter.esm.js +5 -5
  113. package/dist/SiteHeaderV2/SiteHeaderV2.cjs.js +8 -8
  114. package/dist/SiteHeaderV2/SiteHeaderV2.esm.js +8 -8
  115. package/dist/Spinner/Spinner.cjs.js +12 -0
  116. package/dist/Spinner/Spinner.esm.js +4 -0
  117. package/dist/Spinner/package.json +7 -0
  118. package/dist/Spinner/styles.css +1 -0
  119. package/dist/Surface/Surface.cjs.js +1 -1
  120. package/dist/Surface/Surface.esm.js +1 -1
  121. package/dist/Surface/styles.css +1 -1
  122. package/dist/Switch/Switch.cjs.js +7 -7
  123. package/dist/Switch/Switch.esm.js +7 -7
  124. package/dist/Switch/styles.css +1 -1
  125. package/dist/Tabs/Tabs.cjs.js +9 -8
  126. package/dist/Tabs/Tabs.esm.js +9 -8
  127. package/dist/Tag/Tag.cjs.js +77 -8
  128. package/dist/Tag/Tag.esm.js +76 -7
  129. package/dist/Tag/styles.css +1 -1
  130. package/dist/Text/Text.cjs.js +2 -2
  131. package/dist/Text/Text.esm.js +2 -2
  132. package/dist/TextArea/TextArea.cjs.js +44 -39
  133. package/dist/TextArea/TextArea.esm.js +44 -39
  134. package/dist/TextInput/TextInput.cjs.js +7 -7
  135. package/dist/TextInput/TextInput.esm.js +7 -7
  136. package/dist/Theme/styles.css +1 -1
  137. package/dist/ThemeIcon/ThemeIcon.cjs.js +2 -2
  138. package/dist/ThemeIcon/ThemeIcon.esm.js +2 -2
  139. package/dist/ThemeIcon/styles.css +1 -1
  140. package/dist/Toast/Toast.cjs.js +7 -7
  141. package/dist/Toast/Toast.esm.js +7 -7
  142. package/dist/Toast/styles.css +1 -1
  143. package/dist/Truncate/Truncate.cjs.js +2 -2
  144. package/dist/Truncate/Truncate.esm.js +2 -2
  145. package/dist/TypographyCard/TypographyCard.cjs.js +6 -7
  146. package/dist/TypographyCard/TypographyCard.esm.js +6 -7
  147. package/dist/TypographyCard/styles.css +1 -1
  148. package/dist/UniversalHeader/UniversalHeader.cjs.js +2 -2
  149. package/dist/UniversalHeader/UniversalHeader.esm.js +2 -2
  150. package/dist/VideoPlayer/VideoPlayer.cjs.js +5 -5
  151. package/dist/VideoPlayer/VideoPlayer.esm.js +5 -5
  152. package/dist/_shared/cjs/{Avatar-9277512a.js → Avatar-e6ba0881.js} +2 -2
  153. package/dist/_shared/cjs/Badge-1f86304b.js +17 -0
  154. package/dist/_shared/cjs/Box-d177ee32.js +29 -0
  155. package/dist/_shared/cjs/{BrandLogo-ce65cd74.js → BrandLogo-d4a6fd05.js} +1 -1
  156. package/dist/_shared/cjs/{Breadcrumbs-c7821aa9.js → Breadcrumbs-ca30086e.js} +1 -1
  157. package/dist/_shared/cjs/{Button-ea665c9c.js → Button-a2150286.js} +3 -3
  158. package/dist/_shared/cjs/{ButtonV2-373877da.js → ButtonV2-7c437d1a.js} +12 -7
  159. package/dist/_shared/cjs/{Calendar-e5184158.js → Calendar-9b4b01c8.js} +6 -6
  160. package/dist/_shared/cjs/{CardFooter-a1bb3ded.js → CardFooter-68235081.js} +3 -3
  161. package/dist/_shared/cjs/{CardHeading-3ddcf774.js → CardHeading-88edadd4.js} +1 -1
  162. package/dist/_shared/cjs/{Checkbox-850dcf99.js → Checkbox-f6712cc5.js} +10 -5
  163. package/dist/_shared/cjs/ContentSwitcher-88b00e11.js +98 -0
  164. package/dist/_shared/cjs/ContentSwitcherDropdown-ba5330ed.js +47 -0
  165. package/dist/_shared/cjs/{DatePicker-2bf10a10.js → DatePicker-61d66a55.js} +2 -2
  166. package/dist/_shared/cjs/{DisclosureMini-c730c24d.js → DisclosureMini-a46a4838.js} +3 -3
  167. package/dist/_shared/cjs/{Filter-c42eee70.js → Filter-b6ca2a39.js} +1 -1
  168. package/dist/_shared/cjs/{FormControl-5c963e6e.js → FormControl-0fba93b8.js} +3 -3
  169. package/dist/_shared/cjs/{Group-5233a907.js → Group-7e6b78c9.js} +1 -1
  170. package/dist/_shared/cjs/{Heading-14378b72.js → Heading-25d11688.js} +1 -1
  171. package/dist/_shared/cjs/{HeroButton-db7d03d6.js → HeroButton-19814c26.js} +5 -5
  172. package/dist/_shared/cjs/{Icon-7f1e8a19.js → Icon-08447959.js} +15 -4
  173. package/dist/_shared/cjs/{MediaCard-4ff9f5c0.js → MediaCard-7bbe8aa0.js} +6 -6
  174. package/dist/_shared/cjs/{Poster-8fba5492.js → Poster-96aa286e.js} +1 -1
  175. package/dist/_shared/cjs/{ProgressStepper-aaff6b51.js → ProgressStepper-c59ec56c.js} +6 -30
  176. package/dist/_shared/cjs/{RadioGroup-6142dceb.js → RadioGroup-11f4b232.js} +2 -2
  177. package/dist/_shared/cjs/{SiteFooter-cfe7163f.js → SiteFooter-d839f66a.js} +4 -4
  178. package/dist/_shared/cjs/{SiteHeaderV2-043d976a.js → SiteHeaderV2-3793453c.js} +6 -6
  179. package/dist/_shared/cjs/Spinner-56122c43.js +24 -0
  180. package/dist/_shared/cjs/{Surface-7500f314.js → Surface-1b5c2ac8.js} +2 -1
  181. package/dist/_shared/cjs/Tabs-30a12f1a.js +93 -0
  182. package/dist/_shared/cjs/{Text-284a7314.js → Text-c187d9ef.js} +1 -1
  183. package/dist/_shared/cjs/{TextInput-bcc3f86c.js → TextInput-d39f5a80.js} +3 -3
  184. package/dist/_shared/cjs/{ThemeIcon-c3dc056d.js → ThemeIcon-7f537bd2.js} +1 -1
  185. package/dist/_shared/cjs/{Toast-69020185.js → Toast-35c83925.js} +5 -5
  186. package/dist/_shared/cjs/{UniversalHeader-07be88fd.js → UniversalHeader-f9ef793f.js} +1 -1
  187. package/dist/_shared/cjs/{Tabs-bd1f208d.js → index-1e7a1fce.js} +8 -92
  188. package/dist/_shared/cjs/{index-6cbaf5e0.js → index-2bf59363.js} +1 -1
  189. package/dist/_shared/cjs/{index-dbab0ad6.js → index-527f962b.js} +1 -1
  190. package/dist/_shared/cjs/{index-568bc1da.js → index-879e71ee.js} +7 -7
  191. package/dist/_shared/cjs/index-89c323a4.js +2204 -0
  192. package/dist/_shared/cjs/{index-c137700a.js → index-ba3141f5.js} +1 -1
  193. package/dist/_shared/cjs/{index-677557a4.js → index-dbc843d3.js} +1 -1
  194. package/dist/_shared/cjs/{index.es-ba095ee5.js → index.es-f23456fa.js} +2 -2
  195. package/dist/_shared/esm/{Avatar-b5ac0a89.js → Avatar-3537bca7.js} +2 -2
  196. package/dist/_shared/esm/Badge-7bc80706.js +11 -0
  197. package/dist/_shared/esm/Box-557fb3b1.js +23 -0
  198. package/dist/_shared/esm/{BrandLogo-fb863b5b.js → BrandLogo-45d0d795.js} +1 -1
  199. package/dist/_shared/esm/{Breadcrumbs-01ebed9b.js → Breadcrumbs-bcf9ca79.js} +1 -1
  200. package/dist/_shared/esm/{Button-1491784f.js → Button-0506afa7.js} +3 -3
  201. package/dist/_shared/esm/{ButtonV2-f9019e00.js → ButtonV2-c83db10c.js} +12 -7
  202. package/dist/_shared/esm/{Calendar-5c2fb044.js → Calendar-34b10bd5.js} +6 -6
  203. package/dist/_shared/esm/{CardFooter-e4380cda.js → CardFooter-bf886438.js} +3 -3
  204. package/dist/_shared/esm/{CardHeading-4223432d.js → CardHeading-c65f9fb2.js} +1 -1
  205. package/dist/_shared/esm/{Checkbox-97def257.js → Checkbox-8195c42c.js} +10 -5
  206. package/dist/_shared/esm/ContentSwitcher-bae1f0a7.js +92 -0
  207. package/dist/_shared/esm/ContentSwitcherDropdown-65291c09.js +41 -0
  208. package/dist/_shared/esm/{DatePicker-2d891441.js → DatePicker-aafbdea8.js} +2 -2
  209. package/dist/_shared/esm/{DisclosureMini-6292f721.js → DisclosureMini-f6d8c9bc.js} +3 -3
  210. package/dist/_shared/esm/{Filter-71e06965.js → Filter-a5bf3fe3.js} +1 -1
  211. package/dist/_shared/esm/{FormControl-e0acdf7a.js → FormControl-ff671eb8.js} +3 -3
  212. package/dist/_shared/esm/{Group-b1b14ab4.js → Group-c4f6c745.js} +1 -1
  213. package/dist/_shared/esm/{Heading-0dfbdb24.js → Heading-0a8d3545.js} +1 -1
  214. package/dist/_shared/esm/{HeroButton-bb983125.js → HeroButton-a98767b7.js} +5 -5
  215. package/dist/_shared/esm/{Icon-428e8061.js → Icon-a5cb17de.js} +15 -4
  216. package/dist/_shared/esm/{MediaCard-d83b5561.js → MediaCard-fdc76670.js} +6 -6
  217. package/dist/_shared/esm/{Poster-ac72059a.js → Poster-dc3d7ee8.js} +1 -1
  218. package/dist/_shared/esm/{ProgressStepper-e3e7b392.js → ProgressStepper-427f24e3.js} +6 -30
  219. package/dist/_shared/esm/{RadioGroup-0d337240.js → RadioGroup-5b654bee.js} +2 -2
  220. package/dist/_shared/esm/{SiteFooter-7e924fb4.js → SiteFooter-1cdba967.js} +4 -4
  221. package/dist/_shared/esm/{SiteHeaderV2-94b9a407.js → SiteHeaderV2-743847f6.js} +6 -6
  222. package/dist/_shared/esm/Spinner-6704017c.js +18 -0
  223. package/dist/_shared/esm/{Surface-c425e5e6.js → Surface-0af6a69a.js} +2 -1
  224. package/dist/_shared/esm/Tabs-d360207d.js +87 -0
  225. package/dist/_shared/esm/{Text-96d8a35f.js → Text-df93be85.js} +1 -1
  226. package/dist/_shared/esm/{TextInput-8e3b81bf.js → TextInput-7ab39a54.js} +3 -3
  227. package/dist/_shared/esm/{ThemeIcon-9fac63d0.js → ThemeIcon-e1e19266.js} +1 -1
  228. package/dist/_shared/esm/{Toast-ebe2cd97.js → Toast-abd517c8.js} +5 -5
  229. package/dist/_shared/esm/{UniversalHeader-22ff848b.js → UniversalHeader-8ebc5322.js} +1 -1
  230. package/dist/_shared/esm/{index-61497bd9.js → index-14c7f4da.js} +1 -1
  231. package/dist/_shared/esm/{index-3a2c1ceb.js → index-57d4cb34.js} +10 -10
  232. package/dist/_shared/esm/{Tabs-028cee5d.js → index-89a7c31c.js} +6 -89
  233. package/dist/_shared/esm/{index-cf208294.js → index-ac50b180.js} +1 -1
  234. package/dist/_shared/esm/index-afbf540d.js +2169 -0
  235. package/dist/_shared/esm/{index-fb8b9df7.js → index-b9923ee4.js} +8 -8
  236. package/dist/_shared/esm/{index-f6cc48d2.js → index-e969452b.js} +1 -1
  237. package/dist/_shared/esm/{index-d083425f.js → index-f2ddcbe2.js} +1 -1
  238. package/dist/_shared/esm/{index.es-974af4a2.js → index.es-932db59a.js} +2 -2
  239. package/dist/index.es.js +9613 -9476
  240. package/dist/index.es.js.map +1 -1
  241. package/dist/index.js +9605 -9465
  242. package/dist/index.js.map +1 -1
  243. package/dist/styles.css +5 -3
  244. package/dist/types/components/Avatar/index.d.ts +1 -1
  245. package/dist/types/components/Box/Box.d.ts +4 -0
  246. package/dist/types/components/ButtonV2/ButtonV2.d.ts +2 -2
  247. package/dist/types/components/Carousel/Carousel.d.ts +12 -0
  248. package/dist/types/components/Carousel/helpers/get-slide-config.d.ts +4 -0
  249. package/dist/types/components/Carousel/helpers/get-slider-position.d.ts +9 -0
  250. package/dist/types/components/Carousel/helpers/is-last-slide.d.ts +2 -0
  251. package/dist/types/components/Carousel/helpers/is-slide-hidden.d.ts +2 -0
  252. package/dist/types/components/Carousel/hooks/use-slides.d.ts +18 -0
  253. package/dist/types/components/Carousel/index.d.ts +1 -0
  254. package/dist/types/components/Carousel/types/breakpoints.d.ts +1 -0
  255. package/dist/types/components/Carousel/types/responsive.d.ts +3 -0
  256. package/dist/types/components/Carousel/types/screen-sizes.d.ts +2 -0
  257. package/dist/types/components/Carousel/types/slide-config.d.ts +5 -0
  258. package/dist/types/components/Carousel/types/slide.d.ts +4 -0
  259. package/dist/types/components/Checkbox/Checkbox.d.ts +1 -1
  260. package/dist/types/components/ContentSwitcher/ContentSwitcher.d.ts +28 -0
  261. package/dist/types/components/ContentSwitcher/ContentSwitcherContent/ContentSwitcherContent.d.ts +12 -0
  262. package/dist/types/components/ContentSwitcher/ContentSwitcherContent/index.d.ts +1 -0
  263. package/dist/types/components/ContentSwitcher/ContentSwitcherList/ContentSwitcherList.d.ts +24 -0
  264. package/dist/types/components/ContentSwitcher/ContentSwitcherList/index.d.ts +1 -0
  265. package/dist/types/components/ContentSwitcher/ContentSwitcherTab/ContentSwitcherTab.d.ts +17 -0
  266. package/dist/types/components/ContentSwitcher/ContentSwitcherTab/index.d.ts +1 -0
  267. package/dist/types/components/ContentSwitcher/index.d.ts +1 -0
  268. package/dist/types/components/ContentSwitcherDropdown/ContentSwitcherDropdown.d.ts +37 -0
  269. package/dist/types/components/ContentSwitcherDropdown/index.d.ts +1 -0
  270. package/dist/types/components/Disclosure/index.d.ts +1 -1
  271. package/dist/types/components/Heading/index.d.ts +1 -1
  272. package/dist/types/components/HeroBanner/HeroBanner.d.ts +52 -0
  273. package/dist/types/components/HeroBanner/index.d.ts +1 -0
  274. package/dist/types/components/Icon/Icon.d.ts +2 -2
  275. package/dist/types/components/ImpactCard/index.d.ts +1 -1
  276. package/dist/types/components/InformationCard/InformationCard.d.ts +2 -2
  277. package/dist/types/components/InformationCard/index.d.ts +1 -1
  278. package/dist/types/components/MediaCard/index.d.ts +1 -1
  279. package/dist/types/components/Spinner/Spinner.d.ts +16 -0
  280. package/dist/types/components/Spinner/index.d.ts +1 -0
  281. package/dist/types/components/Surface/Surface.d.ts +4 -0
  282. package/dist/types/components/ThemeIcon/icon-names.d.ts +1 -1
  283. package/dist/types/components/Truncate/Truncate.d.ts +1 -1
  284. package/dist/types/components/TypographyCard/index.d.ts +1 -1
  285. package/dist/types/components/index.d.ts +3 -0
  286. package/dist/types/styles.d.ts +5 -1
  287. package/package.json +18 -18
  288. package/dist/_shared/cjs/ArcIconEclipse.esm-ac777a76.js +0 -28
  289. package/dist/_shared/cjs/Tag-4eb2ed9e.js +0 -44
  290. package/dist/_shared/esm/ArcIconEclipse.esm-bb48b82a.js +0 -22
  291. package/dist/_shared/esm/Tag-1ae027ee.js +0 -38
  292. package/dist/types/components/ProgressStepper/ProgressStepperItem/icons/Todo.d.ts +0 -2
  293. package/dist/_shared/cjs/{index-6f33b8c0.js → index-76f7dd53.js} +8 -8
@@ -1,2178 +1,22 @@
1
- import { _ as __rest, a as __assign, b as __spreadArray, f as filterDataAttrs } from '../_shared/esm/index.es-5496ec12.js';
1
+ import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index.es-5496ec12.js';
2
2
  import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
3
- import * as React from 'react';
4
- import React__default, { forwardRef, useContext, useState, useEffect, createElement, useRef, createContext, useCallback, Fragment, useMemo, useId } from 'react';
5
- import { $ as $6ed0406888f73fc4$export$c7b2cbe3552a0d05, a as $8927f6f2acc4f386$export$250ffa63cdc0d034, _ as _extends, b as $e42e1063c40fb3ef$export$b9ecd428b558ff10, c as $b1b2314f5f9a1d84$export$25bec8c6f54ee79a, d as $8927f6f2acc4f386$export$6d1a0317bde7de7f, e as $c512c27ab02ef895$export$50c7b4e9d9f19c1, f as $9f79659886946c16$export$e5c5a5f917a5871c, g as $71cd76cc60e0454e$export$6f32135080cb4c3, h as $5e63c961fc1ce211$export$8c6ed5c666ac1360 } from '../_shared/esm/index-3a2c1ceb.js';
6
- import ReactDOM__default, { createPortal } from 'react-dom';
7
- import { $ as $e02a7d9cb1dc128c$export$c74125a8e3af6bb2 } from '../_shared/esm/index-61497bd9.js';
8
- import { $ as $f631663db3294ace$export$b39126d51d94e6f3, a as $1746a345f3d73bb7$export$f680877a34711e37 } from '../_shared/esm/index-fb8b9df7.js';
9
- import { $ as $addc16e1bbe58fd0$export$3a72a57244d6e765, a as $ea1ef594cf570d83$export$439d29a4e110a164 } from '../_shared/esm/index-f6cc48d2.js';
10
- import { u as useFloating, a as autoUpdate, o as offset, s as shift, l as limitShift, f as flip, b as size, c as arrow, h as hide } from '../_shared/esm/floating-ui.react-dom-1bb71aae.js';
11
- import { $ as $db6c3485150b8e66$export$1ab7ae714698c4b8, a as $010c2913dbd2fe3d$export$5cae361ad82dce8b } from '../_shared/esm/index-cf208294.js';
12
- import { c as createSidecarMedium, a as useMergeRefs, f as fullWidthClassName, z as zeroRightClassName, s as styleSingleton, R as RemoveScrollBar, e as exportSidecar, h as hideOthers, u as useThemeElement } from '../_shared/esm/component-3e60a45e.js';
13
- import { F as FormControl } from '../_shared/esm/FormControl-e0acdf7a.js';
14
- import { C as Context } from '../_shared/esm/Surface-c425e5e6.js';
15
- import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-9fac63d0.js';
16
- import '../_shared/esm/DisclosureMini-6292f721.js';
17
- import '../_shared/esm/Text-96d8a35f.js';
3
+ import React__default, { useId, useContext, useState } from 'react';
4
+ import { $ as $cc7e05a45900e73f$export$be92b6f5f03c0fe9, a as $cc7e05a45900e73f$export$41fb9f06171c75f4, b as $cc7e05a45900e73f$export$4c8d1a57a761ef94, c as $cc7e05a45900e73f$export$f04a61298a47a40f, d as $cc7e05a45900e73f$export$602eac185826482c, e as $cc7e05a45900e73f$export$7c6e2c02157bb7d2, f as $cc7e05a45900e73f$export$2f60d3ec9ad468f2, g as $cc7e05a45900e73f$export$d5c6c08dc2d3ca7, h as $cc7e05a45900e73f$export$6d08773d2e66f8f2, i as $cc7e05a45900e73f$export$d6e5bf9c43ea9319, j as $cc7e05a45900e73f$export$c3468e2714d175fa, k as $cc7e05a45900e73f$export$bf1aedc3039c8d63 } from '../_shared/esm/index-afbf540d.js';
5
+ import { u as useThemeElement } from '../_shared/esm/component-3e60a45e.js';
6
+ import { F as FormControl } from '../_shared/esm/FormControl-ff671eb8.js';
7
+ import { C as Context } from '../_shared/esm/Surface-0af6a69a.js';
8
+ import { T as ThemeIcon } from '../_shared/esm/ThemeIcon-e1e19266.js';
9
+ import '../_shared/esm/index-57d4cb34.js';
10
+ import 'react-dom';
11
+ import '../_shared/esm/index-14c7f4da.js';
12
+ import '../_shared/esm/index-b9923ee4.js';
13
+ import '../_shared/esm/index-e969452b.js';
14
+ import '../_shared/esm/floating-ui.react-dom-1bb71aae.js';
15
+ import '../_shared/esm/index-ac50b180.js';
16
+ import '../_shared/esm/DisclosureMini-f6d8c9bc.js';
17
+ import '../_shared/esm/Text-df93be85.js';
18
18
  import '../_shared/esm/VisuallyHidden-cf45ac18.js';
19
19
 
20
- function $ae6933e535247d3d$export$7d15b64cf5a3a4c4(value, [min, max]) {
21
- return Math.min(max, Math.max(min, value));
22
- }
23
-
24
- const $5cb92bef7577960e$var$CONTEXT_UPDATE = 'dismissableLayer.update';
25
- const $5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';
26
- const $5cb92bef7577960e$var$FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';
27
- let $5cb92bef7577960e$var$originalBodyPointerEvents;
28
- const $5cb92bef7577960e$var$DismissableLayerContext = /*#__PURE__*/ createContext({
29
- layers: new Set(),
30
- layersWithOutsidePointerEventsDisabled: new Set(),
31
- branches: new Set()
32
- });
33
- const $5cb92bef7577960e$export$177fb62ff3ec1f22 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
34
- var _node$ownerDocument;
35
- const { disableOutsidePointerEvents: disableOutsidePointerEvents = false , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , ...layerProps } = props;
36
- const context = useContext($5cb92bef7577960e$var$DismissableLayerContext);
37
- const [node1, setNode] = useState(null);
38
- const ownerDocument = (_node$ownerDocument = node1 === null || node1 === void 0 ? void 0 : node1.ownerDocument) !== null && _node$ownerDocument !== void 0 ? _node$ownerDocument : globalThis === null || globalThis === void 0 ? void 0 : globalThis.document;
39
- const [, force] = useState({});
40
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setNode(node)
41
- );
42
- const layers = Array.from(context.layers);
43
- const [highestLayerWithOutsidePointerEventsDisabled] = [
44
- ...context.layersWithOutsidePointerEventsDisabled
45
- ].slice(-1); // prettier-ignore
46
- const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore
47
- const index = node1 ? layers.indexOf(node1) : -1;
48
- const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;
49
- const isPointerEventsEnabled = index >= highestLayerWithOutsidePointerEventsDisabledIndex;
50
- const pointerDownOutside = $5cb92bef7577960e$var$usePointerDownOutside((event)=>{
51
- const target = event.target;
52
- const isPointerDownOnBranch = [
53
- ...context.branches
54
- ].some((branch)=>branch.contains(target)
55
- );
56
- if (!isPointerEventsEnabled || isPointerDownOnBranch) return;
57
- onPointerDownOutside === null || onPointerDownOutside === void 0 || onPointerDownOutside(event);
58
- onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
59
- if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
60
- }, ownerDocument);
61
- const focusOutside = $5cb92bef7577960e$var$useFocusOutside((event)=>{
62
- const target = event.target;
63
- const isFocusInBranch = [
64
- ...context.branches
65
- ].some((branch)=>branch.contains(target)
66
- );
67
- if (isFocusInBranch) return;
68
- onFocusOutside === null || onFocusOutside === void 0 || onFocusOutside(event);
69
- onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
70
- if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
71
- }, ownerDocument);
72
- $addc16e1bbe58fd0$export$3a72a57244d6e765((event)=>{
73
- const isHighestLayer = index === context.layers.size - 1;
74
- if (!isHighestLayer) return;
75
- onEscapeKeyDown === null || onEscapeKeyDown === void 0 || onEscapeKeyDown(event);
76
- if (!event.defaultPrevented && onDismiss) {
77
- event.preventDefault();
78
- onDismiss();
79
- }
80
- }, ownerDocument);
81
- useEffect(()=>{
82
- if (!node1) return;
83
- if (disableOutsidePointerEvents) {
84
- if (context.layersWithOutsidePointerEventsDisabled.size === 0) {
85
- $5cb92bef7577960e$var$originalBodyPointerEvents = ownerDocument.body.style.pointerEvents;
86
- ownerDocument.body.style.pointerEvents = 'none';
87
- }
88
- context.layersWithOutsidePointerEventsDisabled.add(node1);
89
- }
90
- context.layers.add(node1);
91
- $5cb92bef7577960e$var$dispatchUpdate();
92
- return ()=>{
93
- if (disableOutsidePointerEvents && context.layersWithOutsidePointerEventsDisabled.size === 1) ownerDocument.body.style.pointerEvents = $5cb92bef7577960e$var$originalBodyPointerEvents;
94
- };
95
- }, [
96
- node1,
97
- ownerDocument,
98
- disableOutsidePointerEvents,
99
- context
100
- ]);
101
- /**
102
- * We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect
103
- * because a change to `disableOutsidePointerEvents` would remove this layer from the stack
104
- * and add it to the end again so the layering order wouldn't be _creation order_.
105
- * We only want them to be removed from context stacks when unmounted.
106
- */ useEffect(()=>{
107
- return ()=>{
108
- if (!node1) return;
109
- context.layers.delete(node1);
110
- context.layersWithOutsidePointerEventsDisabled.delete(node1);
111
- $5cb92bef7577960e$var$dispatchUpdate();
112
- };
113
- }, [
114
- node1,
115
- context
116
- ]);
117
- useEffect(()=>{
118
- const handleUpdate = ()=>force({})
119
- ;
120
- document.addEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate);
121
- return ()=>document.removeEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate)
122
- ;
123
- }, []);
124
- return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({}, layerProps, {
125
- ref: composedRefs,
126
- style: {
127
- pointerEvents: isBodyPointerEventsDisabled ? isPointerEventsEnabled ? 'auto' : 'none' : undefined,
128
- ...props.style
129
- },
130
- onFocusCapture: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onFocusCapture, focusOutside.onFocusCapture),
131
- onBlurCapture: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onBlurCapture, focusOutside.onBlurCapture),
132
- onPointerDownCapture: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerDownCapture, pointerDownOutside.onPointerDownCapture)
133
- }));
134
- });
135
- /* -----------------------------------------------------------------------------------------------*/ /**
136
- * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`
137
- * to mimic layer dismissing behaviour present in OS.
138
- * Returns props to pass to the node we want to check for outside events.
139
- */ function $5cb92bef7577960e$var$usePointerDownOutside(onPointerDownOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
140
- const handlePointerDownOutside = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onPointerDownOutside);
141
- const isPointerInsideReactTreeRef = useRef(false);
142
- const handleClickRef = useRef(()=>{});
143
- useEffect(()=>{
144
- const handlePointerDown = (event)=>{
145
- if (event.target && !isPointerInsideReactTreeRef.current) {
146
- const eventDetail = {
147
- originalEvent: event
148
- };
149
- function handleAndDispatchPointerDownOutsideEvent() {
150
- $5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail, {
151
- discrete: true
152
- });
153
- }
154
- /**
155
- * On touch devices, we need to wait for a click event because browsers implement
156
- * a ~350ms delay between the time the user stops touching the display and when the
157
- * browser executres events. We need to ensure we don't reactivate pointer-events within
158
- * this timeframe otherwise the browser may execute events that should have been prevented.
159
- *
160
- * Additionally, this also lets us deal automatically with cancellations when a click event
161
- * isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.
162
- *
163
- * This is why we also continuously remove the previous listener, because we cannot be
164
- * certain that it was raised, and therefore cleaned-up.
165
- */ if (event.pointerType === 'touch') {
166
- ownerDocument.removeEventListener('click', handleClickRef.current);
167
- handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;
168
- ownerDocument.addEventListener('click', handleClickRef.current, {
169
- once: true
170
- });
171
- } else handleAndDispatchPointerDownOutsideEvent();
172
- } else // We need to remove the event listener in case the outside click has been canceled.
173
- // See: https://github.com/radix-ui/primitives/issues/2171
174
- ownerDocument.removeEventListener('click', handleClickRef.current);
175
- isPointerInsideReactTreeRef.current = false;
176
- };
177
- /**
178
- * if this hook executes in a component that mounts via a `pointerdown` event, the event
179
- * would bubble up to the document and trigger a `pointerDownOutside` event. We avoid
180
- * this by delaying the event listener registration on the document.
181
- * This is not React specific, but rather how the DOM works, ie:
182
- * ```
183
- * button.addEventListener('pointerdown', () => {
184
- * console.log('I will log');
185
- * document.addEventListener('pointerdown', () => {
186
- * console.log('I will also log');
187
- * })
188
- * });
189
- */ const timerId = window.setTimeout(()=>{
190
- ownerDocument.addEventListener('pointerdown', handlePointerDown);
191
- }, 0);
192
- return ()=>{
193
- window.clearTimeout(timerId);
194
- ownerDocument.removeEventListener('pointerdown', handlePointerDown);
195
- ownerDocument.removeEventListener('click', handleClickRef.current);
196
- };
197
- }, [
198
- ownerDocument,
199
- handlePointerDownOutside
200
- ]);
201
- return {
202
- // ensures we check React component tree (not just DOM tree)
203
- onPointerDownCapture: ()=>isPointerInsideReactTreeRef.current = true
204
- };
205
- }
206
- /**
207
- * Listens for when focus happens outside a react subtree.
208
- * Returns props to pass to the root (node) of the subtree we want to check.
209
- */ function $5cb92bef7577960e$var$useFocusOutside(onFocusOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
210
- const handleFocusOutside = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onFocusOutside);
211
- const isFocusInsideReactTreeRef = useRef(false);
212
- useEffect(()=>{
213
- const handleFocus = (event)=>{
214
- if (event.target && !isFocusInsideReactTreeRef.current) {
215
- const eventDetail = {
216
- originalEvent: event
217
- };
218
- $5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {
219
- discrete: false
220
- });
221
- }
222
- };
223
- ownerDocument.addEventListener('focusin', handleFocus);
224
- return ()=>ownerDocument.removeEventListener('focusin', handleFocus)
225
- ;
226
- }, [
227
- ownerDocument,
228
- handleFocusOutside
229
- ]);
230
- return {
231
- onFocusCapture: ()=>isFocusInsideReactTreeRef.current = true
232
- ,
233
- onBlurCapture: ()=>isFocusInsideReactTreeRef.current = false
234
- };
235
- }
236
- function $5cb92bef7577960e$var$dispatchUpdate() {
237
- const event = new CustomEvent($5cb92bef7577960e$var$CONTEXT_UPDATE);
238
- document.dispatchEvent(event);
239
- }
240
- function $5cb92bef7577960e$var$handleAndDispatchCustomEvent(name, handler, detail, { discrete: discrete }) {
241
- const target = detail.originalEvent.target;
242
- const event = new CustomEvent(name, {
243
- bubbles: false,
244
- cancelable: true,
245
- detail: detail
246
- });
247
- if (handler) target.addEventListener(name, handler, {
248
- once: true
249
- });
250
- if (discrete) $8927f6f2acc4f386$export$6d1a0317bde7de7f(target, event);
251
- else target.dispatchEvent(event);
252
- }
253
-
254
- /** Number of components which have requested interest to have focus guards */ let $3db38b7d1fb3fe6a$var$count = 0;
255
- /**
256
- * Injects a pair of focus guards at the edges of the whole DOM tree
257
- * to ensure `focusin` & `focusout` events can be caught consistently.
258
- */ function $3db38b7d1fb3fe6a$export$b7ece24a22aeda8c() {
259
- useEffect(()=>{
260
- var _edgeGuards$, _edgeGuards$2;
261
- const edgeGuards = document.querySelectorAll('[data-radix-focus-guard]');
262
- document.body.insertAdjacentElement('afterbegin', (_edgeGuards$ = edgeGuards[0]) !== null && _edgeGuards$ !== void 0 ? _edgeGuards$ : $3db38b7d1fb3fe6a$var$createFocusGuard());
263
- document.body.insertAdjacentElement('beforeend', (_edgeGuards$2 = edgeGuards[1]) !== null && _edgeGuards$2 !== void 0 ? _edgeGuards$2 : $3db38b7d1fb3fe6a$var$createFocusGuard());
264
- $3db38b7d1fb3fe6a$var$count++;
265
- return ()=>{
266
- if ($3db38b7d1fb3fe6a$var$count === 1) document.querySelectorAll('[data-radix-focus-guard]').forEach((node)=>node.remove()
267
- );
268
- $3db38b7d1fb3fe6a$var$count--;
269
- };
270
- }, []);
271
- }
272
- function $3db38b7d1fb3fe6a$var$createFocusGuard() {
273
- const element = document.createElement('span');
274
- element.setAttribute('data-radix-focus-guard', '');
275
- element.tabIndex = 0;
276
- element.style.cssText = 'outline: none; opacity: 0; position: fixed; pointer-events: none';
277
- return element;
278
- }
279
-
280
- const $d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT = 'focusScope.autoFocusOnMount';
281
- const $d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT = 'focusScope.autoFocusOnUnmount';
282
- const $d3863c46a17e8a28$var$EVENT_OPTIONS = {
283
- bubbles: false,
284
- cancelable: true
285
- };
286
- const $d3863c46a17e8a28$export$20e40289641fbbb6 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
287
- const { loop: loop = false , trapped: trapped = false , onMountAutoFocus: onMountAutoFocusProp , onUnmountAutoFocus: onUnmountAutoFocusProp , ...scopeProps } = props;
288
- const [container1, setContainer] = useState(null);
289
- const onMountAutoFocus = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onMountAutoFocusProp);
290
- const onUnmountAutoFocus = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onUnmountAutoFocusProp);
291
- const lastFocusedElementRef = useRef(null);
292
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContainer(node)
293
- );
294
- const focusScope = useRef({
295
- paused: false,
296
- pause () {
297
- this.paused = true;
298
- },
299
- resume () {
300
- this.paused = false;
301
- }
302
- }).current; // Takes care of trapping focus if focus is moved outside programmatically for example
303
- useEffect(()=>{
304
- if (trapped) {
305
- function handleFocusIn(event) {
306
- if (focusScope.paused || !container1) return;
307
- const target = event.target;
308
- if (container1.contains(target)) lastFocusedElementRef.current = target;
309
- else $d3863c46a17e8a28$var$focus(lastFocusedElementRef.current, {
310
- select: true
311
- });
312
- }
313
- function handleFocusOut(event) {
314
- if (focusScope.paused || !container1) return;
315
- const relatedTarget = event.relatedTarget; // A `focusout` event with a `null` `relatedTarget` will happen in at least two cases:
316
- //
317
- // 1. When the user switches app/tabs/windows/the browser itself loses focus.
318
- // 2. In Google Chrome, when the focused element is removed from the DOM.
319
- //
320
- // We let the browser do its thing here because:
321
- //
322
- // 1. The browser already keeps a memory of what's focused for when the page gets refocused.
323
- // 2. In Google Chrome, if we try to focus the deleted focused element (as per below), it
324
- // throws the CPU to 100%, so we avoid doing anything for this reason here too.
325
- if (relatedTarget === null) return; // If the focus has moved to an actual legitimate element (`relatedTarget !== null`)
326
- // that is outside the container, we move focus to the last valid focused element inside.
327
- if (!container1.contains(relatedTarget)) $d3863c46a17e8a28$var$focus(lastFocusedElementRef.current, {
328
- select: true
329
- });
330
- } // When the focused element gets removed from the DOM, browsers move focus
331
- // back to the document.body. In this case, we move focus to the container
332
- // to keep focus trapped correctly.
333
- function handleMutations(mutations) {
334
- const focusedElement = document.activeElement;
335
- if (focusedElement !== document.body) return;
336
- for (const mutation of mutations)if (mutation.removedNodes.length > 0) $d3863c46a17e8a28$var$focus(container1);
337
- }
338
- document.addEventListener('focusin', handleFocusIn);
339
- document.addEventListener('focusout', handleFocusOut);
340
- const mutationObserver = new MutationObserver(handleMutations);
341
- if (container1) mutationObserver.observe(container1, {
342
- childList: true,
343
- subtree: true
344
- });
345
- return ()=>{
346
- document.removeEventListener('focusin', handleFocusIn);
347
- document.removeEventListener('focusout', handleFocusOut);
348
- mutationObserver.disconnect();
349
- };
350
- }
351
- }, [
352
- trapped,
353
- container1,
354
- focusScope.paused
355
- ]);
356
- useEffect(()=>{
357
- if (container1) {
358
- $d3863c46a17e8a28$var$focusScopesStack.add(focusScope);
359
- const previouslyFocusedElement = document.activeElement;
360
- const hasFocusedCandidate = container1.contains(previouslyFocusedElement);
361
- if (!hasFocusedCandidate) {
362
- const mountEvent = new CustomEvent($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, $d3863c46a17e8a28$var$EVENT_OPTIONS);
363
- container1.addEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, onMountAutoFocus);
364
- container1.dispatchEvent(mountEvent);
365
- if (!mountEvent.defaultPrevented) {
366
- $d3863c46a17e8a28$var$focusFirst($d3863c46a17e8a28$var$removeLinks($d3863c46a17e8a28$var$getTabbableCandidates(container1)), {
367
- select: true
368
- });
369
- if (document.activeElement === previouslyFocusedElement) $d3863c46a17e8a28$var$focus(container1);
370
- }
371
- }
372
- return ()=>{
373
- container1.removeEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, onMountAutoFocus); // We hit a react bug (fixed in v17) with focusing in unmount.
374
- // We need to delay the focus a little to get around it for now.
375
- // See: https://github.com/facebook/react/issues/17894
376
- setTimeout(()=>{
377
- const unmountEvent = new CustomEvent($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, $d3863c46a17e8a28$var$EVENT_OPTIONS);
378
- container1.addEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, onUnmountAutoFocus);
379
- container1.dispatchEvent(unmountEvent);
380
- if (!unmountEvent.defaultPrevented) $d3863c46a17e8a28$var$focus(previouslyFocusedElement !== null && previouslyFocusedElement !== void 0 ? previouslyFocusedElement : document.body, {
381
- select: true
382
- });
383
- // we need to remove the listener after we `dispatchEvent`
384
- container1.removeEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, onUnmountAutoFocus);
385
- $d3863c46a17e8a28$var$focusScopesStack.remove(focusScope);
386
- }, 0);
387
- };
388
- }
389
- }, [
390
- container1,
391
- onMountAutoFocus,
392
- onUnmountAutoFocus,
393
- focusScope
394
- ]); // Takes care of looping focus (when tabbing whilst at the edges)
395
- const handleKeyDown = useCallback((event)=>{
396
- if (!loop && !trapped) return;
397
- if (focusScope.paused) return;
398
- const isTabKey = event.key === 'Tab' && !event.altKey && !event.ctrlKey && !event.metaKey;
399
- const focusedElement = document.activeElement;
400
- if (isTabKey && focusedElement) {
401
- const container = event.currentTarget;
402
- const [first, last] = $d3863c46a17e8a28$var$getTabbableEdges(container);
403
- const hasTabbableElementsInside = first && last; // we can only wrap focus if we have tabbable edges
404
- if (!hasTabbableElementsInside) {
405
- if (focusedElement === container) event.preventDefault();
406
- } else {
407
- if (!event.shiftKey && focusedElement === last) {
408
- event.preventDefault();
409
- if (loop) $d3863c46a17e8a28$var$focus(first, {
410
- select: true
411
- });
412
- } else if (event.shiftKey && focusedElement === first) {
413
- event.preventDefault();
414
- if (loop) $d3863c46a17e8a28$var$focus(last, {
415
- select: true
416
- });
417
- }
418
- }
419
- }
420
- }, [
421
- loop,
422
- trapped,
423
- focusScope.paused
424
- ]);
425
- return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({
426
- tabIndex: -1
427
- }, scopeProps, {
428
- ref: composedRefs,
429
- onKeyDown: handleKeyDown
430
- }));
431
- });
432
- /* -------------------------------------------------------------------------------------------------
433
- * Utils
434
- * -----------------------------------------------------------------------------------------------*/ /**
435
- * Attempts focusing the first element in a list of candidates.
436
- * Stops when focus has actually moved.
437
- */ function $d3863c46a17e8a28$var$focusFirst(candidates, { select: select = false } = {}) {
438
- const previouslyFocusedElement = document.activeElement;
439
- for (const candidate of candidates){
440
- $d3863c46a17e8a28$var$focus(candidate, {
441
- select: select
442
- });
443
- if (document.activeElement !== previouslyFocusedElement) return;
444
- }
445
- }
446
- /**
447
- * Returns the first and last tabbable elements inside a container.
448
- */ function $d3863c46a17e8a28$var$getTabbableEdges(container) {
449
- const candidates = $d3863c46a17e8a28$var$getTabbableCandidates(container);
450
- const first = $d3863c46a17e8a28$var$findVisible(candidates, container);
451
- const last = $d3863c46a17e8a28$var$findVisible(candidates.reverse(), container);
452
- return [
453
- first,
454
- last
455
- ];
456
- }
457
- /**
458
- * Returns a list of potential tabbable candidates.
459
- *
460
- * NOTE: This is only a close approximation. For example it doesn't take into account cases like when
461
- * elements are not visible. This cannot be worked out easily by just reading a property, but rather
462
- * necessitate runtime knowledge (computed styles, etc). We deal with these cases separately.
463
- *
464
- * See: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker
465
- * Credit: https://github.com/discord/focus-layers/blob/master/src/util/wrapFocus.tsx#L1
466
- */ function $d3863c46a17e8a28$var$getTabbableCandidates(container) {
467
- const nodes = [];
468
- const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
469
- acceptNode: (node)=>{
470
- const isHiddenInput = node.tagName === 'INPUT' && node.type === 'hidden';
471
- if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP; // `.tabIndex` is not the same as the `tabindex` attribute. It works on the
472
- // runtime's understanding of tabbability, so this automatically accounts
473
- // for any kind of element that could be tabbed to.
474
- return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
475
- }
476
- });
477
- while(walker.nextNode())nodes.push(walker.currentNode); // we do not take into account the order of nodes with positive `tabIndex` as it
478
- // hinders accessibility to have tab order different from visual order.
479
- return nodes;
480
- }
481
- /**
482
- * Returns the first visible element in a list.
483
- * NOTE: Only checks visibility up to the `container`.
484
- */ function $d3863c46a17e8a28$var$findVisible(elements, container) {
485
- for (const element of elements){
486
- // we stop checking if it's hidden at the `container` level (excluding)
487
- if (!$d3863c46a17e8a28$var$isHidden(element, {
488
- upTo: container
489
- })) return element;
490
- }
491
- }
492
- function $d3863c46a17e8a28$var$isHidden(node, { upTo: upTo }) {
493
- if (getComputedStyle(node).visibility === 'hidden') return true;
494
- while(node){
495
- // we stop at `upTo` (excluding it)
496
- if (upTo !== undefined && node === upTo) return false;
497
- if (getComputedStyle(node).display === 'none') return true;
498
- node = node.parentElement;
499
- }
500
- return false;
501
- }
502
- function $d3863c46a17e8a28$var$isSelectableInput(element) {
503
- return element instanceof HTMLInputElement && 'select' in element;
504
- }
505
- function $d3863c46a17e8a28$var$focus(element, { select: select = false } = {}) {
506
- // only focus if that element is focusable
507
- if (element && element.focus) {
508
- const previouslyFocusedElement = document.activeElement; // NOTE: we prevent scrolling on focus, to minimize jarring transitions for users
509
- element.focus({
510
- preventScroll: true
511
- }); // only select if its not the same element, it supports selection and we need to select
512
- if (element !== previouslyFocusedElement && $d3863c46a17e8a28$var$isSelectableInput(element) && select) element.select();
513
- }
514
- }
515
- /* -------------------------------------------------------------------------------------------------
516
- * FocusScope stack
517
- * -----------------------------------------------------------------------------------------------*/ const $d3863c46a17e8a28$var$focusScopesStack = $d3863c46a17e8a28$var$createFocusScopesStack();
518
- function $d3863c46a17e8a28$var$createFocusScopesStack() {
519
- /** A stack of focus scopes, with the active one at the top */ let stack = [];
520
- return {
521
- add (focusScope) {
522
- // pause the currently active focus scope (at the top of the stack)
523
- const activeFocusScope = stack[0];
524
- if (focusScope !== activeFocusScope) activeFocusScope === null || activeFocusScope === void 0 || activeFocusScope.pause();
525
- // remove in case it already exists (because we'll re-add it at the top of the stack)
526
- stack = $d3863c46a17e8a28$var$arrayRemove(stack, focusScope);
527
- stack.unshift(focusScope);
528
- },
529
- remove (focusScope) {
530
- var _stack$;
531
- stack = $d3863c46a17e8a28$var$arrayRemove(stack, focusScope);
532
- (_stack$ = stack[0]) === null || _stack$ === void 0 || _stack$.resume();
533
- }
534
- };
535
- }
536
- function $d3863c46a17e8a28$var$arrayRemove(array, item) {
537
- const updatedArray = [
538
- ...array
539
- ];
540
- const index = updatedArray.indexOf(item);
541
- if (index !== -1) updatedArray.splice(index, 1);
542
- return updatedArray;
543
- }
544
- function $d3863c46a17e8a28$var$removeLinks(items) {
545
- return items.filter((item)=>item.tagName !== 'A'
546
- );
547
- }
548
-
549
- /* -------------------------------------------------------------------------------------------------
550
- * Popper
551
- * -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$POPPER_NAME = 'Popper';
552
- const [$cf1ac5d9fe0e8206$var$createPopperContext, $cf1ac5d9fe0e8206$export$722aac194ae923] = $c512c27ab02ef895$export$50c7b4e9d9f19c1($cf1ac5d9fe0e8206$var$POPPER_NAME);
553
- const [$cf1ac5d9fe0e8206$var$PopperProvider, $cf1ac5d9fe0e8206$var$usePopperContext] = $cf1ac5d9fe0e8206$var$createPopperContext($cf1ac5d9fe0e8206$var$POPPER_NAME);
554
- const $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9 = (props)=>{
555
- const { __scopePopper: __scopePopper , children: children } = props;
556
- const [anchor, setAnchor] = useState(null);
557
- return /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$var$PopperProvider, {
558
- scope: __scopePopper,
559
- anchor: anchor,
560
- onAnchorChange: setAnchor
561
- }, children);
562
- };
563
- /* -------------------------------------------------------------------------------------------------
564
- * PopperAnchor
565
- * -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$ANCHOR_NAME = 'PopperAnchor';
566
- const $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
567
- const { __scopePopper: __scopePopper , virtualRef: virtualRef , ...anchorProps } = props;
568
- const context = $cf1ac5d9fe0e8206$var$usePopperContext($cf1ac5d9fe0e8206$var$ANCHOR_NAME, __scopePopper);
569
- const ref = useRef(null);
570
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref);
571
- useEffect(()=>{
572
- // Consumer can anchor the popper to something that isn't
573
- // a DOM node e.g. pointer position, so we override the
574
- // `anchorRef` with their virtual ref in this case.
575
- context.onAnchorChange((virtualRef === null || virtualRef === void 0 ? void 0 : virtualRef.current) || ref.current);
576
- });
577
- return virtualRef ? null : /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({}, anchorProps, {
578
- ref: composedRefs
579
- }));
580
- });
581
- /* -------------------------------------------------------------------------------------------------
582
- * PopperContent
583
- * -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$CONTENT_NAME = 'PopperContent';
584
- const [$cf1ac5d9fe0e8206$var$PopperContentProvider, $cf1ac5d9fe0e8206$var$useContentContext] = $cf1ac5d9fe0e8206$var$createPopperContext($cf1ac5d9fe0e8206$var$CONTENT_NAME);
585
- const $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
586
- var _arrowSize$width, _arrowSize$height, _middlewareData$arrow, _middlewareData$arrow2, _middlewareData$arrow3, _middlewareData$trans, _middlewareData$trans2, _middlewareData$hide;
587
- const { __scopePopper: __scopePopper , side: side = 'bottom' , sideOffset: sideOffset = 0 , align: align = 'center' , alignOffset: alignOffset = 0 , arrowPadding: arrowPadding = 0 , avoidCollisions: avoidCollisions = true , collisionBoundary: collisionBoundary = [] , collisionPadding: collisionPaddingProp = 0 , sticky: sticky = 'partial' , hideWhenDetached: hideWhenDetached = false , updatePositionStrategy: updatePositionStrategy = 'optimized' , onPlaced: onPlaced , ...contentProps } = props;
588
- const context = $cf1ac5d9fe0e8206$var$usePopperContext($cf1ac5d9fe0e8206$var$CONTENT_NAME, __scopePopper);
589
- const [content, setContent] = useState(null);
590
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContent(node)
591
- );
592
- const [arrow$1, setArrow] = useState(null);
593
- const arrowSize = $db6c3485150b8e66$export$1ab7ae714698c4b8(arrow$1);
594
- const arrowWidth = (_arrowSize$width = arrowSize === null || arrowSize === void 0 ? void 0 : arrowSize.width) !== null && _arrowSize$width !== void 0 ? _arrowSize$width : 0;
595
- const arrowHeight = (_arrowSize$height = arrowSize === null || arrowSize === void 0 ? void 0 : arrowSize.height) !== null && _arrowSize$height !== void 0 ? _arrowSize$height : 0;
596
- const desiredPlacement = side + (align !== 'center' ? '-' + align : '');
597
- const collisionPadding = typeof collisionPaddingProp === 'number' ? collisionPaddingProp : {
598
- top: 0,
599
- right: 0,
600
- bottom: 0,
601
- left: 0,
602
- ...collisionPaddingProp
603
- };
604
- const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [
605
- collisionBoundary
606
- ];
607
- const hasExplicitBoundaries = boundary.length > 0;
608
- const detectOverflowOptions = {
609
- padding: collisionPadding,
610
- boundary: boundary.filter($cf1ac5d9fe0e8206$var$isNotNull),
611
- // with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
612
- altBoundary: hasExplicitBoundaries
613
- };
614
- const { refs: refs , floatingStyles: floatingStyles , placement: placement , isPositioned: isPositioned , middlewareData: middlewareData } = useFloating({
615
- // default to `fixed` strategy so users don't have to pick and we also avoid focus scroll issues
616
- strategy: 'fixed',
617
- placement: desiredPlacement,
618
- whileElementsMounted: (...args)=>{
619
- const cleanup = autoUpdate(...args, {
620
- animationFrame: updatePositionStrategy === 'always'
621
- });
622
- return cleanup;
623
- },
624
- elements: {
625
- reference: context.anchor
626
- },
627
- middleware: [
628
- offset({
629
- mainAxis: sideOffset + arrowHeight,
630
- alignmentAxis: alignOffset
631
- }),
632
- avoidCollisions && shift({
633
- mainAxis: true,
634
- crossAxis: false,
635
- limiter: sticky === 'partial' ? limitShift() : undefined,
636
- ...detectOverflowOptions
637
- }),
638
- avoidCollisions && flip({
639
- ...detectOverflowOptions
640
- }),
641
- size({
642
- ...detectOverflowOptions,
643
- apply: ({ elements: elements , rects: rects , availableWidth: availableWidth , availableHeight: availableHeight })=>{
644
- const { width: anchorWidth , height: anchorHeight } = rects.reference;
645
- const contentStyle = elements.floating.style;
646
- contentStyle.setProperty('--radix-popper-available-width', `${availableWidth}px`);
647
- contentStyle.setProperty('--radix-popper-available-height', `${availableHeight}px`);
648
- contentStyle.setProperty('--radix-popper-anchor-width', `${anchorWidth}px`);
649
- contentStyle.setProperty('--radix-popper-anchor-height', `${anchorHeight}px`);
650
- }
651
- }),
652
- arrow$1 && arrow({
653
- element: arrow$1,
654
- padding: arrowPadding
655
- }),
656
- $cf1ac5d9fe0e8206$var$transformOrigin({
657
- arrowWidth: arrowWidth,
658
- arrowHeight: arrowHeight
659
- }),
660
- hideWhenDetached && hide({
661
- strategy: 'referenceHidden',
662
- ...detectOverflowOptions
663
- })
664
- ]
665
- });
666
- const [placedSide, placedAlign] = $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement);
667
- const handlePlaced = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onPlaced);
668
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
669
- if (isPositioned) handlePlaced === null || handlePlaced === void 0 || handlePlaced();
670
- }, [
671
- isPositioned,
672
- handlePlaced
673
- ]);
674
- const arrowX = (_middlewareData$arrow = middlewareData.arrow) === null || _middlewareData$arrow === void 0 ? void 0 : _middlewareData$arrow.x;
675
- const arrowY = (_middlewareData$arrow2 = middlewareData.arrow) === null || _middlewareData$arrow2 === void 0 ? void 0 : _middlewareData$arrow2.y;
676
- const cannotCenterArrow = ((_middlewareData$arrow3 = middlewareData.arrow) === null || _middlewareData$arrow3 === void 0 ? void 0 : _middlewareData$arrow3.centerOffset) !== 0;
677
- const [contentZIndex, setContentZIndex] = useState();
678
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
679
- if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
680
- }, [
681
- content
682
- ]);
683
- return /*#__PURE__*/ createElement("div", {
684
- ref: refs.setFloating,
685
- "data-radix-popper-content-wrapper": "",
686
- style: {
687
- ...floatingStyles,
688
- transform: isPositioned ? floatingStyles.transform : 'translate(0, -200%)',
689
- // keep off the page when measuring
690
- minWidth: 'max-content',
691
- zIndex: contentZIndex,
692
- ['--radix-popper-transform-origin']: [
693
- (_middlewareData$trans = middlewareData.transformOrigin) === null || _middlewareData$trans === void 0 ? void 0 : _middlewareData$trans.x,
694
- (_middlewareData$trans2 = middlewareData.transformOrigin) === null || _middlewareData$trans2 === void 0 ? void 0 : _middlewareData$trans2.y
695
- ].join(' ')
696
- } // Floating UI interally calculates logical alignment based the `dir` attribute on
697
- ,
698
- dir: props.dir
699
- }, /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$var$PopperContentProvider, {
700
- scope: __scopePopper,
701
- placedSide: placedSide,
702
- onArrowChange: setArrow,
703
- arrowX: arrowX,
704
- arrowY: arrowY,
705
- shouldHideArrow: cannotCenterArrow
706
- }, /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({
707
- "data-side": placedSide,
708
- "data-align": placedAlign
709
- }, contentProps, {
710
- ref: composedRefs,
711
- style: {
712
- ...contentProps.style,
713
- // if the PopperContent hasn't been placed yet (not all measurements done)
714
- // we prevent animations so that users's animation don't kick in too early referring wrong sides
715
- animation: !isPositioned ? 'none' : undefined,
716
- // hide the content if using the hide middleware and should be hidden
717
- opacity: (_middlewareData$hide = middlewareData.hide) !== null && _middlewareData$hide !== void 0 && _middlewareData$hide.referenceHidden ? 0 : undefined
718
- }
719
- }))));
720
- });
721
- /* -----------------------------------------------------------------------------------------------*/ function $cf1ac5d9fe0e8206$var$isNotNull(value) {
722
- return value !== null;
723
- }
724
- const $cf1ac5d9fe0e8206$var$transformOrigin = (options)=>({
725
- name: 'transformOrigin',
726
- options: options,
727
- fn (data) {
728
- var _middlewareData$arrow4, _middlewareData$arrow5, _middlewareData$arrow6, _middlewareData$arrow7, _middlewareData$arrow8;
729
- const { placement: placement , rects: rects , middlewareData: middlewareData } = data;
730
- const cannotCenterArrow = ((_middlewareData$arrow4 = middlewareData.arrow) === null || _middlewareData$arrow4 === void 0 ? void 0 : _middlewareData$arrow4.centerOffset) !== 0;
731
- const isArrowHidden = cannotCenterArrow;
732
- const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
733
- const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
734
- const [placedSide, placedAlign] = $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement);
735
- const noArrowAlign = {
736
- start: '0%',
737
- center: '50%',
738
- end: '100%'
739
- }[placedAlign];
740
- const arrowXCenter = ((_middlewareData$arrow5 = (_middlewareData$arrow6 = middlewareData.arrow) === null || _middlewareData$arrow6 === void 0 ? void 0 : _middlewareData$arrow6.x) !== null && _middlewareData$arrow5 !== void 0 ? _middlewareData$arrow5 : 0) + arrowWidth / 2;
741
- const arrowYCenter = ((_middlewareData$arrow7 = (_middlewareData$arrow8 = middlewareData.arrow) === null || _middlewareData$arrow8 === void 0 ? void 0 : _middlewareData$arrow8.y) !== null && _middlewareData$arrow7 !== void 0 ? _middlewareData$arrow7 : 0) + arrowHeight / 2;
742
- let x = '';
743
- let y = '';
744
- if (placedSide === 'bottom') {
745
- x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
746
- y = `${-arrowHeight}px`;
747
- } else if (placedSide === 'top') {
748
- x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
749
- y = `${rects.floating.height + arrowHeight}px`;
750
- } else if (placedSide === 'right') {
751
- x = `${-arrowHeight}px`;
752
- y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
753
- } else if (placedSide === 'left') {
754
- x = `${rects.floating.width + arrowHeight}px`;
755
- y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
756
- }
757
- return {
758
- data: {
759
- x: x,
760
- y: y
761
- }
762
- };
763
- }
764
- })
765
- ;
766
- function $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement) {
767
- const [side, align = 'center'] = placement.split('-');
768
- return [
769
- side,
770
- align
771
- ];
772
- }
773
- const $cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9 = $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9;
774
- const $cf1ac5d9fe0e8206$export$b688253958b8dfe7 = $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d;
775
- const $cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2 = $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc;
776
-
777
- const $f1701beae083dbae$export$602eac185826482c = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
778
- var _globalThis$document;
779
- const { container: container = globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body , ...portalProps } = props;
780
- return container ? /*#__PURE__*/ ReactDOM__default.createPortal(/*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({}, portalProps, {
781
- ref: forwardedRef
782
- })), container) : null;
783
- });
784
-
785
- var effectCar = createSidecarMedium();
786
-
787
- var nothing = function () {
788
- return;
789
- };
790
- /**
791
- * Removes scrollbar from the page and contain the scroll within the Lock
792
- */
793
- var RemoveScroll = React.forwardRef(function (props, parentRef) {
794
- var ref = React.useRef(null);
795
- var _a = React.useState({
796
- onScrollCapture: nothing,
797
- onWheelCapture: nothing,
798
- onTouchMoveCapture: nothing,
799
- }), callbacks = _a[0], setCallbacks = _a[1];
800
- var forwardProps = props.forwardProps, children = props.children, className = props.className, removeScrollBar = props.removeScrollBar, enabled = props.enabled, shards = props.shards, sideCar = props.sideCar, noIsolation = props.noIsolation, inert = props.inert, allowPinchZoom = props.allowPinchZoom, _b = props.as, Container = _b === void 0 ? 'div' : _b, rest = __rest(props, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as"]);
801
- var SideCar = sideCar;
802
- var containerRef = useMergeRefs([ref, parentRef]);
803
- var containerProps = __assign(__assign({}, rest), callbacks);
804
- return (React.createElement(React.Fragment, null,
805
- enabled && (React.createElement(SideCar, { sideCar: effectCar, removeScrollBar: removeScrollBar, shards: shards, noIsolation: noIsolation, inert: inert, setCallbacks: setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref })),
806
- forwardProps ? (React.cloneElement(React.Children.only(children), __assign(__assign({}, containerProps), { ref: containerRef }))) : (React.createElement(Container, __assign({}, containerProps, { className: className, ref: containerRef }), children))));
807
- });
808
- RemoveScroll.defaultProps = {
809
- enabled: true,
810
- removeScrollBar: true,
811
- inert: false,
812
- };
813
- RemoveScroll.classNames = {
814
- fullWidth: fullWidthClassName,
815
- zeroRight: zeroRightClassName,
816
- };
817
-
818
- var passiveSupported = false;
819
- if (typeof window !== 'undefined') {
820
- try {
821
- var options = Object.defineProperty({}, 'passive', {
822
- get: function () {
823
- passiveSupported = true;
824
- return true;
825
- },
826
- });
827
- // @ts-ignore
828
- window.addEventListener('test', options, options);
829
- // @ts-ignore
830
- window.removeEventListener('test', options, options);
831
- }
832
- catch (err) {
833
- passiveSupported = false;
834
- }
835
- }
836
- var nonPassive = passiveSupported ? { passive: false } : false;
837
-
838
- var alwaysContainsScroll = function (node) {
839
- // textarea will always _contain_ scroll inside self. It only can be hidden
840
- return node.tagName === 'TEXTAREA';
841
- };
842
- var elementCanBeScrolled = function (node, overflow) {
843
- var styles = window.getComputedStyle(node);
844
- return (
845
- // not-not-scrollable
846
- styles[overflow] !== 'hidden' &&
847
- // contains scroll inside self
848
- !(styles.overflowY === styles.overflowX && !alwaysContainsScroll(node) && styles[overflow] === 'visible'));
849
- };
850
- var elementCouldBeVScrolled = function (node) { return elementCanBeScrolled(node, 'overflowY'); };
851
- var elementCouldBeHScrolled = function (node) { return elementCanBeScrolled(node, 'overflowX'); };
852
- var locationCouldBeScrolled = function (axis, node) {
853
- var current = node;
854
- do {
855
- // Skip over shadow root
856
- if (typeof ShadowRoot !== 'undefined' && current instanceof ShadowRoot) {
857
- current = current.host;
858
- }
859
- var isScrollable = elementCouldBeScrolled(axis, current);
860
- if (isScrollable) {
861
- var _a = getScrollVariables(axis, current), s = _a[1], d = _a[2];
862
- if (s > d) {
863
- return true;
864
- }
865
- }
866
- current = current.parentNode;
867
- } while (current && current !== document.body);
868
- return false;
869
- };
870
- var getVScrollVariables = function (_a) {
871
- var scrollTop = _a.scrollTop, scrollHeight = _a.scrollHeight, clientHeight = _a.clientHeight;
872
- return [
873
- scrollTop,
874
- scrollHeight,
875
- clientHeight,
876
- ];
877
- };
878
- var getHScrollVariables = function (_a) {
879
- var scrollLeft = _a.scrollLeft, scrollWidth = _a.scrollWidth, clientWidth = _a.clientWidth;
880
- return [
881
- scrollLeft,
882
- scrollWidth,
883
- clientWidth,
884
- ];
885
- };
886
- var elementCouldBeScrolled = function (axis, node) {
887
- return axis === 'v' ? elementCouldBeVScrolled(node) : elementCouldBeHScrolled(node);
888
- };
889
- var getScrollVariables = function (axis, node) {
890
- return axis === 'v' ? getVScrollVariables(node) : getHScrollVariables(node);
891
- };
892
- var getDirectionFactor = function (axis, direction) {
893
- /**
894
- * If the element's direction is rtl (right-to-left), then scrollLeft is 0 when the scrollbar is at its rightmost position,
895
- * and then increasingly negative as you scroll towards the end of the content.
896
- * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft
897
- */
898
- return axis === 'h' && direction === 'rtl' ? -1 : 1;
899
- };
900
- var handleScroll = function (axis, endTarget, event, sourceDelta, noOverscroll) {
901
- var directionFactor = getDirectionFactor(axis, window.getComputedStyle(endTarget).direction);
902
- var delta = directionFactor * sourceDelta;
903
- // find scrollable target
904
- var target = event.target;
905
- var targetInLock = endTarget.contains(target);
906
- var shouldCancelScroll = false;
907
- var isDeltaPositive = delta > 0;
908
- var availableScroll = 0;
909
- var availableScrollTop = 0;
910
- do {
911
- var _a = getScrollVariables(axis, target), position = _a[0], scroll_1 = _a[1], capacity = _a[2];
912
- var elementScroll = scroll_1 - capacity - directionFactor * position;
913
- if (position || elementScroll) {
914
- if (elementCouldBeScrolled(axis, target)) {
915
- availableScroll += elementScroll;
916
- availableScrollTop += position;
917
- }
918
- }
919
- target = target.parentNode;
920
- } while (
921
- // portaled content
922
- (!targetInLock && target !== document.body) ||
923
- // self content
924
- (targetInLock && (endTarget.contains(target) || endTarget === target)));
925
- if (isDeltaPositive && ((noOverscroll && availableScroll === 0) || (!noOverscroll && delta > availableScroll))) {
926
- shouldCancelScroll = true;
927
- }
928
- else if (!isDeltaPositive &&
929
- ((noOverscroll && availableScrollTop === 0) || (!noOverscroll && -delta > availableScrollTop))) {
930
- shouldCancelScroll = true;
931
- }
932
- return shouldCancelScroll;
933
- };
934
-
935
- var getTouchXY = function (event) {
936
- return 'changedTouches' in event ? [event.changedTouches[0].clientX, event.changedTouches[0].clientY] : [0, 0];
937
- };
938
- var getDeltaXY = function (event) { return [event.deltaX, event.deltaY]; };
939
- var extractRef = function (ref) {
940
- return ref && 'current' in ref ? ref.current : ref;
941
- };
942
- var deltaCompare = function (x, y) { return x[0] === y[0] && x[1] === y[1]; };
943
- var generateStyle = function (id) { return "\n .block-interactivity-".concat(id, " {pointer-events: none;}\n .allow-interactivity-").concat(id, " {pointer-events: all;}\n"); };
944
- var idCounter = 0;
945
- var lockStack = [];
946
- function RemoveScrollSideCar(props) {
947
- var shouldPreventQueue = React.useRef([]);
948
- var touchStartRef = React.useRef([0, 0]);
949
- var activeAxis = React.useRef();
950
- var id = React.useState(idCounter++)[0];
951
- var Style = React.useState(function () { return styleSingleton(); })[0];
952
- var lastProps = React.useRef(props);
953
- React.useEffect(function () {
954
- lastProps.current = props;
955
- }, [props]);
956
- React.useEffect(function () {
957
- if (props.inert) {
958
- document.body.classList.add("block-interactivity-".concat(id));
959
- var allow_1 = __spreadArray([props.lockRef.current], (props.shards || []).map(extractRef), true).filter(Boolean);
960
- allow_1.forEach(function (el) { return el.classList.add("allow-interactivity-".concat(id)); });
961
- return function () {
962
- document.body.classList.remove("block-interactivity-".concat(id));
963
- allow_1.forEach(function (el) { return el.classList.remove("allow-interactivity-".concat(id)); });
964
- };
965
- }
966
- return;
967
- }, [props.inert, props.lockRef.current, props.shards]);
968
- var shouldCancelEvent = React.useCallback(function (event, parent) {
969
- if ('touches' in event && event.touches.length === 2) {
970
- return !lastProps.current.allowPinchZoom;
971
- }
972
- var touch = getTouchXY(event);
973
- var touchStart = touchStartRef.current;
974
- var deltaX = 'deltaX' in event ? event.deltaX : touchStart[0] - touch[0];
975
- var deltaY = 'deltaY' in event ? event.deltaY : touchStart[1] - touch[1];
976
- var currentAxis;
977
- var target = event.target;
978
- var moveDirection = Math.abs(deltaX) > Math.abs(deltaY) ? 'h' : 'v';
979
- // allow horizontal touch move on Range inputs. They will not cause any scroll
980
- if ('touches' in event && moveDirection === 'h' && target.type === 'range') {
981
- return false;
982
- }
983
- var canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
984
- if (!canBeScrolledInMainDirection) {
985
- return true;
986
- }
987
- if (canBeScrolledInMainDirection) {
988
- currentAxis = moveDirection;
989
- }
990
- else {
991
- currentAxis = moveDirection === 'v' ? 'h' : 'v';
992
- canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
993
- // other axis might be not scrollable
994
- }
995
- if (!canBeScrolledInMainDirection) {
996
- return false;
997
- }
998
- if (!activeAxis.current && 'changedTouches' in event && (deltaX || deltaY)) {
999
- activeAxis.current = currentAxis;
1000
- }
1001
- if (!currentAxis) {
1002
- return true;
1003
- }
1004
- var cancelingAxis = activeAxis.current || currentAxis;
1005
- return handleScroll(cancelingAxis, parent, event, cancelingAxis === 'h' ? deltaX : deltaY, true);
1006
- }, []);
1007
- var shouldPrevent = React.useCallback(function (_event) {
1008
- var event = _event;
1009
- if (!lockStack.length || lockStack[lockStack.length - 1] !== Style) {
1010
- // not the last active
1011
- return;
1012
- }
1013
- var delta = 'deltaY' in event ? getDeltaXY(event) : getTouchXY(event);
1014
- var sourceEvent = shouldPreventQueue.current.filter(function (e) { return e.name === event.type && e.target === event.target && deltaCompare(e.delta, delta); })[0];
1015
- // self event, and should be canceled
1016
- if (sourceEvent && sourceEvent.should) {
1017
- if (event.cancelable) {
1018
- event.preventDefault();
1019
- }
1020
- return;
1021
- }
1022
- // outside or shard event
1023
- if (!sourceEvent) {
1024
- var shardNodes = (lastProps.current.shards || [])
1025
- .map(extractRef)
1026
- .filter(Boolean)
1027
- .filter(function (node) { return node.contains(event.target); });
1028
- var shouldStop = shardNodes.length > 0 ? shouldCancelEvent(event, shardNodes[0]) : !lastProps.current.noIsolation;
1029
- if (shouldStop) {
1030
- if (event.cancelable) {
1031
- event.preventDefault();
1032
- }
1033
- }
1034
- }
1035
- }, []);
1036
- var shouldCancel = React.useCallback(function (name, delta, target, should) {
1037
- var event = { name: name, delta: delta, target: target, should: should };
1038
- shouldPreventQueue.current.push(event);
1039
- setTimeout(function () {
1040
- shouldPreventQueue.current = shouldPreventQueue.current.filter(function (e) { return e !== event; });
1041
- }, 1);
1042
- }, []);
1043
- var scrollTouchStart = React.useCallback(function (event) {
1044
- touchStartRef.current = getTouchXY(event);
1045
- activeAxis.current = undefined;
1046
- }, []);
1047
- var scrollWheel = React.useCallback(function (event) {
1048
- shouldCancel(event.type, getDeltaXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
1049
- }, []);
1050
- var scrollTouchMove = React.useCallback(function (event) {
1051
- shouldCancel(event.type, getTouchXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
1052
- }, []);
1053
- React.useEffect(function () {
1054
- lockStack.push(Style);
1055
- props.setCallbacks({
1056
- onScrollCapture: scrollWheel,
1057
- onWheelCapture: scrollWheel,
1058
- onTouchMoveCapture: scrollTouchMove,
1059
- });
1060
- document.addEventListener('wheel', shouldPrevent, nonPassive);
1061
- document.addEventListener('touchmove', shouldPrevent, nonPassive);
1062
- document.addEventListener('touchstart', scrollTouchStart, nonPassive);
1063
- return function () {
1064
- lockStack = lockStack.filter(function (inst) { return inst !== Style; });
1065
- document.removeEventListener('wheel', shouldPrevent, nonPassive);
1066
- document.removeEventListener('touchmove', shouldPrevent, nonPassive);
1067
- document.removeEventListener('touchstart', scrollTouchStart, nonPassive);
1068
- };
1069
- }, []);
1070
- var removeScrollBar = props.removeScrollBar, inert = props.inert;
1071
- return (React.createElement(React.Fragment, null,
1072
- inert ? React.createElement(Style, { styles: generateStyle(id) }) : null,
1073
- removeScrollBar ? React.createElement(RemoveScrollBar, { gapMode: "margin" }) : null));
1074
- }
1075
-
1076
- var SideCar = exportSidecar(effectCar, RemoveScrollSideCar);
1077
-
1078
- var ReactRemoveScroll = React.forwardRef(function (props, ref) { return (React.createElement(RemoveScroll, __assign({}, props, { ref: ref, sideCar: SideCar }))); });
1079
- ReactRemoveScroll.classNames = RemoveScroll.classNames;
1080
- var $01b9c$RemoveScroll = ReactRemoveScroll;
1081
-
1082
- const $cc7e05a45900e73f$var$OPEN_KEYS = [
1083
- ' ',
1084
- 'Enter',
1085
- 'ArrowUp',
1086
- 'ArrowDown'
1087
- ];
1088
- const $cc7e05a45900e73f$var$SELECTION_KEYS = [
1089
- ' ',
1090
- 'Enter'
1091
- ];
1092
- /* -------------------------------------------------------------------------------------------------
1093
- * Select
1094
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SELECT_NAME = 'Select';
1095
- const [$cc7e05a45900e73f$var$Collection, $cc7e05a45900e73f$var$useCollection, $cc7e05a45900e73f$var$createCollectionScope] = $e02a7d9cb1dc128c$export$c74125a8e3af6bb2($cc7e05a45900e73f$var$SELECT_NAME);
1096
- const [$cc7e05a45900e73f$var$createSelectContext, $cc7e05a45900e73f$export$286727a75dc039bd] = $c512c27ab02ef895$export$50c7b4e9d9f19c1($cc7e05a45900e73f$var$SELECT_NAME, [
1097
- $cc7e05a45900e73f$var$createCollectionScope,
1098
- $cf1ac5d9fe0e8206$export$722aac194ae923
1099
- ]);
1100
- const $cc7e05a45900e73f$var$usePopperScope = $cf1ac5d9fe0e8206$export$722aac194ae923();
1101
- const [$cc7e05a45900e73f$var$SelectProvider, $cc7e05a45900e73f$var$useSelectContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$SELECT_NAME);
1102
- const [$cc7e05a45900e73f$var$SelectNativeOptionsProvider, $cc7e05a45900e73f$var$useSelectNativeOptionsContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$SELECT_NAME);
1103
- const $cc7e05a45900e73f$export$ef9b1a59e592288f = (props)=>{
1104
- const { __scopeSelect: __scopeSelect , children: children , open: openProp , defaultOpen: defaultOpen , onOpenChange: onOpenChange , value: valueProp , defaultValue: defaultValue , onValueChange: onValueChange , dir: dir , name: name , autoComplete: autoComplete , disabled: disabled , required: required } = props;
1105
- const popperScope = $cc7e05a45900e73f$var$usePopperScope(__scopeSelect);
1106
- const [trigger, setTrigger] = useState(null);
1107
- const [valueNode, setValueNode] = useState(null);
1108
- const [valueNodeHasChildren, setValueNodeHasChildren] = useState(false);
1109
- const direction = $f631663db3294ace$export$b39126d51d94e6f3(dir);
1110
- const [open = false, setOpen] = $71cd76cc60e0454e$export$6f32135080cb4c3({
1111
- prop: openProp,
1112
- defaultProp: defaultOpen,
1113
- onChange: onOpenChange
1114
- });
1115
- const [value, setValue] = $71cd76cc60e0454e$export$6f32135080cb4c3({
1116
- prop: valueProp,
1117
- defaultProp: defaultValue,
1118
- onChange: onValueChange
1119
- });
1120
- const triggerPointerDownPosRef = useRef(null); // We set this to true by default so that events bubble to forms without JS (SSR)
1121
- const isFormControl = trigger ? Boolean(trigger.closest('form')) : true;
1122
- const [nativeOptionsSet, setNativeOptionsSet] = useState(new Set()); // The native `select` only associates the correct default value if the corresponding
1123
- // `option` is rendered as a child **at the same time** as itself.
1124
- // Because it might take a few renders for our items to gather the information to build
1125
- // the native `option`(s), we generate a key on the `select` to make sure React re-builds it
1126
- // each time the options change.
1127
- const nativeSelectKey = Array.from(nativeOptionsSet).map((option)=>option.props.value
1128
- ).join(';');
1129
- return /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9, popperScope, /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectProvider, {
1130
- required: required,
1131
- scope: __scopeSelect,
1132
- trigger: trigger,
1133
- onTriggerChange: setTrigger,
1134
- valueNode: valueNode,
1135
- onValueNodeChange: setValueNode,
1136
- valueNodeHasChildren: valueNodeHasChildren,
1137
- onValueNodeHasChildrenChange: setValueNodeHasChildren,
1138
- contentId: $1746a345f3d73bb7$export$f680877a34711e37(),
1139
- value: value,
1140
- onValueChange: setValue,
1141
- open: open,
1142
- onOpenChange: setOpen,
1143
- dir: direction,
1144
- triggerPointerDownPosRef: triggerPointerDownPosRef,
1145
- disabled: disabled
1146
- }, /*#__PURE__*/ createElement($cc7e05a45900e73f$var$Collection.Provider, {
1147
- scope: __scopeSelect
1148
- }, /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectNativeOptionsProvider, {
1149
- scope: props.__scopeSelect,
1150
- onNativeOptionAdd: useCallback((option)=>{
1151
- setNativeOptionsSet((prev)=>new Set(prev).add(option)
1152
- );
1153
- }, []),
1154
- onNativeOptionRemove: useCallback((option)=>{
1155
- setNativeOptionsSet((prev)=>{
1156
- const optionsSet = new Set(prev);
1157
- optionsSet.delete(option);
1158
- return optionsSet;
1159
- });
1160
- }, [])
1161
- }, children)), isFormControl ? /*#__PURE__*/ createElement($cc7e05a45900e73f$var$BubbleSelect, {
1162
- key: nativeSelectKey,
1163
- "aria-hidden": true,
1164
- required: required,
1165
- tabIndex: -1,
1166
- name: name,
1167
- autoComplete: autoComplete,
1168
- value: value // enable form autofill
1169
- ,
1170
- onChange: (event)=>setValue(event.target.value)
1171
- ,
1172
- disabled: disabled
1173
- }, value === undefined ? /*#__PURE__*/ createElement("option", {
1174
- value: ""
1175
- }) : null, Array.from(nativeOptionsSet)) : null));
1176
- };
1177
- /* -------------------------------------------------------------------------------------------------
1178
- * SelectTrigger
1179
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$TRIGGER_NAME = 'SelectTrigger';
1180
- const $cc7e05a45900e73f$export$3ac1e88a1c0b9f1 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1181
- const { __scopeSelect: __scopeSelect , disabled: disabled = false , ...triggerProps } = props;
1182
- const popperScope = $cc7e05a45900e73f$var$usePopperScope(__scopeSelect);
1183
- const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$TRIGGER_NAME, __scopeSelect);
1184
- const isDisabled = context.disabled || disabled;
1185
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, context.onTriggerChange);
1186
- const getItems = $cc7e05a45900e73f$var$useCollection(__scopeSelect);
1187
- const [searchRef, handleTypeaheadSearch, resetTypeahead] = $cc7e05a45900e73f$var$useTypeaheadSearch((search)=>{
1188
- const enabledItems = getItems().filter((item)=>!item.disabled
1189
- );
1190
- const currentItem = enabledItems.find((item)=>item.value === context.value
1191
- );
1192
- const nextItem = $cc7e05a45900e73f$var$findNextItem(enabledItems, search, currentItem);
1193
- if (nextItem !== undefined) context.onValueChange(nextItem.value);
1194
- });
1195
- const handleOpen = ()=>{
1196
- if (!isDisabled) {
1197
- context.onOpenChange(true); // reset typeahead when we open
1198
- resetTypeahead();
1199
- }
1200
- };
1201
- return /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$b688253958b8dfe7, _extends({
1202
- asChild: true
1203
- }, popperScope), /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.button, _extends({
1204
- type: "button",
1205
- role: "combobox",
1206
- "aria-controls": context.contentId,
1207
- "aria-expanded": context.open,
1208
- "aria-required": context.required,
1209
- "aria-autocomplete": "none",
1210
- dir: context.dir,
1211
- "data-state": context.open ? 'open' : 'closed',
1212
- disabled: isDisabled,
1213
- "data-disabled": isDisabled ? '' : undefined,
1214
- "data-placeholder": $cc7e05a45900e73f$var$shouldShowPlaceholder(context.value) ? '' : undefined
1215
- }, triggerProps, {
1216
- ref: composedRefs // Enable compatibility with native label or custom `Label` "click" for Safari:
1217
- ,
1218
- onClick: $e42e1063c40fb3ef$export$b9ecd428b558ff10(triggerProps.onClick, (event)=>{
1219
- // Whilst browsers generally have no issue focusing the trigger when clicking
1220
- // on a label, Safari seems to struggle with the fact that there's no `onClick`.
1221
- // We force `focus` in this case. Note: this doesn't create any other side-effect
1222
- // because we are preventing default in `onPointerDown` so effectively
1223
- // this only runs for a label "click"
1224
- event.currentTarget.focus();
1225
- }),
1226
- onPointerDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(triggerProps.onPointerDown, (event)=>{
1227
- // prevent implicit pointer capture
1228
- // https://www.w3.org/TR/pointerevents3/#implicit-pointer-capture
1229
- const target = event.target;
1230
- if (target.hasPointerCapture(event.pointerId)) target.releasePointerCapture(event.pointerId);
1231
- // only call handler if it's the left button (mousedown gets triggered by all mouse buttons)
1232
- // but not when the control key is pressed (avoiding MacOS right click)
1233
- if (event.button === 0 && event.ctrlKey === false) {
1234
- handleOpen();
1235
- context.triggerPointerDownPosRef.current = {
1236
- x: Math.round(event.pageX),
1237
- y: Math.round(event.pageY)
1238
- }; // prevent trigger from stealing focus from the active item after opening.
1239
- event.preventDefault();
1240
- }
1241
- }),
1242
- onKeyDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(triggerProps.onKeyDown, (event)=>{
1243
- const isTypingAhead = searchRef.current !== '';
1244
- const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
1245
- if (!isModifierKey && event.key.length === 1) handleTypeaheadSearch(event.key);
1246
- if (isTypingAhead && event.key === ' ') return;
1247
- if ($cc7e05a45900e73f$var$OPEN_KEYS.includes(event.key)) {
1248
- handleOpen();
1249
- event.preventDefault();
1250
- }
1251
- })
1252
- })));
1253
- });
1254
- /* -------------------------------------------------------------------------------------------------
1255
- * SelectValue
1256
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$VALUE_NAME = 'SelectValue';
1257
- const $cc7e05a45900e73f$export$e288731fd71264f0 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1258
- // We ignore `className` and `style` as this part shouldn't be styled.
1259
- const { __scopeSelect: __scopeSelect , className: className , style: style , children: children , placeholder: placeholder = '' , ...valueProps } = props;
1260
- const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$VALUE_NAME, __scopeSelect);
1261
- const { onValueNodeHasChildrenChange: onValueNodeHasChildrenChange } = context;
1262
- const hasChildren = children !== undefined;
1263
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, context.onValueNodeChange);
1264
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
1265
- onValueNodeHasChildrenChange(hasChildren);
1266
- }, [
1267
- onValueNodeHasChildrenChange,
1268
- hasChildren
1269
- ]);
1270
- return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.span, _extends({}, valueProps, {
1271
- ref: composedRefs // we don't want events from the portalled `SelectValue` children to bubble
1272
- ,
1273
- style: {
1274
- pointerEvents: 'none'
1275
- }
1276
- }), $cc7e05a45900e73f$var$shouldShowPlaceholder(context.value) ? /*#__PURE__*/ createElement(Fragment, null, placeholder) : children);
1277
- });
1278
- const $cc7e05a45900e73f$export$99b400cabb58c515 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1279
- const { __scopeSelect: __scopeSelect , children: children , ...iconProps } = props;
1280
- return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.span, _extends({
1281
- "aria-hidden": true
1282
- }, iconProps, {
1283
- ref: forwardedRef
1284
- }), children || '▼');
1285
- });
1286
- const $cc7e05a45900e73f$export$b2af6c9944296213 = (props)=>{
1287
- return /*#__PURE__*/ createElement($f1701beae083dbae$export$602eac185826482c, _extends({
1288
- asChild: true
1289
- }, props));
1290
- };
1291
- /* -------------------------------------------------------------------------------------------------
1292
- * SelectContent
1293
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$CONTENT_NAME = 'SelectContent';
1294
- const $cc7e05a45900e73f$export$c973a4b3cb86a03d = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1295
- const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$CONTENT_NAME, props.__scopeSelect);
1296
- const [fragment, setFragment] = useState(); // setting the fragment in `useLayoutEffect` as `DocumentFragment` doesn't exist on the server
1297
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
1298
- setFragment(new DocumentFragment());
1299
- }, []);
1300
- if (!context.open) {
1301
- const frag = fragment;
1302
- return frag ? /*#__PURE__*/ createPortal(/*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectContentProvider, {
1303
- scope: props.__scopeSelect
1304
- }, /*#__PURE__*/ createElement($cc7e05a45900e73f$var$Collection.Slot, {
1305
- scope: props.__scopeSelect
1306
- }, /*#__PURE__*/ createElement("div", null, props.children))), frag) : null;
1307
- }
1308
- return /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectContentImpl, _extends({}, props, {
1309
- ref: forwardedRef
1310
- }));
1311
- });
1312
- /* -------------------------------------------------------------------------------------------------
1313
- * SelectContentImpl
1314
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$CONTENT_MARGIN = 10;
1315
- const [$cc7e05a45900e73f$var$SelectContentProvider, $cc7e05a45900e73f$var$useSelectContentContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$CONTENT_NAME);
1316
- const $cc7e05a45900e73f$var$SelectContentImpl = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1317
- const { __scopeSelect: __scopeSelect , position: position = 'item-aligned' , onCloseAutoFocus: onCloseAutoFocus , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , side: //
1318
- // PopperContent props
1319
- side , sideOffset: sideOffset , align: align , alignOffset: alignOffset , arrowPadding: arrowPadding , collisionBoundary: collisionBoundary , collisionPadding: collisionPadding , sticky: sticky , hideWhenDetached: hideWhenDetached , avoidCollisions: avoidCollisions , //
1320
- ...contentProps } = props;
1321
- const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$CONTENT_NAME, __scopeSelect);
1322
- const [content, setContent] = useState(null);
1323
- const [viewport, setViewport] = useState(null);
1324
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContent(node)
1325
- );
1326
- const [selectedItem, setSelectedItem] = useState(null);
1327
- const [selectedItemText, setSelectedItemText] = useState(null);
1328
- const getItems = $cc7e05a45900e73f$var$useCollection(__scopeSelect);
1329
- const [isPositioned, setIsPositioned] = useState(false);
1330
- const firstValidItemFoundRef = useRef(false); // aria-hide everything except the content (better supported equivalent to setting aria-modal)
1331
- useEffect(()=>{
1332
- if (content) return hideOthers(content);
1333
- }, [
1334
- content
1335
- ]); // Make sure the whole tree has focus guards as our `Select` may be
1336
- // the last element in the DOM (because of the `Portal`)
1337
- $3db38b7d1fb3fe6a$export$b7ece24a22aeda8c();
1338
- const focusFirst = useCallback((candidates)=>{
1339
- const [firstItem, ...restItems] = getItems().map((item)=>item.ref.current
1340
- );
1341
- const [lastItem] = restItems.slice(-1);
1342
- const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
1343
- for (const candidate of candidates){
1344
- // if focus is already where we want to go, we don't want to keep going through the candidates
1345
- if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
1346
- candidate === null || candidate === void 0 || candidate.scrollIntoView({
1347
- block: 'nearest'
1348
- }); // viewport might have padding so scroll to its edges when focusing first/last items.
1349
- if (candidate === firstItem && viewport) viewport.scrollTop = 0;
1350
- if (candidate === lastItem && viewport) viewport.scrollTop = viewport.scrollHeight;
1351
- candidate === null || candidate === void 0 || candidate.focus();
1352
- if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
1353
- }
1354
- }, [
1355
- getItems,
1356
- viewport
1357
- ]);
1358
- const focusSelectedItem = useCallback(()=>focusFirst([
1359
- selectedItem,
1360
- content
1361
- ])
1362
- , [
1363
- focusFirst,
1364
- selectedItem,
1365
- content
1366
- ]); // Since this is not dependent on layout, we want to ensure this runs at the same time as
1367
- // other effects across components. Hence why we don't call `focusSelectedItem` inside `position`.
1368
- useEffect(()=>{
1369
- if (isPositioned) focusSelectedItem();
1370
- }, [
1371
- isPositioned,
1372
- focusSelectedItem
1373
- ]); // prevent selecting items on `pointerup` in some cases after opening from `pointerdown`
1374
- // and close on `pointerup` outside.
1375
- const { onOpenChange: onOpenChange , triggerPointerDownPosRef: triggerPointerDownPosRef } = context;
1376
- useEffect(()=>{
1377
- if (content) {
1378
- let pointerMoveDelta = {
1379
- x: 0,
1380
- y: 0
1381
- };
1382
- const handlePointerMove = (event)=>{
1383
- var _triggerPointerDownPo, _triggerPointerDownPo2, _triggerPointerDownPo3, _triggerPointerDownPo4;
1384
- pointerMoveDelta = {
1385
- x: Math.abs(Math.round(event.pageX) - ((_triggerPointerDownPo = (_triggerPointerDownPo2 = triggerPointerDownPosRef.current) === null || _triggerPointerDownPo2 === void 0 ? void 0 : _triggerPointerDownPo2.x) !== null && _triggerPointerDownPo !== void 0 ? _triggerPointerDownPo : 0)),
1386
- y: Math.abs(Math.round(event.pageY) - ((_triggerPointerDownPo3 = (_triggerPointerDownPo4 = triggerPointerDownPosRef.current) === null || _triggerPointerDownPo4 === void 0 ? void 0 : _triggerPointerDownPo4.y) !== null && _triggerPointerDownPo3 !== void 0 ? _triggerPointerDownPo3 : 0))
1387
- };
1388
- };
1389
- const handlePointerUp = (event)=>{
1390
- // If the pointer hasn't moved by a certain threshold then we prevent selecting item on `pointerup`.
1391
- if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) event.preventDefault();
1392
- else // otherwise, if the event was outside the content, close.
1393
- if (!content.contains(event.target)) onOpenChange(false);
1394
- document.removeEventListener('pointermove', handlePointerMove);
1395
- triggerPointerDownPosRef.current = null;
1396
- };
1397
- if (triggerPointerDownPosRef.current !== null) {
1398
- document.addEventListener('pointermove', handlePointerMove);
1399
- document.addEventListener('pointerup', handlePointerUp, {
1400
- capture: true,
1401
- once: true
1402
- });
1403
- }
1404
- return ()=>{
1405
- document.removeEventListener('pointermove', handlePointerMove);
1406
- document.removeEventListener('pointerup', handlePointerUp, {
1407
- capture: true
1408
- });
1409
- };
1410
- }
1411
- }, [
1412
- content,
1413
- onOpenChange,
1414
- triggerPointerDownPosRef
1415
- ]);
1416
- useEffect(()=>{
1417
- const close = ()=>onOpenChange(false)
1418
- ;
1419
- window.addEventListener('blur', close);
1420
- window.addEventListener('resize', close);
1421
- return ()=>{
1422
- window.removeEventListener('blur', close);
1423
- window.removeEventListener('resize', close);
1424
- };
1425
- }, [
1426
- onOpenChange
1427
- ]);
1428
- const [searchRef, handleTypeaheadSearch] = $cc7e05a45900e73f$var$useTypeaheadSearch((search)=>{
1429
- const enabledItems = getItems().filter((item)=>!item.disabled
1430
- );
1431
- const currentItem = enabledItems.find((item)=>item.ref.current === document.activeElement
1432
- );
1433
- const nextItem = $cc7e05a45900e73f$var$findNextItem(enabledItems, search, currentItem);
1434
- if (nextItem) /**
1435
- * Imperative focus during keydown is risky so we prevent React's batching updates
1436
- * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
1437
- */ setTimeout(()=>nextItem.ref.current.focus()
1438
- );
1439
- });
1440
- const itemRefCallback = useCallback((node, value, disabled)=>{
1441
- const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
1442
- const isSelectedItem = context.value !== undefined && context.value === value;
1443
- if (isSelectedItem || isFirstValidItem) {
1444
- setSelectedItem(node);
1445
- if (isFirstValidItem) firstValidItemFoundRef.current = true;
1446
- }
1447
- }, [
1448
- context.value
1449
- ]);
1450
- const handleItemLeave = useCallback(()=>content === null || content === void 0 ? void 0 : content.focus()
1451
- , [
1452
- content
1453
- ]);
1454
- const itemTextRefCallback = useCallback((node, value, disabled)=>{
1455
- const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
1456
- const isSelectedItem = context.value !== undefined && context.value === value;
1457
- if (isSelectedItem || isFirstValidItem) setSelectedItemText(node);
1458
- }, [
1459
- context.value
1460
- ]);
1461
- const SelectPosition = position === 'popper' ? $cc7e05a45900e73f$var$SelectPopperPosition : $cc7e05a45900e73f$var$SelectItemAlignedPosition; // Silently ignore props that are not supported by `SelectItemAlignedPosition`
1462
- const popperContentProps = SelectPosition === $cc7e05a45900e73f$var$SelectPopperPosition ? {
1463
- side: side,
1464
- sideOffset: sideOffset,
1465
- align: align,
1466
- alignOffset: alignOffset,
1467
- arrowPadding: arrowPadding,
1468
- collisionBoundary: collisionBoundary,
1469
- collisionPadding: collisionPadding,
1470
- sticky: sticky,
1471
- hideWhenDetached: hideWhenDetached,
1472
- avoidCollisions: avoidCollisions
1473
- } : {};
1474
- return /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectContentProvider, {
1475
- scope: __scopeSelect,
1476
- content: content,
1477
- viewport: viewport,
1478
- onViewportChange: setViewport,
1479
- itemRefCallback: itemRefCallback,
1480
- selectedItem: selectedItem,
1481
- onItemLeave: handleItemLeave,
1482
- itemTextRefCallback: itemTextRefCallback,
1483
- focusSelectedItem: focusSelectedItem,
1484
- selectedItemText: selectedItemText,
1485
- position: position,
1486
- isPositioned: isPositioned,
1487
- searchRef: searchRef
1488
- }, /*#__PURE__*/ createElement($01b9c$RemoveScroll, {
1489
- as: $5e63c961fc1ce211$export$8c6ed5c666ac1360,
1490
- allowPinchZoom: true
1491
- }, /*#__PURE__*/ createElement($d3863c46a17e8a28$export$20e40289641fbbb6, {
1492
- asChild: true // we make sure we're not trapping once it's been closed
1493
- ,
1494
- trapped: context.open,
1495
- onMountAutoFocus: (event)=>{
1496
- // we prevent open autofocus because we manually focus the selected item
1497
- event.preventDefault();
1498
- },
1499
- onUnmountAutoFocus: $e42e1063c40fb3ef$export$b9ecd428b558ff10(onCloseAutoFocus, (event)=>{
1500
- var _context$trigger;
1501
- (_context$trigger = context.trigger) === null || _context$trigger === void 0 || _context$trigger.focus({
1502
- preventScroll: true
1503
- });
1504
- event.preventDefault();
1505
- })
1506
- }, /*#__PURE__*/ createElement($5cb92bef7577960e$export$177fb62ff3ec1f22, {
1507
- asChild: true,
1508
- disableOutsidePointerEvents: true,
1509
- onEscapeKeyDown: onEscapeKeyDown,
1510
- onPointerDownOutside: onPointerDownOutside // When focus is trapped, a focusout event may still happen.
1511
- ,
1512
- onFocusOutside: (event)=>event.preventDefault()
1513
- ,
1514
- onDismiss: ()=>context.onOpenChange(false)
1515
- }, /*#__PURE__*/ createElement(SelectPosition, _extends({
1516
- role: "listbox",
1517
- id: context.contentId,
1518
- "data-state": context.open ? 'open' : 'closed',
1519
- dir: context.dir,
1520
- onContextMenu: (event)=>event.preventDefault()
1521
- }, contentProps, popperContentProps, {
1522
- onPlaced: ()=>setIsPositioned(true)
1523
- ,
1524
- ref: composedRefs,
1525
- style: {
1526
- // flex layout so we can place the scroll buttons properly
1527
- display: 'flex',
1528
- flexDirection: 'column',
1529
- // reset the outline by default as the content MAY get focused
1530
- outline: 'none',
1531
- ...contentProps.style
1532
- },
1533
- onKeyDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(contentProps.onKeyDown, (event)=>{
1534
- const isModifierKey = event.ctrlKey || event.altKey || event.metaKey; // select should not be navigated using tab key so we prevent it
1535
- if (event.key === 'Tab') event.preventDefault();
1536
- if (!isModifierKey && event.key.length === 1) handleTypeaheadSearch(event.key);
1537
- if ([
1538
- 'ArrowUp',
1539
- 'ArrowDown',
1540
- 'Home',
1541
- 'End'
1542
- ].includes(event.key)) {
1543
- const items = getItems().filter((item)=>!item.disabled
1544
- );
1545
- let candidateNodes = items.map((item)=>item.ref.current
1546
- );
1547
- if ([
1548
- 'ArrowUp',
1549
- 'End'
1550
- ].includes(event.key)) candidateNodes = candidateNodes.slice().reverse();
1551
- if ([
1552
- 'ArrowUp',
1553
- 'ArrowDown'
1554
- ].includes(event.key)) {
1555
- const currentElement = event.target;
1556
- const currentIndex = candidateNodes.indexOf(currentElement);
1557
- candidateNodes = candidateNodes.slice(currentIndex + 1);
1558
- }
1559
- /**
1560
- * Imperative focus during keydown is risky so we prevent React's batching updates
1561
- * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
1562
- */ setTimeout(()=>focusFirst(candidateNodes)
1563
- );
1564
- event.preventDefault();
1565
- }
1566
- })
1567
- }))))));
1568
- });
1569
- const $cc7e05a45900e73f$var$SelectItemAlignedPosition = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1570
- const { __scopeSelect: __scopeSelect , onPlaced: onPlaced , ...popperProps } = props;
1571
- const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$CONTENT_NAME, __scopeSelect);
1572
- const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$CONTENT_NAME, __scopeSelect);
1573
- const [contentWrapper, setContentWrapper] = useState(null);
1574
- const [content, setContent] = useState(null);
1575
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContent(node)
1576
- );
1577
- const getItems = $cc7e05a45900e73f$var$useCollection(__scopeSelect);
1578
- const shouldExpandOnScrollRef = useRef(false);
1579
- const shouldRepositionRef = useRef(true);
1580
- const { viewport: viewport , selectedItem: selectedItem , selectedItemText: selectedItemText , focusSelectedItem: focusSelectedItem } = contentContext;
1581
- const position = useCallback(()=>{
1582
- if (context.trigger && context.valueNode && contentWrapper && content && viewport && selectedItem && selectedItemText) {
1583
- const triggerRect = context.trigger.getBoundingClientRect(); // -----------------------------------------------------------------------------------------
1584
- // Horizontal positioning
1585
- // -----------------------------------------------------------------------------------------
1586
- const contentRect = content.getBoundingClientRect();
1587
- const valueNodeRect = context.valueNode.getBoundingClientRect();
1588
- const itemTextRect = selectedItemText.getBoundingClientRect();
1589
- if (context.dir !== 'rtl') {
1590
- const itemTextOffset = itemTextRect.left - contentRect.left;
1591
- const left = valueNodeRect.left - itemTextOffset;
1592
- const leftDelta = triggerRect.left - left;
1593
- const minContentWidth = triggerRect.width + leftDelta;
1594
- const contentWidth = Math.max(minContentWidth, contentRect.width);
1595
- const rightEdge = window.innerWidth - $cc7e05a45900e73f$var$CONTENT_MARGIN;
1596
- const clampedLeft = $ae6933e535247d3d$export$7d15b64cf5a3a4c4(left, [
1597
- $cc7e05a45900e73f$var$CONTENT_MARGIN,
1598
- rightEdge - contentWidth
1599
- ]);
1600
- contentWrapper.style.minWidth = minContentWidth + 'px';
1601
- contentWrapper.style.left = clampedLeft + 'px';
1602
- } else {
1603
- const itemTextOffset = contentRect.right - itemTextRect.right;
1604
- const right = window.innerWidth - valueNodeRect.right - itemTextOffset;
1605
- const rightDelta = window.innerWidth - triggerRect.right - right;
1606
- const minContentWidth = triggerRect.width + rightDelta;
1607
- const contentWidth = Math.max(minContentWidth, contentRect.width);
1608
- const leftEdge = window.innerWidth - $cc7e05a45900e73f$var$CONTENT_MARGIN;
1609
- const clampedRight = $ae6933e535247d3d$export$7d15b64cf5a3a4c4(right, [
1610
- $cc7e05a45900e73f$var$CONTENT_MARGIN,
1611
- leftEdge - contentWidth
1612
- ]);
1613
- contentWrapper.style.minWidth = minContentWidth + 'px';
1614
- contentWrapper.style.right = clampedRight + 'px';
1615
- } // -----------------------------------------------------------------------------------------
1616
- // Vertical positioning
1617
- // -----------------------------------------------------------------------------------------
1618
- const items = getItems();
1619
- const availableHeight = window.innerHeight - $cc7e05a45900e73f$var$CONTENT_MARGIN * 2;
1620
- const itemsHeight = viewport.scrollHeight;
1621
- const contentStyles = window.getComputedStyle(content);
1622
- const contentBorderTopWidth = parseInt(contentStyles.borderTopWidth, 10);
1623
- const contentPaddingTop = parseInt(contentStyles.paddingTop, 10);
1624
- const contentBorderBottomWidth = parseInt(contentStyles.borderBottomWidth, 10);
1625
- const contentPaddingBottom = parseInt(contentStyles.paddingBottom, 10);
1626
- const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth; // prettier-ignore
1627
- const minContentHeight = Math.min(selectedItem.offsetHeight * 5, fullContentHeight);
1628
- const viewportStyles = window.getComputedStyle(viewport);
1629
- const viewportPaddingTop = parseInt(viewportStyles.paddingTop, 10);
1630
- const viewportPaddingBottom = parseInt(viewportStyles.paddingBottom, 10);
1631
- const topEdgeToTriggerMiddle = triggerRect.top + triggerRect.height / 2 - $cc7e05a45900e73f$var$CONTENT_MARGIN;
1632
- const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle;
1633
- const selectedItemHalfHeight = selectedItem.offsetHeight / 2;
1634
- const itemOffsetMiddle = selectedItem.offsetTop + selectedItemHalfHeight;
1635
- const contentTopToItemMiddle = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle;
1636
- const itemMiddleToContentBottom = fullContentHeight - contentTopToItemMiddle;
1637
- const willAlignWithoutTopOverflow = contentTopToItemMiddle <= topEdgeToTriggerMiddle;
1638
- if (willAlignWithoutTopOverflow) {
1639
- const isLastItem = selectedItem === items[items.length - 1].ref.current;
1640
- contentWrapper.style.bottom = "0px";
1641
- const viewportOffsetBottom = content.clientHeight - viewport.offsetTop - viewport.offsetHeight;
1642
- const clampedTriggerMiddleToBottomEdge = Math.max(triggerMiddleToBottomEdge, selectedItemHalfHeight + (isLastItem ? viewportPaddingBottom : 0) + viewportOffsetBottom + contentBorderBottomWidth);
1643
- const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge;
1644
- contentWrapper.style.height = height + 'px';
1645
- } else {
1646
- const isFirstItem = selectedItem === items[0].ref.current;
1647
- contentWrapper.style.top = "0px";
1648
- const clampedTopEdgeToTriggerMiddle = Math.max(topEdgeToTriggerMiddle, contentBorderTopWidth + viewport.offsetTop + (isFirstItem ? viewportPaddingTop : 0) + selectedItemHalfHeight);
1649
- const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom;
1650
- contentWrapper.style.height = height + 'px';
1651
- viewport.scrollTop = contentTopToItemMiddle - topEdgeToTriggerMiddle + viewport.offsetTop;
1652
- }
1653
- contentWrapper.style.margin = `${$cc7e05a45900e73f$var$CONTENT_MARGIN}px 0`;
1654
- contentWrapper.style.minHeight = minContentHeight + 'px';
1655
- contentWrapper.style.maxHeight = availableHeight + 'px'; // -----------------------------------------------------------------------------------------
1656
- onPlaced === null || onPlaced === void 0 || onPlaced(); // we don't want the initial scroll position adjustment to trigger "expand on scroll"
1657
- // so we explicitly turn it on only after they've registered.
1658
- requestAnimationFrame(()=>shouldExpandOnScrollRef.current = true
1659
- );
1660
- }
1661
- }, [
1662
- getItems,
1663
- context.trigger,
1664
- context.valueNode,
1665
- contentWrapper,
1666
- content,
1667
- viewport,
1668
- selectedItem,
1669
- selectedItemText,
1670
- context.dir,
1671
- onPlaced
1672
- ]);
1673
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>position()
1674
- , [
1675
- position
1676
- ]); // copy z-index from content to wrapper
1677
- const [contentZIndex, setContentZIndex] = useState();
1678
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
1679
- if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
1680
- }, [
1681
- content
1682
- ]); // When the viewport becomes scrollable at the top, the scroll up button will mount.
1683
- // Because it is part of the normal flow, it will push down the viewport, thus throwing our
1684
- // trigger => selectedItem alignment off by the amount the viewport was pushed down.
1685
- // We wait for this to happen and then re-run the positining logic one more time to account for it.
1686
- const handleScrollButtonChange = useCallback((node)=>{
1687
- if (node && shouldRepositionRef.current === true) {
1688
- position();
1689
- focusSelectedItem === null || focusSelectedItem === void 0 || focusSelectedItem();
1690
- shouldRepositionRef.current = false;
1691
- }
1692
- }, [
1693
- position,
1694
- focusSelectedItem
1695
- ]);
1696
- return /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectViewportProvider, {
1697
- scope: __scopeSelect,
1698
- contentWrapper: contentWrapper,
1699
- shouldExpandOnScrollRef: shouldExpandOnScrollRef,
1700
- onScrollButtonChange: handleScrollButtonChange
1701
- }, /*#__PURE__*/ createElement("div", {
1702
- ref: setContentWrapper,
1703
- style: {
1704
- display: 'flex',
1705
- flexDirection: 'column',
1706
- position: 'fixed',
1707
- zIndex: contentZIndex
1708
- }
1709
- }, /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({}, popperProps, {
1710
- ref: composedRefs,
1711
- style: {
1712
- // When we get the height of the content, it includes borders. If we were to set
1713
- // the height without having `boxSizing: 'border-box'` it would be too big.
1714
- boxSizing: 'border-box',
1715
- // We need to ensure the content doesn't get taller than the wrapper
1716
- maxHeight: '100%',
1717
- ...popperProps.style
1718
- }
1719
- }))));
1720
- });
1721
- const $cc7e05a45900e73f$var$SelectPopperPosition = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1722
- const { __scopeSelect: __scopeSelect , align: align = 'start' , collisionPadding: collisionPadding = $cc7e05a45900e73f$var$CONTENT_MARGIN , ...popperProps } = props;
1723
- const popperScope = $cc7e05a45900e73f$var$usePopperScope(__scopeSelect);
1724
- return /*#__PURE__*/ createElement($cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2, _extends({}, popperScope, popperProps, {
1725
- ref: forwardedRef,
1726
- align: align,
1727
- collisionPadding: collisionPadding,
1728
- style: {
1729
- // Ensure border-box for floating-ui calculations
1730
- boxSizing: 'border-box',
1731
- ...popperProps.style,
1732
- '--radix-select-content-transform-origin': 'var(--radix-popper-transform-origin)',
1733
- '--radix-select-content-available-width': 'var(--radix-popper-available-width)',
1734
- '--radix-select-content-available-height': 'var(--radix-popper-available-height)',
1735
- '--radix-select-trigger-width': 'var(--radix-popper-anchor-width)',
1736
- '--radix-select-trigger-height': 'var(--radix-popper-anchor-height)'
1737
- }
1738
- }));
1739
- });
1740
- /* -------------------------------------------------------------------------------------------------
1741
- * SelectViewport
1742
- * -----------------------------------------------------------------------------------------------*/ const [$cc7e05a45900e73f$var$SelectViewportProvider, $cc7e05a45900e73f$var$useSelectViewportContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$CONTENT_NAME, {});
1743
- const $cc7e05a45900e73f$var$VIEWPORT_NAME = 'SelectViewport';
1744
- const $cc7e05a45900e73f$export$9ed6e7b40248d36d = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1745
- const { __scopeSelect: __scopeSelect , ...viewportProps } = props;
1746
- const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$VIEWPORT_NAME, __scopeSelect);
1747
- const viewportContext = $cc7e05a45900e73f$var$useSelectViewportContext($cc7e05a45900e73f$var$VIEWPORT_NAME, __scopeSelect);
1748
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, contentContext.onViewportChange);
1749
- const prevScrollTopRef = useRef(0);
1750
- return /*#__PURE__*/ createElement(Fragment, null, /*#__PURE__*/ createElement("style", {
1751
- dangerouslySetInnerHTML: {
1752
- __html: `[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}`
1753
- }
1754
- }), /*#__PURE__*/ createElement($cc7e05a45900e73f$var$Collection.Slot, {
1755
- scope: __scopeSelect
1756
- }, /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({
1757
- "data-radix-select-viewport": "",
1758
- role: "presentation"
1759
- }, viewportProps, {
1760
- ref: composedRefs,
1761
- style: {
1762
- // we use position: 'relative' here on the `viewport` so that when we call
1763
- // `selectedItem.offsetTop` in calculations, the offset is relative to the viewport
1764
- // (independent of the scrollUpButton).
1765
- position: 'relative',
1766
- flex: 1,
1767
- overflow: 'auto',
1768
- ...viewportProps.style
1769
- },
1770
- onScroll: $e42e1063c40fb3ef$export$b9ecd428b558ff10(viewportProps.onScroll, (event)=>{
1771
- const viewport = event.currentTarget;
1772
- const { contentWrapper: contentWrapper , shouldExpandOnScrollRef: shouldExpandOnScrollRef } = viewportContext;
1773
- if (shouldExpandOnScrollRef !== null && shouldExpandOnScrollRef !== void 0 && shouldExpandOnScrollRef.current && contentWrapper) {
1774
- const scrolledBy = Math.abs(prevScrollTopRef.current - viewport.scrollTop);
1775
- if (scrolledBy > 0) {
1776
- const availableHeight = window.innerHeight - $cc7e05a45900e73f$var$CONTENT_MARGIN * 2;
1777
- const cssMinHeight = parseFloat(contentWrapper.style.minHeight);
1778
- const cssHeight = parseFloat(contentWrapper.style.height);
1779
- const prevHeight = Math.max(cssMinHeight, cssHeight);
1780
- if (prevHeight < availableHeight) {
1781
- const nextHeight = prevHeight + scrolledBy;
1782
- const clampedNextHeight = Math.min(availableHeight, nextHeight);
1783
- const heightDiff = nextHeight - clampedNextHeight;
1784
- contentWrapper.style.height = clampedNextHeight + 'px';
1785
- if (contentWrapper.style.bottom === '0px') {
1786
- viewport.scrollTop = heightDiff > 0 ? heightDiff : 0; // ensure the content stays pinned to the bottom
1787
- contentWrapper.style.justifyContent = 'flex-end';
1788
- }
1789
- }
1790
- }
1791
- }
1792
- prevScrollTopRef.current = viewport.scrollTop;
1793
- })
1794
- }))));
1795
- });
1796
- /* -------------------------------------------------------------------------------------------------
1797
- * SelectGroup
1798
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$GROUP_NAME = 'SelectGroup';
1799
- $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$GROUP_NAME);
1800
- /* -------------------------------------------------------------------------------------------------
1801
- * SelectItem
1802
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$ITEM_NAME = 'SelectItem';
1803
- const [$cc7e05a45900e73f$var$SelectItemContextProvider, $cc7e05a45900e73f$var$useSelectItemContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$ITEM_NAME);
1804
- const $cc7e05a45900e73f$export$13ef48a934230896 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1805
- const { __scopeSelect: __scopeSelect , value: value , disabled: disabled = false , textValue: textValueProp , ...itemProps } = props;
1806
- const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$ITEM_NAME, __scopeSelect);
1807
- const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$ITEM_NAME, __scopeSelect);
1808
- const isSelected = context.value === value;
1809
- const [textValue, setTextValue] = useState(textValueProp !== null && textValueProp !== void 0 ? textValueProp : '');
1810
- const [isFocused, setIsFocused] = useState(false);
1811
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>{
1812
- var _contentContext$itemR;
1813
- return (_contentContext$itemR = contentContext.itemRefCallback) === null || _contentContext$itemR === void 0 ? void 0 : _contentContext$itemR.call(contentContext, node, value, disabled);
1814
- });
1815
- const textId = $1746a345f3d73bb7$export$f680877a34711e37();
1816
- const handleSelect = ()=>{
1817
- if (!disabled) {
1818
- context.onValueChange(value);
1819
- context.onOpenChange(false);
1820
- }
1821
- };
1822
- if (value === '') throw new Error('A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder.');
1823
- return /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectItemContextProvider, {
1824
- scope: __scopeSelect,
1825
- value: value,
1826
- disabled: disabled,
1827
- textId: textId,
1828
- isSelected: isSelected,
1829
- onItemTextChange: useCallback((node)=>{
1830
- setTextValue((prevTextValue)=>{
1831
- var _node$textContent;
1832
- return prevTextValue || ((_node$textContent = node === null || node === void 0 ? void 0 : node.textContent) !== null && _node$textContent !== void 0 ? _node$textContent : '').trim();
1833
- });
1834
- }, [])
1835
- }, /*#__PURE__*/ createElement($cc7e05a45900e73f$var$Collection.ItemSlot, {
1836
- scope: __scopeSelect,
1837
- value: value,
1838
- disabled: disabled,
1839
- textValue: textValue
1840
- }, /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({
1841
- role: "option",
1842
- "aria-labelledby": textId,
1843
- "data-highlighted": isFocused ? '' : undefined // `isFocused` caveat fixes stuttering in VoiceOver
1844
- ,
1845
- "aria-selected": isSelected && isFocused,
1846
- "data-state": isSelected ? 'checked' : 'unchecked',
1847
- "aria-disabled": disabled || undefined,
1848
- "data-disabled": disabled ? '' : undefined,
1849
- tabIndex: disabled ? undefined : -1
1850
- }, itemProps, {
1851
- ref: composedRefs,
1852
- onFocus: $e42e1063c40fb3ef$export$b9ecd428b558ff10(itemProps.onFocus, ()=>setIsFocused(true)
1853
- ),
1854
- onBlur: $e42e1063c40fb3ef$export$b9ecd428b558ff10(itemProps.onBlur, ()=>setIsFocused(false)
1855
- ),
1856
- onPointerUp: $e42e1063c40fb3ef$export$b9ecd428b558ff10(itemProps.onPointerUp, handleSelect),
1857
- onPointerMove: $e42e1063c40fb3ef$export$b9ecd428b558ff10(itemProps.onPointerMove, (event)=>{
1858
- if (disabled) {
1859
- var _contentContext$onIte;
1860
- (_contentContext$onIte = contentContext.onItemLeave) === null || _contentContext$onIte === void 0 || _contentContext$onIte.call(contentContext);
1861
- } else // even though safari doesn't support this option, it's acceptable
1862
- // as it only means it might scroll a few pixels when using the pointer.
1863
- event.currentTarget.focus({
1864
- preventScroll: true
1865
- });
1866
- }),
1867
- onPointerLeave: $e42e1063c40fb3ef$export$b9ecd428b558ff10(itemProps.onPointerLeave, (event)=>{
1868
- if (event.currentTarget === document.activeElement) {
1869
- var _contentContext$onIte2;
1870
- (_contentContext$onIte2 = contentContext.onItemLeave) === null || _contentContext$onIte2 === void 0 || _contentContext$onIte2.call(contentContext);
1871
- }
1872
- }),
1873
- onKeyDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(itemProps.onKeyDown, (event)=>{
1874
- var _contentContext$searc;
1875
- const isTypingAhead = ((_contentContext$searc = contentContext.searchRef) === null || _contentContext$searc === void 0 ? void 0 : _contentContext$searc.current) !== '';
1876
- if (isTypingAhead && event.key === ' ') return;
1877
- if ($cc7e05a45900e73f$var$SELECTION_KEYS.includes(event.key)) handleSelect(); // prevent page scroll if using the space key to select an item
1878
- if (event.key === ' ') event.preventDefault();
1879
- })
1880
- }))));
1881
- });
1882
- /* -------------------------------------------------------------------------------------------------
1883
- * SelectItemText
1884
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$ITEM_TEXT_NAME = 'SelectItemText';
1885
- const $cc7e05a45900e73f$export$3572fb0fb821ff49 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1886
- // We ignore `className` and `style` as this part shouldn't be styled.
1887
- const { __scopeSelect: __scopeSelect , className: className , style: style , ...itemTextProps } = props;
1888
- const context = $cc7e05a45900e73f$var$useSelectContext($cc7e05a45900e73f$var$ITEM_TEXT_NAME, __scopeSelect);
1889
- const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$ITEM_TEXT_NAME, __scopeSelect);
1890
- const itemContext = $cc7e05a45900e73f$var$useSelectItemContext($cc7e05a45900e73f$var$ITEM_TEXT_NAME, __scopeSelect);
1891
- const nativeOptionsContext = $cc7e05a45900e73f$var$useSelectNativeOptionsContext($cc7e05a45900e73f$var$ITEM_TEXT_NAME, __scopeSelect);
1892
- const [itemTextNode, setItemTextNode] = useState(null);
1893
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setItemTextNode(node)
1894
- , itemContext.onItemTextChange, (node)=>{
1895
- var _contentContext$itemT;
1896
- return (_contentContext$itemT = contentContext.itemTextRefCallback) === null || _contentContext$itemT === void 0 ? void 0 : _contentContext$itemT.call(contentContext, node, itemContext.value, itemContext.disabled);
1897
- });
1898
- const textContent = itemTextNode === null || itemTextNode === void 0 ? void 0 : itemTextNode.textContent;
1899
- const nativeOption = useMemo(()=>/*#__PURE__*/ createElement("option", {
1900
- key: itemContext.value,
1901
- value: itemContext.value,
1902
- disabled: itemContext.disabled
1903
- }, textContent)
1904
- , [
1905
- itemContext.disabled,
1906
- itemContext.value,
1907
- textContent
1908
- ]);
1909
- const { onNativeOptionAdd: onNativeOptionAdd , onNativeOptionRemove: onNativeOptionRemove } = nativeOptionsContext;
1910
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
1911
- onNativeOptionAdd(nativeOption);
1912
- return ()=>onNativeOptionRemove(nativeOption)
1913
- ;
1914
- }, [
1915
- onNativeOptionAdd,
1916
- onNativeOptionRemove,
1917
- nativeOption
1918
- ]);
1919
- return /*#__PURE__*/ createElement(Fragment, null, /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.span, _extends({
1920
- id: itemContext.textId
1921
- }, itemTextProps, {
1922
- ref: composedRefs
1923
- })), itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren ? /*#__PURE__*/ createPortal(itemTextProps.children, context.valueNode) : null);
1924
- });
1925
- /* -------------------------------------------------------------------------------------------------
1926
- * SelectItemIndicator
1927
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$ITEM_INDICATOR_NAME = 'SelectItemIndicator';
1928
- const $cc7e05a45900e73f$export$6b9198de19accfe6 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1929
- const { __scopeSelect: __scopeSelect , ...itemIndicatorProps } = props;
1930
- const itemContext = $cc7e05a45900e73f$var$useSelectItemContext($cc7e05a45900e73f$var$ITEM_INDICATOR_NAME, __scopeSelect);
1931
- return itemContext.isSelected ? /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.span, _extends({
1932
- "aria-hidden": true
1933
- }, itemIndicatorProps, {
1934
- ref: forwardedRef
1935
- })) : null;
1936
- });
1937
- /* -------------------------------------------------------------------------------------------------
1938
- * SelectScrollUpButton
1939
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SCROLL_UP_BUTTON_NAME = 'SelectScrollUpButton';
1940
- const $cc7e05a45900e73f$export$d8117927658af6d7 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1941
- const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
1942
- const viewportContext = $cc7e05a45900e73f$var$useSelectViewportContext($cc7e05a45900e73f$var$SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
1943
- const [canScrollUp1, setCanScrollUp] = useState(false);
1944
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, viewportContext.onScrollButtonChange);
1945
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
1946
- if (contentContext.viewport && contentContext.isPositioned) {
1947
- const viewport = contentContext.viewport;
1948
- function handleScroll() {
1949
- const canScrollUp = viewport.scrollTop > 0;
1950
- setCanScrollUp(canScrollUp);
1951
- }
1952
- handleScroll();
1953
- viewport.addEventListener('scroll', handleScroll);
1954
- return ()=>viewport.removeEventListener('scroll', handleScroll)
1955
- ;
1956
- }
1957
- }, [
1958
- contentContext.viewport,
1959
- contentContext.isPositioned
1960
- ]);
1961
- return canScrollUp1 ? /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectScrollButtonImpl, _extends({}, props, {
1962
- ref: composedRefs,
1963
- onAutoScroll: ()=>{
1964
- const { viewport: viewport , selectedItem: selectedItem } = contentContext;
1965
- if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop - selectedItem.offsetHeight;
1966
- }
1967
- })) : null;
1968
- });
1969
- /* -------------------------------------------------------------------------------------------------
1970
- * SelectScrollDownButton
1971
- * -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SCROLL_DOWN_BUTTON_NAME = 'SelectScrollDownButton';
1972
- const $cc7e05a45900e73f$export$ff951e476c12189 = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
1973
- const contentContext = $cc7e05a45900e73f$var$useSelectContentContext($cc7e05a45900e73f$var$SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
1974
- const viewportContext = $cc7e05a45900e73f$var$useSelectViewportContext($cc7e05a45900e73f$var$SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
1975
- const [canScrollDown1, setCanScrollDown] = useState(false);
1976
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, viewportContext.onScrollButtonChange);
1977
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
1978
- if (contentContext.viewport && contentContext.isPositioned) {
1979
- const viewport = contentContext.viewport;
1980
- function handleScroll() {
1981
- const maxScroll = viewport.scrollHeight - viewport.clientHeight; // we use Math.ceil here because if the UI is zoomed-in
1982
- // `scrollTop` is not always reported as an integer
1983
- const canScrollDown = Math.ceil(viewport.scrollTop) < maxScroll;
1984
- setCanScrollDown(canScrollDown);
1985
- }
1986
- handleScroll();
1987
- viewport.addEventListener('scroll', handleScroll);
1988
- return ()=>viewport.removeEventListener('scroll', handleScroll)
1989
- ;
1990
- }
1991
- }, [
1992
- contentContext.viewport,
1993
- contentContext.isPositioned
1994
- ]);
1995
- return canScrollDown1 ? /*#__PURE__*/ createElement($cc7e05a45900e73f$var$SelectScrollButtonImpl, _extends({}, props, {
1996
- ref: composedRefs,
1997
- onAutoScroll: ()=>{
1998
- const { viewport: viewport , selectedItem: selectedItem } = contentContext;
1999
- if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop + selectedItem.offsetHeight;
2000
- }
2001
- })) : null;
2002
- });
2003
- const $cc7e05a45900e73f$var$SelectScrollButtonImpl = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
2004
- const { __scopeSelect: __scopeSelect , onAutoScroll: onAutoScroll , ...scrollIndicatorProps } = props;
2005
- const contentContext = $cc7e05a45900e73f$var$useSelectContentContext('SelectScrollButton', __scopeSelect);
2006
- const autoScrollTimerRef = useRef(null);
2007
- const getItems = $cc7e05a45900e73f$var$useCollection(__scopeSelect);
2008
- const clearAutoScrollTimer = useCallback(()=>{
2009
- if (autoScrollTimerRef.current !== null) {
2010
- window.clearInterval(autoScrollTimerRef.current);
2011
- autoScrollTimerRef.current = null;
2012
- }
2013
- }, []);
2014
- useEffect(()=>{
2015
- return ()=>clearAutoScrollTimer()
2016
- ;
2017
- }, [
2018
- clearAutoScrollTimer
2019
- ]); // When the viewport becomes scrollable on either side, the relevant scroll button will mount.
2020
- // Because it is part of the normal flow, it will push down (top button) or shrink (bottom button)
2021
- // the viewport, potentially causing the active item to now be partially out of view.
2022
- // We re-run the `scrollIntoView` logic to make sure it stays within the viewport.
2023
- $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
2024
- var _activeItem$ref$curre;
2025
- const activeItem = getItems().find((item)=>item.ref.current === document.activeElement
2026
- );
2027
- activeItem === null || activeItem === void 0 || (_activeItem$ref$curre = activeItem.ref.current) === null || _activeItem$ref$curre === void 0 || _activeItem$ref$curre.scrollIntoView({
2028
- block: 'nearest'
2029
- });
2030
- }, [
2031
- getItems
2032
- ]);
2033
- return /*#__PURE__*/ createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({
2034
- "aria-hidden": true
2035
- }, scrollIndicatorProps, {
2036
- ref: forwardedRef,
2037
- style: {
2038
- flexShrink: 0,
2039
- ...scrollIndicatorProps.style
2040
- },
2041
- onPointerDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(scrollIndicatorProps.onPointerDown, ()=>{
2042
- if (autoScrollTimerRef.current === null) autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
2043
- }),
2044
- onPointerMove: $e42e1063c40fb3ef$export$b9ecd428b558ff10(scrollIndicatorProps.onPointerMove, ()=>{
2045
- var _contentContext$onIte3;
2046
- (_contentContext$onIte3 = contentContext.onItemLeave) === null || _contentContext$onIte3 === void 0 || _contentContext$onIte3.call(contentContext);
2047
- if (autoScrollTimerRef.current === null) autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
2048
- }),
2049
- onPointerLeave: $e42e1063c40fb3ef$export$b9ecd428b558ff10(scrollIndicatorProps.onPointerLeave, ()=>{
2050
- clearAutoScrollTimer();
2051
- })
2052
- }));
2053
- });
2054
- /* -----------------------------------------------------------------------------------------------*/ function $cc7e05a45900e73f$var$shouldShowPlaceholder(value) {
2055
- return value === '' || value === undefined;
2056
- }
2057
- const $cc7e05a45900e73f$var$BubbleSelect = /*#__PURE__*/ forwardRef((props, forwardedRef)=>{
2058
- const { value: value , ...selectProps } = props;
2059
- const ref = useRef(null);
2060
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref);
2061
- const prevValue = $010c2913dbd2fe3d$export$5cae361ad82dce8b(value); // Bubble value change to parents (e.g form change event)
2062
- useEffect(()=>{
2063
- const select = ref.current;
2064
- const selectProto = window.HTMLSelectElement.prototype;
2065
- const descriptor = Object.getOwnPropertyDescriptor(selectProto, 'value');
2066
- const setValue = descriptor.set;
2067
- if (prevValue !== value && setValue) {
2068
- const event = new Event('change', {
2069
- bubbles: true
2070
- });
2071
- setValue.call(select, value);
2072
- select.dispatchEvent(event);
2073
- }
2074
- }, [
2075
- prevValue,
2076
- value
2077
- ]);
2078
- /**
2079
- * We purposefully use a `select` here to support form autofill as much
2080
- * as possible.
2081
- *
2082
- * We purposefully do not add the `value` attribute here to allow the value
2083
- * to be set programatically and bubble to any parent form `onChange` event.
2084
- * Adding the `value` will cause React to consider the programatic
2085
- * dispatch a duplicate and it will get swallowed.
2086
- *
2087
- * We use `VisuallyHidden` rather than `display: "none"` because Safari autofill
2088
- * won't work otherwise.
2089
- */ return /*#__PURE__*/ createElement($ea1ef594cf570d83$export$439d29a4e110a164, {
2090
- asChild: true
2091
- }, /*#__PURE__*/ createElement("select", _extends({}, selectProps, {
2092
- ref: composedRefs,
2093
- defaultValue: value
2094
- })));
2095
- });
2096
- $cc7e05a45900e73f$var$BubbleSelect.displayName = 'BubbleSelect';
2097
- function $cc7e05a45900e73f$var$useTypeaheadSearch(onSearchChange) {
2098
- const handleSearchChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onSearchChange);
2099
- const searchRef = useRef('');
2100
- const timerRef = useRef(0);
2101
- const handleTypeaheadSearch = useCallback((key)=>{
2102
- const search = searchRef.current + key;
2103
- handleSearchChange(search);
2104
- (function updateSearch(value) {
2105
- searchRef.current = value;
2106
- window.clearTimeout(timerRef.current); // Reset `searchRef` 1 second after it was last updated
2107
- if (value !== '') timerRef.current = window.setTimeout(()=>updateSearch('')
2108
- , 1000);
2109
- })(search);
2110
- }, [
2111
- handleSearchChange
2112
- ]);
2113
- const resetTypeahead = useCallback(()=>{
2114
- searchRef.current = '';
2115
- window.clearTimeout(timerRef.current);
2116
- }, []);
2117
- useEffect(()=>{
2118
- return ()=>window.clearTimeout(timerRef.current)
2119
- ;
2120
- }, []);
2121
- return [
2122
- searchRef,
2123
- handleTypeaheadSearch,
2124
- resetTypeahead
2125
- ];
2126
- }
2127
- /**
2128
- * This is the "meat" of the typeahead matching logic. It takes in a list of items,
2129
- * the search and the current item, and returns the next item (or `undefined`).
2130
- *
2131
- * We normalize the search because if a user has repeatedly pressed a character,
2132
- * we want the exact same behavior as if we only had that one character
2133
- * (ie. cycle through items starting with that character)
2134
- *
2135
- * We also reorder the items by wrapping the array around the current item.
2136
- * This is so we always look forward from the current item, and picking the first
2137
- * item will always be the correct one.
2138
- *
2139
- * Finally, if the normalized search is exactly one character, we exclude the
2140
- * current item from the values because otherwise it would be the first to match always
2141
- * and focus would never move. This is as opposed to the regular case, where we
2142
- * don't want focus to move if the current item still matches.
2143
- */ function $cc7e05a45900e73f$var$findNextItem(items, search, currentItem) {
2144
- const isRepeated = search.length > 1 && Array.from(search).every((char)=>char === search[0]
2145
- );
2146
- const normalizedSearch = isRepeated ? search[0] : search;
2147
- const currentItemIndex = currentItem ? items.indexOf(currentItem) : -1;
2148
- let wrappedItems = $cc7e05a45900e73f$var$wrapArray(items, Math.max(currentItemIndex, 0));
2149
- const excludeCurrentItem = normalizedSearch.length === 1;
2150
- if (excludeCurrentItem) wrappedItems = wrappedItems.filter((v)=>v !== currentItem
2151
- );
2152
- const nextItem = wrappedItems.find((item)=>item.textValue.toLowerCase().startsWith(normalizedSearch.toLowerCase())
2153
- );
2154
- return nextItem !== currentItem ? nextItem : undefined;
2155
- }
2156
- /**
2157
- * Wraps an array around itself at a given start index
2158
- * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
2159
- */ function $cc7e05a45900e73f$var$wrapArray(array, startIndex) {
2160
- return array.map((_, index)=>array[(startIndex + index) % array.length]
2161
- );
2162
- }
2163
- const $cc7e05a45900e73f$export$be92b6f5f03c0fe9 = $cc7e05a45900e73f$export$ef9b1a59e592288f;
2164
- const $cc7e05a45900e73f$export$41fb9f06171c75f4 = $cc7e05a45900e73f$export$3ac1e88a1c0b9f1;
2165
- const $cc7e05a45900e73f$export$4c8d1a57a761ef94 = $cc7e05a45900e73f$export$e288731fd71264f0;
2166
- const $cc7e05a45900e73f$export$f04a61298a47a40f = $cc7e05a45900e73f$export$99b400cabb58c515;
2167
- const $cc7e05a45900e73f$export$602eac185826482c = $cc7e05a45900e73f$export$b2af6c9944296213;
2168
- const $cc7e05a45900e73f$export$7c6e2c02157bb7d2 = $cc7e05a45900e73f$export$c973a4b3cb86a03d;
2169
- const $cc7e05a45900e73f$export$d5c6c08dc2d3ca7 = $cc7e05a45900e73f$export$9ed6e7b40248d36d;
2170
- const $cc7e05a45900e73f$export$6d08773d2e66f8f2 = $cc7e05a45900e73f$export$13ef48a934230896;
2171
- const $cc7e05a45900e73f$export$d6e5bf9c43ea9319 = $cc7e05a45900e73f$export$3572fb0fb821ff49;
2172
- const $cc7e05a45900e73f$export$c3468e2714d175fa = $cc7e05a45900e73f$export$6b9198de19accfe6;
2173
- const $cc7e05a45900e73f$export$2f60d3ec9ad468f2 = $cc7e05a45900e73f$export$d8117927658af6d7;
2174
- const $cc7e05a45900e73f$export$bf1aedc3039c8d63 = $cc7e05a45900e73f$export$ff951e476c12189;
2175
-
2176
20
  /** Use `Select` to choose from a dropdown list of options. */
2177
21
  var Select = function (_a) {
2178
22
  var _b;