@cambly/syntax-core 15.6.0 → 16.1.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/Badge/Badge.cjs +4 -4
- package/dist/Badge/Badge.d.ts +1 -1
- package/dist/Badge/Badge.js +3 -3
- package/dist/Button/Button.cjs +5 -5
- package/dist/Button/Button.js +4 -4
- package/dist/Button/constants/iconSize.cjs +4 -2
- package/dist/Button/constants/iconSize.d.ts +7 -2
- package/dist/Button/constants/iconSize.js +5 -3
- package/dist/Card/Card.cjs +2 -2
- package/dist/Card/Card.d.ts +3 -2
- package/dist/Card/Card.js +3 -3
- package/dist/Checkbox/Checkbox.cjs +4 -4
- package/dist/Checkbox/Checkbox.js +3 -3
- package/dist/Chip/Chip.cjs +4 -4
- package/dist/Chip/Chip.js +3 -3
- package/dist/Dialog/ModalDialog.cjs +4 -3
- package/dist/Dialog/ModalDialog.css +100 -11
- package/dist/Dialog/ModalDialog.css.map +1 -1
- package/dist/Dialog/ModalDialog.js +3 -2
- package/dist/Heading/Heading.cjs +4 -4
- package/dist/Heading/Heading.js +3 -3
- package/dist/Icon/Icon.cjs +3 -3
- package/dist/Icon/Icon.css +29 -5
- package/dist/Icon/Icon.css.map +1 -1
- package/dist/Icon/Icon.d.ts +12 -6
- package/dist/Icon/Icon.js +2 -2
- package/dist/IconButton/IconButton.cjs +3 -2
- package/dist/IconButton/IconButton.css +100 -11
- package/dist/IconButton/IconButton.css.map +1 -1
- package/dist/IconButton/IconButton.js +2 -1
- package/dist/LinkButton/LinkButton.cjs +5 -5
- package/dist/LinkButton/LinkButton.js +4 -4
- package/dist/Modal/Modal.cjs +7 -6
- package/dist/Modal/Modal.css +100 -11
- package/dist/Modal/Modal.css.map +1 -1
- package/dist/Modal/Modal.js +6 -5
- package/dist/Popover/Popover.cjs +5 -4
- package/dist/Popover/Popover.css +100 -11
- package/dist/Popover/Popover.css.map +1 -1
- package/dist/Popover/Popover.js +4 -3
- package/dist/RadioButton/RadioButton.cjs +4 -4
- package/dist/RadioButton/RadioButton.js +3 -3
- package/dist/RichSelect/RichSelectBox.cjs +11 -11
- package/dist/RichSelect/RichSelectBox.js +10 -10
- package/dist/RichSelect/RichSelectChip.cjs +5 -5
- package/dist/RichSelect/RichSelectChip.js +4 -4
- package/dist/RichSelect/RichSelectList.cjs +16 -16
- package/dist/RichSelect/RichSelectList.css +100 -99
- package/dist/RichSelect/RichSelectList.css.map +1 -1
- package/dist/RichSelect/RichSelectList.js +15 -15
- package/dist/RichSelect/RichSelectRadioButton.cjs +5 -5
- package/dist/RichSelect/RichSelectRadioButton.js +4 -4
- package/dist/RichSelect/RichSelectSection.cjs +4 -4
- package/dist/RichSelect/RichSelectSection.js +3 -3
- package/dist/SelectList/SelectList.cjs +5 -5
- package/dist/SelectList/SelectList.js +4 -4
- package/dist/Tabs/TabButton.cjs +5 -5
- package/dist/Tabs/TabButton.js +4 -4
- package/dist/Tabs/TabInternal.cjs +4 -4
- package/dist/Tabs/TabInternal.js +3 -3
- package/dist/Tabs/TabLink.cjs +5 -5
- package/dist/Tabs/TabLink.js +4 -4
- package/dist/Tabs/Tabs.cjs +7 -7
- package/dist/Tabs/Tabs.js +6 -6
- package/dist/TextArea/TextArea.cjs +4 -4
- package/dist/TextArea/TextArea.css +9 -9
- package/dist/TextArea/TextArea.css.map +1 -1
- package/dist/TextArea/TextArea.js +3 -3
- package/dist/TextField/TextField.cjs +4 -4
- package/dist/TextField/TextField.css +9 -9
- package/dist/TextField/TextField.css.map +1 -1
- package/dist/TextField/TextField.js +3 -3
- package/dist/Tooltip/Tooltip.cjs +4 -4
- package/dist/Tooltip/Tooltip.js +3 -3
- package/dist/Typography/Typography.cjs +3 -3
- package/dist/Typography/Typography.js +2 -2
- package/dist/__chunks/{4X7ZC3WT.js → 2GCKYKF3.js} +9 -8
- package/dist/__chunks/2GCKYKF3.js.map +1 -0
- package/dist/__chunks/{JEP2SN7W.cjs → 2PWZPH3R.cjs} +3 -3
- package/dist/__chunks/{LNLOBEMH.cjs → 32CNLC3O.cjs} +3 -3
- package/dist/__chunks/{ZJS5MEKE.cjs → 3TF4GQNL.cjs} +3 -3
- package/dist/__chunks/{M7KSUTKJ.cjs → 3Z5DP4X3.cjs} +5 -5
- package/dist/__chunks/{M7KSUTKJ.cjs.map → 3Z5DP4X3.cjs.map} +1 -1
- package/dist/__chunks/{3BGIBVCR.cjs → 42SXZKBG.cjs} +3 -3
- package/dist/__chunks/{5RXHG6S5.js → 4C7SU3EM.js} +5 -5
- package/dist/__chunks/{NJ7VV2CH.cjs → 4ENILLBC.cjs} +4 -4
- package/dist/__chunks/{NJ7VV2CH.cjs.map → 4ENILLBC.cjs.map} +1 -1
- package/dist/__chunks/{JL2NIWMQ.js → 4JPHMF5K.js} +4 -4
- package/dist/__chunks/{JL2NIWMQ.js.map → 4JPHMF5K.js.map} +1 -1
- package/dist/__chunks/{BHN2OODF.cjs → 4Y7TNMFL.cjs} +9 -4
- package/dist/__chunks/4Y7TNMFL.cjs.map +1 -0
- package/dist/__chunks/{K2RGVD55.js → 523DPUCJ.js} +4 -4
- package/dist/__chunks/523DPUCJ.js.map +1 -0
- package/dist/__chunks/{RU5JUMYC.cjs → 5I2FYEA2.cjs} +1 -1
- package/dist/__chunks/{RU5JUMYC.cjs.map → 5I2FYEA2.cjs.map} +1 -1
- package/dist/__chunks/{5CSS7BNE.cjs → 5IOCCDL6.cjs} +10 -10
- package/dist/__chunks/{HUN4OGO5.js → 5KCDVRT6.js} +2 -2
- package/dist/__chunks/{P3W4SW6R.cjs → 6ZBLF7S2.cjs} +3 -3
- package/dist/__chunks/{J5NZ55OT.cjs → 7AVZDFCS.cjs} +3 -3
- package/dist/__chunks/{CUUBDICM.js → ATZKJ5M2.js} +1 -1
- package/dist/__chunks/{CUUBDICM.js.map → ATZKJ5M2.js.map} +1 -1
- package/dist/__chunks/{NFSZQICF.cjs → B3O42V6X.cjs} +4 -4
- package/dist/__chunks/{NVHCU2CO.cjs → B3ZOLJLG.cjs} +6 -6
- package/dist/__chunks/{NVHCU2CO.cjs.map → B3ZOLJLG.cjs.map} +1 -1
- package/dist/__chunks/{BS5FRXYG.js → B64Z54QN.js} +2 -2
- package/dist/__chunks/{4DZD4SDJ.js → BB3LT6KA.js} +3 -3
- package/dist/__chunks/{CDU5TH7Y.cjs → BFODXGGO.cjs} +3 -3
- package/dist/__chunks/{VMY3X6VX.js → BG3VB5JF.js} +2 -2
- package/dist/__chunks/{CB66GOW7.js → BXKO34RQ.js} +2 -2
- package/dist/__chunks/{ZYWRMB4F.js → C22XFS4G.js} +2 -2
- package/dist/__chunks/{RE6LUYXB.js → CHMPCLBE.js} +2 -2
- package/dist/__chunks/DCGTTQAX.js +37 -0
- package/dist/__chunks/DCGTTQAX.js.map +1 -0
- package/dist/__chunks/{T6T5FJWJ.js → DJ6I4764.js} +13 -8
- package/dist/__chunks/DJ6I4764.js.map +1 -0
- package/dist/__chunks/{NKGOCFTT.js → E3N5573J.js} +3 -3
- package/dist/__chunks/{NKGOCFTT.js.map → E3N5573J.js.map} +1 -1
- package/dist/__chunks/{C7PW7CPK.js → EH75XYWO.js} +9 -4
- package/dist/__chunks/{C7PW7CPK.js.map → EH75XYWO.js.map} +1 -1
- package/dist/__chunks/{JBFY4F7V.js → EJ2RDUTA.js} +2 -2
- package/dist/__chunks/{MDQYGGZO.cjs → F7FFR34L.cjs} +4 -4
- package/dist/__chunks/{MDQYGGZO.cjs.map → F7FFR34L.cjs.map} +1 -1
- package/dist/__chunks/{OY5QYJVA.cjs → FIPWIWEO.cjs} +9 -8
- package/dist/__chunks/FIPWIWEO.cjs.map +1 -0
- package/dist/__chunks/{262KRHP5.js → GQBD6AND.js} +4 -4
- package/dist/__chunks/{262KRHP5.js.map → GQBD6AND.js.map} +1 -1
- package/dist/__chunks/{6AOPOPJT.cjs → J2D7XRV7.cjs} +7 -7
- package/dist/__chunks/{6AOPOPJT.cjs.map → J2D7XRV7.cjs.map} +1 -1
- package/dist/__chunks/{ZPV4YBFX.cjs → KA6GROBD.cjs} +3 -3
- package/dist/__chunks/{ONTB6T6K.cjs → KFQOJ7RG.cjs} +5 -5
- package/dist/__chunks/{TLTSRB3H.js → KGGNBWMV.js} +3 -3
- package/dist/__chunks/{TLTSRB3H.js.map → KGGNBWMV.js.map} +1 -1
- package/dist/__chunks/L32D5WEG.cjs +37 -0
- package/dist/__chunks/L32D5WEG.cjs.map +1 -0
- package/dist/__chunks/{V4M5XFJN.cjs → L5RBAKAN.cjs} +5 -5
- package/dist/__chunks/L5RBAKAN.cjs.map +1 -0
- package/dist/__chunks/{DRQYQTCA.js → NPUDOII6.js} +2 -2
- package/dist/__chunks/{JWGD2JGX.js → NVTSF5NY.js} +2 -2
- package/dist/__chunks/{JWGD2JGX.js.map → NVTSF5NY.js.map} +1 -1
- package/dist/__chunks/{X34FPOWI.cjs → O54TUH3V.cjs} +9 -8
- package/dist/__chunks/O54TUH3V.cjs.map +1 -0
- package/dist/__chunks/{J7224OUT.cjs → OJKBVPRV.cjs} +3 -3
- package/dist/__chunks/{ZAB5SOZP.js → P7YFSOS7.js} +3 -3
- package/dist/__chunks/P7YFSOS7.js.map +1 -0
- package/dist/__chunks/{SW2JQXU6.cjs → POMJQZKJ.cjs} +2 -2
- package/dist/__chunks/{SW2JQXU6.cjs.map → POMJQZKJ.cjs.map} +1 -1
- package/dist/__chunks/{UXDF6ZIG.js → RCVW5CTF.js} +2 -2
- package/dist/__chunks/{I7BXC2FH.cjs → SNIXH2DH.cjs} +6 -6
- package/dist/__chunks/{OMWNK5SA.js → SOR5SSPX.js} +2 -2
- package/dist/__chunks/{7PXG7CRK.js → TDP7R7AQ.js} +8 -8
- package/dist/__chunks/{3CEGKGV5.js → THO3K5V7.js} +4 -4
- package/dist/__chunks/{3CEGKGV5.js.map → THO3K5V7.js.map} +1 -1
- package/dist/__chunks/{RD4EXZDZ.cjs → U2VVHVZ7.cjs} +19 -19
- package/dist/__chunks/{FAOJSMYY.js → UCJSVVK6.js} +2 -2
- package/dist/__chunks/{HM6JHSTR.cjs → UHOT5ZOH.cjs} +6 -6
- package/dist/__chunks/{HM6JHSTR.cjs.map → UHOT5ZOH.cjs.map} +1 -1
- package/dist/__chunks/{SSGQWZJG.cjs → WEOENL5J.cjs} +3 -3
- package/dist/__chunks/{YPL2E6XO.js → WFWY3AOV.js} +3 -3
- package/dist/__chunks/{QAH73IJZ.js → WJMQX7BT.js} +2 -2
- package/dist/__chunks/{JAW252M7.cjs → Z66NM3NK.cjs} +3 -3
- package/dist/__chunks/{PIQO2LH2.cjs → ZGOHDWOB.cjs} +13 -8
- package/dist/__chunks/ZGOHDWOB.cjs.map +1 -0
- package/dist/__chunks/{VZWUWOLJ.js → ZH4QTULO.js} +9 -8
- package/dist/__chunks/ZH4QTULO.js.map +1 -0
- package/dist/colors/textColors.cjs +2 -2
- package/dist/colors/textColors.js +1 -1
- package/dist/index.cjs +31 -31
- package/dist/index.css +50 -25
- package/dist/index.css.map +1 -1
- package/dist/index.js +32 -32
- package/package.json +1 -1
- package/dist/__chunks/4X7ZC3WT.js.map +0 -1
- package/dist/__chunks/BHN2OODF.cjs.map +0 -1
- package/dist/__chunks/FGXU5UXA.js +0 -30
- package/dist/__chunks/FGXU5UXA.js.map +0 -1
- package/dist/__chunks/G63LXNMK.cjs +0 -30
- package/dist/__chunks/G63LXNMK.cjs.map +0 -1
- package/dist/__chunks/K2RGVD55.js.map +0 -1
- package/dist/__chunks/OY5QYJVA.cjs.map +0 -1
- package/dist/__chunks/PIQO2LH2.cjs.map +0 -1
- package/dist/__chunks/T6T5FJWJ.js.map +0 -1
- package/dist/__chunks/V4M5XFJN.cjs.map +0 -1
- package/dist/__chunks/VZWUWOLJ.js.map +0 -1
- package/dist/__chunks/X34FPOWI.cjs.map +0 -1
- package/dist/__chunks/ZAB5SOZP.js.map +0 -1
- /package/dist/__chunks/{JEP2SN7W.cjs.map → 2PWZPH3R.cjs.map} +0 -0
- /package/dist/__chunks/{LNLOBEMH.cjs.map → 32CNLC3O.cjs.map} +0 -0
- /package/dist/__chunks/{ZJS5MEKE.cjs.map → 3TF4GQNL.cjs.map} +0 -0
- /package/dist/__chunks/{3BGIBVCR.cjs.map → 42SXZKBG.cjs.map} +0 -0
- /package/dist/__chunks/{5RXHG6S5.js.map → 4C7SU3EM.js.map} +0 -0
- /package/dist/__chunks/{5CSS7BNE.cjs.map → 5IOCCDL6.cjs.map} +0 -0
- /package/dist/__chunks/{HUN4OGO5.js.map → 5KCDVRT6.js.map} +0 -0
- /package/dist/__chunks/{P3W4SW6R.cjs.map → 6ZBLF7S2.cjs.map} +0 -0
- /package/dist/__chunks/{J5NZ55OT.cjs.map → 7AVZDFCS.cjs.map} +0 -0
- /package/dist/__chunks/{NFSZQICF.cjs.map → B3O42V6X.cjs.map} +0 -0
- /package/dist/__chunks/{BS5FRXYG.js.map → B64Z54QN.js.map} +0 -0
- /package/dist/__chunks/{4DZD4SDJ.js.map → BB3LT6KA.js.map} +0 -0
- /package/dist/__chunks/{CDU5TH7Y.cjs.map → BFODXGGO.cjs.map} +0 -0
- /package/dist/__chunks/{VMY3X6VX.js.map → BG3VB5JF.js.map} +0 -0
- /package/dist/__chunks/{CB66GOW7.js.map → BXKO34RQ.js.map} +0 -0
- /package/dist/__chunks/{ZYWRMB4F.js.map → C22XFS4G.js.map} +0 -0
- /package/dist/__chunks/{RE6LUYXB.js.map → CHMPCLBE.js.map} +0 -0
- /package/dist/__chunks/{JBFY4F7V.js.map → EJ2RDUTA.js.map} +0 -0
- /package/dist/__chunks/{ZPV4YBFX.cjs.map → KA6GROBD.cjs.map} +0 -0
- /package/dist/__chunks/{ONTB6T6K.cjs.map → KFQOJ7RG.cjs.map} +0 -0
- /package/dist/__chunks/{DRQYQTCA.js.map → NPUDOII6.js.map} +0 -0
- /package/dist/__chunks/{J7224OUT.cjs.map → OJKBVPRV.cjs.map} +0 -0
- /package/dist/__chunks/{UXDF6ZIG.js.map → RCVW5CTF.js.map} +0 -0
- /package/dist/__chunks/{I7BXC2FH.cjs.map → SNIXH2DH.cjs.map} +0 -0
- /package/dist/__chunks/{OMWNK5SA.js.map → SOR5SSPX.js.map} +0 -0
- /package/dist/__chunks/{7PXG7CRK.js.map → TDP7R7AQ.js.map} +0 -0
- /package/dist/__chunks/{RD4EXZDZ.cjs.map → U2VVHVZ7.cjs.map} +0 -0
- /package/dist/__chunks/{FAOJSMYY.js.map → UCJSVVK6.js.map} +0 -0
- /package/dist/__chunks/{SSGQWZJG.cjs.map → WEOENL5J.cjs.map} +0 -0
- /package/dist/__chunks/{YPL2E6XO.js.map → WFWY3AOV.js.map} +0 -0
- /package/dist/__chunks/{QAH73IJZ.js.map → WJMQX7BT.js.map} +0 -0
- /package/dist/__chunks/{JAW252M7.cjs.map → Z66NM3NK.cjs.map} +0 -0
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _F7FFR34Lcjs = require('./F7FFR34L.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
|
-
var
|
|
7
|
+
var _OJKBVPRVcjs = require('./OJKBVPRV.cjs');
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
var _JVGBP6LOcjs = require('./JVGBP6LO.cjs');
|
|
@@ -44,10 +44,10 @@ function Tabs({
|
|
|
44
44
|
}
|
|
45
45
|
);
|
|
46
46
|
}
|
|
47
|
-
Tabs.Button =
|
|
48
|
-
Tabs.Link =
|
|
47
|
+
Tabs.Button = _OJKBVPRVcjs.TabButton;
|
|
48
|
+
Tabs.Link = _F7FFR34Lcjs.TabLink_default;
|
|
49
49
|
|
|
50
50
|
|
|
51
51
|
|
|
52
52
|
exports.Tabs = Tabs;
|
|
53
|
-
//# sourceMappingURL=
|
|
53
|
+
//# sourceMappingURL=KFQOJ7RG.cjs.map
|
|
@@ -4,7 +4,7 @@ import {
|
|
|
4
4
|
} from "./65PMWIHY.js";
|
|
5
5
|
import {
|
|
6
6
|
Typography_default
|
|
7
|
-
} from "./
|
|
7
|
+
} from "./RCVW5CTF.js";
|
|
8
8
|
|
|
9
9
|
// css-module:./Badge.module.css#css-module
|
|
10
10
|
var Badge_module_default = { "icon": "_icon_1g9xb_1" };
|
|
@@ -50,7 +50,7 @@ var Badge = ({
|
|
|
50
50
|
weight: "medium",
|
|
51
51
|
color: textColorForBackgroundColor(color),
|
|
52
52
|
children: /* @__PURE__ */ jsxs(Box_default, { display: "flex", gap: 1, alignItems: "center", justifyContent: "start", children: [
|
|
53
|
-
Icon && /* @__PURE__ */ jsx(Icon, { className: Badge_module_default.icon, size:
|
|
53
|
+
Icon && /* @__PURE__ */ jsx(Icon, { className: Badge_module_default.icon, size: 100 }),
|
|
54
54
|
/* @__PURE__ */ jsx(
|
|
55
55
|
Typography_default,
|
|
56
56
|
{
|
|
@@ -71,4 +71,4 @@ var Badge_default = Badge;
|
|
|
71
71
|
export {
|
|
72
72
|
Badge_default
|
|
73
73
|
};
|
|
74
|
-
//# sourceMappingURL=
|
|
74
|
+
//# sourceMappingURL=KGGNBWMV.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["css-module:./Badge.module.css#css-module","../../src/Badge/Badge.tsx"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Badge/Badge.module.css\"; export default {\"icon\":\"_icon_1g9xb_1\"}","import { type ComponentProps } from \"react\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport styles from \"./Badge.module.css\";\nimport type InternalIcon from \"../Icon/Icon\";\n\nconst badgeColor = [\n \"sky\",\n \"success300\",\n \"destructive300\",\n \"orange\",\n \"tan\",\n \"gray370\",\n \"gray870\",\n \"lilac\",\n \"thistle\",\n \"pink\",\n] as const;\n\nconst textColorForBackgroundColor = (\n color: (typeof badgeColor)[number],\n): \"gray900\" | \"white\" => {\n switch (color) {\n case \"gray370\":\n case \"destructive300\":\n case \"orange\":\n case \"tan\":\n case \"success300\":\n case \"sky\":\n case \"thistle\":\n case \"pink\":\n case \"lilac\":\n return \"gray900\";\n default:\n return \"white\";\n }\n};\n\n/**\n * [Badge](https://cambly-syntax.vercel.app/?path=/docs/components-badge--docs) is a component to display short text and give additional context to features and other components.\n */\nconst Badge = ({\n icon: Icon,\n text,\n color = \"sky\",\n}: {\n /**\n * The icon to be displayed. Please use a [Material Icon](https://material.io/resources/icons/)\n */\n icon?:\n | React.ComponentType<{ className?: string }>\n | React.ComponentType<ComponentProps<typeof InternalIcon>>;\n /**\n * The text to display inside the badge\n */\n text: string;\n /**\n * The color of the badge\n *\n * @defaultValue \"sky\"\n */\n color?: (typeof badgeColor)[number];\n}): JSX.Element => {\n return (\n <Box\n display=\"inlineFlex\"\n paddingX={2}\n paddingY={1}\n rounding={\"sm\"}\n backgroundColor={color}\n alignItems=\"center\"\n justifyContent=\"center\"\n minHeight={24}\n >\n <Typography\n size={100}\n weight=\"medium\"\n color={textColorForBackgroundColor(color)}\n >\n <Box display=\"flex\" gap={1} alignItems=\"center\" justifyContent=\"start\">\n {Icon && <Icon className={styles.icon} size
|
|
1
|
+
{"version":3,"sources":["css-module:./Badge.module.css#css-module","../../src/Badge/Badge.tsx"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Badge/Badge.module.css\"; export default {\"icon\":\"_icon_1g9xb_1\"}","import { type ComponentProps } from \"react\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport styles from \"./Badge.module.css\";\nimport type InternalIcon from \"../Icon/Icon\";\n\nconst badgeColor = [\n \"sky\",\n \"success300\",\n \"destructive300\",\n \"orange\",\n \"tan\",\n \"gray370\",\n \"gray870\",\n \"lilac\",\n \"thistle\",\n \"pink\",\n] as const;\n\nconst textColorForBackgroundColor = (\n color: (typeof badgeColor)[number],\n): \"gray900\" | \"white\" => {\n switch (color) {\n case \"gray370\":\n case \"destructive300\":\n case \"orange\":\n case \"tan\":\n case \"success300\":\n case \"sky\":\n case \"thistle\":\n case \"pink\":\n case \"lilac\":\n return \"gray900\";\n default:\n return \"white\";\n }\n};\n\n/**\n * [Badge](https://cambly-syntax.vercel.app/?path=/docs/components-badge--docs) is a component to display short text and give additional context to features and other components.\n */\nconst Badge = ({\n icon: Icon,\n text,\n color = \"sky\",\n}: {\n /**\n * The icon to be displayed. Please use a [Material Icon](https://material.io/resources/icons/)\n */\n icon?:\n | React.ComponentType<{ className?: string }>\n | React.ComponentType<ComponentProps<typeof InternalIcon>>;\n /**\n * The text to display inside the badge\n */\n text: string;\n /**\n * The color of the badge\n *\n * @defaultValue \"sky\"\n */\n color?: (typeof badgeColor)[number];\n}): JSX.Element => {\n return (\n <Box\n display=\"inlineFlex\"\n paddingX={2}\n paddingY={1}\n rounding={\"sm\"}\n backgroundColor={color}\n alignItems=\"center\"\n justifyContent=\"center\"\n minHeight={24}\n >\n <Typography\n size={100}\n weight=\"medium\"\n color={textColorForBackgroundColor(color)}\n >\n <Box display=\"flex\" gap={1} alignItems=\"center\" justifyContent=\"start\">\n {Icon && <Icon className={styles.icon} size={100} />}\n <Typography\n color={textColorForBackgroundColor(color)}\n size={100}\n weight=\"medium\"\n >\n {text}\n </Typography>\n </Box>\n </Typography>\n </Box>\n );\n};\n\nexport default Badge;\n"],"mappings":";;;;;;;;;AAA0F,IAAO,uBAAQ,EAAC,QAAO,gBAAe;;;AC+ExH,SACW,KADX;AA5DR,IAAM,8BAA8B,CAClC,UACwB;AACxB,UAAQ,OAAO;AAAA,IACb,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAKA,IAAM,QAAQ,CAAC;AAAA,EACb,MAAM;AAAA,EACN;AAAA,EACA,QAAQ;AACV,MAiBmB;AACjB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,UAAU;AAAA,MACV,UAAU;AAAA,MACV,UAAU;AAAA,MACV,iBAAiB;AAAA,MACjB,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,WAAW;AAAA,MAEX;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,QAAO;AAAA,UACP,OAAO,4BAA4B,KAAK;AAAA,UAExC,+BAAC,eAAI,SAAQ,QAAO,KAAK,GAAG,YAAW,UAAS,gBAAe,SAC5D;AAAA,oBAAQ,oBAAC,QAAK,WAAW,qBAAO,MAAM,MAAM,KAAK;AAAA,YAClD;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO,4BAA4B,KAAK;AAAA,gBACxC,MAAM;AAAA,gBACN,QAAO;AAAA,gBAEN;AAAA;AAAA,YACH;AAAA,aACF;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;","names":[]}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
var _KJLBDAZHcjs = require('./KJLBDAZH.cjs');
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
var _X2SDR4SDcjs = require('./X2SDR4SD.cjs');
|
|
8
|
+
|
|
9
|
+
// src/Card/Card.tsx
|
|
10
|
+
var _react = require('react');
|
|
11
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
12
|
+
var Card = _react.forwardRef.call(void 0, function Card2(props, ref) {
|
|
13
|
+
const _a = props, { children } = _a, cardProps = _X2SDR4SDcjs.__objRest.call(void 0, _a, ["children"]);
|
|
14
|
+
const {
|
|
15
|
+
backgroundColor = "white",
|
|
16
|
+
size = "roomy",
|
|
17
|
+
"data-testid": dataTestId
|
|
18
|
+
} = cardProps;
|
|
19
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
20
|
+
_KJLBDAZHcjs.Box_default,
|
|
21
|
+
{
|
|
22
|
+
rounding: "md",
|
|
23
|
+
padding: size === "compact" ? 2 : 4,
|
|
24
|
+
width: "100%",
|
|
25
|
+
backgroundColor,
|
|
26
|
+
"data-testid": dataTestId,
|
|
27
|
+
ref,
|
|
28
|
+
children
|
|
29
|
+
}
|
|
30
|
+
);
|
|
31
|
+
});
|
|
32
|
+
var Card_default = Card;
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
exports.Card_default = Card_default;
|
|
37
|
+
//# sourceMappingURL=L32D5WEG.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Card/Card.tsx"],"names":["Card"],"mappings":";;;;;;;;;AAAA,SAAS,kBAAkB;AA4CvB;AAZJ,IAAM,OAAO,WAAsC,SAASA,MAC1D,OACA,KACa;AACb,QAAmC,YAA3B,WApCV,IAoCqC,IAAd,sBAAc,IAAd,CAAb;AACR,QAAM;AAAA,IACJ,kBAAkB;AAAA,IAClB,OAAO;AAAA,IACP,eAAe;AAAA,EACjB,IAAI;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAS;AAAA,MACT,SAAS,SAAS,YAAY,IAAI;AAAA,MAClC,OAAM;AAAA,MACN;AAAA,MACA,eAAa;AAAA,MACb;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,eAAQ","sourcesContent":["import { forwardRef } from \"react\";\nimport Box from \"../Box/Box\";\nimport type allColors from \"../colors/allColors\";\n\ntype CardProps = {\n /**\n * Test id for the button\n */\n \"data-testid\"?: string;\n /**\n * The background color of the box.\n * @defaultValue `white`\n */\n backgroundColor?: (typeof allColors)[number];\n /**\n * The child components to render within Card.\n */\n children: JSX.Element;\n /**\n * The size of the card which specifies the padding and spacing of the card.\n *\n * `compact`: 8px padding\n * `roomy`: 16px padding\n *\n * @defaultValue `roomy`\n */\n size?: \"compact\" | \"roomy\";\n};\n\n/**\n * [Card](https://cambly-syntax.vercel.app/?path=/docs/components-card--docs) is a basic container component to apply consistent styling and render child components.\n */\nconst Card = forwardRef<HTMLDivElement, CardProps>(function Card(\n props: CardProps,\n ref,\n): JSX.Element {\n const { children, ...cardProps } = props;\n const {\n backgroundColor = \"white\",\n size = \"roomy\",\n \"data-testid\": dataTestId,\n } = cardProps;\n\n return (\n <Box\n rounding=\"md\"\n padding={size === \"compact\" ? 2 : 4}\n width=\"100%\"\n backgroundColor={backgroundColor}\n data-testid={dataTestId}\n ref={ref}\n >\n {children}\n </Box>\n );\n});\n\nexport default Card;\n"]}
|
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _POMJQZKJcjs = require('./POMJQZKJ.cjs');
|
|
5
5
|
|
|
6
6
|
// src/Icon/Icon.tsx
|
|
7
7
|
var _react = require('react');
|
|
8
8
|
var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
|
|
9
9
|
|
|
10
10
|
// css-module:./Icon.module.css#css-module
|
|
11
|
-
var Icon_module_default = { "icon": "
|
|
11
|
+
var Icon_module_default = { "icon": "_icon_1vyva_1", "icon100": "_icon100_1vyva_8", "icon200": "_icon200_1vyva_13", "icon300": "_icon300_1vyva_18", "icon400": "_icon400_1vyva_23", "icon500": "_icon500_1vyva_28", "icon600": "_icon600_1vyva_33", "icon700": "_icon700_1vyva_38", "icon800": "_icon800_1vyva_43", "icon900": "_icon900_1vyva_48", "icon1000": "_icon1000_1vyva_53" };
|
|
12
12
|
|
|
13
13
|
// src/Icon/Icon.tsx
|
|
14
14
|
var _jsxruntime = require('react/jsx-runtime');
|
|
15
15
|
var Icon = _react.forwardRef.call(void 0,
|
|
16
|
-
({ color = "inherit", path, size =
|
|
16
|
+
({ color = "inherit", path, size = 200 }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
17
17
|
"svg",
|
|
18
18
|
{
|
|
19
19
|
className: _classnames2.default.call(void 0,
|
|
20
20
|
Icon_module_default.icon,
|
|
21
|
-
|
|
21
|
+
_POMJQZKJcjs.textColor.call(void 0, color),
|
|
22
22
|
Icon_module_default[`icon${size}`]
|
|
23
23
|
),
|
|
24
24
|
ref,
|
|
@@ -34,4 +34,4 @@ var Icon_default = Icon;
|
|
|
34
34
|
|
|
35
35
|
|
|
36
36
|
exports.Icon_default = Icon_default;
|
|
37
|
-
//# sourceMappingURL=
|
|
37
|
+
//# sourceMappingURL=L5RBAKAN.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Icon/Icon.tsx","css-module:./Icon.module.css#css-module"],"names":[],"mappings":";;;;;;AAAA,SAAS,kBAAuC;AAChD,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,WAAU,oBAAmB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,YAAW,qBAAoB;;;ADwDra;AAZN,IAAM,OAAO;AAAA,EACX,CAAC,EAAE,QAAQ,WAAW,MAAM,OAAO,IAAI,GAAc,QACnD;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,oBAAO;AAAA,QACP,UAAU,KAAK;AAAA,QACf,oBAAO,OAAO,MAAM;AAAA,MACtB;AAAA,MACA;AAAA,MACA,SAAQ;AAAA,MACR,OAAM;AAAA,MAEN,8BAAC,UAAK,GAAG,MAAM;AAAA;AAAA,EACjB;AAEJ;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ","sourcesContent":["import { forwardRef, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\n\nimport styles from \"./Icon.module.css\";\nimport textColor from \"../colors/textColors\";\nimport type Typography from \"../Typography/Typography\";\n\ntype IconProps = {\n /**\n * The color of the Icon.\n *\n * @defaultValue \"gray900\"\n */\n color?: ComponentProps<typeof Typography>[\"color\"];\n /**\n * The size of the Icon.\n * * 100: 16px x 16px\n * * 200: 20px x 20px\n * * 300: 24px x 24px\n * * 400: 28px x 28px\n * * 500: 48px x 48px\n * * 600: 72px x 72px\n * * 700: 100px x 100px\n * * 800: 140px x 140px\n * * 900: 200px x 200px\n * * 1000: 280px x 280px\n *\n * @defaultValue 200\n */\n size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;\n /**\n * The svg path of the icon. You should not use this prop directly, instead use the specific icon components.\n */\n path?: string;\n};\n\n/**\n * [Icon](http://localhost:6006/?path=/docs/icons-icons--docs) is the base component that renders an icon.\n * You shouldn't use this component directly, instead use the specific icon components.\n * @example\n * `import Book from \"@cambly/syntax-icons/Book\";`\n *\n * You can click on the icon to copy the import statement!\n */\nconst Icon = forwardRef<SVGSVGElement, IconProps>(\n ({ color = \"inherit\", path, size = 200 }: IconProps, ref) => (\n <svg\n className={classnames(\n styles.icon,\n textColor(color),\n styles[`icon${size}`],\n )}\n ref={ref}\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d={path} />\n </svg>\n ),\n);\n\nIcon.displayName = \"Icon\";\n\nexport default Icon;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Icon/Icon.module.css\"; export default {\"icon\":\"_icon_1vyva_1\",\"icon100\":\"_icon100_1vyva_8\",\"icon200\":\"_icon200_1vyva_13\",\"icon300\":\"_icon300_1vyva_18\",\"icon400\":\"_icon400_1vyva_23\",\"icon500\":\"_icon500_1vyva_28\",\"icon600\":\"_icon600_1vyva_33\",\"icon700\":\"_icon700_1vyva_38\",\"icon800\":\"_icon800_1vyva_43\",\"icon900\":\"_icon900_1vyva_48\",\"icon1000\":\"_icon1000_1vyva_53\"}"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Chip_default
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./E3N5573J.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=NPUDOII6.js.map
|
|
@@ -17,7 +17,7 @@ function textColor(color) {
|
|
|
17
17
|
case "destructive-primary":
|
|
18
18
|
return colors_module_default.cambioDestructive900Color;
|
|
19
19
|
case "destructive-darkBackground":
|
|
20
|
-
return colors_module_default.
|
|
20
|
+
return colors_module_default.cambioDestructive700Color;
|
|
21
21
|
case "success":
|
|
22
22
|
return colors_module_default.cambioSuccess900Color;
|
|
23
23
|
case "success-darkBackground":
|
|
@@ -30,4 +30,4 @@ function textColor(color) {
|
|
|
30
30
|
export {
|
|
31
31
|
textColor
|
|
32
32
|
};
|
|
33
|
-
//# sourceMappingURL=
|
|
33
|
+
//# sourceMappingURL=NVTSF5NY.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/colors/textColors.ts"],"sourcesContent":["import colorStyles from \"../colors/colors.module.css\";\n\nexport default function textColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"white-secondary\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.cambioGray800Color;\n case \"white\":\n return colorStyles.cambioWhiteColor;\n case \"white-secondary\":\n return colorStyles.cambioWhite70Color;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"destructive-primary\":\n return colorStyles.cambioDestructive900Color;\n case \"destructive-darkBackground\":\n return colorStyles.
|
|
1
|
+
{"version":3,"sources":["../../src/colors/textColors.ts"],"sourcesContent":["import colorStyles from \"../colors/colors.module.css\";\n\nexport default function textColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"white-secondary\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.cambioGray800Color;\n case \"white\":\n return colorStyles.cambioWhiteColor;\n case \"white-secondary\":\n return colorStyles.cambioWhite70Color;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"destructive-primary\":\n return colorStyles.cambioDestructive900Color;\n case \"destructive-darkBackground\":\n return colorStyles.cambioDestructive700Color;\n case \"success\":\n return colorStyles.cambioSuccess900Color;\n case \"success-darkBackground\":\n return colorStyles.cambioSuccess100Color;\n // primary / gray900\n default:\n return colorStyles.cambioBlackColor;\n }\n}\n"],"mappings":";;;;;;AAEe,SAAR,UACL,OAWQ;AACR,UAAQ,OAAO;AAAA,IACb,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IAErB;AACE,aAAO,sBAAY;AAAA,EACvB;AACF;","names":[]}
|
|
@@ -7,7 +7,8 @@ var _5JUNB754cjs = require('./5JUNB754.cjs');
|
|
|
7
7
|
var _3P2PWHOUcjs = require('./3P2PWHOU.cjs');
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
|
|
11
|
+
var _4Y7TNMFLcjs = require('./4Y7TNMFL.cjs');
|
|
11
12
|
|
|
12
13
|
|
|
13
14
|
var _LZYX5BWDcjs = require('./LZYX5BWD.cjs');
|
|
@@ -19,7 +20,7 @@ var _SFBTR56Icjs = require('./SFBTR56I.cjs');
|
|
|
19
20
|
var _65LHF5WDcjs = require('./65LHF5WD.cjs');
|
|
20
21
|
|
|
21
22
|
|
|
22
|
-
var
|
|
23
|
+
var _42SXZKBGcjs = require('./42SXZKBG.cjs');
|
|
23
24
|
|
|
24
25
|
// src/LinkButton/LinkButton.tsx
|
|
25
26
|
|
|
@@ -82,13 +83,13 @@ var LinkButton = _react.forwardRef.call(void 0,
|
|
|
82
83
|
{
|
|
83
84
|
className: _classnames2.default.call(void 0,
|
|
84
85
|
Button_module_default.icon,
|
|
85
|
-
|
|
86
|
+
_4Y7TNMFLcjs.materialIconSize[size],
|
|
86
87
|
foregroundColorClass
|
|
87
88
|
),
|
|
88
|
-
size
|
|
89
|
+
size: _4Y7TNMFLcjs.internalIconSize[size]
|
|
89
90
|
}
|
|
90
91
|
),
|
|
91
|
-
!loading && text && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
92
|
+
!loading && text && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _42SXZKBGcjs.Typography_default, { size: _5JUNB754cjs.textVariant_default[size], weight: "medium", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
92
93
|
"span",
|
|
93
94
|
{
|
|
94
95
|
className: foregroundColorClass,
|
|
@@ -100,10 +101,10 @@ var LinkButton = _react.forwardRef.call(void 0,
|
|
|
100
101
|
{
|
|
101
102
|
className: _classnames2.default.call(void 0,
|
|
102
103
|
Button_module_default.icon,
|
|
103
|
-
|
|
104
|
+
_4Y7TNMFLcjs.materialIconSize[size],
|
|
104
105
|
foregroundColorClass
|
|
105
106
|
),
|
|
106
|
-
size
|
|
107
|
+
size: _4Y7TNMFLcjs.internalIconSize[size]
|
|
107
108
|
}
|
|
108
109
|
),
|
|
109
110
|
loading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
@@ -137,4 +138,4 @@ var LinkButton_default = LinkButton;
|
|
|
137
138
|
|
|
138
139
|
|
|
139
140
|
exports.LinkButton_default = LinkButton_default;
|
|
140
|
-
//# sourceMappingURL=
|
|
141
|
+
//# sourceMappingURL=O54TUH3V.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/LinkButton/LinkButton.tsx","css-module:../Button/Button.module.css#css-module","css-module:./LinkButton.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AACP,OAAO,gBAAgB;;;ACLqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,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;;;ACAte,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;AFqIpL,SAuBI,KAvBJ;AAvBN,IAAM,aAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT,KAAK;AAAA,IACL;AAAA,EACF,GACA,QACG;AACH,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AAEtD,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,OAAO,OAAO,EAAE;AAAA,UAChB,sBAAa,IAAI;AAAA,UACjB;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,QAAQ,GAAG;AAAA,UAC3B;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,WAAC,WAAW,aACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAiB,IAAI;AAAA,gBACrB;AAAA,cACF;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,CAAC,WAAW,QACX,oBAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,QAAO,UAC1C;AAAA,YAAC;AAAA;AAAA,cAEC,WAAW;AAAA,cAEV;AAAA;AAAA,UACH,GACF;AAAA,UAED,CAAC,WAAW,WACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAiB,IAAI;AAAA,gBACrB;AAAA,cACF;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAa,SAAS,oBAAoB;AAAA,cAChE,SAAQ;AAAA,cACR,OAAO,wBAAgB,IAAI;AAAA,cAC3B,QAAQ,wBAAgB,IAAI;AAAA,cAE5B;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW,sBAAa;AAAA,kBACxB,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,WAAW,cAAc;AAEzB,IAAO,qBAAQ","sourcesContent":["import {\n forwardRef,\n type HtmlHTMLAttributes,\n type ComponentProps,\n} 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 {\n materialIconSize,\n internalIconSize,\n} from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\nimport loadingIconSize from \"../Button/constants/loadingIconSize\";\nimport styles from \"./LinkButton.module.css\";\nimport { backgroundColor } from \"../colors//backgroundColor\";\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { border } from \"../colors/border\";\nimport type InternalIcon from \"../Icon/Icon\";\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 * @defaultValue \"primary\"\n */\n color?:\n | \"primary\"\n | \"secondary\"\n | \"tertiary\"\n | \"destructive-primary\"\n | \"destructive-secondary\"\n | \"destructive-tertiary\"\n | \"branded\"\n | \"success-primary\"\n | \"success-secondary\"\n | \"success-tertiary\";\n /**\n * The size of the button\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 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?:\n | React.ComponentType<{ className?: string }>\n | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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?:\n | React.ComponentType<{ className?: string }>\n | React.ComponentType<ComponentProps<typeof InternalIcon>>;\n /**\n * Indicate whether the button renders on a light or dark background. Changes the color of the button\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 loading = false,\n fullWidth = false,\n startIcon: StartIcon,\n endIcon: EndIcon,\n on = \"lightBackground\",\n onClick,\n }: LinkButtonProps,\n ref,\n ) => {\n const foregroundColorClass = foregroundColor(color, on);\n const backgroundColorClass = backgroundColor(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 border(color, on),\n buttonStyles[size],\n {\n [buttonStyles.fullWidth]: fullWidth,\n [styles.fitContent]: !fullWidth,\n [buttonStyles.buttonGap]: size === \"lg\" || size === \"md\",\n [buttonStyles.disabled]: loading,\n },\n )}\n onClick={onClick}\n >\n {!loading && StartIcon && (\n <StartIcon\n className={classNames(\n buttonStyles.icon,\n materialIconSize[size],\n foregroundColorClass,\n )}\n size={internalIconSize[size]}\n />\n )}\n {!loading && text && (\n <Typography size={textVariant[size]} weight=\"medium\">\n <span\n // Temporary - until we have cambio colors on Typogrphay\n className={foregroundColorClass}\n >\n {text}\n </span>\n </Typography>\n )}\n {!loading && EndIcon && (\n <EndIcon\n className={classNames(\n buttonStyles.icon,\n materialIconSize[size],\n foregroundColorClass,\n )}\n size={internalIconSize[size]}\n />\n )}\n {loading && (\n <svg\n className={classNames(buttonStyles.loading, foregroundColorClass)}\n viewBox=\"22 22 44 44\"\n width={loadingIconSize[size]}\n height={loadingIconSize[size]}\n >\n <circle\n className={buttonStyles.loadingCircle}\n cx=\"44\"\n cy=\"44\"\n r=\"20.2\"\n fill=\"none\"\n strokeWidth=\"3.6\"\n />\n </svg>\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/Button/Button.module.css\"; export default {\"button\":\"_button_hjka3_1\",\"buttonGap\":\"_buttonGap_hjka3_8\",\"disabled\":\"_disabled_hjka3_42\",\"disabledPrimary\":\"_disabledPrimary_hjka3_49\",\"fullWidth\":\"_fullWidth_hjka3_53\",\"sm\":\"_sm_hjka3_57\",\"md\":\"_md_hjka3_64\",\"lg\":\"_lg_hjka3_71\",\"icon\":\"_icon_hjka3_78\",\"smIcon\":\"_smIcon_hjka3_82\",\"mdIcon\":\"_mdIcon_hjka3_89\",\"lgIcon\":\"_lgIcon_hjka3_96\",\"loading\":\"_loading_hjka3_113\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_hjka3_1\",\"loadingCircle\":\"_loadingCircle_hjka3_117\"}","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/LinkButton/LinkButton.module.css\"; export default {\"linkButton\":\"_linkButton_1qjrb_1\",\"fitContent\":\"_fitContent_1qjrb_11\"}"]}
|
|
@@ -7,7 +7,7 @@ var _3UEOKPM2cjs = require('./3UEOKPM2.cjs');
|
|
|
7
7
|
var _JVGBP6LOcjs = require('./JVGBP6LO.cjs');
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _B3O42V6Xcjs = require('./B3O42V6X.cjs');
|
|
11
11
|
|
|
12
12
|
|
|
13
13
|
var _KJLBDAZHcjs = require('./KJLBDAZH.cjs');
|
|
@@ -46,7 +46,7 @@ function TabButton({
|
|
|
46
46
|
"data-testid": dataTestId,
|
|
47
47
|
accessibilityLabel,
|
|
48
48
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
49
|
-
|
|
49
|
+
_B3O42V6Xcjs.TabInternal,
|
|
50
50
|
{
|
|
51
51
|
text,
|
|
52
52
|
selected,
|
|
@@ -64,4 +64,4 @@ function TabButton({
|
|
|
64
64
|
|
|
65
65
|
|
|
66
66
|
exports.TabButton = TabButton;
|
|
67
|
-
//# sourceMappingURL=
|
|
67
|
+
//# sourceMappingURL=OJKBVPRV.cjs.map
|
|
@@ -4,7 +4,7 @@ import {
|
|
|
4
4
|
} from "./5JQ6C2XV.js";
|
|
5
5
|
import {
|
|
6
6
|
TabInternal
|
|
7
|
-
} from "./
|
|
7
|
+
} from "./BXKO34RQ.js";
|
|
8
8
|
import {
|
|
9
9
|
Box_default
|
|
10
10
|
} from "./65PMWIHY.js";
|
|
@@ -35,7 +35,7 @@ var TabLink = forwardRef(
|
|
|
35
35
|
className: classnames({
|
|
36
36
|
[Tabs_module_default.unselectedTab]: !selected,
|
|
37
37
|
[Tabs_module_default.selectedTabOnLightBackground]: selected && on === "lightBackground",
|
|
38
|
-
[Tabs_module_default.
|
|
38
|
+
[Tabs_module_default.selectedTabOnDarkBackground]: selected && on === "darkBackground"
|
|
39
39
|
}),
|
|
40
40
|
style: {
|
|
41
41
|
height: "100%"
|
|
@@ -72,4 +72,4 @@ var TabLink_default = TabLink;
|
|
|
72
72
|
export {
|
|
73
73
|
TabLink_default
|
|
74
74
|
};
|
|
75
|
-
//# sourceMappingURL=
|
|
75
|
+
//# sourceMappingURL=P7YFSOS7.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import {\n forwardRef,\n type HtmlHTMLAttributes,\n type ComponentProps,\n} from \"react\";\nimport TabInternal from \"./TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"./Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\ntype TabLinkProps = ComponentProps<typeof TabInternal> & {\n /**\n * Test id for the button\n */\n \"data-testid\"?: string;\n /**\n * The link that the Tab 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 * 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\nconst TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n (\n {\n text,\n href,\n target,\n rel,\n \"data-testid\": dataTestId,\n on = \"lightBackground\",\n onClick,\n selected,\n endContent,\n itemCount,\n }: TabLinkProps,\n ref,\n ) => {\n return (\n <div\n role=\"tab\"\n className={classnames({\n [styles.unselectedTab]: !selected,\n [styles.selectedTabOnLightBackground]:\n selected && on === \"lightBackground\",\n [styles.selectedTabOnDarkBackground]:\n selected && on === \"darkBackground\",\n })}\n style={{\n height: \"100%\",\n }}\n >\n <Box display=\"flex\" alignItems=\"center\" height=\"100%\">\n <a\n href={href}\n data-testid={dataTestId}\n target={target}\n ref={ref}\n rel={rel}\n onClick={onClick}\n className={styles.link}\n >\n <TabInternal\n text={text}\n selected={selected}\n endContent={endContent}\n itemCount={itemCount}\n on={on}\n />\n </a>\n </Box>\n </div>\n );\n },\n);\n\nTabLink.displayName = \"TabLink\";\n\nexport default TabLink;\n"],"mappings":";;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AAEP,OAAO,gBAAgB;AAsEX;AAxCZ,IAAM,UAAU;AAAA,EACd,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW,WAAW;AAAA,UACpB,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,UACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,UACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,QACvB,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,QACV;AAAA,QAEA,8BAAC,eAAI,SAAQ,QAAO,YAAW,UAAS,QAAO,QAC7C;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,oBAAO;AAAA,YAElB;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ;","names":[]}
|
|
@@ -17,7 +17,7 @@ function textColor(color) {
|
|
|
17
17
|
case "destructive-primary":
|
|
18
18
|
return _SVA2ABQQcjs.colors_module_default.cambioDestructive900Color;
|
|
19
19
|
case "destructive-darkBackground":
|
|
20
|
-
return _SVA2ABQQcjs.colors_module_default.
|
|
20
|
+
return _SVA2ABQQcjs.colors_module_default.cambioDestructive700Color;
|
|
21
21
|
case "success":
|
|
22
22
|
return _SVA2ABQQcjs.colors_module_default.cambioSuccess900Color;
|
|
23
23
|
case "success-darkBackground":
|
|
@@ -30,4 +30,4 @@ function textColor(color) {
|
|
|
30
30
|
|
|
31
31
|
|
|
32
32
|
exports.textColor = textColor;
|
|
33
|
-
//# sourceMappingURL=
|
|
33
|
+
//# sourceMappingURL=POMJQZKJ.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/colors/textColors.ts"],"names":[],"mappings":";;;;;;AAEe,SAAR,UACL,OAWQ;AACR,UAAQ,OAAO;AAAA,IACb,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IAErB;AACE,aAAO,sBAAY;AAAA,EACvB;AACF","sourcesContent":["import colorStyles from \"../colors/colors.module.css\";\n\nexport default function textColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"white-secondary\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.cambioGray800Color;\n case \"white\":\n return colorStyles.cambioWhiteColor;\n case \"white-secondary\":\n return colorStyles.cambioWhite70Color;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"destructive-primary\":\n return colorStyles.cambioDestructive900Color;\n case \"destructive-darkBackground\":\n return colorStyles.
|
|
1
|
+
{"version":3,"sources":["../../src/colors/textColors.ts"],"names":[],"mappings":";;;;;;AAEe,SAAR,UACL,OAWQ;AACR,UAAQ,OAAO;AAAA,IACb,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IAErB;AACE,aAAO,sBAAY;AAAA,EACvB;AACF","sourcesContent":["import colorStyles from \"../colors/colors.module.css\";\n\nexport default function textColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"white-secondary\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.cambioGray800Color;\n case \"white\":\n return colorStyles.cambioWhiteColor;\n case \"white-secondary\":\n return colorStyles.cambioWhite70Color;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"destructive-primary\":\n return colorStyles.cambioDestructive900Color;\n case \"destructive-darkBackground\":\n return colorStyles.cambioDestructive700Color;\n case \"success\":\n return colorStyles.cambioSuccess900Color;\n case \"success-darkBackground\":\n return colorStyles.cambioSuccess100Color;\n // primary / gray900\n default:\n return colorStyles.cambioBlackColor;\n }\n}\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
textColor
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./NVTSF5NY.js";
|
|
5
5
|
|
|
6
6
|
// src/Typography/Typography.tsx
|
|
7
7
|
import classNames from "classnames";
|
|
@@ -60,4 +60,4 @@ var Typography_default = Typography;
|
|
|
60
60
|
export {
|
|
61
61
|
Typography_default
|
|
62
62
|
};
|
|
63
|
-
//# sourceMappingURL=
|
|
63
|
+
//# sourceMappingURL=RCVW5CTF.js.map
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var _5I2FYEA2cjs = require('./5I2FYEA2.cjs');
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
var _XLUVINJWcjs = require('./XLUVINJW.cjs');
|
|
@@ -14,7 +14,7 @@ var _KJLBDAZHcjs = require('./KJLBDAZH.cjs');
|
|
|
14
14
|
var _JVGX637Ecjs = require('./JVGX637E.cjs');
|
|
15
15
|
|
|
16
16
|
|
|
17
|
-
var
|
|
17
|
+
var _42SXZKBGcjs = require('./42SXZKBG.cjs');
|
|
18
18
|
|
|
19
19
|
|
|
20
20
|
var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
|
|
@@ -60,7 +60,7 @@ function SelectList({
|
|
|
60
60
|
[SelectList_module_default.opacityOverlay]: disabled
|
|
61
61
|
}),
|
|
62
62
|
children: [
|
|
63
|
-
label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: selectId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _KJLBDAZHcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
63
|
+
label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: selectId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _KJLBDAZHcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _42SXZKBGcjs.Typography_default, { size: 100, color: "gray700", children: label }) }) }),
|
|
64
64
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: SelectList_module_default.selectWrapper, children: [
|
|
65
65
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
66
66
|
"select",
|
|
@@ -98,7 +98,7 @@ function SelectList({
|
|
|
98
98
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
99
99
|
"path",
|
|
100
100
|
{
|
|
101
|
-
fill: errorText ?
|
|
101
|
+
fill: errorText ? _5I2FYEA2cjs.ColorBaseDestructive700 : _5I2FYEA2cjs.ColorBaseGray800,
|
|
102
102
|
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"
|
|
103
103
|
}
|
|
104
104
|
)
|
|
@@ -106,7 +106,7 @@ function SelectList({
|
|
|
106
106
|
) })
|
|
107
107
|
] }),
|
|
108
108
|
(helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _KJLBDAZHcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
109
|
-
|
|
109
|
+
_42SXZKBGcjs.Typography_default,
|
|
110
110
|
{
|
|
111
111
|
size: 100,
|
|
112
112
|
color: errorText ? "destructive-primary" : "gray700",
|
|
@@ -122,4 +122,4 @@ SelectList.Option = _JVGX637Ecjs.SelectOption_default;
|
|
|
122
122
|
|
|
123
123
|
|
|
124
124
|
exports.SelectList = SelectList;
|
|
125
|
-
//# sourceMappingURL=
|
|
125
|
+
//# sourceMappingURL=SNIXH2DH.cjs.map
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
} from "./5JQ6C2XV.js";
|
|
8
8
|
import {
|
|
9
9
|
TabInternal
|
|
10
|
-
} from "./
|
|
10
|
+
} from "./BXKO34RQ.js";
|
|
11
11
|
import {
|
|
12
12
|
Box_default
|
|
13
13
|
} from "./65PMWIHY.js";
|
|
@@ -64,4 +64,4 @@ function TabButton({
|
|
|
64
64
|
export {
|
|
65
65
|
TabButton
|
|
66
66
|
};
|
|
67
|
-
//# sourceMappingURL=
|
|
67
|
+
//# sourceMappingURL=SOR5SSPX.js.map
|
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
import {
|
|
3
3
|
Popover_default
|
|
4
|
-
} from "./
|
|
4
|
+
} from "./C22XFS4G.js";
|
|
5
5
|
import {
|
|
6
6
|
DialogContext
|
|
7
7
|
} from "./5HEC7ASW.js";
|
|
8
8
|
import {
|
|
9
9
|
ColorBaseDestructive700,
|
|
10
10
|
ColorBaseGray800
|
|
11
|
-
} from "./
|
|
11
|
+
} from "./ATZKJ5M2.js";
|
|
12
12
|
import {
|
|
13
13
|
RichSelectBoxContext,
|
|
14
14
|
RichSelectBox_default,
|
|
15
15
|
convertSelection
|
|
16
|
-
} from "./
|
|
16
|
+
} from "./4C7SU3EM.js";
|
|
17
17
|
import {
|
|
18
18
|
RichSelectSection_default
|
|
19
|
-
} from "./
|
|
19
|
+
} from "./CHMPCLBE.js";
|
|
20
20
|
import {
|
|
21
21
|
RichSelectRadioButton_default
|
|
22
|
-
} from "./
|
|
22
|
+
} from "./B64Z54QN.js";
|
|
23
23
|
import {
|
|
24
24
|
RichSelectChip_default
|
|
25
|
-
} from "./
|
|
25
|
+
} from "./NPUDOII6.js";
|
|
26
26
|
import {
|
|
27
27
|
TapArea_default
|
|
28
28
|
} from "./77FFPQY6.js";
|
|
@@ -31,7 +31,7 @@ import {
|
|
|
31
31
|
} from "./65PMWIHY.js";
|
|
32
32
|
import {
|
|
33
33
|
Typography_default
|
|
34
|
-
} from "./
|
|
34
|
+
} from "./RCVW5CTF.js";
|
|
35
35
|
import {
|
|
36
36
|
useIsHydrated
|
|
37
37
|
} from "./JB65NEXK.js";
|
|
@@ -267,4 +267,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
|
|
|
267
267
|
export {
|
|
268
268
|
RichSelectList_default
|
|
269
269
|
};
|
|
270
|
-
//# sourceMappingURL=
|
|
270
|
+
//# sourceMappingURL=TDP7R7AQ.js.map
|
|
@@ -4,7 +4,7 @@ import {
|
|
|
4
4
|
} from "./65PMWIHY.js";
|
|
5
5
|
import {
|
|
6
6
|
Typography_default
|
|
7
|
-
} from "./
|
|
7
|
+
} from "./RCVW5CTF.js";
|
|
8
8
|
import {
|
|
9
9
|
useIsHydrated
|
|
10
10
|
} from "./JB65NEXK.js";
|
|
@@ -16,7 +16,7 @@ import {
|
|
|
16
16
|
import classNames from "classnames";
|
|
17
17
|
|
|
18
18
|
// css-module:./TextField.module.css#css-module
|
|
19
|
-
var TextField_module_default = { "textfield": "
|
|
19
|
+
var TextField_module_default = { "textfield": "_textfield_1of18_1", "label": "_label_1of18_22", "md": "_md_1of18_26", "height": "_height_1of18_30", "inputError": "_inputError_1of18_34" };
|
|
20
20
|
|
|
21
21
|
// src/TextField/TextField.tsx
|
|
22
22
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -75,7 +75,7 @@ function TextField({
|
|
|
75
75
|
Typography_default,
|
|
76
76
|
{
|
|
77
77
|
size: 100,
|
|
78
|
-
color: errorText ? "destructive-
|
|
78
|
+
color: errorText ? "destructive-darkBackground" : "gray700",
|
|
79
79
|
children: errorText || helperText
|
|
80
80
|
}
|
|
81
81
|
) })
|
|
@@ -87,4 +87,4 @@ function TextField({
|
|
|
87
87
|
export {
|
|
88
88
|
TextField
|
|
89
89
|
};
|
|
90
|
-
//# sourceMappingURL=
|
|
90
|
+
//# sourceMappingURL=THO3K5V7.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/TextField/TextField.tsx","css-module:./TextField.module.css#css-module"],"sourcesContent":["import React, {\n type ReactElement,\n type HTMLInputTypeAttribute,\n useId,\n} from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./TextField.module.css\";\nimport Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\n\n/**\n * [TextField](https://cambly-syntax.vercel.app/?path=/docs/components-textfield--docs) is a component that allows users to enter text.\n */\nexport default function TextField({\n autoComplete,\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText = \"\",\n helperText = \"\",\n id,\n label,\n maxLength,\n onChange,\n placeholder = \"\",\n type = \"text\",\n value = \"\",\n step,\n}: {\n /**\n * The autocomplete attribute specifies whether or not an input field should have autocomplete enabled.\n *\n * Feel free to add new values from the [MDN docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) as needed\n */\n autoComplete?: \"current-password\" | \"new-password\" | \"off\" | \"on\" | \"email\";\n /**\n * A data-testid to make querying for the TextField easier.\n */\n \"data-testid\"?: string;\n /**\n * If true, the TextField will be disabled.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * Text shown below TextField if there is an input error.\n */\n errorText?: string;\n /**\n * Informative helper text shown below TextField\n */\n helperText?: string;\n /**\n * TextField id, if not provided, a unique id will be generated\n */\n id?: string;\n /**\n * TextField visible label\n */\n label: string;\n /**\n * Maximum length of the TextField\n */\n maxLength?: number;\n /**\n * The callback to be called the input changes\n */\n onChange: React.ChangeEventHandler<HTMLInputElement>;\n /**\n * Optional TextField placeholder text\n */\n placeholder?: string;\n /**\n * Input type of the TextField\n *\n * See [full list of input types](https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types)\n */\n type?: HTMLInputTypeAttribute;\n /**\n * Value of the TextField\n */\n value: string;\n /**\n * Specified legal number intervals for an input field. Specifically for time or number. If for time, specify in milliseconds. Must be a positive value.\n */\n step?: number;\n}): ReactElement {\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const reactId = useId();\n const inputId = id ?? reactId;\n\n return (\n <Box\n display=\"flex\"\n direction=\"column\"\n gap={2}\n width=\"100%\"\n dangerouslySetInlineStyle={{\n __style: {\n opacity: disabled ? 0.5 : 1,\n },\n }}\n >\n {label && (\n <label className={styles.label} htmlFor={inputId}>\n <Box paddingX={1}>\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </label>\n )}\n <input\n autoComplete={autoComplete}\n className={classNames(styles.textfield, styles.md, styles.height, {\n [styles.inputError]: errorText,\n })}\n data-testid={dataTestId}\n disabled={disabled}\n id={inputId}\n maxLength={maxLength}\n type={type}\n onChange={onChange}\n placeholder={placeholder}\n value={value}\n step={step}\n />\n {(helperText || errorText) && (\n <Box paddingX={1}>\n <Typography\n size={100}\n color={errorText ? \"destructive-
|
|
1
|
+
{"version":3,"sources":["../../src/TextField/TextField.tsx","css-module:./TextField.module.css#css-module"],"sourcesContent":["import React, {\n type ReactElement,\n type HTMLInputTypeAttribute,\n useId,\n} from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./TextField.module.css\";\nimport Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\n\n/**\n * [TextField](https://cambly-syntax.vercel.app/?path=/docs/components-textfield--docs) is a component that allows users to enter text.\n */\nexport default function TextField({\n autoComplete,\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText = \"\",\n helperText = \"\",\n id,\n label,\n maxLength,\n onChange,\n placeholder = \"\",\n type = \"text\",\n value = \"\",\n step,\n}: {\n /**\n * The autocomplete attribute specifies whether or not an input field should have autocomplete enabled.\n *\n * Feel free to add new values from the [MDN docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) as needed\n */\n autoComplete?: \"current-password\" | \"new-password\" | \"off\" | \"on\" | \"email\";\n /**\n * A data-testid to make querying for the TextField easier.\n */\n \"data-testid\"?: string;\n /**\n * If true, the TextField will be disabled.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * Text shown below TextField if there is an input error.\n */\n errorText?: string;\n /**\n * Informative helper text shown below TextField\n */\n helperText?: string;\n /**\n * TextField id, if not provided, a unique id will be generated\n */\n id?: string;\n /**\n * TextField visible label\n */\n label: string;\n /**\n * Maximum length of the TextField\n */\n maxLength?: number;\n /**\n * The callback to be called the input changes\n */\n onChange: React.ChangeEventHandler<HTMLInputElement>;\n /**\n * Optional TextField placeholder text\n */\n placeholder?: string;\n /**\n * Input type of the TextField\n *\n * See [full list of input types](https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types)\n */\n type?: HTMLInputTypeAttribute;\n /**\n * Value of the TextField\n */\n value: string;\n /**\n * Specified legal number intervals for an input field. Specifically for time or number. If for time, specify in milliseconds. Must be a positive value.\n */\n step?: number;\n}): ReactElement {\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const reactId = useId();\n const inputId = id ?? reactId;\n\n return (\n <Box\n display=\"flex\"\n direction=\"column\"\n gap={2}\n width=\"100%\"\n dangerouslySetInlineStyle={{\n __style: {\n opacity: disabled ? 0.5 : 1,\n },\n }}\n >\n {label && (\n <label className={styles.label} htmlFor={inputId}>\n <Box paddingX={1}>\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </label>\n )}\n <input\n autoComplete={autoComplete}\n className={classNames(styles.textfield, styles.md, styles.height, {\n [styles.inputError]: errorText,\n })}\n data-testid={dataTestId}\n disabled={disabled}\n id={inputId}\n maxLength={maxLength}\n type={type}\n onChange={onChange}\n placeholder={placeholder}\n value={value}\n step={step}\n />\n {(helperText || errorText) && (\n <Box paddingX={1}>\n <Typography\n size={100}\n color={errorText ? \"destructive-darkBackground\" : \"gray700\"}\n >\n {errorText || helperText}\n </Typography>\n </Box>\n )}\n </Box>\n );\n}\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_1of18_1\",\"label\":\"_label_1of18_22\",\"md\":\"_md_1of18_26\",\"height\":\"_height_1of18_30\",\"inputError\":\"_inputError_1of18_34\"}"],"mappings":";;;;;;;;;;;;AAAA;AAAA,EAGE;AAAA,OACK;AACP,OAAO,gBAAgB;;;ACL2E,IAAO,2BAAQ,EAAC,aAAY,sBAAqB,SAAQ,mBAAkB,MAAK,gBAAe,UAAS,oBAAmB,cAAa,uBAAsB;;;AD8F5P,SAcQ,KAdR;AAhFW,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA,eAAe;AAAA,EACf,UAAU,eAAe;AAAA,EACzB,YAAY;AAAA,EACZ,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AACF,GA2DiB;AACf,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,UAAU,MAAM;AACtB,QAAM,UAAU,kBAAM;AAEtB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,WAAU;AAAA,MACV,KAAK;AAAA,MACL,OAAM;AAAA,MACN,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,SAAS,WAAW,MAAM;AAAA,QAC5B;AAAA,MACF;AAAA,MAEC;AAAA,iBACC,oBAAC,WAAM,WAAW,yBAAO,OAAO,SAAS,SACvC,8BAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,KAAK,OAAM,WAC1B,iBACH,GACF,GACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW,WAAW,yBAAO,WAAW,yBAAO,IAAI,yBAAO,QAAQ;AAAA,cAChE,CAAC,yBAAO,UAAU,GAAG;AAAA,YACvB,CAAC;AAAA,YACD,eAAa;AAAA,YACb;AAAA,YACA,IAAI;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,SACE,cAAc,cACd,oBAAC,eAAI,UAAU,GACb;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,OAAO,YAAY,+BAA+B;AAAA,YAEjD,uBAAa;AAAA;AAAA,QAChB,GACF;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
|