@cambly/syntax-core 21.2.0 → 21.4.0

package/dist/__chunks/{X4DRRDFO.js → EVESNLOD.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 
 // src/Heading/Heading.tsx
 import { jsx } from "react/jsx-runtime";
@@ -47,4 +47,4 @@ var Heading_default = Heading;
 export {
   Heading_default
 };
-//# sourceMappingURL=X4DRRDFO.js.map
+//# sourceMappingURL=EVESNLOD.js.map

package/dist/__chunks/{44OIIPEP.js → F3F5WL6P.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   Heading_default
-} from "./X4DRRDFO.js";
+} from "./EVESNLOD.js";
 import {
   StopScroll
 } from "./QQT35OLE.js";
@@ -130,4 +130,4 @@ Modal.displayName = "Modal";
 export {
   Modal
 };
-//# sourceMappingURL=44OIIPEP.js.map
+//# sourceMappingURL=F3F5WL6P.js.map

package/dist/__chunks/{I2TGRWBJ.js → FGIRARDP.js}

@@ -7,7 +7,7 @@ import {
 } from "./AVREYFSM.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 
 // src/RichSelect/RichSelectSection.tsx
 import { forwardRef } from "react";
@@ -50,4 +50,4 @@ var RichSelectSection_default = forwardRef(
 export {
   RichSelectSection_default
 };
-//# sourceMappingURL=I2TGRWBJ.js.map
+//# sourceMappingURL=FGIRARDP.js.map

package/dist/__chunks/{67NXLQQ3.js → H4ML7IJW.js}

@@ -4,7 +4,7 @@ import {
 } from "./KKADUD65.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -114,4 +114,4 @@ var Checkbox_default = Checkbox;
 export {
   Checkbox_default
 };
-//# sourceMappingURL=67NXLQQ3.js.map
+//# sourceMappingURL=H4ML7IJW.js.map

package/dist/__chunks/{22TVX5F4.js → L2B4DFFI.js}

@@ -23,7 +23,7 @@ import {
 } from "./YGON3SJ5.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 
 // src/LinkButton/LinkButton.tsx
 import {
@@ -138,4 +138,4 @@ var LinkButton_default = LinkButton;
 export {
   LinkButton_default
 };
-//# sourceMappingURL=22TVX5F4.js.map
+//# sourceMappingURL=L2B4DFFI.js.map

package/dist/__chunks/{NCY5ER37.js → LWMC6EQB.js}

@@ -4,7 +4,7 @@ import {
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -99,4 +99,4 @@ var TextArea_default = TextArea;
 export {
   TextArea_default
 };
-//# sourceMappingURL=NCY5ER37.js.map
+//# sourceMappingURL=LWMC6EQB.js.map

package/dist/__chunks/{ZAYQ4QHT.js → MN23VGSA.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   RadioButton_default
-} from "./TIF2TGI4.js";
+} from "./27WWAT4I.js";
 import {
   RichSelectItem_default
 } from "./ODMJANSX.js";
@@ -37,4 +37,4 @@ var RichSelectRadioButton_default = forwardRef(
 export {
   RichSelectRadioButton_default
 };
-//# sourceMappingURL=ZAYQ4QHT.js.map
+//# sourceMappingURL=MN23VGSA.js.map

package/dist/__chunks/{NVTCDO3W.js → MZPV6KFZ.js}

@@ -4,7 +4,7 @@ import {
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -88,4 +88,4 @@ var Chip_default = Chip;
 export {
   Chip_default
 };
-//# sourceMappingURL=NVTCDO3W.js.map
+//# sourceMappingURL=MZPV6KFZ.js.map

package/dist/__chunks/{RVPSNO77.js → O5NTP5KC.js}

@@ -8,7 +8,7 @@ import classNames from "classnames";
 import { forwardRef } from "react";
 
 // css-module:./Typography.module.css#css-module
-var Typography_module_default = { "typography": "_typography_15w34_1", "sansSerif": "_sansSerif_15w34_22", "serif": "_serif_15w34_27", "size0": "_size0_15w34_73", "size100": "_size100_15w34_77", "size200": "_size200_15w34_81", "size300": "_size300_15w34_85", "size400": "_size400_15w34_89", "size500": "_size500_15w34_93", "size700": "_size700_15w34_97", "size800": "_size800_15w34_101", "size900": "_size900_15w34_105", "size1100": "_size1100_15w34_109", "center": "_center_15w34_137", "forceLeft": "_forceLeft_15w34_141", "forceRight": "_forceRight_15w34_145", "start": "_start_15w34_149", "end": "_end_15w34_153", "regular": "_regular_15w34_159", "medium": "_medium_15w34_163", "semiBold": "_semiBold_15w34_167", "bold": "_bold_15w34_171", "underline": "_underline_15w34_175", "inline": "_inline_15w34_179", "uppercase": "_uppercase_15w34_183", "lineClamp": "_lineClamp_15w34_187", "p100": "_p100_15w34_196", "p200": "_p200_15w34_200", "p300": "_p300_15w34_204", "p400": "_p400_15w34_208", "p500": "_p500_15w34_212" };
+var Typography_module_default = { "typography": "_typography_bp3g5_1", "sansSerif": "_sansSerif_bp3g5_22", "serif": "_serif_bp3g5_27", "size0": "_size0_bp3g5_73", "size100": "_size100_bp3g5_77", "size200": "_size200_bp3g5_81", "size300": "_size300_bp3g5_85", "size400": "_size400_bp3g5_89", "size500": "_size500_bp3g5_93", "size700": "_size700_bp3g5_97", "size800": "_size800_bp3g5_101", "size900": "_size900_bp3g5_105", "size1100": "_size1100_bp3g5_109", "center": "_center_bp3g5_137", "forceLeft": "_forceLeft_bp3g5_141", "forceRight": "_forceRight_bp3g5_145", "start": "_start_bp3g5_149", "end": "_end_bp3g5_153", "regular": "_regular_bp3g5_159", "medium": "_medium_bp3g5_163", "semiBold": "_semiBold_bp3g5_167", "bold": "_bold_bp3g5_171", "underline": "_underline_bp3g5_175", "inline": "_inline_bp3g5_179", "uppercase": "_uppercase_bp3g5_183", "lineClamp": "_lineClamp_bp3g5_187", "p100": "_p100_bp3g5_196", "p200": "_p200_bp3g5_200", "p300": "_p300_bp3g5_204", "p400": "_p400_bp3g5_208", "p500": "_p500_bp3g5_212" };
 
 // src/Typography/Typography.tsx
 import { jsx } from "react/jsx-runtime";
@@ -61,4 +61,4 @@ var Typography_default = Typography;
 export {
   Typography_default
 };
-//# sourceMappingURL=RVPSNO77.js.map
+//# sourceMappingURL=O5NTP5KC.js.map

package/dist/__chunks/{RVPSNO77.js.map → O5NTP5KC.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Typography/Typography.tsx","css-module:./Typography.module.css#css-module"],"sourcesContent":["import classNames from \"classnames\";\nimport { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./Typography.module.css\";\nimport textColor from \"../colors/textColors\";\n\n/**\n * [Typography](https://cambly-syntax.vercel.app/?path=/docs/components-typography--docs) is a component that renders text.\n */\nconst Typography = forwardRef<\n  HTMLDivElement,\n  {\n    /**\n     * Aligns the text to the left, right, or center of the container.\n     * * `start` and `end` will align the text to the left or right of the container depending on the locale.\n     * * `forceLeft` and `forceRight` will align the text to the left or right of the container regardless of the locale (should be used sparingly).\n     *\n     * @defaultValue \"start\"\n     */\n    align?: \"start\" | \"end\" | \"forceLeft\" | \"center\" | \"forceRight\";\n    /**\n     * DOM element to render as.\n     *\n     * @defaultValue \"div\"\n     */\n    as?: \"div\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"p\";\n    /**\n     * The text to be rendered\n     */\n    children?: ReactNode;\n    /**\n     * The color of the text.\n     *\n     * @defaultValue \"gray900\"\n     */\n    color?:\n      | \"gray900\"\n      | \"gray700\"\n      | \"primary\"\n      | \"destructive-primary\"\n      | \"destructive-darkBackground\"\n      | \"destructive-lightBackground\"\n      | \"success\"\n      | \"success-darkBackground\"\n      | \"white\"\n      | \"white-secondary\"\n      | \"inherit\";\n    /**\n     * Test id for the text\n     */\n    \"data-testid\"?: string;\n    /**\n     * Style of the font\n     *\n     * Classic only supports `sans-serif`\n     *\n     * @defaultValue \"sans-serif\"\n     */\n    fontStyle?: \"serif\" | \"sans-serif\";\n    /**\n     * The id for the element\n     */\n    id?: string;\n    /**\n     * Whether the text should flow inline with other elements.\n     *\n     * @defaultValue false\n     */\n    inline?: boolean;\n    /**\n     * The number of lines we should truncate the text at\n     */\n    lineClamp?: number | undefined;\n    /**\n     * Size of the text.\n     *\n     * Mobile (viewport width <= 480px)::\n     * * `0`: 12px\n     * * `100`: 13px\n     * * `200`: 16px\n     * * `300`: 19px\n     * * `400`: 25px\n     * * `500`: 32px\n     * * `700`: 38px\n     * * `800`: 46px\n     * * `900`: 55px\n     * * `1100`: 83px\n     *\n     * Desktop (viewport width > 480px):\n     * * `0`: 12px\n     * * `100`: 13px\n     * * `200`: 16px\n     * * `300`: 20px\n     * * `400`: 25px\n     * * `500`: 32px\n     * * `700`: 49px\n     * * `800`: 63px\n     * * `900`: 76px\n     * * `1100`: 119px\n     *\n     * @defaultValue 200\n     */\n    size?: 0 | 100 | 200 | 300 | 400 | 500 | 700 | 800 | 900 | 1100;\n    /**\n     * The tooltip to be displayed when the user hovers the text\n     */\n    tooltip?: string;\n    /**\n     * Whether the text should be transformed to uppercase.\n     *\n     * @defaultValue \"none\"\n     */\n    transform?: \"none\" | \"uppercase\";\n    /**\n     * Whether the text has an underline.\n     *\n     * @defaultValue false\n     */\n    underline?: boolean;\n    /**\n     * Indicates the boldness of the text.\n     *\n     * * `regular`: 400\n     * * `medium`: 510\n     * * `semiBold`: 590\n     * * `bold`: 710\n     *\n     * @defaultValue \"regular\"\n     */\n    weight?: \"regular\" | \"medium\" | \"semiBold\" | \"bold\";\n  }\n>(function Typography(\n  {\n    align = \"start\",\n    as = \"div\",\n    children,\n    color = \"gray900\",\n    \"data-testid\": dataTestId,\n    fontStyle = \"sans-serif\",\n    id,\n    inline = false,\n    lineClamp = undefined,\n    size = 200,\n    tooltip,\n    transform = \"none\",\n    underline = false,\n    weight = \"regular\",\n  },\n  ref,\n): ReactElement {\n  const Tag = as;\n\n  return (\n    <Tag\n      id={id}\n      className={classNames(\n        styles.typography,\n        styles[align],\n        styles[weight],\n        fontStyle === \"serif\" ? styles.serif : styles.sansSerif,\n        textColor(color),\n        inline && styles.inline,\n        styles[`size${size}`],\n        transform === \"uppercase\" && styles.uppercase,\n        underline && styles.underline,\n        lineClamp != null && styles.lineClamp,\n        as === \"p\" && styles[`p${size}`],\n      )}\n      data-testid={dataTestId}\n      style={{\n        WebkitLineClamp: lineClamp,\n      }}\n      title={tooltip}\n      ref={ref}\n    >\n      {children}\n    </Tag>\n  );\n});\n\nexport default Typography;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Typography/Typography.module.css\"; export default {\"typography\":\"_typography_15w34_1\",\"sansSerif\":\"_sansSerif_15w34_22\",\"serif\":\"_serif_15w34_27\",\"size0\":\"_size0_15w34_73\",\"size100\":\"_size100_15w34_77\",\"size200\":\"_size200_15w34_81\",\"size300\":\"_size300_15w34_85\",\"size400\":\"_size400_15w34_89\",\"size500\":\"_size500_15w34_93\",\"size700\":\"_size700_15w34_97\",\"size800\":\"_size800_15w34_101\",\"size900\":\"_size900_15w34_105\",\"size1100\":\"_size1100_15w34_109\",\"center\":\"_center_15w34_137\",\"forceLeft\":\"_forceLeft_15w34_141\",\"forceRight\":\"_forceRight_15w34_145\",\"start\":\"_start_15w34_149\",\"end\":\"_end_15w34_153\",\"regular\":\"_regular_15w34_159\",\"medium\":\"_medium_15w34_163\",\"semiBold\":\"_semiBold_15w34_167\",\"bold\":\"_bold_15w34_171\",\"underline\":\"_underline_15w34_175\",\"inline\":\"_inline_15w34_179\",\"uppercase\":\"_uppercase_15w34_183\",\"lineClamp\":\"_lineClamp_15w34_187\",\"p100\":\"_p100_15w34_196\",\"p200\":\"_p200_15w34_200\",\"p300\":\"_p300_15w34_204\",\"p400\":\"_p400_15w34_208\",\"p500\":\"_p500_15w34_212\"}"],"mappings":";;;;;;AAAA,OAAO,gBAAgB;AACvB,SAAS,kBAAqD;;;ACDsC,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,aAAY,uBAAsB,SAAQ,mBAAkB,SAAQ,mBAAkB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,sBAAqB,WAAU,sBAAqB,YAAW,uBAAsB,UAAS,qBAAoB,aAAY,wBAAuB,cAAa,yBAAwB,SAAQ,oBAAmB,OAAM,kBAAiB,WAAU,sBAAqB,UAAS,qBAAoB,YAAW,uBAAsB,QAAO,mBAAkB,aAAY,wBAAuB,UAAS,qBAAoB,aAAY,wBAAuB,aAAY,wBAAuB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,kBAAiB;;;ADwJ3gC;AAhJJ,IAAM,aAAa,WA0HjB,SAASA,YACT;AAAA,EACE,QAAQ;AAAA,EACR,KAAK;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,YAAY;AAAA,EACZ;AAAA,EACA,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,OAAO;AAAA,EACP;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,SAAS;AACX,GACA,KACc;AACd,QAAM,MAAM;AAEZ,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,0BAAO;AAAA,QACP,0BAAO,KAAK;AAAA,QACZ,0BAAO,MAAM;AAAA,QACb,cAAc,UAAU,0BAAO,QAAQ,0BAAO;AAAA,QAC9C,UAAU,KAAK;AAAA,QACf,UAAU,0BAAO;AAAA,QACjB,0BAAO,OAAO,MAAM;AAAA,QACpB,cAAc,eAAe,0BAAO;AAAA,QACpC,aAAa,0BAAO;AAAA,QACpB,aAAa,QAAQ,0BAAO;AAAA,QAC5B,OAAO,OAAO,0BAAO,IAAI,MAAM;AAAA,MACjC;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,iBAAiB;AAAA,MACnB;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,qBAAQ;","names":["Typography"]}
+{"version":3,"sources":["../../src/Typography/Typography.tsx","css-module:./Typography.module.css#css-module"],"sourcesContent":["import classNames from \"classnames\";\nimport { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./Typography.module.css\";\nimport textColor from \"../colors/textColors\";\n\n/**\n * [Typography](https://cambly-syntax.vercel.app/?path=/docs/components-typography--docs) is a component that renders text.\n */\nconst Typography = forwardRef<\n  HTMLDivElement,\n  {\n    /**\n     * Aligns the text to the left, right, or center of the container.\n     * * `start` and `end` will align the text to the left or right of the container depending on the locale.\n     * * `forceLeft` and `forceRight` will align the text to the left or right of the container regardless of the locale (should be used sparingly).\n     *\n     * @defaultValue \"start\"\n     */\n    align?: \"start\" | \"end\" | \"forceLeft\" | \"center\" | \"forceRight\";\n    /**\n     * DOM element to render as.\n     *\n     * @defaultValue \"div\"\n     */\n    as?: \"div\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"p\";\n    /**\n     * The text to be rendered\n     */\n    children?: ReactNode;\n    /**\n     * The color of the text.\n     *\n     * @defaultValue \"gray900\"\n     */\n    color?:\n      | \"gray900\"\n      | \"gray700\"\n      | \"primary\"\n      | \"destructive-primary\"\n      | \"destructive-darkBackground\"\n      | \"destructive-lightBackground\"\n      | \"success\"\n      | \"success-darkBackground\"\n      | \"white\"\n      | \"white-secondary\"\n      | \"inherit\";\n    /**\n     * Test id for the text\n     */\n    \"data-testid\"?: string;\n    /**\n     * Style of the font\n     *\n     * Classic only supports `sans-serif`\n     *\n     * @defaultValue \"sans-serif\"\n     */\n    fontStyle?: \"serif\" | \"sans-serif\";\n    /**\n     * The id for the element\n     */\n    id?: string;\n    /**\n     * Whether the text should flow inline with other elements.\n     *\n     * @defaultValue false\n     */\n    inline?: boolean;\n    /**\n     * The number of lines we should truncate the text at\n     */\n    lineClamp?: number | undefined;\n    /**\n     * Size of the text.\n     *\n     * Mobile (viewport width <= 480px)::\n     * * `0`: 12px\n     * * `100`: 13px\n     * * `200`: 16px\n     * * `300`: 19px\n     * * `400`: 25px\n     * * `500`: 32px\n     * * `700`: 38px\n     * * `800`: 46px\n     * * `900`: 55px\n     * * `1100`: 83px\n     *\n     * Desktop (viewport width > 480px):\n     * * `0`: 12px\n     * * `100`: 13px\n     * * `200`: 16px\n     * * `300`: 20px\n     * * `400`: 25px\n     * * `500`: 32px\n     * * `700`: 44px\n     * * `800`: 63px\n     * * `900`: 76px\n     * * `1100`: 119px\n     *\n     * @defaultValue 200\n     */\n    size?: 0 | 100 | 200 | 300 | 400 | 500 | 700 | 800 | 900 | 1100;\n    /**\n     * The tooltip to be displayed when the user hovers the text\n     */\n    tooltip?: string;\n    /**\n     * Whether the text should be transformed to uppercase.\n     *\n     * @defaultValue \"none\"\n     */\n    transform?: \"none\" | \"uppercase\";\n    /**\n     * Whether the text has an underline.\n     *\n     * @defaultValue false\n     */\n    underline?: boolean;\n    /**\n     * Indicates the boldness of the text.\n     *\n     * * `regular`: 400\n     * * `medium`: 510\n     * * `semiBold`: 590\n     * * `bold`: 710\n     *\n     * @defaultValue \"regular\"\n     */\n    weight?: \"regular\" | \"medium\" | \"semiBold\" | \"bold\";\n  }\n>(function Typography(\n  {\n    align = \"start\",\n    as = \"div\",\n    children,\n    color = \"gray900\",\n    \"data-testid\": dataTestId,\n    fontStyle = \"sans-serif\",\n    id,\n    inline = false,\n    lineClamp = undefined,\n    size = 200,\n    tooltip,\n    transform = \"none\",\n    underline = false,\n    weight = \"regular\",\n  },\n  ref,\n): ReactElement {\n  const Tag = as;\n\n  return (\n    <Tag\n      id={id}\n      className={classNames(\n        styles.typography,\n        styles[align],\n        styles[weight],\n        fontStyle === \"serif\" ? styles.serif : styles.sansSerif,\n        textColor(color),\n        inline && styles.inline,\n        styles[`size${size}`],\n        transform === \"uppercase\" && styles.uppercase,\n        underline && styles.underline,\n        lineClamp != null && styles.lineClamp,\n        as === \"p\" && styles[`p${size}`],\n      )}\n      data-testid={dataTestId}\n      style={{\n        WebkitLineClamp: lineClamp,\n      }}\n      title={tooltip}\n      ref={ref}\n    >\n      {children}\n    </Tag>\n  );\n});\n\nexport default Typography;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Typography/Typography.module.css\"; export default {\"typography\":\"_typography_bp3g5_1\",\"sansSerif\":\"_sansSerif_bp3g5_22\",\"serif\":\"_serif_bp3g5_27\",\"size0\":\"_size0_bp3g5_73\",\"size100\":\"_size100_bp3g5_77\",\"size200\":\"_size200_bp3g5_81\",\"size300\":\"_size300_bp3g5_85\",\"size400\":\"_size400_bp3g5_89\",\"size500\":\"_size500_bp3g5_93\",\"size700\":\"_size700_bp3g5_97\",\"size800\":\"_size800_bp3g5_101\",\"size900\":\"_size900_bp3g5_105\",\"size1100\":\"_size1100_bp3g5_109\",\"center\":\"_center_bp3g5_137\",\"forceLeft\":\"_forceLeft_bp3g5_141\",\"forceRight\":\"_forceRight_bp3g5_145\",\"start\":\"_start_bp3g5_149\",\"end\":\"_end_bp3g5_153\",\"regular\":\"_regular_bp3g5_159\",\"medium\":\"_medium_bp3g5_163\",\"semiBold\":\"_semiBold_bp3g5_167\",\"bold\":\"_bold_bp3g5_171\",\"underline\":\"_underline_bp3g5_175\",\"inline\":\"_inline_bp3g5_179\",\"uppercase\":\"_uppercase_bp3g5_183\",\"lineClamp\":\"_lineClamp_bp3g5_187\",\"p100\":\"_p100_bp3g5_196\",\"p200\":\"_p200_bp3g5_200\",\"p300\":\"_p300_bp3g5_204\",\"p400\":\"_p400_bp3g5_208\",\"p500\":\"_p500_bp3g5_212\"}"],"mappings":";;;;;;AAAA,OAAO,gBAAgB;AACvB,SAAS,kBAAqD;;;ACDsC,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,aAAY,uBAAsB,SAAQ,mBAAkB,SAAQ,mBAAkB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,sBAAqB,WAAU,sBAAqB,YAAW,uBAAsB,UAAS,qBAAoB,aAAY,wBAAuB,cAAa,yBAAwB,SAAQ,oBAAmB,OAAM,kBAAiB,WAAU,sBAAqB,UAAS,qBAAoB,YAAW,uBAAsB,QAAO,mBAAkB,aAAY,wBAAuB,UAAS,qBAAoB,aAAY,wBAAuB,aAAY,wBAAuB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,kBAAiB;;;ADwJ3gC;AAhJJ,IAAM,aAAa,WA0HjB,SAASA,YACT;AAAA,EACE,QAAQ;AAAA,EACR,KAAK;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,YAAY;AAAA,EACZ;AAAA,EACA,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,OAAO;AAAA,EACP;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,SAAS;AACX,GACA,KACc;AACd,QAAM,MAAM;AAEZ,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,0BAAO;AAAA,QACP,0BAAO,KAAK;AAAA,QACZ,0BAAO,MAAM;AAAA,QACb,cAAc,UAAU,0BAAO,QAAQ,0BAAO;AAAA,QAC9C,UAAU,KAAK;AAAA,QACf,UAAU,0BAAO;AAAA,QACjB,0BAAO,OAAO,MAAM;AAAA,QACpB,cAAc,eAAe,0BAAO;AAAA,QACpC,aAAa,0BAAO;AAAA,QACpB,aAAa,QAAQ,0BAAO;AAAA,QAC5B,OAAO,OAAO,0BAAO,IAAI,MAAM;AAAA,MACjC;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,iBAAiB;AAAA,MACnB;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,qBAAQ;","names":["Typography"]}

package/dist/__chunks/{GHPAVZWL.js → T4YHKCPK.js}

@@ -10,4 +10,4 @@ export {
   ColorBaseGray700,
   ColorCambioWhite100
 };
-//# sourceMappingURL=GHPAVZWL.js.map
+//# sourceMappingURL=T4YHKCPK.js.map

package/dist/__chunks/{GHPAVZWL.js.map → T4YHKCPK.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Tue, 15 Oct 2024 22:39:14 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 ColorCambioGray270 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#5e5952\";\nexport const ColorCambioGray800 = \"#363432\";\nexport const ColorCambioGray870 = \"#5e5952\";\nexport const ColorCambioGray900 = \"#262625\";\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\";\nexport const ShadowInteractive = \"0px 3px 16px 0px rgba(144, 134, 130, 0.05), 0px 2px 30px 0px rgba(144, 134, 130, 0.02)\";\n"],"mappings":";;;AASO,IAAM,0BAA0B;AAUhC,IAAM,mBAAmB;AAqCzB,IAAM,sBAAsB;","names":[]}
+{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"sourcesContent":["/**\n * Do not edit directly\n * Generated on Tue, 22 Oct 2024 21:44:10 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 ColorCambioGray270 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#5e5952\";\nexport const ColorCambioGray800 = \"#363432\";\nexport const ColorCambioGray870 = \"#5e5952\";\nexport const ColorCambioGray900 = \"#262625\";\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\";\nexport const ShadowInteractive = \"0px 3px 16px 0px rgba(144, 134, 130, 0.05), 0px 2px 30px 0px rgba(144, 134, 130, 0.02)\";\n"],"mappings":";;;AASO,IAAM,0BAA0B;AAUhC,IAAM,mBAAmB;AAqCzB,IAAM,sBAAsB;","names":[]}

package/dist/__chunks/{L45IICHC.js → TPSWKGXZ.js}

@@ -4,7 +4,7 @@ import {
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 import {
   colors_module_default
 } from "./XSYKMCV5.js";
@@ -98,4 +98,4 @@ function TabInternal({
 export {
   TabInternal
 };
-//# sourceMappingURL=L45IICHC.js.map
+//# sourceMappingURL=TPSWKGXZ.js.map

package/dist/__chunks/{AKETYCNW.js → TQKSGWFO.js}

@@ -4,7 +4,7 @@ import {
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 
 // css-module:./Badge.module.css#css-module
 var Badge_module_default = { "icon": "_icon_1g9xb_1" };
@@ -59,6 +59,7 @@ var Badge = ({
                 color: textColorForBackgroundColor(color),
                 size: 100,
                 weight: "medium",
+                transform: "uppercase",
                 children: text
               }
             )
@@ -73,4 +74,4 @@ var Badge_default = Badge;
 export {
   Badge_default
 };
-//# sourceMappingURL=AKETYCNW.js.map
+//# sourceMappingURL=TQKSGWFO.js.map

package/dist/__chunks/{AKETYCNW.js.map → TQKSGWFO.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["css-module:./Badge.module.css#css-module","../../src/Badge/Badge.tsx"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Badge/Badge.module.css\"; export default {\"icon\":\"_icon_1g9xb_1\"}","import { type ComponentProps } from \"react\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport styles from \"./Badge.module.css\";\nimport type InternalIcon from \"../Icon/Icon\";\n\nconst badgeColor = [\n  \"sky\",\n  \"success300\",\n  \"destructive300\",\n  \"orange\",\n  \"tan\",\n  \"gray370\",\n  \"gray870\",\n  \"lilac\",\n  \"thistle\",\n  \"pink\",\n  \"cream\",\n  \"yellow700\",\n] as const;\n\nconst textColorForBackgroundColor = (\n  color: (typeof badgeColor)[number],\n): \"gray900\" | \"white\" => {\n  switch (color) {\n    case \"gray370\":\n    case \"destructive300\":\n    case \"orange\":\n    case \"tan\":\n    case \"success300\":\n    case \"sky\":\n    case \"thistle\":\n    case \"pink\":\n    case \"lilac\":\n    case \"cream\":\n    case \"yellow700\":\n      return \"gray900\";\n    default:\n      return \"white\";\n  }\n};\n\n/**\n * [Badge](https://cambly-syntax.vercel.app/?path=/docs/components-badge--docs) is a component to display short text and give additional context to features and other components.\n */\nconst Badge = ({\n  icon: Icon,\n  text,\n  color = \"sky\",\n}: {\n  /**\n   * The icon to be displayed. Please use a [Material Icon](https://material.io/resources/icons/)\n   */\n  icon?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\n  /**\n   * The text to display inside the badge\n   */\n  text: string;\n  /**\n   * The color of the badge\n   *\n   * @defaultValue \"sky\"\n   */\n  color?: (typeof badgeColor)[number];\n}): JSX.Element => {\n  return (\n    <Box\n      display=\"inlineFlex\"\n      paddingX={2}\n      paddingY={1}\n      rounding={\"sm\"}\n      backgroundColor={color}\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      minHeight={24}\n    >\n      <Typography\n        size={100}\n        weight=\"medium\"\n        color={textColorForBackgroundColor(color)}\n      >\n        <Box display=\"flex\" gap={1} alignItems=\"center\" justifyContent=\"start\">\n          {Icon && <Icon className={styles.icon} size={100} />}\n          <Typography\n            color={textColorForBackgroundColor(color)}\n            size={100}\n            weight=\"medium\"\n          >\n            {text}\n          </Typography>\n        </Box>\n      </Typography>\n    </Box>\n  );\n};\n\nexport default Badge;\n"],"mappings":";;;;;;;;;AAA0F,IAAO,uBAAQ,EAAC,QAAO,gBAAe;;;ACmFxH,SACW,KADX;AA9DR,IAAM,8BAA8B,CAClC,UACwB;AACxB,UAAQ,OAAO;AAAA,IACb,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAKA,IAAM,QAAQ,CAAC;AAAA,EACb,MAAM;AAAA,EACN;AAAA,EACA,QAAQ;AACV,MAiBmB;AACjB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,UAAU;AAAA,MACV,UAAU;AAAA,MACV,UAAU;AAAA,MACV,iBAAiB;AAAA,MACjB,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,WAAW;AAAA,MAEX;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,QAAO;AAAA,UACP,OAAO,4BAA4B,KAAK;AAAA,UAExC,+BAAC,eAAI,SAAQ,QAAO,KAAK,GAAG,YAAW,UAAS,gBAAe,SAC5D;AAAA,oBAAQ,oBAAC,QAAK,WAAW,qBAAO,MAAM,MAAM,KAAK;AAAA,YAClD;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO,4BAA4B,KAAK;AAAA,gBACxC,MAAM;AAAA,gBACN,QAAO;AAAA,gBAEN;AAAA;AAAA,YACH;AAAA,aACF;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;","names":[]}
+{"version":3,"sources":["css-module:./Badge.module.css#css-module","../../src/Badge/Badge.tsx"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Badge/Badge.module.css\"; export default {\"icon\":\"_icon_1g9xb_1\"}","import { type ComponentProps } from \"react\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport styles from \"./Badge.module.css\";\nimport type InternalIcon from \"../Icon/Icon\";\n\nconst badgeColor = [\n  \"sky\",\n  \"success300\",\n  \"destructive300\",\n  \"orange\",\n  \"tan\",\n  \"gray370\",\n  \"gray870\",\n  \"lilac\",\n  \"thistle\",\n  \"pink\",\n  \"cream\",\n  \"yellow700\",\n] as const;\n\nconst textColorForBackgroundColor = (\n  color: (typeof badgeColor)[number],\n): \"gray900\" | \"white\" => {\n  switch (color) {\n    case \"gray370\":\n    case \"destructive300\":\n    case \"orange\":\n    case \"tan\":\n    case \"success300\":\n    case \"sky\":\n    case \"thistle\":\n    case \"pink\":\n    case \"lilac\":\n    case \"cream\":\n    case \"yellow700\":\n      return \"gray900\";\n    default:\n      return \"white\";\n  }\n};\n\n/**\n * [Badge](https://cambly-syntax.vercel.app/?path=/docs/components-badge--docs) is a component to display short text and give additional context to features and other components.\n */\nconst Badge = ({\n  icon: Icon,\n  text,\n  color = \"sky\",\n}: {\n  /**\n   * The icon to be displayed. Please use a [Material Icon](https://material.io/resources/icons/)\n   */\n  icon?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\n  /**\n   * The text to display inside the badge\n   */\n  text: string;\n  /**\n   * The color of the badge\n   *\n   * @defaultValue \"sky\"\n   */\n  color?: (typeof badgeColor)[number];\n}): JSX.Element => {\n  return (\n    <Box\n      display=\"inlineFlex\"\n      paddingX={2}\n      paddingY={1}\n      rounding={\"sm\"}\n      backgroundColor={color}\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      minHeight={24}\n    >\n      <Typography\n        size={100}\n        weight=\"medium\"\n        color={textColorForBackgroundColor(color)}\n      >\n        <Box display=\"flex\" gap={1} alignItems=\"center\" justifyContent=\"start\">\n          {Icon && <Icon className={styles.icon} size={100} />}\n          <Typography\n            color={textColorForBackgroundColor(color)}\n            size={100}\n            weight=\"medium\"\n            transform=\"uppercase\"\n          >\n            {text}\n          </Typography>\n        </Box>\n      </Typography>\n    </Box>\n  );\n};\n\nexport default Badge;\n"],"mappings":";;;;;;;;;AAA0F,IAAO,uBAAQ,EAAC,QAAO,gBAAe;;;ACmFxH,SACW,KADX;AA9DR,IAAM,8BAA8B,CAClC,UACwB;AACxB,UAAQ,OAAO;AAAA,IACb,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAKA,IAAM,QAAQ,CAAC;AAAA,EACb,MAAM;AAAA,EACN;AAAA,EACA,QAAQ;AACV,MAiBmB;AACjB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,UAAU;AAAA,MACV,UAAU;AAAA,MACV,UAAU;AAAA,MACV,iBAAiB;AAAA,MACjB,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,WAAW;AAAA,MAEX;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,QAAO;AAAA,UACP,OAAO,4BAA4B,KAAK;AAAA,UAExC,+BAAC,eAAI,SAAQ,QAAO,KAAK,GAAG,YAAW,UAAS,gBAAe,SAC5D;AAAA,oBAAQ,oBAAC,QAAK,WAAW,qBAAO,MAAM,MAAM,KAAK;AAAA,YAClD;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO,4BAA4B,KAAK;AAAA,gBACxC,MAAM;AAAA,gBACN,QAAO;AAAA,gBACP,WAAU;AAAA,gBAET;AAAA;AAAA,YACH;AAAA,aACF;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;","names":[]}

package/dist/__chunks/{RJS7BKZD.js → VNZQBFJ3.js}

@@ -4,19 +4,19 @@ import {
 } from "./36DG472B.js";
 import {
   Button_default
-} from "./DZNR7V5P.js";
+} from "./5SJY6YA2.js";
 import {
   Divider
 } from "./M4W3IFMV.js";
 import {
   RichSelectSection_default
-} from "./I2TGRWBJ.js";
+} from "./FGIRARDP.js";
 import {
   RichSelectRadioButton_default
-} from "./ZAYQ4QHT.js";
+} from "./MN23VGSA.js";
 import {
   RichSelectChip_default
-} from "./WQ4ENJC7.js";
+} from "./WHFJPKC5.js";
 import {
   RichSelectItemContext,
   RichSelect_module_default
@@ -208,4 +208,4 @@ export {
   RichSelectBoxContext,
   RichSelectBox_default
 };
-//# sourceMappingURL=RJS7BKZD.js.map
+//# sourceMappingURL=VNZQBFJ3.js.map

package/dist/__chunks/{L6DEFAVZ.js → VVNR2CNY.js}

@@ -7,7 +7,7 @@ import {
 } from "./VV2NJABK.js";
 import {
   TabInternal
-} from "./L45IICHC.js";
+} from "./TPSWKGXZ.js";
 import {
   Box_default
 } from "./IB6JZQF3.js";
@@ -64,4 +64,4 @@ function TabButton({
 export {
   TabButton
 };
-//# sourceMappingURL=L6DEFAVZ.js.map
+//# sourceMappingURL=VVNR2CNY.js.map

package/dist/__chunks/{WQ4ENJC7.js → WHFJPKC5.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   Chip_default
-} from "./NVTCDO3W.js";
+} from "./MZPV6KFZ.js";
 import {
   RichSelectItem_default
 } from "./ODMJANSX.js";
@@ -31,4 +31,4 @@ var RichSelectChip_default = forwardRef(
 export {
   RichSelectChip_default
 };
-//# sourceMappingURL=WQ4ENJC7.js.map
+//# sourceMappingURL=WHFJPKC5.js.map

package/dist/__chunks/{C3KCRIBA.js → WIND6RNT.js}

@@ -4,7 +4,7 @@ import {
 } from "./VV2NJABK.js";
 import {
   TabInternal
-} from "./L45IICHC.js";
+} from "./TPSWKGXZ.js";
 import {
   Box_default
 } from "./IB6JZQF3.js";
@@ -72,4 +72,4 @@ var TabLink_default = TabLink;
 export {
   TabLink_default
 };
-//# sourceMappingURL=C3KCRIBA.js.map
+//# sourceMappingURL=WIND6RNT.js.map

package/dist/__chunks/{4JGJPX37.js → XKFXXZXQ.js}

@@ -1,13 +1,13 @@
 "use client"
 import {
   Badge_default
-} from "./AKETYCNW.js";
+} from "./TQKSGWFO.js";
 import {
   Box_default
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -118,4 +118,4 @@ function TextField({
 export {
   TextField
 };
-//# sourceMappingURL=4JGJPX37.js.map
+//# sourceMappingURL=XKFXXZXQ.js.map

package/dist/__chunks/{5R4TON7U.js → YKVUQLMW.js}

@@ -4,7 +4,7 @@ import {
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 
 // src/WordConfetti/WordConfetti.tsx
 import { forwardRef } from "react";
@@ -106,4 +106,4 @@ var WordConfetti_default = WordConfetti;
 export {
   WordConfetti_default
 };
-//# sourceMappingURL=5R4TON7U.js.map
+//# sourceMappingURL=YKVUQLMW.js.map

package/dist/__chunks/{NTFNQNV5.js → ZUM2R77X.js}

@@ -10,7 +10,7 @@ import {
 } from "./KBIW5XV4.js";
 import {
   Typography_default
-} from "./RVPSNO77.js";
+} from "./O5NTP5KC.js";
 import {
   colors_module_default
 } from "./XSYKMCV5.js";
@@ -166,4 +166,4 @@ export {
   AriaTooltip,
   Tooltip_default
 };
-//# sourceMappingURL=NTFNQNV5.js.map
+//# sourceMappingURL=ZUM2R77X.js.map

package/dist/index.css

@@ -2290,7 +2290,7 @@
 }
 
 /* css-module:/home/runner/work/syntax/syntax/packages/syntax-core/src/Typography/Typography.module.css/#css-module-data */
-._typography_15w34_1 {
+._typography_bp3g5_1 {
   line-height: initial;
   margin: 0;
 }
@@ -2306,130 +2306,130 @@
   font-weight: 700;
   src: local("GT-Super-Text-Bold"), url(https://static.cambly.com/fonts/gt-super-text-bold-final.woff2);
 }
-._sansSerif_15w34_22 {
+._sansSerif_bp3g5_22 {
   font-family: var(--syntax-font-sans-serif);
   margin: 0;
 }
-._serif_15w34_27 {
+._serif_bp3g5_27 {
   font-family: var( --syntax-font-sans-serif );
 }
-:lang(en) ._serif_15w34_27,
-:lang(az) ._serif_15w34_27,
-:lang(fr) ._serif_15w34_27,
-:lang(de) ._serif_15w34_27,
-:lang(es) ._serif_15w34_27,
-:lang(it) ._serif_15w34_27,
-:lang(pl) ._serif_15w34_27,
-:lang(pt) ._serif_15w34_27,
-:lang(tr) ._serif_15w34_27 {
+:lang(en) ._serif_bp3g5_27,
+:lang(az) ._serif_bp3g5_27,
+:lang(fr) ._serif_bp3g5_27,
+:lang(de) ._serif_bp3g5_27,
+:lang(es) ._serif_bp3g5_27,
+:lang(it) ._serif_bp3g5_27,
+:lang(pl) ._serif_bp3g5_27,
+:lang(pt) ._serif_bp3g5_27,
+:lang(tr) ._serif_bp3g5_27 {
   font-family: "GT Super", var(--syntax-font-sans-serif);
   -webkit-font-smoothing: antialiased;
   letter-spacing: -0.02em;
   line-height: 1.15em;
 }
-._size0_15w34_73 {
+._size0_bp3g5_73 {
   font-size: 12px;
 }
-._size100_15w34_77 {
+._size100_bp3g5_77 {
   font-size: 13px;
 }
-._size200_15w34_81 {
+._size200_bp3g5_81 {
   font-size: 16px;
 }
-._size300_15w34_85 {
+._size300_bp3g5_85 {
   font-size: 19px;
 }
-._size400_15w34_89 {
+._size400_bp3g5_89 {
   font-size: 25px;
 }
-._size500_15w34_93 {
+._size500_bp3g5_93 {
   font-size: 32px;
 }
-._size700_15w34_97 {
+._size700_bp3g5_97 {
   font-size: 38px;
 }
-._size800_15w34_101 {
+._size800_bp3g5_101 {
   font-size: 46px;
 }
-._size900_15w34_105 {
+._size900_bp3g5_105 {
   font-size: 55px;
 }
-._size1100_15w34_109 {
+._size1100_bp3g5_109 {
   font-size: 83px;
 }
 @media (min-width: 480px) {
-  ._size300_15w34_85 {
+  ._size300_bp3g5_85 {
     font-size: 20px;
   }
-  ._size700_15w34_97 {
-    font-size: 49px;
+  ._size700_bp3g5_97 {
+    font-size: 44px;
   }
-  ._size800_15w34_101 {
+  ._size800_bp3g5_101 {
     font-size: 63px;
   }
-  ._size900_15w34_105 {
+  ._size900_bp3g5_105 {
     font-size: 76px;
   }
-  ._size1100_15w34_109 {
+  ._size1100_bp3g5_109 {
     font-size: 119px;
   }
 }
-._center_15w34_137 {
+._center_bp3g5_137 {
   text-align: center;
 }
-._forceLeft_15w34_141 {
+._forceLeft_bp3g5_141 {
   text-align: left;
 }
-._forceRight_15w34_145 {
+._forceRight_bp3g5_145 {
   text-align: right;
 }
-._start_15w34_149 {
+._start_bp3g5_149 {
   text-align: start;
 }
-._end_15w34_153 {
+._end_bp3g5_153 {
   text-align: end;
 }
-._regular_15w34_159 {
+._regular_bp3g5_159 {
   font-weight: 400;
 }
-._medium_15w34_163 {
+._medium_bp3g5_163 {
   font-weight: 510;
 }
-._semiBold_15w34_167 {
+._semiBold_bp3g5_167 {
   font-weight: 590;
 }
-._bold_15w34_171 {
+._bold_bp3g5_171 {
   font-weight: 700;
 }
-._underline_15w34_175 {
+._underline_bp3g5_175 {
   text-decoration: underline;
 }
-._inline_15w34_179 {
+._inline_bp3g5_179 {
   display: inline;
 }
-._uppercase_15w34_183 {
+._uppercase_bp3g5_183 {
   text-transform: uppercase;
 }
-._lineClamp_15w34_187 {
+._lineClamp_bp3g5_187 {
   -webkit-box-orient: vertical;
   display: -webkit-box;
   max-width: 100%;
   overflow: hidden;
   word-break: break-word;
 }
-._p100_15w34_196 {
+._p100_bp3g5_196 {
   line-height: 150%;
 }
-._p200_15w34_200 {
+._p200_bp3g5_200 {
   line-height: 150%;
 }
-._p300_15w34_204 {
+._p300_bp3g5_204 {
   line-height: 140%;
 }
-._p400_15w34_208 {
+._p400_bp3g5_208 {
   line-height: 130%;
 }
-._p500_15w34_212 {
+._p500_bp3g5_212 {
   line-height: 115%;
 }