@cambly/syntax-core 10.29.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/FocusTrap.cjs +3 -2
- package/dist/Modal/FocusTrap.js +2 -1
- 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 +12 -16
- package/dist/Modal/Modal.css +67 -274
- package/dist/Modal/Modal.css.map +1 -1
- package/dist/Modal/Modal.d.ts +3 -7
- package/dist/Modal/Modal.js +10 -14
- 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/{AXHY5J3K.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/4OOJZHZM.cjs +138 -0
- package/dist/__chunks/4OOJZHZM.cjs.map +1 -0
- package/dist/__chunks/{FTKHKS6W.js → 4SABJA3K.js} +3 -3
- package/dist/__chunks/{VQF4J5CC.js → 57KSLOGS.js} +1 -1
- package/dist/__chunks/{VQF4J5CC.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/{3Q5UNXKC.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/{J7FCX3U6.js → HVA7R2EL.js} +7 -3
- package/dist/__chunks/HVA7R2EL.js.map +1 -0
- package/dist/__chunks/{JHLUJYBX.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/KPQ6AISJ.js +138 -0
- 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/{2BEN3VH2.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/{OFALBLGM.cjs → N47VDOUP.cjs} +1 -1
- package/dist/__chunks/{OFALBLGM.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/{ZDQ6WQM3.cjs → THM3NAFO.cjs} +7 -3
- package/dist/__chunks/THM3NAFO.cjs.map +1 -0
- 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 +39 -44
- package/dist/index.css +148 -415
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +40 -45
- package/package.json +1 -1
- package/dist/__chunks/2BEN3VH2.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/3Q5UNXKC.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/7BAMJSUF.js.map +0 -1
- package/dist/__chunks/A323TCSA.cjs.map +0 -1
- package/dist/__chunks/AXHY5J3K.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/CS66HKUB.cjs.map +0 -1
- package/dist/__chunks/DDUKESGS.cjs +0 -177
- package/dist/__chunks/DDUKESGS.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/J7FCX3U6.js.map +0 -1
- package/dist/__chunks/JAC64LLA.js +0 -17
- package/dist/__chunks/JAC64LLA.js.map +0 -1
- package/dist/__chunks/JHLUJYBX.cjs.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/THYSYYWS.cjs.map +0 -1
- package/dist/__chunks/TNHXXDCA.js +0 -177
- package/dist/__chunks/TNHXXDCA.js.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/ZDQ6WQM3.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
|
@@ -7,28 +7,22 @@ import {
|
|
|
7
7
|
} from "./Z5ZUAP2B.js";
|
|
8
8
|
import {
|
|
9
9
|
iconSize_default
|
|
10
|
-
} from "./
|
|
10
|
+
} from "./YV4ASN4Z.js";
|
|
11
11
|
import {
|
|
12
|
-
cambioColor
|
|
13
|
-
classicColor
|
|
12
|
+
cambioColor
|
|
14
13
|
} from "./GFKDPMFK.js";
|
|
15
14
|
import {
|
|
16
|
-
cambioForegroundColor
|
|
17
|
-
|
|
18
|
-
} from "./FPHP3T7U.js";
|
|
15
|
+
cambioForegroundColor
|
|
16
|
+
} from "./P6K7GG3H.js";
|
|
19
17
|
import {
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
} from "./IB3FQANU.js";
|
|
18
|
+
backgroundColor
|
|
19
|
+
} from "./MWCEKFF2.js";
|
|
23
20
|
import {
|
|
24
21
|
Box_default
|
|
25
|
-
} from "./
|
|
22
|
+
} from "./ZPY7QEBH.js";
|
|
26
23
|
import {
|
|
27
24
|
Typography_default
|
|
28
|
-
} from "./
|
|
29
|
-
import {
|
|
30
|
-
useTheme
|
|
31
|
-
} from "./4GTNQPPD.js";
|
|
25
|
+
} from "./3GNWH6C7.js";
|
|
32
26
|
import {
|
|
33
27
|
useIsHydrated
|
|
34
28
|
} from "./JB65NEXK.js";
|
|
@@ -38,7 +32,7 @@ import { forwardRef } from "react";
|
|
|
38
32
|
import classNames from "classnames";
|
|
39
33
|
|
|
40
34
|
// css-module:./Button.module.css#css-module
|
|
41
|
-
var Button_module_default = { "button": "
|
|
35
|
+
var Button_module_default = { "button": "_button_hiifq_1", "buttonGap": "_buttonGap_hiifq_9", "disabledPrimary": "_disabledPrimary_hiifq_50", "fullWidth": "_fullWidth_hiifq_54", "sm": "_sm_hiifq_58", "md": "_md_hiifq_65", "lg": "_lg_hiifq_72", "icon": "_icon_hiifq_79", "smIcon": "_smIcon_hiifq_83", "mdIcon": "_mdIcon_hiifq_90", "lgIcon": "_lgIcon_hiifq_97", "loading": "_loading_hiifq_114", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_hiifq_1", "loadingCircle": "_loadingCircle_hiifq_118" };
|
|
42
36
|
|
|
43
37
|
// src/Button/Button.tsx
|
|
44
38
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -61,10 +55,9 @@ var Button = forwardRef(
|
|
|
61
55
|
type = "button"
|
|
62
56
|
}, ref) => {
|
|
63
57
|
const isHydrated = useIsHydrated();
|
|
64
|
-
const
|
|
65
|
-
const
|
|
66
|
-
const
|
|
67
|
-
const disabledCambioPrimary = themeName === "cambio" && color === "primary" && disabled;
|
|
58
|
+
const foregroundColorClass = cambioForegroundColor(cambioColor(color), on);
|
|
59
|
+
const backgroundColorClass = backgroundColor(cambioColor(color), on);
|
|
60
|
+
const disabledPrimary = color === "primary" && disabled;
|
|
68
61
|
return /* @__PURE__ */ jsxs(
|
|
69
62
|
"button",
|
|
70
63
|
{
|
|
@@ -79,12 +72,10 @@ var Button = forwardRef(
|
|
|
79
72
|
Button_module_default.button,
|
|
80
73
|
foregroundColorClass,
|
|
81
74
|
backgroundColorClass,
|
|
82
|
-
|
|
75
|
+
Button_module_default[size],
|
|
83
76
|
{
|
|
84
77
|
[Button_module_default.fullWidth]: fullWidth,
|
|
85
|
-
[Button_module_default.buttonGap]: size === "lg" || size === "md"
|
|
86
|
-
[Button_module_default.secondaryBorder]: themeName === "classic" && color === "secondary",
|
|
87
|
-
[Button_module_default.secondaryDestructiveBorder]: themeName === "classic" && color === "destructive-secondary"
|
|
78
|
+
[Button_module_default.buttonGap]: size === "lg" || size === "md"
|
|
88
79
|
}
|
|
89
80
|
),
|
|
90
81
|
children: [
|
|
@@ -94,35 +85,29 @@ var Button = forwardRef(
|
|
|
94
85
|
className: classNames(
|
|
95
86
|
Button_module_default.icon,
|
|
96
87
|
iconSize_default[size],
|
|
97
|
-
|
|
88
|
+
disabledPrimary && Button_module_default.disabledPrimary
|
|
98
89
|
)
|
|
99
90
|
}
|
|
100
91
|
),
|
|
101
|
-
(loading && loadingText || !loading && text) && /* @__PURE__ */ jsx(Box_default, { paddingX: 1, children: /* @__PURE__ */ jsx(
|
|
102
|
-
|
|
92
|
+
(loading && loadingText || !loading && text) && /* @__PURE__ */ jsx(Box_default, { paddingX: 1, children: /* @__PURE__ */ jsx(Typography_default, { size: textVariant_default[size], children: /* @__PURE__ */ jsx(
|
|
93
|
+
"span",
|
|
103
94
|
{
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
disabledCambioPrimary && Button_module_default.disabledCambioPrimary
|
|
112
|
-
),
|
|
113
|
-
style: { fontWeight: 500 },
|
|
114
|
-
children: loading ? loadingText : text
|
|
115
|
-
}
|
|
116
|
-
)
|
|
95
|
+
className: classNames(
|
|
96
|
+
// Temporary - until we have cambio colors on Typography
|
|
97
|
+
foregroundColorClass,
|
|
98
|
+
disabledPrimary && Button_module_default.disabledPrimary
|
|
99
|
+
),
|
|
100
|
+
style: { fontWeight: 500 },
|
|
101
|
+
children: loading ? loadingText : text
|
|
117
102
|
}
|
|
118
|
-
) }),
|
|
103
|
+
) }) }),
|
|
119
104
|
!loading && EndIcon && /* @__PURE__ */ jsx(
|
|
120
105
|
EndIcon,
|
|
121
106
|
{
|
|
122
107
|
className: classNames(
|
|
123
108
|
Button_module_default.icon,
|
|
124
109
|
iconSize_default[size],
|
|
125
|
-
|
|
110
|
+
disabledPrimary && Button_module_default.disabledPrimary
|
|
126
111
|
)
|
|
127
112
|
}
|
|
128
113
|
),
|
|
@@ -157,4 +142,4 @@ var Button_default = Button;
|
|
|
157
142
|
export {
|
|
158
143
|
Button_default
|
|
159
144
|
};
|
|
160
|
-
//# sourceMappingURL=
|
|
145
|
+
//# sourceMappingURL=GR5G6EJO.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Button/Button.tsx","css-module:./Button.module.css#css-module"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport iconSize from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { cambioColor } from \"./constants/color\";\nimport { backgroundColor } from \"../colors/backgroundColor\";\nimport { cambioForegroundColor } from \"../colors/foregroundColor\";\n\ntype ButtonProps = {\n /**\n * Test id for the button\n */\n \"data-testid\"?: string;\n /**\n * The text to be displayed inside the button\n */\n text: string;\n /**\n * The text to be displayed inside the button when it is in a loading state\n */\n loadingText?: string;\n /**\n * The color of the button\n *\n * `inverse` and `success` are deprecated\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 * 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 * If `true`, the button will be disabled\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * If `true`, the button will be in a loading state\n *\n * @defaultValue false\n */\n loading?: boolean;\n /**\n * If `true`, the button will take up the full width of its container\n *\n * @defaultValue false\n */\n fullWidth?: boolean;\n /**\n * The icon to be displayed at the start of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n startIcon?: React.ComponentType<{ className?: string }>;\n /**\n * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n endIcon?: React.ComponentType<{ className?: string }>;\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 * The type you want to set for the primitive `<button/>`\n */\n type?: \"button\" | \"submit\" | \"reset\";\n};\n\n/**\n * [Button](https://cambly-syntax.vercel.app/?path=/docs/components-button--docs) is used to trigger an action or event, such as submitting a form, opening a dialog, canceling an action, or performing a delete operation.\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n \"data-testid\": dataTestId,\n text,\n loadingText,\n color = \"primary\",\n size = \"md\",\n accessibilityLabel,\n disabled = false,\n loading = false,\n fullWidth = false,\n startIcon: StartIcon,\n endIcon: EndIcon,\n on = \"lightBackground\",\n onClick,\n tooltip,\n type = \"button\",\n }: ButtonProps,\n ref,\n ) => {\n const isHydrated = useIsHydrated();\n\n const foregroundColorClass = cambioForegroundColor(cambioColor(color), on);\n const backgroundColorClass = backgroundColor(cambioColor(color), on);\n const disabledPrimary = color === \"primary\" && disabled;\n\n return (\n <button\n data-testid={dataTestId}\n ref={ref}\n aria-label={accessibilityLabel}\n type={type}\n title={tooltip}\n disabled={!isHydrated || disabled || loading}\n onClick={onClick}\n className={classNames(\n styles.button,\n foregroundColorClass,\n backgroundColorClass,\n styles[size],\n {\n [styles.fullWidth]: fullWidth,\n [styles.buttonGap]: size === \"lg\" || size === \"md\",\n },\n )}\n >\n {!loading && StartIcon && (\n <StartIcon\n className={classNames(\n styles.icon,\n iconSize[size],\n disabledPrimary && styles.disabledPrimary,\n )}\n />\n )}\n {((loading && loadingText) || (!loading && text)) && (\n <Box paddingX={1}>\n <Typography size={textVariant[size]}>\n <span\n className={classNames(\n // Temporary - until we have cambio colors on Typography\n foregroundColorClass,\n disabledPrimary && styles.disabledPrimary,\n )}\n style={{ fontWeight: 500 }}\n >\n {loading ? loadingText : text}\n </span>\n </Typography>\n </Box>\n )}\n {!loading && EndIcon && (\n <EndIcon\n className={classNames(\n styles.icon,\n iconSize[size],\n disabledPrimary && styles.disabledPrimary,\n )}\n />\n )}\n {loading && (\n <svg\n className={classNames(styles.loading, foregroundColorClass)}\n viewBox=\"22 22 44 44\"\n width={loadingIconSize[size]}\n height={loadingIconSize[size]}\n >\n <circle\n className={styles.loadingCircle}\n cx=\"44\"\n cy=\"44\"\n r=\"20.2\"\n fill=\"none\"\n strokeWidth=\"3.6\"\n />\n </svg>\n )}\n </button>\n );\n },\n);\n\nButton.displayName = \"Button\";\n\nexport default Button;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_hiifq_1\",\"buttonGap\":\"_buttonGap_hiifq_9\",\"disabledPrimary\":\"_disabledPrimary_hiifq_50\",\"fullWidth\":\"_fullWidth_hiifq_54\",\"sm\":\"_sm_hiifq_58\",\"md\":\"_md_hiifq_65\",\"lg\":\"_lg_hiifq_72\",\"icon\":\"_icon_hiifq_79\",\"smIcon\":\"_smIcon_hiifq_83\",\"mdIcon\":\"_mdIcon_hiifq_90\",\"lgIcon\":\"_lgIcon_hiifq_97\",\"loading\":\"_loading_hiifq_114\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_hiifq_1\",\"loadingCircle\":\"_loadingCircle_hiifq_118\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAClC,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;ADgJpiB,SAoBI,KApBJ;AA5BN,IAAM,SAAS;AAAA,EACb,CACE;AAAA,IACE,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,OAAO;AAAA,IACP;AAAA,IACA,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,UAAM,uBAAuB,sBAAsB,YAAY,KAAK,GAAG,EAAE;AACzE,UAAM,uBAAuB,gBAAgB,YAAY,KAAK,GAAG,EAAE;AACnE,UAAM,kBAAkB,UAAU,aAAa;AAE/C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU,CAAC,cAAc,YAAY;AAAA,QACrC;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP;AAAA,UACA;AAAA,UACA,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,UAChD;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAS,IAAI;AAAA,gBACb,mBAAmB,sBAAO;AAAA,cAC5B;AAAA;AAAA,UACF;AAAA,WAEC,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,oBAAY,IAAI,GAChC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA;AAAA,gBAET;AAAA,gBACA,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,OAAO,EAAE,YAAY,IAAI;AAAA,cAExB,oBAAU,cAAc;AAAA;AAAA,UAC3B,GACF,GACF;AAAA,UAED,CAAC,WAAW,WACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAS,IAAI;AAAA,gBACb,mBAAmB,sBAAO;AAAA,cAC5B;AAAA;AAAA,UACF;AAAA,UAED,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,oBAAoB;AAAA,cAC1D,SAAQ;AAAA,cACR,OAAO,wBAAgB,IAAI;AAAA,cAC3B,QAAQ,wBAAgB,IAAI;AAAA,cAE5B;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW,sBAAO;AAAA,kBAClB,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAE;AAAA,kBACF,MAAK;AAAA,kBACL,aAAY;AAAA;AAAA,cACd;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;AAErB,IAAO,iBAAQ;","names":[]}
|
|
@@ -1,10 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Box_default
|
|
4
|
-
} from "./
|
|
5
|
-
import {
|
|
6
|
-
useTheme
|
|
7
|
-
} from "./4GTNQPPD.js";
|
|
4
|
+
} from "./ZPY7QEBH.js";
|
|
8
5
|
|
|
9
6
|
// src/AvatarGroup/AvatarGroup.tsx
|
|
10
7
|
import {
|
|
@@ -22,8 +19,7 @@ function AvatarGroup({
|
|
|
22
19
|
orientation = "standard",
|
|
23
20
|
children
|
|
24
21
|
}) {
|
|
25
|
-
const
|
|
26
|
-
const parsedSize = themeName === "cambio" && size === "xl" ? "lg" : size;
|
|
22
|
+
const parsedSize = size === "xl" ? "lg" : size;
|
|
27
23
|
return /* @__PURE__ */ jsx(AvatarGroupContext.Provider, { value: { size: parsedSize, orientation }, children: /* @__PURE__ */ jsx(
|
|
28
24
|
Box_default,
|
|
29
25
|
{
|
|
@@ -44,4 +40,4 @@ export {
|
|
|
44
40
|
useAvatarGroup,
|
|
45
41
|
AvatarGroup
|
|
46
42
|
};
|
|
47
|
-
//# sourceMappingURL=
|
|
43
|
+
//# sourceMappingURL=GSSIV3VC.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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\";\n\ntype Size =\n | \"xs\"\n | \"sm\"\n | \"md\"\n | \"lg\"\n /* `xl` is deprecated */\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 * * `xs`: 24px\n * * `sm`: 32px\n * * `md`: 48px\n * * `lg`: 64px\n * * `xl`: 64px (deprecated)\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 parsedSize = 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;AAyED;AAxDN,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,GA0BiB;AACf,QAAM,aAAa,SAAS,OAAO,OAAO;AAE1C,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,7 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Chip_default
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./RTT2WOZS.js";
|
|
5
5
|
import {
|
|
6
6
|
RichSelectItem_default
|
|
7
7
|
} from "./ODMJANSX.js";
|
|
@@ -31,4 +31,4 @@ var RichSelectChip_default = forwardRef(
|
|
|
31
31
|
export {
|
|
32
32
|
RichSelectChip_default
|
|
33
33
|
};
|
|
34
|
-
//# sourceMappingURL=
|
|
34
|
+
//# sourceMappingURL=H2AWA6IQ.js.map
|
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
|
+
import {
|
|
3
|
+
useIsHydrated
|
|
4
|
+
} from "./JB65NEXK.js";
|
|
2
5
|
|
|
3
6
|
// src/Modal/FocusTrap.tsx
|
|
4
7
|
import { useEffect, useRef } from "react";
|
|
@@ -33,6 +36,7 @@ function FocusTrap({
|
|
|
33
36
|
}) {
|
|
34
37
|
const elRef = useRef(null);
|
|
35
38
|
const previouslyFocusedElRef = useRef(null);
|
|
39
|
+
const isHydrated = useIsHydrated();
|
|
36
40
|
useEffect(() => {
|
|
37
41
|
const { current: element } = elRef;
|
|
38
42
|
const focusFirstChild = () => {
|
|
@@ -50,7 +54,7 @@ function FocusTrap({
|
|
|
50
54
|
}
|
|
51
55
|
event.stopPropagation();
|
|
52
56
|
event.preventDefault();
|
|
53
|
-
focusFirstChild();
|
|
57
|
+
isHydrated && focusFirstChild();
|
|
54
58
|
};
|
|
55
59
|
previouslyFocusedElRef.current = document.activeElement;
|
|
56
60
|
focusFirstChild();
|
|
@@ -62,11 +66,11 @@ function FocusTrap({
|
|
|
62
66
|
focusElement(previouslyFocusedEl);
|
|
63
67
|
}
|
|
64
68
|
};
|
|
65
|
-
}, [elRef, previouslyFocusedElRef]);
|
|
69
|
+
}, [isHydrated, elRef, previouslyFocusedElRef]);
|
|
66
70
|
return /* @__PURE__ */ jsx("div", { "data-testid": "syntax-focus-trap", ref: elRef, children });
|
|
67
71
|
}
|
|
68
72
|
|
|
69
73
|
export {
|
|
70
74
|
FocusTrap
|
|
71
75
|
};
|
|
72
|
-
//# sourceMappingURL=
|
|
76
|
+
//# sourceMappingURL=HVA7R2EL.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Modal/FocusTrap.tsx"],"sourcesContent":["import React, { useEffect, useRef, type ReactElement } from \"react\";\nimport useIsHydrated from \"../useIsHydrated\";\n\nfunction queryFocusableAll(el: HTMLDivElement): NodeListOf<HTMLElement> {\n // Focusable, interactive elements that could possibly be in children\n const selector = [\n \"a[href]\",\n \"area[href]\",\n \"input:not([disabled])\",\n \"select:not([disabled])\",\n \"textarea:not([disabled])\",\n \"button:not([disabled])\",\n \"iframe\",\n \"object\",\n \"embed\",\n '[tabindex=\"-1\"]',\n '[tabindex=\"0\"]',\n \"[contenteditable]\",\n \"audio[controls]\",\n \"video[controls]\",\n \"summary\",\n ].join(\",\");\n return el.querySelectorAll(selector);\n}\n\nconst focusElement = (el?: HTMLElement) => {\n if (el && typeof el.focus === \"function\") {\n el.focus();\n }\n};\n\n/**\n * FocusTrap is used by components like Modal to ensure that only elements within children components can be focused.\n */\nexport default function FocusTrap({\n children,\n}: {\n children?: ReactElement | null;\n}): ReactElement {\n const elRef = useRef<HTMLDivElement | null>(null);\n const previouslyFocusedElRef = useRef<HTMLElement | null>(null);\n const isHydrated = useIsHydrated();\n\n useEffect(() => {\n const { current: element } = elRef;\n\n // Focus the first child element among all the focusable, interactive elements within `children`\n const focusFirstChild = () => {\n const withinIframe = window !== window.parent;\n if (element && !withinIframe) {\n focusElement(queryFocusableAll(element)[0]);\n }\n };\n\n const handleFocus: (event: FocusEvent) => void = (event: FocusEvent) => {\n if (\n !element ||\n (event.target instanceof Node && element.contains(event.target))\n ) {\n return;\n }\n\n // This prevents stack overflow when multiple FocusTraps are rendered\n if (\n event.target instanceof Element &&\n event.target.closest('[data-testid=\"syntax-focus-trap\"]') !== null\n ) {\n return;\n }\n\n event.stopPropagation();\n event.preventDefault();\n isHydrated && focusFirstChild();\n };\n\n // If an element has focus currently, keep a reference to that element\n previouslyFocusedElRef.current = document.activeElement as HTMLElement;\n focusFirstChild();\n document.addEventListener(\"focus\", handleFocus, true);\n\n return function cleanup() {\n const { current: previouslyFocusedEl } = previouslyFocusedElRef;\n document.removeEventListener(\"focus\", handleFocus, true);\n // If we previously stored a reference to a focused element, return focus to that element\n if (previouslyFocusedEl) {\n focusElement(previouslyFocusedEl);\n }\n };\n }, [isHydrated, elRef, previouslyFocusedElRef]);\n\n return (\n <div data-testid=\"syntax-focus-trap\" ref={elRef}>\n {children}\n </div>\n );\n}\n"],"mappings":";;;;;;AAAA,SAAgB,WAAW,cAAiC;AA2FxD;AAxFJ,SAAS,kBAAkB,IAA6C;AAEtE,QAAM,WAAW;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,EAAE,KAAK,GAAG;AACV,SAAO,GAAG,iBAAiB,QAAQ;AACrC;AAEA,IAAM,eAAe,CAAC,OAAqB;AACzC,MAAI,MAAM,OAAO,GAAG,UAAU,YAAY;AACxC,OAAG,MAAM;AAAA,EACX;AACF;AAKe,SAAR,UAA2B;AAAA,EAChC;AACF,GAEiB;AACf,QAAM,QAAQ,OAA8B,IAAI;AAChD,QAAM,yBAAyB,OAA2B,IAAI;AAC9D,QAAM,aAAa,cAAc;AAEjC,YAAU,MAAM;AACd,UAAM,EAAE,SAAS,QAAQ,IAAI;AAG7B,UAAM,kBAAkB,MAAM;AAC5B,YAAM,eAAe,WAAW,OAAO;AACvC,UAAI,WAAW,CAAC,cAAc;AAC5B,qBAAa,kBAAkB,OAAO,EAAE,CAAC,CAAC;AAAA,MAC5C;AAAA,IACF;AAEA,UAAM,cAA2C,CAAC,UAAsB;AACtE,UACE,CAAC,WACA,MAAM,kBAAkB,QAAQ,QAAQ,SAAS,MAAM,MAAM,GAC9D;AACA;AAAA,MACF;AAGA,UACE,MAAM,kBAAkB,WACxB,MAAM,OAAO,QAAQ,mCAAmC,MAAM,MAC9D;AACA;AAAA,MACF;AAEA,YAAM,gBAAgB;AACtB,YAAM,eAAe;AACrB,oBAAc,gBAAgB;AAAA,IAChC;AAGA,2BAAuB,UAAU,SAAS;AAC1C,oBAAgB;AAChB,aAAS,iBAAiB,SAAS,aAAa,IAAI;AAEpD,WAAO,SAAS,UAAU;AACxB,YAAM,EAAE,SAAS,oBAAoB,IAAI;AACzC,eAAS,oBAAoB,SAAS,aAAa,IAAI;AAEvD,UAAI,qBAAqB;AACvB,qBAAa,mBAAmB;AAAA,MAClC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,YAAY,OAAO,sBAAsB,CAAC;AAE9C,SACE,oBAAC,SAAI,eAAY,qBAAoB,KAAK,OACvC,UACH;AAEJ;","names":[]}
|
|
@@ -3,38 +3,35 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _C2H5JBU2cjs = require('./C2H5JBU2.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _N2V7ZZBMcjs = require('./N2V7ZZBM.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
|
-
var
|
|
12
|
+
var _TDPIWHGRcjs = require('./TDPIWHGR.cjs');
|
|
13
13
|
|
|
14
14
|
|
|
15
|
-
var
|
|
15
|
+
var _2IHACTOYcjs = require('./2IHACTOY.cjs');
|
|
16
16
|
|
|
17
17
|
|
|
18
|
-
var
|
|
18
|
+
var _753VRQSYcjs = require('./753VRQSY.cjs');
|
|
19
19
|
|
|
20
20
|
|
|
21
21
|
|
|
22
|
-
var
|
|
22
|
+
var _N47VDOUPcjs = require('./N47VDOUP.cjs');
|
|
23
23
|
|
|
24
24
|
|
|
25
|
-
var
|
|
25
|
+
var _35S5FKUCcjs = require('./35S5FKUC.cjs');
|
|
26
26
|
|
|
27
27
|
|
|
28
|
-
var
|
|
28
|
+
var _QN33R37Rcjs = require('./QN33R37R.cjs');
|
|
29
29
|
|
|
30
30
|
|
|
31
|
-
var
|
|
31
|
+
var _OT2MUGKKcjs = require('./OT2MUGKK.cjs');
|
|
32
32
|
|
|
33
33
|
|
|
34
|
-
var
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
|
|
34
|
+
var _5VHLZADOcjs = require('./5VHLZADO.cjs');
|
|
38
35
|
|
|
39
36
|
|
|
40
37
|
var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
|
|
@@ -59,17 +56,12 @@ var _utils = require('@react-stately/utils');
|
|
|
59
56
|
var _interactions = require('@react-aria/interactions');
|
|
60
57
|
|
|
61
58
|
// css-module:../SelectList/SelectList.module.css#css-module
|
|
62
|
-
var SelectList_module_default = { "selectContainer": "
|
|
59
|
+
var SelectList_module_default = { "selectContainer": "_selectContainer_1f379_1", "opacityOverlay": "_opacityOverlay_1f379_7", "selectWrapper": "_selectWrapper_1f379_11", "selectBox": "_selectBox_1f379_16", "selectBoxCambio": "_selectBoxCambio_1f379_32", "selectMouseFocusStyling": "_selectMouseFocusStyling_1f379_41", "unselected": "_unselected_1f379_46", "selected": "_selected_1f379_50", "arrowIcon": "_arrowIcon_1f379_54", "selectErrorCambio": "_selectErrorCambio_1f379_68" };
|
|
63
60
|
|
|
64
61
|
// src/RichSelect/RichSelectList.tsx
|
|
65
62
|
var _reactaria = require('react-aria');
|
|
66
63
|
var _jsxruntime = require('react/jsx-runtime');
|
|
67
64
|
var NOOP = () => void 0;
|
|
68
|
-
var iconSize = {
|
|
69
|
-
sm: 20,
|
|
70
|
-
md: 24,
|
|
71
|
-
lg: 24
|
|
72
|
-
};
|
|
73
65
|
function RichSelectList(props) {
|
|
74
66
|
const _a = props, {
|
|
75
67
|
autosave,
|
|
@@ -108,14 +100,13 @@ function RichSelectList(props) {
|
|
|
108
100
|
const inputId = id != null ? id : reactId;
|
|
109
101
|
const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
|
|
110
102
|
const disabled = !isHydrated || disabledProp;
|
|
111
|
-
const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
|
|
112
103
|
const overlayHandlerRef = _react.useRef.call(void 0, {});
|
|
113
104
|
const selectedKeysProp = _react.useMemo.call(void 0,
|
|
114
|
-
() =>
|
|
105
|
+
() => _C2H5JBU2cjs.convertSelection.call(void 0, selectedValuesProp),
|
|
115
106
|
[selectedValuesProp]
|
|
116
107
|
);
|
|
117
108
|
const defaultSelectedKeys = _react.useMemo.call(void 0,
|
|
118
|
-
() =>
|
|
109
|
+
() => _C2H5JBU2cjs.convertSelection.call(void 0, defaultSelectedValuesProp, /* @__PURE__ */ new Set()),
|
|
119
110
|
[defaultSelectedValuesProp]
|
|
120
111
|
);
|
|
121
112
|
const [selectedKeys, setSelectedKeys] = _utils.useControlledState.call(void 0,
|
|
@@ -153,8 +144,8 @@ function RichSelectList(props) {
|
|
|
153
144
|
_reactariacomponents.Provider,
|
|
154
145
|
{
|
|
155
146
|
values: [
|
|
156
|
-
[
|
|
157
|
-
[
|
|
147
|
+
[_C2H5JBU2cjs.RichSelectBoxContext, { autoFocus: true }],
|
|
148
|
+
[_2IHACTOYcjs.DialogContext, { padding: autosave ? void 0 : 0 }]
|
|
158
149
|
// this is altering Popover's internal dialog padding to show the sticky save/close buttons. Ideally this could be avoided
|
|
159
150
|
],
|
|
160
151
|
children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
@@ -177,23 +168,23 @@ function RichSelectList(props) {
|
|
|
177
168
|
(_a2 = fieldRef.current) == null ? void 0 : _a2.focus();
|
|
178
169
|
_interactions.setInteractionModality.call(void 0, "keyboard");
|
|
179
170
|
},
|
|
180
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
171
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _OT2MUGKKcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _5VHLZADOcjs.Typography_default, { size: 100, color: "gray700", children: label }) })
|
|
181
172
|
})
|
|
182
173
|
) }),
|
|
183
174
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
184
|
-
|
|
175
|
+
_TDPIWHGRcjs.Popover_default,
|
|
185
176
|
{
|
|
186
177
|
ref: overlayHandlerRef,
|
|
187
178
|
disabled,
|
|
188
179
|
content: (
|
|
189
180
|
// this Box wrapper is to reapply the padding that was stripped from popover's dialog to show the sticky save/close buttons. Ideally this could be avoided
|
|
190
181
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
191
|
-
|
|
182
|
+
_OT2MUGKKcjs.Box_default,
|
|
192
183
|
{
|
|
193
184
|
padding: autosave ? void 0 : 5,
|
|
194
185
|
dangerouslySetInlineStyle: autosave ? void 0 : { __style: { paddingBottom: 0 } },
|
|
195
186
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
196
|
-
|
|
187
|
+
_C2H5JBU2cjs.RichSelectBox_default,
|
|
197
188
|
_X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
|
|
198
189
|
autosave,
|
|
199
190
|
selectedValues: selectedKeys,
|
|
@@ -208,26 +199,25 @@ function RichSelectList(props) {
|
|
|
208
199
|
)
|
|
209
200
|
),
|
|
210
201
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
211
|
-
|
|
202
|
+
_753VRQSYcjs.TapArea_default,
|
|
212
203
|
_X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
|
|
213
204
|
"data-testid": dataTestId,
|
|
214
205
|
disabled,
|
|
215
206
|
onClick,
|
|
216
|
-
rounding:
|
|
207
|
+
rounding: "md"
|
|
217
208
|
}, fieldProps), {
|
|
218
209
|
ref: fieldRef,
|
|
219
|
-
children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: SelectList_module_default.selectWrapper, children: [
|
|
210
|
+
children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: SelectList_module_default.selectWrapper, "data-size": size, children: [
|
|
220
211
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
221
212
|
"div",
|
|
222
213
|
{
|
|
223
214
|
className: _classnames2.default.call(void 0,
|
|
224
215
|
SelectList_module_default.selectBox,
|
|
225
|
-
|
|
226
|
-
themeName === "classic" && SelectList_module_default[size],
|
|
216
|
+
SelectList_module_default.selectBoxCambio,
|
|
227
217
|
{
|
|
228
218
|
[SelectList_module_default.unselected]: !errorText && selectedKeys !== "all" && !selectedKeys.size,
|
|
229
219
|
[SelectList_module_default.selected]: !errorText && (selectedKeys === "all" || selectedKeys.size),
|
|
230
|
-
[
|
|
220
|
+
[SelectList_module_default.selectErrorCambio]: errorText
|
|
231
221
|
}
|
|
232
222
|
),
|
|
233
223
|
children: selectedTextValue
|
|
@@ -239,11 +229,11 @@ function RichSelectList(props) {
|
|
|
239
229
|
focusable: "false",
|
|
240
230
|
"aria-hidden": "true",
|
|
241
231
|
viewBox: "0 0 24 24",
|
|
242
|
-
width:
|
|
232
|
+
width: 24,
|
|
243
233
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
244
234
|
"path",
|
|
245
235
|
{
|
|
246
|
-
fill: errorText ?
|
|
236
|
+
fill: errorText ? _N47VDOUPcjs.ColorBaseDestructive700 : _N47VDOUPcjs.ColorBaseGray800,
|
|
247
237
|
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"
|
|
248
238
|
}
|
|
249
239
|
)
|
|
@@ -254,8 +244,8 @@ function RichSelectList(props) {
|
|
|
254
244
|
)
|
|
255
245
|
}
|
|
256
246
|
),
|
|
257
|
-
(helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
258
|
-
|
|
247
|
+
(helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _OT2MUGKKcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
248
|
+
_5VHLZADOcjs.Typography_default,
|
|
259
249
|
_X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
|
|
260
250
|
size: 100,
|
|
261
251
|
color: errorText ? "destructive-primary" : "gray700"
|
|
@@ -270,12 +260,12 @@ function RichSelectList(props) {
|
|
|
270
260
|
);
|
|
271
261
|
}
|
|
272
262
|
var RichSelectList_default = Object.assign(RichSelectList, {
|
|
273
|
-
Section:
|
|
274
|
-
Chip:
|
|
275
|
-
RadioButton:
|
|
263
|
+
Section: _35S5FKUCcjs.RichSelectSection_default,
|
|
264
|
+
Chip: _N2V7ZZBMcjs.RichSelectChip_default,
|
|
265
|
+
RadioButton: _QN33R37Rcjs.RichSelectRadioButton_default
|
|
276
266
|
});
|
|
277
267
|
|
|
278
268
|
|
|
279
269
|
|
|
280
270
|
exports.RichSelectList_default = RichSelectList_default;
|
|
281
|
-
//# sourceMappingURL=
|
|
271
|
+
//# sourceMappingURL=J66QB6E3.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/RichSelect/RichSelectList.tsx","css-module:../SelectList/SelectList.module.css#css-module"],"names":["_a"],"mappings":"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","sourcesContent":["import React, {\n type ReactElement,\n useMemo,\n type SyntheticEvent,\n useRef,\n useId,\n} from \"react\";\nimport classNames from \"classnames\";\nimport {\n ColorBaseDestructive700,\n ColorBaseGray800,\n} from \"@cambly/syntax-design-tokens\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport Popover from \"../Popover/Popover\";\nimport {\n Label as ReactAriaLabel,\n Provider as ReactAriaProvider,\n} from \"react-aria-components\";\nimport { useControlledState } from \"@react-stately/utils\";\nimport { setInteractionModality } from \"@react-aria/interactions\";\nimport { DialogContext } from \"../Dialog/Dialog\";\nimport styles from \"../SelectList/SelectList.module.css\";\nimport RichSelectBox, {\n RichSelectBoxContext,\n convertSelection,\n type RichSelectBoxProps,\n} from \"./RichSelectBox\";\nimport TapArea from \"../TapArea/TapArea\";\nimport { type OverlayHandlerRef } from \"../react-aria-utils/Triggerable\";\nimport Box from \"../Box/Box\";\nimport RichSelectSection from \"./RichSelectSection\";\nimport RichSelectChip from \"./RichSelectChip\";\nimport RichSelectRadioButton from \"./RichSelectRadioButton\";\nimport { useField } from \"react-aria\";\n\nconst NOOP = () => undefined;\n\nexport type RichSelectListProps = RichSelectBoxProps & {\n /** Test id for the select element */\n \"data-testid\"?: string;\n /**\n * Disables the select dropdown entirely\n * @defaultValue false\n */\n disabled?: boolean;\n /** Callback to be called when select is clicked */\n onClick?: (event: SyntheticEvent<HTMLDivElement>) => void;\n /** Text shown below select box if there is an input error. */\n errorText?: string;\n /** Text shown below select box */\n helperText?: string;\n /**\n * RichSelectList id, if not provided, a unique id will be generated\n */\n id?: string;\n /** Text shown above select box */\n label: string;\n /**\n * Text showing in select box if no option has been chosen.\n * There should always have a placeholder unless there is a default option selected\n */\n placeholderText?: string;\n /** Use to render (override) text shown in the select box */\n selectTextValue?: (selectedValues?: \"all\" | string[]) => string | undefined;\n /**\n * Size of the select box\n *\n * @defaultValue \"md\"\n */\n size?: \"sm\" | \"md\" | \"lg\";\n};\n\n/**\n * [RichSelectList](https://cambly-syntax.vercel.app/?path=/docs/components-richselectlist--docs) is a dropdown menu that allows users to select one or multiple options from a list.\n *\n * Example Usage:\n ```\n <RichSelectList\n label=\"My Label\"\n multiple\n onChange={() => { ... }}\n primaryButtonText=\"Save\"\n primaryButtonAccessibilityLabel=\"Save\"\n secondaryButtonText=\"Clear\"\n secondaryButtonAccessibilityLabel=\"Clear\"\n >\n <RichSelectList.Section label=\"Cities\">\n <RichSelectList.Chip label=\"San Francisco\" value=\"sf\" />\n <RichSelectList.Chip label=\"New York\" value=\"ny\" disabled />\n <RichSelectList.Chip label=\"Tulsa\" value=\"tulsa\" />\n <RichSelectList.Chip label=\"Chicago\" value=\"chicago\" disabled />\n </RichSelectList.Section>\n </RichSelectList>\n ```\n */\nfunction RichSelectList(props: RichSelectListProps): ReactElement {\n const {\n autosave,\n children,\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText,\n helperText,\n label,\n id,\n onChange,\n onClick = NOOP,\n placeholderText,\n selectTextValue,\n selectedValues: selectedValuesProp,\n defaultSelectedValues: defaultSelectedValuesProp,\n size = \"md\",\n ...richSelectBoxProps\n } = props;\n\n const reactId = useId();\n const inputId = id ?? reactId;\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n\n // passed to popover, which attached open/close methods\n const overlayHandlerRef = useRef<OverlayHandlerRef>({});\n\n const selectedKeysProp = useMemo(\n () => convertSelection(selectedValuesProp),\n [selectedValuesProp],\n );\n const defaultSelectedKeys = useMemo(\n () => convertSelection(defaultSelectedValuesProp, new Set()),\n [defaultSelectedValuesProp],\n );\n const [selectedKeys, setSelectedKeys] = useControlledState(\n selectedKeysProp!, // eslint-disable-line @typescript-eslint/no-non-null-assertion -- there is a bug in the typedef for useControlledState from react-stately. Internally they rely on value (first arg) able to be undefined\n defaultSelectedKeys,\n (value) => {\n const _value = value === \"all\" ? \"all\" : [...value].map(String);\n onChange(_value);\n if (!autosave) overlayHandlerRef.current.close?.();\n },\n );\n\n const selectedTextValue = useMemo(() => {\n if (selectTextValue)\n return (\n selectTextValue(\n selectedKeys === \"all\" ? \"all\" : [...selectedKeys].map(String),\n ) ?? placeholderText\n );\n if (selectedKeys === \"all\") return \"All selected\";\n if (selectedKeys.size) return `${selectedKeys.size} selected`;\n return placeholderText;\n }, [selectTextValue, selectedKeys, placeholderText]);\n\n const fieldRef = useRef<HTMLDivElement>(null);\n const { labelProps, fieldProps, descriptionProps, errorMessageProps } =\n useField({\n label, // this is the label for the select box\n description: helperText,\n errorMessage: errorText,\n });\n\n return (\n <ReactAriaProvider\n values={[\n [RichSelectBoxContext, { autoFocus: true }],\n [DialogContext, { padding: autosave ? undefined : 0 }], // this is altering Popover's internal dialog padding to show the sticky save/close buttons. Ideally this could be avoided\n ]}\n >\n <div\n className={classNames(styles.selectContainer, {\n [styles.opacityOverlay]: disabled,\n })}\n onClick={onClick}\n >\n {label && (\n <>\n <ReactAriaLabel\n data-testid={[dataTestId, \"label\"].filter(Boolean).join(\"-\")}\n {...labelProps}\n onClick={() => {\n if (disabled) return;\n fieldRef.current?.focus();\n setInteractionModality(\"keyboard\"); // Show the focus ring so the user knows where focus went\n }}\n >\n <Box paddingX={1}>\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </ReactAriaLabel>\n </>\n )}\n <Popover\n ref={overlayHandlerRef}\n disabled={disabled}\n content={\n // this Box wrapper is to reapply the padding that was stripped from popover's dialog to show the sticky save/close buttons. Ideally this could be avoided\n <Box\n padding={autosave ? undefined : 5}\n dangerouslySetInlineStyle={\n autosave ? undefined : { __style: { paddingBottom: 0 } }\n }\n >\n <RichSelectBox\n autosave={autosave}\n selectedValues={selectedKeys}\n defaultSelectedValues={defaultSelectedKeys}\n onChange={(selected) => setSelectedKeys(new Set(selected))}\n {...richSelectBoxProps}\n accessibilityLabel={inputId}\n >\n {children}\n </RichSelectBox>\n </Box>\n }\n >\n <TapArea\n data-testid={dataTestId}\n disabled={disabled}\n onClick={onClick}\n rounding=\"md\"\n {...fieldProps}\n ref={fieldRef}\n >\n <div className={styles.selectWrapper} data-size={size}>\n <div\n className={classNames(\n styles.selectBox,\n styles.selectBoxCambio,\n {\n [styles.unselected]:\n !errorText &&\n selectedKeys !== \"all\" &&\n !selectedKeys.size,\n [styles.selected]:\n !errorText &&\n (selectedKeys === \"all\" || selectedKeys.size),\n [styles.selectErrorCambio]: errorText,\n },\n )}\n >\n {selectedTextValue}\n </div>\n <div className={styles.arrowIcon}>\n <svg\n focusable=\"false\"\n aria-hidden=\"true\"\n viewBox=\"0 0 24 24\"\n width={24}\n >\n <path\n fill={\n errorText ? ColorBaseDestructive700 : ColorBaseGray800\n }\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 </TapArea>\n </Popover>\n {(helperText || errorText) && (\n <Box paddingX={1}>\n <Typography\n size={100}\n color={errorText ? \"destructive-primary\" : \"gray700\"}\n {...(errorText ? errorMessageProps : descriptionProps)}\n >\n {errorText ? errorText : helperText}\n </Typography>\n </Box>\n )}\n </div>\n </ReactAriaProvider>\n );\n}\n\nexport default Object.assign(RichSelectList, {\n Section: RichSelectSection,\n Chip: RichSelectChip,\n RadioButton: RichSelectRadioButton,\n});\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/SelectList/SelectList.module.css\"; export default {\"selectContainer\":\"_selectContainer_1f379_1\",\"opacityOverlay\":\"_opacityOverlay_1f379_7\",\"selectWrapper\":\"_selectWrapper_1f379_11\",\"selectBox\":\"_selectBox_1f379_16\",\"selectBoxCambio\":\"_selectBoxCambio_1f379_32\",\"selectMouseFocusStyling\":\"_selectMouseFocusStyling_1f379_41\",\"unselected\":\"_unselected_1f379_46\",\"selected\":\"_selected_1f379_50\",\"arrowIcon\":\"_arrowIcon_1f379_54\",\"selectErrorCambio\":\"_selectErrorCambio_1f379_68\"}"]}
|
|
@@ -4,16 +4,13 @@ import {
|
|
|
4
4
|
} from "./KKADUD65.js";
|
|
5
5
|
import {
|
|
6
6
|
Box_default
|
|
7
|
-
} from "./
|
|
7
|
+
} from "./ZPY7QEBH.js";
|
|
8
8
|
import {
|
|
9
9
|
Typography_default
|
|
10
|
-
} from "./
|
|
10
|
+
} from "./3GNWH6C7.js";
|
|
11
11
|
import {
|
|
12
12
|
colors_module_default
|
|
13
13
|
} from "./B7PDT66P.js";
|
|
14
|
-
import {
|
|
15
|
-
useTheme
|
|
16
|
-
} from "./4GTNQPPD.js";
|
|
17
14
|
import {
|
|
18
15
|
useIsHydrated
|
|
19
16
|
} from "./JB65NEXK.js";
|
|
@@ -43,27 +40,10 @@ var RadioButton = ({
|
|
|
43
40
|
size = "md",
|
|
44
41
|
value
|
|
45
42
|
}) => {
|
|
46
|
-
const { themeName } = useTheme();
|
|
47
43
|
const isHydrated = useIsHydrated();
|
|
48
44
|
const disabled = !isHydrated || disabledProp;
|
|
49
45
|
const [isFocused, setIsFocused] = useState(false);
|
|
50
46
|
const { isFocusVisible } = useFocusVisible();
|
|
51
|
-
const classicStyles = classnames(RadioButton_module_default.background, RadioButton_module_default[size], {
|
|
52
|
-
[RadioButton_module_default.errorBorderColor]: error,
|
|
53
|
-
[RadioButton_module_default.borderColor]: !error,
|
|
54
|
-
[Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible || dangerouslyForceFocusStyles,
|
|
55
|
-
[RadioButton_module_default.mdCheckedBorder]: checked && size === "md",
|
|
56
|
-
[RadioButton_module_default.smCheckedBorder]: checked && size === "sm",
|
|
57
|
-
[RadioButton_module_default.neutralBorder]: !checked && size === "md"
|
|
58
|
-
});
|
|
59
|
-
const cambioStyles = classnames(
|
|
60
|
-
RadioButton_module_default.background,
|
|
61
|
-
error ? colors_module_default.cambioDestructive370BackgroundColor : colors_module_default.cambioGray370BackgroundColor,
|
|
62
|
-
RadioButton_module_default[size],
|
|
63
|
-
{
|
|
64
|
-
[Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible || dangerouslyForceFocusStyles
|
|
65
|
-
}
|
|
66
|
-
);
|
|
67
47
|
return /* @__PURE__ */ jsxs(
|
|
68
48
|
"label",
|
|
69
49
|
{
|
|
@@ -77,8 +57,20 @@ var RadioButton = ({
|
|
|
77
57
|
}
|
|
78
58
|
),
|
|
79
59
|
children: [
|
|
80
|
-
/* @__PURE__ */ jsx(
|
|
81
|
-
|
|
60
|
+
/* @__PURE__ */ jsx(
|
|
61
|
+
"div",
|
|
62
|
+
{
|
|
63
|
+
className: classnames(
|
|
64
|
+
RadioButton_module_default.background,
|
|
65
|
+
error ? colors_module_default.cambioDestructive370BackgroundColor : colors_module_default.cambioGray370BackgroundColor,
|
|
66
|
+
RadioButton_module_default[size],
|
|
67
|
+
{
|
|
68
|
+
[Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible || dangerouslyForceFocusStyles
|
|
69
|
+
}
|
|
70
|
+
)
|
|
71
|
+
}
|
|
72
|
+
),
|
|
73
|
+
checked && /* @__PURE__ */ jsx(
|
|
82
74
|
Box_default,
|
|
83
75
|
{
|
|
84
76
|
backgroundColor: error ? "destructive900" : "gray900",
|
|
@@ -137,4 +129,4 @@ var RadioButton_default = RadioButton;
|
|
|
137
129
|
export {
|
|
138
130
|
RadioButton_default
|
|
139
131
|
};
|
|
140
|
-
//# sourceMappingURL=
|
|
132
|
+
//# sourceMappingURL=J6JYJXK5.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/RadioButton/RadioButton.tsx","css-module:./RadioButton.module.css#css-module"],"sourcesContent":["import React, { type ReactElement, useState } from \"react\";\nimport classnames from \"classnames\";\n\nimport styles from \"./RadioButton.module.css\";\nimport focusStyles from \"../Focus.module.css\";\nimport Typography from \"../Typography/Typography\";\nimport useFocusVisible from \"../useFocusVisible\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport colorStyles from \"../colors/colors.module.css\";\nimport Box from \"../Box/Box\";\n\n/**\n * [RadioButton](https://cambly-syntax.vercel.app/?path=/docs/components-radiobutton--docs) is a radio button with accompanying text\n */\nconst RadioButton = ({\n checked = false,\n \"data-testid\": dataTestId,\n dangerouslyForceFocusStyles = false,\n disabled: disabledProp = false,\n error = false,\n id,\n label,\n name,\n onChange,\n size = \"md\",\n value,\n}: {\n /**\n * Whether or not the radio button is checked\n *\n * @defaultValue false\n */\n checked?: boolean;\n /**\n * Test id for the radio button\n */\n \"data-testid\"?: string;\n /**\n * Whether or not the radio button is disabled\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * Whether to show error color schema\n *\n * @defaultValue false\n */\n error?: boolean;\n /**\n * Id for the the radio button\n */\n id?: string;\n /**\n * Value to show end user\n */\n label: string;\n /**\n * The name of the grouping the radio buttons are in\n */\n name: string;\n /**\n * The callback to be called when the radio button is clicked\n */\n onChange: React.ChangeEventHandler<HTMLInputElement>;\n /**\n * Size of the components\n *\n * * `sm`: 16px\n * * `md`: 24px\n *\n * @defaultValue \"md\"\n */\n size?: \"sm\" | \"md\";\n /**\n * Value of the selected radio option\n */\n value: string | number;\n /** forces focus ring styling */\n dangerouslyForceFocusStyles?: boolean;\n}): ReactElement => {\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const [isFocused, setIsFocused] = useState(false);\n const { isFocusVisible } = useFocusVisible();\n\n return (\n <label\n className={classnames(\n styles.radioBaseContainer,\n styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n {\n [styles.disabled]: disabled,\n [styles.smBase]: size === \"sm\",\n [styles.mdBase]: size === \"md\",\n },\n )}\n >\n <div\n className={classnames(\n styles.background,\n error\n ? colorStyles.cambioDestructive370BackgroundColor\n : colorStyles.cambioGray370BackgroundColor,\n styles[size],\n {\n [focusStyles.accessibilityOutlineFocus]:\n (isFocused && isFocusVisible) || dangerouslyForceFocusStyles,\n },\n )}\n />\n {checked && (\n <Box\n backgroundColor={error ? \"destructive900\" : \"gray900\"}\n width={size === \"md\" ? 12 : 8}\n height={size === \"md\" ? 12 : 8}\n position=\"absolute\"\n rounding=\"full\"\n dangerouslySetInlineStyle={{\n __style: {\n left: size === \"md\" ? 6 : 4,\n },\n }}\n />\n )}\n <input\n data-testid={dataTestId}\n type=\"radio\"\n id={id}\n name={name}\n className={classnames(\n styles.radioStyleOverride,\n styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n {\n [styles.smOverride]: size === \"sm\",\n [styles.mdOverride]: size === \"md\",\n },\n )}\n checked={checked}\n onChange={onChange}\n disabled={disabled}\n value={value}\n onFocus={() => {\n setIsFocused(true);\n }}\n onBlur={() => {\n setIsFocused(false);\n }}\n />\n {label && (\n <Typography\n size={size === \"md\" ? 200 : 100}\n color={error ? \"destructive-primary\" : \"gray900\"}\n >\n {label}\n </Typography>\n )}\n </label>\n );\n};\n\nexport default RadioButton;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/RadioButton/RadioButton.module.css\"; export default {\"radioBaseContainer\":\"_radioBaseContainer_6h2zg_1\",\"disabled\":\"_disabled_6h2zg_9\",\"cursorDisabled\":\"_cursorDisabled_6h2zg_13\",\"cursorEnabled\":\"_cursorEnabled_6h2zg_17\",\"smBase\":\"_smBase_6h2zg_21\",\"mdBase\":\"_mdBase_6h2zg_25\",\"radioStyleOverride\":\"_radioStyleOverride_6h2zg_29\",\"smOverride\":\"_smOverride_6h2zg_34\",\"mdOverride\":\"_mdOverride_6h2zg_39\",\"background\":\"_background_6h2zg_44\",\"sm\":\"_sm_6h2zg_21\",\"md\":\"_md_6h2zg_25\",\"neutralBorder\":\"_neutralBorder_6h2zg_61\",\"smCheckedBorder\":\"_smCheckedBorder_6h2zg_65\",\"mdCheckedBorder\":\"_mdCheckedBorder_6h2zg_69\",\"errorBorderColor\":\"_errorBorderColor_6h2zg_73\",\"borderColor\":\"_borderColor_6h2zg_77\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,SAAmC,gBAAgB;AACnD,OAAO,gBAAgB;;;ACD+E,IAAO,6BAAQ,EAAC,sBAAqB,+BAA8B,YAAW,qBAAoB,kBAAiB,4BAA2B,iBAAgB,2BAA0B,UAAS,oBAAmB,UAAS,oBAAmB,sBAAqB,gCAA+B,cAAa,wBAAuB,cAAa,wBAAuB,cAAa,wBAAuB,MAAK,gBAAe,MAAK,gBAAe,iBAAgB,2BAA0B,mBAAkB,6BAA4B,mBAAkB,6BAA4B,oBAAmB,8BAA6B,eAAc,wBAAuB;;;ADuFrvB,SAWE,KAXF;AAzEJ,IAAM,cAAc,CAAC;AAAA,EACnB,UAAU;AAAA,EACV,eAAe;AAAA,EACf,8BAA8B;AAAA,EAC9B,UAAU,eAAe;AAAA,EACzB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AACF,MAsDoB;AAClB,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,EAAE,eAAe,IAAI,gBAAgB;AAE3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,2BAAO;AAAA,QACP,2BAAO,SAAS,WAAW,aAAa,WAAW;AAAA,QACnD;AAAA,UACE,CAAC,2BAAO,QAAQ,GAAG;AAAA,UACnB,CAAC,2BAAO,MAAM,GAAG,SAAS;AAAA,UAC1B,CAAC,2BAAO,MAAM,GAAG,SAAS;AAAA,QAC5B;AAAA,MACF;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT,2BAAO;AAAA,cACP,QACI,sBAAY,sCACZ,sBAAY;AAAA,cAChB,2BAAO,IAAI;AAAA,cACX;AAAA,gBACE,CAAC,qBAAY,yBAAyB,GACnC,aAAa,kBAAmB;AAAA,cACrC;AAAA,YACF;AAAA;AAAA,QACF;AAAA,QACC,WACC;AAAA,UAAC;AAAA;AAAA,YACC,iBAAiB,QAAQ,mBAAmB;AAAA,YAC5C,OAAO,SAAS,OAAO,KAAK;AAAA,YAC5B,QAAQ,SAAS,OAAO,KAAK;AAAA,YAC7B,UAAS;AAAA,YACT,UAAS;AAAA,YACT,2BAA2B;AAAA,cACzB,SAAS;AAAA,gBACP,MAAM,SAAS,OAAO,IAAI;AAAA,cAC5B;AAAA,YACF;AAAA;AAAA,QACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC,eAAa;AAAA,YACb,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YACA,WAAW;AAAA,cACT,2BAAO;AAAA,cACP,2BAAO,SAAS,WAAW,aAAa,WAAW;AAAA,cACnD;AAAA,gBACE,CAAC,2BAAO,UAAU,GAAG,SAAS;AAAA,gBAC9B,CAAC,2BAAO,UAAU,GAAG,SAAS;AAAA,cAChC;AAAA,YACF;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAS,MAAM;AACb,2BAAa,IAAI;AAAA,YACnB;AAAA,YACA,QAAQ,MAAM;AACZ,2BAAa,KAAK;AAAA,YACpB;AAAA;AAAA,QACF;AAAA,QACC,SACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,SAAS,OAAO,MAAM;AAAA,YAC5B,OAAO,QAAQ,wBAAwB;AAAA,YAEtC;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEA,IAAO,sBAAQ;","names":[]}
|