@cambly/syntax-core 18.13.0 → 19.1.0

package/dist/index.cjs

@@ -4,19 +4,19 @@
 var _GQUBAKFOcjs = require('./__chunks/GQUBAKFO.cjs');
 
 
-var _E3A6VFMBcjs = require('./__chunks/E3A6VFMB.cjs');
+var _GEXK47GRcjs = require('./__chunks/GEXK47GR.cjs');
 
 
-var _GEXK47GRcjs = require('./__chunks/GEXK47GR.cjs');
+var _AVJQ2E2Gcjs = require('./__chunks/AVJQ2E2G.cjs');
 
 
-var _IBT4YOI5cjs = require('./__chunks/IBT4YOI5.cjs');
+var _E3A6VFMBcjs = require('./__chunks/E3A6VFMB.cjs');
 
 
-var _OVHMMIVEcjs = require('./__chunks/OVHMMIVE.cjs');
+var _IBT4YOI5cjs = require('./__chunks/IBT4YOI5.cjs');
 
 
-var _AVJQ2E2Gcjs = require('./__chunks/AVJQ2E2G.cjs');
+var _OVHMMIVEcjs = require('./__chunks/OVHMMIVE.cjs');
 
 
 var _3Y6HGWJGcjs = require('./__chunks/3Y6HGWJG.cjs');
@@ -35,10 +35,11 @@ var _RUXLZWRZcjs = require('./__chunks/RUXLZWRZ.cjs');
 require('./__chunks/TH4TA3JN.cjs');
 
 
-var _BCWRGKWLcjs = require('./__chunks/BCWRGKWL.cjs');
+var _A4EEJRTWcjs = require('./__chunks/A4EEJRTW.cjs');
+require('./__chunks/JVGX637E.cjs');
 
 
-var _TJDFEWPTcjs = require('./__chunks/TJDFEWPT.cjs');
+var _A2MUYVOPcjs = require('./__chunks/A2MUYVOP.cjs');
 
 
 var _B6775YJ4cjs = require('./__chunks/B6775YJ4.cjs');
@@ -48,14 +49,14 @@ require('./__chunks/3RX4RMGC.cjs');
 
 var _PZEDDYBZcjs = require('./__chunks/PZEDDYBZ.cjs');
 require('./__chunks/WFVGNGEP.cjs');
-require('./__chunks/C46WMA7X.cjs');
-require('./__chunks/ZZPX5ZUM.cjs');
+require('./__chunks/DDS2EDAA.cjs');
+require('./__chunks/OMXDPTE4.cjs');
 
 
 var _6KSVCCCBcjs = require('./__chunks/6KSVCCCB.cjs');
 
 
-var _RIAJV3ZHcjs = require('./__chunks/RIAJV3ZH.cjs');
+var _BFEZ3PUTcjs = require('./__chunks/BFEZ3PUT.cjs');
 
 
 var _A3B4YKGNcjs = require('./__chunks/A3B4YKGN.cjs');
@@ -64,7 +65,11 @@ require('./__chunks/3P2PWHOU.cjs');
 require('./__chunks/65BTPZZT.cjs');
 require('./__chunks/EHZAOGLQ.cjs');
 require('./__chunks/MF7LLV7V.cjs');
-require('./__chunks/FQSSK4FT.cjs');
+require('./__chunks/66VTCVJA.cjs');
+
+
+var _4AI6GQ5Ucjs = require('./__chunks/4AI6GQ5U.cjs');
+require('./__chunks/XLUVINJW.cjs');
 require('./__chunks/URBKDUMU.cjs');
 
 
@@ -72,8 +77,7 @@ var _IHGDCH62cjs = require('./__chunks/IHGDCH62.cjs');
 require('./__chunks/RYUXG4AS.cjs');
 
 
-var _4AI6GQ5Ucjs = require('./__chunks/4AI6GQ5U.cjs');
-require('./__chunks/XLUVINJW.cjs');
+var _36JMUQOLcjs = require('./__chunks/36JMUQOL.cjs');
 
 
 var _5NI7VPKScjs = require('./__chunks/5NI7VPKS.cjs');
@@ -83,24 +87,31 @@ var _AUO7CEJIcjs = require('./__chunks/AUO7CEJI.cjs');
 
 
 
-var _6VFQ76T5cjs = require('./__chunks/6VFQ76T5.cjs');
-require('./__chunks/F3BQN7NQ.cjs');
-require('./__chunks/PSFCD7QM.cjs');
+var _4QUXUGJPcjs = require('./__chunks/4QUXUGJP.cjs');
 
 
-var _3UEOKPM2cjs = require('./__chunks/3UEOKPM2.cjs');
-require('./__chunks/XFWFHRRK.cjs');
-require('./__chunks/S4JNYLMA.cjs');
+var _OBQBJKAYcjs = require('./__chunks/OBQBJKAY.cjs');
 
 
-var _QODNNCT2cjs = require('./__chunks/QODNNCT2.cjs');
-require('./__chunks/JVGX637E.cjs');
+var _ML36DCKLcjs = require('./__chunks/ML36DCKL.cjs');
+
+
+var _3UEOKPM2cjs = require('./__chunks/3UEOKPM2.cjs');
+require('./__chunks/7DGFMDT7.cjs');
+
+require('./__chunks/S4JNYLMA.cjs');
 require('./__chunks/RXQBNEFR.cjs');
 require('./__chunks/2D3DOVVZ.cjs');
 require('./__chunks/F3SUJGZL.cjs');
 require('./__chunks/UKQIAZA5.cjs');
 
 
+var _K3AY5BI4cjs = require('./__chunks/K3AY5BI4.cjs');
+
+
+var _QODNNCT2cjs = require('./__chunks/QODNNCT2.cjs');
+
+
 var _UXSGTOGUcjs = require('./__chunks/UXSGTOGU.cjs');
 require('./__chunks/PLUVW6AM.cjs');
 require('./__chunks/IL22HCBF.cjs');
@@ -113,9 +124,6 @@ var _5NQO6SP3cjs = require('./__chunks/5NQO6SP3.cjs');
 require('./__chunks/BDCZ5GX7.cjs');
 require('./__chunks/2XIVACBM.cjs');
 
-
-
-var _36JMUQOLcjs = require('./__chunks/36JMUQOL.cjs');
 require('./__chunks/K4AUV2VK.cjs');
 require('./__chunks/NOELZTQX.cjs');
 require('./__chunks/LLFHCGRA.cjs');
@@ -151,5 +159,8 @@ require('./__chunks/X2SDR4SD.cjs');
 
 
 
-exports.Avatar = _GQUBAKFOcjs.Avatar_default; exports.AvatarGroup = _GEXK47GRcjs.AvatarGroup; exports.Badge = _E3A6VFMBcjs.Badge_default; exports.Box = _QODNNCT2cjs.Box_default; exports.Button = _RIAJV3ZHcjs.Button_default; exports.ButtonGroup = _6KSVCCCBcjs.ButtonGroup_default; exports.Card = _AVJQ2E2Gcjs.Card_default; exports.Checkbox = _OVHMMIVEcjs.Checkbox_default; exports.Chip = _IHGDCH62cjs.Chip_default; exports.Divider = _A3B4YKGNcjs.Divider; exports.Heading = _CCKTB7L5cjs.Heading_default; exports.Icon = _IBT4YOI5cjs.Icon_default; exports.IconButton = _PZEDDYBZcjs.IconButton_default; exports.IconLinkButton = _RUXLZWRZcjs.IconLinkButton_default; exports.LinkButton = _JOTFTEBXcjs.LinkButton_default; exports.Modal = _3Y6HGWJGcjs.Modal; exports.Popover = _B6775YJ4cjs.Popover_default; exports.RadioButton = _4AI6GQ5Ucjs.RadioButton_default; exports.RichSelectList = _TJDFEWPTcjs.RichSelectList_default; exports.SelectList = _BCWRGKWLcjs.SelectList; exports.Tabs = _6VFQ76T5cjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _AUO7CEJIcjs.TextArea_default; exports.TextField = _5NI7VPKScjs.TextField; exports.ThemeProvider = _36JMUQOLcjs.ThemeProvider; exports.Tooltip = _UXSGTOGUcjs.Tooltip_default; exports.Typography = _5NQO6SP3cjs.Typography_default;
+
+
+
+exports.Avatar = _GQUBAKFOcjs.Avatar_default; exports.AvatarGroup = _GEXK47GRcjs.AvatarGroup; exports.Badge = _E3A6VFMBcjs.Badge_default; exports.Box = _QODNNCT2cjs.Box_default; exports.Button = _BFEZ3PUTcjs.Button_default; exports.ButtonGroup = _6KSVCCCBcjs.ButtonGroup_default; exports.Card = _AVJQ2E2Gcjs.Card_default; exports.Checkbox = _OVHMMIVEcjs.Checkbox_default; exports.Chip = _IHGDCH62cjs.Chip_default; exports.Divider = _A3B4YKGNcjs.Divider; exports.Heading = _CCKTB7L5cjs.Heading_default; exports.Icon = _IBT4YOI5cjs.Icon_default; exports.IconButton = _PZEDDYBZcjs.IconButton_default; exports.IconLinkButton = _RUXLZWRZcjs.IconLinkButton_default; exports.LinkButton = _JOTFTEBXcjs.LinkButton_default; exports.Modal = _3Y6HGWJGcjs.Modal; exports.Popover = _B6775YJ4cjs.Popover_default; exports.RadioButton = _4AI6GQ5Ucjs.RadioButton_default; exports.RichSelectList = _A2MUYVOPcjs.RichSelectList_default; exports.SelectList = _A4EEJRTWcjs.SelectList; exports.TabButton = _ML36DCKLcjs.TabButton; exports.TabLink = _OBQBJKAYcjs.TabLink_default; exports.Tabs = _4QUXUGJPcjs.Tabs; exports.TapArea = _3UEOKPM2cjs.TapArea_default; exports.TextArea = _AUO7CEJIcjs.TextArea_default; exports.TextField = _5NI7VPKScjs.TextField; exports.ThemeProvider = _36JMUQOLcjs.ThemeProvider; exports.Tooltip = _UXSGTOGUcjs.Tooltip_default; exports.Typography = _5NQO6SP3cjs.Typography_default; exports.WordConfetti = _K3AY5BI4cjs.WordConfetti_default;
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.ts

@@ -18,6 +18,8 @@ export { default as Popover } from './Popover/Popover.js';
 export { default as RadioButton } from './RadioButton/RadioButton.js';
 export { default as RichSelectList } from './RichSelect/RichSelectList.js';
 export { default as SelectList } from './SelectList/SelectList.js';
+export { default as TabButton } from './TabButton/TabButton.js';
+export { default as TabLink } from './TabLink/TabLink.js';
 export { default as Tabs } from './Tabs/Tabs.js';
 export { default as TapArea } from './TapArea/TapArea.js';
 export { default as TextArea } from './TextArea/TextArea.js';
@@ -25,6 +27,7 @@ export { default as TextField } from './TextField/TextField.js';
 export { default as ThemeProvider } from './ThemeProvider/ThemeProvider.js';
 export { default as Tooltip } from './Tooltip/Tooltip.js';
 export { default as Typography } from './Typography/Typography.js';
+export { default as WordConfetti } from './WordConfetti/WordConfetti.js';
 import 'react';
 import './colors/allColors.js';
 import './constants.js';
@@ -38,5 +41,4 @@ import './RichSelect/RichSelectBox.js';
 import './RichSelect/RichSelectSection.js';
 import './RichSelect/RichSelectChip.js';
 import './RichSelect/RichSelectRadioButton.js';
-import './Tabs/TabButton.js';
 import './Tabs/TabInternal.js';

package/dist/index.js

@@ -2,21 +2,21 @@
 import {
   Avatar_default
 } from "./__chunks/GFROY577.js";
-import {
-  Badge_default
-} from "./__chunks/OYIKKE7V.js";
 import {
   AvatarGroup
 } from "./__chunks/FPROMKT3.js";
+import {
+  Card_default
+} from "./__chunks/7ZD4OEVD.js";
+import {
+  Badge_default
+} from "./__chunks/OYIKKE7V.js";
 import {
   Icon_default
 } from "./__chunks/WPQECZRJ.js";
 import {
   Checkbox_default
 } from "./__chunks/YMIQ7WYX.js";
-import {
-  Card_default
-} from "./__chunks/7ZD4OEVD.js";
 import {
   Modal
 } from "./__chunks/C2HJHJQW.js";
@@ -35,10 +35,11 @@ import {
 import "./__chunks/YLWWTB4I.js";
 import {
   SelectList
-} from "./__chunks/Y6HBRXLN.js";
+} from "./__chunks/Q2PKWGLY.js";
+import "./__chunks/SPQ7DQHG.js";
 import {
   RichSelectList_default
-} from "./__chunks/ZGOEPXUG.js";
+} from "./__chunks/725OOIL4.js";
 import {
   Popover_default
 } from "./__chunks/TTCJEHHX.js";
@@ -48,14 +49,14 @@ import {
   IconButton_default
 } from "./__chunks/HVGNETJV.js";
 import "./__chunks/4U4UW4AK.js";
-import "./__chunks/TL2IBN7H.js";
-import "./__chunks/U6TGYOG7.js";
+import "./__chunks/XES27TWJ.js";
+import "./__chunks/ZHU5A7BH.js";
 import {
   ButtonGroup_default
 } from "./__chunks/36DG472B.js";
 import {
   Button_default
-} from "./__chunks/BIW5AZCF.js";
+} from "./__chunks/KY2TFXG3.js";
 import {
   Divider
 } from "./__chunks/M4W3IFMV.js";
@@ -64,16 +65,19 @@ import "./__chunks/QSC7CAQA.js";
 import "./__chunks/64WM4STC.js";
 import "./__chunks/AHICHJTL.js";
 import "./__chunks/DDUJFFG7.js";
-import "./__chunks/2D2PXUUQ.js";
+import "./__chunks/DWVTJZC6.js";
+import {
+  RadioButton_default
+} from "./__chunks/4MHKTQMD.js";
+import "./__chunks/KKADUD65.js";
 import "./__chunks/56LMASNQ.js";
 import {
   Chip_default
 } from "./__chunks/5S7HZU4Z.js";
 import "./__chunks/ODMJANSX.js";
 import {
-  RadioButton_default
-} from "./__chunks/4MHKTQMD.js";
-import "./__chunks/KKADUD65.js";
+  ThemeProvider
+} from "./__chunks/KTX4P4Q2.js";
 import {
   TextField
 } from "./__chunks/4EVPNC6V.js";
@@ -83,22 +87,29 @@ import {
 import "./__chunks/4U4UW4AK.js";
 import {
   Tabs
-} from "./__chunks/M5G3QZYU.js";
-import "./__chunks/O7HX76KZ.js";
-import "./__chunks/L6U2V7ZR.js";
+} from "./__chunks/VRCNKRDW.js";
+import {
+  TabLink_default
+} from "./__chunks/F2ZYHRNY.js";
+import {
+  TabButton
+} from "./__chunks/TG2RCNZT.js";
 import {
   TapArea_default
 } from "./__chunks/77FFPQY6.js";
-import "./__chunks/3HA2NC7Q.js";
+import "./__chunks/VV2NJABK.js";
+import "./__chunks/4U4UW4AK.js";
 import "./__chunks/PBHAJ42K.js";
-import {
-  Box_default
-} from "./__chunks/IB6JZQF3.js";
-import "./__chunks/SPQ7DQHG.js";
 import "./__chunks/JCQUY624.js";
 import "./__chunks/AXXUPHFX.js";
 import "./__chunks/YGON3SJ5.js";
 import "./__chunks/M4CFLT64.js";
+import {
+  WordConfetti_default
+} from "./__chunks/LBBAOI6G.js";
+import {
+  Box_default
+} from "./__chunks/IB6JZQF3.js";
 import {
   Tooltip_default
 } from "./__chunks/ZYPHFC2R.js";
@@ -113,9 +124,6 @@ import {
 import "./__chunks/VU4LGL2W.js";
 import "./__chunks/XSYKMCV5.js";
 import "./__chunks/4U4UW4AK.js";
-import {
-  ThemeProvider
-} from "./__chunks/KTX4P4Q2.js";
 import "./__chunks/JB65NEXK.js";
 import "./__chunks/BWPNF6RD.js";
 import "./__chunks/SVZOETLJ.js";
@@ -144,12 +152,15 @@ export {
   RadioButton_default as RadioButton,
   RichSelectList_default as RichSelectList,
   SelectList,
+  TabButton,
+  TabLink_default as TabLink,
   Tabs,
   TapArea_default as TapArea,
   TextArea_default as TextArea,
   TextField,
   ThemeProvider,
   Tooltip_default as Tooltip,
-  Typography_default as Typography
+  Typography_default as Typography,
+  WordConfetti_default as WordConfetti
 };
 //# sourceMappingURL=index.js.map

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cambly/syntax-core",
   "description": "Cambly design system core components",
-  "version": "18.13.0",
+  "version": "19.1.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -28,8 +28,8 @@
     "react": "18.2.0",
     "tsup": "6.7.0",
     "typescript": "5.0.4",
-    "@cambly/syntax-tsconfig": "1.4.1",
-    "@cambly/eslint-config-syntax": "1.4.0"
+    "@cambly/eslint-config-syntax": "1.4.0",
+    "@cambly/syntax-tsconfig": "1.4.1"
   },
   "publishConfig": {
     "access": "public"

package/dist/__chunks/3HA2NC7Q.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["css-module:./Tabs.module.css#css-module"],"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\"}"],"mappings":";;;AAAwF,IAAO,sBAAQ,EAAC,+BAA8B,wCAAuC,8BAA6B,uCAAsC,OAAM,gBAAe,gCAA+B,0CAAyC,+BAA8B,yCAAwC,iBAAgB,2BAA0B,QAAO,iBAAgB;","names":[]}

package/dist/__chunks/6VFQ76T5.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/Tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AACA,OAAO,gBAAgB;AAuCjB;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;AAEA,KAAK,SAAS;AACd,KAAK,OAAO","sourcesContent":["import { type ReactNode } from \"react\";\nimport classnames from \"classnames\";\nimport TabButton from \"./TabButton\";\nimport TabLink from \"./TabLink\";\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 `Tabs.Button` or a `Tabs.Link`.\n   * Only use `Tabs.Link` for clicking tab that update the URL upon selection. Otherwise, use `Tabs.Button`.\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\nTabs.Button = TabButton;\nTabs.Link = TabLink;\n"]}

package/dist/__chunks/F3BQN7NQ.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/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 \"./TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"./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/L6U2V7ZR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/TabButton.tsx"],"sourcesContent":["import { type ReactElement, type ComponentProps } from \"react\";\nimport classnames from \"classnames\";\nimport TapArea from \"../TapArea/TapArea\";\nimport TabInternal from \"./TabInternal\";\nimport styles from \"./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/M5G3QZYU.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport classnames from \"classnames\";\nimport TabButton from \"./TabButton\";\nimport TabLink from \"./TabLink\";\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 `Tabs.Button` or a `Tabs.Link`.\n   * Only use `Tabs.Link` for clicking tab that update the URL upon selection. Otherwise, use `Tabs.Button`.\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\nTabs.Button = TabButton;\nTabs.Link = TabLink;\n"],"mappings":";;;;;;;;;;;;;;;AACA,OAAO,gBAAgB;AAuCjB;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;AAEA,KAAK,SAAS;AACd,KAAK,OAAO;","names":[]}

package/dist/__chunks/O7HX76KZ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport TabInternal from \"./TabInternal\";\nimport classnames from \"classnames\";\nimport styles from \"./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/PSFCD7QM.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/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 \"./TabInternal\";\nimport styles from \"./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/XFWFHRRK.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["css-module:./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\"}"]}