@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.
- package/dist/Avatar/Avatar.cjs +5 -7
- package/dist/Avatar/Avatar.css +11 -49
- package/dist/Avatar/Avatar.css.map +1 -1
- package/dist/Avatar/Avatar.d.ts +2 -9
- package/dist/Avatar/Avatar.js +4 -6
- package/dist/AvatarGroup/AvatarGroup.cjs +4 -6
- package/dist/AvatarGroup/AvatarGroup.css +3 -18
- package/dist/AvatarGroup/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup/AvatarGroup.d.ts +2 -9
- package/dist/AvatarGroup/AvatarGroup.js +3 -5
- package/dist/Badge/Badge.cjs +5 -7
- package/dist/Badge/Badge.css +48 -99
- package/dist/Badge/Badge.css.map +1 -1
- package/dist/Badge/Badge.js +4 -6
- package/dist/Box/Box.cjs +5 -5
- package/dist/Box/Box.css +3 -18
- package/dist/Box/Box.css.map +1 -1
- package/dist/Box/Box.d.ts +2 -10
- package/dist/Box/Box.js +6 -6
- package/dist/Button/Button.cjs +9 -12
- package/dist/Button/Button.css +67 -142
- package/dist/Button/Button.css.map +1 -1
- package/dist/Button/Button.d.ts +1 -8
- package/dist/Button/Button.js +7 -10
- package/dist/Button/constants/iconSize.cjs +2 -3
- package/dist/Button/constants/iconSize.css +19 -43
- package/dist/Button/constants/iconSize.css.map +1 -1
- package/dist/Button/constants/iconSize.js +1 -2
- package/dist/ButtonGroup/ButtonGroup.cjs +2 -3
- package/dist/ButtonGroup/ButtonGroup.css +6 -15
- package/dist/ButtonGroup/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup/ButtonGroup.d.ts +0 -6
- package/dist/ButtonGroup/ButtonGroup.js +1 -2
- package/dist/Card/Card.cjs +4 -6
- package/dist/Card/Card.css +3 -18
- package/dist/Card/Card.css.map +1 -1
- package/dist/Card/Card.d.ts +1 -1
- package/dist/Card/Card.js +3 -5
- package/dist/Checkbox/Checkbox.cjs +3 -4
- package/dist/Checkbox/Checkbox.css +58 -114
- package/dist/Checkbox/Checkbox.css.map +1 -1
- package/dist/Checkbox/Checkbox.js +2 -3
- package/dist/Chip/Chip.cjs +5 -7
- package/dist/Chip/Chip.css +61 -130
- package/dist/Chip/Chip.css.map +1 -1
- package/dist/Chip/Chip.d.ts +1 -4
- package/dist/Chip/Chip.js +4 -6
- package/dist/Dialog/Dialog.cjs +3 -5
- package/dist/Dialog/Dialog.css +3 -18
- package/dist/Dialog/Dialog.css.map +1 -1
- package/dist/Dialog/Dialog.js +2 -4
- package/dist/Dialog/ModalDialog.cjs +9 -13
- package/dist/Dialog/ModalDialog.css +15 -167
- package/dist/Dialog/ModalDialog.css.map +1 -1
- package/dist/Dialog/ModalDialog.js +7 -11
- package/dist/Divider/Divider.cjs +2 -3
- package/dist/Divider/Divider.js +1 -2
- package/dist/Heading/Heading.cjs +3 -4
- package/dist/Heading/Heading.css +45 -81
- package/dist/Heading/Heading.css.map +1 -1
- package/dist/Heading/Heading.d.ts +3 -9
- package/dist/Heading/Heading.js +2 -3
- package/dist/IconButton/IconButton.cjs +5 -8
- package/dist/IconButton/IconButton.css +12 -149
- package/dist/IconButton/IconButton.css.map +1 -1
- package/dist/IconButton/IconButton.d.ts +3 -16
- package/dist/IconButton/IconButton.js +3 -6
- package/dist/LinkButton/LinkButton.cjs +7 -10
- package/dist/LinkButton/LinkButton.css +64 -124
- package/dist/LinkButton/LinkButton.css.map +1 -1
- package/dist/LinkButton/LinkButton.d.ts +2 -18
- package/dist/LinkButton/LinkButton.js +5 -8
- package/dist/Modal/Layer.cjs +4 -6
- package/dist/Modal/Layer.css +3 -18
- package/dist/Modal/Layer.css.map +1 -1
- package/dist/Modal/Layer.js +3 -5
- package/dist/Modal/Modal.cjs +11 -15
- package/dist/Modal/Modal.css +64 -269
- package/dist/Modal/Modal.css.map +1 -1
- package/dist/Modal/Modal.js +9 -13
- package/dist/Popover/Popover.cjs +10 -14
- package/dist/Popover/Popover.css +15 -167
- package/dist/Popover/Popover.css.map +1 -1
- package/dist/Popover/Popover.js +8 -12
- package/dist/RadioButton/RadioButton.cjs +5 -7
- package/dist/RadioButton/RadioButton.css +48 -99
- package/dist/RadioButton/RadioButton.css.map +1 -1
- package/dist/RadioButton/RadioButton.js +4 -6
- package/dist/RichSelect/RichSelectBox.cjs +17 -20
- package/dist/RichSelect/RichSelectBox.css +86 -188
- package/dist/RichSelect/RichSelectBox.css.map +1 -1
- package/dist/RichSelect/RichSelectBox.js +15 -18
- package/dist/RichSelect/RichSelectChip.cjs +6 -8
- package/dist/RichSelect/RichSelectChip.css +61 -130
- package/dist/RichSelect/RichSelectChip.css.map +1 -1
- package/dist/RichSelect/RichSelectChip.js +5 -7
- package/dist/RichSelect/RichSelectList.cjs +24 -28
- package/dist/RichSelect/RichSelectList.css +176 -326
- package/dist/RichSelect/RichSelectList.css.map +1 -1
- package/dist/RichSelect/RichSelectList.js +22 -26
- package/dist/RichSelect/RichSelectRadioButton.cjs +6 -8
- package/dist/RichSelect/RichSelectRadioButton.css +48 -99
- package/dist/RichSelect/RichSelectRadioButton.css.map +1 -1
- package/dist/RichSelect/RichSelectRadioButton.js +5 -7
- package/dist/RichSelect/RichSelectSection.cjs +3 -4
- package/dist/RichSelect/RichSelectSection.css +45 -81
- package/dist/RichSelect/RichSelectSection.css.map +1 -1
- package/dist/RichSelect/RichSelectSection.js +2 -3
- package/dist/SelectList/SelectList.cjs +6 -8
- package/dist/SelectList/SelectList.css +59 -134
- package/dist/SelectList/SelectList.css.map +1 -1
- package/dist/SelectList/SelectList.d.ts +1 -0
- package/dist/SelectList/SelectList.js +5 -7
- package/dist/TapArea/TapArea.cjs +7 -3
- package/dist/TapArea/TapArea.css +2030 -15
- package/dist/TapArea/TapArea.css.map +1 -1
- package/dist/TapArea/TapArea.js +6 -2
- package/dist/TextArea/TextArea.cjs +5 -7
- package/dist/TextArea/TextArea.css +59 -165
- package/dist/TextArea/TextArea.css.map +1 -1
- package/dist/TextArea/TextArea.js +4 -6
- package/dist/TextField/TextField.cjs +5 -7
- package/dist/TextField/TextField.css +58 -149
- package/dist/TextField/TextField.css.map +1 -1
- package/dist/TextField/TextField.js +4 -6
- package/dist/ThemeProvider/ThemeProvider.cjs +2 -4
- package/dist/ThemeProvider/ThemeProvider.d.ts +3 -9
- package/dist/ThemeProvider/ThemeProvider.js +3 -5
- package/dist/Tooltip/Tooltip.cjs +4 -6
- package/dist/Tooltip/Tooltip.css +48 -99
- package/dist/Tooltip/Tooltip.css.map +1 -1
- package/dist/Tooltip/Tooltip.js +3 -5
- package/dist/Typography/Typography.cjs +2 -3
- package/dist/Typography/Typography.css +45 -81
- package/dist/Typography/Typography.css.map +1 -1
- package/dist/Typography/Typography.d.ts +3 -21
- package/dist/Typography/Typography.js +1 -2
- package/dist/__chunks/{I6CGA2ER.js → 23XGESKG.js} +5 -9
- package/dist/__chunks/23XGESKG.js.map +1 -0
- package/dist/__chunks/{W5MIJIZA.cjs → 2IHACTOY.cjs} +3 -12
- package/dist/__chunks/2IHACTOY.cjs.map +1 -0
- package/dist/__chunks/{TDR3JRXZ.js → 2K6CP2YU.js} +16 -29
- package/dist/__chunks/2K6CP2YU.js.map +1 -0
- package/dist/__chunks/{GJBW4BG7.js → 2ZPIW4UQ.js} +2 -2
- package/dist/__chunks/{SFOAZYZG.cjs → 35S5FKUC.cjs} +3 -3
- package/dist/__chunks/3GNWH6C7.js +94 -0
- package/dist/__chunks/3GNWH6C7.js.map +1 -0
- package/dist/__chunks/45TMKSJQ.cjs +9 -0
- package/dist/__chunks/45TMKSJQ.cjs.map +1 -0
- package/dist/__chunks/4D7UZQ2A.cjs +17 -0
- package/dist/__chunks/4D7UZQ2A.cjs.map +1 -0
- package/dist/__chunks/{CPIFXRXD.cjs → 4OOJZHZM.cjs} +19 -29
- package/dist/__chunks/4OOJZHZM.cjs.map +1 -0
- package/dist/__chunks/{FTKHKS6W.js → 4SABJA3K.js} +3 -3
- package/dist/__chunks/{ICDRMDXD.js → 57KSLOGS.js} +1 -1
- package/dist/__chunks/{ICDRMDXD.js.map → 57KSLOGS.js.map} +1 -1
- package/dist/__chunks/5VHLZADO.cjs +94 -0
- package/dist/__chunks/5VHLZADO.cjs.map +1 -0
- package/dist/__chunks/{6P6ARVEA.cjs → 5YIEOGTA.cjs} +3 -3
- package/dist/__chunks/{Y2HREK3T.js → 635XF33P.js} +4 -4
- package/dist/__chunks/67EPPVT7.js +72 -0
- package/dist/__chunks/67EPPVT7.js.map +1 -0
- package/dist/__chunks/{3OWAOKRW.js → 6XM3VOHU.js} +17 -27
- package/dist/__chunks/6XM3VOHU.js.map +1 -0
- package/dist/__chunks/{UKLQ64N7.cjs → 753VRQSY.cjs} +6 -3
- package/dist/__chunks/753VRQSY.cjs.map +1 -0
- package/dist/__chunks/{OU5C2MBA.js → 7AMCS5SM.js} +9 -33
- package/dist/__chunks/7AMCS5SM.js.map +1 -0
- package/dist/__chunks/ANMCJDIA.cjs +128 -0
- package/dist/__chunks/ANMCJDIA.cjs.map +1 -0
- package/dist/__chunks/{JXOKXBDZ.cjs → ASFZDRJJ.cjs} +9 -21
- package/dist/__chunks/ASFZDRJJ.cjs.map +1 -0
- package/dist/__chunks/BOX3VY3Q.js +30 -0
- package/dist/__chunks/BOX3VY3Q.js.map +1 -0
- package/dist/__chunks/{GEGGHBSM.cjs → C2H5JBU2.cjs} +18 -18
- package/dist/__chunks/{5MJ6NOUC.js → C32JYNV7.js} +6 -3
- package/dist/__chunks/C32JYNV7.js.map +1 -0
- package/dist/__chunks/C5XPZTFO.cjs +30 -0
- package/dist/__chunks/C5XPZTFO.cjs.map +1 -0
- package/dist/__chunks/{4GTNQPPD.js → CAEGAJQ2.js} +9 -21
- package/dist/__chunks/CAEGAJQ2.js.map +1 -0
- package/dist/__chunks/{PKBQW5T6.cjs → DRSFRJ34.cjs} +4 -8
- package/dist/__chunks/DRSFRJ34.cjs.map +1 -0
- package/dist/__chunks/EB7WKQ35.js +9 -0
- package/dist/__chunks/EB7WKQ35.js.map +1 -0
- package/dist/__chunks/F2TVUY5L.js +128 -0
- package/dist/__chunks/F2TVUY5L.js.map +1 -0
- package/dist/__chunks/{VLK5CARI.cjs → GNKVDWTS.cjs} +7 -7
- package/dist/__chunks/{BQOD4WU7.js → GR5G6EJO.js} +27 -42
- package/dist/__chunks/GR5G6EJO.js.map +1 -0
- package/dist/__chunks/{Q4HTXMNF.js → GSSIV3VC.js} +3 -7
- package/dist/__chunks/GSSIV3VC.js.map +1 -0
- package/dist/__chunks/{KTTIFVGY.js → H2AWA6IQ.js} +2 -2
- package/dist/__chunks/{2HNPYS3S.cjs → J66QB6E3.cjs} +32 -42
- package/dist/__chunks/J66QB6E3.cjs.map +1 -0
- package/dist/__chunks/{N5B6KNJR.js → J6JYJXK5.js} +17 -25
- package/dist/__chunks/J6JYJXK5.js.map +1 -0
- package/dist/__chunks/{BVYHALMT.cjs → J7RT6MWY.cjs} +6 -10
- package/dist/__chunks/J7RT6MWY.cjs.map +1 -0
- package/dist/__chunks/{X5KCRFFF.js → KARS7AEM.js} +11 -21
- package/dist/__chunks/KARS7AEM.js.map +1 -0
- package/dist/__chunks/{2RWNBVOK.cjs → KGXZVA6S.cjs} +12 -36
- package/dist/__chunks/KGXZVA6S.cjs.map +1 -0
- package/dist/__chunks/{AKKJTW7U.js → KPQ6AISJ.js} +9 -19
- package/dist/__chunks/KPQ6AISJ.js.map +1 -0
- package/dist/__chunks/{5MKCDCHQ.cjs → KYGRRVLW.cjs} +19 -27
- package/dist/__chunks/KYGRRVLW.cjs.map +1 -0
- package/dist/__chunks/LL5MNX7Y.cjs +91 -0
- package/dist/__chunks/LL5MNX7Y.cjs.map +1 -0
- package/dist/__chunks/{6OCOGTM5.cjs → LPRAK3CL.cjs} +20 -33
- package/dist/__chunks/LPRAK3CL.cjs.map +1 -0
- package/dist/__chunks/{A323TCSA.cjs → M7TRKS34.cjs} +5 -11
- package/dist/__chunks/M7TRKS34.cjs.map +1 -0
- package/dist/__chunks/{EKHHYK7U.cjs → MPHBLSZP.cjs} +15 -25
- package/dist/__chunks/MPHBLSZP.cjs.map +1 -0
- package/dist/__chunks/MUYNXIZK.cjs +72 -0
- package/dist/__chunks/MUYNXIZK.cjs.map +1 -0
- package/dist/__chunks/{IB3FQANU.js → MWCEKFF2.js} +3 -25
- package/dist/__chunks/MWCEKFF2.js.map +1 -0
- package/dist/__chunks/{ZUQC37VB.cjs → N2V7ZZBM.cjs} +3 -3
- package/dist/__chunks/{7SCBZPIF.cjs → N47VDOUP.cjs} +1 -1
- package/dist/__chunks/{7SCBZPIF.cjs.map → N47VDOUP.cjs.map} +1 -1
- package/dist/__chunks/{THYSYYWS.cjs → NLD667Y7.cjs} +5 -10
- package/dist/__chunks/NLD667Y7.cjs.map +1 -0
- package/dist/__chunks/{K27Z66LH.js → OQE24UY6.js} +2 -2
- package/dist/__chunks/{GANR5JVV.cjs → OT2MUGKK.cjs} +5 -11
- package/dist/__chunks/OT2MUGKK.cjs.map +1 -0
- package/dist/__chunks/{FPHP3T7U.js → P6K7GG3H.js} +1 -18
- package/dist/__chunks/P6K7GG3H.js.map +1 -0
- package/dist/__chunks/{CS66HKUB.cjs → P72Q5WQM.cjs} +26 -41
- package/dist/__chunks/P72Q5WQM.cjs.map +1 -0
- package/dist/__chunks/{3HBVE6VG.js → PCHHRCCA.js} +8 -18
- package/dist/__chunks/PCHHRCCA.js.map +1 -0
- package/dist/__chunks/{WOIJRASP.cjs → QN33R37R.cjs} +3 -3
- package/dist/__chunks/RTT2WOZS.js +91 -0
- package/dist/__chunks/RTT2WOZS.js.map +1 -0
- package/dist/__chunks/{3FMGCZP2.cjs → SNAE52BH.cjs} +12 -22
- package/dist/__chunks/SNAE52BH.cjs.map +1 -0
- package/dist/__chunks/SOZG53ZB.js +117 -0
- package/dist/__chunks/SOZG53ZB.js.map +1 -0
- package/dist/__chunks/SPX2VOW3.cjs +117 -0
- package/dist/__chunks/SPX2VOW3.cjs.map +1 -0
- package/dist/__chunks/{J43HGNHN.cjs → T5EA5RPQ.cjs} +3 -25
- package/dist/__chunks/T5EA5RPQ.cjs.map +1 -0
- package/dist/__chunks/{3CNALXRL.js → T6BFW6YO.js} +8 -8
- package/dist/__chunks/{LECUYS4O.cjs → TDPIWHGR.cjs} +5 -5
- package/dist/__chunks/{MONMI3LS.js → UB4WHLZC.js} +2 -2
- package/dist/__chunks/{UF7SXHS4.js → UIPAXBI7.js} +3 -12
- package/dist/__chunks/UIPAXBI7.js.map +1 -0
- package/dist/__chunks/{7BAMJSUF.js → UTI7XCK6.js} +4 -10
- package/dist/__chunks/UTI7XCK6.js.map +1 -0
- package/dist/__chunks/{FLFJRP4T.js → UXTPDCQJ.js} +21 -36
- package/dist/__chunks/UXTPDCQJ.js.map +1 -0
- package/dist/__chunks/VTH5KXQF.cjs +111 -0
- package/dist/__chunks/VTH5KXQF.cjs.map +1 -0
- package/dist/__chunks/{UQY2ELTZ.cjs → WWRSRFDE.cjs} +2 -19
- package/dist/__chunks/WWRSRFDE.cjs.map +1 -0
- package/dist/__chunks/{63GEZVJ4.js → XHTRMLY4.js} +5 -6
- package/dist/__chunks/XHTRMLY4.js.map +1 -0
- package/dist/__chunks/{AYTJYJHI.js → XZ23UL5J.js} +4 -9
- package/dist/__chunks/XZ23UL5J.js.map +1 -0
- package/dist/__chunks/{HYRATHVK.cjs → YNVQJ4DG.cjs} +5 -6
- package/dist/__chunks/YNVQJ4DG.cjs.map +1 -0
- package/dist/__chunks/YV4ASN4Z.js +17 -0
- package/dist/__chunks/YV4ASN4Z.js.map +1 -0
- package/dist/__chunks/{HCHFPFNX.js → ZPY7QEBH.js} +4 -10
- package/dist/__chunks/ZPY7QEBH.js.map +1 -0
- package/dist/colors/backgroundColor.cjs +2 -4
- package/dist/colors/backgroundColor.d.ts +3 -4
- package/dist/colors/backgroundColor.js +3 -5
- package/dist/colors/foregroundColor.cjs +2 -4
- package/dist/colors/foregroundColor.d.ts +2 -3
- package/dist/colors/foregroundColor.js +3 -5
- package/dist/index.cjs +38 -43
- package/dist/index.css +145 -410
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +39 -44
- package/package.json +1 -1
- package/dist/__chunks/2HNPYS3S.cjs.map +0 -1
- package/dist/__chunks/2RWNBVOK.cjs.map +0 -1
- package/dist/__chunks/3FMGCZP2.cjs.map +0 -1
- package/dist/__chunks/3HBVE6VG.js.map +0 -1
- package/dist/__chunks/3OWAOKRW.js.map +0 -1
- package/dist/__chunks/4GTNQPPD.js.map +0 -1
- package/dist/__chunks/5MJ6NOUC.js.map +0 -1
- package/dist/__chunks/5MKCDCHQ.cjs.map +0 -1
- package/dist/__chunks/5OLT2HH5.js +0 -43
- package/dist/__chunks/5OLT2HH5.js.map +0 -1
- package/dist/__chunks/5PWYNWVE.js +0 -115
- package/dist/__chunks/5PWYNWVE.js.map +0 -1
- package/dist/__chunks/63GEZVJ4.js.map +0 -1
- package/dist/__chunks/6OCOGTM5.cjs.map +0 -1
- package/dist/__chunks/7BAMJSUF.js.map +0 -1
- package/dist/__chunks/A323TCSA.cjs.map +0 -1
- package/dist/__chunks/AKKJTW7U.js.map +0 -1
- package/dist/__chunks/AYTJYJHI.js.map +0 -1
- package/dist/__chunks/BQOD4WU7.js.map +0 -1
- package/dist/__chunks/BVYHALMT.cjs.map +0 -1
- package/dist/__chunks/CPIFXRXD.cjs.map +0 -1
- package/dist/__chunks/CS66HKUB.cjs.map +0 -1
- package/dist/__chunks/EKHHYK7U.cjs.map +0 -1
- package/dist/__chunks/FH2W3CI2.cjs +0 -126
- package/dist/__chunks/FH2W3CI2.cjs.map +0 -1
- package/dist/__chunks/FLFJRP4T.js.map +0 -1
- package/dist/__chunks/FPHP3T7U.js.map +0 -1
- package/dist/__chunks/GANR5JVV.cjs.map +0 -1
- package/dist/__chunks/GWJGZYZO.js +0 -150
- package/dist/__chunks/GWJGZYZO.js.map +0 -1
- package/dist/__chunks/HCHFPFNX.js.map +0 -1
- package/dist/__chunks/HYRATHVK.cjs.map +0 -1
- package/dist/__chunks/I6CGA2ER.js.map +0 -1
- package/dist/__chunks/IB3FQANU.js.map +0 -1
- package/dist/__chunks/J43HGNHN.cjs.map +0 -1
- package/dist/__chunks/JAC64LLA.js +0 -17
- package/dist/__chunks/JAC64LLA.js.map +0 -1
- package/dist/__chunks/JNYNLJGY.js +0 -137
- package/dist/__chunks/JNYNLJGY.js.map +0 -1
- package/dist/__chunks/JXOKXBDZ.cjs.map +0 -1
- package/dist/__chunks/KYIRM6PZ.cjs +0 -137
- package/dist/__chunks/KYIRM6PZ.cjs.map +0 -1
- package/dist/__chunks/N5B6KNJR.js.map +0 -1
- package/dist/__chunks/NCUQOLOV.cjs +0 -115
- package/dist/__chunks/NCUQOLOV.cjs.map +0 -1
- package/dist/__chunks/OAZD7W2W.cjs +0 -96
- package/dist/__chunks/OAZD7W2W.cjs.map +0 -1
- package/dist/__chunks/OMFFRI3K.js +0 -9
- package/dist/__chunks/OMFFRI3K.js.map +0 -1
- package/dist/__chunks/OU5C2MBA.js.map +0 -1
- package/dist/__chunks/PKBQW5T6.cjs.map +0 -1
- package/dist/__chunks/Q4HTXMNF.js.map +0 -1
- package/dist/__chunks/RVFY33X2.cjs +0 -43
- package/dist/__chunks/RVFY33X2.cjs.map +0 -1
- package/dist/__chunks/S5QHTHST.cjs +0 -9
- package/dist/__chunks/S5QHTHST.cjs.map +0 -1
- package/dist/__chunks/SHHN3SRR.js +0 -9
- package/dist/__chunks/SHHN3SRR.js.map +0 -1
- package/dist/__chunks/TDR3JRXZ.js.map +0 -1
- package/dist/__chunks/THYSYYWS.cjs.map +0 -1
- package/dist/__chunks/UF7SXHS4.js.map +0 -1
- package/dist/__chunks/UKLQ64N7.cjs.map +0 -1
- package/dist/__chunks/UQY2ELTZ.cjs.map +0 -1
- package/dist/__chunks/UVROGDYB.js +0 -128
- package/dist/__chunks/UVROGDYB.js.map +0 -1
- package/dist/__chunks/VR4ZFZ4Z.js +0 -96
- package/dist/__chunks/VR4ZFZ4Z.js.map +0 -1
- package/dist/__chunks/W2JRKN5E.cjs +0 -9
- package/dist/__chunks/W2JRKN5E.cjs.map +0 -1
- package/dist/__chunks/W5MIJIZA.cjs.map +0 -1
- package/dist/__chunks/X5KCRFFF.js.map +0 -1
- package/dist/__chunks/XU3CLITI.cjs +0 -128
- package/dist/__chunks/XU3CLITI.cjs.map +0 -1
- package/dist/__chunks/ZCSR6NFB.cjs +0 -17
- package/dist/__chunks/ZCSR6NFB.cjs.map +0 -1
- package/dist/__chunks/ZRO3RCYX.cjs +0 -150
- package/dist/__chunks/ZRO3RCYX.cjs.map +0 -1
- /package/dist/__chunks/{GJBW4BG7.js.map → 2ZPIW4UQ.js.map} +0 -0
- /package/dist/__chunks/{SFOAZYZG.cjs.map → 35S5FKUC.cjs.map} +0 -0
- /package/dist/__chunks/{FTKHKS6W.js.map → 4SABJA3K.js.map} +0 -0
- /package/dist/__chunks/{6P6ARVEA.cjs.map → 5YIEOGTA.cjs.map} +0 -0
- /package/dist/__chunks/{Y2HREK3T.js.map → 635XF33P.js.map} +0 -0
- /package/dist/__chunks/{GEGGHBSM.cjs.map → C2H5JBU2.cjs.map} +0 -0
- /package/dist/__chunks/{VLK5CARI.cjs.map → GNKVDWTS.cjs.map} +0 -0
- /package/dist/__chunks/{KTTIFVGY.js.map → H2AWA6IQ.js.map} +0 -0
- /package/dist/__chunks/{ZUQC37VB.cjs.map → N2V7ZZBM.cjs.map} +0 -0
- /package/dist/__chunks/{K27Z66LH.js.map → OQE24UY6.js.map} +0 -0
- /package/dist/__chunks/{WOIJRASP.cjs.map → QN33R37R.cjs.map} +0 -0
- /package/dist/__chunks/{3CNALXRL.js.map → T6BFW6YO.js.map} +0 -0
- /package/dist/__chunks/{LECUYS4O.cjs.map → TDPIWHGR.cjs.map} +0 -0
- /package/dist/__chunks/{MONMI3LS.js.map → UB4WHLZC.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Typography/Typography.tsx","css-module:./Typography.module.css#css-module"],"sourcesContent":["import classNames from \"classnames\";\nimport { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./Typography.module.css\";\nimport colorStyles from \"../colors/colors.module.css\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nfunction classicTextColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.gray700Color;\n case \"white\":\n return colorStyles.whiteColor;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"primary\":\n return colorStyles.primary700Color;\n case \"destructive-primary\":\n case \"destructive-darkBackground\":\n return colorStyles.destructive700Color;\n case \"success\":\n return colorStyles.success700Color;\n default:\n return colorStyles.gray900Color;\n }\n}\n\nfunction cambioTextColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.cambioGray800Color;\n case \"white\":\n return colorStyles.cambioWhiteColor;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"destructive-primary\":\n return colorStyles.cambioDestructive900Color;\n case \"destructive-darkBackground\":\n return colorStyles.cambioDestructive100Color;\n case \"success\":\n return colorStyles.cambioSuccess900Color;\n case \"success-darkBackground\":\n return colorStyles.cambioSuccess100Color;\n // primary / gray900\n default:\n return colorStyles.cambioBlackColor;\n }\n}\n\nfunction classicWeight(\n weight: \"regular\" | \"interactive\" | \"medium\" | \"semiBold\" | \"bold\" | \"heavy\",\n): \"regular\" | \"interactive\" | \"semiBold\" | \"bold\" | \"heavy\" {\n switch (weight) {\n case \"medium\":\n return \"regular\";\n default:\n return weight;\n }\n}\n\nfunction cambioWeight(\n weight: \"regular\" | \"interactive\" | \"medium\" | \"semiBold\" | \"bold\" | \"heavy\",\n): \"regular\" | \"medium\" | \"semiBold\" | \"bold\" {\n switch (weight) {\n case \"interactive\":\n return \"medium\";\n case \"heavy\":\n return \"regular\";\n default:\n return weight;\n }\n}\n\n/**\n * [Typography](https://cambly-syntax.vercel.app/?path=/docs/components-typography--docs) is a component that renders text.\n */\nconst Typography = forwardRef<\n HTMLDivElement,\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 \"div\"\n */\n as?: \"div\" | \"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 * Cambio only: `success-darkBackground` / `destructive-darkBackground`\n *\n * @defaultValue \"gray900\"\n */\n color?:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\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 id for the element\n */\n id?: string;\n /**\n * Whether the text should flow inline with other elements.\n *\n * @defaultValue false\n */\n inline?: boolean;\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 * * `100`: 12px\n * * `200`: 14px\n * * `300`: 16px\n * * `500`: 20px\n * * `600`: 28px\n * * `700`: 40px\n * * `800`: 64px\n *\n * Cambio Mobile:\n * * `100`: 14px\n * * `200`: 16px\n * * `300`: 18px\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 * * `100`: 13px\n * * `200`: 16px\n * * `300`: 20px\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 200\n */\n size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100;\n /**\n * The tooltip to be displayed when the user hovers the text\n */\n tooltip?: string;\n /**\n * Whether the text should be transformed to uppercase.\n *\n * @defaultValue \"none\"\n */\n transform?: \"none\" | \"uppercase\";\n /**\n * Whether the text has an underline.\n *\n * @defaultValue false\n */\n underline?: boolean;\n /**\n * Indicates the boldness of the text.\n *\n * Classic:\n * * `regular`: 400\n * * `interactive`: 500 (Classic only)\n * * `semiBold`: 600\n * * `bold`: 700\n * * `heavy`: 860 (Classic only)\n *\n * Cambio:\n * * `regular`: 400\n * * `medium`: 510\n * * `semiBold`: 590\n * * `bold`: 710\n *\n *\n * @defaultValue \"regular\"\n */\n weight?:\n | \"regular\"\n | \"interactive\"\n | \"medium\"\n | \"semiBold\"\n | \"bold\"\n | \"heavy\";\n }\n>(function Typography(\n {\n align = \"start\",\n as = \"div\",\n children,\n color = \"gray900\",\n \"data-testid\": dataTestId,\n fontStyle = \"sans-serif\",\n id,\n inline = false,\n lineClamp = undefined,\n size = 200,\n tooltip,\n transform = \"none\",\n underline = false,\n weight = \"regular\",\n },\n ref,\n): ReactElement {\n const Tag = as;\n\n const { themeName } = useTheme();\n\n const weightStyles =\n themeName === \"classic\"\n ? styles[classicWeight(weight)]\n : styles[`${cambioWeight(weight)}Cambio`];\n\n return (\n <Tag\n id={id}\n className={classNames(\n styles.typography,\n styles[align],\n weightStyles,\n themeName === \"cambio\" && fontStyle === \"serif\"\n ? styles.serif\n : styles.sansSerif,\n themeName === \"cambio\"\n ? cambioTextColor(color)\n : classicTextColor(color),\n inline && styles.inline,\n themeName === \"classic\"\n ? styles[\n `size${\n // TypeScript doesn't narrow the type of size with `.includes` so we have to do it manually\n // https://github.com/microsoft/TypeScript/issues/36275#issuecomment-643376433\n // One we ship Cambio, we can remove these checks\n size === 100 ||\n size === 200 ||\n size === 300 ||\n size === 500 ||\n size === 600 ||\n size === 700 ||\n size === 800\n ? size\n : 200\n }`\n ]\n : styles[`size${size}Cambio`],\n transform === \"uppercase\" && styles.uppercase,\n underline && styles.underline,\n lineClamp != null && styles.lineClamp,\n )}\n data-testid={dataTestId}\n style={{\n WebkitLineClamp: lineClamp,\n }}\n title={tooltip}\n ref={ref}\n >\n {children}\n </Tag>\n );\n});\n\nexport default Typography;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Typography/Typography.module.css\"; export 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\"}"],"mappings":"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","names":["Typography"]}
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
"use client"
|
|
2
|
-
import {
|
|
3
|
-
Button_module_default
|
|
4
|
-
} from "./OMFFRI3K.js";
|
|
5
|
-
import {
|
|
6
|
-
cambioColor,
|
|
7
|
-
classicColor
|
|
8
|
-
} from "./GFKDPMFK.js";
|
|
9
|
-
import {
|
|
10
|
-
cambioForegroundColor,
|
|
11
|
-
classicForegroundColor
|
|
12
|
-
} from "./FPHP3T7U.js";
|
|
13
|
-
import {
|
|
14
|
-
cambioBackgroundColor,
|
|
15
|
-
classicBackgroundColor
|
|
16
|
-
} from "./IB3FQANU.js";
|
|
17
|
-
import {
|
|
18
|
-
useTheme
|
|
19
|
-
} from "./4GTNQPPD.js";
|
|
20
|
-
import {
|
|
21
|
-
useIsHydrated
|
|
22
|
-
} from "./JB65NEXK.js";
|
|
23
|
-
|
|
24
|
-
// src/IconButton/IconButton.tsx
|
|
25
|
-
import classNames from "classnames";
|
|
26
|
-
import { forwardRef } from "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
|
-
import { jsx } from "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 = forwardRef(
|
|
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 = useIsHydrated();
|
|
56
|
-
const { themeName } = useTheme();
|
|
57
|
-
const foregroundColorClass = themeName === "classic" ? classicForegroundColor(classicColor(color)) : cambioForegroundColor(cambioColor(color), on);
|
|
58
|
-
const backgroundColorClass = themeName === "classic" ? classicBackgroundColor(classicColor(color)) : cambioBackgroundColor(cambioColor(color), on);
|
|
59
|
-
return /* @__PURE__ */ jsx(
|
|
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: classNames(
|
|
69
|
-
IconButton_module_default.iconButton,
|
|
70
|
-
foregroundColorClass,
|
|
71
|
-
backgroundColorClass,
|
|
72
|
-
themeName === "classic" ? IconButton_module_default[size] : IconButton_module_default[`${size}Cambio`],
|
|
73
|
-
{
|
|
74
|
-
[Button_module_default.secondaryBorder]: themeName === "classic" && color === "secondary",
|
|
75
|
-
[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__ */ jsx(
|
|
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
|
-
export {
|
|
94
|
-
IconButton_default
|
|
95
|
-
};
|
|
96
|
-
//# sourceMappingURL=VR4ZFZ4Z.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/IconButton/IconButton.tsx","css-module:./IconButton.module.css#css-module"],"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\"}"],"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;","names":[]}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"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
|
-
|
|
7
|
-
|
|
8
|
-
exports.Button_module_default = Button_module_default;
|
|
9
|
-
//# sourceMappingURL=W2JRKN5E.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["css-module:../Button/Button.module.css#css-module"],"names":[],"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","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\"}"]}
|
|
@@ -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"],"names":["Dialog"],"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","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\"}"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/TextArea/TextArea.tsx","css-module:./TextArea.module.css#css-module","css-module:../TextField/TextField.module.css#css-module"],"sourcesContent":["import Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\nimport React, { type ReactElement, useId, forwardRef } from \"react\";\nimport styles from \"./TextArea.module.css\";\nimport textFieldStyles from \"../TextField/TextField.module.css\";\nimport classNames from \"classnames\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype TextAreaProps = {\n /**\n * A data-testid to make querying for the TextArea easier.\n */\n \"data-testid\"?: string;\n /**\n * If true, the TextArea will be disabled.\n */\n disabled?: boolean;\n /**\n * Text shown below TextArea if there is an input error.\n */\n errorText?: string;\n /**\n * Informative helper text shown below TextArea\n */\n helperText?: string;\n /**\n * TextField id, if not provided, a unique id will be generated\n */\n id?: string;\n /**\n * TextArea visible label\n */\n label: string;\n /**\n * Maximum number of characters allowed in the TextArea\n */\n maxLength?: number;\n /**\n * Callback fired when the value is changed.\n */\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n /**\n * Placeholder text to display when TextArea is empty\n */\n placeholder?: string;\n /**\n * Size of the TextArea. Defines the font size and padding.\n *\n * Cambio only supports `md`\n *\n * @defaultValue \"md\"\n */\n size?: \"sm\" | \"md\" | \"lg\";\n /**\n * Number of rows to display\n */\n rows?: number;\n /**\n * Value of the TextArea\n */\n value: string;\n};\n\n/**\n * [TextArea](https://cambly-syntax.vercel.app/?path=/docs/components-textarea--docs) allows users to enter multiple lines of text.\n */\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea(\n {\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText = \"\",\n helperText = \"\",\n id,\n label,\n maxLength = 1024,\n placeholder = \"\",\n rows = 3,\n size = \"md\",\n value = \"\",\n onChange,\n }: TextAreaProps,\n forwardedRef,\n ): ReactElement {\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const reactId = useId();\n const { themeName } = useTheme();\n const inputId = id ?? reactId;\n\n return (\n <Box\n display=\"flex\"\n direction=\"column\"\n gap={2}\n width=\"100%\"\n dangerouslySetInlineStyle={{\n __style: {\n opacity: disabled ? 0.5 : 1,\n },\n }}\n position={themeName === \"cambio\" ? \"relative\" : undefined}\n >\n <label className={textFieldStyles.label} htmlFor={inputId}>\n <Box paddingX={1}>\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </label>\n <Typography size={themeName === \"cambio\" ? 100 : 200}>\n <textarea\n data-testid={dataTestId}\n ref={forwardedRef}\n className={classNames(\n textFieldStyles.textfield,\n themeName === \"classic\"\n ? textFieldStyles.textfieldClassic\n : textFieldStyles.textfieldCambio,\n themeName === \"classic\" && textFieldStyles[size],\n themeName === \"classic\" && styles[size],\n themeName === \"classic\" ? styles.textarea : styles.textareaCambio,\n {\n [themeName === \"classic\"\n ? textFieldStyles.inputError\n : textFieldStyles.inputErrorCambio]: errorText,\n },\n )}\n id={inputId}\n placeholder={placeholder}\n maxLength={maxLength}\n onChange={onChange}\n rows={rows}\n value={value}\n disabled={disabled}\n />\n </Typography>\n {(helperText || errorText) && (\n <Box paddingX={1}>\n <Typography\n size={100}\n color={errorText ? \"destructive-primary\" : \"gray700\"}\n >\n {errorText || helperText}\n </Typography>\n </Box>\n )}\n </Box>\n );\n },\n);\n\nexport default TextArea;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextArea/TextArea.module.css\"; export default {\"textarea\":\"_textarea_1owb5_1\",\"sm\":\"_sm_1owb5_5\",\"md\":\"_md_1owb5_10\",\"lg\":\"_lg_1owb5_15\",\"textareaCambio\":\"_textareaCambio_1owb5_20\"}","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_kbdbw_1\",\"textfieldClassic\":\"_textfieldClassic_kbdbw_10\",\"textfieldCambio\":\"_textfieldCambio_kbdbw_14\",\"label\":\"_label_kbdbw_29\",\"sm\":\"_sm_kbdbw_33\",\"mdCambio\":\"_mdCambio_kbdbw_40\",\"heightCambio\":\"_heightCambio_kbdbw_44\",\"smHeight\":\"_smHeight_kbdbw_48\",\"md\":\"_md_kbdbw_40\",\"mdHeight\":\"_mdHeight_kbdbw_59\",\"lg\":\"_lg_kbdbw_63\",\"lgHeight\":\"_lgHeight_kbdbw_70\",\"inputError\":\"_inputError_kbdbw_74\",\"inputErrorCambio\":\"_inputErrorCambio_kbdbw_84\"}"],"mappings":";;;;;;;;;;;;;;;AAEA,SAAmC,OAAO,kBAAkB;;;ACFoC,IAAO,0BAAQ,EAAC,YAAW,qBAAoB,MAAK,eAAc,MAAK,gBAAe,MAAK,gBAAe,kBAAiB,2BAA0B;;;ACAnJ,IAAO,2BAAQ,EAAC,aAAY,sBAAqB,oBAAmB,8BAA6B,mBAAkB,6BAA4B,SAAQ,mBAAkB,MAAK,gBAAe,YAAW,sBAAqB,gBAAe,0BAAyB,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,cAAa,wBAAuB,oBAAmB,6BAA4B;;;AFKlkB,OAAO,gBAAgB;AAuFjB,SAcM,KAdN;AAzBN,IAAM,WAAW;AAAA,EACf,SAASA,UACP;AAAA,IACE,eAAe;AAAA,IACf,UAAU,eAAe;AAAA,IACzB,YAAY;AAAA,IACZ,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR;AAAA,EACF,GACA,cACc;AACd,UAAM,aAAa,cAAc;AACjC,UAAM,WAAW,CAAC,cAAc;AAChC,UAAM,UAAU,MAAM;AACtB,UAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,UAAM,UAAU,kBAAM;AAEtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,KAAK;AAAA,QACL,OAAM;AAAA,QACN,2BAA2B;AAAA,UACzB,SAAS;AAAA,YACP,SAAS,WAAW,MAAM;AAAA,UAC5B;AAAA,QACF;AAAA,QACA,UAAU,cAAc,WAAW,aAAa;AAAA,QAEhD;AAAA,8BAAC,WAAM,WAAW,yBAAgB,OAAO,SAAS,SAChD,8BAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,KAAK,OAAM,WAC1B,iBACH,GACF,GACF;AAAA,UACA,oBAAC,sBAAW,MAAM,cAAc,WAAW,MAAM,KAC/C;AAAA,YAAC;AAAA;AAAA,cACC,eAAa;AAAA,cACb,KAAK;AAAA,cACL,WAAW;AAAA,gBACT,yBAAgB;AAAA,gBAChB,cAAc,YACV,yBAAgB,mBAChB,yBAAgB;AAAA,gBACpB,cAAc,aAAa,yBAAgB,IAAI;AAAA,gBAC/C,cAAc,aAAa,wBAAO,IAAI;AAAA,gBACtC,cAAc,YAAY,wBAAO,WAAW,wBAAO;AAAA,gBACnD;AAAA,kBACE,CAAC,cAAc,YACX,yBAAgB,aAChB,yBAAgB,gBAAgB,GAAG;AAAA,gBACzC;AAAA,cACF;AAAA,cACA,IAAI;AAAA,cACJ;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA;AAAA,UACF,GACF;AAAA,WACE,cAAc,cACd,oBAAC,eAAI,UAAU,GACb;AAAA,YAAC;AAAA;AAAA,cACC,MAAM;AAAA,cACN,OAAO,YAAY,wBAAwB;AAAA,cAE1C,uBAAa;AAAA;AAAA,UAChB,GACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,IAAO,mBAAQ;","names":["TextArea"]}
|
|
@@ -1,128 +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 _QAS3KERZcjs = require('./QAS3KERZ.cjs');
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
|
|
8
|
-
|
|
9
|
-
// src/Typography/Typography.tsx
|
|
10
|
-
var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
|
|
11
|
-
var _react = require('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
|
-
var _jsxruntime = require('react/jsx-runtime');
|
|
18
|
-
function classicTextColor(color) {
|
|
19
|
-
switch (color) {
|
|
20
|
-
case "gray700":
|
|
21
|
-
return _QAS3KERZcjs.colors_module_default.gray700Color;
|
|
22
|
-
case "white":
|
|
23
|
-
return _QAS3KERZcjs.colors_module_default.whiteColor;
|
|
24
|
-
case "inherit":
|
|
25
|
-
return _QAS3KERZcjs.colors_module_default.inheritColor;
|
|
26
|
-
case "primary":
|
|
27
|
-
return _QAS3KERZcjs.colors_module_default.primary700Color;
|
|
28
|
-
case "destructive-primary":
|
|
29
|
-
case "destructive-darkBackground":
|
|
30
|
-
return _QAS3KERZcjs.colors_module_default.destructive700Color;
|
|
31
|
-
case "success":
|
|
32
|
-
return _QAS3KERZcjs.colors_module_default.success700Color;
|
|
33
|
-
default:
|
|
34
|
-
return _QAS3KERZcjs.colors_module_default.gray900Color;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
function cambioTextColor(color) {
|
|
38
|
-
switch (color) {
|
|
39
|
-
case "gray700":
|
|
40
|
-
return _QAS3KERZcjs.colors_module_default.cambioGray800Color;
|
|
41
|
-
case "white":
|
|
42
|
-
return _QAS3KERZcjs.colors_module_default.cambioWhiteColor;
|
|
43
|
-
case "inherit":
|
|
44
|
-
return _QAS3KERZcjs.colors_module_default.inheritColor;
|
|
45
|
-
case "destructive-primary":
|
|
46
|
-
return _QAS3KERZcjs.colors_module_default.cambioDestructive900Color;
|
|
47
|
-
case "destructive-darkBackground":
|
|
48
|
-
return _QAS3KERZcjs.colors_module_default.cambioDestructive100Color;
|
|
49
|
-
case "success":
|
|
50
|
-
return _QAS3KERZcjs.colors_module_default.cambioSuccess900Color;
|
|
51
|
-
case "success-darkBackground":
|
|
52
|
-
return _QAS3KERZcjs.colors_module_default.cambioSuccess100Color;
|
|
53
|
-
default:
|
|
54
|
-
return _QAS3KERZcjs.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 = _react.forwardRef.call(void 0, 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 } = _JXOKXBDZcjs.useTheme.call(void 0, );
|
|
93
|
-
const weightStyles = themeName === "classic" ? Typography_module_default[classicWeight(weight)] : Typography_module_default[`${cambioWeight(weight)}Cambio`];
|
|
94
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
95
|
-
Tag,
|
|
96
|
-
{
|
|
97
|
-
id,
|
|
98
|
-
className: _classnames2.default.call(void 0,
|
|
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
|
-
|
|
126
|
-
|
|
127
|
-
exports.Typography_default = Typography_default;
|
|
128
|
-
//# sourceMappingURL=XU3CLITI.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Typography/Typography.tsx","css-module:./Typography.module.css#css-module"],"names":["Typography"],"mappings":"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","sourcesContent":["import classNames from \"classnames\";\nimport { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./Typography.module.css\";\nimport colorStyles from \"../colors/colors.module.css\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nfunction classicTextColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.gray700Color;\n case \"white\":\n return colorStyles.whiteColor;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"primary\":\n return colorStyles.primary700Color;\n case \"destructive-primary\":\n case \"destructive-darkBackground\":\n return colorStyles.destructive700Color;\n case \"success\":\n return colorStyles.success700Color;\n default:\n return colorStyles.gray900Color;\n }\n}\n\nfunction cambioTextColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.cambioGray800Color;\n case \"white\":\n return colorStyles.cambioWhiteColor;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"destructive-primary\":\n return colorStyles.cambioDestructive900Color;\n case \"destructive-darkBackground\":\n return colorStyles.cambioDestructive100Color;\n case \"success\":\n return colorStyles.cambioSuccess900Color;\n case \"success-darkBackground\":\n return colorStyles.cambioSuccess100Color;\n // primary / gray900\n default:\n return colorStyles.cambioBlackColor;\n }\n}\n\nfunction classicWeight(\n weight: \"regular\" | \"interactive\" | \"medium\" | \"semiBold\" | \"bold\" | \"heavy\",\n): \"regular\" | \"interactive\" | \"semiBold\" | \"bold\" | \"heavy\" {\n switch (weight) {\n case \"medium\":\n return \"regular\";\n default:\n return weight;\n }\n}\n\nfunction cambioWeight(\n weight: \"regular\" | \"interactive\" | \"medium\" | \"semiBold\" | \"bold\" | \"heavy\",\n): \"regular\" | \"medium\" | \"semiBold\" | \"bold\" {\n switch (weight) {\n case \"interactive\":\n return \"medium\";\n case \"heavy\":\n return \"regular\";\n default:\n return weight;\n }\n}\n\n/**\n * [Typography](https://cambly-syntax.vercel.app/?path=/docs/components-typography--docs) is a component that renders text.\n */\nconst Typography = forwardRef<\n HTMLDivElement,\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 \"div\"\n */\n as?: \"div\" | \"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 * Cambio only: `success-darkBackground` / `destructive-darkBackground`\n *\n * @defaultValue \"gray900\"\n */\n color?:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\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 id for the element\n */\n id?: string;\n /**\n * Whether the text should flow inline with other elements.\n *\n * @defaultValue false\n */\n inline?: boolean;\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 * * `100`: 12px\n * * `200`: 14px\n * * `300`: 16px\n * * `500`: 20px\n * * `600`: 28px\n * * `700`: 40px\n * * `800`: 64px\n *\n * Cambio Mobile:\n * * `100`: 14px\n * * `200`: 16px\n * * `300`: 18px\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 * * `100`: 13px\n * * `200`: 16px\n * * `300`: 20px\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 200\n */\n size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100;\n /**\n * The tooltip to be displayed when the user hovers the text\n */\n tooltip?: string;\n /**\n * Whether the text should be transformed to uppercase.\n *\n * @defaultValue \"none\"\n */\n transform?: \"none\" | \"uppercase\";\n /**\n * Whether the text has an underline.\n *\n * @defaultValue false\n */\n underline?: boolean;\n /**\n * Indicates the boldness of the text.\n *\n * Classic:\n * * `regular`: 400\n * * `interactive`: 500 (Classic only)\n * * `semiBold`: 600\n * * `bold`: 700\n * * `heavy`: 860 (Classic only)\n *\n * Cambio:\n * * `regular`: 400\n * * `medium`: 510\n * * `semiBold`: 590\n * * `bold`: 710\n *\n *\n * @defaultValue \"regular\"\n */\n weight?:\n | \"regular\"\n | \"interactive\"\n | \"medium\"\n | \"semiBold\"\n | \"bold\"\n | \"heavy\";\n }\n>(function Typography(\n {\n align = \"start\",\n as = \"div\",\n children,\n color = \"gray900\",\n \"data-testid\": dataTestId,\n fontStyle = \"sans-serif\",\n id,\n inline = false,\n lineClamp = undefined,\n size = 200,\n tooltip,\n transform = \"none\",\n underline = false,\n weight = \"regular\",\n },\n ref,\n): ReactElement {\n const Tag = as;\n\n const { themeName } = useTheme();\n\n const weightStyles =\n themeName === \"classic\"\n ? styles[classicWeight(weight)]\n : styles[`${cambioWeight(weight)}Cambio`];\n\n return (\n <Tag\n id={id}\n className={classNames(\n styles.typography,\n styles[align],\n weightStyles,\n themeName === \"cambio\" && fontStyle === \"serif\"\n ? styles.serif\n : styles.sansSerif,\n themeName === \"cambio\"\n ? cambioTextColor(color)\n : classicTextColor(color),\n inline && styles.inline,\n themeName === \"classic\"\n ? styles[\n `size${\n // TypeScript doesn't narrow the type of size with `.includes` so we have to do it manually\n // https://github.com/microsoft/TypeScript/issues/36275#issuecomment-643376433\n // One we ship Cambio, we can remove these checks\n size === 100 ||\n size === 200 ||\n size === 300 ||\n size === 500 ||\n size === 600 ||\n size === 700 ||\n size === 800\n ? size\n : 200\n }`\n ]\n : styles[`size${size}Cambio`],\n transform === \"uppercase\" && styles.uppercase,\n underline && styles.underline,\n lineClamp != null && styles.lineClamp,\n )}\n data-testid={dataTestId}\n style={{\n WebkitLineClamp: lineClamp,\n }}\n title={tooltip}\n ref={ref}\n >\n {children}\n </Tag>\n );\n});\n\nexport default Typography;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Typography/Typography.module.css\"; export 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\"}"]}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
|
|
2
|
-
|
|
3
|
-
// css-module:../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
|
-
// src/Button/constants/iconSize.ts
|
|
7
|
-
var iconSize = {
|
|
8
|
-
sm: Button_module_default.smIcon,
|
|
9
|
-
md: Button_module_default.mdIcon,
|
|
10
|
-
lg: Button_module_default.lgIcon
|
|
11
|
-
};
|
|
12
|
-
var iconSize_default = iconSize;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
exports.iconSize_default = iconSize_default;
|
|
17
|
-
//# sourceMappingURL=ZCSR6NFB.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["css-module:../Button.module.css#css-module","../../src/Button/constants/iconSize.ts"],"names":[],"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;;;ACE9wB,IAAM,WAAW;AAAA,EACf,IAAI,sBAAO;AAAA,EACX,IAAI,sBAAO;AAAA,EACX,IAAI,sBAAO;AACb;AAEA,IAAO,mBAAQ","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\"}","import styles from \"../Button.module.css\";\n\nconst iconSize = {\n sm: styles.smIcon,\n md: styles.mdIcon,\n lg: styles.lgIcon,\n};\n\nexport default iconSize;\n"]}
|
|
@@ -1,150 +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 _PKBQW5T6cjs = require('./PKBQW5T6.cjs');
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var _GANR5JVVcjs = require('./GANR5JVV.cjs');
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
var _X2SDR4SDcjs = require('./X2SDR4SD.cjs');
|
|
14
|
-
|
|
15
|
-
// src/Avatar/Avatar.tsx
|
|
16
|
-
var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
|
|
17
|
-
|
|
18
|
-
// css-module:./Avatar.module.css#css-module
|
|
19
|
-
var Avatar_module_default = { "avatar": "_avatar_1ombg_1", "avatarImage": "_avatarImage_1ombg_5", "avatarImageClassic": "_avatarImageClassic_1ombg_13", "avatarImageOutlineCambio": "_avatarImageOutlineCambio_1ombg_17", "xs": "_xs_1ombg_21", "sm": "_sm_1ombg_26", "md": "_md_1ombg_31", "lg": "_lg_1ombg_36", "xl": "_xl_1ombg_41", "xsCambio": "_xsCambio_1ombg_46", "smCambio": "_smCambio_1ombg_51", "mdCambio": "_mdCambio_1ombg_56", "lgCambio": "_lgCambio_1ombg_61", "xlCambio": "_xlCambio_1ombg_66" };
|
|
20
|
-
|
|
21
|
-
// src/Avatar/Avatar.tsx
|
|
22
|
-
var _jsxruntime = require('react/jsx-runtime');
|
|
23
|
-
var sizeToIconStyles = {
|
|
24
|
-
xs: { bottom: 6, marginInlineEnd: 2, height: 4, width: 4 },
|
|
25
|
-
sm: { bottom: 6, marginInlineEnd: 2, height: 4, width: 4 },
|
|
26
|
-
md: { bottom: 6, marginInlineEnd: 2, height: 8, width: 8 },
|
|
27
|
-
lg: { bottom: 6, marginInlineEnd: 6, height: 12, width: 12 },
|
|
28
|
-
xl: { bottom: 12, marginInlineEnd: 12, height: 16, width: 16 }
|
|
29
|
-
};
|
|
30
|
-
var sizeToMarginClassic = {
|
|
31
|
-
xs: -16,
|
|
32
|
-
sm: -16,
|
|
33
|
-
md: -28,
|
|
34
|
-
lg: -48,
|
|
35
|
-
xl: -88
|
|
36
|
-
};
|
|
37
|
-
var sizeToMarginCambio = {
|
|
38
|
-
xs: -10,
|
|
39
|
-
sm: -14,
|
|
40
|
-
md: -22,
|
|
41
|
-
lg: -28,
|
|
42
|
-
xl: -28
|
|
43
|
-
};
|
|
44
|
-
function AvatarInternal({
|
|
45
|
-
accessibilityLabel,
|
|
46
|
-
icon,
|
|
47
|
-
outline,
|
|
48
|
-
size = "md",
|
|
49
|
-
src
|
|
50
|
-
}) {
|
|
51
|
-
const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
|
|
52
|
-
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
53
|
-
"div",
|
|
54
|
-
{
|
|
55
|
-
className: _classnames2.default.call(void 0,
|
|
56
|
-
Avatar_module_default.avatar,
|
|
57
|
-
themeName === "classic" ? Avatar_module_default[size] : Avatar_module_default[`${size}Cambio`]
|
|
58
|
-
),
|
|
59
|
-
children: [
|
|
60
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
61
|
-
"img",
|
|
62
|
-
{
|
|
63
|
-
alt: accessibilityLabel,
|
|
64
|
-
src,
|
|
65
|
-
className: _classnames2.default.call(void 0,
|
|
66
|
-
Avatar_module_default.avatarImage,
|
|
67
|
-
themeName === "classic" && Avatar_module_default.avatarImageClassic,
|
|
68
|
-
themeName === "cambio" && outline && Avatar_module_default.avatarImageOutlineCambio,
|
|
69
|
-
themeName === "classic" ? Avatar_module_default[size] : Avatar_module_default[`${size}Cambio`]
|
|
70
|
-
)
|
|
71
|
-
}
|
|
72
|
-
),
|
|
73
|
-
icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _GANR5JVVcjs.Box_default, { display: "flex", position: "relative", justifyContent: "end", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
74
|
-
_GANR5JVVcjs.Box_default,
|
|
75
|
-
{
|
|
76
|
-
display: "flex",
|
|
77
|
-
alignItems: "center",
|
|
78
|
-
justifyContent: "center",
|
|
79
|
-
position: "absolute",
|
|
80
|
-
backgroundColor: "white",
|
|
81
|
-
dangerouslySetInlineStyle: {
|
|
82
|
-
__style: _X2SDR4SDcjs.__spreadValues.call(void 0, {
|
|
83
|
-
border: "1px solid white"
|
|
84
|
-
}, sizeToIconStyles[size])
|
|
85
|
-
},
|
|
86
|
-
rounding: "full",
|
|
87
|
-
children: icon
|
|
88
|
-
}
|
|
89
|
-
) })
|
|
90
|
-
]
|
|
91
|
-
}
|
|
92
|
-
);
|
|
93
|
-
}
|
|
94
|
-
var Avatar = ({
|
|
95
|
-
accessibilityLabel,
|
|
96
|
-
icon,
|
|
97
|
-
size = "md",
|
|
98
|
-
src
|
|
99
|
-
}) => {
|
|
100
|
-
const avatarGroupContext = _PKBQW5T6cjs.useAvatarGroup.call(void 0, );
|
|
101
|
-
const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
|
|
102
|
-
if (avatarGroupContext !== null) {
|
|
103
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
104
|
-
_GANR5JVVcjs.Box_default,
|
|
105
|
-
{
|
|
106
|
-
position: "relative",
|
|
107
|
-
dangerouslySetInlineStyle: {
|
|
108
|
-
__style: {
|
|
109
|
-
marginInlineEnd: themeName === "cambio" ? sizeToMarginCambio[avatarGroupContext.size] : sizeToMarginClassic[avatarGroupContext.size]
|
|
110
|
-
}
|
|
111
|
-
},
|
|
112
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
113
|
-
_GANR5JVVcjs.Box_default,
|
|
114
|
-
{
|
|
115
|
-
display: "flex",
|
|
116
|
-
alignItems: "center",
|
|
117
|
-
justifyContent: "center",
|
|
118
|
-
backgroundColor: "white",
|
|
119
|
-
rounding: "full",
|
|
120
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
121
|
-
AvatarInternal,
|
|
122
|
-
{
|
|
123
|
-
accessibilityLabel,
|
|
124
|
-
icon,
|
|
125
|
-
outline: themeName === "cambio",
|
|
126
|
-
size: avatarGroupContext.size,
|
|
127
|
-
src
|
|
128
|
-
}
|
|
129
|
-
)
|
|
130
|
-
}
|
|
131
|
-
)
|
|
132
|
-
}
|
|
133
|
-
);
|
|
134
|
-
}
|
|
135
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
136
|
-
AvatarInternal,
|
|
137
|
-
{
|
|
138
|
-
accessibilityLabel,
|
|
139
|
-
icon,
|
|
140
|
-
size,
|
|
141
|
-
src
|
|
142
|
-
}
|
|
143
|
-
);
|
|
144
|
-
};
|
|
145
|
-
var Avatar_default = Avatar;
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
exports.Avatar_default = Avatar_default;
|
|
150
|
-
//# sourceMappingURL=ZRO3RCYX.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Avatar/Avatar.tsx","css-module:./Avatar.module.css#css-module"],"names":[],"mappings":"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","sourcesContent":["import { type ReactElement } from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./Avatar.module.css\";\nimport Box from \"../Box/Box\";\nimport { useAvatarGroup } from \"../AvatarGroup/AvatarGroup\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nconst sizeToIconStyles = {\n xs: { bottom: 6, marginInlineEnd: 2, height: 4, width: 4 },\n sm: { bottom: 6, marginInlineEnd: 2, height: 4, width: 4 },\n md: { bottom: 6, marginInlineEnd: 2, height: 8, width: 8 },\n lg: { bottom: 6, marginInlineEnd: 6, height: 12, width: 12 },\n xl: { bottom: 12, marginInlineEnd: 12, height: 16, width: 16 },\n} as const;\n\nconst sizeToMarginClassic = {\n xs: -16,\n sm: -16,\n md: -28,\n lg: -48,\n xl: -88,\n} as const;\n\nconst sizeToMarginCambio = {\n xs: -10,\n sm: -14,\n md: -22,\n lg: -28,\n xl: -28,\n} as const;\n\nfunction AvatarInternal({\n accessibilityLabel,\n icon,\n outline,\n size = \"md\",\n src,\n}: {\n accessibilityLabel: string;\n icon?: React.ReactElement;\n outline?: boolean;\n size?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n src: string;\n}): ReactElement {\n const { themeName } = useTheme();\n\n return (\n <div\n className={classNames(\n styles.avatar,\n themeName === \"classic\" ? styles[size] : styles[`${size}Cambio`],\n )}\n >\n <img\n alt={accessibilityLabel}\n src={src}\n className={classNames(\n styles.avatarImage,\n themeName === \"classic\" && styles.avatarImageClassic,\n themeName === \"cambio\" && outline && styles.avatarImageOutlineCambio,\n themeName === \"classic\" ? styles[size] : styles[`${size}Cambio`],\n )}\n />\n {icon && (\n <Box display=\"flex\" position=\"relative\" justifyContent=\"end\">\n <Box\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n position=\"absolute\"\n backgroundColor=\"white\"\n dangerouslySetInlineStyle={{\n __style: {\n border: \"1px solid white\",\n ...sizeToIconStyles[size],\n },\n }}\n rounding=\"full\"\n >\n {icon}\n </Box>\n </Box>\n )}\n </div>\n );\n}\n\n/**\n * [Avatar](https://cambly-syntax.vercel.app/?path=/docs/components-avatar--docs) is a circular image that represents a user.\n */\nconst Avatar = ({\n accessibilityLabel,\n icon,\n size = \"md\",\n src,\n}: {\n /**\n * Alt text to use for the image.\n * This should describe the image to people using screen readers.\n */\n accessibilityLabel: string;\n /**\n * optional icon that appears on the bottom corner of the avatar\n */\n icon?: React.ReactElement;\n /**\n * Size of the avatar.\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?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n /**\n * URL of the image to display as the avatar.\n */\n src: string;\n}): JSX.Element => {\n const avatarGroupContext = useAvatarGroup();\n const { themeName } = useTheme();\n\n if (avatarGroupContext !== null) {\n return (\n <Box\n position=\"relative\"\n dangerouslySetInlineStyle={{\n __style: {\n marginInlineEnd:\n themeName === \"cambio\"\n ? sizeToMarginCambio[avatarGroupContext.size]\n : sizeToMarginClassic[avatarGroupContext.size],\n },\n }}\n >\n <Box\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"white\"\n rounding=\"full\"\n >\n <AvatarInternal\n accessibilityLabel={accessibilityLabel}\n icon={icon}\n outline={themeName === \"cambio\"}\n size={avatarGroupContext.size}\n src={src}\n />\n </Box>\n </Box>\n );\n }\n\n return (\n <AvatarInternal\n accessibilityLabel={accessibilityLabel}\n icon={icon}\n size={size}\n src={src}\n />\n );\n};\n\nexport default Avatar;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Avatar/Avatar.module.css\"; export default {\"avatar\":\"_avatar_1ombg_1\",\"avatarImage\":\"_avatarImage_1ombg_5\",\"avatarImageClassic\":\"_avatarImageClassic_1ombg_13\",\"avatarImageOutlineCambio\":\"_avatarImageOutlineCambio_1ombg_17\",\"xs\":\"_xs_1ombg_21\",\"sm\":\"_sm_1ombg_26\",\"md\":\"_md_1ombg_31\",\"lg\":\"_lg_1ombg_36\",\"xl\":\"_xl_1ombg_41\",\"xsCambio\":\"_xsCambio_1ombg_46\",\"smCambio\":\"_smCambio_1ombg_51\",\"mdCambio\":\"_mdCambio_1ombg_56\",\"lgCambio\":\"_lgCambio_1ombg_61\",\"xlCambio\":\"_xlCambio_1ombg_66\"}"]}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|