@nattstack/ui 0.0.107 → 0.1.1

package/dist/components/switch/switch.d.ts

@@ -1,19 +1,10 @@
-import { VariantProps } from "class-variance-authority";
 import { Switch } from "@base-ui/react";
 import { ComponentProps, JSX } from "react";
 //#region src/components/switch/switch.d.ts
-interface SwitchProps extends Omit<ComponentProps<typeof Switch.Root>, "checked" | "defaultChecked" | "disabled" | "nativeButton" | "readOnly" | "required"> {
-  isChecked?: boolean;
-  isDefaultChecked?: boolean;
-  isDisabled?: boolean;
-  isReadOnly?: boolean;
-  isRequired?: boolean;
+interface SwitchProps extends Omit<ComponentProps<typeof Switch.Root>, "nativeButton"> {
   size?: SwitchSize;
 }
-type SwitchSize = NonNullable<VariantProps<typeof switchVariants>["size"]>;
+type SwitchSize = 18 | 24;
 declare function Switch$1(props: SwitchProps): JSX.Element;
-declare const switchVariants: (props?: ({
-  size?: 18 | 24 | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //#endregion
-export { Switch$1 as Switch, SwitchProps, switchVariants };
+export { Switch$1 as Switch, SwitchProps, SwitchSize };

package/dist/components/switch/switch.js

@@ -1,32 +1,17 @@
-import switch_module_default from "./switch.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { switchStyles, switchStylesBy } from "./switch.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Switch } from "@base-ui/react";
 //#region src/components/switch/switch.tsx
 function Switch$1(props) {
-	const { className: customClassName = "", isChecked = void 0, isDefaultChecked = false, isDisabled = false, isReadOnly = false, isRequired = false, size = 24, ...rest } = props;
-	const combinedClassName = switchVariants({
-		className: customClassName,
-		size
-	});
+	const { className = "", size = 24, ...rest } = props;
+	const combinedClassName = cn(switchStyles.base, switchStylesBy.size[size], className);
 	return /* @__PURE__ */ jsx(Switch.Root, {
-		checked: isChecked,
 		className: combinedClassName,
-		"data-slot": "switch",
-		defaultChecked: isDefaultChecked,
-		disabled: isDisabled,
-		readOnly: isReadOnly,
-		required: isRequired,
+		"data-component": "switch",
 		...rest,
-		children: /* @__PURE__ */ jsx(Switch.Thumb, { className: switch_module_default.thumb })
+		children: /* @__PURE__ */ jsx(Switch.Thumb, { className: cn(switchStyles.thumb) })
 	});
 }
-const switchVariants = cva(switch_module_default.base, {
-	defaultVariants: { size: 24 },
-	variants: { size: {
-		18: switch_module_default.size_18,
-		24: switch_module_default.size_24
-	} }
-});
 //#endregion
-export { Switch$1 as Switch, switchVariants };
+export { Switch$1 as Switch };

package/dist/components/switch/switch.stylex.js

@@ -0,0 +1,48 @@
+//#region src/components/switch/switch.stylex.ts
+const switchStyles = {
+	base: {
+		kWkggS: "x1hhl9jx xfl8pkj",
+		kaIpWk: "x10hpsqq",
+		kkrTdU: "x5ezrf1 x1ypdohk",
+		k1xSpc: "x78zum5",
+		kmuXW: "x2lah0s",
+		kSiTet: "xxh3kiz x1hc1fzr",
+		kjBf7l: "x1luwoo2",
+		kInvED: "x1hl8ikr",
+		k3XXqK: "xaatb59",
+		kMeerF: "x784prv x1k57tk5",
+		kVQacm: "xb3r6kr",
+		kmVPX3: "x1i3ajwb",
+		kIyJzY: "xx6bhzk",
+		k1ekBW: "x15406qy",
+		$$css: true
+	},
+	size_18: {
+		"--translateX": "x16tb73e",
+		kZKoxP: "xmix8c7",
+		kzqmXN: "x1849jeq",
+		$$css: true
+	},
+	size_24: {
+		"--translateX": "xksez7u",
+		kZKoxP: "xxk0z11",
+		kzqmXN: "x100vrsf",
+		$$css: true
+	},
+	thumb: {
+		kOBAk4: "x1y5e3q9",
+		kWkggS: "x12peec7",
+		kaIpWk: "x10hpsqq",
+		kZKoxP: "x5yr21d",
+		k3aq6I: "x1bad46t x1c071of",
+		kIyJzY: "xx6bhzk",
+		k1ekBW: "x11xpdln",
+		$$css: true
+	}
+};
+const switchStylesBy = { size: {
+	18: switchStyles.size_18,
+	24: switchStyles.size_24
+} };
+//#endregion
+export { switchStyles, switchStylesBy };

package/dist/components/tabs/tabs-panel.d.ts

@@ -3,6 +3,5 @@ import { JSX } from "react";
 //#region src/components/tabs/tabs-panel.d.ts
 interface TabsPanelProps extends Tabs.Panel.Props {}
 declare function TabsPanel(props: TabsPanelProps): JSX.Element;
-declare const tabsPanelVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { TabsPanel, TabsPanelProps, tabsPanelVariants };
+export { TabsPanel, TabsPanelProps };

package/dist/components/tabs/tabs-panel.js

@@ -1,17 +1,16 @@
-import tabs_panel_module_default from "./tabs-panel.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { tabsPanelStyles } from "./tabs-panel.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs/tabs-panel.tsx
 function TabsPanel(props) {
-	const { className: customClassName = "", ...rest } = props;
-	const combinedClassName = tabsPanelVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(tabsPanelStyles.base, className);
 	return /* @__PURE__ */ jsx(Tabs.Panel, {
 		className: combinedClassName,
-		"data-slot": "tabs-panel",
+		"data-component": "tabs-panel",
 		...rest
 	});
 }
-const tabsPanelVariants = cva(tabs_panel_module_default.base);
 //#endregion
-export { TabsPanel, tabsPanelVariants };
+export { TabsPanel };

package/dist/components/tabs/tabs-panel.stylex.js

@@ -0,0 +1,12 @@
+//#region src/components/tabs/tabs-panel.stylex.ts
+const tabsPanelStyles = { base: {
+	k1xSpc: "x78zum5",
+	kXwgrk: "xdt5ytf",
+	kjBf7l: "x1mp0jls x1uczgqu",
+	kInvED: "x2ssjo2",
+	k3XXqK: "xaatb59",
+	kMeerF: "x784prv x1k57tk5",
+	$$css: true
+} };
+//#endregion
+export { tabsPanelStyles };

package/dist/components/tabs/tabs.d.ts

@@ -3,6 +3,5 @@ import { JSX } from "react";
 //#region src/components/tabs/tabs.d.ts
 interface TabsProps extends Tabs.Root.Props {}
 declare function Tabs$1(props: TabsProps): JSX.Element;
-declare const tabsVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { Tabs$1 as Tabs, TabsProps, tabsVariants };
+export { Tabs$1 as Tabs, TabsProps };

package/dist/components/tabs/tabs.js

@@ -1,17 +1,16 @@
-import tabs_module_default from "./tabs.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { tabsStyles } from "./tabs.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs/tabs.tsx
 function Tabs$1(props) {
-	const { className: customClassName = "", ...rest } = props;
-	const combinedClassName = tabsVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(tabsStyles.base, className);
 	return /* @__PURE__ */ jsx(Tabs.Root, {
 		className: combinedClassName,
-		"data-slot": "tabs",
+		"data-component": "tabs",
 		...rest
 	});
 }
-const tabsVariants = cva(tabs_module_default.base);
 //#endregion
-export { Tabs$1 as Tabs, tabsVariants };
+export { Tabs$1 as Tabs };

package/dist/components/tabs/tabs.stylex.js

@@ -0,0 +1,8 @@
+//#region src/components/tabs/tabs.stylex.ts
+const tabsStyles = { base: {
+	k1xSpc: "x78zum5",
+	kXwgrk: "xdt5ytf",
+	$$css: true
+} };
+//#endregion
+export { tabsStyles };

package/dist/components/tabs-pill/tabs-pill-indicator.js

@@ -1,18 +1,17 @@
-import tabs_pill_indicator_module_default from "./tabs-pill-indicator.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { tabsPillIndicatorStyles } from "./tabs-pill-indicator.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-pill/tabs-pill-indicator.tsx
 function TabsPillIndicator(props) {
-	const { className: customClassName = "", ...rest } = props;
-	const combinedClassName = tabsPillIndicatorVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(tabsPillIndicatorStyles.base, className);
 	return /* @__PURE__ */ jsx(Tabs.Indicator, {
 		className: combinedClassName,
-		"data-slot": "tabs-pill-indicator",
+		"data-component": "tabs-pill-indicator",
 		renderBeforeHydration: true,
 		...rest
 	});
 }
-const tabsPillIndicatorVariants = cva(tabs_pill_indicator_module_default.base);
 //#endregion
-export { TabsPillIndicator, tabsPillIndicatorVariants };
+export { TabsPillIndicator };

package/dist/components/tabs-pill/tabs-pill-indicator.stylex.js

@@ -0,0 +1,16 @@
+//#region src/components/tabs-pill/tabs-pill-indicator.stylex.ts
+const tabsPillIndicatorStyles = { base: {
+	kWkggS: "x1escjlh",
+	kaIpWk: "x4pepcl",
+	kZKoxP: "x1gezbiy",
+	kbCHJM: "xvbikie",
+	kVAEAm: "x10l6tqk",
+	k87sOh: "x10uur0e",
+	kIyJzY: "xx6bhzk",
+	k1ekBW: "x1ym43eq",
+	kzqmXN: "xoffw1",
+	kY2c9j: "x8knxv4",
+	$$css: true
+} };
+//#endregion
+export { tabsPillIndicatorStyles };

package/dist/components/tabs-pill/tabs-pill-list.d.ts

@@ -3,6 +3,5 @@ import { JSX } from "react";
 //#region src/components/tabs-pill/tabs-pill-list.d.ts
 interface TabsPillListProps extends Tabs.List.Props {}
 declare function TabsPillList(props: TabsPillListProps): JSX.Element;
-declare const tabsPillListVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { TabsPillList, TabsPillListProps, tabsPillListVariants };
+export { TabsPillList, TabsPillListProps };

package/dist/components/tabs-pill/tabs-pill-list.js

@@ -1,19 +1,18 @@
+import { cn } from "../cn.js";
 import { TabsPillIndicator } from "./tabs-pill-indicator.js";
-import tabs_pill_list_module_default from "./tabs-pill-list.module.js";
-import { cva } from "class-variance-authority";
+import { tabsPillListStyles } from "./tabs-pill-list.stylex.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-pill/tabs-pill-list.tsx
 function TabsPillList(props) {
-	const { className: customClassName = "", children = void 0, ...rest } = props;
-	const combinedClassName = tabsPillListVariants({ className: customClassName });
+	const { className = "", children = void 0, ...rest } = props;
+	const combinedClassName = cn(tabsPillListStyles.base, className);
 	return /* @__PURE__ */ jsxs(Tabs.List, {
 		className: combinedClassName,
-		"data-slot": "tabs-pill-list",
+		"data-component": "tabs-pill-list",
 		...rest,
 		children: [children, /* @__PURE__ */ jsx(TabsPillIndicator, {})]
 	});
 }
-const tabsPillListVariants = cva(tabs_pill_list_module_default.base);
 //#endregion
-export { TabsPillList, tabsPillListVariants };
+export { TabsPillList };

package/dist/components/tabs-pill/tabs-pill-list.stylex.js

@@ -0,0 +1,11 @@
+//#region src/components/tabs-pill/tabs-pill-list.stylex.ts
+const tabsPillListStyles = { base: {
+	k1C7PZ: "xfex06f",
+	k1xSpc: "x78zum5",
+	kHBbk8: "xc8icb0",
+	kXHlph: "xw2csxc",
+	kVAEAm: "x1n2onr6",
+	$$css: true
+} };
+//#endregion
+export { tabsPillListStyles };

package/dist/components/tabs-pill/tabs-pill-tab.d.ts

@@ -1,10 +1,7 @@
 import { Tabs } from "@base-ui/react";
 import { JSX } from "react";
 //#region src/components/tabs-pill/tabs-pill-tab.d.ts
-interface TabsPillTabProps extends Omit<Tabs.Tab.Props, "nativeButton"> {
-  isNativeButton?: Tabs.Tab.Props["nativeButton"];
-}
+interface TabsPillTabProps extends Tabs.Tab.Props {}
 declare function TabsPillTab(props: TabsPillTabProps): JSX.Element;
-declare const tabsPillTabVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { TabsPillTab, TabsPillTabProps, tabsPillTabVariants };
+export { TabsPillTab, TabsPillTabProps };

package/dist/components/tabs-pill/tabs-pill-tab.js

@@ -1,21 +1,20 @@
-import tabs_pill_tab_module_default from "./tabs-pill-tab.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { tabsPillTabStyles } from "./tabs-pill-tab.stylex.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-pill/tabs-pill-tab.tsx
 function TabsPillTab(props) {
-	const { className: customClassName = "", isNativeButton = true, ...rest } = props;
-	const combinedClassName = tabsPillTabVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(tabsPillTabStyles.base, className);
 	return /* @__PURE__ */ jsxs("div", {
-		className: tabs_pill_tab_module_default.wrapper,
+		className: cn(tabsPillTabStyles.wrapper),
 		children: [/* @__PURE__ */ jsx(Tabs.Tab, {
 			className: combinedClassName,
-			"data-slot": "tabs-pill-tab",
-			nativeButton: isNativeButton,
+			"data-component": "tabs-pill-tab",
+			nativeButton: true,
 			...rest
-		}), /* @__PURE__ */ jsx("div", { className: tabs_pill_tab_module_default.background })]
+		}), /* @__PURE__ */ jsx("div", { className: cn(tabsPillTabStyles.background) })]
 	});
 }
-const tabsPillTabVariants = cva(tabs_pill_tab_module_default.base);
 //#endregion
-export { TabsPillTab, tabsPillTabVariants };
+export { TabsPillTab };

package/dist/components/tabs-pill/tabs-pill-tab.stylex.js

@@ -0,0 +1,46 @@
+//#region src/components/tabs-pill/tabs-pill-tab.stylex.ts
+const tabsPillTabStyles = {
+	background: {
+		kWkggS: "x2j0cto",
+		kpwlN0: "x10a8y8t",
+		kVAEAm: "x10l6tqk",
+		kY2c9j: "x1fdshc9",
+		$$css: true
+	},
+	base: {
+		"--border-radius": "xq5qtd1",
+		kGNEyG: "x6s0dn4",
+		kWkggS: "x135mljp x18ejm1c xjbqb8w",
+		kaIpWk: "xujip75",
+		kMwMTN: "x1dua4oe x197k1c5",
+		k1C7PZ: "xfex06f",
+		kkrTdU: "x1ypdohk",
+		k1xSpc: "x78zum5",
+		kmuXW: "x2lah0s",
+		kGuDYH: "xif65rj",
+		k63SB2: "x10p5zqr",
+		kZKoxP: "x1vqgdyp",
+		kjj79g: "xl56j7k",
+		kjBf7l: "x1luwoo2",
+		kInvED: "xr2mjdv",
+		k3XXqK: "xaatb59",
+		kMeerF: "x784prv x1k57tk5",
+		k8WAf4: "xt970qd",
+		kg3NbH: "xqin4a2",
+		kIyJzY: "xx6bhzk",
+		k1ekBW: "xs2xxs2",
+		khDVqt: "xuxw1ft",
+		$$css: true
+	},
+	wrapper: {
+		"--border-radius": "xq5qtd1",
+		kaIpWk: "xujip75",
+		k1xSpc: "x78zum5",
+		kmuXW: "x2lah0s",
+		kVQacm: "xb3r6kr",
+		kVAEAm: "x1n2onr6",
+		$$css: true
+	}
+};
+//#endregion
+export { tabsPillTabStyles };

package/dist/components/tabs-segmented/tabs-segmented-indicator.js

@@ -1,18 +1,17 @@
-import tabs_segmented_indicator_module_default from "./tabs-segmented-indicator.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { tabsSegmentedIndicatorStyles } from "./tabs-segmented-indicator.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-segmented/tabs-segmented-indicator.tsx
 function TabsSegmentedIndicator(props) {
-	const { className: customClassName = "", ...rest } = props;
-	const combinedClassName = tabsSegmentedIndicatorVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(tabsSegmentedIndicatorStyles.base, className);
 	return /* @__PURE__ */ jsx(Tabs.Indicator, {
 		className: combinedClassName,
-		"data-slot": "tabs-segmented-indicator",
+		"data-component": "tabs-segmented-indicator",
 		renderBeforeHydration: true,
 		...rest
 	});
 }
-const tabsSegmentedIndicatorVariants = cva(tabs_segmented_indicator_module_default.base);
 //#endregion
-export { TabsSegmentedIndicator, tabsSegmentedIndicatorVariants };
+export { TabsSegmentedIndicator };

package/dist/components/tabs-segmented/tabs-segmented-indicator.stylex.js

@@ -0,0 +1,16 @@
+//#region src/components/tabs-segmented/tabs-segmented-indicator.stylex.ts
+const tabsSegmentedIndicatorStyles = { base: {
+	kWkggS: "xm8sm7k",
+	kaIpWk: "x1q4ynmn",
+	kZKoxP: "x1gezbiy",
+	kbCHJM: "xvbikie",
+	kVAEAm: "x10l6tqk",
+	k87sOh: "x10uur0e",
+	kIyJzY: "xx6bhzk",
+	k1ekBW: "x1ym43eq",
+	kzqmXN: "xoffw1",
+	kY2c9j: "x8knxv4",
+	$$css: true
+} };
+//#endregion
+export { tabsSegmentedIndicatorStyles };

package/dist/components/tabs-segmented/tabs-segmented-list.d.ts

@@ -3,6 +3,5 @@ import { JSX } from "react";
 //#region src/components/tabs-segmented/tabs-segmented-list.d.ts
 interface TabsSegmentedListProps extends Tabs.List.Props {}
 declare function TabsSegmentedList(props: TabsSegmentedListProps): JSX.Element;
-declare const tabsSegmentedListVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { TabsSegmentedList, TabsSegmentedListProps, tabsSegmentedListVariants };
+export { TabsSegmentedList, TabsSegmentedListProps };

package/dist/components/tabs-segmented/tabs-segmented-list.js

@@ -1,19 +1,18 @@
+import { cn } from "../cn.js";
 import { TabsSegmentedIndicator } from "./tabs-segmented-indicator.js";
-import tabs_segmented_list_module_default from "./tabs-segmented-list.module.js";
-import { cva } from "class-variance-authority";
+import { tabsSegmentedListStyles } from "./tabs-segmented-list.stylex.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-segmented/tabs-segmented-list.tsx
 function TabsSegmentedList(props) {
-	const { className: customClassName = "", children = void 0, ...rest } = props;
-	const combinedClassName = tabsSegmentedListVariants({ className: customClassName });
+	const { className = "", children = void 0, ...rest } = props;
+	const combinedClassName = cn(tabsSegmentedListStyles.base, className);
 	return /* @__PURE__ */ jsxs(Tabs.List, {
 		className: combinedClassName,
-		"data-slot": "tabs-segmented-list",
+		"data-component": "tabs-segmented-list",
 		...rest,
 		children: [children, /* @__PURE__ */ jsx(TabsSegmentedIndicator, {})]
 	});
 }
-const tabsSegmentedListVariants = cva(tabs_segmented_list_module_default.base);
 //#endregion
-export { TabsSegmentedList, tabsSegmentedListVariants };
+export { TabsSegmentedList };

package/dist/components/tabs-segmented/tabs-segmented-list.stylex.js

@@ -0,0 +1,15 @@
+//#region src/components/tabs-segmented/tabs-segmented-list.stylex.ts
+const tabsSegmentedListStyles = { base: {
+	kWkggS: "x2j0cto",
+	kaIpWk: "x4pepcl",
+	k1xSpc: "x78zum5",
+	kZKoxP: "x1vqgdyp",
+	kHBbk8: "xc8icb0",
+	kXHlph: "xw2csxc",
+	kmVPX3: "x1i3ajwb",
+	kVAEAm: "x1n2onr6",
+	kzqmXN: "xeq5yr9",
+	$$css: true
+} };
+//#endregion
+export { tabsSegmentedListStyles };

package/dist/components/tabs-segmented/tabs-segmented-tab.d.ts

@@ -1,10 +1,7 @@
 import { Tabs } from "@base-ui/react";
 import { JSX } from "react";
 //#region src/components/tabs-segmented/tabs-segmented-tab.d.ts
-interface TabsSegmentedTabProps extends Omit<Tabs.Tab.Props, "nativeButton"> {
-  isNativeButton?: Tabs.Tab.Props["nativeButton"];
-}
+interface TabsSegmentedTabProps extends Tabs.Tab.Props {}
 declare function TabsSegmentedTab(props: TabsSegmentedTabProps): JSX.Element;
-declare const tabsSegmentedTabVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { TabsSegmentedTab, TabsSegmentedTabProps, tabsSegmentedTabVariants };
+export { TabsSegmentedTab, TabsSegmentedTabProps };

package/dist/components/tabs-segmented/tabs-segmented-tab.js

@@ -1,18 +1,17 @@
-import tabs_segmented_tab_module_default from "./tabs-segmented-tab.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { tabsSegmentedTabStyles } from "./tabs-segmented-tab.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-segmented/tabs-segmented-tab.tsx
 function TabsSegmentedTab(props) {
-	const { className: customClassName = "", isNativeButton = true, ...rest } = props;
-	const combinedClassName = tabsSegmentedTabVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(tabsSegmentedTabStyles.base, className);
 	return /* @__PURE__ */ jsx(Tabs.Tab, {
 		className: combinedClassName,
-		"data-slot": "tabs-segmented-tab",
-		nativeButton: isNativeButton,
+		"data-component": "tabs-segmented-tab",
+		nativeButton: true,
 		...rest
 	});
 }
-const tabsSegmentedTabVariants = cva(tabs_segmented_tab_module_default.base);
 //#endregion
-export { TabsSegmentedTab, tabsSegmentedTabVariants };
+export { TabsSegmentedTab };

package/dist/components/tabs-segmented/tabs-segmented-tab.stylex.js

@@ -0,0 +1,26 @@
+//#region src/components/tabs-segmented/tabs-segmented-tab.stylex.ts
+const tabsSegmentedTabStyles = { base: {
+	kGNEyG: "x6s0dn4",
+	kaIpWk: "x1q4ynmn",
+	kMwMTN: "x1srrrpr x58zf59 x1dtbpl2",
+	k1C7PZ: "xfex06f",
+	kkrTdU: "x1ypdohk",
+	k1xSpc: "x78zum5",
+	kmuXW: "x2lah0s",
+	kGuDYH: "xif65rj",
+	k63SB2: "x10p5zqr",
+	kZKoxP: "x5yr21d",
+	kjj79g: "xl56j7k",
+	kjBf7l: "x1luwoo2",
+	kInvED: "xr2mjdv",
+	k3XXqK: "xaatb59",
+	kMeerF: "x784prv x1k57tk5",
+	k8WAf4: "xt970qd",
+	kg3NbH: "xqin4a2",
+	kIyJzY: "xx6bhzk",
+	k1ekBW: "xt3l3uh",
+	khDVqt: "xuxw1ft",
+	$$css: true
+} };
+//#endregion
+export { tabsSegmentedTabStyles };

package/dist/components/tabs-underline/tabs-underline-indicator.js

@@ -1,18 +1,17 @@
-import tabs_underline_indicator_module_default from "./tabs-underline-indicator.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { tabsUnderlineIndicatorStyles } from "./tabs-underline-indicator.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-underline/tabs-underline-indicator.tsx
 function TabsUnderlineIndicator(props) {
-	const { className: customClassName = "", ...rest } = props;
-	const combinedClassName = tabsUnderlineIndicatorVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(tabsUnderlineIndicatorStyles.base, className);
 	return /* @__PURE__ */ jsx(Tabs.Indicator, {
 		className: combinedClassName,
-		"data-slot": "tabs-underline-indicator",
+		"data-component": "tabs-underline-indicator",
 		renderBeforeHydration: true,
 		...rest
 	});
 }
-const tabsUnderlineIndicatorVariants = cva(tabs_underline_indicator_module_default.base);
 //#endregion
-export { TabsUnderlineIndicator, tabsUnderlineIndicatorVariants };
+export { TabsUnderlineIndicator };

package/dist/components/tabs-underline/tabs-underline-indicator.stylex.js

@@ -0,0 +1,14 @@
+//#region src/components/tabs-underline/tabs-underline-indicator.stylex.ts
+const tabsUnderlineIndicatorStyles = { base: {
+	kWkggS: "xa4c8pb",
+	krVfgx: "x1ey2m1c",
+	kZKoxP: "x36qwtl",
+	kbCHJM: "xvbikie",
+	kVAEAm: "x10l6tqk",
+	kIyJzY: "xx6bhzk",
+	k1ekBW: "x1ym43eq",
+	kzqmXN: "xoffw1",
+	$$css: true
+} };
+//#endregion
+export { tabsUnderlineIndicatorStyles };

package/dist/components/tabs-underline/tabs-underline-list.d.ts

@@ -3,6 +3,5 @@ import { JSX } from "react";
 //#region src/components/tabs-underline/tabs-underline-list.d.ts
 interface TabsUnderlineListProps extends Tabs.List.Props {}
 declare function TabsUnderlineList(props: TabsUnderlineListProps): JSX.Element;
-declare const tabsUnderlineListVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { TabsUnderlineList, TabsUnderlineListProps, tabsUnderlineListVariants };
+export { TabsUnderlineList, TabsUnderlineListProps };

package/dist/components/tabs-underline/tabs-underline-list.js

@@ -1,19 +1,18 @@
+import { cn } from "../cn.js";
 import { TabsUnderlineIndicator } from "./tabs-underline-indicator.js";
-import tabs_underline_list_module_default from "./tabs-underline-list.module.js";
-import { cva } from "class-variance-authority";
+import { tabsUnderlineListStyles } from "./tabs-underline-list.stylex.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Tabs } from "@base-ui/react";
 //#region src/components/tabs-underline/tabs-underline-list.tsx
 function TabsUnderlineList(props) {
-	const { className: customClassName = "", children = void 0, ...rest } = props;
-	const combinedClassName = tabsUnderlineListVariants({ className: customClassName });
+	const { className = "", children = void 0, ...rest } = props;
+	const combinedClassName = cn(tabsUnderlineListStyles.base, className);
 	return /* @__PURE__ */ jsxs(Tabs.List, {
 		className: combinedClassName,
-		"data-slot": "tabs-underline-list",
+		"data-component": "tabs-underline-list",
 		...rest,
 		children: [children, /* @__PURE__ */ jsx(TabsUnderlineIndicator, {})]
 	});
 }
-const tabsUnderlineListVariants = cva(tabs_underline_list_module_default.base);
 //#endregion
-export { TabsUnderlineList, tabsUnderlineListVariants };
+export { TabsUnderlineList };