@cambly/syntax-core 18.3.0 → 18.5.0

package/dist/__chunks/{HPCC6K5T.js → RUHTSUF3.js}

@@ -1,8 +1,9 @@
 "use client"
 import {
   ColorBaseDestructive700,
-  ColorBaseGray800
-} from "./K6B6RNZA.js";
+  ColorBaseGray700,
+  ColorCambioWhite100
+} from "./HTCVFULF.js";
 import {
   Focus_module_default
 } from "./KKADUD65.js";
@@ -65,6 +66,17 @@ function SelectList({
     white: "gray700",
     clear: "white"
   };
+  const getArrowIconColor = () => {
+    if (errorText) {
+      return ColorBaseDestructive700;
+    } else {
+      if (color === "clear") {
+        return ColorCambioWhite100;
+      } else {
+        return ColorBaseGray700;
+      }
+    }
+  };
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -112,7 +124,7 @@ function SelectList({
               children: /* @__PURE__ */ jsx(
                 "path",
                 {
-                  fill: errorText ? ColorBaseDestructive700 : ColorBaseGray800,
+                  fill: getArrowIconColor(),
                   d: "M15.88 9.29 12 13.17 8.12 9.29a.9959.9959 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41-.39-.38-1.03-.39-1.42 0z"
                 }
               )
@@ -136,4 +148,4 @@ SelectList.Option = SelectOption_default;
 export {
   SelectList
 };
-//# sourceMappingURL=HPCC6K5T.js.map
+//# sourceMappingURL=RUHTSUF3.js.map

package/dist/__chunks/RUHTSUF3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/SelectList/SelectList.tsx","css-module:./SelectList.module.css#css-module"],"sourcesContent":["import React, {\n  type ReactElement,\n  type ReactNode,\n  useId,\n  useState,\n  type ComponentProps,\n} from \"react\";\nimport Box from \"../Box/Box\";\nimport classNames from \"classnames\";\nimport {\n  ColorBaseDestructive700,\n  ColorBaseGray700,\n  ColorCambioWhite100,\n} from \"@cambly/syntax-design-tokens\";\nimport Typography from \"../Typography/Typography\";\nimport styles from \"./SelectList.module.css\";\nimport focusStyles from \"../Focus.module.css\";\nimport SelectOption from \"./SelectOption\";\nimport useFocusVisible from \"../useFocusVisible\";\nimport useIsHydrated from \"../useIsHydrated\";\n\n/**\n * [SelectList](https://cambly-syntax.vercel.app/?path=/docs/components-selectlist--docs) is a dropdown menu that allows users to select one option from a list.\n */\nexport default function SelectList({\n  children,\n  \"data-testid\": dataTestId,\n  disabled: disabledProp = false,\n  errorText,\n  helperText,\n  id,\n  label,\n  onChange,\n  onClick,\n  placeholderText,\n  selectedValue = \"\",\n  color = \"white\",\n}: {\n  /**\n   * One or more SelectList.Option components.\n   */\n  children: ReactNode;\n  /**\n   * Test id for the select element\n   */\n  \"data-testid\"?: string;\n  /**\n   * true if the select dropdown is disabled\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * Callback to be called when select is clicked\n   */\n  onClick?: (event: React.SyntheticEvent<HTMLSelectElement>) => void;\n  /**\n   * Text shown below select box if there is an input error.\n   */\n  errorText?: string;\n  /**\n   * Text shown below select box\n   */\n  helperText?: string;\n  /**\n   * Id of the select element\n   */\n  id?: string;\n  /**\n   * Text shown above select box\n   */\n  label: string;\n  /**\n   * The callback to be called when an option is selected\n   */\n  onChange: React.ChangeEventHandler<HTMLSelectElement>;\n  /**\n   * Text showing in select box if no option has been chosen.\n   * We should always have a placeholder unless there is a default option selected\n   */\n  placeholderText?: string;\n  /**\n   * Value of the currently selected option\n   */\n  selectedValue?: string;\n  /**\n   * Color of the select box\n   * @defaultValue white\n   */\n  color?: \"white\" | \"clear\";\n}): ReactElement {\n  const reactId = useId();\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const selectId = id ?? reactId;\n  const { isFocusVisible } = useFocusVisible();\n  const [isFocused, setIsFocused] = useState(false);\n\n  const handleKeyDown: React.KeyboardEventHandler<HTMLSelectElement> = (\n    event,\n  ) => {\n    if (disabled || onClick == null) return;\n    if (event.key === \"Enter\" || event.key === \" \" || event.key === \"Space\") {\n      onClick(event);\n    }\n  };\n\n  const textColor: Record<\n    NonNullable<ComponentProps<typeof SelectList>[\"color\"]>,\n    ComponentProps<typeof Typography>[\"color\"]\n  > = {\n    white: \"gray700\",\n    clear: \"white\",\n  };\n\n  const getArrowIconColor = () => {\n    if (errorText) {\n      return ColorBaseDestructive700;\n    } else {\n      if (color === \"clear\") {\n        return ColorCambioWhite100;\n      } else {\n        return ColorBaseGray700;\n      }\n    }\n  };\n\n  return (\n    <div\n      className={classNames(styles.selectContainer, {\n        [styles.opacityOverlay]: disabled,\n      })}\n    >\n      {label && (\n        <label htmlFor={selectId}>\n          <Box paddingX={1}>\n            <Typography size={100} color={textColor[color]}>\n              {label}\n            </Typography>\n          </Box>\n        </label>\n      )}\n      <div className={styles.selectWrapper}>\n        <select\n          id={selectId}\n          data-testid={dataTestId}\n          disabled={disabled}\n          className={classNames(styles.selectBox, styles.selectBoxCambio, {\n            [styles.unselected]: !selectedValue && !errorText,\n            [styles.selected]: selectedValue && !errorText,\n            [styles.selectErrorCambio]: errorText,\n            [focusStyles.accessibilityOutlineFocus]:\n              isFocused && isFocusVisible, // for focus keyboard\n            [styles.selectMouseFocusStyling]: isFocused && !isFocusVisible, // for focus mouse\n            [styles[`selectColor${color}`]]: color,\n          })}\n          onChange={onChange}\n          onClick={onClick}\n          onKeyDown={handleKeyDown}\n          value={\n            placeholderText && !selectedValue ? placeholderText : selectedValue\n          }\n          onFocus={() => setIsFocused(true)}\n          onBlur={() => setIsFocused(false)}\n        >\n          {placeholderText && (\n            <option disabled value={placeholderText}>\n              {placeholderText}\n            </option>\n          )}\n          {children}\n        </select>\n        <div className={styles.arrowIcon}>\n          <svg\n            focusable=\"false\"\n            aria-hidden=\"true\"\n            viewBox=\"0 0 24 24\"\n            width={24}\n          >\n            <path\n              fill={getArrowIconColor()}\n              d=\"M15.88 9.29 12 13.17 8.12 9.29a.9959.9959 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41-.39-.38-1.03-.39-1.42 0z\"\n            />\n          </svg>\n        </div>\n      </div>\n      {(helperText || errorText) && (\n        <Box paddingX={1}>\n          <Typography\n            size={100}\n            color={errorText ? \"destructive-primary\" : textColor[color]}\n          >\n            {errorText ? errorText : helperText}\n          </Typography>\n        </Box>\n      )}\n    </div>\n  );\n}\n\nSelectList.Option = SelectOption;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/SelectList/SelectList.module.css\"; export default {\"selectContainer\":\"_selectContainer_1g9ap_1\",\"opacityOverlay\":\"_opacityOverlay_1g9ap_7\",\"selectWrapper\":\"_selectWrapper_1g9ap_11\",\"selectBox\":\"_selectBox_1g9ap_16\",\"selectBoxCambio\":\"_selectBoxCambio_1g9ap_30\",\"selectMouseFocusStyling\":\"_selectMouseFocusStyling_1g9ap_38\",\"unselected\":\"_unselected_1g9ap_43\",\"selected\":\"_selected_1g9ap_47\",\"arrowIcon\":\"_arrowIcon_1g9ap_51\",\"selectErrorCambio\":\"_selectErrorCambio_1g9ap_65\",\"selectColorwhite\":\"_selectColorwhite_1g9ap_71\",\"selectColorclear\":\"_selectColorclear_1g9ap_77\"}"],"mappings":"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","names":[]}

package/dist/__chunks/{42LZ6YP3.js → SNLD3DG6.js}

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

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

@@ -8,7 +8,7 @@ var _3P2PWHOUcjs = require('./3P2PWHOU.cjs');
 
 
 
-var _EGB44W5Vcjs = require('./EGB44W5V.cjs');
+var _7TEFD526cjs = require('./7TEFD526.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_17niw_1", "buttonGap": "_buttonGap_17niw_8", "disabled": "_disabled_17niw_42", "disabledPrimary": "_disabledPrimary_17niw_49", "fullWidth": "_fullWidth_17niw_53", "sm": "_sm_17niw_57", "md": "_md_17niw_64", "lg": "_lg_17niw_71", "icon": "_icon_17niw_78", "smIcon": "_smIcon_17niw_82", "mdIcon": "_mdIcon_17niw_89", "lgIcon": "_lgIcon_17niw_96", "loading": "_loading_17niw_113", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_17niw_1", "loadingCircle": "_loadingCircle_17niw_117" };
+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" };
 
 // 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,
-                _EGB44W5Vcjs.materialIconSize[size],
+                _7TEFD526cjs.materialIconSize[size],
                 disabledPrimary && Button_module_default.disabledPrimary
               ),
-              size: _EGB44W5Vcjs.internalIconSize[size]
+              size: _7TEFD526cjs.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,
-                _EGB44W5Vcjs.materialIconSize[size],
+                _7TEFD526cjs.materialIconSize[size],
                 disabledPrimary && Button_module_default.disabledPrimary
               ),
-              size: _EGB44W5Vcjs.internalIconSize[size]
+              size: _7TEFD526cjs.internalIconSize[size]
             }
           ),
           loading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -146,4 +146,4 @@ var Button_default = Button;
 
 
 exports.Button_default = Button_default;
-//# sourceMappingURL=K4QY6POL.cjs.map
+//# sourceMappingURL=TSMYMWWE.cjs.map

package/dist/__chunks/{K4QY6POL.cjs.map → TSMYMWWE.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,oBAAmB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;AD4IpkB,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_17niw_1\",\"buttonGap\":\"_buttonGap_17niw_8\",\"disabled\":\"_disabled_17niw_42\",\"disabledPrimary\":\"_disabledPrimary_17niw_49\",\"fullWidth\":\"_fullWidth_17niw_53\",\"sm\":\"_sm_17niw_57\",\"md\":\"_md_17niw_64\",\"lg\":\"_lg_17niw_71\",\"icon\":\"_icon_17niw_78\",\"smIcon\":\"_smIcon_17niw_82\",\"mdIcon\":\"_mdIcon_17niw_89\",\"lgIcon\":\"_lgIcon_17niw_96\",\"loading\":\"_loading_17niw_113\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_17niw_1\",\"loadingCircle\":\"_loadingCircle_17niw_117\"}"]}
+{"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\"}"]}

package/dist/__chunks/{ASKKVHEA.js → TU2BVOKD.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   Button_default
-} from "./GN5VNYV3.js";
+} from "./BTBAAACD.js";
 import {
   Divider
 } from "./YAZOHZLW.js";
@@ -208,4 +208,4 @@ export {
   RichSelectBoxContext,
   RichSelectBox_default
 };
-//# sourceMappingURL=ASKKVHEA.js.map
+//# sourceMappingURL=TU2BVOKD.js.map

package/dist/__chunks/{NTIK3YXD.js → UYQTZSTJ.js}

@@ -1,19 +1,19 @@
 "use client"
 import {
   Popover_default
-} from "./42LZ6YP3.js";
+} from "./SNLD3DG6.js";
 import {
   DialogContext
 } from "./5HEC7ASW.js";
 import {
   ColorBaseDestructive700,
   ColorBaseGray800
-} from "./K6B6RNZA.js";
+} from "./HTCVFULF.js";
 import {
   RichSelectBoxContext,
   RichSelectBox_default,
   convertSelection
-} from "./ASKKVHEA.js";
+} from "./TU2BVOKD.js";
 import {
   RichSelectSection_default
 } from "./YPUA2AJT.js";
@@ -267,4 +267,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 export {
   RichSelectList_default
 };
-//# sourceMappingURL=NTIK3YXD.js.map
+//# sourceMappingURL=UYQTZSTJ.js.map

package/dist/__chunks/{DOYGRWJR.cjs → YJAKY2I2.cjs}

@@ -2,7 +2,7 @@
 
 
 
-var _EGB44W5Vcjs = require('./EGB44W5V.cjs');
+var _7TEFD526cjs = require('./7TEFD526.cjs');
 
 
 var _LZYX5BWDcjs = require('./LZYX5BWD.cjs');
@@ -60,8 +60,8 @@ var IconButton = _react.forwardRef.call(void 0,
         children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           Icon,
           {
-            className: _EGB44W5Vcjs.materialIconSize[size],
-            size: _EGB44W5Vcjs.internalIconSize[size]
+            className: _7TEFD526cjs.materialIconSize[size],
+            size: _7TEFD526cjs.internalIconSize[size]
           }
         )
       }
@@ -74,4 +74,4 @@ var IconButton_default = IconButton;
 
 
 exports.IconButton_default = IconButton_default;
-//# sourceMappingURL=DOYGRWJR.cjs.map
+//# sourceMappingURL=YJAKY2I2.cjs.map

package/dist/index.cjs

@@ -16,7 +16,7 @@ var _C3FW5QDGcjs = require('./__chunks/C3FW5QDG.cjs');
 var _L32D5WEGcjs = require('./__chunks/L32D5WEG.cjs');
 
 
-var _YRFKC6UHcjs = require('./__chunks/YRFKC6UH.cjs');
+var _IYYTLOO3cjs = require('./__chunks/IYYTLOO3.cjs');
 
 
 var _Q4P2W7UUcjs = require('./__chunks/Q4P2W7UU.cjs');
@@ -25,29 +25,29 @@ require('./__chunks/G3SXARBL.cjs');
 require('./__chunks/THM3NAFO.cjs');
 
 
-var _6JEGAMYWcjs = require('./__chunks/6JEGAMYW.cjs');
+var _BZ546NNEcjs = require('./__chunks/BZ546NNE.cjs');
 
 
 var _L5RBAKANcjs = require('./__chunks/L5RBAKAN.cjs');
 
 
-var _XDQTI6T5cjs = require('./__chunks/XDQTI6T5.cjs');
+var _IUSNCMKAcjs = require('./__chunks/IUSNCMKA.cjs');
 
 
-var _DX4XKSULcjs = require('./__chunks/DX4XKSUL.cjs');
+var _O2K6UM3Zcjs = require('./__chunks/O2K6UM3Z.cjs');
 
 
-var _325VK7L2cjs = require('./__chunks/325VK7L2.cjs');
-require('./__chunks/KXPCTYHD.cjs');
+var _C4GAUB4Ycjs = require('./__chunks/C4GAUB4Y.cjs');
+require('./__chunks/RCCK2EW4.cjs');
 require('./__chunks/J27AGJQB.cjs');
 
 
-var _DOYGRWJRcjs = require('./__chunks/DOYGRWJR.cjs');
-require('./__chunks/7ZSZT5AE.cjs');
-require('./__chunks/IBNQI7PM.cjs');
+var _YJAKY2I2cjs = require('./__chunks/YJAKY2I2.cjs');
+require('./__chunks/L67MBZZR.cjs');
+require('./__chunks/LIUV3J2M.cjs');
 
 
-var _K4QY6POLcjs = require('./__chunks/K4QY6POL.cjs');
+var _TSMYMWWEcjs = require('./__chunks/TSMYMWWE.cjs');
 
 
 var _42SRFCQLcjs = require('./__chunks/42SRFCQL.cjs');
@@ -56,7 +56,7 @@ var _42SRFCQLcjs = require('./__chunks/42SRFCQL.cjs');
 var _C5XPZTFOcjs = require('./__chunks/C5XPZTFO.cjs');
 require('./__chunks/5JUNB754.cjs');
 require('./__chunks/3P2PWHOU.cjs');
-require('./__chunks/EGB44W5V.cjs');
+require('./__chunks/7TEFD526.cjs');
 require('./__chunks/I76WKOLE.cjs');
 require('./__chunks/MF7LLV7V.cjs');
 require('./__chunks/XTZEWLM5.cjs');
@@ -145,5 +145,5 @@ 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 = _K4QY6POLcjs.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 = _DOYGRWJRcjs.IconButton_default; exports.LinkButton = _6JEGAMYWcjs.LinkButton_default; exports.Modal = _YRFKC6UHcjs.Modal; exports.Popover = _325VK7L2cjs.Popover_default; exports.RadioButton = _EF6R3LRBcjs.RadioButton_default; exports.RichSelectList = _DX4XKSULcjs.RichSelectList_default; exports.SelectList = _XDQTI6T5cjs.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 = _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 = _O2K6UM3Zcjs.RichSelectList_default; exports.SelectList = _IUSNCMKAcjs.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,76 +2263,82 @@
 }
 
 /* css-module:/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css/#css-module-data */
-._button_17niw_1 {
+._button_1hpt0_1 {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
 }
-._buttonGap_17niw_8 {
+._buttonGap_1hpt0_8 {
   gap: 4px;
 }
-._button_17niw_1:hover {
+._button_1hpt0_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_17niw_1:focus-visible {
+._button_1hpt0_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_17niw_1:active {
+._button_1hpt0_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_17niw_42 {
+._disabled_1hpt0_42 {
   filter: opacity(50%);
   background-image: none;
   transform: none;
   cursor: auto;
 }
-._disabledPrimary_17niw_49 {
+._disabled_1hpt0_42:hover {
+  filter: opacity(50%);
+  background-image: none;
+  transform: none;
+  cursor: auto;
+}
+._disabledPrimary_1hpt0_56 {
   opacity: 0.5;
 }
-._fullWidth_17niw_53 {
+._fullWidth_1hpt0_60 {
   width: 100%;
 }
-._sm_17niw_57 {
+._sm_1hpt0_64 {
   min-width: 52px;
   height: 32px;
   padding: 0 16px;
   border-radius: 100px;
 }
-._md_17niw_64 {
+._md_1hpt0_71 {
   min-width: 78px;
   height: 48px;
   padding: 0 24px;
   border-radius: 100px;
 }
-._lg_17niw_71 {
+._lg_1hpt0_78 {
   min-width: 104px;
   height: 64px;
   padding: 0 32px;
   border-radius: 100px;
 }
-._icon_17niw_78 {
+._icon_1hpt0_85 {
   color: inherit;
 }
-._smIcon_17niw_82 {
+._smIcon_1hpt0_89 {
   width: 16px !important;
   height: 16px !important;
 }
-._mdIcon_17niw_89 {
+._mdIcon_1hpt0_96 {
   width: 20px !important;
   height: 20px !important;
 }
-._lgIcon_17niw_96 {
+._lgIcon_1hpt0_103 {
   width: 24px !important;
   height: 24px !important;
 }
-@keyframes _syntaxButtonLoadingRotate_17niw_1 {
+@keyframes _syntaxButtonLoadingRotate_1hpt0_1 {
   0% {
     transform-origin: 50% 50%;
   }
@@ -2340,10 +2346,10 @@
     transform: rotate(360deg);
   }
 }
-._loading_17niw_113 {
-  animation: _syntaxButtonLoadingRotate_17niw_1 1.4s linear infinite;
+._loading_1hpt0_120 {
+  animation: _syntaxButtonLoadingRotate_1hpt0_1 1.4s linear infinite;
 }
-._loadingCircle_17niw_117 {
+._loadingCircle_1hpt0_124 {
   stroke: currentcolor;
   stroke-dasharray: 80px, 200px;
   stroke-dashoffset: 0;