@cambly/syntax-core 16.0.0 → 16.2.0

package/dist/Badge/Badge.d.ts

@@ -11,7 +11,7 @@ declare const Badge: ({ icon: Icon, text, color, }: {
         className?: string | undefined;
     }> | React.ComponentType<{
         color?: "gray700" | "gray900" | "white" | "inherit" | "primary" | "destructive-primary" | "destructive-darkBackground" | "success" | "success-darkBackground" | "white-secondary" | undefined;
-        size?: 0 | 100 | 200 | 300 | 400 | 700 | 900 | 500 | 600 | 800 | 1000 | undefined;
+        size?: 100 | 200 | 300 | 400 | 700 | 900 | 500 | 600 | 800 | 1000 | undefined;
         path?: string | undefined;
     } & React.RefAttributes<SVGSVGElement>> | undefined;
     /**

package/dist/Icon/Icon.cjs

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _SEJ4BIQGcjs = require('../__chunks/SEJ4BIQG.cjs');
+var _L5RBAKANcjs = require('../__chunks/L5RBAKAN.cjs');
 require('../__chunks/POMJQZKJ.cjs');
 require('../__chunks/SVA2ABQQ.cjs');
 require('../__chunks/WFVGNGEP.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _SEJ4BIQGcjs.Icon_default;
+exports.default = _L5RBAKANcjs.Icon_default;
 //# sourceMappingURL=Icon.cjs.map

package/dist/Icon/Icon.d.ts

@@ -11,20 +11,20 @@ type IconProps = {
     color?: ComponentProps<typeof Typography>["color"];
     /**
      * The size of the Icon.
-     * * 0: 16px x 16px
-     * * 100: 20px x 20px
-     * * 200: 24px x 24px
-     * * 300: 28px x 28px
-     * * 400: 48px x 48px
-     * * 500: 72px x 72px
-     * * 600: 100px x 100px
-     * * 700: 140px x 140px
-     * * 800: 200px x 200px
-     * * 9000: 280px x 280px
+     * * 100: 16px x 16px
+     * * 200: 20px x 20px
+     * * 300: 24px x 24px
+     * * 400: 28px x 28px
+     * * 500: 48px x 48px
+     * * 600: 72px x 72px
+     * * 700: 100px x 100px
+     * * 800: 140px x 140px
+     * * 900: 200px x 200px
+     * * 1000: 280px x 280px
      *
      * @defaultValue 200
      */
-    size?: 0 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;
+    size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;
     /**
      * The svg path of the icon. You should not use this prop directly, instead use the specific icon components.
      */

package/dist/Icon/Icon.js

@@ -1,7 +1,7 @@
 "use client"
 import {
   Icon_default
-} from "../__chunks/SKVMG4AF.js";
+} from "../__chunks/523DPUCJ.js";
 import "../__chunks/NVTSF5NY.js";
 import "../__chunks/XVUEUKXA.js";
 import "../__chunks/4U4UW4AK.js";

package/dist/RichSelect/RichSelectList.cjs

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _G4CKRMFWcjs = require('../__chunks/G4CKRMFW.cjs');
+var _A2VIAMXMcjs = require('../__chunks/A2VIAMXM.cjs');
 require('../__chunks/32CNLC3O.cjs');
 require('../__chunks/WEOENL5J.cjs');
 require('../__chunks/J27AGJQB.cjs');
 require('../__chunks/ZGOHDWOB.cjs');
-require('../__chunks/43ZVOHDU.cjs');
+require('../__chunks/UZ2FIWJZ.cjs');
 require('../__chunks/5IOCCDL6.cjs');
 require('../__chunks/FIPWIWEO.cjs');
 require('../__chunks/42SRFCQL.cjs');
@@ -46,5 +46,5 @@ require('../__chunks/E5P6WRJD.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _G4CKRMFWcjs.RichSelectList_default;
+exports.default = _A2VIAMXMcjs.RichSelectList_default;
 //# sourceMappingURL=RichSelectList.cjs.map

package/dist/RichSelect/RichSelectList.js

@@ -1,12 +1,12 @@
 "use client"
 import {
   RichSelectList_default
-} from "../__chunks/Q2KBODSW.js";
+} from "../__chunks/IWJLLUHI.js";
 import "../__chunks/C22XFS4G.js";
 import "../__chunks/WJMQX7BT.js";
 import "../__chunks/5HEC7ASW.js";
 import "../__chunks/DJ6I4764.js";
-import "../__chunks/HAXNGRII.js";
+import "../__chunks/VPWID72F.js";
 import "../__chunks/4C7SU3EM.js";
 import "../__chunks/2GCKYKF3.js";
 import "../__chunks/YAZOHZLW.js";

package/dist/SelectList/SelectList.cjs

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _6VB3H32Icjs = require('../__chunks/6VB3H32I.cjs');
-require('../__chunks/43ZVOHDU.cjs');
+var _J4Q24RRYcjs = require('../__chunks/J4Q24RRY.cjs');
+require('../__chunks/UZ2FIWJZ.cjs');
 require('../__chunks/XLUVINJW.cjs');
 require('../__chunks/KJLBDAZH.cjs');
 require('../__chunks/JVGX637E.cjs');
@@ -18,5 +18,5 @@ require('../__chunks/NOELZTQX.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _6VB3H32Icjs.SelectList;
+exports.default = _J4Q24RRYcjs.SelectList;
 //# sourceMappingURL=SelectList.cjs.map

package/dist/SelectList/SelectList.js

@@ -1,8 +1,8 @@
 "use client"
 import {
   SelectList
-} from "../__chunks/DISIWYT4.js";
-import "../__chunks/HAXNGRII.js";
+} from "../__chunks/4LGAAZRF.js";
+import "../__chunks/VPWID72F.js";
 import "../__chunks/KKADUD65.js";
 import "../__chunks/65PMWIHY.js";
 import "../__chunks/SPQ7DQHG.js";

package/dist/Tabs/TabLink.cjs

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _F7FFR34Lcjs = require('../__chunks/F7FFR34L.cjs');
+var _YECKQLZScjs = require('../__chunks/YECKQLZS.cjs');
 require('../__chunks/JVGBP6LO.cjs');
 require('../__chunks/B3O42V6X.cjs');
 require('../__chunks/KJLBDAZH.cjs');
@@ -15,5 +15,5 @@ require('../__chunks/SVA2ABQQ.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _F7FFR34Lcjs.TabLink_default;
+exports.default = _YECKQLZScjs.TabLink_default;
 //# sourceMappingURL=TabLink.cjs.map

package/dist/Tabs/TabLink.d.ts

@@ -16,7 +16,7 @@ declare const TabLink: React.ForwardRefExoticComponent<{
      * The link that the Tab should route to.
      *
      */
-    href: string;
+    href?: string | undefined;
     /**
      * The target attribute specifies where to open the linked document.
      *

package/dist/Tabs/TabLink.js

@@ -1,7 +1,7 @@
 "use client"
 import {
   TabLink_default
-} from "../__chunks/P7YFSOS7.js";
+} from "../__chunks/M37PG54B.js";
 import "../__chunks/5JQ6C2XV.js";
 import "../__chunks/BXKO34RQ.js";
 import "../__chunks/65PMWIHY.js";

package/dist/Tabs/Tabs.cjs

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _KFQOJ7RGcjs = require('../__chunks/KFQOJ7RG.cjs');
-require('../__chunks/F7FFR34L.cjs');
+var _SCY53TTHcjs = require('../__chunks/SCY53TTH.cjs');
+require('../__chunks/YECKQLZS.cjs');
 require('../__chunks/OJKBVPRV.cjs');
 require('../__chunks/3UEOKPM2.cjs');
 require('../__chunks/JVGBP6LO.cjs');
@@ -19,5 +19,5 @@ require('../__chunks/K4AUV2VK.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _KFQOJ7RGcjs.Tabs;
+exports.default = _SCY53TTHcjs.Tabs;
 //# sourceMappingURL=Tabs.cjs.map

package/dist/Tabs/Tabs.d.ts

@@ -33,7 +33,7 @@ declare namespace Tabs {
         on?: "lightBackground" | "darkBackground" | undefined;
     } & {
         "data-testid"?: string | undefined;
-        href: string;
+        href?: string | undefined;
         target?: "_blank" | "_self" | "_parent" | "_top" | undefined;
         rel?: string | undefined;
         onClick?: React.MouseEventHandler<HTMLAnchorElement> | undefined;

package/dist/Tabs/Tabs.js

@@ -1,8 +1,8 @@
 "use client"
 import {
   Tabs
-} from "../__chunks/BB3LT6KA.js";
-import "../__chunks/P7YFSOS7.js";
+} from "../__chunks/EY2UNCK3.js";
+import "../__chunks/M37PG54B.js";
 import "../__chunks/SOR5SSPX.js";
 import "../__chunks/77FFPQY6.js";
 import "../__chunks/5JQ6C2XV.js";

package/dist/__chunks/{DISIWYT4.js → 4LGAAZRF.js}

@@ -2,7 +2,7 @@
 import {
   ColorBaseDestructive700,
   ColorBaseGray800
-} from "./HAXNGRII.js";
+} from "./VPWID72F.js";
 import {
   Focus_module_default
 } from "./KKADUD65.js";
@@ -122,4 +122,4 @@ SelectList.Option = SelectOption_default;
 export {
   SelectList
 };
-//# sourceMappingURL=DISIWYT4.js.map
+//# sourceMappingURL=4LGAAZRF.js.map

package/dist/__chunks/{SKVMG4AF.js → 523DPUCJ.js}

@@ -34,4 +34,4 @@ var Icon_default = Icon;
 export {
   Icon_default
 };
-//# sourceMappingURL=SKVMG4AF.js.map
+//# sourceMappingURL=523DPUCJ.js.map

package/dist/__chunks/523DPUCJ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Icon/Icon.tsx","css-module:./Icon.module.css#css-module"],"sourcesContent":["import { forwardRef, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\n\nimport styles from \"./Icon.module.css\";\nimport textColor from \"../colors/textColors\";\nimport type Typography from \"../Typography/Typography\";\n\ntype IconProps = {\n  /**\n   * The color of the Icon.\n   *\n   * @defaultValue \"gray900\"\n   */\n  color?: ComponentProps<typeof Typography>[\"color\"];\n  /**\n   * The size of the Icon.\n   * * 100: 16px x 16px\n   * * 200: 20px x 20px\n   * * 300: 24px x 24px\n   * * 400: 28px x 28px\n   * * 500: 48px x 48px\n   * * 600: 72px x 72px\n   * * 700: 100px x 100px\n   * * 800: 140px x 140px\n   * * 900: 200px x 200px\n   * * 1000: 280px x 280px\n   *\n   * @defaultValue 200\n   */\n  size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;\n  /**\n   * The svg path of the icon. You should not use this prop directly, instead use the specific icon components.\n   */\n  path?: string;\n};\n\n/**\n * [Icon](http://localhost:6006/?path=/docs/icons-icons--docs) is the base component that renders an icon.\n * You shouldn't use this component directly, instead use the specific icon components.\n * @example\n * `import Book from \"@cambly/syntax-icons/Book\";`\n *\n * You can click on the icon to copy the import statement!\n */\nconst Icon = forwardRef<SVGSVGElement, IconProps>(\n  ({ color = \"inherit\", path, size = 200 }: IconProps, ref) => (\n    <svg\n      className={classnames(\n        styles.icon,\n        textColor(color),\n        styles[`icon${size}`],\n      )}\n      ref={ref}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path d={path} />\n    </svg>\n  ),\n);\n\nIcon.displayName = \"Icon\";\n\nexport default Icon;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Icon/Icon.module.css\"; export default {\"icon\":\"_icon_1vyva_1\",\"icon100\":\"_icon100_1vyva_8\",\"icon200\":\"_icon200_1vyva_13\",\"icon300\":\"_icon300_1vyva_18\",\"icon400\":\"_icon400_1vyva_23\",\"icon500\":\"_icon500_1vyva_28\",\"icon600\":\"_icon600_1vyva_33\",\"icon700\":\"_icon700_1vyva_38\",\"icon800\":\"_icon800_1vyva_43\",\"icon900\":\"_icon900_1vyva_48\",\"icon1000\":\"_icon1000_1vyva_53\"}"],"mappings":";;;;;;AAAA,SAAS,kBAAuC;AAChD,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,WAAU,oBAAmB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,YAAW,qBAAoB;;;ADwDra;AAZN,IAAM,OAAO;AAAA,EACX,CAAC,EAAE,QAAQ,WAAW,MAAM,OAAO,IAAI,GAAc,QACnD;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,oBAAO;AAAA,QACP,UAAU,KAAK;AAAA,QACf,oBAAO,OAAO,MAAM;AAAA,MACtB;AAAA,MACA;AAAA,MACA,SAAQ;AAAA,MACR,OAAM;AAAA,MAEN,8BAAC,UAAK,GAAG,MAAM;AAAA;AAAA,EACjB;AAEJ;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ;","names":[]}

package/dist/__chunks/{G4CKRMFW.cjs → A2VIAMXM.cjs}

@@ -8,7 +8,7 @@ var _J27AGJQBcjs = require('./J27AGJQB.cjs');
 
 
 
-var _43ZVOHDUcjs = require('./43ZVOHDU.cjs');
+var _UZ2FIWJZcjs = require('./UZ2FIWJZ.cjs');
 
 
 
@@ -232,7 +232,7 @@ function RichSelectList(props) {
                           children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                             "path",
                             {
-                              fill: errorText ? _43ZVOHDUcjs.ColorBaseDestructive700 : _43ZVOHDUcjs.ColorBaseGray800,
+                              fill: errorText ? _UZ2FIWJZcjs.ColorBaseDestructive700 : _UZ2FIWJZcjs.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"
                             }
                           )
@@ -267,4 +267,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 
 
 exports.RichSelectList_default = RichSelectList_default;
-//# sourceMappingURL=G4CKRMFW.cjs.map
+//# sourceMappingURL=A2VIAMXM.cjs.map

package/dist/__chunks/{BB3LT6KA.js → EY2UNCK3.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   TabLink_default
-} from "./P7YFSOS7.js";
+} from "./M37PG54B.js";
 import {
   TabButton
 } from "./SOR5SSPX.js";
@@ -50,4 +50,4 @@ Tabs.Link = TabLink_default;
 export {
   Tabs
 };
-//# sourceMappingURL=BB3LT6KA.js.map
+//# sourceMappingURL=EY2UNCK3.js.map

package/dist/__chunks/{Q2KBODSW.js → IWJLLUHI.js}

@@ -8,7 +8,7 @@ import {
 import {
   ColorBaseDestructive700,
   ColorBaseGray800
-} from "./HAXNGRII.js";
+} from "./VPWID72F.js";
 import {
   RichSelectBoxContext,
   RichSelectBox_default,
@@ -267,4 +267,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 export {
   RichSelectList_default
 };
-//# sourceMappingURL=Q2KBODSW.js.map
+//# sourceMappingURL=IWJLLUHI.js.map

package/dist/__chunks/{6VB3H32I.cjs → J4Q24RRY.cjs}

@@ -2,7 +2,7 @@
 
 
 
-var _43ZVOHDUcjs = require('./43ZVOHDU.cjs');
+var _UZ2FIWJZcjs = require('./UZ2FIWJZ.cjs');
 
 
 var _XLUVINJWcjs = require('./XLUVINJW.cjs');
@@ -98,7 +98,7 @@ function SelectList({
               children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                 "path",
                 {
-                  fill: errorText ? _43ZVOHDUcjs.ColorBaseDestructive700 : _43ZVOHDUcjs.ColorBaseGray800,
+                  fill: errorText ? _UZ2FIWJZcjs.ColorBaseDestructive700 : _UZ2FIWJZcjs.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"
                 }
               )
@@ -122,4 +122,4 @@ SelectList.Option = _JVGX637Ecjs.SelectOption_default;
 
 
 exports.SelectList = SelectList;
-//# sourceMappingURL=6VB3H32I.cjs.map
+//# sourceMappingURL=J4Q24RRY.cjs.map

package/dist/__chunks/{SEJ4BIQG.cjs → L5RBAKAN.cjs}

@@ -34,4 +34,4 @@ var Icon_default = Icon;
 
 
 exports.Icon_default = Icon_default;
-//# sourceMappingURL=SEJ4BIQG.cjs.map
+//# sourceMappingURL=L5RBAKAN.cjs.map

package/dist/__chunks/L5RBAKAN.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Icon/Icon.tsx","css-module:./Icon.module.css#css-module"],"names":[],"mappings":";;;;;;AAAA,SAAS,kBAAuC;AAChD,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,WAAU,oBAAmB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,YAAW,qBAAoB;;;ADwDra;AAZN,IAAM,OAAO;AAAA,EACX,CAAC,EAAE,QAAQ,WAAW,MAAM,OAAO,IAAI,GAAc,QACnD;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,oBAAO;AAAA,QACP,UAAU,KAAK;AAAA,QACf,oBAAO,OAAO,MAAM;AAAA,MACtB;AAAA,MACA;AAAA,MACA,SAAQ;AAAA,MACR,OAAM;AAAA,MAEN,8BAAC,UAAK,GAAG,MAAM;AAAA;AAAA,EACjB;AAEJ;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ","sourcesContent":["import { forwardRef, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\n\nimport styles from \"./Icon.module.css\";\nimport textColor from \"../colors/textColors\";\nimport type Typography from \"../Typography/Typography\";\n\ntype IconProps = {\n  /**\n   * The color of the Icon.\n   *\n   * @defaultValue \"gray900\"\n   */\n  color?: ComponentProps<typeof Typography>[\"color\"];\n  /**\n   * The size of the Icon.\n   * * 100: 16px x 16px\n   * * 200: 20px x 20px\n   * * 300: 24px x 24px\n   * * 400: 28px x 28px\n   * * 500: 48px x 48px\n   * * 600: 72px x 72px\n   * * 700: 100px x 100px\n   * * 800: 140px x 140px\n   * * 900: 200px x 200px\n   * * 1000: 280px x 280px\n   *\n   * @defaultValue 200\n   */\n  size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;\n  /**\n   * The svg path of the icon. You should not use this prop directly, instead use the specific icon components.\n   */\n  path?: string;\n};\n\n/**\n * [Icon](http://localhost:6006/?path=/docs/icons-icons--docs) is the base component that renders an icon.\n * You shouldn't use this component directly, instead use the specific icon components.\n * @example\n * `import Book from \"@cambly/syntax-icons/Book\";`\n *\n * You can click on the icon to copy the import statement!\n */\nconst Icon = forwardRef<SVGSVGElement, IconProps>(\n  ({ color = \"inherit\", path, size = 200 }: IconProps, ref) => (\n    <svg\n      className={classnames(\n        styles.icon,\n        textColor(color),\n        styles[`icon${size}`],\n      )}\n      ref={ref}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path d={path} />\n    </svg>\n  ),\n);\n\nIcon.displayName = \"Icon\";\n\nexport default Icon;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Icon/Icon.module.css\"; export default {\"icon\":\"_icon_1vyva_1\",\"icon100\":\"_icon100_1vyva_8\",\"icon200\":\"_icon200_1vyva_13\",\"icon300\":\"_icon300_1vyva_18\",\"icon400\":\"_icon400_1vyva_23\",\"icon500\":\"_icon500_1vyva_28\",\"icon600\":\"_icon600_1vyva_33\",\"icon700\":\"_icon700_1vyva_38\",\"icon800\":\"_icon800_1vyva_43\",\"icon900\":\"_icon900_1vyva_48\",\"icon1000\":\"_icon1000_1vyva_53\"}"]}

package/dist/__chunks/{P7YFSOS7.js → M37PG54B.js}

@@ -72,4 +72,4 @@ var TabLink_default = TabLink;
 export {
   TabLink_default
 };
-//# sourceMappingURL=P7YFSOS7.js.map
+//# sourceMappingURL=M37PG54B.js.map

package/dist/__chunks/M37PG54B.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport TabInternal from \"./TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"./Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\ntype TabLinkProps = ComponentProps<typeof TabInternal> & {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The link that the Tab should route to.\n   *\n   */\n  href?: string;\n  /**\n   * The target attribute specifies where to open the linked document.\n   *\n   */\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  /**\n   * The rel attribute specifies the relationship between the document and the link.\n   *\n   */\n  rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\n  /**\n   * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n   */\n  onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\nconst TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n  (\n    {\n      text,\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      on = \"lightBackground\",\n      onClick,\n      selected,\n      endContent,\n      itemCount,\n    }: TabLinkProps,\n    ref,\n  ) => {\n    return (\n      <div\n        role=\"tab\"\n        className={classnames({\n          [styles.unselectedTab]: !selected,\n          [styles.selectedTabOnLightBackground]:\n            selected && on === \"lightBackground\",\n          [styles.selectedTabOnDarkBackground]:\n            selected && on === \"darkBackground\",\n        })}\n        style={{\n          height: \"100%\",\n        }}\n      >\n        <Box display=\"flex\" alignItems=\"center\" height=\"100%\">\n          <a\n            href={href}\n            data-testid={dataTestId}\n            target={target}\n            ref={ref}\n            rel={rel}\n            onClick={onClick}\n            className={styles.link}\n          >\n            <TabInternal\n              text={text}\n              selected={selected}\n              endContent={endContent}\n              itemCount={itemCount}\n              on={on}\n            />\n          </a>\n        </Box>\n      </div>\n    );\n  },\n);\n\nTabLink.displayName = \"TabLink\";\n\nexport default TabLink;\n"],"mappings":";;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AAEP,OAAO,gBAAgB;AAsEX;AAxCZ,IAAM,UAAU;AAAA,EACd,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW,WAAW;AAAA,UACpB,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,UACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,UACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,QACvB,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,QACV;AAAA,QAEA,8BAAC,eAAI,SAAQ,QAAO,YAAW,UAAS,QAAO,QAC7C;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,oBAAO;AAAA,YAElB;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ;","names":[]}

package/dist/__chunks/{KFQOJ7RG.cjs → SCY53TTH.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
 
 
-var _F7FFR34Lcjs = require('./F7FFR34L.cjs');
+var _YECKQLZScjs = require('./YECKQLZS.cjs');
 
 
 var _OJKBVPRVcjs = require('./OJKBVPRV.cjs');
@@ -45,9 +45,9 @@ function Tabs({
   );
 }
 Tabs.Button = _OJKBVPRVcjs.TabButton;
-Tabs.Link = _F7FFR34Lcjs.TabLink_default;
+Tabs.Link = _YECKQLZScjs.TabLink_default;
 
 
 
 exports.Tabs = Tabs;
-//# sourceMappingURL=KFQOJ7RG.cjs.map
+//# sourceMappingURL=SCY53TTH.cjs.map

package/dist/__chunks/{43ZVOHDU.cjs → UZ2FIWJZ.cjs}

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

package/dist/__chunks/{43ZVOHDU.cjs.map → UZ2FIWJZ.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 Fri, 14 Jun 2024 18:08:33 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 ColorCambioWhite40 = \"#ffffff\";\nexport const ColorCambioWhite70 = \"#ffffff\";\nexport const ColorCambioWhite100 = \"#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"]}
+{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"names":[],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB","sourcesContent":["/**\n * Do not edit directly\n * Generated on Wed, 26 Jun 2024 17:59: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 ColorCambioWhite40 = \"#ffffff\";\nexport const ColorCambioWhite70 = \"#ffffff\";\nexport const ColorCambioWhite100 = \"#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"]}

package/dist/__chunks/{HAXNGRII.js → VPWID72F.js}

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

package/dist/__chunks/{HAXNGRII.js.map → VPWID72F.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Fri, 14 Jun 2024 18:08:33 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 ColorCambioWhite40 = \"#ffffff\";\nexport const ColorCambioWhite70 = \"#ffffff\";\nexport const ColorCambioWhite100 = \"#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":[]}
+{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Wed, 26 Jun 2024 17:59: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 ColorCambioWhite40 = \"#ffffff\";\nexport const ColorCambioWhite70 = \"#ffffff\";\nexport const ColorCambioWhite100 = \"#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":[]}

package/dist/__chunks/{F7FFR34L.cjs → YECKQLZS.cjs}

@@ -72,4 +72,4 @@ var TabLink_default = TabLink;
 
 
 exports.TabLink_default = TabLink_default;
-//# sourceMappingURL=F7FFR34L.cjs.map
+//# sourceMappingURL=YECKQLZS.cjs.map

package/dist/__chunks/YECKQLZS.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Tabs/TabLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AAEP,OAAO,gBAAgB;AAsEX;AAxCZ,IAAM,UAAU;AAAA,EACd,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW,WAAW;AAAA,UACpB,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,UACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,UACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,QACvB,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,QACV;AAAA,QAEA,8BAAC,eAAI,SAAQ,QAAO,YAAW,UAAS,QAAO,QAC7C;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,oBAAO;AAAA,YAElB;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ","sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport TabInternal from \"./TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"./Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\ntype TabLinkProps = ComponentProps<typeof TabInternal> & {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The link that the Tab should route to.\n   *\n   */\n  href?: string;\n  /**\n   * The target attribute specifies where to open the linked document.\n   *\n   */\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  /**\n   * The rel attribute specifies the relationship between the document and the link.\n   *\n   */\n  rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\n  /**\n   * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n   */\n  onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\nconst TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n  (\n    {\n      text,\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      on = \"lightBackground\",\n      onClick,\n      selected,\n      endContent,\n      itemCount,\n    }: TabLinkProps,\n    ref,\n  ) => {\n    return (\n      <div\n        role=\"tab\"\n        className={classnames({\n          [styles.unselectedTab]: !selected,\n          [styles.selectedTabOnLightBackground]:\n            selected && on === \"lightBackground\",\n          [styles.selectedTabOnDarkBackground]:\n            selected && on === \"darkBackground\",\n        })}\n        style={{\n          height: \"100%\",\n        }}\n      >\n        <Box display=\"flex\" alignItems=\"center\" height=\"100%\">\n          <a\n            href={href}\n            data-testid={dataTestId}\n            target={target}\n            ref={ref}\n            rel={rel}\n            onClick={onClick}\n            className={styles.link}\n          >\n            <TabInternal\n              text={text}\n              selected={selected}\n              endContent={endContent}\n              itemCount={itemCount}\n              on={on}\n            />\n          </a>\n        </Box>\n      </div>\n    );\n  },\n);\n\nTabLink.displayName = \"TabLink\";\n\nexport default TabLink;\n"]}

package/dist/index.cjs

@@ -28,13 +28,13 @@ require('./__chunks/THM3NAFO.cjs');
 var _O54TUH3Vcjs = require('./__chunks/O54TUH3V.cjs');
 
 
-var _SEJ4BIQGcjs = require('./__chunks/SEJ4BIQG.cjs');
+var _L5RBAKANcjs = require('./__chunks/L5RBAKAN.cjs');
 
 
-var _6VB3H32Icjs = require('./__chunks/6VB3H32I.cjs');
+var _J4Q24RRYcjs = require('./__chunks/J4Q24RRY.cjs');
 
 
-var _G4CKRMFWcjs = require('./__chunks/G4CKRMFW.cjs');
+var _A2VIAMXMcjs = require('./__chunks/A2VIAMXM.cjs');
 
 
 var _32CNLC3Ocjs = require('./__chunks/32CNLC3O.cjs');
@@ -43,7 +43,7 @@ require('./__chunks/J27AGJQB.cjs');
 
 
 var _ZGOHDWOBcjs = require('./__chunks/ZGOHDWOB.cjs');
-require('./__chunks/43ZVOHDU.cjs');
+require('./__chunks/UZ2FIWJZ.cjs');
 require('./__chunks/5IOCCDL6.cjs');
 
 
@@ -78,8 +78,8 @@ var _J2D7XRV7cjs = require('./__chunks/J2D7XRV7.cjs');
 require('./__chunks/WFVGNGEP.cjs');
 
 
-var _KFQOJ7RGcjs = require('./__chunks/KFQOJ7RG.cjs');
-require('./__chunks/F7FFR34L.cjs');
+var _SCY53TTHcjs = require('./__chunks/SCY53TTH.cjs');
+require('./__chunks/YECKQLZS.cjs');
 require('./__chunks/OJKBVPRV.cjs');
 
 
@@ -145,5 +145,5 @@ require('./__chunks/X2SDR4SD.cjs');
 
 
 
-exports.Avatar = _RC7EMZ6Ncjs.Avatar_default; exports.AvatarGroup = _5COVOOB3cjs.AvatarGroup; exports.Badge = _3Z5DP4X3cjs.Badge_default; exports.Box = _KJLBDAZHcjs.Box_default; exports.Button = _FIPWIWEOcjs.Button_default; exports.ButtonGroup = _C5XPZTFOcjs.ButtonGroup_default; exports.Card = _L32D5WEGcjs.Card_default; exports.Checkbox = _BFODXGGOcjs.Checkbox_default; exports.Chip = _4ENILLBCcjs.Chip_default; exports.Divider = _42SRFCQLcjs.Divider; exports.Heading = _3TF4GQNLcjs.Heading_default; exports.Icon = _SEJ4BIQGcjs.Icon_default; exports.IconButton = _ZGOHDWOBcjs.IconButton_default; exports.LinkButton = _O54TUH3Vcjs.LinkButton_default; exports.Modal = _UHOT5ZOHcjs.Modal; exports.Popover = _32CNLC3Ocjs.Popover_default; exports.RadioButton = _Z66NM3NKcjs.RadioButton_default; exports.RichSelectList = _G4CKRMFWcjs.RichSelectList_default; exports.SelectList = _6VB3H32Icjs.SelectList; exports.Tabs = _KFQOJ7RGcjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _J2D7XRV7cjs.TextArea_default; exports.TextField = _B3ZOLJLGcjs.TextField; exports.ThemeProvider = _7JET5NNKcjs.ThemeProvider; exports.Tooltip = _2PWZPH3Rcjs.Tooltip_default; exports.Typography = _42SXZKBGcjs.Typography_default;
+exports.Avatar = _RC7EMZ6Ncjs.Avatar_default; exports.AvatarGroup = _5COVOOB3cjs.AvatarGroup; exports.Badge = _3Z5DP4X3cjs.Badge_default; exports.Box = _KJLBDAZHcjs.Box_default; exports.Button = _FIPWIWEOcjs.Button_default; exports.ButtonGroup = _C5XPZTFOcjs.ButtonGroup_default; exports.Card = _L32D5WEGcjs.Card_default; exports.Checkbox = _BFODXGGOcjs.Checkbox_default; exports.Chip = _4ENILLBCcjs.Chip_default; exports.Divider = _42SRFCQLcjs.Divider; exports.Heading = _3TF4GQNLcjs.Heading_default; exports.Icon = _L5RBAKANcjs.Icon_default; exports.IconButton = _ZGOHDWOBcjs.IconButton_default; exports.LinkButton = _O54TUH3Vcjs.LinkButton_default; exports.Modal = _UHOT5ZOHcjs.Modal; exports.Popover = _32CNLC3Ocjs.Popover_default; exports.RadioButton = _Z66NM3NKcjs.RadioButton_default; exports.RichSelectList = _A2VIAMXMcjs.RichSelectList_default; exports.SelectList = _J4Q24RRYcjs.SelectList; exports.Tabs = _SCY53TTHcjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _J2D7XRV7cjs.TextArea_default; exports.TextField = _B3ZOLJLGcjs.TextField; exports.ThemeProvider = _7JET5NNKcjs.ThemeProvider; exports.Tooltip = _2PWZPH3Rcjs.Tooltip_default; exports.Typography = _42SXZKBGcjs.Typography_default;
 //# sourceMappingURL=index.cjs.map

package/dist/index.js

@@ -28,13 +28,13 @@ import {
 } from "./__chunks/ZH4QTULO.js";
 import {
   Icon_default
-} from "./__chunks/SKVMG4AF.js";
+} from "./__chunks/523DPUCJ.js";
 import {
   SelectList
-} from "./__chunks/DISIWYT4.js";
+} from "./__chunks/4LGAAZRF.js";
 import {
   RichSelectList_default
-} from "./__chunks/Q2KBODSW.js";
+} from "./__chunks/IWJLLUHI.js";
 import {
   Popover_default
 } from "./__chunks/C22XFS4G.js";
@@ -43,7 +43,7 @@ import "./__chunks/5HEC7ASW.js";
 import {
   IconButton_default
 } from "./__chunks/DJ6I4764.js";
-import "./__chunks/HAXNGRII.js";
+import "./__chunks/VPWID72F.js";
 import "./__chunks/4C7SU3EM.js";
 import {
   Button_default
@@ -78,8 +78,8 @@ import {
 import "./__chunks/4U4UW4AK.js";
 import {
   Tabs
-} from "./__chunks/BB3LT6KA.js";
-import "./__chunks/P7YFSOS7.js";
+} from "./__chunks/EY2UNCK3.js";
+import "./__chunks/M37PG54B.js";
 import "./__chunks/SOR5SSPX.js";
 import {
   TapArea_default

package/package.json

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

package/dist/__chunks/F7FFR34L.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/TabLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AAEP,OAAO,gBAAgB;AAsEX;AAxCZ,IAAM,UAAU;AAAA,EACd,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW,WAAW;AAAA,UACpB,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,UACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,UACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,QACvB,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,QACV;AAAA,QAEA,8BAAC,eAAI,SAAQ,QAAO,YAAW,UAAS,QAAO,QAC7C;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,oBAAO;AAAA,YAElB;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ","sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport TabInternal from \"./TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"./Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\ntype TabLinkProps = ComponentProps<typeof TabInternal> & {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The link that the Tab should route to.\n   *\n   */\n  href: string;\n  /**\n   * The target attribute specifies where to open the linked document.\n   *\n   */\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  /**\n   * The rel attribute specifies the relationship between the document and the link.\n   *\n   */\n  rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\n  /**\n   * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n   */\n  onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\nconst TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n  (\n    {\n      text,\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      on = \"lightBackground\",\n      onClick,\n      selected,\n      endContent,\n      itemCount,\n    }: TabLinkProps,\n    ref,\n  ) => {\n    return (\n      <div\n        role=\"tab\"\n        className={classnames({\n          [styles.unselectedTab]: !selected,\n          [styles.selectedTabOnLightBackground]:\n            selected && on === \"lightBackground\",\n          [styles.selectedTabOnDarkBackground]:\n            selected && on === \"darkBackground\",\n        })}\n        style={{\n          height: \"100%\",\n        }}\n      >\n        <Box display=\"flex\" alignItems=\"center\" height=\"100%\">\n          <a\n            href={href}\n            data-testid={dataTestId}\n            target={target}\n            ref={ref}\n            rel={rel}\n            onClick={onClick}\n            className={styles.link}\n          >\n            <TabInternal\n              text={text}\n              selected={selected}\n              endContent={endContent}\n              itemCount={itemCount}\n              on={on}\n            />\n          </a>\n        </Box>\n      </div>\n    );\n  },\n);\n\nTabLink.displayName = \"TabLink\";\n\nexport default TabLink;\n"]}

package/dist/__chunks/P7YFSOS7.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport TabInternal from \"./TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"./Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\ntype TabLinkProps = ComponentProps<typeof TabInternal> & {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The link that the Tab should route to.\n   *\n   */\n  href: string;\n  /**\n   * The target attribute specifies where to open the linked document.\n   *\n   */\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  /**\n   * The rel attribute specifies the relationship between the document and the link.\n   *\n   */\n  rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\n  /**\n   * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n   */\n  onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\nconst TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n  (\n    {\n      text,\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      on = \"lightBackground\",\n      onClick,\n      selected,\n      endContent,\n      itemCount,\n    }: TabLinkProps,\n    ref,\n  ) => {\n    return (\n      <div\n        role=\"tab\"\n        className={classnames({\n          [styles.unselectedTab]: !selected,\n          [styles.selectedTabOnLightBackground]:\n            selected && on === \"lightBackground\",\n          [styles.selectedTabOnDarkBackground]:\n            selected && on === \"darkBackground\",\n        })}\n        style={{\n          height: \"100%\",\n        }}\n      >\n        <Box display=\"flex\" alignItems=\"center\" height=\"100%\">\n          <a\n            href={href}\n            data-testid={dataTestId}\n            target={target}\n            ref={ref}\n            rel={rel}\n            onClick={onClick}\n            className={styles.link}\n          >\n            <TabInternal\n              text={text}\n              selected={selected}\n              endContent={endContent}\n              itemCount={itemCount}\n              on={on}\n            />\n          </a>\n        </Box>\n      </div>\n    );\n  },\n);\n\nTabLink.displayName = \"TabLink\";\n\nexport default TabLink;\n"],"mappings":";;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AAEP,OAAO,gBAAgB;AAsEX;AAxCZ,IAAM,UAAU;AAAA,EACd,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW,WAAW;AAAA,UACpB,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,UACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,UACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,QACvB,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,QACV;AAAA,QAEA,8BAAC,eAAI,SAAQ,QAAO,YAAW,UAAS,QAAO,QAC7C;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,oBAAO;AAAA,YAElB;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ;","names":[]}

package/dist/__chunks/SEJ4BIQG.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Icon/Icon.tsx","css-module:./Icon.module.css#css-module"],"names":[],"mappings":";;;;;;AAAA,SAAS,kBAAuC;AAChD,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,WAAU,oBAAmB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,YAAW,qBAAoB;;;ADwDra;AAZN,IAAM,OAAO;AAAA,EACX,CAAC,EAAE,QAAQ,WAAW,MAAM,OAAO,IAAI,GAAc,QACnD;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,oBAAO;AAAA,QACP,UAAU,KAAK;AAAA,QACf,oBAAO,OAAO,MAAM;AAAA,MACtB;AAAA,MACA;AAAA,MACA,SAAQ;AAAA,MACR,OAAM;AAAA,MAEN,8BAAC,UAAK,GAAG,MAAM;AAAA;AAAA,EACjB;AAEJ;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ","sourcesContent":["import { forwardRef, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\n\nimport styles from \"./Icon.module.css\";\nimport textColor from \"../colors/textColors\";\nimport type Typography from \"../Typography/Typography\";\n\ntype IconProps = {\n  /**\n   * The color of the Icon.\n   *\n   * @defaultValue \"gray900\"\n   */\n  color?: ComponentProps<typeof Typography>[\"color\"];\n  /**\n   * The size of the Icon.\n   * * 0: 16px x 16px\n   * * 100: 20px x 20px\n   * * 200: 24px x 24px\n   * * 300: 28px x 28px\n   * * 400: 48px x 48px\n   * * 500: 72px x 72px\n   * * 600: 100px x 100px\n   * * 700: 140px x 140px\n   * * 800: 200px x 200px\n   * * 9000: 280px x 280px\n   *\n   * @defaultValue 200\n   */\n  size?: 0 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;\n  /**\n   * The svg path of the icon. You should not use this prop directly, instead use the specific icon components.\n   */\n  path?: string;\n};\n\n/**\n * [Icon](http://localhost:6006/?path=/docs/icons-icons--docs) is the base component that renders an icon.\n * You shouldn't use this component directly, instead use the specific icon components.\n * @example\n * `import Book from \"@cambly/syntax-icons/Book\";`\n *\n * You can click on the icon to copy the import statement!\n */\nconst Icon = forwardRef<SVGSVGElement, IconProps>(\n  ({ color = \"inherit\", path, size = 200 }: IconProps, ref) => (\n    <svg\n      className={classnames(\n        styles.icon,\n        textColor(color),\n        styles[`icon${size}`],\n      )}\n      ref={ref}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path d={path} />\n    </svg>\n  ),\n);\n\nIcon.displayName = \"Icon\";\n\nexport default Icon;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Icon/Icon.module.css\"; export default {\"icon\":\"_icon_1vyva_1\",\"icon100\":\"_icon100_1vyva_8\",\"icon200\":\"_icon200_1vyva_13\",\"icon300\":\"_icon300_1vyva_18\",\"icon400\":\"_icon400_1vyva_23\",\"icon500\":\"_icon500_1vyva_28\",\"icon600\":\"_icon600_1vyva_33\",\"icon700\":\"_icon700_1vyva_38\",\"icon800\":\"_icon800_1vyva_43\",\"icon900\":\"_icon900_1vyva_48\",\"icon1000\":\"_icon1000_1vyva_53\"}"]}

package/dist/__chunks/SKVMG4AF.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Icon/Icon.tsx","css-module:./Icon.module.css#css-module"],"sourcesContent":["import { forwardRef, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\n\nimport styles from \"./Icon.module.css\";\nimport textColor from \"../colors/textColors\";\nimport type Typography from \"../Typography/Typography\";\n\ntype IconProps = {\n  /**\n   * The color of the Icon.\n   *\n   * @defaultValue \"gray900\"\n   */\n  color?: ComponentProps<typeof Typography>[\"color\"];\n  /**\n   * The size of the Icon.\n   * * 0: 16px x 16px\n   * * 100: 20px x 20px\n   * * 200: 24px x 24px\n   * * 300: 28px x 28px\n   * * 400: 48px x 48px\n   * * 500: 72px x 72px\n   * * 600: 100px x 100px\n   * * 700: 140px x 140px\n   * * 800: 200px x 200px\n   * * 9000: 280px x 280px\n   *\n   * @defaultValue 200\n   */\n  size?: 0 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;\n  /**\n   * The svg path of the icon. You should not use this prop directly, instead use the specific icon components.\n   */\n  path?: string;\n};\n\n/**\n * [Icon](http://localhost:6006/?path=/docs/icons-icons--docs) is the base component that renders an icon.\n * You shouldn't use this component directly, instead use the specific icon components.\n * @example\n * `import Book from \"@cambly/syntax-icons/Book\";`\n *\n * You can click on the icon to copy the import statement!\n */\nconst Icon = forwardRef<SVGSVGElement, IconProps>(\n  ({ color = \"inherit\", path, size = 200 }: IconProps, ref) => (\n    <svg\n      className={classnames(\n        styles.icon,\n        textColor(color),\n        styles[`icon${size}`],\n      )}\n      ref={ref}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path d={path} />\n    </svg>\n  ),\n);\n\nIcon.displayName = \"Icon\";\n\nexport default Icon;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Icon/Icon.module.css\"; export default {\"icon\":\"_icon_1vyva_1\",\"icon100\":\"_icon100_1vyva_8\",\"icon200\":\"_icon200_1vyva_13\",\"icon300\":\"_icon300_1vyva_18\",\"icon400\":\"_icon400_1vyva_23\",\"icon500\":\"_icon500_1vyva_28\",\"icon600\":\"_icon600_1vyva_33\",\"icon700\":\"_icon700_1vyva_38\",\"icon800\":\"_icon800_1vyva_43\",\"icon900\":\"_icon900_1vyva_48\",\"icon1000\":\"_icon1000_1vyva_53\"}"],"mappings":";;;;;;AAAA,SAAS,kBAAuC;AAChD,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,WAAU,oBAAmB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,YAAW,qBAAoB;;;ADwDra;AAZN,IAAM,OAAO;AAAA,EACX,CAAC,EAAE,QAAQ,WAAW,MAAM,OAAO,IAAI,GAAc,QACnD;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,oBAAO;AAAA,QACP,UAAU,KAAK;AAAA,QACf,oBAAO,OAAO,MAAM;AAAA,MACtB;AAAA,MACA;AAAA,MACA,SAAQ;AAAA,MACR,OAAM;AAAA,MAEN,8BAAC,UAAK,GAAG,MAAM;AAAA;AAAA,EACjB;AAEJ;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ;","names":[]}