@cambly/syntax-core 10.30.0 → 10.31.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 (370) hide show
  1. package/dist/Avatar/Avatar.cjs +5 -7
  2. package/dist/Avatar/Avatar.css +11 -49
  3. package/dist/Avatar/Avatar.css.map +1 -1
  4. package/dist/Avatar/Avatar.d.ts +2 -9
  5. package/dist/Avatar/Avatar.js +4 -6
  6. package/dist/AvatarGroup/AvatarGroup.cjs +4 -6
  7. package/dist/AvatarGroup/AvatarGroup.css +3 -18
  8. package/dist/AvatarGroup/AvatarGroup.css.map +1 -1
  9. package/dist/AvatarGroup/AvatarGroup.d.ts +2 -9
  10. package/dist/AvatarGroup/AvatarGroup.js +3 -5
  11. package/dist/Badge/Badge.cjs +5 -7
  12. package/dist/Badge/Badge.css +48 -99
  13. package/dist/Badge/Badge.css.map +1 -1
  14. package/dist/Badge/Badge.js +4 -6
  15. package/dist/Box/Box.cjs +5 -5
  16. package/dist/Box/Box.css +3 -18
  17. package/dist/Box/Box.css.map +1 -1
  18. package/dist/Box/Box.d.ts +2 -10
  19. package/dist/Box/Box.js +6 -6
  20. package/dist/Button/Button.cjs +9 -12
  21. package/dist/Button/Button.css +67 -142
  22. package/dist/Button/Button.css.map +1 -1
  23. package/dist/Button/Button.d.ts +1 -8
  24. package/dist/Button/Button.js +7 -10
  25. package/dist/Button/constants/iconSize.cjs +2 -3
  26. package/dist/Button/constants/iconSize.css +19 -43
  27. package/dist/Button/constants/iconSize.css.map +1 -1
  28. package/dist/Button/constants/iconSize.js +1 -2
  29. package/dist/ButtonGroup/ButtonGroup.cjs +2 -3
  30. package/dist/ButtonGroup/ButtonGroup.css +6 -15
  31. package/dist/ButtonGroup/ButtonGroup.css.map +1 -1
  32. package/dist/ButtonGroup/ButtonGroup.d.ts +0 -6
  33. package/dist/ButtonGroup/ButtonGroup.js +1 -2
  34. package/dist/Card/Card.cjs +4 -6
  35. package/dist/Card/Card.css +3 -18
  36. package/dist/Card/Card.css.map +1 -1
  37. package/dist/Card/Card.d.ts +1 -1
  38. package/dist/Card/Card.js +3 -5
  39. package/dist/Checkbox/Checkbox.cjs +3 -4
  40. package/dist/Checkbox/Checkbox.css +58 -114
  41. package/dist/Checkbox/Checkbox.css.map +1 -1
  42. package/dist/Checkbox/Checkbox.js +2 -3
  43. package/dist/Chip/Chip.cjs +5 -7
  44. package/dist/Chip/Chip.css +61 -130
  45. package/dist/Chip/Chip.css.map +1 -1
  46. package/dist/Chip/Chip.d.ts +1 -4
  47. package/dist/Chip/Chip.js +4 -6
  48. package/dist/Dialog/Dialog.cjs +3 -5
  49. package/dist/Dialog/Dialog.css +3 -18
  50. package/dist/Dialog/Dialog.css.map +1 -1
  51. package/dist/Dialog/Dialog.js +2 -4
  52. package/dist/Dialog/ModalDialog.cjs +9 -13
  53. package/dist/Dialog/ModalDialog.css +15 -167
  54. package/dist/Dialog/ModalDialog.css.map +1 -1
  55. package/dist/Dialog/ModalDialog.js +7 -11
  56. package/dist/Divider/Divider.cjs +2 -3
  57. package/dist/Divider/Divider.js +1 -2
  58. package/dist/Heading/Heading.cjs +3 -4
  59. package/dist/Heading/Heading.css +45 -81
  60. package/dist/Heading/Heading.css.map +1 -1
  61. package/dist/Heading/Heading.d.ts +3 -9
  62. package/dist/Heading/Heading.js +2 -3
  63. package/dist/IconButton/IconButton.cjs +5 -8
  64. package/dist/IconButton/IconButton.css +12 -149
  65. package/dist/IconButton/IconButton.css.map +1 -1
  66. package/dist/IconButton/IconButton.d.ts +3 -16
  67. package/dist/IconButton/IconButton.js +3 -6
  68. package/dist/LinkButton/LinkButton.cjs +7 -10
  69. package/dist/LinkButton/LinkButton.css +64 -124
  70. package/dist/LinkButton/LinkButton.css.map +1 -1
  71. package/dist/LinkButton/LinkButton.d.ts +2 -18
  72. package/dist/LinkButton/LinkButton.js +5 -8
  73. package/dist/Modal/Layer.cjs +4 -6
  74. package/dist/Modal/Layer.css +3 -18
  75. package/dist/Modal/Layer.css.map +1 -1
  76. package/dist/Modal/Layer.js +3 -5
  77. package/dist/Modal/Modal.cjs +11 -15
  78. package/dist/Modal/Modal.css +64 -269
  79. package/dist/Modal/Modal.css.map +1 -1
  80. package/dist/Modal/Modal.js +9 -13
  81. package/dist/Popover/Popover.cjs +10 -14
  82. package/dist/Popover/Popover.css +15 -167
  83. package/dist/Popover/Popover.css.map +1 -1
  84. package/dist/Popover/Popover.js +8 -12
  85. package/dist/RadioButton/RadioButton.cjs +5 -7
  86. package/dist/RadioButton/RadioButton.css +48 -99
  87. package/dist/RadioButton/RadioButton.css.map +1 -1
  88. package/dist/RadioButton/RadioButton.js +4 -6
  89. package/dist/RichSelect/RichSelectBox.cjs +17 -20
  90. package/dist/RichSelect/RichSelectBox.css +86 -188
  91. package/dist/RichSelect/RichSelectBox.css.map +1 -1
  92. package/dist/RichSelect/RichSelectBox.js +15 -18
  93. package/dist/RichSelect/RichSelectChip.cjs +6 -8
  94. package/dist/RichSelect/RichSelectChip.css +61 -130
  95. package/dist/RichSelect/RichSelectChip.css.map +1 -1
  96. package/dist/RichSelect/RichSelectChip.js +5 -7
  97. package/dist/RichSelect/RichSelectList.cjs +24 -28
  98. package/dist/RichSelect/RichSelectList.css +176 -326
  99. package/dist/RichSelect/RichSelectList.css.map +1 -1
  100. package/dist/RichSelect/RichSelectList.js +22 -26
  101. package/dist/RichSelect/RichSelectRadioButton.cjs +6 -8
  102. package/dist/RichSelect/RichSelectRadioButton.css +48 -99
  103. package/dist/RichSelect/RichSelectRadioButton.css.map +1 -1
  104. package/dist/RichSelect/RichSelectRadioButton.js +5 -7
  105. package/dist/RichSelect/RichSelectSection.cjs +3 -4
  106. package/dist/RichSelect/RichSelectSection.css +45 -81
  107. package/dist/RichSelect/RichSelectSection.css.map +1 -1
  108. package/dist/RichSelect/RichSelectSection.js +2 -3
  109. package/dist/SelectList/SelectList.cjs +6 -8
  110. package/dist/SelectList/SelectList.css +59 -134
  111. package/dist/SelectList/SelectList.css.map +1 -1
  112. package/dist/SelectList/SelectList.d.ts +1 -0
  113. package/dist/SelectList/SelectList.js +5 -7
  114. package/dist/TapArea/TapArea.cjs +7 -3
  115. package/dist/TapArea/TapArea.css +2030 -15
  116. package/dist/TapArea/TapArea.css.map +1 -1
  117. package/dist/TapArea/TapArea.js +6 -2
  118. package/dist/TextArea/TextArea.cjs +5 -7
  119. package/dist/TextArea/TextArea.css +59 -165
  120. package/dist/TextArea/TextArea.css.map +1 -1
  121. package/dist/TextArea/TextArea.js +4 -6
  122. package/dist/TextField/TextField.cjs +5 -7
  123. package/dist/TextField/TextField.css +58 -149
  124. package/dist/TextField/TextField.css.map +1 -1
  125. package/dist/TextField/TextField.js +4 -6
  126. package/dist/ThemeProvider/ThemeProvider.cjs +2 -4
  127. package/dist/ThemeProvider/ThemeProvider.d.ts +3 -9
  128. package/dist/ThemeProvider/ThemeProvider.js +3 -5
  129. package/dist/Tooltip/Tooltip.cjs +4 -6
  130. package/dist/Tooltip/Tooltip.css +48 -99
  131. package/dist/Tooltip/Tooltip.css.map +1 -1
  132. package/dist/Tooltip/Tooltip.js +3 -5
  133. package/dist/Typography/Typography.cjs +2 -3
  134. package/dist/Typography/Typography.css +45 -81
  135. package/dist/Typography/Typography.css.map +1 -1
  136. package/dist/Typography/Typography.d.ts +3 -21
  137. package/dist/Typography/Typography.js +1 -2
  138. package/dist/__chunks/{I6CGA2ER.js → 23XGESKG.js} +5 -9
  139. package/dist/__chunks/23XGESKG.js.map +1 -0
  140. package/dist/__chunks/{W5MIJIZA.cjs → 2IHACTOY.cjs} +3 -12
  141. package/dist/__chunks/2IHACTOY.cjs.map +1 -0
  142. package/dist/__chunks/{TDR3JRXZ.js → 2K6CP2YU.js} +16 -29
  143. package/dist/__chunks/2K6CP2YU.js.map +1 -0
  144. package/dist/__chunks/{GJBW4BG7.js → 2ZPIW4UQ.js} +2 -2
  145. package/dist/__chunks/{SFOAZYZG.cjs → 35S5FKUC.cjs} +3 -3
  146. package/dist/__chunks/3GNWH6C7.js +94 -0
  147. package/dist/__chunks/3GNWH6C7.js.map +1 -0
  148. package/dist/__chunks/45TMKSJQ.cjs +9 -0
  149. package/dist/__chunks/45TMKSJQ.cjs.map +1 -0
  150. package/dist/__chunks/4D7UZQ2A.cjs +17 -0
  151. package/dist/__chunks/4D7UZQ2A.cjs.map +1 -0
  152. package/dist/__chunks/{CPIFXRXD.cjs → 4OOJZHZM.cjs} +19 -29
  153. package/dist/__chunks/4OOJZHZM.cjs.map +1 -0
  154. package/dist/__chunks/{FTKHKS6W.js → 4SABJA3K.js} +3 -3
  155. package/dist/__chunks/{ICDRMDXD.js → 57KSLOGS.js} +1 -1
  156. package/dist/__chunks/{ICDRMDXD.js.map → 57KSLOGS.js.map} +1 -1
  157. package/dist/__chunks/5VHLZADO.cjs +94 -0
  158. package/dist/__chunks/5VHLZADO.cjs.map +1 -0
  159. package/dist/__chunks/{6P6ARVEA.cjs → 5YIEOGTA.cjs} +3 -3
  160. package/dist/__chunks/{Y2HREK3T.js → 635XF33P.js} +4 -4
  161. package/dist/__chunks/67EPPVT7.js +72 -0
  162. package/dist/__chunks/67EPPVT7.js.map +1 -0
  163. package/dist/__chunks/{3OWAOKRW.js → 6XM3VOHU.js} +17 -27
  164. package/dist/__chunks/6XM3VOHU.js.map +1 -0
  165. package/dist/__chunks/{UKLQ64N7.cjs → 753VRQSY.cjs} +6 -3
  166. package/dist/__chunks/753VRQSY.cjs.map +1 -0
  167. package/dist/__chunks/{OU5C2MBA.js → 7AMCS5SM.js} +9 -33
  168. package/dist/__chunks/7AMCS5SM.js.map +1 -0
  169. package/dist/__chunks/ANMCJDIA.cjs +128 -0
  170. package/dist/__chunks/ANMCJDIA.cjs.map +1 -0
  171. package/dist/__chunks/{JXOKXBDZ.cjs → ASFZDRJJ.cjs} +9 -21
  172. package/dist/__chunks/ASFZDRJJ.cjs.map +1 -0
  173. package/dist/__chunks/BOX3VY3Q.js +30 -0
  174. package/dist/__chunks/BOX3VY3Q.js.map +1 -0
  175. package/dist/__chunks/{GEGGHBSM.cjs → C2H5JBU2.cjs} +18 -18
  176. package/dist/__chunks/{5MJ6NOUC.js → C32JYNV7.js} +6 -3
  177. package/dist/__chunks/C32JYNV7.js.map +1 -0
  178. package/dist/__chunks/C5XPZTFO.cjs +30 -0
  179. package/dist/__chunks/C5XPZTFO.cjs.map +1 -0
  180. package/dist/__chunks/{4GTNQPPD.js → CAEGAJQ2.js} +9 -21
  181. package/dist/__chunks/CAEGAJQ2.js.map +1 -0
  182. package/dist/__chunks/{PKBQW5T6.cjs → DRSFRJ34.cjs} +4 -8
  183. package/dist/__chunks/DRSFRJ34.cjs.map +1 -0
  184. package/dist/__chunks/EB7WKQ35.js +9 -0
  185. package/dist/__chunks/EB7WKQ35.js.map +1 -0
  186. package/dist/__chunks/F2TVUY5L.js +128 -0
  187. package/dist/__chunks/F2TVUY5L.js.map +1 -0
  188. package/dist/__chunks/{VLK5CARI.cjs → GNKVDWTS.cjs} +7 -7
  189. package/dist/__chunks/{BQOD4WU7.js → GR5G6EJO.js} +27 -42
  190. package/dist/__chunks/GR5G6EJO.js.map +1 -0
  191. package/dist/__chunks/{Q4HTXMNF.js → GSSIV3VC.js} +3 -7
  192. package/dist/__chunks/GSSIV3VC.js.map +1 -0
  193. package/dist/__chunks/{KTTIFVGY.js → H2AWA6IQ.js} +2 -2
  194. package/dist/__chunks/{2HNPYS3S.cjs → J66QB6E3.cjs} +32 -42
  195. package/dist/__chunks/J66QB6E3.cjs.map +1 -0
  196. package/dist/__chunks/{N5B6KNJR.js → J6JYJXK5.js} +17 -25
  197. package/dist/__chunks/J6JYJXK5.js.map +1 -0
  198. package/dist/__chunks/{BVYHALMT.cjs → J7RT6MWY.cjs} +6 -10
  199. package/dist/__chunks/J7RT6MWY.cjs.map +1 -0
  200. package/dist/__chunks/{X5KCRFFF.js → KARS7AEM.js} +11 -21
  201. package/dist/__chunks/KARS7AEM.js.map +1 -0
  202. package/dist/__chunks/{2RWNBVOK.cjs → KGXZVA6S.cjs} +12 -36
  203. package/dist/__chunks/KGXZVA6S.cjs.map +1 -0
  204. package/dist/__chunks/{AKKJTW7U.js → KPQ6AISJ.js} +9 -19
  205. package/dist/__chunks/KPQ6AISJ.js.map +1 -0
  206. package/dist/__chunks/{5MKCDCHQ.cjs → KYGRRVLW.cjs} +19 -27
  207. package/dist/__chunks/KYGRRVLW.cjs.map +1 -0
  208. package/dist/__chunks/LL5MNX7Y.cjs +91 -0
  209. package/dist/__chunks/LL5MNX7Y.cjs.map +1 -0
  210. package/dist/__chunks/{6OCOGTM5.cjs → LPRAK3CL.cjs} +20 -33
  211. package/dist/__chunks/LPRAK3CL.cjs.map +1 -0
  212. package/dist/__chunks/{A323TCSA.cjs → M7TRKS34.cjs} +5 -11
  213. package/dist/__chunks/M7TRKS34.cjs.map +1 -0
  214. package/dist/__chunks/{EKHHYK7U.cjs → MPHBLSZP.cjs} +15 -25
  215. package/dist/__chunks/MPHBLSZP.cjs.map +1 -0
  216. package/dist/__chunks/MUYNXIZK.cjs +72 -0
  217. package/dist/__chunks/MUYNXIZK.cjs.map +1 -0
  218. package/dist/__chunks/{IB3FQANU.js → MWCEKFF2.js} +3 -25
  219. package/dist/__chunks/MWCEKFF2.js.map +1 -0
  220. package/dist/__chunks/{ZUQC37VB.cjs → N2V7ZZBM.cjs} +3 -3
  221. package/dist/__chunks/{7SCBZPIF.cjs → N47VDOUP.cjs} +1 -1
  222. package/dist/__chunks/{7SCBZPIF.cjs.map → N47VDOUP.cjs.map} +1 -1
  223. package/dist/__chunks/{THYSYYWS.cjs → NLD667Y7.cjs} +5 -10
  224. package/dist/__chunks/NLD667Y7.cjs.map +1 -0
  225. package/dist/__chunks/{K27Z66LH.js → OQE24UY6.js} +2 -2
  226. package/dist/__chunks/{GANR5JVV.cjs → OT2MUGKK.cjs} +5 -11
  227. package/dist/__chunks/OT2MUGKK.cjs.map +1 -0
  228. package/dist/__chunks/{FPHP3T7U.js → P6K7GG3H.js} +1 -18
  229. package/dist/__chunks/P6K7GG3H.js.map +1 -0
  230. package/dist/__chunks/{CS66HKUB.cjs → P72Q5WQM.cjs} +26 -41
  231. package/dist/__chunks/P72Q5WQM.cjs.map +1 -0
  232. package/dist/__chunks/{3HBVE6VG.js → PCHHRCCA.js} +8 -18
  233. package/dist/__chunks/PCHHRCCA.js.map +1 -0
  234. package/dist/__chunks/{WOIJRASP.cjs → QN33R37R.cjs} +3 -3
  235. package/dist/__chunks/RTT2WOZS.js +91 -0
  236. package/dist/__chunks/RTT2WOZS.js.map +1 -0
  237. package/dist/__chunks/{3FMGCZP2.cjs → SNAE52BH.cjs} +12 -22
  238. package/dist/__chunks/SNAE52BH.cjs.map +1 -0
  239. package/dist/__chunks/SOZG53ZB.js +117 -0
  240. package/dist/__chunks/SOZG53ZB.js.map +1 -0
  241. package/dist/__chunks/SPX2VOW3.cjs +117 -0
  242. package/dist/__chunks/SPX2VOW3.cjs.map +1 -0
  243. package/dist/__chunks/{J43HGNHN.cjs → T5EA5RPQ.cjs} +3 -25
  244. package/dist/__chunks/T5EA5RPQ.cjs.map +1 -0
  245. package/dist/__chunks/{3CNALXRL.js → T6BFW6YO.js} +8 -8
  246. package/dist/__chunks/{LECUYS4O.cjs → TDPIWHGR.cjs} +5 -5
  247. package/dist/__chunks/{MONMI3LS.js → UB4WHLZC.js} +2 -2
  248. package/dist/__chunks/{UF7SXHS4.js → UIPAXBI7.js} +3 -12
  249. package/dist/__chunks/UIPAXBI7.js.map +1 -0
  250. package/dist/__chunks/{7BAMJSUF.js → UTI7XCK6.js} +4 -10
  251. package/dist/__chunks/UTI7XCK6.js.map +1 -0
  252. package/dist/__chunks/{FLFJRP4T.js → UXTPDCQJ.js} +21 -36
  253. package/dist/__chunks/UXTPDCQJ.js.map +1 -0
  254. package/dist/__chunks/VTH5KXQF.cjs +111 -0
  255. package/dist/__chunks/VTH5KXQF.cjs.map +1 -0
  256. package/dist/__chunks/{UQY2ELTZ.cjs → WWRSRFDE.cjs} +2 -19
  257. package/dist/__chunks/WWRSRFDE.cjs.map +1 -0
  258. package/dist/__chunks/{63GEZVJ4.js → XHTRMLY4.js} +5 -6
  259. package/dist/__chunks/XHTRMLY4.js.map +1 -0
  260. package/dist/__chunks/{AYTJYJHI.js → XZ23UL5J.js} +4 -9
  261. package/dist/__chunks/XZ23UL5J.js.map +1 -0
  262. package/dist/__chunks/{HYRATHVK.cjs → YNVQJ4DG.cjs} +5 -6
  263. package/dist/__chunks/YNVQJ4DG.cjs.map +1 -0
  264. package/dist/__chunks/YV4ASN4Z.js +17 -0
  265. package/dist/__chunks/YV4ASN4Z.js.map +1 -0
  266. package/dist/__chunks/{HCHFPFNX.js → ZPY7QEBH.js} +4 -10
  267. package/dist/__chunks/ZPY7QEBH.js.map +1 -0
  268. package/dist/colors/backgroundColor.cjs +2 -4
  269. package/dist/colors/backgroundColor.d.ts +3 -4
  270. package/dist/colors/backgroundColor.js +3 -5
  271. package/dist/colors/foregroundColor.cjs +2 -4
  272. package/dist/colors/foregroundColor.d.ts +2 -3
  273. package/dist/colors/foregroundColor.js +3 -5
  274. package/dist/index.cjs +38 -43
  275. package/dist/index.css +145 -410
  276. package/dist/index.css.map +1 -1
  277. package/dist/index.d.ts +1 -1
  278. package/dist/index.js +39 -44
  279. package/package.json +1 -1
  280. package/dist/__chunks/2HNPYS3S.cjs.map +0 -1
  281. package/dist/__chunks/2RWNBVOK.cjs.map +0 -1
  282. package/dist/__chunks/3FMGCZP2.cjs.map +0 -1
  283. package/dist/__chunks/3HBVE6VG.js.map +0 -1
  284. package/dist/__chunks/3OWAOKRW.js.map +0 -1
  285. package/dist/__chunks/4GTNQPPD.js.map +0 -1
  286. package/dist/__chunks/5MJ6NOUC.js.map +0 -1
  287. package/dist/__chunks/5MKCDCHQ.cjs.map +0 -1
  288. package/dist/__chunks/5OLT2HH5.js +0 -43
  289. package/dist/__chunks/5OLT2HH5.js.map +0 -1
  290. package/dist/__chunks/5PWYNWVE.js +0 -115
  291. package/dist/__chunks/5PWYNWVE.js.map +0 -1
  292. package/dist/__chunks/63GEZVJ4.js.map +0 -1
  293. package/dist/__chunks/6OCOGTM5.cjs.map +0 -1
  294. package/dist/__chunks/7BAMJSUF.js.map +0 -1
  295. package/dist/__chunks/A323TCSA.cjs.map +0 -1
  296. package/dist/__chunks/AKKJTW7U.js.map +0 -1
  297. package/dist/__chunks/AYTJYJHI.js.map +0 -1
  298. package/dist/__chunks/BQOD4WU7.js.map +0 -1
  299. package/dist/__chunks/BVYHALMT.cjs.map +0 -1
  300. package/dist/__chunks/CPIFXRXD.cjs.map +0 -1
  301. package/dist/__chunks/CS66HKUB.cjs.map +0 -1
  302. package/dist/__chunks/EKHHYK7U.cjs.map +0 -1
  303. package/dist/__chunks/FH2W3CI2.cjs +0 -126
  304. package/dist/__chunks/FH2W3CI2.cjs.map +0 -1
  305. package/dist/__chunks/FLFJRP4T.js.map +0 -1
  306. package/dist/__chunks/FPHP3T7U.js.map +0 -1
  307. package/dist/__chunks/GANR5JVV.cjs.map +0 -1
  308. package/dist/__chunks/GWJGZYZO.js +0 -150
  309. package/dist/__chunks/GWJGZYZO.js.map +0 -1
  310. package/dist/__chunks/HCHFPFNX.js.map +0 -1
  311. package/dist/__chunks/HYRATHVK.cjs.map +0 -1
  312. package/dist/__chunks/I6CGA2ER.js.map +0 -1
  313. package/dist/__chunks/IB3FQANU.js.map +0 -1
  314. package/dist/__chunks/J43HGNHN.cjs.map +0 -1
  315. package/dist/__chunks/JAC64LLA.js +0 -17
  316. package/dist/__chunks/JAC64LLA.js.map +0 -1
  317. package/dist/__chunks/JNYNLJGY.js +0 -137
  318. package/dist/__chunks/JNYNLJGY.js.map +0 -1
  319. package/dist/__chunks/JXOKXBDZ.cjs.map +0 -1
  320. package/dist/__chunks/KYIRM6PZ.cjs +0 -137
  321. package/dist/__chunks/KYIRM6PZ.cjs.map +0 -1
  322. package/dist/__chunks/N5B6KNJR.js.map +0 -1
  323. package/dist/__chunks/NCUQOLOV.cjs +0 -115
  324. package/dist/__chunks/NCUQOLOV.cjs.map +0 -1
  325. package/dist/__chunks/OAZD7W2W.cjs +0 -96
  326. package/dist/__chunks/OAZD7W2W.cjs.map +0 -1
  327. package/dist/__chunks/OMFFRI3K.js +0 -9
  328. package/dist/__chunks/OMFFRI3K.js.map +0 -1
  329. package/dist/__chunks/OU5C2MBA.js.map +0 -1
  330. package/dist/__chunks/PKBQW5T6.cjs.map +0 -1
  331. package/dist/__chunks/Q4HTXMNF.js.map +0 -1
  332. package/dist/__chunks/RVFY33X2.cjs +0 -43
  333. package/dist/__chunks/RVFY33X2.cjs.map +0 -1
  334. package/dist/__chunks/S5QHTHST.cjs +0 -9
  335. package/dist/__chunks/S5QHTHST.cjs.map +0 -1
  336. package/dist/__chunks/SHHN3SRR.js +0 -9
  337. package/dist/__chunks/SHHN3SRR.js.map +0 -1
  338. package/dist/__chunks/TDR3JRXZ.js.map +0 -1
  339. package/dist/__chunks/THYSYYWS.cjs.map +0 -1
  340. package/dist/__chunks/UF7SXHS4.js.map +0 -1
  341. package/dist/__chunks/UKLQ64N7.cjs.map +0 -1
  342. package/dist/__chunks/UQY2ELTZ.cjs.map +0 -1
  343. package/dist/__chunks/UVROGDYB.js +0 -128
  344. package/dist/__chunks/UVROGDYB.js.map +0 -1
  345. package/dist/__chunks/VR4ZFZ4Z.js +0 -96
  346. package/dist/__chunks/VR4ZFZ4Z.js.map +0 -1
  347. package/dist/__chunks/W2JRKN5E.cjs +0 -9
  348. package/dist/__chunks/W2JRKN5E.cjs.map +0 -1
  349. package/dist/__chunks/W5MIJIZA.cjs.map +0 -1
  350. package/dist/__chunks/X5KCRFFF.js.map +0 -1
  351. package/dist/__chunks/XU3CLITI.cjs +0 -128
  352. package/dist/__chunks/XU3CLITI.cjs.map +0 -1
  353. package/dist/__chunks/ZCSR6NFB.cjs +0 -17
  354. package/dist/__chunks/ZCSR6NFB.cjs.map +0 -1
  355. package/dist/__chunks/ZRO3RCYX.cjs +0 -150
  356. package/dist/__chunks/ZRO3RCYX.cjs.map +0 -1
  357. /package/dist/__chunks/{GJBW4BG7.js.map → 2ZPIW4UQ.js.map} +0 -0
  358. /package/dist/__chunks/{SFOAZYZG.cjs.map → 35S5FKUC.cjs.map} +0 -0
  359. /package/dist/__chunks/{FTKHKS6W.js.map → 4SABJA3K.js.map} +0 -0
  360. /package/dist/__chunks/{6P6ARVEA.cjs.map → 5YIEOGTA.cjs.map} +0 -0
  361. /package/dist/__chunks/{Y2HREK3T.js.map → 635XF33P.js.map} +0 -0
  362. /package/dist/__chunks/{GEGGHBSM.cjs.map → C2H5JBU2.cjs.map} +0 -0
  363. /package/dist/__chunks/{VLK5CARI.cjs.map → GNKVDWTS.cjs.map} +0 -0
  364. /package/dist/__chunks/{KTTIFVGY.js.map → H2AWA6IQ.js.map} +0 -0
  365. /package/dist/__chunks/{ZUQC37VB.cjs.map → N2V7ZZBM.cjs.map} +0 -0
  366. /package/dist/__chunks/{K27Z66LH.js.map → OQE24UY6.js.map} +0 -0
  367. /package/dist/__chunks/{WOIJRASP.cjs.map → QN33R37R.cjs.map} +0 -0
  368. /package/dist/__chunks/{3CNALXRL.js.map → T6BFW6YO.js.map} +0 -0
  369. /package/dist/__chunks/{LECUYS4O.cjs.map → TDPIWHGR.cjs.map} +0 -0
  370. /package/dist/__chunks/{MONMI3LS.js.map → UB4WHLZC.js.map} +0 -0
@@ -1,115 +0,0 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
2
-
3
-
4
- var _GANR5JVVcjs = require('./GANR5JVV.cjs');
5
-
6
-
7
- var _XU3CLITIcjs = require('./XU3CLITI.cjs');
8
-
9
-
10
- var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
11
-
12
-
13
- var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
14
-
15
- // src/Chip/Chip.tsx
16
- var _react = require('react');
17
- var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
18
-
19
- // css-module:./Chip.module.css#css-module
20
- var Chip_module_default = { "chip": "_chip_1ndh3_1", "chipClassic": "_chipClassic_1ndh3_10", "chipCambio": "_chipCambio_1ndh3_15", "disabled": "_disabled_1ndh3_20", "deselectedChip": "_deselectedChip_1ndh3_25", "selectedChip": "_selectedChip_1ndh3_29", "deselectedChipCambio": "_deselectedChipCambio_1ndh3_34", "deselectedChipCambioOnDarkBackground": "_deselectedChipCambioOnDarkBackground_1ndh3_38", "selectedChipCambio": "_selectedChipCambio_1ndh3_42", "selectedChipCambioOnDarkBackground": "_selectedChipCambioOnDarkBackground_1ndh3_46", "icon": "_icon_1ndh3_50", "selectedIcon": "_selectedIcon_1ndh3_58", "sm": "_sm_1ndh3_62", "lg": "_lg_1ndh3_68", "forceFocus": "_forceFocus_1ndh3_75" };
21
-
22
- // src/Chip/Chip.tsx
23
- var _jsxruntime = require('react/jsx-runtime');
24
- function typographyColor({
25
- themeName,
26
- selected,
27
- on
28
- }) {
29
- if (themeName === "cambio" && on === "darkBackground") {
30
- if (selected) {
31
- return "gray900";
32
- } else {
33
- return "white";
34
- }
35
- } else {
36
- if (selected) {
37
- return "white";
38
- } else {
39
- return "gray900";
40
- }
41
- }
42
- }
43
- var Chip = _react.forwardRef.call(void 0,
44
- ({
45
- disabled: disabledProp = false,
46
- selected = false,
47
- "data-testid": dataTestId,
48
- size = "sm",
49
- text,
50
- on = "lightBackground",
51
- onChange,
52
- icon: Icon,
53
- dangerouslyForceFocusStyles
54
- }, ref) => {
55
- const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
56
- const transformedSize = themeName === "cambio" ? "sm" : size;
57
- const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
58
- const disabled = !isHydrated || disabledProp;
59
- const selectedChipCambioStyle = on === "lightBackground" ? Chip_module_default.selectedChipCambio : Chip_module_default.selectedChipCambioOnDarkBackground;
60
- const deselectedChipCambioStyle = on === "lightBackground" ? Chip_module_default.deselectedChipCambio : Chip_module_default.deselectedChipCambioOnDarkBackground;
61
- const chipStyles = _classnames2.default.call(void 0,
62
- Chip_module_default.chip,
63
- themeName === "classic" ? Chip_module_default.chipClassic : Chip_module_default.chipCambio,
64
- Chip_module_default[transformedSize],
65
- {
66
- [themeName === "classic" ? Chip_module_default.selectedChip : selectedChipCambioStyle]: selected,
67
- [themeName === "classic" ? Chip_module_default.deselectedChip : deselectedChipCambioStyle]: !selected,
68
- [Chip_module_default.disabled]: disabled,
69
- [Chip_module_default.forceFocus]: dangerouslyForceFocusStyles
70
- }
71
- );
72
- const iconStyles = _classnames2.default.call(void 0, Chip_module_default.icon, {
73
- [Chip_module_default.selectedIcon]: selected
74
- });
75
- const typographySize = {
76
- ["sm"]: 200,
77
- ["lg"]: 300
78
- };
79
- const color = _react.useMemo.call(void 0,
80
- () => typographyColor({ themeName, selected, on }),
81
- [themeName, selected, on]
82
- );
83
- return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
84
- "button",
85
- {
86
- className: chipStyles,
87
- disabled,
88
- "data-testid": dataTestId,
89
- ref,
90
- type: "button",
91
- "aria-pressed": selected,
92
- onClick: onChange,
93
- children: [
94
- Icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: iconStyles }),
95
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _GANR5JVVcjs.Box_default, { paddingX: Icon ? 1 : 0, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
96
- _XU3CLITIcjs.Typography_default,
97
- {
98
- size: themeName === "classic" ? typographySize[transformedSize] : 100,
99
- color,
100
- weight: themeName === "classic" ? "regular" : "medium",
101
- children: text
102
- }
103
- ) })
104
- ]
105
- }
106
- );
107
- }
108
- );
109
- Chip.displayName = "Chip";
110
- var Chip_default = Chip;
111
-
112
-
113
-
114
- exports.Chip_default = Chip_default;
115
- //# sourceMappingURL=NCUQOLOV.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/Chip/Chip.tsx","css-module:./Chip.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,SAAgB,YAAY,eAAe;AAC3C,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,eAAc,yBAAwB,cAAa,wBAAuB,YAAW,sBAAqB,kBAAiB,4BAA2B,gBAAe,0BAAyB,wBAAuB,kCAAiC,wCAAuC,kDAAiD,sBAAqB,gCAA+B,sCAAqC,gDAA+C,QAAO,kBAAiB,gBAAe,0BAAyB,MAAK,gBAAe,MAAK,gBAAe,cAAa,uBAAsB;;;ADiJ1tB,SASW,KATX;AAzIN,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACF,GAIwB;AACtB,MAAI,cAAc,YAAY,OAAO,kBAAkB;AACrD,QAAI,UAAU;AACZ,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF,OAAO;AACL,QAAI,UAAU;AACZ,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF;AACF;AAwDA,IAAM,OAAO;AAAA,EACX,CACE;AAAA,IACE,UAAU,eAAe;AAAA,IACzB,WAAW;AAAA,IACX,eAAe;AAAA,IACf,OAAO;AAAA,IACP;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA,MAAM;AAAA,IACN;AAAA,EACF,GACA,QACG;AACH,UAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,UAAM,kBAAkB,cAAc,WAAW,OAAO;AACxD,UAAM,aAAa,cAAc;AACjC,UAAM,WAAW,CAAC,cAAc;AAEhC,UAAM,0BACJ,OAAO,oBACH,oBAAO,qBACP,oBAAO;AAEb,UAAM,4BACJ,OAAO,oBACH,oBAAO,uBACP,oBAAO;AAEb,UAAM,aAAa;AAAA,MACjB,oBAAO;AAAA,MACP,cAAc,YAAY,oBAAO,cAAc,oBAAO;AAAA,MACtD,oBAAO,eAAe;AAAA,MACtB;AAAA,QACE,CAAC,cAAc,YACX,oBAAO,eACP,uBAAuB,GAAG;AAAA,QAC9B,CAAC,cAAc,YACX,oBAAO,iBACP,yBAAyB,GAAG,CAAC;AAAA,QACjC,CAAC,oBAAO,QAAQ,GAAG;AAAA,QACnB,CAAC,oBAAO,UAAU,GAAG;AAAA,MACvB;AAAA,IACF;AACA,UAAM,aAAa,WAAW,oBAAO,MAAM;AAAA,MACzC,CAAC,oBAAO,YAAY,GAAG;AAAA,IACzB,CAAC;AACD,UAAM,iBAAiB;AAAA,MACrB,CAAC,IAAI,GAAG;AAAA,MACR,CAAC,IAAI,GAAG;AAAA,IACV;AAEA,UAAM,QAAQ;AAAA,MACZ,MAAM,gBAAgB,EAAE,WAAW,UAAU,GAAG,CAAC;AAAA,MACjD,CAAC,WAAW,UAAU,EAAE;AAAA,IAC1B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,QACX;AAAA,QACA,eAAa;AAAA,QACb;AAAA,QACA,MAAK;AAAA,QACL,gBAAc;AAAA,QACd,SAAS;AAAA,QAER;AAAA,kBAAQ,oBAAC,QAAK,WAAW,YAAY;AAAA,UACtC,oBAAC,eAAI,UAAU,OAAO,IAAI,GACxB;AAAA,YAAC;AAAA;AAAA,cACC,MACE,cAAc,YAAY,eAAe,eAAe,IAAI;AAAA,cAE9D;AAAA,cACA,QAAQ,cAAc,YAAY,YAAY;AAAA,cAE7C;AAAA;AAAA,UACH,GACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ","sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport classnames from \"classnames\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport styles from \"./Chip.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nfunction typographyColor({\n themeName,\n selected,\n on,\n}: {\n themeName: \"cambio\" | \"classic\";\n selected: boolean;\n on: \"lightBackground\" | \"darkBackground\";\n}): \"white\" | \"gray900\" {\n if (themeName === \"cambio\" && on === \"darkBackground\") {\n if (selected) {\n return \"gray900\";\n } else {\n return \"white\";\n }\n } else {\n if (selected) {\n return \"white\";\n } else {\n return \"gray900\";\n }\n }\n}\n\ntype ChipProps = {\n /**\n * If true, the chip will be disabled.\n */\n disabled?: boolean;\n /**\n * Sets the initial status of this chip component.\n * * `true` will display a grey chip.\n * * `false` will display a premium800 color chip.\n *\n * @defaultValue \"false\"\n */\n selected?: boolean;\n /**\n * Test id for the button\n */\n \"data-testid\"?: string;\n /**\n * Size of the chip.\n *\n * Classic:\n * * `sm`: 32px\n * * `lg`: 48px\n *\n * Cambio:\n * * `sm`: 32px\n *\n * @defaultValue sm\n */\n size?: \"sm\" | \"lg\";\n /**\n * The text to be displayed on the chip\n */\n text: string;\n /**\n * Indicate whether the badge renders on a light or dark background. Changes the color of the chip (Cambio only)\n *\n * @defaulValue `lightBackground`\n */\n on?: \"lightBackground\" | \"darkBackground\";\n /**\n * The callback to be called when the chip is clicked\n */\n onChange: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * The icon to be displayed.\n */\n icon?: React.ComponentType<{ className?: string }>;\n /** forces focus ring styling */\n dangerouslyForceFocusStyles?: boolean;\n};\n/**\n * [Chip](https://cambly-syntax.vercel.app/?path=/docs/components-chip--docs) is used to show status (selected/not selected) like a toggle button.\n */\nconst Chip = forwardRef<HTMLButtonElement, ChipProps>(\n (\n {\n disabled: disabledProp = false,\n selected = false,\n \"data-testid\": dataTestId,\n size = \"sm\",\n text,\n on = \"lightBackground\",\n onChange,\n icon: Icon,\n dangerouslyForceFocusStyles,\n }: ChipProps,\n ref,\n ) => {\n const { themeName } = useTheme();\n const transformedSize = themeName === \"cambio\" ? \"sm\" : size;\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n\n const selectedChipCambioStyle =\n on === \"lightBackground\"\n ? styles.selectedChipCambio\n : styles.selectedChipCambioOnDarkBackground;\n\n const deselectedChipCambioStyle =\n on === \"lightBackground\"\n ? styles.deselectedChipCambio\n : styles.deselectedChipCambioOnDarkBackground;\n\n const chipStyles = classnames(\n styles.chip,\n themeName === \"classic\" ? styles.chipClassic : styles.chipCambio,\n styles[transformedSize],\n {\n [themeName === \"classic\"\n ? styles.selectedChip\n : selectedChipCambioStyle]: selected,\n [themeName === \"classic\"\n ? styles.deselectedChip\n : deselectedChipCambioStyle]: !selected,\n [styles.disabled]: disabled,\n [styles.forceFocus]: dangerouslyForceFocusStyles,\n },\n );\n const iconStyles = classnames(styles.icon, {\n [styles.selectedIcon]: selected,\n });\n const typographySize = {\n [\"sm\"]: 200,\n [\"lg\"]: 300,\n } as const;\n\n const color = useMemo(\n () => typographyColor({ themeName, selected, on }),\n [themeName, selected, on],\n );\n\n return (\n <button\n className={chipStyles}\n disabled={disabled}\n data-testid={dataTestId}\n ref={ref}\n type=\"button\"\n aria-pressed={selected}\n onClick={onChange}\n >\n {Icon && <Icon className={iconStyles} />}\n <Box paddingX={Icon ? 1 : 0}>\n <Typography\n size={\n themeName === \"classic\" ? typographySize[transformedSize] : 100\n }\n color={color}\n weight={themeName === \"classic\" ? \"regular\" : \"medium\"}\n >\n {text}\n </Typography>\n </Box>\n </button>\n );\n },\n);\n\nChip.displayName = \"Chip\";\n\nexport default Chip;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Chip/Chip.module.css\"; export default {\"chip\":\"_chip_1ndh3_1\",\"chipClassic\":\"_chipClassic_1ndh3_10\",\"chipCambio\":\"_chipCambio_1ndh3_15\",\"disabled\":\"_disabled_1ndh3_20\",\"deselectedChip\":\"_deselectedChip_1ndh3_25\",\"selectedChip\":\"_selectedChip_1ndh3_29\",\"deselectedChipCambio\":\"_deselectedChipCambio_1ndh3_34\",\"deselectedChipCambioOnDarkBackground\":\"_deselectedChipCambioOnDarkBackground_1ndh3_38\",\"selectedChipCambio\":\"_selectedChipCambio_1ndh3_42\",\"selectedChipCambioOnDarkBackground\":\"_selectedChipCambioOnDarkBackground_1ndh3_46\",\"icon\":\"_icon_1ndh3_50\",\"selectedIcon\":\"_selectedIcon_1ndh3_58\",\"sm\":\"_sm_1ndh3_62\",\"lg\":\"_lg_1ndh3_68\",\"forceFocus\":\"_forceFocus_1ndh3_75\"}"]}
@@ -1,96 +0,0 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
2
-
3
-
4
- var _W2JRKN5Ecjs = require('./W2JRKN5E.cjs');
5
-
6
-
7
-
8
- var _HWQUS53Mcjs = require('./HWQUS53M.cjs');
9
-
10
-
11
-
12
- var _UQY2ELTZcjs = require('./UQY2ELTZ.cjs');
13
-
14
-
15
-
16
- var _J43HGNHNcjs = require('./J43HGNHN.cjs');
17
-
18
-
19
- var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
20
-
21
-
22
- var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
23
-
24
- // src/IconButton/IconButton.tsx
25
- var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
26
- var _react = require('react');
27
-
28
- // css-module:./IconButton.module.css#css-module
29
- var IconButton_module_default = { "iconButton": "_iconButton_4ynk4_1", "iconButtonNoBorder": "_iconButtonNoBorder_4ynk4_8", "sm": "_sm_4ynk4_49", "md": "_md_4ynk4_54", "lg": "_lg_4ynk4_59", "smCambio": "_smCambio_4ynk4_64", "mdCambio": "_mdCambio_4ynk4_69", "lgCambio": "_lgCambio_4ynk4_74", "smIcon": "_smIcon_4ynk4_79", "mdIcon": "_mdIcon_4ynk4_86", "lgIcon": "_lgIcon_4ynk4_93", "smIconCambio": "_smIconCambio_4ynk4_100", "mdIconCambio": "_mdIconCambio_4ynk4_107", "lgIconCambio": "_lgIconCambio_4ynk4_114" };
30
-
31
- // src/IconButton/IconButton.tsx
32
- var _jsxruntime = require('react/jsx-runtime');
33
- var classicIconSize = {
34
- sm: IconButton_module_default.smIcon,
35
- md: IconButton_module_default.mdIcon,
36
- lg: IconButton_module_default.lgIcon
37
- };
38
- var cambioIconSize = {
39
- sm: IconButton_module_default.smIconCambio,
40
- md: IconButton_module_default.mdIconCambio,
41
- lg: IconButton_module_default.lgIconCambio
42
- };
43
- var IconButton = _react.forwardRef.call(void 0,
44
- ({
45
- accessibilityLabel,
46
- color = "primary",
47
- "data-testid": dataTestId,
48
- disabled = false,
49
- icon: Icon,
50
- size = "md",
51
- tooltip,
52
- on = "lightBackground",
53
- onClick
54
- }, ref) => {
55
- const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
56
- const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
57
- const foregroundColorClass = themeName === "classic" ? _UQY2ELTZcjs.classicForegroundColor.call(void 0, _HWQUS53Mcjs.classicColor.call(void 0, color)) : _UQY2ELTZcjs.cambioForegroundColor.call(void 0, _HWQUS53Mcjs.cambioColor.call(void 0, color), on);
58
- const backgroundColorClass = themeName === "classic" ? _J43HGNHNcjs.classicBackgroundColor.call(void 0, _HWQUS53Mcjs.classicColor.call(void 0, color)) : _J43HGNHNcjs.cambioBackgroundColor.call(void 0, _HWQUS53Mcjs.cambioColor.call(void 0, color), on);
59
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
60
- "button",
61
- {
62
- "aria-label": accessibilityLabel,
63
- "data-testid": dataTestId,
64
- type: "button",
65
- title: tooltip,
66
- disabled: !isHydrated || disabled,
67
- onClick,
68
- className: _classnames2.default.call(void 0,
69
- IconButton_module_default.iconButton,
70
- foregroundColorClass,
71
- backgroundColorClass,
72
- themeName === "classic" ? IconButton_module_default[size] : IconButton_module_default[`${size}Cambio`],
73
- {
74
- [_W2JRKN5Ecjs.Button_module_default.secondaryBorder]: themeName === "classic" && color === "secondary",
75
- [_W2JRKN5Ecjs.Button_module_default.secondaryDestructiveBorder]: themeName === "classic" && color === "destructive-secondary",
76
- [IconButton_module_default.iconButtonNoBorder]: themeName === "classic" && !["secondary", "destructive-secondary"].includes(color) || themeName === "cambio"
77
- }
78
- ),
79
- ref,
80
- children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
81
- Icon,
82
- {
83
- className: themeName === "classic" ? classicIconSize[size] : cambioIconSize[size]
84
- }
85
- )
86
- }
87
- );
88
- }
89
- );
90
- IconButton.displayName = "IconButton";
91
- var IconButton_default = IconButton;
92
-
93
-
94
-
95
- exports.IconButton_default = IconButton_default;
96
- //# sourceMappingURL=OAZD7W2W.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/IconButton/IconButton.tsx","css-module:./IconButton.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,gBAAgB;AAKvB,SAAgB,kBAAkB;;;ACLkE,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,sBAAqB,+BAA8B,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,YAAW,sBAAqB,YAAW,sBAAqB,YAAW,sBAAqB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,gBAAe,2BAA0B,gBAAe,2BAA0B,gBAAe,0BAAyB;;;ADoK5iB;AAnJR,IAAM,kBAAkB;AAAA,EACtB,IAAI,0BAAO;AAAA,EACX,IAAI,0BAAO;AAAA,EACX,IAAI,0BAAO;AACb;AAEA,IAAM,iBAAiB;AAAA,EACrB,IAAI,0BAAO;AAAA,EACX,IAAI,0BAAO;AAAA,EACX,IAAI,0BAAO;AACb;AAmFA,IAAM,aAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,WAAW;AAAA,IACX,MAAM;AAAA,IACN,OAAO;AAAA,IACP;AAAA,IACA,KAAK;AAAA,IACL;AAAA,EACF,GACA,QACG;AACH,UAAM,aAAa,cAAc;AACjC,UAAM,EAAE,UAAU,IAAI,SAAS;AAE/B,UAAM,uBACJ,cAAc,YACV,uBAAuB,aAAa,KAAK,CAAC,IAC1C,sBAAsB,YAAY,KAAK,GAAG,EAAE;AAElD,UAAM,uBACJ,cAAc,YACV,uBAAuB,aAAa,KAAK,CAAC,IAC1C,sBAAsB,YAAY,KAAK,GAAG,EAAE;AAElD,WACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY;AAAA,QACZ,eAAa;AAAA,QACb,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,cAAc;AAAA,QACzB;AAAA,QACA,WAAW;AAAA,UACT,0BAAO;AAAA,UACP;AAAA,UACA;AAAA,UACA,cAAc,YAAY,0BAAO,IAAI,IAAI,0BAAO,GAAG,YAAY;AAAA,UAC/D;AAAA,YACE,CAAC,sBAAa,eAAe,GAC3B,cAAc,aAAa,UAAU;AAAA,YACvC,CAAC,sBAAa,0BAA0B,GACtC,cAAc,aAAa,UAAU;AAAA,YACvC,CAAC,0BAAO,kBAAkB,GACvB,cAAc,aACb,CAAC,CAAC,aAAa,uBAAuB,EAAE,SAAS,KAAK,KACxD,cAAc;AAAA,UAClB;AAAA,QACF;AAAA,QACA;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,WACE,cAAc,YACV,gBAAgB,IAAI,IACpB,eAAe,IAAI;AAAA;AAAA,QAE3B;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ","sourcesContent":["import classNames from \"classnames\";\nimport {\n classicForegroundColor,\n cambioForegroundColor,\n} from \"../colors/foregroundColor\";\nimport React, { forwardRef } from \"react\";\nimport { type Size } from \"../constants\";\nimport styles from \"./IconButton.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\nimport { classicColor, cambioColor } from \"../Button/constants/color\";\nimport buttonStyles from \"../Button/Button.module.css\";\nimport {\n classicBackgroundColor,\n cambioBackgroundColor,\n} from \"../colors/backgroundColor\";\n\nconst classicIconSize = {\n sm: styles.smIcon,\n md: styles.mdIcon,\n lg: styles.lgIcon,\n};\n\nconst cambioIconSize = {\n sm: styles.smIconCambio,\n md: styles.mdIconCambio,\n lg: styles.lgIconCambio,\n};\n\ntype IconButtonProps = {\n /**\n * The color of the button\n *\n * Classic only:\n * * `inverse`\n * * `success`\n *\n * Cambio only:\n * * `success-primary`\n * * `success-secondary`\n * * `success-tertiary`\n *\n * @defaultValue \"primary\"\n */\n color?:\n | \"primary\"\n | \"secondary\"\n | \"tertiary\"\n | \"destructive-primary\"\n | \"destructive-secondary\"\n | \"destructive-tertiary\"\n | \"branded\"\n | \"success\"\n | \"success-primary\"\n | \"success-secondary\"\n | \"success-tertiary\"\n | \"inverse\";\n /**\n * Test id for the button\n */\n \"data-testid\"?: string;\n /**\n * The size of the button\n *\n * Classic:\n * * `sm`: 32px\n * * `md`: 40px\n * * `lg`: 48px\n *\n * Cambio:\n * * `sm`: 32px\n * * `md`: 48px\n * * `lg`: 64px\n *\n * @defaultValue \"md\"\n */\n size?: (typeof Size)[number];\n /**\n * The label to be used for accessibility\n */\n accessibilityLabel: string;\n /**\n * The icon to be displayed. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n icon: React.ComponentType<{ className?: string }>;\n /**\n * If `true`, the button will be disabled\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * Indicate whether the button renders on a light or dark background. Changes the color of the button (Cambio only)\n *\n * @defaulValue `lightBackground`\n */\n on?: \"lightBackground\" | \"darkBackground\";\n /**\n * The callback to be called when the button is clicked\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * The tooltip to be displayed when the user hovers over the button\n */\n tooltip?: string;\n};\n\n/**\n * [IconButton](https://cambly-syntax.vercel.app/?path=/docs/components-iconbutton--docs) is a clickable element that is used to perform an action.\n */\nconst IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n (\n {\n accessibilityLabel,\n color = \"primary\",\n \"data-testid\": dataTestId,\n disabled = false,\n icon: Icon,\n size = \"md\",\n tooltip,\n on = \"lightBackground\",\n onClick,\n }: IconButtonProps,\n ref,\n ) => {\n const isHydrated = useIsHydrated();\n const { themeName } = useTheme();\n\n const foregroundColorClass =\n themeName === \"classic\"\n ? classicForegroundColor(classicColor(color))\n : cambioForegroundColor(cambioColor(color), on);\n\n const backgroundColorClass =\n themeName === \"classic\"\n ? classicBackgroundColor(classicColor(color))\n : cambioBackgroundColor(cambioColor(color), on);\n\n return (\n <button\n aria-label={accessibilityLabel}\n data-testid={dataTestId}\n type=\"button\"\n title={tooltip}\n disabled={!isHydrated || disabled}\n onClick={onClick}\n className={classNames(\n styles.iconButton,\n foregroundColorClass,\n backgroundColorClass,\n themeName === \"classic\" ? styles[size] : styles[`${size}Cambio`],\n {\n [buttonStyles.secondaryBorder]:\n themeName === \"classic\" && color === \"secondary\",\n [buttonStyles.secondaryDestructiveBorder]:\n themeName === \"classic\" && color === \"destructive-secondary\",\n [styles.iconButtonNoBorder]:\n (themeName === \"classic\" &&\n ![\"secondary\", \"destructive-secondary\"].includes(color)) ||\n themeName === \"cambio\",\n },\n )}\n ref={ref}\n >\n <Icon\n className={\n themeName === \"classic\"\n ? classicIconSize[size]\n : cambioIconSize[size]\n }\n />\n </button>\n );\n },\n);\n\nIconButton.displayName = \"IconButton\";\n\nexport default IconButton;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/IconButton/IconButton.module.css\"; export default {\"iconButton\":\"_iconButton_4ynk4_1\",\"iconButtonNoBorder\":\"_iconButtonNoBorder_4ynk4_8\",\"sm\":\"_sm_4ynk4_49\",\"md\":\"_md_4ynk4_54\",\"lg\":\"_lg_4ynk4_59\",\"smCambio\":\"_smCambio_4ynk4_64\",\"mdCambio\":\"_mdCambio_4ynk4_69\",\"lgCambio\":\"_lgCambio_4ynk4_74\",\"smIcon\":\"_smIcon_4ynk4_79\",\"mdIcon\":\"_mdIcon_4ynk4_86\",\"lgIcon\":\"_lgIcon_4ynk4_93\",\"smIconCambio\":\"_smIconCambio_4ynk4_100\",\"mdIconCambio\":\"_mdIconCambio_4ynk4_107\",\"lgIconCambio\":\"_lgIconCambio_4ynk4_114\"}"]}
@@ -1,9 +0,0 @@
1
- "use client"
2
-
3
- // css-module:../Button/Button.module.css#css-module
4
- var Button_module_default = { "button": "_button_9efd1_1", "buttonGap": "_buttonGap_9efd1_9", "disabledCambioPrimary": "_disabledCambioPrimary_9efd1_50", "fullWidth": "_fullWidth_9efd1_54", "sm": "_sm_9efd1_58", "md": "_md_9efd1_65", "lg": "_lg_9efd1_72", "smCambio": "_smCambio_9efd1_79", "mdCambio": "_mdCambio_9efd1_86", "lgCambio": "_lgCambio_9efd1_93", "icon": "_icon_9efd1_100", "smIcon": "_smIcon_9efd1_104", "mdIcon": "_mdIcon_9efd1_111", "lgIcon": "_lgIcon_9efd1_118", "secondaryBorder": "_secondaryBorder_9efd1_125", "secondaryDestructiveBorder": "_secondaryDestructiveBorder_9efd1_129", "loading": "_loading_9efd1_143", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_9efd1_1", "loadingCircle": "_loadingCircle_9efd1_147" };
5
-
6
- export {
7
- Button_module_default
8
- };
9
- //# sourceMappingURL=OMFFRI3K.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["css-module:../Button/Button.module.css#css-module"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_9efd1_1\",\"buttonGap\":\"_buttonGap_9efd1_9\",\"disabledCambioPrimary\":\"_disabledCambioPrimary_9efd1_50\",\"fullWidth\":\"_fullWidth_9efd1_54\",\"sm\":\"_sm_9efd1_58\",\"md\":\"_md_9efd1_65\",\"lg\":\"_lg_9efd1_72\",\"smCambio\":\"_smCambio_9efd1_79\",\"mdCambio\":\"_mdCambio_9efd1_86\",\"lgCambio\":\"_lgCambio_9efd1_93\",\"icon\":\"_icon_9efd1_100\",\"smIcon\":\"_smIcon_9efd1_104\",\"mdIcon\":\"_mdIcon_9efd1_111\",\"lgIcon\":\"_lgIcon_9efd1_118\",\"secondaryBorder\":\"_secondaryBorder_9efd1_125\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_9efd1_129\",\"loading\":\"_loading_9efd1_143\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_9efd1_1\",\"loadingCircle\":\"_loadingCircle_9efd1_147\"}"],"mappings":";;;AAA4F,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,yBAAwB,mCAAkC,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,YAAW,sBAAqB,YAAW,sBAAqB,YAAW,sBAAqB,QAAO,mBAAkB,UAAS,qBAAoB,UAAS,qBAAoB,UAAS,qBAAoB,mBAAkB,8BAA6B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["css-module:./Badge.module.css#css-module","../../src/Badge/Badge.tsx"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Badge/Badge.module.css\"; export default {\"icon\":\"_icon_1g9xb_1\"}","import Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport styles from \"./Badge.module.css\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nconst badgeColorClassic = [\n \"gray200\",\n \"gray900\",\n \"destructive700\",\n \"orange700\",\n \"yellow700\",\n \"success700\",\n \"primary700\",\n \"purple700\",\n] as const;\n\nconst badgeColorCambio = [\n \"sky\",\n \"success300\",\n \"destructive300\",\n \"orange\",\n \"tan\",\n \"gray370\",\n \"gray870\",\n \"lilac\",\n \"thistle\",\n \"pink\",\n] as const;\n\nconst badgeColorClassicToCambio = {\n gray200: \"gray370\",\n gray900: \"gray870\",\n destructive700: \"destructive300\",\n orange700: \"orange\",\n yellow700: \"tan\",\n success700: \"success300\",\n primary700: \"sky\",\n purple700: \"lilac\",\n sky: \"sky\",\n success300: \"success300\",\n destructive300: \"destructive300\",\n orange: \"orange\",\n tan: \"tan\",\n gray370: \"gray370\",\n gray870: \"gray870\",\n lilac: \"lilac\",\n thistle: \"thistle\",\n pink: \"pink\",\n} as const;\n\nconst badgeColorCambioToClassic = {\n gray200: \"gray200\",\n gray900: \"gray900\",\n destructive700: \"destructive700\",\n orange700: \"orange700\",\n yellow700: \"yellow700\",\n success700: \"success700\",\n primary700: \"primary700\",\n purple700: \"purple700\",\n sky: \"primary700\",\n success300: \"success700\",\n destructive300: \"destructive700\",\n orange: \"orange700\",\n tan: \"yellow700\",\n gray370: \"gray200\",\n gray870: \"gray900\",\n lilac: \"purple700\",\n thistle: \"purple700\",\n pink: \"purple700\",\n} as const;\n\nconst textColorForBackgroundColor = (\n color: (typeof badgeColorClassic)[number] | (typeof badgeColorCambio)[number],\n): \"gray900\" | \"white\" => {\n switch (color) {\n case \"gray200\":\n case \"yellow700\":\n return \"gray900\";\n case \"gray370\":\n case \"destructive300\":\n case \"orange\":\n case \"tan\":\n case \"success300\":\n case \"sky\":\n case \"thistle\":\n case \"pink\":\n case \"lilac\":\n return \"gray900\";\n default:\n return \"white\";\n }\n};\n\n/**\n * [Badge](https://cambly-syntax.vercel.app/?path=/docs/components-badge--docs) is a component to display short text and give additional context to features and other components.\n */\nconst Badge = ({\n icon: Icon,\n text,\n color = \"primary700\",\n}: {\n /**\n * The icon to be displayed. Please use a [Material Icon](https://material.io/resources/icons/)\n */\n icon?: React.ComponentType<{ className?: string }>;\n /**\n * The text to display inside the badge\n */\n text: string;\n /**\n * The color of the badge\n *\n * Classic colors:\n * * `gray200` => maps to neutralLight in Cambio\n * * `gray900` => maps to neutralDark in Cambio\n * * `destructive700` => maps to destructive in Cambio\n * * `orange700` => maps to orange in Cambio\n * * `yellow700` => maps to tan in Cambio\n * * `success700` => maps to success in Cambio\n * * `primary700` => maps to sky in Cambio\n * * `purple700` => maps to lilac in Cambio\n *\n * Cambio colors:\n * * `sky`\n * * `success300`\n * * `destructive300`\n * * `orange`\n * * `tan`\n * * `gray370`\n * * `gray870`\n * * `lilac`\n * * `thistle`\n * * `pink`\n *\n * @defaultValue \"primary700\"\n */\n color?:\n | (typeof badgeColorClassic)[number]\n | (typeof badgeColorCambio)[number];\n}): JSX.Element => {\n const { themeName } = useTheme();\n\n const mappedColor =\n themeName === \"cambio\"\n ? badgeColorClassicToCambio[color]\n : badgeColorCambioToClassic[color];\n\n return (\n <Box\n display={themeName === \"classic\" ? \"inlineBlock\" : \"inlineFlex\"}\n paddingX={themeName === \"classic\" ? 2 : 3}\n paddingY={1}\n rounding={themeName === \"classic\" ? \"full\" : \"sm\"}\n backgroundColor={mappedColor}\n alignItems=\"center\"\n justifyContent=\"center\"\n height={themeName === \"cambio\" ? 32 : undefined}\n >\n <Typography color={textColorForBackgroundColor(mappedColor)}>\n <Box display=\"flex\" gap={1} alignItems=\"center\" justifyContent=\"start\">\n {Icon && <Icon className={styles.icon} />}\n <Typography\n color={textColorForBackgroundColor(mappedColor)}\n size={100}\n weight={themeName === \"classic\" ? \"bold\" : \"medium\"}\n >\n {text}\n </Typography>\n </Box>\n </Typography>\n </Box>\n );\n};\n\nexport default Badge;\n"],"mappings":";;;;;;;;;;;;AAA0F,IAAO,uBAAQ,EAAC,QAAO,gBAAe;;;AC+JxH,SACW,KADX;AAlIR,IAAM,4BAA4B;AAAA,EAChC,SAAS;AAAA,EACT,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,KAAK;AAAA,EACL,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AACR;AAEA,IAAM,4BAA4B;AAAA,EAChC,SAAS;AAAA,EACT,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,KAAK;AAAA,EACL,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AACR;AAEA,IAAM,8BAA8B,CAClC,UACwB;AACxB,UAAQ,OAAO;AAAA,IACb,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAKA,IAAM,QAAQ,CAAC;AAAA,EACb,MAAM;AAAA,EACN;AAAA,EACA,QAAQ;AACV,MAuCmB;AACjB,QAAM,EAAE,UAAU,IAAI,SAAS;AAE/B,QAAM,cACJ,cAAc,WACV,0BAA0B,KAAK,IAC/B,0BAA0B,KAAK;AAErC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,cAAc,YAAY,gBAAgB;AAAA,MACnD,UAAU,cAAc,YAAY,IAAI;AAAA,MACxC,UAAU;AAAA,MACV,UAAU,cAAc,YAAY,SAAS;AAAA,MAC7C,iBAAiB;AAAA,MACjB,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,QAAQ,cAAc,WAAW,KAAK;AAAA,MAEtC,8BAAC,sBAAW,OAAO,4BAA4B,WAAW,GACxD,+BAAC,eAAI,SAAQ,QAAO,KAAK,GAAG,YAAW,UAAS,gBAAe,SAC5D;AAAA,gBAAQ,oBAAC,QAAK,WAAW,qBAAO,MAAM;AAAA,QACvC;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,4BAA4B,WAAW;AAAA,YAC9C,MAAM;AAAA,YACN,QAAQ,cAAc,YAAY,SAAS;AAAA,YAE1C;AAAA;AAAA,QACH;AAAA,SACF,GACF;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":";;;;;;;;;AAAA;AAAA,EAEE;AAAA,EACA;AAAA,OAEK;AAkFD;AAhEN,IAAM,qBAAqB,cAA6C,IAAI;AAErE,SAAS,iBAAgD;AAC9D,QAAM,UAAU,WAAW,kBAAkB;AAC7C,SAAO,CAAC,UAAU,OAAO;AAC3B;AAgBe,SAAR,YAA6B;AAAA,EAClC,OAAO;AAAA,EACP,cAAc;AAAA,EACd;AACF,GAiCiB;AACf,QAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,QAAM,aAAa,cAAc,YAAY,SAAS,OAAO,OAAO;AAEpE,SACE,oBAAC,mBAAmB,UAAnB,EAA4B,OAAO,EAAE,MAAM,YAAY,YAAY,GAClE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,gBAAgB,gBAAgB,aAAa,UAAU;AAAA,MACvD,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,eAAe,gBAAgB,aAAa,QAAQ;AAAA,QACtD;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;AAEA,YAAY,cAAc","sourcesContent":["import {\n type ReactNode,\n createContext,\n useContext,\n type ReactElement,\n} from \"react\";\nimport Box from \"../Box/Box\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype Size =\n | \"xs\"\n | \"sm\"\n | \"md\"\n | \"lg\"\n /* `xl` is deprecated and mapped to `lg` in Cambio */\n | \"xl\";\ntype Orientation = \"standard\" | \"reverse\";\n\ntype AvatarGroupContextType = {\n size: Size;\n orientation: Orientation;\n};\n\nconst AvatarGroupContext = createContext<AvatarGroupContextType | null>(null);\n\nexport function useAvatarGroup(): AvatarGroupContextType | null {\n const context = useContext(AvatarGroupContext);\n return !context ? null : context;\n}\n\n/**\n * [AvatarGroup](https://cambly-syntax.vercel.app/?path=/docs/components-avatargroup--docs) is a stack of avatars to represent a group of people\n *\n * Pass in Avatar components as children to the AvatarGroup component. The size prop that is passed into the AvatarGroup component will override Avatar's size prop..\n *\n * Usage:\n *\n * <AvatarGroup size=\"xl\" orientation=\"standard\">\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * </AvatarGroup>\n *\n */\nexport default function AvatarGroup({\n size = \"md\",\n orientation = \"standard\",\n children,\n}: {\n /**\n * Size of the avatars in the AvatarGroup.\n *\n * Classic:\n * * `sm`: 24px\n * * `md`: 40px\n * * `lg`: 72px\n * * `xl`: 128px\n *\n * Cambio:\n * * `xs`: 24px (Cambio only)\n * * `sm`: 32px\n * * `md`: 48px\n * * `lg`: 64px\n * * `xl`: 64px (deprecated, maps to `lg` in Cambio)\n *\n * @defaultValue `md`\n */\n size?: Size;\n /**\n * Orientation of the AvatarGroup.\n * This describes the order of rendering of the Avatar components.\n * Standard renders the Avatar components with the right component on top.\n * Reverse renders the Avatar components with the left component on top.\n *\n * @defaultValue `standard`\n */\n orientation?: Orientation;\n /**\n * Avatars to be rendered within the AvatarGroup.\n */\n children: ReactNode;\n}): ReactElement {\n const { themeName } = useTheme();\n const parsedSize = themeName === \"cambio\" && size === \"xl\" ? \"lg\" : size;\n\n return (\n <AvatarGroupContext.Provider value={{ size: parsedSize, orientation }}>\n <Box\n display=\"flex\"\n justifyContent={orientation === \"standard\" ? \"start\" : \"end\"}\n dangerouslySetInlineStyle={{\n __style: {\n flexDirection: orientation === \"standard\" ? \"row\" : \"row-reverse\",\n },\n }}\n >\n {children}\n </Box>\n </AvatarGroupContext.Provider>\n );\n}\n\nAvatarGroup.displayName = \"AvatarGroup\";\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import {\n type ReactNode,\n createContext,\n useContext,\n type ReactElement,\n} from \"react\";\nimport Box from \"../Box/Box\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype Size =\n | \"xs\"\n | \"sm\"\n | \"md\"\n | \"lg\"\n /* `xl` is deprecated and mapped to `lg` in Cambio */\n | \"xl\";\ntype Orientation = \"standard\" | \"reverse\";\n\ntype AvatarGroupContextType = {\n size: Size;\n orientation: Orientation;\n};\n\nconst AvatarGroupContext = createContext<AvatarGroupContextType | null>(null);\n\nexport function useAvatarGroup(): AvatarGroupContextType | null {\n const context = useContext(AvatarGroupContext);\n return !context ? null : context;\n}\n\n/**\n * [AvatarGroup](https://cambly-syntax.vercel.app/?path=/docs/components-avatargroup--docs) is a stack of avatars to represent a group of people\n *\n * Pass in Avatar components as children to the AvatarGroup component. The size prop that is passed into the AvatarGroup component will override Avatar's size prop..\n *\n * Usage:\n *\n * <AvatarGroup size=\"xl\" orientation=\"standard\">\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * </AvatarGroup>\n *\n */\nexport default function AvatarGroup({\n size = \"md\",\n orientation = \"standard\",\n children,\n}: {\n /**\n * Size of the avatars in the AvatarGroup.\n *\n * Classic:\n * * `sm`: 24px\n * * `md`: 40px\n * * `lg`: 72px\n * * `xl`: 128px\n *\n * Cambio:\n * * `xs`: 24px (Cambio only)\n * * `sm`: 32px\n * * `md`: 48px\n * * `lg`: 64px\n * * `xl`: 64px (deprecated, maps to `lg` in Cambio)\n *\n * @defaultValue `md`\n */\n size?: Size;\n /**\n * Orientation of the AvatarGroup.\n * This describes the order of rendering of the Avatar components.\n * Standard renders the Avatar components with the right component on top.\n * Reverse renders the Avatar components with the left component on top.\n *\n * @defaultValue `standard`\n */\n orientation?: Orientation;\n /**\n * Avatars to be rendered within the AvatarGroup.\n */\n children: ReactNode;\n}): ReactElement {\n const { themeName } = useTheme();\n const parsedSize = themeName === \"cambio\" && size === \"xl\" ? \"lg\" : size;\n\n return (\n <AvatarGroupContext.Provider value={{ size: parsedSize, orientation }}>\n <Box\n display=\"flex\"\n justifyContent={orientation === \"standard\" ? \"start\" : \"end\"}\n dangerouslySetInlineStyle={{\n __style: {\n flexDirection: orientation === \"standard\" ? \"row\" : \"row-reverse\",\n },\n }}\n >\n {children}\n </Box>\n </AvatarGroupContext.Provider>\n );\n}\n\nAvatarGroup.displayName = \"AvatarGroup\";\n"],"mappings":";;;;;;;;;AAAA;AAAA,EAEE;AAAA,EACA;AAAA,OAEK;AAkFD;AAhEN,IAAM,qBAAqB,cAA6C,IAAI;AAErE,SAAS,iBAAgD;AAC9D,QAAM,UAAU,WAAW,kBAAkB;AAC7C,SAAO,CAAC,UAAU,OAAO;AAC3B;AAgBe,SAAR,YAA6B;AAAA,EAClC,OAAO;AAAA,EACP,cAAc;AAAA,EACd;AACF,GAiCiB;AACf,QAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,QAAM,aAAa,cAAc,YAAY,SAAS,OAAO,OAAO;AAEpE,SACE,oBAAC,mBAAmB,UAAnB,EAA4B,OAAO,EAAE,MAAM,YAAY,YAAY,GAClE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,gBAAgB,gBAAgB,aAAa,UAAU;AAAA,MACvD,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,eAAe,gBAAgB,aAAa,QAAQ;AAAA,QACtD;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;AAEA,YAAY,cAAc;","names":[]}
@@ -1,43 +0,0 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
2
-
3
-
4
- var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
5
-
6
- // css-module:./ButtonGroup.module.css#css-module
7
- var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_e77bq_1", "horizontal": "_horizontal_e77bq_5", "vertical": "_vertical_e77bq_9", "smallGap": "_smallGap_e77bq_13", "mediumGap": "_mediumGap_e77bq_17", "largeGap": "_largeGap_e77bq_21", "smallGapCambio": "_smallGapCambio_e77bq_25", "mediumGapCambio": "_mediumGapCambio_e77bq_29", "largeGapCambio": "_largeGapCambio_e77bq_33" };
8
-
9
- // src/ButtonGroup/ButtonGroup.tsx
10
- var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
11
- var _jsxruntime = require('react/jsx-runtime');
12
- var gapClassic = {
13
- sm: ButtonGroup_module_default.smallGap,
14
- md: ButtonGroup_module_default.mediumGap,
15
- lg: ButtonGroup_module_default.largeGap
16
- };
17
- var gapCambio = {
18
- sm: ButtonGroup_module_default.smallGapCambio,
19
- md: ButtonGroup_module_default.mediumGapCambio,
20
- lg: ButtonGroup_module_default.largeGapCambio
21
- };
22
- var ButtonGroup = ({
23
- orientation = "horizontal",
24
- size = "md",
25
- children
26
- }) => {
27
- const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
28
- const classnames = _classnames2.default.call(void 0,
29
- ButtonGroup_module_default.buttonGroup,
30
- themeName === "classic" ? gapClassic[size] : gapCambio[size],
31
- {
32
- [ButtonGroup_module_default.horizontal]: orientation === "horizontal",
33
- [ButtonGroup_module_default.vertical]: orientation === "vertical"
34
- }
35
- );
36
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: classnames, children });
37
- };
38
- var ButtonGroup_default = ButtonGroup;
39
-
40
-
41
-
42
- exports.ButtonGroup_default = ButtonGroup_default;
43
- //# sourceMappingURL=RVFY33X2.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["css-module:./ButtonGroup.module.css#css-module","../../src/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":";;;;;;AAAsG,IAAO,6BAAQ,EAAC,eAAc,wBAAuB,cAAa,uBAAsB,YAAW,qBAAoB,YAAW,sBAAqB,aAAY,uBAAsB,YAAW,sBAAqB,kBAAiB,4BAA2B,mBAAkB,6BAA4B,kBAAiB,2BAA0B;;;ACGpc,OAAO,gBAAgB;AA4Dd;AAzDT,IAAM,aAAa;AAAA,EACjB,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AACb;AAEA,IAAM,YAAY;AAAA,EAChB,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AACb;AAKA,IAAM,cAAc,CAAC;AAAA,EACnB,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AACF,MA2BoB;AAClB,QAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,QAAM,aAAa;AAAA,IACjB,2BAAO;AAAA,IACP,cAAc,YAAY,WAAW,IAAI,IAAI,UAAU,IAAI;AAAA,IAC3D;AAAA,MACE,CAAC,2BAAO,UAAU,GAAG,gBAAgB;AAAA,MACrC,CAAC,2BAAO,QAAQ,GAAG,gBAAgB;AAAA,IACrC;AAAA,EACF;AAEA,SAAO,oBAAC,SAAI,WAAW,YAAa,UAAS;AAC/C;AAEA,IAAO,sBAAQ","sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/ButtonGroup/ButtonGroup.module.css\"; export default {\"buttonGroup\":\"_buttonGroup_e77bq_1\",\"horizontal\":\"_horizontal_e77bq_5\",\"vertical\":\"_vertical_e77bq_9\",\"smallGap\":\"_smallGap_e77bq_13\",\"mediumGap\":\"_mediumGap_e77bq_17\",\"largeGap\":\"_largeGap_e77bq_21\",\"smallGapCambio\":\"_smallGapCambio_e77bq_25\",\"mediumGapCambio\":\"_mediumGapCambio_e77bq_29\",\"largeGapCambio\":\"_largeGapCambio_e77bq_33\"}","import { type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./ButtonGroup.module.css\";\nimport { type Size } from \"../constants\";\nimport classNames from \"classnames\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nconst gapClassic = {\n sm: styles.smallGap,\n md: styles.mediumGap,\n lg: styles.largeGap,\n} as const;\n\nconst gapCambio = {\n sm: styles.smallGapCambio,\n md: styles.mediumGapCambio,\n lg: styles.largeGapCambio,\n} as const;\n\n/**\n * [ButtonGroup](https://cambly-syntax.vercel.app/?path=/docs/components-buttongroup--docs) groups buttons in a row or column with consistent spacing between each button.\n */\nconst ButtonGroup = ({\n orientation = \"horizontal\",\n size = \"md\",\n children,\n}: {\n /**\n * The orientation of the button group\n *\n * @defaultValue \"horizontal\"\n */\n orientation?: \"horizontal\" | \"vertical\";\n /**\n * The size of the button group defines the spacing between each button\n *\n * Classic:\n * * `sm`: 8px\n * * `md`: 12px\n * * `lg`: 16px\n *\n * Cambio:\n * * `sm`: 4px\n * * `md`: 8px\n * * `lg`: 12px\n *\n * @defaultValue \"md\"\n */\n size?: (typeof Size)[number];\n /**\n * Buttons to be rendered inside the button group\n */\n children?: ReactNode;\n}): ReactElement => {\n const { themeName } = useTheme();\n const classnames = classNames(\n styles.buttonGroup,\n themeName === \"classic\" ? gapClassic[size] : gapCambio[size],\n {\n [styles.horizontal]: orientation === \"horizontal\",\n [styles.vertical]: orientation === \"vertical\",\n },\n );\n\n return <div className={classnames}>{children}</div>;\n};\n\nexport default ButtonGroup;\n"]}
@@ -1,9 +0,0 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
2
-
3
- // css-module:../rounding.module.css#css-module
4
- var rounding_module_default = { "roundingsm": "_roundingsm_1fw7w_2", "roundingmd": "_roundingmd_1fw7w_6", "roundinglg": "_roundinglg_1fw7w_10", "roundingxl": "_roundingxl_1fw7w_14", "roundingfull": "_roundingfull_1fw7w_18", "roundingsmCambio": "_roundingsmCambio_1fw7w_23", "roundingmdCambio": "_roundingmdCambio_1fw7w_27", "roundingfullCambio": "_roundingfullCambio_1fw7w_31" };
5
-
6
-
7
-
8
- exports.rounding_module_default = rounding_module_default;
9
- //# sourceMappingURL=S5QHTHST.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["css-module:../rounding.module.css#css-module"],"names":[],"mappings":";;;AAAuF,IAAO,0BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB,cAAa,wBAAuB,cAAa,wBAAuB,gBAAe,0BAAyB,oBAAmB,8BAA6B,oBAAmB,8BAA6B,sBAAqB,+BAA8B","sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/rounding.module.css\"; export default {\"roundingsm\":\"_roundingsm_1fw7w_2\",\"roundingmd\":\"_roundingmd_1fw7w_6\",\"roundinglg\":\"_roundinglg_1fw7w_10\",\"roundingxl\":\"_roundingxl_1fw7w_14\",\"roundingfull\":\"_roundingfull_1fw7w_18\",\"roundingsmCambio\":\"_roundingsmCambio_1fw7w_23\",\"roundingmdCambio\":\"_roundingmdCambio_1fw7w_27\",\"roundingfullCambio\":\"_roundingfullCambio_1fw7w_31\"}"]}
@@ -1,9 +0,0 @@
1
- "use client"
2
-
3
- // css-module:../rounding.module.css#css-module
4
- var rounding_module_default = { "roundingsm": "_roundingsm_1fw7w_2", "roundingmd": "_roundingmd_1fw7w_6", "roundinglg": "_roundinglg_1fw7w_10", "roundingxl": "_roundingxl_1fw7w_14", "roundingfull": "_roundingfull_1fw7w_18", "roundingsmCambio": "_roundingsmCambio_1fw7w_23", "roundingmdCambio": "_roundingmdCambio_1fw7w_27", "roundingfullCambio": "_roundingfullCambio_1fw7w_31" };
5
-
6
- export {
7
- rounding_module_default
8
- };
9
- //# sourceMappingURL=SHHN3SRR.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["css-module:../rounding.module.css#css-module"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/rounding.module.css\"; export default {\"roundingsm\":\"_roundingsm_1fw7w_2\",\"roundingmd\":\"_roundingmd_1fw7w_6\",\"roundinglg\":\"_roundinglg_1fw7w_10\",\"roundingxl\":\"_roundingxl_1fw7w_14\",\"roundingfull\":\"_roundingfull_1fw7w_18\",\"roundingsmCambio\":\"_roundingsmCambio_1fw7w_23\",\"roundingmdCambio\":\"_roundingmdCambio_1fw7w_27\",\"roundingfullCambio\":\"_roundingfullCambio_1fw7w_31\"}"],"mappings":";;;AAAuF,IAAO,0BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB,cAAa,wBAAuB,cAAa,wBAAuB,gBAAe,0BAAyB,oBAAmB,8BAA6B,oBAAmB,8BAA6B,sBAAqB,+BAA8B;","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/SelectList/SelectList.tsx","css-module:./SelectList.module.css#css-module"],"sourcesContent":["import React, {\n type ReactElement,\n type ReactNode,\n useId,\n useState,\n} from \"react\";\nimport Box from \"../Box/Box\";\nimport classNames from \"classnames\";\nimport {\n ColorBaseDestructive700,\n ColorBaseGray800,\n} from \"@cambly/syntax-design-tokens\";\nimport Typography from \"../Typography/Typography\";\nimport styles from \"./SelectList.module.css\";\nimport focusStyles from \"../Focus.module.css\";\nimport SelectOption from \"./SelectOption\";\nimport useFocusVisible from \"../useFocusVisible\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nconst iconSize = {\n sm: 20,\n md: 24,\n lg: 24,\n} as const;\n\n/**\n * [SelectList](https://cambly-syntax.vercel.app/?path=/docs/components-selectlist--docs) is a dropdown menu that allows users to select one option from a list.\n */\nexport default function SelectList({\n children,\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText,\n helperText,\n id,\n label,\n onChange,\n onClick,\n placeholderText,\n selectedValue = \"\",\n size = \"md\",\n}: {\n /**\n * One or more SelectList.Option components.\n */\n children: ReactNode;\n /**\n * Test id for the select element\n */\n \"data-testid\"?: string;\n /**\n * true if the select dropdown is disabled\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * Callback to be called when select is clicked\n */\n onClick?: React.MouseEventHandler<HTMLSelectElement>;\n /**\n * Text shown below select box if there is an input error.\n */\n errorText?: string;\n /**\n * Text shown below select box\n */\n helperText?: string;\n /**\n * Id of the select element\n */\n id?: string;\n /**\n * Text shown above select box\n */\n label: string;\n /**\n * The callback to be called when an option is selected\n */\n onChange: React.ChangeEventHandler<HTMLSelectElement>;\n /**\n * Text showing in select box if no option has been chosen.\n * We should always have a placeholder unless there is a default option selected\n */\n placeholderText?: string;\n /**\n * Value of the currently selected option\n */\n selectedValue?: string;\n /**\n * Size of the select box\n * * `sm`: 32px\n * * `md`: 40px\n * * `lg`: 48px\n *\n * @defaultValue \"md\"\n */\n size?: \"sm\" | \"md\" | \"lg\";\n}): ReactElement {\n const reactId = useId();\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const { themeName } = useTheme();\n const selectId = id ?? reactId;\n const { isFocusVisible } = useFocusVisible();\n const [isFocused, setIsFocused] = useState(false);\n\n return (\n <div\n className={classNames(styles.selectContainer, {\n [styles.opacityOverlay]: disabled,\n })}\n >\n {label && (\n <label htmlFor={selectId}>\n <Box paddingX={1}>\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </label>\n )}\n <div className={styles.selectWrapper}>\n <select\n id={selectId}\n data-testid={dataTestId}\n disabled={disabled}\n className={classNames(\n styles.selectBox,\n themeName === \"classic\"\n ? styles.selectBoxClassic\n : styles.selectBoxCambio,\n themeName === \"classic\" && styles[size],\n {\n [styles.unselected]: !selectedValue && !errorText,\n [styles.selected]: selectedValue && !errorText,\n [themeName === \"classic\"\n ? styles.selectError\n : styles.selectErrorCambio]: errorText,\n [focusStyles.accessibilityOutlineFocus]:\n isFocused && isFocusVisible, // for focus keyboard\n [styles.selectMouseFocusStyling]: isFocused && !isFocusVisible, // for focus mouse\n },\n )}\n onChange={onChange}\n onClick={onClick}\n value={\n placeholderText && !selectedValue ? placeholderText : selectedValue\n }\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n >\n {placeholderText && (\n <option disabled value={placeholderText}>\n {placeholderText}\n </option>\n )}\n {children}\n </select>\n <div className={styles.arrowIcon}>\n <svg\n focusable=\"false\"\n aria-hidden=\"true\"\n viewBox=\"0 0 24 24\"\n width={themeName === \"classic\" ? iconSize[size] : 24}\n >\n <path\n fill={errorText ? ColorBaseDestructive700 : ColorBaseGray800}\n d=\"M15.88 9.29 12 13.17 8.12 9.29a.9959.9959 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41-.39-.38-1.03-.39-1.42 0z\"\n />\n </svg>\n </div>\n </div>\n {(helperText || errorText) && (\n <Box paddingX={1}>\n <Typography\n size={100}\n color={errorText ? \"destructive-primary\" : \"gray700\"}\n >\n {errorText ? errorText : helperText}\n </Typography>\n </Box>\n )}\n </div>\n );\n}\n\nSelectList.Option = SelectOption;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/SelectList/SelectList.module.css\"; export default {\"selectContainer\":\"_selectContainer_dwmnw_1\",\"opacityOverlay\":\"_opacityOverlay_dwmnw_7\",\"selectWrapper\":\"_selectWrapper_dwmnw_11\",\"selectBox\":\"_selectBox_dwmnw_16\",\"selectBoxClassic\":\"_selectBoxClassic_dwmnw_32\",\"selectBoxCambio\":\"_selectBoxCambio_dwmnw_37\",\"selectMouseFocusStyling\":\"_selectMouseFocusStyling_dwmnw_46\",\"unselected\":\"_unselected_dwmnw_51\",\"selected\":\"_selected_dwmnw_55\",\"arrowIcon\":\"_arrowIcon_dwmnw_59\",\"sm\":\"_sm_dwmnw_73\",\"md\":\"_md_dwmnw_79\",\"lg\":\"_lg_dwmnw_85\",\"selectError\":\"_selectError_dwmnw_91\",\"selectErrorCambio\":\"_selectErrorCambio_dwmnw_97\"}"],"mappings":"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","names":[]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/Heading/Heading.tsx"],"names":[],"mappings":";;;;;;;;;AAqHI;AAjHJ,SAAS,aAAa;AAAA,EACpB;AAAA,EACA;AACF,GAGkC;AAChC,MAAI,cAAc,WAAW,CAAC,KAAK,KAAK,GAAG,EAAE,SAAS,IAAI,GAAG;AAC3D,WAAO;AAAA,EACT,WAAW,cAAc,SAAS;AAChC,WAAO;AAAA,EACT,OAAO;AACL,WAAO;AAAA,EACT;AACF;AAKA,IAAM,UAAU,CAAC;AAAA,EACf,QAAQ;AAAA,EACR,KAAK;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,YAAY;AAAA,EACZ;AAAA,EACA,OAAO;AACT,MAgFoB;AAClB,QAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,QAAM,gBAAgB,CAAC,KAAK,GAAG,EAAE,SAAS,IAAI,IAAI,UAAU;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA,QACE,cAAc,YACV,gBACA,aAAa,EAAE,WAAW,KAAK,CAAC;AAAA,MAGrC;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,kBAAQ","sourcesContent":["import { type ReactElement, type ReactNode } from \"react\";\nimport Typography from \"../Typography/Typography\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nfunction cambioWeight({\n fontStyle,\n size,\n}: {\n fontStyle: \"serif\" | \"sans-serif\";\n size: 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100;\n}): \"bold\" | \"medium\" | \"regular\" {\n if (fontStyle === \"serif\" && [400, 500, 600].includes(size)) {\n return \"bold\";\n } else if (fontStyle === \"serif\") {\n return \"medium\";\n } else {\n return \"regular\";\n }\n}\n\n/**\n * [Heading](https://cambly-syntax.vercel.app/?path=/docs/components-heading--docs) enforces a consistent style & accessibility best practices for headings.\n */\nconst Heading = ({\n align = \"start\",\n as = \"h1\",\n children,\n color = \"gray900\",\n \"data-testid\": dataTestId,\n fontStyle = \"sans-serif\",\n lineClamp,\n size = 500,\n}: {\n /**\n * Aligns the text to the left, right, or center of the container.\n * * `start` and `end` will align the text to the left or right of the container depending on the locale.\n * * `forceLeft` and `forceRight` will align the text to the left or right of the container regardless of the locale (should be used sparingly).\n *\n * @defaultValue \"start\"\n */\n align?: \"start\" | \"end\" | \"forceLeft\" | \"center\" | \"forceRight\";\n /**\n * DOM element to render as.\n *\n * @defaultValue \"h1\"\n */\n as?: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n /**\n * The text to be rendered\n */\n children?: ReactNode;\n /**\n * The color of the text.\n *\n * @defaultValue \"gray900\"\n */\n color?:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"success\"\n | \"white\"\n | \"inherit\";\n /**\n * Test id for the text.\n */\n \"data-testid\"?: string;\n /**\n * Style of the font\n *\n * Classic only supports `sans-serif`\n *\n * @defaultValue \"sans-serif\"\n */\n fontStyle?: \"serif\" | \"sans-serif\";\n /**\n * The number of lines we should truncate the text at\n */\n lineClamp?: number | undefined;\n /**\n * Size of the text.\n *\n * Classic:\n * * `500`: 20px\n * * `600`: 28px\n * * `700`: 40px\n * * `800`: 64px\n *\n * Cambio Mobile:\n * * `400`: 20px\n * * `500`: 23px\n * * `600`: 26px\n * * `700`: 29px\n * * `800`: 33px\n * * `900`: 37px\n * * `1000`: 41px\n * * `1100`: 46px\n *\n * Cambio Desktop (viewport width > 480px):\n * * `400`: 25px\n * * `500`: 31px\n * * `600`: 39px\n * * `700`: 49px\n * * `800`: 61px\n * * `900`: 76px\n * * `1000`: 95px\n * * `1100`: 119px\n *\n * @defaultValue 500\n */\n size?: 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100;\n}): ReactElement => {\n const { themeName } = useTheme();\n const classicWeight = [700, 800].includes(size) ? \"heavy\" : \"bold\";\n\n return (\n <Typography\n align={align}\n as={as}\n color={color}\n fontStyle={fontStyle}\n data-testid={dataTestId}\n lineClamp={lineClamp}\n size={size}\n weight={\n themeName === \"classic\"\n ? classicWeight\n : cambioWeight({ fontStyle, size })\n }\n >\n {children}\n </Typography>\n );\n};\n\nexport default Heading;\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/Dialog/Dialog.tsx","css-module:../elevation/elevation.module.css#css-module","css-module:./Dialog.module.css#css-module"],"sourcesContent":["import React, {\n type ReactNode,\n forwardRef,\n type ReactElement,\n useContext,\n type ComponentProps,\n} from \"react\";\nimport colorStyles from \"../colors/colors.module.css\";\nimport elevationStyles from \"../elevation/elevation.module.css\";\nimport layoutStyles from \"../layout.module.css\";\nimport paddingStyles from \"../Box/padding.module.css\";\nimport roundingStyles from \"../rounding.module.css\";\nimport boxStyles from \"../Box/Box.module.css\";\nimport styles from \"./Dialog.module.css\";\nimport { Dialog as ReactAriaDialog } from \"react-aria-components\";\nimport classNames from \"classnames\";\nimport type Box from \"../Box/Box\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype DialogSize = \"sm\" | \"md\" | \"lg\";\ntype DialogRounding = \"lg\" | \"xl\";\nexport type DialogProps = {\n /** Test id for the floating dialog */\n \"data-testid\"?: string;\n /** aria-label for the dialog */\n accessibilityLabel?: string;\n /** Content to be shown inside the dialog. */\n children?: ReactNode;\n /** Optional size of the dialog box */\n size?: DialogSize;\n};\n\nconst sizeToRounding: Record<DialogSize, DialogRounding> = {\n sm: \"lg\",\n md: \"lg\",\n lg: \"xl\",\n};\n\nconst sizeToPadding: Record<DialogSize, 4 | 5 | 6> = {\n sm: 4,\n md: 5,\n lg: 6,\n};\n\ntype DialogContextType = {\n /** padding of dialog content. overrides \\\"size\\\" prop's padding\" */\n padding?: ComponentProps<typeof Box>[\"padding\"];\n};\nexport const DialogContext = React.createContext<DialogContextType>({});\n\n/**\n * Dialog is a display component for showing content in Popovers, Modals, etc...\n *\n * Example Usage:\n ```\n <Dialog accessibilityLabel=\"Select some options\">\n <Box padding={2} maxWidth={400}>\n ... some content goes here\n </Box>\n </Dialog>\n ```\n */\nconst Dialog = forwardRef<HTMLDivElement, DialogProps>(function Dialog(\n props,\n ref,\n): ReactElement {\n const {\n \"data-testid\": dataTestId,\n accessibilityLabel,\n children,\n size = \"md\",\n } = props;\n\n const { padding } = useContext(DialogContext);\n const { themeName } = useTheme();\n\n return (\n <ReactAriaDialog\n ref={ref}\n data-testid={dataTestId}\n // first thing screen reader reads\n // e.g. \"<this was the label prop>, dialog, 4 items...\"\n aria-label={accessibilityLabel}\n className={classNames([\n boxStyles.box,\n boxStyles.flex,\n boxStyles.column,\n boxStyles.gap4,\n boxStyles.relative,\n boxStyles.overflowauto,\n colorStyles.whiteBackgroundColor,\n paddingStyles[`paddingX${padding ?? sizeToPadding[size]}`],\n paddingStyles[`paddingY${padding ?? sizeToPadding[size]}`],\n roundingStyles[\n themeName === \"classic\"\n ? (`rounding${sizeToRounding[size]}` as const)\n : \"roundingmdCambio\"\n ],\n elevationStyles.elevation400BoxShadow,\n layoutStyles.fullMaxHeight,\n layoutStyles.visibilityVisible,\n styles.dialog,\n ])}\n >\n {children}\n </ReactAriaDialog>\n );\n});\n\nexport default Dialog;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/elevation/elevation.module.css\"; export default {\"elevation400BoxShadow\":\"_elevation400BoxShadow_vw6sp_1\"}","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Dialog/Dialog.module.css\"; export default {\"dialog\":\"_dialog_1bme6_1\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,OAAO;AAAA,EAEL;AAAA,EAEA;AAAA,OAEK;;;ACN2F,IAAO,2BAAQ,EAAC,yBAAwB,iCAAgC;;;ACA9E,IAAO,wBAAQ,EAAC,UAAS,kBAAiB;;;AFctI,SAAS,UAAU,uBAAuB;AAC1C,OAAO,gBAAgB;AA8DnB;AA7CJ,IAAM,iBAAqD;AAAA,EACzD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,gBAA+C;AAAA,EACnD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAMO,IAAM,gBAAgB,MAAM,cAAiC,CAAC,CAAC;AActE,IAAM,SAAS,WAAwC,SAASA,QAC9D,OACA,KACc;AACd,QAAM;AAAA,IACJ,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,IAAI;AAEJ,QAAM,EAAE,QAAQ,IAAI,WAAW,aAAa;AAC5C,QAAM,EAAE,UAAU,IAAI,SAAS;AAE/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa;AAAA,MAGb,cAAY;AAAA,MACZ,WAAW,WAAW;AAAA,QACpB,mBAAU;AAAA,QACV,mBAAU;AAAA,QACV,mBAAU;AAAA,QACV,mBAAU;AAAA,QACV,mBAAU;AAAA,QACV,mBAAU;AAAA,QACV,sBAAY;AAAA,QACZ,uBAAc,WAAW,4BAAW,cAAc,IAAI,GAAG;AAAA,QACzD,uBAAc,WAAW,4BAAW,cAAc,IAAI,GAAG;AAAA,QACzD,wBACE,cAAc,YACT,WAAW,eAAe,IAAI,MAC/B,kBACN;AAAA,QACA,yBAAgB;AAAA,QAChB,sBAAa;AAAA,QACb,sBAAa;AAAA,QACb,sBAAO;AAAA,MACT,CAAC;AAAA,MAEA;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,iBAAQ;","names":["Dialog"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/TapArea/TapArea.tsx","css-module:./TapArea.module.css#css-module"],"names":[],"mappings":"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","sourcesContent":["import React, {\n type ReactNode,\n forwardRef,\n useReducer,\n type AriaAttributes,\n} from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./TapArea.module.css\";\nimport roundingStyles from \"../rounding.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\n\ntype TapAreaProps = AriaAttributes & {\n /**\n * The children to be rendered inside the tap area.\n */\n children?: ReactNode;\n /**\n * The label to be used for accessibility\n */\n accessibilityLabel?: string;\n /**\n * Test id for the tap area\n */\n \"data-testid\"?: string;\n /**\n * If `true`, the tap area will be disabled\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * If `true`, the tap area will be full width\n */\n fullWidth?: boolean;\n /**\n * The callback to be called when the tap area is clicked\n */\n onClick: (event: React.SyntheticEvent<HTMLDivElement>) => void;\n /**\n * The callback to be called when the tap area is hovered\n */\n onMouseEnter?: (event: React.SyntheticEvent<HTMLDivElement>) => void;\n /**\n * The callback to be called when the tap area is no longer hovered\n */\n onMouseLeave?: (event: React.SyntheticEvent<HTMLDivElement>) => void;\n /**\n * Border radius of the tap area.\n *\n * * `none`: 0px\n * * `sm`: 8px\n * * `md`: 12px\n * * `lg`: 16px\n * * `xl`: 32px\n * * `full`: 999px\n *\n * @defaultValue \"none\"\n */\n rounding?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"full\" | \"none\";\n /**\n * The tab index of the tap area\n */\n tabIndex?: 0 | -1;\n};\n\nfunction reducer(\n state: {\n hovered: boolean;\n focussed: boolean;\n },\n action: {\n type: \"BLUR\" | \"FOCUS\" | \"MOUSE_ENTER\" | \"MOUSE_LEAVE\";\n },\n) {\n switch (action.type) {\n case \"BLUR\":\n return { ...state, focussed: false };\n case \"FOCUS\":\n return { ...state, focussed: true };\n case \"MOUSE_ENTER\":\n return { ...state, hovered: true };\n case \"MOUSE_LEAVE\":\n return { ...state, hovered: false };\n default:\n return state;\n }\n}\n\n/**\n * [TapArea](https://cambly-syntax.vercel.app/?path=/docs/components-taparea--docs) allows components to be clickable and touchable in an accessible way.\n */\nconst TapArea = forwardRef<HTMLDivElement, TapAreaProps>(\n (\n {\n children,\n accessibilityLabel,\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n fullWidth = true,\n onClick,\n onMouseEnter,\n onMouseLeave,\n rounding = \"none\",\n tabIndex = 0,\n ...accessibilityProps\n }: TapAreaProps,\n ref,\n ) => {\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const [{ hovered, focussed }, dispatch] = useReducer(reducer, {\n hovered: false,\n focussed: false,\n });\n\n const handleClick: React.MouseEventHandler<HTMLDivElement> = (event) => {\n if (disabled) {\n undefined;\n } else {\n event.currentTarget.blur();\n onClick(event);\n }\n };\n\n const handleKeyDown: React.KeyboardEventHandler<HTMLDivElement> = (\n event,\n ) => {\n if (disabled) return;\n if (event.key === \"Enter\" || event.key === \" \" || event.key === \"Space\") {\n event.preventDefault();\n onClick(event);\n }\n };\n\n const handleOnMouseEnter: React.MouseEventHandler<HTMLDivElement> = (\n event,\n ) => {\n if (disabled) return;\n dispatch({ type: \"MOUSE_ENTER\" });\n onMouseEnter?.(event);\n };\n\n const handleOnMouseLeave: React.MouseEventHandler<HTMLDivElement> = (\n event,\n ) => {\n if (disabled) return;\n dispatch({ type: \"MOUSE_LEAVE\" });\n onMouseLeave?.(event);\n };\n\n const isHoveredOrFocussed = !disabled && (hovered || focussed);\n const roundingClasses =\n rounding !== \"none\" && roundingStyles[`rounding${rounding}`];\n\n return (\n <div\n {...accessibilityProps}\n aria-disabled={disabled || accessibilityProps[\"aria-disabled\"]}\n aria-label={accessibilityLabel ?? accessibilityProps[\"aria-label\"]}\n className={classNames(\n styles.tapArea,\n styles[`${disabled ? \"disabled\" : \"enabled\"}`],\n fullWidth && styles.fullWidth,\n isHoveredOrFocussed && styles.hoveredOrFocussed,\n roundingClasses,\n )}\n data-testid={dataTestId}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n onMouseEnter={handleOnMouseEnter}\n onMouseLeave={handleOnMouseLeave}\n onFocus={() => dispatch({ type: \"FOCUS\" })}\n onBlur={() => dispatch({ type: \"BLUR\" })}\n ref={ref}\n role=\"button\"\n tabIndex={disabled ? undefined : tabIndex}\n >\n {!disabled && (hovered || focussed) && (\n <div className={classNames(styles.overlay, roundingClasses)} />\n )}\n {children}\n </div>\n );\n },\n);\n\nTapArea.displayName = \"TapArea\";\n\nexport default TapArea;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TapArea/TapArea.module.css\"; export default {\"tapArea\":\"_tapArea_g6gkz_1\",\"fullWidth\":\"_fullWidth_g6gkz_5\",\"disabled\":\"_disabled_g6gkz_9\",\"enabled\":\"_enabled_g6gkz_16\",\"overlay\":\"_overlay_g6gkz_29\",\"hoveredOrFocussed\":\"_hoveredOrFocussed_g6gkz_39\"}"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/colors/foregroundColor.ts"],"names":[],"mappings":";;;;;;AAGO,SAAS,uBAAuB,OAAuC;AAC5E,UAAQ,OAAO;AAAA,IACb,KAAK;AAAA,IACL,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB,KAAK;AAAA,IACL,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB;AACE,aAAO,sBAAO;AAAA,EAClB;AACF;AAEO,SAAS,sBACd,OACA,IACQ;AACR,MAAI,OAAO,mBAAmB;AAC5B,YAAQ,OAAO;AAAA,MACb,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB;AACE,eAAO,sBAAO;AAAA,IAClB;AAAA,EACF,OAAO;AACL,YAAQ,OAAO;AAAA,MACb,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB;AACE,eAAO,sBAAO;AAAA,IAClB;AAAA,EACF;AACF","sourcesContent":["import { type CambioColor, type Color } from \"../constants\";\nimport styles from \"./colors.module.css\";\n\nexport function classicForegroundColor(color: (typeof Color)[number]): string {\n switch (color) {\n case \"secondary\":\n case \"tertiary\":\n return styles.primary700Color;\n case \"destructive-secondary\":\n case \"destructive-tertiary\":\n return styles.destructive700Color;\n case \"branded\":\n return styles.gray900Color;\n case \"inverse\":\n return styles.whiteColor;\n default:\n return styles.whiteColor;\n }\n}\n\nexport function cambioForegroundColor(\n color: (typeof CambioColor)[number],\n on: \"lightBackground\" | \"darkBackground\",\n): string {\n if (on === \"lightBackground\") {\n switch (color) {\n case \"primary\":\n case \"success-primary\":\n case \"destructive-primary\":\n return styles.cambioWhiteColor;\n case \"success-secondary\":\n case \"success-tertiary\":\n return styles.cambioSuccess900Color;\n case \"destructive-secondary\":\n case \"destructive-tertiary\":\n return styles.cambioDestructive900Color;\n default:\n return styles.cambioBlackColor;\n }\n } else {\n switch (color) {\n case \"primary\":\n case \"success-primary\":\n case \"destructive-primary\":\n return styles.cambioBlackColor;\n case \"secondary\":\n case \"tertiary\":\n return styles.cambioWhiteColor;\n case \"success-secondary\":\n case \"success-tertiary\":\n return styles.cambioSuccess100Color;\n case \"destructive-secondary\":\n case \"destructive-tertiary\":\n return styles.cambioDestructive100Color;\n default: // branded\n return styles.cambioBlackColor;\n }\n }\n}\n"]}
@@ -1,128 +0,0 @@
1
- "use client"
2
- import {
3
- colors_module_default
4
- } from "./B7PDT66P.js";
5
- import {
6
- useTheme
7
- } from "./4GTNQPPD.js";
8
-
9
- // src/Typography/Typography.tsx
10
- import classNames from "classnames";
11
- import { forwardRef } from "react";
12
-
13
- // css-module:./Typography.module.css#css-module
14
- var Typography_module_default = { "typography": "_typography_emvev_1", "sansSerif": "_sansSerif_emvev_22", "serif": "_serif_emvev_27", "size100": "_size100_emvev_71", "size200": "_size200_emvev_75", "size300": "_size300_emvev_79", "size500": "_size500_emvev_83", "size600": "_size600_emvev_87", "size700": "_size700_emvev_91", "size800": "_size800_emvev_95", "size100Cambio": "_size100Cambio_emvev_100", "size200Cambio": "_size200Cambio_emvev_104", "size300Cambio": "_size300Cambio_emvev_108", "size400Cambio": "_size400Cambio_emvev_112", "size500Cambio": "_size500Cambio_emvev_116", "size600Cambio": "_size600Cambio_emvev_120", "size700Cambio": "_size700Cambio_emvev_124", "size800Cambio": "_size800Cambio_emvev_128", "size900Cambio": "_size900Cambio_emvev_132", "size1000Cambio": "_size1000Cambio_emvev_173", "size1100Cambio": "_size1100Cambio_emvev_177", "center": "_center_emvev_183", "forceLeft": "_forceLeft_emvev_187", "forceRight": "_forceRight_emvev_191", "start": "_start_emvev_195", "end": "_end_emvev_199", "bold": "_bold_emvev_204", "regular": "_regular_emvev_208", "interactive": "_interactive_emvev_212", "semiBold": "_semiBold_emvev_216", "heavy": "_heavy_emvev_220", "regularCambio": "_regularCambio_emvev_224", "mediumCambio": "_mediumCambio_emvev_228", "semiBoldCambio": "_semiBoldCambio_emvev_232", "boldCambio": "_boldCambio_emvev_236", "underline": "_underline_emvev_240", "inline": "_inline_emvev_244", "uppercase": "_uppercase_emvev_248", "lineClamp": "_lineClamp_emvev_252" };
15
-
16
- // src/Typography/Typography.tsx
17
- import { jsx } from "react/jsx-runtime";
18
- function classicTextColor(color) {
19
- switch (color) {
20
- case "gray700":
21
- return colors_module_default.gray700Color;
22
- case "white":
23
- return colors_module_default.whiteColor;
24
- case "inherit":
25
- return colors_module_default.inheritColor;
26
- case "primary":
27
- return colors_module_default.primary700Color;
28
- case "destructive-primary":
29
- case "destructive-darkBackground":
30
- return colors_module_default.destructive700Color;
31
- case "success":
32
- return colors_module_default.success700Color;
33
- default:
34
- return colors_module_default.gray900Color;
35
- }
36
- }
37
- function cambioTextColor(color) {
38
- switch (color) {
39
- case "gray700":
40
- return colors_module_default.cambioGray800Color;
41
- case "white":
42
- return colors_module_default.cambioWhiteColor;
43
- case "inherit":
44
- return colors_module_default.inheritColor;
45
- case "destructive-primary":
46
- return colors_module_default.cambioDestructive900Color;
47
- case "destructive-darkBackground":
48
- return colors_module_default.cambioDestructive100Color;
49
- case "success":
50
- return colors_module_default.cambioSuccess900Color;
51
- case "success-darkBackground":
52
- return colors_module_default.cambioSuccess100Color;
53
- default:
54
- return colors_module_default.cambioBlackColor;
55
- }
56
- }
57
- function classicWeight(weight) {
58
- switch (weight) {
59
- case "medium":
60
- return "regular";
61
- default:
62
- return weight;
63
- }
64
- }
65
- function cambioWeight(weight) {
66
- switch (weight) {
67
- case "interactive":
68
- return "medium";
69
- case "heavy":
70
- return "regular";
71
- default:
72
- return weight;
73
- }
74
- }
75
- var Typography = forwardRef(function Typography2({
76
- align = "start",
77
- as = "div",
78
- children,
79
- color = "gray900",
80
- "data-testid": dataTestId,
81
- fontStyle = "sans-serif",
82
- id,
83
- inline = false,
84
- lineClamp = void 0,
85
- size = 200,
86
- tooltip,
87
- transform = "none",
88
- underline = false,
89
- weight = "regular"
90
- }, ref) {
91
- const Tag = as;
92
- const { themeName } = useTheme();
93
- const weightStyles = themeName === "classic" ? Typography_module_default[classicWeight(weight)] : Typography_module_default[`${cambioWeight(weight)}Cambio`];
94
- return /* @__PURE__ */ jsx(
95
- Tag,
96
- {
97
- id,
98
- className: classNames(
99
- Typography_module_default.typography,
100
- Typography_module_default[align],
101
- weightStyles,
102
- themeName === "cambio" && fontStyle === "serif" ? Typography_module_default.serif : Typography_module_default.sansSerif,
103
- themeName === "cambio" ? cambioTextColor(color) : classicTextColor(color),
104
- inline && Typography_module_default.inline,
105
- themeName === "classic" ? Typography_module_default[`size${// TypeScript doesn't narrow the type of size with `.includes` so we have to do it manually
106
- // https://github.com/microsoft/TypeScript/issues/36275#issuecomment-643376433
107
- // One we ship Cambio, we can remove these checks
108
- size === 100 || size === 200 || size === 300 || size === 500 || size === 600 || size === 700 || size === 800 ? size : 200}`] : Typography_module_default[`size${size}Cambio`],
109
- transform === "uppercase" && Typography_module_default.uppercase,
110
- underline && Typography_module_default.underline,
111
- lineClamp != null && Typography_module_default.lineClamp
112
- ),
113
- "data-testid": dataTestId,
114
- style: {
115
- WebkitLineClamp: lineClamp
116
- },
117
- title: tooltip,
118
- ref,
119
- children
120
- }
121
- );
122
- });
123
- var Typography_default = Typography;
124
-
125
- export {
126
- Typography_default
127
- };
128
- //# sourceMappingURL=UVROGDYB.js.map