@cambly/syntax-core 10.22.0 → 10.24.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 +4 -4
- package/dist/Avatar/Avatar.d.ts +1 -1
- package/dist/Avatar/Avatar.js +3 -3
- package/dist/AvatarGroup/AvatarGroup.cjs +3 -3
- package/dist/AvatarGroup/AvatarGroup.js +2 -2
- package/dist/Badge/Badge.cjs +3 -3
- package/dist/Badge/Badge.d.ts +1 -1
- package/dist/Badge/Badge.js +2 -2
- package/dist/Box/Box.cjs +2 -2
- package/dist/Box/Box.d.ts +1 -1
- package/dist/Box/Box.js +1 -1
- package/dist/Button/Button.cjs +3 -3
- package/dist/Button/Button.js +2 -2
- package/dist/ButtonGroup/ButtonGroup.d.ts +1 -1
- package/dist/Card/Card.cjs +3 -3
- package/dist/Card/Card.js +2 -2
- package/dist/Checkbox/Checkbox.d.ts +1 -1
- package/dist/Chip/Chip.cjs +3 -3
- package/dist/Chip/Chip.js +2 -2
- package/dist/Dialog/ModalDialog.cjs +3 -3
- package/dist/Dialog/ModalDialog.js +2 -2
- package/dist/Heading/Heading.d.ts +2 -2
- package/dist/LinkButton/LinkButton.cjs +2 -2
- package/dist/LinkButton/LinkButton.js +1 -1
- package/dist/Modal/Layer.cjs +3 -3
- package/dist/Modal/Layer.js +2 -2
- package/dist/Modal/Modal.cjs +4 -4
- package/dist/Modal/Modal.js +3 -3
- package/dist/Popover/Popover.cjs +4 -4
- package/dist/Popover/Popover.js +3 -3
- package/dist/RadioButton/RadioButton.cjs +3 -3
- package/dist/RadioButton/RadioButton.d.ts +1 -1
- package/dist/RadioButton/RadioButton.js +2 -2
- package/dist/RichSelect/RichSelectBox.cjs +8 -8
- package/dist/RichSelect/RichSelectBox.d.ts +1 -1
- package/dist/RichSelect/RichSelectBox.js +7 -7
- package/dist/RichSelect/RichSelectChip.cjs +4 -4
- package/dist/RichSelect/RichSelectChip.js +3 -3
- package/dist/RichSelect/RichSelectList.cjs +12 -12
- package/dist/RichSelect/RichSelectList.css +16 -19
- package/dist/RichSelect/RichSelectList.css.map +1 -1
- package/dist/RichSelect/RichSelectList.d.ts +1 -1
- package/dist/RichSelect/RichSelectList.js +11 -11
- package/dist/RichSelect/RichSelectRadioButton.cjs +4 -4
- package/dist/RichSelect/RichSelectRadioButton.d.ts +1 -1
- package/dist/RichSelect/RichSelectRadioButton.js +3 -3
- package/dist/SelectList/SelectList.cjs +4 -4
- package/dist/SelectList/SelectList.css +16 -19
- package/dist/SelectList/SelectList.css.map +1 -1
- package/dist/SelectList/SelectList.js +3 -3
- package/dist/TapArea/TapArea.d.ts +1 -1
- package/dist/TextArea/TextArea.cjs +3 -3
- package/dist/TextArea/TextArea.js +2 -2
- package/dist/TextField/TextField.cjs +3 -3
- package/dist/TextField/TextField.js +2 -2
- package/dist/Typography/Typography.d.ts +5 -5
- package/dist/__chunks/{ORCNBIKY.cjs → 2R3NHAWW.cjs} +1 -1
- package/dist/__chunks/{ORCNBIKY.cjs.map → 2R3NHAWW.cjs.map} +1 -1
- package/dist/__chunks/{WJ4USTG5.cjs → 2TLKWIYC.cjs} +3 -3
- package/dist/__chunks/{BKKGEDVD.js → 3LO2QLOH.js} +2 -2
- package/dist/__chunks/{PRPV6JFS.cjs → 4MLT3AHK.cjs} +3 -3
- package/dist/__chunks/{H6TSTAYY.cjs → 4TY5KFRY.cjs} +3 -3
- package/dist/__chunks/{DNC754CR.js → 53T425YL.js} +2 -2
- package/dist/__chunks/{SP7KCX5V.js → 5QPFD35S.js} +2 -2
- package/dist/__chunks/{4CRAIBTO.js → 6EKM3QTW.js} +5 -5
- package/dist/__chunks/{XXIGTXV7.cjs → 7B7TOXIF.cjs} +21 -25
- package/dist/__chunks/7B7TOXIF.cjs.map +1 -0
- package/dist/__chunks/{HQMHSXLB.js → 7XCKMUYZ.js} +2 -2
- package/dist/__chunks/{NI6XOJ3G.js → AM27BYFE.js} +2 -2
- package/dist/__chunks/{VAUSDMLF.js → B3SQDLKQ.js} +1 -1
- package/dist/__chunks/{VAUSDMLF.js.map → B3SQDLKQ.js.map} +1 -1
- package/dist/__chunks/{2ME3BD6K.js → C2O2DNFT.js} +4 -4
- package/dist/__chunks/{2ME3BD6K.js.map → C2O2DNFT.js.map} +1 -1
- package/dist/__chunks/{4BFY734C.cjs → E4LISCR7.cjs} +1 -1
- package/dist/__chunks/E4LISCR7.cjs.map +1 -0
- package/dist/__chunks/{BJAWVRMM.js → F7MTPNJ5.js} +2 -2
- package/dist/__chunks/{EEUFQAUZ.js → G4L4P5KD.js} +2 -2
- package/dist/__chunks/{VHZFF3Y7.js → H2VCDVLG.js} +2 -2
- package/dist/__chunks/{B6FBYOX3.cjs → I75WZ7AV.cjs} +3 -3
- package/dist/__chunks/{PDPWTB6M.cjs → IXDYGNLN.cjs} +4 -4
- package/dist/__chunks/IXDYGNLN.cjs.map +1 -0
- package/dist/__chunks/{7BKNCKG6.cjs → K4LTJ5GH.cjs} +11 -11
- package/dist/__chunks/{WX4R325A.js → KITXUOU4.js} +3 -3
- package/dist/__chunks/KITXUOU4.js.map +1 -0
- package/dist/__chunks/{HUEEJIK6.js → KWRU2RKT.js} +2 -2
- package/dist/__chunks/{3J6UY4O7.cjs → L5FISA2U.cjs} +3 -3
- package/dist/__chunks/{T2TWWVDB.js → LUGWXC6Z.js} +2 -2
- package/dist/__chunks/{2UPJMKTX.cjs → MKGPWRAB.cjs} +4 -4
- package/dist/__chunks/{2MINLLCQ.js → MOU24MJO.js} +2 -2
- package/dist/__chunks/{D5JLOEQ3.cjs → MQ7FU53W.cjs} +5 -5
- package/dist/__chunks/{4OYTNKMT.cjs → OV5U4YJN.cjs} +3 -3
- package/dist/__chunks/{QJYYEWMS.cjs → OVXHL32N.cjs} +3 -3
- package/dist/__chunks/{URRKNNYF.js → PO5IE5IC.js} +5 -6
- package/dist/__chunks/PO5IE5IC.js.map +1 -0
- package/dist/__chunks/{FITLZVLN.js → QD2ZKJLS.js} +12 -16
- package/dist/__chunks/QD2ZKJLS.js.map +1 -0
- package/dist/__chunks/{LWZJ2KZP.js → RKIU3AMB.js} +3 -3
- package/dist/__chunks/{BW7P2SK4.cjs → RQBPUVVA.cjs} +8 -9
- package/dist/__chunks/RQBPUVVA.cjs.map +1 -0
- package/dist/__chunks/{AQ4N3L6H.js → TAZE73O2.js} +3 -3
- package/dist/__chunks/{EDBOQDEI.cjs → TCZBK2P5.cjs} +4 -4
- package/dist/__chunks/TCZBK2P5.cjs.map +1 -0
- package/dist/__chunks/{PM4UMJWM.js → U6PVR4JE.js} +2 -2
- package/dist/__chunks/{D76LWB72.cjs → UEQKS2FD.cjs} +3 -3
- package/dist/__chunks/{J65TCZUM.cjs → VRVOFKLI.cjs} +8 -8
- package/dist/__chunks/{MNOQHQWW.cjs → W35D2UIC.cjs} +5 -5
- package/dist/__chunks/{JWWKDZYV.cjs → WZZQUJZF.cjs} +13 -13
- package/dist/__chunks/{22OMICOW.js → XQM7YZ26.js} +1 -1
- package/dist/__chunks/XQM7YZ26.js.map +1 -0
- package/dist/__chunks/{YZYWUADR.cjs → ZYCAP5AY.cjs} +3 -3
- package/dist/index.cjs +22 -22
- package/dist/index.css +16 -19
- package/dist/index.css.map +1 -1
- package/dist/index.js +21 -21
- package/package.json +1 -1
- package/dist/__chunks/22OMICOW.js.map +0 -1
- package/dist/__chunks/4BFY734C.cjs.map +0 -1
- package/dist/__chunks/BW7P2SK4.cjs.map +0 -1
- package/dist/__chunks/EDBOQDEI.cjs.map +0 -1
- package/dist/__chunks/FITLZVLN.js.map +0 -1
- package/dist/__chunks/PDPWTB6M.cjs.map +0 -1
- package/dist/__chunks/URRKNNYF.js.map +0 -1
- package/dist/__chunks/WX4R325A.js.map +0 -1
- package/dist/__chunks/XXIGTXV7.cjs.map +0 -1
- /package/dist/__chunks/{WJ4USTG5.cjs.map → 2TLKWIYC.cjs.map} +0 -0
- /package/dist/__chunks/{BKKGEDVD.js.map → 3LO2QLOH.js.map} +0 -0
- /package/dist/__chunks/{PRPV6JFS.cjs.map → 4MLT3AHK.cjs.map} +0 -0
- /package/dist/__chunks/{H6TSTAYY.cjs.map → 4TY5KFRY.cjs.map} +0 -0
- /package/dist/__chunks/{DNC754CR.js.map → 53T425YL.js.map} +0 -0
- /package/dist/__chunks/{SP7KCX5V.js.map → 5QPFD35S.js.map} +0 -0
- /package/dist/__chunks/{4CRAIBTO.js.map → 6EKM3QTW.js.map} +0 -0
- /package/dist/__chunks/{HQMHSXLB.js.map → 7XCKMUYZ.js.map} +0 -0
- /package/dist/__chunks/{NI6XOJ3G.js.map → AM27BYFE.js.map} +0 -0
- /package/dist/__chunks/{BJAWVRMM.js.map → F7MTPNJ5.js.map} +0 -0
- /package/dist/__chunks/{EEUFQAUZ.js.map → G4L4P5KD.js.map} +0 -0
- /package/dist/__chunks/{VHZFF3Y7.js.map → H2VCDVLG.js.map} +0 -0
- /package/dist/__chunks/{B6FBYOX3.cjs.map → I75WZ7AV.cjs.map} +0 -0
- /package/dist/__chunks/{7BKNCKG6.cjs.map → K4LTJ5GH.cjs.map} +0 -0
- /package/dist/__chunks/{HUEEJIK6.js.map → KWRU2RKT.js.map} +0 -0
- /package/dist/__chunks/{3J6UY4O7.cjs.map → L5FISA2U.cjs.map} +0 -0
- /package/dist/__chunks/{T2TWWVDB.js.map → LUGWXC6Z.js.map} +0 -0
- /package/dist/__chunks/{2UPJMKTX.cjs.map → MKGPWRAB.cjs.map} +0 -0
- /package/dist/__chunks/{2MINLLCQ.js.map → MOU24MJO.js.map} +0 -0
- /package/dist/__chunks/{D5JLOEQ3.cjs.map → MQ7FU53W.cjs.map} +0 -0
- /package/dist/__chunks/{4OYTNKMT.cjs.map → OV5U4YJN.cjs.map} +0 -0
- /package/dist/__chunks/{QJYYEWMS.cjs.map → OVXHL32N.cjs.map} +0 -0
- /package/dist/__chunks/{LWZJ2KZP.js.map → RKIU3AMB.js.map} +0 -0
- /package/dist/__chunks/{AQ4N3L6H.js.map → TAZE73O2.js.map} +0 -0
- /package/dist/__chunks/{PM4UMJWM.js.map → U6PVR4JE.js.map} +0 -0
- /package/dist/__chunks/{D76LWB72.cjs.map → UEQKS2FD.cjs.map} +0 -0
- /package/dist/__chunks/{J65TCZUM.cjs.map → VRVOFKLI.cjs.map} +0 -0
- /package/dist/__chunks/{MNOQHQWW.cjs.map → W35D2UIC.cjs.map} +0 -0
- /package/dist/__chunks/{JWWKDZYV.cjs.map → WZZQUJZF.cjs.map} +0 -0
- /package/dist/__chunks/{YZYWUADR.cjs.map → ZYCAP5AY.cjs.map} +0 -0
|
@@ -12,13 +12,13 @@ declare const Typography: React.ForwardRefExoticComponent<{
|
|
|
12
12
|
*
|
|
13
13
|
* @defaultValue "start"
|
|
14
14
|
*/
|
|
15
|
-
align?: "
|
|
15
|
+
align?: "start" | "end" | "forceLeft" | "center" | "forceRight" | undefined;
|
|
16
16
|
/**
|
|
17
17
|
* DOM element to render as.
|
|
18
18
|
*
|
|
19
19
|
* @defaultValue "div"
|
|
20
20
|
*/
|
|
21
|
-
as?: "
|
|
21
|
+
as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div" | undefined;
|
|
22
22
|
/**
|
|
23
23
|
* The text to be rendered
|
|
24
24
|
*/
|
|
@@ -30,7 +30,7 @@ declare const Typography: React.ForwardRefExoticComponent<{
|
|
|
30
30
|
*
|
|
31
31
|
* @defaultValue "gray900"
|
|
32
32
|
*/
|
|
33
|
-
color?: "
|
|
33
|
+
color?: "gray900" | "primary" | "destructive-primary" | "success" | "gray700" | "white" | "inherit" | "destructive-darkBackground" | "success-darkBackground" | undefined;
|
|
34
34
|
/**
|
|
35
35
|
* Test id for the text
|
|
36
36
|
*/
|
|
@@ -97,7 +97,7 @@ declare const Typography: React.ForwardRefExoticComponent<{
|
|
|
97
97
|
*
|
|
98
98
|
* @defaultValue 200
|
|
99
99
|
*/
|
|
100
|
-
size?:
|
|
100
|
+
size?: 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100 | 100 | 200 | 300 | undefined;
|
|
101
101
|
/**
|
|
102
102
|
* The tooltip to be displayed when the user hovers the text
|
|
103
103
|
*/
|
|
@@ -133,7 +133,7 @@ declare const Typography: React.ForwardRefExoticComponent<{
|
|
|
133
133
|
*
|
|
134
134
|
* @defaultValue "regular"
|
|
135
135
|
*/
|
|
136
|
-
weight?: "
|
|
136
|
+
weight?: "regular" | "interactive" | "medium" | "semiBold" | "bold" | "heavy" | undefined;
|
|
137
137
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
138
138
|
|
|
139
139
|
export { Typography as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"names":[],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB","sourcesContent":["/**\n * Do not edit directly\n * Generated on
|
|
1
|
+
{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"names":[],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB","sourcesContent":["/**\n * Do not edit directly\n * Generated on Mon, 25 Mar 2024 13:38:37 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _I75WZ7AVcjs = require('./I75WZ7AV.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
var _RYUXG4AScjs = require('./RYUXG4AS.cjs');
|
|
@@ -16,7 +16,7 @@ var _jsxruntime = require('react/jsx-runtime');
|
|
|
16
16
|
var RichSelectChip_default = _react.forwardRef.call(void 0,
|
|
17
17
|
function RichSelectChip(props, ref) {
|
|
18
18
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RYUXG4AScjs.RichSelectItem_default, _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, props), { ref, children: ({ isSelected, isFocusVisible, isDisabled }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
19
|
-
|
|
19
|
+
_I75WZ7AVcjs.Chip_default,
|
|
20
20
|
{
|
|
21
21
|
text: props.label,
|
|
22
22
|
selected: isSelected,
|
|
@@ -31,4 +31,4 @@ var RichSelectChip_default = _react.forwardRef.call(void 0,
|
|
|
31
31
|
|
|
32
32
|
|
|
33
33
|
exports.RichSelectChip_default = RichSelectChip_default;
|
|
34
|
-
//# sourceMappingURL=
|
|
34
|
+
//# sourceMappingURL=2TLKWIYC.cjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Box_default
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./XQM7YZ26.js";
|
|
5
5
|
import {
|
|
6
6
|
Typography_default
|
|
7
7
|
} from "./HINMIM2W.js";
|
|
@@ -101,4 +101,4 @@ var TextArea_default = TextArea;
|
|
|
101
101
|
export {
|
|
102
102
|
TextArea_default
|
|
103
103
|
};
|
|
104
|
-
//# sourceMappingURL=
|
|
104
|
+
//# sourceMappingURL=3LO2QLOH.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _E4LISCR7cjs = require('./E4LISCR7.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
|
|
@@ -25,7 +25,7 @@ function AvatarGroup({
|
|
|
25
25
|
const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
|
|
26
26
|
const parsedSize = themeName === "cambio" && size === "xl" ? "lg" : size;
|
|
27
27
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AvatarGroupContext.Provider, { value: { size: parsedSize, orientation }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
28
|
-
|
|
28
|
+
_E4LISCR7cjs.Box_default,
|
|
29
29
|
{
|
|
30
30
|
display: "flex",
|
|
31
31
|
justifyContent: orientation === "standard" ? "start" : "end",
|
|
@@ -44,4 +44,4 @@ AvatarGroup.displayName = "AvatarGroup";
|
|
|
44
44
|
|
|
45
45
|
|
|
46
46
|
exports.useAvatarGroup = useAvatarGroup; exports.AvatarGroup = AvatarGroup;
|
|
47
|
-
//# sourceMappingURL=
|
|
47
|
+
//# sourceMappingURL=4MLT3AHK.cjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _E4LISCR7cjs = require('./E4LISCR7.cjs');
|
|
5
5
|
|
|
6
6
|
// src/Modal/Layer.tsx
|
|
7
7
|
var _reactdom = require('react-dom');
|
|
@@ -12,7 +12,7 @@ function Layer({
|
|
|
12
12
|
}) {
|
|
13
13
|
return typeof document !== "undefined" ? _reactdom.createPortal.call(void 0,
|
|
14
14
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
15
|
-
|
|
15
|
+
_E4LISCR7cjs.Box_default,
|
|
16
16
|
{
|
|
17
17
|
"data-testid": "syntax-layer",
|
|
18
18
|
position: "fixed",
|
|
@@ -29,4 +29,4 @@ function Layer({
|
|
|
29
29
|
|
|
30
30
|
|
|
31
31
|
exports.Layer = Layer;
|
|
32
|
-
//# sourceMappingURL=
|
|
32
|
+
//# sourceMappingURL=4TY5KFRY.cjs.map
|
|
@@ -13,7 +13,7 @@ import {
|
|
|
13
13
|
} from "./AVREYFSM.js";
|
|
14
14
|
import {
|
|
15
15
|
Box_default
|
|
16
|
-
} from "./
|
|
16
|
+
} from "./XQM7YZ26.js";
|
|
17
17
|
import {
|
|
18
18
|
OverlayVisibility
|
|
19
19
|
} from "./E5KMIBEU.js";
|
|
@@ -157,4 +157,4 @@ export {
|
|
|
157
157
|
AriaModal,
|
|
158
158
|
ModalDialog_default
|
|
159
159
|
};
|
|
160
|
-
//# sourceMappingURL=
|
|
160
|
+
//# sourceMappingURL=53T425YL.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Box_default
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./XQM7YZ26.js";
|
|
5
5
|
import {
|
|
6
6
|
Typography_default
|
|
7
7
|
} from "./HINMIM2W.js";
|
|
@@ -111,4 +111,4 @@ var Badge_default = Badge;
|
|
|
111
111
|
export {
|
|
112
112
|
Badge_default
|
|
113
113
|
};
|
|
114
|
-
//# sourceMappingURL=
|
|
114
|
+
//# sourceMappingURL=5QPFD35S.js.map
|
|
@@ -4,26 +4,26 @@ import {
|
|
|
4
4
|
} from "./COW4SDSF.js";
|
|
5
5
|
import {
|
|
6
6
|
Button_default
|
|
7
|
-
} from "./
|
|
7
|
+
} from "./KITXUOU4.js";
|
|
8
8
|
import {
|
|
9
9
|
Divider
|
|
10
10
|
} from "./JUPRT4OU.js";
|
|
11
11
|
import {
|
|
12
12
|
RichSelectChip_default
|
|
13
|
-
} from "./
|
|
13
|
+
} from "./AM27BYFE.js";
|
|
14
14
|
import {
|
|
15
15
|
RichSelectSection_default
|
|
16
16
|
} from "./4NSYLHIG.js";
|
|
17
17
|
import {
|
|
18
18
|
RichSelectRadioButton_default
|
|
19
|
-
} from "./
|
|
19
|
+
} from "./KWRU2RKT.js";
|
|
20
20
|
import {
|
|
21
21
|
RichSelectItemContext,
|
|
22
22
|
RichSelect_module_default
|
|
23
23
|
} from "./ODMJANSX.js";
|
|
24
24
|
import {
|
|
25
25
|
Box_default
|
|
26
|
-
} from "./
|
|
26
|
+
} from "./XQM7YZ26.js";
|
|
27
27
|
|
|
28
28
|
// src/RichSelect/RichSelectBox.tsx
|
|
29
29
|
import {
|
|
@@ -208,4 +208,4 @@ export {
|
|
|
208
208
|
RichSelectBoxContext,
|
|
209
209
|
RichSelectBox_default
|
|
210
210
|
};
|
|
211
|
-
//# sourceMappingURL=
|
|
211
|
+
//# sourceMappingURL=6EKM3QTW.js.map
|
|
@@ -3,13 +3,13 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _WZZQUJZFcjs = require('./WZZQUJZF.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _2TLKWIYCcjs = require('./2TLKWIYC.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
|
-
var
|
|
12
|
+
var _L5FISA2Ucjs = require('./L5FISA2U.cjs');
|
|
13
13
|
|
|
14
14
|
|
|
15
15
|
var _RINTHGJZcjs = require('./RINTHGJZ.cjs');
|
|
@@ -19,16 +19,16 @@ var _UKLQ64N7cjs = require('./UKLQ64N7.cjs');
|
|
|
19
19
|
|
|
20
20
|
|
|
21
21
|
|
|
22
|
-
var
|
|
22
|
+
var _2R3NHAWWcjs = require('./2R3NHAWW.cjs');
|
|
23
23
|
|
|
24
24
|
|
|
25
25
|
var _J3ES6ZT6cjs = require('./J3ES6ZT6.cjs');
|
|
26
26
|
|
|
27
27
|
|
|
28
|
-
var
|
|
28
|
+
var _OVXHL32Ncjs = require('./OVXHL32N.cjs');
|
|
29
29
|
|
|
30
30
|
|
|
31
|
-
var
|
|
31
|
+
var _E4LISCR7cjs = require('./E4LISCR7.cjs');
|
|
32
32
|
|
|
33
33
|
|
|
34
34
|
var _TJN7NBWUcjs = require('./TJN7NBWU.cjs');
|
|
@@ -59,7 +59,7 @@ var _utils = require('@react-stately/utils');
|
|
|
59
59
|
var _interactions = require('@react-aria/interactions');
|
|
60
60
|
|
|
61
61
|
// css-module:../SelectList/SelectList.module.css#css-module
|
|
62
|
-
var SelectList_module_default = { "selectContainer": "
|
|
62
|
+
var SelectList_module_default = { "selectContainer": "_selectContainer_dwmnw_1", "opacityOverlay": "_opacityOverlay_dwmnw_7", "selectWrapper": "_selectWrapper_dwmnw_11", "selectBox": "_selectBox_dwmnw_16", "selectBoxClassic": "_selectBoxClassic_dwmnw_32", "selectBoxCambio": "_selectBoxCambio_dwmnw_37", "selectMouseFocusStyling": "_selectMouseFocusStyling_dwmnw_46", "unselected": "_unselected_dwmnw_51", "selected": "_selected_dwmnw_55", "arrowIcon": "_arrowIcon_dwmnw_59", "sm": "_sm_dwmnw_73", "md": "_md_dwmnw_79", "lg": "_lg_dwmnw_85", "selectError": "_selectError_dwmnw_91", "selectErrorCambio": "_selectErrorCambio_dwmnw_97" };
|
|
63
63
|
|
|
64
64
|
// src/RichSelect/RichSelectList.tsx
|
|
65
65
|
var _reactaria = require('react-aria');
|
|
@@ -111,11 +111,11 @@ function RichSelectList(props) {
|
|
|
111
111
|
const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
|
|
112
112
|
const overlayHandlerRef = _react.useRef.call(void 0, {});
|
|
113
113
|
const selectedKeysProp = _react.useMemo.call(void 0,
|
|
114
|
-
() =>
|
|
114
|
+
() => _WZZQUJZFcjs.convertSelection.call(void 0, selectedValuesProp),
|
|
115
115
|
[selectedValuesProp]
|
|
116
116
|
);
|
|
117
117
|
const defaultSelectedKeys = _react.useMemo.call(void 0,
|
|
118
|
-
() =>
|
|
118
|
+
() => _WZZQUJZFcjs.convertSelection.call(void 0, defaultSelectedValuesProp, /* @__PURE__ */ new Set()),
|
|
119
119
|
[defaultSelectedValuesProp]
|
|
120
120
|
);
|
|
121
121
|
const [selectedKeys, setSelectedKeys] = _utils.useControlledState.call(void 0,
|
|
@@ -153,7 +153,7 @@ function RichSelectList(props) {
|
|
|
153
153
|
_reactariacomponents.Provider,
|
|
154
154
|
{
|
|
155
155
|
values: [
|
|
156
|
-
[
|
|
156
|
+
[_WZZQUJZFcjs.RichSelectBoxContext, { autoFocus: true }],
|
|
157
157
|
[_RINTHGJZcjs.DialogContext, { padding: autosave ? void 0 : 0 }]
|
|
158
158
|
// this is altering Popover's internal dialog padding to show the sticky save/close buttons. Ideally this could be avoided
|
|
159
159
|
],
|
|
@@ -161,18 +161,14 @@ function RichSelectList(props) {
|
|
|
161
161
|
"div",
|
|
162
162
|
{
|
|
163
163
|
className: _classnames2.default.call(void 0, SelectList_module_default.selectContainer, {
|
|
164
|
-
[SelectList_module_default.opacityOverlay]: disabled
|
|
165
|
-
[SelectList_module_default.selectContainerCambio]: themeName === "cambio"
|
|
164
|
+
[SelectList_module_default.opacityOverlay]: disabled
|
|
166
165
|
}),
|
|
167
166
|
onClick,
|
|
168
167
|
children: [
|
|
169
168
|
label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
170
169
|
_reactariacomponents.Label,
|
|
171
170
|
_X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
|
|
172
|
-
"data-testid": [dataTestId, "label"].filter(Boolean).join("-")
|
|
173
|
-
className: _classnames2.default.call(void 0,
|
|
174
|
-
themeName === "cambio" && SelectList_module_default.labelCambio
|
|
175
|
-
)
|
|
171
|
+
"data-testid": [dataTestId, "label"].filter(Boolean).join("-")
|
|
176
172
|
}, labelProps), {
|
|
177
173
|
onClick: () => {
|
|
178
174
|
var _a2;
|
|
@@ -181,23 +177,23 @@ function RichSelectList(props) {
|
|
|
181
177
|
(_a2 = fieldRef.current) == null ? void 0 : _a2.focus();
|
|
182
178
|
_interactions.setInteractionModality.call(void 0, "keyboard");
|
|
183
179
|
},
|
|
184
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
180
|
+
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _E4LISCR7cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _TJN7NBWUcjs.Typography_default, { size: 100, color: "gray700", children: label }) })
|
|
185
181
|
})
|
|
186
182
|
) }),
|
|
187
183
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
188
|
-
|
|
184
|
+
_L5FISA2Ucjs.Popover_default,
|
|
189
185
|
{
|
|
190
186
|
ref: overlayHandlerRef,
|
|
191
187
|
disabled,
|
|
192
188
|
content: (
|
|
193
189
|
// 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
|
|
194
190
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
195
|
-
|
|
191
|
+
_E4LISCR7cjs.Box_default,
|
|
196
192
|
{
|
|
197
193
|
padding: autosave ? void 0 : 5,
|
|
198
194
|
dangerouslySetInlineStyle: autosave ? void 0 : { __style: { paddingBottom: 0 } },
|
|
199
195
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
200
|
-
|
|
196
|
+
_WZZQUJZFcjs.RichSelectBox_default,
|
|
201
197
|
_X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
|
|
202
198
|
autosave,
|
|
203
199
|
selectedValues: selectedKeys,
|
|
@@ -247,7 +243,7 @@ function RichSelectList(props) {
|
|
|
247
243
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
248
244
|
"path",
|
|
249
245
|
{
|
|
250
|
-
fill: errorText ?
|
|
246
|
+
fill: errorText ? _2R3NHAWWcjs.ColorBaseDestructive700 : _2R3NHAWWcjs.ColorBaseGray800,
|
|
251
247
|
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"
|
|
252
248
|
}
|
|
253
249
|
)
|
|
@@ -258,7 +254,7 @@ function RichSelectList(props) {
|
|
|
258
254
|
)
|
|
259
255
|
}
|
|
260
256
|
),
|
|
261
|
-
(helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
257
|
+
(helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _E4LISCR7cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
262
258
|
_TJN7NBWUcjs.Typography_default,
|
|
263
259
|
_X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
|
|
264
260
|
size: 100,
|
|
@@ -275,11 +271,11 @@ function RichSelectList(props) {
|
|
|
275
271
|
}
|
|
276
272
|
var RichSelectList_default = Object.assign(RichSelectList, {
|
|
277
273
|
Section: _J3ES6ZT6cjs.RichSelectSection_default,
|
|
278
|
-
Chip:
|
|
279
|
-
RadioButton:
|
|
274
|
+
Chip: _2TLKWIYCcjs.RichSelectChip_default,
|
|
275
|
+
RadioButton: _OVXHL32Ncjs.RichSelectRadioButton_default
|
|
280
276
|
});
|
|
281
277
|
|
|
282
278
|
|
|
283
279
|
|
|
284
280
|
exports.RichSelectList_default = RichSelectList_default;
|
|
285
|
-
//# sourceMappingURL=
|
|
281
|
+
//# sourceMappingURL=7B7TOXIF.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\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nconst NOOP = () => undefined;\n\nconst iconSize = {\n sm: 20,\n md: 24,\n lg: 24,\n} as const;\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 const { themeName } = useTheme();\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={size === \"lg\" ? \"lg\" : \"md\"}\n {...fieldProps}\n ref={fieldRef}\n >\n <div className={styles.selectWrapper}>\n <div\n className={classNames(\n styles.selectBox,\n themeName === \"classic\"\n ? styles.selectBoxClassic\n : styles.selectBoxCambio,\n themeName === \"classic\" && styles[size],\n {\n [styles.unselected]:\n !errorText &&\n selectedKeys !== \"all\" &&\n !selectedKeys.size,\n [styles.selected]:\n !errorText &&\n (selectedKeys === \"all\" || selectedKeys.size),\n [themeName === \"classic\"\n ? styles.selectError\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={iconSize[size]}\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_dwmnw_1\",\"opacityOverlay\":\"_opacityOverlay_dwmnw_7\",\"selectWrapper\":\"_selectWrapper_dwmnw_11\",\"selectBox\":\"_selectBox_dwmnw_16\",\"selectBoxClassic\":\"_selectBoxClassic_dwmnw_32\",\"selectBoxCambio\":\"_selectBoxCambio_dwmnw_37\",\"selectMouseFocusStyling\":\"_selectMouseFocusStyling_dwmnw_46\",\"unselected\":\"_unselected_dwmnw_51\",\"selected\":\"_selected_dwmnw_55\",\"arrowIcon\":\"_arrowIcon_dwmnw_59\",\"sm\":\"_sm_dwmnw_73\",\"md\":\"_md_dwmnw_79\",\"lg\":\"_lg_dwmnw_85\",\"selectError\":\"_selectError_dwmnw_91\",\"selectErrorCambio\":\"_selectErrorCambio_dwmnw_97\"}"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
ModalDialog_default
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./53T425YL.js";
|
|
5
5
|
import {
|
|
6
6
|
Dialog_default
|
|
7
7
|
} from "./WG6366VB.js";
|
|
@@ -141,4 +141,4 @@ export {
|
|
|
141
141
|
AriaPopover,
|
|
142
142
|
Popover_default
|
|
143
143
|
};
|
|
144
|
-
//# sourceMappingURL=
|
|
144
|
+
//# sourceMappingURL=7XCKMUYZ.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Chip_default
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./U6PVR4JE.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=AM27BYFE.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on
|
|
1
|
+
{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Mon, 25 Mar 2024 13:38:37 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\n"],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB;","names":[]}
|
|
@@ -71,14 +71,14 @@ var LinkButton = forwardRef(
|
|
|
71
71
|
{
|
|
72
72
|
[Button_module_default.fullWidth]: fullWidth,
|
|
73
73
|
[LinkButton_module_default.fitContent]: !fullWidth,
|
|
74
|
-
[Button_module_default.buttonGap]:
|
|
74
|
+
[Button_module_default.buttonGap]: size === "lg" || size === "md",
|
|
75
75
|
[Button_module_default.secondaryBorder]: themeName === "classic" && color === "secondary",
|
|
76
76
|
[Button_module_default.secondaryDestructiveBorder]: themeName === "classic" && color === "destructive-secondary"
|
|
77
77
|
}
|
|
78
78
|
),
|
|
79
79
|
onClick,
|
|
80
80
|
children: [
|
|
81
|
-
StartIcon &&
|
|
81
|
+
StartIcon && /* @__PURE__ */ jsx(
|
|
82
82
|
StartIcon,
|
|
83
83
|
{
|
|
84
84
|
className: classNames(
|
|
@@ -102,7 +102,7 @@ var LinkButton = forwardRef(
|
|
|
102
102
|
)
|
|
103
103
|
}
|
|
104
104
|
),
|
|
105
|
-
EndIcon &&
|
|
105
|
+
EndIcon && /* @__PURE__ */ jsx(
|
|
106
106
|
EndIcon,
|
|
107
107
|
{
|
|
108
108
|
className: classNames(
|
|
@@ -123,4 +123,4 @@ var LinkButton_default = LinkButton;
|
|
|
123
123
|
export {
|
|
124
124
|
LinkButton_default
|
|
125
125
|
};
|
|
126
|
-
//# sourceMappingURL=
|
|
126
|
+
//# sourceMappingURL=C2O2DNFT.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/LinkButton/LinkButton.tsx","css-module:./LinkButton.module.css#css-module"],"sourcesContent":["import { forwardRef, type HtmlHTMLAttributes } from \"react\";\nimport classNames from \"classnames\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport buttonStyles from \"../Button/Button.module.css\";\nimport iconSize from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\nimport styles from \"./LinkButton.module.css\";\n\nimport { classicColor, cambioColor } from \"../Button/constants/color\";\nimport {\n classicBackgroundColor,\n cambioBackgroundColor,\n} from \"../colors//backgroundColor\";\nimport {\n classicForegroundColor,\n cambioForegroundColor,\n} from \"../colors/foregroundColor\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype LinkButtonProps = {\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 link that the LinkButton should route to.\n *\n */\n href?: string;\n /**\n * The target attribute specifies where to open the linked document.\n *\n */\n target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n /**\n * The rel attribute specifies the relationship between the document and the link.\n *\n */\n rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\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 * 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 * 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 * Note: startIcon is not supported in the Cambio theme\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 * Note: endIcon is not supported in the Cambio theme\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 * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n */\n onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\n/**\n * [LinkButton](https://cambly-syntax.vercel.app/?path=/docs/components-linkbutton--docs) is a \"variation\" of Button that should look identical to Button, but should be used to render links instead.\n */\nconst LinkButton = forwardRef<HTMLAnchorElement, LinkButtonProps>(\n (\n {\n text,\n href,\n target,\n rel,\n \"data-testid\": dataTestId,\n color = \"primary\",\n size = \"md\",\n fullWidth = false,\n startIcon: StartIcon,\n endIcon: EndIcon,\n on = \"lightBackground\",\n onClick,\n }: LinkButtonProps,\n ref,\n ) => {\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 <a\n href={href}\n data-testid={dataTestId}\n target={target}\n ref={ref}\n rel={rel}\n className={classNames(\n styles.linkButton,\n buttonStyles.button,\n foregroundColorClass,\n backgroundColorClass,\n themeName === \"classic\"\n ? buttonStyles[size]\n : buttonStyles[`${size}Cambio`],\n {\n [buttonStyles.fullWidth]: fullWidth,\n [styles.fitContent]: !fullWidth,\n [buttonStyles.buttonGap]
|
|
1
|
+
{"version":3,"sources":["../../src/LinkButton/LinkButton.tsx","css-module:./LinkButton.module.css#css-module"],"sourcesContent":["import { forwardRef, type HtmlHTMLAttributes } from \"react\";\nimport classNames from \"classnames\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport buttonStyles from \"../Button/Button.module.css\";\nimport iconSize from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\nimport styles from \"./LinkButton.module.css\";\n\nimport { classicColor, cambioColor } from \"../Button/constants/color\";\nimport {\n classicBackgroundColor,\n cambioBackgroundColor,\n} from \"../colors//backgroundColor\";\nimport {\n classicForegroundColor,\n cambioForegroundColor,\n} from \"../colors/foregroundColor\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype LinkButtonProps = {\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 link that the LinkButton should route to.\n *\n */\n href?: string;\n /**\n * The target attribute specifies where to open the linked document.\n *\n */\n target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n /**\n * The rel attribute specifies the relationship between the document and the link.\n *\n */\n rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\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 * 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 * 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 * Note: startIcon is not supported in the Cambio theme\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 * Note: endIcon is not supported in the Cambio theme\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 * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n */\n onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\n/**\n * [LinkButton](https://cambly-syntax.vercel.app/?path=/docs/components-linkbutton--docs) is a \"variation\" of Button that should look identical to Button, but should be used to render links instead.\n */\nconst LinkButton = forwardRef<HTMLAnchorElement, LinkButtonProps>(\n (\n {\n text,\n href,\n target,\n rel,\n \"data-testid\": dataTestId,\n color = \"primary\",\n size = \"md\",\n fullWidth = false,\n startIcon: StartIcon,\n endIcon: EndIcon,\n on = \"lightBackground\",\n onClick,\n }: LinkButtonProps,\n ref,\n ) => {\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 <a\n href={href}\n data-testid={dataTestId}\n target={target}\n ref={ref}\n rel={rel}\n className={classNames(\n styles.linkButton,\n buttonStyles.button,\n foregroundColorClass,\n backgroundColorClass,\n themeName === \"classic\"\n ? buttonStyles[size]\n : buttonStyles[`${size}Cambio`],\n {\n [buttonStyles.fullWidth]: fullWidth,\n [styles.fitContent]: !fullWidth,\n [buttonStyles.buttonGap]: size === \"lg\" || size === \"md\",\n [buttonStyles.secondaryBorder]:\n themeName === \"classic\" && color === \"secondary\",\n [buttonStyles.secondaryDestructiveBorder]:\n themeName === \"classic\" && color === \"destructive-secondary\",\n },\n )}\n onClick={onClick}\n >\n {StartIcon && (\n <StartIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColorClass,\n )}\n />\n )}\n <Typography\n size={themeName === \"classic\" ? textVariant[size] : textVariant[size]}\n >\n <span\n // Temporary - until we have cambio colors on Typogrphay\n className={foregroundColorClass}\n style={{ fontWeight: 500 }}\n >\n {text}\n </span>\n </Typography>\n {EndIcon && (\n <EndIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColorClass,\n )}\n />\n )}\n </a>\n );\n },\n);\n\nLinkButton.displayName = \"LinkButton\";\n\nexport default LinkButton;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/LinkButton/LinkButton.module.css\"; export default {\"linkButton\":\"_linkButton_1qjrb_1\",\"fitContent\":\"_fitContent_1qjrb_11\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,kBAA2C;AACpD,OAAO,gBAAgB;;;ACD6E,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;ADsJpL,SA2BI,KA3BJ;AA/BN,IAAM,aAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT,KAAK;AAAA,IACL;AAAA,EACF,GACA,QACG;AACH,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;AAAA,QACA,eAAa;AAAA,QACb;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT,0BAAO;AAAA,UACP,sBAAa;AAAA,UACb;AAAA,UACA;AAAA,UACA,cAAc,YACV,sBAAa,IAAI,IACjB,sBAAa,GAAG,YAAY;AAAA,UAChC;AAAA,YACE,CAAC,sBAAa,SAAS,GAAG;AAAA,YAC1B,CAAC,0BAAO,UAAU,GAAG,CAAC;AAAA,YACtB,CAAC,sBAAa,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YACpD,CAAC,sBAAa,eAAe,GAC3B,cAAc,aAAa,UAAU;AAAA,YACvC,CAAC,sBAAa,0BAA0B,GACtC,cAAc,aAAa,UAAU;AAAA,UACzC;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb;AAAA,cACF;AAAA;AAAA,UACF;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,cAAc,YAAY,oBAAY,IAAI,IAAI,oBAAY,IAAI;AAAA,cAEpE;AAAA,gBAAC;AAAA;AAAA,kBAEC,WAAW;AAAA,kBACX,OAAO,EAAE,YAAY,IAAI;AAAA,kBAExB;AAAA;AAAA,cACH;AAAA;AAAA,UACF;AAAA,UACC,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb;AAAA,cACF;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ;","names":[]}
|