@cambly/syntax-core 18.6.0 → 18.7.0

package/dist/__chunks/{IYYTLOO3.cjs → NNGCYWZA.cjs}

@@ -13,7 +13,7 @@ var _G3SXARBLcjs = require('./G3SXARBL.cjs');
 var _THM3NAFOcjs = require('./THM3NAFO.cjs');
 
 
-var _YJAKY2I2cjs = require('./YJAKY2I2.cjs');
+var _7QBU4DTXcjs = require('./7QBU4DTX.cjs');
 
 
 var _KJLBDAZHcjs = require('./KJLBDAZH.cjs');
@@ -79,7 +79,7 @@ function Modal({
                   __style: { top: 4, right: 4 }
                 },
                 children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                  _YJAKY2I2cjs.IconButton_default,
+                  _7QBU4DTXcjs.IconButton_default,
                   {
                     accessibilityLabel: accessibilityCloseLabel,
                     color: image ? "primary" : "tertiary",
@@ -130,4 +130,4 @@ Modal.displayName = "Modal";
 
 
 exports.Modal = Modal;
-//# sourceMappingURL=IYYTLOO3.cjs.map
+//# sourceMappingURL=NNGCYWZA.cjs.map

package/dist/__chunks/{BTBAAACD.js → NOPJE4A2.js}

@@ -8,7 +8,7 @@ import {
 import {
   internalIconSize,
   materialIconSize
-} from "./ESVDNOSI.js";
+} from "./64WM4STC.js";
 import {
   Box_default
 } from "./65PMWIHY.js";
@@ -33,7 +33,7 @@ import { forwardRef } from "react";
 import classNames from "classnames";
 
 // css-module:./Button.module.css#css-module
-var Button_module_default = { "button": "_button_1hpt0_1", "buttonGap": "_buttonGap_1hpt0_8", "disabled": "_disabled_1hpt0_42", "disabledPrimary": "_disabledPrimary_1hpt0_56", "fullWidth": "_fullWidth_1hpt0_60", "sm": "_sm_1hpt0_64", "md": "_md_1hpt0_71", "lg": "_lg_1hpt0_78", "icon": "_icon_1hpt0_85", "smIcon": "_smIcon_1hpt0_89", "mdIcon": "_mdIcon_1hpt0_96", "lgIcon": "_lgIcon_1hpt0_103", "loading": "_loading_1hpt0_120", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_1hpt0_1", "loadingCircle": "_loadingCircle_1hpt0_124" };
+var Button_module_default = { "button": "_button_v2jgj_1", "buttonGap": "_buttonGap_v2jgj_8", "disabled": "_disabled_v2jgj_42", "disabledPrimary": "_disabledPrimary_v2jgj_57", "fullWidth": "_fullWidth_v2jgj_61", "sm": "_sm_v2jgj_65", "md": "_md_v2jgj_72", "lg": "_lg_v2jgj_79", "icon": "_icon_v2jgj_86", "smIcon": "_smIcon_v2jgj_90", "mdIcon": "_mdIcon_v2jgj_97", "lgIcon": "_lgIcon_v2jgj_104", "loading": "_loading_v2jgj_121", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_v2jgj_1", "loadingCircle": "_loadingCircle_v2jgj_125" };
 
 // src/Button/Button.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -146,4 +146,4 @@ var Button_default = Button;
 export {
   Button_default
 };
-//# sourceMappingURL=BTBAAACD.js.map
+//# sourceMappingURL=NOPJE4A2.js.map

package/dist/__chunks/{BTBAAACD.js.map → NOPJE4A2.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/Button.tsx","css-module:./Button.module.css#css-module"],"sourcesContent":["import React, { forwardRef, type ComponentProps } from \"react\";\nimport classNames from \"classnames\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport { materialIconSize, internalIconSize } from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { backgroundColor } from \"../colors/backgroundColor\";\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { border } from \"../colors/border\";\nimport type InternalIcon from \"../Icon/Icon\";\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-primary\"\n    | \"success-secondary\"\n    | \"success-tertiary\";\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 48px\n   * * `lg`: 64px\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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   * 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      on = \"lightBackground\",\n      onClick,\n      tooltip,\n      type = \"button\",\n    }: ButtonProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n\n    const foregroundColorClass = foregroundColor(color, on);\n    const backgroundColorClass = backgroundColor(color, on);\n    const disabledPrimary = color === \"primary\" && disabled;\n    const isDisabled = !isHydrated || disabled || loading;\n\n    return (\n      <button\n        data-testid={dataTestId}\n        ref={ref}\n        aria-label={accessibilityLabel}\n        type={type}\n        title={tooltip}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={classNames(\n          styles.button,\n          foregroundColorClass,\n          backgroundColorClass,\n          border(color, on),\n          styles[size],\n          {\n            [styles.fullWidth]: fullWidth,\n            [styles.buttonGap]: size === \"lg\" || size === \"md\",\n            [styles.disabled]: isDisabled,\n          },\n        )}\n      >\n        {!loading && StartIcon && (\n          <StartIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {((loading && loadingText) || (!loading && text)) && (\n          <Box paddingX={1}>\n            <Typography size={textVariant[size]} weight=\"medium\">\n              <span\n                className={classNames(\n                  foregroundColorClass,\n                  disabledPrimary && styles.disabledPrimary,\n                )}\n              >\n                {loading ? loadingText : text}\n              </span>\n            </Typography>\n          </Box>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {loading && (\n          <svg\n            className={classNames(styles.loading, foregroundColorClass)}\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_1hpt0_1\",\"buttonGap\":\"_buttonGap_1hpt0_8\",\"disabled\":\"_disabled_1hpt0_42\",\"disabledPrimary\":\"_disabledPrimary_1hpt0_56\",\"fullWidth\":\"_fullWidth_1hpt0_60\",\"sm\":\"_sm_1hpt0_64\",\"md\":\"_md_1hpt0_71\",\"lg\":\"_lg_1hpt0_78\",\"icon\":\"_icon_1hpt0_85\",\"smIcon\":\"_smIcon_1hpt0_89\",\"mdIcon\":\"_mdIcon_1hpt0_96\",\"lgIcon\":\"_lgIcon_1hpt0_103\",\"loading\":\"_loading_1hpt0_120\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1hpt0_1\",\"loadingCircle\":\"_loadingCircle_1hpt0_124\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAuC;AACvD,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,qBAAoB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;AD4IrkB,SAsBI,KAtBJ;AA7BN,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,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,kBAAkB,UAAU,aAAa;AAC/C,UAAM,aAAa,CAAC,cAAc,YAAY;AAE9C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU;AAAA,QACV;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP;AAAA,UACA;AAAA,UACA,OAAO,OAAO,EAAE;AAAA,UAChB,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YAC9C,CAAC,sBAAO,QAAQ,GAAG;AAAA,UACrB;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,WAEC,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,QAAO,UAC1C;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cAEC,oBAAU,cAAc;AAAA;AAAA,UAC3B,GACF,GACF;AAAA,UAED,CAAC,WAAW,WACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,oBAAoB;AAAA,cAC1D,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, type ComponentProps } from \"react\";\nimport classNames from \"classnames\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport { materialIconSize, internalIconSize } from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { backgroundColor } from \"../colors/backgroundColor\";\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { border } from \"../colors/border\";\nimport type InternalIcon from \"../Icon/Icon\";\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-primary\"\n    | \"success-secondary\"\n    | \"success-tertiary\";\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 48px\n   * * `lg`: 64px\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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   * 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      on = \"lightBackground\",\n      onClick,\n      tooltip,\n      type = \"button\",\n    }: ButtonProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n\n    const foregroundColorClass = foregroundColor(color, on);\n    const backgroundColorClass = backgroundColor(color, on);\n    const disabledPrimary = color === \"primary\" && disabled;\n    const isDisabled = !isHydrated || disabled || loading;\n\n    return (\n      <button\n        data-testid={dataTestId}\n        ref={ref}\n        aria-label={accessibilityLabel}\n        type={type}\n        title={tooltip}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={classNames(\n          styles.button,\n          foregroundColorClass,\n          backgroundColorClass,\n          border(color, on),\n          styles[size],\n          {\n            [styles.fullWidth]: fullWidth,\n            [styles.buttonGap]: size === \"lg\" || size === \"md\",\n            [styles.disabled]: isDisabled,\n          },\n        )}\n      >\n        {!loading && StartIcon && (\n          <StartIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {((loading && loadingText) || (!loading && text)) && (\n          <Box paddingX={1}>\n            <Typography size={textVariant[size]} weight=\"medium\">\n              <span\n                className={classNames(\n                  foregroundColorClass,\n                  disabledPrimary && styles.disabledPrimary,\n                )}\n              >\n                {loading ? loadingText : text}\n              </span>\n            </Typography>\n          </Box>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {loading && (\n          <svg\n            className={classNames(styles.loading, foregroundColorClass)}\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_v2jgj_1\",\"buttonGap\":\"_buttonGap_v2jgj_8\",\"disabled\":\"_disabled_v2jgj_42\",\"disabledPrimary\":\"_disabledPrimary_v2jgj_57\",\"fullWidth\":\"_fullWidth_v2jgj_61\",\"sm\":\"_sm_v2jgj_65\",\"md\":\"_md_v2jgj_72\",\"lg\":\"_lg_v2jgj_79\",\"icon\":\"_icon_v2jgj_86\",\"smIcon\":\"_smIcon_v2jgj_90\",\"mdIcon\":\"_mdIcon_v2jgj_97\",\"lgIcon\":\"_lgIcon_v2jgj_104\",\"loading\":\"_loading_v2jgj_121\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_v2jgj_1\",\"loadingCircle\":\"_loadingCircle_v2jgj_125\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAuC;AACvD,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,qBAAoB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;AD4IrkB,SAsBI,KAtBJ;AA7BN,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,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,kBAAkB,UAAU,aAAa;AAC/C,UAAM,aAAa,CAAC,cAAc,YAAY;AAE9C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU;AAAA,QACV;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP;AAAA,UACA;AAAA,UACA,OAAO,OAAO,EAAE;AAAA,UAChB,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YAC9C,CAAC,sBAAO,QAAQ,GAAG;AAAA,UACrB;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,WAEC,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,QAAO,UAC1C;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cAEC,oBAAU,cAAc;AAAA;AAAA,UAC3B,GACF,GACF;AAAA,UAED,CAAC,WAAW,WACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,oBAAoB;AAAA,cAC1D,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/{4LS53X3H.js → OXV7VGXO.js}

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

package/dist/__chunks/{4LS53X3H.js.map → OXV7VGXO.js.map}

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

package/dist/__chunks/{LIUV3J2M.cjs → QKBS4OXL.cjs}

@@ -1,13 +1,13 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _TSMYMWWEcjs = require('./TSMYMWWE.cjs');
+var _C5XPZTFOcjs = require('./C5XPZTFO.cjs');
 
 
-var _42SRFCQLcjs = require('./42SRFCQL.cjs');
+var _UYUCK2UEcjs = require('./UYUCK2UE.cjs');
 
 
-var _C5XPZTFOcjs = require('./C5XPZTFO.cjs');
+var _42SRFCQLcjs = require('./42SRFCQL.cjs');
 
 
 var _I76WKOLEcjs = require('./I76WKOLE.cjs');
@@ -169,7 +169,7 @@ var RichSelectBox = _react.forwardRef.call(void 0,
                 justifyContent: "end",
                 children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _C5XPZTFOcjs.ButtonGroup_default, { orientation: "horizontal", children: [
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _TSMYMWWEcjs.Button_default,
+                    _UYUCK2UEcjs.Button_default,
                     {
                       onClick: clearChanges,
                       color: "secondary",
@@ -179,7 +179,7 @@ var RichSelectBox = _react.forwardRef.call(void 0,
                     }
                   ),
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _TSMYMWWEcjs.Button_default,
+                    _UYUCK2UEcjs.Button_default,
                     {
                       onClick: saveChanges,
                       text: primaryButtonText,
@@ -208,4 +208,4 @@ var RichSelectBox_default = Object.assign(RichSelectBox, {
 
 
 exports.convertSelection = convertSelection; exports.RichSelectBoxContext = RichSelectBoxContext; exports.RichSelectBox_default = RichSelectBox_default;
-//# sourceMappingURL=LIUV3J2M.cjs.map
+//# sourceMappingURL=QKBS4OXL.cjs.map

package/dist/__chunks/{PW6JTQVM.js → R47ZRXRK.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   Popover_default
-} from "./SNLD3DG6.js";
+} from "./W7VHIMWJ.js";
 import {
   DialogContext
 } from "./5HEC7ASW.js";
@@ -9,12 +9,12 @@ import {
   ColorBaseDestructive700,
   ColorBaseGray700,
   ColorCambioWhite100
-} from "./4LS53X3H.js";
+} from "./OXV7VGXO.js";
 import {
   RichSelectBoxContext,
   RichSelectBox_default,
   convertSelection
-} from "./TU2BVOKD.js";
+} from "./JFPMPJ2P.js";
 import {
   RichSelectSection_default
 } from "./YPUA2AJT.js";
@@ -286,4 +286,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 export {
   RichSelectList_default
 };
-//# sourceMappingURL=PW6JTQVM.js.map
+//# sourceMappingURL=R47ZRXRK.js.map

package/dist/__chunks/{BLW57GRR.js → RPWXCCIV.js}

@@ -4,7 +4,7 @@ import {
 } from "./5HEC7ASW.js";
 import {
   IconButton_default
-} from "./MZOGVH4K.js";
+} from "./UASXKT55.js";
 import {
   Box_default
 } from "./65PMWIHY.js";
@@ -157,4 +157,4 @@ export {
   AriaModal,
   ModalDialog_default
 };
-//# sourceMappingURL=BLW57GRR.js.map
+//# sourceMappingURL=RPWXCCIV.js.map

package/dist/__chunks/TH4TA3JN.cjs

@@ -0,0 +1,9 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
+
+// css-module:../Button/Button.module.css#css-module
+var Button_module_default = { "button": "_button_v2jgj_1", "buttonGap": "_buttonGap_v2jgj_8", "disabled": "_disabled_v2jgj_42", "disabledPrimary": "_disabledPrimary_v2jgj_57", "fullWidth": "_fullWidth_v2jgj_61", "sm": "_sm_v2jgj_65", "md": "_md_v2jgj_72", "lg": "_lg_v2jgj_79", "icon": "_icon_v2jgj_86", "smIcon": "_smIcon_v2jgj_90", "mdIcon": "_mdIcon_v2jgj_97", "lgIcon": "_lgIcon_v2jgj_104", "loading": "_loading_v2jgj_121", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_v2jgj_1", "loadingCircle": "_loadingCircle_v2jgj_125" };
+
+
+
+exports.Button_module_default = Button_module_default;
+//# sourceMappingURL=TH4TA3JN.cjs.map

package/dist/__chunks/TH4TA3JN.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["css-module:../Button/Button.module.css#css-module"],"names":[],"mappings":";;;AAA4F,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,qBAAoB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B","sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_v2jgj_1\",\"buttonGap\":\"_buttonGap_v2jgj_8\",\"disabled\":\"_disabled_v2jgj_42\",\"disabledPrimary\":\"_disabledPrimary_v2jgj_57\",\"fullWidth\":\"_fullWidth_v2jgj_61\",\"sm\":\"_sm_v2jgj_65\",\"md\":\"_md_v2jgj_72\",\"lg\":\"_lg_v2jgj_79\",\"icon\":\"_icon_v2jgj_86\",\"smIcon\":\"_smIcon_v2jgj_90\",\"mdIcon\":\"_mdIcon_v2jgj_97\",\"lgIcon\":\"_lgIcon_v2jgj_104\",\"loading\":\"_loading_v2jgj_121\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_v2jgj_1\",\"loadingCircle\":\"_loadingCircle_v2jgj_125\"}"]}

package/dist/__chunks/{MZOGVH4K.js → UASXKT55.js}

@@ -2,7 +2,7 @@
 import {
   internalIconSize,
   materialIconSize
-} from "./ESVDNOSI.js";
+} from "./64WM4STC.js";
 import {
   foregroundColor
 } from "./VRJAMHSI.js";
@@ -74,4 +74,4 @@ var IconButton_default = IconButton;
 export {
   IconButton_default
 };
-//# sourceMappingURL=MZOGVH4K.js.map
+//# sourceMappingURL=UASXKT55.js.map

package/dist/__chunks/{TSMYMWWE.cjs → UYUCK2UE.cjs}

@@ -8,7 +8,7 @@ var _3P2PWHOUcjs = require('./3P2PWHOU.cjs');
 
 
 
-var _7TEFD526cjs = require('./7TEFD526.cjs');
+var _65BTPZZTcjs = require('./65BTPZZT.cjs');
 
 
 var _KJLBDAZHcjs = require('./KJLBDAZH.cjs');
@@ -33,7 +33,7 @@ var _react = require('react');
 var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
 
 // css-module:./Button.module.css#css-module
-var Button_module_default = { "button": "_button_1hpt0_1", "buttonGap": "_buttonGap_1hpt0_8", "disabled": "_disabled_1hpt0_42", "disabledPrimary": "_disabledPrimary_1hpt0_56", "fullWidth": "_fullWidth_1hpt0_60", "sm": "_sm_1hpt0_64", "md": "_md_1hpt0_71", "lg": "_lg_1hpt0_78", "icon": "_icon_1hpt0_85", "smIcon": "_smIcon_1hpt0_89", "mdIcon": "_mdIcon_1hpt0_96", "lgIcon": "_lgIcon_1hpt0_103", "loading": "_loading_1hpt0_120", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_1hpt0_1", "loadingCircle": "_loadingCircle_1hpt0_124" };
+var Button_module_default = { "button": "_button_v2jgj_1", "buttonGap": "_buttonGap_v2jgj_8", "disabled": "_disabled_v2jgj_42", "disabledPrimary": "_disabledPrimary_v2jgj_57", "fullWidth": "_fullWidth_v2jgj_61", "sm": "_sm_v2jgj_65", "md": "_md_v2jgj_72", "lg": "_lg_v2jgj_79", "icon": "_icon_v2jgj_86", "smIcon": "_smIcon_v2jgj_90", "mdIcon": "_mdIcon_v2jgj_97", "lgIcon": "_lgIcon_v2jgj_104", "loading": "_loading_v2jgj_121", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_v2jgj_1", "loadingCircle": "_loadingCircle_v2jgj_125" };
 
 // src/Button/Button.tsx
 var _jsxruntime = require('react/jsx-runtime');
@@ -88,10 +88,10 @@ var Button = _react.forwardRef.call(void 0,
             {
               className: _classnames2.default.call(void 0, 
                 Button_module_default.icon,
-                _7TEFD526cjs.materialIconSize[size],
+                _65BTPZZTcjs.materialIconSize[size],
                 disabledPrimary && Button_module_default.disabledPrimary
               ),
-              size: _7TEFD526cjs.internalIconSize[size]
+              size: _65BTPZZTcjs.internalIconSize[size]
             }
           ),
           (loading && loadingText || !loading && text) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _KJLBDAZHcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _FEFAG4KTcjs.Typography_default, { size: _5JUNB754cjs.textVariant_default[size], weight: "medium", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -109,10 +109,10 @@ var Button = _react.forwardRef.call(void 0,
             {
               className: _classnames2.default.call(void 0, 
                 Button_module_default.icon,
-                _7TEFD526cjs.materialIconSize[size],
+                _65BTPZZTcjs.materialIconSize[size],
                 disabledPrimary && Button_module_default.disabledPrimary
               ),
-              size: _7TEFD526cjs.internalIconSize[size]
+              size: _65BTPZZTcjs.internalIconSize[size]
             }
           ),
           loading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -146,4 +146,4 @@ var Button_default = Button;
 
 
 exports.Button_default = Button_default;
-//# sourceMappingURL=TSMYMWWE.cjs.map
+//# sourceMappingURL=UYUCK2UE.cjs.map

package/dist/__chunks/{TSMYMWWE.cjs.map → UYUCK2UE.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/Button.tsx","css-module:./Button.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAuC;AACvD,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,qBAAoB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;AD4IrkB,SAsBI,KAtBJ;AA7BN,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,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,kBAAkB,UAAU,aAAa;AAC/C,UAAM,aAAa,CAAC,cAAc,YAAY;AAE9C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU;AAAA,QACV;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP;AAAA,UACA;AAAA,UACA,OAAO,OAAO,EAAE;AAAA,UAChB,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YAC9C,CAAC,sBAAO,QAAQ,GAAG;AAAA,UACrB;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,WAEC,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,QAAO,UAC1C;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cAEC,oBAAU,cAAc;AAAA;AAAA,UAC3B,GACF,GACF;AAAA,UAED,CAAC,WAAW,WACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,oBAAoB;AAAA,cAC1D,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","sourcesContent":["import React, { forwardRef, type ComponentProps } from \"react\";\nimport classNames from \"classnames\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport { materialIconSize, internalIconSize } from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { backgroundColor } from \"../colors/backgroundColor\";\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { border } from \"../colors/border\";\nimport type InternalIcon from \"../Icon/Icon\";\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-primary\"\n    | \"success-secondary\"\n    | \"success-tertiary\";\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 48px\n   * * `lg`: 64px\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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   * 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      on = \"lightBackground\",\n      onClick,\n      tooltip,\n      type = \"button\",\n    }: ButtonProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n\n    const foregroundColorClass = foregroundColor(color, on);\n    const backgroundColorClass = backgroundColor(color, on);\n    const disabledPrimary = color === \"primary\" && disabled;\n    const isDisabled = !isHydrated || disabled || loading;\n\n    return (\n      <button\n        data-testid={dataTestId}\n        ref={ref}\n        aria-label={accessibilityLabel}\n        type={type}\n        title={tooltip}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={classNames(\n          styles.button,\n          foregroundColorClass,\n          backgroundColorClass,\n          border(color, on),\n          styles[size],\n          {\n            [styles.fullWidth]: fullWidth,\n            [styles.buttonGap]: size === \"lg\" || size === \"md\",\n            [styles.disabled]: isDisabled,\n          },\n        )}\n      >\n        {!loading && StartIcon && (\n          <StartIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {((loading && loadingText) || (!loading && text)) && (\n          <Box paddingX={1}>\n            <Typography size={textVariant[size]} weight=\"medium\">\n              <span\n                className={classNames(\n                  foregroundColorClass,\n                  disabledPrimary && styles.disabledPrimary,\n                )}\n              >\n                {loading ? loadingText : text}\n              </span>\n            </Typography>\n          </Box>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {loading && (\n          <svg\n            className={classNames(styles.loading, foregroundColorClass)}\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_1hpt0_1\",\"buttonGap\":\"_buttonGap_1hpt0_8\",\"disabled\":\"_disabled_1hpt0_42\",\"disabledPrimary\":\"_disabledPrimary_1hpt0_56\",\"fullWidth\":\"_fullWidth_1hpt0_60\",\"sm\":\"_sm_1hpt0_64\",\"md\":\"_md_1hpt0_71\",\"lg\":\"_lg_1hpt0_78\",\"icon\":\"_icon_1hpt0_85\",\"smIcon\":\"_smIcon_1hpt0_89\",\"mdIcon\":\"_mdIcon_1hpt0_96\",\"lgIcon\":\"_lgIcon_1hpt0_103\",\"loading\":\"_loading_1hpt0_120\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1hpt0_1\",\"loadingCircle\":\"_loadingCircle_1hpt0_124\"}"]}
+{"version":3,"sources":["../../src/Button/Button.tsx","css-module:./Button.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAuC;AACvD,OAAO,gBAAgB;;;ACDqE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,qBAAoB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;AD4IrkB,SAsBI,KAtBJ;AA7BN,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,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,kBAAkB,UAAU,aAAa;AAC/C,UAAM,aAAa,CAAC,cAAc,YAAY;AAE9C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU;AAAA,QACV;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP;AAAA,UACA;AAAA,UACA,OAAO,OAAO,EAAE;AAAA,UAChB,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YAC9C,CAAC,sBAAO,QAAQ,GAAG;AAAA,UACrB;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,WAEC,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,QAAO,UAC1C;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cAEC,oBAAU,cAAc;AAAA;AAAA,UAC3B,GACF,GACF;AAAA,UAED,CAAC,WAAW,WACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAO;AAAA,gBACP,iBAAiB,IAAI;AAAA,gBACrB,mBAAmB,sBAAO;AAAA,cAC5B;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,oBAAoB;AAAA,cAC1D,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","sourcesContent":["import React, { forwardRef, type ComponentProps } from \"react\";\nimport classNames from \"classnames\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport { materialIconSize, internalIconSize } from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { backgroundColor } from \"../colors/backgroundColor\";\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { border } from \"../colors/border\";\nimport type InternalIcon from \"../Icon/Icon\";\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-primary\"\n    | \"success-secondary\"\n    | \"success-tertiary\";\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 48px\n   * * `lg`: 64px\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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   * 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      on = \"lightBackground\",\n      onClick,\n      tooltip,\n      type = \"button\",\n    }: ButtonProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n\n    const foregroundColorClass = foregroundColor(color, on);\n    const backgroundColorClass = backgroundColor(color, on);\n    const disabledPrimary = color === \"primary\" && disabled;\n    const isDisabled = !isHydrated || disabled || loading;\n\n    return (\n      <button\n        data-testid={dataTestId}\n        ref={ref}\n        aria-label={accessibilityLabel}\n        type={type}\n        title={tooltip}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={classNames(\n          styles.button,\n          foregroundColorClass,\n          backgroundColorClass,\n          border(color, on),\n          styles[size],\n          {\n            [styles.fullWidth]: fullWidth,\n            [styles.buttonGap]: size === \"lg\" || size === \"md\",\n            [styles.disabled]: isDisabled,\n          },\n        )}\n      >\n        {!loading && StartIcon && (\n          <StartIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {((loading && loadingText) || (!loading && text)) && (\n          <Box paddingX={1}>\n            <Typography size={textVariant[size]} weight=\"medium\">\n              <span\n                className={classNames(\n                  foregroundColorClass,\n                  disabledPrimary && styles.disabledPrimary,\n                )}\n              >\n                {loading ? loadingText : text}\n              </span>\n            </Typography>\n          </Box>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon\n            className={classNames(\n              styles.icon,\n              materialIconSize[size],\n              disabledPrimary && styles.disabledPrimary,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {loading && (\n          <svg\n            className={classNames(styles.loading, foregroundColorClass)}\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_v2jgj_1\",\"buttonGap\":\"_buttonGap_v2jgj_8\",\"disabled\":\"_disabled_v2jgj_42\",\"disabledPrimary\":\"_disabledPrimary_v2jgj_57\",\"fullWidth\":\"_fullWidth_v2jgj_61\",\"sm\":\"_sm_v2jgj_65\",\"md\":\"_md_v2jgj_72\",\"lg\":\"_lg_v2jgj_79\",\"icon\":\"_icon_v2jgj_86\",\"smIcon\":\"_smIcon_v2jgj_90\",\"mdIcon\":\"_mdIcon_v2jgj_97\",\"lgIcon\":\"_lgIcon_v2jgj_104\",\"loading\":\"_loading_v2jgj_121\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_v2jgj_1\",\"loadingCircle\":\"_loadingCircle_v2jgj_125\"}"]}

package/dist/__chunks/{SNLD3DG6.js → W7VHIMWJ.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   ModalDialog_default
-} from "./BLW57GRR.js";
+} from "./RPWXCCIV.js";
 import {
   Dialog_default
 } from "./5HEC7ASW.js";
@@ -141,4 +141,4 @@ export {
   AriaPopover,
   Popover_default
 };
-//# sourceMappingURL=SNLD3DG6.js.map
+//# sourceMappingURL=W7VHIMWJ.js.map

package/dist/__chunks/YLWWTB4I.js

@@ -0,0 +1,9 @@
+"use client"
+
+// css-module:../Button/Button.module.css#css-module
+var Button_module_default = { "button": "_button_v2jgj_1", "buttonGap": "_buttonGap_v2jgj_8", "disabled": "_disabled_v2jgj_42", "disabledPrimary": "_disabledPrimary_v2jgj_57", "fullWidth": "_fullWidth_v2jgj_61", "sm": "_sm_v2jgj_65", "md": "_md_v2jgj_72", "lg": "_lg_v2jgj_79", "icon": "_icon_v2jgj_86", "smIcon": "_smIcon_v2jgj_90", "mdIcon": "_mdIcon_v2jgj_97", "lgIcon": "_lgIcon_v2jgj_104", "loading": "_loading_v2jgj_121", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_v2jgj_1", "loadingCircle": "_loadingCircle_v2jgj_125" };
+
+export {
+  Button_module_default
+};
+//# sourceMappingURL=YLWWTB4I.js.map

package/dist/__chunks/YLWWTB4I.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["css-module:../Button/Button.module.css#css-module"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_v2jgj_1\",\"buttonGap\":\"_buttonGap_v2jgj_8\",\"disabled\":\"_disabled_v2jgj_42\",\"disabledPrimary\":\"_disabledPrimary_v2jgj_57\",\"fullWidth\":\"_fullWidth_v2jgj_61\",\"sm\":\"_sm_v2jgj_65\",\"md\":\"_md_v2jgj_72\",\"lg\":\"_lg_v2jgj_79\",\"icon\":\"_icon_v2jgj_86\",\"smIcon\":\"_smIcon_v2jgj_90\",\"mdIcon\":\"_mdIcon_v2jgj_97\",\"lgIcon\":\"_lgIcon_v2jgj_104\",\"loading\":\"_loading_v2jgj_121\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_v2jgj_1\",\"loadingCircle\":\"_loadingCircle_v2jgj_125\"}"],"mappings":";;;AAA4F,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,qBAAoB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;","names":[]}

package/dist/index.cjs

@@ -1,22 +1,25 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _XG7O4UGWcjs = require('./__chunks/XG7O4UGW.cjs');
+var _RC7EMZ6Ncjs = require('./__chunks/RC7EMZ6N.cjs');
 
 
-var _RC7EMZ6Ncjs = require('./__chunks/RC7EMZ6N.cjs');
+var _XG7O4UGWcjs = require('./__chunks/XG7O4UGW.cjs');
 
 
 var _5COVOOB3cjs = require('./__chunks/5COVOOB3.cjs');
 
 
+var _L5RBAKANcjs = require('./__chunks/L5RBAKAN.cjs');
+
+
 var _C3FW5QDGcjs = require('./__chunks/C3FW5QDG.cjs');
 
 
 var _L32D5WEGcjs = require('./__chunks/L32D5WEG.cjs');
 
 
-var _IYYTLOO3cjs = require('./__chunks/IYYTLOO3.cjs');
+var _NNGCYWZAcjs = require('./__chunks/NNGCYWZA.cjs');
 
 
 var _Q4P2W7UUcjs = require('./__chunks/Q4P2W7UU.cjs');
@@ -25,38 +28,40 @@ require('./__chunks/G3SXARBL.cjs');
 require('./__chunks/THM3NAFO.cjs');
 
 
-var _BZ546NNEcjs = require('./__chunks/BZ546NNE.cjs');
+var _5UGT7MVTcjs = require('./__chunks/5UGT7MVT.cjs');
 
 
-var _L5RBAKANcjs = require('./__chunks/L5RBAKAN.cjs');
+var _BFZKWCPHcjs = require('./__chunks/BFZKWCPH.cjs');
+require('./__chunks/TH4TA3JN.cjs');
 
 
-var _H3QQNW5Xcjs = require('./__chunks/H3QQNW5X.cjs');
+var _33OLOKXZcjs = require('./__chunks/33OLOKXZ.cjs');
 
 
-var _XVYUFV22cjs = require('./__chunks/XVYUFV22.cjs');
+var _A7LK5QZScjs = require('./__chunks/A7LK5QZS.cjs');
 
 
-var _C4GAUB4Ycjs = require('./__chunks/C4GAUB4Y.cjs');
-require('./__chunks/RCCK2EW4.cjs');
+var _AHFP6M2Ncjs = require('./__chunks/AHFP6M2N.cjs');
+require('./__chunks/NIIFJYOC.cjs');
 require('./__chunks/J27AGJQB.cjs');
 
 
-var _YJAKY2I2cjs = require('./__chunks/YJAKY2I2.cjs');
-require('./__chunks/OXSHUPNO.cjs');
-require('./__chunks/LIUV3J2M.cjs');
+var _7QBU4DTXcjs = require('./__chunks/7QBU4DTX.cjs');
+require('./__chunks/WFVGNGEP.cjs');
+require('./__chunks/BIJUVIB4.cjs');
+require('./__chunks/QKBS4OXL.cjs');
 
 
-var _TSMYMWWEcjs = require('./__chunks/TSMYMWWE.cjs');
+var _C5XPZTFOcjs = require('./__chunks/C5XPZTFO.cjs');
 
 
-var _42SRFCQLcjs = require('./__chunks/42SRFCQL.cjs');
+var _UYUCK2UEcjs = require('./__chunks/UYUCK2UE.cjs');
 
 
-var _C5XPZTFOcjs = require('./__chunks/C5XPZTFO.cjs');
+var _42SRFCQLcjs = require('./__chunks/42SRFCQL.cjs');
 require('./__chunks/5JUNB754.cjs');
 require('./__chunks/3P2PWHOU.cjs');
-require('./__chunks/7TEFD526.cjs');
+require('./__chunks/65BTPZZT.cjs');
 require('./__chunks/I76WKOLE.cjs');
 require('./__chunks/MF7LLV7V.cjs');
 require('./__chunks/XTZEWLM5.cjs');
@@ -75,7 +80,7 @@ var _CW24HTITcjs = require('./__chunks/CW24HTIT.cjs');
 
 
 var _HBHOLWEMcjs = require('./__chunks/HBHOLWEM.cjs');
-require('./__chunks/WFVGNGEP.cjs');
+
 
 
 var _HBIGKRZ2cjs = require('./__chunks/HBIGKRZ2.cjs');
@@ -145,5 +150,6 @@ require('./__chunks/X2SDR4SD.cjs');
 
 
 
-exports.Avatar = _RC7EMZ6Ncjs.Avatar_default; exports.AvatarGroup = _5COVOOB3cjs.AvatarGroup; exports.Badge = _XG7O4UGWcjs.Badge_default; exports.Box = _KJLBDAZHcjs.Box_default; exports.Button = _TSMYMWWEcjs.Button_default; exports.ButtonGroup = _C5XPZTFOcjs.ButtonGroup_default; exports.Card = _L32D5WEGcjs.Card_default; exports.Checkbox = _C3FW5QDGcjs.Checkbox_default; exports.Chip = _SKFX2MXKcjs.Chip_default; exports.Divider = _42SRFCQLcjs.Divider; exports.Heading = _Q4P2W7UUcjs.Heading_default; exports.Icon = _L5RBAKANcjs.Icon_default; exports.IconButton = _YJAKY2I2cjs.IconButton_default; exports.LinkButton = _BZ546NNEcjs.LinkButton_default; exports.Modal = _IYYTLOO3cjs.Modal; exports.Popover = _C4GAUB4Ycjs.Popover_default; exports.RadioButton = _EF6R3LRBcjs.RadioButton_default; exports.RichSelectList = _XVYUFV22cjs.RichSelectList_default; exports.SelectList = _H3QQNW5Xcjs.SelectList; exports.Tabs = _HBIGKRZ2cjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _HBHOLWEMcjs.TextArea_default; exports.TextField = _CW24HTITcjs.TextField; exports.ThemeProvider = _36JMUQOLcjs.ThemeProvider; exports.Tooltip = _QI5Q2WJGcjs.Tooltip_default; exports.Typography = _FEFAG4KTcjs.Typography_default;
+
+exports.Avatar = _RC7EMZ6Ncjs.Avatar_default; exports.AvatarGroup = _5COVOOB3cjs.AvatarGroup; exports.Badge = _XG7O4UGWcjs.Badge_default; exports.Box = _KJLBDAZHcjs.Box_default; exports.Button = _UYUCK2UEcjs.Button_default; exports.ButtonGroup = _C5XPZTFOcjs.ButtonGroup_default; exports.Card = _L32D5WEGcjs.Card_default; exports.Checkbox = _C3FW5QDGcjs.Checkbox_default; exports.Chip = _SKFX2MXKcjs.Chip_default; exports.Divider = _42SRFCQLcjs.Divider; exports.Heading = _Q4P2W7UUcjs.Heading_default; exports.Icon = _L5RBAKANcjs.Icon_default; exports.IconButton = _7QBU4DTXcjs.IconButton_default; exports.IconLinkButton = _BFZKWCPHcjs.IconLinkButton_default; exports.LinkButton = _5UGT7MVTcjs.LinkButton_default; exports.Modal = _NNGCYWZAcjs.Modal; exports.Popover = _AHFP6M2Ncjs.Popover_default; exports.RadioButton = _EF6R3LRBcjs.RadioButton_default; exports.RichSelectList = _A7LK5QZScjs.RichSelectList_default; exports.SelectList = _33OLOKXZcjs.SelectList; exports.Tabs = _HBIGKRZ2cjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _HBHOLWEMcjs.TextArea_default; exports.TextField = _CW24HTITcjs.TextField; exports.ThemeProvider = _36JMUQOLcjs.ThemeProvider; exports.Tooltip = _QI5Q2WJGcjs.Tooltip_default; exports.Typography = _FEFAG4KTcjs.Typography_default;
 //# sourceMappingURL=index.cjs.map

package/dist/index.css

@@ -2263,82 +2263,83 @@
 }
 
 /* css-module:/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css/#css-module-data */
-._button_1hpt0_1 {
+._button_v2jgj_1 {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
 }
-._buttonGap_1hpt0_8 {
+._buttonGap_v2jgj_8 {
   gap: 4px;
 }
-._button_1hpt0_1:hover {
+._button_v2jgj_1:hover {
   background-image: linear-gradient(to bottom, rgba(190, 180, 171, 0.3) 0%, rgba(190, 180, 171, 0.3) 100%);
   transition-duration: 0.2s;
   cursor: pointer;
 }
-._button_1hpt0_1:focus-visible {
+._button_v2jgj_1:focus-visible {
   background-image: linear-gradient(to bottom, rgba(190, 180, 171, 0.3) 0%, rgba(190, 180, 171, 0.3) 100%);
   box-shadow: 0 0 0 4px #000;
   outline: solid 2px #fff;
 }
-._button_1hpt0_1:active {
+._button_v2jgj_1:active {
   background-image: linear-gradient(to bottom, rgba(190, 180, 171, 0.3) 0%, rgba(190, 180, 171, 0.3) 100%);
   transform: scale(0.97);
   transition-duration: 0.2s;
 }
-._disabled_1hpt0_42 {
+._disabled_v2jgj_42 {
   filter: opacity(50%);
   background-image: none;
   transform: none;
   cursor: auto;
+  pointer-events: none;
 }
-._disabled_1hpt0_42:hover {
+._disabled_v2jgj_42:hover {
   filter: opacity(50%);
   background-image: none;
   transform: none;
   cursor: auto;
 }
-._disabledPrimary_1hpt0_56 {
+._disabledPrimary_v2jgj_57 {
   opacity: 0.5;
 }
-._fullWidth_1hpt0_60 {
+._fullWidth_v2jgj_61 {
   width: 100%;
 }
-._sm_1hpt0_64 {
+._sm_v2jgj_65 {
   min-width: 52px;
   height: 32px;
   padding: 0 16px;
   border-radius: 100px;
 }
-._md_1hpt0_71 {
+._md_v2jgj_72 {
   min-width: 78px;
   height: 48px;
   padding: 0 24px;
   border-radius: 100px;
 }
-._lg_1hpt0_78 {
+._lg_v2jgj_79 {
   min-width: 104px;
   height: 64px;
   padding: 0 32px;
   border-radius: 100px;
 }
-._icon_1hpt0_85 {
+._icon_v2jgj_86 {
   color: inherit;
 }
-._smIcon_1hpt0_89 {
+._smIcon_v2jgj_90 {
   width: 16px !important;
   height: 16px !important;
 }
-._mdIcon_1hpt0_96 {
+._mdIcon_v2jgj_97 {
   width: 20px !important;
   height: 20px !important;
 }
-._lgIcon_1hpt0_103 {
+._lgIcon_v2jgj_104 {
   width: 24px !important;
   height: 24px !important;
 }
-@keyframes _syntaxButtonLoadingRotate_1hpt0_1 {
+@keyframes _syntaxButtonLoadingRotate_v2jgj_1 {
   0% {
     transform-origin: 50% 50%;
   }
@@ -2346,10 +2347,10 @@
     transform: rotate(360deg);
   }
 }
-._loading_1hpt0_120 {
-  animation: _syntaxButtonLoadingRotate_1hpt0_1 1.4s linear infinite;
+._loading_v2jgj_121 {
+  animation: _syntaxButtonLoadingRotate_v2jgj_1 1.4s linear infinite;
 }
-._loadingCircle_1hpt0_124 {
+._loadingCircle_v2jgj_125 {
   stroke: currentcolor;
   stroke-dasharray: 80px, 200px;
   stroke-dashoffset: 0;