@hopper-ui/components 1.8.2 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (365) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/accordion/src/Accordion.css +78 -78
  3. package/dist/accordion/src/Accordion.js +2 -2
  4. package/dist/accordion/src/index.css +78 -78
  5. package/dist/accordion/src/index.js +2 -2
  6. package/dist/alert/src/Alert.css +770 -593
  7. package/dist/alert/src/Alert.js +10 -9
  8. package/dist/alert/src/index.css +770 -593
  9. package/dist/alert/src/index.js +10 -9
  10. package/dist/avatar/src/AnonymousAvatar.css +48 -48
  11. package/dist/avatar/src/AnonymousAvatar.js +2 -2
  12. package/dist/avatar/src/Avatar.css +66 -66
  13. package/dist/avatar/src/Avatar.js +4 -4
  14. package/dist/avatar/src/AvatarGroup.css +65 -65
  15. package/dist/avatar/src/AvatarGroup.js +4 -4
  16. package/dist/avatar/src/BrokenAvatar.css +48 -48
  17. package/dist/avatar/src/BrokenAvatar.js +2 -2
  18. package/dist/avatar/src/DeletedAvatar.css +48 -48
  19. package/dist/avatar/src/DeletedAvatar.js +2 -2
  20. package/dist/avatar/src/RichIconAvatarImage.css +48 -48
  21. package/dist/avatar/src/RichIconAvatarImage.js +1 -1
  22. package/dist/avatar/src/index.css +93 -93
  23. package/dist/avatar/src/index.js +9 -9
  24. package/dist/badge/src/Badge.css +53 -53
  25. package/dist/badge/src/Badge.js +2 -2
  26. package/dist/badge/src/FloatingBadge.css +48 -48
  27. package/dist/badge/src/FloatingBadge.js +1 -1
  28. package/dist/badge/src/index.css +63 -63
  29. package/dist/badge/src/index.js +3 -3
  30. package/dist/buttons/src/Button.css +120 -110
  31. package/dist/buttons/src/Button.d.ts +5 -2
  32. package/dist/buttons/src/Button.js +6 -5
  33. package/dist/buttons/src/ButtonContext.d.ts +3 -1
  34. package/dist/buttons/src/ButtonGroup.css +49 -49
  35. package/dist/buttons/src/ButtonGroup.d.ts +1 -1
  36. package/dist/buttons/src/ButtonGroup.js +1 -1
  37. package/dist/buttons/src/ButtonGroupContext.d.ts +1 -1
  38. package/dist/buttons/src/ClearButton.css +109 -109
  39. package/dist/buttons/src/ClearButton.js +2 -2
  40. package/dist/buttons/src/CloseButton.css +115 -105
  41. package/dist/buttons/src/CloseButton.d.ts +3 -1
  42. package/dist/buttons/src/CloseButton.js +7 -6
  43. package/dist/buttons/src/CloseButtonContext.d.ts +3 -1
  44. package/dist/buttons/src/EmbeddedButton.css +109 -109
  45. package/dist/buttons/src/EmbeddedButton.js +1 -1
  46. package/dist/buttons/src/LinkButton.css +131 -119
  47. package/dist/buttons/src/LinkButton.d.ts +5 -2
  48. package/dist/buttons/src/LinkButton.js +5 -4
  49. package/dist/buttons/src/LinkButtonContext.d.ts +3 -1
  50. package/dist/buttons/src/ToggleButton.css +485 -330
  51. package/dist/buttons/src/ToggleButton.d.ts +6 -3
  52. package/dist/buttons/src/ToggleButton.js +4 -4
  53. package/dist/buttons/src/ToggleButtonContext.d.ts +3 -1
  54. package/dist/buttons/src/index.css +718 -541
  55. package/dist/buttons/src/index.d.ts +6 -4
  56. package/dist/buttons/src/index.js +12 -11
  57. package/dist/callout/src/Callout.css +730 -553
  58. package/dist/callout/src/Callout.js +8 -7
  59. package/dist/callout/src/CompactCallout.css +767 -590
  60. package/dist/callout/src/CompactCallout.js +8 -7
  61. package/dist/callout/src/index.css +779 -602
  62. package/dist/callout/src/index.js +10 -9
  63. package/dist/card/src/Card.css +41 -41
  64. package/dist/card/src/Card.js +1 -1
  65. package/dist/card/src/index.css +41 -41
  66. package/dist/card/src/index.js +1 -1
  67. package/dist/checkbox/src/Checkbox.css +57 -57
  68. package/dist/checkbox/src/Checkbox.js +4 -4
  69. package/dist/checkbox/src/CheckboxField.css +44 -44
  70. package/dist/checkbox/src/CheckboxField.js +3 -3
  71. package/dist/checkbox/src/CheckboxGroup.css +109 -109
  72. package/dist/checkbox/src/CheckboxGroup.js +7 -7
  73. package/dist/checkbox/src/DecorativeCheckbox.css +65 -65
  74. package/dist/checkbox/src/DecorativeCheckbox.js +3 -3
  75. package/dist/checkbox/src/index.css +109 -109
  76. package/dist/checkbox/src/index.js +11 -11
  77. package/dist/{chunk-3MYOCKT2.js → chunk-22DZZ7PK.js} +8 -8
  78. package/dist/{chunk-VNFZDWVB.js → chunk-23OKJK5E.js} +1 -1
  79. package/dist/{chunk-WTBYPRRW.js → chunk-2CMRIMTT.js} +3 -3
  80. package/dist/{chunk-CHJUYY53.js → chunk-2VMV4LDJ.js} +1 -1
  81. package/dist/{chunk-WTDBPVO2.js → chunk-335ZARPI.js} +3 -3
  82. package/dist/{chunk-OPG3YAOS.js → chunk-3GNODKFW.js} +1 -1
  83. package/dist/{chunk-WSW2WVYZ.js → chunk-3UBW7B5Y.js} +1 -1
  84. package/dist/{chunk-OM4XR33Z.js → chunk-4B7TDPQB.js} +2 -2
  85. package/dist/{chunk-R3F4R2GR.js → chunk-4JKPMEEJ.js} +5 -5
  86. package/dist/{chunk-O4U6DKHU.js → chunk-4UVLGO3D.js} +2 -2
  87. package/dist/{chunk-VSAMAS7P.js → chunk-5OSLSGCY.js} +5 -5
  88. package/dist/{chunk-XIWBIDKX.js → chunk-5Q5LAGLQ.js} +16 -10
  89. package/dist/{chunk-V4FVG6RD.js → chunk-63B43NAY.js} +3 -3
  90. package/dist/{chunk-YT6KAZ7W.js → chunk-63P5XXBL.js} +2 -2
  91. package/dist/{chunk-TSXCJZLH.js → chunk-6AKHGSHL.js} +2 -2
  92. package/dist/{chunk-CMNPB35A.js → chunk-6KXXNGHQ.js} +12 -12
  93. package/dist/{chunk-TQFW3GV6.js → chunk-77JGVGS3.js} +2 -2
  94. package/dist/{chunk-VDPXCFLQ.js → chunk-7EZL7ZEN.js} +5 -5
  95. package/dist/{chunk-C2JYCOJJ.js → chunk-7FIL5U4Z.js} +2 -2
  96. package/dist/{chunk-YG4VQFHZ.js → chunk-7KGCL6NF.js} +2 -2
  97. package/dist/{chunk-AJ4JHO3L.js → chunk-7SQ3B5CN.js} +3 -3
  98. package/dist/{chunk-VQ6HKO7S.js → chunk-7WNRLXYV.js} +2 -2
  99. package/dist/{chunk-SLJKAEOC.js → chunk-AH4RWVYD.js} +5 -5
  100. package/dist/{chunk-3BP4XOAL.js → chunk-AIWBAHIZ.js} +1 -1
  101. package/dist/{chunk-BHFIGTK6.js → chunk-AQBGEAPW.js} +1 -1
  102. package/dist/{chunk-2EOZLJ3U.js → chunk-AUWXH6DB.js} +6 -6
  103. package/dist/{chunk-2QPUHBJ6.js → chunk-BZPOJXHY.js} +3 -3
  104. package/dist/{chunk-KG3UXYPM.js → chunk-CCANXYSA.js} +3 -3
  105. package/dist/{chunk-ZBVXOGE7.js → chunk-CFFDABWV.js} +8 -8
  106. package/dist/{chunk-C4F7EZIQ.js → chunk-CJ6K4SGD.js} +1 -1
  107. package/dist/{chunk-XFWOCVQF.js → chunk-CPCR7FGP.js} +15 -9
  108. package/dist/{chunk-PVIZJ22K.js → chunk-CUGWVLKK.js} +1 -1
  109. package/dist/{chunk-GTGTEHOA.js → chunk-CZQ7Y25A.js} +2 -2
  110. package/dist/{chunk-VK4C7IPE.js → chunk-DIP3SE2A.js} +7 -7
  111. package/dist/{chunk-GUPD7SCD.js → chunk-E5HFUKHL.js} +1 -1
  112. package/dist/{chunk-N2INWSSP.js → chunk-EABN7BCJ.js} +1 -1
  113. package/dist/{chunk-2UBRJW2J.js → chunk-EQU2MUZ2.js} +1 -1
  114. package/dist/{chunk-JSK57VIX.js → chunk-ETHCY5HV.js} +2 -2
  115. package/dist/{chunk-RXNIOPGX.js → chunk-EVXAOPUQ.js} +2 -2
  116. package/dist/{chunk-JG7DCSZ7.js → chunk-FGZNIAIF.js} +1 -1
  117. package/dist/{chunk-P4YL7PZX.js → chunk-FL33X6NS.js} +2 -2
  118. package/dist/{chunk-YJZJ6EGK.js → chunk-FNI3HSJI.js} +3 -3
  119. package/dist/{chunk-J6QWUF6I.js → chunk-FPPUBMBE.js} +18 -12
  120. package/dist/{chunk-KHPSEX4H.js → chunk-FRH64YKY.js} +2 -2
  121. package/dist/{chunk-UH3RWAZV.js → chunk-G73VEN7N.js} +2 -2
  122. package/dist/{chunk-B62S77SN.js → chunk-HQEYCFR2.js} +3 -3
  123. package/dist/chunk-HXL5DWXT.js +23 -0
  124. package/dist/{chunk-IKQ2EV2Y.js → chunk-I3RM4ZNZ.js} +1 -1
  125. package/dist/{chunk-E3KVQKBW.js → chunk-IVZ3EL66.js} +3 -3
  126. package/dist/{chunk-CDC6G4DW.js → chunk-IXC3UTLF.js} +1 -1
  127. package/dist/{chunk-YLUR4I4O.js → chunk-IXYSG3YF.js} +1 -1
  128. package/dist/{chunk-QXX3VYMF.js → chunk-IYPDPLMO.js} +1 -1
  129. package/dist/{chunk-AN3RU3NY.js → chunk-JD3QSJOH.js} +3 -3
  130. package/dist/{chunk-Y5RKQQHZ.js → chunk-JOBH3GNG.js} +2 -2
  131. package/dist/{chunk-BCBQINY3.js → chunk-JOL2XETU.js} +2 -2
  132. package/dist/{chunk-VQN3EOEE.js → chunk-JZ6W76HH.js} +2 -2
  133. package/dist/{chunk-SUNGEQNN.js → chunk-KL6G435R.js} +2 -2
  134. package/dist/{chunk-W57EDX3L.js → chunk-KTYJODZV.js} +1 -1
  135. package/dist/{chunk-T52WHF7R.js → chunk-KVXE46FV.js} +1 -1
  136. package/dist/{chunk-GNG2NV76.js → chunk-L6KDA3QR.js} +1 -1
  137. package/dist/{chunk-TRMO7MV5.js → chunk-LSFVWR6F.js} +11 -11
  138. package/dist/{chunk-THRSW2TA.js → chunk-MRQEFQZB.js} +1 -1
  139. package/dist/{chunk-Q7NZNQEE.js → chunk-NBPERDDF.js} +2 -2
  140. package/dist/{chunk-BV3ROFY6.js → chunk-NOGAOMSP.js} +1 -1
  141. package/dist/{chunk-MRHZL6GL.js → chunk-NUN7AV55.js} +2 -2
  142. package/dist/{chunk-MVXDSVBA.js → chunk-OQPQ5Q54.js} +1 -1
  143. package/dist/{chunk-A5X5HCFF.js → chunk-OZ3W7ATD.js} +1 -1
  144. package/dist/{chunk-EOXIVZJH.js → chunk-PN2K4YPV.js} +1 -1
  145. package/dist/{chunk-6Y4WK3RQ.js → chunk-QABLDHTY.js} +1 -1
  146. package/dist/{chunk-FC6G5MQ3.js → chunk-QWK3WHKB.js} +2 -2
  147. package/dist/{chunk-XYQU45MO.js → chunk-QZG7DH76.js} +3 -3
  148. package/dist/{chunk-LDWHZCH4.js → chunk-RWYVNDEG.js} +1 -1
  149. package/dist/{chunk-C7CNYQRP.js → chunk-S2FS5CRY.js} +2 -2
  150. package/dist/{chunk-O6RCJ73Y.js → chunk-SH7QX4ON.js} +2 -2
  151. package/dist/{chunk-2ZNBGFYO.js → chunk-SQFL7HVZ.js} +1 -1
  152. package/dist/{chunk-OZ7NZPDM.js → chunk-SR2OVG77.js} +1 -1
  153. package/dist/{chunk-QIGTPOAF.js → chunk-T2C6FGAY.js} +10 -10
  154. package/dist/{chunk-FQHEXVEO.js → chunk-T6TEL2CE.js} +2 -2
  155. package/dist/{chunk-4O27LL2N.js → chunk-TLWX2TD4.js} +2 -2
  156. package/dist/{chunk-UEJAUKJY.js → chunk-UENGYKQS.js} +8 -8
  157. package/dist/{chunk-XSUYZDYB.js → chunk-UH3BTZIK.js} +1 -1
  158. package/dist/{chunk-GDX6X4AK.js → chunk-V2AOVTCU.js} +2 -2
  159. package/dist/{chunk-PT5SYITB.js → chunk-V3GYJE64.js} +5 -5
  160. package/dist/{chunk-5ZMGVSCQ.js → chunk-VOPB3IFM.js} +1 -1
  161. package/dist/{chunk-TBOTEIRR.js → chunk-WGY5JT6V.js} +1 -1
  162. package/dist/{chunk-I62K2ZHG.js → chunk-XOYIBFOK.js} +1 -1
  163. package/dist/{chunk-CU3QGP2L.js → chunk-ZBKTSDZW.js} +2 -2
  164. package/dist/combobox/src/ComboBox.css +1132 -955
  165. package/dist/combobox/src/ComboBox.js +18 -18
  166. package/dist/combobox/src/index.css +1132 -955
  167. package/dist/combobox/src/index.js +18 -18
  168. package/dist/contextual-help/src/ContextualHelp.css +1061 -884
  169. package/dist/contextual-help/src/ContextualHelp.js +4 -4
  170. package/dist/contextual-help/src/index.css +1061 -884
  171. package/dist/contextual-help/src/index.js +4 -4
  172. package/dist/disclosure/src/Disclosure.css +48 -48
  173. package/dist/disclosure/src/Disclosure.js +2 -2
  174. package/dist/disclosure/src/DisclosureHeader.css +55 -55
  175. package/dist/disclosure/src/DisclosureHeader.js +3 -3
  176. package/dist/disclosure/src/DisclosurePanel.css +48 -48
  177. package/dist/disclosure/src/DisclosurePanel.js +4 -4
  178. package/dist/disclosure/src/index.css +73 -73
  179. package/dist/disclosure/src/index.js +8 -8
  180. package/dist/divider/src/Divider.css +40 -40
  181. package/dist/divider/src/Divider.js +1 -1
  182. package/dist/divider/src/index.css +40 -40
  183. package/dist/divider/src/index.js +1 -1
  184. package/dist/error-message/src/ErrorMessage.css +40 -40
  185. package/dist/error-message/src/ErrorMessage.js +2 -2
  186. package/dist/error-message/src/index.css +40 -40
  187. package/dist/error-message/src/index.js +2 -2
  188. package/dist/form/src/Form.css +38 -38
  189. package/dist/form/src/Form.d.ts +1 -1
  190. package/dist/form/src/Form.js +1 -1
  191. package/dist/form/src/index.css +38 -38
  192. package/dist/form/src/index.js +1 -1
  193. package/dist/header/src/Header.css +38 -38
  194. package/dist/header/src/index.css +38 -38
  195. package/dist/helper-message/src/HelperMessage.css +40 -40
  196. package/dist/helper-message/src/HelperMessage.js +2 -2
  197. package/dist/helper-message/src/index.css +40 -40
  198. package/dist/helper-message/src/index.js +2 -2
  199. package/dist/hopper-provider/src/HopperProvider.css +39 -39
  200. package/dist/hopper-provider/src/HopperProvider.js +1 -1
  201. package/dist/hopper-provider/src/index.css +39 -39
  202. package/dist/hopper-provider/src/index.js +1 -1
  203. package/dist/icon-list/src/IconList.css +39 -39
  204. package/dist/icon-list/src/IconList.js +1 -1
  205. package/dist/icon-list/src/index.css +39 -39
  206. package/dist/icon-list/src/index.js +1 -1
  207. package/dist/illustrated-message/src/IllustratedMessage.css +737 -560
  208. package/dist/illustrated-message/src/IllustratedMessage.js +1 -1
  209. package/dist/illustrated-message/src/index.css +737 -560
  210. package/dist/illustrated-message/src/index.js +1 -1
  211. package/dist/image/src/Image.css +41 -41
  212. package/dist/image/src/Image.js +1 -1
  213. package/dist/image/src/SvgImage.css +39 -39
  214. package/dist/image/src/SvgImage.js +1 -1
  215. package/dist/image/src/index.css +42 -42
  216. package/dist/image/src/index.js +2 -2
  217. package/dist/index.css +1482 -1305
  218. package/dist/index.d.ts +25 -7
  219. package/dist/index.js +90 -89
  220. package/dist/inputs/src/Input.css +42 -42
  221. package/dist/inputs/src/Input.js +1 -1
  222. package/dist/inputs/src/InputGroup.css +44 -44
  223. package/dist/inputs/src/InputGroup.js +1 -1
  224. package/dist/inputs/src/NumberField.css +68 -68
  225. package/dist/inputs/src/NumberField.js +10 -10
  226. package/dist/inputs/src/PasswordField.css +738 -561
  227. package/dist/inputs/src/PasswordField.js +10 -10
  228. package/dist/inputs/src/RemainingCharacterCount.css +41 -41
  229. package/dist/inputs/src/RemainingCharacterCount.js +2 -2
  230. package/dist/inputs/src/SearchField.css +744 -567
  231. package/dist/inputs/src/SearchField.js +11 -11
  232. package/dist/inputs/src/TextArea.css +65 -65
  233. package/dist/inputs/src/TextArea.js +9 -9
  234. package/dist/inputs/src/TextField.css +742 -565
  235. package/dist/inputs/src/TextField.js +13 -13
  236. package/dist/inputs/src/index.css +784 -607
  237. package/dist/inputs/src/index.js +17 -17
  238. package/dist/layout/src/Content.css +38 -38
  239. package/dist/layout/src/Footer.css +38 -38
  240. package/dist/link/src/Link.css +77 -77
  241. package/dist/link/src/Link.js +3 -3
  242. package/dist/link/src/index.css +77 -77
  243. package/dist/link/src/index.js +3 -3
  244. package/dist/list-box/src/ListBox.css +312 -312
  245. package/dist/list-box/src/ListBox.js +7 -7
  246. package/dist/list-box/src/ListBoxItem.css +300 -300
  247. package/dist/list-box/src/ListBoxItem.js +6 -6
  248. package/dist/list-box/src/ListBoxItemSkeleton.css +45 -45
  249. package/dist/list-box/src/ListBoxItemSkeleton.js +1 -1
  250. package/dist/list-box/src/index.css +312 -312
  251. package/dist/list-box/src/index.js +7 -7
  252. package/dist/menu/src/Menu.css +1057 -880
  253. package/dist/menu/src/Menu.js +2 -2
  254. package/dist/menu/src/MenuItem.css +117 -117
  255. package/dist/menu/src/MenuItem.js +2 -2
  256. package/dist/menu/src/MenuSection.css +40 -40
  257. package/dist/menu/src/MenuSection.js +1 -1
  258. package/dist/menu/src/index.css +1082 -905
  259. package/dist/menu/src/index.js +5 -5
  260. package/dist/modal/src/BaseModal.css +53 -53
  261. package/dist/modal/src/BaseModal.js +1 -1
  262. package/dist/modal/src/CustomModal.css +54 -54
  263. package/dist/modal/src/CustomModal.js +2 -2
  264. package/dist/modal/src/Modal.css +760 -583
  265. package/dist/modal/src/Modal.js +9 -8
  266. package/dist/modal/src/index.css +755 -578
  267. package/dist/modal/src/index.js +10 -9
  268. package/dist/overlays/popover/src/Popover.css +1055 -878
  269. package/dist/overlays/popover/src/Popover.js +2 -2
  270. package/dist/overlays/popover/src/PopoverBase.css +41 -41
  271. package/dist/overlays/popover/src/PopoverBase.js +1 -1
  272. package/dist/overlays/popover/src/index.css +1058 -881
  273. package/dist/overlays/popover/src/index.js +3 -3
  274. package/dist/radio/src/DecorativeRadio.css +65 -65
  275. package/dist/radio/src/DecorativeRadio.js +3 -3
  276. package/dist/radio/src/Radio.css +57 -57
  277. package/dist/radio/src/Radio.js +3 -3
  278. package/dist/radio/src/RadioField.css +44 -44
  279. package/dist/radio/src/RadioField.js +2 -2
  280. package/dist/radio/src/RadioGroup.css +109 -109
  281. package/dist/radio/src/RadioGroup.js +7 -7
  282. package/dist/radio/src/index.css +109 -109
  283. package/dist/radio/src/index.js +11 -11
  284. package/dist/segmented-control/src/SegmentedControl.css +39 -39
  285. package/dist/segmented-control/src/SegmentedControl.js +1 -1
  286. package/dist/segmented-control/src/SegmentedControlItem.css +53 -53
  287. package/dist/segmented-control/src/SegmentedControlItem.js +2 -2
  288. package/dist/segmented-control/src/index.css +54 -54
  289. package/dist/segmented-control/src/index.js +3 -3
  290. package/dist/select/src/Select.css +1076 -899
  291. package/dist/select/src/Select.js +17 -17
  292. package/dist/select/src/SelectValue.css +99 -99
  293. package/dist/select/src/SelectValue.js +2 -2
  294. package/dist/select/src/index.css +1076 -899
  295. package/dist/select/src/index.js +17 -17
  296. package/dist/spinner/src/Spinner.css +48 -48
  297. package/dist/spinner/src/Spinner.js +2 -2
  298. package/dist/spinner/src/index.css +48 -48
  299. package/dist/spinner/src/index.js +2 -2
  300. package/dist/switch/src/Switch.css +54 -54
  301. package/dist/switch/src/Switch.js +3 -3
  302. package/dist/switch/src/SwitchField.css +44 -44
  303. package/dist/switch/src/SwitchField.js +2 -2
  304. package/dist/switch/src/index.css +60 -60
  305. package/dist/switch/src/index.js +4 -4
  306. package/dist/tabs/src/Tab.css +902 -725
  307. package/dist/tabs/src/Tab.js +2 -2
  308. package/dist/tabs/src/TabLine.css +40 -40
  309. package/dist/tabs/src/TabLine.js +1 -1
  310. package/dist/tabs/src/TabList.css +47 -47
  311. package/dist/tabs/src/TabList.js +2 -2
  312. package/dist/tabs/src/TabPanel.css +40 -40
  313. package/dist/tabs/src/TabPanel.js +1 -1
  314. package/dist/tabs/src/index.css +913 -736
  315. package/dist/tabs/src/index.js +5 -5
  316. package/dist/tag/src/Tag.css +880 -703
  317. package/dist/tag/src/Tag.js +7 -7
  318. package/dist/tag/src/TagGroup.css +48 -48
  319. package/dist/tag/src/TagGroup.js +7 -7
  320. package/dist/tag/src/index.css +890 -713
  321. package/dist/tag/src/index.js +12 -12
  322. package/dist/tile/src/Tile.css +47 -47
  323. package/dist/tile/src/Tile.js +2 -2
  324. package/dist/tile/src/TileGroup.css +39 -39
  325. package/dist/tile/src/TileGroup.js +1 -1
  326. package/dist/tile/src/index.css +48 -48
  327. package/dist/tile/src/index.js +3 -3
  328. package/dist/toggle-arrow/src/ToggleArrow.css +40 -40
  329. package/dist/toggle-arrow/src/ToggleArrow.js +1 -1
  330. package/dist/toggle-arrow/src/index.css +40 -40
  331. package/dist/toggle-arrow/src/index.js +1 -1
  332. package/dist/tooltip/src/Tooltip.css +48 -48
  333. package/dist/tooltip/src/Tooltip.js +3 -3
  334. package/dist/tooltip/src/TooltipTrigger.css +38 -38
  335. package/dist/tooltip/src/index.css +48 -48
  336. package/dist/tooltip/src/index.js +3 -3
  337. package/dist/{types-CVCUJ7un.d.ts → types-BqmVPR6K.d.ts} +2 -2
  338. package/dist/typography/heading/src/Heading.css +38 -38
  339. package/dist/typography/heading/src/Heading.js +1 -1
  340. package/dist/typography/heading/src/index.css +38 -38
  341. package/dist/typography/heading/src/index.js +1 -1
  342. package/dist/typography/label/src/FieldLabel.css +38 -38
  343. package/dist/typography/label/src/FieldLabel.js +3 -3
  344. package/dist/typography/label/src/Label.css +38 -38
  345. package/dist/typography/label/src/Label.js +1 -1
  346. package/dist/typography/label/src/index.css +38 -38
  347. package/dist/typography/label/src/index.js +3 -3
  348. package/dist/typography/overline-text/src/OverlineText.css +38 -38
  349. package/dist/typography/overline-text/src/OverlineText.js +1 -1
  350. package/dist/typography/overline-text/src/index.css +38 -38
  351. package/dist/typography/overline-text/src/index.js +1 -1
  352. package/dist/typography/paragraph/src/Paragraph.css +38 -38
  353. package/dist/typography/paragraph/src/Paragraph.js +2 -2
  354. package/dist/typography/paragraph/src/index.css +38 -38
  355. package/dist/typography/paragraph/src/index.js +2 -2
  356. package/dist/typography/text/src/Text.css +38 -38
  357. package/dist/typography/text/src/Text.js +1 -1
  358. package/dist/typography/text/src/index.css +38 -38
  359. package/dist/typography/text/src/index.js +1 -1
  360. package/dist/utils/src/ClearSlots.css +38 -38
  361. package/dist/utils/src/EnsureTextWrapper.css +38 -38
  362. package/dist/utils/src/EnsureTextWrapper.js +2 -2
  363. package/dist/utils/src/index.css +38 -38
  364. package/dist/utils/src/index.js +2 -2
  365. package/package.json +1 -1
package/dist/buttons/src/ToggleButton.css CHANGED
@@ -1,5 +1,5 @@
1
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___ex9Pl {
2
+ .Heading-module__hop-Heading___BRqAY {
3
3
  --hop-Heading-xs-font-size: var(--hop-heading-xs-font-size);
4
4
  --hop-Heading-xs-font-family: var(--hop-heading-xs-font-family);
5
5
  --hop-Heading-xs-font-weight: var(--hop-heading-xs-font-weight);
@@ -33,7 +33,7 @@
33
33
  --hop-Heading-inherit-size-font-weight: inherit;
34
34
  --hop-Heading-inherit-size-line-height: inherit;
35
35
  }
36
- :where(.Heading-module__hop-Heading___ex9Pl) {
36
+ :where(.Heading-module__hop-Heading___BRqAY) {
37
37
  margin: 0;
38
38
  font-family: var(--font-family);
39
39
  font-size: var(--font-size);
@@ -41,43 +41,43 @@
41
41
  line-height: var(--line-height);
42
42
  color: var(--hop-neutral-text);
43
43
  }
44
- :where(.Heading-module__hop-Heading--xs___U-anE) {
44
+ :where(.Heading-module__hop-Heading--xs___-cYUG) {
45
45
  --font-size: var(--hop-Heading-xs-font-size);
46
46
  --font-family: var(--hop-Heading-xs-font-family);
47
47
  --font-weight: var(--hop-Heading-xs-font-weight);
48
48
  --line-height: var(--hop-Heading-xs-line-height);
49
49
  }
50
- :where(.Heading-module__hop-Heading--sm___9euNX) {
50
+ :where(.Heading-module__hop-Heading--sm___aVJ3J) {
51
51
  --font-size: var(--hop-Heading-sm-font-size);
52
52
  --font-family: var(--hop-Heading-sm-font-family);
53
53
  --font-weight: var(--hop-Heading-sm-font-weight);
54
54
  --line-height: var(--hop-Heading-sm-line-height);
55
55
  }
56
- :where(.Heading-module__hop-Heading--md___m9G-q) {
56
+ :where(.Heading-module__hop-Heading--md___oIhpJ) {
57
57
  --font-size: var(--hop-Heading-md-font-size);
58
58
  --font-family: var(--hop-Heading-md-font-family);
59
59
  --font-weight: var(--hop-Heading-md-font-weight);
60
60
  --line-height: var(--hop-Heading-md-line-height);
61
61
  }
62
- :where(.Heading-module__hop-Heading--lg___seVEu) {
62
+ :where(.Heading-module__hop-Heading--lg___NCNfC) {
63
63
  --font-size: var(--hop-Heading-lg-font-size);
64
64
  --font-family: var(--hop-Heading-lg-font-family);
65
65
  --font-weight: var(--hop-Heading-lg-font-weight);
66
66
  --line-height: var(--hop-Heading-lg-line-height);
67
67
  }
68
- :where(.Heading-module__hop-Heading--xl___-ctXd) {
68
+ :where(.Heading-module__hop-Heading--xl___7SiFx) {
69
69
  --font-size: var(--hop-Heading-xl-font-size);
70
70
  --font-family: var(--hop-Heading-xl-font-family);
71
71
  --font-weight: var(--hop-Heading-xl-font-weight);
72
72
  --line-height: var(--hop-Heading-xl-line-height);
73
73
  }
74
- :where(.Heading-module__hop-Heading--2xl___nm0lD) {
74
+ :where(.Heading-module__hop-Heading--2xl___odubm) {
75
75
  --font-size: var(--hop-Heading-2xl-font-size);
76
76
  --font-family: var(--hop-Heading-2xl-font-family);
77
77
  --font-weight: var(--hop-Heading-2xl-font-weight);
78
78
  --line-height: var(--hop-Heading-2xl-line-height);
79
79
  }
80
- :where(.Heading-module__hop-Heading--3xl___UlnoB) {
80
+ :where(.Heading-module__hop-Heading--3xl___PuZe2) {
81
81
  --font-size: var(--hop-Heading-3xl-font-size);
82
82
  --font-family: var(--hop-Heading-3xl-font-family);
83
83
  --font-weight: var(--hop-Heading-3xl-font-weight);
@@ -85,21 +85,21 @@
85
85
  }
86
86
 
87
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___oRthn {
88
+ .Form-module__hop-Form___t4rQR {
89
89
  display: flex;
90
90
  flex-direction: column;
91
91
  gap: var(--hop-space-stack-lg);
92
92
  }
93
93
 
94
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___ClY-C {
95
+ .Label-module__hop-Label___v6UpM {
96
96
  --hop-Label-font-size: var(--hop-heading-xs-font-size);
97
97
  --hop-Label-font-family: var(--hop-heading-xs-font-family);
98
98
  --hop-Label-font-weight: var(--hop-heading-xs-font-weight);
99
99
  --hop-Label-line-height: var(--hop-heading-xs-line-height);
100
100
  --hop-Label-color: var(--hop-neutral-text-weak);
101
101
  }
102
- :where(.Label-module__hop-Label___ClY-C) {
102
+ :where(.Label-module__hop-Label___v6UpM) {
103
103
  font-family: var(--hop-Label-font-family);
104
104
  font-size: var(--hop-Label-font-size);
105
105
  font-weight: var(--hop-Label-font-weight);
@@ -108,17 +108,17 @@
108
108
  }
109
109
 
110
110
  /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/label/src/FieldLabel.module.css/#css-module-data */
111
- .FieldLabel-module__hop-FieldLabel__wrapper___P-qSb {
111
+ .FieldLabel-module__hop-FieldLabel__wrapper___zWpYu {
112
112
  display: flex;
113
113
  gap: var(--hop-space-inset-xs);
114
114
  align-items: center;
115
115
  }
116
- .FieldLabel-module__hop-FieldLabel__indicator___lbxSg {
116
+ .FieldLabel-module__hop-FieldLabel__indicator___5IEoJ {
117
117
  padding-inline-start: var(--hop-space-20);
118
118
  }
119
119
 
120
120
  /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/overline-text/src/OverlineText.module.css/#css-module-data */
121
- :where(.OverlineText-module__hop-OverlineText___RBrct) {
121
+ :where(.OverlineText-module__hop-OverlineText___SJfV5) {
122
122
  --hop-OverlineText-font-family: var(--hop-overline-font-family);
123
123
  --hop-OverlineText-font-size: var(--hop-overline-font-size);
124
124
  --hop-OverlineText-font-weight: var(--hop-overline-font-weight);
@@ -142,26 +142,26 @@
142
142
  text-transform: uppercase;
143
143
  letter-spacing: var(--letter-spacing);
144
144
  }
145
- .OverlineText-module__hop-OverlineText__text___ue5ai {
145
+ .OverlineText-module__hop-OverlineText__text___tJHFh {
146
146
  box-sizing: border-box;
147
147
  }
148
- .OverlineText-module__hop-OverlineText__text___ue5ai::before,
149
- .OverlineText-module__hop-OverlineText__text___ue5ai::after {
148
+ .OverlineText-module__hop-OverlineText__text___tJHFh::before,
149
+ .OverlineText-module__hop-OverlineText__text___tJHFh::after {
150
150
  content: "";
151
151
  display: block;
152
152
  box-sizing: border-box;
153
153
  inline-size: 0;
154
154
  block-size: 0;
155
155
  }
156
- .OverlineText-module__hop-OverlineText__text___ue5ai::before {
156
+ .OverlineText-module__hop-OverlineText__text___tJHFh::before {
157
157
  margin-block-end: var(--bottom-offset);
158
158
  }
159
- .OverlineText-module__hop-OverlineText__text___ue5ai::after {
159
+ .OverlineText-module__hop-OverlineText__text___tJHFh::after {
160
160
  margin-block-start: var(--top-offset);
161
161
  }
162
162
 
163
163
  /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/text/src/Text.module.css/#css-module-data */
164
- .Text-module__hop-Text___Mm3Jn {
164
+ .Text-module__hop-Text___yveew {
165
165
  --hop-Text-xs-font-size: var(--hop-body-xs-font-size);
166
166
  --hop-Text-xs-font-family: var(--hop-body-xs-font-family);
167
167
  --hop-Text-xs-font-weight: var(--hop-body-xs-font-weight);
@@ -191,49 +191,49 @@
191
191
  --hop-Text-inherit-size-font-weight: inherit;
192
192
  --hop-Text-inherit-size-line-height: inherit;
193
193
  }
194
- :where(.Text-module__hop-Text___Mm3Jn) {
194
+ :where(.Text-module__hop-Text___yveew) {
195
195
  font-family: var(--font-family);
196
196
  font-size: var(--font-size);
197
197
  font-weight: var(--font-weight);
198
198
  line-height: var(--line-height);
199
199
  }
200
- :where(.Text-module__hop-Text--xs___Ce3vK) {
200
+ :where(.Text-module__hop-Text--xs___xgUXf) {
201
201
  --font-size: var(--hop-Text-xs-font-size);
202
202
  --font-family: var(--hop-Text-xs-font-family);
203
203
  --font-weight: var(--hop-Text-xs-font-weight);
204
204
  --line-height: var(--hop-Text-xs-line-height);
205
205
  }
206
- :where(.Text-module__hop-Text--sm___UcccH) {
206
+ :where(.Text-module__hop-Text--sm___lH9j4) {
207
207
  --font-size: var(--hop-Text-sm-font-size);
208
208
  --font-family: var(--hop-Text-sm-font-family);
209
209
  --font-weight: var(--hop-Text-sm-font-weight);
210
210
  --line-height: var(--hop-Text-sm-line-height);
211
211
  }
212
- :where(.Text-module__hop-Text--md___YcqAT) {
212
+ :where(.Text-module__hop-Text--md___d08VF) {
213
213
  --font-size: var(--hop-Text-md-font-size);
214
214
  --font-family: var(--hop-Text-md-font-family);
215
215
  --font-weight: var(--hop-Text-md-font-weight);
216
216
  --line-height: var(--hop-Text-md-line-height);
217
217
  }
218
- :where(.Text-module__hop-Text--lg___RaBlz) {
218
+ :where(.Text-module__hop-Text--lg___b8Y3o) {
219
219
  --font-size: var(--hop-Text-lg-font-size);
220
220
  --font-family: var(--hop-Text-lg-font-family);
221
221
  --font-weight: var(--hop-Text-lg-font-weight);
222
222
  --line-height: var(--hop-Text-lg-line-height);
223
223
  }
224
- :where(.Text-module__hop-Text--xl___jBI5K) {
224
+ :where(.Text-module__hop-Text--xl___XLdFv) {
225
225
  --font-size: var(--hop-Text-xl-font-size);
226
226
  --font-family: var(--hop-Text-xl-font-family);
227
227
  --font-weight: var(--hop-Text-xl-font-weight);
228
228
  --line-height: var(--hop-Text-xl-line-height);
229
229
  }
230
- :where(.Text-module__hop-Text--2xl___jrcN4) {
230
+ :where(.Text-module__hop-Text--2xl___1bdXc) {
231
231
  --font-size: var(--hop-Text-2xl-font-size);
232
232
  --font-family: var(--hop-Text-2xl-font-family);
233
233
  --font-weight: var(--hop-Text-2xl-font-weight);
234
234
  --line-height: var(--hop-Text-2xl-line-height);
235
235
  }
236
- :where(.Text-module__hop-Text--inherit___Rc2fv) {
236
+ :where(.Text-module__hop-Text--inherit___kWQXK) {
237
237
  --font-size: var(--hop-Text-inherit-size-font-size);
238
238
  --font-family: var(--hop-Text-inherit-size-font-family);
239
239
  --font-weight: var(--hop-Text-inherit-size-font-weight);
@@ -241,7 +241,7 @@
241
241
  }
242
242
 
243
243
  /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/typography/paragraph/src/Paragraph.module.css/#css-module-data */
244
- .Paragraph-module__hop-Paragraph___AWLqo {
244
+ .Paragraph-module__hop-Paragraph___zZ15s {
245
245
  --hop-Paragraph-xs-margin-bottom: calc(.625rem * .75);
246
246
  --hop-Paragraph-sm-margin-bottom: calc(.75rem * .75);
247
247
  --hop-Paragraph-md-margin-bottom: calc(.875rem * .75);
@@ -253,33 +253,33 @@
253
253
  margin-block-end: var(--margin-block-end);
254
254
  overflow-wrap: break-word;
255
255
  }
256
- .Paragraph-module__hop-Paragraph___AWLqo:last-child {
256
+ .Paragraph-module__hop-Paragraph___zZ15s:last-child {
257
257
  --margin-block-end: 0;
258
258
  }
259
- .Paragraph-module__hop-Paragraph--xs___us82- {
259
+ .Paragraph-module__hop-Paragraph--xs___NLLnZ {
260
260
  --margin-block-end: var(--hop-Paragraph-xs-margin-bottom);
261
261
  }
262
- .Paragraph-module__hop-Paragraph--sm___oQXcj {
262
+ .Paragraph-module__hop-Paragraph--sm___FEYlD {
263
263
  --margin-block-end: var(--hop-Paragraph-sm-margin-bottom);
264
264
  }
265
- .Paragraph-module__hop-Paragraph--md___ONjfY {
265
+ .Paragraph-module__hop-Paragraph--md___n-RPv {
266
266
  --margin-block-end: var(--hop-Paragraph-md-margin-bottom);
267
267
  }
268
- .Paragraph-module__hop-Paragraph--lg___MwXba {
268
+ .Paragraph-module__hop-Paragraph--lg___ewPRG {
269
269
  --margin-block-end: var(--hop-Paragraph-lg-margin-bottom);
270
270
  }
271
- .Paragraph-module__hop-Paragraph--xl___G0-ya {
271
+ .Paragraph-module__hop-Paragraph--xl___8Cgfv {
272
272
  --margin-block-end: var(--hop-Paragraph-xl-margin-bottom);
273
273
  }
274
- .Paragraph-module__hop-Paragraph--2xl___RNqOG {
274
+ .Paragraph-module__hop-Paragraph--2xl___fkck6 {
275
275
  --margin-block-end: var(--hop-Paragraph-2xl-margin-bottom);
276
276
  }
277
- .Paragraph-module__hop-Paragraph--inherit___EaPeU {
277
+ .Paragraph-module__hop-Paragraph--inherit___mhv9Y {
278
278
  --margin-block-end: var(--hop-Paragraph-inherit-margin-bottom);
279
279
  }
280
280
 
281
281
  /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/icon-list/src/IconList.module.css/#css-module-data */
282
- .IconList-module__hop-IconList___z6OUy {
282
+ .IconList-module__hop-IconList___BFQXJ {
283
283
  --hop-IconList-gap: var(--hop-space-inline-xs);
284
284
  display: flex;
285
285
  flex-wrap: wrap;
@@ -288,7 +288,7 @@
288
288
  }
289
289
 
290
290
  /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/spinner/src/Spinner.module.css/#css-module-data */
291
- @keyframes Spinner-module__spin___SnxzS {
291
+ @keyframes Spinner-module__spin___EqTZ5 {
292
292
  0% {
293
293
  transform: rotate(0deg);
294
294
  }
@@ -296,7 +296,7 @@
296
296
  transform: rotate(360deg);
297
297
  }
298
298
  }
299
- .Spinner-module__hop-Spinner___Oa3G6 {
299
+ .Spinner-module__hop-Spinner___BpFRY {
300
300
  --hop-Spinner-border-radius: var(--hop-shape-circle);
301
301
  --hop-Spinner-sm-wheel-size: 1rem;
302
302
  --hop-Spinner-md-wheel-size: 1.25rem;
@@ -304,7 +304,7 @@
304
304
  --hop-Spinner-track-width: 0.125rem;
305
305
  --hop-Spinner-track-opacity: 0.2;
306
306
  --hop-Spinner-track-border: var(--hop-Spinner-track-width) solid currentcolor;
307
- --hop-Spinner-fill-animation: Spinner-module__spin___SnxzS .8s infinite linear;
307
+ --hop-Spinner-fill-animation: Spinner-module__spin___EqTZ5 .8s infinite linear;
308
308
  --hop-Spinner-fill-animation-reduced-motion-duration: 2s;
309
309
  --hop-Spinner-fill-border: var(--hop-Spinner-track-width) solid transparent;
310
310
  --hop-Spinner-fill-border-inline-start: var(--hop-Spinner-track-width) solid currentcolor;
@@ -315,19 +315,19 @@
315
315
  align-items: center;
316
316
  box-sizing: border-box;
317
317
  }
318
- .Spinner-module__hop-Spinner--sm___0XkYa {
318
+ .Spinner-module__hop-Spinner--sm___mDnx9 {
319
319
  --width: var(--hop-Spinner-sm-wheel-size);
320
320
  --height: var(--hop-Spinner-sm-wheel-size);
321
321
  }
322
- .Spinner-module__hop-Spinner--md___dWYu5 {
322
+ .Spinner-module__hop-Spinner--md___CACp9 {
323
323
  --width: var(--hop-Spinner-md-wheel-size);
324
324
  --height: var(--hop-Spinner-md-wheel-size);
325
325
  }
326
- .Spinner-module__hop-Spinner--lg___qpxbh {
326
+ .Spinner-module__hop-Spinner--lg___jns7u {
327
327
  --width: var(--hop-Spinner-lg-wheel-size);
328
328
  --height: var(--hop-Spinner-lg-wheel-size);
329
329
  }
330
- .Spinner-module__hop-Spinner__track___Yntu2 {
330
+ .Spinner-module__hop-Spinner__track___l5dZk {
331
331
  grid-area: spinner;
332
332
  box-sizing: border-box;
333
333
  inline-size: var(--width, var(--hop-Spinner-md-wheel-size));
@@ -336,7 +336,7 @@
336
336
  border: var(--hop-Spinner-track-border);
337
337
  border-radius: var(--hop-Spinner-border-radius);
338
338
  }
339
- .Spinner-module__hop-Spinner__fill___bJDXw {
339
+ .Spinner-module__hop-Spinner__fill___F-mR8 {
340
340
  grid-area: spinner;
341
341
  box-sizing: border-box;
342
342
  inline-size: var(--width, var(--hop-Spinner-md-wheel-size));
@@ -347,125 +347,118 @@
347
347
  animation: var(--hop-Spinner-fill-animation);
348
348
  }
349
349
  @media (prefers-reduced-motion: reduce) {
350
- .Spinner-module__hop-Spinner__fill___bJDXw {
350
+ .Spinner-module__hop-Spinner__fill___F-mR8 {
351
351
  animation-duration: var(--hop-Spinner-fill-animation-reduced-motion-duration);
352
352
  }
353
353
  }
354
- .Spinner-module__hop-Spinner__label___oVU-P {
354
+ .Spinner-module__hop-Spinner__label___dAnZw {
355
355
  grid-area: label;
356
356
  margin-inline-start: var(--hop-Spinner-label-margin-inline-start);
357
357
  }
358
358
 
359
359
  /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/buttons/src/ToggleButton.module.css/#css-module-data */
360
- .ToggleButton-module__hop-ToggleButton___cQggT {
361
- --hop-ToggleButton-border-radius: var(--hop-shape-rounded-md);
362
- --hop-ToggleButton-focus-ring-color: var(--hop-primary-border-focus);
363
- --hop-ToggleButton-column-gap: var(--hop-space-inline-xs);
364
- --hop-ToggleButton-icon-only-column-gap: 0;
365
- --hop-ToggleButton-outline-size: var(--hop-space-20);
366
- --hop-ToggleButton-border-size: var(--hop-space-10);
367
- --hop-ToggleButton-text-underline-offset: var(--hop-space-20);
368
- --hop-ToggleButton-icon-only-padding: 0;
369
- --hop-ToggleButton-sm-height: 2rem;
370
- --hop-ToggleButton-md-height: 2.5rem;
371
- --hop-ToggleButton-sm-padding: 0 var(--hop-space-inset-md);
372
- --hop-ToggleButton-md-padding: 0 var(--hop-space-inset-md);
373
- --hop-ToggleButton-color-disabled: var(--hop-neutral-text-disabled);
374
- --hop-ToggleButton-background-color-disabled: var(--hop-neutral-surface-disabled);
375
- --hop-ToggleButton-border-disabled: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-background-color-disabled);
376
- --hop-ToggleButton-primary-color: var(--hop-primary-text-strong);
377
- --hop-ToggleButton-primary-color-hover: var(--hop-primary-text-strong-hover);
378
- --hop-ToggleButton-primary-color-pressed: var(--hop-primary-text-strong);
379
- --hop-ToggleButton-primary-color-selected: var(--hop-primary-text-selected);
380
- --hop-ToggleButton-primary-background-color: var(--hop-primary-surface-strong);
381
- --hop-ToggleButton-primary-background-color-hover: var(--hop-primary-surface-strong-hover);
382
- --hop-ToggleButton-primary-background-color-pressed: var(--hop-primary-surface-strong-press);
383
- --hop-ToggleButton-primary-background-color-selected: var(--hop-primary-surface-selected);
384
- --hop-ToggleButton-primary-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-primary-background-color);
385
- --hop-ToggleButton-primary-border-hover: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-primary-background-color-hover);
386
- --hop-ToggleButton-primary-border-pressed: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-primary-background-color-pressed);
387
- --hop-ToggleButton-primary-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-primary-border-selected);
388
- --hop-ToggleButton-primary-spinner-color: var(--hop-primary-icon-strong);
389
- --hop-ToggleButton-secondary-color: var(--hop-neutral-text);
390
- --hop-ToggleButton-secondary-color-hover: var(--hop-neutral-text-hover);
391
- --hop-ToggleButton-secondary-color-pressed: var(--hop-neutral-text-press);
392
- --hop-ToggleButton-secondary-color-selected: var(--hop-neutral-text-selected);
393
- --hop-ToggleButton-secondary-background-color: var(--hop-neutral-surface);
394
- --hop-ToggleButton-secondary-background-color-hover: var(--hop-neutral-surface-hover);
395
- --hop-ToggleButton-secondary-background-color-pressed: var(--hop-neutral-surface-press);
396
- --hop-ToggleButton-secondary-background-color-selected: var(--hop-neutral-surface-selected);
397
- --hop-ToggleButton-secondary-border: var(--hop-ToggleButton-border-size) solid var(--hop-neutral-border-strong);
398
- --hop-ToggleButton-secondary-border-hover: var(--hop-ToggleButton-border-size) solid var(--hop-neutral-border-strong-hover);
399
- --hop-ToggleButton-secondary-border-pressed: var(--hop-ToggleButton-border-size) solid var(--hop-neutral-border-strong);
400
- --hop-ToggleButton-secondary-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-neutral-border-selected);
401
- --hop-ToggleButton-secondary-spinner-color: var(--hop-neutral-icon);
402
- --hop-ToggleButton-upsell-color: var(--hop-upsell-text);
403
- --hop-ToggleButton-upsell-color-hover: var(--hop-upsell-text-hover);
404
- --hop-ToggleButton-upsell-color-pressed: var(--hop-upsell-text-press);
405
- --hop-ToggleButton-upsell-color-selected: var(--hop-upsell-text-selected);
406
- --hop-ToggleButton-upsell-background-color: var(--hop-upsell-surface);
407
- --hop-ToggleButton-upsell-background-color-hover: var(--hop-upsell-surface-hover);
408
- --hop-ToggleButton-upsell-background-color-pressed: var(--hop-upsell-surface-press);
409
- --hop-ToggleButton-upsell-background-color-selected: var(--hop-upsell-surface-selected);
410
- --hop-ToggleButton-upsell-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-upsell-background-color);
411
- --hop-ToggleButton-upsell-border-hover: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-upsell-background-color-hover);
412
- --hop-ToggleButton-upsell-border-pressed: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-upsell-background-color-pressed);
413
- --hop-ToggleButton-upsell-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-upsell-border-selected);
414
- --hop-ToggleButton-upsell-spinner-color: var(--hop-upsell-icon);
415
- --hop-ToggleButton-danger-color: var(--hop-danger-text-strong);
416
- --hop-ToggleButton-danger-color-hover: var(--hop-danger-text-strong-hover);
417
- --hop-ToggleButton-danger-color-pressed: var(--hop-danger-text-strong-hover);
418
- --hop-ToggleButton-danger-color-selected: var(--hop-danger-text-selected);
419
- --hop-ToggleButton-danger-background-color: var(--hop-danger-surface-strong);
420
- --hop-ToggleButton-danger-background-color-hover: var(--hop-danger-surface-strong-hover);
421
- --hop-ToggleButton-danger-background-color-pressed: var(--hop-danger-surface-press);
422
- --hop-ToggleButton-danger-background-color-selected: var(--hop-danger-surface-selected);
423
- --hop-ToggleButton-danger-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-danger-background-color);
424
- --hop-ToggleButton-danger-border-hover: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-danger-background-color-hover);
425
- --hop-ToggleButton-danger-border-pressed: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-danger-background-color-pressed);
426
- --hop-ToggleButton-danger-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-danger-border-selected);
427
- --hop-ToggleButton-danger-spinner-color: var(--hop-primary-icon-strong);
428
- --hop-ToggleButton-ghost-color-disabled: var(--hop-neutral-text-disabled);
429
- --hop-ToggleButton-ghost-background-color-disabled: transparent;
430
- --hop-ToggleButton-ghost-border-disabled: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-background-color-disabled);
431
- --hop-ToggleButton-ghost-primary-color: var(--hop-primary-text);
432
- --hop-ToggleButton-ghost-primary-color-hover: var(--hop-primary-text-hover);
433
- --hop-ToggleButton-ghost-primary-color-pressed: var(--hop-primary-text-press);
434
- --hop-ToggleButton-ghost-primary-background-color: transparent;
435
- --hop-ToggleButton-ghost-primary-background-color-hover: var(--hop-neutral-surface-hover);
436
- --hop-ToggleButton-ghost-primary-background-color-pressed: var(--hop-primary-surface-weak-press);
437
- --hop-ToggleButton-ghost-primary-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-primary-background-color);
438
- --hop-ToggleButton-ghost-primary-border-hover: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-primary-background-color-hover);
439
- --hop-ToggleButton-ghost-primary-border-pressed: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-primary-background-color-pressed);
440
- --hop-ToggleButton-ghost-primary-spinner-color: var(--hop-neutral-icon);
441
- --hop-ToggleButton-ghost-secondary-color: var(--hop-neutral-text-weak);
442
- --hop-ToggleButton-ghost-secondary-color-hover: var(--hop-neutral-text-weak-hover);
443
- --hop-ToggleButton-ghost-secondary-color-pressed: var(--hop-neutral-text-weak-press);
444
- --hop-ToggleButton-ghost-secondary-background-color: transparent;
445
- --hop-ToggleButton-ghost-secondary-background-color-hover: var(--hop-neutral-surface-hover);
446
- --hop-ToggleButton-ghost-secondary-background-color-pressed: var(--hop-neutral-surface-press);
447
- --hop-ToggleButton-ghost-secondary-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-secondary-background-color);
448
- --hop-ToggleButton-ghost-secondary-border-hover: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-secondary-background-color-hover);
449
- --hop-ToggleButton-ghost-secondary-border-pressed: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-secondary-background-color-pressed);
450
- --hop-ToggleButton-ghost-secondary-spinner-color: var(--hop-neutral-icon);
451
- --hop-ToggleButton-ghost-danger-color: var(--hop-danger-text-weak);
452
- --hop-ToggleButton-ghost-danger-color-hover: var(--hop-danger-text-hover);
453
- --hop-ToggleButton-ghost-danger-color-pressed: var(--hop-danger-text-press);
454
- --hop-ToggleButton-ghost-danger-background-color: transparent;
455
- --hop-ToggleButton-ghost-danger-background-color-hover: var(--hop-neutral-surface-hover);
456
- --hop-ToggleButton-ghost-danger-background-color-pressed: var(--hop-danger-surface-weak-press);
457
- --hop-ToggleButton-ghost-danger-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-danger-background-color);
458
- --hop-ToggleButton-ghost-danger-border-hover: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-danger-background-color-hover);
459
- --hop-ToggleButton-ghost-danger-border-pressed: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-danger-background-color-pressed);
460
- --hop-ToggleButton-ghost-danger-spinner-color: var(--hop-neutral-icon);
360
+ .Button-module__hop-Button___pFvZM {
361
+ --hop-Button-border-radius: var(--hop-shape-rounded-md);
362
+ --hop-Button-focus-ring-color: var(--hop-primary-border-focus);
363
+ --hop-Button-column-gap: var(--hop-space-inline-xs);
364
+ --hop-Button-icon-only-column-gap: 0;
365
+ --hop-Button-outline-size: var(--hop-space-20);
366
+ --hop-Button-border-size: var(--hop-space-10);
367
+ --hop-Button-text-underline-offset: var(--hop-space-20);
368
+ --hop-Button-icon-only-padding: 0;
369
+ --hop-Button-xs-height: 1.5rem;
370
+ --hop-Button-sm-height: 2rem;
371
+ --hop-Button-md-height: 2.5rem;
372
+ --hop-Button-xs-padding: 0 var(--hop-space-inset-sm);
373
+ --hop-Button-sm-padding: 0 var(--hop-space-inset-md);
374
+ --hop-Button-md-padding: 0 var(--hop-space-inset-md);
375
+ --hop-Button-ghost-xs-padding: 0 var(--hop-space-inset-xs);
376
+ --hop-Button-ghost-sm-padding: 0 var(--hop-space-inset-xs);
377
+ --hop-Button-ghost-md-padding: 0 var(--hop-space-inset-sm);
378
+ --hop-Button-color-disabled: var(--hop-neutral-text-disabled);
379
+ --hop-Button-background-color-disabled: var(--hop-neutral-surface-disabled);
380
+ --hop-Button-border-disabled: var(--hop-Button-border-size) solid var(--hop-Button-background-color-disabled);
381
+ --hop-Button-ghost-color-disabled: var(--hop-neutral-text-disabled);
382
+ --hop-Button-ghost-background-color-disabled: transparent;
383
+ --hop-Button-ghost-border-disabled: var(--hop-Button-border-size) solid var(--hop-Button-ghost-background-color-disabled);
384
+ --hop-Button-primary-color: var(--hop-primary-text-strong);
385
+ --hop-Button-primary-color-hover: var(--hop-primary-text-strong-hover);
386
+ --hop-Button-primary-color-pressed: var(--hop-primary-text-strong);
387
+ --hop-Button-primary-background-color: var(--hop-primary-surface-strong);
388
+ --hop-Button-primary-background-color-hover: var(--hop-primary-surface-strong-hover);
389
+ --hop-Button-primary-background-color-pressed: var(--hop-primary-surface-strong-press);
390
+ --hop-Button-primary-border: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color);
391
+ --hop-Button-primary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color-hover);
392
+ --hop-Button-primary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-primary-background-color-pressed);
393
+ --hop-Button-primary-spinner-color: var(--hop-primary-icon-strong);
394
+ --hop-Button-secondary-color: var(--hop-neutral-text);
395
+ --hop-Button-secondary-color-hover: var(--hop-neutral-text-hover);
396
+ --hop-Button-secondary-color-pressed: var(--hop-neutral-text-press);
397
+ --hop-Button-secondary-background-color: var(--hop-neutral-surface);
398
+ --hop-Button-secondary-background-color-hover: var(--hop-neutral-surface-hover);
399
+ --hop-Button-secondary-background-color-pressed: var(--hop-neutral-surface-press);
400
+ --hop-Button-secondary-border: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong);
401
+ --hop-Button-secondary-border-hover: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong-hover);
402
+ --hop-Button-secondary-border-pressed: var(--hop-Button-border-size) solid var(--hop-neutral-border-strong);
403
+ --hop-Button-secondary-spinner-color: var(--hop-neutral-icon);
404
+ --hop-Button-upsell-color: var(--hop-upsell-text);
405
+ --hop-Button-upsell-color-hover: var(--hop-upsell-text-hover);
406
+ --hop-Button-upsell-color-pressed: var(--hop-upsell-text-press);
407
+ --hop-Button-upsell-background-color: var(--hop-upsell-surface);
408
+ --hop-Button-upsell-background-color-hover: var(--hop-upsell-surface-hover);
409
+ --hop-Button-upsell-background-color-pressed: var(--hop-upsell-surface-press);
410
+ --hop-Button-upsell-border: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color);
411
+ --hop-Button-upsell-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color-hover);
412
+ --hop-Button-upsell-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-upsell-background-color-pressed);
413
+ --hop-Button-upsell-spinner-color: var(--hop-upsell-icon);
414
+ --hop-Button-danger-color: var(--hop-danger-text-strong);
415
+ --hop-Button-danger-color-hover: var(--hop-danger-text-strong-hover);
416
+ --hop-Button-danger-color-pressed: var(--hop-danger-text-strong-hover);
417
+ --hop-Button-danger-background-color: var(--hop-danger-surface-strong);
418
+ --hop-Button-danger-background-color-hover: var(--hop-danger-surface-strong-hover);
419
+ --hop-Button-danger-background-color-pressed: var(--hop-danger-surface-press);
420
+ --hop-Button-danger-border: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color);
421
+ --hop-Button-danger-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color-hover);
422
+ --hop-Button-danger-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-danger-background-color-pressed);
423
+ --hop-Button-danger-spinner-color: var(--hop-primary-icon-strong);
424
+ --hop-Button-ghost-primary-color: var(--hop-primary-text);
425
+ --hop-Button-ghost-primary-color-hover: var(--hop-primary-text-hover);
426
+ --hop-Button-ghost-primary-color-pressed: var(--hop-primary-text-press);
427
+ --hop-Button-ghost-primary-background-color: transparent;
428
+ --hop-Button-ghost-primary-background-color-hover: var(--hop-neutral-surface-hover);
429
+ --hop-Button-ghost-primary-background-color-pressed: var(--hop-primary-surface-weak-press);
430
+ --hop-Button-ghost-primary-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color);
431
+ --hop-Button-ghost-primary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color-hover);
432
+ --hop-Button-ghost-primary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-primary-background-color-pressed);
433
+ --hop-Button-ghost-primary-spinner-color: var(--hop-neutral-icon);
434
+ --hop-Button-ghost-secondary-color: var(--hop-neutral-text-weak);
435
+ --hop-Button-ghost-secondary-color-hover: var(--hop-neutral-text-weak-hover);
436
+ --hop-Button-ghost-secondary-color-pressed: var(--hop-neutral-text-weak-press);
437
+ --hop-Button-ghost-secondary-background-color: transparent;
438
+ --hop-Button-ghost-secondary-background-color-hover: var(--hop-neutral-surface-hover);
439
+ --hop-Button-ghost-secondary-background-color-pressed: var(--hop-neutral-surface-press);
440
+ --hop-Button-ghost-secondary-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color);
441
+ --hop-Button-ghost-secondary-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color-hover);
442
+ --hop-Button-ghost-secondary-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-secondary-background-color-pressed);
443
+ --hop-Button-ghost-secondary-spinner-color: var(--hop-neutral-icon);
444
+ --hop-Button-ghost-danger-color: var(--hop-danger-text-weak);
445
+ --hop-Button-ghost-danger-color-hover: var(--hop-danger-text-hover);
446
+ --hop-Button-ghost-danger-color-pressed: var(--hop-danger-text-press);
447
+ --hop-Button-ghost-danger-background-color: transparent;
448
+ --hop-Button-ghost-danger-background-color-hover: var(--hop-neutral-surface-hover);
449
+ --hop-Button-ghost-danger-background-color-pressed: var(--hop-danger-surface-weak-press);
450
+ --hop-Button-ghost-danger-border: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color);
451
+ --hop-Button-ghost-danger-border-hover: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color-hover);
452
+ --hop-Button-ghost-danger-border-pressed: var(--hop-Button-border-size) solid var(--hop-Button-ghost-danger-background-color-pressed);
453
+ --hop-Button-ghost-danger-spinner-color: var(--hop-neutral-icon);
461
454
  --inline-size: max-content;
462
- --block-size: var(--hop-ToggleButton-md-height);
455
+ --block-size: var(--hop-Button-md-height);
463
456
  --background-color: var(--hop-primary-surface-strong);
464
457
  --color: var(--hop-primary-text-strong);
465
- --column-gap: var(--hop-ToggleButton-column-gap);
458
+ --column-gap: var(--hop-Button-column-gap);
466
459
  --spinner: var(--hop-primary-icon-strong);
467
460
  --border: 0;
468
- --padding: var(--hop-ToggleButton-md-padding);
461
+ --padding: var(--hop-Button-md-padding);
469
462
  --text-underline: none;
470
463
  cursor: pointer;
471
464
  position: relative;
@@ -483,247 +476,409 @@
483
476
  white-space: nowrap;
484
477
  background-color: var(--background-color);
485
478
  border: var(--border);
486
- border-radius: var(--hop-ToggleButton-border-radius);
479
+ border-radius: var(--hop-Button-border-radius);
487
480
  outline: none;
488
- outline-offset: var(--hop-ToggleButton-outline-size);
481
+ outline-offset: var(--hop-Button-outline-size);
489
482
  transition:
490
483
  color var(--hop-easing-duration-2) var(--hop-easing-productive),
491
484
  background-color var(--hop-easing-duration-2) var(--hop-easing-productive),
492
485
  border var(--hop-easing-duration-2) var(--hop-easing-productive);
493
486
  }
494
- .ToggleButton-module__hop-ToggleButton--fluid___rl9FX {
487
+ .Button-module__hop-Button--fluid___-QhTX {
495
488
  --inline-size: 100%;
496
489
  }
497
- .ToggleButton-module__hop-ToggleButton--sm___-x-OZ {
498
- --block-size: var(--hop-ToggleButton-sm-height);
499
- --padding: var(--hop-ToggleButton-sm-padding);
490
+ .Button-module__hop-Button--xs___8Z6Fg {
491
+ --block-size: var(--hop-Button-xs-height);
492
+ --padding: var(--hop-Button-xs-padding);
493
+ }
494
+ .Button-module__hop-Button--xs___8Z6Fg[class*=--ghost] {
495
+ --padding: var(--hop-Button-ghost-xs-padding);
496
+ }
497
+ .Button-module__hop-Button--sm___jcXzi {
498
+ --block-size: var(--hop-Button-sm-height);
499
+ --padding: var(--hop-Button-sm-padding);
500
500
  }
501
- .ToggleButton-module__hop-ToggleButton--icon-only___W2v-S {
502
- --column-gap: var(--hop-ToggleButton-icon-only-column-gap);
503
- --padding: var(--hop-ToggleButton-icon-only-padding);
501
+ .Button-module__hop-Button--sm___jcXzi[class*=--ghost] {
502
+ --padding: var(--hop-Button-ghost-sm-padding);
503
+ }
504
+ .Button-module__hop-Button--md___-Hyel[class*=--ghost] {
505
+ --padding: var(--hop-Button-ghost-md-padding);
506
+ }
507
+ .Button-module__hop-Button--icon-only___ZHooM {
508
+ --column-gap: var(--hop-Button-icon-only-column-gap);
509
+ --padding: var(--hop-Button-icon-only-padding);
504
510
  aspect-ratio: 1;
505
511
  }
506
- .ToggleButton-module__hop-ToggleButton--primary___-CkAf {
507
- --background-color: var(--hop-ToggleButton-primary-background-color);
508
- --color: var(--hop-ToggleButton-primary-color);
509
- --border: var(--hop-ToggleButton-primary-border);
510
- --spinner-color: var(--hop-ToggleButton-primary-spinner-color);
512
+ .Button-module__hop-Button--primary___52x1K {
513
+ --background-color: var(--hop-Button-primary-background-color);
514
+ --color: var(--hop-Button-primary-color);
515
+ --border: var(--hop-Button-primary-border);
516
+ --spinner-color: var(--hop-Button-primary-spinner-color);
517
+ }
518
+ .Button-module__hop-Button--primary___52x1K[data-hovered],
519
+ .Button-module__hop-Button--primary___52x1K[data-focus-visible] {
520
+ --background-color: var(--hop-Button-primary-background-color-hover);
521
+ --color: var(--hop-Button-primary-color-hover);
522
+ --border: var(--hop-Button-primary-border-hover);
523
+ }
524
+ .Button-module__hop-Button--primary___52x1K[data-pressed] {
525
+ --background-color: var(--hop-Button-primary-background-color-pressed);
526
+ --color: var(--hop-Button-primary-color-pressed);
527
+ --border: var(--hop-Button-primary-border-pressed);
528
+ }
529
+ .Button-module__hop-Button--secondary___uDkfy {
530
+ --background-color: var(--hop-Button-secondary-background-color);
531
+ --color: var(--hop-Button-secondary-color);
532
+ --border: var(--hop-Button-secondary-border);
533
+ --spinner-color: var(--hop-Button-secondary-spinner-color);
534
+ }
535
+ .Button-module__hop-Button--secondary___uDkfy[data-hovered],
536
+ .Button-module__hop-Button--secondary___uDkfy[data-focus-visible] {
537
+ --background-color: var(--hop-Button-secondary-background-color-hover);
538
+ --color: var(--hop-Button-secondary-color-hover);
539
+ --border: var(--hop-Button-secondary-border-hover);
540
+ }
541
+ .Button-module__hop-Button--secondary___uDkfy[data-pressed] {
542
+ --background-color: var(--hop-Button-secondary-background-color-pressed);
543
+ --color: var(--hop-Button-secondary-color-pressed);
544
+ --border: var(--hop-Button-secondary-border-pressed);
545
+ }
546
+ .Button-module__hop-Button--upsell___3jmtI {
547
+ --background-color: var(--hop-Button-upsell-background-color);
548
+ --color: var(--hop-Button-upsell-color);
549
+ --border: var(--hop-Button-upsell-border);
550
+ --spinner-color: var(--hop-Button-upsell-spinner-color);
551
+ }
552
+ .Button-module__hop-Button--upsell___3jmtI[data-hovered],
553
+ .Button-module__hop-Button--upsell___3jmtI[data-focus-visible] {
554
+ --background-color: var(--hop-Button-upsell-background-color-hover);
555
+ --color: var(--hop-Button-upsell-color-hover);
556
+ --border: var(--hop-Button-upsell-border-hover);
557
+ }
558
+ .Button-module__hop-Button--upsell___3jmtI[data-pressed] {
559
+ --background-color: var(--hop-Button-upsell-background-color-pressed);
560
+ --color: var(--hop-Button-upsell-color-pressed);
561
+ --border: var(--hop-Button-upsell-border-pressed);
562
+ }
563
+ .Button-module__hop-Button--danger___tMXyo {
564
+ --background-color: var(--hop-Button-danger-background-color);
565
+ --color: var(--hop-Button-danger-color);
566
+ --border: var(--hop-Button-danger-border);
567
+ --spinner-color: var(--hop-Button-danger-spinner-color);
568
+ }
569
+ .Button-module__hop-Button--danger___tMXyo[data-hovered],
570
+ .Button-module__hop-Button--danger___tMXyo[data-focus-visible] {
571
+ --background-color: var(--hop-Button-danger-background-color-hover);
572
+ --color: var(--hop-Button-danger-color-hover);
573
+ --border: var(--hop-Button-danger-border-hover);
574
+ }
575
+ .Button-module__hop-Button--danger___tMXyo[data-pressed] {
576
+ --background-color: var(--hop-Button-danger-background-color-pressed);
577
+ --color: var(--hop-Button-danger-color-pressed);
578
+ --border: var(--hop-Button-danger-border-pressed);
579
+ }
580
+ .Button-module__hop-Button--ghost-primary___K1XFC {
581
+ --background-color: var(--hop-Button-ghost-primary-background-color);
582
+ --color: var(--hop-Button-ghost-primary-color);
583
+ --border: var(--hop-Button-ghost-primary-border);
584
+ --spinner-color: var(--hop-Button-ghost-primary-spinner-color);
585
+ }
586
+ .Button-module__hop-Button--ghost-primary___K1XFC[data-hovered],
587
+ .Button-module__hop-Button--ghost-primary___K1XFC[data-focus-visible] {
588
+ --background-color: var(--hop-Button-ghost-primary-background-color-hover);
589
+ --color: var(--hop-Button-ghost-primary-color-hover);
590
+ --border: var(--hop-Button-ghost-primary-border-hover);
591
+ --text-underline: underline;
511
592
  }
512
- .ToggleButton-module__hop-ToggleButton--primary___-CkAf[data-hovered],
513
- .ToggleButton-module__hop-ToggleButton--primary___-CkAf[data-focus-visible] {
514
- --background-color: var(--hop-ToggleButton-primary-background-color-hover);
515
- --color: var(--hop-ToggleButton-primary-color-hover);
516
- --border: var(--hop-ToggleButton-primary-border-hover);
593
+ .Button-module__hop-Button--ghost-primary___K1XFC[data-pressed] {
594
+ --background-color: var(--hop-Button-ghost-primary-background-color-pressed);
595
+ --color: var(--hop-Button-ghost-primary-color-pressed);
596
+ --border: var(--hop-Button-ghost-primary-border-pressed);
597
+ --text-underline: underline;
517
598
  }
518
- .ToggleButton-module__hop-ToggleButton--primary___-CkAf[data-pressed] {
519
- --background-color: var(--hop-ToggleButton-primary-background-color-pressed);
520
- --color: var(--hop-ToggleButton-primary-color-pressed);
521
- --border: var(--hop-ToggleButton-primary-border-pressed);
599
+ .Button-module__hop-Button--ghost-secondary___w7DWH {
600
+ --background-color: var(--hop-Button-ghost-secondary-background-color);
601
+ --color: var(--hop-Button-ghost-secondary-color);
602
+ --border: var(--hop-Button-ghost-secondary-border);
603
+ --spinner-color: var(--hop-Button-ghost-secondary-spinner-color);
604
+ }
605
+ .Button-module__hop-Button--ghost-secondary___w7DWH[data-hovered],
606
+ .Button-module__hop-Button--ghost-secondary___w7DWH[data-focus-visible] {
607
+ --background-color: var(--hop-Button-ghost-secondary-background-color-hover);
608
+ --color: var(--hop-Button-ghost-secondary-color-hover);
609
+ --border: var(--hop-Button-ghost-secondary-border-hover);
610
+ --text-underline: underline;
522
611
  }
523
- .ToggleButton-module__hop-ToggleButton--primary___-CkAf[data-selected] {
524
- --background-color: var(--hop-ToggleButton-primary-background-color-selected);
525
- --color: var(--hop-ToggleButton-primary-color-selected);
526
- --border: var(--hop-ToggleButton-primary-border-selected);
612
+ .Button-module__hop-Button--ghost-secondary___w7DWH[data-pressed] {
613
+ --background-color: var(--hop-Button-ghost-secondary-background-color-pressed);
614
+ --color: var(--hop-Button-ghost-secondary-color-pressed);
615
+ --border: var(--hop-Button-ghost-secondary-border-pressed);
616
+ --text-underline: underline;
527
617
  }
528
- .ToggleButton-module__hop-ToggleButton--secondary___pw82S {
529
- --background-color: var(--hop-ToggleButton-secondary-background-color);
530
- --color: var(--hop-ToggleButton-secondary-color);
531
- --border: var(--hop-ToggleButton-secondary-border);
532
- --spinner-color: var(--hop-ToggleButton-secondary-spinner-color);
618
+ .Button-module__hop-Button--ghost-danger___6yaCm {
619
+ --background-color: var(--hop-Button-ghost-danger-background-color);
620
+ --color: var(--hop-Button-ghost-danger-color);
621
+ --border: var(--hop-Button-ghost-danger-border);
622
+ --spinner-color: var(--hop-Button-ghost-danger-spinner-color);
623
+ }
624
+ .Button-module__hop-Button--ghost-danger___6yaCm[data-hovered],
625
+ .Button-module__hop-Button--ghost-danger___6yaCm[data-focus-visible] {
626
+ --background-color: var(--hop-Button-ghost-danger-background-color-hover);
627
+ --color: var(--hop-Button-ghost-danger-color-hover);
628
+ --border: var(--hop-Button-ghost-danger-border-hover);
629
+ --text-underline: underline;
533
630
  }
534
- .ToggleButton-module__hop-ToggleButton--secondary___pw82S[data-hovered],
535
- .ToggleButton-module__hop-ToggleButton--secondary___pw82S[data-focus-visible] {
536
- --background-color: var(--hop-ToggleButton-secondary-background-color-hover);
537
- --color: var(--hop-ToggleButton-secondary-color-hover);
538
- --border: var(--hop-ToggleButton-secondary-border-hover);
631
+ .Button-module__hop-Button--ghost-danger___6yaCm[data-pressed] {
632
+ --background-color: var(--hop-Button-ghost-danger-background-color-pressed);
633
+ --color: var(--hop-Button-ghost-danger-color-pressed);
634
+ --border: var(--hop-Button-ghost-danger-border-pressed);
635
+ --text-underline: underline;
539
636
  }
540
- .ToggleButton-module__hop-ToggleButton--secondary___pw82S[data-pressed] {
541
- --background-color: var(--hop-ToggleButton-secondary-background-color-pressed);
542
- --color: var(--hop-ToggleButton-secondary-color-pressed);
543
- --border: var(--hop-ToggleButton-secondary-border-pressed);
637
+ .Button-module__hop-Button___pFvZM[data-focus-visible] {
638
+ outline: var(--hop-Button-outline-size) solid var(--hop-Button-focus-ring-color);
544
639
  }
545
- .ToggleButton-module__hop-ToggleButton--secondary___pw82S[data-selected] {
546
- --background-color: var(--hop-ToggleButton-secondary-background-color-selected);
547
- --color: var(--hop-ToggleButton-secondary-color-selected);
548
- --border: var(--hop-ToggleButton-secondary-border-selected);
640
+ .Button-module__hop-Button___pFvZM[data-disabled],
641
+ .Button-module__hop-Button--loading___5FI2m {
642
+ cursor: not-allowed;
549
643
  }
550
- .ToggleButton-module__hop-ToggleButton--upsell___Y7PyT {
551
- --background-color: var(--hop-ToggleButton-upsell-background-color);
552
- --color: var(--hop-ToggleButton-upsell-color);
553
- --border: var(--hop-ToggleButton-upsell-border);
554
- --spinner-color: var(--hop-ToggleButton-upsell-spinner-color);
644
+ .Button-module__hop-Button___pFvZM[data-disabled] {
645
+ --background-color: var(--hop-Button-background-color-disabled);
646
+ --color: var(--hop-Button-color-disabled);
647
+ --border: var(--hop-Button-border-disabled);
648
+ }
649
+ .Button-module__hop-Button___pFvZM[class*=--ghost][data-disabled] {
650
+ --background-color: var(--hop-Button-ghost-background-color-disabled);
651
+ --color: var(--hop-Button-ghost-color-disabled);
652
+ --border: var(--hop-Button-ghost-border-disabled);
653
+ }
654
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button--primary___52x1K {
655
+ --background-color: var(--hop-Button-primary-background-color);
656
+ --color: var(--hop-Button-primary-color);
657
+ --border: var(--hop-Button-primary-border);
658
+ }
659
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button--secondary___uDkfy {
660
+ --background-color: var(--hop-Button-secondary-background-color);
661
+ --color: var(--hop-Button-secondary-color);
662
+ --border: var(--hop-Button-secondary-border);
663
+ }
664
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button--upsell___3jmtI {
665
+ --background-color: var(--hop-Button-upsell-background-color);
666
+ --color: var(--hop-Button-upsell-color);
667
+ --border: var(--hop-Button-upsell-border);
668
+ }
669
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button--danger___tMXyo {
670
+ --background-color: var(--hop-Button-danger-background-color);
671
+ --color: var(--hop-Button-danger-color);
672
+ --border: var(--hop-Button-danger-border);
673
+ }
674
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button--ghost-primary___K1XFC {
675
+ --background-color: var(--hop-Button-ghost-primary-background-color);
676
+ --color: var(--hop-Button-ghost-primary-color);
677
+ --border: var(--hop-Button-ghost-primary-border);
678
+ --text-underline: none;
555
679
  }
556
- .ToggleButton-module__hop-ToggleButton--upsell___Y7PyT[data-hovered],
557
- .ToggleButton-module__hop-ToggleButton--upsell___Y7PyT[data-focus-visible] {
558
- --background-color: var(--hop-ToggleButton-upsell-background-color-hover);
559
- --color: var(--hop-ToggleButton-upsell-color-hover);
560
- --border: var(--hop-ToggleButton-upsell-border-hover);
680
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button--ghost-secondary___w7DWH {
681
+ --background-color: var(--hop-Button-ghost-secondary-background-color);
682
+ --color: var(--hop-Button-ghost-secondary-color);
683
+ --border: var(--hop-Button-ghost-secondary-border);
684
+ --text-underline: none;
561
685
  }
562
- .ToggleButton-module__hop-ToggleButton--upsell___Y7PyT[data-pressed] {
563
- --background-color: var(--hop-ToggleButton-upsell-background-color-pressed);
564
- --color: var(--hop-ToggleButton-upsell-color-pressed);
565
- --border: var(--hop-ToggleButton-upsell-border-pressed);
686
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button--ghost-danger___6yaCm {
687
+ --background-color: var(--hop-Button-ghost-danger-background-color);
688
+ --color: var(--hop-Button-ghost-danger-color);
689
+ --border: var(--hop-Button-ghost-danger-border);
690
+ --text-underline: none;
566
691
  }
567
- .ToggleButton-module__hop-ToggleButton--upsell___Y7PyT[data-selected] {
568
- --background-color: var(--hop-ToggleButton-upsell-background-color-selected);
569
- --color: var(--hop-ToggleButton-upsell-color-selected);
570
- --border: var(--hop-ToggleButton-upsell-border-selected);
692
+ .Button-module__hop-Button__Spinner___IeL-j {
693
+ position: absolute;
694
+ color: var(--spinner-color);
571
695
  }
572
- .ToggleButton-module__hop-ToggleButton--danger___ia5G7 {
573
- --background-color: var(--hop-ToggleButton-danger-background-color);
574
- --color: var(--hop-ToggleButton-danger-color);
575
- --border: var(--hop-ToggleButton-danger-border);
576
- --spinner-color: var(--hop-ToggleButton-danger-spinner-color);
696
+ .Button-module__hop-Button__icon___S-Zrr,
697
+ .Button-module__hop-Button__icon-list___3RaqV {
698
+ flex: 0 0 auto;
699
+ justify-self: end;
700
+ order: 1;
577
701
  }
578
- .ToggleButton-module__hop-ToggleButton--danger___ia5G7[data-hovered],
579
- .ToggleButton-module__hop-ToggleButton--danger___ia5G7[data-focus-visible] {
580
- --background-color: var(--hop-ToggleButton-danger-background-color-hover);
581
- --color: var(--hop-ToggleButton-danger-color-hover);
582
- --border: var(--hop-ToggleButton-danger-border-hover);
702
+ .Button-module__hop-Button__text___IuHAg {
703
+ user-select: none;
704
+ overflow: visible;
705
+ flex: 0 1 auto;
706
+ order: 2;
707
+ font-weight: var(--hop-font-weight-505);
708
+ text-decoration: var(--text-underline);
709
+ text-underline-offset: 0.125rem;
710
+ text-wrap: nowrap;
583
711
  }
584
- .ToggleButton-module__hop-ToggleButton--danger___ia5G7[data-pressed] {
585
- --background-color: var(--hop-ToggleButton-danger-background-color-pressed);
586
- --color: var(--hop-ToggleButton-danger-color-pressed);
587
- --border: var(--hop-ToggleButton-danger-border-pressed);
712
+ .Button-module__hop-Button__end-icon___4bLjb,
713
+ .Button-module__hop-Button__end-icon-list___jhqpr {
714
+ flex: 0 0 auto;
715
+ order: 3;
588
716
  }
589
- .ToggleButton-module__hop-ToggleButton--danger___ia5G7[data-selected] {
590
- --background-color: var(--hop-ToggleButton-danger-background-color-selected);
591
- --color: var(--hop-ToggleButton-danger-color-selected);
592
- --border: var(--hop-ToggleButton-danger-border-selected);
717
+ .Button-module__hop-Button___pFvZM .Button-module__hop-Button__icon-list___3RaqV,
718
+ .Button-module__hop-Button___pFvZM .Button-module__hop-Button__end-icon-list___jhqpr {
719
+ flex-wrap: nowrap;
593
720
  }
594
- .ToggleButton-module__hop-ToggleButton--ghost-primary___-Rc5u {
595
- --background-color: var(--hop-ToggleButton-ghost-primary-background-color);
596
- --color: var(--hop-ToggleButton-ghost-primary-color);
597
- --border: var(--hop-ToggleButton-ghost-primary-border);
598
- --spinner-color: var(--hop-ToggleButton-ghost-primary-spinner-color);
721
+ .Button-module__hop-Button--loading___5FI2m.Button-module__hop-Button___pFvZM > *:not(.Button-module__hop-Button__Spinner___IeL-j) {
722
+ opacity: 0;
599
723
  }
600
- .ToggleButton-module__hop-ToggleButton--ghost-primary___-Rc5u[data-hovered],
601
- .ToggleButton-module__hop-ToggleButton--ghost-primary___-Rc5u[data-focus-visible] {
602
- --background-color: var(--hop-ToggleButton-ghost-primary-background-color-hover);
603
- --color: var(--hop-ToggleButton-ghost-primary-color-hover);
604
- --border: var(--hop-ToggleButton-ghost-primary-border-hover);
605
- --text-underline: underline;
724
+ .ToggleButton-module__hop-ToggleButton___zbugX {
725
+ --hop-ToggleButton-border-size: var(--hop-space-10);
726
+ --hop-ToggleButton-primary-color: var(--hop-primary-text-strong);
727
+ --hop-ToggleButton-primary-background-color: var(--hop-primary-surface-strong);
728
+ --hop-ToggleButton-primary-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-primary-background-color);
729
+ --hop-ToggleButton-primary-color-selected: var(--hop-primary-text-selected);
730
+ --hop-ToggleButton-primary-background-color-selected: var(--hop-primary-surface-selected);
731
+ --hop-ToggleButton-primary-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-primary-border-selected);
732
+ --hop-ToggleButton-secondary-color: var(--hop-neutral-text);
733
+ --hop-ToggleButton-secondary-background-color: var(--hop-neutral-surface);
734
+ --hop-ToggleButton-secondary-border: var(--hop-ToggleButton-border-size) solid var(--hop-neutral-border-strong);
735
+ --hop-ToggleButton-secondary-color-selected: var(--hop-neutral-text-selected);
736
+ --hop-ToggleButton-secondary-background-color-selected: var(--hop-neutral-surface-selected);
737
+ --hop-ToggleButton-secondary-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-neutral-border-selected);
738
+ --hop-ToggleButton-upsell-color: var(--hop-upsell-text);
739
+ --hop-ToggleButton-upsell-background-color: var(--hop-upsell-surface);
740
+ --hop-ToggleButton-upsell-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-upsell-background-color);
741
+ --hop-ToggleButton-upsell-color-selected: var(--hop-upsell-text-selected);
742
+ --hop-ToggleButton-upsell-background-color-selected: var(--hop-upsell-surface-selected);
743
+ --hop-ToggleButton-upsell-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-upsell-border-selected);
744
+ --hop-ToggleButton-danger-color: var(--hop-danger-text-strong);
745
+ --hop-ToggleButton-danger-background-color: var(--hop-danger-surface-strong);
746
+ --hop-ToggleButton-danger-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-danger-background-color);
747
+ --hop-ToggleButton-danger-color-selected: var(--hop-danger-text-selected);
748
+ --hop-ToggleButton-danger-background-color-selected: var(--hop-danger-surface-selected);
749
+ --hop-ToggleButton-danger-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-danger-border-selected);
750
+ --hop-ToggleButton-ghost-primary-color: var(--hop-primary-text);
751
+ --hop-ToggleButton-ghost-primary-background-color: transparent;
752
+ --hop-ToggleButton-ghost-primary-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-primary-background-color);
753
+ --hop-ToggleButton-ghost-primary-color-selected: var(--hop-primary-text-press);
754
+ --hop-ToggleButton-ghost-primary-background-color-selected: var(--hop-primary-surface-weak-press);
755
+ --hop-ToggleButton-ghost-primary-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-primary-background-color-selected);
756
+ --hop-ToggleButton-ghost-secondary-color: var(--hop-neutral-text-weak);
757
+ --hop-ToggleButton-ghost-secondary-background-color: transparent;
758
+ --hop-ToggleButton-ghost-secondary-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-secondary-background-color);
759
+ --hop-ToggleButton-ghost-secondary-color-selected: var(--hop-neutral-text-weak-press);
760
+ --hop-ToggleButton-ghost-secondary-background-color-selected: var(--hop-neutral-surface-press);
761
+ --hop-ToggleButton-ghost-secondary-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-secondary-background-color-selected);
762
+ --hop-ToggleButton-ghost-danger-color: var(--hop-danger-text-weak);
763
+ --hop-ToggleButton-ghost-danger-background-color: transparent;
764
+ --hop-ToggleButton-ghost-danger-border: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-danger-background-color);
765
+ --hop-ToggleButton-ghost-danger-color-selected: var(--hop-danger-text-press);
766
+ --hop-ToggleButton-ghost-danger-background-color-selected: var(--hop-danger-surface-weak-press);
767
+ --hop-ToggleButton-ghost-danger-border-selected: var(--hop-ToggleButton-border-size) solid var(--hop-ToggleButton-ghost-danger-background-color-selected);
606
768
  }
607
- .ToggleButton-module__hop-ToggleButton--ghost-primary___-Rc5u[data-pressed],
608
- .ToggleButton-module__hop-ToggleButton--ghost-primary___-Rc5u[data-selected] {
609
- --background-color: var(--hop-ToggleButton-ghost-primary-background-color-pressed);
610
- --color: var(--hop-ToggleButton-ghost-primary-color-pressed);
611
- --border: var(--hop-ToggleButton-ghost-primary-border-pressed);
769
+ .ToggleButton-module__hop-ToggleButton--fluid___WdZV7 {
612
770
  }
613
- .ToggleButton-module__hop-ToggleButton--ghost-primary___-Rc5u[data-pressed] {
614
- --text-underline: underline;
771
+ .ToggleButton-module__hop-ToggleButton--xs___Lsp2L {
615
772
  }
616
- .ToggleButton-module__hop-ToggleButton--ghost-secondary___V3f-d {
617
- --background-color: var(--hop-ToggleButton-ghost-secondary-background-color);
618
- --color: var(--hop-ToggleButton-ghost-secondary-color);
619
- --border: var(--hop-ToggleButton-ghost-secondary-border);
620
- --spinner-color: var(--hop-ToggleButton-ghost-secondary-spinner-color);
773
+ .ToggleButton-module__hop-ToggleButton--sm___3Nmsz {
621
774
  }
622
- .ToggleButton-module__hop-ToggleButton--ghost-secondary___V3f-d[data-hovered],
623
- .ToggleButton-module__hop-ToggleButton--ghost-secondary___V3f-d[data-focus-visible] {
624
- --background-color: var(--hop-ToggleButton-ghost-secondary-background-color-hover);
625
- --color: var(--hop-ToggleButton-ghost-secondary-color-hover);
626
- --border: var(--hop-ToggleButton-ghost-secondary-border-hover);
627
- --text-underline: underline;
775
+ .ToggleButton-module__hop-ToggleButton--md___EP9fl {
628
776
  }
629
- .ToggleButton-module__hop-ToggleButton--ghost-secondary___V3f-d[data-pressed],
630
- .ToggleButton-module__hop-ToggleButton--ghost-secondary___V3f-d[data-selected] {
631
- --background-color: var(--hop-ToggleButton-ghost-secondary-background-color-pressed);
632
- --color: var(--hop-ToggleButton-ghost-secondary-color-pressed);
633
- --border: var(--hop-ToggleButton-ghost-secondary-border-pressed);
777
+ .ToggleButton-module__hop-ToggleButton--icon-only___sygl8 {
634
778
  }
635
- .ToggleButton-module__hop-ToggleButton--ghost-secondary___V3f-d[data-pressed] {
636
- --text-underline: underline;
779
+ .ToggleButton-module__hop-ToggleButton--primary___LPJIl {
637
780
  }
638
- .ToggleButton-module__hop-ToggleButton--ghost-danger___sqLa8 {
639
- --background-color: var(--hop-ToggleButton-ghost-danger-background-color);
640
- --color: var(--hop-ToggleButton-ghost-danger-color);
641
- --border: var(--hop-ToggleButton-ghost-danger-border);
642
- --spinner-color: var(--hop-ToggleButton-ghost-danger-spinner-color);
781
+ .ToggleButton-module__hop-ToggleButton--primary___LPJIl[data-selected] {
782
+ --background-color: var(--hop-ToggleButton-primary-background-color-selected);
783
+ --color: var(--hop-ToggleButton-primary-color-selected);
784
+ --border: var(--hop-ToggleButton-primary-border-selected);
643
785
  }
644
- .ToggleButton-module__hop-ToggleButton--ghost-danger___sqLa8[data-hovered],
645
- .ToggleButton-module__hop-ToggleButton--ghost-danger___sqLa8[data-focus-visible] {
646
- --background-color: var(--hop-ToggleButton-ghost-danger-background-color-hover);
647
- --color: var(--hop-ToggleButton-ghost-danger-color-hover);
648
- --border: var(--hop-ToggleButton-ghost-danger-border-hover);
649
- --text-underline: underline;
786
+ .ToggleButton-module__hop-ToggleButton--secondary___snZJc {
650
787
  }
651
- .ToggleButton-module__hop-ToggleButton--ghost-danger___sqLa8[data-pressed],
652
- .ToggleButton-module__hop-ToggleButton--ghost-danger___sqLa8[data-selected] {
653
- --background-color: var(--hop-ToggleButton-ghost-danger-background-color-pressed);
654
- --color: var(--hop-ToggleButton-ghost-danger-color-pressed);
655
- --border: var(--hop-ToggleButton-ghost-danger-border-pressed);
788
+ .ToggleButton-module__hop-ToggleButton--secondary___snZJc[data-selected] {
789
+ --background-color: var(--hop-ToggleButton-secondary-background-color-selected);
790
+ --color: var(--hop-ToggleButton-secondary-color-selected);
791
+ --border: var(--hop-ToggleButton-secondary-border-selected);
656
792
  }
657
- .ToggleButton-module__hop-ToggleButton--ghost-danger___sqLa8[data-pressed] {
658
- --text-underline: underline;
793
+ .ToggleButton-module__hop-ToggleButton--upsell___lZhaF {
794
+ }
795
+ .ToggleButton-module__hop-ToggleButton--upsell___lZhaF[data-selected] {
796
+ --background-color: var(--hop-ToggleButton-upsell-background-color-selected);
797
+ --color: var(--hop-ToggleButton-upsell-color-selected);
798
+ --border: var(--hop-ToggleButton-upsell-border-selected);
659
799
  }
660
- .ToggleButton-module__hop-ToggleButton___cQggT[data-focus-visible] {
661
- outline: var(--hop-ToggleButton-outline-size) solid var(--hop-ToggleButton-focus-ring-color);
800
+ .ToggleButton-module__hop-ToggleButton--danger___bgpu6 {
662
801
  }
663
- .ToggleButton-module__hop-ToggleButton___cQggT[data-disabled],
664
- .ToggleButton-module__hop-ToggleButton--loading___sF-01 {
665
- cursor: not-allowed;
802
+ .ToggleButton-module__hop-ToggleButton--danger___bgpu6[data-selected] {
803
+ --background-color: var(--hop-ToggleButton-danger-background-color-selected);
804
+ --color: var(--hop-ToggleButton-danger-color-selected);
805
+ --border: var(--hop-ToggleButton-danger-border-selected);
666
806
  }
667
- .ToggleButton-module__hop-ToggleButton___cQggT[data-disabled] {
668
- --background-color: var(--hop-ToggleButton-background-color-disabled);
669
- --color: var(--hop-ToggleButton-color-disabled);
670
- --border: var(--hop-ToggleButton-border-disabled);
807
+ .ToggleButton-module__hop-ToggleButton--ghost-primary___27qzh {
671
808
  }
672
- .ToggleButton-module__hop-ToggleButton___cQggT[class*=--ghost][data-disabled] {
673
- --background-color: var(--hop-ToggleButton-ghost-background-color-disabled);
674
- --color: var(--hop-ToggleButton-ghost-color-disabled);
675
- --border: var(--hop-ToggleButton-ghost-border-disabled);
809
+ .ToggleButton-module__hop-ToggleButton--ghost-primary___27qzh[data-selected] {
810
+ --text-underline: normal;
811
+ --background-color: var(--hop-ToggleButton-ghost-primary-background-color-selected);
812
+ --color: var(--hop-ToggleButton-ghost-primary-color-selected);
813
+ --border: var(--hop-ToggleButton-ghost-primary-border-selected);
676
814
  }
677
- .ToggleButton-module__hop-ToggleButton--loading___sF-01.ToggleButton-module__hop-ToggleButton--primary___-CkAf {
815
+ .ToggleButton-module__hop-ToggleButton--ghost-secondary___hgB-O {
816
+ }
817
+ .ToggleButton-module__hop-ToggleButton--ghost-secondary___hgB-O[data-selected] {
818
+ --text-underline: normal;
819
+ --background-color: var(--hop-ToggleButton-ghost-secondary-background-color-selected);
820
+ --color: var(--hop-ToggleButton-ghost-secondary-color-selected);
821
+ --border: var(--hop-ToggleButton-ghost-secondary-border-selected);
822
+ }
823
+ .ToggleButton-module__hop-ToggleButton--ghost-danger___at8lh {
824
+ }
825
+ .ToggleButton-module__hop-ToggleButton--ghost-danger___at8lh[data-selected] {
826
+ --text-underline: normal;
827
+ --background-color: var(--hop-ToggleButton-ghost-danger-background-color-selected);
828
+ --color: var(--hop-ToggleButton-ghost-danger-color-selected);
829
+ --border: var(--hop-ToggleButton-ghost-danger-border-selected);
830
+ }
831
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton--primary___LPJIl {
678
832
  --background-color: var(--hop-ToggleButton-primary-background-color);
679
833
  --color: var(--hop-ToggleButton-primary-color);
680
834
  --border: var(--hop-ToggleButton-primary-border);
681
835
  }
682
- .ToggleButton-module__hop-ToggleButton--loading___sF-01.ToggleButton-module__hop-ToggleButton--secondary___pw82S {
836
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton--secondary___snZJc {
683
837
  --background-color: var(--hop-ToggleButton-secondary-background-color);
684
838
  --color: var(--hop-ToggleButton-secondary-color);
685
839
  --border: var(--hop-ToggleButton-secondary-border);
686
840
  }
687
- .ToggleButton-module__hop-ToggleButton--loading___sF-01.ToggleButton-module__hop-ToggleButton--upsell___Y7PyT {
841
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton--upsell___lZhaF {
688
842
  --background-color: var(--hop-ToggleButton-upsell-background-color);
689
843
  --color: var(--hop-ToggleButton-upsell-color);
690
844
  --border: var(--hop-ToggleButton-upsell-border);
691
845
  }
692
- .ToggleButton-module__hop-ToggleButton--loading___sF-01.ToggleButton-module__hop-ToggleButton___cQggT[class*=--ghost] {
846
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton--danger___bgpu6 {
847
+ --background-color: var(--hop-ToggleButton-danger-background-color);
848
+ --color: var(--hop-ToggleButton-danger-color);
849
+ --border: var(--hop-ToggleButton-danger-border);
850
+ }
851
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton--ghost-primary___27qzh {
852
+ --background-color: var(--hop-ToggleButton-ghost-primary-background-color);
853
+ --color: var(--hop-ToggleButton-ghost-primary-color);
854
+ --border: var(--hop-ToggleButton-ghost-primary-border);
855
+ --text-underline: none;
856
+ }
857
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton--ghost-secondary___hgB-O {
693
858
  --background-color: var(--hop-ToggleButton-ghost-secondary-background-color);
694
859
  --color: var(--hop-ToggleButton-ghost-secondary-color);
695
860
  --border: var(--hop-ToggleButton-ghost-secondary-border);
696
861
  --text-underline: none;
697
862
  }
698
- .ToggleButton-module__hop-ToggleButton__Spinner___SwSbO {
699
- position: absolute;
700
- color: var(--spinner-color);
863
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton--ghost-danger___at8lh {
864
+ --background-color: var(--hop-ToggleButton-ghost-danger-background-color);
865
+ --color: var(--hop-ToggleButton-ghost-danger-color);
866
+ --border: var(--hop-ToggleButton-ghost-danger-border);
867
+ --text-underline: none;
701
868
  }
702
- .ToggleButton-module__hop-ToggleButton__icon___nOFkE,
703
- .ToggleButton-module__hop-ToggleButton__icon-list___OtBGk {
704
- flex: 0 0 auto;
705
- justify-self: end;
706
- order: 1;
869
+ .ToggleButton-module__hop-ToggleButton__Spinner___h-RL5 {
707
870
  }
708
- .ToggleButton-module__hop-ToggleButton__text___ZdN6c {
709
- user-select: none;
710
- overflow: visible;
711
- flex: 0 1 auto;
712
- order: 2;
713
- font-weight: var(--hop-font-weight-505);
714
- text-decoration: var(--text-underline);
715
- text-underline-offset: 0.125rem;
716
- text-wrap: nowrap;
871
+ .ToggleButton-module__hop-ToggleButton__icon___fNyh0,
872
+ .ToggleButton-module__hop-ToggleButton__icon-list___2SWhn {
717
873
  }
718
- .ToggleButton-module__hop-ToggleButton__end-icon___gYUgH,
719
- .ToggleButton-module__hop-ToggleButton__end-icon-list___JqSZC {
720
- flex: 0 0 auto;
721
- order: 3;
874
+ .ToggleButton-module__hop-ToggleButton__text___GdM0S {
722
875
  }
723
- .ToggleButton-module__hop-ToggleButton___cQggT .ToggleButton-module__hop-ToggleButton__icon-list___OtBGk,
724
- .ToggleButton-module__hop-ToggleButton___cQggT .ToggleButton-module__hop-ToggleButton__end-icon-list___JqSZC {
725
- flex-wrap: nowrap;
876
+ .ToggleButton-module__hop-ToggleButton__end-icon___k76xK,
877
+ .ToggleButton-module__hop-ToggleButton__end-icon-list___qUqZ8 {
878
+ }
879
+ .ToggleButton-module__hop-ToggleButton__icon-list___2SWhn,
880
+ .ToggleButton-module__hop-ToggleButton__end-icon-list___qUqZ8 {
726
881
  }
727
- .ToggleButton-module__hop-ToggleButton--loading___sF-01.ToggleButton-module__hop-ToggleButton___cQggT > *:not(.ToggleButton-module__hop-ToggleButton__Spinner___SwSbO) {
882
+ .ToggleButton-module__hop-ToggleButton--loading___cIm3l.ToggleButton-module__hop-ToggleButton___zbugX > *:not(.ToggleButton-module__hop-ToggleButton__Spinner___h-RL5) {
728
883
  opacity: 0;
729
884
  }