@cambly/syntax-core 10.10.0 → 10.11.0

package/dist/Avatar/Avatar.d.ts

@@ -24,7 +24,7 @@ declare const Avatar: ({ accessibilityLabel, icon, size, src, }: {
      *
      * @defaultValue `md`
      */
-    size?: "xl" | "lg" | "md" | "sm" | undefined;
+    size?: "sm" | "md" | "lg" | "xl" | undefined;
     /**
      * URL of the image to display as the avatar.
      */

package/dist/Badge/Badge.d.ts

@@ -19,7 +19,7 @@ declare const Badge: ({ icon: Icon, text, color, }: {
      *
      * @defaultValue "primary700"
      */
-    color?: "destructive700" | "gray200" | "gray900" | "orange700" | "primary700" | "purple700" | "success700" | "yellow700" | undefined;
+    color?: "gray200" | "gray900" | "destructive700" | "orange700" | "yellow700" | "success700" | "primary700" | "purple700" | undefined;
 }) => JSX.Element;
 
 export { Badge as default };

package/dist/ButtonGroup/ButtonGroup.d.ts

@@ -19,7 +19,7 @@ declare const ButtonGroup: ({ orientation, size, children, }: {
      *
      * @defaultValue "md"
      */
-    size?: "lg" | "md" | "sm" | undefined;
+    size?: "sm" | "md" | "lg" | undefined;
     /**
      * Buttons to be rendered inside the button group
      */

package/dist/Card/Card.cjs

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _D3JSJW4Qcjs = require('../__chunks/D3JSJW4Q.cjs');
+var _4RHEB5F4cjs = require('../__chunks/4RHEB5F4.cjs');
 require('../__chunks/WJRIAS4W.cjs');
 require('../__chunks/WFVGNGEP.cjs');
 require('../__chunks/VF7PQHZP.cjs');
@@ -11,5 +11,5 @@ require('../__chunks/X2LNODY7.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _D3JSJW4Qcjs.Card;
+exports.default = _4RHEB5F4cjs.Card;
 //# sourceMappingURL=Card.cjs.map

package/dist/Card/Card.d.ts

@@ -1,6 +1,5 @@
 import colors from '../colors/allColors.js';
 
-declare const DeprecatedCardSizes: readonly ["sm", "lg"];
 type CardType = {
     /**
      * Test id for the button
@@ -15,20 +14,10 @@ type CardType = {
      * The child components to render within Card.
      */
     children: JSX.Element;
-    /**
-     * The size of the card
-     *
-     * `sm`: 352px
-     * `lg`: 744px
-     *
-     * @deprecated Card width should be controlled by the parent container
-     * @defaultValue `undefined`
-     */
-    size?: (typeof DeprecatedCardSizes)[number];
 };
 /**
  * [Card](https://cambly-syntax.vercel.app/?path=/docs/components-card--docs) is a basic container component to apply consistent styling and render child components.
  */
-declare function Card({ backgroundColor, children, size, "data-testid": dataTestId, }: CardType): JSX.Element;
+declare function Card({ backgroundColor, children, "data-testid": dataTestId, }: CardType): JSX.Element;
 
 export { Card as default };

package/dist/Card/Card.js

@@ -1,7 +1,7 @@
 "use client"
 import {
   Card
-} from "../__chunks/HK7MBW32.js";
+} from "../__chunks/WSRIDHYX.js";
 import "../__chunks/MAPDSZR4.js";
 import "../__chunks/4U4UW4AK.js";
 import "../__chunks/X5UGK633.js";

package/dist/Checkbox/Checkbox.d.ts

@@ -32,7 +32,7 @@ declare const Checkbox: ({ checked, "data-testid": dataTestId, disabled: disable
      *
      * @defaultValue "md"
      */
-    size?: "md" | "sm" | undefined;
+    size?: "sm" | "md" | undefined;
     /**
      * The text accompanying the checkbox
      */

package/dist/Heading/Heading.d.ts

@@ -11,7 +11,7 @@ declare const Heading: ({ align, as, children, color, "data-testid": dataTestId,
      *
      * @defaultValue "start"
      */
-    align?: "center" | "end" | "start" | "forceLeft" | "forceRight" | undefined;
+    align?: "start" | "end" | "forceLeft" | "center" | "forceRight" | undefined;
     /**
      * DOM element to render as.
      *
@@ -27,7 +27,7 @@ declare const Heading: ({ align, as, children, color, "data-testid": dataTestId,
      *
      * @defaultValue "gray900"
      */
-    color?: "gray700" | "gray900" | "white" | "inherit" | "primary" | "destructive-primary" | "success" | undefined;
+    color?: "gray900" | "primary" | "destructive-primary" | "success" | "gray700" | "white" | "inherit" | undefined;
     /**
      * Test id for the text.
      */

package/dist/RadioButton/RadioButton.d.ts

@@ -50,7 +50,7 @@ declare const RadioButton: ({ checked, "data-testid": dataTestId, dangerouslyFor
      *
      * @defaultValue "md"
      */
-    size?: "md" | "sm" | undefined;
+    size?: "sm" | "md" | undefined;
     /**
      * Value of the selected radio option
      */

package/dist/RichSelect/RichSelectBox.d.ts

@@ -49,7 +49,7 @@ declare const _default: React__default.ForwardRefExoticComponent<RichSelectBoxPr
     Chip: React__default.ForwardRefExoticComponent<RichSelectItemProps & React__default.RefAttributes<HTMLDivElement>>;
     RadioButton: React__default.ForwardRefExoticComponent<RichSelectItemProps & {
         name: string;
-        size?: "md" | "sm" | undefined;
+        size?: "sm" | "md" | undefined;
     } & React__default.RefAttributes<HTMLDivElement>>;
 };
 

package/dist/RichSelect/RichSelectList.cjs

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _D7NNCQKNcjs = require('../__chunks/D7NNCQKN.cjs');
+var _4ZST4KQIcjs = require('../__chunks/4ZST4KQI.cjs');
 require('../__chunks/6SALMOFU.cjs');
 require('../__chunks/XEN6XJKU.cjs');
 require('../__chunks/P67XTYNK.cjs');
@@ -19,7 +19,7 @@ require('../__chunks/ULMCQ7EA.cjs');
 require('../__chunks/WFVGNGEP.cjs');
 require('../__chunks/HWQUS53M.cjs');
 require('../__chunks/DKBI6MRY.cjs');
-require('../__chunks/AGHYI7QR.cjs');
+require('../__chunks/CJJAA2FD.cjs');
 require('../__chunks/IYA2TMMR.cjs');
 require('../__chunks/MF7LLV7V.cjs');
 require('../__chunks/YT3NEG6Z.cjs');
@@ -48,5 +48,5 @@ require('../__chunks/E5P6WRJD.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _D7NNCQKNcjs.RichSelectList_default;
+exports.default = _4ZST4KQIcjs.RichSelectList_default;
 //# sourceMappingURL=RichSelectList.cjs.map

package/dist/RichSelect/RichSelectList.d.ts

@@ -71,7 +71,7 @@ declare const _default: typeof RichSelectList & {
     Chip: React__default.ForwardRefExoticComponent<RichSelectItemProps & React__default.RefAttributes<HTMLDivElement>>;
     RadioButton: React__default.ForwardRefExoticComponent<RichSelectItemProps & {
         name: string;
-        size?: "md" | "sm" | undefined;
+        size?: "sm" | "md" | undefined;
     } & React__default.RefAttributes<HTMLDivElement>>;
 };
 

package/dist/RichSelect/RichSelectList.js

@@ -1,7 +1,7 @@
 "use client"
 import {
   RichSelectList_default
-} from "../__chunks/UPLN7GFR.js";
+} from "../__chunks/MNVLUU4O.js";
 import "../__chunks/7P2G663D.js";
 import "../__chunks/OF66QEJL.js";
 import "../__chunks/VBRCBEDC.js";
@@ -19,7 +19,7 @@ import "../__chunks/OULAADL7.js";
 import "../__chunks/4U4UW4AK.js";
 import "../__chunks/GFKDPMFK.js";
 import "../__chunks/QBGKDCTG.js";
-import "../__chunks/T5ET7RIA.js";
+import "../__chunks/XFP4MBWD.js";
 import "../__chunks/A4QZYP2J.js";
 import "../__chunks/DDUJFFG7.js";
 import "../__chunks/OFOTR7RY.js";

package/dist/RichSelect/RichSelectRadioButton.d.ts

@@ -5,7 +5,7 @@ import 'react-aria';
 
 declare const _default: React__default.ForwardRefExoticComponent<RichSelectItemProps & {
     name: string;
-    size?: "md" | "sm" | undefined;
+    size?: "sm" | "md" | undefined;
 } & React__default.RefAttributes<HTMLDivElement>>;
 
 export { _default as default };

package/dist/SelectList/SelectList.cjs

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _6QHOCICXcjs = require('../__chunks/6QHOCICX.cjs');
+var _2LJ5BR5Jcjs = require('../__chunks/2LJ5BR5J.cjs');
 require('../__chunks/4UJE5GMH.cjs');
-require('../__chunks/AGHYI7QR.cjs');
+require('../__chunks/CJJAA2FD.cjs');
 require('../__chunks/XLUVINJW.cjs');
 require('../__chunks/X6HZ6DM2.cjs');
 require('../__chunks/X2LNODY7.cjs');
@@ -14,5 +14,5 @@ require('../__chunks/NOELZTQX.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _6QHOCICXcjs.SelectList;
+exports.default = _2LJ5BR5Jcjs.SelectList;
 //# sourceMappingURL=SelectList.cjs.map

package/dist/SelectList/SelectList.js

@@ -1,9 +1,9 @@
 "use client"
 import {
   SelectList
-} from "../__chunks/KCVBUNSJ.js";
+} from "../__chunks/ZBDW45GJ.js";
 import "../__chunks/Y47XTR6M.js";
-import "../__chunks/T5ET7RIA.js";
+import "../__chunks/XFP4MBWD.js";
 import "../__chunks/KKADUD65.js";
 import "../__chunks/L7PPCZM5.js";
 import "../__chunks/JHJZ5COD.js";

package/dist/TapArea/TapArea.d.ts

@@ -50,7 +50,7 @@ declare const TapArea: React__default.ForwardRefExoticComponent<React__default.A
      *
      * @defaultValue "none"
      */
-    rounding?: "none" | "xl" | "lg" | "md" | "sm" | "full" | undefined;
+    rounding?: "sm" | "md" | "lg" | "xl" | "full" | "none" | undefined;
     /**
      * The tab index of the tap area
      */

package/dist/Typography/Typography.d.ts

@@ -12,13 +12,13 @@ declare const Typography: React.ForwardRefExoticComponent<{
      *
      * @defaultValue "start"
      */
-    align?: "center" | "end" | "start" | "forceLeft" | "forceRight" | undefined;
+    align?: "start" | "end" | "forceLeft" | "center" | "forceRight" | undefined;
     /**
      * DOM element to render as.
      *
      * @defaultValue "div"
      */
-    as?: "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | undefined;
+    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div" | undefined;
     /**
      * The text to be rendered
      */
@@ -30,7 +30,7 @@ declare const Typography: React.ForwardRefExoticComponent<{
      *
      * @defaultValue "gray900"
      */
-    color?: "gray700" | "gray900" | "white" | "inherit" | "primary" | "destructive-primary" | "destructive-darkBackground" | "success" | "success-darkBackground" | undefined;
+    color?: "gray900" | "primary" | "destructive-primary" | "success" | "gray700" | "white" | "inherit" | "destructive-darkBackground" | "success-darkBackground" | undefined;
     /**
      * Test id for the text
      */
@@ -97,7 +97,7 @@ declare const Typography: React.ForwardRefExoticComponent<{
      *
      * @defaultValue 200
      */
-    size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100 | undefined;
+    size?: 400 | 500 | 600 | 700 | 800 | 900 | 1000 | 1100 | 100 | 200 | 300 | undefined;
     /**
      * The tooltip to be displayed when the user hovers the text
      */
@@ -131,7 +131,7 @@ declare const Typography: React.ForwardRefExoticComponent<{
      *
      * @defaultValue "regular"
      */
-    weight?: "bold" | "regular" | "interactive" | "medium" | "semiBold" | "heavy" | undefined;
+    weight?: "regular" | "interactive" | "medium" | "semiBold" | "bold" | "heavy" | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 
 export { Typography as default };

package/dist/__chunks/{6QHOCICX.cjs → 2LJ5BR5J.cjs}

@@ -5,7 +5,7 @@ var _4UJE5GMHcjs = require('./4UJE5GMH.cjs');
 
 
 
-var _AGHYI7QRcjs = require('./AGHYI7QR.cjs');
+var _CJJAA2FDcjs = require('./CJJAA2FD.cjs');
 
 
 var _XLUVINJWcjs = require('./XLUVINJW.cjs');
@@ -101,7 +101,7 @@ function SelectList({
               children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                 "path",
                 {
-                  fill: errorText ? _AGHYI7QRcjs.ColorBaseDestructive700 : _AGHYI7QRcjs.ColorBaseGray800,
+                  fill: errorText ? _CJJAA2FDcjs.ColorBaseDestructive700 : _CJJAA2FDcjs.ColorBaseGray800,
                   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"
                 }
               )
@@ -125,4 +125,4 @@ SelectList.Option = _4UJE5GMHcjs.SelectOption_default;
 
 
 exports.SelectList = SelectList;
-//# sourceMappingURL=6QHOCICX.cjs.map
+//# sourceMappingURL=2LJ5BR5J.cjs.map

package/dist/__chunks/{D3JSJW4Q.cjs → 4RHEB5F4.cjs}

@@ -8,13 +8,8 @@ var _jsxruntime = require('react/jsx-runtime');
 function Card({
   backgroundColor = "white",
   children,
-  size,
   "data-testid": dataTestId
 }) {
-  const sizeWidth = {
-    sm: 352,
-    lg: 744
-  };
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _WJRIAS4Wcjs.Box_default,
     {
@@ -22,7 +17,6 @@ function Card({
       padding: 5,
       smPadding: 7,
       lgPadding: 7,
-      maxWidth: size && sizeWidth[size],
       width: "100%",
       backgroundColor,
       "data-testid": dataTestId,
@@ -34,4 +28,4 @@ function Card({
 
 
 exports.Card = Card;
-//# sourceMappingURL=D3JSJW4Q.cjs.map
+//# sourceMappingURL=4RHEB5F4.cjs.map

package/dist/__chunks/4RHEB5F4.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Card/Card.tsx"],"names":[],"mappings":";;;;;;AA4BI;AANW,SAAR,KAAsB;AAAA,EAC3B,kBAAkB;AAAA,EAClB;AAAA,EACA,eAAe;AACjB,GAA0B;AACxB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,MACX,WAAW;AAAA,MACX,OAAM;AAAA,MACN;AAAA,MACA,eAAa;AAAA,MAEZ;AAAA;AAAA,EACH;AAEJ","sourcesContent":["import Box from \"../Box/Box\";\nimport type allColors from \"../colors/allColors\";\n\ntype CardType = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The background color of the box.\n   * @defaultValue `white`\n   */\n  backgroundColor?: (typeof allColors)[number];\n  /**\n   * The child components to render within Card.\n   */\n  children: JSX.Element;\n};\n\n/**\n * [Card](https://cambly-syntax.vercel.app/?path=/docs/components-card--docs) is a basic container component to apply consistent styling and render child components.\n */\nexport default function Card({\n  backgroundColor = \"white\",\n  children,\n  \"data-testid\": dataTestId,\n}: CardType): JSX.Element {\n  return (\n    <Box\n      rounding=\"lg\"\n      padding={5}\n      smPadding={7}\n      lgPadding={7}\n      width=\"100%\"\n      backgroundColor={backgroundColor}\n      data-testid={dataTestId}\n    >\n      {children}\n    </Box>\n  );\n}\n"]}

package/dist/__chunks/{D7NNCQKN.cjs → 4ZST4KQI.cjs}

@@ -19,7 +19,7 @@ var _DKBI6MRYcjs = require('./DKBI6MRY.cjs');
 
 
 
-var _AGHYI7QRcjs = require('./AGHYI7QR.cjs');
+var _CJJAA2FDcjs = require('./CJJAA2FD.cjs');
 
 
 var _IYA2TMMRcjs = require('./IYA2TMMR.cjs');
@@ -233,7 +233,7 @@ function RichSelectList(props) {
                           children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                             "path",
                             {
-                              fill: errorText ? _AGHYI7QRcjs.ColorBaseDestructive700 : _AGHYI7QRcjs.ColorBaseGray800,
+                              fill: errorText ? _CJJAA2FDcjs.ColorBaseDestructive700 : _CJJAA2FDcjs.ColorBaseGray800,
                               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"
                             }
                           )
@@ -268,4 +268,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 
 
 exports.RichSelectList_default = RichSelectList_default;
-//# sourceMappingURL=D7NNCQKN.cjs.map
+//# sourceMappingURL=4ZST4KQI.cjs.map

package/dist/__chunks/{AGHYI7QR.cjs → CJJAA2FD.cjs}

@@ -8,4 +8,4 @@ var ColorBaseGray800 = "#353535";
 
 
 exports.ColorBaseDestructive700 = ColorBaseDestructive700; exports.ColorBaseGray800 = ColorBaseGray800;
-//# sourceMappingURL=AGHYI7QR.cjs.map
+//# sourceMappingURL=CJJAA2FD.cjs.map

package/dist/__chunks/{AGHYI7QR.cjs.map → CJJAA2FD.cjs.map}

@@ -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, 04 Mar 2024 22:57:01 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\n"]}
+{"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 Fri, 08 Mar 2024 15:27:15 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\n"]}

package/dist/__chunks/{UPLN7GFR.js → MNVLUU4O.js}

@@ -19,7 +19,7 @@ import {
 import {
   ColorBaseDestructive700,
   ColorBaseGray800
-} from "./T5ET7RIA.js";
+} from "./XFP4MBWD.js";
 import {
   RichSelectSection_default
 } from "./A4QZYP2J.js";
@@ -268,4 +268,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 export {
   RichSelectList_default
 };
-//# sourceMappingURL=UPLN7GFR.js.map
+//# sourceMappingURL=MNVLUU4O.js.map

package/dist/__chunks/{HK7MBW32.js → WSRIDHYX.js}

@@ -8,13 +8,8 @@ import { jsx } from "react/jsx-runtime";
 function Card({
   backgroundColor = "white",
   children,
-  size,
   "data-testid": dataTestId
 }) {
-  const sizeWidth = {
-    sm: 352,
-    lg: 744
-  };
   return /* @__PURE__ */ jsx(
     Box_default,
     {
@@ -22,7 +17,6 @@ function Card({
       padding: 5,
       smPadding: 7,
       lgPadding: 7,
-      maxWidth: size && sizeWidth[size],
       width: "100%",
       backgroundColor,
       "data-testid": dataTestId,
@@ -34,4 +28,4 @@ function Card({
 export {
   Card
 };
-//# sourceMappingURL=HK7MBW32.js.map
+//# sourceMappingURL=WSRIDHYX.js.map

package/dist/__chunks/WSRIDHYX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Card/Card.tsx"],"sourcesContent":["import Box from \"../Box/Box\";\nimport type allColors from \"../colors/allColors\";\n\ntype CardType = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The background color of the box.\n   * @defaultValue `white`\n   */\n  backgroundColor?: (typeof allColors)[number];\n  /**\n   * The child components to render within Card.\n   */\n  children: JSX.Element;\n};\n\n/**\n * [Card](https://cambly-syntax.vercel.app/?path=/docs/components-card--docs) is a basic container component to apply consistent styling and render child components.\n */\nexport default function Card({\n  backgroundColor = \"white\",\n  children,\n  \"data-testid\": dataTestId,\n}: CardType): JSX.Element {\n  return (\n    <Box\n      rounding=\"lg\"\n      padding={5}\n      smPadding={7}\n      lgPadding={7}\n      width=\"100%\"\n      backgroundColor={backgroundColor}\n      data-testid={dataTestId}\n    >\n      {children}\n    </Box>\n  );\n}\n"],"mappings":";;;;;;AA4BI;AANW,SAAR,KAAsB;AAAA,EAC3B,kBAAkB;AAAA,EAClB;AAAA,EACA,eAAe;AACjB,GAA0B;AACxB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,MACX,WAAW;AAAA,MACX,OAAM;AAAA,MACN;AAAA,MACA,eAAa;AAAA,MAEZ;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/__chunks/{T5ET7RIA.js → XFP4MBWD.js}

@@ -8,4 +8,4 @@ export {
   ColorBaseDestructive700,
   ColorBaseGray800
 };
-//# sourceMappingURL=T5ET7RIA.js.map
+//# sourceMappingURL=XFP4MBWD.js.map

package/dist/__chunks/{T5ET7RIA.js.map → XFP4MBWD.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Mon, 04 Mar 2024 22:57:01 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\n"],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB;","names":[]}
+{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Fri, 08 Mar 2024 15:27:15 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\n"],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB;","names":[]}

package/dist/__chunks/{KCVBUNSJ.js → ZBDW45GJ.js}

@@ -5,7 +5,7 @@ import {
 import {
   ColorBaseDestructive700,
   ColorBaseGray800
-} from "./T5ET7RIA.js";
+} from "./XFP4MBWD.js";
 import {
   Focus_module_default
 } from "./KKADUD65.js";
@@ -125,4 +125,4 @@ SelectList.Option = SelectOption_default;
 export {
   SelectList
 };
-//# sourceMappingURL=KCVBUNSJ.js.map
+//# sourceMappingURL=ZBDW45GJ.js.map

package/dist/index.cjs

@@ -10,7 +10,7 @@ var _PTQQBZPQcjs = require('./__chunks/PTQQBZPQ.cjs');
 var _44AWCXIEcjs = require('./__chunks/44AWCXIE.cjs');
 
 
-var _D3JSJW4Qcjs = require('./__chunks/D3JSJW4Q.cjs');
+var _4RHEB5F4cjs = require('./__chunks/4RHEB5F4.cjs');
 
 
 var _T6GJCK6Wcjs = require('./__chunks/T6GJCK6W.cjs');
@@ -31,11 +31,11 @@ require('./__chunks/BA4JPX36.cjs');
 var _EQIP4BADcjs = require('./__chunks/EQIP4BAD.cjs');
 
 
-var _6QHOCICXcjs = require('./__chunks/6QHOCICX.cjs');
+var _2LJ5BR5Jcjs = require('./__chunks/2LJ5BR5J.cjs');
 require('./__chunks/4UJE5GMH.cjs');
 
 
-var _D7NNCQKNcjs = require('./__chunks/D7NNCQKN.cjs');
+var _4ZST4KQIcjs = require('./__chunks/4ZST4KQI.cjs');
 require('./__chunks/6SALMOFU.cjs');
 
 
@@ -67,7 +67,7 @@ require('./__chunks/HWQUS53M.cjs');
 
 
 var _DKBI6MRYcjs = require('./__chunks/DKBI6MRY.cjs');
-require('./__chunks/AGHYI7QR.cjs');
+require('./__chunks/CJJAA2FD.cjs');
 require('./__chunks/IYA2TMMR.cjs');
 require('./__chunks/MF7LLV7V.cjs');
 require('./__chunks/YT3NEG6Z.cjs');
@@ -134,5 +134,5 @@ require('./__chunks/X2SDR4SD.cjs');
 
 
 
-exports.Avatar = _PTQQBZPQcjs.Avatar_default; exports.AvatarGroup = _44AWCXIEcjs.AvatarGroup; exports.Badge = _6B2PWEM7cjs.Badge_default; exports.Box = _WJRIAS4Wcjs.Box_default; exports.Button = _P67XTYNKcjs.Button_default; exports.ButtonGroup = _XEN6XJKUcjs.ButtonGroup_default; exports.Card = _D3JSJW4Qcjs.Card; exports.Checkbox = _JQGCEUQEcjs.Checkbox_default; exports.Chip = _WYWNQJ3Bcjs.Chip_default; exports.Divider = _DJHFPKBXcjs.Divider; exports.Heading = _FFPBVVGUcjs.Heading_default; exports.IconButton = _H44LFJ2Lcjs.IconButton_default; exports.LinkButton = _T6GJCK6Wcjs.LinkButton_default; exports.Modal = _JDLL6DACcjs.Modal; exports.Popover = _NYOKOJQBcjs.Popover_default; exports.RadioButton = _6DRTKEXKcjs.RadioButton_default; exports.RichSelectList = _D7NNCQKNcjs.RichSelectList_default; exports.SelectList = _6QHOCICXcjs.SelectList; exports.TapArea = _DKBI6MRYcjs.TapArea_default; exports.TextArea = _EQIP4BADcjs.TextArea_default; exports.TextField = _6IS4356Ocjs.TextField; exports.ThemeProvider = _COV3XKSJcjs.ThemeProvider; exports.Tooltip = _FO34OHGHcjs.Tooltip_default; exports.Typography = _X6HZ6DM2cjs.Typography_default;
+exports.Avatar = _PTQQBZPQcjs.Avatar_default; exports.AvatarGroup = _44AWCXIEcjs.AvatarGroup; exports.Badge = _6B2PWEM7cjs.Badge_default; exports.Box = _WJRIAS4Wcjs.Box_default; exports.Button = _P67XTYNKcjs.Button_default; exports.ButtonGroup = _XEN6XJKUcjs.ButtonGroup_default; exports.Card = _4RHEB5F4cjs.Card; exports.Checkbox = _JQGCEUQEcjs.Checkbox_default; exports.Chip = _WYWNQJ3Bcjs.Chip_default; exports.Divider = _DJHFPKBXcjs.Divider; exports.Heading = _FFPBVVGUcjs.Heading_default; exports.IconButton = _H44LFJ2Lcjs.IconButton_default; exports.LinkButton = _T6GJCK6Wcjs.LinkButton_default; exports.Modal = _JDLL6DACcjs.Modal; exports.Popover = _NYOKOJQBcjs.Popover_default; exports.RadioButton = _6DRTKEXKcjs.RadioButton_default; exports.RichSelectList = _4ZST4KQIcjs.RichSelectList_default; exports.SelectList = _2LJ5BR5Jcjs.SelectList; exports.TapArea = _DKBI6MRYcjs.TapArea_default; exports.TextArea = _EQIP4BADcjs.TextArea_default; exports.TextField = _6IS4356Ocjs.TextField; exports.ThemeProvider = _COV3XKSJcjs.ThemeProvider; exports.Tooltip = _FO34OHGHcjs.Tooltip_default; exports.Typography = _X6HZ6DM2cjs.Typography_default;
 //# sourceMappingURL=index.cjs.map

package/dist/index.js

@@ -10,7 +10,7 @@ import {
 } from "./__chunks/DUQSTRXU.js";
 import {
   Card
-} from "./__chunks/HK7MBW32.js";
+} from "./__chunks/WSRIDHYX.js";
 import {
   LinkButton_default
 } from "./__chunks/6WW5YWOS.js";
@@ -31,11 +31,11 @@ import {
 } from "./__chunks/V6DB6ZQU.js";
 import {
   SelectList
-} from "./__chunks/KCVBUNSJ.js";
+} from "./__chunks/ZBDW45GJ.js";
 import "./__chunks/Y47XTR6M.js";
 import {
   RichSelectList_default
-} from "./__chunks/UPLN7GFR.js";
+} from "./__chunks/MNVLUU4O.js";
 import "./__chunks/7P2G663D.js";
 import {
   ButtonGroup_default
@@ -67,7 +67,7 @@ import "./__chunks/GFKDPMFK.js";
 import {
   TapArea_default
 } from "./__chunks/QBGKDCTG.js";
-import "./__chunks/T5ET7RIA.js";
+import "./__chunks/XFP4MBWD.js";
 import "./__chunks/A4QZYP2J.js";
 import "./__chunks/DDUJFFG7.js";
 import "./__chunks/OFOTR7RY.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cambly/syntax-core",
   "description": "Cambly design system core components",
-  "version": "10.10.0",
+  "version": "10.11.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

package/dist/__chunks/D3JSJW4Q.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Card/Card.tsx"],"names":[],"mappings":";;;;;;AA8CI;AAZW,SAAR,KAAsB;AAAA,EAC3B,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,eAAe;AACjB,GAA0B;AACxB,QAAM,YAAY;AAAA,IAChB,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,MACX,WAAW;AAAA,MACX,UAAU,QAAQ,UAAU,IAAI;AAAA,MAChC,OAAM;AAAA,MACN;AAAA,MACA,eAAa;AAAA,MAEZ;AAAA;AAAA,EACH;AAEJ","sourcesContent":["import Box from \"../Box/Box\";\nimport type allColors from \"../colors/allColors\";\n\nconst DeprecatedCardSizes = [\"sm\", \"lg\"] as const;\n\ntype CardType = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The background color of the box.\n   * @defaultValue `white`\n   */\n  backgroundColor?: (typeof allColors)[number];\n  /**\n   * The child components to render within Card.\n   */\n  children: JSX.Element;\n  /**\n   * The size of the card\n   *\n   * `sm`: 352px\n   * `lg`: 744px\n   *\n   * @deprecated Card width should be controlled by the parent container\n   * @defaultValue `undefined`\n   */\n  size?: (typeof DeprecatedCardSizes)[number];\n};\n\n/**\n * [Card](https://cambly-syntax.vercel.app/?path=/docs/components-card--docs) is a basic container component to apply consistent styling and render child components.\n */\nexport default function Card({\n  backgroundColor = \"white\",\n  children,\n  size,\n  \"data-testid\": dataTestId,\n}: CardType): JSX.Element {\n  const sizeWidth = {\n    sm: 352,\n    lg: 744,\n  } as const;\n\n  return (\n    <Box\n      rounding=\"lg\"\n      padding={5}\n      smPadding={7}\n      lgPadding={7}\n      maxWidth={size && sizeWidth[size]}\n      width=\"100%\"\n      backgroundColor={backgroundColor}\n      data-testid={dataTestId}\n    >\n      {children}\n    </Box>\n  );\n}\n"]}

package/dist/__chunks/HK7MBW32.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Card/Card.tsx"],"sourcesContent":["import Box from \"../Box/Box\";\nimport type allColors from \"../colors/allColors\";\n\nconst DeprecatedCardSizes = [\"sm\", \"lg\"] as const;\n\ntype CardType = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The background color of the box.\n   * @defaultValue `white`\n   */\n  backgroundColor?: (typeof allColors)[number];\n  /**\n   * The child components to render within Card.\n   */\n  children: JSX.Element;\n  /**\n   * The size of the card\n   *\n   * `sm`: 352px\n   * `lg`: 744px\n   *\n   * @deprecated Card width should be controlled by the parent container\n   * @defaultValue `undefined`\n   */\n  size?: (typeof DeprecatedCardSizes)[number];\n};\n\n/**\n * [Card](https://cambly-syntax.vercel.app/?path=/docs/components-card--docs) is a basic container component to apply consistent styling and render child components.\n */\nexport default function Card({\n  backgroundColor = \"white\",\n  children,\n  size,\n  \"data-testid\": dataTestId,\n}: CardType): JSX.Element {\n  const sizeWidth = {\n    sm: 352,\n    lg: 744,\n  } as const;\n\n  return (\n    <Box\n      rounding=\"lg\"\n      padding={5}\n      smPadding={7}\n      lgPadding={7}\n      maxWidth={size && sizeWidth[size]}\n      width=\"100%\"\n      backgroundColor={backgroundColor}\n      data-testid={dataTestId}\n    >\n      {children}\n    </Box>\n  );\n}\n"],"mappings":";;;;;;AA8CI;AAZW,SAAR,KAAsB;AAAA,EAC3B,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,eAAe;AACjB,GAA0B;AACxB,QAAM,YAAY;AAAA,IAChB,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,MACX,WAAW;AAAA,MACX,UAAU,QAAQ,UAAU,IAAI;AAAA,MAChC,OAAM;AAAA,MACN;AAAA,MACA,eAAa;AAAA,MAEZ;AAAA;AAAA,EACH;AAEJ;","names":[]}