@cambly/syntax-core 19.2.0 → 19.2.1

package/dist/__chunks/{5NQO6SP3.cjs → WS6CZJQ6.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 _BDCZ5GX7cjs = require('./BDCZ5GX7.cjs');
+var _TA4EX7DLcjs = require('./TA4EX7DL.cjs');
 
 // src/Typography/Typography.tsx
 var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
@@ -38,7 +38,7 @@ var Typography = _react.forwardRef.call(void 0, function Typography2({
         Typography_module_default[align],
         Typography_module_default[weight],
         fontStyle === "serif" ? Typography_module_default.serif : Typography_module_default.sansSerif,
-        _BDCZ5GX7cjs.textColor.call(void 0, color),
+        _TA4EX7DLcjs.textColor.call(void 0, color),
         inline && Typography_module_default.inline,
         Typography_module_default[`size${size}`],
         transform === "uppercase" && Typography_module_default.uppercase,
@@ -61,4 +61,4 @@ var Typography_default = Typography;
 
 
 exports.Typography_default = Typography_default;
-//# sourceMappingURL=5NQO6SP3.cjs.map
+//# sourceMappingURL=WS6CZJQ6.cjs.map

package/dist/__chunks/WS6CZJQ6.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Typography/Typography.tsx","css-module:./Typography.module.css#css-module"],"names":["Typography"],"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,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,kBAAiB;;;ADsJn9B;AA9IJ,IAAM,aAAa,WAwHjB,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","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     * * `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     * * `700`: 49px\n     * * `800`: 63px\n     * * `900`: 76px\n     * * `1100`: 119px\n     *\n     * @defaultValue 200\n     */\n    size?: 0 | 100 | 200 | 300 | 400 | 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_1fz2y_1\",\"sansSerif\":\"_sansSerif_1fz2y_22\",\"serif\":\"_serif_1fz2y_27\",\"size0\":\"_size0_1fz2y_73\",\"size100\":\"_size100_1fz2y_77\",\"size200\":\"_size200_1fz2y_81\",\"size300\":\"_size300_1fz2y_85\",\"size400\":\"_size400_1fz2y_89\",\"size700\":\"_size700_1fz2y_93\",\"size800\":\"_size800_1fz2y_97\",\"size900\":\"_size900_1fz2y_101\",\"size1100\":\"_size1100_1fz2y_105\",\"center\":\"_center_1fz2y_133\",\"forceLeft\":\"_forceLeft_1fz2y_137\",\"forceRight\":\"_forceRight_1fz2y_141\",\"start\":\"_start_1fz2y_145\",\"end\":\"_end_1fz2y_149\",\"regular\":\"_regular_1fz2y_155\",\"medium\":\"_medium_1fz2y_159\",\"semiBold\":\"_semiBold_1fz2y_163\",\"bold\":\"_bold_1fz2y_167\",\"underline\":\"_underline_1fz2y_171\",\"inline\":\"_inline_1fz2y_175\",\"uppercase\":\"_uppercase_1fz2y_179\",\"lineClamp\":\"_lineClamp_1fz2y_183\",\"p100\":\"_p100_1fz2y_192\",\"p200\":\"_p200_1fz2y_196\",\"p300\":\"_p300_1fz2y_200\",\"p400\":\"_p400_1fz2y_204\"}"]}

package/dist/__chunks/{IHGDCH62.cjs → WSKCMPTD.cjs}

@@ -4,7 +4,7 @@
 var _QODNNCT2cjs = require('./QODNNCT2.cjs');
 
 
-var _5NQO6SP3cjs = require('./5NQO6SP3.cjs');
+var _WS6CZJQ6cjs = require('./WS6CZJQ6.cjs');
 
 
 var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
@@ -76,7 +76,7 @@ var Chip = _react.forwardRef.call(void 0,
         onClick: onChange,
         children: [
           Icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: iconStyles, size: 100 }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: Icon ? 1 : 0, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _5NQO6SP3cjs.Typography_default, { size: 100, color, weight: "medium", children: text }) })
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: Icon ? 1 : 0, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WS6CZJQ6cjs.Typography_default, { size: 100, color, weight: "medium", children: text }) })
         ]
       }
     );
@@ -88,4 +88,4 @@ var Chip_default = Chip;
 
 
 exports.Chip_default = Chip_default;
-//# sourceMappingURL=IHGDCH62.cjs.map
+//# sourceMappingURL=WSKCMPTD.cjs.map

package/dist/__chunks/{4AI6GQ5U.cjs → WT62D7UB.cjs}

@@ -7,7 +7,7 @@ var _XLUVINJWcjs = require('./XLUVINJW.cjs');
 var _QODNNCT2cjs = require('./QODNNCT2.cjs');
 
 
-var _5NQO6SP3cjs = require('./5NQO6SP3.cjs');
+var _WS6CZJQ6cjs = require('./WS6CZJQ6.cjs');
 
 
 var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
@@ -111,7 +111,7 @@ var RadioButton = ({
           }
         ),
         label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _5NQO6SP3cjs.Typography_default,
+          _WS6CZJQ6cjs.Typography_default,
           {
             size: size === "md" ? 200 : 100,
             color: error ? "destructive-darkBackground" : "primary",
@@ -127,4 +127,4 @@ var RadioButton_default = RadioButton;
 
 
 exports.RadioButton_default = RadioButton_default;
-//# sourceMappingURL=4AI6GQ5U.cjs.map
+//# sourceMappingURL=WT62D7UB.cjs.map

package/dist/__chunks/{ULC7XW64.cjs → X4H65FEF.cjs}

@@ -10,4 +10,4 @@ var ColorCambioWhite100 = "#ffffff";
 
 
 exports.ColorBaseDestructive700 = ColorBaseDestructive700; exports.ColorBaseGray700 = ColorBaseGray700; exports.ColorCambioWhite100 = ColorCambioWhite100;
-//# sourceMappingURL=ULC7XW64.cjs.map
+//# sourceMappingURL=X4H65FEF.cjs.map

package/dist/__chunks/{ULC7XW64.cjs.map → X4H65FEF.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"names":[],"mappings":";;;AASO,IAAM,0BAA0B;AAUhC,IAAM,mBAAmB;AAqCzB,IAAM,sBAAsB","sourcesContent":["/**\n * Do not edit directly\n * Generated on Tue, 13 Aug 2024 19:26:44 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"]}
+{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"names":[],"mappings":";;;AASO,IAAM,0BAA0B;AAUhC,IAAM,mBAAmB;AAqCzB,IAAM,sBAAsB","sourcesContent":["/**\n * Do not edit directly\n * Generated on Tue, 20 Aug 2024 03:20:36 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"]}

package/dist/__chunks/{KZIOUAWM.js → XRYFXCR2.js}

@@ -6,7 +6,7 @@ import {
   ColorBaseDestructive700,
   ColorBaseGray700,
   ColorCambioWhite100
-} from "./HO7QM7X2.js";
+} from "./ACYC4E6D.js";
 import {
   Focus_module_default
 } from "./KKADUD65.js";
@@ -15,7 +15,7 @@ import {
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./DAK5IGJK.js";
+} from "./KIEWPPIM.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -148,4 +148,4 @@ SelectList.Option = SelectOption_default;
 export {
   SelectList
 };
-//# sourceMappingURL=KZIOUAWM.js.map
+//# sourceMappingURL=XRYFXCR2.js.map

package/dist/__chunks/{VU4LGL2W.js → YSI244J6.js}

@@ -16,8 +16,10 @@ function textColor(color) {
       return colors_module_default.inheritColor;
     case "destructive-primary":
       return colors_module_default.cambioDestructive900Color;
+    case "destructive-lightBackground":
+      return colors_module_default.cambioDestructive900Color;
     case "destructive-darkBackground":
-      return colors_module_default.cambioDestructive700Color;
+      return colors_module_default.cambioDestructive300Color;
     case "success":
       return colors_module_default.cambioSuccess700Color;
     case "success-darkBackground":
@@ -30,4 +32,4 @@ function textColor(color) {
 export {
   textColor
 };
-//# sourceMappingURL=VU4LGL2W.js.map
+//# sourceMappingURL=YSI244J6.js.map

package/dist/__chunks/YSI244J6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/colors/textColors.ts"],"sourcesContent":["import colorStyles from \"../colors/colors.module.css\";\n\nexport default function textColor(\n  color:\n    | \"gray900\"\n    | \"gray700\"\n    | \"primary\"\n    | \"destructive-primary\"\n    | \"destructive-lightBackground\"\n    | \"destructive-darkBackground\"\n    | \"success\"\n    | \"success-darkBackground\"\n    | \"white\"\n    | \"white-secondary\"\n    | \"inherit\",\n): string {\n  switch (color) {\n    case \"gray700\":\n      return colorStyles.cambioGray800Color;\n    case \"white\":\n      return colorStyles.cambioWhiteColor;\n    case \"white-secondary\":\n      return colorStyles.cambioWhite70Color;\n    case \"inherit\":\n      return colorStyles.inheritColor;\n    case \"destructive-primary\":\n      return colorStyles.cambioDestructive900Color;\n    case \"destructive-lightBackground\":\n      return colorStyles.cambioDestructive900Color;\n    case \"destructive-darkBackground\":\n      return colorStyles.cambioDestructive300Color;\n    case \"success\":\n      return colorStyles.cambioSuccess700Color;\n    case \"success-darkBackground\":\n      return colorStyles.cambioSuccess100Color;\n    // primary / gray900\n    default:\n      return colorStyles.cambioBlackColor;\n  }\n}\n"],"mappings":";;;;;;AAEe,SAAR,UACL,OAYQ;AACR,UAAQ,OAAO;AAAA,IACb,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IACrB,KAAK;AACH,aAAO,sBAAY;AAAA,IAErB;AACE,aAAO,sBAAY;AAAA,EACvB;AACF;","names":[]}

package/dist/__chunks/{CCKTB7L5.cjs → Z3S2ZWTJ.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _5NQO6SP3cjs = require('./5NQO6SP3.cjs');
+var _WS6CZJQ6cjs = require('./WS6CZJQ6.cjs');
 
 // src/Heading/Heading.tsx
 var _jsxruntime = require('react/jsx-runtime');
@@ -28,7 +28,7 @@ var Heading = ({
   size = 400
 }) => {
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _5NQO6SP3cjs.Typography_default,
+    _WS6CZJQ6cjs.Typography_default,
     {
       align,
       as,
@@ -47,4 +47,4 @@ var Heading_default = Heading;
 
 
 exports.Heading_default = Heading_default;
-//# sourceMappingURL=CCKTB7L5.cjs.map
+//# sourceMappingURL=Z3S2ZWTJ.cjs.map

package/dist/colors/textColors.cjs

@@ -1,11 +1,11 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _BDCZ5GX7cjs = require('../__chunks/BDCZ5GX7.cjs');
+var _TA4EX7DLcjs = require('../__chunks/TA4EX7DL.cjs');
 require('../__chunks/2XIVACBM.cjs');
 require('../__chunks/WFVGNGEP.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
-exports.default = _BDCZ5GX7cjs.textColor;
+exports.default = _TA4EX7DLcjs.textColor;
 //# sourceMappingURL=textColors.cjs.map

package/dist/colors/textColors.d.ts

@@ -1,3 +1,3 @@
-declare function textColor(color: "gray900" | "gray700" | "primary" | "destructive-primary" | "destructive-darkBackground" | "success" | "success-darkBackground" | "white" | "white-secondary" | "inherit"): string;
+declare function textColor(color: "gray900" | "gray700" | "primary" | "destructive-primary" | "destructive-lightBackground" | "destructive-darkBackground" | "success" | "success-darkBackground" | "white" | "white-secondary" | "inherit"): string;
 
 export { textColor as default };

package/dist/colors/textColors.js

@@ -1,7 +1,7 @@
 "use client"
 import {
   textColor
-} from "../__chunks/VU4LGL2W.js";
+} from "../__chunks/YSI244J6.js";
 import "../__chunks/XSYKMCV5.js";
 import "../__chunks/4U4UW4AK.js";
 import "../__chunks/UWGNJENA.js";

package/dist/index.cjs

@@ -10,36 +10,36 @@ var _GEXK47GRcjs = require('./__chunks/GEXK47GR.cjs');
 var _AVJQ2E2Gcjs = require('./__chunks/AVJQ2E2G.cjs');
 
 
-var _E3A6VFMBcjs = require('./__chunks/E3A6VFMB.cjs');
+var _23LD2DDBcjs = require('./__chunks/23LD2DDB.cjs');
 
 
 var _IBT4YOI5cjs = require('./__chunks/IBT4YOI5.cjs');
 
 
-var _OVHMMIVEcjs = require('./__chunks/OVHMMIVE.cjs');
+var _BFZFNLM5cjs = require('./__chunks/BFZFNLM5.cjs');
 
 
-var _OQSEZXJ6cjs = require('./__chunks/OQSEZXJ6.cjs');
+var _2RPK7IB4cjs = require('./__chunks/2RPK7IB4.cjs');
 
 
-var _CCKTB7L5cjs = require('./__chunks/CCKTB7L5.cjs');
+var _Z3S2ZWTJcjs = require('./__chunks/Z3S2ZWTJ.cjs');
 require('./__chunks/HUIHS6RN.cjs');
 require('./__chunks/7KH536I2.cjs');
 require('./__chunks/THM3NAFO.cjs');
 
 
-var _JOTFTEBXcjs = require('./__chunks/JOTFTEBX.cjs');
+var _TTR4ZAGCcjs = require('./__chunks/TTR4ZAGC.cjs');
 
 
 var _RUXLZWRZcjs = require('./__chunks/RUXLZWRZ.cjs');
 require('./__chunks/TH4TA3JN.cjs');
 
 
-var _CWVVOO2Gcjs = require('./__chunks/CWVVOO2G.cjs');
+var _W4YEJQZHcjs = require('./__chunks/W4YEJQZH.cjs');
 require('./__chunks/JVGX637E.cjs');
 
 
-var _5SG2TWV3cjs = require('./__chunks/5SG2TWV3.cjs');
+var _G2RAXJEAcjs = require('./__chunks/G2RAXJEA.cjs');
 
 
 var _VZTP4FJUcjs = require('./__chunks/VZTP4FJU.cjs');
@@ -49,70 +49,70 @@ require('./__chunks/3RX4RMGC.cjs');
 
 var _VJWLFFADcjs = require('./__chunks/VJWLFFAD.cjs');
 require('./__chunks/WFVGNGEP.cjs');
-require('./__chunks/ULC7XW64.cjs');
-require('./__chunks/OMXDPTE4.cjs');
+require('./__chunks/X4H65FEF.cjs');
+require('./__chunks/GK3YX7CI.cjs');
 
 
 var _6KSVCCCBcjs = require('./__chunks/6KSVCCCB.cjs');
 
 
-var _BFEZ3PUTcjs = require('./__chunks/BFEZ3PUT.cjs');
+var _7VNHS3DAcjs = require('./__chunks/7VNHS3DA.cjs');
 
 
 var _A3B4YKGNcjs = require('./__chunks/A3B4YKGN.cjs');
 require('./__chunks/5JUNB754.cjs');
 require('./__chunks/3P2PWHOU.cjs');
 require('./__chunks/65BTPZZT.cjs');
-require('./__chunks/EHZAOGLQ.cjs');
+require('./__chunks/WHTMS6T3.cjs');
 require('./__chunks/MF7LLV7V.cjs');
-require('./__chunks/66VTCVJA.cjs');
+require('./__chunks/PGMFMTEU.cjs');
 
 
-var _4AI6GQ5Ucjs = require('./__chunks/4AI6GQ5U.cjs');
+var _WT62D7UBcjs = require('./__chunks/WT62D7UB.cjs');
 require('./__chunks/XLUVINJW.cjs');
-require('./__chunks/URBKDUMU.cjs');
+require('./__chunks/OOAQZC7E.cjs');
 
 
-var _IHGDCH62cjs = require('./__chunks/IHGDCH62.cjs');
+var _WSKCMPTDcjs = require('./__chunks/WSKCMPTD.cjs');
 require('./__chunks/RYUXG4AS.cjs');
 
 
 var _36JMUQOLcjs = require('./__chunks/36JMUQOL.cjs');
 
 
-var _5NI7VPKScjs = require('./__chunks/5NI7VPKS.cjs');
+var _AJC6QV6Mcjs = require('./__chunks/AJC6QV6M.cjs');
 
 
-var _AUO7CEJIcjs = require('./__chunks/AUO7CEJI.cjs');
+var _QJGERVMNcjs = require('./__chunks/QJGERVMN.cjs');
 
 
 
 var _4QUXUGJPcjs = require('./__chunks/4QUXUGJP.cjs');
 
 
-var _OBQBJKAYcjs = require('./__chunks/OBQBJKAY.cjs');
+var _CMUPFOVXcjs = require('./__chunks/CMUPFOVX.cjs');
 
 
-var _ML36DCKLcjs = require('./__chunks/ML36DCKL.cjs');
+var _C5V4NLVScjs = require('./__chunks/C5V4NLVS.cjs');
 
 
 var _3UEOKPM2cjs = require('./__chunks/3UEOKPM2.cjs');
 require('./__chunks/7DGFMDT7.cjs');
 
-require('./__chunks/S4JNYLMA.cjs');
+require('./__chunks/JN5UK7KH.cjs');
 require('./__chunks/RXQBNEFR.cjs');
 require('./__chunks/2D3DOVVZ.cjs');
 require('./__chunks/F3SUJGZL.cjs');
 require('./__chunks/UKQIAZA5.cjs');
 
 
-var _VWM2UOZ3cjs = require('./__chunks/VWM2UOZ3.cjs');
+var _PGDIO77Vcjs = require('./__chunks/PGDIO77V.cjs');
 
 
 var _QODNNCT2cjs = require('./__chunks/QODNNCT2.cjs');
 
 
-var _UXSGTOGUcjs = require('./__chunks/UXSGTOGU.cjs');
+var _PCEOK3GOcjs = require('./__chunks/PCEOK3GO.cjs');
 require('./__chunks/PLUVW6AM.cjs');
 require('./__chunks/IL22HCBF.cjs');
 
@@ -120,8 +120,8 @@ require('./__chunks/IL22HCBF.cjs');
 require('./__chunks/CHDS4D44.cjs');
 
 
-var _5NQO6SP3cjs = require('./__chunks/5NQO6SP3.cjs');
-require('./__chunks/BDCZ5GX7.cjs');
+var _WS6CZJQ6cjs = require('./__chunks/WS6CZJQ6.cjs');
+require('./__chunks/TA4EX7DL.cjs');
 require('./__chunks/2XIVACBM.cjs');
 
 require('./__chunks/K4AUV2VK.cjs');
@@ -162,5 +162,5 @@ require('./__chunks/X2SDR4SD.cjs');
 
 
 
-exports.Avatar = _GQUBAKFOcjs.Avatar_default; exports.AvatarGroup = _GEXK47GRcjs.AvatarGroup; exports.Badge = _E3A6VFMBcjs.Badge_default; exports.Box = _QODNNCT2cjs.Box_default; exports.Button = _BFEZ3PUTcjs.Button_default; exports.ButtonGroup = _6KSVCCCBcjs.ButtonGroup_default; exports.Card = _AVJQ2E2Gcjs.Card_default; exports.Checkbox = _OVHMMIVEcjs.Checkbox_default; exports.Chip = _IHGDCH62cjs.Chip_default; exports.Divider = _A3B4YKGNcjs.Divider; exports.Heading = _CCKTB7L5cjs.Heading_default; exports.Icon = _IBT4YOI5cjs.Icon_default; exports.IconButton = _VJWLFFADcjs.IconButton_default; exports.IconLinkButton = _RUXLZWRZcjs.IconLinkButton_default; exports.LinkButton = _JOTFTEBXcjs.LinkButton_default; exports.Modal = _OQSEZXJ6cjs.Modal; exports.Popover = _VZTP4FJUcjs.Popover_default; exports.RadioButton = _4AI6GQ5Ucjs.RadioButton_default; exports.RichSelectList = _5SG2TWV3cjs.RichSelectList_default; exports.SelectList = _CWVVOO2Gcjs.SelectList; exports.TabButton = _ML36DCKLcjs.TabButton; exports.TabLink = _OBQBJKAYcjs.TabLink_default; exports.Tabs = _4QUXUGJPcjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _AUO7CEJIcjs.TextArea_default; exports.TextField = _5NI7VPKScjs.TextField; exports.ThemeProvider = _36JMUQOLcjs.ThemeProvider; exports.Tooltip = _UXSGTOGUcjs.Tooltip_default; exports.Typography = _5NQO6SP3cjs.Typography_default; exports.WordConfetti = _VWM2UOZ3cjs.WordConfetti_default;
+exports.Avatar = _GQUBAKFOcjs.Avatar_default; exports.AvatarGroup = _GEXK47GRcjs.AvatarGroup; exports.Badge = _23LD2DDBcjs.Badge_default; exports.Box = _QODNNCT2cjs.Box_default; exports.Button = _7VNHS3DAcjs.Button_default; exports.ButtonGroup = _6KSVCCCBcjs.ButtonGroup_default; exports.Card = _AVJQ2E2Gcjs.Card_default; exports.Checkbox = _BFZFNLM5cjs.Checkbox_default; exports.Chip = _WSKCMPTDcjs.Chip_default; exports.Divider = _A3B4YKGNcjs.Divider; exports.Heading = _Z3S2ZWTJcjs.Heading_default; exports.Icon = _IBT4YOI5cjs.Icon_default; exports.IconButton = _VJWLFFADcjs.IconButton_default; exports.IconLinkButton = _RUXLZWRZcjs.IconLinkButton_default; exports.LinkButton = _TTR4ZAGCcjs.LinkButton_default; exports.Modal = _2RPK7IB4cjs.Modal; exports.Popover = _VZTP4FJUcjs.Popover_default; exports.RadioButton = _WT62D7UBcjs.RadioButton_default; exports.RichSelectList = _G2RAXJEAcjs.RichSelectList_default; exports.SelectList = _W4YEJQZHcjs.SelectList; exports.TabButton = _C5V4NLVScjs.TabButton; exports.TabLink = _CMUPFOVXcjs.TabLink_default; exports.Tabs = _4QUXUGJPcjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _QJGERVMNcjs.TextArea_default; exports.TextField = _AJC6QV6Mcjs.TextField; exports.ThemeProvider = _36JMUQOLcjs.ThemeProvider; exports.Tooltip = _PCEOK3GOcjs.Tooltip_default; exports.Typography = _WS6CZJQ6cjs.Typography_default; exports.WordConfetti = _PGDIO77Vcjs.WordConfetti_default;
 //# sourceMappingURL=index.cjs.map

package/dist/index.css

@@ -3128,7 +3128,7 @@
 }
 
 /* css-module:/home/runner/work/syntax/syntax/packages/syntax-core/src/TextField/TextField.module.css/#css-module-data */
-._textfield_1of18_1 {
+._textfield_f2wi6_1 {
   appearance: none;
   border: 1px solid var(--color-cambio-gray-370);
   border-radius: 8px;
@@ -3146,29 +3146,41 @@
   width: 100%;
   font-size: 16px;
 }
-._textfield_1of18_1:focus {
+._transparent_f2wi6_13 {
+  background: transparent;
+  border: 1px solid var(--color-cambio-white-100);
+  color: var(--color-cambio-white-100);
+}
+._textfield_f2wi6_1:focus {
   outline: none;
   box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
 }
-._textfield_1of18_1:disabled {
+._textfield_f2wi6_1:disabled {
   cursor: auto;
 }
-._label_1of18_22 {
+._label_f2wi6_28 {
   cursor: pointer;
 }
-._md_1of18_26 {
+._md_f2wi6_32 {
   padding: 12px;
 }
-._height_1of18_30 {
+._height_f2wi6_36 {
   height: 48px;
 }
-._inputError_1of18_34 {
+._inputError_f2wi6_40 {
   color: var(--color-cambio-destructive-900);
-  border: 2px solid var(--color-cambio-destructive-700);
+  border: 1px solid var(--color-cambio-destructive-700);
 }
-._inputError_1of18_34::placeholder {
+._inputError_f2wi6_40::placeholder {
   color: var(--color-cambio-destructive-900);
 }
+._transparentInputError_f2wi6_49 {
+  color: var(--color-cambio-destructive-370);
+  border: 1px solid var(--color-cambio-destructive-300);
+}
+._transparenInputError_f2wi6_54::placeholder {
+  color: var(--color-cambio-destructive-370);
+}
 
 /* css-module:/home/runner/work/syntax/syntax/packages/syntax-core/src/Tooltip/Tooltip.module.css/#css-module-data */
 ._tooltip_11pyp_1 {