@cambly/syntax-core 10.5.1 → 10.6.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.
@@ -1,6 +1,6 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _FMHIHCQScjs = require('../__chunks/FMHIHCQS.cjs');
3
+ var _JLUYEG2Lcjs = require('../__chunks/JLUYEG2L.cjs');
4
4
  require('../__chunks/36B62A3Z.cjs');
5
5
  require('../__chunks/3HVG5AGO.cjs');
6
6
  require('../__chunks/TEJLBWXV.cjs');
@@ -13,5 +13,5 @@ require('../__chunks/VUANIQYP.cjs');
13
13
  require('../__chunks/I64JGYX7.cjs');
14
14
 
15
15
 
16
- exports.default = _FMHIHCQScjs.LinkButton_default;
16
+ exports.default = _JLUYEG2Lcjs.LinkButton_default;
17
17
  //# sourceMappingURL=LinkButton.cjs.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  LinkButton_default
3
- } from "../__chunks/3UQRZ3IQ.js";
3
+ } from "../__chunks/EIYMXZ2V.js";
4
4
  import "../__chunks/5DBWL6IK.js";
5
5
  import "../__chunks/4PWSK5GI.js";
6
6
  import "../__chunks/HQVZUEWO.js";
@@ -1,6 +1,6 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _FVUQWBMOcjs = require('../__chunks/FVUQWBMO.cjs');
3
+ var _J2CQS3FIcjs = require('../__chunks/J2CQS3FI.cjs');
4
4
  require('../__chunks/5TKLFG5Y.cjs');
5
5
  require('../__chunks/PBOQIXCB.cjs');
6
6
  require('../__chunks/RAVU4WEO.cjs');
@@ -13,7 +13,7 @@ require('../__chunks/IJVFSOXU.cjs');
13
13
  require('../__chunks/36B62A3Z.cjs');
14
14
  require('../__chunks/3HVG5AGO.cjs');
15
15
  require('../__chunks/PZYWUTMW.cjs');
16
- require('../__chunks/ZU4Y2KQG.cjs');
16
+ require('../__chunks/YTZDAVG6.cjs');
17
17
  require('../__chunks/FMSI35YS.cjs');
18
18
  require('../__chunks/ZDMSFZS3.cjs');
19
19
  require('../__chunks/2RCQTGOZ.cjs');
@@ -44,5 +44,5 @@ require('../__chunks/RFHPSEBF.cjs');
44
44
  require('../__chunks/I64JGYX7.cjs');
45
45
 
46
46
 
47
- exports.default = _FVUQWBMOcjs.RichSelectList_default;
47
+ exports.default = _J2CQS3FIcjs.RichSelectList_default;
48
48
  //# sourceMappingURL=RichSelectList.cjs.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  RichSelectList_default
3
- } from "../__chunks/EDTR2ER5.js";
3
+ } from "../__chunks/CUQH7RLJ.js";
4
4
  import "../__chunks/JHAV5OTQ.js";
5
5
  import "../__chunks/LJHH6KUW.js";
6
6
  import "../__chunks/2R4YCOYE.js";
@@ -13,7 +13,7 @@ import "../__chunks/XFFSBU7E.js";
13
13
  import "../__chunks/5DBWL6IK.js";
14
14
  import "../__chunks/4PWSK5GI.js";
15
15
  import "../__chunks/JIXNBF5N.js";
16
- import "../__chunks/W24KIAXI.js";
16
+ import "../__chunks/NJ6FU6DK.js";
17
17
  import "../__chunks/JKXOZUCV.js";
18
18
  import "../__chunks/PTWXXDFF.js";
19
19
  import "../__chunks/DNTOWEIQ.js";
@@ -1,8 +1,8 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _LOFR3Y32cjs = require('../__chunks/LOFR3Y32.cjs');
3
+ var _CVONHKQWcjs = require('../__chunks/CVONHKQW.cjs');
4
4
  require('../__chunks/GKECCWR3.cjs');
5
- require('../__chunks/ZU4Y2KQG.cjs');
5
+ require('../__chunks/YTZDAVG6.cjs');
6
6
  require('../__chunks/LTM57QMY.cjs');
7
7
  require('../__chunks/ZX5KONS2.cjs');
8
8
  require('../__chunks/NGUJFGAC.cjs');
@@ -12,5 +12,5 @@ require('../__chunks/GVEA7SLQ.cjs');
12
12
  require('../__chunks/I64JGYX7.cjs');
13
13
 
14
14
 
15
- exports.default = _LOFR3Y32cjs.SelectList;
15
+ exports.default = _CVONHKQWcjs.SelectList;
16
16
  //# sourceMappingURL=SelectList.cjs.map
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  SelectList
3
- } from "../__chunks/HPLOQ2U3.js";
3
+ } from "../__chunks/HPZBIU65.js";
4
4
  import "../__chunks/HOUO3WV6.js";
5
- import "../__chunks/W24KIAXI.js";
5
+ import "../__chunks/NJ6FU6DK.js";
6
6
  import "../__chunks/2O6FDRTF.js";
7
7
  import "../__chunks/B2TFERTM.js";
8
8
  import "../__chunks/ERXGNP37.js";
@@ -15,7 +15,7 @@ import {
15
15
  import {
16
16
  ColorBaseDestructive700,
17
17
  ColorBaseGray800
18
- } from "./W24KIAXI.js";
18
+ } from "./NJ6FU6DK.js";
19
19
  import {
20
20
  RichSelectSection_default
21
21
  } from "./JKXOZUCV.js";
@@ -267,4 +267,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
267
267
  export {
268
268
  RichSelectList_default
269
269
  };
270
- //# sourceMappingURL=EDTR2ER5.js.map
270
+ //# sourceMappingURL=CUQH7RLJ.js.map
@@ -4,7 +4,7 @@ var _GKECCWR3cjs = require('./GKECCWR3.cjs');
4
4
 
5
5
 
6
6
 
7
- var _ZU4Y2KQGcjs = require('./ZU4Y2KQG.cjs');
7
+ var _YTZDAVG6cjs = require('./YTZDAVG6.cjs');
8
8
 
9
9
 
10
10
  var _LTM57QMYcjs = require('./LTM57QMY.cjs');
@@ -100,7 +100,7 @@ function SelectList({
100
100
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
101
101
  "path",
102
102
  {
103
- fill: errorText ? _ZU4Y2KQGcjs.ColorBaseDestructive700 : _ZU4Y2KQGcjs.ColorBaseGray800,
103
+ fill: errorText ? _YTZDAVG6cjs.ColorBaseDestructive700 : _YTZDAVG6cjs.ColorBaseGray800,
104
104
  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"
105
105
  }
106
106
  )
@@ -124,4 +124,4 @@ SelectList.Option = _GKECCWR3cjs.SelectOption_default;
124
124
 
125
125
 
126
126
  exports.SelectList = SelectList;
127
- //# sourceMappingURL=LOFR3Y32.cjs.map
127
+ //# sourceMappingURL=CVONHKQW.cjs.map
@@ -70,7 +70,11 @@ var LinkButton = forwardRef(
70
70
  StartIcon && /* @__PURE__ */ jsx(
71
71
  StartIcon,
72
72
  {
73
- className: classNames(Button_module_default.icon, iconSize_default[size])
73
+ className: classNames(
74
+ Button_module_default.icon,
75
+ iconSize_default[size],
76
+ foregroundColor(color)
77
+ )
74
78
  }
75
79
  ),
76
80
  /* @__PURE__ */ jsx(
@@ -81,7 +85,16 @@ var LinkButton = forwardRef(
81
85
  children: /* @__PURE__ */ jsx("span", { style: { fontWeight: 500 }, children: text })
82
86
  }
83
87
  ),
84
- EndIcon && /* @__PURE__ */ jsx(EndIcon, { className: classNames(Button_module_default.icon, iconSize_default[size]) })
88
+ EndIcon && /* @__PURE__ */ jsx(
89
+ EndIcon,
90
+ {
91
+ className: classNames(
92
+ Button_module_default.icon,
93
+ iconSize_default[size],
94
+ foregroundColor(color)
95
+ )
96
+ }
97
+ )
85
98
  ]
86
99
  }
87
100
  );
@@ -93,4 +106,4 @@ var LinkButton_default = LinkButton;
93
106
  export {
94
107
  LinkButton_default
95
108
  };
96
- //# sourceMappingURL=3UQRZ3IQ.js.map
109
+ //# sourceMappingURL=EIYMXZ2V.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/LinkButton/LinkButton.tsx","css-module:../Button/Button.module.css#css-module","css-module:./LinkButton.module.css#css-module"],"sourcesContent":["import { forwardRef, type HtmlHTMLAttributes } from \"react\";\nimport classNames from \"classnames\";\nimport backgroundColor from \"../colors/backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport foregroundTypographyColor from \"../colors/foregroundTypographyColor\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\n\nimport buttonStyles from \"../Button/Button.module.css\";\nimport iconSize from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\n\nimport styles from \"./LinkButton.module.css\";\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\";\n /**\n * The size of the button\n *\n * * `sm`: 32px\n * * `md`: 40px\n * * `lg`: 48px\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 */\n startIcon?: React.ComponentType<{ className?: string }>;\n /**\n * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n endIcon?: React.ComponentType<{ className?: string }>;\n /**\n * 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 onClick,\n }: LinkButtonProps,\n ref,\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 foregroundColor(color),\n backgroundColor(color),\n buttonStyles[size],\n {\n [buttonStyles.fullWidth]: fullWidth,\n [styles.fitContent]: !fullWidth,\n [buttonStyles.buttonGap]: size === \"lg\" || size === \"md\",\n [buttonStyles.secondaryBorder]: color === \"secondary\",\n [buttonStyles.secondaryDestructiveBorder]:\n color === \"destructive-secondary\",\n },\n )}\n onClick={onClick}\n >\n {StartIcon && (\n <StartIcon\n className={classNames(buttonStyles.icon, iconSize[size])}\n />\n )}\n <Typography\n color={foregroundTypographyColor(color)}\n size={textVariant[size]}\n >\n <span style={{ fontWeight: 500 }}>{text}</span>\n </Typography>\n {EndIcon && (\n <EndIcon className={classNames(buttonStyles.icon, iconSize[size])} />\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_1iunh_1\",\"buttonGap\":\"_buttonGap_1iunh_9\",\"fullWidth\":\"_fullWidth_1iunh_50\",\"sm\":\"_sm_1iunh_54\",\"md\":\"_md_1iunh_61\",\"lg\":\"_lg_1iunh_68\",\"icon\":\"_icon_1iunh_75\",\"smIcon\":\"_smIcon_1iunh_79\",\"mdIcon\":\"_mdIcon_1iunh_86\",\"lgIcon\":\"_lgIcon_1iunh_93\",\"secondaryBorder\":\"_secondaryBorder_1iunh_100\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_1iunh_104\",\"loading\":\"_loading_1iunh_118\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1iunh_1\",\"loadingCircle\":\"_loadingCircle_1iunh_122\"}","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;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,8BAA6B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;ACA5gB,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;AFwGpL,SAwBI,KAxBJ;AAlBN,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;AAAA,EACF,GACA,QACG;AACH,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,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,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,eAAe,GAAG,UAAU;AAAA,YAC1C,CAAC,sBAAa,0BAA0B,GACtC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAa,MAAM,iBAAS,IAAI,CAAC;AAAA;AAAA,UACzD;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,0BAA0B,KAAK;AAAA,cACtC,MAAM,oBAAY,IAAI;AAAA,cAEtB,8BAAC,UAAK,OAAO,EAAE,YAAY,IAAI,GAAI,gBAAK;AAAA;AAAA,UAC1C;AAAA,UACC,WACC,oBAAC,WAAQ,WAAW,WAAW,sBAAa,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA;AAAA;AAAA,IAEvE;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ;","names":[]}
1
+ {"version":3,"sources":["../../src/LinkButton/LinkButton.tsx","css-module:../Button/Button.module.css#css-module","css-module:./LinkButton.module.css#css-module"],"sourcesContent":["import { forwardRef, type HtmlHTMLAttributes } from \"react\";\nimport classNames from \"classnames\";\nimport backgroundColor from \"../colors/backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport foregroundTypographyColor from \"../colors/foregroundTypographyColor\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\n\nimport buttonStyles from \"../Button/Button.module.css\";\nimport iconSize from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\n\nimport styles from \"./LinkButton.module.css\";\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\";\n /**\n * The size of the button\n *\n * * `sm`: 32px\n * * `md`: 40px\n * * `lg`: 48px\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 */\n startIcon?: React.ComponentType<{ className?: string }>;\n /**\n * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n endIcon?: React.ComponentType<{ className?: string }>;\n /**\n * 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 onClick,\n }: LinkButtonProps,\n ref,\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 foregroundColor(color),\n backgroundColor(color),\n buttonStyles[size],\n {\n [buttonStyles.fullWidth]: fullWidth,\n [styles.fitContent]: !fullWidth,\n [buttonStyles.buttonGap]: size === \"lg\" || size === \"md\",\n [buttonStyles.secondaryBorder]: color === \"secondary\",\n [buttonStyles.secondaryDestructiveBorder]:\n color === \"destructive-secondary\",\n },\n )}\n onClick={onClick}\n >\n {StartIcon && (\n <StartIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColor(color),\n )}\n />\n )}\n <Typography\n color={foregroundTypographyColor(color)}\n size={textVariant[size]}\n >\n <span style={{ fontWeight: 500 }}>{text}</span>\n </Typography>\n {EndIcon && (\n <EndIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColor(color),\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/Button/Button.module.css\"; export default {\"button\":\"_button_1iunh_1\",\"buttonGap\":\"_buttonGap_1iunh_9\",\"fullWidth\":\"_fullWidth_1iunh_50\",\"sm\":\"_sm_1iunh_54\",\"md\":\"_md_1iunh_61\",\"lg\":\"_lg_1iunh_68\",\"icon\":\"_icon_1iunh_75\",\"smIcon\":\"_smIcon_1iunh_79\",\"mdIcon\":\"_mdIcon_1iunh_86\",\"lgIcon\":\"_lgIcon_1iunh_93\",\"secondaryBorder\":\"_secondaryBorder_1iunh_100\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_1iunh_104\",\"loading\":\"_loading_1iunh_118\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1iunh_1\",\"loadingCircle\":\"_loadingCircle_1iunh_122\"}","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;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,8BAA6B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;ACA5gB,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;AFwGpL,SAwBI,KAxBJ;AAlBN,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;AAAA,EACF,GACA,QACG;AACH,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,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,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,eAAe,GAAG,UAAU;AAAA,YAC1C,CAAC,sBAAa,0BAA0B,GACtC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb,gBAAgB,KAAK;AAAA,cACvB;AAAA;AAAA,UACF;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,0BAA0B,KAAK;AAAA,cACtC,MAAM,oBAAY,IAAI;AAAA,cAEtB,8BAAC,UAAK,OAAO,EAAE,YAAY,IAAI,GAAI,gBAAK;AAAA;AAAA,UAC1C;AAAA,UACC,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb,gBAAgB,KAAK;AAAA,cACvB;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ;","names":[]}
@@ -4,7 +4,7 @@ import {
4
4
  import {
5
5
  ColorBaseDestructive700,
6
6
  ColorBaseGray800
7
- } from "./W24KIAXI.js";
7
+ } from "./NJ6FU6DK.js";
8
8
  import {
9
9
  Focus_module_default
10
10
  } from "./2O6FDRTF.js";
@@ -124,4 +124,4 @@ SelectList.Option = SelectOption_default;
124
124
  export {
125
125
  SelectList
126
126
  };
127
- //# sourceMappingURL=HPLOQ2U3.js.map
127
+ //# sourceMappingURL=HPZBIU65.js.map
@@ -15,7 +15,7 @@ var _PZYWUTMWcjs = require('./PZYWUTMW.cjs');
15
15
 
16
16
 
17
17
 
18
- var _ZU4Y2KQGcjs = require('./ZU4Y2KQG.cjs');
18
+ var _YTZDAVG6cjs = require('./YTZDAVG6.cjs');
19
19
 
20
20
 
21
21
  var _FMSI35YScjs = require('./FMSI35YS.cjs');
@@ -232,7 +232,7 @@ function RichSelectList(props) {
232
232
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
233
233
  "path",
234
234
  {
235
- fill: errorText ? _ZU4Y2KQGcjs.ColorBaseDestructive700 : _ZU4Y2KQGcjs.ColorBaseGray800,
235
+ fill: errorText ? _YTZDAVG6cjs.ColorBaseDestructive700 : _YTZDAVG6cjs.ColorBaseGray800,
236
236
  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"
237
237
  }
238
238
  )
@@ -267,4 +267,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
267
267
 
268
268
 
269
269
  exports.RichSelectList_default = RichSelectList_default;
270
- //# sourceMappingURL=FVUQWBMO.cjs.map
270
+ //# sourceMappingURL=J2CQS3FI.cjs.map
@@ -70,7 +70,11 @@ var LinkButton = _react.forwardRef.call(void 0,
70
70
  StartIcon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
71
71
  StartIcon,
72
72
  {
73
- className: _classnames2.default.call(void 0, Button_module_default.icon, _3HVG5AGOcjs.iconSize_default[size])
73
+ className: _classnames2.default.call(void 0,
74
+ Button_module_default.icon,
75
+ _3HVG5AGOcjs.iconSize_default[size],
76
+ _PQIPUPQ2cjs.foregroundColor.call(void 0, color)
77
+ )
74
78
  }
75
79
  ),
76
80
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
@@ -81,7 +85,16 @@ var LinkButton = _react.forwardRef.call(void 0,
81
85
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { style: { fontWeight: 500 }, children: text })
82
86
  }
83
87
  ),
84
- EndIcon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EndIcon, { className: _classnames2.default.call(void 0, Button_module_default.icon, _3HVG5AGOcjs.iconSize_default[size]) })
88
+ EndIcon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
89
+ EndIcon,
90
+ {
91
+ className: _classnames2.default.call(void 0,
92
+ Button_module_default.icon,
93
+ _3HVG5AGOcjs.iconSize_default[size],
94
+ _PQIPUPQ2cjs.foregroundColor.call(void 0, color)
95
+ )
96
+ }
97
+ )
85
98
  ]
86
99
  }
87
100
  );
@@ -93,4 +106,4 @@ var LinkButton_default = LinkButton;
93
106
 
94
107
 
95
108
  exports.LinkButton_default = LinkButton_default;
96
- //# sourceMappingURL=FMHIHCQS.cjs.map
109
+ //# sourceMappingURL=JLUYEG2L.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,SAAS,kBAA2C;AACpD,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,8BAA6B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;ACA5gB,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;AFwGpL,SAwBI,KAxBJ;AAlBN,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;AAAA,EACF,GACA,QACG;AACH,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,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,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,eAAe,GAAG,UAAU;AAAA,YAC1C,CAAC,sBAAa,0BAA0B,GACtC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb,gBAAgB,KAAK;AAAA,cACvB;AAAA;AAAA,UACF;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,0BAA0B,KAAK;AAAA,cACtC,MAAM,oBAAY,IAAI;AAAA,cAEtB,8BAAC,UAAK,OAAO,EAAE,YAAY,IAAI,GAAI,gBAAK;AAAA;AAAA,UAC1C;AAAA,UACC,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb,gBAAgB,KAAK;AAAA,cACvB;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ","sourcesContent":["import { forwardRef, type HtmlHTMLAttributes } from \"react\";\nimport classNames from \"classnames\";\nimport backgroundColor from \"../colors/backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport foregroundTypographyColor from \"../colors/foregroundTypographyColor\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\n\nimport buttonStyles from \"../Button/Button.module.css\";\nimport iconSize from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\n\nimport styles from \"./LinkButton.module.css\";\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\";\n /**\n * The size of the button\n *\n * * `sm`: 32px\n * * `md`: 40px\n * * `lg`: 48px\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 */\n startIcon?: React.ComponentType<{ className?: string }>;\n /**\n * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n endIcon?: React.ComponentType<{ className?: string }>;\n /**\n * 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 onClick,\n }: LinkButtonProps,\n ref,\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 foregroundColor(color),\n backgroundColor(color),\n buttonStyles[size],\n {\n [buttonStyles.fullWidth]: fullWidth,\n [styles.fitContent]: !fullWidth,\n [buttonStyles.buttonGap]: size === \"lg\" || size === \"md\",\n [buttonStyles.secondaryBorder]: color === \"secondary\",\n [buttonStyles.secondaryDestructiveBorder]:\n color === \"destructive-secondary\",\n },\n )}\n onClick={onClick}\n >\n {StartIcon && (\n <StartIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColor(color),\n )}\n />\n )}\n <Typography\n color={foregroundTypographyColor(color)}\n size={textVariant[size]}\n >\n <span style={{ fontWeight: 500 }}>{text}</span>\n </Typography>\n {EndIcon && (\n <EndIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColor(color),\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/Button/Button.module.css\"; export default {\"button\":\"_button_1iunh_1\",\"buttonGap\":\"_buttonGap_1iunh_9\",\"fullWidth\":\"_fullWidth_1iunh_50\",\"sm\":\"_sm_1iunh_54\",\"md\":\"_md_1iunh_61\",\"lg\":\"_lg_1iunh_68\",\"icon\":\"_icon_1iunh_75\",\"smIcon\":\"_smIcon_1iunh_79\",\"mdIcon\":\"_mdIcon_1iunh_86\",\"lgIcon\":\"_lgIcon_1iunh_93\",\"secondaryBorder\":\"_secondaryBorder_1iunh_100\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_1iunh_104\",\"loading\":\"_loading_1iunh_118\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1iunh_1\",\"loadingCircle\":\"_loadingCircle_1iunh_122\"}","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/LinkButton/LinkButton.module.css\"; export default {\"linkButton\":\"_linkButton_1qjrb_1\",\"fitContent\":\"_fitContent_1qjrb_11\"}"]}
@@ -6,4 +6,4 @@ export {
6
6
  ColorBaseDestructive700,
7
7
  ColorBaseGray800
8
8
  };
9
- //# sourceMappingURL=W24KIAXI.js.map
9
+ //# sourceMappingURL=NJ6FU6DK.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Mon, 05 Feb 2024 17:09:51 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 Elevation400 = \"0px 16px 32px 0px #00000040\";\n"],"mappings":";AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB;","names":[]}
1
+ {"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Wed, 14 Feb 2024 23:31:48 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 Elevation400 = \"0px 16px 32px 0px #00000040\";\n"],"mappings":";AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB;","names":[]}
@@ -6,4 +6,4 @@ var ColorBaseGray800 = "#353535";
6
6
 
7
7
 
8
8
  exports.ColorBaseDestructive700 = ColorBaseDestructive700; exports.ColorBaseGray800 = ColorBaseGray800;
9
- //# sourceMappingURL=ZU4Y2KQG.cjs.map
9
+ //# sourceMappingURL=YTZDAVG6.cjs.map
@@ -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 Mon, 05 Feb 2024 17:09:51 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 Elevation400 = \"0px 16px 32px 0px #00000040\";\n"]}
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 Wed, 14 Feb 2024 23:31:48 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 Elevation400 = \"0px 16px 32px 0px #00000040\";\n"]}
package/dist/index.cjs CHANGED
@@ -24,14 +24,14 @@ require('./__chunks/YBP5BNDH.cjs');
24
24
  require('./__chunks/SJFWRAOP.cjs');
25
25
 
26
26
 
27
- var _FMHIHCQScjs = require('./__chunks/FMHIHCQS.cjs');
27
+ var _JLUYEG2Lcjs = require('./__chunks/JLUYEG2L.cjs');
28
28
 
29
29
 
30
- var _LOFR3Y32cjs = require('./__chunks/LOFR3Y32.cjs');
30
+ var _CVONHKQWcjs = require('./__chunks/CVONHKQW.cjs');
31
31
  require('./__chunks/GKECCWR3.cjs');
32
32
 
33
33
 
34
- var _FVUQWBMOcjs = require('./__chunks/FVUQWBMO.cjs');
34
+ var _J2CQS3FIcjs = require('./__chunks/J2CQS3FI.cjs');
35
35
  require('./__chunks/5TKLFG5Y.cjs');
36
36
 
37
37
 
@@ -56,7 +56,7 @@ require('./__chunks/3HVG5AGO.cjs');
56
56
 
57
57
 
58
58
  var _PZYWUTMWcjs = require('./__chunks/PZYWUTMW.cjs');
59
- require('./__chunks/ZU4Y2KQG.cjs');
59
+ require('./__chunks/YTZDAVG6.cjs');
60
60
  require('./__chunks/FMSI35YS.cjs');
61
61
  require('./__chunks/ZDMSFZS3.cjs');
62
62
  require('./__chunks/2RCQTGOZ.cjs');
@@ -127,5 +127,5 @@ require('./__chunks/I64JGYX7.cjs');
127
127
 
128
128
 
129
129
 
130
- exports.Avatar = _EWCLQBKVcjs.Avatar_default; exports.AvatarGroup = _W7CSNF2Mcjs.AvatarGroup; exports.Badge = _JYDZTZIKcjs.Badge_default; exports.Box = _5SMR5MWYcjs.Box_default; exports.Button = _RAVU4WEOcjs.Button_default; exports.ButtonGroup = _PBOQIXCBcjs.ButtonGroup_default; exports.Card = _K77KFPIVcjs.Card; exports.Checkbox = _GOSWBV5Dcjs.Checkbox_default; exports.Chip = _QQWCNTE4cjs.Chip_default; exports.Divider = _3TXXNWWAcjs.Divider; exports.Heading = _FZ5HWA3Scjs.Heading_default; exports.IconButton = _LDFTT3OIcjs.IconButton_default; exports.LinkButton = _FMHIHCQScjs.LinkButton_default; exports.Modal = _HR5QOB3Ucjs.Modal; exports.Popover = _QNBZ64IEcjs.Popover_default; exports.RadioButton = _LMCK5YO5cjs.RadioButton_default; exports.RichSelectList = _FVUQWBMOcjs.RichSelectList_default; exports.SelectList = _LOFR3Y32cjs.SelectList; exports.TapArea = _PZYWUTMWcjs.TapArea_default; exports.TextArea = _FMSBGH2Icjs.TextArea_default; exports.TextField = _KCYZNZBOcjs.TextField; exports.Tooltip = _ZG64UIHGcjs.Tooltip_default; exports.Typography = _ZX5KONS2cjs.Typography_default;
130
+ exports.Avatar = _EWCLQBKVcjs.Avatar_default; exports.AvatarGroup = _W7CSNF2Mcjs.AvatarGroup; exports.Badge = _JYDZTZIKcjs.Badge_default; exports.Box = _5SMR5MWYcjs.Box_default; exports.Button = _RAVU4WEOcjs.Button_default; exports.ButtonGroup = _PBOQIXCBcjs.ButtonGroup_default; exports.Card = _K77KFPIVcjs.Card; exports.Checkbox = _GOSWBV5Dcjs.Checkbox_default; exports.Chip = _QQWCNTE4cjs.Chip_default; exports.Divider = _3TXXNWWAcjs.Divider; exports.Heading = _FZ5HWA3Scjs.Heading_default; exports.IconButton = _LDFTT3OIcjs.IconButton_default; exports.LinkButton = _JLUYEG2Lcjs.LinkButton_default; exports.Modal = _HR5QOB3Ucjs.Modal; exports.Popover = _QNBZ64IEcjs.Popover_default; exports.RadioButton = _LMCK5YO5cjs.RadioButton_default; exports.RichSelectList = _J2CQS3FIcjs.RichSelectList_default; exports.SelectList = _CVONHKQWcjs.SelectList; exports.TapArea = _PZYWUTMWcjs.TapArea_default; exports.TextArea = _FMSBGH2Icjs.TextArea_default; exports.TextField = _KCYZNZBOcjs.TextField; exports.Tooltip = _ZG64UIHGcjs.Tooltip_default; exports.Typography = _ZX5KONS2cjs.Typography_default;
131
131
  //# sourceMappingURL=index.cjs.map
package/dist/index.js CHANGED
@@ -24,14 +24,14 @@ import "./__chunks/E4BJX2H5.js";
24
24
  import "./__chunks/42YPEAFS.js";
25
25
  import {
26
26
  LinkButton_default
27
- } from "./__chunks/3UQRZ3IQ.js";
27
+ } from "./__chunks/EIYMXZ2V.js";
28
28
  import {
29
29
  SelectList
30
- } from "./__chunks/HPLOQ2U3.js";
30
+ } from "./__chunks/HPZBIU65.js";
31
31
  import "./__chunks/HOUO3WV6.js";
32
32
  import {
33
33
  RichSelectList_default
34
- } from "./__chunks/EDTR2ER5.js";
34
+ } from "./__chunks/CUQH7RLJ.js";
35
35
  import "./__chunks/JHAV5OTQ.js";
36
36
  import {
37
37
  ButtonGroup_default
@@ -56,7 +56,7 @@ import "./__chunks/4PWSK5GI.js";
56
56
  import {
57
57
  TapArea_default
58
58
  } from "./__chunks/JIXNBF5N.js";
59
- import "./__chunks/W24KIAXI.js";
59
+ import "./__chunks/NJ6FU6DK.js";
60
60
  import "./__chunks/JKXOZUCV.js";
61
61
  import "./__chunks/PTWXXDFF.js";
62
62
  import "./__chunks/DNTOWEIQ.js";
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@cambly/syntax-core",
3
3
  "description": "Cambly design system core components",
4
- "version": "10.5.1",
4
+ "version": "10.6.0",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
7
7
  "module": "./dist/index.js",
@@ -1 +0,0 @@
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,SAAS,kBAA2C;AACpD,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,8BAA6B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;ACA5gB,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;AFwGpL,SAwBI,KAxBJ;AAlBN,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;AAAA,EACF,GACA,QACG;AACH,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,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,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,eAAe,GAAG,UAAU;AAAA,YAC1C,CAAC,sBAAa,0BAA0B,GACtC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAa,MAAM,iBAAS,IAAI,CAAC;AAAA;AAAA,UACzD;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,0BAA0B,KAAK;AAAA,cACtC,MAAM,oBAAY,IAAI;AAAA,cAEtB,8BAAC,UAAK,OAAO,EAAE,YAAY,IAAI,GAAI,gBAAK;AAAA;AAAA,UAC1C;AAAA,UACC,WACC,oBAAC,WAAQ,WAAW,WAAW,sBAAa,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA;AAAA;AAAA,IAEvE;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ","sourcesContent":["import { forwardRef, type HtmlHTMLAttributes } from \"react\";\nimport classNames from \"classnames\";\nimport backgroundColor from \"../colors/backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport foregroundTypographyColor from \"../colors/foregroundTypographyColor\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\n\nimport buttonStyles from \"../Button/Button.module.css\";\nimport iconSize from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\n\nimport styles from \"./LinkButton.module.css\";\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\";\n /**\n * The size of the button\n *\n * * `sm`: 32px\n * * `md`: 40px\n * * `lg`: 48px\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 */\n startIcon?: React.ComponentType<{ className?: string }>;\n /**\n * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n endIcon?: React.ComponentType<{ className?: string }>;\n /**\n * 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 onClick,\n }: LinkButtonProps,\n ref,\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 foregroundColor(color),\n backgroundColor(color),\n buttonStyles[size],\n {\n [buttonStyles.fullWidth]: fullWidth,\n [styles.fitContent]: !fullWidth,\n [buttonStyles.buttonGap]: size === \"lg\" || size === \"md\",\n [buttonStyles.secondaryBorder]: color === \"secondary\",\n [buttonStyles.secondaryDestructiveBorder]:\n color === \"destructive-secondary\",\n },\n )}\n onClick={onClick}\n >\n {StartIcon && (\n <StartIcon\n className={classNames(buttonStyles.icon, iconSize[size])}\n />\n )}\n <Typography\n color={foregroundTypographyColor(color)}\n size={textVariant[size]}\n >\n <span style={{ fontWeight: 500 }}>{text}</span>\n </Typography>\n {EndIcon && (\n <EndIcon className={classNames(buttonStyles.icon, iconSize[size])} />\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_1iunh_1\",\"buttonGap\":\"_buttonGap_1iunh_9\",\"fullWidth\":\"_fullWidth_1iunh_50\",\"sm\":\"_sm_1iunh_54\",\"md\":\"_md_1iunh_61\",\"lg\":\"_lg_1iunh_68\",\"icon\":\"_icon_1iunh_75\",\"smIcon\":\"_smIcon_1iunh_79\",\"mdIcon\":\"_mdIcon_1iunh_86\",\"lgIcon\":\"_lgIcon_1iunh_93\",\"secondaryBorder\":\"_secondaryBorder_1iunh_100\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_1iunh_104\",\"loading\":\"_loading_1iunh_118\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1iunh_1\",\"loadingCircle\":\"_loadingCircle_1iunh_122\"}","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/LinkButton/LinkButton.module.css\"; export default {\"linkButton\":\"_linkButton_1qjrb_1\",\"fitContent\":\"_fitContent_1qjrb_11\"}"]}