@cambly/syntax-core 18.12.0 → 19.0.0

package/dist/Tabs/Tabs.js

@@ -1,21 +1,14 @@
 "use client"
 import {
   Tabs
-} from "../__chunks/M5G3QZYU.js";
-import "../__chunks/O7HX76KZ.js";
-import "../__chunks/L6U2V7ZR.js";
-import "../__chunks/77FFPQY6.js";
-import "../__chunks/3HA2NC7Q.js";
-import "../__chunks/PBHAJ42K.js";
+} from "../__chunks/VRCNKRDW.js";
+import "../__chunks/4U4UW4AK.js";
 import "../__chunks/IB6JZQF3.js";
 import "../__chunks/4U4UW4AK.js";
 import "../__chunks/4U4UW4AK.js";
 import "../__chunks/KBIW5XV4.js";
-import "../__chunks/DAK5IGJK.js";
-import "../__chunks/VU4LGL2W.js";
 import "../__chunks/XSYKMCV5.js";
 import "../__chunks/4U4UW4AK.js";
-import "../__chunks/JB65NEXK.js";
 import "../__chunks/UWGNJENA.js";
 export {
   Tabs as default

package/dist/__chunks/36DG472B.js

@@ -0,0 +1,38 @@
+"use client"
+
+// css-module:./ButtonGroup.module.css#css-module
+var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_6o6o0_1", "horizontal": "_horizontal_6o6o0_5", "vertical": "_vertical_6o6o0_9", "smallGap": "_smallGap_6o6o0_13", "mediumGap": "_mediumGap_6o6o0_17", "largeGap": "_largeGap_6o6o0_21", "orientationhorizontalSmall": "_orientationhorizontalSmall_6o6o0_27", "orientationverticalSmall": "_orientationverticalSmall_6o6o0_31", "orientationhorizontalLarge": "_orientationhorizontalLarge_6o6o0_38", "orientationverticalLarge": "_orientationverticalLarge_6o6o0_42" };
+
+// src/ButtonGroup/ButtonGroup.tsx
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+var gap = {
+  sm: ButtonGroup_module_default.smallGap,
+  md: ButtonGroup_module_default.mediumGap,
+  lg: ButtonGroup_module_default.largeGap
+};
+var ButtonGroup = ({
+  orientation = "horizontal",
+  size = "md",
+  children,
+  smOrientation,
+  lgOrientation
+}) => {
+  const classnames = classNames(
+    ButtonGroup_module_default.buttonGroup,
+    gap[size],
+    smOrientation != null && ButtonGroup_module_default[`orientation${smOrientation}Small`],
+    lgOrientation != null && ButtonGroup_module_default[`orientation${lgOrientation}Large`],
+    {
+      [ButtonGroup_module_default.horizontal]: orientation === "horizontal",
+      [ButtonGroup_module_default.vertical]: orientation === "vertical"
+    }
+  );
+  return /* @__PURE__ */ jsx("div", { className: classnames, children });
+};
+var ButtonGroup_default = ButtonGroup;
+
+export {
+  ButtonGroup_default
+};
+//# sourceMappingURL=36DG472B.js.map

package/dist/__chunks/36DG472B.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["css-module:./ButtonGroup.module.css#css-module","../../src/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/ButtonGroup/ButtonGroup.module.css\"; export default {\"buttonGroup\":\"_buttonGroup_6o6o0_1\",\"horizontal\":\"_horizontal_6o6o0_5\",\"vertical\":\"_vertical_6o6o0_9\",\"smallGap\":\"_smallGap_6o6o0_13\",\"mediumGap\":\"_mediumGap_6o6o0_17\",\"largeGap\":\"_largeGap_6o6o0_21\",\"orientationhorizontalSmall\":\"_orientationhorizontalSmall_6o6o0_27\",\"orientationverticalSmall\":\"_orientationverticalSmall_6o6o0_31\",\"orientationhorizontalLarge\":\"_orientationhorizontalLarge_6o6o0_38\",\"orientationverticalLarge\":\"_orientationverticalLarge_6o6o0_42\"}","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  smOrientation,\n  lgOrientation,\n}: {\n  /**\n   * The orientation of the button group\n   *\n   * @defaultValue \"horizontal\"\n   *\n   * Responsive props:\n   * `smOrientation`\n   * `lgOrientation`\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * The size of the button group defines the spacing between each button\n   *\n   * * `sm`: 4px\n   * * `md`: 8px\n   * * `lg`: 12px\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  /**\n   * Bottom margin on sm (480px) or larger viewports.\n   */\n  smOrientation?: typeof orientation;\n  /**\n   * Bottom margin on lg (960px) or larger viewports.\n   */\n  lgOrientation?: typeof orientation;\n}): ReactElement => {\n  const classnames = classNames(\n    styles.buttonGroup,\n    gap[size],\n    smOrientation != null && styles[`orientation${smOrientation}Small`],\n    lgOrientation != null && styles[`orientation${lgOrientation}Large`],\n    {\n      [styles.horizontal]: orientation === \"horizontal\",\n      [styles.vertical]: orientation === \"vertical\",\n    },\n  );\n\n  return <div className={classnames}>{children}</div>;\n};\n\nexport default ButtonGroup;\n"],"mappings":";;;AAAsG,IAAO,6BAAQ,EAAC,eAAc,wBAAuB,cAAa,uBAAsB,YAAW,qBAAoB,YAAW,sBAAqB,aAAY,uBAAsB,YAAW,sBAAqB,8BAA6B,wCAAuC,4BAA2B,sCAAqC,8BAA6B,wCAAuC,4BAA2B,qCAAoC;;;ACGtkB,OAAO,gBAAgB;AA8Dd;AA5DT,IAAM,MAAM;AAAA,EACV,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AACb;AAKA,IAAM,cAAc,CAAC;AAAA,EACnB,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AACF,MAiCoB;AAClB,QAAM,aAAa;AAAA,IACjB,2BAAO;AAAA,IACP,IAAI,IAAI;AAAA,IACR,iBAAiB,QAAQ,2BAAO,cAAc,oBAAoB;AAAA,IAClE,iBAAiB,QAAQ,2BAAO,cAAc,oBAAoB;AAAA,IAClE;AAAA,MACE,CAAC,2BAAO,UAAU,GAAG,gBAAgB;AAAA,MACrC,CAAC,2BAAO,QAAQ,GAAG,gBAAgB;AAAA,IACrC;AAAA,EACF;AAEA,SAAO,oBAAC,SAAI,WAAW,YAAa,UAAS;AAC/C;AAEA,IAAO,sBAAQ;","names":[]}

package/dist/__chunks/{6VFQ76T5.cjs → 4QUXUGJP.cjs}

@@ -1,19 +1,15 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
 
 
-var _F3BQN7NQcjs = require('./F3BQN7NQ.cjs');
-
-
-var _PSFCD7QMcjs = require('./PSFCD7QM.cjs');
-
-
-var _XFWFHRRKcjs = require('./XFWFHRRK.cjs');
-
-
 var _QODNNCT2cjs = require('./QODNNCT2.cjs');
 
 // src/Tabs/Tabs.tsx
 var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+
+// css-module:./Tabs.module.css#css-module
+var Tabs_module_default = { "tabContainerlightBackground": "_tabContainerlightBackground_b6c60_1", "tabContainerDarkBackground": "_tabContainerDarkBackground_b6c60_5", "tab": "_tab_b6c60_1", "selectedTabOnLightBackground": "_selectedTabOnLightBackground_b6c60_13", "selectedTabOnDarkBackground": "_selectedTabOnDarkBackground_b6c60_17", "unselectedTab": "_unselectedTab_b6c60_21", "link": "_link_b6c60_25" };
+
+// src/Tabs/Tabs.tsx
 var _jsxruntime = require('react/jsx-runtime');
 function Tabs({
   children,
@@ -26,8 +22,8 @@ function Tabs({
       role: "tablist",
       "aria-label": accessibilityLabel,
       className: _classnames2.default.call(void 0, {
-        [_XFWFHRRKcjs.Tabs_module_default.tabContainerlightBackground]: on === "lightBackground",
-        [_XFWFHRRKcjs.Tabs_module_default.tabContainerDarkBackground]: on === "darkBackground"
+        [Tabs_module_default.tabContainerlightBackground]: on === "lightBackground",
+        [Tabs_module_default.tabContainerDarkBackground]: on === "darkBackground"
       }),
       children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         _QODNNCT2cjs.Box_default,
@@ -44,10 +40,8 @@ function Tabs({
     }
   );
 }
-Tabs.Button = _PSFCD7QMcjs.TabButton;
-Tabs.Link = _F3BQN7NQcjs.TabLink_default;
 
 
 
 exports.Tabs = Tabs;
-//# sourceMappingURL=6VFQ76T5.cjs.map
+//# sourceMappingURL=4QUXUGJP.cjs.map

package/dist/__chunks/4QUXUGJP.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Tabs/Tabs.tsx","css-module:./Tabs.module.css#css-module"],"names":[],"mappings":";;;;;;AACA,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,+BAA8B,wCAAuC,8BAA6B,uCAAsC,OAAM,gBAAe,gCAA+B,0CAAyC,+BAA8B,yCAAwC,iBAAgB,2BAA0B,QAAO,iBAAgB;;;ADsC9c;AA9BS,SAAR,KAAsB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,KAAK;AACP,GAgBgB;AACd,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,WAAW,WAAW;AAAA,QACpB,CAAC,oBAAO,2BAA2B,GAAG,OAAO;AAAA,QAC7C,CAAC,oBAAO,0BAA0B,GAAG,OAAO;AAAA,MAC9C,CAAC;AAAA,MAED;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,YAAW;AAAA,UACX,gBAAe;AAAA,UACf,OAAM;AAAA,UACN,KAAK;AAAA,UACL,QAAQ;AAAA,UAEP;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ","sourcesContent":["import { type ReactNode } from \"react\";\nimport classnames from \"classnames\";\nimport styles from \"./Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\n/**\n * [Tabs](https://cambly-syntax.vercel.app/?path=/docs/components-tabs--docs) are used to organize content into different sections.\n */\nexport default function Tabs({\n  children,\n  accessibilityLabel,\n  on = \"lightBackground\",\n}: {\n  /**\n   * The Tabs to display. Each Tab should be a `TabButton` or a `TabLink`.\n   * Only use `TabLink` for clicking tab that update the URL upon selection. Otherwise, use `TabButton`.\n   */\n  children: ReactNode;\n  /**\n   * Accessibility label for the Tabs container.\n   */\n  accessibilityLabel: string;\n  /**\n   * Indicate whether the Tabs render on a light or dark background.\n   *\n   * @defaulValue `lightBackground`\n   */\n  on?: \"lightBackground\" | \"darkBackground\";\n}): JSX.Element {\n  return (\n    <div\n      role=\"tablist\"\n      aria-label={accessibilityLabel}\n      className={classnames({\n        [styles.tabContainerlightBackground]: on === \"lightBackground\",\n        [styles.tabContainerDarkBackground]: on === \"darkBackground\",\n      })}\n    >\n      <Box\n        display=\"flex\"\n        alignItems=\"center\"\n        justifyContent=\"start\"\n        width=\"100%\"\n        gap={8}\n        height={56}\n      >\n        {children}\n      </Box>\n    </div>\n  );\n}\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Tabs/Tabs.module.css\"; export default {\"tabContainerlightBackground\":\"_tabContainerlightBackground_b6c60_1\",\"tabContainerDarkBackground\":\"_tabContainerDarkBackground_b6c60_5\",\"tab\":\"_tab_b6c60_1\",\"selectedTabOnLightBackground\":\"_selectedTabOnLightBackground_b6c60_13\",\"selectedTabOnDarkBackground\":\"_selectedTabOnDarkBackground_b6c60_17\",\"unselectedTab\":\"_unselectedTab_b6c60_21\",\"link\":\"_link_b6c60_25\"}"]}

package/dist/__chunks/{QC2DQIRT.js → 5HWHJRVZ.js}

@@ -10,4 +10,4 @@ export {
   ColorBaseGray700,
   ColorCambioWhite100
 };
-//# sourceMappingURL=QC2DQIRT.js.map
+//# sourceMappingURL=5HWHJRVZ.js.map

package/dist/__chunks/{QC2DQIRT.js.map → 5HWHJRVZ.js.map}

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

package/dist/__chunks/6KSVCCCB.cjs

@@ -0,0 +1,38 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
+
+// css-module:./ButtonGroup.module.css#css-module
+var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_6o6o0_1", "horizontal": "_horizontal_6o6o0_5", "vertical": "_vertical_6o6o0_9", "smallGap": "_smallGap_6o6o0_13", "mediumGap": "_mediumGap_6o6o0_17", "largeGap": "_largeGap_6o6o0_21", "orientationhorizontalSmall": "_orientationhorizontalSmall_6o6o0_27", "orientationverticalSmall": "_orientationverticalSmall_6o6o0_31", "orientationhorizontalLarge": "_orientationhorizontalLarge_6o6o0_38", "orientationverticalLarge": "_orientationverticalLarge_6o6o0_42" };
+
+// src/ButtonGroup/ButtonGroup.tsx
+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,
+  lg: ButtonGroup_module_default.largeGap
+};
+var ButtonGroup = ({
+  orientation = "horizontal",
+  size = "md",
+  children,
+  smOrientation,
+  lgOrientation
+}) => {
+  const classnames = _classnames2.default.call(void 0, 
+    ButtonGroup_module_default.buttonGroup,
+    gap[size],
+    smOrientation != null && ButtonGroup_module_default[`orientation${smOrientation}Small`],
+    lgOrientation != null && ButtonGroup_module_default[`orientation${lgOrientation}Large`],
+    {
+      [ButtonGroup_module_default.horizontal]: orientation === "horizontal",
+      [ButtonGroup_module_default.vertical]: orientation === "vertical"
+    }
+  );
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: classnames, children });
+};
+var ButtonGroup_default = ButtonGroup;
+
+
+
+exports.ButtonGroup_default = ButtonGroup_default;
+//# sourceMappingURL=6KSVCCCB.cjs.map

package/dist/__chunks/6KSVCCCB.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,sBAAqB,8BAA6B,wCAAuC,4BAA2B,sCAAqC,8BAA6B,wCAAuC,4BAA2B,qCAAoC;;;ACGtkB,OAAO,gBAAgB;AA8Dd;AA5DT,IAAM,MAAM;AAAA,EACV,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AACb;AAKA,IAAM,cAAc,CAAC;AAAA,EACnB,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AACF,MAiCoB;AAClB,QAAM,aAAa;AAAA,IACjB,2BAAO;AAAA,IACP,IAAI,IAAI;AAAA,IACR,iBAAiB,QAAQ,2BAAO,cAAc,oBAAoB;AAAA,IAClE,iBAAiB,QAAQ,2BAAO,cAAc,oBAAoB;AAAA,IAClE;AAAA,MACE,CAAC,2BAAO,UAAU,GAAG,gBAAgB;AAAA,MACrC,CAAC,2BAAO,QAAQ,GAAG,gBAAgB;AAAA,IACrC;AAAA,EACF;AAEA,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_6o6o0_1\",\"horizontal\":\"_horizontal_6o6o0_5\",\"vertical\":\"_vertical_6o6o0_9\",\"smallGap\":\"_smallGap_6o6o0_13\",\"mediumGap\":\"_mediumGap_6o6o0_17\",\"largeGap\":\"_largeGap_6o6o0_21\",\"orientationhorizontalSmall\":\"_orientationhorizontalSmall_6o6o0_27\",\"orientationverticalSmall\":\"_orientationverticalSmall_6o6o0_31\",\"orientationhorizontalLarge\":\"_orientationhorizontalLarge_6o6o0_38\",\"orientationverticalLarge\":\"_orientationverticalLarge_6o6o0_42\"}","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  smOrientation,\n  lgOrientation,\n}: {\n  /**\n   * The orientation of the button group\n   *\n   * @defaultValue \"horizontal\"\n   *\n   * Responsive props:\n   * `smOrientation`\n   * `lgOrientation`\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * The size of the button group defines the spacing between each button\n   *\n   * * `sm`: 4px\n   * * `md`: 8px\n   * * `lg`: 12px\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  /**\n   * Bottom margin on sm (480px) or larger viewports.\n   */\n  smOrientation?: typeof orientation;\n  /**\n   * Bottom margin on lg (960px) or larger viewports.\n   */\n  lgOrientation?: typeof orientation;\n}): ReactElement => {\n  const classnames = classNames(\n    styles.buttonGroup,\n    gap[size],\n    smOrientation != null && styles[`orientation${smOrientation}Small`],\n    lgOrientation != null && styles[`orientation${lgOrientation}Large`],\n    {\n      [styles.horizontal]: orientation === \"horizontal\",\n      [styles.vertical]: orientation === \"vertical\",\n    },\n  );\n\n  return <div className={classnames}>{children}</div>;\n};\n\nexport default ButtonGroup;\n"]}

package/dist/__chunks/{XFWFHRRK.cjs → 7DGFMDT7.cjs}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
-// css-module:./Tabs.module.css#css-module
+// css-module:../Tabs/Tabs.module.css#css-module
 var Tabs_module_default = { "tabContainerlightBackground": "_tabContainerlightBackground_b6c60_1", "tabContainerDarkBackground": "_tabContainerDarkBackground_b6c60_5", "tab": "_tab_b6c60_1", "selectedTabOnLightBackground": "_selectedTabOnLightBackground_b6c60_13", "selectedTabOnDarkBackground": "_selectedTabOnDarkBackground_b6c60_17", "unselectedTab": "_unselectedTab_b6c60_21", "link": "_link_b6c60_25" };
 
 
 
 exports.Tabs_module_default = Tabs_module_default;
-//# sourceMappingURL=XFWFHRRK.cjs.map
+//# sourceMappingURL=7DGFMDT7.cjs.map

package/dist/__chunks/7DGFMDT7.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["css-module:../Tabs/Tabs.module.css#css-module"],"names":[],"mappings":";;;AAAwF,IAAO,sBAAQ,EAAC,+BAA8B,wCAAuC,8BAA6B,uCAAsC,OAAM,gBAAe,gCAA+B,0CAAyC,+BAA8B,yCAAwC,iBAAgB,2BAA0B,QAAO,iBAAgB","sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Tabs/Tabs.module.css\"; export default {\"tabContainerlightBackground\":\"_tabContainerlightBackground_b6c60_1\",\"tabContainerDarkBackground\":\"_tabContainerDarkBackground_b6c60_5\",\"tab\":\"_tab_b6c60_1\",\"selectedTabOnLightBackground\":\"_selectedTabOnLightBackground_b6c60_13\",\"selectedTabOnDarkBackground\":\"_selectedTabOnDarkBackground_b6c60_17\",\"unselectedTab\":\"_unselectedTab_b6c60_21\",\"link\":\"_link_b6c60_25\"}"]}

package/dist/__chunks/{O7HX76KZ.js → F2ZYHRNY.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   Tabs_module_default
-} from "./3HA2NC7Q.js";
+} from "./VV2NJABK.js";
 import {
   TabInternal
 } from "./PBHAJ42K.js";
@@ -9,7 +9,7 @@ import {
   Box_default
 } from "./IB6JZQF3.js";
 
-// src/Tabs/TabLink.tsx
+// src/TabLink/TabLink.tsx
 import {
   forwardRef
 } from "react";
@@ -72,4 +72,4 @@ var TabLink_default = TabLink;
 export {
   TabLink_default
 };
-//# sourceMappingURL=O7HX76KZ.js.map
+//# sourceMappingURL=F2ZYHRNY.js.map

package/dist/__chunks/F2ZYHRNY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/TabLink/TabLink.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport TabInternal from \"../Tabs/TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"../Tabs/Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\ntype TabLinkProps = ComponentProps<typeof TabInternal> & {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The link that the Tab should route to.\n   *\n   */\n  href?: string;\n  /**\n   * The target attribute specifies where to open the linked document.\n   *\n   */\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  /**\n   * The rel attribute specifies the relationship between the document and the link.\n   *\n   */\n  rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\n  /**\n   * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n   */\n  onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\nconst TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n  (\n    {\n      text,\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      on = \"lightBackground\",\n      onClick,\n      selected,\n      endContent,\n      itemCount,\n    }: TabLinkProps,\n    ref,\n  ) => {\n    return (\n      <div\n        role=\"tab\"\n        className={classnames(styles.tab, {\n          [styles.unselectedTab]: !selected,\n          [styles.selectedTabOnLightBackground]:\n            selected && on === \"lightBackground\",\n          [styles.selectedTabOnDarkBackground]:\n            selected && on === \"darkBackground\",\n        })}\n        style={{\n          height: \"100%\",\n        }}\n      >\n        <Box display=\"flex\" alignItems=\"center\" height=\"100%\">\n          <a\n            href={href}\n            data-testid={dataTestId}\n            target={target}\n            ref={ref}\n            rel={rel}\n            onClick={onClick}\n            className={styles.link}\n          >\n            <TabInternal\n              text={text}\n              selected={selected}\n              endContent={endContent}\n              itemCount={itemCount}\n              on={on}\n            />\n          </a>\n        </Box>\n      </div>\n    );\n  },\n);\n\nTabLink.displayName = \"TabLink\";\n\nexport default TabLink;\n"],"mappings":";;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AAEP,OAAO,gBAAgB;AAsEX;AAxCZ,IAAM,UAAU;AAAA,EACd,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW,WAAW,oBAAO,KAAK;AAAA,UAChC,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,UACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,UACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,QACvB,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,QACV;AAAA,QAEA,8BAAC,eAAI,SAAQ,QAAO,YAAW,UAAS,QAAO,QAC7C;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,oBAAO;AAAA,YAElB;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ;","names":[]}

package/dist/__chunks/{5ROYTORI.cjs → HZ3SCLC7.cjs}

@@ -9,12 +9,12 @@ var _3RX4RMGCcjs = require('./3RX4RMGC.cjs');
 
 
 
-var _LP2VGTTEcjs = require('./LP2VGTTE.cjs');
+var _RH52UDEBcjs = require('./RH52UDEB.cjs');
 
 
 
 
-var _CJHYDIEVcjs = require('./CJHYDIEV.cjs');
+var _ZZPX5ZUMcjs = require('./ZZPX5ZUM.cjs');
 
 
 var _EHZAOGLQcjs = require('./EHZAOGLQ.cjs');
@@ -103,11 +103,11 @@ function RichSelectList(props) {
   const disabled = !isHydrated || disabledProp;
   const overlayHandlerRef = _react.useRef.call(void 0, {});
   const selectedKeysProp = _react.useMemo.call(void 0, 
-    () => _CJHYDIEVcjs.convertSelection.call(void 0, selectedValuesProp),
+    () => _ZZPX5ZUMcjs.convertSelection.call(void 0, selectedValuesProp),
     [selectedValuesProp]
   );
   const defaultSelectedKeys = _react.useMemo.call(void 0, 
-    () => _CJHYDIEVcjs.convertSelection.call(void 0, defaultSelectedValuesProp, /* @__PURE__ */ new Set()),
+    () => _ZZPX5ZUMcjs.convertSelection.call(void 0, defaultSelectedValuesProp, /* @__PURE__ */ new Set()),
     [defaultSelectedValuesProp]
   );
   const [selectedKeys, setSelectedKeys] = _utils.useControlledState.call(void 0, 
@@ -147,12 +147,12 @@ function RichSelectList(props) {
   };
   const getArrowIconColor = () => {
     if (errorText) {
-      return _LP2VGTTEcjs.ColorBaseDestructive700;
+      return _RH52UDEBcjs.ColorBaseDestructive700;
     } else {
       if (color === "clear") {
-        return _LP2VGTTEcjs.ColorCambioWhite100;
+        return _RH52UDEBcjs.ColorCambioWhite100;
       } else {
-        return _LP2VGTTEcjs.ColorBaseGray700;
+        return _RH52UDEBcjs.ColorBaseGray700;
       }
     }
   };
@@ -160,7 +160,7 @@ function RichSelectList(props) {
     _reactariacomponents.Provider,
     {
       values: [
-        [_CJHYDIEVcjs.RichSelectBoxContext, { autoFocus: true }],
+        [_ZZPX5ZUMcjs.RichSelectBoxContext, { autoFocus: true }],
         [_3RX4RMGCcjs.DialogContext, { padding: autosave ? void 0 : 0 }]
         // this is altering Popover's internal dialog padding to show the sticky save/close buttons. Ideally this could be avoided
       ],
@@ -201,7 +201,7 @@ function RichSelectList(props) {
                       dangerouslySetInlineStyle: autosave ? void 0 : { __style: { paddingBottom: 0 } },
                       role: "menu",
                       children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        _CJHYDIEVcjs.RichSelectBox_default,
+                        _ZZPX5ZUMcjs.RichSelectBox_default,
                         _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
                           autosave,
                           selectedValues: selectedKeys,
@@ -286,4 +286,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 
 
 exports.RichSelectList_default = RichSelectList_default;
-//# sourceMappingURL=5ROYTORI.cjs.map
+//# sourceMappingURL=HZ3SCLC7.cjs.map

package/dist/__chunks/{PSFCD7QM.cjs → ML36DCKL.cjs}

@@ -4,7 +4,7 @@
 var _3UEOKPM2cjs = require('./3UEOKPM2.cjs');
 
 
-var _XFWFHRRKcjs = require('./XFWFHRRK.cjs');
+var _7DGFMDT7cjs = require('./7DGFMDT7.cjs');
 
 
 var _S4JNYLMAcjs = require('./S4JNYLMA.cjs');
@@ -12,7 +12,7 @@ var _S4JNYLMAcjs = require('./S4JNYLMA.cjs');
 
 var _QODNNCT2cjs = require('./QODNNCT2.cjs');
 
-// src/Tabs/TabButton.tsx
+// src/TabButton/TabButton.tsx
 var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
 var _jsxruntime = require('react/jsx-runtime');
 function TabButton({
@@ -29,10 +29,10 @@ function TabButton({
     "div",
     {
       role: "tab",
-      className: _classnames2.default.call(void 0, _XFWFHRRKcjs.Tabs_module_default.tab, {
-        [_XFWFHRRKcjs.Tabs_module_default.unselectedTab]: !selected,
-        [_XFWFHRRKcjs.Tabs_module_default.selectedTabOnLightBackground]: selected && on === "lightBackground",
-        [_XFWFHRRKcjs.Tabs_module_default.selectedTabOnDarkBackground]: selected && on === "darkBackground"
+      className: _classnames2.default.call(void 0, _7DGFMDT7cjs.Tabs_module_default.tab, {
+        [_7DGFMDT7cjs.Tabs_module_default.unselectedTab]: !selected,
+        [_7DGFMDT7cjs.Tabs_module_default.selectedTabOnLightBackground]: selected && on === "lightBackground",
+        [_7DGFMDT7cjs.Tabs_module_default.selectedTabOnDarkBackground]: selected && on === "darkBackground"
       }),
       style: {
         height: "100%"
@@ -64,4 +64,4 @@ function TabButton({
 
 
 exports.TabButton = TabButton;
-//# sourceMappingURL=PSFCD7QM.cjs.map
+//# sourceMappingURL=ML36DCKL.cjs.map

package/dist/__chunks/ML36DCKL.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/TabButton/TabButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AACA,OAAO,gBAAgB;AAmDb;AA7CK,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,KAAK;AACP,GAaiB;AACf,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,WAAW,oBAAO,KAAK;AAAA,QAChC,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,QACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,QACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,MACvB,CAAC;AAAA,MACD,OAAO;AAAA,QACL,QAAQ;AAAA,MACV;AAAA,MAEA,8BAAC,eAAI,SAAQ,QAAO,WAAU,OAAM,YAAW,UAAS,QAAO,QAC7D;AAAA,QAAC;AAAA;AAAA,UACC,WAAW;AAAA,UACX;AAAA,UACA,UAAS;AAAA,UACT,eAAa;AAAA,UACb;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA;AAAA,UACF;AAAA;AAAA,MACF,GACF;AAAA;AAAA,EACF;AAEJ","sourcesContent":["import { type ReactElement, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\nimport TapArea from \"../TapArea/TapArea\";\nimport TabInternal from \"../Tabs/TabInternal\";\nimport styles from \"../Tabs/Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\nexport default function TabButton({\n  text,\n  onClick,\n  selected,\n  endContent,\n  itemCount,\n  accessibilityLabel,\n  \"data-testid\": dataTestId,\n  on = \"lightBackground\",\n}: ComponentProps<typeof TabInternal> & {\n  /**\n   * The onClick event for the button\n   */\n  onClick: () => void;\n  /**\n   * The label to be used for accessibility\n   */\n  accessibilityLabel?: string;\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n}): ReactElement {\n  return (\n    <div\n      role=\"tab\"\n      className={classnames(styles.tab, {\n        [styles.unselectedTab]: !selected,\n        [styles.selectedTabOnLightBackground]:\n          selected && on === \"lightBackground\",\n        [styles.selectedTabOnDarkBackground]:\n          selected && on === \"darkBackground\",\n      })}\n      style={{\n        height: \"100%\",\n      }}\n    >\n      <Box display=\"flex\" direction=\"row\" alignItems=\"center\" height=\"100%\">\n        <TapArea\n          fullWidth={false}\n          onClick={onClick}\n          rounding=\"md\"\n          data-testid={dataTestId}\n          accessibilityLabel={accessibilityLabel}\n        >\n          <TabInternal\n            text={text}\n            selected={selected}\n            endContent={endContent}\n            itemCount={itemCount}\n            on={on}\n          />\n        </TapArea>\n      </Box>\n    </div>\n  );\n}\n"]}

package/dist/__chunks/{LZDRADUP.js → NXOKB47G.js}

@@ -9,12 +9,12 @@ import {
   ColorBaseDestructive700,
   ColorBaseGray700,
   ColorCambioWhite100
-} from "./QC2DQIRT.js";
+} from "./5HWHJRVZ.js";
 import {
   RichSelectBoxContext,
   RichSelectBox_default,
   convertSelection
-} from "./DJ6R47YF.js";
+} from "./U6TGYOG7.js";
 import {
   RichSelectSection_default
 } from "./AHICHJTL.js";
@@ -286,4 +286,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 export {
   RichSelectList_default
 };
-//# sourceMappingURL=LZDRADUP.js.map
+//# sourceMappingURL=NXOKB47G.js.map

package/dist/__chunks/{F3BQN7NQ.cjs → OBQBJKAY.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
 
 
-var _XFWFHRRKcjs = require('./XFWFHRRK.cjs');
+var _7DGFMDT7cjs = require('./7DGFMDT7.cjs');
 
 
 var _S4JNYLMAcjs = require('./S4JNYLMA.cjs');
@@ -9,7 +9,7 @@ var _S4JNYLMAcjs = require('./S4JNYLMA.cjs');
 
 var _QODNNCT2cjs = require('./QODNNCT2.cjs');
 
-// src/Tabs/TabLink.tsx
+// src/TabLink/TabLink.tsx
 
 
 var _react = require('react');
@@ -32,10 +32,10 @@ var TabLink = _react.forwardRef.call(void 0,
       "div",
       {
         role: "tab",
-        className: _classnames2.default.call(void 0, _XFWFHRRKcjs.Tabs_module_default.tab, {
-          [_XFWFHRRKcjs.Tabs_module_default.unselectedTab]: !selected,
-          [_XFWFHRRKcjs.Tabs_module_default.selectedTabOnLightBackground]: selected && on === "lightBackground",
-          [_XFWFHRRKcjs.Tabs_module_default.selectedTabOnDarkBackground]: selected && on === "darkBackground"
+        className: _classnames2.default.call(void 0, _7DGFMDT7cjs.Tabs_module_default.tab, {
+          [_7DGFMDT7cjs.Tabs_module_default.unselectedTab]: !selected,
+          [_7DGFMDT7cjs.Tabs_module_default.selectedTabOnLightBackground]: selected && on === "lightBackground",
+          [_7DGFMDT7cjs.Tabs_module_default.selectedTabOnDarkBackground]: selected && on === "darkBackground"
         }),
         style: {
           height: "100%"
@@ -49,7 +49,7 @@ var TabLink = _react.forwardRef.call(void 0,
             ref,
             rel,
             onClick,
-            className: _XFWFHRRKcjs.Tabs_module_default.link,
+            className: _7DGFMDT7cjs.Tabs_module_default.link,
             children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               _S4JNYLMAcjs.TabInternal,
               {
@@ -72,4 +72,4 @@ var TabLink_default = TabLink;
 
 
 exports.TabLink_default = TabLink_default;
-//# sourceMappingURL=F3BQN7NQ.cjs.map
+//# sourceMappingURL=OBQBJKAY.cjs.map

package/dist/__chunks/OBQBJKAY.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/TabLink/TabLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AAEP,OAAO,gBAAgB;AAsEX;AAxCZ,IAAM,UAAU;AAAA,EACd,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW,WAAW,oBAAO,KAAK;AAAA,UAChC,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,UACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,UACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,QACvB,CAAC;AAAA,QACD,OAAO;AAAA,UACL,QAAQ;AAAA,QACV;AAAA,QAEA,8BAAC,eAAI,SAAQ,QAAO,YAAW,UAAS,QAAO,QAC7C;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,oBAAO;AAAA,YAElB;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ","sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport TabInternal from \"../Tabs/TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"../Tabs/Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\ntype TabLinkProps = ComponentProps<typeof TabInternal> & {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The link that the Tab should route to.\n   *\n   */\n  href?: string;\n  /**\n   * The target attribute specifies where to open the linked document.\n   *\n   */\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  /**\n   * The rel attribute specifies the relationship between the document and the link.\n   *\n   */\n  rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\n  /**\n   * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n   */\n  onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\nconst TabLink = forwardRef<HTMLAnchorElement, TabLinkProps>(\n  (\n    {\n      text,\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      on = \"lightBackground\",\n      onClick,\n      selected,\n      endContent,\n      itemCount,\n    }: TabLinkProps,\n    ref,\n  ) => {\n    return (\n      <div\n        role=\"tab\"\n        className={classnames(styles.tab, {\n          [styles.unselectedTab]: !selected,\n          [styles.selectedTabOnLightBackground]:\n            selected && on === \"lightBackground\",\n          [styles.selectedTabOnDarkBackground]:\n            selected && on === \"darkBackground\",\n        })}\n        style={{\n          height: \"100%\",\n        }}\n      >\n        <Box display=\"flex\" alignItems=\"center\" height=\"100%\">\n          <a\n            href={href}\n            data-testid={dataTestId}\n            target={target}\n            ref={ref}\n            rel={rel}\n            onClick={onClick}\n            className={styles.link}\n          >\n            <TabInternal\n              text={text}\n              selected={selected}\n              endContent={endContent}\n              itemCount={itemCount}\n              on={on}\n            />\n          </a>\n        </Box>\n      </div>\n    );\n  },\n);\n\nTabLink.displayName = \"TabLink\";\n\nexport default TabLink;\n"]}

package/dist/__chunks/{LP2VGTTE.cjs → RH52UDEB.cjs}

@@ -10,4 +10,4 @@ var ColorCambioWhite100 = "#ffffff";
 
 
 exports.ColorBaseDestructive700 = ColorBaseDestructive700; exports.ColorBaseGray700 = ColorBaseGray700; exports.ColorCambioWhite100 = ColorCambioWhite100;
-//# sourceMappingURL=LP2VGTTE.cjs.map
+//# sourceMappingURL=RH52UDEB.cjs.map

package/dist/__chunks/{LP2VGTTE.cjs.map → RH52UDEB.cjs.map}

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

package/dist/__chunks/{YJVUWE3C.cjs → SN7NPTN4.cjs}

@@ -3,7 +3,7 @@
 
 
 
-var _LP2VGTTEcjs = require('./LP2VGTTE.cjs');
+var _RH52UDEBcjs = require('./RH52UDEB.cjs');
 
 
 var _XLUVINJWcjs = require('./XLUVINJW.cjs');
@@ -68,12 +68,12 @@ function SelectList({
   };
   const getArrowIconColor = () => {
     if (errorText) {
-      return _LP2VGTTEcjs.ColorBaseDestructive700;
+      return _RH52UDEBcjs.ColorBaseDestructive700;
     } else {
       if (color === "clear") {
-        return _LP2VGTTEcjs.ColorCambioWhite100;
+        return _RH52UDEBcjs.ColorCambioWhite100;
       } else {
-        return _LP2VGTTEcjs.ColorBaseGray700;
+        return _RH52UDEBcjs.ColorBaseGray700;
       }
     }
   };
@@ -148,4 +148,4 @@ SelectList.Option = _JVGX637Ecjs.SelectOption_default;
 
 
 exports.SelectList = SelectList;
-//# sourceMappingURL=YJVUWE3C.cjs.map
+//# sourceMappingURL=SN7NPTN4.cjs.map

package/dist/__chunks/{XRGALIPY.js → T3UI6LNR.js}

@@ -3,7 +3,7 @@ import {
   ColorBaseDestructive700,
   ColorBaseGray700,
   ColorCambioWhite100
-} from "./QC2DQIRT.js";
+} from "./5HWHJRVZ.js";
 import {
   Focus_module_default
 } from "./KKADUD65.js";
@@ -148,4 +148,4 @@ SelectList.Option = SelectOption_default;
 export {
   SelectList
 };
-//# sourceMappingURL=XRGALIPY.js.map
+//# sourceMappingURL=T3UI6LNR.js.map

package/dist/__chunks/{L6U2V7ZR.js → TG2RCNZT.js}

@@ -4,7 +4,7 @@ import {
 } from "./77FFPQY6.js";
 import {
   Tabs_module_default
-} from "./3HA2NC7Q.js";
+} from "./VV2NJABK.js";
 import {
   TabInternal
 } from "./PBHAJ42K.js";
@@ -12,7 +12,7 @@ import {
   Box_default
 } from "./IB6JZQF3.js";
 
-// src/Tabs/TabButton.tsx
+// src/TabButton/TabButton.tsx
 import classnames from "classnames";
 import { jsx } from "react/jsx-runtime";
 function TabButton({
@@ -64,4 +64,4 @@ function TabButton({
 export {
   TabButton
 };
-//# sourceMappingURL=L6U2V7ZR.js.map
+//# sourceMappingURL=TG2RCNZT.js.map

package/dist/__chunks/TG2RCNZT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/TabButton/TabButton.tsx"],"sourcesContent":["import { type ReactElement, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\nimport TapArea from \"../TapArea/TapArea\";\nimport TabInternal from \"../Tabs/TabInternal\";\nimport styles from \"../Tabs/Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\nexport default function TabButton({\n  text,\n  onClick,\n  selected,\n  endContent,\n  itemCount,\n  accessibilityLabel,\n  \"data-testid\": dataTestId,\n  on = \"lightBackground\",\n}: ComponentProps<typeof TabInternal> & {\n  /**\n   * The onClick event for the button\n   */\n  onClick: () => void;\n  /**\n   * The label to be used for accessibility\n   */\n  accessibilityLabel?: string;\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n}): ReactElement {\n  return (\n    <div\n      role=\"tab\"\n      className={classnames(styles.tab, {\n        [styles.unselectedTab]: !selected,\n        [styles.selectedTabOnLightBackground]:\n          selected && on === \"lightBackground\",\n        [styles.selectedTabOnDarkBackground]:\n          selected && on === \"darkBackground\",\n      })}\n      style={{\n        height: \"100%\",\n      }}\n    >\n      <Box display=\"flex\" direction=\"row\" alignItems=\"center\" height=\"100%\">\n        <TapArea\n          fullWidth={false}\n          onClick={onClick}\n          rounding=\"md\"\n          data-testid={dataTestId}\n          accessibilityLabel={accessibilityLabel}\n        >\n          <TabInternal\n            text={text}\n            selected={selected}\n            endContent={endContent}\n            itemCount={itemCount}\n            on={on}\n          />\n        </TapArea>\n      </Box>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AACA,OAAO,gBAAgB;AAmDb;AA7CK,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,KAAK;AACP,GAaiB;AACf,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,WAAW,oBAAO,KAAK;AAAA,QAChC,CAAC,oBAAO,aAAa,GAAG,CAAC;AAAA,QACzB,CAAC,oBAAO,4BAA4B,GAClC,YAAY,OAAO;AAAA,QACrB,CAAC,oBAAO,2BAA2B,GACjC,YAAY,OAAO;AAAA,MACvB,CAAC;AAAA,MACD,OAAO;AAAA,QACL,QAAQ;AAAA,MACV;AAAA,MAEA,8BAAC,eAAI,SAAQ,QAAO,WAAU,OAAM,YAAW,UAAS,QAAO,QAC7D;AAAA,QAAC;AAAA;AAAA,UACC,WAAW;AAAA,UACX;AAAA,UACA,UAAS;AAAA,UACT,eAAa;AAAA,UACb;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA;AAAA,UACF;AAAA;AAAA,MACF,GACF;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/__chunks/{DJ6R47YF.js → U6TGYOG7.js}

@@ -1,7 +1,7 @@
 "use client"
 import {
   ButtonGroup_default
-} from "./BOX3VY3Q.js";
+} from "./36DG472B.js";
 import {
   Button_default
 } from "./BIW5AZCF.js";
@@ -208,4 +208,4 @@ export {
   RichSelectBoxContext,
   RichSelectBox_default
 };
-//# sourceMappingURL=DJ6R47YF.js.map
+//# sourceMappingURL=U6TGYOG7.js.map