@cambly/syntax-core 10.6.0 → 10.7.0-beta.0

package/dist/__chunks/L3WX2LK2.js

@@ -0,0 +1,111 @@
+import {
+  Focus_module_default
+} from "./VPGRPGP7.js";
+import {
+  Typography_default
+} from "./2DQWGEPP.js";
+import {
+  useIsHydrated
+} from "./YJ7YDIGB.js";
+import {
+  useFocusVisible
+} from "./OGJDUOWP.js";
+
+// src/RadioButton/RadioButton.tsx
+import { useState } from "react";
+import classnames from "classnames";
+
+// css-module:./RadioButton.module.css#css-module
+var RadioButton_module_default = { "radioBaseContainer": "_radioBaseContainer_6h2zg_1", "disabled": "_disabled_6h2zg_9", "cursorDisabled": "_cursorDisabled_6h2zg_13", "cursorEnabled": "_cursorEnabled_6h2zg_17", "smBase": "_smBase_6h2zg_21", "mdBase": "_mdBase_6h2zg_25", "radioStyleOverride": "_radioStyleOverride_6h2zg_29", "smOverride": "_smOverride_6h2zg_34", "mdOverride": "_mdOverride_6h2zg_39", "background": "_background_6h2zg_44", "sm": "_sm_6h2zg_21", "md": "_md_6h2zg_25", "neutralBorder": "_neutralBorder_6h2zg_61", "smCheckedBorder": "_smCheckedBorder_6h2zg_65", "mdCheckedBorder": "_mdCheckedBorder_6h2zg_69", "errorBorderColor": "_errorBorderColor_6h2zg_73", "borderColor": "_borderColor_6h2zg_77" };
+
+// src/RadioButton/RadioButton.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var RadioButton = ({
+  checked = false,
+  "data-testid": dataTestId,
+  dangerouslyForceFocusStyles = false,
+  disabled: disabledProp = false,
+  error = false,
+  id,
+  label,
+  name,
+  onChange,
+  size = "md",
+  value
+}) => {
+  const isHydrated = useIsHydrated();
+  const disabled = !isHydrated || disabledProp;
+  const [isFocused, setIsFocused] = useState(false);
+  const { isFocusVisible } = useFocusVisible();
+  const sharedStyles = classnames(RadioButton_module_default.background, RadioButton_module_default[size], {
+    [RadioButton_module_default.errorBorderColor]: error,
+    [RadioButton_module_default.borderColor]: !error,
+    [Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible || dangerouslyForceFocusStyles
+  });
+  return /* @__PURE__ */ jsxs(
+    "label",
+    {
+      className: classnames(
+        RadioButton_module_default.radioBaseContainer,
+        RadioButton_module_default[`cursor${disabled ? "Disabled" : "Enabled"}`],
+        {
+          [RadioButton_module_default.disabled]: disabled,
+          [RadioButton_module_default.smBase]: size === "sm",
+          [RadioButton_module_default.mdBase]: size === "md"
+        }
+      ),
+      children: [
+        checked ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classnames(sharedStyles, {
+              [RadioButton_module_default.mdCheckedBorder]: size === "md",
+              [RadioButton_module_default.smCheckedBorder]: size === "sm"
+            })
+          }
+        ) : /* @__PURE__ */ jsx("div", { className: classnames(sharedStyles, RadioButton_module_default.neutralBorder) }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            "data-testid": dataTestId,
+            type: "radio",
+            id,
+            name,
+            className: classnames(
+              RadioButton_module_default.radioStyleOverride,
+              RadioButton_module_default[`cursor${disabled ? "Disabled" : "Enabled"}`],
+              {
+                [RadioButton_module_default.smOverride]: size === "sm",
+                [RadioButton_module_default.mdOverride]: size === "md"
+              }
+            ),
+            checked,
+            onChange,
+            disabled,
+            value,
+            onFocus: () => {
+              setIsFocused(true);
+            },
+            onBlur: () => {
+              setIsFocused(false);
+            }
+          }
+        ),
+        label && /* @__PURE__ */ jsx(
+          Typography_default,
+          {
+            size: size === "md" ? 200 : 100,
+            color: error ? "destructive-primary" : "gray800",
+            children: label
+          }
+        )
+      ]
+    }
+  );
+};
+var RadioButton_default = RadioButton;
+
+export {
+  RadioButton_default
+};
+//# sourceMappingURL=L3WX2LK2.js.map

package/dist/__chunks/L3WX2LK2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/RadioButton/RadioButton.tsx","css-module:./RadioButton.module.css#css-module"],"sourcesContent":["import React, { type ReactElement, useState } from \"react\";\nimport classnames from \"classnames\";\n\nimport styles from \"./RadioButton.module.css\";\nimport focusStyles from \"../Focus.module.css\";\nimport Typography from \"../Typography/Typography\";\nimport useFocusVisible from \"../useFocusVisible\";\nimport useIsHydrated from \"../useIsHydrated\";\n\n/**\n * [RadioButton](https://cambly-syntax.vercel.app/?path=/docs/components-radiobutton--docs) is a radio button with accompanying text\n */\nconst RadioButton = ({\n  checked = false,\n  \"data-testid\": dataTestId,\n  dangerouslyForceFocusStyles = false,\n  disabled: disabledProp = false,\n  error = false,\n  id,\n  label,\n  name,\n  onChange,\n  size = \"md\",\n  value,\n}: {\n  /**\n   * Whether or not the radio button is checked\n   *\n   * @defaultValue false\n   */\n  checked?: boolean;\n  /**\n   * Test id for the radio button\n   */\n  \"data-testid\"?: string;\n  /**\n   * Whether or not the radio button is disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * Whether to show error color schema\n   *\n   * @defaultValue false\n   */\n  error?: boolean;\n  /**\n   * Id for the the radio button\n   */\n  id?: string;\n  /**\n   * Value to show end user\n   */\n  label: string;\n  /**\n   * The name of the grouping the radio buttons are in\n   */\n  name: string;\n  /**\n   * The callback to be called when the radio button is clicked\n   */\n  onChange: React.ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Size of the components\n   *\n   * * `sm`: 16px\n   * * `md`: 24px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: \"sm\" | \"md\";\n  /**\n   * Value of the selected radio option\n   */\n  value: string | number;\n  /** forces focus ring styling */\n  dangerouslyForceFocusStyles?: boolean;\n}): ReactElement => {\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const [isFocused, setIsFocused] = useState(false);\n  const { isFocusVisible } = useFocusVisible();\n\n  const sharedStyles = classnames(styles.background, styles[size], {\n    [styles.errorBorderColor]: error,\n    [styles.borderColor]: !error,\n    [focusStyles.accessibilityOutlineFocus]:\n      (isFocused && isFocusVisible) || dangerouslyForceFocusStyles,\n  });\n\n  return (\n    <label\n      className={classnames(\n        styles.radioBaseContainer,\n        styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n        {\n          [styles.disabled]: disabled,\n          [styles.smBase]: size === \"sm\",\n          [styles.mdBase]: size === \"md\",\n        },\n      )}\n    >\n      {checked ? (\n        <div\n          className={classnames(sharedStyles, {\n            [styles.mdCheckedBorder]: size === \"md\",\n            [styles.smCheckedBorder]: size === \"sm\",\n          })}\n        />\n      ) : (\n        <div className={classnames(sharedStyles, styles.neutralBorder)} />\n      )}\n      <input\n        data-testid={dataTestId}\n        type=\"radio\"\n        id={id}\n        name={name}\n        className={classnames(\n          styles.radioStyleOverride,\n          styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n          {\n            [styles.smOverride]: size === \"sm\",\n            [styles.mdOverride]: size === \"md\",\n          },\n        )}\n        checked={checked}\n        onChange={onChange}\n        disabled={disabled}\n        value={value}\n        onFocus={() => {\n          setIsFocused(true);\n        }}\n        onBlur={() => {\n          setIsFocused(false);\n        }}\n      />\n      {label && (\n        <Typography\n          size={size === \"md\" ? 200 : 100}\n          color={error ? \"destructive-primary\" : \"gray800\"}\n        >\n          {label}\n        </Typography>\n      )}\n    </label>\n  );\n};\n\nexport default RadioButton;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/RadioButton/RadioButton.module.css\"; export default {\"radioBaseContainer\":\"_radioBaseContainer_6h2zg_1\",\"disabled\":\"_disabled_6h2zg_9\",\"cursorDisabled\":\"_cursorDisabled_6h2zg_13\",\"cursorEnabled\":\"_cursorEnabled_6h2zg_17\",\"smBase\":\"_smBase_6h2zg_21\",\"mdBase\":\"_mdBase_6h2zg_25\",\"radioStyleOverride\":\"_radioStyleOverride_6h2zg_29\",\"smOverride\":\"_smOverride_6h2zg_34\",\"mdOverride\":\"_mdOverride_6h2zg_39\",\"background\":\"_background_6h2zg_44\",\"sm\":\"_sm_6h2zg_21\",\"md\":\"_md_6h2zg_25\",\"neutralBorder\":\"_neutralBorder_6h2zg_61\",\"smCheckedBorder\":\"_smCheckedBorder_6h2zg_65\",\"mdCheckedBorder\":\"_mdCheckedBorder_6h2zg_69\",\"errorBorderColor\":\"_errorBorderColor_6h2zg_73\",\"borderColor\":\"_borderColor_6h2zg_77\"}"],"mappings":";;;;;;;;;;;;;;AAAA,SAAmC,gBAAgB;AACnD,OAAO,gBAAgB;;;ACD8E,IAAO,6BAAQ,EAAC,sBAAqB,+BAA8B,YAAW,qBAAoB,kBAAiB,4BAA2B,iBAAgB,2BAA0B,UAAS,oBAAmB,UAAS,oBAAmB,sBAAqB,gCAA+B,cAAa,wBAAuB,cAAa,wBAAuB,cAAa,wBAAuB,MAAK,gBAAe,MAAK,gBAAe,iBAAgB,2BAA0B,mBAAkB,6BAA4B,mBAAkB,6BAA4B,oBAAmB,8BAA6B,eAAc,wBAAuB;;;AD4FpvB,SAYI,KAZJ;AAhFJ,IAAM,cAAc,CAAC;AAAA,EACnB,UAAU;AAAA,EACV,eAAe;AAAA,EACf,8BAA8B;AAAA,EAC9B,UAAU,eAAe;AAAA,EACzB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AACF,MAsDoB;AAClB,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,EAAE,eAAe,IAAI,gBAAgB;AAE3C,QAAM,eAAe,WAAW,2BAAO,YAAY,2BAAO,IAAI,GAAG;AAAA,IAC/D,CAAC,2BAAO,gBAAgB,GAAG;AAAA,IAC3B,CAAC,2BAAO,WAAW,GAAG,CAAC;AAAA,IACvB,CAAC,qBAAY,yBAAyB,GACnC,aAAa,kBAAmB;AAAA,EACrC,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,2BAAO;AAAA,QACP,2BAAO,SAAS,WAAW,aAAa,WAAW;AAAA,QACnD;AAAA,UACE,CAAC,2BAAO,QAAQ,GAAG;AAAA,UACnB,CAAC,2BAAO,MAAM,GAAG,SAAS;AAAA,UAC1B,CAAC,2BAAO,MAAM,GAAG,SAAS;AAAA,QAC5B;AAAA,MACF;AAAA,MAEC;AAAA,kBACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,WAAW,cAAc;AAAA,cAClC,CAAC,2BAAO,eAAe,GAAG,SAAS;AAAA,cACnC,CAAC,2BAAO,eAAe,GAAG,SAAS;AAAA,YACrC,CAAC;AAAA;AAAA,QACH,IAEA,oBAAC,SAAI,WAAW,WAAW,cAAc,2BAAO,aAAa,GAAG;AAAA,QAElE;AAAA,UAAC;AAAA;AAAA,YACC,eAAa;AAAA,YACb,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YACA,WAAW;AAAA,cACT,2BAAO;AAAA,cACP,2BAAO,SAAS,WAAW,aAAa,WAAW;AAAA,cACnD;AAAA,gBACE,CAAC,2BAAO,UAAU,GAAG,SAAS;AAAA,gBAC9B,CAAC,2BAAO,UAAU,GAAG,SAAS;AAAA,cAChC;AAAA,YACF;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAS,MAAM;AACb,2BAAa,IAAI;AAAA,YACnB;AAAA,YACA,QAAQ,MAAM;AACZ,2BAAa,KAAK;AAAA,YACpB;AAAA;AAAA,QACF;AAAA,QACC,SACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,SAAS,OAAO,MAAM;AAAA,YAC5B,OAAO,QAAQ,wBAAwB;AAAA,YAEtC;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEA,IAAO,sBAAQ;","names":[]}

package/dist/__chunks/{KCYZNZBO.cjs → L44YLKF4.cjs}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _5SMR5MWYcjs = require('./5SMR5MWY.cjs');
+var _SKKCLMG7cjs = require('./SKKCLMG7.cjs');
 
 
-var _ZX5KONS2cjs = require('./ZX5KONS2.cjs');
+var _NDHJK4HCcjs = require('./NDHJK4HC.cjs');
 
 
 var _FZRIE7EXcjs = require('./FZRIE7EX.cjs');
@@ -38,7 +38,7 @@ function TextField({
   const reactId = _react.useId.call(void 0, );
   const inputId = id != null ? id : reactId;
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _5SMR5MWYcjs.Box_default,
+    _SKKCLMG7cjs.Box_default,
     {
       display: "flex",
       direction: "column",
@@ -50,7 +50,7 @@ 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, _5SMR5MWYcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ZX5KONS2cjs.Typography_default, { size: 100, color: "gray700", children: label }) }) }),
+        label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { className: TextField_module_default.label, htmlFor: inputId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _SKKCLMG7cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _NDHJK4HCcjs.Typography_default, { size: 100, color: "gray700", children: label }) }) }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           "input",
           {
@@ -72,8 +72,8 @@ function TextField({
             value
           }
         ),
-        (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _5SMR5MWYcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _ZX5KONS2cjs.Typography_default,
+        (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _SKKCLMG7cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _NDHJK4HCcjs.Typography_default,
           {
             size: 100,
             color: errorText ? "destructive-primary" : "gray700",
@@ -88,4 +88,4 @@ function TextField({
 
 
 exports.TextField = TextField;
-//# sourceMappingURL=KCYZNZBO.cjs.map
+//# sourceMappingURL=L44YLKF4.cjs.map

package/dist/__chunks/{KCYZNZBO.cjs.map → L44YLKF4.cjs.map}

@@ -1 +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,SAAQ,mBAAkB,MAAK,gBAAe,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,cAAa,uBAAsB;;;AD8FxW,SAcQ,KAdR;AAhFW,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA,eAAe;AAAA,EACf,UAAU,eAAe;AAAA,EACzB,YAAY;AAAA,EACZ,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AACV,GA4DiB;AACf,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,UAAU,MAAM;AACtB,QAAM,UAAU,kBAAM;AAEtB,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,OAAM,WAC1B,iBACH,GACF,GACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW;AAAA,cACT,yBAAO;AAAA,cACP,yBAAO,IAAI;AAAA,cACX,yBAAO,GAAG,YAAY;AAAA,cACtB;AAAA,gBACE,CAAC,yBAAO,UAAU,GAAG;AAAA,cACvB;AAAA,YACF;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,IAAI;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,SACE,cAAc,cACd,oBAAC,eAAI,UAAU,GACb;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,OAAO,YAAY,wBAAwB;AAAA,YAE1C,uBAAa;AAAA;AAAA,QAChB,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\";\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  errorText = \"\",\n  helperText = \"\",\n  id,\n  label,\n  onChange,\n  placeholder = \"\",\n  size = \"md\",\n  type = \"text\",\n  value = \"\",\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   * 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   * 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   * Size of the TextField\n   * * `sm`: 32px\n   * * `md`: 40px\n   * * `lg`: 48px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\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}): ReactElement {\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const reactId = useId();\n  const inputId = id ?? reactId;\n\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=\"gray700\">\n              {label}\n            </Typography>\n          </Box>\n        </label>\n      )}\n      <input\n        autoComplete={autoComplete}\n        className={classNames(\n          styles.textfield,\n          styles[size],\n          styles[`${size}Height`],\n          {\n            [styles.inputError]: errorText,\n          },\n        )}\n        data-testid={dataTestId}\n        disabled={disabled}\n        id={inputId}\n        type={type}\n        onChange={onChange}\n        placeholder={placeholder}\n        value={value}\n      />\n      {(helperText || errorText) && (\n        <Box paddingX={1}>\n          <Typography\n            size={100}\n            color={errorText ? \"destructive-primary\" : \"gray700\"}\n          >\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_bmndn_1\",\"label\":\"_label_bmndn_20\",\"sm\":\"_sm_bmndn_24\",\"smHeight\":\"_smHeight_bmndn_31\",\"md\":\"_md_bmndn_35\",\"mdHeight\":\"_mdHeight_bmndn_42\",\"lg\":\"_lg_bmndn_46\",\"lgHeight\":\"_lgHeight_bmndn_53\",\"inputError\":\"_inputError_bmndn_57\"}"]}
+{"version":3,"sources":["../../src/TextField/TextField.tsx","css-module:./TextField.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;AAAA;AAAA,EAGE;AAAA,OACK;AACP,OAAO,gBAAgB;;;ACL0E,IAAO,2BAAQ,EAAC,aAAY,sBAAqB,SAAQ,mBAAkB,MAAK,gBAAe,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,cAAa,uBAAsB;;;AD8FvW,SAcQ,KAdR;AAhFW,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA,eAAe;AAAA,EACf,UAAU,eAAe;AAAA,EACzB,YAAY;AAAA,EACZ,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AACV,GA4DiB;AACf,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,UAAU,MAAM;AACtB,QAAM,UAAU,kBAAM;AAEtB,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,OAAM,WAC1B,iBACH,GACF,GACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW;AAAA,cACT,yBAAO;AAAA,cACP,yBAAO,IAAI;AAAA,cACX,yBAAO,GAAG,YAAY;AAAA,cACtB;AAAA,gBACE,CAAC,yBAAO,UAAU,GAAG;AAAA,cACvB;AAAA,YACF;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,IAAI;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,SACE,cAAc,cACd,oBAAC,eAAI,UAAU,GACb;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,OAAO,YAAY,wBAAwB;AAAA,YAE1C,uBAAa;AAAA;AAAA,QAChB,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\";\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  errorText = \"\",\n  helperText = \"\",\n  id,\n  label,\n  onChange,\n  placeholder = \"\",\n  size = \"md\",\n  type = \"text\",\n  value = \"\",\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   * 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   * 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   * Size of the TextField\n   * * `sm`: 32px\n   * * `md`: 40px\n   * * `lg`: 48px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\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}): ReactElement {\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const reactId = useId();\n  const inputId = id ?? reactId;\n\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=\"gray700\">\n              {label}\n            </Typography>\n          </Box>\n        </label>\n      )}\n      <input\n        autoComplete={autoComplete}\n        className={classNames(\n          styles.textfield,\n          styles[size],\n          styles[`${size}Height`],\n          {\n            [styles.inputError]: errorText,\n          },\n        )}\n        data-testid={dataTestId}\n        disabled={disabled}\n        id={inputId}\n        type={type}\n        onChange={onChange}\n        placeholder={placeholder}\n        value={value}\n      />\n      {(helperText || errorText) && (\n        <Box paddingX={1}>\n          <Typography\n            size={100}\n            color={errorText ? \"destructive-primary\" : \"gray700\"}\n          >\n            {errorText || helperText}\n          </Typography>\n        </Box>\n      )}\n    </Box>\n  );\n}\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_bmndn_1\",\"label\":\"_label_bmndn_20\",\"sm\":\"_sm_bmndn_24\",\"smHeight\":\"_smHeight_bmndn_31\",\"md\":\"_md_bmndn_35\",\"mdHeight\":\"_mdHeight_bmndn_42\",\"lg\":\"_lg_bmndn_46\",\"lgHeight\":\"_lgHeight_bmndn_53\",\"inputError\":\"_inputError_bmndn_57\"}"]}

package/dist/__chunks/L7WNIMI4.cjs

@@ -0,0 +1,159 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _VU6QARVCcjs = require('./VU6QARVC.cjs');
+
+
+var _LJUQ7TSGcjs = require('./LJUQ7TSG.cjs');
+
+
+var _XPA5XWVAcjs = require('./XPA5XWVA.cjs');
+
+
+var _W4BWNGOXcjs = require('./W4BWNGOX.cjs');
+
+
+var _SKKCLMG7cjs = require('./SKKCLMG7.cjs');
+
+
+var _RFHPSEBFcjs = require('./RFHPSEBF.cjs');
+
+
+
+
+var _I64JGYX7cjs = require('./I64JGYX7.cjs');
+
+// src/Dialog/ModalDialog.tsx
+
+
+var _react = require('react');
+
+
+
+
+var _reactariacomponents = require('react-aria-components');
+var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+var _reactaria = require('react-aria');
+
+// css-module:./ModalDialog.module.css#css-module
+var ModalDialog_module_default = { "modalOverlay": "_modalOverlay_1fy5w_1", "modal": "_modal_1fy5w_1" };
+
+// src/Dialog/ModalDialog.tsx
+var _jsxruntime = require('react/jsx-runtime');
+function XIcon({ color = "#000" }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", fill: color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "path",
+    {
+      fill: "inherit",
+      d: "M11.25.758a.83.83 0 0 0-1.175 0L6 4.825 1.925.75A.83.83 0 1 0 .75 1.925L4.825 6 .75 10.075a.83.83 0 1 0 1.175 1.175L6 7.175l4.075 4.075a.83.83 0 1 0 1.175-1.175L7.175 6l4.075-4.075a.835.835 0 0 0 0-1.167Z"
+    }
+  ) });
+}
+var AriaModalOverlay = _react.forwardRef.call(void 0, function AriaModalOverlay2(_a, ref) {
+  var _b = _a, { children } = _b, otherProps = _I64JGYX7cjs.__objRest.call(void 0, _b, ["children"]);
+  const className = _classnames2.default.call(void 0, [
+    _W4BWNGOXcjs.Box_module_default.box,
+    _W4BWNGOXcjs.Box_module_default.fixed,
+    _W4BWNGOXcjs.Box_module_default.box,
+    _W4BWNGOXcjs.Box_module_default.flex,
+    _W4BWNGOXcjs.Box_module_default.column,
+    _W4BWNGOXcjs.Box_module_default.alignItemscenter,
+    _W4BWNGOXcjs.Box_module_default.justifyContentcenter,
+    _XPA5XWVAcjs.padding_module_default.paddingX4,
+    _XPA5XWVAcjs.padding_module_default.paddingY4,
+    ModalDialog_module_default.modalOverlay
+  ]);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.ModalOverlay, _I64JGYX7cjs.__spreadProps.call(void 0, _I64JGYX7cjs.__spreadValues.call(void 0, { ref }, _reactaria.mergeProps.call(void 0, { className }, otherProps)), { children }));
+});
+var AriaModal = _react.forwardRef.call(void 0, 
+  function AriaModal2(_a, ref) {
+    var _b = _a, { children: childrenProp, onChangeContentVisibility } = _b, otherProps = _I64JGYX7cjs.__objRest.call(void 0, _b, ["children", "onChangeContentVisibility"]);
+    const className = _classnames2.default.call(void 0, [_W4BWNGOXcjs.Box_module_default.box, ModalDialog_module_default.modal]);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.Modal, _I64JGYX7cjs.__spreadProps.call(void 0, _I64JGYX7cjs.__spreadValues.call(void 0, { ref }, _reactaria.mergeProps.call(void 0, { className }, otherProps)), { children: _reactariacomponents.composeRenderProps.call(void 0, 
+      childrenProp,
+      (children, { isEntering, isExiting }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _RFHPSEBFcjs.OverlayVisibility,
+          {
+            isEntering,
+            isExiting,
+            onChange: onChangeContentVisibility
+          }
+        ),
+        children
+      ] })
+    ) }));
+  }
+);
+var ModalDialog = _react.forwardRef.call(void 0, 
+  function ModalDialog2(props, ref) {
+    const {
+      "data-testid": dataTestId,
+      accessibilityLabel,
+      children,
+      dismissable = true,
+      accessibilityCloseLabel = "Dismiss",
+      initialOpen,
+      onChangeContentVisibility,
+      onOpenChange,
+      open
+    } = props;
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      AriaModalOverlay,
+      {
+        isDismissable: dismissable,
+        isKeyboardDismissDisabled: !dismissable,
+        defaultOpen: initialOpen,
+        isOpen: open,
+        onOpenChange,
+        children: ({ state }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          AriaModal,
+          {
+            ref,
+            "aria-label": accessibilityLabel,
+            onChangeContentVisibility,
+            children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+              _LJUQ7TSGcjs.Dialog_default,
+              {
+                accessibilityLabel,
+                "data-testid": dataTestId,
+                children: [
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    _SKKCLMG7cjs.Box_default,
+                    {
+                      position: "absolute",
+                      padding: 2,
+                      dangerouslySetInlineStyle: {
+                        __style: {
+                          top: "0",
+                          right: "0"
+                        }
+                      },
+                      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                        _VU6QARVCcjs.IconButton_default,
+                        {
+                          onClick: () => state.close(),
+                          color: "tertiary",
+                          accessibilityLabel: accessibilityCloseLabel,
+                          icon: XIcon
+                        }
+                      )
+                    }
+                  ),
+                  children
+                ]
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+);
+var ModalDialog_default = ModalDialog;
+
+
+
+
+
+exports.AriaModalOverlay = AriaModalOverlay; exports.AriaModal = AriaModal; exports.ModalDialog_default = ModalDialog_default;
+//# sourceMappingURL=L7WNIMI4.cjs.map

package/dist/__chunks/L7WNIMI4.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Dialog/ModalDialog.tsx","css-module:./ModalDialog.module.css#css-module"],"names":["AriaModalOverlay","AriaModal","ModalDialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,EAEE;AAAA,OAEK;AACP;AAAA,EACE,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB;AAAA,OAEK;AACP,OAAO,gBAAgB;AACvB,SAAS,kBAAkB;;;ACZqE,IAAO,6BAAQ,EAAC,gBAAe,yBAAwB,SAAQ,iBAAgB;;;ADwBzK,SA6DM,UA7DN,KA6DM,YA7DN;AAHN,SAAS,MAAM,EAAE,QAAQ,OAAO,GAA2C;AACzE,SACE,oBAAC,SAAI,OAAM,8BAA6B,OAAM,MAAK,QAAO,MAAK,MAAM,OACnE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,GAAE;AAAA;AAAA,EACJ,GACF;AAEJ;AAUO,IAAM,mBAAmB,WAG9B,SAASA,kBAAiB,IAA6B,KAAmB;AAAhD,eAAE,WA3C9B,IA2C4B,IAAe,uBAAf,IAAe,CAAb;AAC5B,QAAM,YAAY,WAAW;AAAA,IAC3B,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,uBAAc;AAAA,IACd,uBAAc;AAAA,IACd,2BAAO;AAAA,EACT,CAAC;AACD,SACE,oBAAC,sDAAsB,OAAc,WAAW,EAAE,UAAU,GAAG,UAAU,IAAxE,EACE,WACH;AAEJ,CAAC;AAaM,IAAM,YAAY;AAAA,EACvB,SAASC,WACP,IACA,KACc;AAFd,iBAAE,YAAU,cAAc,0BA5E9B,IA4EI,IAAwD,uBAAxD,IAAwD,CAAtD,YAAwB;AAG1B,UAAM,YAAY,WAAW,CAAC,mBAAU,KAAK,2BAAO,KAAK,CAAC;AAC1D,WACE,oBAAC,+CAAe,OAAc,WAAW,EAAE,UAAU,GAAG,UAAU,IAAjE,EACE;AAAA,MACC;AAAA,MACA,CAAC,UAAU,EAAE,YAAY,UAAU,MACjC,iCACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,UAAU;AAAA;AAAA,QACZ;AAAA,QACC;AAAA,SACH;AAAA,IAEJ,IACF;AAAA,EAEJ;AACF;AAkCA,IAAM,cAAc;AAAA,EAClB,SAASC,aAAY,OAAO,KAAmB;AAC7C,UAAM;AAAA,MACJ,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd,0BAA0B;AAAA,MAC1B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI;AAEJ,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAe;AAAA,QACf,2BAA2B,CAAC;AAAA,QAC5B,aAAa;AAAA,QACb,QAAQ;AAAA,QACR;AAAA,QAEC,WAAC,EAAE,MAAM,MACR;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,cAAY;AAAA,YACZ;AAAA,YAEA;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,eAAa;AAAA,gBAEb;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,UAAS;AAAA,sBACT,SAAS;AAAA,sBACT,2BAA2B;AAAA,wBACzB,SAAS;AAAA,0BACP,KAAK;AAAA,0BACL,OAAO;AAAA,wBACT;AAAA,sBACF;AAAA,sBAEA;AAAA,wBAAC;AAAA;AAAA,0BACC,SAAS,MAAM,MAAM,MAAM;AAAA,0BAC3B,OAAM;AAAA,0BACN,oBAAoB;AAAA,0BACpB,MAAM;AAAA;AAAA,sBACR;AAAA;AAAA,kBACF;AAAA,kBACC;AAAA;AAAA;AAAA,YACH;AAAA;AAAA,QACF;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,IAAO,sBAAQ","sourcesContent":["import React, {\n  type ReactElement,\n  forwardRef,\n  type ComponentProps,\n} from \"react\";\nimport {\n  Modal as ReactAriaModal,\n  ModalOverlay as ReactAriaModalOverlay,\n  composeRenderProps,\n  type ModalOverlayProps as ReactAriaModalOverlayProps,\n} from \"react-aria-components\";\nimport classNames from \"classnames\";\nimport { mergeProps } from \"react-aria\";\nimport Dialog, { type DialogProps } from \"./Dialog\";\nimport OverlayVisibility from \"../react-aria-utils/OverlayVisibility\";\nimport paddingStyles from \"../Box/padding.module.css\";\nimport boxStyles from \"../Box/Box.module.css\";\nimport styles from \"./ModalDialog.module.css\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Box from \"../Box/Box\";\n\nfunction XIcon({ color = \"#000\" }: { color?: string; className?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" fill={color}>\n      <path\n        fill=\"inherit\"\n        d=\"M11.25.758a.83.83 0 0 0-1.175 0L6 4.825 1.925.75A.83.83 0 1 0 .75 1.925L4.825 6 .75 10.075a.83.83 0 1 0 1.175 1.175L6 7.175l4.075 4.075a.83.83 0 1 0 1.175-1.175L7.175 6l4.075-4.075a.835.835 0 0 0 0-1.167Z\"\n      />\n    </svg>\n  );\n}\n\ntype AriaModalOverlayProps = {\n  \"data-testid\"?: string;\n} & ReactAriaModalOverlayProps;\n/**\n * AriaModalOverlay: This component extends ModalOverlay from react-aria-components\n * It applies syntax styles and adds aadditional props:\n *  - data-testid\n */\nexport const AriaModalOverlay = forwardRef<\n  HTMLDivElement,\n  AriaModalOverlayProps\n>(function AriaModalOverlay({ children, ...otherProps }, ref): ReactElement {\n  const className = classNames([\n    boxStyles.box,\n    boxStyles.fixed,\n    boxStyles.box,\n    boxStyles.flex,\n    boxStyles.column,\n    boxStyles.alignItemscenter,\n    boxStyles.justifyContentcenter,\n    paddingStyles.paddingX4,\n    paddingStyles.paddingY4,\n    styles.modalOverlay,\n  ]);\n  return (\n    <ReactAriaModalOverlay ref={ref} {...mergeProps({ className }, otherProps)}>\n      {children}\n    </ReactAriaModalOverlay>\n  );\n});\n\ntype AriaModalProps = {\n  \"data-testid\"?: string;\n  /** Optional handler for change of visibility for overlaid content, for analytics timing */\n  onChangeContentVisibility?: (visible: boolean) => void;\n} & ComponentProps<typeof ReactAriaModal>;\n/**\n * AriaModal: This component extends Modal from react-aria-components\n * It applies syntax styles and adds aadditional props:\n *  - data-testid\n *  - onContentChangeVisibility\n */\nexport const AriaModal = forwardRef<HTMLDivElement, AriaModalProps>(\n  function AriaModal(\n    { children: childrenProp, onChangeContentVisibility, ...otherProps },\n    ref,\n  ): ReactElement {\n    const className = classNames([boxStyles.box, styles.modal]);\n    return (\n      <ReactAriaModal ref={ref} {...mergeProps({ className }, otherProps)}>\n        {composeRenderProps(\n          childrenProp,\n          (children, { isEntering, isExiting }) => (\n            <>\n              <OverlayVisibility\n                isEntering={isEntering}\n                isExiting={isExiting}\n                onChange={onChangeContentVisibility}\n              />\n              {children}\n            </>\n          ),\n        )}\n      </ReactAriaModal>\n    );\n  },\n);\n\ntype ModalDialogProps = DialogProps & {\n  /** Whether dialog can be dismissed with click outside / Escape key  */\n  dismissable?: boolean;\n  /** render visible initially. */\n  initialOpen?: boolean;\n  /** Optional handler for change of visibility for popover content, for analytics timing */\n  onChangeContentVisibility?: (visible: boolean) => void;\n  /** Optional handler for change of visibility for popover content, for control */\n  onOpenChange?: (open: boolean) => void;\n  /** Optional boolean to control open state of modal dialog externally */\n  open?: boolean;\n  /** Optional override for default dismiss button accessibility label */\n  accessibilityCloseLabel?: string;\n};\n\n/**\n * ModalDialog is a controlled component -- visibility is managed with the `open` prop.\n *\n * Example Usage:\n ```\n  <ModalDialog\n    open={open}\n    initialOpen\n    content={<Box>I am some content</Box>}\n    onChangeContentVisibility={(visible) => ...}\n  >\n    <Box padding={2} maxWidth={400}>\n      ... some content goes here\n    </Box>\n  </ModalDialog>\n ```\n */\nconst ModalDialog = forwardRef<HTMLDivElement, ModalDialogProps>(\n  function ModalDialog(props, ref): ReactElement {\n    const {\n      \"data-testid\": dataTestId,\n      accessibilityLabel,\n      children,\n      dismissable = true,\n      accessibilityCloseLabel = \"Dismiss\",\n      initialOpen,\n      onChangeContentVisibility,\n      onOpenChange,\n      open,\n    } = props;\n\n    return (\n      <AriaModalOverlay\n        isDismissable={dismissable}\n        isKeyboardDismissDisabled={!dismissable}\n        defaultOpen={initialOpen}\n        isOpen={open}\n        onOpenChange={onOpenChange}\n      >\n        {({ state }) => (\n          <AriaModal\n            ref={ref}\n            aria-label={accessibilityLabel}\n            onChangeContentVisibility={onChangeContentVisibility}\n          >\n            <Dialog\n              accessibilityLabel={accessibilityLabel}\n              data-testid={dataTestId}\n            >\n              <Box\n                position=\"absolute\"\n                padding={2}\n                dangerouslySetInlineStyle={{\n                  __style: {\n                    top: \"0\",\n                    right: \"0\",\n                  },\n                }}\n              >\n                <IconButton\n                  onClick={() => state.close()}\n                  color=\"tertiary\"\n                  accessibilityLabel={accessibilityCloseLabel}\n                  icon={XIcon}\n                />\n              </Box>\n              {children}\n            </Dialog>\n          </AriaModal>\n        )}\n      </AriaModalOverlay>\n    );\n  },\n);\n\nexport default ModalDialog;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Dialog/ModalDialog.module.css\"; export default {\"modalOverlay\":\"_modalOverlay_1fy5w_1\",\"modal\":\"_modal_1fy5w_1\"}"]}

package/dist/__chunks/LCM6DHNZ.mjs

@@ -0,0 +1,120 @@
+import {
+  loadingIconSize_default
+} from "./EKJ4XOIM.mjs";
+import {
+  textVariant_default
+} from "./AMBZXKUQ.mjs";
+import {
+  iconSize_default
+} from "./FVU4BA3R.mjs";
+import {
+  Box_default
+} from "./HJYCSDLB.mjs";
+import {
+  Typography_default
+} from "./3HUELEGR.mjs";
+import {
+  useIsHydrated
+} from "./XFKGXL73.mjs";
+import {
+  foregroundTypographyColor
+} from "./SFLBYQCV.mjs";
+import {
+  foregroundColor
+} from "./SSU3B5AR.mjs";
+import {
+  backgroundColor
+} from "./5QXUIARJ.mjs";
+
+// src/Button/Button.tsx
+import { forwardRef } from "react";
+import classNames from "classnames";
+
+// css-module:./Button.module.css#css-module
+var Button_module_default = { "button": "_button_raa9c_1", "buttonGap": "_buttonGap_raa9c_10", "fullWidth": "_fullWidth_raa9c_51", "sm": "_sm_raa9c_55", "md": "_md_raa9c_61", "lg": "_lg_raa9c_67", "icon": "_icon_raa9c_73", "smIcon": "_smIcon_raa9c_77", "mdIcon": "_mdIcon_raa9c_84", "lgIcon": "_lgIcon_raa9c_91", "secondaryBorder": "_secondaryBorder_raa9c_98", "secondaryDestructiveBorder": "_secondaryDestructiveBorder_raa9c_102", "loading": "_loading_raa9c_116", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_raa9c_1", "loadingCircle": "_loadingCircle_raa9c_120" };
+
+// src/Button/Button.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var Button = forwardRef(
+  ({
+    "data-testid": dataTestId,
+    text,
+    loadingText,
+    color = "primary",
+    size = "md",
+    accessibilityLabel,
+    disabled = false,
+    loading = false,
+    fullWidth = false,
+    startIcon: StartIcon,
+    endIcon: EndIcon,
+    onClick,
+    tooltip,
+    type = "button"
+  }, ref) => {
+    const isHydrated = useIsHydrated();
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        "data-testid": dataTestId,
+        ref,
+        "aria-label": accessibilityLabel,
+        type,
+        title: tooltip,
+        disabled: !isHydrated || disabled || loading,
+        onClick,
+        className: classNames(
+          Button_module_default.button,
+          foregroundColor(color),
+          backgroundColor(color),
+          Button_module_default[size],
+          {
+            [Button_module_default.fullWidth]: fullWidth,
+            [Button_module_default.buttonGap]: size === "lg" || size === "md",
+            [Button_module_default.secondaryBorder]: color === "secondary",
+            [Button_module_default.secondaryDestructiveBorder]: color === "destructive-secondary"
+          }
+        ),
+        children: [
+          !loading && StartIcon && /* @__PURE__ */ jsx(StartIcon, { className: classNames(Button_module_default.icon, iconSize_default[size]) }),
+          (loading && loadingText || !loading && text) && /* @__PURE__ */ jsx(Box_default, { paddingX: 1, children: /* @__PURE__ */ jsx(
+            Typography_default,
+            {
+              size: textVariant_default[size],
+              color: foregroundTypographyColor(color),
+              children: loading ? loadingText : text
+            }
+          ) }),
+          !loading && EndIcon && /* @__PURE__ */ jsx(EndIcon, { className: classNames(Button_module_default.icon, iconSize_default[size]) }),
+          loading && /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: classNames(Button_module_default.loading, foregroundColor(color)),
+              viewBox: "22 22 44 44",
+              width: loadingIconSize_default[size],
+              height: loadingIconSize_default[size],
+              children: /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  className: Button_module_default.loadingCircle,
+                  cx: "44",
+                  cy: "44",
+                  r: "20.2",
+                  fill: "none",
+                  strokeWidth: "3.6"
+                }
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var Button_default = Button;
+
+export {
+  Button_default
+};
+//# sourceMappingURL=LCM6DHNZ.mjs.map

package/dist/__chunks/{2R4YCOYE.js.map → LCM6DHNZ.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/Button.tsx","css-module:./Button.module.css#css-module"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classNames from \"classnames\";\n\nimport backgroundColor from \"../colors//backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport foregroundTypographyColor from \"../colors/foregroundTypographyColor\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\n\nimport iconSize from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\n\ntype ButtonProps = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The text to be displayed inside the button\n   */\n  text: string;\n  /**\n   * The text to be displayed inside the button when it is in a loading state\n   */\n  loadingText?: string;\n  /**\n   * The color of the button\n   *\n   * @defaultValue \"primary\"\n   */\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"tertiary\"\n    | \"destructive-primary\"\n    | \"destructive-secondary\"\n    | \"destructive-tertiary\"\n    | \"branded\"\n    | \"success\"\n    | \"inverse\";\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 40px\n   * * `lg`: 48px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: (typeof Size)[number];\n  /**\n   * The label to be used for accessibility\n   */\n  accessibilityLabel?: string;\n  /**\n   * If `true`, the button will be disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the button will be in a loading state\n   *\n   * @defaultValue false\n   */\n  loading?: boolean;\n  /**\n   * If `true`, the button will take up the full width of its container\n   *\n   * @defaultValue false\n   */\n  fullWidth?: boolean;\n  /**\n   * The icon to be displayed at the start of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  startIcon?: React.ComponentType<{ className?: string }>;\n  /**\n   * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  endIcon?: React.ComponentType<{ className?: string }>;\n  /**\n   * The callback to be called when the button is clicked\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * The tooltip to be displayed when the user hovers over the button\n   */\n  tooltip?: string;\n  /**\n   * The type you want to set for the primitive <button/>\n   */\n  type?: \"button\" | \"submit\" | \"reset\";\n};\n\n/**\n * [Button](https://cambly-syntax.vercel.app/?path=/docs/components-button--docs) is used to trigger an action or event, such as submitting a form, opening a dialog, canceling an action, or performing a delete operation.\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      \"data-testid\": dataTestId,\n      text,\n      loadingText,\n      color = \"primary\",\n      size = \"md\",\n      accessibilityLabel,\n      disabled = false,\n      loading = false,\n      fullWidth = false,\n      startIcon: StartIcon,\n      endIcon: EndIcon,\n      onClick,\n      tooltip,\n      type = \"button\",\n    }: ButtonProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n\n    return (\n      <button\n        data-testid={dataTestId}\n        ref={ref}\n        aria-label={accessibilityLabel}\n        type={type}\n        title={tooltip}\n        disabled={!isHydrated || disabled || loading}\n        onClick={onClick}\n        className={classNames(\n          styles.button,\n          foregroundColor(color),\n          backgroundColor(color),\n          styles[size],\n          {\n            [styles.fullWidth]: fullWidth,\n            [styles.buttonGap]: size === \"lg\" || size === \"md\",\n            [styles.secondaryBorder]: color === \"secondary\",\n            [styles.secondaryDestructiveBorder]:\n              color === \"destructive-secondary\",\n          },\n        )}\n      >\n        {!loading && StartIcon && (\n          <StartIcon className={classNames(styles.icon, iconSize[size])} />\n        )}\n        {((loading && loadingText) || (!loading && text)) && (\n          <Box paddingX={1}>\n            <Typography\n              size={textVariant[size]}\n              color={foregroundTypographyColor(color)}\n            >\n              <span style={{ fontWeight: 500 }}>\n                {loading ? loadingText : text}\n              </span>\n            </Typography>\n          </Box>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon className={classNames(styles.icon, iconSize[size])} />\n        )}\n        {loading && (\n          <svg\n            className={classNames(styles.loading, foregroundColor(color))}\n            viewBox=\"22 22 44 44\"\n            width={loadingIconSize[size]}\n            height={loadingIconSize[size]}\n          >\n            <circle\n              className={styles.loadingCircle}\n              cx=\"44\"\n              cy=\"44\"\n              r=\"20.2\"\n              fill=\"none\"\n              strokeWidth=\"3.6\"\n            />\n          </svg>\n        )}\n      </button>\n    );\n  },\n);\n\nButton.displayName = \"Button\";\n\nexport default Button;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_1iunh_1\",\"buttonGap\":\"_buttonGap_1iunh_9\",\"fullWidth\":\"_fullWidth_1iunh_50\",\"sm\":\"_sm_1iunh_54\",\"md\":\"_md_1iunh_61\",\"lg\":\"_lg_1iunh_68\",\"icon\":\"_icon_1iunh_75\",\"smIcon\":\"_smIcon_1iunh_79\",\"mdIcon\":\"_mdIcon_1iunh_86\",\"lgIcon\":\"_lgIcon_1iunh_93\",\"secondaryBorder\":\"_secondaryBorder_1iunh_100\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_1iunh_104\",\"loading\":\"_loading_1iunh_118\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1iunh_1\",\"loadingCircle\":\"_loadingCircle_1iunh_122\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAClC,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,8BAA6B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;AD4H1mB,SAuBI,KAvBJ;AAvBN,IAAM,SAAS;AAAA,EACb,CACE;AAAA,IACE,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,OAAO;AAAA,IACP;AAAA,IACA,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU,CAAC,cAAc,YAAY;AAAA,QACrC;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YAC9C,CAAC,sBAAO,eAAe,GAAG,UAAU;AAAA,YACpC,CAAC,sBAAO,0BAA0B,GAChC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX,oBAAC,aAAU,WAAW,WAAW,sBAAO,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA,WAE9D,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,oBAAY,IAAI;AAAA,cACtB,OAAO,0BAA0B,KAAK;AAAA,cAEtC,8BAAC,UAAK,OAAO,EAAE,YAAY,IAAI,GAC5B,oBAAU,cAAc,MAC3B;AAAA;AAAA,UACF,GACF;AAAA,UAED,CAAC,WAAW,WACX,oBAAC,WAAQ,WAAW,WAAW,sBAAO,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA,UAE9D,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,gBAAgB,KAAK,CAAC;AAAA,cAC5D,SAAQ;AAAA,cACR,OAAO,wBAAgB,IAAI;AAAA,cAC3B,QAAQ,wBAAgB,IAAI;AAAA,cAE5B;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW,sBAAO;AAAA,kBAClB,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAE;AAAA,kBACF,MAAK;AAAA,kBACL,aAAY;AAAA;AAAA,cACd;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;AAErB,IAAO,iBAAQ;","names":[]}
+{"version":3,"sources":["../../src/Button/Button.tsx","css-module:./Button.module.css#css-module"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classNames from \"classnames\";\n\nimport backgroundColor from \"../colors//backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport foregroundTypographyColor from \"../colors/foregroundTypographyColor\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\n\nimport iconSize from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\n\ntype ButtonProps = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The text to be displayed inside the button\n   */\n  text: string;\n  /**\n   * The text to be displayed inside the button when it is in a loading state\n   */\n  loadingText?: string;\n  /**\n   * The color of the button\n   *\n   * @defaultValue \"primary\"\n   */\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"tertiary\"\n    | \"destructive-primary\"\n    | \"destructive-secondary\"\n    | \"destructive-tertiary\"\n    | \"branded\"\n    | \"success\"\n    | \"inverse\";\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 40px\n   * * `lg`: 48px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: (typeof Size)[number];\n  /**\n   * The label to be used for accessibility\n   */\n  accessibilityLabel?: string;\n  /**\n   * If `true`, the button will be disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the button will be in a loading state\n   *\n   * @defaultValue false\n   */\n  loading?: boolean;\n  /**\n   * If `true`, the button will take up the full width of its container\n   *\n   * @defaultValue false\n   */\n  fullWidth?: boolean;\n  /**\n   * The icon to be displayed at the start of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  startIcon?: React.ComponentType<{ className?: string }>;\n  /**\n   * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  endIcon?: React.ComponentType<{ className?: string }>;\n  /**\n   * The callback to be called when the button is clicked\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * The tooltip to be displayed when the user hovers over the button\n   */\n  tooltip?: string;\n  /**\n   * The type you want to set for the primitive <button/>\n   */\n  type?: \"button\" | \"submit\" | \"reset\";\n};\n\n/**\n * [Button](https://cambly-syntax.vercel.app/?path=/docs/components-button--docs) is used to trigger an action or event, such as submitting a form, opening a dialog, canceling an action, or performing a delete operation.\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      \"data-testid\": dataTestId,\n      text,\n      loadingText,\n      color = \"primary\",\n      size = \"md\",\n      accessibilityLabel,\n      disabled = false,\n      loading = false,\n      fullWidth = false,\n      startIcon: StartIcon,\n      endIcon: EndIcon,\n      onClick,\n      tooltip,\n      type = \"button\",\n    }: ButtonProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n\n    return (\n      <button\n        data-testid={dataTestId}\n        ref={ref}\n        aria-label={accessibilityLabel}\n        type={type}\n        title={tooltip}\n        disabled={!isHydrated || disabled || loading}\n        onClick={onClick}\n        className={classNames(\n          styles.button,\n          foregroundColor(color),\n          backgroundColor(color),\n          styles[size],\n          {\n            [styles.fullWidth]: fullWidth,\n            [styles.buttonGap]: size === \"lg\" || size === \"md\",\n            [styles.secondaryBorder]: color === \"secondary\",\n            [styles.secondaryDestructiveBorder]:\n              color === \"destructive-secondary\",\n          },\n        )}\n      >\n        {!loading && StartIcon && (\n          <StartIcon className={classNames(styles.icon, iconSize[size])} />\n        )}\n        {((loading && loadingText) || (!loading && text)) && (\n          <Box paddingX={1}>\n            <Typography\n              size={textVariant[size]}\n              color={foregroundTypographyColor(color)}\n            >\n              {loading ? loadingText : text}\n            </Typography>\n          </Box>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon className={classNames(styles.icon, iconSize[size])} />\n        )}\n        {loading && (\n          <svg\n            className={classNames(styles.loading, foregroundColor(color))}\n            viewBox=\"22 22 44 44\"\n            width={loadingIconSize[size]}\n            height={loadingIconSize[size]}\n          >\n            <circle\n              className={styles.loadingCircle}\n              cx=\"44\"\n              cy=\"44\"\n              r=\"20.2\"\n              fill=\"none\"\n              strokeWidth=\"3.6\"\n            />\n          </svg>\n        )}\n      </button>\n    );\n  },\n);\n\nButton.displayName = \"Button\";\n\nexport default Button;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_raa9c_1\",\"buttonGap\":\"_buttonGap_raa9c_10\",\"fullWidth\":\"_fullWidth_raa9c_51\",\"sm\":\"_sm_raa9c_55\",\"md\":\"_md_raa9c_61\",\"lg\":\"_lg_raa9c_67\",\"icon\":\"_icon_raa9c_73\",\"smIcon\":\"_smIcon_raa9c_77\",\"mdIcon\":\"_mdIcon_raa9c_84\",\"lgIcon\":\"_lgIcon_raa9c_91\",\"secondaryBorder\":\"_secondaryBorder_raa9c_98\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_raa9c_102\",\"loading\":\"_loading_raa9c_116\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_raa9c_1\",\"loadingCircle\":\"_loadingCircle_raa9c_120\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAClC,OAAO,gBAAgB;;;ACDoE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,uBAAsB,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,6BAA4B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;AD4HzmB,SAuBI,KAvBJ;AAvBN,IAAM,SAAS;AAAA,EACb,CACE;AAAA,IACE,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,OAAO;AAAA,IACP;AAAA,IACA,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU,CAAC,cAAc,YAAY;AAAA,QACrC;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YAC9C,CAAC,sBAAO,eAAe,GAAG,UAAU;AAAA,YACpC,CAAC,sBAAO,0BAA0B,GAChC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX,oBAAC,aAAU,WAAW,WAAW,sBAAO,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA,WAE9D,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,oBAAY,IAAI;AAAA,cACtB,OAAO,0BAA0B,KAAK;AAAA,cAErC,oBAAU,cAAc;AAAA;AAAA,UAC3B,GACF;AAAA,UAED,CAAC,WAAW,WACX,oBAAC,WAAQ,WAAW,WAAW,sBAAO,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA,UAE9D,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,gBAAgB,KAAK,CAAC;AAAA,cAC5D,SAAQ;AAAA,cACR,OAAO,wBAAgB,IAAI;AAAA,cAC3B,QAAQ,wBAAgB,IAAI;AAAA,cAE5B;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW,sBAAO;AAAA,kBAClB,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAE;AAAA,kBACF,MAAK;AAAA,kBACL,aAAY;AAAA;AAAA,cACd;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;AAErB,IAAO,iBAAQ;","names":[]}

package/dist/__chunks/LDP6CRMG.js

@@ -0,0 +1,9 @@
+// ../syntax-design-tokens/dist/js/index.js
+var ColorBaseDestructive700 = "#d32a4b";
+var ColorBaseGray800 = "#353535";
+
+export {
+  ColorBaseDestructive700,
+  ColorBaseGray800
+};
+//# sourceMappingURL=LDP6CRMG.js.map

package/dist/__chunks/LDP6CRMG.js.map

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

package/dist/__chunks/{QJI4G5FP.cjs → LHWRDJUE.cjs}

@@ -79,4 +79,4 @@ var Triggerable_default = Triggerable;
 
 
 exports.Triggerable_default = Triggerable_default;
-//# sourceMappingURL=QJI4G5FP.cjs.map
+//# sourceMappingURL=LHWRDJUE.cjs.map

package/dist/__chunks/{QJI4G5FP.cjs.map → LHWRDJUE.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/react-aria-utils/Triggerable.tsx","css-module:./Triggerable.module.css#css-module"],"names":["Triggerable"],"mappings":";;;;;;;;;;AAAA,OAAO;AAAA,EACL;AAAA,EACA;AAAA,EAIA;AAAA,EACA;AAAA,OACK;AACP,SAAS,YAAY,WAAW,cAAc,gBAAgB;AAC9D,SAAS,kCAAkC;AAC3C,SAAS,cAAc,iBAAiB;AACxC,SAAS,2BAA2B;;;ACZuE,IAAO,6BAAQ,EAAC,WAAU,mBAAkB;;;ADiEnJ;AA3CJ,SAAS,aAAgB,UAAkC,WAAmB;AAE5E,SAAO,MAAM,aAAa,UAAU;AAAA,IAClC,KAAK,SAAS,MAAM,UAAa,WAAW,SAAS,GAAG,IAAI;AAAA,EAC9D,CAAC;AACH;AAEA,IAAM,cAAc,WAMlB,SAASA,aAAY,OAAO,cAAc;AAC1C,QAAM,EAAE,UAAU,UAAU,WAAW,IAAI;AAC3C,QAAM,gBAAgB,OAAoB,IAAI;AAC9C,QAAM,WAAW,aAA0B,IAAI;AAC/C,QAAM,mBAAmB,oBAAoB,aAAa;AAC1D,QAAM,eAAe,mBAAmB,WAAW;AACnD,QAAM,EAAE,eAAe,IAAI,aAAa,EAAE,WAAW,GAAG,YAAY;AACpE,QAAM,EAAE,YAAY,IAAI;AAAA,IACtB,EAAE,aAAa,QAAQ,WAAW;AAAA,IAClC;AAAA,EACF;AACA,QAAM,EAAE,WAAW,IAAI,SAAS,EAAE,WAAW,CAAC;AAE9C,QACE,qBADM,WAAS,QAAQ,WAAW,QAhDtC,IAiDI,IAD8C,gCAC9C,IAD8C,CAAxC,WAAS,UAAQ,aAAW;AAEpC,QAAM,wBAAwB,EAAE,SAAS,QAAQ,WAAW,QAAQ;AAEpE,QAAM,QAAQ,WAAW,aAAa,UAAU,QAAQ,IAAI;AAC5D,gCAA8B,uBAAuB,UAAU;AAAA,IAC7D,SAAS;AAAA,EACX,CAAC;AAED,QAAM,sBAAsB,WAAW,0BAA0B;AAEjE,sBAAoB,cAAc,OAAO;AAAA,IACvC,MAAM,MAAM,oBAAoB,KAAK;AAAA,IACrC,OAAO,MAAM,oBAAoB,MAAM;AAAA,EACzC,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,OACD;AAAA,MACF;AAAA,MACA,mBAAmB,CAAC,IAAI;AAAA,MACxB;AAAA,MACA;AAAA,MACA;AAAA,QACE,WAAW,2BAAO;AAAA,QAClB,OAAO;AAAA,UACL,SAAS;AAAA,UACT,eAAe;AAAA,QACjB;AAAA,MACF;AAAA,IACF,IAdD;AAAA,MAeC,UAAU,mBAAmB,SAAY;AAAA,MAExC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,sBAAQ","sourcesContent":["import React, {\n  forwardRef,\n  useImperativeHandle,\n  type ReactElement,\n  type Ref,\n  type RefAttributes,\n  useContext,\n  useRef,\n} from \"react\";\nimport { mergeProps, useButton, useFocusable, useHover } from \"react-aria\";\nimport { OverlayTriggerStateContext } from \"react-aria-components\";\nimport { useObjectRef, mergeRefs } from \"@react-aria/utils\";\nimport { useHasTabbableChild } from \"@react-aria/focus\";\nimport { useDomRefSyntheticEventBridge } from \"./useDomRefSyntheticEventBridge\";\nimport styles from \"./Triggerable.module.css\";\n\nexport type OverlayHandlerRef = {\n  open?: () => void;\n  close?: () => void;\n};\n\ntype ReactElementWithRef<T = unknown> = ReactElement & RefAttributes<T>;\nfunction cloneWithRef<T>(children: ReactElementWithRef<T>, parentRef: Ref<T>) {\n  // No need for the isValidElement check since children is already typed as a ReactElement\n  return React.cloneElement(children, {\n    ref: children.ref ? mergeRefs<T>(parentRef, children.ref) : parentRef,\n  });\n}\n\nconst Triggerable = forwardRef<\n  OverlayHandlerRef,\n  {\n    children?: ReactElement | (ReactElement & { ref?: Ref<Element> });\n    disabled?: boolean;\n  }\n>(function Triggerable(props, forwardedRef) {\n  const { children, disabled: isDisabled } = props;\n  const wrapperDomRef = useRef<HTMLElement>(null);\n  const childRef = useObjectRef<HTMLElement>(null);\n  const hasTabbableChild = useHasTabbableChild(wrapperDomRef);\n  const focusableRef = hasTabbableChild ? childRef : wrapperDomRef;\n  const { focusableProps } = useFocusable({ isDisabled }, focusableRef);\n  const { buttonProps } = useButton(\n    { elementType: \"span\", isDisabled },\n    focusableRef,\n  );\n  const { hoverProps } = useHover({ isDisabled });\n  // focus handlers are attached to tabbable child if present\n  const { onFocus, onBlur, onKeyDown, onKeyUp, ...otherFocusableProps } =\n    focusableProps;\n  const focusableHandlerProps = { onFocus, onBlur, onKeyDown, onKeyUp };\n  // attach focus handlers to tabbable child if present\n  const child = children ? cloneWithRef(children, childRef) : children;\n  useDomRefSyntheticEventBridge(focusableHandlerProps, childRef, {\n    enabled: hasTabbableChild,\n  });\n\n  const overlayTriggerState = useContext(OverlayTriggerStateContext);\n  // Expose open and close methods from any overlay context to parent component\n  useImperativeHandle(forwardedRef, () => ({\n    open: () => overlayTriggerState.open(),\n    close: () => overlayTriggerState.close(),\n  }));\n\n  return (\n    <span\n      ref={wrapperDomRef}\n      {...mergeProps(\n        buttonProps,\n        hasTabbableChild ? {} : focusableHandlerProps,\n        otherFocusableProps,\n        hoverProps,\n        {\n          className: styles.trigger,\n          style: {\n            display: \"inline-block\",\n            verticalAlign: \"text-top\",\n          },\n        },\n      )}\n      tabIndex={hasTabbableChild ? undefined : 0}\n    >\n      {child}\n    </span>\n  );\n});\n\nexport default Triggerable;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/react-aria-utils/Triggerable.module.css\"; export default {\"trigger\":\"_trigger_1efnf_1\"}"]}
+{"version":3,"sources":["../../src/react-aria-utils/Triggerable.tsx","css-module:./Triggerable.module.css#css-module"],"names":["Triggerable"],"mappings":";;;;;;;;;;AAAA,OAAO;AAAA,EACL;AAAA,EACA;AAAA,EAIA;AAAA,EACA;AAAA,OACK;AACP,SAAS,YAAY,WAAW,cAAc,gBAAgB;AAC9D,SAAS,kCAAkC;AAC3C,SAAS,cAAc,iBAAiB;AACxC,SAAS,2BAA2B;;;ACZsE,IAAO,6BAAQ,EAAC,WAAU,mBAAkB;;;ADiElJ;AA3CJ,SAAS,aAAgB,UAAkC,WAAmB;AAE5E,SAAO,MAAM,aAAa,UAAU;AAAA,IAClC,KAAK,SAAS,MAAM,UAAa,WAAW,SAAS,GAAG,IAAI;AAAA,EAC9D,CAAC;AACH;AAEA,IAAM,cAAc,WAMlB,SAASA,aAAY,OAAO,cAAc;AAC1C,QAAM,EAAE,UAAU,UAAU,WAAW,IAAI;AAC3C,QAAM,gBAAgB,OAAoB,IAAI;AAC9C,QAAM,WAAW,aAA0B,IAAI;AAC/C,QAAM,mBAAmB,oBAAoB,aAAa;AAC1D,QAAM,eAAe,mBAAmB,WAAW;AACnD,QAAM,EAAE,eAAe,IAAI,aAAa,EAAE,WAAW,GAAG,YAAY;AACpE,QAAM,EAAE,YAAY,IAAI;AAAA,IACtB,EAAE,aAAa,QAAQ,WAAW;AAAA,IAClC;AAAA,EACF;AACA,QAAM,EAAE,WAAW,IAAI,SAAS,EAAE,WAAW,CAAC;AAE9C,QACE,qBADM,WAAS,QAAQ,WAAW,QAhDtC,IAiDI,IAD8C,gCAC9C,IAD8C,CAAxC,WAAS,UAAQ,aAAW;AAEpC,QAAM,wBAAwB,EAAE,SAAS,QAAQ,WAAW,QAAQ;AAEpE,QAAM,QAAQ,WAAW,aAAa,UAAU,QAAQ,IAAI;AAC5D,gCAA8B,uBAAuB,UAAU;AAAA,IAC7D,SAAS;AAAA,EACX,CAAC;AAED,QAAM,sBAAsB,WAAW,0BAA0B;AAEjE,sBAAoB,cAAc,OAAO;AAAA,IACvC,MAAM,MAAM,oBAAoB,KAAK;AAAA,IACrC,OAAO,MAAM,oBAAoB,MAAM;AAAA,EACzC,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,OACD;AAAA,MACF;AAAA,MACA,mBAAmB,CAAC,IAAI;AAAA,MACxB;AAAA,MACA;AAAA,MACA;AAAA,QACE,WAAW,2BAAO;AAAA,QAClB,OAAO;AAAA,UACL,SAAS;AAAA,UACT,eAAe;AAAA,QACjB;AAAA,MACF;AAAA,IACF,IAdD;AAAA,MAeC,UAAU,mBAAmB,SAAY;AAAA,MAExC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,sBAAQ","sourcesContent":["import React, {\n  forwardRef,\n  useImperativeHandle,\n  type ReactElement,\n  type Ref,\n  type RefAttributes,\n  useContext,\n  useRef,\n} from \"react\";\nimport { mergeProps, useButton, useFocusable, useHover } from \"react-aria\";\nimport { OverlayTriggerStateContext } from \"react-aria-components\";\nimport { useObjectRef, mergeRefs } from \"@react-aria/utils\";\nimport { useHasTabbableChild } from \"@react-aria/focus\";\nimport { useDomRefSyntheticEventBridge } from \"./useDomRefSyntheticEventBridge\";\nimport styles from \"./Triggerable.module.css\";\n\nexport type OverlayHandlerRef = {\n  open?: () => void;\n  close?: () => void;\n};\n\ntype ReactElementWithRef<T = unknown> = ReactElement & RefAttributes<T>;\nfunction cloneWithRef<T>(children: ReactElementWithRef<T>, parentRef: Ref<T>) {\n  // No need for the isValidElement check since children is already typed as a ReactElement\n  return React.cloneElement(children, {\n    ref: children.ref ? mergeRefs<T>(parentRef, children.ref) : parentRef,\n  });\n}\n\nconst Triggerable = forwardRef<\n  OverlayHandlerRef,\n  {\n    children?: ReactElement | (ReactElement & { ref?: Ref<Element> });\n    disabled?: boolean;\n  }\n>(function Triggerable(props, forwardedRef) {\n  const { children, disabled: isDisabled } = props;\n  const wrapperDomRef = useRef<HTMLElement>(null);\n  const childRef = useObjectRef<HTMLElement>(null);\n  const hasTabbableChild = useHasTabbableChild(wrapperDomRef);\n  const focusableRef = hasTabbableChild ? childRef : wrapperDomRef;\n  const { focusableProps } = useFocusable({ isDisabled }, focusableRef);\n  const { buttonProps } = useButton(\n    { elementType: \"span\", isDisabled },\n    focusableRef,\n  );\n  const { hoverProps } = useHover({ isDisabled });\n  // focus handlers are attached to tabbable child if present\n  const { onFocus, onBlur, onKeyDown, onKeyUp, ...otherFocusableProps } =\n    focusableProps;\n  const focusableHandlerProps = { onFocus, onBlur, onKeyDown, onKeyUp };\n  // attach focus handlers to tabbable child if present\n  const child = children ? cloneWithRef(children, childRef) : children;\n  useDomRefSyntheticEventBridge(focusableHandlerProps, childRef, {\n    enabled: hasTabbableChild,\n  });\n\n  const overlayTriggerState = useContext(OverlayTriggerStateContext);\n  // Expose open and close methods from any overlay context to parent component\n  useImperativeHandle(forwardedRef, () => ({\n    open: () => overlayTriggerState.open(),\n    close: () => overlayTriggerState.close(),\n  }));\n\n  return (\n    <span\n      ref={wrapperDomRef}\n      {...mergeProps(\n        buttonProps,\n        hasTabbableChild ? {} : focusableHandlerProps,\n        otherFocusableProps,\n        hoverProps,\n        {\n          className: styles.trigger,\n          style: {\n            display: \"inline-block\",\n            verticalAlign: \"text-top\",\n          },\n        },\n      )}\n      tabIndex={hasTabbableChild ? undefined : 0}\n    >\n      {child}\n    </span>\n  );\n});\n\nexport default Triggerable;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/react-aria-utils/Triggerable.module.css\"; export default {\"trigger\":\"_trigger_1efnf_1\"}"]}

package/dist/__chunks/{ERXGNP37.js → LICJ6EW4.mjs}

@@ -4,4 +4,4 @@ var colors_module_default = { "inheritColor": "_inheritColor_11l4y_2", "destruct
 export {
   colors_module_default
 };
-//# sourceMappingURL=ERXGNP37.js.map
+//# sourceMappingURL=LICJ6EW4.mjs.map

package/dist/__chunks/LICJ6EW4.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["css-module:../colors/colors.module.css#css-module"],"sourcesContent":["import \"/Users/christian/cambly/syntax/packages/syntax-core/src/colors/colors.module.css\"; export default {\"inheritColor\":\"_inheritColor_11l4y_2\",\"destructive700Color\":\"_destructive700Color_11l4y_6\",\"gray700Color\":\"_gray700Color_11l4y_10\",\"gray900Color\":\"_gray900Color_11l4y_14\",\"primary700Color\":\"_primary700Color_11l4y_18\",\"success700Color\":\"_success700Color_11l4y_22\",\"whiteColor\":\"_whiteColor_11l4y_26\",\"blackBackgroundColor\":\"_blackBackgroundColor_11l4y_31\",\"destructive100BackgroundColor\":\"_destructive100BackgroundColor_11l4y_35\",\"destructive200BackgroundColor\":\"_destructive200BackgroundColor_11l4y_39\",\"destructive300BackgroundColor\":\"_destructive300BackgroundColor_11l4y_43\",\"destructive700BackgroundColor\":\"_destructive700BackgroundColor_11l4y_47\",\"destructive800BackgroundColor\":\"_destructive800BackgroundColor_11l4y_51\",\"destructive900BackgroundColor\":\"_destructive900BackgroundColor_11l4y_55\",\"gray10BackgroundColor\":\"_gray10BackgroundColor_11l4y_59\",\"gray30BackgroundColor\":\"_gray30BackgroundColor_11l4y_63\",\"gray60BackgroundColor\":\"_gray60BackgroundColor_11l4y_67\",\"gray80BackgroundColor\":\"_gray80BackgroundColor_11l4y_71\",\"gray100BackgroundColor\":\"_gray100BackgroundColor_11l4y_75\",\"gray200BackgroundColor\":\"_gray200BackgroundColor_11l4y_79\",\"gray300BackgroundColor\":\"_gray300BackgroundColor_11l4y_83\",\"gray700BackgroundColor\":\"_gray700BackgroundColor_11l4y_87\",\"gray800BackgroundColor\":\"_gray800BackgroundColor_11l4y_91\",\"gray900BackgroundColor\":\"_gray900BackgroundColor_11l4y_95\",\"orange100BackgroundColor\":\"_orange100BackgroundColor_11l4y_99\",\"orange200BackgroundColor\":\"_orange200BackgroundColor_11l4y_103\",\"orange300BackgroundColor\":\"_orange300BackgroundColor_11l4y_107\",\"orange700BackgroundColor\":\"_orange700BackgroundColor_11l4y_111\",\"orange800BackgroundColor\":\"_orange800BackgroundColor_11l4y_115\",\"orange900BackgroundColor\":\"_orange900BackgroundColor_11l4y_119\",\"primary100BackgroundColor\":\"_primary100BackgroundColor_11l4y_123\",\"primary200BackgroundColor\":\"_primary200BackgroundColor_11l4y_127\",\"primary300BackgroundColor\":\"_primary300BackgroundColor_11l4y_131\",\"primary700BackgroundColor\":\"_primary700BackgroundColor_11l4y_135\",\"primary800BackgroundColor\":\"_primary800BackgroundColor_11l4y_139\",\"primary900BackgroundColor\":\"_primary900BackgroundColor_11l4y_143\",\"success100BackgroundColor\":\"_success100BackgroundColor_11l4y_147\",\"success200BackgroundColor\":\"_success200BackgroundColor_11l4y_151\",\"success300BackgroundColor\":\"_success300BackgroundColor_11l4y_155\",\"success700BackgroundColor\":\"_success700BackgroundColor_11l4y_159\",\"success800BackgroundColor\":\"_success800BackgroundColor_11l4y_163\",\"success900BackgroundColor\":\"_success900BackgroundColor_11l4y_167\",\"purple100BackgroundColor\":\"_purple100BackgroundColor_11l4y_171\",\"purple200BackgroundColor\":\"_purple200BackgroundColor_11l4y_175\",\"purple300BackgroundColor\":\"_purple300BackgroundColor_11l4y_179\",\"purple700BackgroundColor\":\"_purple700BackgroundColor_11l4y_183\",\"purple800BackgroundColor\":\"_purple800BackgroundColor_11l4y_187\",\"purple900BackgroundColor\":\"_purple900BackgroundColor_11l4y_191\",\"whiteBackgroundColor\":\"_whiteBackgroundColor_11l4y_195\",\"yellow100BackgroundColor\":\"_yellow100BackgroundColor_11l4y_199\",\"yellow200BackgroundColor\":\"_yellow200BackgroundColor_11l4y_203\",\"yellow300BackgroundColor\":\"_yellow300BackgroundColor_11l4y_207\",\"yellow700BackgroundColor\":\"_yellow700BackgroundColor_11l4y_211\",\"yellow800BackgroundColor\":\"_yellow800BackgroundColor_11l4y_215\",\"yellow900BackgroundColor\":\"_yellow900BackgroundColor_11l4y_219\"}"],"mappings":";AAA2F,IAAO,wBAAQ,EAAC,gBAAe,yBAAwB,uBAAsB,gCAA+B,gBAAe,0BAAyB,gBAAe,0BAAyB,mBAAkB,6BAA4B,mBAAkB,6BAA4B,cAAa,wBAAuB,wBAAuB,kCAAiC,iCAAgC,2CAA0C,iCAAgC,2CAA0C,iCAAgC,2CAA0C,iCAAgC,2CAA0C,iCAAgC,2CAA0C,iCAAgC,2CAA0C,yBAAwB,mCAAkC,yBAAwB,mCAAkC,yBAAwB,mCAAkC,yBAAwB,mCAAkC,0BAAyB,oCAAmC,0BAAyB,oCAAmC,0BAAyB,oCAAmC,0BAAyB,oCAAmC,0BAAyB,oCAAmC,0BAAyB,oCAAmC,4BAA2B,sCAAqC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,6BAA4B,wCAAuC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,wBAAuB,mCAAkC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,uCAAsC,4BAA2B,sCAAqC;","names":[]}