@nattstack/ui 0.0.107 → 0.1.1

package/dist/components/index.js

@@ -1,65 +1,66 @@
-import { Button, button } from "./button/button.js";
+import "./stylex.css";
 import { ButtonLink } from "./button-link/button-link.js";
-import { Checkbox, checkboxVariants } from "./checkbox/checkbox.js";
-import { Column, columnVariants } from "./column/column.js";
+import { Button } from "./button/button.js";
+import { Checkbox } from "./checkbox/checkbox.js";
+import { Column } from "./column/column.js";
 import { Combobox } from "./combobox/combobox.js";
 import { ComboboxCollection } from "./combobox/combobox-collection.js";
-import { ComboboxContent, comboboxContentVariants } from "./combobox/combobox-content.js";
-import { ComboboxEmpty, comboboxEmptyVariants } from "./combobox/combobox-empty.js";
-import { ComboboxGroup, comboboxGroupVariants } from "./combobox/combobox-group.js";
-import { ComboboxGroupLabel, comboboxGroupLabelVariants } from "./combobox/combobox-group-label.js";
-import { ComboboxInput, comboboxInputVariants } from "./combobox/combobox-input.js";
-import { ComboboxItem, comboboxItemVariants } from "./combobox/combobox-item.js";
-import { ComboboxList, comboboxListVariants } from "./combobox/combobox-list.js";
-import { ComboboxSearch, comboboxSearchVariants } from "./combobox/combobox-search.js";
-import { ComboboxSeparator, comboboxSeparatorVariants } from "./combobox/combobox-separator.js";
-import { ComboboxTrigger, comboboxTriggerVariants } from "./combobox/combobox-trigger.js";
-import { ComboboxValue, comboboxValueVariants } from "./combobox/combobox-value.js";
+import { ComboboxContent } from "./combobox/combobox-content.js";
+import { ComboboxEmpty } from "./combobox/combobox-empty.js";
+import { ComboboxGroup } from "./combobox/combobox-group.js";
+import { ComboboxGroupLabel } from "./combobox/combobox-group-label.js";
+import { ComboboxInput } from "./combobox/combobox-input.js";
+import { ComboboxItem } from "./combobox/combobox-item.js";
+import { ComboboxList } from "./combobox/combobox-list.js";
+import { ComboboxSearch } from "./combobox/combobox-search.js";
+import { ComboboxSeparator } from "./combobox/combobox-separator.js";
+import { ComboboxTrigger } from "./combobox/combobox-trigger.js";
+import { ComboboxValue } from "./combobox/combobox-value.js";
 import { DialogResponsive } from "./dialog-responsive/dialog-responsive.js";
-import { DialogResponsivePopup, dialogResponsivePopupVariants } from "./dialog-responsive/dialog-responsive-popup.js";
+import { DialogResponsivePopup } from "./dialog-responsive/dialog-responsive-popup.js";
 import { DialogResponsiveTrigger } from "./dialog-responsive/dialog-responsive-trigger.js";
-import { IconButton, iconButton } from "./icon-button/icon-button.js";
-import { Input, inputVariants } from "./input/input.js";
-import { Label, labelVariants } from "./label/label.js";
+import { IconButton } from "./icon-button/icon-button.js";
+import { Input } from "./input/input.js";
+import { Label } from "./label/label.js";
 import { Menu } from "./menu/menu.js";
-import { MenuCheckboxItem, menuCheckboxItemVariants } from "./menu/menu-checkbox-item.js";
-import { MenuContent, menuContentVariants } from "./menu/menu-content.js";
-import { MenuGroup, menuGroupVariants } from "./menu/menu-group.js";
-import { MenuGroupLabel, menuGroupLabelVariants } from "./menu/menu-group-label.js";
-import { MenuItem, menuItemVariants } from "./menu/menu-item.js";
-import { MenuLinkItem, menuLinkItemVariants } from "./menu/menu-link-item.js";
-import { MenuRadioGroup, menuRadioGroupVariants } from "./menu/menu-radio-group.js";
-import { MenuRadioItem, menuRadioItemVariants } from "./menu/menu-radio-item.js";
-import { MenuSeparator, menuSeparatorVariants } from "./menu/menu-separator.js";
+import { MenuCheckboxItem } from "./menu/menu-checkbox-item.js";
+import { MenuContent } from "./menu/menu-content.js";
+import { MenuGroup } from "./menu/menu-group.js";
+import { MenuGroupLabel } from "./menu/menu-group-label.js";
+import { MenuItem } from "./menu/menu-item.js";
+import { MenuLinkItem } from "./menu/menu-link-item.js";
+import { MenuRadioGroup } from "./menu/menu-radio-group.js";
+import { MenuRadioItem } from "./menu/menu-radio-item.js";
+import { MenuSeparator } from "./menu/menu-separator.js";
 import { MenuSubmenu } from "./menu/menu-submenu.js";
-import { MenuSubmenuTrigger, menuSubmenuTriggerVariants } from "./menu/menu-submenu-trigger.js";
+import { MenuSubmenuTrigger } from "./menu/menu-submenu-trigger.js";
 import { MenuTrigger } from "./menu/menu-trigger.js";
-import { OTPField, otpFieldVariants } from "./otp-field/otp-field.js";
-import { OTPFieldInput, otpFieldInputVariants } from "./otp-field/otp-field-input.js";
-import { Row, rowVariants } from "./row/row.js";
+import { OTPField } from "./otp-field/otp-field.js";
+import { OTPFieldInput } from "./otp-field/otp-field-input.js";
+import { Row } from "./row/row.js";
 import { Select } from "./select/select.js";
-import { SelectContent, selectContentVariants } from "./select/select-content.js";
-import { SelectGroup, selectGroupVariants } from "./select/select-group.js";
-import { SelectGroupLabel, selectGroupLabelVariants } from "./select/select-group-label.js";
-import { SelectItem, selectItemVariants } from "./select/select-item.js";
-import { SelectSeparator, selectSeparatorVariants } from "./select/select-separator.js";
-import { SelectTrigger, selectTriggerVariants } from "./select/select-trigger.js";
-import { SelectValue, selectValueVariants } from "./select/select-value.js";
-import { Spacer, spacerVariants } from "./spacer/spacer.js";
-import { Switch, switchVariants } from "./switch/switch.js";
-import { TabsPillList, tabsPillListVariants } from "./tabs-pill/tabs-pill-list.js";
-import { TabsPillTab, tabsPillTabVariants } from "./tabs-pill/tabs-pill-tab.js";
-import { TabsSegmentedList, tabsSegmentedListVariants } from "./tabs-segmented/tabs-segmented-list.js";
-import { TabsSegmentedTab, tabsSegmentedTabVariants } from "./tabs-segmented/tabs-segmented-tab.js";
-import { TabsUnderlineList, tabsUnderlineListVariants } from "./tabs-underline/tabs-underline-list.js";
-import { TabsUnderlineTab, tabsUnderlineTabVariants } from "./tabs-underline/tabs-underline-tab.js";
-import { Tabs, tabsVariants } from "./tabs/tabs.js";
-import { TabsPanel, tabsPanelVariants } from "./tabs/tabs-panel.js";
-import { Textarea, textareaVariants } from "./textarea/textarea.js";
-import { ToggleGroup, toggleGroupVariants } from "./toggle-group/toggle-group.js";
-import { ToggleGroupItem, toggleGroupItemVariants } from "./toggle-group/toggle-group-item.js";
+import { SelectContent } from "./select/select-content.js";
+import { SelectGroup } from "./select/select-group.js";
+import { SelectGroupLabel } from "./select/select-group-label.js";
+import { SelectItem } from "./select/select-item.js";
+import { SelectSeparator } from "./select/select-separator.js";
+import { SelectTrigger } from "./select/select-trigger.js";
+import { SelectValue } from "./select/select-value.js";
+import { Spacer } from "./spacer/spacer.js";
+import { Switch } from "./switch/switch.js";
+import { TabsPillList } from "./tabs-pill/tabs-pill-list.js";
+import { TabsPillTab } from "./tabs-pill/tabs-pill-tab.js";
+import { TabsSegmentedList } from "./tabs-segmented/tabs-segmented-list.js";
+import { TabsSegmentedTab } from "./tabs-segmented/tabs-segmented-tab.js";
+import { TabsUnderlineList } from "./tabs-underline/tabs-underline-list.js";
+import { TabsUnderlineTab } from "./tabs-underline/tabs-underline-tab.js";
+import { Tabs } from "./tabs/tabs.js";
+import { TabsPanel } from "./tabs/tabs-panel.js";
+import { Textarea } from "./textarea/textarea.js";
+import { ToggleGroup } from "./toggle-group/toggle-group.js";
+import { ToggleGroupItem } from "./toggle-group/toggle-group-item.js";
 import { Tooltip } from "./tooltip/tooltip.js";
-import { TooltipPopup, tooltipPopupVariants } from "./tooltip/tooltip-popup.js";
+import { TooltipPopup } from "./tooltip/tooltip-popup.js";
 import { TooltipProvider } from "./tooltip/tooltip-provider.js";
 import { TooltipTrigger } from "./tooltip/tooltip-trigger.js";
-export { Button, ButtonLink, Checkbox, Column, Combobox, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxSearch, ComboboxSeparator, ComboboxTrigger, ComboboxValue, DialogResponsive, DialogResponsivePopup, DialogResponsiveTrigger, IconButton, Input, Label, Menu, MenuCheckboxItem, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuLinkItem, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, OTPField, OTPFieldInput, Row, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue, Spacer, Switch, Tabs, TabsPanel, TabsPillList, TabsPillTab, TabsSegmentedList, TabsSegmentedTab, TabsUnderlineList, TabsUnderlineTab, Textarea, ToggleGroup, ToggleGroupItem, Tooltip, TooltipPopup, TooltipProvider, TooltipTrigger, button, checkboxVariants, columnVariants, comboboxContentVariants, comboboxEmptyVariants, comboboxGroupLabelVariants, comboboxGroupVariants, comboboxInputVariants, comboboxItemVariants, comboboxListVariants, comboboxSearchVariants, comboboxSeparatorVariants, comboboxTriggerVariants, comboboxValueVariants, dialogResponsivePopupVariants, iconButton, inputVariants, labelVariants, menuCheckboxItemVariants, menuContentVariants, menuGroupLabelVariants, menuGroupVariants, menuItemVariants, menuLinkItemVariants, menuRadioGroupVariants, menuRadioItemVariants, menuSeparatorVariants, menuSubmenuTriggerVariants, otpFieldInputVariants, otpFieldVariants, rowVariants, selectContentVariants, selectGroupLabelVariants, selectGroupVariants, selectItemVariants, selectSeparatorVariants, selectTriggerVariants, selectValueVariants, spacerVariants, switchVariants, tabsPanelVariants, tabsPillListVariants, tabsPillTabVariants, tabsSegmentedListVariants, tabsSegmentedTabVariants, tabsUnderlineListVariants, tabsUnderlineTabVariants, tabsVariants, textareaVariants, toggleGroupItemVariants, toggleGroupVariants, tooltipPopupVariants };
+export { Button, ButtonLink, Checkbox, Column, Combobox, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, ComboboxList, ComboboxSearch, ComboboxSeparator, ComboboxTrigger, ComboboxValue, DialogResponsive, DialogResponsivePopup, DialogResponsiveTrigger, IconButton, Input, Label, Menu, MenuCheckboxItem, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuLinkItem, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, OTPField, OTPFieldInput, Row, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, SelectTrigger, SelectValue, Spacer, Switch, Tabs, TabsPanel, TabsPillList, TabsPillTab, TabsSegmentedList, TabsSegmentedTab, TabsUnderlineList, TabsUnderlineTab, Textarea, ToggleGroup, ToggleGroupItem, Tooltip, TooltipPopup, TooltipProvider, TooltipTrigger };

package/dist/components/input/input.d.ts

@@ -1,22 +1,13 @@
-import { VariantProps } from "class-variance-authority";
 import { ComponentProps, JSX } from "react";
 //#region src/components/input/input.d.ts
-interface InputProps extends Omit<ComponentProps<"input">, "aria-pressed" | "autoFocus" | "disabled" | "readOnly" | "required"> {
-  isActive?: boolean;
-  isAutoFocus?: boolean;
-  isDisabled?: boolean;
-  isInvalid?: boolean;
-  isReadOnly?: boolean;
-  isRequired?: boolean;
-  isRounded?: boolean;
-  isValid?: boolean;
+interface InputProps extends Omit<ComponentProps<"input">, "aria-pressed"> {
+  active?: boolean;
+  invalid?: boolean;
+  rounded?: boolean;
   size?: InputSize;
+  valid?: boolean;
 }
-type InputSize = NonNullable<VariantProps<typeof inputVariants>["size"]>;
+type InputSize = 32 | 36 | 40 | 44 | 48;
 declare function Input(props: InputProps): JSX.Element;
-declare const inputVariants: (props?: ({
-  isRounded?: boolean | null | undefined;
-  size?: 32 | 36 | 40 | 44 | 48 | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //#endregion
-export { Input, InputProps, inputVariants };
+export { Input, InputProps, InputSize };

package/dist/components/input/input.js

@@ -1,46 +1,19 @@
-import input_module_default from "./input.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { inputStyles, inputStylesBy } from "./input.stylex.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/input/input.tsx
 function Input(props) {
-	const { className: customClassName = "", isActive = false, isAutoFocus = false, isDisabled = false, isInvalid = void 0, isReadOnly = false, isRequired = false, isRounded = false, isValid = void 0, size = 48, type = "text", ...rest } = props;
-	const combinedClassName = inputVariants({
-		className: customClassName,
-		isRounded,
-		size
-	});
+	const { className = "", active = false, invalid = void 0, rounded = false, size = 48, valid = void 0, ...rest } = props;
+	const combinedClassName = cn(inputStyles.base, inputStylesBy.size[size], rounded && inputStylesBy.rounded.full, className);
 	return /* @__PURE__ */ jsx("input", {
-		autoFocus: isAutoFocus,
 		className: combinedClassName,
-		"data-is-active": isActive,
-		"data-is-invalid": isInvalid,
-		"data-is-valid": isValid,
-		"data-slot": "input",
-		disabled: isDisabled,
-		readOnly: isReadOnly,
-		required: isRequired,
-		type,
+		"data-component": "input",
+		"data-is-active": active,
+		"data-is-invalid": invalid,
+		"data-is-valid": valid,
+		type: "text",
 		...rest
 	});
 }
-const inputVariants = cva(input_module_default.base, {
-	defaultVariants: {
-		isRounded: false,
-		size: 48
-	},
-	variants: {
-		isRounded: {
-			false: input_module_default.rounded_base,
-			true: input_module_default.rounded_full
-		},
-		size: {
-			32: input_module_default.size_32,
-			36: input_module_default.size_36,
-			40: input_module_default.size_40,
-			44: input_module_default.size_44,
-			48: input_module_default.size_48
-		}
-	}
-});
 //#endregion
-export { Input, inputVariants };
+export { Input };

package/dist/components/input/input.stylex.js

@@ -0,0 +1,84 @@
+//#region src/components/input/input.stylex.ts
+const inputStyles = {
+	base: {
+		k8Qsv1: "x1ta7s2x",
+		kI5SfV: "xjp5s5a",
+		kysU6D: "xjyslct",
+		kWkggS: "x1h73wb5",
+		ksu8eU: "xng3xce",
+		kGVxlE: "xnn6d81 xho1339 x1rlgnxn xhxsgan x1er153n",
+		kMwMTN: "x1tgivj0",
+		kkrTdU: "x1s07b3s x1ed109x",
+		kGuDYH: "xif65rj",
+		k63SB2: "xo1l8bm",
+		kLWn49: "x1evy7pa",
+		kSiTet: "xijokvz x1hc1fzr",
+		kjBf7l: "xfcj4rt x43j12e x1mr6snm x1uczgqu",
+		kInvED: "x2ssjo2",
+		k3XXqK: "xaatb59",
+		kMeerF: "x1de99jn",
+		kybGjl: "x1hl2dhg",
+		kIyJzY: "xx6bhzk",
+		k1ekBW: "xe97l14",
+		kzqmXN: "xh8yej3",
+		$$css: true
+	},
+	rounded_base: {
+		kaIpWk: "x4pepcl",
+		$$css: true
+	},
+	rounded_full: {
+		kaIpWk: "x10hpsqq",
+		$$css: true
+	},
+	size_32: {
+		kaIpWk: "xur7f20",
+		kAzted: "x21xpn4",
+		k8WAf4: "xt970qd",
+		kg3NbH: "xdqyycr",
+		$$css: true
+	},
+	size_36: {
+		kaIpWk: "xhpnuu7",
+		kAzted: "xu0aao5",
+		k8WAf4: "xt970qd",
+		kg3NbH: "x1awh872",
+		$$css: true
+	},
+	size_40: {
+		kaIpWk: "x1q4ynmn",
+		kAzted: "x1ba4aug",
+		k8WAf4: "xt970qd",
+		kg3NbH: "xaope02",
+		$$css: true
+	},
+	size_44: {
+		kaIpWk: "x1ctf4ec",
+		kAzted: "x1gg8mnh",
+		k8WAf4: "xt970qd",
+		kg3NbH: "xqin4a2",
+		$$css: true
+	},
+	size_48: {
+		kaIpWk: "x4pepcl",
+		kAzted: "x1wxaq2x",
+		k8WAf4: "xt970qd",
+		kg3NbH: "x1hr3lfm",
+		$$css: true
+	}
+};
+const inputStylesBy = {
+	rounded: {
+		base: inputStyles.rounded_base,
+		full: inputStyles.rounded_full
+	},
+	size: {
+		32: inputStyles.size_32,
+		36: inputStyles.size_36,
+		40: inputStyles.size_40,
+		44: inputStyles.size_44,
+		48: inputStyles.size_48
+	}
+};
+//#endregion
+export { inputStyles, inputStylesBy };

package/dist/components/label/label.d.ts

@@ -2,6 +2,5 @@ import { ComponentProps, JSX } from "react";
 //#region src/components/label/label.d.ts
 interface LabelProps extends ComponentProps<"label"> {}
 declare function Label(props: LabelProps): JSX.Element;
-declare const labelVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { Label, LabelProps, labelVariants };
+export { Label, LabelProps };

package/dist/components/label/label.js

@@ -1,18 +1,17 @@
-import label_module_default from "./label.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { labelStyles } from "./label.stylex.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/label/label.tsx
 function Label(props) {
-	const { className: customClassName = "", htmlFor = void 0, children = void 0, ...rest } = props;
-	const combinedClassName = labelVariants({ className: customClassName });
+	const { className = "", htmlFor = void 0, children = void 0, ...rest } = props;
+	const combinedClassName = cn(labelStyles.base, className);
 	return /* @__PURE__ */ jsx("label", {
 		className: combinedClassName,
-		"data-slot": "label",
+		"data-component": "label",
 		htmlFor,
 		...rest,
 		children
 	});
 }
-const labelVariants = cva(label_module_default.base);
 //#endregion
-export { Label, labelVariants };
+export { Label };

package/dist/components/label/label.stylex.js

@@ -0,0 +1,10 @@
+//#region src/components/label/label.stylex.ts
+const labelStyles = { base: {
+	kMwMTN: "xv1l7n4",
+	kGuDYH: "x4z9k3i",
+	k63SB2: "x10p5zqr",
+	kzqmXN: "xeq5yr9",
+	$$css: true
+} };
+//#endregion
+export { labelStyles };

package/dist/components/menu/menu-checkbox-item.d.ts

@@ -1,13 +1,9 @@
 import { Menu } from "@base-ui/react";
 import { JSX } from "react";
 //#region src/components/menu/menu-checkbox-item.d.ts
-interface MenuCheckboxItemProps extends Omit<Menu.CheckboxItem.Props, "checked" | "className" | "defaultChecked" | "disabled"> {
+interface MenuCheckboxItemProps extends Omit<Menu.CheckboxItem.Props, "className"> {
   className?: string;
-  isChecked?: Menu.CheckboxItem.Props["checked"];
-  isDefaultChecked?: Menu.CheckboxItem.Props["defaultChecked"];
-  isDisabled?: Menu.CheckboxItem.Props["disabled"];
 }
 declare function MenuCheckboxItem(props: MenuCheckboxItemProps): JSX.Element;
-declare const menuCheckboxItemVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { MenuCheckboxItem, MenuCheckboxItemProps, menuCheckboxItemVariants };
+export { MenuCheckboxItem, MenuCheckboxItemProps };

package/dist/components/menu/menu-checkbox-item.js

@@ -1,25 +1,22 @@
-import picker_item_module_default from "../picker/picker-item.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { pickerItemStyles } from "../picker/picker-item.stylex.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Menu } from "@base-ui/react";
 //#region src/components/menu/menu-checkbox-item.tsx
 function MenuCheckboxItem(props) {
-	const { children, className: customClassName = "", isChecked = void 0, isDefaultChecked = false, isDisabled = false, ...rest } = props;
-	const combinedClassName = menuCheckboxItemVariants({ className: customClassName });
+	const { children, className = "", ...rest } = props;
+	const combinedClassName = cn(pickerItemStyles.base, className);
 	return /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
-		checked: isChecked,
 		className: combinedClassName,
-		"data-slot": "menu-checkbox-item",
-		defaultChecked: isDefaultChecked,
-		disabled: isDisabled,
+		"data-component": "menu-checkbox-item",
 		...rest,
 		children: [/* @__PURE__ */ jsx("span", {
-			className: picker_item_module_default.label,
-			"data-slot": "menu-checkbox-item-text",
+			className: cn(pickerItemStyles.label),
+			"data-component": "menu-checkbox-item-text",
 			children
 		}), /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, {
-			className: picker_item_module_default.indicator,
-			"data-slot": "menu-checkbox-item-indicator",
+			className: cn(pickerItemStyles.indicator),
+			"data-component": "menu-checkbox-item-indicator",
 			children: /* @__PURE__ */ jsx("svg", {
 				height: "14px",
 				viewBox: "0 0 18 18",
@@ -39,6 +36,5 @@ function MenuCheckboxItem(props) {
 		})]
 	});
 }
-const menuCheckboxItemVariants = cva(picker_item_module_default.base);
 //#endregion
-export { MenuCheckboxItem, menuCheckboxItemVariants };
+export { MenuCheckboxItem };

package/dist/components/menu/menu-content.d.ts

@@ -6,6 +6,5 @@ interface MenuContentProps extends Omit<Menu.Popup.Props, "className">, Pick<Men
   container?: Menu.Portal.Props["container"];
 }
 declare function MenuContent(props: MenuContentProps): JSX.Element;
-declare const menuContentVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { MenuContent, MenuContentProps, menuContentVariants };
+export { MenuContent, MenuContentProps };

package/dist/components/menu/menu-content.js

@@ -1,26 +1,26 @@
-import picker_popup_module_default from "../picker/picker-popup.module.js";
-import picker_list_module_default from "../picker/picker-list.module.js";
-import menu_content_module_default from "./menu-content.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { pickerPopupStyles } from "../picker/picker-popup.stylex.js";
+import { pickerListStyles } from "../picker/picker-list.stylex.js";
+import { menuContentStyles } from "./menu-content.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Menu } from "@base-ui/react";
 //#region src/components/menu/menu-content.tsx
 function MenuContent(props) {
-	const { align = "start", alignOffset = getDefaultAlignOffset, anchor = void 0, arrowPadding = void 0, children, className: customClassName = "", collisionAvoidance = void 0, collisionBoundary = void 0, collisionPadding = void 0, container = void 0, disableAnchorTracking = void 0, positionMethod = void 0, side = void 0, sideOffset = getDefaultSideOffset, sticky = void 0, ...rest } = props;
-	const combinedClassName = menuContentVariants({ className: customClassName });
+	const { align = "start", alignOffset = getDefaultAlignOffset, anchor = void 0, arrowPadding = void 0, children, className = "", collisionAvoidance = void 0, collisionBoundary = void 0, collisionPadding = void 0, container = void 0, disableAnchorTracking = void 0, positionMethod = void 0, side = void 0, sideOffset = getDefaultSideOffset, sticky = void 0, ...rest } = props;
+	const combinedClassName = cn(pickerPopupStyles.base, menuContentStyles.base, className);
 	return /* @__PURE__ */ jsx(Menu.Portal, {
 		container,
-		"data-slot": "menu-portal",
+		"data-component": "menu-portal",
 		children: /* @__PURE__ */ jsx(Menu.Positioner, {
 			align,
 			alignOffset,
 			anchor,
 			arrowPadding,
-			className: picker_popup_module_default.positioner,
+			className: cn(pickerPopupStyles.positioner),
 			collisionAvoidance,
 			collisionBoundary,
 			collisionPadding,
-			"data-slot": "menu-positioner",
+			"data-component": "menu-positioner",
 			disableAnchorTracking,
 			positionMethod,
 			side,
@@ -28,11 +28,11 @@ function MenuContent(props) {
 			sticky,
 			children: /* @__PURE__ */ jsx(Menu.Popup, {
 				className: combinedClassName,
-				"data-slot": "menu-content",
+				"data-component": "menu-content",
 				...rest,
 				children: /* @__PURE__ */ jsx("div", {
-					className: picker_list_module_default.base,
-					"data-slot": "menu-list",
+					className: cn(pickerListStyles.base),
+					"data-component": "menu-list",
 					children
 				})
 			})
@@ -45,6 +45,5 @@ function getDefaultAlignOffset(data) {
 function getDefaultSideOffset(data) {
 	return data.side === "bottom" || data.side === "top" ? 6 : -4;
 }
-const menuContentVariants = cva([picker_popup_module_default.base, menu_content_module_default.base]);
 //#endregion
-export { MenuContent, menuContentVariants };
+export { MenuContent };

package/dist/components/menu/menu-content.stylex.js

@@ -0,0 +1,9 @@
+//#region src/components/menu/menu-content.stylex.ts
+const menuContentStyles = { base: {
+	ks0D6T: "xnx49gs",
+	k7Eaqz: "xfb3i0g",
+	kzqmXN: "xezivpi",
+	$$css: true
+} };
+//#endregion
+export { menuContentStyles };

package/dist/components/menu/menu-group-label.d.ts

@@ -5,6 +5,5 @@ interface MenuGroupLabelProps extends Omit<Menu.GroupLabel.Props, "className"> {
   className?: string;
 }
 declare function MenuGroupLabel(props: MenuGroupLabelProps): JSX.Element;
-declare const menuGroupLabelVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { MenuGroupLabel, MenuGroupLabelProps, menuGroupLabelVariants };
+export { MenuGroupLabel, MenuGroupLabelProps };

package/dist/components/menu/menu-group-label.js

@@ -1,17 +1,16 @@
-import picker_group_module_default from "../picker/picker-group.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { pickerGroupStyles } from "../picker/picker-group.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Menu } from "@base-ui/react";
 //#region src/components/menu/menu-group-label.tsx
 function MenuGroupLabel(props) {
-	const { className: customClassName = "", ...rest } = props;
-	const combinedClassName = menuGroupLabelVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(pickerGroupStyles.label, className);
 	return /* @__PURE__ */ jsx(Menu.GroupLabel, {
 		className: combinedClassName,
-		"data-slot": "menu-group-label",
+		"data-component": "menu-group-label",
 		...rest
 	});
 }
-const menuGroupLabelVariants = cva(picker_group_module_default.label);
 //#endregion
-export { MenuGroupLabel, menuGroupLabelVariants };
+export { MenuGroupLabel };

package/dist/components/menu/menu-group.d.ts

@@ -5,6 +5,5 @@ interface MenuGroupProps extends Omit<Menu.Group.Props, "className"> {
   className?: string;
 }
 declare function MenuGroup(props: MenuGroupProps): JSX.Element;
-declare const menuGroupVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { MenuGroup, MenuGroupProps, menuGroupVariants };
+export { MenuGroup, MenuGroupProps };

package/dist/components/menu/menu-group.js

@@ -1,17 +1,16 @@
-import picker_group_module_default from "../picker/picker-group.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { pickerGroupStyles } from "../picker/picker-group.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Menu } from "@base-ui/react";
 //#region src/components/menu/menu-group.tsx
 function MenuGroup(props) {
-	const { className: customClassName = "", ...rest } = props;
-	const combinedClassName = menuGroupVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(pickerGroupStyles.base, className);
 	return /* @__PURE__ */ jsx(Menu.Group, {
 		className: combinedClassName,
-		"data-slot": "menu-group",
+		"data-component": "menu-group",
 		...rest
 	});
 }
-const menuGroupVariants = cva(picker_group_module_default.base);
 //#endregion
-export { MenuGroup, menuGroupVariants };
+export { MenuGroup };

package/dist/components/menu/menu-item.d.ts

@@ -1,11 +1,9 @@
 import { Menu } from "@base-ui/react";
 import { JSX } from "react";
 //#region src/components/menu/menu-item.d.ts
-interface MenuItemProps extends Omit<Menu.Item.Props, "className" | "disabled"> {
+interface MenuItemProps extends Omit<Menu.Item.Props, "className"> {
   className?: string;
-  isDisabled?: Menu.Item.Props["disabled"];
 }
 declare function MenuItem(props: MenuItemProps): JSX.Element;
-declare const menuItemVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { MenuItem, MenuItemProps, menuItemVariants };
+export { MenuItem, MenuItemProps };

package/dist/components/menu/menu-item.js

@@ -1,19 +1,17 @@
-import picker_item_module_default from "../picker/picker-item.module.js";
-import menu_item_module_default from "./menu-item.module.js";
-import { cva } from "class-variance-authority";
+import { cn } from "../cn.js";
+import { pickerItemStyles } from "../picker/picker-item.stylex.js";
+import { menuItemStyles } from "./menu-item.stylex.js";
 import { jsx } from "react/jsx-runtime";
 import { Menu } from "@base-ui/react";
 //#region src/components/menu/menu-item.tsx
 function MenuItem(props) {
-	const { className: customClassName = "", isDisabled = false, ...rest } = props;
-	const combinedClassName = menuItemVariants({ className: customClassName });
+	const { className = "", ...rest } = props;
+	const combinedClassName = cn(pickerItemStyles.base, menuItemStyles.base, className);
 	return /* @__PURE__ */ jsx(Menu.Item, {
 		className: combinedClassName,
-		"data-slot": "menu-item",
-		disabled: isDisabled,
+		"data-component": "menu-item",
 		...rest
 	});
 }
-const menuItemVariants = cva([picker_item_module_default.base, menu_item_module_default.base]);
 //#endregion
-export { MenuItem, menuItemVariants };
+export { MenuItem };

package/dist/components/menu/menu-item.stylex.js

@@ -0,0 +1,9 @@
+//#region src/components/menu/menu-item.stylex.ts
+const menuItemStyles = { base: {
+	kMwMTN: "x1tgivj0",
+	kGuDYH: "xif65rj",
+	k63SB2: "x10p5zqr",
+	$$css: true
+} };
+//#endregion
+export { menuItemStyles };

package/dist/components/menu/menu-link-item.d.ts

@@ -5,6 +5,5 @@ interface MenuLinkItemProps extends Omit<Menu.LinkItem.Props, "className"> {
   className?: string;
 }
 declare function MenuLinkItem(props: MenuLinkItemProps): JSX.Element;
-declare const menuLinkItemVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 //#endregion
-export { MenuLinkItem, MenuLinkItemProps, menuLinkItemVariants };
+export { MenuLinkItem, MenuLinkItemProps };