@cambly/syntax-core 19.2.1 → 19.4.0

package/dist/__chunks/{AJC6QV6M.cjs → WVK5Z5JA.cjs}

@@ -1,10 +1,13 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
 
 
+var _SJSSW5MPcjs = require('./SJSSW5MP.cjs');
+
+
 var _QODNNCT2cjs = require('./QODNNCT2.cjs');
 
 
-var _WS6CZJQ6cjs = require('./WS6CZJQ6.cjs');
+var _RVU3UEZIcjs = require('./RVU3UEZI.cjs');
 
 
 var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
@@ -25,6 +28,7 @@ function TextField({
   "data-testid": dataTestId,
   disabled: disabledProp = false,
   on = "lightBackground",
+  endBadge,
   errorText = "",
   helperText = "",
   id,
@@ -55,32 +59,57 @@ function TextField({
         }
       },
       children: [
-        label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { className: TextField_module_default.label, htmlFor: inputId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WS6CZJQ6cjs.Typography_default, { size: 100, color: textColor, children: label }) }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          "input",
+        label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { className: TextField_module_default.label, htmlFor: inputId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RVU3UEZIcjs.Typography_default, { size: 100, color: textColor, children: label }) }) }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          _QODNNCT2cjs.Box_default,
           {
-            autoComplete,
-            className: _classnames2.default.call(void 0, 
-              TextField_module_default.textfield,
-              TextField_module_default.md,
-              TextField_module_default.height,
-              errorText && (on === "darkBackground" ? TextField_module_default.transparentInputError : TextField_module_default.inputError),
-              {
-                [TextField_module_default.transparent]: on === "darkBackground"
-              }
-            ),
-            "data-testid": dataTestId,
-            disabled,
-            id: inputId,
-            maxLength,
-            type,
-            onChange,
-            placeholder,
-            value,
-            step
+            display: "flex",
+            position: "relative",
+            justifyContent: endBadge ? "end" : "start",
+            children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "input",
+                {
+                  autoComplete,
+                  className: _classnames2.default.call(void 0, 
+                    TextField_module_default.textfield,
+                    TextField_module_default.md,
+                    TextField_module_default.height,
+                    errorText && (on === "darkBackground" ? TextField_module_default.transparentInputError : TextField_module_default.inputError),
+                    {
+                      [TextField_module_default.transparent]: on === "darkBackground"
+                    }
+                  ),
+                  "data-testid": dataTestId,
+                  disabled,
+                  id: inputId,
+                  maxLength,
+                  type,
+                  onChange,
+                  placeholder,
+                  value,
+                  step
+                }
+              ),
+              endBadge && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _QODNNCT2cjs.Box_default,
+                {
+                  position: "absolute",
+                  dangerouslySetInlineStyle: { __style: { top: "25%" } },
+                  marginEnd: 4,
+                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    _SJSSW5MPcjs.Badge_default,
+                    {
+                      text: endBadge,
+                      color: on === "lightBackground" ? "gray370" : "gray870"
+                    }
+                  )
+                }
+              )
+            ]
           }
         ),
-        (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WS6CZJQ6cjs.Typography_default, { size: 100, color: errorText ? errorTextColor : textColor, children: errorText || helperText }) })
+        (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RVU3UEZIcjs.Typography_default, { size: 100, color: errorText ? errorTextColor : textColor, children: errorText || helperText }) })
       ]
     }
   );
@@ -89,4 +118,4 @@ function TextField({
 
 
 exports.TextField = TextField;
-//# sourceMappingURL=AJC6QV6M.cjs.map
+//# sourceMappingURL=WVK5Z5JA.cjs.map

package/dist/__chunks/WVK5Z5JA.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/TextField/TextField.tsx","css-module:./TextField.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA,EAGE;AAAA,OACK;AACP,OAAO,gBAAgB;;;ACL2E,IAAO,2BAAQ,EAAC,aAAY,sBAAqB,eAAc,yBAAwB,SAAQ,mBAAkB,MAAK,gBAAe,UAAS,oBAAmB,cAAa,wBAAuB,yBAAwB,mCAAkC,wBAAuB,iCAAgC;;;AD6H5Y,cAMN,YANM;AA9GG,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA,eAAe;AAAA,EACf,UAAU,eAAe;AAAA,EACzB,KAAK;AAAA,EACL;AAAA,EACA,YAAY;AAAA,EACZ,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AACF,GAqEiB;AACf,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,UAAU,MAAM;AACtB,QAAM,UAAU,kBAAM;AACtB,QAAM,YAAY,OAAO,mBAAmB,UAAU;AACtD,QAAM,iBACJ,OAAO,mBACH,gCACA;AACN,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,WAAU;AAAA,MACV,KAAK;AAAA,MACL,OAAM;AAAA,MACN,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,SAAS,WAAW,MAAM;AAAA,QAC5B;AAAA,MACF;AAAA,MAEC;AAAA,iBACC,oBAAC,WAAM,WAAW,yBAAO,OAAO,SAAS,SACvC,8BAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,KAAK,OAAO,WAC3B,iBACH,GACF,GACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,UAAS;AAAA,YACT,gBAAgB,WAAW,QAAQ;AAAA,YAEnC;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC;AAAA,kBACA,WAAW;AAAA,oBACT,yBAAO;AAAA,oBACP,yBAAO;AAAA,oBACP,yBAAO;AAAA,oBACP,cACG,OAAO,mBACJ,yBAAO,wBACP,yBAAO;AAAA,oBACb;AAAA,sBACE,CAAC,yBAAO,WAAW,GAAG,OAAO;AAAA,oBAC/B;AAAA,kBACF;AAAA,kBACA,eAAa;AAAA,kBACb;AAAA,kBACA,IAAI;AAAA,kBACJ;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACF;AAAA,cACC,YACC;AAAA,gBAAC;AAAA;AAAA,kBACC,UAAS;AAAA,kBACT,2BAA2B,EAAE,SAAS,EAAE,KAAK,MAAM,EAAE;AAAA,kBACrD,WAAW;AAAA,kBAEX;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM;AAAA,sBACN,OAAO,OAAO,oBAAoB,YAAY;AAAA;AAAA,kBAChD;AAAA;AAAA,cACF;AAAA;AAAA;AAAA,QAEJ;AAAA,SACE,cAAc,cACd,oBAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,KAAK,OAAO,YAAY,iBAAiB,WACxD,uBAAa,YAChB,GACF;AAAA;AAAA;AAAA,EAEJ;AAEJ","sourcesContent":["import React, {\n  type ReactElement,\n  type HTMLInputTypeAttribute,\n  useId,\n} from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./TextField.module.css\";\nimport Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport Badge from \"../Badge/Badge\";\n\n/**\n * [TextField](https://cambly-syntax.vercel.app/?path=/docs/components-textfield--docs) is a component that allows users to enter text.\n */\nexport default function TextField({\n  autoComplete,\n  \"data-testid\": dataTestId,\n  disabled: disabledProp = false,\n  on = \"lightBackground\",\n  endBadge,\n  errorText = \"\",\n  helperText = \"\",\n  id,\n  label,\n  maxLength,\n  onChange,\n  placeholder = \"\",\n  type = \"text\",\n  value = \"\",\n  step,\n}: {\n  /**\n   * The autocomplete attribute specifies whether or not an input field should have autocomplete enabled.\n   *\n   * Feel free to add new values from the [MDN docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) as needed\n   */\n  autoComplete?: \"current-password\" | \"new-password\" | \"off\" | \"on\" | \"email\";\n  /**\n   * A data-testid to make querying for the TextField easier.\n   */\n  \"data-testid\"?: string;\n  /**\n   * If true, the TextField will be disabled.\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * Indicate whether the button renders on a light or dark background. Changes the color of the button\n   *\n   * @defaulValue `lightBackground`\n   */\n  on?: \"lightBackground\" | \"darkBackground\";\n  /**\n   * Text for endBadge shown at the end of the input field.\n   */\n  endBadge?: string;\n  /**\n   * Text shown below TextField if there is an input error.\n   */\n  errorText?: string;\n  /**\n   * Informative helper text shown below TextField\n   */\n  helperText?: string;\n  /**\n   * TextField id, if not provided, a unique id will be generated\n   */\n  id?: string;\n  /**\n   * TextField visible label\n   */\n  label: string;\n  /**\n   * Maximum length of the TextField\n   */\n  maxLength?: number;\n  /**\n   * The callback to be called the input changes\n   */\n  onChange: React.ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Optional TextField placeholder text\n   */\n  placeholder?: string;\n  /**\n   * Input type of the TextField\n   *\n   * See [full list of input types](https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types)\n   */\n  type?: HTMLInputTypeAttribute;\n  /**\n   * Value of the TextField\n   */\n  value: string;\n  /**\n   * Specified legal number intervals for an input field. Specifically for time or number. If for time, specify in milliseconds. Must be a positive value.\n   */\n  step?: number;\n}): ReactElement {\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const reactId = useId();\n  const inputId = id ?? reactId;\n  const textColor = on === \"darkBackground\" ? \"white\" : \"gray900\";\n  const errorTextColor =\n    on !== \"darkBackground\"\n      ? \"destructive-lightBackground\"\n      : \"destructive-darkBackground\";\n  return (\n    <Box\n      display=\"flex\"\n      direction=\"column\"\n      gap={2}\n      width=\"100%\"\n      dangerouslySetInlineStyle={{\n        __style: {\n          opacity: disabled ? 0.5 : 1,\n        },\n      }}\n    >\n      {label && (\n        <label className={styles.label} htmlFor={inputId}>\n          <Box paddingX={1}>\n            <Typography size={100} color={textColor}>\n              {label}\n            </Typography>\n          </Box>\n        </label>\n      )}\n      <Box\n        display=\"flex\"\n        position=\"relative\"\n        justifyContent={endBadge ? \"end\" : \"start\"}\n      >\n        <input\n          autoComplete={autoComplete}\n          className={classNames(\n            styles.textfield,\n            styles.md,\n            styles.height,\n            errorText &&\n              (on === \"darkBackground\"\n                ? styles.transparentInputError\n                : styles.inputError),\n            {\n              [styles.transparent]: on === \"darkBackground\",\n            },\n          )}\n          data-testid={dataTestId}\n          disabled={disabled}\n          id={inputId}\n          maxLength={maxLength}\n          type={type}\n          onChange={onChange}\n          placeholder={placeholder}\n          value={value}\n          step={step}\n        />\n        {endBadge && (\n          <Box\n            position=\"absolute\"\n            dangerouslySetInlineStyle={{ __style: { top: \"25%\" } }}\n            marginEnd={4}\n          >\n            <Badge\n              text={endBadge}\n              color={on === \"lightBackground\" ? \"gray370\" : \"gray870\"}\n            />\n          </Box>\n        )}\n      </Box>\n      {(helperText || errorText) && (\n        <Box paddingX={1}>\n          <Typography size={100} color={errorText ? errorTextColor : textColor}>\n            {errorText || helperText}\n          </Typography>\n        </Box>\n      )}\n    </Box>\n  );\n}\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_f2wi6_1\",\"transparent\":\"_transparent_f2wi6_13\",\"label\":\"_label_f2wi6_28\",\"md\":\"_md_f2wi6_32\",\"height\":\"_height_f2wi6_36\",\"inputError\":\"_inputError_f2wi6_40\",\"transparentInputError\":\"_transparentInputError_f2wi6_49\",\"transparenInputError\":\"_transparenInputError_f2wi6_54\"}"]}

package/dist/__chunks/{D45HCKL3.js → XEHZJBLD.js}

@@ -4,7 +4,7 @@ import {
 } from "./IB6JZQF3.js";
 import {
   Typography_default
-} from "./KIEWPPIM.js";
+} from "./RJQ2LSPP.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -88,4 +88,4 @@ var Chip_default = Chip;
 export {
   Chip_default
 };
-//# sourceMappingURL=D45HCKL3.js.map
+//# sourceMappingURL=XEHZJBLD.js.map

package/dist/__chunks/{OOAQZC7E.cjs → XSU6O5C3.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _WSKCMPTDcjs = require('./WSKCMPTD.cjs');
+var _PBHDA7GVcjs = require('./PBHDA7GV.cjs');
 
 
 var _RYUXG4AScjs = require('./RYUXG4AS.cjs');
@@ -16,7 +16,7 @@ var _jsxruntime = require('react/jsx-runtime');
 var RichSelectChip_default = _react.forwardRef.call(void 0, 
   function RichSelectChip(props, ref) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RYUXG4AScjs.RichSelectItem_default, _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, props), { ref, children: ({ isSelected, isFocusVisible, isDisabled }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _WSKCMPTDcjs.Chip_default,
+      _PBHDA7GVcjs.Chip_default,
       {
         text: props.label,
         selected: isSelected,
@@ -31,4 +31,4 @@ var RichSelectChip_default = _react.forwardRef.call(void 0,
 
 
 exports.RichSelectChip_default = RichSelectChip_default;
-//# sourceMappingURL=OOAQZC7E.cjs.map
+//# sourceMappingURL=XSU6O5C3.cjs.map

package/dist/__chunks/{TTR4ZAGC.cjs → YNGB4N62.cjs}

@@ -23,7 +23,7 @@ var _2D3DOVVZcjs = require('./2D3DOVVZ.cjs');
 var _F3SUJGZLcjs = require('./F3SUJGZL.cjs');
 
 
-var _WS6CZJQ6cjs = require('./WS6CZJQ6.cjs');
+var _RVU3UEZIcjs = require('./RVU3UEZI.cjs');
 
 // src/LinkButton/LinkButton.tsx
 
@@ -89,7 +89,7 @@ var LinkButton = _react.forwardRef.call(void 0,
               size: _65BTPZZTcjs.internalIconSize[size]
             }
           ),
-          !loading && text && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WS6CZJQ6cjs.Typography_default, { size: _5JUNB754cjs.textVariant_default[size], weight: "medium", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          !loading && text && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RVU3UEZIcjs.Typography_default, { size: _5JUNB754cjs.textVariant_default[size], weight: "medium", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "span",
             {
               className: foregroundColorClass,
@@ -138,4 +138,4 @@ var LinkButton_default = LinkButton;
 
 
 exports.LinkButton_default = LinkButton_default;
-//# sourceMappingURL=TTR4ZAGC.cjs.map
+//# sourceMappingURL=YNGB4N62.cjs.map

package/dist/__chunks/{QJGERVMN.cjs → Z6EWS3QI.cjs}

@@ -4,7 +4,7 @@
 var _QODNNCT2cjs = require('./QODNNCT2.cjs');
 
 
-var _WS6CZJQ6cjs = require('./WS6CZJQ6.cjs');
+var _RVU3UEZIcjs = require('./RVU3UEZI.cjs');
 
 
 var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
@@ -54,8 +54,8 @@ var TextArea = _react.forwardRef.call(void 0,
         },
         position: "relative",
         children: [
-          label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { className: TextField_module_default.label, htmlFor: inputId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WS6CZJQ6cjs.Typography_default, { size: 100, color: "gray700", children: label }) }) }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WS6CZJQ6cjs.Typography_default, { size: 100, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { className: TextField_module_default.label, htmlFor: inputId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RVU3UEZIcjs.Typography_default, { size: 100, color: "gray700", children: label }) }) }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RVU3UEZIcjs.Typography_default, { size: 100, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "textarea",
             {
               "data-testid": dataTestId,
@@ -78,7 +78,7 @@ var TextArea = _react.forwardRef.call(void 0,
             }
           ) }),
           (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _WS6CZJQ6cjs.Typography_default,
+            _RVU3UEZIcjs.Typography_default,
             {
               size: 100,
               color: errorText ? "destructive-darkBackground" : "gray700",
@@ -95,4 +95,4 @@ var TextArea_default = TextArea;
 
 
 exports.TextArea_default = TextArea_default;
-//# sourceMappingURL=QJGERVMN.cjs.map
+//# sourceMappingURL=Z6EWS3QI.cjs.map

package/dist/index.cjs

@@ -10,36 +10,33 @@ var _GEXK47GRcjs = require('./__chunks/GEXK47GR.cjs');
 var _AVJQ2E2Gcjs = require('./__chunks/AVJQ2E2G.cjs');
 
 
-var _23LD2DDBcjs = require('./__chunks/23LD2DDB.cjs');
-
-
 var _IBT4YOI5cjs = require('./__chunks/IBT4YOI5.cjs');
 
 
-var _BFZFNLM5cjs = require('./__chunks/BFZFNLM5.cjs');
+var _S7BCIAUQcjs = require('./__chunks/S7BCIAUQ.cjs');
 
 
-var _2RPK7IB4cjs = require('./__chunks/2RPK7IB4.cjs');
+var _SAPSO6DDcjs = require('./__chunks/SAPSO6DD.cjs');
 
 
-var _Z3S2ZWTJcjs = require('./__chunks/Z3S2ZWTJ.cjs');
+var _Q7CC3YA4cjs = require('./__chunks/Q7CC3YA4.cjs');
 require('./__chunks/HUIHS6RN.cjs');
 require('./__chunks/7KH536I2.cjs');
 require('./__chunks/THM3NAFO.cjs');
 
 
-var _TTR4ZAGCcjs = require('./__chunks/TTR4ZAGC.cjs');
+var _YNGB4N62cjs = require('./__chunks/YNGB4N62.cjs');
 
 
 var _RUXLZWRZcjs = require('./__chunks/RUXLZWRZ.cjs');
 require('./__chunks/TH4TA3JN.cjs');
 
 
-var _W4YEJQZHcjs = require('./__chunks/W4YEJQZH.cjs');
+var _BDOOAHOCcjs = require('./__chunks/BDOOAHOC.cjs');
 require('./__chunks/JVGX637E.cjs');
 
 
-var _G2RAXJEAcjs = require('./__chunks/G2RAXJEA.cjs');
+var _RE4YJRHBcjs = require('./__chunks/RE4YJRHB.cjs');
 
 
 var _VZTP4FJUcjs = require('./__chunks/VZTP4FJU.cjs');
@@ -49,70 +46,73 @@ require('./__chunks/3RX4RMGC.cjs');
 
 var _VJWLFFADcjs = require('./__chunks/VJWLFFAD.cjs');
 require('./__chunks/WFVGNGEP.cjs');
-require('./__chunks/X4H65FEF.cjs');
-require('./__chunks/GK3YX7CI.cjs');
+require('./__chunks/BJU7QKAS.cjs');
+require('./__chunks/5I7B5SAF.cjs');
 
 
 var _6KSVCCCBcjs = require('./__chunks/6KSVCCCB.cjs');
 
 
-var _7VNHS3DAcjs = require('./__chunks/7VNHS3DA.cjs');
+var _7COSMEXWcjs = require('./__chunks/7COSMEXW.cjs');
 
 
 var _A3B4YKGNcjs = require('./__chunks/A3B4YKGN.cjs');
 require('./__chunks/5JUNB754.cjs');
 require('./__chunks/3P2PWHOU.cjs');
 require('./__chunks/65BTPZZT.cjs');
-require('./__chunks/WHTMS6T3.cjs');
+require('./__chunks/AAZIVDWS.cjs');
 require('./__chunks/MF7LLV7V.cjs');
-require('./__chunks/PGMFMTEU.cjs');
+require('./__chunks/PBOAPP74.cjs');
 
 
-var _WT62D7UBcjs = require('./__chunks/WT62D7UB.cjs');
+var _AI52ORKAcjs = require('./__chunks/AI52ORKA.cjs');
 require('./__chunks/XLUVINJW.cjs');
-require('./__chunks/OOAQZC7E.cjs');
+require('./__chunks/XSU6O5C3.cjs');
 
 
-var _WSKCMPTDcjs = require('./__chunks/WSKCMPTD.cjs');
+var _PBHDA7GVcjs = require('./__chunks/PBHDA7GV.cjs');
 require('./__chunks/RYUXG4AS.cjs');
 
 
 var _36JMUQOLcjs = require('./__chunks/36JMUQOL.cjs');
 
 
-var _AJC6QV6Mcjs = require('./__chunks/AJC6QV6M.cjs');
+var _WVK5Z5JAcjs = require('./__chunks/WVK5Z5JA.cjs');
+
+
+var _SJSSW5MPcjs = require('./__chunks/SJSSW5MP.cjs');
 
 
-var _QJGERVMNcjs = require('./__chunks/QJGERVMN.cjs');
+var _Z6EWS3QIcjs = require('./__chunks/Z6EWS3QI.cjs');
 
 
 
 var _4QUXUGJPcjs = require('./__chunks/4QUXUGJP.cjs');
 
 
-var _CMUPFOVXcjs = require('./__chunks/CMUPFOVX.cjs');
+var _E3KSILLWcjs = require('./__chunks/E3KSILLW.cjs');
 
 
-var _C5V4NLVScjs = require('./__chunks/C5V4NLVS.cjs');
+var _Q65LBFK3cjs = require('./__chunks/Q65LBFK3.cjs');
 
 
 var _3UEOKPM2cjs = require('./__chunks/3UEOKPM2.cjs');
 require('./__chunks/7DGFMDT7.cjs');
 
-require('./__chunks/JN5UK7KH.cjs');
+require('./__chunks/SW6S6ZCI.cjs');
 require('./__chunks/RXQBNEFR.cjs');
 require('./__chunks/2D3DOVVZ.cjs');
 require('./__chunks/F3SUJGZL.cjs');
 require('./__chunks/UKQIAZA5.cjs');
 
 
-var _PGDIO77Vcjs = require('./__chunks/PGDIO77V.cjs');
+var _FHQ7KPFEcjs = require('./__chunks/FHQ7KPFE.cjs');
 
 
 var _QODNNCT2cjs = require('./__chunks/QODNNCT2.cjs');
 
 
-var _PCEOK3GOcjs = require('./__chunks/PCEOK3GO.cjs');
+var _JACR34JOcjs = require('./__chunks/JACR34JO.cjs');
 require('./__chunks/PLUVW6AM.cjs');
 require('./__chunks/IL22HCBF.cjs');
 
@@ -120,7 +120,7 @@ require('./__chunks/IL22HCBF.cjs');
 require('./__chunks/CHDS4D44.cjs');
 
 
-var _WS6CZJQ6cjs = require('./__chunks/WS6CZJQ6.cjs');
+var _RVU3UEZIcjs = require('./__chunks/RVU3UEZI.cjs');
 require('./__chunks/TA4EX7DL.cjs');
 require('./__chunks/2XIVACBM.cjs');
 
@@ -162,5 +162,5 @@ require('./__chunks/X2SDR4SD.cjs');
 
 
 
-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;
+exports.Avatar = _GQUBAKFOcjs.Avatar_default; exports.AvatarGroup = _GEXK47GRcjs.AvatarGroup; exports.Badge = _SJSSW5MPcjs.Badge_default; exports.Box = _QODNNCT2cjs.Box_default; exports.Button = _7COSMEXWcjs.Button_default; exports.ButtonGroup = _6KSVCCCBcjs.ButtonGroup_default; exports.Card = _AVJQ2E2Gcjs.Card_default; exports.Checkbox = _S7BCIAUQcjs.Checkbox_default; exports.Chip = _PBHDA7GVcjs.Chip_default; exports.Divider = _A3B4YKGNcjs.Divider; exports.Heading = _Q7CC3YA4cjs.Heading_default; exports.Icon = _IBT4YOI5cjs.Icon_default; exports.IconButton = _VJWLFFADcjs.IconButton_default; exports.IconLinkButton = _RUXLZWRZcjs.IconLinkButton_default; exports.LinkButton = _YNGB4N62cjs.LinkButton_default; exports.Modal = _SAPSO6DDcjs.Modal; exports.Popover = _VZTP4FJUcjs.Popover_default; exports.RadioButton = _AI52ORKAcjs.RadioButton_default; exports.RichSelectList = _RE4YJRHBcjs.RichSelectList_default; exports.SelectList = _BDOOAHOCcjs.SelectList; exports.TabButton = _Q65LBFK3cjs.TabButton; exports.TabLink = _E3KSILLWcjs.TabLink_default; exports.Tabs = _4QUXUGJPcjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _Z6EWS3QIcjs.TextArea_default; exports.TextField = _WVK5Z5JAcjs.TextField; exports.ThemeProvider = _36JMUQOLcjs.ThemeProvider; exports.Tooltip = _JACR34JOcjs.Tooltip_default; exports.Typography = _RVU3UEZIcjs.Typography_default; exports.WordConfetti = _FHQ7KPFEcjs.WordConfetti_default;
 //# sourceMappingURL=index.cjs.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_1fz2y_1 {
+._typography_15w34_1 {
   line-height: initial;
   margin: 0;
 }
@@ -2306,126 +2306,132 @@
   font-weight: 700;
   src: local("GT-Super-Text-Bold"), url(https://static.cambly.com/fonts/gt-super-text-bold-final.woff2);
 }
-._sansSerif_1fz2y_22 {
+._sansSerif_15w34_22 {
   font-family: var(--syntax-font-sans-serif);
   margin: 0;
 }
-._serif_1fz2y_27 {
+._serif_15w34_27 {
   font-family: var( --syntax-font-sans-serif );
 }
-:lang(en) ._serif_1fz2y_27,
-:lang(az) ._serif_1fz2y_27,
-:lang(fr) ._serif_1fz2y_27,
-:lang(de) ._serif_1fz2y_27,
-:lang(es) ._serif_1fz2y_27,
-:lang(it) ._serif_1fz2y_27,
-:lang(pl) ._serif_1fz2y_27,
-:lang(pt) ._serif_1fz2y_27,
-:lang(tr) ._serif_1fz2y_27 {
+: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 {
   font-family: "GT Super", var(--syntax-font-sans-serif);
   -webkit-font-smoothing: antialiased;
   letter-spacing: -0.02em;
   line-height: 1.15em;
 }
-._size0_1fz2y_73 {
+._size0_15w34_73 {
   font-size: 12px;
 }
-._size100_1fz2y_77 {
+._size100_15w34_77 {
   font-size: 13px;
 }
-._size200_1fz2y_81 {
+._size200_15w34_81 {
   font-size: 16px;
 }
-._size300_1fz2y_85 {
+._size300_15w34_85 {
   font-size: 19px;
 }
-._size400_1fz2y_89 {
+._size400_15w34_89 {
   font-size: 25px;
 }
-._size700_1fz2y_93 {
+._size500_15w34_93 {
+  font-size: 32px;
+}
+._size700_15w34_97 {
   font-size: 38px;
 }
-._size800_1fz2y_97 {
+._size800_15w34_101 {
   font-size: 46px;
 }
-._size900_1fz2y_101 {
+._size900_15w34_105 {
   font-size: 55px;
 }
-._size1100_1fz2y_105 {
+._size1100_15w34_109 {
   font-size: 83px;
 }
 @media (min-width: 480px) {
-  ._size300_1fz2y_85 {
+  ._size300_15w34_85 {
     font-size: 20px;
   }
-  ._size700_1fz2y_93 {
+  ._size700_15w34_97 {
     font-size: 49px;
   }
-  ._size800_1fz2y_97 {
+  ._size800_15w34_101 {
     font-size: 63px;
   }
-  ._size900_1fz2y_101 {
+  ._size900_15w34_105 {
     font-size: 76px;
   }
-  ._size1100_1fz2y_105 {
+  ._size1100_15w34_109 {
     font-size: 119px;
   }
 }
-._center_1fz2y_133 {
+._center_15w34_137 {
   text-align: center;
 }
-._forceLeft_1fz2y_137 {
+._forceLeft_15w34_141 {
   text-align: left;
 }
-._forceRight_1fz2y_141 {
+._forceRight_15w34_145 {
   text-align: right;
 }
-._start_1fz2y_145 {
+._start_15w34_149 {
   text-align: start;
 }
-._end_1fz2y_149 {
+._end_15w34_153 {
   text-align: end;
 }
-._regular_1fz2y_155 {
+._regular_15w34_159 {
   font-weight: 400;
 }
-._medium_1fz2y_159 {
+._medium_15w34_163 {
   font-weight: 510;
 }
-._semiBold_1fz2y_163 {
+._semiBold_15w34_167 {
   font-weight: 590;
 }
-._bold_1fz2y_167 {
+._bold_15w34_171 {
   font-weight: 700;
 }
-._underline_1fz2y_171 {
+._underline_15w34_175 {
   text-decoration: underline;
 }
-._inline_1fz2y_175 {
+._inline_15w34_179 {
   display: inline;
 }
-._uppercase_1fz2y_179 {
+._uppercase_15w34_183 {
   text-transform: uppercase;
 }
-._lineClamp_1fz2y_183 {
+._lineClamp_15w34_187 {
   -webkit-box-orient: vertical;
   display: -webkit-box;
   max-width: 100%;
   overflow: hidden;
   word-break: break-word;
 }
-._p100_1fz2y_192 {
+._p100_15w34_196 {
   line-height: 150%;
 }
-._p200_1fz2y_196 {
+._p200_15w34_200 {
   line-height: 150%;
 }
-._p300_1fz2y_200 {
+._p300_15w34_204 {
   line-height: 140%;
 }
-._p400_1fz2y_204 {
+._p400_15w34_208 {
   line-height: 130%;
 }
+._p500_15w34_212 {
+  line-height: 115%;
+}
 
 /* css-module:/home/runner/work/syntax/syntax/packages/syntax-core/src/Badge/Badge.module.css/#css-module-data */
 ._icon_1g9xb_1 {