@cambly/syntax-core 10.2.0 → 10.2.2

package/dist/__chunks/{5R6HCJP6.mjs → N3EZP6VG.cjs}

@@ -1,28 +1,28 @@
-import {
-  useIsHydrated
-} from "./XFKGXL73.mjs";
-import {
-  foregroundColor
-} from "./Q2TIB7ZC.mjs";
-import {
-  backgroundColor
-} from "./R6CDK4GP.mjs";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _FZRIE7EXcjs = require('./FZRIE7EX.cjs');
+
+
+var _PQIPUPQ2cjs = require('./PQIPUPQ2.cjs');
+
+
+var _4ICD552Dcjs = require('./4ICD552D.cjs');
 
 // src/IconButton/IconButton.tsx
-import classNames from "classnames";
-import { forwardRef } from "react";
+var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+var _react = require('react');
 
 // css-module:./IconButton.module.css#css-module
 var IconButton_module_default = { "iconButton": "_iconButton_4e8qe_1", "sm": "_sm_4e8qe_46", "md": "_md_4e8qe_51", "lg": "_lg_4e8qe_56", "smIcon": "_smIcon_4e8qe_61", "mdIcon": "_mdIcon_4e8qe_68", "lgIcon": "_lgIcon_4e8qe_75", "secondaryBorder": "_secondaryBorder_4e8qe_82", "secondaryDestructiveBorder": "_secondaryDestructiveBorder_4e8qe_86" };
 
 // src/IconButton/IconButton.tsx
-import { jsx } from "react/jsx-runtime";
+var _jsxruntime = require('react/jsx-runtime');
 var iconSize = {
   ["sm"]: IconButton_module_default.smIcon,
   ["md"]: IconButton_module_default.mdIcon,
   ["lg"]: IconButton_module_default.lgIcon
 };
-var IconButton = forwardRef(
+var IconButton = _react.forwardRef.call(void 0, 
   ({
     accessibilityLabel,
     color = "primary",
@@ -33,8 +33,8 @@ var IconButton = forwardRef(
     tooltip,
     onClick
   }, ref) => {
-    const isHydrated = useIsHydrated();
-    return /* @__PURE__ */ jsx(
+    const isHydrated = _FZRIE7EXcjs.useIsHydrated.call(void 0, );
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       "button",
       {
         "aria-label": accessibilityLabel,
@@ -43,10 +43,10 @@ var IconButton = forwardRef(
         title: tooltip,
         disabled: !isHydrated || disabled,
         onClick,
-        className: classNames(
+        className: _classnames2.default.call(void 0, 
           IconButton_module_default.iconButton,
-          foregroundColor(color),
-          backgroundColor(color),
+          _PQIPUPQ2cjs.foregroundColor.call(void 0, color),
+          _4ICD552Dcjs.backgroundColor.call(void 0, color),
           IconButton_module_default[size],
           {
             [IconButton_module_default.secondaryBorder]: color === "secondary",
@@ -54,7 +54,7 @@ var IconButton = forwardRef(
           }
         ),
         ref,
-        children: /* @__PURE__ */ jsx(Icon, { className: iconSize[size] })
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: iconSize[size] })
       }
     );
   }
@@ -62,7 +62,7 @@ var IconButton = forwardRef(
 IconButton.displayName = "IconButton";
 var IconButton_default = IconButton;
 
-export {
-  IconButton_default
-};
-//# sourceMappingURL=5R6HCJP6.mjs.map
+
+
+exports.IconButton_default = IconButton_default;
+//# sourceMappingURL=N3EZP6VG.cjs.map

package/dist/__chunks/N3EZP6VG.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/IconButton/IconButton.tsx","css-module:./IconButton.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,gBAAgB;AAGvB,SAAgB,kBAAkB;;;ACHkE,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,6BAA4B,8BAA6B,uCAAsC;;;ADmGhZ;AA3FR,IAAM,WAAW;AAAA,EACf,CAAC,IAAI,GAAG,0BAAO;AAAA,EACf,CAAC,IAAI,GAAG,0BAAO;AAAA,EACf,CAAC,IAAI,GAAG,0BAAO;AACjB;AAkDA,IAAM,aAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,WAAW;AAAA,IACX,MAAM;AAAA,IACN,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,UAAM,aAAa,cAAc;AAEjC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY;AAAA,QACZ,eAAa;AAAA,QACb,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,cAAc;AAAA,QACzB;AAAA,QACA,WAAW;AAAA,UACT,0BAAO;AAAA,UACP,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,0BAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,0BAAO,eAAe,GAAG,UAAU;AAAA,YACpC,CAAC,0BAAO,0BAA0B,GAChC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QACA;AAAA,QAEA,8BAAC,QAAK,WAAW,SAAS,IAAI,GAAG;AAAA;AAAA,IACnC;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ","sourcesContent":["import classNames from \"classnames\";\nimport backgroundColor from \"../colors//backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport React, { forwardRef } from \"react\";\nimport { type Color, type Size } from \"../constants\";\nimport styles from \"./IconButton.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\n\nconst iconSize = {\n  [\"sm\"]: styles.smIcon,\n  [\"md\"]: styles.mdIcon,\n  [\"lg\"]: styles.lgIcon,\n};\n\ntype IconButtonProps = {\n  /**\n   * The color of the button\n   *\n   * @defaultValue \"primary\"\n   */\n  color?: (typeof Color)[number];\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 40px\n   * * `lg`: 48px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: (typeof Size)[number];\n  /**\n   * The label to be used for accessibility\n   */\n  accessibilityLabel: string;\n  /**\n   * The icon to be displayed. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  icon: React.ComponentType<{ className?: string }>;\n  /**\n   * If `true`, the button will be disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\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\n/**\n * [IconButton](https://cambly-syntax.vercel.app/?path=/docs/components-iconbutton--docs) is a clickable element that is used to perform an action.\n */\nconst IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n  (\n    {\n      accessibilityLabel,\n      color = \"primary\",\n      \"data-testid\": dataTestId,\n      disabled = false,\n      icon: Icon,\n      size = \"md\",\n      tooltip,\n      onClick,\n    }: IconButtonProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n\n    return (\n      <button\n        aria-label={accessibilityLabel}\n        data-testid={dataTestId}\n        type=\"button\"\n        title={tooltip}\n        disabled={!isHydrated || disabled}\n        onClick={onClick}\n        className={classNames(\n          styles.iconButton,\n          foregroundColor(color),\n          backgroundColor(color),\n          styles[size],\n          {\n            [styles.secondaryBorder]: color === \"secondary\",\n            [styles.secondaryDestructiveBorder]:\n              color === \"destructive-secondary\",\n          },\n        )}\n        ref={ref}\n      >\n        <Icon className={iconSize[size]} />\n      </button>\n    );\n  },\n);\n\nIconButton.displayName = \"IconButton\";\n\nexport default IconButton;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/IconButton/IconButton.module.css\"; export default {\"iconButton\":\"_iconButton_4e8qe_1\",\"sm\":\"_sm_4e8qe_46\",\"md\":\"_md_4e8qe_51\",\"lg\":\"_lg_4e8qe_56\",\"smIcon\":\"_smIcon_4e8qe_61\",\"mdIcon\":\"_mdIcon_4e8qe_68\",\"lgIcon\":\"_lgIcon_4e8qe_75\",\"secondaryBorder\":\"_secondaryBorder_4e8qe_82\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_4e8qe_86\"}"]}

package/dist/__chunks/{JSEHOGL7.mjs → NGUJFGAC.cjs}

@@ -1,7 +1,7 @@
-// css-module:./colors.module.css#css-module
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// css-module:../colors/colors.module.css#css-module
 var colors_module_default = { "inheritColor": "_inheritColor_11l4y_2", "destructive700Color": "_destructive700Color_11l4y_6", "gray700Color": "_gray700Color_11l4y_10", "gray900Color": "_gray900Color_11l4y_14", "primary700Color": "_primary700Color_11l4y_18", "success700Color": "_success700Color_11l4y_22", "whiteColor": "_whiteColor_11l4y_26", "blackBackgroundColor": "_blackBackgroundColor_11l4y_31", "destructive100BackgroundColor": "_destructive100BackgroundColor_11l4y_35", "destructive200BackgroundColor": "_destructive200BackgroundColor_11l4y_39", "destructive300BackgroundColor": "_destructive300BackgroundColor_11l4y_43", "destructive700BackgroundColor": "_destructive700BackgroundColor_11l4y_47", "destructive800BackgroundColor": "_destructive800BackgroundColor_11l4y_51", "destructive900BackgroundColor": "_destructive900BackgroundColor_11l4y_55", "gray10BackgroundColor": "_gray10BackgroundColor_11l4y_59", "gray30BackgroundColor": "_gray30BackgroundColor_11l4y_63", "gray60BackgroundColor": "_gray60BackgroundColor_11l4y_67", "gray80BackgroundColor": "_gray80BackgroundColor_11l4y_71", "gray100BackgroundColor": "_gray100BackgroundColor_11l4y_75", "gray200BackgroundColor": "_gray200BackgroundColor_11l4y_79", "gray300BackgroundColor": "_gray300BackgroundColor_11l4y_83", "gray700BackgroundColor": "_gray700BackgroundColor_11l4y_87", "gray800BackgroundColor": "_gray800BackgroundColor_11l4y_91", "gray900BackgroundColor": "_gray900BackgroundColor_11l4y_95", "orange100BackgroundColor": "_orange100BackgroundColor_11l4y_99", "orange200BackgroundColor": "_orange200BackgroundColor_11l4y_103", "orange300BackgroundColor": "_orange300BackgroundColor_11l4y_107", "orange700BackgroundColor": "_orange700BackgroundColor_11l4y_111", "orange800BackgroundColor": "_orange800BackgroundColor_11l4y_115", "orange900BackgroundColor": "_orange900BackgroundColor_11l4y_119", "primary100BackgroundColor": "_primary100BackgroundColor_11l4y_123", "primary200BackgroundColor": "_primary200BackgroundColor_11l4y_127", "primary300BackgroundColor": "_primary300BackgroundColor_11l4y_131", "primary700BackgroundColor": "_primary700BackgroundColor_11l4y_135", "primary800BackgroundColor": "_primary800BackgroundColor_11l4y_139", "primary900BackgroundColor": "_primary900BackgroundColor_11l4y_143", "success100BackgroundColor": "_success100BackgroundColor_11l4y_147", "success200BackgroundColor": "_success200BackgroundColor_11l4y_151", "success300BackgroundColor": "_success300BackgroundColor_11l4y_155", "success700BackgroundColor": "_success700BackgroundColor_11l4y_159", "success800BackgroundColor": "_success800BackgroundColor_11l4y_163", "success900BackgroundColor": "_success900BackgroundColor_11l4y_167", "purple100BackgroundColor": "_purple100BackgroundColor_11l4y_171", "purple200BackgroundColor": "_purple200BackgroundColor_11l4y_175", "purple300BackgroundColor": "_purple300BackgroundColor_11l4y_179", "purple700BackgroundColor": "_purple700BackgroundColor_11l4y_183", "purple800BackgroundColor": "_purple800BackgroundColor_11l4y_187", "purple900BackgroundColor": "_purple900BackgroundColor_11l4y_191", "whiteBackgroundColor": "_whiteBackgroundColor_11l4y_195", "yellow100BackgroundColor": "_yellow100BackgroundColor_11l4y_199", "yellow200BackgroundColor": "_yellow200BackgroundColor_11l4y_203", "yellow300BackgroundColor": "_yellow300BackgroundColor_11l4y_207", "yellow700BackgroundColor": "_yellow700BackgroundColor_11l4y_211", "yellow800BackgroundColor": "_yellow800BackgroundColor_11l4y_215", "yellow900BackgroundColor": "_yellow900BackgroundColor_11l4y_219" };
 
-export {
-  colors_module_default
-};
-//# sourceMappingURL=JSEHOGL7.mjs.map
+
+
+exports.colors_module_default = colors_module_default;
+//# sourceMappingURL=NGUJFGAC.cjs.map

package/dist/__chunks/NGUJFGAC.cjs.map

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

package/dist/__chunks/NHSTGALH.cjs

@@ -0,0 +1,110 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _3F5U7W73cjs = require('./3F5U7W73.cjs');
+
+
+var _SJFWRAOPcjs = require('./SJFWRAOP.cjs');
+
+
+var _CEWOAFV2cjs = require('./CEWOAFV2.cjs');
+
+
+var _CY6YL5T4cjs = require('./CY6YL5T4.cjs');
+
+
+var _PBWG2BB5cjs = require('./PBWG2BB5.cjs');
+
+// src/Modal/Modal.tsx
+var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+
+// css-module:./Modal.module.css#css-module
+var Modal_module_default = { "backdrop": "_backdrop_30t3h_1", "closeButton": "_closeButton_30t3h_12", "closeButtonWithImage": "_closeButtonWithImage_30t3h_32" };
+
+// src/Modal/Modal.tsx
+var _jsxruntime = require('react/jsx-runtime');
+function XIcon({ color = "#000" }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", fill: color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "path",
+    {
+      fill: "inherit",
+      d: "M11.25.758a.83.83 0 0 0-1.175 0L6 4.825 1.925.75A.83.83 0 1 0 .75 1.925L4.825 6 .75 10.075a.83.83 0 1 0 1.175 1.175L6 7.175l4.075 4.075a.83.83 0 1 0 1.175-1.175L7.175 6l4.075-4.075a.835.835 0 0 0 0-1.167Z"
+    }
+  ) });
+}
+var sizeWidth = {
+  sm: 400,
+  lg: 600
+};
+function Modal({
+  header,
+  children,
+  image,
+  onDismiss,
+  footer,
+  accessibilityCloseLabel = "close modal",
+  size = "sm",
+  zIndex = 1,
+  "data-testid": dataTestId
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _3F5U7W73cjs.Layer, { zIndex, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _PBWG2BB5cjs.StopScroll, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _SJFWRAOPcjs.FocusTrap, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "div",
+    {
+      className: Modal_module_default.backdrop,
+      role: "presentation",
+      onClick: (e) => e.target === e.currentTarget && onDismiss(),
+      onKeyDown: (e) => e.key === "Escape" && onDismiss(),
+      children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        _CY6YL5T4cjs.Box_default,
+        {
+          "data-testid": dataTestId,
+          backgroundColor: "white",
+          rounding: "xl",
+          display: "flex",
+          direction: "column",
+          minWidth: 240,
+          maxWidth: sizeWidth[size],
+          width: "100%",
+          dangerouslySetInlineStyle: { __style: { overflow: "hidden" } },
+          children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CY6YL5T4cjs.Box_default, { position: "relative", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "button",
+              {
+                "aria-label": accessibilityCloseLabel,
+                type: "button",
+                className: _classnames2.default.call(void 0, Modal_module_default.closeButton, {
+                  [Modal_module_default.closeButtonWithImage]: !!image
+                }),
+                onClick: onDismiss,
+                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, XIcon, { color: image ? "#fff" : "#000" })
+              }
+            ) }),
+            image && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CY6YL5T4cjs.Box_default, { maxHeight: 200, children: image }),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _CY6YL5T4cjs.Box_default, { display: "flex", gap: 3, direction: "column", padding: 9, children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CEWOAFV2cjs.Heading_default, { as: "h1", size: 500, children: header }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CY6YL5T4cjs.Box_default, { marginBottom: 4, children }),
+              footer && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _CY6YL5T4cjs.Box_default,
+                {
+                  display: "flex",
+                  direction: "column",
+                  gap: 3,
+                  smDirection: "row",
+                  smJustifyContent: "end",
+                  lgDirection: "row",
+                  lgJustifyContent: "end",
+                  children: footer
+                }
+              )
+            ] })
+          ]
+        }
+      )
+    }
+  ) }) }) });
+}
+Modal.displayName = "Modal";
+
+
+
+exports.Modal = Modal;
+//# sourceMappingURL=NHSTGALH.cjs.map

package/dist/__chunks/NHSTGALH.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Modal/Modal.tsx","css-module:./Modal.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AACA,OAAO,gBAAgB;;;ACDmE,IAAO,uBAAQ,EAAC,YAAW,qBAAoB,eAAc,yBAAwB,wBAAuB,iCAAgC;;;ADchO,cAiKQ,YAjKR;AAHN,SAAS,MAAM,EAAE,QAAQ,OAAO,GAAuB;AACrD,SACE,oBAAC,SAAI,OAAM,8BAA6B,OAAM,MAAK,QAAO,MAAK,MAAM,OACnE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,GAAE;AAAA;AAAA,EACJ,GACF;AAEJ;AAIA,IAAM,YAAY;AAAA,EAChB,IAAI;AAAA,EACJ,IAAI;AACN;AAmCe,SAAR,MAAuB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,0BAA0B;AAAA,EAC1B,OAAO;AAAA,EACP,SAAS;AAAA,EACT,eAAe;AACjB,GAoEiB;AACf,SACE,oBAAC,SAAM,QACL,8BAAC,cACC,8BAAC,aACC;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,qBAAO;AAAA,MAClB,MAAK;AAAA,MACL,SAAS,CAAC,MAAM,EAAE,WAAW,EAAE,iBAAiB,UAAU;AAAA,MAC1D,WAAW,CAAC,MAAM,EAAE,QAAQ,YAAY,UAAU;AAAA,MAElD;AAAA,QAAC;AAAA;AAAA,UACC,eAAa;AAAA,UACb,iBAAgB;AAAA,UAChB,UAAS;AAAA,UACT,SAAQ;AAAA,UACR,WAAU;AAAA,UACV,UAAU;AAAA,UACV,UAAU,UAAU,IAAI;AAAA,UACxB,OAAM;AAAA,UACN,2BAA2B,EAAE,SAAS,EAAE,UAAU,SAAS,EAAE;AAAA,UAE7D;AAAA,gCAAC,eAAI,UAAS,YACZ;AAAA,cAAC;AAAA;AAAA,gBACC,cAAY;AAAA,gBACZ,MAAK;AAAA,gBACL,WAAW,WAAW,qBAAO,aAAa;AAAA,kBACxC,CAAC,qBAAO,oBAAoB,GAAG,CAAC,CAAC;AAAA,gBACnC,CAAC;AAAA,gBACD,SAAS;AAAA,gBAET,8BAAC,SAAM,OAAO,QAAQ,SAAS,QAAQ;AAAA;AAAA,YACzC,GACF;AAAA,YACC,SAAS,oBAAC,eAAI,WAAW,KAAM,iBAAM;AAAA,YACtC,qBAAC,eAAI,SAAQ,QAAO,KAAK,GAAG,WAAU,UAAS,SAAS,GACtD;AAAA,kCAAC,mBAAQ,IAAG,MAAK,MAAM,KACpB,kBACH;AAAA,cACA,oBAAC,eAAI,cAAc,GAAI,UAAS;AAAA,cAC/B,UACC;AAAA,gBAAC;AAAA;AAAA,kBACC,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,KAAK;AAAA,kBACL,aAAY;AAAA,kBACZ,kBAAiB;AAAA,kBACjB,aAAY;AAAA,kBACZ,kBAAiB;AAAA,kBAEhB;AAAA;AAAA,cACH;AAAA,eAEJ;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF,GACF,GACF,GACF;AAEJ;AAEA,MAAM,cAAc","sourcesContent":["import { type ReactElement } from \"react\";\nimport classnames from \"classnames\";\n\nimport Heading from \"../Heading/Heading\";\nimport Box from \"../Box/Box\";\n\nimport FocusTrap from \"./FocusTrap\";\nimport StopScroll from \"./StopScroll\";\nimport Layer from \"./Layer\";\nimport styles from \"./Modal.module.css\";\n\nfunction XIcon({ color = \"#000\" }: { color?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" fill={color}>\n      <path\n        fill=\"inherit\"\n        d=\"M11.25.758a.83.83 0 0 0-1.175 0L6 4.825 1.925.75A.83.83 0 1 0 .75 1.925L4.825 6 .75 10.075a.83.83 0 1 0 1.175 1.175L6 7.175l4.075 4.075a.83.83 0 1 0 1.175-1.175L7.175 6l4.075-4.075a.835.835 0 0 0 0-1.167Z\"\n      />\n    </svg>\n  );\n}\n\n// Note: Only sm + lg size currently. design thinks there should only be two sizes.\n// If there IS a md size at some point, we should use the \"size\" const.\nconst sizeWidth = {\n  sm: 400,\n  lg: 600,\n} as const;\n\n/**\n * [Modal](https://cambly-syntax.vercel.app/?path=/docs/components-modal--docs) is a dialog that appears on top of the main content and locks user interaction within the modal.\n *\n ```\n  const [showModal, setShowModal] = useState(false)\n\n  return (\n    <>\n      {showModal && <Modal\n        header=\"header text\"\n        onDismiss={() => setShowModal(false)}\n        footer={\n          <>\n            <Button\n              text=\"Cancel\"\n              color=\"secondary\"\n              onClick={() => {}}\n            />\n            <Button\n              text=\"Confirm\"\n              onClick={() => {}}\n            />\n          </>\n        }\n      >\n        <Typography>\n          Body text goes here!\n        </Typography>\n      </Modal> }\n    </>\n  )\n  ```\n */\nexport default function Modal({\n  header,\n  children,\n  image,\n  onDismiss,\n  footer,\n  accessibilityCloseLabel = \"close modal\",\n  size = \"sm\",\n  zIndex = 1,\n  \"data-testid\": dataTestId,\n}: {\n  /**\n   * The modal's main content. Should typically take in `Typography`'d text.\n   */\n  children: JSX.Element;\n  /**\n   * The header inside a modal as a string.\n   */\n  header: string;\n  /**\n   * What the X button (or clicking out of the modal area) does.\n   * Typically used for closing the Modal\n   */\n  onDismiss: () => void;\n  /**\n   * The optional image rendered above the Modal.\n   * Image size should be 400w x 200h.\n   * If images aren't that sized, should ask design to give another image.\n   */\n  image?: JSX.Element;\n  /**\n   * The footer for the bottom area of the Modal. Typically used for rendering buttons.\n   * * Use Syntax `Button` and pass it into footer.\n   * * If one button, just pass it in. If two, wrap in a React fragment (`<> </>`)\n   * * If two(2) buttons, put primary button _second_.\n   *\n      <>\n        <Button\n          text=\"Cancel\"\n          color=\"secondary\"\n          onClick={() => {}}\n        />\n        <Button\n          text=\"Confirm\"\n          onClick={() => {}}\n        />\n      </>\n   */\n  footer?: JSX.Element;\n  /**\n   * The accessibilty text on the close button.\n   * (Sets the aria-label of the button)\n   *\n   *\n   * @defaultValue close modal\n   */\n  accessibilityCloseLabel?: string;\n  /**\n   * The size of the card\n   *\n   * * `sm`: 400px\n   * * `lg`: 600px\n   *\n   *\n   * @defaultValue sm\n   */\n  size?: keyof typeof sizeWidth;\n  /**\n   * The z-index for the modal.\n   * Typically used if there are other things on the page with higher z-index and you need this overlayed on top.\n   *\n   * @defaultValue 0\n   */\n  zIndex?: number;\n  /**\n   * Test id for the modal\n   */\n  \"data-testid\"?: string;\n}): ReactElement {\n  return (\n    <Layer zIndex={zIndex}>\n      <StopScroll>\n        <FocusTrap>\n          <div\n            className={styles.backdrop}\n            role=\"presentation\"\n            onClick={(e) => e.target === e.currentTarget && onDismiss()}\n            onKeyDown={(e) => e.key === \"Escape\" && onDismiss()}\n          >\n            <Box\n              data-testid={dataTestId}\n              backgroundColor=\"white\"\n              rounding=\"xl\"\n              display=\"flex\"\n              direction=\"column\"\n              minWidth={240}\n              maxWidth={sizeWidth[size]}\n              width=\"100%\"\n              dangerouslySetInlineStyle={{ __style: { overflow: \"hidden\" } }}\n            >\n              <Box position=\"relative\">\n                <button\n                  aria-label={accessibilityCloseLabel}\n                  type=\"button\"\n                  className={classnames(styles.closeButton, {\n                    [styles.closeButtonWithImage]: !!image,\n                  })}\n                  onClick={onDismiss}\n                >\n                  <XIcon color={image ? \"#fff\" : \"#000\"} />\n                </button>\n              </Box>\n              {image && <Box maxHeight={200}>{image}</Box>}\n              <Box display=\"flex\" gap={3} direction=\"column\" padding={9}>\n                <Heading as=\"h1\" size={500}>\n                  {header}\n                </Heading>\n                <Box marginBottom={4}>{children}</Box>\n                {footer && (\n                  <Box\n                    display=\"flex\"\n                    direction=\"column\"\n                    gap={3}\n                    smDirection=\"row\"\n                    smJustifyContent=\"end\"\n                    lgDirection=\"row\"\n                    lgJustifyContent=\"end\"\n                  >\n                    {footer}\n                  </Box>\n                )}\n              </Box>\n            </Box>\n          </div>\n        </FocusTrap>\n      </StopScroll>\n    </Layer>\n  );\n}\n\nModal.displayName = \"Modal\";\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Modal/Modal.module.css\"; export default {\"backdrop\":\"_backdrop_30t3h_1\",\"closeButton\":\"_closeButton_30t3h_12\",\"closeButtonWithImage\":\"_closeButtonWithImage_30t3h_32\"}"]}

package/dist/__chunks/OGJDUOWP.js

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/useFocusVisible.tsx
-var _react = require('react');
+// src/useFocusVisible.tsx
+import { useState, useEffect } from "react";
 var hasSetupGlobalListeners = false;
 var currentModality = null;
 var changeHandlers = /* @__PURE__ */ new Set();
@@ -75,8 +75,8 @@ function setupGlobalFocusEvents() {
 }
 function useFocusVisible() {
   setupGlobalFocusEvents();
-  const [isFocusVisibleState, setFocusVisible] = _react.useState.call(void 0, isFocusVisible());
-  _react.useEffect.call(void 0, () => {
+  const [isFocusVisibleState, setFocusVisible] = useState(isFocusVisible());
+  useEffect(() => {
     const handler = () => {
       setFocusVisible(isFocusVisible());
     };
@@ -88,7 +88,7 @@ function useFocusVisible() {
   return { isFocusVisible: isFocusVisibleState };
 }
 
-
-
-exports.useFocusVisible = useFocusVisible;
+export {
+  useFocusVisible
+};
 //# sourceMappingURL=OGJDUOWP.js.map

package/dist/__chunks/OGJDUOWP.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/useFocusVisible.tsx"],"names":[],"mappings":";AAIA,SAAS,UAAU,iBAAiB;AAMpC,IAAI,0BAA0B;AAC9B,IAAI,kBAAmC;AACvC,IAAM,iBAAiB,oBAAI,IAAa;AACxC,IAAI,sBAAsB;AAE1B,IAAM;AAAA;AAAA,EAEJ,OAAO,WAAW,eAAe,OAAO,aAAa;AAAA;AAAA,IAEjD,OAAO,KAAK,OAAO,UAAU,QAAQ;AAAA,MACrC;AAAA;AAEN,SAAS,WAAW,GAAkB;AACpC,SAAO,EAAE,EAAE,WAAY,CAAC,SAAS,EAAE,UAAW,EAAE;AAClD;AAEA,SAAS,sBAAsB,UAAoB,GAAiB;AAClE,iBAAe,QAAQ,CAAC,YAAY;AAClC,YAAQ,UAAU,CAAC;AAAA,EACrB,CAAC;AACH;AAEA,SAAS,oBAAoB,GAAkB;AAC7C,wBAAsB;AACtB,MAAI,WAAW,CAAC,GAAG;AACjB,sBAAkB;AAClB,0BAAsB,YAAY,CAAC;AAAA,EACrC;AACF;AAEA,SAAS,mBAAmB,GAA8B;AACxD,oBAAkB;AAClB,MAAI,EAAE,SAAS,eAAe,EAAE,SAAS,eAAe;AACtD,0BAAsB;AACtB,0BAAsB,WAAW,CAAC;AAAA,EACpC;AACF;AAEA,SAAS,iBAAiB,GAAe;AAIvC,MAAI,EAAE,WAAW,UAAU,EAAE,WAAW,UAAU;AAChD;AAAA,EACF;AAIA,MAAI,CAAC,qBAAqB;AACxB,sBAAkB;AAClB,0BAAsB,YAAY,CAAC;AAAA,EACrC;AAEA,wBAAsB;AACxB;AAEA,SAAS,mBAAmB;AAG1B,wBAAsB;AACxB;AAEA,SAAS,iBAA0B;AACjC,SAAO,oBAAoB;AAC7B;AAEA,SAAS,yBAAyB;AAChC,MAAI,OAAO,WAAW,eAAe,yBAAyB;AAC5D;AAAA,EACF;AAQA,QAAM,EAAE,MAAM,IAAI,YAAY;AAE9B,cAAY,UAAU,QAAQ,SAAS,gBAAgB,MAAM;AAC3D,0BAAsB;AACtB,UAAM,MAAM,MAAM,IAAI;AAAA,EACxB;AAEA,WAAS,iBAAiB,WAAW,qBAAqB,IAAI;AAC9D,WAAS,iBAAiB,SAAS,qBAAqB,IAAI;AAI5D,SAAO,iBAAiB,SAAS,kBAAkB,IAAI;AACvD,SAAO,iBAAiB,QAAQ,kBAAkB,KAAK;AAEvD,MAAI,OAAO,iBAAiB,aAAa;AACvC,aAAS,iBAAiB,eAAe,oBAAoB,IAAI;AACjE,aAAS,iBAAiB,eAAe,oBAAoB,IAAI;AACjE,aAAS,iBAAiB,aAAa,oBAAoB,IAAI;AAAA,EACjE,OAAO;AACL,aAAS,iBAAiB,aAAa,oBAAoB,IAAI;AAC/D,aAAS,iBAAiB,aAAa,oBAAoB,IAAI;AAC/D,aAAS,iBAAiB,WAAW,oBAAoB,IAAI;AAAA,EAC/D;AAEA,4BAA0B;AAC5B;AAEe,SAAR,kBAEL;AACA,yBAAuB;AACvB,QAAM,CAAC,qBAAqB,eAAe,IAAI,SAAS,eAAe,CAAC;AACxE,YAAU,MAAM;AACd,UAAM,UAAU,MAAM;AACpB,sBAAgB,eAAe,CAAC;AAAA,IAClC;AAEA,mBAAe,IAAI,OAAO;AAC1B,WAAO,MAAM;AACX,qBAAe,OAAO,OAAO;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,gBAAgB,oBAAoB;AAC/C","sourcesContent":["// Portions of the code in this file are based on code from react & react-spectrum:\n// https://github.com/facebook/react/blob/cc7c1aece46a6b69b41958d731e0fd27c94bfc6c/packages/react-interactions/events/src/dom/create-event-handle/Focus.js\n// https://github.com/adobe/react-spectrum/blob/c700898916bbd076bcc63e49d77c16d80623a8e7/packages/@react-aria/interactions/src/useFocusVisible.ts\n\nimport { useState, useEffect } from \"react\";\n\ntype Modality = \"keyboard\" | \"pointer\";\ntype HandlerEvent = PointerEvent | MouseEvent | KeyboardEvent | FocusEvent;\ntype Handler = (modality: Modality, e: HandlerEvent) => void;\n\nlet hasSetupGlobalListeners = false;\nlet currentModality: Modality | null = null;\nconst changeHandlers = new Set<Handler>();\nlet hasEventBeforeFocus = false;\n\nconst isMac =\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  typeof window !== \"undefined\" && window.navigator != null\n    ? // eslint-disable-next-line @typescript-eslint/prefer-string-starts-ends-with\n      /^Mac/.test(window.navigator.platform)\n    : false;\n\nfunction isValidKey(e: KeyboardEvent) {\n  return !(e.metaKey || (!isMac && e.altKey) || e.ctrlKey);\n}\n\nfunction triggerChangeHandlers(modality: Modality, e: HandlerEvent) {\n  changeHandlers.forEach((handler) => {\n    handler(modality, e);\n  });\n}\n\nfunction handleKeyboardEvent(e: KeyboardEvent) {\n  hasEventBeforeFocus = true;\n  if (isValidKey(e)) {\n    currentModality = \"keyboard\";\n    triggerChangeHandlers(\"keyboard\", e);\n  }\n}\n\nfunction handlePointerEvent(e: PointerEvent | MouseEvent) {\n  currentModality = \"pointer\";\n  if (e.type === \"mousedown\" || e.type === \"pointerdown\") {\n    hasEventBeforeFocus = true;\n    triggerChangeHandlers(\"pointer\", e);\n  }\n}\n\nfunction handleFocusEvent(e: FocusEvent) {\n  // Firefox fires two extra focus events when the user first clicks into an iframe:\n  // first on the window, then on the document. We ignore these events so they don't\n  // cause keyboard focus rings to appear.\n  if (e.target === window || e.target === document) {\n    return;\n  }\n\n  // If a focus event occurs without a preceding keyboard or pointer event, switch to keyboard modality.\n  // This occurs, for example, when navigating a form with the next/previous buttons on iOS.\n  if (!hasEventBeforeFocus) {\n    currentModality = \"keyboard\";\n    triggerChangeHandlers(\"keyboard\", e);\n  }\n\n  hasEventBeforeFocus = false;\n}\n\nfunction handleWindowBlur() {\n  // When the window is blurred, reset state. This is necessary when tabbing out of the window,\n  // for example, since a subsequent focus event won't be fired.\n  hasEventBeforeFocus = false;\n}\n\nfunction isFocusVisible(): boolean {\n  return currentModality !== \"pointer\";\n}\n\nfunction setupGlobalFocusEvents() {\n  if (typeof window === \"undefined\" || hasSetupGlobalListeners) {\n    return;\n  }\n\n  // Programmatic focus() calls shouldn't affect the current input modality.\n  // However, we need to detect other cases when a focus event occurs without\n  // a preceding user event (e.g. screen reader focus). Overriding the focus\n  // method on HTMLElement.prototype is a bit hacky, but works.\n  // $FlowExpectedError[method-unbinding]\n  // eslint-disable-next-line @typescript-eslint/unbound-method\n  const { focus } = HTMLElement.prototype;\n  // $FlowIssue[cannot-write]\n  HTMLElement.prototype.focus = function focusElement(...args) {\n    hasEventBeforeFocus = true;\n    focus.apply(this, args);\n  };\n\n  document.addEventListener(\"keydown\", handleKeyboardEvent, true);\n  document.addEventListener(\"keyup\", handleKeyboardEvent, true);\n\n  // Register focus events on the window so they are sure to happen\n  // before React's event listeners (registered on the document).\n  window.addEventListener(\"focus\", handleFocusEvent, true);\n  window.addEventListener(\"blur\", handleWindowBlur, false);\n\n  if (typeof PointerEvent !== \"undefined\") {\n    document.addEventListener(\"pointerdown\", handlePointerEvent, true);\n    document.addEventListener(\"pointermove\", handlePointerEvent, true);\n    document.addEventListener(\"pointerup\", handlePointerEvent, true);\n  } else {\n    document.addEventListener(\"mousedown\", handlePointerEvent, true);\n    document.addEventListener(\"mousemove\", handlePointerEvent, true);\n    document.addEventListener(\"mouseup\", handlePointerEvent, true);\n  }\n\n  hasSetupGlobalListeners = true;\n}\n\nexport default function useFocusVisible(): {\n  isFocusVisible: boolean;\n} {\n  setupGlobalFocusEvents();\n  const [isFocusVisibleState, setFocusVisible] = useState(isFocusVisible());\n  useEffect(() => {\n    const handler = () => {\n      setFocusVisible(isFocusVisible());\n    };\n\n    changeHandlers.add(handler);\n    return () => {\n      changeHandlers.delete(handler);\n    };\n  }, []);\n\n  return { isFocusVisible: isFocusVisibleState };\n}\n"]}
+{"version":3,"sources":["../../src/useFocusVisible.tsx"],"sourcesContent":["// Portions of the code in this file are based on code from react & react-spectrum:\n// https://github.com/facebook/react/blob/cc7c1aece46a6b69b41958d731e0fd27c94bfc6c/packages/react-interactions/events/src/dom/create-event-handle/Focus.js\n// https://github.com/adobe/react-spectrum/blob/c700898916bbd076bcc63e49d77c16d80623a8e7/packages/@react-aria/interactions/src/useFocusVisible.ts\n\nimport { useState, useEffect } from \"react\";\n\ntype Modality = \"keyboard\" | \"pointer\";\ntype HandlerEvent = PointerEvent | MouseEvent | KeyboardEvent | FocusEvent;\ntype Handler = (modality: Modality, e: HandlerEvent) => void;\n\nlet hasSetupGlobalListeners = false;\nlet currentModality: Modality | null = null;\nconst changeHandlers = new Set<Handler>();\nlet hasEventBeforeFocus = false;\n\nconst isMac =\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  typeof window !== \"undefined\" && window.navigator != null\n    ? // eslint-disable-next-line @typescript-eslint/prefer-string-starts-ends-with\n      /^Mac/.test(window.navigator.platform)\n    : false;\n\nfunction isValidKey(e: KeyboardEvent) {\n  return !(e.metaKey || (!isMac && e.altKey) || e.ctrlKey);\n}\n\nfunction triggerChangeHandlers(modality: Modality, e: HandlerEvent) {\n  changeHandlers.forEach((handler) => {\n    handler(modality, e);\n  });\n}\n\nfunction handleKeyboardEvent(e: KeyboardEvent) {\n  hasEventBeforeFocus = true;\n  if (isValidKey(e)) {\n    currentModality = \"keyboard\";\n    triggerChangeHandlers(\"keyboard\", e);\n  }\n}\n\nfunction handlePointerEvent(e: PointerEvent | MouseEvent) {\n  currentModality = \"pointer\";\n  if (e.type === \"mousedown\" || e.type === \"pointerdown\") {\n    hasEventBeforeFocus = true;\n    triggerChangeHandlers(\"pointer\", e);\n  }\n}\n\nfunction handleFocusEvent(e: FocusEvent) {\n  // Firefox fires two extra focus events when the user first clicks into an iframe:\n  // first on the window, then on the document. We ignore these events so they don't\n  // cause keyboard focus rings to appear.\n  if (e.target === window || e.target === document) {\n    return;\n  }\n\n  // If a focus event occurs without a preceding keyboard or pointer event, switch to keyboard modality.\n  // This occurs, for example, when navigating a form with the next/previous buttons on iOS.\n  if (!hasEventBeforeFocus) {\n    currentModality = \"keyboard\";\n    triggerChangeHandlers(\"keyboard\", e);\n  }\n\n  hasEventBeforeFocus = false;\n}\n\nfunction handleWindowBlur() {\n  // When the window is blurred, reset state. This is necessary when tabbing out of the window,\n  // for example, since a subsequent focus event won't be fired.\n  hasEventBeforeFocus = false;\n}\n\nfunction isFocusVisible(): boolean {\n  return currentModality !== \"pointer\";\n}\n\nfunction setupGlobalFocusEvents() {\n  if (typeof window === \"undefined\" || hasSetupGlobalListeners) {\n    return;\n  }\n\n  // Programmatic focus() calls shouldn't affect the current input modality.\n  // However, we need to detect other cases when a focus event occurs without\n  // a preceding user event (e.g. screen reader focus). Overriding the focus\n  // method on HTMLElement.prototype is a bit hacky, but works.\n  // $FlowExpectedError[method-unbinding]\n  // eslint-disable-next-line @typescript-eslint/unbound-method\n  const { focus } = HTMLElement.prototype;\n  // $FlowIssue[cannot-write]\n  HTMLElement.prototype.focus = function focusElement(...args) {\n    hasEventBeforeFocus = true;\n    focus.apply(this, args);\n  };\n\n  document.addEventListener(\"keydown\", handleKeyboardEvent, true);\n  document.addEventListener(\"keyup\", handleKeyboardEvent, true);\n\n  // Register focus events on the window so they are sure to happen\n  // before React's event listeners (registered on the document).\n  window.addEventListener(\"focus\", handleFocusEvent, true);\n  window.addEventListener(\"blur\", handleWindowBlur, false);\n\n  if (typeof PointerEvent !== \"undefined\") {\n    document.addEventListener(\"pointerdown\", handlePointerEvent, true);\n    document.addEventListener(\"pointermove\", handlePointerEvent, true);\n    document.addEventListener(\"pointerup\", handlePointerEvent, true);\n  } else {\n    document.addEventListener(\"mousedown\", handlePointerEvent, true);\n    document.addEventListener(\"mousemove\", handlePointerEvent, true);\n    document.addEventListener(\"mouseup\", handlePointerEvent, true);\n  }\n\n  hasSetupGlobalListeners = true;\n}\n\nexport default function useFocusVisible(): {\n  isFocusVisible: boolean;\n} {\n  setupGlobalFocusEvents();\n  const [isFocusVisibleState, setFocusVisible] = useState(isFocusVisible());\n  useEffect(() => {\n    const handler = () => {\n      setFocusVisible(isFocusVisible());\n    };\n\n    changeHandlers.add(handler);\n    return () => {\n      changeHandlers.delete(handler);\n    };\n  }, []);\n\n  return { isFocusVisible: isFocusVisibleState };\n}\n"],"mappings":";AAIA,SAAS,UAAU,iBAAiB;AAMpC,IAAI,0BAA0B;AAC9B,IAAI,kBAAmC;AACvC,IAAM,iBAAiB,oBAAI,IAAa;AACxC,IAAI,sBAAsB;AAE1B,IAAM;AAAA;AAAA,EAEJ,OAAO,WAAW,eAAe,OAAO,aAAa;AAAA;AAAA,IAEjD,OAAO,KAAK,OAAO,UAAU,QAAQ;AAAA,MACrC;AAAA;AAEN,SAAS,WAAW,GAAkB;AACpC,SAAO,EAAE,EAAE,WAAY,CAAC,SAAS,EAAE,UAAW,EAAE;AAClD;AAEA,SAAS,sBAAsB,UAAoB,GAAiB;AAClE,iBAAe,QAAQ,CAAC,YAAY;AAClC,YAAQ,UAAU,CAAC;AAAA,EACrB,CAAC;AACH;AAEA,SAAS,oBAAoB,GAAkB;AAC7C,wBAAsB;AACtB,MAAI,WAAW,CAAC,GAAG;AACjB,sBAAkB;AAClB,0BAAsB,YAAY,CAAC;AAAA,EACrC;AACF;AAEA,SAAS,mBAAmB,GAA8B;AACxD,oBAAkB;AAClB,MAAI,EAAE,SAAS,eAAe,EAAE,SAAS,eAAe;AACtD,0BAAsB;AACtB,0BAAsB,WAAW,CAAC;AAAA,EACpC;AACF;AAEA,SAAS,iBAAiB,GAAe;AAIvC,MAAI,EAAE,WAAW,UAAU,EAAE,WAAW,UAAU;AAChD;AAAA,EACF;AAIA,MAAI,CAAC,qBAAqB;AACxB,sBAAkB;AAClB,0BAAsB,YAAY,CAAC;AAAA,EACrC;AAEA,wBAAsB;AACxB;AAEA,SAAS,mBAAmB;AAG1B,wBAAsB;AACxB;AAEA,SAAS,iBAA0B;AACjC,SAAO,oBAAoB;AAC7B;AAEA,SAAS,yBAAyB;AAChC,MAAI,OAAO,WAAW,eAAe,yBAAyB;AAC5D;AAAA,EACF;AAQA,QAAM,EAAE,MAAM,IAAI,YAAY;AAE9B,cAAY,UAAU,QAAQ,SAAS,gBAAgB,MAAM;AAC3D,0BAAsB;AACtB,UAAM,MAAM,MAAM,IAAI;AAAA,EACxB;AAEA,WAAS,iBAAiB,WAAW,qBAAqB,IAAI;AAC9D,WAAS,iBAAiB,SAAS,qBAAqB,IAAI;AAI5D,SAAO,iBAAiB,SAAS,kBAAkB,IAAI;AACvD,SAAO,iBAAiB,QAAQ,kBAAkB,KAAK;AAEvD,MAAI,OAAO,iBAAiB,aAAa;AACvC,aAAS,iBAAiB,eAAe,oBAAoB,IAAI;AACjE,aAAS,iBAAiB,eAAe,oBAAoB,IAAI;AACjE,aAAS,iBAAiB,aAAa,oBAAoB,IAAI;AAAA,EACjE,OAAO;AACL,aAAS,iBAAiB,aAAa,oBAAoB,IAAI;AAC/D,aAAS,iBAAiB,aAAa,oBAAoB,IAAI;AAC/D,aAAS,iBAAiB,WAAW,oBAAoB,IAAI;AAAA,EAC/D;AAEA,4BAA0B;AAC5B;AAEe,SAAR,kBAEL;AACA,yBAAuB;AACvB,QAAM,CAAC,qBAAqB,eAAe,IAAI,SAAS,eAAe,CAAC;AACxE,YAAU,MAAM;AACd,UAAM,UAAU,MAAM;AACpB,sBAAgB,eAAe,CAAC;AAAA,IAClC;AAEA,mBAAe,IAAI,OAAO;AAC1B,WAAO,MAAM;AACX,qBAAe,OAAO,OAAO;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,EAAE,gBAAgB,oBAAoB;AAC/C;","names":[]}

package/dist/__chunks/{HAZN2FCY.mjs → PBOQIXCB.cjs}

@@ -1,9 +1,9 @@
-// css-module:./ButtonGroup.module.css#css-module
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// css-module:./ButtonGroup.module.css#css-module
 var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_1f9x9_1", "horizontal": "_horizontal_1f9x9_5", "vertical": "_vertical_1f9x9_9", "smallGap": "_smallGap_1f9x9_13", "mediumGap": "_mediumGap_1f9x9_17", "largeGap": "_largeGap_1f9x9_21" };
 
 // src/ButtonGroup/ButtonGroup.tsx
-import classNames from "classnames";
-import { jsx } from "react/jsx-runtime";
+var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+var _jsxruntime = require('react/jsx-runtime');
 var gap = {
   ["sm"]: ButtonGroup_module_default.smallGap,
   ["md"]: ButtonGroup_module_default.mediumGap,
@@ -14,15 +14,15 @@ var ButtonGroup = ({
   size = "md",
   children
 }) => {
-  const classnames = classNames(ButtonGroup_module_default.buttonGroup, gap[size], {
+  const classnames = _classnames2.default.call(void 0, ButtonGroup_module_default.buttonGroup, gap[size], {
     [ButtonGroup_module_default.horizontal]: orientation === "horizontal",
     [ButtonGroup_module_default.vertical]: orientation === "vertical"
   });
-  return /* @__PURE__ */ jsx("div", { className: classnames, children });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: classnames, children });
 };
 var ButtonGroup_default = ButtonGroup;
 
-export {
-  ButtonGroup_default
-};
-//# sourceMappingURL=HAZN2FCY.mjs.map
+
+
+exports.ButtonGroup_default = ButtonGroup_default;
+//# sourceMappingURL=PBOQIXCB.cjs.map

package/dist/__chunks/PBOQIXCB.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["css-module:./ButtonGroup.module.css#css-module","../../src/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":";AAAsG,IAAO,6BAAQ,EAAC,eAAc,wBAAuB,cAAa,uBAAsB,YAAW,qBAAoB,YAAW,sBAAqB,aAAY,uBAAsB,YAAW,qBAAoB;;;ACG9T,OAAO,gBAAgB;AA0Cd;AAxCT,IAAM,MAAM;AAAA,EACV,CAAC,IAAI,GAAG,2BAAO;AAAA,EACf,CAAC,IAAI,GAAG,2BAAO;AAAA,EACf,CAAC,IAAI,GAAG,2BAAO;AACjB;AAKA,IAAM,cAAc,CAAC;AAAA,EACnB,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AACF,MAqBoB;AAClB,QAAM,aAAa,WAAW,2BAAO,aAAa,IAAI,IAAI,GAAG;AAAA,IAC3D,CAAC,2BAAO,UAAU,GAAG,gBAAgB;AAAA,IACrC,CAAC,2BAAO,QAAQ,GAAG,gBAAgB;AAAA,EACrC,CAAC;AAED,SAAO,oBAAC,SAAI,WAAW,YAAa,UAAS;AAC/C;AAEA,IAAO,sBAAQ","sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/ButtonGroup/ButtonGroup.module.css\"; export default {\"buttonGroup\":\"_buttonGroup_1f9x9_1\",\"horizontal\":\"_horizontal_1f9x9_5\",\"vertical\":\"_vertical_1f9x9_9\",\"smallGap\":\"_smallGap_1f9x9_13\",\"mediumGap\":\"_mediumGap_1f9x9_17\",\"largeGap\":\"_largeGap_1f9x9_21\"}","import { type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./ButtonGroup.module.css\";\nimport { type Size } from \"../constants\";\nimport classNames from \"classnames\";\n\nconst gap = {\n  [\"sm\"]: styles.smallGap,\n  [\"md\"]: styles.mediumGap,\n  [\"lg\"]: styles.largeGap,\n} as const;\n\n/**\n * [ButtonGroup](https://cambly-syntax.vercel.app/?path=/docs/components-buttongroup--docs) groups buttons in a row or column with consistent spacing between each button.\n */\nconst ButtonGroup = ({\n  orientation = \"horizontal\",\n  size = \"md\",\n  children,\n}: {\n  /**\n   * The orientation of the button group\n   *\n   * @defaultValue \"horizontal\"\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * The size of the button group defines the spacing between each button\n   *\n   * * `sm`: 8px\n   * * `md`: 12px\n   * * `lg`: 16px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: (typeof Size)[number];\n  /**\n   * Buttons to be rendered inside the button group\n   */\n  children?: ReactNode;\n}): ReactElement => {\n  const classnames = classNames(styles.buttonGroup, gap[size], {\n    [styles.horizontal]: orientation === \"horizontal\",\n    [styles.vertical]: orientation === \"vertical\",\n  });\n\n  return <div className={classnames}>{children}</div>;\n};\n\nexport default ButtonGroup;\n"]}

package/dist/__chunks/{UCMB6MFN.mjs → PBWG2BB5.cjs}

@@ -1,7 +1,7 @@
-// src/Modal/StopScroll.tsx
-import { useEffect } from "react";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/Modal/StopScroll.tsx
+var _react = require('react');
 function StopScroll(props) {
-  useEffect(() => {
+  _react.useEffect.call(void 0, () => {
     const originalStyle = window.getComputedStyle(document.body).overflow;
     document.body.style.overflow = "hidden";
     return () => {
@@ -11,7 +11,7 @@ function StopScroll(props) {
   return props.children;
 }
 
-export {
-  StopScroll
-};
-//# sourceMappingURL=UCMB6MFN.mjs.map
+
+
+exports.StopScroll = StopScroll;
+//# sourceMappingURL=PBWG2BB5.cjs.map

package/dist/__chunks/PBWG2BB5.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Modal/StopScroll.tsx"],"names":[],"mappings":";AAAA,SAAS,iBAAoC;AAE9B,SAAR,WAA4B,OAElB;AACf,YAAU,MAAM;AACd,UAAM,gBAAgB,OAAO,iBAAiB,SAAS,IAAI,EAAE;AAC7D,aAAS,KAAK,MAAM,WAAW;AAC/B,WAAO,MAAM;AACX,eAAS,KAAK,MAAM,WAAW;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,MAAM;AACf","sourcesContent":["import { useEffect, type ReactElement } from \"react\";\n\nexport default function StopScroll(props: {\n  children: ReactElement;\n}): ReactElement {\n  useEffect(() => {\n    const originalStyle = window.getComputedStyle(document.body).overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = originalStyle;\n    };\n  }, []);\n\n  return props.children;\n}\n"]}

package/dist/__chunks/PQIPUPQ2.cjs

@@ -0,0 +1,26 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _RLYKYCEUcjs = require('./RLYKYCEU.cjs');
+
+// src/colors/foregroundColor.ts
+function foregroundColor(color) {
+  switch (color) {
+    case "secondary":
+    case "tertiary":
+      return _RLYKYCEUcjs.colors_module_default.primary700Color;
+    case "destructive-secondary":
+    case "destructive-tertiary":
+      return _RLYKYCEUcjs.colors_module_default.destructive700Color;
+    case "branded":
+      return _RLYKYCEUcjs.colors_module_default.gray900Color;
+    case "inverse":
+      return _RLYKYCEUcjs.colors_module_default.whiteColor;
+    default:
+      return _RLYKYCEUcjs.colors_module_default.whiteColor;
+  }
+}
+
+
+
+exports.foregroundColor = foregroundColor;
+//# sourceMappingURL=PQIPUPQ2.cjs.map

package/dist/__chunks/PQIPUPQ2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/colors/foregroundColor.ts"],"names":[],"mappings":";;;;;AAGe,SAAR,gBAAiC,OAAuC;AAC7E,UAAQ,OAAO;AAAA,IACb,KAAK;AAAA,IACL,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB,KAAK;AAAA,IACL,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB,KAAK;AACH,aAAO,sBAAO;AAAA,IAChB;AACE,aAAO,sBAAO;AAAA,EAClB;AACF","sourcesContent":["import { type Color } from \"../constants\";\nimport styles from \"./colors.module.css\";\n\nexport default function foregroundColor(color: (typeof Color)[number]): string {\n  switch (color) {\n    case \"secondary\":\n    case \"tertiary\":\n      return styles.primary700Color;\n    case \"destructive-secondary\":\n    case \"destructive-tertiary\":\n      return styles.destructive700Color;\n    case \"branded\":\n      return styles.gray900Color;\n    case \"inverse\":\n      return styles.whiteColor;\n    default:\n      return styles.whiteColor;\n  }\n}\n"]}

package/dist/__chunks/PYNS67IV.js

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _TPMQI44Ljs = require('./TPMQI44L.js');
-
-
-var _ERXGNP37js = require('./ERXGNP37.js');
-
-
-
-
-var _LULBCTQRjs = require('./LULBCTQR.js');
+import {
+  rounding_module_default
+} from "./TPMQI44L.js";
+import {
+  colors_module_default
+} from "./ERXGNP37.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./LULBCTQR.js";
 
 // src/Box/Box.tsx
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+import classNames from "classnames";
 
 // css-module:./Box.module.css#css-module
 var Box_module_default = { "box": "_box_bg9pe_1", "flexnone": "_flexnone_bg9pe_5", "flexgrow": "_flexgrow_bg9pe_9", "flexWrap": "_flexWrap_bg9pe_13", "alignItemscenter": "_alignItemscenter_bg9pe_18", "alignItemsstart": "_alignItemsstart_bg9pe_22", "alignItemsend": "_alignItemsend_bg9pe_26", "alignItemsstretch": "_alignItemsstretch_bg9pe_30", "alignItemsbaseline": "_alignItemsbaseline_bg9pe_34", "alignItemscenterSmall": "_alignItemscenterSmall_bg9pe_40", "alignItemsstartSmall": "_alignItemsstartSmall_bg9pe_44", "alignItemsendSmall": "_alignItemsendSmall_bg9pe_48", "alignItemsstretchSmall": "_alignItemsstretchSmall_bg9pe_52", "alignItemsbaselineSmall": "_alignItemsbaselineSmall_bg9pe_56", "alignItemscenterLarge": "_alignItemscenterLarge_bg9pe_63", "alignItemsstartLarge": "_alignItemsstartLarge_bg9pe_67", "alignItemsendLarge": "_alignItemsendLarge_bg9pe_71", "alignItemsstretchLarge": "_alignItemsstretchLarge_bg9pe_75", "alignItemsbaselineLarge": "_alignItemsbaselineLarge_bg9pe_79", "alignSelfcenter": "_alignSelfcenter_bg9pe_85", "alignSelfstart": "_alignSelfstart_bg9pe_89", "alignSelfend": "_alignSelfend_bg9pe_93", "alignSelfstretch": "_alignSelfstretch_bg9pe_97", "alignSelfbaseline": "_alignSelfbaseline_bg9pe_101", "alignSelfauto": "_alignSelfauto_bg9pe_105", "block": "_block_bg9pe_110", "flex": "_flex_bg9pe_5", "inlineBlock": "_inlineBlock_bg9pe_118", "none": "_none_bg9pe_122", "visuallyHidden": "_visuallyHidden_bg9pe_126", "blockSmall": "_blockSmall_bg9pe_140", "flexSmall": "_flexSmall_bg9pe_144", "inlineBlockSmall": "_inlineBlockSmall_bg9pe_148", "noneSmall": "_noneSmall_bg9pe_152", "visuallyHiddenSmall": "_visuallyHiddenSmall_bg9pe_156", "blockLarge": "_blockLarge_bg9pe_171", "flexLarge": "_flexLarge_bg9pe_175", "inlineBlockLarge": "_inlineBlockLarge_bg9pe_179", "noneLarge": "_noneLarge_bg9pe_183", "visuallyHiddenLarge": "_visuallyHiddenLarge_bg9pe_187", "column": "_column_bg9pe_201", "row": "_row_bg9pe_205", "columnSmall": "_columnSmall_bg9pe_211", "rowSmall": "_rowSmall_bg9pe_215", "columnLarge": "_columnLarge_bg9pe_222", "rowLarge": "_rowLarge_bg9pe_226", "gap0": "_gap0_bg9pe_232", "gap1": "_gap1_bg9pe_236", "gap2": "_gap2_bg9pe_240", "gap3": "_gap3_bg9pe_244", "gap4": "_gap4_bg9pe_248", "gap5": "_gap5_bg9pe_252", "gap6": "_gap6_bg9pe_256", "gap7": "_gap7_bg9pe_260", "gap8": "_gap8_bg9pe_264", "gap9": "_gap9_bg9pe_268", "gap10": "_gap10_bg9pe_272", "gap11": "_gap11_bg9pe_276", "gap12": "_gap12_bg9pe_280", "justifyContentcenter": "_justifyContentcenter_bg9pe_285", "justifyContentstart": "_justifyContentstart_bg9pe_289", "justifyContentend": "_justifyContentend_bg9pe_293", "justifyContentbetween": "_justifyContentbetween_bg9pe_297", "justifyContentaround": "_justifyContentaround_bg9pe_301", "justifyContentevenly": "_justifyContentevenly_bg9pe_305", "justifyContentcenterSmall": "_justifyContentcenterSmall_bg9pe_311", "justifyContentstartSmall": "_justifyContentstartSmall_bg9pe_315", "justifyContentendSmall": "_justifyContentendSmall_bg9pe_319", "justifyContentbetweenSmall": "_justifyContentbetweenSmall_bg9pe_323", "justifyContentaroundSmall": "_justifyContentaroundSmall_bg9pe_327", "justifyContentevenlySmall": "_justifyContentevenlySmall_bg9pe_331", "justifyContentcenterLarge": "_justifyContentcenterLarge_bg9pe_338", "justifyContentstartLarge": "_justifyContentstartLarge_bg9pe_342", "justifyContentendLarge": "_justifyContentendLarge_bg9pe_346", "justifyContentbetweenLarge": "_justifyContentbetweenLarge_bg9pe_350", "justifyContentaroundLarge": "_justifyContentaroundLarge_bg9pe_354", "justifyContentevenlyLarge": "_justifyContentevenlyLarge_bg9pe_358", "overflowvisible": "_overflowvisible_bg9pe_364", "overflowhidden": "_overflowhidden_bg9pe_368", "overflowscroll": "_overflowscroll_bg9pe_372", "overflowauto": "_overflowauto_bg9pe_376", "overflowinherit": "_overflowinherit_bg9pe_380", "overflowinitial": "_overflowinitial_bg9pe_384", "overflowXvisible": "_overflowXvisible_bg9pe_388", "overflowXhidden": "_overflowXhidden_bg9pe_392", "overflowXscroll": "_overflowXscroll_bg9pe_396", "overflowXauto": "_overflowXauto_bg9pe_400", "overflowXinherit": "_overflowXinherit_bg9pe_404", "overflowXinitial": "_overflowXinitial_bg9pe_408", "overflowYvisible": "_overflowYvisible_bg9pe_412", "overflowYhidden": "_overflowYhidden_bg9pe_416", "overflowYscroll": "_overflowYscroll_bg9pe_420", "overflowYauto": "_overflowYauto_bg9pe_424", "overflowYinherit": "_overflowYinherit_bg9pe_428", "overflowYinitial": "_overflowYinitial_bg9pe_432", "absolute": "_absolute_bg9pe_437", "fixed": "_fixed_bg9pe_441", "relative": "_relative_bg9pe_445", "sticky": "_sticky_bg9pe_449" };
@@ -23,11 +23,11 @@ var margin_module_default = { "marginBottom-12": "_marginBottom-12_1whn1_2", "ma
 var padding_module_default = { "paddingX0": "_paddingX0_1aqye_2", "paddingX1": "_paddingX1_1aqye_7", "paddingX2": "_paddingX2_1aqye_12", "paddingX3": "_paddingX3_1aqye_17", "paddingX4": "_paddingX4_1aqye_22", "paddingX5": "_paddingX5_1aqye_27", "paddingX6": "_paddingX6_1aqye_32", "paddingX7": "_paddingX7_1aqye_37", "paddingX8": "_paddingX8_1aqye_42", "paddingX9": "_paddingX9_1aqye_47", "paddingX10": "_paddingX10_1aqye_52", "paddingX11": "_paddingX11_1aqye_57", "paddingX12": "_paddingX12_1aqye_62", "paddingY0": "_paddingY0_1aqye_67", "paddingY1": "_paddingY1_1aqye_72", "paddingY2": "_paddingY2_1aqye_77", "paddingY3": "_paddingY3_1aqye_82", "paddingY4": "_paddingY4_1aqye_87", "paddingY5": "_paddingY5_1aqye_92", "paddingY6": "_paddingY6_1aqye_97", "paddingY7": "_paddingY7_1aqye_102", "paddingY8": "_paddingY8_1aqye_107", "paddingY9": "_paddingY9_1aqye_112", "paddingY10": "_paddingY10_1aqye_117", "paddingY11": "_paddingY11_1aqye_122", "paddingY12": "_paddingY12_1aqye_127", "paddingX0Small": "_paddingX0Small_1aqye_134", "paddingX1Small": "_paddingX1Small_1aqye_139", "paddingX2Small": "_paddingX2Small_1aqye_144", "paddingX3Small": "_paddingX3Small_1aqye_149", "paddingX4Small": "_paddingX4Small_1aqye_154", "paddingX5Small": "_paddingX5Small_1aqye_159", "paddingX6Small": "_paddingX6Small_1aqye_164", "paddingX7Small": "_paddingX7Small_1aqye_169", "paddingX8Small": "_paddingX8Small_1aqye_174", "paddingX9Small": "_paddingX9Small_1aqye_179", "paddingX10Small": "_paddingX10Small_1aqye_184", "paddingX11Small": "_paddingX11Small_1aqye_189", "paddingX12Small": "_paddingX12Small_1aqye_194", "paddingY0Small": "_paddingY0Small_1aqye_199", "paddingY1Small": "_paddingY1Small_1aqye_204", "paddingY2Small": "_paddingY2Small_1aqye_209", "paddingY3Small": "_paddingY3Small_1aqye_214", "paddingY4Small": "_paddingY4Small_1aqye_219", "paddingY5Small": "_paddingY5Small_1aqye_224", "paddingY6Small": "_paddingY6Small_1aqye_229", "paddingY7Small": "_paddingY7Small_1aqye_234", "paddingY8Small": "_paddingY8Small_1aqye_239", "paddingY9Small": "_paddingY9Small_1aqye_244", "paddingY10Small": "_paddingY10Small_1aqye_249", "paddingY11Small": "_paddingY11Small_1aqye_254", "paddingY12Small": "_paddingY12Small_1aqye_259", "paddingX0Large": "_paddingX0Large_1aqye_267", "paddingX1Large": "_paddingX1Large_1aqye_272", "paddingX2Large": "_paddingX2Large_1aqye_277", "paddingX3Large": "_paddingX3Large_1aqye_282", "paddingX4Large": "_paddingX4Large_1aqye_287", "paddingX5Large": "_paddingX5Large_1aqye_292", "paddingX6Large": "_paddingX6Large_1aqye_297", "paddingX7Large": "_paddingX7Large_1aqye_302", "paddingX8Large": "_paddingX8Large_1aqye_307", "paddingX9Large": "_paddingX9Large_1aqye_312", "paddingX10Large": "_paddingX10Large_1aqye_317", "paddingX11Large": "_paddingX11Large_1aqye_322", "paddingX12Large": "_paddingX12Large_1aqye_327", "paddingY0Large": "_paddingY0Large_1aqye_332", "paddingY1Large": "_paddingY1Large_1aqye_337", "paddingY2Large": "_paddingY2Large_1aqye_342", "paddingY3Large": "_paddingY3Large_1aqye_347", "paddingY4Large": "_paddingY4Large_1aqye_352", "paddingY5Large": "_paddingY5Large_1aqye_357", "paddingY6Large": "_paddingY6Large_1aqye_362", "paddingY7Large": "_paddingY7Large_1aqye_367", "paddingY8Large": "_paddingY8Large_1aqye_372", "paddingY9Large": "_paddingY9Large_1aqye_377", "paddingY10Large": "_paddingY10Large_1aqye_382", "paddingY11Large": "_paddingY11Large_1aqye_387", "paddingY12Large": "_paddingY12Large_1aqye_392" };
 
 // src/Box/Box.tsx
-var _react = require('react');
-var _jsxruntime = require('react/jsx-runtime');
-var Box = _react.forwardRef.call(void 0, function Box2(props, ref) {
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+var Box = forwardRef(function Box2(props, ref) {
   var _c;
-  const _a = props, { as: BoxElement = "div", children } = _a, boxProps = _LULBCTQRjs.__objRest.call(void 0, _a, ["as", "children"]);
+  const _a = props, { as: BoxElement = "div", children } = _a, boxProps = __objRest(_a, ["as", "children"]);
   const _b = boxProps, {
     alignItems: alignItems,
     smAlignItems,
@@ -82,7 +82,7 @@ var Box = _react.forwardRef.call(void 0, function Box2(props, ref) {
     minHeight,
     minWidth,
     width
-  } = _b, maybePassThroughProps = _LULBCTQRjs.__objRest.call(void 0, _b, [
+  } = _b, maybePassThroughProps = __objRest(_b, [
     // Classname
     "alignItems",
     "smAlignItems",
@@ -143,13 +143,13 @@ var Box = _react.forwardRef.call(void 0, function Box2(props, ref) {
     "width"
   ]);
   const parsedProps = {
-    className: _classnames2.default.call(void 0, 
+    className: classNames(
       Box_module_default.box,
       alignItems && Box_module_default[`alignItems${alignItems}`],
       smAlignItems && Box_module_default[`alignItems${smAlignItems}Small`],
       lgAlignItems && Box_module_default[`alignItems${lgAlignItems}Large`],
       alignSelf && Box_module_default[`alignSelf${alignSelf}`],
-      backgroundColor && _ERXGNP37js.colors_module_default[`${backgroundColor}BackgroundColor`],
+      backgroundColor && colors_module_default[`${backgroundColor}BackgroundColor`],
       direction && Box_module_default[direction],
       smDirection && Box_module_default[`${smDirection}Small`],
       lgDirection && Box_module_default[`${lgDirection}Large`],
@@ -199,12 +199,12 @@ var Box = _react.forwardRef.call(void 0, function Box2(props, ref) {
       smJustifyContent && Box_module_default[`justifyContent${smJustifyContent}Small`],
       lgJustifyContent && Box_module_default[`justifyContent${lgJustifyContent}Large`],
       position && position !== "static" && Box_module_default[position],
-      rounding && rounding !== "none" && _TPMQI44Ljs.rounding_module_default[`rounding${rounding}`],
+      rounding && rounding !== "none" && rounding_module_default[`rounding${rounding}`],
       overflow && Box_module_default[`overflow${overflow}`],
       overflowX && Box_module_default[`overflowX${overflowX}`],
       overflowY && Box_module_default[`overflowY${overflowY}`]
     ),
-    style: _LULBCTQRjs.__spreadValues.call(void 0, {
+    style: __spreadValues({
       height,
       maxHeight,
       maxWidth,
@@ -219,11 +219,11 @@ var Box = _react.forwardRef.call(void 0, function Box2(props, ref) {
     }
     return acc;
   }, {});
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BoxElement, _LULBCTQRjs.__spreadProps.call(void 0, _LULBCTQRjs.__spreadValues.call(void 0, _LULBCTQRjs.__spreadValues.call(void 0, {}, parsedProps), passthroughProps), { ref, children }));
+  return /* @__PURE__ */ jsx(BoxElement, __spreadProps(__spreadValues(__spreadValues({}, parsedProps), passthroughProps), { ref, children }));
 });
 var Box_default = Box;
 
-
-
-exports.Box_default = Box_default;
+export {
+  Box_default
+};
 //# sourceMappingURL=PYNS67IV.js.map