@cambly/syntax-core 18.12.0 → 19.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ButtonGroup/ButtonGroup.cjs +2 -2
- package/dist/ButtonGroup/ButtonGroup.css +22 -6
- package/dist/ButtonGroup/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup/ButtonGroup.d.ts +13 -1
- package/dist/ButtonGroup/ButtonGroup.js +1 -1
- package/dist/RichSelect/RichSelectBox.cjs +3 -3
- package/dist/RichSelect/RichSelectBox.css +22 -6
- package/dist/RichSelect/RichSelectBox.css.map +1 -1
- package/dist/RichSelect/RichSelectBox.js +2 -2
- package/dist/RichSelect/RichSelectList.cjs +5 -5
- package/dist/RichSelect/RichSelectList.css +22 -6
- package/dist/RichSelect/RichSelectList.css.map +1 -1
- package/dist/RichSelect/RichSelectList.js +4 -4
- package/dist/SelectList/SelectList.cjs +3 -3
- package/dist/SelectList/SelectList.js +2 -2
- package/dist/{Tabs → TabButton}/TabButton.cjs +5 -4
- package/dist/{Tabs → TabButton}/TabButton.d.ts +1 -1
- package/dist/{Tabs → TabButton}/TabButton.js +3 -2
- package/dist/{Tabs → TabLink}/TabLink.cjs +5 -4
- package/dist/{Tabs → TabLink}/TabLink.js +3 -2
- package/dist/Tabs/Tabs.cjs +4 -11
- package/dist/Tabs/Tabs.css +26 -200
- package/dist/Tabs/Tabs.css.map +1 -1
- package/dist/Tabs/Tabs.d.ts +2 -21
- package/dist/Tabs/Tabs.js +2 -9
- package/dist/__chunks/36DG472B.js +38 -0
- package/dist/__chunks/36DG472B.js.map +1 -0
- package/dist/__chunks/{6VFQ76T5.cjs → 4QUXUGJP.cjs} +8 -14
- package/dist/__chunks/4QUXUGJP.cjs.map +1 -0
- package/dist/__chunks/{QC2DQIRT.js → 5HWHJRVZ.js} +1 -1
- package/dist/__chunks/{QC2DQIRT.js.map → 5HWHJRVZ.js.map} +1 -1
- package/dist/__chunks/6KSVCCCB.cjs +38 -0
- package/dist/__chunks/6KSVCCCB.cjs.map +1 -0
- package/dist/__chunks/{XFWFHRRK.cjs → 7DGFMDT7.cjs} +2 -2
- package/dist/__chunks/7DGFMDT7.cjs.map +1 -0
- package/dist/__chunks/{O7HX76KZ.js → F2ZYHRNY.js} +3 -3
- package/dist/__chunks/F2ZYHRNY.js.map +1 -0
- package/dist/__chunks/{5ROYTORI.cjs → HZ3SCLC7.cjs} +10 -10
- package/dist/__chunks/{PSFCD7QM.cjs → ML36DCKL.cjs} +7 -7
- package/dist/__chunks/ML36DCKL.cjs.map +1 -0
- package/dist/__chunks/{LZDRADUP.js → NXOKB47G.js} +3 -3
- package/dist/__chunks/{F3BQN7NQ.cjs → OBQBJKAY.cjs} +8 -8
- package/dist/__chunks/OBQBJKAY.cjs.map +1 -0
- package/dist/__chunks/{LP2VGTTE.cjs → RH52UDEB.cjs} +1 -1
- package/dist/__chunks/{LP2VGTTE.cjs.map → RH52UDEB.cjs.map} +1 -1
- package/dist/__chunks/{YJVUWE3C.cjs → SN7NPTN4.cjs} +5 -5
- package/dist/__chunks/{XRGALIPY.js → T3UI6LNR.js} +2 -2
- package/dist/__chunks/{L6U2V7ZR.js → TG2RCNZT.js} +3 -3
- package/dist/__chunks/TG2RCNZT.js.map +1 -0
- package/dist/__chunks/{DJ6R47YF.js → U6TGYOG7.js} +2 -2
- package/dist/__chunks/{M5G3QZYU.js → VRCNKRDW.js} +6 -12
- package/dist/__chunks/VRCNKRDW.js.map +1 -0
- package/dist/__chunks/{3HA2NC7Q.js → VV2NJABK.js} +2 -2
- package/dist/__chunks/VV2NJABK.js.map +1 -0
- package/dist/__chunks/{CJHYDIEV.cjs → ZZPX5ZUM.cjs} +3 -3
- package/dist/index.cjs +17 -10
- package/dist/index.css +22 -6
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +16 -9
- package/package.json +1 -1
- package/dist/__chunks/3HA2NC7Q.js.map +0 -1
- package/dist/__chunks/6VFQ76T5.cjs.map +0 -1
- package/dist/__chunks/BOX3VY3Q.js +0 -30
- package/dist/__chunks/BOX3VY3Q.js.map +0 -1
- package/dist/__chunks/C5XPZTFO.cjs +0 -30
- package/dist/__chunks/C5XPZTFO.cjs.map +0 -1
- package/dist/__chunks/F3BQN7NQ.cjs.map +0 -1
- package/dist/__chunks/L6U2V7ZR.js.map +0 -1
- package/dist/__chunks/M5G3QZYU.js.map +0 -1
- package/dist/__chunks/O7HX76KZ.js.map +0 -1
- package/dist/__chunks/PSFCD7QM.cjs.map +0 -1
- package/dist/__chunks/XFWFHRRK.cjs.map +0 -1
- /package/dist/{Tabs → TabButton}/TabButton.cjs.map +0 -0
- /package/dist/{Tabs → TabButton}/TabButton.css +0 -0
- /package/dist/{Tabs → TabButton}/TabButton.css.map +0 -0
- /package/dist/{Tabs → TabButton}/TabButton.js.map +0 -0
- /package/dist/{Tabs → TabLink}/TabLink.cjs.map +0 -0
- /package/dist/{Tabs → TabLink}/TabLink.css +0 -0
- /package/dist/{Tabs → TabLink}/TabLink.css.map +0 -0
- /package/dist/{Tabs → TabLink}/TabLink.d.ts +0 -0
- /package/dist/{Tabs → TabLink}/TabLink.js.map +0 -0
- /package/dist/__chunks/{5ROYTORI.cjs.map → HZ3SCLC7.cjs.map} +0 -0
- /package/dist/__chunks/{LZDRADUP.js.map → NXOKB47G.js.map} +0 -0
- /package/dist/__chunks/{YJVUWE3C.cjs.map → SN7NPTN4.cjs.map} +0 -0
- /package/dist/__chunks/{XRGALIPY.js.map → T3UI6LNR.js.map} +0 -0
- /package/dist/__chunks/{DJ6R47YF.js.map → U6TGYOG7.js.map} +0 -0
- /package/dist/__chunks/{CJHYDIEV.cjs.map → ZZPX5ZUM.cjs.map} +0 -0
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
|
|
2
|
-
|
|
3
|
-
// css-module:./ButtonGroup.module.css#css-module
|
|
4
|
-
var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_1u02w_1", "horizontal": "_horizontal_1u02w_5", "vertical": "_vertical_1u02w_9", "smallGap": "_smallGap_1u02w_13", "mediumGap": "_mediumGap_1u02w_17", "largeGap": "_largeGap_1u02w_21" };
|
|
5
|
-
|
|
6
|
-
// src/ButtonGroup/ButtonGroup.tsx
|
|
7
|
-
var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
|
|
8
|
-
var _jsxruntime = require('react/jsx-runtime');
|
|
9
|
-
var gap = {
|
|
10
|
-
sm: ButtonGroup_module_default.smallGap,
|
|
11
|
-
md: ButtonGroup_module_default.mediumGap,
|
|
12
|
-
lg: ButtonGroup_module_default.largeGap
|
|
13
|
-
};
|
|
14
|
-
var ButtonGroup = ({
|
|
15
|
-
orientation = "horizontal",
|
|
16
|
-
size = "md",
|
|
17
|
-
children
|
|
18
|
-
}) => {
|
|
19
|
-
const classnames = _classnames2.default.call(void 0, ButtonGroup_module_default.buttonGroup, gap[size], {
|
|
20
|
-
[ButtonGroup_module_default.horizontal]: orientation === "horizontal",
|
|
21
|
-
[ButtonGroup_module_default.vertical]: orientation === "vertical"
|
|
22
|
-
});
|
|
23
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: classnames, children });
|
|
24
|
-
};
|
|
25
|
-
var ButtonGroup_default = ButtonGroup;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
exports.ButtonGroup_default = ButtonGroup_default;
|
|
30
|
-
//# sourceMappingURL=C5XPZTFO.cjs.map
|
|
@@ -1 +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,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AAAA,EACX,IAAI,2BAAO;AACb;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_1u02w_1\",\"horizontal\":\"_horizontal_1u02w_5\",\"vertical\":\"_vertical_1u02w_9\",\"smallGap\":\"_smallGap_1u02w_13\",\"mediumGap\":\"_mediumGap_1u02w_17\",\"largeGap\":\"_largeGap_1u02w_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`: 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}): 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"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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\"}"]}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|