@cambly/syntax-core 10.35.0 → 10.36.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.
Files changed (201) hide show
  1. package/dist/Avatar/Avatar.d.ts +1 -1
  2. package/dist/Badge/Badge.cjs +3 -3
  3. package/dist/Badge/Badge.d.ts +2 -24
  4. package/dist/Badge/Badge.js +2 -2
  5. package/dist/Button/Button.cjs +6 -6
  6. package/dist/Button/Button.d.ts +1 -1
  7. package/dist/Button/Button.js +5 -5
  8. package/dist/ButtonGroup/ButtonGroup.d.ts +1 -1
  9. package/dist/Checkbox/Checkbox.cjs +3 -3
  10. package/dist/Checkbox/Checkbox.d.ts +1 -1
  11. package/dist/Checkbox/Checkbox.js +2 -2
  12. package/dist/Chip/Chip.cjs +3 -3
  13. package/dist/Chip/Chip.d.ts +1 -11
  14. package/dist/Chip/Chip.js +2 -2
  15. package/dist/Dialog/ModalDialog.cjs +6 -6
  16. package/dist/Dialog/ModalDialog.js +5 -5
  17. package/dist/Heading/Heading.cjs +3 -3
  18. package/dist/Heading/Heading.d.ts +1 -1
  19. package/dist/Heading/Heading.js +2 -2
  20. package/dist/IconButton/IconButton.cjs +5 -5
  21. package/dist/IconButton/IconButton.js +4 -4
  22. package/dist/LinkButton/LinkButton.cjs +6 -6
  23. package/dist/LinkButton/LinkButton.js +5 -5
  24. package/dist/Modal/Modal.cjs +8 -8
  25. package/dist/Modal/Modal.d.ts +1 -15
  26. package/dist/Modal/Modal.js +7 -7
  27. package/dist/Popover/Popover.cjs +7 -7
  28. package/dist/Popover/Popover.js +6 -6
  29. package/dist/RadioButton/RadioButton.cjs +3 -3
  30. package/dist/RadioButton/RadioButton.d.ts +1 -1
  31. package/dist/RadioButton/RadioButton.js +2 -2
  32. package/dist/RichSelect/RichSelectBox.cjs +12 -12
  33. package/dist/RichSelect/RichSelectBox.d.ts +1 -1
  34. package/dist/RichSelect/RichSelectBox.js +11 -11
  35. package/dist/RichSelect/RichSelectChip.cjs +4 -4
  36. package/dist/RichSelect/RichSelectChip.js +3 -3
  37. package/dist/RichSelect/RichSelectList.cjs +17 -17
  38. package/dist/RichSelect/RichSelectList.d.ts +1 -7
  39. package/dist/RichSelect/RichSelectList.js +16 -16
  40. package/dist/RichSelect/RichSelectRadioButton.cjs +4 -4
  41. package/dist/RichSelect/RichSelectRadioButton.d.ts +1 -1
  42. package/dist/RichSelect/RichSelectRadioButton.js +3 -3
  43. package/dist/RichSelect/RichSelectSection.cjs +3 -3
  44. package/dist/RichSelect/RichSelectSection.js +2 -2
  45. package/dist/SelectList/SelectList.cjs +4 -4
  46. package/dist/SelectList/SelectList.d.ts +1 -11
  47. package/dist/SelectList/SelectList.js +3 -3
  48. package/dist/TapArea/TapArea.d.ts +1 -1
  49. package/dist/TextArea/TextArea.cjs +3 -3
  50. package/dist/TextArea/TextArea.d.ts +0 -8
  51. package/dist/TextArea/TextArea.js +2 -2
  52. package/dist/TextField/TextField.cjs +3 -3
  53. package/dist/TextField/TextField.d.ts +1 -9
  54. package/dist/TextField/TextField.js +2 -2
  55. package/dist/Tooltip/Tooltip.cjs +3 -3
  56. package/dist/Tooltip/Tooltip.js +2 -2
  57. package/dist/Typography/Typography.cjs +2 -2
  58. package/dist/Typography/Typography.d.ts +2 -4
  59. package/dist/Typography/Typography.js +1 -1
  60. package/dist/__chunks/{HAI43LQ2.cjs → 272LSIIS.cjs} +3 -3
  61. package/dist/__chunks/{YAM7DAOZ.js → 2IXPTAJD.js} +2 -13
  62. package/dist/__chunks/2IXPTAJD.js.map +1 -0
  63. package/dist/__chunks/{P4NYXJEO.js → 2LV4KJ5U.js} +2 -2
  64. package/dist/__chunks/{4SQ2LELV.js → 44BDRP6O.js} +2 -2
  65. package/dist/__chunks/{S5B7CZKL.cjs → 52L4VM3G.cjs} +3 -3
  66. package/dist/__chunks/{GF53QRQ7.cjs → 6PNFY6W6.cjs} +10 -10
  67. package/dist/__chunks/{QMC6ZFD4.cjs → 7IV2L4B4.cjs} +3 -3
  68. package/dist/__chunks/{QX3BNIF3.js → 7JPWJT4Z.js} +2 -2
  69. package/dist/__chunks/{DSLMOEWK.js → B4BYSLWK.js} +2 -4
  70. package/dist/__chunks/B4BYSLWK.js.map +1 -0
  71. package/dist/__chunks/{LFL4LK4W.js → BBDZRW7U.js} +1 -1
  72. package/dist/__chunks/{LFL4LK4W.js.map → BBDZRW7U.js.map} +1 -1
  73. package/dist/__chunks/{ZX3VWSSV.js → BW5Q7OJQ.js} +4 -9
  74. package/dist/__chunks/BW5Q7OJQ.js.map +1 -0
  75. package/dist/__chunks/{2MQDGNBM.cjs → C2F5LYEQ.cjs} +9 -10
  76. package/dist/__chunks/C2F5LYEQ.cjs.map +1 -0
  77. package/dist/__chunks/{BYVURUTU.cjs → C3KZXHTV.cjs} +1 -1
  78. package/dist/__chunks/C3KZXHTV.cjs.map +1 -0
  79. package/dist/__chunks/{LFPS43OR.cjs → CA6LTZL7.cjs} +3 -3
  80. package/dist/__chunks/{ZQRUOZFX.cjs → CGBH73TM.cjs} +3 -3
  81. package/dist/__chunks/{SJRKFU77.js → DLZDG6HM.js} +6 -7
  82. package/dist/__chunks/{SJRKFU77.js.map → DLZDG6HM.js.map} +1 -1
  83. package/dist/__chunks/{YFEKBWH2.cjs → DOQ5YEJ4.cjs} +3 -3
  84. package/dist/__chunks/DOQ5YEJ4.cjs.map +1 -0
  85. package/dist/__chunks/{6CZHUML6.js → ECA33JJ5.js} +1 -1
  86. package/dist/__chunks/ECA33JJ5.js.map +1 -0
  87. package/dist/__chunks/{AV5B2KHQ.js → EDYJVVT6.js} +5 -5
  88. package/dist/__chunks/{JHWCONNT.cjs → EMUPGJ7I.cjs} +5 -7
  89. package/dist/__chunks/EMUPGJ7I.cjs.map +1 -0
  90. package/dist/__chunks/{MFNU3HMC.js → F2PXZG4G.js} +11 -13
  91. package/dist/__chunks/F2PXZG4G.js.map +1 -0
  92. package/dist/__chunks/{2IY4AFLZ.cjs → FPDQA475.cjs} +4 -6
  93. package/dist/__chunks/FPDQA475.cjs.map +1 -0
  94. package/dist/__chunks/{K6TH7UPQ.js → FWLRUQPX.js} +4 -6
  95. package/dist/__chunks/FWLRUQPX.js.map +1 -0
  96. package/dist/__chunks/{WYKA74SC.js → GJMFOAIB.js} +2 -2
  97. package/dist/__chunks/{2OLGBVRM.js → H6VD4C7I.js} +2 -2
  98. package/dist/__chunks/{N6YLXBLU.js → HLC7NU6Z.js} +2 -2
  99. package/dist/__chunks/{YF53K6PE.js → HXTCI7A3.js} +2 -2
  100. package/dist/__chunks/{SND6HHAL.cjs → JHUEQO5Q.cjs} +3 -3
  101. package/dist/__chunks/{MYNQCB3D.js → JYW7KNV7.js} +6 -8
  102. package/dist/__chunks/JYW7KNV7.js.map +1 -0
  103. package/dist/__chunks/{6RR4OL4S.cjs → L2CARKP7.cjs} +3 -3
  104. package/dist/__chunks/{JFI6TDAC.js → MEOMWLNG.js} +4 -4
  105. package/dist/__chunks/{LBA34HLF.cjs → MKZONAGT.cjs} +1 -1
  106. package/dist/__chunks/MKZONAGT.cjs.map +1 -0
  107. package/dist/__chunks/{ZTXNFBB6.js → N5N4HUQB.js} +2 -2
  108. package/dist/__chunks/{5VVFGPW6.cjs → PROA22UK.cjs} +7 -7
  109. package/dist/__chunks/{XL37HTXI.js → PX2UXNON.js} +2 -2
  110. package/dist/__chunks/{UVVLYBDQ.cjs → QVR3OSXW.cjs} +3 -3
  111. package/dist/__chunks/{M3PAAPMI.cjs → RAL6R27S.cjs} +1 -1
  112. package/dist/__chunks/RAL6R27S.cjs.map +1 -0
  113. package/dist/__chunks/{GUCD3CDN.cjs → S5CYISJE.cjs} +9 -11
  114. package/dist/__chunks/S5CYISJE.cjs.map +1 -0
  115. package/dist/__chunks/{BZ2W7SUB.cjs → S77S5MVX.cjs} +3 -3
  116. package/dist/__chunks/{DEXL5BXD.js → T6PXFSRX.js} +1 -1
  117. package/dist/__chunks/T6PXFSRX.js.map +1 -0
  118. package/dist/__chunks/{W54J4A4T.cjs → TY6VF7DF.cjs} +6 -11
  119. package/dist/__chunks/TY6VF7DF.cjs.map +1 -0
  120. package/dist/__chunks/{YQS4VRJE.cjs → UGIRVBGY.cjs} +22 -24
  121. package/dist/__chunks/UGIRVBGY.cjs.map +1 -0
  122. package/dist/__chunks/{J32DPXIR.js → UU3JE4UT.js} +2 -4
  123. package/dist/__chunks/UU3JE4UT.js.map +1 -0
  124. package/dist/__chunks/{423C767D.js → UVQS6LU3.js} +1 -1
  125. package/dist/__chunks/UVQS6LU3.js.map +1 -0
  126. package/dist/__chunks/{HHOEMHQE.cjs → VBSPIS4Y.cjs} +1 -1
  127. package/dist/__chunks/{HHOEMHQE.cjs.map → VBSPIS4Y.cjs.map} +1 -1
  128. package/dist/__chunks/{GNJNJVEO.cjs → WBKZQ5CY.cjs} +7 -9
  129. package/dist/__chunks/WBKZQ5CY.cjs.map +1 -0
  130. package/dist/__chunks/{OWUHE3QB.js → WHQ73FAY.js} +2 -2
  131. package/dist/__chunks/WHQ73FAY.js.map +1 -0
  132. package/dist/__chunks/{XCSW34UM.cjs → XCGRNBQH.cjs} +2 -13
  133. package/dist/__chunks/XCGRNBQH.cjs.map +1 -0
  134. package/dist/__chunks/{XIKD47WC.js → Y3D5XFML.js} +6 -30
  135. package/dist/__chunks/Y3D5XFML.js.map +1 -0
  136. package/dist/__chunks/{525TQTCQ.cjs → YICZLNHI.cjs} +8 -32
  137. package/dist/__chunks/YICZLNHI.cjs.map +1 -0
  138. package/dist/colors/backgroundColor.cjs +2 -2
  139. package/dist/colors/backgroundColor.d.ts +2 -2
  140. package/dist/colors/backgroundColor.js +1 -1
  141. package/dist/colors/border.cjs +2 -2
  142. package/dist/colors/border.d.ts +2 -2
  143. package/dist/colors/border.js +1 -1
  144. package/dist/colors/foregroundColor.cjs +2 -2
  145. package/dist/colors/foregroundColor.d.ts +2 -2
  146. package/dist/colors/foregroundColor.js +1 -1
  147. package/dist/constants.cjs +1 -17
  148. package/dist/constants.cjs.map +1 -1
  149. package/dist/constants.d.ts +2 -3
  150. package/dist/constants.js +0 -16
  151. package/dist/constants.js.map +1 -1
  152. package/dist/index.cjs +26 -26
  153. package/dist/index.js +25 -25
  154. package/package.json +1 -1
  155. package/dist/__chunks/2IY4AFLZ.cjs.map +0 -1
  156. package/dist/__chunks/2MQDGNBM.cjs.map +0 -1
  157. package/dist/__chunks/423C767D.js.map +0 -1
  158. package/dist/__chunks/525TQTCQ.cjs.map +0 -1
  159. package/dist/__chunks/6CZHUML6.js.map +0 -1
  160. package/dist/__chunks/BYVURUTU.cjs.map +0 -1
  161. package/dist/__chunks/DEXL5BXD.js.map +0 -1
  162. package/dist/__chunks/DSLMOEWK.js.map +0 -1
  163. package/dist/__chunks/GNJNJVEO.cjs.map +0 -1
  164. package/dist/__chunks/GUCD3CDN.cjs.map +0 -1
  165. package/dist/__chunks/J32DPXIR.js.map +0 -1
  166. package/dist/__chunks/JHWCONNT.cjs.map +0 -1
  167. package/dist/__chunks/K6TH7UPQ.js.map +0 -1
  168. package/dist/__chunks/LBA34HLF.cjs.map +0 -1
  169. package/dist/__chunks/M3PAAPMI.cjs.map +0 -1
  170. package/dist/__chunks/MFNU3HMC.js.map +0 -1
  171. package/dist/__chunks/MYNQCB3D.js.map +0 -1
  172. package/dist/__chunks/OWUHE3QB.js.map +0 -1
  173. package/dist/__chunks/W54J4A4T.cjs.map +0 -1
  174. package/dist/__chunks/XCSW34UM.cjs.map +0 -1
  175. package/dist/__chunks/XIKD47WC.js.map +0 -1
  176. package/dist/__chunks/YAM7DAOZ.js.map +0 -1
  177. package/dist/__chunks/YFEKBWH2.cjs.map +0 -1
  178. package/dist/__chunks/YQS4VRJE.cjs.map +0 -1
  179. package/dist/__chunks/ZX3VWSSV.js.map +0 -1
  180. /package/dist/__chunks/{HAI43LQ2.cjs.map → 272LSIIS.cjs.map} +0 -0
  181. /package/dist/__chunks/{P4NYXJEO.js.map → 2LV4KJ5U.js.map} +0 -0
  182. /package/dist/__chunks/{4SQ2LELV.js.map → 44BDRP6O.js.map} +0 -0
  183. /package/dist/__chunks/{S5B7CZKL.cjs.map → 52L4VM3G.cjs.map} +0 -0
  184. /package/dist/__chunks/{GF53QRQ7.cjs.map → 6PNFY6W6.cjs.map} +0 -0
  185. /package/dist/__chunks/{QMC6ZFD4.cjs.map → 7IV2L4B4.cjs.map} +0 -0
  186. /package/dist/__chunks/{QX3BNIF3.js.map → 7JPWJT4Z.js.map} +0 -0
  187. /package/dist/__chunks/{LFPS43OR.cjs.map → CA6LTZL7.cjs.map} +0 -0
  188. /package/dist/__chunks/{ZQRUOZFX.cjs.map → CGBH73TM.cjs.map} +0 -0
  189. /package/dist/__chunks/{AV5B2KHQ.js.map → EDYJVVT6.js.map} +0 -0
  190. /package/dist/__chunks/{WYKA74SC.js.map → GJMFOAIB.js.map} +0 -0
  191. /package/dist/__chunks/{2OLGBVRM.js.map → H6VD4C7I.js.map} +0 -0
  192. /package/dist/__chunks/{N6YLXBLU.js.map → HLC7NU6Z.js.map} +0 -0
  193. /package/dist/__chunks/{YF53K6PE.js.map → HXTCI7A3.js.map} +0 -0
  194. /package/dist/__chunks/{SND6HHAL.cjs.map → JHUEQO5Q.cjs.map} +0 -0
  195. /package/dist/__chunks/{6RR4OL4S.cjs.map → L2CARKP7.cjs.map} +0 -0
  196. /package/dist/__chunks/{JFI6TDAC.js.map → MEOMWLNG.js.map} +0 -0
  197. /package/dist/__chunks/{ZTXNFBB6.js.map → N5N4HUQB.js.map} +0 -0
  198. /package/dist/__chunks/{5VVFGPW6.cjs.map → PROA22UK.cjs.map} +0 -0
  199. /package/dist/__chunks/{XL37HTXI.js.map → PX2UXNON.js.map} +0 -0
  200. /package/dist/__chunks/{UVVLYBDQ.cjs.map → QVR3OSXW.cjs.map} +0 -0
  201. /package/dist/__chunks/{BZ2W7SUB.cjs.map → S77S5MVX.cjs.map} +0 -0
@@ -28,7 +28,7 @@ declare const Typography: React.ForwardRefExoticComponent<{
28
28
  *
29
29
  * @defaultValue "gray900"
30
30
  */
31
- color?: "primary" | "destructive-primary" | "gray700" | "gray900" | "white" | "inherit" | "destructive-darkBackground" | "success" | "success-darkBackground" | undefined;
31
+ color?: "gray700" | "gray900" | "white" | "inherit" | "primary" | "destructive-primary" | "destructive-darkBackground" | "success" | "success-darkBackground" | undefined;
32
32
  /**
33
33
  * Test id for the text
34
34
  */
@@ -111,11 +111,9 @@ declare const Typography: React.ForwardRefExoticComponent<{
111
111
  * * `semiBold`: 590
112
112
  * * `bold`: 710
113
113
  *
114
- * `interactive` and `heavy` are deprecated
115
- *
116
114
  * @defaultValue "regular"
117
115
  */
118
- weight?: "bold" | "regular" | "interactive" | "medium" | "semiBold" | "heavy" | undefined;
116
+ weight?: "bold" | "regular" | "medium" | "semiBold" | undefined;
119
117
  } & React.RefAttributes<HTMLDivElement>>;
120
118
 
121
119
  export { Typography as default };
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  Typography_default
4
- } from "../__chunks/YAM7DAOZ.js";
4
+ } from "../__chunks/2IXPTAJD.js";
5
5
  import "../__chunks/S6TNP7G5.js";
6
6
  import "../__chunks/4U4UW4AK.js";
7
7
  import "../__chunks/UWGNJENA.js";
@@ -4,7 +4,7 @@
4
4
  var _XLUVINJWcjs = require('./XLUVINJW.cjs');
5
5
 
6
6
 
7
- var _XCSW34UMcjs = require('./XCSW34UM.cjs');
7
+ var _XCGRNBQHcjs = require('./XCGRNBQH.cjs');
8
8
 
9
9
 
10
10
  var _QT6IRCGWcjs = require('./QT6IRCGW.cjs');
@@ -98,7 +98,7 @@ var Checkbox = ({
98
98
  }
99
99
  ),
100
100
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
101
- _XCSW34UMcjs.Typography_default,
101
+ _XCGRNBQHcjs.Typography_default,
102
102
  {
103
103
  size: typographySize[size],
104
104
  color: error ? "destructive-primary" : "gray900",
@@ -114,4 +114,4 @@ var Checkbox_default = Checkbox;
114
114
 
115
115
 
116
116
  exports.Checkbox_default = Checkbox_default;
117
- //# sourceMappingURL=HAI43LQ2.cjs.map
117
+ //# sourceMappingURL=272LSIIS.cjs.map
@@ -32,16 +32,6 @@ function textColor(color) {
32
32
  return colors_module_default.cambioBlackColor;
33
33
  }
34
34
  }
35
- function convertWeight(weight) {
36
- switch (weight) {
37
- case "interactive":
38
- return "medium";
39
- case "heavy":
40
- return "regular";
41
- default:
42
- return weight;
43
- }
44
- }
45
35
  var Typography = forwardRef(function Typography2({
46
36
  align = "start",
47
37
  as = "div",
@@ -59,7 +49,6 @@ var Typography = forwardRef(function Typography2({
59
49
  weight = "regular"
60
50
  }, ref) {
61
51
  const Tag = as;
62
- const weightStyles = Typography_module_default[`${convertWeight(weight)}`];
63
52
  return /* @__PURE__ */ jsx(
64
53
  Tag,
65
54
  {
@@ -67,7 +56,7 @@ var Typography = forwardRef(function Typography2({
67
56
  className: classNames(
68
57
  Typography_module_default.typography,
69
58
  Typography_module_default[align],
70
- weightStyles,
59
+ Typography_module_default[weight],
71
60
  fontStyle === "serif" ? Typography_module_default.serif : Typography_module_default.sansSerif,
72
61
  textColor(color),
73
62
  inline && Typography_module_default.inline,
@@ -91,4 +80,4 @@ var Typography_default = Typography;
91
80
  export {
92
81
  Typography_default
93
82
  };
94
- //# sourceMappingURL=YAM7DAOZ.js.map
83
+ //# sourceMappingURL=2IXPTAJD.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Typography/Typography.tsx","css-module:./Typography.module.css#css-module"],"sourcesContent":["import classNames from \"classnames\";\nimport { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./Typography.module.css\";\nimport colorStyles from \"../colors/colors.module.css\";\n\nfunction textColor(\n color:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"inherit\",\n): string {\n switch (color) {\n case \"gray700\":\n return colorStyles.cambioGray800Color;\n case \"white\":\n return colorStyles.cambioWhiteColor;\n case \"inherit\":\n return colorStyles.inheritColor;\n case \"destructive-primary\":\n return colorStyles.cambioDestructive900Color;\n case \"destructive-darkBackground\":\n return colorStyles.cambioDestructive100Color;\n case \"success\":\n return colorStyles.cambioSuccess900Color;\n case \"success-darkBackground\":\n return colorStyles.cambioSuccess100Color;\n // primary / gray900\n default:\n return colorStyles.cambioBlackColor;\n }\n}\n\n/**\n * [Typography](https://cambly-syntax.vercel.app/?path=/docs/components-typography--docs) is a component that renders text.\n */\nconst Typography = forwardRef<\n HTMLDivElement,\n {\n /**\n * Aligns the text to the left, right, or center of the container.\n * * `start` and `end` will align the text to the left or right of the container depending on the locale.\n * * `forceLeft` and `forceRight` will align the text to the left or right of the container regardless of the locale (should be used sparingly).\n *\n * @defaultValue \"start\"\n */\n align?: \"start\" | \"end\" | \"forceLeft\" | \"center\" | \"forceRight\";\n /**\n * DOM element to render as.\n *\n * @defaultValue \"div\"\n */\n as?: \"div\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n /**\n * The text to be rendered\n */\n children?: ReactNode;\n /**\n * The color of the text.\n *\n * @defaultValue \"gray900\"\n */\n color?:\n | \"gray900\"\n | \"gray700\"\n | \"primary\"\n | \"destructive-primary\"\n | \"destructive-darkBackground\"\n | \"success\"\n | \"success-darkBackground\"\n | \"white\"\n | \"inherit\";\n /**\n * Test id for the text\n */\n \"data-testid\"?: string;\n /**\n * Style of the font\n *\n * Classic only supports `sans-serif`\n *\n * @defaultValue \"sans-serif\"\n */\n fontStyle?: \"serif\" | \"sans-serif\";\n /**\n * The id for the element\n */\n id?: string;\n /**\n * Whether the text should flow inline with other elements.\n *\n * @defaultValue false\n */\n inline?: boolean;\n /**\n * The number of lines we should truncate the text at\n */\n lineClamp?: number | undefined;\n /**\n * Size of the text.\n *\n * Mobile (viewport width <= 480px)::\n * * `100`: 14px\n * * `200`: 16px\n * * `300`: 18px\n * * `400`: 20px\n * * `500`: 23px\n * * `600`: 26px\n * * `700`: 29px\n * * `800`: 33px\n * * `900`: 37px\n * * `1000`: 41px\n * * `1100`: 46px\n *\n * Desktop (viewport width > 480px):\n * * `100`: 13px\n * * `200`: 16px\n * * `300`: 20px\n * * `400`: 25px\n * * `500`: 31px\n * * `600`: 39px\n * * `700`: 49px\n * * `800`: 61px\n * * `900`: 76px\n * * `1000`: 95px\n * * `1100`: 119px\n *\n * @defaultValue 200\n */\n size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100;\n /**\n * The tooltip to be displayed when the user hovers the text\n */\n tooltip?: string;\n /**\n * Whether the text should be transformed to uppercase.\n *\n * @defaultValue \"none\"\n */\n transform?: \"none\" | \"uppercase\";\n /**\n * Whether the text has an underline.\n *\n * @defaultValue false\n */\n underline?: boolean;\n /**\n * Indicates the boldness of the text.\n *\n * * `regular`: 400\n * * `medium`: 510\n * * `semiBold`: 590\n * * `bold`: 710\n *\n * @defaultValue \"regular\"\n */\n weight?: \"regular\" | \"medium\" | \"semiBold\" | \"bold\";\n }\n>(function Typography(\n {\n align = \"start\",\n as = \"div\",\n children,\n color = \"gray900\",\n \"data-testid\": dataTestId,\n fontStyle = \"sans-serif\",\n id,\n inline = false,\n lineClamp = undefined,\n size = 200,\n tooltip,\n transform = \"none\",\n underline = false,\n weight = \"regular\",\n },\n ref,\n): ReactElement {\n const Tag = as;\n\n return (\n <Tag\n id={id}\n className={classNames(\n styles.typography,\n styles[align],\n styles[weight],\n fontStyle === \"serif\" ? styles.serif : styles.sansSerif,\n textColor(color),\n inline && styles.inline,\n styles[`size${size}`],\n transform === \"uppercase\" && styles.uppercase,\n underline && styles.underline,\n lineClamp != null && styles.lineClamp,\n )}\n data-testid={dataTestId}\n style={{\n WebkitLineClamp: lineClamp,\n }}\n title={tooltip}\n ref={ref}\n >\n {children}\n </Tag>\n );\n});\n\nexport default Typography;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Typography/Typography.module.css\"; export default {\"typography\":\"_typography_t1t27_1\",\"sansSerif\":\"_sansSerif_t1t27_22\",\"serif\":\"_serif_t1t27_27\",\"size100\":\"_size100_t1t27_71\",\"size200\":\"_size200_t1t27_75\",\"size300\":\"_size300_t1t27_79\",\"size400\":\"_size400_t1t27_83\",\"size500\":\"_size500_t1t27_87\",\"size600\":\"_size600_t1t27_91\",\"size700\":\"_size700_t1t27_95\",\"size800\":\"_size800_t1t27_99\",\"size900\":\"_size900_t1t27_103\",\"size1000\":\"_size1000_t1t27_144\",\"size1100\":\"_size1100_t1t27_148\",\"center\":\"_center_t1t27_154\",\"forceLeft\":\"_forceLeft_t1t27_158\",\"forceRight\":\"_forceRight_t1t27_162\",\"start\":\"_start_t1t27_166\",\"end\":\"_end_t1t27_170\",\"regular\":\"_regular_t1t27_176\",\"medium\":\"_medium_t1t27_180\",\"semiBold\":\"_semiBold_t1t27_184\",\"bold\":\"_bold_t1t27_188\",\"underline\":\"_underline_t1t27_192\",\"inline\":\"_inline_t1t27_196\",\"uppercase\":\"_uppercase_t1t27_200\",\"lineClamp\":\"_lineClamp_t1t27_204\"}"],"mappings":";;;;;;AAAA,OAAO,gBAAgB;AACvB,SAAS,kBAAqD;;;ACDsC,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,aAAY,uBAAsB,SAAQ,mBAAkB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,sBAAqB,YAAW,uBAAsB,YAAW,uBAAsB,UAAS,qBAAoB,aAAY,wBAAuB,cAAa,yBAAwB,SAAQ,oBAAmB,OAAM,kBAAiB,WAAU,sBAAqB,UAAS,qBAAoB,YAAW,uBAAsB,QAAO,mBAAkB,aAAY,wBAAuB,UAAS,qBAAoB,aAAY,wBAAuB,aAAY,uBAAsB;;;ADyLl7B;AApLJ,SAAS,UACP,OAUQ;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,IAErB;AACE,aAAO,sBAAY;AAAA,EACvB;AACF;AAKA,IAAM,aAAa,WA0HjB,SAASA,YACT;AAAA,EACE,QAAQ;AAAA,EACR,KAAK;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,YAAY;AAAA,EACZ;AAAA,EACA,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,OAAO;AAAA,EACP;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,SAAS;AACX,GACA,KACc;AACd,QAAM,MAAM;AAEZ,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,0BAAO;AAAA,QACP,0BAAO,KAAK;AAAA,QACZ,0BAAO,MAAM;AAAA,QACb,cAAc,UAAU,0BAAO,QAAQ,0BAAO;AAAA,QAC9C,UAAU,KAAK;AAAA,QACf,UAAU,0BAAO;AAAA,QACjB,0BAAO,OAAO,MAAM;AAAA,QACpB,cAAc,eAAe,0BAAO;AAAA,QACpC,aAAa,0BAAO;AAAA,QACpB,aAAa,QAAQ,0BAAO;AAAA,MAC9B;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,iBAAiB;AAAA,MACnB;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,qBAAQ;","names":["Typography"]}
@@ -4,7 +4,7 @@ import {
4
4
  } from "./TZGJS522.js";
5
5
  import {
6
6
  IconButton_default
7
- } from "./JFI6TDAC.js";
7
+ } from "./MEOMWLNG.js";
8
8
  import {
9
9
  padding_module_default
10
10
  } from "./ZOWOFYUE.js";
@@ -157,4 +157,4 @@ export {
157
157
  AriaModal,
158
158
  ModalDialog_default
159
159
  };
160
- //# sourceMappingURL=P4NYXJEO.js.map
160
+ //# sourceMappingURL=2LV4KJ5U.js.map
@@ -7,7 +7,7 @@ import {
7
7
  } from "./J6DAGNNN.js";
8
8
  import {
9
9
  Typography_default
10
- } from "./YAM7DAOZ.js";
10
+ } from "./2IXPTAJD.js";
11
11
  import {
12
12
  colors_module_default
13
13
  } from "./S6TNP7G5.js";
@@ -129,4 +129,4 @@ var RadioButton_default = RadioButton;
129
129
  export {
130
130
  RadioButton_default
131
131
  };
132
- //# sourceMappingURL=4SQ2LELV.js.map
132
+ //# sourceMappingURL=44BDRP6O.js.map
@@ -7,7 +7,7 @@ var _XLUVINJWcjs = require('./XLUVINJW.cjs');
7
7
  var _DB7KX3J2cjs = require('./DB7KX3J2.cjs');
8
8
 
9
9
 
10
- var _XCSW34UMcjs = require('./XCSW34UM.cjs');
10
+ var _XCGRNBQHcjs = require('./XCGRNBQH.cjs');
11
11
 
12
12
 
13
13
  var _QT6IRCGWcjs = require('./QT6IRCGW.cjs');
@@ -113,7 +113,7 @@ var RadioButton = ({
113
113
  }
114
114
  ),
115
115
  label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
116
- _XCSW34UMcjs.Typography_default,
116
+ _XCGRNBQHcjs.Typography_default,
117
117
  {
118
118
  size: size === "md" ? 200 : 100,
119
119
  color: error ? "destructive-primary" : "gray900",
@@ -129,4 +129,4 @@ var RadioButton_default = RadioButton;
129
129
 
130
130
 
131
131
  exports.RadioButton_default = RadioButton_default;
132
- //# sourceMappingURL=S5B7CZKL.cjs.map
132
+ //# sourceMappingURL=52L4VM3G.cjs.map
@@ -4,19 +4,19 @@
4
4
  var _C5XPZTFOcjs = require('./C5XPZTFO.cjs');
5
5
 
6
6
 
7
- var _GUCD3CDNcjs = require('./GUCD3CDN.cjs');
7
+ var _S5CYISJEcjs = require('./S5CYISJE.cjs');
8
8
 
9
9
 
10
10
  var _DMA6PPUZcjs = require('./DMA6PPUZ.cjs');
11
11
 
12
12
 
13
- var _6RR4OL4Scjs = require('./6RR4OL4S.cjs');
13
+ var _L2CARKP7cjs = require('./L2CARKP7.cjs');
14
14
 
15
15
 
16
- var _SND6HHALcjs = require('./SND6HHAL.cjs');
16
+ var _JHUEQO5Qcjs = require('./JHUEQO5Q.cjs');
17
17
 
18
18
 
19
- var _UVVLYBDQcjs = require('./UVVLYBDQ.cjs');
19
+ var _QVR3OSXWcjs = require('./QVR3OSXW.cjs');
20
20
 
21
21
 
22
22
 
@@ -169,7 +169,7 @@ var RichSelectBox = _react.forwardRef.call(void 0,
169
169
  justifyContent: "end",
170
170
  children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _C5XPZTFOcjs.ButtonGroup_default, { orientation: "horizontal", children: [
171
171
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
172
- _GUCD3CDNcjs.Button_default,
172
+ _S5CYISJEcjs.Button_default,
173
173
  {
174
174
  onClick: clearChanges,
175
175
  color: "secondary",
@@ -179,7 +179,7 @@ var RichSelectBox = _react.forwardRef.call(void 0,
179
179
  }
180
180
  ),
181
181
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
182
- _GUCD3CDNcjs.Button_default,
182
+ _S5CYISJEcjs.Button_default,
183
183
  {
184
184
  onClick: saveChanges,
185
185
  text: primaryButtonText,
@@ -198,9 +198,9 @@ var RichSelectBox = _react.forwardRef.call(void 0,
198
198
  }
199
199
  );
200
200
  var RichSelectBox_default = Object.assign(RichSelectBox, {
201
- Section: _SND6HHALcjs.RichSelectSection_default,
202
- Chip: _6RR4OL4Scjs.RichSelectChip_default,
203
- RadioButton: _UVVLYBDQcjs.RichSelectRadioButton_default
201
+ Section: _JHUEQO5Qcjs.RichSelectSection_default,
202
+ Chip: _L2CARKP7cjs.RichSelectChip_default,
203
+ RadioButton: _QVR3OSXWcjs.RichSelectRadioButton_default
204
204
  });
205
205
 
206
206
 
@@ -208,4 +208,4 @@ var RichSelectBox_default = Object.assign(RichSelectBox, {
208
208
 
209
209
 
210
210
  exports.convertSelection = convertSelection; exports.RichSelectBoxContext = RichSelectBoxContext; exports.RichSelectBox_default = RichSelectBox_default;
211
- //# sourceMappingURL=GF53QRQ7.cjs.map
211
+ //# sourceMappingURL=6PNFY6W6.cjs.map
@@ -10,7 +10,7 @@ var _IL22HCBFcjs = require('./IL22HCBF.cjs');
10
10
  var _CHDS4D44cjs = require('./CHDS4D44.cjs');
11
11
 
12
12
 
13
- var _XCSW34UMcjs = require('./XCSW34UM.cjs');
13
+ var _XCGRNBQHcjs = require('./XCGRNBQH.cjs');
14
14
 
15
15
 
16
16
  var _QT6IRCGWcjs = require('./QT6IRCGW.cjs');
@@ -102,7 +102,7 @@ var AriaTooltip = _react.forwardRef.call(void 0, function AriaTooltip2(_a, ref)
102
102
  childrenProp,
103
103
  (children, { isEntering, isExiting }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
104
104
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TooltipArrow, {}),
105
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _XCSW34UMcjs.Typography_default, { size: 100, color: "white", children }),
105
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _XCGRNBQHcjs.Typography_default, { size: 100, color: "white", children }),
106
106
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
107
107
  _E5P6WRJDcjs.OverlayVisibility,
108
108
  {
@@ -162,4 +162,4 @@ var Tooltip_default = Tooltip;
162
162
 
163
163
 
164
164
  exports.AriaTooltip = AriaTooltip; exports.Tooltip_default = Tooltip_default;
165
- //# sourceMappingURL=QMC6ZFD4.cjs.map
165
+ //# sourceMappingURL=7IV2L4B4.cjs.map
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  RadioButton_default
4
- } from "./4SQ2LELV.js";
4
+ } from "./44BDRP6O.js";
5
5
  import {
6
6
  RichSelectItem_default
7
7
  } from "./ODMJANSX.js";
@@ -37,4 +37,4 @@ var RichSelectRadioButton_default = forwardRef(
37
37
  export {
38
38
  RichSelectRadioButton_default
39
39
  };
40
- //# sourceMappingURL=QX3BNIF3.js.map
40
+ //# sourceMappingURL=7JPWJT4Z.js.map
@@ -4,7 +4,7 @@ import {
4
4
  } from "./J6DAGNNN.js";
5
5
  import {
6
6
  Typography_default
7
- } from "./YAM7DAOZ.js";
7
+ } from "./2IXPTAJD.js";
8
8
  import {
9
9
  useIsHydrated
10
10
  } from "./JB65NEXK.js";
@@ -32,7 +32,6 @@ var TextArea = forwardRef(
32
32
  maxLength = 1024,
33
33
  placeholder = "",
34
34
  rows = 3,
35
- size = "md",
36
35
  value = "",
37
36
  onChange
38
37
  }, forwardedRef) {
@@ -59,7 +58,6 @@ var TextArea = forwardRef(
59
58
  "textarea",
60
59
  {
61
60
  "data-testid": dataTestId,
62
- "data-size": size,
63
61
  ref: forwardedRef,
64
62
  className: classNames(TextField_module_default.textfield, TextArea_module_default.textarea, {
65
63
  [TextField_module_default.inputError]: errorText
@@ -91,4 +89,4 @@ var TextArea_default = TextArea;
91
89
  export {
92
90
  TextArea_default
93
91
  };
94
- //# sourceMappingURL=DSLMOEWK.js.map
92
+ //# sourceMappingURL=B4BYSLWK.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/TextArea/TextArea.tsx","css-module:./TextArea.module.css#css-module","css-module:../TextField/TextField.module.css#css-module"],"sourcesContent":["import Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\nimport React, { type ReactElement, useId, forwardRef } from \"react\";\nimport styles from \"./TextArea.module.css\";\nimport textFieldStyles from \"../TextField/TextField.module.css\";\nimport classNames from \"classnames\";\nimport useIsHydrated from \"../useIsHydrated\";\n\ntype TextAreaProps = {\n /**\n * A data-testid to make querying for the TextArea easier.\n */\n \"data-testid\"?: string;\n /**\n * If true, the TextArea will be disabled.\n */\n disabled?: boolean;\n /**\n * Text shown below TextArea if there is an input error.\n */\n errorText?: string;\n /**\n * Informative helper text shown below TextArea\n */\n helperText?: string;\n /**\n * TextField id, if not provided, a unique id will be generated\n */\n id?: string;\n /**\n * TextArea visible label\n */\n label: string;\n /**\n * Maximum number of characters allowed in the TextArea\n */\n maxLength?: number;\n /**\n * Callback fired when the value is changed.\n */\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n /**\n * Placeholder text to display when TextArea is empty\n */\n placeholder?: string;\n /**\n * Number of rows to display\n */\n rows?: number;\n /**\n * Value of the TextArea\n */\n value: string;\n};\n\n/**\n * [TextArea](https://cambly-syntax.vercel.app/?path=/docs/components-textarea--docs) allows users to enter multiple lines of text.\n */\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea(\n {\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText = \"\",\n helperText = \"\",\n id,\n label,\n maxLength = 1024,\n placeholder = \"\",\n rows = 3,\n value = \"\",\n onChange,\n }: TextAreaProps,\n forwardedRef,\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 position=\"relative\"\n >\n <label className={textFieldStyles.label} htmlFor={inputId}>\n <Box paddingX={1}>\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </label>\n <Typography size={100}>\n <textarea\n data-testid={dataTestId}\n ref={forwardedRef}\n className={classNames(textFieldStyles.textfield, styles.textarea, {\n [textFieldStyles.inputError]: errorText,\n })}\n id={inputId}\n placeholder={placeholder}\n maxLength={maxLength}\n onChange={onChange}\n rows={rows}\n value={value}\n disabled={disabled}\n />\n </Typography>\n {(helperText || errorText) && (\n <Box paddingX={1}>\n <Typography\n size={100}\n color={errorText ? \"destructive-primary\" : \"gray700\"}\n >\n {errorText || helperText}\n </Typography>\n </Box>\n )}\n </Box>\n );\n },\n);\n\nexport default TextArea;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextArea/TextArea.module.css\"; export default {\"textarea\":\"_textarea_zkjej_1\"}","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_wgza3_1\",\"label\":\"_label_wgza3_22\",\"md\":\"_md_wgza3_26\",\"height\":\"_height_wgza3_30\",\"inputError\":\"_inputError_wgza3_34\"}"],"mappings":";;;;;;;;;;;;AAEA,SAAmC,OAAO,kBAAkB;;;ACFoC,IAAO,0BAAQ,EAAC,YAAW,oBAAmB;;;ACA5C,IAAO,2BAAQ,EAAC,aAAY,sBAAqB,SAAQ,mBAAkB,MAAK,gBAAe,UAAS,oBAAmB,cAAa,uBAAsB;;;AFKhQ,OAAO,gBAAgB;AA4EjB,SAcM,KAdN;AAvBN,IAAM,WAAW;AAAA,EACf,SAASA,UACP;AAAA,IACE,eAAe;AAAA,IACf,UAAU,eAAe;AAAA,IACzB,YAAY;AAAA,IACZ,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,OAAO;AAAA,IACP,QAAQ;AAAA,IACR;AAAA,EACF,GACA,cACc;AACd,UAAM,aAAa,cAAc;AACjC,UAAM,WAAW,CAAC,cAAc;AAChC,UAAM,UAAU,MAAM;AACtB,UAAM,UAAU,kBAAM;AAEtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,KAAK;AAAA,QACL,OAAM;AAAA,QACN,2BAA2B;AAAA,UACzB,SAAS;AAAA,YACP,SAAS,WAAW,MAAM;AAAA,UAC5B;AAAA,QACF;AAAA,QACA,UAAS;AAAA,QAET;AAAA,8BAAC,WAAM,WAAW,yBAAgB,OAAO,SAAS,SAChD,8BAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,KAAK,OAAM,WAC1B,iBACH,GACF,GACF;AAAA,UACA,oBAAC,sBAAW,MAAM,KAChB;AAAA,YAAC;AAAA;AAAA,cACC,eAAa;AAAA,cACb,KAAK;AAAA,cACL,WAAW,WAAW,yBAAgB,WAAW,wBAAO,UAAU;AAAA,gBAChE,CAAC,yBAAgB,UAAU,GAAG;AAAA,cAChC,CAAC;AAAA,cACD,IAAI;AAAA,cACJ;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA;AAAA,UACF,GACF;AAAA,WACE,cAAc,cACd,oBAAC,eAAI,UAAU,GACb;AAAA,YAAC;AAAA;AAAA,cACC,MAAM;AAAA,cACN,OAAO,YAAY,wBAAwB;AAAA,cAE1C,uBAAa;AAAA;AAAA,UAChB,GACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,IAAO,mBAAQ;","names":["TextArea"]}
@@ -8,4 +8,4 @@ export {
8
8
  ColorBaseDestructive700,
9
9
  ColorBaseGray800
10
10
  };
11
- //# sourceMappingURL=LFL4LK4W.js.map
11
+ //# sourceMappingURL=BBDZRW7U.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Fri, 05 Apr 2024 21:45:19 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\nexport const SyntaxFontSansSerif = \"-apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif\";\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 Mon, 08 Apr 2024 16:35:22 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\nexport const SyntaxFontSansSerif = \"-apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif\";\n"],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB;","names":[]}
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  Heading_default
4
- } from "./N6YLXBLU.js";
4
+ } from "./HLC7NU6Z.js";
5
5
  import {
6
6
  StopScroll
7
7
  } from "./QQT35OLE.js";
@@ -13,7 +13,7 @@ import {
13
13
  } from "./HVA7R2EL.js";
14
14
  import {
15
15
  IconButton_default
16
- } from "./JFI6TDAC.js";
16
+ } from "./MEOMWLNG.js";
17
17
  import {
18
18
  Box_default
19
19
  } from "./J6DAGNNN.js";
@@ -23,10 +23,6 @@ var Modal_module_default = { "backdrop": "_backdrop_17lbk_1", "closeButton": "_c
23
23
 
24
24
  // src/Modal/Modal.tsx
25
25
  import { jsx, jsxs } from "react/jsx-runtime";
26
- var sizeWidth = {
27
- sm: 600,
28
- lg: 600
29
- };
30
26
  function XIcon({ className }) {
31
27
  return /* @__PURE__ */ jsx(
32
28
  "svg",
@@ -47,7 +43,6 @@ function Modal({
47
43
  onDismiss,
48
44
  footer,
49
45
  accessibilityCloseLabel = "close modal",
50
- size = "sm",
51
46
  zIndex = 1,
52
47
  "data-testid": dataTestId
53
48
  }) {
@@ -71,7 +66,7 @@ function Modal({
71
66
  marginBottom: 8,
72
67
  minWidth: 240,
73
68
  maxHeight: "calc(100vh - 64px)",
74
- maxWidth: sizeWidth[size],
69
+ maxWidth: 600,
75
70
  overflow: "hidden",
76
71
  position: "relative",
77
72
  width: "100%",
@@ -135,4 +130,4 @@ Modal.displayName = "Modal";
135
130
  export {
136
131
  Modal
137
132
  };
138
- //# sourceMappingURL=ZX3VWSSV.js.map
133
+ //# sourceMappingURL=BW5Q7OJQ.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["css-module:./Modal.module.css#css-module","../../src/Modal/Modal.tsx"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Modal/Modal.module.css\"; export default {\"backdrop\":\"_backdrop_17lbk_1\",\"closeButton\":\"_closeButton_17lbk_10\"}","import { type ReactElement } from \"react\";\n\nimport Heading from \"../Heading/Heading\";\nimport Box from \"../Box/Box\";\n\nimport FocusTrap from \"./FocusTrap\";\nimport StopScroll from \"./StopScroll\";\nimport Layer from \"./Layer\";\nimport styles from \"./Modal.module.css\";\nimport IconButton from \"../IconButton/IconButton\";\n\nfunction XIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"currentColor\"\n focusable=\"false\"\n aria-hidden=\"true\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"></path>\n </svg>\n );\n}\n\n/**\n * [Modal](https://cambly-syntax.vercel.app/?path=/docs/components-modal--docs) is a dialog that appears on top of the main content and locks user interaction within the modal.\n *\n ```\n const [showModal, setShowModal] = useState(false)\n\n return (\n <>\n {showModal && <Modal\n header=\"header text\"\n onDismiss={() => setShowModal(false)}\n footer={\n <>\n <Button\n text=\"Cancel\"\n color=\"secondary\"\n onClick={() => {}}\n />\n <Button\n text=\"Confirm\"\n onClick={() => {}}\n />\n </>\n }\n >\n <Typography>\n Body text goes here!\n </Typography>\n </Modal> }\n </>\n )\n ```\n */\nexport default function Modal({\n header,\n children,\n image,\n onDismiss,\n footer,\n accessibilityCloseLabel = \"close modal\",\n zIndex = 1,\n \"data-testid\": dataTestId,\n}: {\n /**\n * The modal's main content. Should typically take in `Typography`'d text.\n */\n children: JSX.Element;\n /**\n * The header inside a modal as a string.\n */\n header: string;\n /**\n * What the X button (or clicking out of the modal area) does.\n * Typically used for closing the Modal\n */\n onDismiss: () => void;\n /**\n * The optional image rendered above the Modal.\n * Image\n * * Size should be 600w x 200h\n * * Be sure to set width=\"100%\" on the image\n * If images aren't that sized, should ask design to give another image.\n */\n image?: JSX.Element;\n /**\n * The footer for the bottom area of the Modal. Typically used for rendering buttons.\n * * Use Syntax `Button` and pass it into footer.\n * * If one button, just pass it in. If two, wrap in a React fragment (`<> </>`)\n * * If two(2) buttons, put primary button _second_.\n *\n <>\n <Button\n text=\"Cancel\"\n color=\"secondary\"\n onClick={() => {}}\n />\n <Button\n text=\"Confirm\"\n onClick={() => {}}\n />\n </>\n */\n footer?: JSX.Element;\n /**\n * The accessibilty text on the close button.\n * (Sets the aria-label of the button)\n *\n *\n * @defaultValue close modal\n */\n accessibilityCloseLabel?: string;\n /**\n * The z-index for the modal.\n * Typically used if there are other things on the page with higher z-index and you need this overlayed on top.\n *\n * @defaultValue 0\n */\n zIndex?: number;\n /**\n * Test id for the modal\n */\n \"data-testid\"?: string;\n}): ReactElement {\n return (\n <Layer zIndex={zIndex}>\n <StopScroll>\n <FocusTrap>\n <div\n className={styles.backdrop}\n role=\"presentation\"\n onClick={(e) => e.target === e.currentTarget && onDismiss()}\n onKeyDown={(e) => e.key === \"Escape\" && onDismiss()}\n >\n <Box\n data-testid={dataTestId}\n backgroundColor=\"white\"\n rounding=\"md\"\n display=\"flex\"\n marginStart={4}\n marginEnd={4}\n marginTop={8}\n marginBottom={8}\n minWidth={240}\n maxHeight=\"calc(100vh - 64px)\"\n maxWidth={600}\n overflow=\"hidden\"\n position=\"relative\"\n width=\"100%\"\n >\n <Box\n position=\"absolute\"\n dangerouslySetInlineStyle={{\n __style: { top: 4, right: 4 },\n }}\n >\n <IconButton\n accessibilityLabel={accessibilityCloseLabel}\n color={image ? \"primary\" : \"tertiary\"}\n on={image ? \"darkBackground\" : \"lightBackground\"}\n onClick={onDismiss}\n size=\"md\"\n icon={XIcon}\n />\n </Box>\n\n <Box display=\"flex\" direction=\"column\" width=\"100%\">\n {image && <Box>{image}</Box>}\n <Box padding={6}>\n <Heading as=\"h1\" size={600} fontStyle=\"serif\">\n {header}\n </Heading>\n </Box>\n <Box\n height=\"100%\"\n overflowY=\"auto\"\n paddingX={6}\n marginBottom={footer ? 0 : 6}\n >\n {children}\n </Box>\n {footer && (\n <Box\n display=\"flex\"\n direction=\"column\"\n gap={3}\n smDirection=\"row\"\n smJustifyContent=\"end\"\n lgDirection=\"row\"\n lgJustifyContent=\"end\"\n padding={6}\n >\n {footer}\n </Box>\n )}\n </Box>\n </Box>\n </div>\n </FocusTrap>\n </StopScroll>\n </Layer>\n );\n}\n\nModal.displayName = \"Modal\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAA0F,IAAO,uBAAQ,EAAC,YAAW,qBAAoB,eAAc,wBAAuB;;;ACoBxK,cAsJQ,YAtJR;AATN,SAAS,MAAM,EAAE,UAAU,GAA2B;AACpD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,WAAU;AAAA,MACV,eAAY;AAAA,MACZ,SAAQ;AAAA,MAER,8BAAC,UAAK,GAAE,yGAAwG;AAAA;AAAA,EAClH;AAEJ;AAmCe,SAAR,MAAuB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,0BAA0B;AAAA,EAC1B,SAAS;AAAA,EACT,eAAe;AACjB,GA4DiB;AACf,SACE,oBAAC,SAAM,QACL,8BAAC,cACC,8BAAC,aACC;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,qBAAO;AAAA,MAClB,MAAK;AAAA,MACL,SAAS,CAAC,MAAM,EAAE,WAAW,EAAE,iBAAiB,UAAU;AAAA,MAC1D,WAAW,CAAC,MAAM,EAAE,QAAQ,YAAY,UAAU;AAAA,MAElD;AAAA,QAAC;AAAA;AAAA,UACC,eAAa;AAAA,UACb,iBAAgB;AAAA,UAChB,UAAS;AAAA,UACT,SAAQ;AAAA,UACR,aAAa;AAAA,UACb,WAAW;AAAA,UACX,WAAW;AAAA,UACX,cAAc;AAAA,UACd,UAAU;AAAA,UACV,WAAU;AAAA,UACV,UAAU;AAAA,UACV,UAAS;AAAA,UACT,UAAS;AAAA,UACT,OAAM;AAAA,UAEN;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,UAAS;AAAA,gBACT,2BAA2B;AAAA,kBACzB,SAAS,EAAE,KAAK,GAAG,OAAO,EAAE;AAAA,gBAC9B;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,oBAAoB;AAAA,oBACpB,OAAO,QAAQ,YAAY;AAAA,oBAC3B,IAAI,QAAQ,mBAAmB;AAAA,oBAC/B,SAAS;AAAA,oBACT,MAAK;AAAA,oBACL,MAAM;AAAA;AAAA,gBACR;AAAA;AAAA,YACF;AAAA,YAEA,qBAAC,eAAI,SAAQ,QAAO,WAAU,UAAS,OAAM,QAC1C;AAAA,uBAAS,oBAAC,eAAK,iBAAM;AAAA,cACtB,oBAAC,eAAI,SAAS,GACZ,8BAAC,mBAAQ,IAAG,MAAK,MAAM,KAAK,WAAU,SACnC,kBACH,GACF;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,QAAO;AAAA,kBACP,WAAU;AAAA,kBACV,UAAU;AAAA,kBACV,cAAc,SAAS,IAAI;AAAA,kBAE1B;AAAA;AAAA,cACH;AAAA,cACC,UACC;AAAA,gBAAC;AAAA;AAAA,kBACC,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,KAAK;AAAA,kBACL,aAAY;AAAA,kBACZ,kBAAiB;AAAA,kBACjB,aAAY;AAAA,kBACZ,kBAAiB;AAAA,kBACjB,SAAS;AAAA,kBAER;AAAA;AAAA,cACH;AAAA,eAEJ;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF,GACF,GACF,GACF;AAEJ;AAEA,MAAM,cAAc;","names":[]}
@@ -7,16 +7,16 @@ var _5JUNB754cjs = require('./5JUNB754.cjs');
7
7
  var _UAXX2ZEQcjs = require('./UAXX2ZEQ.cjs');
8
8
 
9
9
 
10
- var _LBA34HLFcjs = require('./LBA34HLF.cjs');
10
+ var _MKZONAGTcjs = require('./MKZONAGT.cjs');
11
11
 
12
12
 
13
- var _BYVURUTUcjs = require('./BYVURUTU.cjs');
13
+ var _C3KZXHTVcjs = require('./C3KZXHTV.cjs');
14
14
 
15
15
 
16
- var _M3PAAPMIcjs = require('./M3PAAPMI.cjs');
16
+ var _RAL6R27Scjs = require('./RAL6R27S.cjs');
17
17
 
18
18
 
19
- var _XCSW34UMcjs = require('./XCSW34UM.cjs');
19
+ var _XCGRNBQHcjs = require('./XCGRNBQH.cjs');
20
20
 
21
21
  // src/LinkButton/LinkButton.tsx
22
22
  var _react = require('react');
@@ -45,8 +45,8 @@ var LinkButton = _react.forwardRef.call(void 0,
45
45
  on = "lightBackground",
46
46
  onClick
47
47
  }, ref) => {
48
- const foregroundColorClass = _LBA34HLFcjs.foregroundColor.call(void 0, color, on);
49
- const backgroundColorClass = _M3PAAPMIcjs.backgroundColor.call(void 0, color, on);
48
+ const foregroundColorClass = _MKZONAGTcjs.foregroundColor.call(void 0, color, on);
49
+ const backgroundColorClass = _RAL6R27Scjs.backgroundColor.call(void 0, color, on);
50
50
  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
51
51
  "a",
52
52
  {
@@ -60,7 +60,7 @@ var LinkButton = _react.forwardRef.call(void 0,
60
60
  Button_module_default.button,
61
61
  foregroundColorClass,
62
62
  backgroundColorClass,
63
- _BYVURUTUcjs.border.call(void 0, color, on),
63
+ _C3KZXHTVcjs.border.call(void 0, color, on),
64
64
  Button_module_default[size],
65
65
  {
66
66
  [Button_module_default.fullWidth]: fullWidth,
@@ -80,11 +80,10 @@ var LinkButton = _react.forwardRef.call(void 0,
80
80
  )
81
81
  }
82
82
  ),
83
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _XCSW34UMcjs.Typography_default, { size: _5JUNB754cjs.textVariant_default[size], children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
83
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _XCGRNBQHcjs.Typography_default, { size: _5JUNB754cjs.textVariant_default[size], weight: "medium", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
84
84
  "span",
85
85
  {
86
86
  className: foregroundColorClass,
87
- style: { fontWeight: 500 },
88
87
  children: text
89
88
  }
90
89
  ) }),
@@ -109,4 +108,4 @@ var LinkButton_default = LinkButton;
109
108
 
110
109
 
111
110
  exports.LinkButton_default = LinkButton_default;
112
- //# sourceMappingURL=2MQDGNBM.cjs.map
111
+ //# sourceMappingURL=C2F5LYEQ.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,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;ACAtc,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;AFiHpL,SAsBI,KAtBJ;AAtBN,IAAM,aAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT,KAAK;AAAA,IACL;AAAA,EACF,GACA,QACG;AACH,UAAM,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,UACtD;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,uBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb;AAAA,cACF;AAAA;AAAA,UACF;AAAA,UAEF,oBAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,QAAO,UAC1C;AAAA,YAAC;AAAA;AAAA,cAEC,WAAW;AAAA,cAEV;AAAA;AAAA,UACH,GACF;AAAA,UACC,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAS,IAAI;AAAA,gBACb;AAAA,cACF;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ","sourcesContent":["import { forwardRef, type HtmlHTMLAttributes } from \"react\";\nimport classNames from \"classnames\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport buttonStyles from \"../Button/Button.module.css\";\nimport iconSize from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\nimport styles from \"./LinkButton.module.css\";\nimport { backgroundColor } from \"../colors//backgroundColor\";\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { border } from \"../colors/border\";\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 take up the full width of its container\n *\n * @defaultValue false\n */\n fullWidth?: boolean;\n /**\n * The icon to be displayed at the start of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n startIcon?: React.ComponentType<{ className?: string }>;\n /**\n * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n */\n endIcon?: React.ComponentType<{ className?: string }>;\n /**\n * Indicate whether the button renders on a light or dark background. Changes the color of the button\n *\n * @defaulValue `lightBackground`\n */\n on?: \"lightBackground\" | \"darkBackground\";\n /**\n * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n */\n onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\n/**\n * [LinkButton](https://cambly-syntax.vercel.app/?path=/docs/components-linkbutton--docs) is a \"variation\" of Button that should look identical to Button, but should be used to render links instead.\n */\nconst LinkButton = forwardRef<HTMLAnchorElement, LinkButtonProps>(\n (\n {\n text,\n href,\n target,\n rel,\n \"data-testid\": dataTestId,\n color = \"primary\",\n size = \"md\",\n fullWidth = false,\n startIcon: StartIcon,\n endIcon: EndIcon,\n on = \"lightBackground\",\n onClick,\n }: LinkButtonProps,\n ref,\n ) => {\n const 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 },\n )}\n onClick={onClick}\n >\n {StartIcon && (\n <StartIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColorClass,\n )}\n />\n )}\n <Typography 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 {EndIcon && (\n <EndIcon\n className={classNames(\n buttonStyles.icon,\n iconSize[size],\n foregroundColorClass,\n )}\n />\n )}\n </a>\n );\n },\n);\n\nLinkButton.displayName = \"LinkButton\";\n\nexport default LinkButton;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_y92p2_1\",\"buttonGap\":\"_buttonGap_y92p2_8\",\"disabledPrimary\":\"_disabledPrimary_y92p2_49\",\"fullWidth\":\"_fullWidth_y92p2_53\",\"sm\":\"_sm_y92p2_57\",\"md\":\"_md_y92p2_64\",\"lg\":\"_lg_y92p2_71\",\"icon\":\"_icon_y92p2_78\",\"smIcon\":\"_smIcon_y92p2_82\",\"mdIcon\":\"_mdIcon_y92p2_89\",\"lgIcon\":\"_lgIcon_y92p2_96\",\"loading\":\"_loading_y92p2_113\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_y92p2_1\",\"loadingCircle\":\"_loadingCircle_y92p2_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\"}"]}
@@ -34,4 +34,4 @@ function border(color, on) {
34
34
 
35
35
 
36
36
  exports.border = border;
37
- //# sourceMappingURL=BYVURUTU.cjs.map
37
+ //# sourceMappingURL=C3KZXHTV.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/colors/border.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,gBAAgB;AAIhB,SAAS,OACd,OACA,IACe;AACf,MAAI,OAAO,mBAAmB;AAC5B,YAAQ,OAAO;AAAA,MACb,KAAK;AACH,eAAO,WAAW,sBAAO,UAAU,sBAAO,gBAAgB;AAAA,MAC5D,KAAK;AACH,eAAO,WAAW,sBAAO,UAAU,sBAAO,qBAAqB;AAAA,MACjE,KAAK;AACH,eAAO,WAAW,sBAAO,UAAU,sBAAO,yBAAyB;AAAA,MACrE;AACE,eAAO,sBAAO;AAAA,IAClB;AAAA,EACF,OAAO;AACL,YAAQ,OAAO;AAAA,MACb,KAAK;AACH,eAAO,WAAW,sBAAO,UAAU,sBAAO,kBAAkB;AAAA,MAC9D,KAAK;AACH,eAAO,WAAW,sBAAO,UAAU,sBAAO,qBAAqB;AAAA,MACjE,KAAK;AACH,eAAO,WAAW,sBAAO,UAAU,sBAAO,yBAAyB;AAAA,MACrE;AACE,eAAO,sBAAO;AAAA,IAClB;AAAA,EACF;AACF","sourcesContent":["import classNames from \"classnames\";\nimport { type Color } from \"../constants\";\nimport styles from \"./colors.module.css\";\n\nexport function border(\n color: (typeof Color)[number],\n on: \"lightBackground\" | \"darkBackground\",\n): string | null {\n if (on === \"lightBackground\") {\n switch (color) {\n case \"secondary\":\n return classNames(styles.noBorder, styles.blackBorderColor);\n case \"success-secondary\":\n return classNames(styles.noBorder, styles.success770BorderColor);\n case \"destructive-secondary\":\n return classNames(styles.noBorder, styles.destructive770BorderColor);\n default:\n return styles.noBorder;\n }\n } else {\n switch (color) {\n case \"secondary\":\n return classNames(styles.noBorder, styles.gray370BorderColor);\n case \"success-secondary\":\n return classNames(styles.noBorder, styles.success370BorderColor);\n case \"destructive-secondary\":\n return classNames(styles.noBorder, styles.destructive370BorderColor);\n default:\n return styles.noBorder;\n }\n }\n}\n"]}
@@ -4,7 +4,7 @@
4
4
  var _76LTWV2Qcjs = require('./76LTWV2Q.cjs');
5
5
 
6
6
 
7
- var _5VVFGPW6cjs = require('./5VVFGPW6.cjs');
7
+ var _PROA22UKcjs = require('./PROA22UK.cjs');
8
8
 
9
9
 
10
10
  var _PLUVW6AMcjs = require('./PLUVW6AM.cjs');
@@ -130,7 +130,7 @@ var ModalDialog = _react.forwardRef.call(void 0,
130
130
  }
131
131
  },
132
132
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
133
- _5VVFGPW6cjs.IconButton_default,
133
+ _PROA22UKcjs.IconButton_default,
134
134
  {
135
135
  onClick: () => state.close(),
136
136
  color: "tertiary",
@@ -157,4 +157,4 @@ var ModalDialog_default = ModalDialog;
157
157
 
158
158
 
159
159
  exports.AriaModalOverlay = AriaModalOverlay; exports.AriaModal = AriaModal; exports.ModalDialog_default = ModalDialog_default;
160
- //# sourceMappingURL=LFPS43OR.cjs.map
160
+ //# sourceMappingURL=CA6LTZL7.cjs.map
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
2
2
 
3
3
 
4
- var _XCSW34UMcjs = require('./XCSW34UM.cjs');
4
+ var _XCGRNBQHcjs = require('./XCGRNBQH.cjs');
5
5
 
6
6
  // src/Heading/Heading.tsx
7
7
  var _jsxruntime = require('react/jsx-runtime');
@@ -28,7 +28,7 @@ var Heading = ({
28
28
  size = 500
29
29
  }) => {
30
30
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
31
- _XCSW34UMcjs.Typography_default,
31
+ _XCGRNBQHcjs.Typography_default,
32
32
  {
33
33
  align,
34
34
  as,
@@ -47,4 +47,4 @@ var Heading_default = Heading;
47
47
 
48
48
 
49
49
  exports.Heading_default = Heading_default;
50
- //# sourceMappingURL=ZQRUOZFX.cjs.map
50
+ //# sourceMappingURL=CGBH73TM.cjs.map
@@ -7,16 +7,16 @@ import {
7
7
  } from "./JWJK72BH.js";
8
8
  import {
9
9
  foregroundColor
10
- } from "./423C767D.js";
10
+ } from "./UVQS6LU3.js";
11
11
  import {
12
12
  border
13
- } from "./6CZHUML6.js";
13
+ } from "./ECA33JJ5.js";
14
14
  import {
15
15
  backgroundColor
16
- } from "./DEXL5BXD.js";
16
+ } from "./T6PXFSRX.js";
17
17
  import {
18
18
  Typography_default
19
- } from "./YAM7DAOZ.js";
19
+ } from "./2IXPTAJD.js";
20
20
 
21
21
  // src/LinkButton/LinkButton.tsx
22
22
  import { forwardRef } from "react";
@@ -80,11 +80,10 @@ var LinkButton = forwardRef(
80
80
  )
81
81
  }
82
82
  ),
83
- /* @__PURE__ */ jsx(Typography_default, { size: textVariant_default[size], children: /* @__PURE__ */ jsx(
83
+ /* @__PURE__ */ jsx(Typography_default, { size: textVariant_default[size], weight: "medium", children: /* @__PURE__ */ jsx(
84
84
  "span",
85
85
  {
86
86
  className: foregroundColorClass,
87
- style: { fontWeight: 500 },
88
87
  children: text
89
88
  }
90
89
  ) }),
@@ -109,4 +108,4 @@ var LinkButton_default = LinkButton;
109
108
  export {
110
109
  LinkButton_default
111
110
  };
112
- //# sourceMappingURL=SJRKFU77.js.map
111
+ //# sourceMappingURL=DLZDG6HM.js.map