@hopper-ui/components 1.5.15 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (356) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/accordion/src/Accordion.css +77 -77
  3. package/dist/accordion/src/Accordion.js +1 -1
  4. package/dist/accordion/src/index.css +77 -77
  5. package/dist/accordion/src/index.js +1 -1
  6. package/dist/alert/src/Alert.css +309 -309
  7. package/dist/alert/src/Alert.js +9 -9
  8. package/dist/alert/src/index.css +309 -309
  9. package/dist/alert/src/index.js +9 -9
  10. package/dist/avatar/src/AnonymousAvatar.css +47 -47
  11. package/dist/avatar/src/AnonymousAvatar.js +2 -2
  12. package/dist/avatar/src/Avatar.css +65 -65
  13. package/dist/avatar/src/Avatar.d.ts +2 -2
  14. package/dist/avatar/src/Avatar.js +4 -4
  15. package/dist/avatar/src/AvatarGroup.css +64 -64
  16. package/dist/avatar/src/AvatarGroup.js +5 -5
  17. package/dist/avatar/src/BrokenAvatar.css +47 -47
  18. package/dist/avatar/src/BrokenAvatar.js +2 -2
  19. package/dist/avatar/src/DeletedAvatar.css +47 -47
  20. package/dist/avatar/src/DeletedAvatar.js +2 -2
  21. package/dist/avatar/src/RichIconAvatarImage.css +47 -47
  22. package/dist/avatar/src/RichIconAvatarImage.js +1 -1
  23. package/dist/avatar/src/index.css +92 -92
  24. package/dist/avatar/src/index.js +10 -10
  25. package/dist/badge/src/Badge.css +52 -52
  26. package/dist/badge/src/Badge.js +2 -2
  27. package/dist/badge/src/FloatingBadge.css +47 -47
  28. package/dist/badge/src/FloatingBadge.js +1 -1
  29. package/dist/badge/src/index.css +62 -62
  30. package/dist/badge/src/index.js +3 -3
  31. package/dist/buttons/src/Button.css +103 -103
  32. package/dist/buttons/src/Button.js +5 -5
  33. package/dist/buttons/src/ButtonGroup.css +48 -48
  34. package/dist/buttons/src/ButtonGroup.js +1 -1
  35. package/dist/buttons/src/ClearButton.css +108 -108
  36. package/dist/buttons/src/ClearButton.js +2 -2
  37. package/dist/buttons/src/CloseButton.css +104 -104
  38. package/dist/buttons/src/CloseButton.js +6 -6
  39. package/dist/buttons/src/EmbeddedButton.css +108 -108
  40. package/dist/buttons/src/EmbeddedButton.js +1 -1
  41. package/dist/buttons/src/LinkButton.css +112 -112
  42. package/dist/buttons/src/LinkButton.js +4 -4
  43. package/dist/buttons/src/index.css +260 -260
  44. package/dist/buttons/src/index.js +10 -10
  45. package/dist/callout/src/Callout.css +272 -272
  46. package/dist/callout/src/Callout.js +7 -7
  47. package/dist/callout/src/CompactCallout.css +309 -309
  48. package/dist/callout/src/CompactCallout.js +7 -7
  49. package/dist/callout/src/index.css +321 -321
  50. package/dist/callout/src/index.js +8 -8
  51. package/dist/card/src/Card.css +40 -40
  52. package/dist/card/src/Card.js +1 -1
  53. package/dist/card/src/index.css +40 -40
  54. package/dist/card/src/index.js +1 -1
  55. package/dist/checkbox/src/Checkbox.css +56 -56
  56. package/dist/checkbox/src/Checkbox.js +4 -4
  57. package/dist/checkbox/src/CheckboxField.css +43 -43
  58. package/dist/checkbox/src/CheckboxField.js +3 -3
  59. package/dist/checkbox/src/CheckboxGroup.css +108 -108
  60. package/dist/checkbox/src/CheckboxGroup.js +6 -6
  61. package/dist/checkbox/src/DecorativeCheckbox.css +64 -64
  62. package/dist/checkbox/src/DecorativeCheckbox.js +3 -3
  63. package/dist/checkbox/src/index.css +108 -108
  64. package/dist/checkbox/src/index.js +10 -10
  65. package/dist/{chunk-LACODOC2.js → chunk-2EAZ5H42.js} +1 -1
  66. package/dist/{chunk-L7IPSOT5.js → chunk-2USDHEIV.js} +2 -2
  67. package/dist/{chunk-BBUO6JNY.js → chunk-36S3E6PJ.js} +1 -1
  68. package/dist/{chunk-M2V7QIEJ.js → chunk-5WUSHVW7.js} +1 -1
  69. package/dist/{chunk-EPPRW6WY.js → chunk-62EZGVKH.js} +8 -8
  70. package/dist/{chunk-ZF2VIHIL.js → chunk-67EKVQAF.js} +3 -3
  71. package/dist/{chunk-3ITCXFNF.js → chunk-6LKFNPEM.js} +1 -1
  72. package/dist/{chunk-4IBYIHH3.js → chunk-A2BFPCVC.js} +3 -3
  73. package/dist/{chunk-TWP4PKNE.js → chunk-ARCWWXRR.js} +2 -2
  74. package/dist/{chunk-YUKKPIQM.js → chunk-AXBVBNPN.js} +2 -2
  75. package/dist/{chunk-ZTX23M7T.js → chunk-AYAKR4MK.js} +2 -2
  76. package/dist/{chunk-5G7E5FCW.js → chunk-B2PCJYJW.js} +1 -1
  77. package/dist/{chunk-67UHV6JT.js → chunk-BI3MQKBI.js} +2 -2
  78. package/dist/{chunk-C37ZYXWY.js → chunk-C76BH4QR.js} +2 -2
  79. package/dist/{chunk-YDSIFPYF.js → chunk-CICKS5HQ.js} +3 -3
  80. package/dist/{chunk-PHIFUBIQ.js → chunk-CQHB3HRC.js} +1 -1
  81. package/dist/{chunk-PLUMP3FI.js → chunk-D7IJXSDN.js} +2 -2
  82. package/dist/{chunk-ZYWNDGPO.js → chunk-DLYK3JRB.js} +2 -2
  83. package/dist/{chunk-MJVZCFBR.js → chunk-EELIGZUD.js} +5 -5
  84. package/dist/chunk-ERUOMTWL.js +6 -0
  85. package/dist/{chunk-IMLQDPAT.js → chunk-FJ6AAK5Z.js} +5 -5
  86. package/dist/{chunk-3NPO6GHQ.js → chunk-FJJG6PMV.js} +1 -1
  87. package/dist/{chunk-2SWBJ2RA.js → chunk-FOD6Q7UN.js} +2 -2
  88. package/dist/{chunk-AZM46V7S.js → chunk-GEMZ5EDW.js} +8 -8
  89. package/dist/{chunk-L4VDO4RJ.js → chunk-GKN3BY36.js} +3 -3
  90. package/dist/{chunk-YAEJRROD.js → chunk-GKUY4QWP.js} +1 -1
  91. package/dist/{chunk-2HYNJ4RG.js → chunk-H637L477.js} +1 -1
  92. package/dist/{chunk-JZ6NPRCQ.js → chunk-H6CZ6DKP.js} +1 -1
  93. package/dist/{chunk-JVJ7HW2B.js → chunk-H7K7KLU4.js} +2 -2
  94. package/dist/{chunk-GOTGYG72.js → chunk-HCFKAC4T.js} +2 -2
  95. package/dist/{chunk-FMBBP2JM.js → chunk-HEHMZWBC.js} +1 -1
  96. package/dist/{chunk-EJAFDM3W.js → chunk-HGSA2Y3P.js} +10 -10
  97. package/dist/chunk-IJZK5LYV.js +37 -0
  98. package/dist/chunk-J62I6GH3.js +102 -0
  99. package/dist/chunk-JCGEKYID.js +35 -0
  100. package/dist/{chunk-CXAKQC6F.js → chunk-JNFQC65H.js} +2 -2
  101. package/dist/{chunk-Q65D7GMU.js → chunk-K73FGFB2.js} +10 -8
  102. package/dist/{chunk-WAHZ3SFK.js → chunk-K7PQOHUQ.js} +3 -3
  103. package/dist/{chunk-M45IYAP6.js → chunk-KEDXRQG2.js} +3 -3
  104. package/dist/{chunk-IGIUSB45.js → chunk-KUGVMCIB.js} +1 -1
  105. package/dist/{chunk-242I76V4.js → chunk-KWXJDQ4M.js} +2 -2
  106. package/dist/{chunk-ZDPSSA4N.js → chunk-L4D32IWU.js} +1 -1
  107. package/dist/{chunk-DU73AY3A.js → chunk-LAN2LJO2.js} +1 -1
  108. package/dist/{chunk-DP2RSYCZ.js → chunk-LERLQFPC.js} +3 -3
  109. package/dist/{chunk-YAU2APH4.js → chunk-M3L2VYKL.js} +2 -2
  110. package/dist/{chunk-LZOVDVUN.js → chunk-MCUPCFYQ.js} +8 -8
  111. package/dist/{chunk-R252LAT3.js → chunk-MP4UER4S.js} +5 -5
  112. package/dist/{chunk-WXM5D73O.js → chunk-MYPNAEEC.js} +1 -1
  113. package/dist/{chunk-N7HVLMON.js → chunk-MYZE5GJA.js} +2 -2
  114. package/dist/chunk-NGKT775Y.js +6 -0
  115. package/dist/{chunk-SYZBLISX.js → chunk-NVOQLDA5.js} +12 -12
  116. package/dist/chunk-OGC6BUEX.js +6 -0
  117. package/dist/{chunk-EAB222LC.js → chunk-ONCR64LB.js} +1 -1
  118. package/dist/{chunk-ECH7SUOC.js → chunk-PPV6OKAK.js} +7 -7
  119. package/dist/{chunk-2XIGNRNN.js → chunk-QVHMDEWO.js} +1 -1
  120. package/dist/{chunk-2Z6HG7MH.js → chunk-QYEV2QUA.js} +1 -1
  121. package/dist/{chunk-5BAVMEBR.js → chunk-R3PAHNRL.js} +2 -2
  122. package/dist/{chunk-7TD2BOOW.js → chunk-R4ICRVDS.js} +1 -1
  123. package/dist/{chunk-MURITCIV.js → chunk-R5CEXZPL.js} +1 -1
  124. package/dist/{chunk-MMYSMCOC.js → chunk-REXPSB5P.js} +2 -2
  125. package/dist/{chunk-D2XT5TOS.js → chunk-RKZRG2QV.js} +5 -5
  126. package/dist/{chunk-BVHIN4FH.js → chunk-RMAIQQFV.js} +2 -2
  127. package/dist/{chunk-M4CEDZGQ.js → chunk-RNVPPIZQ.js} +2 -2
  128. package/dist/{chunk-A2ATFLHB.js → chunk-SEQN7G35.js} +3 -3
  129. package/dist/{chunk-6REG5UM7.js → chunk-SINPHU2Z.js} +2 -2
  130. package/dist/{chunk-UG5NRLHP.js → chunk-SKHYIVXR.js} +2 -2
  131. package/dist/{chunk-VZCB6LQU.js → chunk-SLFA36JO.js} +1 -1
  132. package/dist/{chunk-DEKL4OBV.js → chunk-STU7DFF5.js} +11 -11
  133. package/dist/{chunk-345ZW6DW.js → chunk-SW4UF2MM.js} +4 -4
  134. package/dist/{chunk-BOVMXXMP.js → chunk-TLAJAVGL.js} +2 -2
  135. package/dist/{chunk-ODTKK5LR.js → chunk-TN5C3AE3.js} +1 -1
  136. package/dist/{chunk-OMJOBHXJ.js → chunk-TU5MAMGV.js} +6 -6
  137. package/dist/{chunk-EWAUG4KW.js → chunk-TZZQP76M.js} +3 -3
  138. package/dist/{chunk-K7QK3SIY.js → chunk-U35DID2L.js} +1 -1
  139. package/dist/chunk-U4LYXB7W.js +10 -0
  140. package/dist/{chunk-BEZV2TV5.js → chunk-UIOWILYW.js} +1 -1
  141. package/dist/{chunk-ECZI3JMD.js → chunk-V2AGZ5A5.js} +1 -1
  142. package/dist/{chunk-UTN67TJM.js → chunk-V7HFSPRY.js} +1 -1
  143. package/dist/{chunk-FKKZBPRC.js → chunk-VLGOJ5DY.js} +2 -2
  144. package/dist/{chunk-4GWBYMMR.js → chunk-VMGVHR42.js} +1 -1
  145. package/dist/{chunk-Z4KKM2YZ.js → chunk-W2C47VCH.js} +1 -1
  146. package/dist/{chunk-2HSYA3UO.js → chunk-W53AAAUA.js} +2 -2
  147. package/dist/{chunk-5QTTGCUO.js → chunk-WDZO4L7Z.js} +1 -1
  148. package/dist/{chunk-AM5OWO4O.js → chunk-WY3JOP43.js} +1 -1
  149. package/dist/{chunk-BLZPFFRT.js → chunk-XKREPRGK.js} +1 -1
  150. package/dist/{chunk-IYNP25HA.js → chunk-XUO7HGRK.js} +2 -2
  151. package/dist/{chunk-66AUOYN3.js → chunk-YWNBO3UY.js} +1 -1
  152. package/dist/chunk-ZSOUOAD4.js +98 -0
  153. package/dist/combobox/src/ComboBox.css +681 -681
  154. package/dist/combobox/src/ComboBox.js +17 -17
  155. package/dist/combobox/src/index.css +681 -681
  156. package/dist/combobox/src/index.js +17 -17
  157. package/dist/disclosure/src/Disclosure.css +47 -47
  158. package/dist/disclosure/src/Disclosure.js +1 -1
  159. package/dist/disclosure/src/DisclosureHeader.css +54 -54
  160. package/dist/disclosure/src/DisclosureHeader.js +3 -3
  161. package/dist/disclosure/src/DisclosurePanel.css +47 -47
  162. package/dist/disclosure/src/DisclosurePanel.js +3 -3
  163. package/dist/disclosure/src/index.css +72 -72
  164. package/dist/disclosure/src/index.js +7 -7
  165. package/dist/divider/src/Divider.css +39 -39
  166. package/dist/divider/src/Divider.js +1 -1
  167. package/dist/divider/src/index.css +39 -39
  168. package/dist/divider/src/index.js +1 -1
  169. package/dist/error-message/src/ErrorMessage.css +39 -39
  170. package/dist/error-message/src/ErrorMessage.js +2 -2
  171. package/dist/error-message/src/index.css +39 -39
  172. package/dist/error-message/src/index.js +2 -2
  173. package/dist/form/src/Form.css +37 -37
  174. package/dist/form/src/Form.js +1 -1
  175. package/dist/form/src/index.css +37 -37
  176. package/dist/form/src/index.js +1 -1
  177. package/dist/helper-message/src/HelperMessage.css +39 -39
  178. package/dist/helper-message/src/HelperMessage.js +2 -2
  179. package/dist/helper-message/src/index.css +39 -39
  180. package/dist/helper-message/src/index.js +2 -2
  181. package/dist/hopper-provider/src/HopperProvider.css +38 -38
  182. package/dist/hopper-provider/src/HopperProvider.js +1 -1
  183. package/dist/hopper-provider/src/index.css +38 -38
  184. package/dist/hopper-provider/src/index.js +1 -1
  185. package/dist/icon-list/src/IconList.css +38 -38
  186. package/dist/icon-list/src/IconList.js +1 -1
  187. package/dist/icon-list/src/index.css +38 -38
  188. package/dist/icon-list/src/index.js +1 -1
  189. package/dist/illustrated-message/src/IllustratedMessage.css +279 -279
  190. package/dist/illustrated-message/src/IllustratedMessage.js +1 -1
  191. package/dist/illustrated-message/src/index.css +279 -279
  192. package/dist/illustrated-message/src/index.js +1 -1
  193. package/dist/image/src/Image.css +40 -40
  194. package/dist/image/src/Image.js +1 -1
  195. package/dist/image/src/SvgImage.css +38 -38
  196. package/dist/image/src/SvgImage.js +1 -1
  197. package/dist/image/src/index.css +41 -41
  198. package/dist/image/src/index.js +2 -2
  199. package/dist/index.css +1194 -997
  200. package/dist/index.d.ts +8 -1
  201. package/dist/index.js +95 -87
  202. package/dist/inputs/src/Input.css +41 -41
  203. package/dist/inputs/src/Input.js +1 -1
  204. package/dist/inputs/src/InputGroup.css +43 -43
  205. package/dist/inputs/src/InputGroup.js +1 -1
  206. package/dist/inputs/src/NumberField.css +67 -67
  207. package/dist/inputs/src/NumberField.js +9 -9
  208. package/dist/inputs/src/PasswordField.css +280 -280
  209. package/dist/inputs/src/PasswordField.js +9 -9
  210. package/dist/inputs/src/RemainingCharacterCount.css +40 -40
  211. package/dist/inputs/src/RemainingCharacterCount.js +2 -2
  212. package/dist/inputs/src/SearchField.css +286 -286
  213. package/dist/inputs/src/SearchField.js +10 -10
  214. package/dist/inputs/src/TextArea.css +64 -64
  215. package/dist/inputs/src/TextArea.js +8 -8
  216. package/dist/inputs/src/TextField.css +284 -284
  217. package/dist/inputs/src/TextField.js +12 -12
  218. package/dist/inputs/src/index.css +332 -332
  219. package/dist/inputs/src/index.js +16 -16
  220. package/dist/link/src/Link.css +76 -76
  221. package/dist/link/src/Link.js +3 -3
  222. package/dist/link/src/index.css +76 -76
  223. package/dist/link/src/index.js +3 -3
  224. package/dist/list-box/src/ListBox.css +311 -311
  225. package/dist/list-box/src/ListBox.js +7 -7
  226. package/dist/list-box/src/ListBoxItem.css +299 -299
  227. package/dist/list-box/src/ListBoxItem.js +6 -6
  228. package/dist/list-box/src/ListBoxItemSkeleton.css +44 -44
  229. package/dist/list-box/src/ListBoxItemSkeleton.js +1 -1
  230. package/dist/list-box/src/index.css +311 -311
  231. package/dist/list-box/src/index.js +7 -7
  232. package/dist/menu/src/Menu.css +4188 -0
  233. package/dist/menu/src/Menu.d.ts +31 -0
  234. package/dist/menu/src/Menu.js +12 -0
  235. package/dist/menu/src/MenuContext.d.ts +16 -0
  236. package/dist/menu/src/MenuContext.js +2 -0
  237. package/dist/menu/src/MenuItem.css +738 -0
  238. package/dist/menu/src/MenuItem.d.ts +25 -0
  239. package/dist/menu/src/MenuItem.js +10 -0
  240. package/dist/menu/src/MenuItemContext.d.ts +8 -0
  241. package/dist/menu/src/MenuItemContext.js +2 -0
  242. package/dist/menu/src/MenuSection.css +282 -0
  243. package/dist/menu/src/MenuSection.d.ts +10 -0
  244. package/dist/menu/src/MenuSection.js +3 -0
  245. package/dist/menu/src/MenuTrigger.d.ts +22 -0
  246. package/dist/menu/src/MenuTrigger.js +3 -0
  247. package/dist/menu/src/MenuTriggerContext.d.ts +8 -0
  248. package/dist/menu/src/MenuTriggerContext.js +2 -0
  249. package/dist/menu/src/SubmenuTrigger.d.ts +8 -0
  250. package/dist/menu/src/SubmenuTrigger.js +2 -0
  251. package/dist/menu/src/index.css +4327 -0
  252. package/dist/menu/src/index.d.ts +13 -0
  253. package/dist/menu/src/index.js +21 -0
  254. package/dist/modal/src/BaseModal.css +52 -52
  255. package/dist/modal/src/BaseModal.js +1 -1
  256. package/dist/modal/src/CustomModal.css +53 -53
  257. package/dist/modal/src/CustomModal.js +2 -2
  258. package/dist/modal/src/Modal.css +299 -299
  259. package/dist/modal/src/Modal.js +8 -8
  260. package/dist/modal/src/index.css +300 -300
  261. package/dist/modal/src/index.js +10 -10
  262. package/dist/overlays/popover/src/Popover.css +597 -597
  263. package/dist/overlays/popover/src/Popover.js +2 -2
  264. package/dist/overlays/popover/src/PopoverBase.css +41 -41
  265. package/dist/overlays/popover/src/PopoverBase.js +1 -1
  266. package/dist/overlays/popover/src/index.css +601 -601
  267. package/dist/overlays/popover/src/index.js +3 -3
  268. package/dist/radio/src/DecorativeRadio.css +64 -64
  269. package/dist/radio/src/DecorativeRadio.js +3 -3
  270. package/dist/radio/src/Radio.css +56 -56
  271. package/dist/radio/src/Radio.js +3 -3
  272. package/dist/radio/src/RadioField.css +43 -43
  273. package/dist/radio/src/RadioField.js +2 -2
  274. package/dist/radio/src/RadioGroup.css +108 -108
  275. package/dist/radio/src/RadioGroup.js +7 -7
  276. package/dist/radio/src/index.css +108 -108
  277. package/dist/radio/src/index.js +11 -11
  278. package/dist/segmented-control/src/SegmentedControl.css +38 -38
  279. package/dist/segmented-control/src/SegmentedControl.js +1 -1
  280. package/dist/segmented-control/src/SegmentedControlItem.css +52 -52
  281. package/dist/segmented-control/src/SegmentedControlItem.js +2 -2
  282. package/dist/segmented-control/src/index.css +53 -53
  283. package/dist/segmented-control/src/index.js +3 -3
  284. package/dist/select/src/Select.css +625 -625
  285. package/dist/select/src/Select.js +17 -17
  286. package/dist/select/src/SelectValue.css +98 -98
  287. package/dist/select/src/SelectValue.js +2 -2
  288. package/dist/select/src/index.css +625 -625
  289. package/dist/select/src/index.js +17 -17
  290. package/dist/spinner/src/Spinner.css +47 -47
  291. package/dist/spinner/src/Spinner.js +2 -2
  292. package/dist/spinner/src/index.css +47 -47
  293. package/dist/spinner/src/index.js +2 -2
  294. package/dist/switch/src/Switch.css +53 -53
  295. package/dist/switch/src/Switch.js +3 -3
  296. package/dist/switch/src/SwitchField.css +43 -43
  297. package/dist/switch/src/SwitchField.js +2 -2
  298. package/dist/switch/src/index.css +59 -59
  299. package/dist/switch/src/index.js +4 -4
  300. package/dist/tabs/src/Tab.css +451 -450
  301. package/dist/tabs/src/Tab.js +2 -2
  302. package/dist/tabs/src/TabLine.css +39 -39
  303. package/dist/tabs/src/TabLine.js +1 -1
  304. package/dist/tabs/src/TabList.css +46 -46
  305. package/dist/tabs/src/TabList.js +2 -2
  306. package/dist/tabs/src/TabPanel.css +39 -39
  307. package/dist/tabs/src/TabPanel.js +1 -1
  308. package/dist/tabs/src/index.css +462 -461
  309. package/dist/tabs/src/index.js +5 -5
  310. package/dist/tag/src/Tag.css +429 -428
  311. package/dist/tag/src/Tag.js +7 -7
  312. package/dist/tag/src/TagGroup.css +47 -47
  313. package/dist/tag/src/TagGroup.js +6 -6
  314. package/dist/tag/src/index.css +439 -438
  315. package/dist/tag/src/index.js +11 -11
  316. package/dist/tile/src/Tile.css +46 -46
  317. package/dist/tile/src/Tile.js +2 -2
  318. package/dist/tile/src/TileGroup.css +38 -38
  319. package/dist/tile/src/TileGroup.js +1 -1
  320. package/dist/tile/src/index.css +47 -47
  321. package/dist/tile/src/index.js +3 -3
  322. package/dist/toggle-arrow/src/ToggleArrow.css +39 -39
  323. package/dist/toggle-arrow/src/ToggleArrow.js +1 -1
  324. package/dist/toggle-arrow/src/index.css +39 -39
  325. package/dist/toggle-arrow/src/index.js +1 -1
  326. package/dist/tooltip/src/Tooltip.css +47 -47
  327. package/dist/tooltip/src/Tooltip.js +4 -4
  328. package/dist/tooltip/src/TooltipTrigger.css +37 -37
  329. package/dist/tooltip/src/index.css +47 -47
  330. package/dist/tooltip/src/index.js +4 -4
  331. package/dist/typography/heading/src/Heading.css +37 -37
  332. package/dist/typography/heading/src/Heading.js +1 -1
  333. package/dist/typography/heading/src/index.css +37 -37
  334. package/dist/typography/heading/src/index.js +1 -1
  335. package/dist/typography/label/src/Label.css +37 -37
  336. package/dist/typography/label/src/Label.js +2 -2
  337. package/dist/typography/label/src/index.css +37 -37
  338. package/dist/typography/label/src/index.js +2 -2
  339. package/dist/typography/overline-text/src/OverlineText.css +37 -37
  340. package/dist/typography/overline-text/src/OverlineText.js +1 -1
  341. package/dist/typography/overline-text/src/index.css +37 -37
  342. package/dist/typography/overline-text/src/index.js +1 -1
  343. package/dist/typography/paragraph/src/Paragraph.css +37 -37
  344. package/dist/typography/paragraph/src/Paragraph.js +2 -2
  345. package/dist/typography/paragraph/src/index.css +37 -37
  346. package/dist/typography/paragraph/src/index.js +2 -2
  347. package/dist/typography/text/src/Text.css +37 -37
  348. package/dist/typography/text/src/Text.js +1 -1
  349. package/dist/typography/text/src/index.css +37 -37
  350. package/dist/typography/text/src/index.js +1 -1
  351. package/dist/utils/src/ClearSlots.css +37 -37
  352. package/dist/utils/src/EnsureTextWrapper.css +37 -37
  353. package/dist/utils/src/EnsureTextWrapper.js +2 -2
  354. package/dist/utils/src/index.css +37 -37
  355. package/dist/utils/src/index.js +2 -2
  356. package/package.json +1 -1
package/dist/menu/src/Menu.css ADDED
@@ -0,0 +1,4188 @@
1
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/heading/src/Heading.module.css/#css-module-data */
2
+ .Heading-module__hop-Heading___3N-BS {
3
+ --hop-Heading-xs-font-size: var(--hop-heading-xs-font-size);
4
+ --hop-Heading-xs-font-family: var(--hop-heading-xs-font-family);
5
+ --hop-Heading-xs-font-weight: var(--hop-heading-xs-font-weight);
6
+ --hop-Heading-xs-line-height: var(--hop-heading-xs-line-height);
7
+ --hop-Heading-sm-font-size: var(--hop-heading-sm-font-size);
8
+ --hop-Heading-sm-font-family: var(--hop-heading-sm-font-family);
9
+ --hop-Heading-sm-font-weight: var(--hop-heading-sm-font-weight);
10
+ --hop-Heading-sm-line-height: var(--hop-heading-sm-line-height);
11
+ --hop-Heading-md-font-size: var(--hop-heading-md-font-size);
12
+ --hop-Heading-md-font-family: var(--hop-heading-md-font-family);
13
+ --hop-Heading-md-font-weight: var(--hop-heading-md-font-weight);
14
+ --hop-Heading-md-line-height: var(--hop-heading-md-line-height);
15
+ --hop-Heading-lg-font-size: var(--hop-heading-lg-font-size);
16
+ --hop-Heading-lg-font-family: var(--hop-heading-lg-font-family);
17
+ --hop-Heading-lg-font-weight: var(--hop-heading-lg-font-weight);
18
+ --hop-Heading-lg-line-height: var(--hop-heading-lg-line-height);
19
+ --hop-Heading-xl-font-size: var(--hop-heading-xl-font-size);
20
+ --hop-Heading-xl-font-family: var(--hop-heading-xl-font-family);
21
+ --hop-Heading-xl-font-weight: var(--hop-heading-xl-font-weight);
22
+ --hop-Heading-xl-line-height: var(--hop-heading-xl-line-height);
23
+ --hop-Heading-2xl-font-size: var(--hop-heading-2xl-font-size);
24
+ --hop-Heading-2xl-font-family: var(--hop-heading-2xl-font-family);
25
+ --hop-Heading-2xl-font-weight: var(--hop-heading-2xl-font-weight);
26
+ --hop-Heading-2xl-line-height: var(--hop-heading-2xl-line-height);
27
+ --hop-Heading-3xl-font-size: var(--hop-heading-3xl-font-size);
28
+ --hop-Heading-3xl-font-family: var(--hop-heading-3xl-font-family);
29
+ --hop-Heading-3xl-font-weight: var(--hop-heading-3xl-font-weight);
30
+ --hop-Heading-3xl-line-height: var(--hop-heading-3xl-line-height);
31
+ --hop-Heading-inherit-size-font-size: inherit;
32
+ --hop-Heading-inherit-size-font-family: inherit;
33
+ --hop-Heading-inherit-size-font-weight: inherit;
34
+ --hop-Heading-inherit-size-line-height: inherit;
35
+ }
36
+ :where(.Heading-module__hop-Heading___3N-BS) {
37
+ margin: 0;
38
+ font-family: var(--font-family);
39
+ font-size: var(--font-size);
40
+ font-weight: var(--font-weight);
41
+ line-height: var(--line-height);
42
+ color: var(--hop-neutral-text);
43
+ }
44
+ :where(.Heading-module__hop-Heading--xs___AIoE1) {
45
+ --font-size: var(--hop-Heading-xs-font-size);
46
+ --font-family: var(--hop-Heading-xs-font-family);
47
+ --font-weight: var(--hop-Heading-xs-font-weight);
48
+ --line-height: var(--hop-Heading-xs-line-height);
49
+ }
50
+ :where(.Heading-module__hop-Heading--sm___C-5Tn) {
51
+ --font-size: var(--hop-Heading-sm-font-size);
52
+ --font-family: var(--hop-Heading-sm-font-family);
53
+ --font-weight: var(--hop-Heading-sm-font-weight);
54
+ --line-height: var(--hop-Heading-sm-line-height);
55
+ }
56
+ :where(.Heading-module__hop-Heading--md___ptBBh) {
57
+ --font-size: var(--hop-Heading-md-font-size);
58
+ --font-family: var(--hop-Heading-md-font-family);
59
+ --font-weight: var(--hop-Heading-md-font-weight);
60
+ --line-height: var(--hop-Heading-md-line-height);
61
+ }
62
+ :where(.Heading-module__hop-Heading--lg___MhXsB) {
63
+ --font-size: var(--hop-Heading-lg-font-size);
64
+ --font-family: var(--hop-Heading-lg-font-family);
65
+ --font-weight: var(--hop-Heading-lg-font-weight);
66
+ --line-height: var(--hop-Heading-lg-line-height);
67
+ }
68
+ :where(.Heading-module__hop-Heading--xl___jMCo1) {
69
+ --font-size: var(--hop-Heading-xl-font-size);
70
+ --font-family: var(--hop-Heading-xl-font-family);
71
+ --font-weight: var(--hop-Heading-xl-font-weight);
72
+ --line-height: var(--hop-Heading-xl-line-height);
73
+ }
74
+ :where(.Heading-module__hop-Heading--2xl___N864S) {
75
+ --font-size: var(--hop-Heading-2xl-font-size);
76
+ --font-family: var(--hop-Heading-2xl-font-family);
77
+ --font-weight: var(--hop-Heading-2xl-font-weight);
78
+ --line-height: var(--hop-Heading-2xl-line-height);
79
+ }
80
+ :where(.Heading-module__hop-Heading--3xl___ev4Cg) {
81
+ --font-size: var(--hop-Heading-3xl-font-size);
82
+ --font-family: var(--hop-Heading-3xl-font-family);
83
+ --font-weight: var(--hop-Heading-3xl-font-weight);
84
+ --line-height: var(--hop-Heading-3xl-line-height);
85
+ }
86
+
87
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/form/src/Form.module.css/#css-module-data */
88
+ .Form-module__hop-Form___F-45c {
89
+ display: flex;
90
+ flex-direction: column;
91
+ gap: var(--hop-space-stack-lg);
92
+ }
93
+
94
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/label/src/Label.module.css/#css-module-data */
95
+ .Label-module__hop-Label___tzV87 {
96
+ --hop-Label-font-size: var(--hop-heading-xs-font-size);
97
+ --hop-Label-font-family: var(--hop-heading-xs-font-family);
98
+ --hop-Label-font-weight: var(--hop-heading-xs-font-weight);
99
+ --hop-Label-line-height: var(--hop-heading-xs-line-height);
100
+ --hop-Label-color: var(--hop-neutral-text-weak);
101
+ }
102
+ :where(.Label-module__hop-Label___tzV87) {
103
+ font-family: var(--hop-Label-font-family);
104
+ font-size: var(--hop-Label-font-size);
105
+ font-weight: var(--hop-Label-font-weight);
106
+ line-height: var(--hop-Label-line-height);
107
+ color: var(--hop-Label-color);
108
+ }
109
+ :where(.Label-module__hop-Label__indicator___Wp4MQ) {
110
+ padding-inline-start: var(--hop-space-20);
111
+ }
112
+
113
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/overline-text/src/OverlineText.module.css/#css-module-data */
114
+ :where(.OverlineText-module__hop-OverlineText___lDKuo) {
115
+ --hop-OverlineText-font-family: var(--hop-overline-font-family);
116
+ --hop-OverlineText-font-size: var(--hop-overline-font-size);
117
+ --hop-OverlineText-font-weight: var(--hop-overline-font-weight);
118
+ --hop-OverlineText-letter-spacing: 0.015rem;
119
+ --hop-OverlineText-line-height: var(--hop-overline-line-height);
120
+ --hop-OverlineText-top-offset: var(--hop-overline-top-offset);
121
+ --hop-OverlineText-bottom-offset: var(--hop-overline-bottom-offset);
122
+ --font-family: var(--hop-OverlineText-font-family);
123
+ --font-size: var(--hop-OverlineText-font-size);
124
+ --font-weight: var(--hop-OverlineText-font-weight);
125
+ --letter-spacing: var(--hop-OverlineText-letter-spacing);
126
+ --line-height: var(--hop-OverlineText-line-height);
127
+ --top-offset: var(--hop-OverlineText-top-offset);
128
+ --bottom-offset: var(--hop-OverlineText-bottom-offset);
129
+ box-sizing: border-box;
130
+ font-family: var(--font-family);
131
+ font-size: var(--font-size);
132
+ font-feature-settings: "case";
133
+ font-weight: var(--font-weight);
134
+ line-height: var(--line-height);
135
+ text-transform: uppercase;
136
+ letter-spacing: var(--letter-spacing);
137
+ }
138
+ .OverlineText-module__hop-OverlineText__text___JrGdf {
139
+ box-sizing: border-box;
140
+ }
141
+ .OverlineText-module__hop-OverlineText__text___JrGdf::before,
142
+ .OverlineText-module__hop-OverlineText__text___JrGdf::after {
143
+ content: "";
144
+ display: block;
145
+ box-sizing: border-box;
146
+ inline-size: 0;
147
+ block-size: 0;
148
+ }
149
+ .OverlineText-module__hop-OverlineText__text___JrGdf::before {
150
+ margin-block-end: var(--bottom-offset);
151
+ }
152
+ .OverlineText-module__hop-OverlineText__text___JrGdf::after {
153
+ margin-block-start: var(--top-offset);
154
+ }
155
+
156
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/text/src/Text.module.css/#css-module-data */
157
+ .Text-module__hop-Text___TSNAC {
158
+ --hop-Text-xs-font-size: var(--hop-body-xs-font-size);
159
+ --hop-Text-xs-font-family: var(--hop-body-xs-font-family);
160
+ --hop-Text-xs-font-weight: var(--hop-body-xs-font-weight);
161
+ --hop-Text-xs-line-height: var(--hop-body-xs-line-height);
162
+ --hop-Text-sm-font-size: var(--hop-body-sm-font-size);
163
+ --hop-Text-sm-font-family: var(--hop-body-sm-font-family);
164
+ --hop-Text-sm-font-weight: var(--hop-body-sm-font-weight);
165
+ --hop-Text-sm-line-height: var(--hop-body-sm-line-height);
166
+ --hop-Text-md-font-size: var(--hop-body-md-font-size);
167
+ --hop-Text-md-font-family: var(--hop-body-md-font-family);
168
+ --hop-Text-md-font-weight: var(--hop-body-md-font-weight);
169
+ --hop-Text-md-line-height: var(--hop-body-md-line-height);
170
+ --hop-Text-lg-font-size: var(--hop-body-lg-font-size);
171
+ --hop-Text-lg-font-family: var(--hop-body-lg-font-family);
172
+ --hop-Text-lg-font-weight: var(--hop-body-lg-font-weight);
173
+ --hop-Text-lg-line-height: var(--hop-body-lg-line-height);
174
+ --hop-Text-xl-font-size: var(--hop-body-xl-font-size);
175
+ --hop-Text-xl-font-family: var(--hop-body-xl-font-family);
176
+ --hop-Text-xl-font-weight: var(--hop-body-xl-font-weight);
177
+ --hop-Text-xl-line-height: var(--hop-body-xl-line-height);
178
+ --hop-Text-2xl-font-size: var(--hop-body-2xl-font-size);
179
+ --hop-Text-2xl-font-family: var(--hop-body-2xl-font-family);
180
+ --hop-Text-2xl-font-weight: var(--hop-body-2xl-font-weight);
181
+ --hop-Text-2xl-line-height: var(--hop-body-2xl-line-height);
182
+ --hop-Text-inherit-size-font-size: inherit;
183
+ --hop-Text-inherit-size-font-family: inherit;
184
+ --hop-Text-inherit-size-font-weight: inherit;
185
+ --hop-Text-inherit-size-line-height: inherit;
186
+ }
187
+ :where(.Text-module__hop-Text___TSNAC) {
188
+ font-family: var(--font-family);
189
+ font-size: var(--font-size);
190
+ font-weight: var(--font-weight);
191
+ line-height: var(--line-height);
192
+ }
193
+ :where(.Text-module__hop-Text--xs___yuFT0) {
194
+ --font-size: var(--hop-Text-xs-font-size);
195
+ --font-family: var(--hop-Text-xs-font-family);
196
+ --font-weight: var(--hop-Text-xs-font-weight);
197
+ --line-height: var(--hop-Text-xs-line-height);
198
+ }
199
+ :where(.Text-module__hop-Text--sm___qelbx) {
200
+ --font-size: var(--hop-Text-sm-font-size);
201
+ --font-family: var(--hop-Text-sm-font-family);
202
+ --font-weight: var(--hop-Text-sm-font-weight);
203
+ --line-height: var(--hop-Text-sm-line-height);
204
+ }
205
+ :where(.Text-module__hop-Text--md___PcK3y) {
206
+ --font-size: var(--hop-Text-md-font-size);
207
+ --font-family: var(--hop-Text-md-font-family);
208
+ --font-weight: var(--hop-Text-md-font-weight);
209
+ --line-height: var(--hop-Text-md-line-height);
210
+ }
211
+ :where(.Text-module__hop-Text--lg___iRaZl) {
212
+ --font-size: var(--hop-Text-lg-font-size);
213
+ --font-family: var(--hop-Text-lg-font-family);
214
+ --font-weight: var(--hop-Text-lg-font-weight);
215
+ --line-height: var(--hop-Text-lg-line-height);
216
+ }
217
+ :where(.Text-module__hop-Text--xl___kO3Qt) {
218
+ --font-size: var(--hop-Text-xl-font-size);
219
+ --font-family: var(--hop-Text-xl-font-family);
220
+ --font-weight: var(--hop-Text-xl-font-weight);
221
+ --line-height: var(--hop-Text-xl-line-height);
222
+ }
223
+ :where(.Text-module__hop-Text--2xl___rAN5U) {
224
+ --font-size: var(--hop-Text-2xl-font-size);
225
+ --font-family: var(--hop-Text-2xl-font-family);
226
+ --font-weight: var(--hop-Text-2xl-font-weight);
227
+ --line-height: var(--hop-Text-2xl-line-height);
228
+ }
229
+ :where(.Text-module__hop-Text--inherit___hn3le) {
230
+ --font-size: var(--hop-Text-inherit-size-font-size);
231
+ --font-family: var(--hop-Text-inherit-size-font-family);
232
+ --font-weight: var(--hop-Text-inherit-size-font-weight);
233
+ --line-height: var(--hop-Text-inherit-size-line-height);
234
+ }
235
+
236
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/paragraph/src/Paragraph.module.css/#css-module-data */
237
+ .Paragraph-module__hop-Paragraph___VOZwC {
238
+ --hop-Paragraph-xs-margin-bottom: calc(.625rem * .75);
239
+ --hop-Paragraph-sm-margin-bottom: calc(.75rem * .75);
240
+ --hop-Paragraph-md-margin-bottom: calc(.875rem * .75);
241
+ --hop-Paragraph-lg-margin-bottom: calc(1rem * .75);
242
+ --hop-Paragraph-xl-margin-bottom: calc(1.125rem * .75);
243
+ --hop-Paragraph-2xl-margin-bottom: calc(1.375rem * .75);
244
+ --hop-Paragraph-inherit-margin-bottom: .75em;
245
+ margin: 0;
246
+ margin-block-end: var(--margin-block-end);
247
+ overflow-wrap: break-word;
248
+ }
249
+ .Paragraph-module__hop-Paragraph___VOZwC:last-child {
250
+ --margin-block-end: 0;
251
+ }
252
+ .Paragraph-module__hop-Paragraph--xs___crXVt {
253
+ --margin-block-end: var(--hop-Paragraph-xs-margin-bottom);
254
+ }
255
+ .Paragraph-module__hop-Paragraph--sm___nxfnz {
256
+ --margin-block-end: var(--hop-Paragraph-sm-margin-bottom);
257
+ }
258
+ .Paragraph-module__hop-Paragraph--md___YgyE0 {
259
+ --margin-block-end: var(--hop-Paragraph-md-margin-bottom);
260
+ }
261
+ .Paragraph-module__hop-Paragraph--lg___G36sQ {
262
+ --margin-block-end: var(--hop-Paragraph-lg-margin-bottom);
263
+ }
264
+ .Paragraph-module__hop-Paragraph--xl___dWzV5 {
265
+ --margin-block-end: var(--hop-Paragraph-xl-margin-bottom);
266
+ }
267
+ .Paragraph-module__hop-Paragraph--2xl___wJ2Wu {
268
+ --margin-block-end: var(--hop-Paragraph-2xl-margin-bottom);
269
+ }
270
+ .Paragraph-module__hop-Paragraph--inherit___Z3RKC {
271
+ --margin-block-end: var(--hop-Paragraph-inherit-margin-bottom);
272
+ }
273
+
274
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/divider/src/Divider.module.css/#css-module-data */
275
+ :where(.Divider-module__hop-Divider___hUMpf) {
276
+ --hop-Divider-border-color: var(--hop-neutral-border-weak);
277
+ --hop-Divider-border-size: 0.0625rem;
278
+ --hop-Divider-horizontal-border-block-end: var(--hop-Divider-border-size) solid var(--hop-Divider-border-color);
279
+ --hop-Divider-horizontal-border-inline-start: none;
280
+ --hop-Divider-horizontal-inline-size: auto;
281
+ --hop-Divider-horizontal-block-size: 0;
282
+ --hop-Divider-vertical-border-inline-start: var(--hop-Divider-border-size) solid var(--hop-Divider-border-color);
283
+ --hop-Divider-vertical-border-block-end: none;
284
+ --hop-Divider-vertical-inline-size: 0;
285
+ --hop-Divider-vertical-block-size: auto;
286
+ --border-block-end: var(--hop-Divider-horizontal-border-block-end);
287
+ --border-inline-start: var(--hop-Divider-horizontal-border-inline-start);
288
+ --inline-size: var(--hop-Divider-horizontal-inline-size);
289
+ --block-size: var(--hop-Divider-horizontal-block-size);
290
+ display: block;
291
+ flex: 0 0 auto;
292
+ box-sizing: border-box;
293
+ inline-size: var(--inline-size);
294
+ block-size: var(--block-size);
295
+ margin: 0;
296
+ border: none;
297
+ border-block-end: var(--border-block-end);
298
+ border-inline-start: var(--border-inline-start);
299
+ }
300
+ .Divider-module__hop-Divider--vertical___Ni6YU {
301
+ --border-block-end: var(--hop-Divider-vertical-border-block-end);
302
+ --border-inline-start: var(--hop-Divider-vertical-border-inline-start);
303
+ --inline-size: var(--hop-Divider-vertical-inline-size);
304
+ --block-size: var(--hop-Divider-vertical-block-size);
305
+ align-self: stretch;
306
+ }
307
+
308
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/icon-list/src/IconList.module.css/#css-module-data */
309
+ .IconList-module__hop-IconList___JGBdL {
310
+ --hop-IconList-gap: var(--hop-space-inline-xs);
311
+ display: flex;
312
+ flex-wrap: wrap;
313
+ gap: var(--hop-IconList-gap);
314
+ box-sizing: border-box;
315
+ }
316
+
317
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/spinner/src/Spinner.module.css/#css-module-data */
318
+ @keyframes Spinner-module__spin___Ev3-W {
319
+ 0% {
320
+ transform: rotate(0deg);
321
+ }
322
+ 100% {
323
+ transform: rotate(360deg);
324
+ }
325
+ }
326
+ .Spinner-module__hop-Spinner___-DwXC {
327
+ --hop-Spinner-border-radius: var(--hop-shape-circle);
328
+ --hop-Spinner-sm-wheel-size: 1rem;
329
+ --hop-Spinner-md-wheel-size: 1.25rem;
330
+ --hop-Spinner-lg-wheel-size: 1.5rem;
331
+ --hop-Spinner-track-width: 0.125rem;
332
+ --hop-Spinner-track-opacity: 0.2;
333
+ --hop-Spinner-track-border: var(--hop-Spinner-track-width) solid currentcolor;
334
+ --hop-Spinner-fill-animation: Spinner-module__spin___Ev3-W .8s infinite linear;
335
+ --hop-Spinner-fill-animation-reduced-motion-duration: 2s;
336
+ --hop-Spinner-fill-border: var(--hop-Spinner-track-width) solid transparent;
337
+ --hop-Spinner-fill-border-inline-start: var(--hop-Spinner-track-width) solid currentcolor;
338
+ --hop-Spinner-label-margin-inline-start: var(--hop-space-inline-sm);
339
+ display: grid;
340
+ grid-template-areas: "spinner label";
341
+ grid-template-columns: min-content auto;
342
+ align-items: center;
343
+ box-sizing: border-box;
344
+ }
345
+ .Spinner-module__hop-Spinner--sm___UlZFf {
346
+ --width: var(--hop-Spinner-sm-wheel-size);
347
+ --height: var(--hop-Spinner-sm-wheel-size);
348
+ }
349
+ .Spinner-module__hop-Spinner--md___2Aejk {
350
+ --width: var(--hop-Spinner-md-wheel-size);
351
+ --height: var(--hop-Spinner-md-wheel-size);
352
+ }
353
+ .Spinner-module__hop-Spinner--lg___rUTOq {
354
+ --width: var(--hop-Spinner-lg-wheel-size);
355
+ --height: var(--hop-Spinner-lg-wheel-size);
356
+ }
357
+ .Spinner-module__hop-Spinner__track___beMsW {
358
+ grid-area: spinner;
359
+ box-sizing: border-box;
360
+ inline-size: var(--width, var(--hop-Spinner-md-wheel-size));
361
+ block-size: var(--height, var(--hop-Spinner-md-wheel-size));
362
+ opacity: var(--hop-Spinner-track-opacity);
363
+ border: var(--hop-Spinner-track-border);
364
+ border-radius: var(--hop-Spinner-border-radius);
365
+ }
366
+ .Spinner-module__hop-Spinner__fill___-bGVd {
367
+ grid-area: spinner;
368
+ box-sizing: border-box;
369
+ inline-size: var(--width, var(--hop-Spinner-md-wheel-size));
370
+ block-size: var(--height, var(--hop-Spinner-md-wheel-size));
371
+ border: var(--hop-Spinner-fill-border);
372
+ border-inline-start: var(--hop-Spinner-fill-border-inline-start);
373
+ border-radius: var(--hop-Spinner-border-radius);
374
+ animation: var(--hop-Spinner-fill-animation);
375
+ }
376
+ @media (prefers-reduced-motion: reduce) {
377
+ .Spinner-module__hop-Spinner__fill___-bGVd {
378
+ animation-duration: var(--hop-Spinner-fill-animation-reduced-motion-duration);
379
+ }
380
+ }
381
+ .Spinner-module__hop-Spinner__label___mBxTu {
382
+ grid-area: label;
383
+ margin-inline-start: var(--hop-Spinner-label-margin-inline-start);
384
+ }
385
+
386
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/buttons/src/Button.module.css/#css-module-data */
387
+ .Button-module__hop-Button___M1srN {
388
+ --hop-Button-border-radius: var(--hop-shape-rounded-md);
389
+ --hop-Button-focus-ring-color: var(--hop-primary-border-focus);
390
+ --hop-Button-column-gap: var(--hop-space-inline-xs);
391
+ --hop-Button-icon-only-column-gap: 0;
392
+ --hop-Button-outline-size: var(--hop-space-20);
393
+ --hop-Button-border-size: var(--hop-space-10);
394
+ --hop-Button-text-underline-offset: var(--hop-space-20);
395
+ --hop-Button-icon-only-padding: 0;
396
+ --hop-Button-sm-height: 2rem;
397
+ --hop-Button-md-height: 2.5rem;
398
+ --hop-Button-sm-padding: 0 var(--hop-space-inset-md);
399
+ --hop-Button-md-padding: 0 var(--hop-space-inset-md);
400
+ --hop-Button-ghost-sm-padding: 0 var(--hop-space-inset-xs);
401
+ --hop-Button-ghost-md-padding: 0 var(--hop-space-inset-sm);
402
+ --hop-Button-color-disabled: var(--hop-neutral-text-disabled);
403
+ --hop-Button-background-color-disabled: var(--hop-neutral-surface-disabled);
404
+ --hop-Button-border-disabled: var(--hop-Button-border-size) solid var(--hop-Button-background-color-disabled);
405
+ --hop-Button-ghost-color-disabled: var(--hop-neutral-text-disabled);
406
+ --hop-Button-ghost-background-color-disabled: transparent;
407
+ --hop-Button-ghost-border-disabled: var(--hop-Button-border-size) solid var(--hop-Button-ghost-background-color-disabled);
408
+ --hop-Button-primary-color: var(--hop-primary-text-strong);
409
+ --hop-Button-primary-color-hover: var(--hop-primary-text-strong-hover);
410
+ --hop-Button-primary-color-pressed: var(--hop-primary-text-strong);
411
+ --hop-Button-primary-background-color: var(--hop-primary-surface-strong);
412
+ --hop-Button-primary-background-color-hover: var(--hop-primary-surface-strong-hover);
413
+ --hop-Button-primary-background-color-pressed: var(--hop-primary-surface-strong-press);
414
+ --hop-Button-primary-border: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color);
415
+ --hop-Button-primary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color-hover);
416
+ --hop-Button-primary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color-pressed);
417
+ --hop-Button-primary-spinner-color: var(--hop-primary-icon-strong);
418
+ --hop-Button-secondary-color: var(--hop-neutral-text);
419
+ --hop-Button-secondary-color-hover: var(--hop-neutral-text-hover);
420
+ --hop-Button-secondary-color-pressed: var(--hop-neutral-text-press);
421
+ --hop-Button-secondary-background-color: var(--hop-neutral-surface);
422
+ --hop-Button-secondary-background-color-hover: var(--hop-neutral-surface-hover);
423
+ --hop-Button-secondary-background-color-pressed: var(--hop-neutral-surface-press);
424
+ --hop-Button-secondary-border: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong);
425
+ --hop-Button-secondary-border-hover: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong-hover);
426
+ --hop-Button-secondary-border-pressed: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong);
427
+ --hop-Button-secondary-spinner-color: var(--hop-neutral-icon);
428
+ --hop-Button-upsell-color: var(--hop-upsell-text);
429
+ --hop-Button-upsell-color-hover: var(--hop-upsell-text-hover);
430
+ --hop-Button-upsell-color-pressed: var(--hop-upsell-text-press);
431
+ --hop-Button-upsell-background-color: var(--hop-upsell-surface);
432
+ --hop-Button-upsell-background-color-hover: var(--hop-upsell-surface-hover);
433
+ --hop-Button-upsell-background-color-pressed: var(--hop-upsell-surface-press);
434
+ --hop-Button-upsell-border: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color);
435
+ --hop-Button-upsell-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color-hover);
436
+ --hop-Button-upsell-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color-pressed);
437
+ --hop-Button-upsell-spinner-color: var(--hop-upsell-icon);
438
+ --hop-Button-danger-color: var(--hop-danger-text-strong);
439
+ --hop-Button-danger-color-hover: var(--hop-danger-text-strong-hover);
440
+ --hop-Button-danger-color-pressed: var(--hop-danger-text-strong-hover);
441
+ --hop-Button-danger-background-color: var(--hop-danger-surface-strong);
442
+ --hop-Button-danger-background-color-hover: var(--hop-danger-surface-strong-hover);
443
+ --hop-Button-danger-background-color-pressed: var(--hop-danger-surface-press);
444
+ --hop-Button-danger-border: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color);
445
+ --hop-Button-danger-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color-hover);
446
+ --hop-Button-danger-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color-pressed);
447
+ --hop-Button-danger-spinner-color: var(--hop-primary-icon-strong);
448
+ --hop-Button-ghost-primary-color: var(--hop-primary-text);
449
+ --hop-Button-ghost-primary-color-hover: var(--hop-primary-text-hover);
450
+ --hop-Button-ghost-primary-color-pressed: var(--hop-primary-text-press);
451
+ --hop-Button-ghost-primary-background-color: transparent;
452
+ --hop-Button-ghost-primary-background-color-hover: var(--hop-neutral-surface-hover);
453
+ --hop-Button-ghost-primary-background-color-pressed: var(--hop-primary-surface-weak-press);
454
+ --hop-Button-ghost-primary-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color);
455
+ --hop-Button-ghost-primary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color-hover);
456
+ --hop-Button-ghost-primary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color-pressed);
457
+ --hop-Button-ghost-primary-spinner-color: var(--hop-neutral-icon);
458
+ --hop-Button-ghost-secondary-color: var(--hop-neutral-text-weak);
459
+ --hop-Button-ghost-secondary-color-hover: var(--hop-neutral-text-weak-hover);
460
+ --hop-Button-ghost-secondary-color-pressed: var(--hop-neutral-text-weak-press);
461
+ --hop-Button-ghost-secondary-background-color: transparent;
462
+ --hop-Button-ghost-secondary-background-color-hover: var(--hop-neutral-surface-hover);
463
+ --hop-Button-ghost-secondary-background-color-pressed: var(--hop-neutral-surface-press);
464
+ --hop-Button-ghost-secondary-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color);
465
+ --hop-Button-ghost-secondary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color-hover);
466
+ --hop-Button-ghost-secondary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color-pressed);
467
+ --hop-Button-ghost-secondary-spinner-color: var(--hop-neutral-icon);
468
+ --hop-Button-ghost-danger-color: var(--hop-danger-text-weak);
469
+ --hop-Button-ghost-danger-color-hover: var(--hop-danger-text-hover);
470
+ --hop-Button-ghost-danger-color-pressed: var(--hop-danger-text-press);
471
+ --hop-Button-ghost-danger-background-color: transparent;
472
+ --hop-Button-ghost-danger-background-color-hover: var(--hop-neutral-surface-hover);
473
+ --hop-Button-ghost-danger-background-color-pressed: var(--hop-danger-surface-weak-press);
474
+ --hop-Button-ghost-danger-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color);
475
+ --hop-Button-ghost-danger-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color-hover);
476
+ --hop-Button-ghost-danger-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color-pressed);
477
+ --hop-Button-ghost-danger-spinner-color: var(--hop-neutral-icon);
478
+ --inline-size: max-content;
479
+ --block-size: var(--hop-Button-md-height);
480
+ --background-color: var(--hop-primary-surface-strong);
481
+ --color: var(--hop-primary-text-strong);
482
+ --column-gap: var(--hop-Button-column-gap);
483
+ --spinner: var(--hop-primary-icon-strong);
484
+ --border: 0;
485
+ --padding: var(--hop-Button-md-padding);
486
+ --text-underline: none;
487
+ cursor: pointer;
488
+ position: relative;
489
+ overflow: hidden;
490
+ display: flex;
491
+ column-gap: var(--column-gap);
492
+ align-items: center;
493
+ justify-content: center;
494
+ box-sizing: border-box;
495
+ inline-size: var(--inline-size);
496
+ block-size: var(--block-size);
497
+ padding: var(--padding);
498
+ color: var(--color);
499
+ text-decoration: none;
500
+ white-space: nowrap;
501
+ background-color: var(--background-color);
502
+ border: var(--border);
503
+ border-radius: var(--hop-Button-border-radius);
504
+ outline: none;
505
+ outline-offset: var(--hop-Button-outline-size);
506
+ transition:
507
+ color var(--hop-easing-duration-2) var(--hop-easing-productive),
508
+ background-color var(--hop-easing-duration-2) var(--hop-easing-productive),
509
+ border var(--hop-easing-duration-2) var(--hop-easing-productive);
510
+ }
511
+ .Button-module__hop-Button--fluid___GCROP {
512
+ --inline-size: 100%;
513
+ }
514
+ .Button-module__hop-Button--sm___0F6Zs {
515
+ --block-size: var(--hop-Button-sm-height);
516
+ --padding: var(--hop-Button-sm-padding);
517
+ }
518
+ .Button-module__hop-Button--sm___0F6Zs[class*=--ghost] {
519
+ --padding: var(--hop-Button-ghost-sm-padding);
520
+ }
521
+ .Button-module__hop-Button--md___a9OQW[class*=--ghost] {
522
+ --padding: var(--hop-Button-ghost-md-padding);
523
+ }
524
+ .Button-module__hop-Button--icon-only___22irB {
525
+ --column-gap: var(--hop-Button-icon-only-column-gap);
526
+ --padding: var(--hop-Button-icon-only-padding);
527
+ aspect-ratio: 1;
528
+ }
529
+ .Button-module__hop-Button--primary___hqlO9 {
530
+ --background-color: var(--hop-Button-primary-background-color);
531
+ --color: var(--hop-Button-primary-color);
532
+ --border: var(--hop-Button-primary-border);
533
+ --spinner-color: var(--hop-Button-primary-spinner-color);
534
+ }
535
+ .Button-module__hop-Button--primary___hqlO9[data-hovered],
536
+ .Button-module__hop-Button--primary___hqlO9[data-focus-visible] {
537
+ --background-color: var(--hop-Button-primary-background-color-hover);
538
+ --color: var(--hop-Button-primary-color-hover);
539
+ --border: var(--hop-Button-primary-border-hover);
540
+ }
541
+ .Button-module__hop-Button--primary___hqlO9[data-pressed] {
542
+ --background-color: var(--hop-Button-primary-background-color-pressed);
543
+ --color: var(--hop-Button-primary-color-pressed);
544
+ --border: var(--hop-Button-primary-border-pressed);
545
+ }
546
+ .Button-module__hop-Button--secondary___eeNTL {
547
+ --background-color: var(--hop-Button-secondary-background-color);
548
+ --color: var(--hop-Button-secondary-color);
549
+ --border: var(--hop-Button-secondary-border);
550
+ --spinner-color: var(--hop-Button-secondary-spinner-color);
551
+ }
552
+ .Button-module__hop-Button--secondary___eeNTL[data-hovered],
553
+ .Button-module__hop-Button--secondary___eeNTL[data-focus-visible] {
554
+ --background-color: var(--hop-Button-secondary-background-color-hover);
555
+ --color: var(--hop-Button-secondary-color-hover);
556
+ --border: var(--hop-Button-secondary-border-hover);
557
+ }
558
+ .Button-module__hop-Button--secondary___eeNTL[data-pressed] {
559
+ --background-color: var(--hop-Button-secondary-background-color-pressed);
560
+ --color: var(--hop-Button-secondary-color-pressed);
561
+ --border: var(--hop-Button-secondary-border-pressed);
562
+ }
563
+ .Button-module__hop-Button--upsell___ab5Uf {
564
+ --background-color: var(--hop-Button-upsell-background-color);
565
+ --color: var(--hop-Button-upsell-color);
566
+ --border: var(--hop-Button-upsell-border);
567
+ --spinner-color: var(--hop-Button-upsell-spinner-color);
568
+ }
569
+ .Button-module__hop-Button--upsell___ab5Uf[data-hovered],
570
+ .Button-module__hop-Button--upsell___ab5Uf[data-focus-visible] {
571
+ --background-color: var(--hop-Button-upsell-background-color-hover);
572
+ --color: var(--hop-Button-upsell-color-hover);
573
+ --border: var(--hop-Button-upsell-border-hover);
574
+ }
575
+ .Button-module__hop-Button--upsell___ab5Uf[data-pressed] {
576
+ --background-color: var(--hop-Button-upsell-background-color-pressed);
577
+ --color: var(--hop-Button-upsell-color-pressed);
578
+ --border: var(--hop-Button-upsell-border-pressed);
579
+ }
580
+ .Button-module__hop-Button--danger___vGqCj {
581
+ --background-color: var(--hop-Button-danger-background-color);
582
+ --color: var(--hop-Button-danger-color);
583
+ --border: var(--hop-Button-danger-border);
584
+ --spinner-color: var(--hop-Button-danger-spinner-color);
585
+ }
586
+ .Button-module__hop-Button--danger___vGqCj[data-hovered],
587
+ .Button-module__hop-Button--danger___vGqCj[data-focus-visible] {
588
+ --background-color: var(--hop-Button-danger-background-color-hover);
589
+ --color: var(--hop-Button-danger-color-hover);
590
+ --border: var(--hop-Button-danger-border-hover);
591
+ }
592
+ .Button-module__hop-Button--danger___vGqCj[data-pressed] {
593
+ --background-color: var(--hop-Button-danger-background-color-pressed);
594
+ --color: var(--hop-Button-danger-color-pressed);
595
+ --border: var(--hop-Button-danger-border-pressed);
596
+ }
597
+ .Button-module__hop-Button--ghost-primary___K1fli {
598
+ --background-color: var(--hop-Button-ghost-primary-background-color);
599
+ --color: var(--hop-Button-ghost-primary-color);
600
+ --border: var(--hop-Button-ghost-primary-border);
601
+ --spinner-color: var(--hop-Button-ghost-primary-spinner-color);
602
+ }
603
+ .Button-module__hop-Button--ghost-primary___K1fli[data-hovered],
604
+ .Button-module__hop-Button--ghost-primary___K1fli[data-focus-visible] {
605
+ --background-color: var(--hop-Button-ghost-primary-background-color-hover);
606
+ --color: var(--hop-Button-ghost-primary-color-hover);
607
+ --border: var(--hop-Button-ghost-primary-border-hover);
608
+ --text-underline: underline;
609
+ }
610
+ .Button-module__hop-Button--ghost-primary___K1fli[data-pressed] {
611
+ --background-color: var(--hop-Button-ghost-primary-background-color-pressed);
612
+ --color: var(--hop-Button-ghost-primary-color-pressed);
613
+ --border: var(--hop-Button-ghost-primary-border-pressed);
614
+ --text-underline: underline;
615
+ }
616
+ .Button-module__hop-Button--ghost-secondary___5MtDQ {
617
+ --background-color: var(--hop-Button-ghost-secondary-background-color);
618
+ --color: var(--hop-Button-ghost-secondary-color);
619
+ --border: var(--hop-Button-ghost-secondary-border);
620
+ --spinner-color: var(--hop-Button-ghost-secondary-spinner-color);
621
+ }
622
+ .Button-module__hop-Button--ghost-secondary___5MtDQ[data-hovered],
623
+ .Button-module__hop-Button--ghost-secondary___5MtDQ[data-focus-visible] {
624
+ --background-color: var(--hop-Button-ghost-secondary-background-color-hover);
625
+ --color: var(--hop-Button-ghost-secondary-color-hover);
626
+ --border: var(--hop-Button-ghost-secondary-border-hover);
627
+ --text-underline: underline;
628
+ }
629
+ .Button-module__hop-Button--ghost-secondary___5MtDQ[data-pressed] {
630
+ --background-color: var(--hop-Button-ghost-secondary-background-color-pressed);
631
+ --color: var(--hop-Button-ghost-secondary-color-pressed);
632
+ --border: var(--hop-Button-ghost-secondary-border-pressed);
633
+ --text-underline: underline;
634
+ }
635
+ .Button-module__hop-Button--ghost-danger___F83U0 {
636
+ --background-color: var(--hop-Button-ghost-danger-background-color);
637
+ --color: var(--hop-Button-ghost-danger-color);
638
+ --border: var(--hop-Button-ghost-danger-border);
639
+ --spinner-color: var(--hop-Button-ghost-danger-spinner-color);
640
+ }
641
+ .Button-module__hop-Button--ghost-danger___F83U0[data-hovered],
642
+ .Button-module__hop-Button--ghost-danger___F83U0[data-focus-visible] {
643
+ --background-color: var(--hop-Button-ghost-danger-background-color-hover);
644
+ --color: var(--hop-Button-ghost-danger-color-hover);
645
+ --border: var(--hop-Button-ghost-danger-border-hover);
646
+ --text-underline: underline;
647
+ }
648
+ .Button-module__hop-Button--ghost-danger___F83U0[data-pressed] {
649
+ --background-color: var(--hop-Button-ghost-danger-background-color-pressed);
650
+ --color: var(--hop-Button-ghost-danger-color-pressed);
651
+ --border: var(--hop-Button-ghost-danger-border-pressed);
652
+ --text-underline: underline;
653
+ }
654
+ .Button-module__hop-Button___M1srN[data-focus-visible] {
655
+ outline: var(--hop-Button-outline-size) solid var(--hop-Button-focus-ring-color);
656
+ }
657
+ .Button-module__hop-Button___M1srN[data-disabled],
658
+ .Button-module__hop-Button--loading___PvMXo {
659
+ cursor: not-allowed;
660
+ }
661
+ .Button-module__hop-Button___M1srN[data-disabled] {
662
+ --background-color: var(--hop-Button-background-color-disabled);
663
+ --color: var(--hop-Button-color-disabled);
664
+ --border: var(--hop-Button-border-disabled);
665
+ }
666
+ .Button-module__hop-Button___M1srN[class*=--ghost][data-disabled] {
667
+ --background-color: var(--hop-Button-ghost-background-color-disabled);
668
+ --color: var(--hop-Button-ghost-color-disabled);
669
+ --border: var(--hop-Button-ghost-border-disabled);
670
+ }
671
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--primary___hqlO9 {
672
+ --background-color: var(--hop-Button-primary-background-color);
673
+ --color: var(--hop-Button-primary-color);
674
+ --border: var(--hop-Button-primary-border);
675
+ }
676
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--secondary___eeNTL {
677
+ --background-color: var(--hop-Button-secondary-background-color);
678
+ --color: var(--hop-Button-secondary-color);
679
+ --border: var(--hop-Button-secondary-border);
680
+ }
681
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--upsell___ab5Uf {
682
+ --background-color: var(--hop-Button-upsell-background-color);
683
+ --color: var(--hop-Button-upsell-color);
684
+ --border: var(--hop-Button-upsell-border);
685
+ }
686
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--danger___vGqCj {
687
+ --background-color: var(--hop-Button-danger-background-color);
688
+ --color: var(--hop-Button-danger-color);
689
+ --border: var(--hop-Button-danger-border);
690
+ }
691
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--ghost-primary___K1fli {
692
+ --background-color: var(--hop-Button-ghost-primary-background-color);
693
+ --color: var(--hop-Button-ghost-primary-color);
694
+ --border: var(--hop-Button-ghost-primary-border);
695
+ --text-underline: none;
696
+ }
697
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--ghost-secondary___5MtDQ {
698
+ --background-color: var(--hop-Button-ghost-secondary-background-color);
699
+ --color: var(--hop-Button-ghost-secondary-color);
700
+ --border: var(--hop-Button-ghost-secondary-border);
701
+ --text-underline: none;
702
+ }
703
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--ghost-danger___F83U0 {
704
+ --background-color: var(--hop-Button-ghost-danger-background-color);
705
+ --color: var(--hop-Button-ghost-danger-color);
706
+ --border: var(--hop-Button-ghost-danger-border);
707
+ --text-underline: none;
708
+ }
709
+ .Button-module__hop-Button__Spinner___oJ124 {
710
+ position: absolute;
711
+ color: var(--spinner-color);
712
+ }
713
+ .Button-module__hop-Button__icon___3qLql,
714
+ .Button-module__hop-Button__icon-list___8YvWB {
715
+ flex: 0 0 auto;
716
+ justify-self: end;
717
+ order: 1;
718
+ }
719
+ .Button-module__hop-Button__text___LAcjY {
720
+ user-select: none;
721
+ overflow: visible;
722
+ flex: 0 1 auto;
723
+ order: 2;
724
+ font-weight: var(--hop-font-weight-505);
725
+ text-decoration: var(--text-underline);
726
+ text-underline-offset: 0.125rem;
727
+ text-wrap: nowrap;
728
+ }
729
+ .Button-module__hop-Button__end-icon___-fm8M,
730
+ .Button-module__hop-Button__end-icon-list___yI0-C {
731
+ flex: 0 0 auto;
732
+ order: 3;
733
+ }
734
+ .Button-module__hop-Button___M1srN .Button-module__hop-Button__icon-list___8YvWB,
735
+ .Button-module__hop-Button___M1srN .Button-module__hop-Button__end-icon-list___yI0-C {
736
+ flex-wrap: nowrap;
737
+ }
738
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button___M1srN > *:not(.Button-module__hop-Button__Spinner___oJ124) {
739
+ opacity: 0;
740
+ }
741
+
742
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/buttons/src/ButtonGroup.module.css/#css-module-data */
743
+ .ButtonGroup-module__hop-ButtonGroup___gelmV {
744
+ display: inline-flex;
745
+ flex-wrap: nowrap;
746
+ gap: var(--hop-space-inline-md);
747
+ }
748
+ .ButtonGroup-module__hop-ButtonGroup--horizontal___UVKLL {
749
+ align-items: center;
750
+ }
751
+ .ButtonGroup-module__hop-ButtonGroup--vertical___3ofI0 {
752
+ flex-direction: column;
753
+ gap: var(--hop-space-stack-md);
754
+ justify-content: center;
755
+ }
756
+ .ButtonGroup-module__hop-ButtonGroup--start___xZhf2.ButtonGroup-module__hop-ButtonGroup--vertical___3ofI0 {
757
+ align-items: flex-start;
758
+ }
759
+ .ButtonGroup-module__hop-ButtonGroup--center___wmyqi.ButtonGroup-module__hop-ButtonGroup--vertical___3ofI0 {
760
+ align-items: center;
761
+ }
762
+ .ButtonGroup-module__hop-ButtonGroup--end___5V2JT.ButtonGroup-module__hop-ButtonGroup--vertical___3ofI0 {
763
+ align-items: flex-end;
764
+ }
765
+ .ButtonGroup-module__hop-ButtonGroup--start___xZhf2.ButtonGroup-module__hop-ButtonGroup--horizontal___UVKLL {
766
+ justify-content: flex-start;
767
+ }
768
+ .ButtonGroup-module__hop-ButtonGroup--center___wmyqi.ButtonGroup-module__hop-ButtonGroup--horizontal___UVKLL {
769
+ justify-content: center;
770
+ }
771
+ .ButtonGroup-module__hop-ButtonGroup--end___5V2JT.ButtonGroup-module__hop-ButtonGroup--horizontal___UVKLL {
772
+ justify-content: flex-end;
773
+ }
774
+ .ButtonGroup-module__hop-ButtonGroup--wrap___3A-HD {
775
+ flex-wrap: wrap;
776
+ }
777
+ .ButtonGroup-module__hop-ButtonGroup--fluid___rcGGk {
778
+ inline-size: 100%;
779
+ }
780
+
781
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/buttons/src/EmbeddedButton.module.css/#css-module-data */
782
+ .EmbeddedButton-module__hop-EmbeddedButton___woFlm {
783
+ --hop-EmbeddedButton-border-radius: var(--hop-shape-rounded-md);
784
+ --hop-EmbeddedButton-focus-ring-color: var(--hop-primary-border-focus);
785
+ --hop-EmbeddedButton-effect-border-radius: var(--hop-shape-circle);
786
+ --hop-EmbeddedButton-effect-square-border-radius: var(--hop-shape-rounded-sm);
787
+ --hop-EmbeddedButton-md-height: 1.5rem;
788
+ --hop-EmbeddedButton-md-width: 1.5rem;
789
+ --hop-EmbeddedButton-md-effect-height: 1rem;
790
+ --hop-EmbeddedButton-md-effect-width: 1rem;
791
+ --hop-EmbeddedButton-lg-height: 1.5rem;
792
+ --hop-EmbeddedButton-lg-width: 1.5rem;
793
+ --hop-EmbeddedButton-lg-effect-height: 1.5rem;
794
+ --hop-EmbeddedButton-lg-effect-width: 1.5rem;
795
+ --hop-EmbeddedButton-neutral-color: var(--hop-neutral-icon-weak);
796
+ --hop-EmbeddedButton-neutral-color-hovered: var(--hop-neutral-icon-weak-hover);
797
+ --hop-EmbeddedButton-neutral-color-focused: var(--hop-neutral-icon-weak-hover);
798
+ --hop-EmbeddedButton-neutral-color-pressed: var(--hop-neutral-icon-weak-press);
799
+ --hop-EmbeddedButton-neutral-color-disabled: var(--hop-neutral-icon-disabled);
800
+ --hop-EmbeddedButton-neutral-effect-background-color: transparent;
801
+ --hop-EmbeddedButton-neutral-effect-background-color-hovered: var(--hop-neutral-surface-weak-hover);
802
+ --hop-EmbeddedButton-neutral-effect-background-color-focused: var(--hop-neutral-surface-weak-hover);
803
+ --hop-EmbeddedButton-neutral-effect-background-color-pressed: var(--hop-neutral-surface-weak-press);
804
+ --hop-EmbeddedButton-neutral-effect-background-color-disabled: transparent;
805
+ --hop-EmbeddedButton-subdued-color: var(--hop-neutral-icon-weak);
806
+ --hop-EmbeddedButton-subdued-color-hovered: var(--hop-neutral-icon-weak-hover);
807
+ --hop-EmbeddedButton-subdued-color-focused: var(--hop-neutral-icon-weak-hover);
808
+ --hop-EmbeddedButton-subdued-color-pressed: var(--hop-neutral-icon-weak-press);
809
+ --hop-EmbeddedButton-subdued-color-disabled: var(--hop-neutral-icon-disabled);
810
+ --hop-EmbeddedButton-subdued-effect-background-color: transparent;
811
+ --hop-EmbeddedButton-subdued-effect-background-color-hovered: var(--hop-neutral-surface-weak-hover);
812
+ --hop-EmbeddedButton-subdued-effect-background-color-focused: var(--hop-neutral-surface-weak-hover);
813
+ --hop-EmbeddedButton-subdued-effect-background-color-pressed: var(--hop-neutral-surface-weak-press);
814
+ --hop-EmbeddedButton-subdued-effect-background-color-disabled: transparent;
815
+ --hop-EmbeddedButton-progress-color: var(--hop-status-progress-icon);
816
+ --hop-EmbeddedButton-progress-color-hovered: var(--hop-status-progress-icon-hover);
817
+ --hop-EmbeddedButton-progress-color-focused: var(--hop-status-progress-icon-hover);
818
+ --hop-EmbeddedButton-progress-color-pressed: var(--hop-status-progress-icon-press);
819
+ --hop-EmbeddedButton-progress-color-disabled: var(--hop-status-progress-icon-disabled);
820
+ --hop-EmbeddedButton-progress-effect-background-color: transparent;
821
+ --hop-EmbeddedButton-progress-effect-background-color-hovered: var(--hop-status-progress-surface-hover);
822
+ --hop-EmbeddedButton-progress-effect-background-color-focused: var(--hop-status-progress-surface-hover);
823
+ --hop-EmbeddedButton-progress-effect-background-color-pressed: var(--hop-status-progress-surface-press);
824
+ --hop-EmbeddedButton-progress-effect-background-color-disabled: transparent;
825
+ --hop-EmbeddedButton-positive-color: var(--hop-status-positive-icon);
826
+ --hop-EmbeddedButton-positive-color-hovered: var(--hop-status-positive-icon-hover);
827
+ --hop-EmbeddedButton-positive-color-focused: var(--hop-status-positive-icon-hover);
828
+ --hop-EmbeddedButton-positive-color-pressed: var(--hop-status-positive-icon-press);
829
+ --hop-EmbeddedButton-positive-color-disabled: var(--hop-status-positive-icon-disabled);
830
+ --hop-EmbeddedButton-positive-effect-background-color: transparent;
831
+ --hop-EmbeddedButton-positive-effect-background-color-hovered: var(--hop-status-positive-surface-hover);
832
+ --hop-EmbeddedButton-positive-effect-background-color-focused: var(--hop-status-positive-surface-hover);
833
+ --hop-EmbeddedButton-positive-effect-background-color-pressed: var(--hop-status-positive-surface-press);
834
+ --hop-EmbeddedButton-positive-effect-background-color-disabled: transparent;
835
+ --hop-EmbeddedButton-caution-color: var(--hop-status-caution-icon);
836
+ --hop-EmbeddedButton-caution-color-hovered: var(--hop-status-caution-icon-hover);
837
+ --hop-EmbeddedButton-caution-color-focused: var(--hop-status-caution-icon-hover);
838
+ --hop-EmbeddedButton-caution-color-pressed: var(--hop-status-caution-icon-press);
839
+ --hop-EmbeddedButton-caution-color-disabled: var(--hop-status-caution-icon-disabled);
840
+ --hop-EmbeddedButton-caution-effect-background-color: transparent;
841
+ --hop-EmbeddedButton-caution-effect-background-color-hovered: var(--hop-status-caution-surface-hover);
842
+ --hop-EmbeddedButton-caution-effect-background-color-focused: var(--hop-status-caution-surface-hover);
843
+ --hop-EmbeddedButton-caution-effect-background-color-pressed: var(--hop-status-caution-surface-press);
844
+ --hop-EmbeddedButton-caution-effect-background-color-disabled: transparent;
845
+ --hop-EmbeddedButton-negative-color: var(--hop-status-negative-icon);
846
+ --hop-EmbeddedButton-negative-color-hovered: var(--hop-status-negative-icon-hover);
847
+ --hop-EmbeddedButton-negative-color-focused: var(--hop-status-negative-icon-hover);
848
+ --hop-EmbeddedButton-negative-color-pressed: var(--hop-status-negative-icon-press);
849
+ --hop-EmbeddedButton-negative-color-disabled: var(--hop-status-negative-icon-disabled);
850
+ --hop-EmbeddedButton-negative-effect-background-color: transparent;
851
+ --hop-EmbeddedButton-negative-effect-background-color-hovered: var(--hop-status-negative-surface-hover);
852
+ --hop-EmbeddedButton-negative-effect-background-color-focused: var(--hop-status-negative-surface-hover);
853
+ --hop-EmbeddedButton-negative-effect-background-color-pressed: var(--hop-status-negative-surface-press);
854
+ --hop-EmbeddedButton-negative-effect-background-color-disabled: transparent;
855
+ --hop-EmbeddedButton-option1-color: var(--hop-status-option1-icon);
856
+ --hop-EmbeddedButton-option1-color-hovered: var(--hop-status-option1-icon-hover);
857
+ --hop-EmbeddedButton-option1-color-focused: var(--hop-status-option1-icon-hover);
858
+ --hop-EmbeddedButton-option1-color-pressed: var(--hop-status-option1-icon-press);
859
+ --hop-EmbeddedButton-option1-color-disabled: var(--hop-status-option1-icon-disabled);
860
+ --hop-EmbeddedButton-option1-effect-background-color: transparent;
861
+ --hop-EmbeddedButton-option1-effect-background-color-hovered: var(--hop-status-option1-surface-hover);
862
+ --hop-EmbeddedButton-option1-effect-background-color-focused: var(--hop-status-option1-surface-hover);
863
+ --hop-EmbeddedButton-option1-effect-background-color-pressed: var(--hop-status-option1-surface-press);
864
+ --hop-EmbeddedButton-option1-effect-background-color-disabled: transparent;
865
+ --hop-EmbeddedButton-option2-color: var(--hop-status-option2-icon);
866
+ --hop-EmbeddedButton-option2-color-hovered: var(--hop-status-option2-icon-hover);
867
+ --hop-EmbeddedButton-option2-color-focused: var(--hop-status-option2-icon-hover);
868
+ --hop-EmbeddedButton-option2-color-pressed: var(--hop-status-option2-icon-press);
869
+ --hop-EmbeddedButton-option2-color-disabled: var(--hop-status-option2-icon-disabled);
870
+ --hop-EmbeddedButton-option2-effect-background-color: transparent;
871
+ --hop-EmbeddedButton-option2-effect-background-color-hovered: var(--hop-status-option2-surface-hover);
872
+ --hop-EmbeddedButton-option2-effect-background-color-focused: var(--hop-status-option2-surface-hover);
873
+ --hop-EmbeddedButton-option2-effect-background-color-pressed: var(--hop-status-option2-surface-press);
874
+ --hop-EmbeddedButton-option2-effect-background-color-disabled: transparent;
875
+ --hop-EmbeddedButton-option3-color: var(--hop-status-option3-icon);
876
+ --hop-EmbeddedButton-option3-color-hovered: var(--hop-status-option3-icon-hover);
877
+ --hop-EmbeddedButton-option3-color-focused: var(--hop-status-option3-icon-hover);
878
+ --hop-EmbeddedButton-option3-color-pressed: var(--hop-status-option3-icon-press);
879
+ --hop-EmbeddedButton-option3-color-disabled: var(--hop-status-option3-icon-disabled);
880
+ --hop-EmbeddedButton-option3-effect-background-color: transparent;
881
+ --hop-EmbeddedButton-option3-effect-background-color-hovered: var(--hop-status-option3-surface-hover);
882
+ --hop-EmbeddedButton-option3-effect-background-color-focused: var(--hop-status-option3-surface-hover);
883
+ --hop-EmbeddedButton-option3-effect-background-color-pressed: var(--hop-status-option3-surface-press);
884
+ --hop-EmbeddedButton-option3-effect-background-color-disabled: transparent;
885
+ --hop-EmbeddedButton-option4-color: var(--hop-status-option4-icon);
886
+ --hop-EmbeddedButton-option4-color-hovered: var(--hop-status-option4-icon-hover);
887
+ --hop-EmbeddedButton-option4-color-focused: var(--hop-status-option4-icon-hover);
888
+ --hop-EmbeddedButton-option4-color-pressed: var(--hop-status-option4-icon-press);
889
+ --hop-EmbeddedButton-option4-color-disabled: var(--hop-status-option4-icon-disabled);
890
+ --hop-EmbeddedButton-option4-effect-background-color: transparent;
891
+ --hop-EmbeddedButton-option4-effect-background-color-hovered: var(--hop-status-option4-surface-hover);
892
+ --hop-EmbeddedButton-option4-effect-background-color-focused: var(--hop-status-option4-surface-hover);
893
+ --hop-EmbeddedButton-option4-effect-background-color-pressed: var(--hop-status-option4-surface-press);
894
+ --hop-EmbeddedButton-option4-effect-background-color-disabled: transparent;
895
+ --hop-EmbeddedButton-option5-color: var(--hop-status-option5-icon);
896
+ --hop-EmbeddedButton-option5-color-hovered: var(--hop-status-option5-icon-hover);
897
+ --hop-EmbeddedButton-option5-color-focused: var(--hop-status-option5-icon-hover);
898
+ --hop-EmbeddedButton-option5-color-pressed: var(--hop-status-option5-icon-press);
899
+ --hop-EmbeddedButton-option5-color-disabled: var(--hop-status-option5-icon-disabled);
900
+ --hop-EmbeddedButton-option5-effect-background-color: transparent;
901
+ --hop-EmbeddedButton-option5-effect-background-color-hovered: var(--hop-status-option5-surface-hover);
902
+ --hop-EmbeddedButton-option5-effect-background-color-focused: var(--hop-status-option5-surface-hover);
903
+ --hop-EmbeddedButton-option5-effect-background-color-pressed: var(--hop-status-option5-surface-press);
904
+ --hop-EmbeddedButton-option5-effect-background-color-disabled: transparent;
905
+ --hop-EmbeddedButton-option6-color: var(--hop-status-option6-icon);
906
+ --hop-EmbeddedButton-option6-color-hovered: var(--hop-status-option6-icon-hover);
907
+ --hop-EmbeddedButton-option6-color-focused: var(--hop-status-option6-icon-hover);
908
+ --hop-EmbeddedButton-option6-color-pressed: var(--hop-status-option6-icon-press);
909
+ --hop-EmbeddedButton-option6-color-disabled: var(--hop-status-option6-icon-disabled);
910
+ --hop-EmbeddedButton-option6-effect-background-color: transparent;
911
+ --hop-EmbeddedButton-option6-effect-background-color-hovered: var(--hop-status-option6-surface-hover);
912
+ --hop-EmbeddedButton-option6-effect-background-color-focused: var(--hop-status-option6-surface-hover);
913
+ --hop-EmbeddedButton-option6-effect-background-color-pressed: var(--hop-status-option6-surface-press);
914
+ --hop-EmbeddedButton-option6-effect-background-color-disabled: transparent;
915
+ --hop-EmbeddedButton-selected-color: var(--hop-neutral-icon-weak-selected);
916
+ --hop-EmbeddedButton-selected-effect-background-color: var(--hop-neutral-surface-weak-selected);
917
+ --spinner: var(--hop-primary-icon-strong);
918
+ --padding-inline: 0;
919
+ --padding-block: 0;
920
+ --effect-background-color: var(--hop-EmbeddedButton-neutral-effect-background-color);
921
+ --color: var(--hop-EmbeddedButton-neutral-color);
922
+ --transition: var(--hop-easing-duration-2) var(--hop-easing-productive);
923
+ --effect-border-radius: var(--hop-EmbeddedButton-effect-border-radius);
924
+ --focus-ring-size: 0.125rem;
925
+ cursor: pointer;
926
+ position: relative;
927
+ overflow: hidden;
928
+ display: flex;
929
+ flex-shrink: 0;
930
+ align-items: center;
931
+ justify-content: center;
932
+ box-sizing: border-box;
933
+ inline-size: var(--inline-size);
934
+ block-size: var(--block-size);
935
+ padding-block: var(--padding-block);
936
+ padding-inline: var(--padding-inline);
937
+ color: var(--color);
938
+ text-decoration: none;
939
+ white-space: nowrap;
940
+ background: none;
941
+ border: none;
942
+ border-radius: var(--hop-EmbeddedButton-border-radius);
943
+ outline: none;
944
+ transition: color var(--transition);
945
+ }
946
+ .EmbeddedButton-module__hop-EmbeddedButton___woFlm::before {
947
+ content: "";
948
+ position: absolute;
949
+ inset-block-start: 50%;
950
+ inset-inline-start: 50%;
951
+ transform: translate(-50%, -50%);
952
+ display: block;
953
+ inline-size: var(--effect-inline-size);
954
+ block-size: var(--effect-block-size);
955
+ background-color: var(--effect-background-color);
956
+ border-radius: var(--effect-border-radius);
957
+ transition: background-color var(--transition);
958
+ }
959
+ .EmbeddedButton-module__hop-EmbeddedButton___woFlm[data-square] {
960
+ --effect-border-radius: var(--hop-EmbeddedButton-effect-square-border-radius);
961
+ }
962
+ .EmbeddedButton-module__hop-EmbeddedButton--md___3yoFa {
963
+ --inline-size: var(--hop-EmbeddedButton-md-width);
964
+ --block-size: var(--hop-EmbeddedButton-md-height);
965
+ --focus-ring-offset: calc(-1 * var(--focus-ring-size));
966
+ }
967
+ .EmbeddedButton-module__hop-EmbeddedButton--lg___MRdx7 {
968
+ --inline-size: var(--hop-EmbeddedButton-lg-width);
969
+ --block-size: var(--hop-EmbeddedButton-lg-height);
970
+ --focus-ring-offset: 0;
971
+ }
972
+ .EmbeddedButton-module__hop-EmbeddedButton--md___3yoFa::before {
973
+ --effect-inline-size: var(--hop-EmbeddedButton-md-effect-width);
974
+ --effect-block-size: var(--hop-EmbeddedButton-md-effect-height);
975
+ }
976
+ .EmbeddedButton-module__hop-EmbeddedButton--lg___MRdx7::before {
977
+ --effect-inline-size: var(--hop-EmbeddedButton-lg-effect-width);
978
+ --effect-block-size: var(--hop-EmbeddedButton-lg-effect-height);
979
+ }
980
+ .EmbeddedButton-module__hop-EmbeddedButton--neutral___CK1jL {
981
+ --color: var(--hop-EmbeddedButton-neutral-color);
982
+ --effect-background-color: var(--hop-EmbeddedButton-neutral-effect-background-color);
983
+ }
984
+ .EmbeddedButton-module__hop-EmbeddedButton--subdued___Q83b3 {
985
+ --color: var(--hop-EmbeddedButton-subdued-color);
986
+ --effect-background-color: var(--hop-EmbeddedButton-subdued-effect-background-color);
987
+ }
988
+ .EmbeddedButton-module__hop-EmbeddedButton--progress___kprL7 {
989
+ --color: var(--hop-EmbeddedButton-progress-color);
990
+ --effect-background-color: var(--hop-EmbeddedButton-progress-effect-background-color);
991
+ }
992
+ .EmbeddedButton-module__hop-EmbeddedButton--positive___LOINq {
993
+ --color: var(--hop-EmbeddedButton-positive-color);
994
+ --effect-background-color: var(--hop-EmbeddedButton-positive-effect-background-color);
995
+ }
996
+ .EmbeddedButton-module__hop-EmbeddedButton--caution___-AO2U {
997
+ --color: var(--hop-EmbeddedButton-caution-color);
998
+ --effect-background-color: var(--hop-EmbeddedButton-caution-effect-background-color);
999
+ }
1000
+ .EmbeddedButton-module__hop-EmbeddedButton--negative___1JzHh {
1001
+ --color: var(--hop-EmbeddedButton-negative-color);
1002
+ --effect-background-color: var(--hop-EmbeddedButton-negative-effect-background-color);
1003
+ }
1004
+ .EmbeddedButton-module__hop-EmbeddedButton--option1___Bw8ud {
1005
+ --color: var(--hop-EmbeddedButton-option1-color);
1006
+ --effect-background-color: var(--hop-EmbeddedButton-option1-effect-background-color);
1007
+ }
1008
+ .EmbeddedButton-module__hop-EmbeddedButton--option2___EowaN {
1009
+ --color: var(--hop-EmbeddedButton-option2-color);
1010
+ --effect-background-color: var(--hop-EmbeddedButton-option2-effect-background-color);
1011
+ }
1012
+ .EmbeddedButton-module__hop-EmbeddedButton--option3___3-iFh {
1013
+ --color: var(--hop-EmbeddedButton-option3-color);
1014
+ --effect-background-color: var(--hop-EmbeddedButton-option3-effect-background-color);
1015
+ }
1016
+ .EmbeddedButton-module__hop-EmbeddedButton--option4___MFrBc {
1017
+ --color: var(--hop-EmbeddedButton-option4-color);
1018
+ --effect-background-color: var(--hop-EmbeddedButton-option4-effect-background-color);
1019
+ }
1020
+ .EmbeddedButton-module__hop-EmbeddedButton--option5___SU2-8 {
1021
+ --color: var(--hop-EmbeddedButton-option5-color);
1022
+ --effect-background-color: var(--hop-EmbeddedButton-option5-effect-background-color);
1023
+ }
1024
+ .EmbeddedButton-module__hop-EmbeddedButton--option6___Zgz-a {
1025
+ --color: var(--hop-EmbeddedButton-option6-color);
1026
+ --effect-background-color: var(--hop-EmbeddedButton-option6-effect-background-color);
1027
+ }
1028
+ .EmbeddedButton-module__hop-EmbeddedButton___woFlm[data-selected] {
1029
+ --color: var(--hop-EmbeddedButton-selected-color);
1030
+ --effect-background-color: var(--hop-EmbeddedButton-selected-effect-background-color);
1031
+ }
1032
+ .EmbeddedButton-module__hop-EmbeddedButton___woFlm[data-focus-visible] {
1033
+ outline: var(--focus-ring-size) solid var(--hop-EmbeddedButton-focus-ring-color);
1034
+ outline-offset: var(--focus-ring-offset);
1035
+ }
1036
+ .EmbeddedButton-module__hop-EmbeddedButton___woFlm[data-disabled] {
1037
+ cursor: not-allowed;
1038
+ }
1039
+ .EmbeddedButton-module__hop-EmbeddedButton--neutral___CK1jL[data-hovered] {
1040
+ --effect-background-color: var(--hop-EmbeddedButton-neutral-effect-background-color-hovered);
1041
+ --color: var(--hop-EmbeddedButton-neutral-color-hovered);
1042
+ }
1043
+ .EmbeddedButton-module__hop-EmbeddedButton--neutral___CK1jL[data-focus-visible] {
1044
+ --effect-background-color: var(--hop-EmbeddedButton-neutral-effect-background-color-focused);
1045
+ --color: var(--hop-EmbeddedButton-neutral-color-focused);
1046
+ }
1047
+ .EmbeddedButton-module__hop-EmbeddedButton--neutral___CK1jL[data-pressed] {
1048
+ --effect-background-color: var(--hop-EmbeddedButton-neutral-effect-background-color-pressed);
1049
+ --color: var(--hop-EmbeddedButton-neutral-color-pressed);
1050
+ }
1051
+ .EmbeddedButton-module__hop-EmbeddedButton--neutral___CK1jL[data-disabled] {
1052
+ --effect-background-color: var(--hop-EmbeddedButton-neutral-effect-background-color-disabled);
1053
+ --color: var(--hop-EmbeddedButton-neutral-color-disabled);
1054
+ }
1055
+ .EmbeddedButton-module__hop-EmbeddedButton--subdued___Q83b3[data-hovered] {
1056
+ --effect-background-color: var(--hop-EmbeddedButton-subdued-effect-background-color-hovered);
1057
+ --color: var(--hop-EmbeddedButton-subdued-color-hovered);
1058
+ }
1059
+ .EmbeddedButton-module__hop-EmbeddedButton--subdued___Q83b3[data-focus-visible] {
1060
+ --effect-background-color: var(--hop-EmbeddedButton-subdued-effect-background-color-focused);
1061
+ --color: var(--hop-EmbeddedButton-subdued-color-focused);
1062
+ }
1063
+ .EmbeddedButton-module__hop-EmbeddedButton--subdued___Q83b3[data-pressed] {
1064
+ --effect-background-color: var(--hop-EmbeddedButton-subdued-effect-background-color-pressed);
1065
+ --color: var(--hop-EmbeddedButton-subdued-color-pressed);
1066
+ }
1067
+ .EmbeddedButton-module__hop-EmbeddedButton--subdued___Q83b3[data-disabled] {
1068
+ --effect-background-color: var(--hop-EmbeddedButton-subdued-effect-background-color-disabled);
1069
+ --color: var(--hop-EmbeddedButton-subdued-color-disabled);
1070
+ }
1071
+ .EmbeddedButton-module__hop-EmbeddedButton--progress___kprL7[data-hovered] {
1072
+ --effect-background-color: var(--hop-EmbeddedButton-progress-effect-background-color-hovered);
1073
+ --color: var(--hop-EmbeddedButton-progress-color-hovered);
1074
+ }
1075
+ .EmbeddedButton-module__hop-EmbeddedButton--progress___kprL7[data-focus-visible] {
1076
+ --effect-background-color: var(--hop-EmbeddedButton-progress-effect-background-color-focused);
1077
+ --color: var(--hop-EmbeddedButton-progress-color-focused);
1078
+ }
1079
+ .EmbeddedButton-module__hop-EmbeddedButton--progress___kprL7[data-pressed] {
1080
+ --effect-background-color: var(--hop-EmbeddedButton-progress-effect-background-color-pressed);
1081
+ --color: var(--hop-EmbeddedButton-progress-color-pressed);
1082
+ }
1083
+ .EmbeddedButton-module__hop-EmbeddedButton--progress___kprL7[data-disabled] {
1084
+ --effect-background-color: var(--hop-EmbeddedButton-progress-effect-background-color-disabled);
1085
+ --color: var(--hop-EmbeddedButton-progress-color-disabled);
1086
+ }
1087
+ .EmbeddedButton-module__hop-EmbeddedButton--positive___LOINq[data-hovered] {
1088
+ --effect-background-color: var(--hop-EmbeddedButton-positive-effect-background-color-hovered);
1089
+ --color: var(--hop-EmbeddedButton-positive-color-hovered);
1090
+ }
1091
+ .EmbeddedButton-module__hop-EmbeddedButton--positive___LOINq[data-focus-visible] {
1092
+ --effect-background-color: var(--hop-EmbeddedButton-positive-effect-background-color-focused);
1093
+ --color: var(--hop-EmbeddedButton-positive-color-focused);
1094
+ }
1095
+ .EmbeddedButton-module__hop-EmbeddedButton--positive___LOINq[data-pressed] {
1096
+ --effect-background-color: var(--hop-EmbeddedButton-positive-effect-background-color-pressed);
1097
+ --color: var(--hop-EmbeddedButton-positive-color-pressed);
1098
+ }
1099
+ .EmbeddedButton-module__hop-EmbeddedButton--positive___LOINq[data-disabled] {
1100
+ --effect-background-color: var(--hop-EmbeddedButton-positive-effect-background-color-disabled);
1101
+ --color: var(--hop-EmbeddedButton-positive-color-disabled);
1102
+ }
1103
+ .EmbeddedButton-module__hop-EmbeddedButton--caution___-AO2U[data-hovered] {
1104
+ --effect-background-color: var(--hop-EmbeddedButton-caution-effect-background-color-hovered);
1105
+ --color: var(--hop-EmbeddedButton-caution-color-hovered);
1106
+ }
1107
+ .EmbeddedButton-module__hop-EmbeddedButton--caution___-AO2U[data-focus-visible] {
1108
+ --effect-background-color: var(--hop-EmbeddedButton-caution-effect-background-color-focused);
1109
+ --color: var(--hop-EmbeddedButton-caution-color-focused);
1110
+ }
1111
+ .EmbeddedButton-module__hop-EmbeddedButton--caution___-AO2U[data-pressed] {
1112
+ --effect-background-color: var(--hop-EmbeddedButton-caution-effect-background-color-pressed);
1113
+ --color: var(--hop-EmbeddedButton-caution-color-pressed);
1114
+ }
1115
+ .EmbeddedButton-module__hop-EmbeddedButton--caution___-AO2U[data-disabled] {
1116
+ --effect-background-color: var(--hop-EmbeddedButton-caution-effect-background-color-disabled);
1117
+ --color: var(--hop-EmbeddedButton-caution-color-disabled);
1118
+ }
1119
+ .EmbeddedButton-module__hop-EmbeddedButton--negative___1JzHh[data-hovered] {
1120
+ --effect-background-color: var(--hop-EmbeddedButton-negative-effect-background-color-hovered);
1121
+ --color: var(--hop-EmbeddedButton-negative-color-hovered);
1122
+ }
1123
+ .EmbeddedButton-module__hop-EmbeddedButton--negative___1JzHh[data-focus-visible] {
1124
+ --effect-background-color: var(--hop-EmbeddedButton-negative-effect-background-color-focused);
1125
+ --color: var(--hop-EmbeddedButton-negative-color-focused);
1126
+ }
1127
+ .EmbeddedButton-module__hop-EmbeddedButton--negative___1JzHh[data-pressed] {
1128
+ --effect-background-color: var(--hop-EmbeddedButton-negative-effect-background-color-pressed);
1129
+ --color: var(--hop-EmbeddedButton-negative-color-pressed);
1130
+ }
1131
+ .EmbeddedButton-module__hop-EmbeddedButton--negative___1JzHh[data-disabled] {
1132
+ --effect-background-color: var(--hop-EmbeddedButton-negative-effect-background-color-disabled);
1133
+ --color: var(--hop-EmbeddedButton-negative-color-disabled);
1134
+ }
1135
+ .EmbeddedButton-module__hop-EmbeddedButton--option1___Bw8ud[data-hovered] {
1136
+ --effect-background-color: var(--hop-EmbeddedButton-option1-effect-background-color-hovered);
1137
+ --color: var(--hop-EmbeddedButton-option1-color-hovered);
1138
+ }
1139
+ .EmbeddedButton-module__hop-EmbeddedButton--option1___Bw8ud[data-focus-visible] {
1140
+ --effect-background-color: var(--hop-EmbeddedButton-option1-effect-background-color-focused);
1141
+ --color: var(--hop-EmbeddedButton-option1-color-focused);
1142
+ }
1143
+ .EmbeddedButton-module__hop-EmbeddedButton--option1___Bw8ud[data-pressed] {
1144
+ --effect-background-color: var(--hop-EmbeddedButton-option1-effect-background-color-pressed);
1145
+ --color: var(--hop-EmbeddedButton-option1-color-pressed);
1146
+ }
1147
+ .EmbeddedButton-module__hop-EmbeddedButton--option1___Bw8ud[data-disabled] {
1148
+ --effect-background-color: var(--hop-EmbeddedButton-option1-effect-background-color-disabled);
1149
+ --color: var(--hop-EmbeddedButton-option1-color-disabled);
1150
+ }
1151
+ .EmbeddedButton-module__hop-EmbeddedButton--option2___EowaN[data-hovered] {
1152
+ --effect-background-color: var(--hop-EmbeddedButton-option2-effect-background-color-hovered);
1153
+ --color: var(--hop-EmbeddedButton-option2-color-hovered);
1154
+ }
1155
+ .EmbeddedButton-module__hop-EmbeddedButton--option2___EowaN[data-focus-visible] {
1156
+ --effect-background-color: var(--hop-EmbeddedButton-option2-effect-background-color-focused);
1157
+ --color: var(--hop-EmbeddedButton-option2-color-focused);
1158
+ }
1159
+ .EmbeddedButton-module__hop-EmbeddedButton--option2___EowaN[data-pressed] {
1160
+ --effect-background-color: var(--hop-EmbeddedButton-option2-effect-background-color-pressed);
1161
+ --color: var(--hop-EmbeddedButton-option2-color-pressed);
1162
+ }
1163
+ .EmbeddedButton-module__hop-EmbeddedButton--option2___EowaN[data-disabled] {
1164
+ --effect-background-color: var(--hop-EmbeddedButton-option2-effect-background-color-disabled);
1165
+ --color: var(--hop-EmbeddedButton-option2-color-disabled);
1166
+ }
1167
+ .EmbeddedButton-module__hop-EmbeddedButton--option3___3-iFh[data-hovered] {
1168
+ --effect-background-color: var(--hop-EmbeddedButton-option3-effect-background-color-hovered);
1169
+ --color: var(--hop-EmbeddedButton-option3-color-hovered);
1170
+ }
1171
+ .EmbeddedButton-module__hop-EmbeddedButton--option3___3-iFh[data-focus-visible] {
1172
+ --effect-background-color: var(--hop-EmbeddedButton-option3-effect-background-color-focused);
1173
+ --color: var(--hop-EmbeddedButton-option3-color-focused);
1174
+ }
1175
+ .EmbeddedButton-module__hop-EmbeddedButton--option3___3-iFh[data-pressed] {
1176
+ --effect-background-color: var(--hop-EmbeddedButton-option3-effect-background-color-pressed);
1177
+ --color: var(--hop-EmbeddedButton-option3-color-pressed);
1178
+ }
1179
+ .EmbeddedButton-module__hop-EmbeddedButton--option3___3-iFh[data-disabled] {
1180
+ --effect-background-color: var(--hop-EmbeddedButton-option3-effect-background-color-disabled);
1181
+ --color: var(--hop-EmbeddedButton-option3-color-disabled);
1182
+ }
1183
+ .EmbeddedButton-module__hop-EmbeddedButton--option4___MFrBc[data-hovered] {
1184
+ --effect-background-color: var(--hop-EmbeddedButton-option4-effect-background-color-hovered);
1185
+ --color: var(--hop-EmbeddedButton-option4-color-hovered);
1186
+ }
1187
+ .EmbeddedButton-module__hop-EmbeddedButton--option4___MFrBc[data-focus-visible] {
1188
+ --effect-background-color: var(--hop-EmbeddedButton-option4-effect-background-color-focused);
1189
+ --color: var(--hop-EmbeddedButton-option4-color-focused);
1190
+ }
1191
+ .EmbeddedButton-module__hop-EmbeddedButton--option4___MFrBc[data-pressed] {
1192
+ --effect-background-color: var(--hop-EmbeddedButton-option4-effect-background-color-pressed);
1193
+ --color: var(--hop-EmbeddedButton-option4-color-pressed);
1194
+ }
1195
+ .EmbeddedButton-module__hop-EmbeddedButton--option4___MFrBc[data-disabled] {
1196
+ --effect-background-color: var(--hop-EmbeddedButton-option4-effect-background-color-disabled);
1197
+ --color: var(--hop-EmbeddedButton-option4-color-disabled);
1198
+ }
1199
+ .EmbeddedButton-module__hop-EmbeddedButton--option5___SU2-8[data-hovered] {
1200
+ --effect-background-color: var(--hop-EmbeddedButton-option5-effect-background-color-hovered);
1201
+ --color: var(--hop-EmbeddedButton-option5-color-hovered);
1202
+ }
1203
+ .EmbeddedButton-module__hop-EmbeddedButton--option5___SU2-8[data-focus-visible] {
1204
+ --effect-background-color: var(--hop-EmbeddedButton-option5-effect-background-color-focused);
1205
+ --color: var(--hop-EmbeddedButton-option5-color-focused);
1206
+ }
1207
+ .EmbeddedButton-module__hop-EmbeddedButton--option5___SU2-8[data-pressed] {
1208
+ --effect-background-color: var(--hop-EmbeddedButton-option5-effect-background-color-pressed);
1209
+ --color: var(--hop-EmbeddedButton-option5-color-pressed);
1210
+ }
1211
+ .EmbeddedButton-module__hop-EmbeddedButton--option5___SU2-8[data-disabled] {
1212
+ --effect-background-color: var(--hop-EmbeddedButton-option5-effect-background-color-disabled);
1213
+ --color: var(--hop-EmbeddedButton-option5-color-disabled);
1214
+ }
1215
+ .EmbeddedButton-module__hop-EmbeddedButton--option6___Zgz-a[data-hovered] {
1216
+ --effect-background-color: var(--hop-EmbeddedButton-option6-effect-background-color-hovered);
1217
+ --color: var(--hop-EmbeddedButton-option6-color-hovered);
1218
+ }
1219
+ .EmbeddedButton-module__hop-EmbeddedButton--option6___Zgz-a[data-focus-visible] {
1220
+ --effect-background-color: var(--hop-EmbeddedButton-option6-effect-background-color-focused);
1221
+ --color: var(--hop-EmbeddedButton-option6-color-focused);
1222
+ }
1223
+ .EmbeddedButton-module__hop-EmbeddedButton--option6___Zgz-a[data-pressed] {
1224
+ --effect-background-color: var(--hop-EmbeddedButton-option6-effect-background-color-pressed);
1225
+ --color: var(--hop-EmbeddedButton-option6-color-pressed);
1226
+ }
1227
+ .EmbeddedButton-module__hop-EmbeddedButton--option6___Zgz-a[data-disabled] {
1228
+ --effect-background-color: var(--hop-EmbeddedButton-option6-effect-background-color-disabled);
1229
+ --color: var(--hop-EmbeddedButton-option6-color-disabled);
1230
+ }
1231
+ .EmbeddedButton-module__hop-EmbeddedButton__icon___7jSBR {
1232
+ position: relative;
1233
+ }
1234
+
1235
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/buttons/src/CloseButton.module.css/#css-module-data */
1236
+ button.CloseButton-module__hop-CloseButton___GS-3t {
1237
+ --hop-CloseButton-margin-top: 0rem;
1238
+ --hop-CloseButton-padding: 0rem;
1239
+ --hop-CloseButton-width: fit-content;
1240
+ --hop-CloseButton-height: fit-content;
1241
+ inline-size: var(--hop-CloseButton-width);
1242
+ block-size: var(--hop-CloseButton-height);
1243
+ margin-block-start: var(--hop-CloseButton-margin-top);
1244
+ padding: var(--hop-CloseButton-padding);
1245
+ }
1246
+
1247
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/buttons/src/LinkButton.module.css/#css-module-data */
1248
+ .Button-module__hop-Button___M1srN {
1249
+ --hop-Button-border-radius: var(--hop-shape-rounded-md);
1250
+ --hop-Button-focus-ring-color: var(--hop-primary-border-focus);
1251
+ --hop-Button-column-gap: var(--hop-space-inline-xs);
1252
+ --hop-Button-icon-only-column-gap: 0;
1253
+ --hop-Button-outline-size: var(--hop-space-20);
1254
+ --hop-Button-border-size: var(--hop-space-10);
1255
+ --hop-Button-text-underline-offset: var(--hop-space-20);
1256
+ --hop-Button-icon-only-padding: 0;
1257
+ --hop-Button-sm-height: 2rem;
1258
+ --hop-Button-md-height: 2.5rem;
1259
+ --hop-Button-sm-padding: 0 var(--hop-space-inset-md);
1260
+ --hop-Button-md-padding: 0 var(--hop-space-inset-md);
1261
+ --hop-Button-ghost-sm-padding: 0 var(--hop-space-inset-xs);
1262
+ --hop-Button-ghost-md-padding: 0 var(--hop-space-inset-sm);
1263
+ --hop-Button-color-disabled: var(--hop-neutral-text-disabled);
1264
+ --hop-Button-background-color-disabled: var(--hop-neutral-surface-disabled);
1265
+ --hop-Button-border-disabled: var(--hop-Button-border-size) solid var(--hop-Button-background-color-disabled);
1266
+ --hop-Button-ghost-color-disabled: var(--hop-neutral-text-disabled);
1267
+ --hop-Button-ghost-background-color-disabled: transparent;
1268
+ --hop-Button-ghost-border-disabled: var(--hop-Button-border-size) solid var(--hop-Button-ghost-background-color-disabled);
1269
+ --hop-Button-primary-color: var(--hop-primary-text-strong);
1270
+ --hop-Button-primary-color-hover: var(--hop-primary-text-strong-hover);
1271
+ --hop-Button-primary-color-pressed: var(--hop-primary-text-strong);
1272
+ --hop-Button-primary-background-color: var(--hop-primary-surface-strong);
1273
+ --hop-Button-primary-background-color-hover: var(--hop-primary-surface-strong-hover);
1274
+ --hop-Button-primary-background-color-pressed: var(--hop-primary-surface-strong-press);
1275
+ --hop-Button-primary-border: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color);
1276
+ --hop-Button-primary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color-hover);
1277
+ --hop-Button-primary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color-pressed);
1278
+ --hop-Button-primary-spinner-color: var(--hop-primary-icon-strong);
1279
+ --hop-Button-secondary-color: var(--hop-neutral-text);
1280
+ --hop-Button-secondary-color-hover: var(--hop-neutral-text-hover);
1281
+ --hop-Button-secondary-color-pressed: var(--hop-neutral-text-press);
1282
+ --hop-Button-secondary-background-color: var(--hop-neutral-surface);
1283
+ --hop-Button-secondary-background-color-hover: var(--hop-neutral-surface-hover);
1284
+ --hop-Button-secondary-background-color-pressed: var(--hop-neutral-surface-press);
1285
+ --hop-Button-secondary-border: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong);
1286
+ --hop-Button-secondary-border-hover: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong-hover);
1287
+ --hop-Button-secondary-border-pressed: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong);
1288
+ --hop-Button-secondary-spinner-color: var(--hop-neutral-icon);
1289
+ --hop-Button-upsell-color: var(--hop-upsell-text);
1290
+ --hop-Button-upsell-color-hover: var(--hop-upsell-text-hover);
1291
+ --hop-Button-upsell-color-pressed: var(--hop-upsell-text-press);
1292
+ --hop-Button-upsell-background-color: var(--hop-upsell-surface);
1293
+ --hop-Button-upsell-background-color-hover: var(--hop-upsell-surface-hover);
1294
+ --hop-Button-upsell-background-color-pressed: var(--hop-upsell-surface-press);
1295
+ --hop-Button-upsell-border: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color);
1296
+ --hop-Button-upsell-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color-hover);
1297
+ --hop-Button-upsell-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color-pressed);
1298
+ --hop-Button-upsell-spinner-color: var(--hop-upsell-icon);
1299
+ --hop-Button-danger-color: var(--hop-danger-text-strong);
1300
+ --hop-Button-danger-color-hover: var(--hop-danger-text-strong-hover);
1301
+ --hop-Button-danger-color-pressed: var(--hop-danger-text-strong-hover);
1302
+ --hop-Button-danger-background-color: var(--hop-danger-surface-strong);
1303
+ --hop-Button-danger-background-color-hover: var(--hop-danger-surface-strong-hover);
1304
+ --hop-Button-danger-background-color-pressed: var(--hop-danger-surface-press);
1305
+ --hop-Button-danger-border: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color);
1306
+ --hop-Button-danger-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color-hover);
1307
+ --hop-Button-danger-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color-pressed);
1308
+ --hop-Button-danger-spinner-color: var(--hop-primary-icon-strong);
1309
+ --hop-Button-ghost-primary-color: var(--hop-primary-text);
1310
+ --hop-Button-ghost-primary-color-hover: var(--hop-primary-text-hover);
1311
+ --hop-Button-ghost-primary-color-pressed: var(--hop-primary-text-press);
1312
+ --hop-Button-ghost-primary-background-color: transparent;
1313
+ --hop-Button-ghost-primary-background-color-hover: var(--hop-neutral-surface-hover);
1314
+ --hop-Button-ghost-primary-background-color-pressed: var(--hop-primary-surface-weak-press);
1315
+ --hop-Button-ghost-primary-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color);
1316
+ --hop-Button-ghost-primary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color-hover);
1317
+ --hop-Button-ghost-primary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color-pressed);
1318
+ --hop-Button-ghost-primary-spinner-color: var(--hop-neutral-icon);
1319
+ --hop-Button-ghost-secondary-color: var(--hop-neutral-text-weak);
1320
+ --hop-Button-ghost-secondary-color-hover: var(--hop-neutral-text-weak-hover);
1321
+ --hop-Button-ghost-secondary-color-pressed: var(--hop-neutral-text-weak-press);
1322
+ --hop-Button-ghost-secondary-background-color: transparent;
1323
+ --hop-Button-ghost-secondary-background-color-hover: var(--hop-neutral-surface-hover);
1324
+ --hop-Button-ghost-secondary-background-color-pressed: var(--hop-neutral-surface-press);
1325
+ --hop-Button-ghost-secondary-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color);
1326
+ --hop-Button-ghost-secondary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color-hover);
1327
+ --hop-Button-ghost-secondary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color-pressed);
1328
+ --hop-Button-ghost-secondary-spinner-color: var(--hop-neutral-icon);
1329
+ --hop-Button-ghost-danger-color: var(--hop-danger-text-weak);
1330
+ --hop-Button-ghost-danger-color-hover: var(--hop-danger-text-hover);
1331
+ --hop-Button-ghost-danger-color-pressed: var(--hop-danger-text-press);
1332
+ --hop-Button-ghost-danger-background-color: transparent;
1333
+ --hop-Button-ghost-danger-background-color-hover: var(--hop-neutral-surface-hover);
1334
+ --hop-Button-ghost-danger-background-color-pressed: var(--hop-danger-surface-weak-press);
1335
+ --hop-Button-ghost-danger-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color);
1336
+ --hop-Button-ghost-danger-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color-hover);
1337
+ --hop-Button-ghost-danger-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color-pressed);
1338
+ --hop-Button-ghost-danger-spinner-color: var(--hop-neutral-icon);
1339
+ --inline-size: max-content;
1340
+ --block-size: var(--hop-Button-md-height);
1341
+ --background-color: var(--hop-primary-surface-strong);
1342
+ --color: var(--hop-primary-text-strong);
1343
+ --column-gap: var(--hop-Button-column-gap);
1344
+ --spinner: var(--hop-primary-icon-strong);
1345
+ --border: 0;
1346
+ --padding: var(--hop-Button-md-padding);
1347
+ --text-underline: none;
1348
+ cursor: pointer;
1349
+ position: relative;
1350
+ overflow: hidden;
1351
+ display: flex;
1352
+ column-gap: var(--column-gap);
1353
+ align-items: center;
1354
+ justify-content: center;
1355
+ box-sizing: border-box;
1356
+ inline-size: var(--inline-size);
1357
+ block-size: var(--block-size);
1358
+ padding: var(--padding);
1359
+ color: var(--color);
1360
+ text-decoration: none;
1361
+ white-space: nowrap;
1362
+ background-color: var(--background-color);
1363
+ border: var(--border);
1364
+ border-radius: var(--hop-Button-border-radius);
1365
+ outline: none;
1366
+ outline-offset: var(--hop-Button-outline-size);
1367
+ transition:
1368
+ color var(--hop-easing-duration-2) var(--hop-easing-productive),
1369
+ background-color var(--hop-easing-duration-2) var(--hop-easing-productive),
1370
+ border var(--hop-easing-duration-2) var(--hop-easing-productive);
1371
+ }
1372
+ .Button-module__hop-Button--fluid___GCROP {
1373
+ --inline-size: 100%;
1374
+ }
1375
+ .Button-module__hop-Button--sm___0F6Zs {
1376
+ --block-size: var(--hop-Button-sm-height);
1377
+ --padding: var(--hop-Button-sm-padding);
1378
+ }
1379
+ .Button-module__hop-Button--sm___0F6Zs[class*=--ghost] {
1380
+ --padding: var(--hop-Button-ghost-sm-padding);
1381
+ }
1382
+ .Button-module__hop-Button--md___a9OQW[class*=--ghost] {
1383
+ --padding: var(--hop-Button-ghost-md-padding);
1384
+ }
1385
+ .Button-module__hop-Button--icon-only___22irB {
1386
+ --column-gap: var(--hop-Button-icon-only-column-gap);
1387
+ --padding: var(--hop-Button-icon-only-padding);
1388
+ aspect-ratio: 1;
1389
+ }
1390
+ .Button-module__hop-Button--primary___hqlO9 {
1391
+ --background-color: var(--hop-Button-primary-background-color);
1392
+ --color: var(--hop-Button-primary-color);
1393
+ --border: var(--hop-Button-primary-border);
1394
+ --spinner-color: var(--hop-Button-primary-spinner-color);
1395
+ }
1396
+ .Button-module__hop-Button--primary___hqlO9[data-hovered],
1397
+ .Button-module__hop-Button--primary___hqlO9[data-focus-visible] {
1398
+ --background-color: var(--hop-Button-primary-background-color-hover);
1399
+ --color: var(--hop-Button-primary-color-hover);
1400
+ --border: var(--hop-Button-primary-border-hover);
1401
+ }
1402
+ .Button-module__hop-Button--primary___hqlO9[data-pressed] {
1403
+ --background-color: var(--hop-Button-primary-background-color-pressed);
1404
+ --color: var(--hop-Button-primary-color-pressed);
1405
+ --border: var(--hop-Button-primary-border-pressed);
1406
+ }
1407
+ .Button-module__hop-Button--secondary___eeNTL {
1408
+ --background-color: var(--hop-Button-secondary-background-color);
1409
+ --color: var(--hop-Button-secondary-color);
1410
+ --border: var(--hop-Button-secondary-border);
1411
+ --spinner-color: var(--hop-Button-secondary-spinner-color);
1412
+ }
1413
+ .Button-module__hop-Button--secondary___eeNTL[data-hovered],
1414
+ .Button-module__hop-Button--secondary___eeNTL[data-focus-visible] {
1415
+ --background-color: var(--hop-Button-secondary-background-color-hover);
1416
+ --color: var(--hop-Button-secondary-color-hover);
1417
+ --border: var(--hop-Button-secondary-border-hover);
1418
+ }
1419
+ .Button-module__hop-Button--secondary___eeNTL[data-pressed] {
1420
+ --background-color: var(--hop-Button-secondary-background-color-pressed);
1421
+ --color: var(--hop-Button-secondary-color-pressed);
1422
+ --border: var(--hop-Button-secondary-border-pressed);
1423
+ }
1424
+ .Button-module__hop-Button--upsell___ab5Uf {
1425
+ --background-color: var(--hop-Button-upsell-background-color);
1426
+ --color: var(--hop-Button-upsell-color);
1427
+ --border: var(--hop-Button-upsell-border);
1428
+ --spinner-color: var(--hop-Button-upsell-spinner-color);
1429
+ }
1430
+ .Button-module__hop-Button--upsell___ab5Uf[data-hovered],
1431
+ .Button-module__hop-Button--upsell___ab5Uf[data-focus-visible] {
1432
+ --background-color: var(--hop-Button-upsell-background-color-hover);
1433
+ --color: var(--hop-Button-upsell-color-hover);
1434
+ --border: var(--hop-Button-upsell-border-hover);
1435
+ }
1436
+ .Button-module__hop-Button--upsell___ab5Uf[data-pressed] {
1437
+ --background-color: var(--hop-Button-upsell-background-color-pressed);
1438
+ --color: var(--hop-Button-upsell-color-pressed);
1439
+ --border: var(--hop-Button-upsell-border-pressed);
1440
+ }
1441
+ .Button-module__hop-Button--danger___vGqCj {
1442
+ --background-color: var(--hop-Button-danger-background-color);
1443
+ --color: var(--hop-Button-danger-color);
1444
+ --border: var(--hop-Button-danger-border);
1445
+ --spinner-color: var(--hop-Button-danger-spinner-color);
1446
+ }
1447
+ .Button-module__hop-Button--danger___vGqCj[data-hovered],
1448
+ .Button-module__hop-Button--danger___vGqCj[data-focus-visible] {
1449
+ --background-color: var(--hop-Button-danger-background-color-hover);
1450
+ --color: var(--hop-Button-danger-color-hover);
1451
+ --border: var(--hop-Button-danger-border-hover);
1452
+ }
1453
+ .Button-module__hop-Button--danger___vGqCj[data-pressed] {
1454
+ --background-color: var(--hop-Button-danger-background-color-pressed);
1455
+ --color: var(--hop-Button-danger-color-pressed);
1456
+ --border: var(--hop-Button-danger-border-pressed);
1457
+ }
1458
+ .Button-module__hop-Button--ghost-primary___K1fli {
1459
+ --background-color: var(--hop-Button-ghost-primary-background-color);
1460
+ --color: var(--hop-Button-ghost-primary-color);
1461
+ --border: var(--hop-Button-ghost-primary-border);
1462
+ --spinner-color: var(--hop-Button-ghost-primary-spinner-color);
1463
+ }
1464
+ .Button-module__hop-Button--ghost-primary___K1fli[data-hovered],
1465
+ .Button-module__hop-Button--ghost-primary___K1fli[data-focus-visible] {
1466
+ --background-color: var(--hop-Button-ghost-primary-background-color-hover);
1467
+ --color: var(--hop-Button-ghost-primary-color-hover);
1468
+ --border: var(--hop-Button-ghost-primary-border-hover);
1469
+ --text-underline: underline;
1470
+ }
1471
+ .Button-module__hop-Button--ghost-primary___K1fli[data-pressed] {
1472
+ --background-color: var(--hop-Button-ghost-primary-background-color-pressed);
1473
+ --color: var(--hop-Button-ghost-primary-color-pressed);
1474
+ --border: var(--hop-Button-ghost-primary-border-pressed);
1475
+ --text-underline: underline;
1476
+ }
1477
+ .Button-module__hop-Button--ghost-secondary___5MtDQ {
1478
+ --background-color: var(--hop-Button-ghost-secondary-background-color);
1479
+ --color: var(--hop-Button-ghost-secondary-color);
1480
+ --border: var(--hop-Button-ghost-secondary-border);
1481
+ --spinner-color: var(--hop-Button-ghost-secondary-spinner-color);
1482
+ }
1483
+ .Button-module__hop-Button--ghost-secondary___5MtDQ[data-hovered],
1484
+ .Button-module__hop-Button--ghost-secondary___5MtDQ[data-focus-visible] {
1485
+ --background-color: var(--hop-Button-ghost-secondary-background-color-hover);
1486
+ --color: var(--hop-Button-ghost-secondary-color-hover);
1487
+ --border: var(--hop-Button-ghost-secondary-border-hover);
1488
+ --text-underline: underline;
1489
+ }
1490
+ .Button-module__hop-Button--ghost-secondary___5MtDQ[data-pressed] {
1491
+ --background-color: var(--hop-Button-ghost-secondary-background-color-pressed);
1492
+ --color: var(--hop-Button-ghost-secondary-color-pressed);
1493
+ --border: var(--hop-Button-ghost-secondary-border-pressed);
1494
+ --text-underline: underline;
1495
+ }
1496
+ .Button-module__hop-Button--ghost-danger___F83U0 {
1497
+ --background-color: var(--hop-Button-ghost-danger-background-color);
1498
+ --color: var(--hop-Button-ghost-danger-color);
1499
+ --border: var(--hop-Button-ghost-danger-border);
1500
+ --spinner-color: var(--hop-Button-ghost-danger-spinner-color);
1501
+ }
1502
+ .Button-module__hop-Button--ghost-danger___F83U0[data-hovered],
1503
+ .Button-module__hop-Button--ghost-danger___F83U0[data-focus-visible] {
1504
+ --background-color: var(--hop-Button-ghost-danger-background-color-hover);
1505
+ --color: var(--hop-Button-ghost-danger-color-hover);
1506
+ --border: var(--hop-Button-ghost-danger-border-hover);
1507
+ --text-underline: underline;
1508
+ }
1509
+ .Button-module__hop-Button--ghost-danger___F83U0[data-pressed] {
1510
+ --background-color: var(--hop-Button-ghost-danger-background-color-pressed);
1511
+ --color: var(--hop-Button-ghost-danger-color-pressed);
1512
+ --border: var(--hop-Button-ghost-danger-border-pressed);
1513
+ --text-underline: underline;
1514
+ }
1515
+ .Button-module__hop-Button___M1srN[data-focus-visible] {
1516
+ outline: var(--hop-Button-outline-size) solid var(--hop-Button-focus-ring-color);
1517
+ }
1518
+ .Button-module__hop-Button___M1srN[data-disabled],
1519
+ .Button-module__hop-Button--loading___PvMXo {
1520
+ cursor: not-allowed;
1521
+ }
1522
+ .Button-module__hop-Button___M1srN[data-disabled] {
1523
+ --background-color: var(--hop-Button-background-color-disabled);
1524
+ --color: var(--hop-Button-color-disabled);
1525
+ --border: var(--hop-Button-border-disabled);
1526
+ }
1527
+ .Button-module__hop-Button___M1srN[class*=--ghost][data-disabled] {
1528
+ --background-color: var(--hop-Button-ghost-background-color-disabled);
1529
+ --color: var(--hop-Button-ghost-color-disabled);
1530
+ --border: var(--hop-Button-ghost-border-disabled);
1531
+ }
1532
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--primary___hqlO9 {
1533
+ --background-color: var(--hop-Button-primary-background-color);
1534
+ --color: var(--hop-Button-primary-color);
1535
+ --border: var(--hop-Button-primary-border);
1536
+ }
1537
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--secondary___eeNTL {
1538
+ --background-color: var(--hop-Button-secondary-background-color);
1539
+ --color: var(--hop-Button-secondary-color);
1540
+ --border: var(--hop-Button-secondary-border);
1541
+ }
1542
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--upsell___ab5Uf {
1543
+ --background-color: var(--hop-Button-upsell-background-color);
1544
+ --color: var(--hop-Button-upsell-color);
1545
+ --border: var(--hop-Button-upsell-border);
1546
+ }
1547
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--danger___vGqCj {
1548
+ --background-color: var(--hop-Button-danger-background-color);
1549
+ --color: var(--hop-Button-danger-color);
1550
+ --border: var(--hop-Button-danger-border);
1551
+ }
1552
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--ghost-primary___K1fli {
1553
+ --background-color: var(--hop-Button-ghost-primary-background-color);
1554
+ --color: var(--hop-Button-ghost-primary-color);
1555
+ --border: var(--hop-Button-ghost-primary-border);
1556
+ --text-underline: none;
1557
+ }
1558
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--ghost-secondary___5MtDQ {
1559
+ --background-color: var(--hop-Button-ghost-secondary-background-color);
1560
+ --color: var(--hop-Button-ghost-secondary-color);
1561
+ --border: var(--hop-Button-ghost-secondary-border);
1562
+ --text-underline: none;
1563
+ }
1564
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button--ghost-danger___F83U0 {
1565
+ --background-color: var(--hop-Button-ghost-danger-background-color);
1566
+ --color: var(--hop-Button-ghost-danger-color);
1567
+ --border: var(--hop-Button-ghost-danger-border);
1568
+ --text-underline: none;
1569
+ }
1570
+ .Button-module__hop-Button__Spinner___oJ124 {
1571
+ position: absolute;
1572
+ color: var(--spinner-color);
1573
+ }
1574
+ .Button-module__hop-Button__icon___3qLql,
1575
+ .Button-module__hop-Button__icon-list___8YvWB {
1576
+ flex: 0 0 auto;
1577
+ justify-self: end;
1578
+ order: 1;
1579
+ }
1580
+ .Button-module__hop-Button__text___LAcjY {
1581
+ user-select: none;
1582
+ overflow: visible;
1583
+ flex: 0 1 auto;
1584
+ order: 2;
1585
+ font-weight: var(--hop-font-weight-505);
1586
+ text-decoration: var(--text-underline);
1587
+ text-underline-offset: 0.125rem;
1588
+ text-wrap: nowrap;
1589
+ }
1590
+ .Button-module__hop-Button__end-icon___-fm8M,
1591
+ .Button-module__hop-Button__end-icon-list___yI0-C {
1592
+ flex: 0 0 auto;
1593
+ order: 3;
1594
+ }
1595
+ .Button-module__hop-Button___M1srN .Button-module__hop-Button__icon-list___8YvWB,
1596
+ .Button-module__hop-Button___M1srN .Button-module__hop-Button__end-icon-list___yI0-C {
1597
+ flex-wrap: nowrap;
1598
+ }
1599
+ .Button-module__hop-Button--loading___PvMXo.Button-module__hop-Button___M1srN > *:not(.Button-module__hop-Button__Spinner___oJ124) {
1600
+ opacity: 0;
1601
+ }
1602
+ .LinkButton-module__hop-LinkButton___H8H5- {
1603
+ }
1604
+ .LinkButton-module__hop-LinkButton--fluid___BxWfs {
1605
+ }
1606
+ .LinkButton-module__hop-LinkButton--sm___PaGWC {
1607
+ }
1608
+ .LinkButton-module__hop-LinkButton--icon-only___Erzzh {
1609
+ }
1610
+ .LinkButton-module__hop-LinkButton--primary___2G641 {
1611
+ }
1612
+ .LinkButton-module__hop-LinkButton--secondary___OxMQu {
1613
+ }
1614
+ .LinkButton-module__hop-LinkButton--upsell___fl-AY {
1615
+ }
1616
+ .LinkButton-module__hop-LinkButton--danger___Scoar {
1617
+ }
1618
+ .LinkButton-module__hop-LinkButton--ghost-primary___qMDz- {
1619
+ }
1620
+ .LinkButton-module__hop-LinkButton--ghost-secondary___6LD8Q {
1621
+ }
1622
+ .LinkButton-module__hop-LinkButton--ghost-danger___ouoq5 {
1623
+ }
1624
+ .LinkButton-module__hop-LinkButton__Spinner___e2ijE {
1625
+ }
1626
+ .LinkButton-module__hop-LinkButton__icon___sZuxo,
1627
+ .LinkButton-module__hop-LinkButton__icon-list___kQDmx {
1628
+ }
1629
+ .LinkButton-module__hop-LinkButton__text___jrGDA {
1630
+ }
1631
+ .LinkButton-module__hop-LinkButton__end-icon___sYwVy,
1632
+ .LinkButton-module__hop-LinkButton__end-icon-list___3Z71y {
1633
+ }
1634
+ .LinkButton-module__hop-LinkButton___H8H5- .LinkButton-module__hop-LinkButton__icon-list___kQDmx,
1635
+ .LinkButton-module__hop-LinkButton___H8H5- .LinkButton-module__hop-LinkButton__end-icon-list___3Z71y {
1636
+ flex-wrap: nowrap;
1637
+ }
1638
+
1639
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/hopper-provider/src/HopperProvider.module.css/#css-module-data */
1640
+ .HopperProvider-module__hop-HopperProvider___fR-AZ {
1641
+ font-family: var(--hop-body-md-font-family);
1642
+ font-size: var(--hop-body-md-font-size);
1643
+ font-weight: var(--hop-body-md-font-weight);
1644
+ -webkit-font-smoothing: antialiased;
1645
+ line-height: var(--hop-body-md-line-height);
1646
+ color: var(--hop-neutral-text);
1647
+ }
1648
+
1649
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/link/src/Link.module.css/#css-module-data */
1650
+ .Link-module__hop-Link___vMa0U {
1651
+ --hop-Link-border-radius: var(--hop-shape-rounded-sm);
1652
+ --hop-Link-focus-ring-color: var(--hop-primary-border-focus);
1653
+ --hop-Link-color-disabled: var(--hop-neutral-text-disabled);
1654
+ --hop-Link-column-gap: var(--hop-space-inline-xs);
1655
+ --hop-Link-xs-font-size: var(--hop-body-xs-font-size);
1656
+ --hop-Link-xs-font-family: var(--hop-body-xs-font-family);
1657
+ --hop-Link-xs-font-weight: var(--hop-body-xs-font-weight);
1658
+ --hop-Link-xs-line-height: var(--hop-body-xs-line-height);
1659
+ --hop-Link-sm-font-size: var(--hop-body-sm-font-size);
1660
+ --hop-Link-sm-font-family: var(--hop-body-sm-font-family);
1661
+ --hop-Link-sm-font-weight: var(--hop-body-sm-font-weight);
1662
+ --hop-Link-sm-line-height: var(--hop-body-sm-line-height);
1663
+ --hop-Link-md-font-size: var(--hop-body-md-font-size);
1664
+ --hop-Link-md-font-family: var(--hop-body-md-font-family);
1665
+ --hop-Link-md-font-weight: var(--hop-body-md-font-weight);
1666
+ --hop-Link-md-line-height: var(--hop-body-md-line-height);
1667
+ --hop-Link-lg-font-size: var(--hop-body-lg-font-size);
1668
+ --hop-Link-lg-font-family: var(--hop-body-lg-font-family);
1669
+ --hop-Link-lg-font-weight: var(--hop-body-lg-font-weight);
1670
+ --hop-Link-lg-line-height: var(--hop-body-lg-line-height);
1671
+ --hop-Link-xl-font-size: var(--hop-body-xl-font-size);
1672
+ --hop-Link-xl-font-family: var(--hop-body-xl-font-family);
1673
+ --hop-Link-xl-font-weight: var(--hop-body-xl-font-weight);
1674
+ --hop-Link-xl-line-height: var(--hop-body-xl-line-height);
1675
+ --hop-Link-2xl-font-size: var(--hop-body-2xl-font-size);
1676
+ --hop-Link-2xl-font-family: var(--hop-body-2xl-font-family);
1677
+ --hop-Link-2xl-font-weight: var(--hop-body-2xl-font-weight);
1678
+ --hop-Link-2xl-line-height: var(--hop-body-2xl-line-height);
1679
+ --hop-Link-inherit-size-font-size: inherit;
1680
+ --hop-Link-inherit-size-font-family: inherit;
1681
+ --hop-Link-inherit-size-font-weight: inherit;
1682
+ --hop-Link-inherit-size-line-height: inherit;
1683
+ --hop-Link-primary-text-color: var(--hop-primary-text);
1684
+ --hop-Link-primary-text-disabled-color: var(--hop-primary-text-disabled);
1685
+ --hop-Link-primary-text-hover-color: var(--hop-primary-text-hover);
1686
+ --hop-Link-primary-text-pressed-color: var(--hop-primary-text-press);
1687
+ --hop-Link-neutral-text-color: var(--hop-neutral-text);
1688
+ --hop-Link-neutral-text-disabled-color: var(--hop-neutral-text-disabled);
1689
+ --hop-Link-neutral-text-hover-color: var(--hop-neutral-text-hover);
1690
+ --hop-Link-neutral-text-pressed-color: var(--hop-neutral-text-press);
1691
+ --hop-Link-padding-standalone: 0.125em 0;
1692
+ --hop-Link-padding-standalone-xs: var(--hop-space-20) 0;
1693
+ --hop-Link-padding-standalone-sm: var(--hop-space-20) 0;
1694
+ --hop-Link-padding-standalone-md: var(--hop-space-40) 0;
1695
+ --hop-Link-padding-standalone-lg: var(--hop-space-40) 0;
1696
+ --hop-Link-padding-standalone-xl: var(--hop-space-80) 0;
1697
+ --hop-Link-padding-standalone-2xl: var(--hop-space-80) 0;
1698
+ cursor: pointer;
1699
+ display: inline-flex;
1700
+ column-gap: var(--hop-Link-column-gap);
1701
+ align-items: center;
1702
+ box-sizing: border-box;
1703
+ inline-size: fit-content;
1704
+ text-decoration: none;
1705
+ text-underline-offset: 0.125rem;
1706
+ border-radius: var(--hop-Link-border-radius);
1707
+ outline: none;
1708
+ outline-offset: 0.125rem;
1709
+ }
1710
+ :where(.Link-module__hop-Link___vMa0U) {
1711
+ font-family: var(--font-family);
1712
+ font-size: var(--font-size);
1713
+ font-weight: var(--font-weight);
1714
+ line-height: var(--line-height);
1715
+ }
1716
+ :where(.Link-module__hop-Link--xs___tWfT4) {
1717
+ --font-size: var(--hop-Link-xs-font-size);
1718
+ --font-family: var(--hop-Link-xs-font-family);
1719
+ --font-weight: var(--hop-Link-xs-font-weight);
1720
+ --line-height: var(--hop-Link-xs-line-height);
1721
+ }
1722
+ :where(.Link-module__hop-Link--sm___9P0qn) {
1723
+ --font-size: var(--hop-Link-sm-font-size);
1724
+ --font-family: var(--hop-Link-sm-font-family);
1725
+ --font-weight: var(--hop-Link-sm-font-weight);
1726
+ --line-height: var(--hop-Link-sm-line-height);
1727
+ }
1728
+ :where(.Link-module__hop-Link--md___RvavS) {
1729
+ --font-size: var(--hop-Link-md-font-size);
1730
+ --font-family: var(--hop-Link-md-font-family);
1731
+ --font-weight: var(--hop-Link-md-font-weight);
1732
+ --line-height: var(--hop-Link-md-line-height);
1733
+ }
1734
+ :where(.Link-module__hop-Link--lg___yAcjg) {
1735
+ --font-size: var(--hop-Link-lg-font-size);
1736
+ --font-family: var(--hop-Link-lg-font-family);
1737
+ --font-weight: var(--hop-Link-lg-font-weight);
1738
+ --line-height: var(--hop-Link-lg-line-height);
1739
+ }
1740
+ :where(.Link-module__hop-Link--xl___oEcme) {
1741
+ --font-size: var(--hop-Link-xl-font-size);
1742
+ --font-family: var(--hop-Link-xl-font-family);
1743
+ --font-weight: var(--hop-Link-xl-font-weight);
1744
+ --line-height: var(--hop-Link-xl-line-height);
1745
+ }
1746
+ :where(.Link-module__hop-Link--2xl___By5aM) {
1747
+ --font-size: var(--hop-Link-2xl-font-size);
1748
+ --font-family: var(--hop-Link-2xl-font-family);
1749
+ --font-weight: var(--hop-Link-2xl-font-weight);
1750
+ --line-height: var(--hop-Link-2xl-line-height);
1751
+ }
1752
+ :where(.Link-module__hop-Link--inherit___GIxcj) {
1753
+ --font-size: var(--hop-Link-inherit-size-font-size);
1754
+ --font-family: var(--hop-Link-inherit-size-font-family);
1755
+ --font-weight: var(--hop-Link-inherit-size-font-weight);
1756
+ --line-height: var(--hop-Link-inherit-size-line-height);
1757
+ }
1758
+ .Link-module__hop-Link___vMa0U[data-focus-visible] {
1759
+ outline: 0.125rem solid var(--hop-Link-focus-ring-color);
1760
+ }
1761
+ .Link-module__hop-Link___vMa0U[data-disabled] {
1762
+ cursor: default;
1763
+ }
1764
+ .Link-module__hop-Link--standalone___XnZFB .Link-module__hop-Link__text___cdZA7 {
1765
+ padding: var(--hop-Link-padding-standalone);
1766
+ }
1767
+ .Link-module__hop-Link--standalone___XnZFB.Link-module__hop-Link--xs___tWfT4 .Link-module__hop-Link__text___cdZA7 {
1768
+ padding: var(--hop-Link-padding-standalone-xs);
1769
+ }
1770
+ .Link-module__hop-Link--standalone___XnZFB.Link-module__hop-Link--sm___9P0qn .Link-module__hop-Link__text___cdZA7 {
1771
+ padding: var(--hop-Link-padding-standalone-sm);
1772
+ }
1773
+ .Link-module__hop-Link--standalone___XnZFB.Link-module__hop-Link--md___RvavS .Link-module__hop-Link__text___cdZA7 {
1774
+ padding: var(--hop-Link-padding-standalone-md);
1775
+ }
1776
+ .Link-module__hop-Link--standalone___XnZFB.Link-module__hop-Link--lg___yAcjg .Link-module__hop-Link__text___cdZA7 {
1777
+ padding: var(--hop-Link-padding-standalone-lg);
1778
+ }
1779
+ .Link-module__hop-Link--standalone___XnZFB.Link-module__hop-Link--xl___oEcme .Link-module__hop-Link__text___cdZA7 {
1780
+ padding: var(--hop-Link-padding-standalone-xl);
1781
+ }
1782
+ .Link-module__hop-Link--standalone___XnZFB.Link-module__hop-Link--2xl___By5aM .Link-module__hop-Link__text___cdZA7 {
1783
+ padding: var(--hop-Link-padding-standalone-2xl);
1784
+ }
1785
+ .Link-module__hop-Link--quiet___tJvB-[data-focus-visible],
1786
+ .Link-module__hop-Link--quiet___tJvB-[data-hovered],
1787
+ .Link-module__hop-Link--standalone___XnZFB[data-focus-visible],
1788
+ .Link-module__hop-Link--standalone___XnZFB[data-hovered] {
1789
+ text-decoration: underline;
1790
+ }
1791
+ .Link-module__hop-Link___vMa0U:not(.Link-module__hop-Link--quiet___tJvB-, .Link-module__hop-Link--standalone___XnZFB) {
1792
+ text-decoration: underline;
1793
+ }
1794
+ .Link-module__hop-Link--primary___18lFj {
1795
+ color: var(--hop-Link-primary-text-color);
1796
+ }
1797
+ .Link-module__hop-Link--primary___18lFj[data-disabled] {
1798
+ color: var(--hop-Link-primary-text-disabled-color);
1799
+ }
1800
+ .Link-module__hop-Link--primary___18lFj:not([data-disabled])[data-focus-visible],
1801
+ .Link-module__hop-Link--primary___18lFj:not([data-disabled])[data-hovered] {
1802
+ color: var(--hop-Link-primary-text-hover-color);
1803
+ }
1804
+ .Link-module__hop-Link--primary___18lFj:not([data-disabled])[data-pressed] {
1805
+ color: var(--hop-Link-primary-text-pressed-color);
1806
+ }
1807
+ .Link-module__hop-Link--secondary___FCsEt {
1808
+ color: var(--hop-Link-neutral-text-color);
1809
+ }
1810
+ .Link-module__hop-Link--secondary___FCsEt[data-disabled] {
1811
+ color: var(--hop-Link-neutral-text-disabled-color);
1812
+ }
1813
+ .Link-module__hop-Link--secondary___FCsEt:not([data-disabled])[data-focus-visible],
1814
+ .Link-module__hop-Link--secondary___FCsEt:not([data-disabled])[data-hovered] {
1815
+ color: var(--hop-Link-neutral-text-hover-color);
1816
+ }
1817
+ .Link-module__hop-Link--secondary___FCsEt:not([data-disabled])[data-pressed] {
1818
+ color: var(--hop-Link-neutral-text-pressed-color);
1819
+ }
1820
+ .Link-module__hop-Link__icon___cT8Oh,
1821
+ .Link-module__hop-Link__icon-list___u49kV {
1822
+ order: 2;
1823
+ }
1824
+ .Link-module__hop-Link__text___cdZA7 {
1825
+ order: 1;
1826
+ }
1827
+ .Link-module__hop-Link__start-icon___j4Lnk,
1828
+ .Link-module__hop-Link__start-icon-list___ZygP1 {
1829
+ order: 0;
1830
+ }
1831
+
1832
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/avatar/src/RichIconAvatarImage.module.css/#css-module-data */
1833
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage___jlIf6 {
1834
+ --hop-RichIconAvatarImage-background-color: var(--hop-decorative-option7-surface);
1835
+ --hop-RichIconAvatarImage-border-radius: var(--hop-shape-circle);
1836
+ --hop-RichIconAvatarImage-icon-color: var(--hop-decorative-option7-icon);
1837
+ --hop-RichIconAvatarImage-xs-size: 1rem;
1838
+ --hop-RichIconAvatarImage-icon-xs-size: 1rem;
1839
+ --hop-RichIconAvatarImage-sm-size: 1.5rem;
1840
+ --hop-RichIconAvatarImage-icon-sm-size: 1.5rem;
1841
+ --hop-RichIconAvatarImage-md-size: 2rem;
1842
+ --hop-RichIconAvatarImage-icon-md-size: 2rem;
1843
+ --hop-RichIconAvatarImage-lg-size: 3rem;
1844
+ --hop-RichIconAvatarImage-icon-lg-size: 3rem;
1845
+ --hop-RichIconAvatarImage-xl-size: 4rem;
1846
+ --hop-RichIconAvatarImage-icon-xl-size: 4rem;
1847
+ --hop-RichIconAvatarImage-2xl-size: 6rem;
1848
+ --hop-RichIconAvatarImage-icon-2xl-size: 4rem;
1849
+ --hop-RichIconAvatarImage-background-color-disabled: var(--hop-neutral-surface-disabled);
1850
+ --hop-RichIconAvatarImage-icon-color-disabled: var(--hop-neutral-icon-disabled);
1851
+ --background-color: var(--hop-RichIconAvatarImage-background-color);
1852
+ user-select: none;
1853
+ position: relative;
1854
+ overflow: hidden;
1855
+ display: flex;
1856
+ align-items: center;
1857
+ justify-content: center;
1858
+ inline-size: var(--size, var(--hop-RichIconAvatarImage-md-size));
1859
+ block-size: var(--size, var(--hop-RichIconAvatarImage-md-size));
1860
+ color: var(--hop-RichIconAvatarImage-icon-color);
1861
+ background-color: var(--background-color);
1862
+ border-radius: var(--hop-RichIconAvatarImage-border-radius);
1863
+ }
1864
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage--xs___vxH-6 {
1865
+ --size: var(--hop-RichIconAvatarImage-xs-size);
1866
+ --icon-size: var(--hop-RichIconAvatarImage-icon-xs-size);
1867
+ }
1868
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage--sm___l8zKZ {
1869
+ --size: var(--hop-RichIconAvatarImage-sm-size);
1870
+ --icon-size: var(--hop-RichIconAvatarImage-icon-sm-size);
1871
+ }
1872
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage--md___dl7qB {
1873
+ --size: var(--hop-RichIconAvatarImage-md-size);
1874
+ --icon-size: var(--hop-RichIconAvatarImage-icon-md-size);
1875
+ }
1876
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage--lg___b2V01 {
1877
+ --size: var(--hop-RichIconAvatarImage-lg-size);
1878
+ --icon-size: var(--hop-RichIconAvatarImage-icon-lg-size);
1879
+ }
1880
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage--xl___oZubf {
1881
+ --size: var(--hop-RichIconAvatarImage-xl-size);
1882
+ --icon-size: var(--hop-RichIconAvatarImage-icon-xl-size);
1883
+ }
1884
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage--2xl___S1-4q {
1885
+ --size: var(--hop-RichIconAvatarImage-2xl-size);
1886
+ --icon-size: var(--hop-RichIconAvatarImage-icon-2xl-size);
1887
+ }
1888
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage___jlIf6[data-disabled] {
1889
+ --background-color: var(--hop-RichIconAvatarImage-background-color-disabled);
1890
+ }
1891
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage__icon___Tpkbm {
1892
+ position: relative;
1893
+ display: block;
1894
+ inline-size: var(--icon-size, var(--hop-RichIconAvatarImage-icon-md-size));
1895
+ block-size: var(--icon-size, var(--hop-RichIconAvatarImage-icon-md-size));
1896
+ }
1897
+ .RichIconAvatarImage-module__hop-RichIconAvatarImage___jlIf6[data-disabled] .RichIconAvatarImage-module__hop-RichIconAvatarImage__icon___Tpkbm {
1898
+ --hop-RichIcon-placeholder-background: var(--hop-RichIconAvatarImage-background-color-disabled);
1899
+ --hop-RichIcon-placeholder-shadow: var(--hop-RichIconAvatarImage-icon-color-disabled);
1900
+ }
1901
+
1902
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/avatar/src/Avatar.module.css/#css-module-data */
1903
+ .Avatar-module__hop-Avatar___-m4sl {
1904
+ --hop-Avatar-border-radius: var(--hop-shape-circle);
1905
+ --hop-Avatar-mix-blend-mode: normal;
1906
+ --hop-Avatar-decorative-1-background-color: var(--hop-decorative-option1-surface-strong);
1907
+ --hop-Avatar-decorative-2-background-color: var(--hop-decorative-option2-surface-strong);
1908
+ --hop-Avatar-decorative-3-background-color: var(--hop-decorative-option3-surface-strong);
1909
+ --hop-Avatar-decorative-4-background-color: var(--hop-decorative-option4-surface-strong);
1910
+ --hop-Avatar-decorative-5-background-color: var(--hop-decorative-option5-surface-strong);
1911
+ --hop-Avatar-decorative-6-background-color: var(--hop-decorative-option6-surface-strong);
1912
+ --hop-Avatar-decorative-7-background-color: var(--hop-decorative-option7-surface-strong);
1913
+ --hop-Avatar-decorative-8-background-color: var(--hop-decorative-option8-surface-strong);
1914
+ --hop-Avatar-decorative-9-background-color: var(--hop-decorative-option9-surface-strong);
1915
+ --hop-Avatar-decorative-1-text-color: var(--hop-decorative-option1-text);
1916
+ --hop-Avatar-decorative-2-text-color: var(--hop-decorative-option2-text);
1917
+ --hop-Avatar-decorative-3-text-color: var(--hop-decorative-option3-text);
1918
+ --hop-Avatar-decorative-4-text-color: var(--hop-decorative-option4-text);
1919
+ --hop-Avatar-decorative-5-text-color: var(--hop-decorative-option5-text);
1920
+ --hop-Avatar-decorative-6-text-color: var(--hop-decorative-option6-text);
1921
+ --hop-Avatar-decorative-7-text-color: var(--hop-decorative-option7-text);
1922
+ --hop-Avatar-decorative-8-text-color: var(--hop-decorative-option8-text);
1923
+ --hop-Avatar-decorative-9-text-color: var(--hop-decorative-option9-text);
1924
+ --hop-Avatar-xs-size: 1rem;
1925
+ --hop-Avatar-sm-size: 1.5rem;
1926
+ --hop-Avatar-md-size: 2rem;
1927
+ --hop-Avatar-lg-size: 3rem;
1928
+ --hop-Avatar-xl-size: 4rem;
1929
+ --hop-Avatar-2xl-size: 6rem;
1930
+ --hop-Avatar-background-color-disabled: var(--hop-neutral-surface-disabled);
1931
+ --hop-Avatar-text-color-disabled: var(--hop-neutral-text-disabled);
1932
+ --hop-Avatar-mix-blend-mode-disabled: luminosity;
1933
+ --mix-blend-mode: var(--hop-Avatar-mix-blend-mode);
1934
+ user-select: none;
1935
+ position: relative;
1936
+ overflow: hidden;
1937
+ display: flex;
1938
+ flex: 0 0 auto;
1939
+ align-items: center;
1940
+ justify-content: center;
1941
+ box-sizing: border-box;
1942
+ inline-size: var(--size, var(--hop-Avatar-md-size));
1943
+ block-size: var(--size, var(--hop-Avatar-md-size));
1944
+ color: var(--text-color, var(--hop-neutral-text));
1945
+ background-color: var(--background-color, transparent);
1946
+ border-radius: var(--hop-Avatar-border-radius);
1947
+ }
1948
+ .Avatar-module__hop-Avatar--xs___voEj- {
1949
+ --size: var(--hop-Avatar-xs-size);
1950
+ }
1951
+ .Avatar-module__hop-Avatar--sm___VEWZ9 {
1952
+ --size: var(--hop-Avatar-sm-size);
1953
+ }
1954
+ .Avatar-module__hop-Avatar--md___WRFOH {
1955
+ --size: var(--hop-Avatar-md-size);
1956
+ }
1957
+ .Avatar-module__hop-Avatar--lg___JaNW3 {
1958
+ --size: var(--hop-Avatar-lg-size);
1959
+ }
1960
+ .Avatar-module__hop-Avatar--xl___Ov8Y8 {
1961
+ --size: var(--hop-Avatar-xl-size);
1962
+ }
1963
+ .Avatar-module__hop-Avatar--2xl___Ti4UJ {
1964
+ --size: var(--hop-Avatar-2xl-size);
1965
+ }
1966
+ .Avatar-module__hop-Avatar--decorative-option1___g6oOE {
1967
+ --background-color: var(--hop-Avatar-decorative-1-background-color);
1968
+ --text-color: var(--hop-Avatar-decorative-1-text-color);
1969
+ }
1970
+ .Avatar-module__hop-Avatar--decorative-option2___u-zDc {
1971
+ --background-color: var(--hop-Avatar-decorative-2-background-color);
1972
+ --text-color: var(--hop-Avatar-decorative-2-text-color);
1973
+ }
1974
+ .Avatar-module__hop-Avatar--decorative-option3___WhCPz {
1975
+ --background-color: var(--hop-Avatar-decorative-3-background-color);
1976
+ --text-color: var(--hop-Avatar-decorative-3-text-color);
1977
+ }
1978
+ .Avatar-module__hop-Avatar--decorative-option4___GesJz {
1979
+ --background-color: var(--hop-Avatar-decorative-4-background-color);
1980
+ --text-color: var(--hop-Avatar-decorative-4-text-color);
1981
+ }
1982
+ .Avatar-module__hop-Avatar--decorative-option5___-23ZH {
1983
+ --background-color: var(--hop-Avatar-decorative-5-background-color);
1984
+ --text-color: var(--hop-Avatar-decorative-5-text-color);
1985
+ }
1986
+ .Avatar-module__hop-Avatar--decorative-option6___CQmNQ {
1987
+ --background-color: var(--hop-Avatar-decorative-6-background-color);
1988
+ --text-color: var(--hop-Avatar-decorative-6-text-color);
1989
+ }
1990
+ .Avatar-module__hop-Avatar--decorative-option7___ogvs7 {
1991
+ --background-color: var(--hop-Avatar-decorative-7-background-color);
1992
+ --text-color: var(--hop-Avatar-decorative-7-text-color);
1993
+ }
1994
+ .Avatar-module__hop-Avatar--decorative-option8___HA21y {
1995
+ --background-color: var(--hop-Avatar-decorative-8-background-color);
1996
+ --text-color: var(--hop-Avatar-decorative-8-text-color);
1997
+ }
1998
+ .Avatar-module__hop-Avatar--decorative-option9___THrCC {
1999
+ --background-color: var(--hop-Avatar-decorative-9-background-color);
2000
+ --text-color: var(--hop-Avatar-decorative-9-text-color);
2001
+ }
2002
+ .Avatar-module__hop-Avatar___-m4sl[data-disabled] {
2003
+ --background-color: var(--hop-Avatar-background-color-disabled);
2004
+ --text-color: var(--hop-Avatar-text-color-disabled);
2005
+ --mix-blend-mode: var(--hop-Avatar-mix-blend-mode-disabled);
2006
+ isolation: isolate;
2007
+ }
2008
+ .Avatar-module__hop-Avatar__image___owC-L {
2009
+ position: relative;
2010
+ display: block;
2011
+ box-sizing: border-box;
2012
+ inline-size: 100%;
2013
+ block-size: 100%;
2014
+ object-fit: cover;
2015
+ mix-blend-mode: var(--mix-blend-mode);
2016
+ }
2017
+
2018
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/tooltip/src/Tooltip.module.css/#css-module-data */
2019
+ .Tooltip-module__hop-Tooltip___YCOYX {
2020
+ --hop-Tooltip-max-inline-size: 20rem;
2021
+ --hop-Tooltip-slide-amount: 0.25rem;
2022
+ --hop-Tooltip-background: var(--hop-neutral-surface-strong);
2023
+ --hop-Tooltip-border-radius: var(--hop-shape-rounded-md);
2024
+ --hop-Tooltip-box-shadow: var(--hop-elevation-raised);
2025
+ --hop-Tooltip-font-family: var(--hop-body-md-font-family);
2026
+ --hop-Tooltip-font-size: var(--hop-body-md-font-size);
2027
+ --hop-Tooltip-font-weight: var(--hop-body-md-font-weight);
2028
+ --hop-Tooltip-line-height: var(--hop-body-md-line-height);
2029
+ --hop-Tooltip-font-smoothing: antialiased;
2030
+ --hop-Tooltip-color: var(--hop-neutral-text-strong);
2031
+ --hop-Tooltip-padding: var(--hop-space-inset-squish-md);
2032
+ --origin-x: 0;
2033
+ --origin-y: 0;
2034
+ max-inline-size: min(var(--hop-Tooltip-max-inline-size), calc(100% - (var(--container-padding) * 2)));
2035
+ padding: var(--hop-Tooltip-padding);
2036
+ font-family: var(--hop-Tooltip-font-family);
2037
+ font-size: var(--hop-Tooltip-font-size);
2038
+ font-weight: var(--hop-Tooltip-font-weight);
2039
+ -webkit-font-smoothing: var(--hop-Tooltip-font-smoothing);
2040
+ line-height: var(--hop-Tooltip-line-height);
2041
+ color: var(--hop-Tooltip-color);
2042
+ background: var(--hop-Tooltip-background);
2043
+ border-radius: var(--hop-Tooltip-border-radius);
2044
+ box-shadow: var(--hop-Tooltip-box-shadow);
2045
+ }
2046
+ .Tooltip-module__hop-Tooltip--top___Ke-AO {
2047
+ --origin-x: 0;
2048
+ --origin-y: var(--hop-Tooltip-slide-amount);
2049
+ }
2050
+ .Tooltip-module__hop-Tooltip--right___cksoK {
2051
+ --origin-x: calc(-1 * var(--hop-Tooltip-slide-amount));
2052
+ --origin-y: 0;
2053
+ }
2054
+ .Tooltip-module__hop-Tooltip--bottom___qFAV6 {
2055
+ --origin-x: 0;
2056
+ --origin-y: calc(-1 * var(--hop-Tooltip-slide-amount));
2057
+ }
2058
+ .Tooltip-module__hop-Tooltip--left___wwLMY {
2059
+ --origin-x: var(--hop-Tooltip-slide-amount);
2060
+ --origin-y: 0;
2061
+ }
2062
+ .Tooltip-module__hop-Tooltip___YCOYX[data-entering] {
2063
+ animation: Tooltip-module__slide___t6GRt 0.2s ease-out;
2064
+ }
2065
+ .Tooltip-module__hop-Tooltip___YCOYX[data-exiting] {
2066
+ animation: Tooltip-module__slide___t6GRt 0.2s ease-in reverse;
2067
+ }
2068
+ @keyframes Tooltip-module__slide___t6GRt {
2069
+ from {
2070
+ transform: translate(var(--origin-x), var(--origin-y));
2071
+ opacity: 0;
2072
+ }
2073
+ to {
2074
+ transform: translateY(0);
2075
+ opacity: 1;
2076
+ }
2077
+ }
2078
+
2079
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/avatar/src/AvatarGroup.module.css/#css-module-data */
2080
+ .AvatarGroup-module__hop-AvatarGroup___CIlO9 {
2081
+ --hop-AvatarGroup-display: flex;
2082
+ --hop-AvatarGroup-align-items: center;
2083
+ display: var(--hop-AvatarGroup-display);
2084
+ align-items: var(--hop-AvatarGroup-align-items);
2085
+ }
2086
+ .AvatarGroup-module__hop-AvatarGroup--wrap___q7k0p {
2087
+ flex-wrap: wrap;
2088
+ }
2089
+ .AvatarGroup-module__hop-AvatarGroup--xs___qr6X- {
2090
+ --gap: -0.125rem;
2091
+ }
2092
+ .AvatarGroup-module__hop-AvatarGroup--sm___tIyLd {
2093
+ --gap: -0.25rem;
2094
+ }
2095
+ .AvatarGroup-module__hop-AvatarGroup--md___mBTX- {
2096
+ --gap: -0.5rem;
2097
+ }
2098
+ .AvatarGroup-module__hop-AvatarGroup--lg___37l6b {
2099
+ --gap: -1rem;
2100
+ }
2101
+ .AvatarGroup-module__hop-AvatarGroup--xl___YLh7o {
2102
+ --gap: -1rem;
2103
+ }
2104
+ .AvatarGroup-module__hop-AvatarGroup--2xl___AOi7- {
2105
+ --gap: -2rem;
2106
+ }
2107
+ .AvatarGroup-module__hop-AvatarGroup__avatar___nFiWM {
2108
+ margin-inline-start: var(--gap);
2109
+ transition: margin var(--hop-easing-duration-2);
2110
+ }
2111
+ .AvatarGroup-module__hop-AvatarGroup__avatar___nFiWM:hover:not(:last-child) + .AvatarGroup-module__hop-AvatarGroup__avatar___nFiWM {
2112
+ margin-inline-start: 0;
2113
+ }
2114
+ .AvatarGroup-module__hop-AvatarGroup__avatar___nFiWM:first-child {
2115
+ margin-inline-start: 0;
2116
+ }
2117
+ .AvatarGroup-module__hop-AvatarGroup__label___mS1n3 {
2118
+ --hop-AvatarGroup-label-font-size: var(--hop-body-sm-font-size);
2119
+ --hop-AvatarGroup-label-font-weight: var(--hop-body-sm-semibold-font-weight);
2120
+ --hop-AvatarGroup-label-line-height: var(--hop-body-sm-line-height);
2121
+ --hop-AvatarGroup-label-font-family: var(--hop-body-sm-font-family);
2122
+ --hop-AvatarGroup-label-margin-left: 0.25rem;
2123
+ margin-inline-start: var(--hop-AvatarGroup-label-margin-left);
2124
+ font-family: var(--hop-AvatarGroup-label-font-family);
2125
+ font-size: var(--hop-AvatarGroup-label-font-size);
2126
+ font-weight: var(--hop-AvatarGroup-label-font-weight);
2127
+ line-height: var(--hop-AvatarGroup-label-line-height);
2128
+ }
2129
+ .AvatarGroup-module__hop-AvatarGroup__hiddenAvatar___ydP9p {
2130
+ --hop-AvatarGroup__hiddenAvatar-display: flex;
2131
+ --hop-AvatarGroup__hiddenAvatar-align-items: center;
2132
+ --hop-AvatarGroup__hiddenAvatar-gap: var(--hop-space-inset-sm);
2133
+ --hop-AvatarGroup__hiddenAvatar-font-family: var(--hop-body-xs-font-family);
2134
+ --hop-AvatarGroup__hiddenAvatar-font-size: var(--hop-body-xs-font-size);
2135
+ --hop-AvatarGroup__hiddenAvatar-font-weight: var(--hop-body-xs-semibold-font-weight);
2136
+ --hop-AvatarGroup__hiddenAvatar-line-height: var(--hop-body-xs-line-height);
2137
+ --hop-AvatarGroup__hiddenAvatar-color: var(--hop-neutral-text-strong);
2138
+ display: var(--hop-AvatarGroup__hiddenAvatar-display);
2139
+ gap: var(--hop-AvatarGroup__hiddenAvatar-gap);
2140
+ align-items: var(--hop-AvatarGroup__hiddenAvatar-align-items);
2141
+ font-family: var(--hop-AvatarGroup__hiddenAvatar-font-family);
2142
+ font-size: var(--hop-AvatarGroup__hiddenAvatar-font-size);
2143
+ font-weight: var(--hop-AvatarGroup__hiddenAvatar-font-weight);
2144
+ line-height: var(--hop-AvatarGroup__hiddenAvatar-line-height);
2145
+ color: var(--hop-AvatarGroup__hiddenAvatar-color);
2146
+ }
2147
+ .AvatarGroup-module__hop-AvatarGroup__hiddenAvatar___ydP9p:not(:last-child) {
2148
+ margin-block-end: 0.25rem;
2149
+ }
2150
+ .AvatarGroup-module__hop-AvatarGroup--start___5Iubf {
2151
+ justify-content: flex-start;
2152
+ }
2153
+ .AvatarGroup-module__hop-AvatarGroup--end___GHZ4U {
2154
+ justify-content: flex-end;
2155
+ }
2156
+ .AvatarGroup-module__hop-AvatarGroup--center___mFxWk {
2157
+ justify-content: center;
2158
+ }
2159
+
2160
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/badge/src/Badge.module.css/#css-module-data */
2161
+ .Badge-module__hop-Badge___KJ3W2 {
2162
+ --hop-Badge-height: 1.5rem;
2163
+ --hop-Badge-width: max-content;
2164
+ --hop-Badge-padding-inline: var(--hop-space-inset-sm);
2165
+ --hop-Badge-border-radius: var(--hop-shape-pill);
2166
+ --hop-Badge-indeterminate-border-radius: var(--hop-shape-circle);
2167
+ --hop-Badge-indeterminate-height: 1rem;
2168
+ --hop-Badge-indeterminate-width: 1rem;
2169
+ --hop-Badge-indeterminate-padding-inline: 0;
2170
+ --hop-Badge-primary-text-color: var(--hop-primary-text-strong);
2171
+ --hop-Badge-primary-background-color: var(--hop-primary-surface-strong);
2172
+ --hop-Badge-primary-text-color-hovered: var(--hop-primary-text-strong-hover);
2173
+ --hop-Badge-primary-background-color-hovered: var(--hop-primary-surface-strong-hover);
2174
+ --hop-Badge-primary-text-color-pressed: var(--hop-primary-text-strong);
2175
+ --hop-Badge-primary-background-color-pressed: var(--hop-primary-surface-strong-press);
2176
+ --hop-Badge-primary-text-color-selected: var(--hop-neutral-text-selected);
2177
+ --hop-Badge-primary-background-color-selected: var(--hop-neutral-surface-selected);
2178
+ --hop-Badge-secondary-text-color: var(--hop-neutral-text-strong);
2179
+ --hop-Badge-secondary-background-color: var(--hop-neutral-surface-strong);
2180
+ --hop-Badge-secondary-text-color-hovered: var(--hop-neutral-text-strong);
2181
+ --hop-Badge-secondary-background-color-hovered: var(--hop-neutral-surface-strong);
2182
+ --hop-Badge-secondary-text-color-pressed: var(--hop-neutral-text-strong);
2183
+ --hop-Badge-secondary-background-color-pressed: var(--hop-neutral-surface-strong);
2184
+ --hop-Badge-secondary-text-color-selected: var(--hop-neutral-text-selected);
2185
+ --hop-Badge-secondary-background-color-selected: var(--hop-neutral-surface-selected);
2186
+ --hop-Badge-subdued-text-color: var(--hop-neutral-text);
2187
+ --hop-Badge-subdued-background-color: var(--hop-neutral-surface-weak);
2188
+ --hop-Badge-subdued-text-color-hovered: var(--hop-neutral-text-weak-hover);
2189
+ --hop-Badge-subdued-background-color-hovered: var(--hop-neutral-surface-weak-hover);
2190
+ --hop-Badge-subdued-text-color-pressed: var(--hop-neutral-text-weak-press);
2191
+ --hop-Badge-subdued-background-color-pressed: var(--hop-neutral-surface-weak-press);
2192
+ --hop-Badge-subdued-text-color-selected: var(--hop-neutral-text-weak-selected);
2193
+ --hop-Badge-subdued-background-color-selected: var(--hop-neutral-surface-weak-selected);
2194
+ --hop-Badge-text-color-disabled: var(--hop-neutral-text-disabled);
2195
+ --hop-Badge-background-color-disabled: var(--hop-neutral-surface-disabled);
2196
+ --height: var(--hop-Badge-height);
2197
+ --width: var(--hop-Badge-width);
2198
+ --padding-inline: var(--hop-Badge-padding-inline);
2199
+ --border-radius: var(--hop-Badge-border-radius);
2200
+ display: inline-flex;
2201
+ align-items: center;
2202
+ justify-content: center;
2203
+ box-sizing: border-box;
2204
+ inline-size: var(--width);
2205
+ block-size: var(--height);
2206
+ padding-inline: var(--padding-inline);
2207
+ color: var(--text-color, var(--hop-Badge-primary-text-color));
2208
+ background-color: var(--background-color, var(--hop-Badge-primary-background-color));
2209
+ border-radius: var(--border-radius);
2210
+ }
2211
+ .Badge-module__hop-Badge--primary___SQC7m {
2212
+ --background-color: var(--hop-Badge-primary-background-color);
2213
+ --text-color: var(--hop-Badge-primary-text-color);
2214
+ }
2215
+ .Badge-module__hop-Badge--primary___SQC7m[data-hovered] {
2216
+ --background-color: var(--hop-Badge-primary-background-color-hovered);
2217
+ --text-color: var(--hop-Badge-primary-text-color-hovered);
2218
+ }
2219
+ .Badge-module__hop-Badge--primary___SQC7m[data-pressed] {
2220
+ --background-color: var(--hop-Badge-primary-background-color-pressed);
2221
+ --text-color: var(--hop-Badge-primary-text-color-pressed);
2222
+ }
2223
+ .Badge-module__hop-Badge--primary___SQC7m[data-selected] {
2224
+ --background-color: var(--hop-Badge-primary-background-color-selected);
2225
+ --text-color: var(--hop-Badge-primary-text-color-selected);
2226
+ }
2227
+ .Badge-module__hop-Badge--secondary___HYQtN {
2228
+ --background-color: var(--hop-Badge-secondary-background-color);
2229
+ --text-color: var(--hop-Badge-secondary-text-color);
2230
+ }
2231
+ .Badge-module__hop-Badge--secondary___HYQtN[data-hovered] {
2232
+ --background-color: var(--hop-Badge-secondary-background-color-hovered);
2233
+ --text-color: var(--hop-Badge-secondary-text-color-hovered);
2234
+ }
2235
+ .Badge-module__hop-Badge--secondary___HYQtN[data-pressed] {
2236
+ --background-color: var(--hop-Badge-secondary-background-color-pressed);
2237
+ --text-color: var(--hop-Badge-secondary-text-color-pressed);
2238
+ }
2239
+ .Badge-module__hop-Badge--secondary___HYQtN[data-selected] {
2240
+ --background-color: var(--hop-Badge-secondary-background-color-selected);
2241
+ --text-color: var(--hop-Badge-secondary-text-color-selected);
2242
+ }
2243
+ .Badge-module__hop-Badge--subdued___zilnb {
2244
+ --background-color: var(--hop-Badge-subdued-background-color);
2245
+ --text-color: var(--hop-Badge-subdued-text-color);
2246
+ }
2247
+ .Badge-module__hop-Badge--subdued___zilnb[data-hovered] {
2248
+ --background-color: var(--hop-Badge-subdued-background-color-hovered);
2249
+ --text-color: var(--hop-Badge-subdued-text-color-hovered);
2250
+ }
2251
+ .Badge-module__hop-Badge--subdued___zilnb[data-pressed] {
2252
+ --background-color: var(--hop-Badge-subdued-background-color-pressed);
2253
+ --text-color: var(--hop-Badge-subdued-text-color-pressed);
2254
+ }
2255
+ .Badge-module__hop-Badge--subdued___zilnb[data-selected] {
2256
+ --background-color: var(--hop-Badge-subdued-background-color-selected);
2257
+ --text-color: var(--hop-Badge-subdued-text-color-selected);
2258
+ }
2259
+ .Badge-module__hop-Badge___KJ3W2[data-indeterminate] {
2260
+ --border-radius: var(--hop-Badge-indeterminate-border-radius);
2261
+ --height: var(--hop-Badge-indeterminate-height);
2262
+ --width: var(--hop-Badge-indeterminate-width);
2263
+ --padding-inline: var(--hop-Badge-indeterminate-padding-inline);
2264
+ }
2265
+ .Badge-module__hop-Badge___KJ3W2[data-disabled] {
2266
+ --background-color: var(--hop-Badge-background-color-disabled);
2267
+ --text-color: var(--hop-Badge-text-color-disabled);
2268
+ }
2269
+
2270
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/badge/src/FloatingBadge.module.css/#css-module-data */
2271
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U {
2272
+ --hop-FloatingBadge-badge-x: calc(0% + var(--hop-FloatingBadge-offset-x));
2273
+ --hop-FloatingBadge-badge-circular-x: calc(10% + var(--hop-FloatingBadge-offset-x));
2274
+ --hop-FloatingBadge-badge-y: calc(0% + var(--hop-FloatingBadge-offset-y));
2275
+ --hop-FloatingBadge-badge-circular-y: calc(10% + var(--hop-FloatingBadge-offset-y));
2276
+ --hop-FloatingBadge-badge-topright-top: var(--hop-FloatingBadge-badge-y);
2277
+ --hop-FloatingBadge-badge-topright-right: var(--hop-FloatingBadge-badge-x);
2278
+ --hop-FloatingBadge-badge-topright-circular-top: var(--hop-FloatingBadge-badge-circular-y);
2279
+ --hop-FloatingBadge-badge-topright-circular-right: var(--hop-FloatingBadge-badge-circular-x);
2280
+ --hop-FloatingBadge-badge-topright-bottom: auto;
2281
+ --hop-FloatingBadge-badge-topright-left: auto;
2282
+ --hop-FloatingBadge-badge-topright-transform: translate(50%, -50%);
2283
+ --hop-FloatingBadge-badge-topright-transform-origin: 100% 0;
2284
+ --hop-FloatingBadge-badge-topleft-top: var(--hop-FloatingBadge-badge-y);
2285
+ --hop-FloatingBadge-badge-topleft-circular-top: var(--hop-FloatingBadge-badge-circular-y);
2286
+ --hop-FloatingBadge-badge-topleft-right: auto;
2287
+ --hop-FloatingBadge-badge-topleft-bottom: auto;
2288
+ --hop-FloatingBadge-badge-topleft-left: var(--hop-FloatingBadge-badge-x);
2289
+ --hop-FloatingBadge-badge-topleft-circular-left: var(--hop-FloatingBadge-badge-circular-x);
2290
+ --hop-FloatingBadge-badge-topleft-transform: translate(-50%, -50%);
2291
+ --hop-FloatingBadge-badge-topleft-transform-origin: 0 0;
2292
+ --hop-FloatingBadge-badge-bottomright-top: auto;
2293
+ --hop-FloatingBadge-badge-bottomright-right: var(--hop-FloatingBadge-badge-x);
2294
+ --hop-FloatingBadge-badge-bottomright-circular-right: var(--hop-FloatingBadge-badge-circular-x);
2295
+ --hop-FloatingBadge-badge-bottomright-bottom: var(--hop-FloatingBadge-badge-y);
2296
+ --hop-FloatingBadge-badge-bottomright-circular-bottom: var(--hop-FloatingBadge-badge-circular-y);
2297
+ --hop-FloatingBadge-badge-bottomright-left: auto;
2298
+ --hop-FloatingBadge-badge-bottomright-transform: translate(50%, 50%);
2299
+ --hop-FloatingBadge-badge-bottomright-transform-origin: 100% 100%;
2300
+ --hop-FloatingBadge-badge-bottomleft-top: auto;
2301
+ --hop-FloatingBadge-badge-bottomleft-right: auto;
2302
+ --hop-FloatingBadge-badge-bottomleft-bottom: var(--hop-FloatingBadge-badge-y);
2303
+ --hop-FloatingBadge-badge-bottomleft-circular-bottom: var(--hop-FloatingBadge-badge-circular-y);
2304
+ --hop-FloatingBadge-badge-bottomleft-left: var(--hop-FloatingBadge-badge-x);
2305
+ --hop-FloatingBadge-badge-bottomleft-circular-left: var(--hop-FloatingBadge-badge-circular-x);
2306
+ --hop-FloatingBadge-badge-bottomleft-transform: translate(-50%, 50%);
2307
+ --hop-FloatingBadge-badge-bottomleft-transform-origin: 0 100%;
2308
+ position: relative;
2309
+ box-sizing: border-box;
2310
+ inline-size: max-content;
2311
+ }
2312
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="top right"] {
2313
+ --badge-top: var(--hop-FloatingBadge-badge-topright-top);
2314
+ --badge-right: var(--hop-FloatingBadge-badge-topright-right);
2315
+ --badge-bottom: var(--hop-FloatingBadge-badge-topright-bottom);
2316
+ --badge-left: var(--hop-FloatingBadge-badge-topright-left);
2317
+ --badge-transform: var(--hop-FloatingBadge-badge-topright-transform);
2318
+ --badge-transform-origin: var(--hop-FloatingBadge-badge-topright-transform-origin);
2319
+ }
2320
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="top right"][data-overlap=circular] {
2321
+ --badge-top: var(--hop-FloatingBadge-badge-topright-circular-top);
2322
+ --badge-right: var(--hop-FloatingBadge-badge-topright-circular-right);
2323
+ }
2324
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="top left"] {
2325
+ --badge-top: var(--hop-FloatingBadge-badge-topleft-top);
2326
+ --badge-right: var(--hop-FloatingBadge-badge-topleft-right);
2327
+ --badge-bottom: var(--hop-FloatingBadge-badge-topleft-bottom);
2328
+ --badge-left: var(--hop-FloatingBadge-badge-topleft-left);
2329
+ --badge-transform: var(--hop-FloatingBadge-badge-topleft-transform);
2330
+ --badge-transform-origin: var(--hop-FloatingBadge-badge-topleft-transform-origin);
2331
+ }
2332
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="top left"][data-overlap=circular] {
2333
+ --badge-top: var(--hop-FloatingBadge-badge-topleft-circular-top);
2334
+ --badge-left: var(--hop-FloatingBadge-badge-topleft-circular-left);
2335
+ }
2336
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="bottom right"] {
2337
+ --badge-top: var(--hop-FloatingBadge-badge-bottomright-top);
2338
+ --badge-right: var(--hop-FloatingBadge-badge-bottomright-right);
2339
+ --badge-bottom: var(--hop-FloatingBadge-badge-bottomright-bottom);
2340
+ --badge-left: var(--hop-FloatingBadge-badge-bottomright-left);
2341
+ --badge-transform: var(--hop-FloatingBadge-badge-bottomright-transform);
2342
+ --badge-transform-origin: var(--hop-FloatingBadge-badge-bottomright-transform-origin);
2343
+ }
2344
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="bottom right"][data-overlap=circular] {
2345
+ --badge-right: var(--hop-FloatingBadge-badge-bottomright-circular-right);
2346
+ --badge-bottom: var(--hop-FloatingBadge-badge-bottomright-circular-bottom);
2347
+ }
2348
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="bottom left"] {
2349
+ --badge-top: var(--hop-FloatingBadge-badge-bottomleft-top);
2350
+ --badge-right: var(--hop-FloatingBadge-badge-bottomleft-right);
2351
+ --badge-bottom: var(--hop-FloatingBadge-badge-bottomleft-bottom);
2352
+ --badge-left: var(--hop-FloatingBadge-badge-bottomleft-left);
2353
+ --badge-transform: var(--hop-FloatingBadge-badge-bottomleft-transform);
2354
+ --badge-transform-origin: var(--hop-FloatingBadge-badge-bottomleft-transform-origin);
2355
+ }
2356
+ .FloatingBadge-module__hop-FloatingBadge___1dg-U[data-placement="bottom left"][data-overlap=circular] {
2357
+ --badge-bottom: var(--hop-FloatingBadge-badge-bottomleft-circular-bottom);
2358
+ --badge-left: var(--hop-FloatingBadge-badge-bottomleft-circular-left);
2359
+ }
2360
+ .FloatingBadge-module__hop-FloatingBadge__badge___0A0N2 {
2361
+ position: absolute;
2362
+ inset: var(--badge-top) var(--badge-right) var(--badge-bottom) var(--badge-left);
2363
+ transform-origin: var(--badge-transform-origin);
2364
+ transform: var(--badge-transform);
2365
+ }
2366
+
2367
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/checkbox/src/Checkbox.module.css/#css-module-data */
2368
+ .Checkbox-module__hop-Checkbox___oHb0r {
2369
+ --hop-Checkbox-box-border-size: 0.0625rem;
2370
+ --hop-Checkbox-box-border-color: var(--hop-neutral-border);
2371
+ --hop-Checkbox-box-background-color: var(--hop-neutral-surface);
2372
+ --hop-Checkbox-box-outline-size: 0.125rem;
2373
+ --hop-Checkbox-box-outline-color: var(--hop-primary-border-focus);
2374
+ --hop-Checkbox-check-color: var(--hop-neutral-icon-selected);
2375
+ --hop-Checkbox-check-display: none;
2376
+ --hop-Checkbox-text-color: var(--hop-neutral-text);
2377
+ --hop-Checkbox-icon-color: var(--hop-neutral-icon);
2378
+ --hop-Checkbox-box-border-color-hovered: var(--hop-neutral-border-hover);
2379
+ --hop-Checkbox-box-background-color-hovered: var(--hop-neutral-surface-hover);
2380
+ --hop-Checkbox-text-color-hovered: var(--hop-neutral-text-hover);
2381
+ --hop-Checkbox-icon-color-hovered: var(--hop-neutral-icon-hover);
2382
+ --hop-Checkbox-box-border-color-pressed: var(--hop-neutral-border-press);
2383
+ --hop-Checkbox-box-background-color-pressed: var(--hop-neutral-surface-press);
2384
+ --hop-Checkbox-text-color-pressed: var(--hop-neutral-text-press);
2385
+ --hop-Checkbox-icon-color-pressed: var(--hop-neutral-icon-press);
2386
+ --hop-Checkbox-box-border-color-selected: var(--hop-neutral-border-selected);
2387
+ --hop-Checkbox-box-background-color-selected: var(--hop-neutral-surface-selected);
2388
+ --hop-Checkbox-check-display-selected: block;
2389
+ --hop-Checkbox-text-color-selected: var(--hop-neutral-text);
2390
+ --hop-Checkbox-icon-color-selected: var(--hop-neutral-icon);
2391
+ --hop-Checkbox-box-border-color-disabled: var(--hop-neutral-border-disabled);
2392
+ --hop-Checkbox-box-background-color-disabled: var(--hop-neutral-surface-disabled);
2393
+ --hop-Checkbox-check-color-disabled: var(--hop-neutral-icon-disabled);
2394
+ --hop-Checkbox-text-color-disabled: var(--hop-neutral-text-disabled);
2395
+ --hop-Checkbox-icon-color-disabled: var(--hop-neutral-icon-disabled);
2396
+ --hop-Checkbox-box-border-color-focused: var(--hop-neutral-border-hover);
2397
+ --hop-Checkbox-box-background-color-focused: var(--hop-neutral-surface-hover);
2398
+ --hop-Checkbox-text-color-focused: var(--hop-neutral-text-hover);
2399
+ --hop-Checkbox-icon-color-focused: var(--hop-neutral-icon-hover);
2400
+ --hop-Checkbox-box-border-color-invalid: var(--hop-danger-border-strong);
2401
+ --hop-Checkbox-box-background-color-invalid: var(--hop-neutral-surface);
2402
+ --hop-Checkbox-box-border-color-hovered-invalid: var(--hop-danger-border-strong);
2403
+ --hop-Checkbox-box-background-color-hovered-invalid: var(--hop-danger-surface-weak-hover);
2404
+ --hop-Checkbox-box-border-color-pressed-invalid: var(--hop-danger-border-press);
2405
+ --hop-Checkbox-box-background-color-pressed-invalid: var(--hop-danger-surface-weak-press);
2406
+ --hop-Checkbox-box-border-color-focused-invalid: var(--hop-danger-border-press);
2407
+ --hop-Checkbox-box-background-color-focused-invalid: var(--hop-danger-surface);
2408
+ --hop-Checkbox-box-border-color-selected-invalid: var(--hop-danger-border-strong);
2409
+ --hop-Checkbox-box-background-color-selected-invalid: var(--hop-danger-surface-strong);
2410
+ --hop-Checkbox-check-color-invalid: var(--hop-danger-icon-strong);
2411
+ --hop-Checkbox-text-color-invalid: var(--hop-danger-text-weak);
2412
+ --hop-Checkbox-text-color-hovered-invalid: var(--hop-danger-text-weak-hover);
2413
+ --hop-Checkbox-text-color-pressed-invalid: var(--hop-danger-text-weak-press);
2414
+ --hop-Checkbox-icon-color-invalid: var(--hop-danger-icon-weak);
2415
+ --hop-Checkbox-icon-color-hovered-invalid: var(--hop-danger-icon-weak-hover);
2416
+ --hop-Checkbox-icon-color-pressed-invalid: var(--hop-danger-icon-weak-press);
2417
+ --hop-Checkbox-box-sm-block-size: 1rem;
2418
+ --hop-Checkbox-box-sm-inline-size: 1rem;
2419
+ --hop-Checkbox-text-sm-top-offset: calc((var(--box-inline-size) - (var(--hop-body-sm-line-height) * var(--hop-body-sm-font-size))) / 2);
2420
+ --hop-Checkbox-text-sm-margin-inline-start: calc(var(--hop-space-inline-sm) - var(--hop-space-inline-xs));
2421
+ --hop-Checkbox-box-md-block-size: 1.5rem;
2422
+ --hop-Checkbox-box-md-inline-size: 1.5rem;
2423
+ --hop-Checkbox-text-md-top-offset: calc((var(--box-inline-size) - (var(--hop-body-md-line-height) * var(--hop-body-md-font-size))) / 2);
2424
+ --hop-Checkbox-text-md-margin-inline-start: calc(var(--hop-space-inline-md) - var(--hop-space-inline-xs));
2425
+ --box-background-color: var(--hop-Checkbox-box-background-color);
2426
+ --box-border-color: var(--hop-Checkbox-box-border-color);
2427
+ --box-border-radius: var(--hop-shape-rounded-sm);
2428
+ --check-color: var(--hop-Checkbox-check-color);
2429
+ --check-display: var(--hop-Checkbox-check-display);
2430
+ --cursor: pointer;
2431
+ --text-color: var(--hop-Checkbox-text-color);
2432
+ --icon-color: var(--hop-Checkbox-icon-color);
2433
+ --transition-duration: var(--hop-easing-duration-2);
2434
+ cursor: var(--cursor);
2435
+ display: flex;
2436
+ column-gap: var(--hop-space-inline-xs);
2437
+ align-items: flex-start;
2438
+ justify-content: flex-start;
2439
+ box-sizing: border-box;
2440
+ inline-size: max-content;
2441
+ max-inline-size: 100%;
2442
+ }
2443
+ .Checkbox-module__hop-Checkbox___oHb0r[data-focus-visible] {
2444
+ --box-background-color: var(--hop-Checkbox-box-background-color-focused);
2445
+ --box-border-color: var(--hop-Checkbox-box-border-color-focused);
2446
+ --box-outline: var(--hop-Checkbox-box-outline-size) solid var(--hop-Checkbox-box-outline-color);
2447
+ --text-color: var(--hop-Checkbox-text-color-focused);
2448
+ --icon-color: var(--hop-Checkbox-icon-color-focused);
2449
+ }
2450
+ .Checkbox-module__hop-Checkbox___oHb0r[data-hovered] {
2451
+ --box-background-color: var(--hop-Checkbox-box-background-color-hovered);
2452
+ --box-border-color: var(--hop-Checkbox-box-border-color-hovered);
2453
+ --text-color: var(--hop-Checkbox-text-color-hovered);
2454
+ --icon-color: var(--hop-Checkbox-icon-color-hovered);
2455
+ }
2456
+ .Checkbox-module__hop-Checkbox___oHb0r[data-pressed] {
2457
+ --box-background-color: var(--hop-Checkbox-box-background-color-pressed);
2458
+ --box-border-color: var(--hop-Checkbox-box-border-color-pressed);
2459
+ --text-color: var(--hop-Checkbox-text-color-pressed);
2460
+ --icon-color: var(--hop-Checkbox-icon-color-pressed);
2461
+ }
2462
+ .Checkbox-module__hop-Checkbox___oHb0r[data-selected] {
2463
+ --box-background-color: var(--hop-Checkbox-box-background-color-selected);
2464
+ --box-border-color: var(--hop-Checkbox-box-border-color-selected);
2465
+ --check-display: var(--hop-Checkbox-check-display-selected);
2466
+ --text-color: var(--hop-Checkbox-text-color-selected);
2467
+ --icon-color: var(--hop-Checkbox-icon-color-selected);
2468
+ }
2469
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid] {
2470
+ --box-background-color: var(--hop-Checkbox-box-background-color-invalid);
2471
+ --box-border-color: var(--hop-Checkbox-box-border-color-invalid);
2472
+ --check-color: var(--hop-Checkbox-check-color-invalid);
2473
+ --text-color: var(--hop-Checkbox-text-color-invalid);
2474
+ --icon-color: var(--hop-Checkbox-icon-color-invalid);
2475
+ }
2476
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid]:where([data-focus-visible]) {
2477
+ --box-background-color: var(--hop-Checkbox-box-background-color-focused-invalid);
2478
+ --box-border-color: var(--hop-Checkbox-box-border-color-focused-invalid);
2479
+ }
2480
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid]:where([data-hovered]) {
2481
+ --box-background-color: var(--hop-Checkbox-box-background-color-hovered-invalid);
2482
+ --box-border-color: var(--hop-Checkbox-box-border-color-hovered-invalid);
2483
+ --text-color: var(--hop-Checkbox-text-color-hovered-invalid);
2484
+ --icon-color: var(--hop-Checkbox-icon-color-hovered-invalid);
2485
+ }
2486
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid]:where([data-pressed]) {
2487
+ --box-background-color: var(--hop-Checkbox-box-background-color-pressed-invalid);
2488
+ --box-border-color: var(--hop-Checkbox-box-border-color-pressed-invalid);
2489
+ --text-color: var(--hop-Checkbox-text-color-pressed-invalid);
2490
+ --icon-color: var(--hop-Checkbox-icon-color-pressed-invalid);
2491
+ }
2492
+ .Checkbox-module__hop-Checkbox___oHb0r:where([data-invalid])[data-selected] {
2493
+ --box-background-color: var(--hop-Checkbox-box-background-color-selected-invalid);
2494
+ --box-border-color: var(--hop-Checkbox-box-border-color-selected-invalid);
2495
+ }
2496
+ .Checkbox-module__hop-Checkbox___oHb0r[data-disabled] {
2497
+ --box-background-color: var(--hop-Checkbox-box-background-color-disabled);
2498
+ --box-border-color: var(--hop-Checkbox-box-border-color-disabled);
2499
+ --check-color: var(--hop-Checkbox-check-color-disabled);
2500
+ --cursor: not-allowed;
2501
+ --text-color: var(--hop-Checkbox-text-color-disabled);
2502
+ --icon-color: var(--hop-Checkbox-icon-color-disabled);
2503
+ }
2504
+ .Checkbox-module__hop-Checkbox--sm___ZuGio {
2505
+ --box-block-size: var(--hop-Checkbox-box-sm-block-size);
2506
+ --box-inline-size: var(--hop-Checkbox-box-sm-inline-size);
2507
+ --text-top-offset: var(--hop-Checkbox-text-sm-top-offset);
2508
+ --text-margin-inline-start: var(--hop-Checkbox-text-sm-margin-inline-start);
2509
+ }
2510
+ .Checkbox-module__hop-Checkbox--md___f9YGd {
2511
+ --box-block-size: var(--hop-Checkbox-box-md-block-size);
2512
+ --box-inline-size: var(--hop-Checkbox-box-md-inline-size);
2513
+ --text-top-offset: var(--hop-Checkbox-text-md-top-offset);
2514
+ --text-margin-inline-start: var(--hop-Checkbox-text-md-margin-inline-start);
2515
+ }
2516
+ .Checkbox-module__hop-Checkbox__icon___Ft4Xh,
2517
+ .Checkbox-module__hop-Checkbox__icon-list___VcJuW {
2518
+ flex: 0 0 auto;
2519
+ order: 3;
2520
+ color: var(--icon-color);
2521
+ }
2522
+ .Checkbox-module__hop-Checkbox__box___puaui {
2523
+ display: flex;
2524
+ flex: 0 0 auto;
2525
+ align-items: center;
2526
+ justify-content: center;
2527
+ order: 1;
2528
+ box-sizing: border-box;
2529
+ inline-size: var(--box-inline-size, var(--hop-Checkbox-box-md-inline-size));
2530
+ block-size: var(--box-block-size, var(--hop-Checkbox-box-md-block-size));
2531
+ background-color: var(--box-background-color);
2532
+ border: var(--hop-Checkbox-box-border-size) solid var(--box-border-color);
2533
+ border-radius: var(--box-border-radius);
2534
+ outline: var(--box-outline, none);
2535
+ outline-offset: 0.125rem;
2536
+ transition: background-color var(--transition-duration) var(--hop-easing-productive), border var(--transition-duration) var(--hop-easing-productive);
2537
+ }
2538
+ .Checkbox-module__hop-Checkbox__check___w8beQ {
2539
+ display: var(--check-display);
2540
+ color: var(--check-color);
2541
+ }
2542
+ .Checkbox-module__hop-Checkbox__text___3zmf2 {
2543
+ flex: 0 1 auto;
2544
+ order: 2;
2545
+ min-inline-size: 0;
2546
+ margin-block-start: var(--text-top-offset, var(--hop-Checkbox-text-md-top-offset));
2547
+ margin-inline-start: var(--text-margin-inline-start, var(--hop-Checkbox-text-md-margin-inline-start));
2548
+ color: var(--text-color);
2549
+ }
2550
+
2551
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/checkbox/src/CheckboxField.module.css/#css-module-data */
2552
+ .CheckboxField-module__hop-CheckboxField___WbOMN {
2553
+ --hop-CheckboxField-description-color: var(--hop-neutral-text-weak);
2554
+ --hop-CheckboxField-description-color-disabled: var(--hop-neutral-text-disabled);
2555
+ --hop-CheckboxField-sm-row-gap: var(--hop-space-stack-xs);
2556
+ --hop-CheckboxField-checkbox-sm-inline-size: 1rem;
2557
+ --hop-CheckboxField-description-sm-margin-inline-start: calc(var(--hop-CheckboxField-checkbox-sm-inline-size) + var(--hop-space-inline-sm));
2558
+ --hop-CheckboxField-md-row-gap: var(--hop-space-stack-xs);
2559
+ --hop-CheckboxField-checkbox-md-inline-size: 1.5rem;
2560
+ --hop-CheckboxField-description-md-margin-inline-start: calc(var(--hop-CheckboxField-checkbox-md-inline-size) + var(--hop-space-inline-md));
2561
+ --description-color: var(--hop-CheckboxField-description-color);
2562
+ display: flex;
2563
+ flex-direction: column;
2564
+ row-gap: var(--row-gap, var(--hop-space-stack-sm));
2565
+ align-items: flex-start;
2566
+ justify-content: flex-start;
2567
+ box-sizing: border-box;
2568
+ inline-size: max-content;
2569
+ max-inline-size: 100%;
2570
+ }
2571
+ .CheckboxField-module__hop-CheckboxField___WbOMN[data-disabled] {
2572
+ --description-color: var(--hop-CheckboxField-description-color-disabled);
2573
+ }
2574
+ .CheckboxField-module__hop-CheckboxField--sm___8V3hn {
2575
+ --row-gap: var(--hop-CheckboxField-sm-row-gap);
2576
+ --description-margin-inline-start: var(--hop-CheckboxField-description-sm-margin-inline-start);
2577
+ }
2578
+ .CheckboxField-module__hop-CheckboxField--md___OiTum {
2579
+ --row-gap: var(--hop-CheckboxField-md-row-gap);
2580
+ --description-margin-inline-start: var(--hop-CheckboxField-description-md-margin-inline-start);
2581
+ }
2582
+ .CheckboxField-module__hop-CheckboxField__description___Yx0se {
2583
+ order: 2;
2584
+ margin-inline-start: var(--description-margin-inline-start, var(--hop-CheckboxField-description-md-margin-inline-start));
2585
+ color: var(--description-color);
2586
+ }
2587
+ .CheckboxField-module__hop-CheckboxField__checkbox___2kOCO {
2588
+ order: 1;
2589
+ }
2590
+
2591
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/error-message/src/ErrorMessage.module.css/#css-module-data */
2592
+ .ErrorMessage-module__hop-ErrorMessage___Q81Sd {
2593
+ --hop-ErrorMessage-color: var(--hop-danger-text-weak);
2594
+ --hop-ErrorMessage-font-family: var(--hop-body-xs-font-family);
2595
+ --hop-ErrorMessage-font-size: var(--hop-body-xs-font-size);
2596
+ --hop-ErrorMessage-font-weight: var(--hop-body-xs-font-weight);
2597
+ --hop-ErrorMessage-line-height: var(--hop-body-xs-line-height);
2598
+ --hop-ErrorMessage-column-gap: var(--hop-space-inline-xs);
2599
+ display: flex;
2600
+ column-gap: var(--hop-ErrorMessage-column-gap);
2601
+ align-items: center;
2602
+ box-sizing: border-box;
2603
+ font-family: var(--hop-ErrorMessage-font-family);
2604
+ font-size: var(--hop-ErrorMessage-font-size);
2605
+ font-weight: var(--hop-ErrorMessage-font-weight);
2606
+ line-height: var(--hop-ErrorMessage-line-height);
2607
+ color: var(--hop-ErrorMessage-color);
2608
+ }
2609
+ .ErrorMessage-module__hop-ErrorMessage__icon___L84xV {
2610
+ flex: 0 0 auto;
2611
+ align-self: flex-start;
2612
+ }
2613
+
2614
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/helper-message/src/HelperMessage.module.css/#css-module-data */
2615
+ .HelperMessage-module__hop-HelperMessage___bH5cE {
2616
+ --hop-HelperMessage-color: var(--hop-neutral-text-weak);
2617
+ --hop-HelperMessage-column-gap: var(--hop-space-inline-xs);
2618
+ display: flex;
2619
+ column-gap: var(--hop-HelperMessage-column-gap);
2620
+ align-items: center;
2621
+ box-sizing: border-box;
2622
+ color: var(--hop-HelperMessage-color);
2623
+ }
2624
+ .HelperMessage-module__hop-HelperMessage__icon___lLc5y {
2625
+ flex: 0 0 auto;
2626
+ align-self: flex-start;
2627
+ }
2628
+
2629
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/checkbox/src/CheckboxGroup.module.css/#css-module-data */
2630
+ .CheckboxGroup-module__hop-CheckboxGroup___CmrWe {
2631
+ --hop-CheckboxGroup-align-items: flex-start;
2632
+ --hop-CheckboxGroup-justify-content: flex-start;
2633
+ --hop-CheckboxGroup-bordered-border-color: var(--hop-neutral-border-weak);
2634
+ --hop-CheckboxGroup-sm-column-gap: var(--hop-space-inline-sm);
2635
+ --hop-CheckboxGroup-sm-row-gap: var(--hop-space-stack-sm);
2636
+ --hop-CheckboxGroup-list-sm-column-gap: var(--hop-space-inline-sm);
2637
+ --hop-CheckboxGroup-list-sm-row-gap: var(--hop-space-stack-sm);
2638
+ --hop-CheckboxGroup-bordered-sm-padding: var(--hop-space-inset-sm);
2639
+ --hop-CheckboxGroup-bordered-sm-column-gap: var(--hop-space-inline-sm);
2640
+ --hop-CheckboxGroup-bordered-sm-row-gap: var(--hop-space-stack-sm);
2641
+ --hop-CheckboxGroup-list-bordered-sm-column-gap: 0;
2642
+ --hop-CheckboxGroup-list-bordered-sm-row-gap: 0;
2643
+ --hop-CheckboxGroup-md-column-gap: var(--hop-space-inline-md);
2644
+ --hop-CheckboxGroup-md-row-gap: var(--hop-space-stack-md);
2645
+ --hop-CheckboxGroup-list-md-column-gap: var(--hop-space-inline-md);
2646
+ --hop-CheckboxGroup-list-md-row-gap: var(--hop-space-stack-md);
2647
+ --hop-CheckboxGroup-bordered-md-padding: var(--hop-space-inset-md);
2648
+ --hop-CheckboxGroup-bordered-md-column-gap: var(--hop-space-inline-sm);
2649
+ --hop-CheckboxGroup-bordered-md-row-gap: var(--hop-space-stack-sm);
2650
+ --hop-CheckboxGroup-list-bordered-md-column-gap: 0;
2651
+ --hop-CheckboxGroup-list-bordered-md-row-gap: 0;
2652
+ --hop-CheckboxGroup-vertical-flex-direction: column;
2653
+ --hop-CheckboxGroup-horizontal-flex-direction: row;
2654
+ --checkbox-border-size: 0.0625rem;
2655
+ --checkbox-border-color: var(--hop-neutral-border-weak);
2656
+ --flex-direction: var(--hop-CheckboxGroup-vertical-flex-direction);
2657
+ --align-items: var(--hop-CheckboxGroup-align-items);
2658
+ --justify-content: var(--hop-CheckboxGroup-justify-content);
2659
+ --flex-wrap: wrap;
2660
+ display: flex;
2661
+ flex-direction: column;
2662
+ gap: var(--row-gap, var(--hop-space-stack-md)) var(--column-gap, var(--hop-space-inline-md));
2663
+ align-items: var(--align-items);
2664
+ justify-content: var(--justify-content);
2665
+ box-sizing: border-box;
2666
+ inline-size: max-content;
2667
+ max-inline-size: 100%;
2668
+ }
2669
+ .CheckboxGroup-module__hop-CheckboxGroup--bordered___1cb5p {
2670
+ --list-border: var(--checkbox-border-size) solid var(--checkbox-border-color);
2671
+ --list-border-radius: var(--hop-shape-rounded-md);
2672
+ }
2673
+ .CheckboxGroup-module__hop-CheckboxGroup--sm___KgGFp {
2674
+ --column-gap: var(--hop-CheckboxGroup-sm-column-gap);
2675
+ --row-gap: var(--hop-CheckboxGroup-sm-row-gap);
2676
+ --list-column-gap: var(--hop-CheckboxGroup-list-sm-column-gap);
2677
+ --list-row-gap: var(--hop-CheckboxGroup-list-sm-row-gap);
2678
+ }
2679
+ .CheckboxGroup-module__hop-CheckboxGroup--md___C-B-K {
2680
+ --column-gap: var(--hop-CheckboxGroup-md-column-gap);
2681
+ --row-gap: var(--hop-CheckboxGroup-md-row-gap);
2682
+ --list-column-gap: var(--hop-CheckboxGroup-list-md-column-gap);
2683
+ --list-row-gap: var(--hop-CheckboxGroup-list-md-row-gap);
2684
+ }
2685
+ .CheckboxGroup-module__hop-CheckboxGroup--bordered___1cb5p.CheckboxGroup-module__hop-CheckboxGroup--sm___KgGFp {
2686
+ --checkbox-padding: var(--hop-CheckboxGroup-bordered-sm-padding);
2687
+ --column-gap: var(--hop-CheckboxGroup-bordered-sm-column-gap);
2688
+ --row-gap: var(--hop-CheckboxGroup-bordered-sm-row-gap);
2689
+ --list-column-gap: var(--hop-CheckboxGroup-list-bordered-sm-column-gap);
2690
+ --list-row-gap: var(--hop-CheckboxGroup-list-bordered-sm-row-gap);
2691
+ }
2692
+ .CheckboxGroup-module__hop-CheckboxGroup--bordered___1cb5p.CheckboxGroup-module__hop-CheckboxGroup--md___C-B-K {
2693
+ --checkbox-padding: var(--hop-CheckboxGroup-bordered-md-padding);
2694
+ --column-gap: var(--hop-CheckboxGroup-bordered-md-column-gap);
2695
+ --row-gap: var(--hop-CheckboxGroup-bordered-md-row-gap);
2696
+ --list-column-gap: var(--hop-CheckboxGroup-list-bordered-md-column-gap);
2697
+ --list-row-gap: var(--hop-CheckboxGroup-list-bordered-md-row-gap);
2698
+ }
2699
+ .CheckboxGroup-module__hop-CheckboxGroup___CmrWe[data-orientation=horizontal] {
2700
+ --flex-direction: var(--hop-CheckboxGroup-horizontal-flex-direction);
2701
+ }
2702
+ .CheckboxGroup-module__hop-CheckboxGroup--bordered___1cb5p[data-orientation=horizontal] {
2703
+ --flex-wrap: nowrap;
2704
+ }
2705
+ .CheckboxGroup-module__hop-CheckboxGroup___CmrWe > .CheckboxGroup-module__hop-CheckboxGroup__label___kuRzl {
2706
+ order: 1;
2707
+ }
2708
+ .CheckboxGroup-module__hop-CheckboxGroup__list___1WGEL {
2709
+ display: flex;
2710
+ flex-flow: var(--flex-direction) var(--flex-wrap);
2711
+ gap: var(--list-row-gap, var(--hop-space-stack-md)) var(--list-column-gap, var(--hop-space-inline-md));
2712
+ order: 2;
2713
+ box-sizing: border-box;
2714
+ inline-size: max-content;
2715
+ max-inline-size: 100%;
2716
+ border: var(--list-border, none);
2717
+ border-radius: var(--list-border-radius, 0);
2718
+ }
2719
+ .CheckboxGroup-module__hop-CheckboxGroup__list___1WGEL > .CheckboxGroup-module__hop-CheckboxGroup__checkbox___Eb-jg {
2720
+ position: relative;
2721
+ flex: 0 1 auto;
2722
+ align-content: start;
2723
+ inline-size: auto;
2724
+ min-inline-size: 0;
2725
+ padding: var(--checkbox-padding, 0);
2726
+ }
2727
+ .CheckboxGroup-module__hop-CheckboxGroup--bordered___1cb5p .CheckboxGroup-module__hop-CheckboxGroup__list___1WGEL > .CheckboxGroup-module__hop-CheckboxGroup__checkbox___Eb-jg ~ .CheckboxGroup-module__hop-CheckboxGroup__checkbox___Eb-jg::before {
2728
+ content: "";
2729
+ position: absolute;
2730
+ display: block;
2731
+ }
2732
+ .CheckboxGroup-module__hop-CheckboxGroup--bordered___1cb5p[data-orientation=vertical] .CheckboxGroup-module__hop-CheckboxGroup__list___1WGEL > .CheckboxGroup-module__hop-CheckboxGroup__checkbox___Eb-jg ~ .CheckboxGroup-module__hop-CheckboxGroup__checkbox___Eb-jg::before {
2733
+ inset-block-start: 0;
2734
+ inset-inline: 0;
2735
+ border-block-start: var(--list-border, none);
2736
+ }
2737
+ .CheckboxGroup-module__hop-CheckboxGroup--bordered___1cb5p[data-orientation=horizontal] .CheckboxGroup-module__hop-CheckboxGroup__list___1WGEL > .CheckboxGroup-module__hop-CheckboxGroup__checkbox___Eb-jg ~ .CheckboxGroup-module__hop-CheckboxGroup__checkbox___Eb-jg::before {
2738
+ inset-block: 0;
2739
+ inset-inline-start: 0;
2740
+ border-inline-start: var(--list-border, none);
2741
+ }
2742
+ .CheckboxGroup-module__hop-CheckboxGroup___CmrWe > .CheckboxGroup-module__hop-CheckboxGroup__error-message___HNYuL,
2743
+ .CheckboxGroup-module__hop-CheckboxGroup___CmrWe > .CheckboxGroup-module__hop-CheckboxGroup__helper-message___g8hu7 {
2744
+ order: 3;
2745
+ }
2746
+
2747
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/checkbox/src/DecorativeCheckbox.module.css/#css-module-data */
2748
+ .Checkbox-module__hop-Checkbox___oHb0r {
2749
+ --hop-Checkbox-box-border-size: 0.0625rem;
2750
+ --hop-Checkbox-box-border-color: var(--hop-neutral-border);
2751
+ --hop-Checkbox-box-background-color: var(--hop-neutral-surface);
2752
+ --hop-Checkbox-box-outline-size: 0.125rem;
2753
+ --hop-Checkbox-box-outline-color: var(--hop-primary-border-focus);
2754
+ --hop-Checkbox-check-color: var(--hop-neutral-icon-selected);
2755
+ --hop-Checkbox-check-display: none;
2756
+ --hop-Checkbox-text-color: var(--hop-neutral-text);
2757
+ --hop-Checkbox-icon-color: var(--hop-neutral-icon);
2758
+ --hop-Checkbox-box-border-color-hovered: var(--hop-neutral-border-hover);
2759
+ --hop-Checkbox-box-background-color-hovered: var(--hop-neutral-surface-hover);
2760
+ --hop-Checkbox-text-color-hovered: var(--hop-neutral-text-hover);
2761
+ --hop-Checkbox-icon-color-hovered: var(--hop-neutral-icon-hover);
2762
+ --hop-Checkbox-box-border-color-pressed: var(--hop-neutral-border-press);
2763
+ --hop-Checkbox-box-background-color-pressed: var(--hop-neutral-surface-press);
2764
+ --hop-Checkbox-text-color-pressed: var(--hop-neutral-text-press);
2765
+ --hop-Checkbox-icon-color-pressed: var(--hop-neutral-icon-press);
2766
+ --hop-Checkbox-box-border-color-selected: var(--hop-neutral-border-selected);
2767
+ --hop-Checkbox-box-background-color-selected: var(--hop-neutral-surface-selected);
2768
+ --hop-Checkbox-check-display-selected: block;
2769
+ --hop-Checkbox-text-color-selected: var(--hop-neutral-text);
2770
+ --hop-Checkbox-icon-color-selected: var(--hop-neutral-icon);
2771
+ --hop-Checkbox-box-border-color-disabled: var(--hop-neutral-border-disabled);
2772
+ --hop-Checkbox-box-background-color-disabled: var(--hop-neutral-surface-disabled);
2773
+ --hop-Checkbox-check-color-disabled: var(--hop-neutral-icon-disabled);
2774
+ --hop-Checkbox-text-color-disabled: var(--hop-neutral-text-disabled);
2775
+ --hop-Checkbox-icon-color-disabled: var(--hop-neutral-icon-disabled);
2776
+ --hop-Checkbox-box-border-color-focused: var(--hop-neutral-border-hover);
2777
+ --hop-Checkbox-box-background-color-focused: var(--hop-neutral-surface-hover);
2778
+ --hop-Checkbox-text-color-focused: var(--hop-neutral-text-hover);
2779
+ --hop-Checkbox-icon-color-focused: var(--hop-neutral-icon-hover);
2780
+ --hop-Checkbox-box-border-color-invalid: var(--hop-danger-border-strong);
2781
+ --hop-Checkbox-box-background-color-invalid: var(--hop-neutral-surface);
2782
+ --hop-Checkbox-box-border-color-hovered-invalid: var(--hop-danger-border-strong);
2783
+ --hop-Checkbox-box-background-color-hovered-invalid: var(--hop-danger-surface-weak-hover);
2784
+ --hop-Checkbox-box-border-color-pressed-invalid: var(--hop-danger-border-press);
2785
+ --hop-Checkbox-box-background-color-pressed-invalid: var(--hop-danger-surface-weak-press);
2786
+ --hop-Checkbox-box-border-color-focused-invalid: var(--hop-danger-border-press);
2787
+ --hop-Checkbox-box-background-color-focused-invalid: var(--hop-danger-surface);
2788
+ --hop-Checkbox-box-border-color-selected-invalid: var(--hop-danger-border-strong);
2789
+ --hop-Checkbox-box-background-color-selected-invalid: var(--hop-danger-surface-strong);
2790
+ --hop-Checkbox-check-color-invalid: var(--hop-danger-icon-strong);
2791
+ --hop-Checkbox-text-color-invalid: var(--hop-danger-text-weak);
2792
+ --hop-Checkbox-text-color-hovered-invalid: var(--hop-danger-text-weak-hover);
2793
+ --hop-Checkbox-text-color-pressed-invalid: var(--hop-danger-text-weak-press);
2794
+ --hop-Checkbox-icon-color-invalid: var(--hop-danger-icon-weak);
2795
+ --hop-Checkbox-icon-color-hovered-invalid: var(--hop-danger-icon-weak-hover);
2796
+ --hop-Checkbox-icon-color-pressed-invalid: var(--hop-danger-icon-weak-press);
2797
+ --hop-Checkbox-box-sm-block-size: 1rem;
2798
+ --hop-Checkbox-box-sm-inline-size: 1rem;
2799
+ --hop-Checkbox-text-sm-top-offset: calc((var(--box-inline-size) - (var(--hop-body-sm-line-height) * var(--hop-body-sm-font-size))) / 2);
2800
+ --hop-Checkbox-text-sm-margin-inline-start: calc(var(--hop-space-inline-sm) - var(--hop-space-inline-xs));
2801
+ --hop-Checkbox-box-md-block-size: 1.5rem;
2802
+ --hop-Checkbox-box-md-inline-size: 1.5rem;
2803
+ --hop-Checkbox-text-md-top-offset: calc((var(--box-inline-size) - (var(--hop-body-md-line-height) * var(--hop-body-md-font-size))) / 2);
2804
+ --hop-Checkbox-text-md-margin-inline-start: calc(var(--hop-space-inline-md) - var(--hop-space-inline-xs));
2805
+ --box-background-color: var(--hop-Checkbox-box-background-color);
2806
+ --box-border-color: var(--hop-Checkbox-box-border-color);
2807
+ --box-border-radius: var(--hop-shape-rounded-sm);
2808
+ --check-color: var(--hop-Checkbox-check-color);
2809
+ --check-display: var(--hop-Checkbox-check-display);
2810
+ --cursor: pointer;
2811
+ --text-color: var(--hop-Checkbox-text-color);
2812
+ --icon-color: var(--hop-Checkbox-icon-color);
2813
+ --transition-duration: var(--hop-easing-duration-2);
2814
+ cursor: var(--cursor);
2815
+ display: flex;
2816
+ column-gap: var(--hop-space-inline-xs);
2817
+ align-items: flex-start;
2818
+ justify-content: flex-start;
2819
+ box-sizing: border-box;
2820
+ inline-size: max-content;
2821
+ max-inline-size: 100%;
2822
+ }
2823
+ .Checkbox-module__hop-Checkbox___oHb0r[data-focus-visible] {
2824
+ --box-background-color: var(--hop-Checkbox-box-background-color-focused);
2825
+ --box-border-color: var(--hop-Checkbox-box-border-color-focused);
2826
+ --box-outline: var(--hop-Checkbox-box-outline-size) solid var(--hop-Checkbox-box-outline-color);
2827
+ --text-color: var(--hop-Checkbox-text-color-focused);
2828
+ --icon-color: var(--hop-Checkbox-icon-color-focused);
2829
+ }
2830
+ .Checkbox-module__hop-Checkbox___oHb0r[data-hovered] {
2831
+ --box-background-color: var(--hop-Checkbox-box-background-color-hovered);
2832
+ --box-border-color: var(--hop-Checkbox-box-border-color-hovered);
2833
+ --text-color: var(--hop-Checkbox-text-color-hovered);
2834
+ --icon-color: var(--hop-Checkbox-icon-color-hovered);
2835
+ }
2836
+ .Checkbox-module__hop-Checkbox___oHb0r[data-pressed] {
2837
+ --box-background-color: var(--hop-Checkbox-box-background-color-pressed);
2838
+ --box-border-color: var(--hop-Checkbox-box-border-color-pressed);
2839
+ --text-color: var(--hop-Checkbox-text-color-pressed);
2840
+ --icon-color: var(--hop-Checkbox-icon-color-pressed);
2841
+ }
2842
+ .Checkbox-module__hop-Checkbox___oHb0r[data-selected] {
2843
+ --box-background-color: var(--hop-Checkbox-box-background-color-selected);
2844
+ --box-border-color: var(--hop-Checkbox-box-border-color-selected);
2845
+ --check-display: var(--hop-Checkbox-check-display-selected);
2846
+ --text-color: var(--hop-Checkbox-text-color-selected);
2847
+ --icon-color: var(--hop-Checkbox-icon-color-selected);
2848
+ }
2849
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid] {
2850
+ --box-background-color: var(--hop-Checkbox-box-background-color-invalid);
2851
+ --box-border-color: var(--hop-Checkbox-box-border-color-invalid);
2852
+ --check-color: var(--hop-Checkbox-check-color-invalid);
2853
+ --text-color: var(--hop-Checkbox-text-color-invalid);
2854
+ --icon-color: var(--hop-Checkbox-icon-color-invalid);
2855
+ }
2856
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid]:where([data-focus-visible]) {
2857
+ --box-background-color: var(--hop-Checkbox-box-background-color-focused-invalid);
2858
+ --box-border-color: var(--hop-Checkbox-box-border-color-focused-invalid);
2859
+ }
2860
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid]:where([data-hovered]) {
2861
+ --box-background-color: var(--hop-Checkbox-box-background-color-hovered-invalid);
2862
+ --box-border-color: var(--hop-Checkbox-box-border-color-hovered-invalid);
2863
+ --text-color: var(--hop-Checkbox-text-color-hovered-invalid);
2864
+ --icon-color: var(--hop-Checkbox-icon-color-hovered-invalid);
2865
+ }
2866
+ .Checkbox-module__hop-Checkbox___oHb0r[data-invalid]:where([data-pressed]) {
2867
+ --box-background-color: var(--hop-Checkbox-box-background-color-pressed-invalid);
2868
+ --box-border-color: var(--hop-Checkbox-box-border-color-pressed-invalid);
2869
+ --text-color: var(--hop-Checkbox-text-color-pressed-invalid);
2870
+ --icon-color: var(--hop-Checkbox-icon-color-pressed-invalid);
2871
+ }
2872
+ .Checkbox-module__hop-Checkbox___oHb0r:where([data-invalid])[data-selected] {
2873
+ --box-background-color: var(--hop-Checkbox-box-background-color-selected-invalid);
2874
+ --box-border-color: var(--hop-Checkbox-box-border-color-selected-invalid);
2875
+ }
2876
+ .Checkbox-module__hop-Checkbox___oHb0r[data-disabled] {
2877
+ --box-background-color: var(--hop-Checkbox-box-background-color-disabled);
2878
+ --box-border-color: var(--hop-Checkbox-box-border-color-disabled);
2879
+ --check-color: var(--hop-Checkbox-check-color-disabled);
2880
+ --cursor: not-allowed;
2881
+ --text-color: var(--hop-Checkbox-text-color-disabled);
2882
+ --icon-color: var(--hop-Checkbox-icon-color-disabled);
2883
+ }
2884
+ .Checkbox-module__hop-Checkbox--sm___ZuGio {
2885
+ --box-block-size: var(--hop-Checkbox-box-sm-block-size);
2886
+ --box-inline-size: var(--hop-Checkbox-box-sm-inline-size);
2887
+ --text-top-offset: var(--hop-Checkbox-text-sm-top-offset);
2888
+ --text-margin-inline-start: var(--hop-Checkbox-text-sm-margin-inline-start);
2889
+ }
2890
+ .Checkbox-module__hop-Checkbox--md___f9YGd {
2891
+ --box-block-size: var(--hop-Checkbox-box-md-block-size);
2892
+ --box-inline-size: var(--hop-Checkbox-box-md-inline-size);
2893
+ --text-top-offset: var(--hop-Checkbox-text-md-top-offset);
2894
+ --text-margin-inline-start: var(--hop-Checkbox-text-md-margin-inline-start);
2895
+ }
2896
+ .Checkbox-module__hop-Checkbox__icon___Ft4Xh,
2897
+ .Checkbox-module__hop-Checkbox__icon-list___VcJuW {
2898
+ flex: 0 0 auto;
2899
+ order: 3;
2900
+ color: var(--icon-color);
2901
+ }
2902
+ .Checkbox-module__hop-Checkbox__box___puaui {
2903
+ display: flex;
2904
+ flex: 0 0 auto;
2905
+ align-items: center;
2906
+ justify-content: center;
2907
+ order: 1;
2908
+ box-sizing: border-box;
2909
+ inline-size: var(--box-inline-size, var(--hop-Checkbox-box-md-inline-size));
2910
+ block-size: var(--box-block-size, var(--hop-Checkbox-box-md-block-size));
2911
+ background-color: var(--box-background-color);
2912
+ border: var(--hop-Checkbox-box-border-size) solid var(--box-border-color);
2913
+ border-radius: var(--box-border-radius);
2914
+ outline: var(--box-outline, none);
2915
+ outline-offset: 0.125rem;
2916
+ transition: background-color var(--transition-duration) var(--hop-easing-productive), border var(--transition-duration) var(--hop-easing-productive);
2917
+ }
2918
+ .Checkbox-module__hop-Checkbox__check___w8beQ {
2919
+ display: var(--check-display);
2920
+ color: var(--check-color);
2921
+ }
2922
+ .Checkbox-module__hop-Checkbox__text___3zmf2 {
2923
+ flex: 0 1 auto;
2924
+ order: 2;
2925
+ min-inline-size: 0;
2926
+ margin-block-start: var(--text-top-offset, var(--hop-Checkbox-text-md-top-offset));
2927
+ margin-inline-start: var(--text-margin-inline-start, var(--hop-Checkbox-text-md-margin-inline-start));
2928
+ color: var(--text-color);
2929
+ }
2930
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox___8GaHh {
2931
+ }
2932
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox--sm___fwtbW {
2933
+ }
2934
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox--md___i0oAM {
2935
+ }
2936
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox__icon___PyeWV,
2937
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox__icon-list___tFw7N {
2938
+ }
2939
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox__box___Aztjh {
2940
+ }
2941
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox__check___0u5F4 {
2942
+ }
2943
+ .DecorativeCheckbox-module__hop-DecorativeCheckbox__text___bKeKU {
2944
+ }
2945
+
2946
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/radio/src/DecorativeRadio.module.css/#css-module-data */
2947
+ .Radio-module__hop-Radio___eBueo {
2948
+ --hop-Radio-box-border-size: 0.0625rem;
2949
+ --hop-Radio-box-border-color: var(--hop-neutral-border);
2950
+ --hop-Radio-box-background-color: var(--hop-neutral-surface);
2951
+ --hop-Radio-box-outline-size: 0.125rem;
2952
+ --hop-Radio-box-outline-color: var(--hop-primary-border-focus);
2953
+ --hop-Radio-bullet-color: var(--hop-neutral-icon-selected);
2954
+ --hop-Radio-bullet-display: none;
2955
+ --hop-Radio-text-color: var(--hop-neutral-text);
2956
+ --hop-Radio-icon-color: var(--hop-neutral-icon);
2957
+ --hop-Radio-box-border-color-hovered: var(--hop-neutral-border-hover);
2958
+ --hop-Radio-box-background-color-hovered: var(--hop-neutral-surface-hover);
2959
+ --hop-Radio-text-color-hovered: var(--hop-neutral-text-hover);
2960
+ --hop-Radio-icon-color-hovered: var(--hop-neutral-icon-hover);
2961
+ --hop-Radio-box-border-color-pressed: var(--hop-neutral-border-press);
2962
+ --hop-Radio-box-background-color-pressed: var(--hop-neutral-surface-press);
2963
+ --hop-Radio-text-color-pressed: var(--hop-neutral-text-press);
2964
+ --hop-Radio-icon-color-pressed: var(--hop-neutral-icon-press);
2965
+ --hop-Radio-box-border-color-selected: var(--hop-neutral-border-selected);
2966
+ --hop-Radio-box-background-color-selected: var(--hop-neutral-surface-selected);
2967
+ --hop-Radio-bullet-display-selected: block;
2968
+ --hop-Radio-text-color-selected: var(--hop-neutral-text);
2969
+ --hop-Radio-icon-color-selected: var(--hop-neutral-icon);
2970
+ --hop-Radio-box-border-color-disabled: var(--hop-neutral-border-disabled);
2971
+ --hop-Radio-box-background-color-disabled: var(--hop-neutral-surface-disabled);
2972
+ --hop-Radio-bullet-color-disabled: var(--hop-neutral-icon-disabled);
2973
+ --hop-Radio-text-color-disabled: var(--hop-neutral-text-disabled);
2974
+ --hop-Radio-icon-color-disabled: var(--hop-neutral-icon-disabled);
2975
+ --hop-Radio-box-border-color-focused: var(--hop-neutral-border-hover);
2976
+ --hop-Radio-box-background-color-focused: var(--hop-neutral-surface-hover);
2977
+ --hop-Radio-text-color-focused: var(--hop-neutral-text);
2978
+ --hop-Radio-icon-color-focused: var(--hop-neutral-icon);
2979
+ --hop-Radio-box-border-color-invalid: var(--hop-danger-border-strong);
2980
+ --hop-Radio-box-background-color-invalid: var(--hop-neutral-surface);
2981
+ --hop-Radio-box-border-color-hovered-invalid: var(--hop-danger-border-strong);
2982
+ --hop-Radio-box-background-color-hovered-invalid: var(--hop-danger-surface);
2983
+ --hop-Radio-box-border-color-pressed-invalid: var(--hop-danger-border-press);
2984
+ --hop-Radio-box-background-color-pressed-invalid: var(--hop-danger-surface-weak);
2985
+ --hop-Radio-box-border-color-focused-invalid: var(--hop-danger-border-strong);
2986
+ --hop-Radio-box-background-color-focused-invalid: var(--hop-danger-surface);
2987
+ --hop-Radio-box-border-color-selected-invalid: var(--hop-danger-border-strong);
2988
+ --hop-Radio-box-background-color-selected-invalid: var(--hop-danger-surface-strong);
2989
+ --hop-Radio-bullet-color-invalid: var(--hop-danger-icon-strong);
2990
+ --hop-Radio-text-color-invalid: var(--hop-danger-text-weak);
2991
+ --hop-Radio-icon-color-invalid: var(--hop-danger-icon-weak);
2992
+ --hop-Radio-text-color-hovered-invalid: var(--hop-danger-text-weak-hover);
2993
+ --hop-Radio-icon-color-hovered-invalid: var(--hop-danger-icon-weak-hover);
2994
+ --hop-Radio-text-color-pressed-invalid: var(--hop-danger-text-weak-press);
2995
+ --hop-Radio-box-sm-inline-size: 1rem;
2996
+ --hop-Radio-box-sm-block-size: 1rem;
2997
+ --hop-Radio-text-sm-top-offset: calc((var(--box-inline-size) - (var(--hop-body-sm-line-height) * var(--hop-body-sm-font-size))) / 2);
2998
+ --hop-Radio-text-sm-margin-inline-start: calc(var(--hop-space-inline-sm) - var(--hop-space-inline-xs));
2999
+ --hop-Radio-box-md-inline-size: 1.5rem;
3000
+ --hop-Radio-box-md-block-size: 1.5rem;
3001
+ --hop-Radio-text-md-top-offset: calc((var(--box-inline-size) - (var(--hop-body-md-line-height) * var(--hop-body-md-font-size))) / 2);
3002
+ --hop-Radio-text-md-margin-inline-start: calc(var(--hop-space-inline-md) - var(--hop-space-inline-xs));
3003
+ --box-background-color: var(--hop-Radio-box-background-color);
3004
+ --box-border-color: var(--hop-Radio-box-border-color);
3005
+ --box-border-radius: var(--hop-shape-circle);
3006
+ --bullet-color: var(--hop-Radio-bullet-color);
3007
+ --bullet-display: var(--hop-Radio-bullet-display);
3008
+ --cursor: pointer;
3009
+ --text-color: var(--hop-Radio-text-color);
3010
+ --icon-color: var(--hop-Radio-icon-color);
3011
+ --transition-duration: var(--hop-easing-duration-2);
3012
+ cursor: var(--cursor);
3013
+ display: flex;
3014
+ column-gap: var(--hop-space-inline-xs);
3015
+ align-items: flex-start;
3016
+ justify-content: flex-start;
3017
+ box-sizing: border-box;
3018
+ inline-size: max-content;
3019
+ max-inline-size: 100%;
3020
+ }
3021
+ .Radio-module__hop-Radio___eBueo[data-focus-visible] {
3022
+ --box-background-color: var(--hop-Radio-box-background-color-focused);
3023
+ --box-border-color: var(--hop-Radio-box-border-color-focused);
3024
+ --box-outline: var(--hop-Radio-box-outline-size) solid var(--hop-Radio-box-outline-color);
3025
+ --text-color: var(--hop-Radio-text-color-focused);
3026
+ --icon-color: var(--hop-Radio-icon-color-focused);
3027
+ }
3028
+ .Radio-module__hop-Radio___eBueo[data-hovered] {
3029
+ --box-background-color: var(--hop-Radio-box-background-color-hovered);
3030
+ --box-border-color: var(--hop-Radio-box-border-color-hovered);
3031
+ --text-color: var(--hop-Radio-text-color-hovered);
3032
+ --icon-color: var(--hop-Radio-icon-color-hovered);
3033
+ }
3034
+ .Radio-module__hop-Radio___eBueo[data-pressed] {
3035
+ --box-background-color: var(--hop-Radio-box-background-color-pressed);
3036
+ --box-border-color: var(--hop-Radio-box-border-color-pressed);
3037
+ --text-color: var(--hop-Radio-text-color-pressed);
3038
+ --icon-color: var(--hop-Radio-icon-color-pressed);
3039
+ }
3040
+ .Radio-module__hop-Radio___eBueo[data-selected] {
3041
+ --box-background-color: var(--hop-Radio-box-background-color-selected);
3042
+ --box-border-color: var(--hop-Radio-box-border-color-selected);
3043
+ --bullet-display: var(--hop-Radio-bullet-display-selected);
3044
+ --text-color: var(--hop-Radio-text-color-selected);
3045
+ --icon-color: var(--hop-Radio-icon-color-selected);
3046
+ }
3047
+ .Radio-module__hop-Radio___eBueo[data-invalid] {
3048
+ --box-background-color: var(--hop-Radio-box-background-color-invalid);
3049
+ --box-border-color: var(--hop-Radio-box-border-color-invalid);
3050
+ --bullet-color: var(--hop-Radio-bullet-color-invalid);
3051
+ --text-color: var(--hop-Radio-text-color-invalid);
3052
+ --icon-color: var(--hop-Radio-icon-color-invalid);
3053
+ }
3054
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-focus-visible] {
3055
+ --box-background-color: var(--hop-Radio-box-background-color-focused-invalid);
3056
+ --box-border-color: var(--hop-Radio-box-border-color-focused-invalid);
3057
+ }
3058
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-hovered] {
3059
+ --box-background-color: var(--hop-Radio-box-background-color-hovered-invalid);
3060
+ --box-border-color: var(--hop-Radio-box-border-color-hovered-invalid);
3061
+ --text-color: var(--hop-Radio-text-color-hovered-invalid);
3062
+ --icon-color: var(--hop-Radio-text-color-hovered-invalid);
3063
+ }
3064
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-pressed] {
3065
+ --box-background-color: var(--hop-Radio-box-background-color-pressed-invalid);
3066
+ --box-border-color: var(--hop-Radio-box-border-color-pressed-invalid);
3067
+ --text-color: var(--hop-Radio-text-color-pressed-invalid);
3068
+ --icon-color: var(--hop-Radio-icon-color-pressed-invalid);
3069
+ }
3070
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-selected] {
3071
+ --box-background-color: var(--hop-Radio-box-background-color-selected-invalid);
3072
+ --box-border-color: var(--hop-Radio-box-border-color-selected-invalid);
3073
+ }
3074
+ .Radio-module__hop-Radio___eBueo[data-disabled] {
3075
+ --box-background-color: var(--hop-Radio-box-background-color-disabled);
3076
+ --box-border-color: var(--hop-Radio-box-border-color-disabled);
3077
+ --bullet-color: var(--hop-Radio-bullet-color-disabled);
3078
+ --cursor: not-allowed;
3079
+ --text-color: var(--hop-Radio-text-color-disabled);
3080
+ --icon-color: var(--hop-Radio-icon-color-disabled);
3081
+ }
3082
+ .Radio-module__hop-Radio--sm___GQdC5 {
3083
+ --box-inline-size: var(--hop-Radio-box-sm-inline-size);
3084
+ --box-block-size: var(--hop-Radio-box-sm-block-size);
3085
+ --text-top-offset: var(--hop-Radio-text-sm-top-offset);
3086
+ --text-margin-inline-start: var(--hop-Radio-text-sm-margin-inline-start);
3087
+ }
3088
+ .Radio-module__hop-Radio--md___63v-N {
3089
+ --box-inline-size: var(--hop-Radio-box-md-inline-size);
3090
+ --box-block-size: var(--hop-Radio-box-md-block-size);
3091
+ --text-top-offset: var(--hop-Radio-text-md-top-offset);
3092
+ --text-margin-inline-start: var(--hop-Radio-text-md-margin-inline-start);
3093
+ }
3094
+ .Radio-module__hop-Radio__icon___dVuoR,
3095
+ .Radio-module__hop-Radio__icon-list___LeQK7 {
3096
+ flex: 0 0 auto;
3097
+ order: 3;
3098
+ color: var(--icon-color);
3099
+ }
3100
+ .Radio-module__hop-Radio__box___6R1dw {
3101
+ display: flex;
3102
+ flex: 0 0 auto;
3103
+ align-items: center;
3104
+ justify-content: center;
3105
+ order: 1;
3106
+ box-sizing: border-box;
3107
+ inline-size: var(--box-inline-size, var(--hop-Radio-box-md-inline-size));
3108
+ block-size: var(--box-block-size, var(--hop-Radio-box-md-block-size));
3109
+ background-color: var(--box-background-color);
3110
+ border: var(--hop-Radio-box-border-size) solid var(--box-border-color);
3111
+ border-radius: var(--box-border-radius);
3112
+ outline: var(--box-outline, none);
3113
+ outline-offset: 0.125rem;
3114
+ transition: background-color var(--transition-duration) var(--hop-easing-productive), border var(--transition-duration) var(--hop-easing-productive);
3115
+ }
3116
+ .Radio-module__hop-Radio__bullet___gVfg- {
3117
+ display: var(--bullet-display);
3118
+ color: var(--bullet-color);
3119
+ }
3120
+ .Radio-module__hop-Radio__text___3WXI3 {
3121
+ flex: 0 1 auto;
3122
+ order: 2;
3123
+ min-inline-size: 0;
3124
+ margin-block-start: var(--text-top-offset, var(--hop-Radio-text-md-top-offset));
3125
+ margin-inline-start: var(--text-margin-inline-start, var(--hop-Radio-text-md-margin-inline-start));
3126
+ color: var(--text-color);
3127
+ }
3128
+ .DecorativeRadio-module__hop-DecorativeRadio___AlhGD {
3129
+ }
3130
+ .DecorativeRadio-module__hop-DecorativeRadio--sm___UnzCt {
3131
+ }
3132
+ .DecorativeRadio-module__hop-DecorativeRadio--md___wNI7X {
3133
+ }
3134
+ .DecorativeRadio-module__hop-DecorativeRadio__icon___PfsHi,
3135
+ .DecorativeRadio-module__hop-DecorativeRadio__icon-list___XQuSG {
3136
+ }
3137
+ .DecorativeRadio-module__hop-DecorativeRadio__box___Y-AnD {
3138
+ }
3139
+ .DecorativeRadio-module__hop-DecorativeRadio__bullet___sfqjq {
3140
+ }
3141
+ .DecorativeRadio-module__hop-DecorativeRadio__text___Z41w7 {
3142
+ }
3143
+
3144
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/radio/src/Radio.module.css/#css-module-data */
3145
+ .Radio-module__hop-Radio___eBueo {
3146
+ --hop-Radio-box-border-size: 0.0625rem;
3147
+ --hop-Radio-box-border-color: var(--hop-neutral-border);
3148
+ --hop-Radio-box-background-color: var(--hop-neutral-surface);
3149
+ --hop-Radio-box-outline-size: 0.125rem;
3150
+ --hop-Radio-box-outline-color: var(--hop-primary-border-focus);
3151
+ --hop-Radio-bullet-color: var(--hop-neutral-icon-selected);
3152
+ --hop-Radio-bullet-display: none;
3153
+ --hop-Radio-text-color: var(--hop-neutral-text);
3154
+ --hop-Radio-icon-color: var(--hop-neutral-icon);
3155
+ --hop-Radio-box-border-color-hovered: var(--hop-neutral-border-hover);
3156
+ --hop-Radio-box-background-color-hovered: var(--hop-neutral-surface-hover);
3157
+ --hop-Radio-text-color-hovered: var(--hop-neutral-text-hover);
3158
+ --hop-Radio-icon-color-hovered: var(--hop-neutral-icon-hover);
3159
+ --hop-Radio-box-border-color-pressed: var(--hop-neutral-border-press);
3160
+ --hop-Radio-box-background-color-pressed: var(--hop-neutral-surface-press);
3161
+ --hop-Radio-text-color-pressed: var(--hop-neutral-text-press);
3162
+ --hop-Radio-icon-color-pressed: var(--hop-neutral-icon-press);
3163
+ --hop-Radio-box-border-color-selected: var(--hop-neutral-border-selected);
3164
+ --hop-Radio-box-background-color-selected: var(--hop-neutral-surface-selected);
3165
+ --hop-Radio-bullet-display-selected: block;
3166
+ --hop-Radio-text-color-selected: var(--hop-neutral-text);
3167
+ --hop-Radio-icon-color-selected: var(--hop-neutral-icon);
3168
+ --hop-Radio-box-border-color-disabled: var(--hop-neutral-border-disabled);
3169
+ --hop-Radio-box-background-color-disabled: var(--hop-neutral-surface-disabled);
3170
+ --hop-Radio-bullet-color-disabled: var(--hop-neutral-icon-disabled);
3171
+ --hop-Radio-text-color-disabled: var(--hop-neutral-text-disabled);
3172
+ --hop-Radio-icon-color-disabled: var(--hop-neutral-icon-disabled);
3173
+ --hop-Radio-box-border-color-focused: var(--hop-neutral-border-hover);
3174
+ --hop-Radio-box-background-color-focused: var(--hop-neutral-surface-hover);
3175
+ --hop-Radio-text-color-focused: var(--hop-neutral-text);
3176
+ --hop-Radio-icon-color-focused: var(--hop-neutral-icon);
3177
+ --hop-Radio-box-border-color-invalid: var(--hop-danger-border-strong);
3178
+ --hop-Radio-box-background-color-invalid: var(--hop-neutral-surface);
3179
+ --hop-Radio-box-border-color-hovered-invalid: var(--hop-danger-border-strong);
3180
+ --hop-Radio-box-background-color-hovered-invalid: var(--hop-danger-surface);
3181
+ --hop-Radio-box-border-color-pressed-invalid: var(--hop-danger-border-press);
3182
+ --hop-Radio-box-background-color-pressed-invalid: var(--hop-danger-surface-weak);
3183
+ --hop-Radio-box-border-color-focused-invalid: var(--hop-danger-border-strong);
3184
+ --hop-Radio-box-background-color-focused-invalid: var(--hop-danger-surface);
3185
+ --hop-Radio-box-border-color-selected-invalid: var(--hop-danger-border-strong);
3186
+ --hop-Radio-box-background-color-selected-invalid: var(--hop-danger-surface-strong);
3187
+ --hop-Radio-bullet-color-invalid: var(--hop-danger-icon-strong);
3188
+ --hop-Radio-text-color-invalid: var(--hop-danger-text-weak);
3189
+ --hop-Radio-icon-color-invalid: var(--hop-danger-icon-weak);
3190
+ --hop-Radio-text-color-hovered-invalid: var(--hop-danger-text-weak-hover);
3191
+ --hop-Radio-icon-color-hovered-invalid: var(--hop-danger-icon-weak-hover);
3192
+ --hop-Radio-text-color-pressed-invalid: var(--hop-danger-text-weak-press);
3193
+ --hop-Radio-box-sm-inline-size: 1rem;
3194
+ --hop-Radio-box-sm-block-size: 1rem;
3195
+ --hop-Radio-text-sm-top-offset: calc((var(--box-inline-size) - (var(--hop-body-sm-line-height) * var(--hop-body-sm-font-size))) / 2);
3196
+ --hop-Radio-text-sm-margin-inline-start: calc(var(--hop-space-inline-sm) - var(--hop-space-inline-xs));
3197
+ --hop-Radio-box-md-inline-size: 1.5rem;
3198
+ --hop-Radio-box-md-block-size: 1.5rem;
3199
+ --hop-Radio-text-md-top-offset: calc((var(--box-inline-size) - (var(--hop-body-md-line-height) * var(--hop-body-md-font-size))) / 2);
3200
+ --hop-Radio-text-md-margin-inline-start: calc(var(--hop-space-inline-md) - var(--hop-space-inline-xs));
3201
+ --box-background-color: var(--hop-Radio-box-background-color);
3202
+ --box-border-color: var(--hop-Radio-box-border-color);
3203
+ --box-border-radius: var(--hop-shape-circle);
3204
+ --bullet-color: var(--hop-Radio-bullet-color);
3205
+ --bullet-display: var(--hop-Radio-bullet-display);
3206
+ --cursor: pointer;
3207
+ --text-color: var(--hop-Radio-text-color);
3208
+ --icon-color: var(--hop-Radio-icon-color);
3209
+ --transition-duration: var(--hop-easing-duration-2);
3210
+ cursor: var(--cursor);
3211
+ display: flex;
3212
+ column-gap: var(--hop-space-inline-xs);
3213
+ align-items: flex-start;
3214
+ justify-content: flex-start;
3215
+ box-sizing: border-box;
3216
+ inline-size: max-content;
3217
+ max-inline-size: 100%;
3218
+ }
3219
+ .Radio-module__hop-Radio___eBueo[data-focus-visible] {
3220
+ --box-background-color: var(--hop-Radio-box-background-color-focused);
3221
+ --box-border-color: var(--hop-Radio-box-border-color-focused);
3222
+ --box-outline: var(--hop-Radio-box-outline-size) solid var(--hop-Radio-box-outline-color);
3223
+ --text-color: var(--hop-Radio-text-color-focused);
3224
+ --icon-color: var(--hop-Radio-icon-color-focused);
3225
+ }
3226
+ .Radio-module__hop-Radio___eBueo[data-hovered] {
3227
+ --box-background-color: var(--hop-Radio-box-background-color-hovered);
3228
+ --box-border-color: var(--hop-Radio-box-border-color-hovered);
3229
+ --text-color: var(--hop-Radio-text-color-hovered);
3230
+ --icon-color: var(--hop-Radio-icon-color-hovered);
3231
+ }
3232
+ .Radio-module__hop-Radio___eBueo[data-pressed] {
3233
+ --box-background-color: var(--hop-Radio-box-background-color-pressed);
3234
+ --box-border-color: var(--hop-Radio-box-border-color-pressed);
3235
+ --text-color: var(--hop-Radio-text-color-pressed);
3236
+ --icon-color: var(--hop-Radio-icon-color-pressed);
3237
+ }
3238
+ .Radio-module__hop-Radio___eBueo[data-selected] {
3239
+ --box-background-color: var(--hop-Radio-box-background-color-selected);
3240
+ --box-border-color: var(--hop-Radio-box-border-color-selected);
3241
+ --bullet-display: var(--hop-Radio-bullet-display-selected);
3242
+ --text-color: var(--hop-Radio-text-color-selected);
3243
+ --icon-color: var(--hop-Radio-icon-color-selected);
3244
+ }
3245
+ .Radio-module__hop-Radio___eBueo[data-invalid] {
3246
+ --box-background-color: var(--hop-Radio-box-background-color-invalid);
3247
+ --box-border-color: var(--hop-Radio-box-border-color-invalid);
3248
+ --bullet-color: var(--hop-Radio-bullet-color-invalid);
3249
+ --text-color: var(--hop-Radio-text-color-invalid);
3250
+ --icon-color: var(--hop-Radio-icon-color-invalid);
3251
+ }
3252
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-focus-visible] {
3253
+ --box-background-color: var(--hop-Radio-box-background-color-focused-invalid);
3254
+ --box-border-color: var(--hop-Radio-box-border-color-focused-invalid);
3255
+ }
3256
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-hovered] {
3257
+ --box-background-color: var(--hop-Radio-box-background-color-hovered-invalid);
3258
+ --box-border-color: var(--hop-Radio-box-border-color-hovered-invalid);
3259
+ --text-color: var(--hop-Radio-text-color-hovered-invalid);
3260
+ --icon-color: var(--hop-Radio-text-color-hovered-invalid);
3261
+ }
3262
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-pressed] {
3263
+ --box-background-color: var(--hop-Radio-box-background-color-pressed-invalid);
3264
+ --box-border-color: var(--hop-Radio-box-border-color-pressed-invalid);
3265
+ --text-color: var(--hop-Radio-text-color-pressed-invalid);
3266
+ --icon-color: var(--hop-Radio-icon-color-pressed-invalid);
3267
+ }
3268
+ .Radio-module__hop-Radio___eBueo:where([data-invalid])[data-selected] {
3269
+ --box-background-color: var(--hop-Radio-box-background-color-selected-invalid);
3270
+ --box-border-color: var(--hop-Radio-box-border-color-selected-invalid);
3271
+ }
3272
+ .Radio-module__hop-Radio___eBueo[data-disabled] {
3273
+ --box-background-color: var(--hop-Radio-box-background-color-disabled);
3274
+ --box-border-color: var(--hop-Radio-box-border-color-disabled);
3275
+ --bullet-color: var(--hop-Radio-bullet-color-disabled);
3276
+ --cursor: not-allowed;
3277
+ --text-color: var(--hop-Radio-text-color-disabled);
3278
+ --icon-color: var(--hop-Radio-icon-color-disabled);
3279
+ }
3280
+ .Radio-module__hop-Radio--sm___GQdC5 {
3281
+ --box-inline-size: var(--hop-Radio-box-sm-inline-size);
3282
+ --box-block-size: var(--hop-Radio-box-sm-block-size);
3283
+ --text-top-offset: var(--hop-Radio-text-sm-top-offset);
3284
+ --text-margin-inline-start: var(--hop-Radio-text-sm-margin-inline-start);
3285
+ }
3286
+ .Radio-module__hop-Radio--md___63v-N {
3287
+ --box-inline-size: var(--hop-Radio-box-md-inline-size);
3288
+ --box-block-size: var(--hop-Radio-box-md-block-size);
3289
+ --text-top-offset: var(--hop-Radio-text-md-top-offset);
3290
+ --text-margin-inline-start: var(--hop-Radio-text-md-margin-inline-start);
3291
+ }
3292
+ .Radio-module__hop-Radio__icon___dVuoR,
3293
+ .Radio-module__hop-Radio__icon-list___LeQK7 {
3294
+ flex: 0 0 auto;
3295
+ order: 3;
3296
+ color: var(--icon-color);
3297
+ }
3298
+ .Radio-module__hop-Radio__box___6R1dw {
3299
+ display: flex;
3300
+ flex: 0 0 auto;
3301
+ align-items: center;
3302
+ justify-content: center;
3303
+ order: 1;
3304
+ box-sizing: border-box;
3305
+ inline-size: var(--box-inline-size, var(--hop-Radio-box-md-inline-size));
3306
+ block-size: var(--box-block-size, var(--hop-Radio-box-md-block-size));
3307
+ background-color: var(--box-background-color);
3308
+ border: var(--hop-Radio-box-border-size) solid var(--box-border-color);
3309
+ border-radius: var(--box-border-radius);
3310
+ outline: var(--box-outline, none);
3311
+ outline-offset: 0.125rem;
3312
+ transition: background-color var(--transition-duration) var(--hop-easing-productive), border var(--transition-duration) var(--hop-easing-productive);
3313
+ }
3314
+ .Radio-module__hop-Radio__bullet___gVfg- {
3315
+ display: var(--bullet-display);
3316
+ color: var(--bullet-color);
3317
+ }
3318
+ .Radio-module__hop-Radio__text___3WXI3 {
3319
+ flex: 0 1 auto;
3320
+ order: 2;
3321
+ min-inline-size: 0;
3322
+ margin-block-start: var(--text-top-offset, var(--hop-Radio-text-md-top-offset));
3323
+ margin-inline-start: var(--text-margin-inline-start, var(--hop-Radio-text-md-margin-inline-start));
3324
+ color: var(--text-color);
3325
+ }
3326
+
3327
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/radio/src/RadioField.module.css/#css-module-data */
3328
+ .RadioField-module__hop-RadioField___5B3-x {
3329
+ --hop-RadioField-description-color: var(--hop-neutral-text-weak);
3330
+ --hop-RadioField-description-color-disabled: var(--hop-neutral-text-disabled);
3331
+ --hop-RadioField-sm-row-gap: var(--hop-space-stack-xs);
3332
+ --hop-RadioField-radio-sm-inline-size: 1rem;
3333
+ --hop-RadioField-description-sm-margin-inline-start: calc(var(--hop-RadioField-radio-sm-inline-size) + var(--hop-space-inline-sm));
3334
+ --hop-RadioField-md-row-gap: var(--hop-space-stack-xs);
3335
+ --hop-RadioField-radio-md-inline-size: 1.5rem;
3336
+ --hop-RadioField-description-md-margin-inline-start: calc(var(--hop-RadioField-radio-md-inline-size) + var(--hop-space-inline-md));
3337
+ --description-color: var(--hop-RadioField-description-color);
3338
+ display: flex;
3339
+ flex-direction: column;
3340
+ row-gap: var(--row-gap, var(--hop-space-stack-sm));
3341
+ align-items: flex-start;
3342
+ justify-content: flex-start;
3343
+ box-sizing: border-box;
3344
+ inline-size: max-content;
3345
+ max-inline-size: 100%;
3346
+ }
3347
+ .RadioField-module__hop-RadioField___5B3-x[data-disabled] {
3348
+ --description-color: var(--hop-RadioField-description-color-disabled);
3349
+ }
3350
+ .RadioField-module__hop-RadioField--sm___a9--Z {
3351
+ --row-gap: var(--hop-RadioField-sm-row-gap);
3352
+ --description-margin-inline-start: var(--hop-RadioField-description-sm-margin-inline-start);
3353
+ }
3354
+ .RadioField-module__hop-RadioField--md___M1tBj {
3355
+ --row-gap: var(--hop-RadioField-md-row-gap);
3356
+ --description-margin-inline-start: var(--hop-RadioField-description-md-margin-inline-start);
3357
+ }
3358
+ .RadioField-module__hop-RadioField__description___avVpF {
3359
+ order: 2;
3360
+ margin-inline-start: var(--description-margin-inline-start, var(--hop-RadioField-description-md-margin-inline-start));
3361
+ color: var(--description-color);
3362
+ }
3363
+ .RadioField-module__hop-RadioField__radio___-qcpe {
3364
+ order: 1;
3365
+ }
3366
+
3367
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/radio/src/RadioGroup.module.css/#css-module-data */
3368
+ .RadioGroup-module__hop-RadioGroup___jUNVM {
3369
+ --hop-RadioGroup-align-items: flex-start;
3370
+ --hop-RadioGroup-justify-content: flex-start;
3371
+ --hop-RadioGroup-bordered-border-color: var(--hop-neutral-border-weak);
3372
+ --hop-RadioGroup-sm-column-gap: var(--hop-space-inline-sm);
3373
+ --hop-RadioGroup-sm-row-gap: var(--hop-space-stack-sm);
3374
+ --hop-RadioGroup-list-sm-column-gap: var(--hop-space-inline-sm);
3375
+ --hop-RadioGroup-list-sm-row-gap: var(--hop-space-stack-sm);
3376
+ --hop-RadioGroup-bordered-sm-padding: var(--hop-space-inset-sm);
3377
+ --hop-RadioGroup-bordered-sm-column-gap: var(--hop-space-inline-sm);
3378
+ --hop-RadioGroup-bordered-sm-row-gap: var(--hop-space-stack-sm);
3379
+ --hop-RadioGroup-list-bordered-sm-column-gap: 0;
3380
+ --hop-RadioGroup-list-bordered-sm-row-gap: 0;
3381
+ --hop-RadioGroup-md-column-gap: var(--hop-space-inline-md);
3382
+ --hop-RadioGroup-md-row-gap: var(--hop-space-stack-md);
3383
+ --hop-RadioGroup-list-md-column-gap: var(--hop-space-inline-md);
3384
+ --hop-RadioGroup-list-md-row-gap: var(--hop-space-stack-md);
3385
+ --hop-RadioGroup-bordered-md-padding: var(--hop-space-inset-md);
3386
+ --hop-RadioGroup-bordered-md-column-gap: var(--hop-space-inline-sm);
3387
+ --hop-RadioGroup-bordered-md-row-gap: var(--hop-space-stack-sm);
3388
+ --hop-RadioGroup-list-bordered-md-column-gap: 0;
3389
+ --hop-RadioGroup-list-bordered-md-row-gap: 0;
3390
+ --hop-RadioGroup-vertical-flex-direction: column;
3391
+ --hop-RadioGroup-horizontal-flex-direction: row;
3392
+ --radio-border-size: 0.0625rem;
3393
+ --radio-border-color: var(--hop-neutral-border-weak);
3394
+ --flex-direction: var(--hop-RadioGroup-vertical-flex-direction);
3395
+ --align-items: var(--hop-RadioGroup-align-items);
3396
+ --justify-content: var(--hop-RadioGroup-justify-content);
3397
+ --flex-wrap: wrap;
3398
+ --inline-size: max-content;
3399
+ display: flex;
3400
+ flex-direction: column;
3401
+ gap: var(--row-gap, var(--hop-space-stack-md)) var(--column-gap, var(--hop-space-inline-md));
3402
+ align-items: var(--align-items);
3403
+ justify-content: var(--justify-content);
3404
+ box-sizing: border-box;
3405
+ inline-size: var(--inline-size);
3406
+ max-inline-size: 100%;
3407
+ }
3408
+ .RadioGroup-module__hop-RadioGroup--bordered___KsRS9 {
3409
+ --list-border: var(--radio-border-size) solid var(--radio-border-color);
3410
+ --list-border-radius: var(--hop-shape-rounded-md);
3411
+ }
3412
+ .RadioGroup-module__hop-RadioGroup--sm___gJd9p {
3413
+ --column-gap: var(--hop-RadioGroup-sm-column-gap);
3414
+ --row-gap: var(--hop-RadioGroup-sm-row-gap);
3415
+ --list-column-gap: var(--hop-RadioGroup-list-sm-column-gap);
3416
+ --list-row-gap: var(--hop-RadioGroup-list-sm-row-gap);
3417
+ }
3418
+ .RadioGroup-module__hop-RadioGroup--md___bbLe6 {
3419
+ --column-gap: var(--hop-RadioGroup-md-column-gap);
3420
+ --row-gap: var(--hop-RadioGroup-md-row-gap);
3421
+ --list-column-gap: var(--hop-RadioGroup-list-md-column-gap);
3422
+ --list-row-gap: var(--hop-RadioGroup-list-md-row-gap);
3423
+ }
3424
+ .RadioGroup-module__hop-RadioGroup--bordered___KsRS9.RadioGroup-module__hop-RadioGroup--sm___gJd9p {
3425
+ --radio-padding: var(--hop-RadioGroup-bordered-sm-padding);
3426
+ --column-gap: var(--hop-RadioGroup-bordered-sm-column-gap);
3427
+ --row-gap: var(--hop-RadioGroup-bordered-sm-row-gap);
3428
+ --list-column-gap: var(--hop-RadioGroup-list-bordered-sm-column-gap);
3429
+ --list-row-gap: var(--hop-RadioGroup-list-bordered-sm-row-gap);
3430
+ }
3431
+ .RadioGroup-module__hop-RadioGroup--bordered___KsRS9.RadioGroup-module__hop-RadioGroup--md___bbLe6 {
3432
+ --radio-padding: var(--hop-RadioGroup-bordered-md-padding);
3433
+ --column-gap: var(--hop-RadioGroup-bordered-md-column-gap);
3434
+ --row-gap: var(--hop-RadioGroup-bordered-md-row-gap);
3435
+ --list-column-gap: var(--hop-RadioGroup-list-bordered-md-column-gap);
3436
+ --list-row-gap: var(--hop-RadioGroup-list-bordered-md-row-gap);
3437
+ }
3438
+ .RadioGroup-module__hop-RadioGroup___jUNVM[data-orientation=horizontal] {
3439
+ --flex-direction: var(--hop-RadioGroup-horizontal-flex-direction);
3440
+ }
3441
+ .RadioGroup-module__hop-RadioGroup--bordered___KsRS9[data-orientation=horizontal] {
3442
+ --flex-wrap: nowrap;
3443
+ }
3444
+ .RadioGroup-module__hop-RadioGroup___jUNVM > .RadioGroup-module__hop-RadioGroup__label___WRzhE {
3445
+ order: 1;
3446
+ }
3447
+ .RadioGroup-module__hop-RadioGroup__list___gHNAr {
3448
+ display: flex;
3449
+ flex-flow: var(--flex-direction) var(--flex-wrap);
3450
+ gap: var(--list-row-gap, var(--hop-space-stack-md)) var(--list-column-gap, var(--hop-space-inline-md));
3451
+ order: 2;
3452
+ box-sizing: border-box;
3453
+ inline-size: var(--inline-size);
3454
+ max-inline-size: 100%;
3455
+ border: var(--list-border, none);
3456
+ border-radius: var(--list-border-radius, 0);
3457
+ }
3458
+ .RadioGroup-module__hop-RadioGroup__list___gHNAr > .RadioGroup-module__hop-RadioGroup__radio___O7ylN {
3459
+ position: relative;
3460
+ flex: 0 1 auto;
3461
+ align-content: start;
3462
+ inline-size: auto;
3463
+ min-inline-size: 0;
3464
+ padding: var(--radio-padding, 0);
3465
+ }
3466
+ .RadioGroup-module__hop-RadioGroup--bordered___KsRS9 .RadioGroup-module__hop-RadioGroup__list___gHNAr > .RadioGroup-module__hop-RadioGroup__radio___O7ylN ~ .RadioGroup-module__hop-RadioGroup__radio___O7ylN::before {
3467
+ content: "";
3468
+ position: absolute;
3469
+ display: block;
3470
+ }
3471
+ .RadioGroup-module__hop-RadioGroup--bordered___KsRS9[data-orientation=vertical] .RadioGroup-module__hop-RadioGroup__list___gHNAr > .RadioGroup-module__hop-RadioGroup__radio___O7ylN ~ .RadioGroup-module__hop-RadioGroup__radio___O7ylN::before {
3472
+ inset-block-start: 0;
3473
+ inset-inline: 0;
3474
+ border-block-start: var(--list-border, none);
3475
+ }
3476
+ .RadioGroup-module__hop-RadioGroup--bordered___KsRS9[data-orientation=horizontal] .RadioGroup-module__hop-RadioGroup__list___gHNAr > .RadioGroup-module__hop-RadioGroup__radio___O7ylN ~ .RadioGroup-module__hop-RadioGroup__radio___O7ylN::before {
3477
+ inset-block: 0;
3478
+ inset-inline-start: 0;
3479
+ border-inline-start: var(--list-border, none);
3480
+ }
3481
+ .RadioGroup-module__hop-RadioGroup___jUNVM > .RadioGroup-module__hop-RadioGroup__error-message___pZTcf,
3482
+ .RadioGroup-module__hop-RadioGroup___jUNVM > .RadioGroup-module__hop-RadioGroup__helper-message___E-UDa {
3483
+ order: 3;
3484
+ }
3485
+
3486
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/list-box/src/ListBoxItemSkeleton.module.css/#css-module-data */
3487
+ .ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton___BeAQ5 {
3488
+ --hop-ListBoxItemSkeleton-background-color: var(--hop-neutral-surface-weak);
3489
+ --hop-ListBoxItemSkeleton-background-color-dark: var(--hop-neutral-surface-weak-hover);
3490
+ --hop-ListBoxItemSkeleton-border-radius: var(--hop-shape-rounded-md);
3491
+ --hop-ListBoxItemSkeleton-animation-duration: 1.4s;
3492
+ --hop-ListBoxItemSkeleton-animation-reduced-motion-duration: 3.4s;
3493
+ --hop-ListBoxItemSkeleton-linear-gradient:
3494
+ linear-gradient(
3495
+
3496
+ 90deg,
3497
+ var(--hop-ListBoxItemSkeleton-background-color) 25%,
3498
+ var(--hop-ListBoxItemSkeleton-background-color-dark) 37%,
3499
+ var(--hop-ListBoxItemSkeleton-background-color-dark) 63%,
3500
+ var(--hop-ListBoxItemSkeleton-background-color) 100% );
3501
+ --hop-ListBoxItemSkeleton-xs-height: 1.25rem;
3502
+ --hop-ListBoxItemSkeleton-sm-height: 1.25rem;
3503
+ --hop-ListBoxItemSkeleton-md-height: 1.25rem;
3504
+ --hop-ListBoxItemSkeleton-lg-height: 1.5rem;
3505
+ --animation-duration: var(--hop-ListBoxItemSkeleton-animation-duration);
3506
+ grid-area: label;
3507
+ box-sizing: border-box;
3508
+ block-size: var(--height);
3509
+ background-color: var(--hop-ListBoxItemSkeleton-background-color);
3510
+ background-image: var(--hop-ListBoxItemSkeleton-linear-gradient);
3511
+ background-size: 400% 100%;
3512
+ border-radius: var(--hop-ListBoxItemSkeleton-border-radius);
3513
+ animation-name: ListBoxItemSkeleton-module__placeholder-shimmer___X1dmW;
3514
+ animation-duration: var(--animation-duration);
3515
+ animation-timing-function: ease-in-out;
3516
+ animation-fill-mode: forwards;
3517
+ animation-iteration-count: infinite;
3518
+ @media (prefers-reduced-motion: reduce) {
3519
+ --animation-duration: var(--hop-ListBoxItemSkeleton-animation-reduced-motion-duration);
3520
+ }
3521
+ }
3522
+ .ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--xs___LUDsc {
3523
+ --height: var(--hop-ListBoxItemSkeleton-xs-height);
3524
+ }
3525
+ .ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--sm___ujK2H {
3526
+ --height: var(--hop-ListBoxItemSkeleton-sm-height);
3527
+ }
3528
+ .ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--md___H-YEh {
3529
+ --height: var(--hop-ListBoxItemSkeleton-md-height);
3530
+ }
3531
+ .ListBoxItemSkeleton-module__hop-ListBoxItemSkeleton--lg___rEkJI {
3532
+ --height: var(--hop-ListBoxItemSkeleton-lg-height);
3533
+ }
3534
+ @keyframes ListBoxItemSkeleton-module__placeholder-shimmer___X1dmW {
3535
+ 0% {
3536
+ background-position: 125% 50%;
3537
+ }
3538
+ 100% {
3539
+ background-position: -25% 50%;
3540
+ }
3541
+ }
3542
+
3543
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/list-box/src/ListBoxItem.module.css/#css-module-data */
3544
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW {
3545
+ --hop-ListBoxItem-background-color: transparent;
3546
+ --hop-ListBoxItem-border-radius: var(--hop-shape-rounded-md);
3547
+ --hop-ListBoxItem-text-color: var(--hop-neutral-text);
3548
+ --hop-ListBoxItem-icon-color: var(--hop-neutral-icon);
3549
+ --hop-ListBoxItem-outline-size: 0.125rem;
3550
+ --hop-ListBoxItem-outline-color: var(--hop-primary-border-focus);
3551
+ --hop-ListBoxItem-row-gap: var(--hop-space-stack-xs);
3552
+ --hop-ListBoxItem-column-gap: var(--hop-space-inline-sm);
3553
+ --hop-ListBoxItem-indicator-inline-size: calc( 1rem + var(--hop-ListBoxItem-column-gap));
3554
+ --hop-ListBoxItem-description-text-color: var(--hop-neutral-text-weak);
3555
+ --hop-ListBoxItem-grid-template-areas: "indicator avatar icon label end-icon badge";
3556
+ --hop-ListBoxItem-grid-template-areas-with-description: "indicator avatar icon label end-icon badge" ". . . description description description";
3557
+ --hop-ListBoxItem-grid-template-areas-loading: "label";
3558
+ --hop-ListBoxItem-grid-template-columns: var(--hop-ListBoxItem-indicator-inline-size) auto auto 1fr auto auto;
3559
+ --hop-ListBoxItem-grid-template-columns-not-selected: 0 auto auto 1fr auto auto;
3560
+ --hop-ListBoxItem-grid-template-columns-loading: 1fr;
3561
+ --hop-ListBoxItem-badge-margin-block: calc(-1 * (var(--hop-space-stack-xs) / 2));
3562
+ --hop-ListBoxItem-xs-padding-block: var(--hop-space-inset-xs);
3563
+ --hop-ListBoxItem-xs-padding-inline: var(--hop-space-inset-md);
3564
+ --hop-ListBoxItem-xs-min-height: 2rem;
3565
+ --hop-ListBoxItem-xs-avatar-margin-block: 0;
3566
+ --hop-ListBoxItem-xs-label-font-weight: var(--hop-body-sm-font-weight);
3567
+ --hop-ListBoxItem-xs-label-font-weight-selected: var(--hop-body-sm-medium-font-weight);
3568
+ --hop-ListBoxItem-sm-padding-block: var(--hop-space-inset-sm);
3569
+ --hop-ListBoxItem-sm-padding-inline: var(--hop-space-inset-md);
3570
+ --hop-ListBoxItem-sm-min-height: 2.5rem;
3571
+ --hop-ListBoxItem-sm-avatar-margin-block: 0;
3572
+ --hop-ListBoxItem-sm-label-font-weight: var(--hop-body-sm-font-weight);
3573
+ --hop-ListBoxItem-sm-label-font-weight-selected: var(--hop-body-sm-medium-font-weight);
3574
+ --hop-ListBoxItem-md-padding-block: var(--hop-space-inset-md);
3575
+ --hop-ListBoxItem-md-padding-inline: var(--hop-space-inset-md);
3576
+ --hop-ListBoxItem-md-min-height: 3.5rem;
3577
+ --hop-ListBoxItem-md-avatar-margin-block: calc(-1 * var(--hop-space-stack-xs));
3578
+ --hop-ListBoxItem-md-label-font-weight: var(--hop-body-sm-font-weight);
3579
+ --hop-ListBoxItem-md-label-font-weight-selected: var(--hop-body-sm-medium-font-weight);
3580
+ --hop-ListBoxItem-lg-padding-block: var(--hop-space-inset-md);
3581
+ --hop-ListBoxItem-lg-padding-inline: var(--hop-space-inset-md);
3582
+ --hop-ListBoxItem-lg-min-height: 4rem;
3583
+ --hop-ListBoxItem-lg-avatar-margin-block: calc(-1 * var(--hop-space-stack-xs));
3584
+ --hop-ListBoxItem-lg-label-font-weight: var(--hop-body-md-font-weight);
3585
+ --hop-ListBoxItem-lg-label-font-weight-selected: var(--hop-body-md-medium-font-weight);
3586
+ --hop-ListBoxItem-background-color-hovered: var(--hop-neutral-surface-hover);
3587
+ --hop-ListBoxItem-text-color-hovered: var(--hop-neutral-text-hover);
3588
+ --hop-ListBoxItem-icon-color-hovered: var(--hop-neutral-icon-hover);
3589
+ --hop-ListBoxItem-background-color-pressed: var(--hop-neutral-surface-press);
3590
+ --hop-ListBoxItem-text-color-pressed: var(--hop-neutral-text-press);
3591
+ --hop-ListBoxItem-icon-color-pressed: var(--hop-neutral-icon-press);
3592
+ --hop-ListBoxItem-background-color-focused: var(--hop-neutral-surface-hover);
3593
+ --hop-ListBoxItem-text-color-focused: var(--hop-neutral-text-hover);
3594
+ --hop-ListBoxItem-icon-color-focused: var(--hop-neutral-icon-hover);
3595
+ --hop-ListBoxItem-background-color-selected: transparent;
3596
+ --hop-ListBoxItem-text-color-selected: var(--hop-neutral-text);
3597
+ --hop-ListBoxItem-icon-color-selected: var(--hop-neutral-icon);
3598
+ --hop-ListBoxItem-background-color-invalid: transparent;
3599
+ --hop-ListBoxItem-background-color-invalid-hovered: var(--hop-danger-surface-hover);
3600
+ --hop-ListBoxItem-background-color-invalid-pressed: var(--hop-danger-surface-press);
3601
+ --hop-ListBoxItem-background-color-invalid-focused: var(--hop-danger-surface-hover);
3602
+ --hop-ListBoxItem-background-color-invalid-selected: transparent;
3603
+ --hop-ListBoxItem-background-color-invalid-disabled: transparent;
3604
+ --hop-ListBoxItem-text-color-invalid: var(--hop-danger-text-weak);
3605
+ --hop-ListBoxItem-text-color-invalid-hovered: var(--hop-danger-text-strong);
3606
+ --hop-ListBoxItem-text-color-invalid-pressed: var(--hop-danger-text-strong);
3607
+ --hop-ListBoxItem-text-color-invalid-focused: var(--hop-danger-text-strong);
3608
+ --hop-ListBoxItem-text-color-invalid-selected: var(--hop-danger-text-weak);
3609
+ --hop-ListBoxItem-text-color-invalid-disabled: var(--hop-danger-text-disabled);
3610
+ --hop-ListBoxItem-icon-color-invalid: var(--hop-danger-icon-weak);
3611
+ --hop-ListBoxItem-icon-color-invalid-hovered: var(--hop-danger-icon-strong);
3612
+ --hop-ListBoxItem-icon-color-invalid-pressed: var(--hop-danger-icon-strong);
3613
+ --hop-ListBoxItem-icon-color-invalid-focused: var(--hop-danger-icon-strong);
3614
+ --hop-ListBoxItem-icon-color-invalid-selected: var(--hop-danger-icon-weak);
3615
+ --hop-ListBoxItem-icon-color-invalid-disabled: var(--hop-danger-icon-disabled);
3616
+ --hop-ListBoxItem-description-text-color-invalid-hovered: inherit;
3617
+ --hop-ListBoxItem-description-text-color-invalid-pressed: inherit;
3618
+ --hop-ListBoxItem-description-text-color-invalid-focused: inherit;
3619
+ --hop-ListBoxItem-background-color-disabled: transparent;
3620
+ --hop-ListBoxItem-text-color-disabled: var(--hop-neutral-text-disabled);
3621
+ --hop-ListBoxItem-icon-color-disabled: var(--hop-neutral-icon-disabled);
3622
+ --background-color: var(--hop-ListBoxItem-background-color);
3623
+ --text-color: var(--hop-ListBoxItem-text-color);
3624
+ --icon-color: var(--hop-ListBoxItem-icon-color);
3625
+ --outline: none;
3626
+ --cursor: default;
3627
+ --checkmark-opacity: 0;
3628
+ --description-text-color: var(--hop-ListBoxItem-description-text-color);
3629
+ --row-gap: 0;
3630
+ --grid-template-areas: var(--hop-ListBoxItem-grid-template-areas);
3631
+ --grid-template-columns: var(--hop-ListBoxItem-grid-template-columns);
3632
+ --checkmark-transition: opacity 0.2s ease-in-out .2s;
3633
+ cursor: var(--cursor);
3634
+ box-sizing: border-box;
3635
+ color: var(--text-color);
3636
+ background-color: var(--background-color);
3637
+ border-radius: var(--hop-ListBoxItem-border-radius);
3638
+ outline: var(--outline);
3639
+ outline-offset: calc(-1 * var(--hop-ListBoxItem-outline-size));
3640
+ }
3641
+ .ListBoxItem-module__hop-ListBoxItem--xs___Ru2z- {
3642
+ --padding-block: var(--hop-ListBoxItem-xs-padding-block);
3643
+ --padding-inline: var(--hop-ListBoxItem-xs-padding-inline);
3644
+ --min-height: var(--hop-ListBoxItem-xs-min-height);
3645
+ --avatar-margin-block: var(--hop-ListBoxItem-xs-avatar-margin-block);
3646
+ --label-font-weight: var(--hop-ListBoxItem-xs-label-font-weight);
3647
+ }
3648
+ .ListBoxItem-module__hop-ListBoxItem--sm___BC5Bl {
3649
+ --padding-block: var(--hop-ListBoxItem-sm-padding-block);
3650
+ --padding-inline: var(--hop-ListBoxItem-sm-padding-inline);
3651
+ --min-height: var(--hop-ListBoxItem-sm-min-height);
3652
+ --avatar-margin-block: var(--hop-ListBoxItem-sm-avatar-margin-block);
3653
+ --label-font-weight: var(--hop-ListBoxItem-sm-label-font-weight);
3654
+ }
3655
+ .ListBoxItem-module__hop-ListBoxItem--md___nmSsR {
3656
+ --padding-block: var(--hop-ListBoxItem-md-padding-block);
3657
+ --padding-inline: var(--hop-ListBoxItem-md-padding-inline);
3658
+ --min-height: var(--hop-ListBoxItem-md-min-height);
3659
+ --avatar-margin-block: var(--hop-ListBoxItem-md-avatar-margin-block);
3660
+ --label-font-weight: var(--hop-ListBoxItem-md-label-font-weight);
3661
+ }
3662
+ .ListBoxItem-module__hop-ListBoxItem--lg___8bSG1 {
3663
+ --padding-block: var(--hop-ListBoxItem-lg-padding-block);
3664
+ --padding-inline: var(--hop-ListBoxItem-lg-padding-inline);
3665
+ --min-height: var(--hop-ListBoxItem-lg-min-height);
3666
+ --avatar-margin-block: var(--hop-ListBoxItem-lg-avatar-margin-block);
3667
+ --label-font-weight: var(--hop-ListBoxItem-lg-label-font-weight);
3668
+ }
3669
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-selection-mode] {
3670
+ --cursor: pointer;
3671
+ }
3672
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW:not([data-selection-mode]) {
3673
+ --grid-template-columns: var(--hop-ListBoxItem-grid-template-columns-not-selected);
3674
+ }
3675
+ .ListBoxItem-module__hop-ListBoxItem__inner___QYxKD:not([data-list-has-selection]):has(.ListBoxItem-module__hop-ListBoxItem__checkmark___AavY1) {
3676
+ --grid-template-columns: var(--hop-ListBoxItem-grid-template-columns-not-selected);
3677
+ }
3678
+ .ListBoxItem-module__hop-ListBoxItem__inner___QYxKD[data-list-has-selection-end]:has(.ListBoxItem-module__hop-ListBoxItem__checkmark___AavY1) {
3679
+ --checkmark-transition: none;
3680
+ }
3681
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-selected] {
3682
+ --background-color: var(--hop-ListBoxItem-background-color-selected);
3683
+ --text-color: var(--hop-ListBoxItem-text-color-selected);
3684
+ --icon-color: var(--hop-ListBoxItem-icon-color-selected);
3685
+ --checkmark-opacity: 1;
3686
+ }
3687
+ .ListBoxItem-module__hop-ListBoxItem--xs___Ru2z-[data-selected] {
3688
+ --label-font-weight: var(--hop-ListBoxItem-xs-label-font-weight-selected);
3689
+ }
3690
+ .ListBoxItem-module__hop-ListBoxItem--sm___BC5Bl[data-selected] {
3691
+ --label-font-weight: var(--hop-ListBoxItem-sm-label-font-weight-selected);
3692
+ }
3693
+ .ListBoxItem-module__hop-ListBoxItem--md___nmSsR[data-selected] {
3694
+ --label-font-weight: var(--hop-ListBoxItem-md-label-font-weight-selected);
3695
+ }
3696
+ .ListBoxItem-module__hop-ListBoxItem--lg___8bSG1[data-selected] {
3697
+ --label-font-weight: var(--hop-ListBoxItem-lg-label-font-weight-selected);
3698
+ }
3699
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-focus-visible] {
3700
+ --background-color: var(--hop-ListBoxItem-background-color-focused);
3701
+ --text-color: var(--hop-ListBoxItem-text-color-focused);
3702
+ --icon-color: var(--hop-ListBoxItem-icon-color-focused);
3703
+ --outline: var(--hop-ListBoxItem-outline-size) solid var(--hop-ListBoxItem-outline-color);
3704
+ }
3705
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-hovered] {
3706
+ --background-color: var(--hop-ListBoxItem-background-color-hovered);
3707
+ --text-color: var(--hop-ListBoxItem-text-color-hovered);
3708
+ --icon-color: var(--hop-ListBoxItem-icon-color-hovered);
3709
+ }
3710
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-pressed] {
3711
+ --background-color: var(--hop-ListBoxItem-background-color-pressed);
3712
+ --text-color: var(--hop-ListBoxItem-text-color-pressed);
3713
+ --icon-color: var(--hop-ListBoxItem-icon-color-pressed);
3714
+ }
3715
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-disabled] {
3716
+ --background-color: var(--hop-ListBoxItem-background-color-disabled);
3717
+ --text-color: var(--hop-ListBoxItem-text-color-disabled);
3718
+ --icon-color: var(--hop-ListBoxItem-icon-color-disabled);
3719
+ --description-text-color: var(--hop-ListBoxItem-text-color-disabled);
3720
+ --cursor: not-allowed;
3721
+ }
3722
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-invalid] {
3723
+ --background-color: var(--hop-ListBoxItem-background-color-invalid);
3724
+ --text-color: var(--hop-ListBoxItem-text-color-invalid);
3725
+ --icon-color: var(--hop-ListBoxItem-icon-color-invalid);
3726
+ }
3727
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-invalid][data-selected] {
3728
+ --background-color: var(--hop-ListBoxItem-background-color-invalid-selected);
3729
+ --text-color: var(--hop-ListBoxItem-text-color-invalid-selected);
3730
+ --icon-color: var(--hop-ListBoxItem-icon-color-invalid-selected);
3731
+ }
3732
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-invalid][data-focus-visible] {
3733
+ --background-color: var(--hop-ListBoxItem-background-color-invalid-focused);
3734
+ --text-color: var(--hop-ListBoxItem-text-color-invalid-focused);
3735
+ --icon-color: var(--hop-ListBoxItem-icon-color-invalid-focused);
3736
+ --description-text-color: var(--hop-ListBoxItem-description-text-color-invalid-focused);
3737
+ }
3738
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-invalid][data-hovered] {
3739
+ --background-color: var(--hop-ListBoxItem-background-color-invalid-hovered);
3740
+ --text-color: var(--hop-ListBoxItem-text-color-invalid-hovered);
3741
+ --icon-color: var(--hop-ListBoxItem-icon-color-invalid-hovered);
3742
+ --description-text-color: var(--hop-ListBoxItem-description-text-color-invalid-hovered);
3743
+ }
3744
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-invalid][data-pressed] {
3745
+ --background-color: var(--hop-ListBoxItem-background-color-invalid-pressed);
3746
+ --text-color: var(--hop-ListBoxItem-text-color-invalid-pressed);
3747
+ --icon-color: var(--hop-ListBoxItem-icon-color-invalid-pressed);
3748
+ --description-text-color: var(--hop-ListBoxItem-description-text-color-invalid-pressed);
3749
+ }
3750
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-invalid][data-disabled] {
3751
+ --background-color: var(--hop-ListBoxItem-background-color-invalid-disabled);
3752
+ --text-color: var(--hop-ListBoxItem-text-color-invalid-disabled);
3753
+ --icon-color: var(--hop-ListBoxItem-icon-color-invalid-disabled);
3754
+ }
3755
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW:has(.ListBoxItem-module__hop-ListBoxItem__description___liI0G) {
3756
+ --row-gap: var(--hop-ListBoxItem-row-gap);
3757
+ --grid-template-areas: var(--hop-ListBoxItem-grid-template-areas-with-description);
3758
+ }
3759
+ .ListBoxItem-module__hop-ListBoxItem___w4UBW[data-loading] {
3760
+ --grid-template-areas: var(--hop-ListBoxItem-grid-template-areas-loading);
3761
+ --grid-template-columns: var(--hop-ListBoxItem-grid-template-columns-loading);
3762
+ }
3763
+ .ListBoxItem-module__hop-ListBoxItem__inner___QYxKD {
3764
+ display: grid;
3765
+ grid-template-areas: var(--grid-template-areas);
3766
+ grid-template-columns: var(--grid-template-columns);
3767
+ row-gap: var(--row-gap);
3768
+ align-items: center;
3769
+ box-sizing: border-box;
3770
+ min-block-size: var(--min-height);
3771
+ padding-block: var(--padding-block);
3772
+ padding-inline: var(--padding-inline);
3773
+ transition: grid-template-columns .3s ease-in-out;
3774
+ }
3775
+ .ListBoxItem-module__hop-ListBoxItem__checkmark___AavY1 {
3776
+ grid-area: indicator;
3777
+ margin-inline-end: var(--hop-ListBoxItem-column-gap);
3778
+ color: var(--icon-color);
3779
+ opacity: var(--checkmark-opacity);
3780
+ transition: var(--checkmark-transition);
3781
+ }
3782
+ .ListBoxItem-module__hop-ListBoxItem__radio___0BXKg,
3783
+ .ListBoxItem-module__hop-ListBoxItem__checkbox___YHKfh {
3784
+ pointer-events: none;
3785
+ user-select: none;
3786
+ grid-area: indicator;
3787
+ margin-inline-end: var(--hop-ListBoxItem-column-gap);
3788
+ }
3789
+ .ListBoxItem-module__hop-ListBoxItem__avatar___OH9G7 {
3790
+ grid-area: avatar;
3791
+ margin-block: var(--avatar-margin-block, 0);
3792
+ margin-inline-end: var(--hop-ListBoxItem-column-gap);
3793
+ }
3794
+ .ListBoxItem-module__hop-ListBoxItem__icon-list___c0Mg1,
3795
+ .ListBoxItem-module__hop-ListBoxItem__icon___-Au8H {
3796
+ grid-area: icon;
3797
+ flex: 0 0 auto;
3798
+ margin-inline-end: var(--hop-ListBoxItem-column-gap);
3799
+ color: var(--icon-color);
3800
+ }
3801
+ .ListBoxItem-module__hop-ListBoxItem__label___6ltHn {
3802
+ overflow: hidden;
3803
+ grid-area: label;
3804
+ min-inline-size: 0;
3805
+ font-weight: var(--label-font-weight);
3806
+ text-overflow: ellipsis;
3807
+ white-space: nowrap;
3808
+ }
3809
+ .ListBoxItem-module__hop-ListBoxItem__end-icon-list___wWwI1,
3810
+ .ListBoxItem-module__hop-ListBoxItem__end-icon___kDNVb {
3811
+ grid-area: end-icon;
3812
+ margin-inline-start: var(--hop-ListBoxItem-column-gap);
3813
+ color: var(--icon-color);
3814
+ }
3815
+ .ListBoxItem-module__hop-ListBoxItem__badge___9WZlM {
3816
+ grid-area: badge;
3817
+ margin-block: var(--hop-ListBoxItem-badge-margin-block);
3818
+ margin-inline-start: var(--hop-ListBoxItem-column-gap);
3819
+ }
3820
+ .ListBoxItem-module__hop-ListBoxItem__description___liI0G {
3821
+ overflow: hidden;
3822
+ display: -webkit-box;
3823
+ grid-area: description;
3824
+ -webkit-box-orient: vertical;
3825
+ -webkit-line-clamp: 2;
3826
+ line-clamp: 2;
3827
+ color: var(--description-text-color);
3828
+ }
3829
+
3830
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/list-box/src/ListBox.module.css/#css-module-data */
3831
+ .ListBox-module__hop-ListBox___AbTVV {
3832
+ --hop-ListBox-background-color: var(--hop-neutral-surface);
3833
+ --hop-ListBox-border-color: var(--hop-neutral-border-weak);
3834
+ --hop-ListBox-border-radius: var(--hop-shape-rounded-md);
3835
+ --hop-ListBox-border-size: 0.0625rem;
3836
+ --hop-ListBox-padding-inline: var(--hop-space-inset-sm);
3837
+ --hop-ListBox-padding-block: var(--hop-space-inset-sm);
3838
+ --hop-ListBox-min-width: 13.625rem;
3839
+ --hop-ListBox-max-width: 18rem;
3840
+ --hop-ListBox-width: max-content;
3841
+ --hop-ListBox-fluid-width: 100%;
3842
+ --hop-ListBox-fluid-max-width: 100%;
3843
+ --hop-ListBox-section-padding-block: var(--hop-ListBox-padding-block);
3844
+ --hop-ListBox-section-padding-inline: var(--hop-ListBox-padding-inline);
3845
+ --hop-ListBox-section-margin-block: var(--hop-space-stack-sm);
3846
+ --hop-ListBox-section-margin-inline: calc(-1 * var(--hop-ListBox-padding-inline));
3847
+ --hop-ListBox-section-border-size: var(--hop-ListBox-border-size);
3848
+ --hop-ListBox-section-border-color: var(--hop-ListBox-border-color);
3849
+ --hop-ListBox-section-header-color: var(--hop-neutral-text-weak);
3850
+ --hop-ListBox-section-header-font-family: var(--hop-overline-font-family);
3851
+ --hop-ListBox-section-header-font-size: var(--hop-overline-font-size);
3852
+ --hop-ListBox-section-header-font-weight: var(--hop-overline-font-weight);
3853
+ --hop-ListBox-section-header-letter-spacing: 0.015rem;
3854
+ --hop-ListBox-section-header-line-height: var(--hop-overline-line-height);
3855
+ --hop-ListBox-section-header-text-transform: uppercase;
3856
+ --hop-ListBox-section-header-padding: var(--hop-space-inset-stretch-sm);
3857
+ --hop-ListBox-section-header-top-offset: var(--hop-overline-top-offset);
3858
+ --hop-ListBox-section-header-bottom-offset: var(--hop-overline-bottom-offset);
3859
+ --max-width: var(--hop-ListBox-max-width);
3860
+ --width: var(--hop-ListBox-width);
3861
+ --section-padding-block-start: var(--hop-ListBox-section-padding-block);
3862
+ --section-padding-block-end: var(--hop-ListBox-section-padding-block);
3863
+ --section-margin-block-start: 0;
3864
+ --section-margin-block-end: 0;
3865
+ --section-border-block-start: 0;
3866
+ --section-border-block-end: var(--hop-ListBox-section-border-size) solid var(--hop-ListBox-section-border-color);
3867
+ overflow: hidden auto;
3868
+ box-sizing: border-box;
3869
+ inline-size: var(--width);
3870
+ min-inline-size: var(--hop-ListBox-min-width);
3871
+ max-inline-size: var(--max-width);
3872
+ padding-block: var(--hop-ListBox-padding-block);
3873
+ padding-inline: var(--hop-ListBox-padding-inline);
3874
+ background-color: var(--hop-ListBox-background-color);
3875
+ border: var(--hop-ListBox-border-size) solid var(--hop-ListBox-border-color);
3876
+ border-radius: var(--hop-ListBox-border-radius);
3877
+ }
3878
+ .ListBox-module__hop-ListBox--fluid___Hu9yL {
3879
+ --max-width: var(--hop-ListBox-fluid-max-width);
3880
+ --width: var(--hop-ListBox-fluid-width);
3881
+ }
3882
+ .ListBox-module__hop-ListBox__section___juwhb {
3883
+ margin-block: var(--section-margin-block-start) var(--section-margin-block-end);
3884
+ margin-inline: var(--hop-ListBox-section-margin-inline);
3885
+ padding-block: var(--section-padding-block-start) var(--section-padding-block-end);
3886
+ padding-inline: var(--hop-ListBox-section-padding-inline);
3887
+ border-block-start: var(--section-border-block-start);
3888
+ border-block-end: var(--section-border-block-end);
3889
+ }
3890
+ .ListBox-module__hop-ListBox__item___tEB62 + .ListBox-module__hop-ListBox__section___juwhb {
3891
+ --section-margin-block-start: var(--hop-ListBox-section-margin-block);
3892
+ --section-border-block-start: var(--hop-ListBox-section-border-size) solid var(--hop-ListBox-section-border-color);
3893
+ }
3894
+ .ListBox-module__hop-ListBox__section___juwhb:has(+ .ListBox-module__hop-ListBox__item___tEB62) {
3895
+ --section-margin-block-end: var(--hop-ListBox-section-margin-block);
3896
+ }
3897
+ .ListBox-module__hop-ListBox__section___juwhb:first-child {
3898
+ --section-padding-block-start: 0;
3899
+ }
3900
+ .ListBox-module__hop-ListBox__section___juwhb:last-child {
3901
+ --section-padding-block-end: 0;
3902
+ --section-border-block-end: 0;
3903
+ }
3904
+ .ListBox-module__hop-ListBox__section-header___l0TVR {
3905
+ margin: 0;
3906
+ padding: var(--hop-ListBox-section-header-padding);
3907
+ font-family: var(--hop-ListBox-section-header-font-family);
3908
+ font-size: var(--hop-ListBox-section-header-font-size);
3909
+ font-weight: var(--hop-ListBox-section-header-font-weight);
3910
+ line-height: var(--hop-ListBox-section-header-line-height);
3911
+ color: var(--hop-ListBox-section-header-color);
3912
+ text-transform: var(--hop-ListBox-section-header-text-transform);
3913
+ letter-spacing: var(--hop-ListBox-section-header-letter-spacing);
3914
+ }
3915
+ .ListBox-module__hop-ListBox__section-header___l0TVR::before,
3916
+ .ListBox-module__hop-ListBox__section-header___l0TVR::after {
3917
+ content: "";
3918
+ display: block;
3919
+ box-sizing: border-box;
3920
+ inline-size: 0;
3921
+ block-size: 0;
3922
+ }
3923
+ .ListBox-module__hop-ListBox__section-header___l0TVR::before {
3924
+ margin-block-end: var(--hop-ListBox-section-header-bottom-offset);
3925
+ }
3926
+ .ListBox-module__hop-ListBox__section-header___l0TVR::after {
3927
+ margin-block-start: var(--hop-ListBox-section-header-top-offset);
3928
+ }
3929
+
3930
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/overlays/popover/src/Popover.module.css/#css-module-data */
3931
+ :where(.Popover-module__hop-Popover___yH974 *) {
3932
+ font-family: var(--font-family);
3933
+ font-size: var(--font-size);
3934
+ font-weight: var(--font-weight);
3935
+ line-height: var(--line-height);
3936
+ outline: none;
3937
+ }
3938
+ .Popover-module__hop-Popover___yH974 {
3939
+ --hop-Popover-max-inline-width: calc(100% - (var(--container-padding) * 2));
3940
+ --hop-Popover-inline-width: 25rem;
3941
+ --hop-Popover-dropdown-inline-width: var(--trigger-width);
3942
+ --hop-Popover-combo-box-dropdown-inline-width: var(--custom-trigger-width);
3943
+ --hop-Popover-dropdown-auto-inline-width: auto;
3944
+ --width: var(--hop-Popover-inline-width);
3945
+ --max-width: var(--hop-Popover-max-inline-width);
3946
+ display: flex;
3947
+ flex-direction: column;
3948
+ inline-size: var(--width);
3949
+ max-inline-size: var(--max-width);
3950
+ }
3951
+ .Popover-module__hop-Popover___yH974[data-trigger=Select] {
3952
+ --width: var(--hop-Popover-dropdown-inline-width);
3953
+ }
3954
+ .Popover-module__hop-Popover___yH974[data-trigger=ComboBox] {
3955
+ --width: var(--hop-Popover-combo-box-dropdown-inline-width);
3956
+ }
3957
+ .Popover-module__hop-Popover___yH974[data-auto-width] {
3958
+ --width: var(--hop-Popover-dropdown-auto-inline-width);
3959
+ }
3960
+ .Popover-module__hop-Popover___yH974[data-entering] {
3961
+ animation: Popover-module__fade___MZenc 0.25s;
3962
+ }
3963
+ .Popover-module__hop-Popover___yH974[data-exiting] {
3964
+ animation: Popover-module__fade___MZenc 0.25s reverse;
3965
+ }
3966
+ @keyframes Popover-module__fade___MZenc {
3967
+ from {
3968
+ opacity: 0;
3969
+ }
3970
+ to {
3971
+ opacity: 1;
3972
+ }
3973
+ }
3974
+ .Popover-module__hop-Popover__wrapper___5ESmX {
3975
+ display: flex;
3976
+ flex: 1 1 auto;
3977
+ flex-direction: column;
3978
+ min-block-size: 0;
3979
+ }
3980
+ .Popover-module__hop-Popover__dialog___FOOKs,
3981
+ .Popover-module__hop-Popover__dropdown___-jsy8 {
3982
+ --hop-Popover-background: var(--hop-neutral-surface);
3983
+ --hop-Popover-font-family: var(--hop-body-sm-font-family);
3984
+ --hop-Popover-font-size: var(--hop-body-sm-font-size);
3985
+ --hop-Popover-font-weight: var(--hop-body-sm-font-weight);
3986
+ --hop-Popover-line-height: var(--hop-body-sm-line-height);
3987
+ --hop-Popover-color: var(--hop-neutral-text);
3988
+ --hop-Popover-grid-template: "header header" "content content" 1fr "footer action" / auto auto;
3989
+ --hop-Popover-column-gap: var(--hop-space-inset-sm);
3990
+ --hop-Popover-row-gap: var(--hop-space-stack-sm);
3991
+ --hop-Popover-dialog-padding: var(--hop-space-inset-md);
3992
+ --hop-Popover-dropdown-padding: 0;
3993
+ --hop-Popover-title-font-family: var(--hop-body-sm-font-family);
3994
+ --hop-Popover-title-font-weight: var(--hop-body-sm-semibold-font-weight);
3995
+ --hop-Popover-content-font-size: var(--hop-body-sm-font-size);
3996
+ --hop-Popover-content-font-family: var(--hop-body-sm-font-family);
3997
+ --hop-Popover-content-font-weight: var(--hop-body-sm-font-weight);
3998
+ --hop-Popover-content-line-height: var(--hop-body-sm-line-height);
3999
+ --hop-Popover-content-color: var(--hop-neutral-text-weak);
4000
+ --hop-Popover-footer-font-size: var(--hop-body-sm-font-size);
4001
+ --hop-Popover-footer-line-height: var(--hop-body-sm-line-height);
4002
+ --hop-Popover-footer-link-color: var(--hop-primary-text);
4003
+ --hop-Popover-footer-margin: var(--hop-space-stack-md) 0 0;
4004
+ --hop-Popover-border: 0.0625rem solid var(--hop-neutral-border-weak);
4005
+ --hop-Popover-border-radius: var(--hop-shape-rounded-md);
4006
+ --hop-Popover-box-shadow: var(--hop-elevation-lifted);
4007
+ --hop-Popover-dropdown-grid-template: "header" "content" 1fr "footer" / auto;
4008
+ --hop-Popover-list-box-dropdown-max-height: 18.75rem;
4009
+ --hop-Popover-footer-dropdown-margin: var(--hop-Popover-dropdown-padding) calc(-1 * var(--hop-Popover-dropdown-padding)) calc(-1 * var(--hop-Popover-dropdown-padding));
4010
+ --hop-Popover-footer-dropdown-footer-padding: var(--hop-space-inset-sm);
4011
+ --hop-Popover-footer-dropdown-footer-border-top: 0.0625rem solid var(--hop-neutral-border-weak);
4012
+ --font-family: var(--hop-Popover-font-family);
4013
+ --font-size: var(--hop-Popover-font-size);
4014
+ --font-weight: var(--hop-Popover-font-weight);
4015
+ --line-height: var(--hop-Popover-line-height);
4016
+ --grid-template: var(--hop-Popover-grid-template);
4017
+ --footer-margin: var(--hop-Popover-footer-margin);
4018
+ --footer-place-self: center start;
4019
+ display: grid;
4020
+ grid-template: var(--grid-template);
4021
+ box-sizing: border-box;
4022
+ min-block-size: 0;
4023
+ padding: var(--padding);
4024
+ background-color: var(--hop-Popover-background);
4025
+ border: var(--hop-Popover-border);
4026
+ border-radius: var(--hop-Popover-border-radius);
4027
+ box-shadow: var(--hop-Popover-box-shadow);
4028
+ }
4029
+ .Popover-module__hop-Popover__dropdown___-jsy8 {
4030
+ --footer-margin: var(--hop-Popover-footer-dropdown-margin);
4031
+ --footer-place-self: stretch;
4032
+ --grid-template: var(--hop-Popover-dropdown-grid-template);
4033
+ --padding: var(--hop-Popover-dropdown-padding);
4034
+ overflow: hidden;
4035
+ }
4036
+ .Popover-module__hop-Popover__dialog___FOOKs {
4037
+ --padding: var(--hop-Popover-dialog-padding);
4038
+ }
4039
+ .Popover-module__hop-Popover__title___GNuz4 {
4040
+ grid-area: header;
4041
+ color: var(--hop-Popover-color);
4042
+ }
4043
+ .Popover-module__hop-Popover__content___9OiFQ {
4044
+ --font-size: var(--hop-Popover-content-font-size);
4045
+ --line-height: var(--hop-Popover-content-line-height);
4046
+ --font-family: var(--hop-Popover-content-font-family);
4047
+ --font-weight: var(--hop-Popover-content-font-weight);
4048
+ grid-area: content;
4049
+ margin-block: var(--hop-Popover-row-gap) 0;
4050
+ margin-inline: 0;
4051
+ padding: 0;
4052
+ color: var(--hop-Popover-content-color);
4053
+ }
4054
+ .Popover-module__hop-Popover___yH974:not(:has(.Popover-module__hop-Popover__title___GNuz4)) {
4055
+ .Popover-module__hop-Popover__content___9OiFQ {
4056
+ margin-block: 0 var(--hop-Popover-row-gap) 0;
4057
+ }
4058
+ }
4059
+ .Popover-module__hop-Popover__dropdown___-jsy8 .Popover-module__hop-Popover__list-box___ZBhEH {
4060
+ grid-area: content;
4061
+ inline-size: auto;
4062
+ min-inline-size: auto;
4063
+ max-inline-size: none;
4064
+ max-block-size: var(--hop-Popover-list-box-dropdown-max-height);
4065
+ border: none;
4066
+ }
4067
+ .Popover-module__hop-Popover__footer___0wYlz {
4068
+ --font-size: var(--hop-Popover-footer-font-size);
4069
+ --line-height: var(--hop-Popover-footer-line-height);
4070
+ grid-area: footer;
4071
+ place-self: var(--footer-place-self);
4072
+ margin: var(--footer-margin);
4073
+ color: var(--hop-Popover-color);
4074
+ }
4075
+ .Popover-module__hop-Popover__dropdown___-jsy8 .Popover-module__hop-Popover__footer___0wYlz {
4076
+ padding: var(--hop-Popover-footer-dropdown-footer-padding);
4077
+ border-block-start: var(--hop-Popover-footer-dropdown-footer-border-top);
4078
+ }
4079
+ .Popover-module__hop-Popover__actions___u03PF,
4080
+ .Popover-module__hop-Popover__action___qVBfg {
4081
+ grid-area: action;
4082
+ justify-self: end;
4083
+ margin-block-start: var(--hop-Popover-row-gap);
4084
+ }
4085
+ .Popover-module__hop-Popover___yH974:has(.Popover-module__hop-Popover__actions___u03PF, .Popover-module__hop-Popover__action___qVBfg) .Popover-module__hop-Popover__footer___0wYlz {
4086
+ margin-inline-end: var(--hop-Popover-column-gap);
4087
+ }
4088
+
4089
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/overlays/popover/src/PopoverBase.module.css/#css-module-data */
4090
+ .PopoverBase-module__hop-PopoverBase___3P7KO {
4091
+ --hop-Popover-background: var(--hop-neutral-surface);
4092
+ --hop-Popover-border: 0.0625rem solid var(--hop-neutral-border-weak);
4093
+ --hop-Popover-border-radius: var(--hop-shape-rounded-md);
4094
+ --hop-Popover-box-shadow: var(--hop-elevation-lifted);
4095
+ --hop-Popover-color: var(--hop-neutral-text);
4096
+ --hop-Popover-color-outline: var(--hop-space-20) solid var(--hop-primary-border-focus);
4097
+ --hop-Popover-font-family: var(--hop-body-md-font-family);
4098
+ --hop-Popover-font-size: var(--hop-body-md-font-size);
4099
+ --hop-Popover-font-weight: var(--hop-body-md-font-weight);
4100
+ --hop-Popover-line-height: var(--hop-body-md-line-height);
4101
+ --hop-Popover-font-smoothing: antialiased;
4102
+ isolation: isolate;
4103
+ display: flex;
4104
+ flex-shrink: 0;
4105
+ align-items: center;
4106
+ box-sizing: border-box;
4107
+ max-inline-size: calc(100vw - 2* var(--container-padding, 0));
4108
+ font-family: var(--hop-Popover-font-family);
4109
+ font-size: var(--hop-Popover-font-size);
4110
+ font-weight: var(--hop-Popover-font-weight);
4111
+ -webkit-font-smoothing: var(--hop-Popover-font-smoothing);
4112
+ line-height: var(--hop-Popover-line-height);
4113
+ color: var(--hop-Popover-color);
4114
+ background-color: var(--hop-Popover-background);
4115
+ border: var(--hop-Popover-border);
4116
+ border-radius: var(--hop-Popover-border-radius);
4117
+ outline: none;
4118
+ box-shadow: var(--hop-Popover-box-shadow);
4119
+ transition: opacity var(--hop-easing-duration-2);
4120
+ }
4121
+ .PopoverBase-module__hop-PopoverBase___3P7KO[data-entering] {
4122
+ opacity: 0;
4123
+ }
4124
+ .PopoverBase-module__hop-PopoverBase___3P7KO[data-exiting] {
4125
+ pointer-events: none;
4126
+ opacity: 0;
4127
+ transition-timing-function: var(--hop-easing-productive);
4128
+ }
4129
+ .PopoverBase-module__hop-PopoverBase___3P7KO:focus-visible {
4130
+ outline: var(--hop-Popover-color-outline);
4131
+ }
4132
+
4133
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/menu/src/Menu.module.css/#css-module-data */
4134
+ .Menu-module__hop-Menu___FgwQR {
4135
+ --hop-Menu-border-size: 0.0625rem;
4136
+ --hop-Menu-overflow-y: auto;
4137
+ --hop-Menu-inline-size: 100%;
4138
+ --hop-Menu-block-size: max-content;
4139
+ --hop-Menu-margin: 0;
4140
+ --hop-Menu-padding: var(--hop-space-inset-sm);
4141
+ --hop-Menu-outline: none;
4142
+ overflow-y: var(--hop-Menu-overflow-y);
4143
+ inline-size: var(--hop-Menu-inline-size);
4144
+ block-size: var(--hop-Menu-block-size);
4145
+ margin: var(--hop-Menu-margin);
4146
+ padding: var(--hop-Menu-padding);
4147
+ outline: var(--hop-Menu-outline);
4148
+ }
4149
+ .Menu-module__hop-Menu__popover___5EIMV {
4150
+ --hop-Menu-popover-min-inline-size: 12.5rem;
4151
+ --hop-Menu-popover-max-inline-size: 20rem;
4152
+ --hop-Menu-popover-inline-size: max-content;
4153
+ inline-size: var(--hop-Menu-popover-inline-size);
4154
+ min-inline-size: var(--hop-Menu-popover-min-inline-size);
4155
+ max-inline-size: var(--hop-Menu-popover-max-inline-size);
4156
+ }
4157
+ .Menu-module__hop-Menu__header___vxEhp {
4158
+ --hop-Menu-header-cursor: default;
4159
+ --hop-Menu-header-display: flex;
4160
+ --hop-Menu-header-align-items: center;
4161
+ --hop-Menu-header-block-size: 2rem;
4162
+ --hop-Menu-header-padding-inline: var(--hop-space-inset-md);
4163
+ --hop-Menu-header-font-size: var(--hop-overline-font-size);
4164
+ --hop-Menu-header-font-weight: var(--hop-overline-font-weight);
4165
+ --hop-Menu-header-line-height: var(--hop-overline-line-height);
4166
+ --hop-Menu-header-color: var(--hop-neutral-text-weak);
4167
+ --hop-Menu-header-text-transform: uppercase;
4168
+ --hop-Menu-header-font-family: var(--hop-overline-font-family);
4169
+ --hop-Menu-header-letter-spacing: 0.015rem;
4170
+ cursor: var(--hop-Menu-header-cursor);
4171
+ display: var(--hop-Menu-header-display);
4172
+ align-items: var(--hop-Menu-header-align-items);
4173
+ block-size: var(--hop-Menu-header-block-size);
4174
+ padding-inline: var(--hop-Menu-header-padding-inline);
4175
+ font-family: var(--hop-Menu-header-font-family);
4176
+ font-size: var(--hop-Menu-header-font-size);
4177
+ font-weight: var(--hop-Menu-header-font-weight);
4178
+ line-height: var(--hop-Menu-header-line-height);
4179
+ color: var(--hop-Menu-header-color);
4180
+ text-transform: var(--hop-Menu-header-text-transform);
4181
+ letter-spacing: var(--hop-Menu-header-letter-spacing);
4182
+ }
4183
+ .Menu-module__hop-Menu__divider___LzWEK {
4184
+ --hop-Menu-divider-margin-block: var(--hop-space-stack-sm);
4185
+ --hop-Menu-divider-margin-inline: calc(-2 * var(--hop-space-inset-sm));
4186
+ margin-block: var( --hop-Menu-divider-margin-block);
4187
+ margin-inline: var(--hop-Menu-divider-margin-inline);
4188
+ }