@fea-ui/react 0.1.0-alpha.8 → 0.1.0-alpha.9

package/dist/index.cjs

@@ -31,6 +31,7 @@ let lucide_react = require("lucide-react");
 let react = require("react");
 react = __toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
+let react_aria_components = require("react-aria-components");
 
 //#region src/components/accordion/accordion.context.ts
 const AccordionContext = (0, react.createContext)(null);
@@ -109,14 +110,111 @@ const AccordionContent = ({ className, ...props }) => {
 		...props
 	});
 };
-Accordion.Content = AccordionContent;
-Accordion.Header = AccordionHeader;
-Accordion.Item = AccordionItem;
-Accordion.Panel = AccordionPanel;
-Accordion.Root = Accordion;
-Accordion.Trigger = AccordionTrigger;
-Accordion.TriggerIcon = AccordionTriggerIcon;
-var accordion_default = Accordion;
+var accordion_default = Object.assign(Accordion, {
+	Content: AccordionContent,
+	Header: AccordionHeader,
+	Item: AccordionItem,
+	Panel: AccordionPanel,
+	Root: Accordion,
+	Trigger: AccordionTrigger,
+	TriggerIcon: AccordionTriggerIcon
+});
+
+//#endregion
+//#region src/components/alert/alert.context.ts
+const AlertContext = (0, react.createContext)(null);
+
+//#endregion
+//#region src/components/alert/alert.variants.ts
+const alertVariants = (0, tailwind_variants.tv)({
+	defaultVariants: { variant: "info" },
+	slots: {
+		content: "alert__content",
+		description: "alert__description",
+		indicator: "alert__indicator",
+		root: "alert",
+		title: "alert__title"
+	},
+	variants: { variant: {
+		danger: { root: "alert--danger" },
+		info: { root: "alert--info" },
+		primary: { root: "alert--primary" },
+		success: { root: "alert--success" },
+		warning: { root: "alert--warning" }
+	} }
+});
+
+//#endregion
+//#region src/components/alert/use-alert.ts
+const useAlert = () => {
+	const context = (0, react.useContext)(AlertContext);
+	if (!context) throw new Error("useAlert must be used within a AlertProvider");
+	return context;
+};
+
+//#endregion
+//#region src/components/alert/alert.tsx
+const Alert = ({ className, variant, ...props }) => {
+	const slots = (0, react.useMemo)(() => alertVariants({
+		className,
+		variant
+	}), [className, variant]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlertContext, {
+		value: {
+			slots,
+			variant
+		},
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: (0, tailwind_variants.cn)(className, slots.root()),
+			...props
+		})
+	});
+};
+const AlertIndicator = ({ className, children, ...props }) => {
+	const { slots, variant } = useAlert();
+	const IndicatorIcon = ({ children: children$1 }) => {
+		if (children$1) return children$1;
+		switch (variant) {
+			case "danger": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideXCircle, {});
+			case "success": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideCheckCircle, {});
+			case "warning": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideAlertTriangle, {});
+			default: return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideInfo, {});
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, tailwind_variants.cn)(className, slots.indicator()),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IndicatorIcon, { children })
+	});
+};
+const AlertContent = ({ className, ...props }) => {
+	const { slots } = useAlert();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, tailwind_variants.cn)(className, slots.content()),
+		...props
+	});
+};
+const AlertTitle = ({ className, ...props }) => {
+	const { slots } = useAlert();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, tailwind_variants.cn)(className, slots.title()),
+		...props
+	});
+};
+const AlertDescription = ({ className, ...props }) => {
+	const { slots } = useAlert();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, tailwind_variants.cn)(className, slots.description()),
+		...props
+	});
+};
+var alert_default = Object.assign(Alert, {
+	Content: AlertContent,
+	Description: AlertDescription,
+	Indicator: AlertIndicator,
+	Root: Alert,
+	Title: AlertTitle
+});
 
 //#endregion
 //#region src/components/alert-dialog/alert-dialog.context.ts
@@ -209,16 +307,17 @@ const AlertDialogClose = ({ className, children, ...props }) => {
 		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideX, {})
 	});
 };
-AlertDialog.Root = AlertDialog;
-AlertDialog.Trigger = AlertDialogTrigger;
-AlertDialog.Portal = AlertDialogPortal;
-AlertDialog.Backdrop = AlertDialogBackdrop;
-AlertDialog.Viewport = AlertDialogViewport;
-AlertDialog.Popup = AlertDialogPopup;
-AlertDialog.Title = AlertDialogTitle;
-AlertDialog.Description = AlertDialogDescription;
-AlertDialog.Close = AlertDialogClose;
-var alert_dialog_default = AlertDialog;
+var alert_dialog_default = Object.assign(AlertDialog, {
+	Backdrop: AlertDialogBackdrop,
+	Close: AlertDialogClose,
+	Description: AlertDialogDescription,
+	Popup: AlertDialogPopup,
+	Portal: AlertDialogPortal,
+	Root: AlertDialog,
+	Title: AlertDialogTitle,
+	Trigger: AlertDialogTrigger,
+	Viewport: AlertDialogViewport
+});
 
 //#endregion
 //#region src/components/avatar/avatar.context.ts
@@ -274,10 +373,11 @@ const AvatarFallback = ({ className, ...props }) => {
 		...props
 	});
 };
-Avatar.Fallback = AvatarFallback;
-Avatar.Image = AvatarImage;
-Avatar.Root = Avatar;
-var avatar_default = Avatar;
+var avatar_default = Object.assign(Avatar, {
+	Fallback: AvatarFallback,
+	Image: AvatarImage,
+	Root: Avatar
+});
 
 //#endregion
 //#region src/components/button/button.variants.ts
@@ -308,7 +408,7 @@ const buttonVariants = (0, tailwind_variants.tv)({
 //#endregion
 //#region src/components/button/button.tsx
 const Button = ({ className, variant, size, isIconOnly, ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Button, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Button, {
 		className: (0, tailwind_variants.cn)(buttonVariants({
 			isIconOnly,
 			size,
@@ -412,58 +512,14 @@ const CardDescription = ({ className, ...props }) => {
 	});
 };
 /** Exports */
-Card.Body = CardBody;
-Card.Description = CardDescription;
-Card.Footer = CardFooter;
-Card.Header = CardHeader;
-Card.Root = Card;
-Card.Title = CardTitle;
-var card_default = Card;
-
-//#endregion
-//#region src/components/checkbox/checkbox.context.ts
-const CheckboxContext = (0, react.createContext)(null);
-
-//#endregion
-//#region src/components/checkbox/checkbox.variants.ts
-const checkboxVariants = (0, tailwind_variants.tv)({ slots: {
-	checkboxIcon: "checkbox__icon",
-	indicator: "checkbox__indicator",
-	label: "checkbox__label",
-	root: "checkbox"
-} });
-
-//#endregion
-//#region src/components/checkbox/use-checkbox.ts
-const useCheckbox = () => {
-	const ctx = (0, react.useContext)(CheckboxContext);
-	if (!ctx) throw new Error("CheckboxContext must be used with in the Checkbox component.");
-	return ctx;
-};
-
-//#endregion
-//#region src/components/checkbox/checkbox.tsx
-const Checkbox = ({ className, ...props }) => {
-	const slots = (0, react.useMemo)(() => checkboxVariants(), []);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckboxContext.Provider, {
-		value: { slots },
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Checkbox.Root, {
-			className: (0, tailwind_variants.cn)(className, slots.root()),
-			...props
-		})
-	});
-};
-const CheckboxIndicator = ({ className, ...props }) => {
-	const { slots } = useCheckbox();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Checkbox.Indicator, {
-		className: (0, tailwind_variants.cn)(className, slots.indicator()),
-		...props,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideCheck, { className: slots.checkboxIcon() })
-	});
-};
-Checkbox.Indicator = CheckboxIndicator;
-Checkbox.Root = Checkbox;
-var checkbox_default = Checkbox;
+var card_default = Object.assign(Card, {
+	Body: CardBody,
+	Description: CardDescription,
+	Footer: CardFooter,
+	Header: CardHeader,
+	Root: Card,
+	Title: CardTitle
+});
 
 //#endregion
 //#region src/components/checkbox-group/checkbox-group.variants.ts
@@ -472,7 +528,7 @@ const checkboxGroupVariants = (0, tailwind_variants.tv)({ base: "checkbox-group"
 //#endregion
 //#region src/components/checkbox-group/checkbox-group.tsx
 const CheckboxGroup = ({ className, ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.CheckboxGroup, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.CheckboxGroup, {
 		className: (0, tailwind_variants.cn)(className, checkboxGroupVariants()),
 		...props
 	});
@@ -530,6 +586,22 @@ const Container = ({ className, ...props }) => {
 };
 var container_default = Container;
 
+//#endregion
+//#region src/components/description/description.variants.ts
+const descriptionVariants = (0, tailwind_variants.tv)({ base: "description" });
+
+//#endregion
+//#region src/components/description/description.tsx
+const Description = ({ className, ...props }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Text, {
+		className: (0, tailwind_variants.cn)(className, descriptionVariants()),
+		"data-slot": "description",
+		slot: "description",
+		...props
+	});
+};
+var description_default = Description;
+
 //#endregion
 //#region src/components/dialog/dialog.context.ts
 const DialogContext = (0, react.createContext)(null);
@@ -622,16 +694,17 @@ const DialogClose = ({ className, ...props }) => {
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideX, {})
 	});
 };
-Dialog.Backdrop = DialogBackdrop;
-Dialog.Close = DialogClose;
-Dialog.Description = DialogDescription;
-Dialog.Popup = DialogPopup;
-Dialog.Portal = DialogPortal;
-Dialog.Root = Dialog;
-Dialog.Title = DialogTitle;
-Dialog.Trigger = DialogTrigger;
-Dialog.Viewport = DialogViewport;
-var dialog_default = Dialog;
+var dialog_default = Object.assign(Dialog, {
+	Backdrop: DialogBackdrop,
+	Close: DialogClose,
+	Description: DialogDescription,
+	Popup: DialogPopup,
+	Portal: DialogPortal,
+	Root: Dialog,
+	Title: DialogTitle,
+	Trigger: DialogTrigger,
+	Viewport: DialogViewport
+});
 
 //#endregion
 //#region src/components/drawer/drawer.context.ts
@@ -733,93 +806,33 @@ const DrawerClose = ({ className, children, ...props }) => {
 		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideX, {})
 	});
 };
-Drawer.Root = Drawer;
-Drawer.Trigger = DrawerTrigger;
-Drawer.Portal = DrawerPortal;
-Drawer.Backdrop = DrawerBackdrop;
-Drawer.Viewport = DrawerViewport;
-Drawer.Popup = DrawerPopup;
-Drawer.Title = DrawerTitle;
-Drawer.Description = DrawerDescription;
-Drawer.Close = DrawerClose;
-var drawer_default = Drawer;
-
-//#endregion
-//#region src/components/field/field.context.ts
-const FieldContext = (0, react.createContext)(null);
-
-//#endregion
-//#region src/components/field/field.variants.ts
-const fieldVariants = (0, tailwind_variants.tv)({
-	slots: {
-		control: "input",
-		description: "field__description",
-		error: "field__error",
-		label: "label",
-		root: "field"
-	},
-	variants: { size: {
-		lg: { control: "input--lg" },
-		md: { control: "input--md" },
-		sm: { control: "input--sm" }
-	} }
+var drawer_default = Object.assign(Drawer, {
+	Backdrop: DrawerBackdrop,
+	Close: DrawerClose,
+	Description: DrawerDescription,
+	Popup: DrawerPopup,
+	Portal: DrawerPortal,
+	Root: Drawer,
+	Title: DrawerTitle,
+	Trigger: DrawerTrigger,
+	Viewport: DrawerViewport
 });
 
 //#endregion
-//#region src/components/field/use-field.ts
-const useField = () => {
-	const ctx = (0, react.useContext)(FieldContext);
-	if (!ctx) throw new Error("FieldContext must be used with in the Field component.");
-	return ctx;
-};
+//#region src/components/field-error/field-error.variants.ts
+const fieldErrorVariants = (0, tailwind_variants.tv)({ base: "field-error" });
 
 //#endregion
-//#region src/components/field/field.tsx
-const Field = ({ className, size, ...props }) => {
-	const slots = (0, react.useMemo)(() => fieldVariants({ size }), [size]);
-	console.log(slots.root());
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldContext, {
-		value: { slots },
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Field.Root, {
-			className: (0, tailwind_variants.cn)(className, slots.root()),
-			...props
-		})
-	});
-};
-const FieldLabel = ({ className, ...props }) => {
-	const { slots } = useField();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Field.Label, {
-		className: (0, tailwind_variants.cn)(className, slots.label()),
-		...props
-	});
-};
-const FieldDescription = ({ className, ...props }) => {
-	const { slots } = useField();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Field.Description, {
-		className: (0, tailwind_variants.cn)(className, slots.description()),
-		...props
-	});
-};
-const FieldControl = ({ className, ...props }) => {
-	const { slots } = useField();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Field.Control, {
-		className: (0, tailwind_variants.cn)(className, slots.control()),
-		...props
-	});
-};
+//#region src/components/field-error/field-error.tsx
 const FieldError = ({ className, ...props }) => {
-	const { slots } = useField();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Field.Error, {
-		className: (0, tailwind_variants.cn)(slots.error(), className),
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.FieldError, {
+		className: (0, tailwind_variants.cn)(className, fieldErrorVariants()),
+		"data-slot": "field-error",
+		"data-visible": true,
 		...props
 	});
 };
-Field.Control = FieldControl;
-Field.Description = FieldDescription;
-Field.Error = FieldError;
-Field.Label = FieldLabel;
-Field.Root = Field;
-var field_default = Field;
+var field_error_default = FieldError;
 
 //#endregion
 //#region src/components/fieldset/fieldset.context.ts
@@ -859,9 +872,10 @@ const FieldsetLegend = ({ className, ...props }) => {
 		...props
 	});
 };
-Fieldset.Root = Fieldset;
-Fieldset.Legend = FieldsetLegend;
-var fieldset_default = Fieldset;
+var fieldset_default = Object.assign(Fieldset, {
+	Legend: FieldsetLegend,
+	Root: Fieldset
+});
 
 //#endregion
 //#region src/components/form/form.variants.ts
@@ -870,7 +884,7 @@ const formVariants = (0, tailwind_variants.tv)({ base: "form" });
 //#endregion
 //#region src/components/form/form.tsx
 const Form = ({ className, ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("form", {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Form, {
 		className: (0, tailwind_variants.cn)(className, formVariants()),
 		...props
 	});
@@ -901,20 +915,13 @@ var icon_button_default = IconButton;
 
 //#endregion
 //#region src/components/input/input.variants.ts
-const inputVariants = (0, tailwind_variants.tv)({
-	base: "input",
-	variants: { inputSize: {
-		lg: "input--lg",
-		md: "input--md",
-		sm: "input--sm"
-	} }
-});
+const inputVariants = (0, tailwind_variants.tv)({ base: "input" });
 
 //#endregion
 //#region src/components/input/input.tsx
-const Input = ({ className, inputSize, ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Input, {
-		className: (0, tailwind_variants.cn)(className, inputVariants({ inputSize })),
+const Input = ({ className, ...props }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Input, {
+		className: (0, tailwind_variants.cn)(className, inputVariants()),
 		...props
 	});
 };
@@ -927,7 +934,7 @@ const labelVariants = (0, tailwind_variants.tv)({ base: "label" });
 //#endregion
 //#region src/components/label/label.tsx
 const Label = ({ className, ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Label, {
 		className: (0, tailwind_variants.cn)(className, labelVariants()),
 		...props
 	});
@@ -993,9 +1000,10 @@ const ListItem = ({ className, ...props }) => {
 		...props
 	});
 };
-List.Root = List;
-List.Item = ListItem;
-var list_default = List;
+var list_default = Object.assign(List, {
+	Item: ListItem,
+	Root: List
+});
 
 //#endregion
 //#region src/components/menu/menu.context.ts
@@ -1074,11 +1082,12 @@ const MenuPopup = ({ className, ...props }) => {
 		...props
 	});
 };
-const MenuArrow = ({ className, ...props }) => {
+const MenuArrow = ({ className, children, ...props }) => {
 	const { slots } = useMenu();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Menu.Arrow, {
 		className: (0, tailwind_variants.cn)(slots.arrow(), className),
-		...props
+		...props,
+		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LucideChevronUp, {})
 	});
 };
 const MenuItem = ({ className, ...props }) => {
@@ -1140,23 +1149,24 @@ const MenuSubmenuTrigger = ({ className, ...props }) => {
 		...props
 	});
 };
-Menu.Arrow = MenuArrow;
-Menu.Backdrop = MenuBackdrop;
-Menu.CheckboxItem = MenuCheckboxItem;
-Menu.Group = MenuGroup;
-Menu.GroupLabel = MenuGroupLabel;
-Menu.Item = MenuItem;
-Menu.Popup = MenuPopup;
-Menu.Portal = MenuPortal;
-Menu.Positioner = MenuPositioner;
-Menu.RadioGroup = MenuRadioGroup;
-Menu.RadioItem = MenuRadioItem;
-Menu.Root = Menu;
-Menu.Separator = MenuSeparator;
-Menu.Submenu = MenuSubmenu;
-Menu.SubmenuTrigger = MenuSubmenuTrigger;
-Menu.Trigger = MenuTrigger;
-var menu_default = Menu;
+var menu_default = Object.assign(Menu, {
+	Arrow: MenuArrow,
+	Backdrop: MenuBackdrop,
+	CheckboxItem: MenuCheckboxItem,
+	Group: MenuGroup,
+	GroupLabel: MenuGroupLabel,
+	Item: MenuItem,
+	Popup: MenuPopup,
+	Portal: MenuPortal,
+	Positioner: MenuPositioner,
+	RadioGroup: MenuRadioGroup,
+	RadioItem: MenuRadioItem,
+	Root: Menu,
+	Separator: MenuSeparator,
+	Submenu: MenuSubmenu,
+	SubmenuTrigger: MenuSubmenuTrigger,
+	Trigger: MenuTrigger
+});
 
 //#endregion
 //#region src/components/meter/meter.context.ts
@@ -1238,12 +1248,13 @@ const MeterIndicator = ({ className, ...props }) => {
 		...props
 	});
 };
-Meter.Indicator = MeterIndicator;
-Meter.Label = MeterLabel;
-Meter.Root = Meter;
-Meter.Track = MeterTrack;
-Meter.Value = MeterValue;
-var meter_default = Meter;
+var meter_default = Object.assign(Meter, {
+	Indicator: MeterIndicator,
+	Label: MeterLabel,
+	Root: Meter,
+	Track: MeterTrack,
+	Value: MeterValue
+});
 
 //#endregion
 //#region src/components/separator/separator.variants.ts
@@ -1374,133 +1385,36 @@ const NavbarMenuItem = ({ className, ...props }) => {
 		...props
 	});
 };
-Navbar.Root = Navbar;
-Navbar.Container = NavbarContainer;
-Navbar.Content = NavbarContent;
-Navbar.List = NavbarList;
-Navbar.ListItem = NavbarListItem;
-Navbar.Toggle = NavbarToggle;
-Navbar.Menu = NavbarMenu;
-Navbar.MenuItem = NavbarMenuItem;
-var navbar_default = Navbar;
+var navbar_default = Object.assign(Navbar, {
+	Container: NavbarContainer,
+	Content: NavbarContent,
+	List: NavbarList,
+	ListItem: NavbarListItem,
+	Menu: NavbarMenu,
+	MenuItem: NavbarMenuItem,
+	Root: Navbar,
+	Toggle: NavbarToggle
+});
 
 //#endregion
-//#region src/components/popover/popover.context.ts
-const PopoverContext = (0, react.createContext)(null);
+//#region src/components/overlay-trigger/overlay-trigger.tsx
+const OverlayTrigger = ({ ...props }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.DialogTrigger, { ...props });
+};
+var overlay_trigger_default = OverlayTrigger;
 
 //#endregion
 //#region src/components/popover/popover.variants.ts
-const popoverVariants = (0, tailwind_variants.tv)({ slots: {
-	arrow: "popover__arrow",
-	backdrop: "popover__backdrop",
-	close: "popover__close",
-	description: "popover__description",
-	popup: "popover__popup",
-	portal: "popover__portal",
-	positioner: "popover__positioner",
-	root: "popover",
-	title: "popover__title",
-	trigger: "popover__trigger",
-	viewport: "popover__viewport"
-} });
-
-//#endregion
-//#region src/components/popover/use-popover.ts
-const usePopover = () => {
-	const context = (0, react.useContext)(PopoverContext);
-	if (!context) throw new Error("usePopover must be used within a PopoverProvider");
-	return context;
-};
+const popoverVariants = (0, tailwind_variants.tv)({ base: "popover" });
 
 //#endregion
 //#region src/components/popover/popover.tsx
 const Popover = ({ ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PopoverContext, {
-		value: { slots: (0, react.useMemo)(() => popoverVariants(), []) },
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Root, { ...props })
-	});
-};
-const PopoverTrigger = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Trigger, {
-		className: (0, tailwind_variants.cn)(slots.trigger(), className),
-		...props
-	});
-};
-const PopoverPortal = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Portal, {
-		className: (0, tailwind_variants.cn)(slots.portal(), className),
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Popover, {
+		className: (0, tailwind_variants.cn)(popoverVariants()),
 		...props
 	});
 };
-const PopoverBackdrop = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Backdrop, {
-		className: (0, tailwind_variants.cn)(slots.backdrop(), className),
-		...props
-	});
-};
-const PopoverPositioner = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Positioner, {
-		className: (0, tailwind_variants.cn)(slots.positioner(), className),
-		...props
-	});
-};
-const PopoverPopup = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Popup, {
-		className: (0, tailwind_variants.cn)(slots.popup(), className),
-		...props
-	});
-};
-const PopoverArrow = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Arrow, {
-		className: (0, tailwind_variants.cn)(slots.arrow(), className),
-		...props
-	});
-};
-const PopoverViewport = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Viewport, {
-		className: (0, tailwind_variants.cn)(slots.viewport(), className),
-		...props
-	});
-};
-const PopoverTitle = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Title, {
-		className: (0, tailwind_variants.cn)(slots.title(), className),
-		...props
-	});
-};
-const PopoverDescription = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Description, {
-		className: (0, tailwind_variants.cn)(slots.description(), className),
-		...props
-	});
-};
-const PopoverClose = ({ className, ...props }) => {
-	const { slots } = usePopover();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Popover.Close, {
-		className: (0, tailwind_variants.cn)(slots.close(), className),
-		...props
-	});
-};
-Popover.Root = Popover;
-Popover.Trigger = PopoverTrigger;
-Popover.Portal = PopoverPortal;
-Popover.Backdrop = PopoverBackdrop;
-Popover.Positioner = PopoverPositioner;
-Popover.Popup = PopoverPopup;
-Popover.Arrow = PopoverArrow;
-Popover.Viewport = PopoverViewport;
-Popover.Title = PopoverTitle;
-Popover.Description = PopoverDescription;
-Popover.Close = PopoverClose;
 var popover_default = Popover;
 
 //#endregion
@@ -1587,12 +1501,13 @@ const ProgressIndicator = ({ className, ...props }) => {
 		...props
 	});
 };
-Progress.Label = ProgressLabel;
-Progress.Value = ProgressValue;
-Progress.Track = ProgressTrack;
-Progress.Indicator = ProgressIndicator;
-Progress.Root = Progress;
-var progress_default = Progress;
+var progress_default = Object.assign(Progress, {
+	Indicator: ProgressIndicator,
+	Label: ProgressLabel,
+	Root: Progress,
+	Track: ProgressTrack,
+	Value: ProgressValue
+});
 
 //#endregion
 //#region src/components/radio/radio.context.ts
@@ -1632,9 +1547,10 @@ const RadioIndicator = ({ className, ...props }) => {
 		...props
 	});
 };
-Radio.Root = Radio;
-Radio.Indicator = RadioIndicator;
-var radio_default = Radio;
+var radio_default = Object.assign(Radio, {
+	Indicator: RadioIndicator,
+	Root: Radio
+});
 
 //#endregion
 //#region src/components/radio-group/radio-group.variants.ts
@@ -1650,6 +1566,92 @@ const RadioGroup = ({ className, ...props }) => {
 };
 var radio_group_default = RadioGroup;
 
+//#endregion
+//#region src/components/select/select.context.ts
+const SelectContext = (0, react.createContext)(null);
+
+//#endregion
+//#region src/components/select/select.variants.ts
+const selectVariants = (0, tailwind_variants.tv)({ slots: {
+	control: "select__control",
+	description: "select__description",
+	error: "select__error",
+	label: "select__label",
+	option: "select__option",
+	root: "select"
+} });
+
+//#endregion
+//#region src/components/select/use-select.ts
+const useSelect = () => {
+	const context = (0, react.useContext)(SelectContext);
+	if (!context) throw new Error("useSelect must be used within a SelectProvider");
+	return context;
+};
+
+//#endregion
+//#region src/components/select/select.tsx
+const Select = ({ className, ...props }) => {
+	const slots = (0, react.useMemo)(() => selectVariants(), []);
+	const generatedId = (0, react.useId)();
+	const inputId = props.id || generatedId;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SelectContext.Provider, {
+		value: {
+			id: inputId,
+			slots
+		},
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: (0, tailwind_variants.cn)(className, slots.root()),
+			...props
+		})
+	});
+};
+const SelectLabel = ({ className, ...props }) => {
+	const { slots, id } = useSelect();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+		className: (0, tailwind_variants.cn)(className, slots.label()),
+		htmlFor: id,
+		...props
+	});
+};
+const SelectControl = ({ className, ...props }) => {
+	const { slots, id } = useSelect();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
+		className: (0, tailwind_variants.cn)(className, slots.control()),
+		id,
+		...props
+	});
+};
+const SelectOption = ({ className, ...props }) => {
+	const { slots } = useSelect();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+		className: (0, tailwind_variants.cn)(className, slots.option()),
+		...props
+	});
+};
+const SelectDescription = ({ className, ...props }) => {
+	const { slots } = useSelect();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+		className: (0, tailwind_variants.cn)(className, slots.description()),
+		...props
+	});
+};
+const SelectError = ({ className, ...props }) => {
+	const { slots } = useSelect();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+		className: (0, tailwind_variants.cn)(className, slots.error()),
+		...props
+	});
+};
+var select_default = Object.assign(Select, {
+	Control: SelectControl,
+	Description: SelectDescription,
+	Error: SelectError,
+	Label: SelectLabel,
+	Option: SelectOption,
+	Root: Select
+});
+
 //#endregion
 //#region src/components/slider/slider.context.ts
 const SliderContext = (0, react.createContext)(null);
@@ -1720,13 +1722,14 @@ const SliderThumb = ({ className, ...props }) => {
 		...props
 	});
 };
-Slider.Value = SliderValue;
-Slider.Control = SliderControl;
-Slider.Track = SliderTrack;
-Slider.Indicator = SliderIndicator;
-Slider.Thumb = SliderThumb;
-Slider.Root = Slider;
-var slider_default = Slider;
+var slider_default = Object.assign(Slider, {
+	Control: SliderControl,
+	Indicator: SliderIndicator,
+	Root: Slider,
+	Thumb: SliderThumb,
+	Track: SliderTrack,
+	Value: SliderValue
+});
 
 //#endregion
 //#region src/components/switch/switch.context.ts
@@ -1774,9 +1777,10 @@ const SwitchThumb = ({ className, ...props }) => {
 		...props
 	});
 };
-Switch.Thumb = SwitchThumb;
-Switch.Root = Switch;
-var switch_default = Switch;
+var switch_default = Object.assign(Switch, {
+	Root: Switch,
+	Thumb: SwitchThumb
+});
 
 //#endregion
 //#region src/components/table/table.context.ts
@@ -1856,14 +1860,15 @@ const TableFooter = ({ className, ...props }) => {
 		...props
 	});
 };
-Table.Root = Table;
-Table.Head = TableHead;
-Table.Row = TableRow;
-Table.HeaderCell = TableHeaderCell;
-Table.Body = TableBody;
-Table.DataCell = TableDataCell;
-Table.Footer = TableFooter;
-var table_default = Table;
+var table_default = Object.assign(Table, {
+	Body: TableBody,
+	DataCell: TableDataCell,
+	Footer: TableFooter,
+	Head: TableHead,
+	HeaderCell: TableHeaderCell,
+	Root: Table,
+	Row: TableRow
+});
 
 //#endregion
 //#region src/components/tabs/tabs.context.ts
@@ -1927,12 +1932,13 @@ const TabsPanel = ({ className, ...props }) => {
 		...props
 	});
 };
-Tabs.List = TabsList;
-Tabs.Tab = TabsTab;
-Tabs.Indicator = TabsIndicator;
-Tabs.Panel = TabsPanel;
-Tabs.Root = Tabs;
-var tabs_default = Tabs;
+var tabs_default = Object.assign(Tabs, {
+	Indicator: TabsIndicator,
+	List: TabsList,
+	Panel: TabsPanel,
+	Root: Tabs,
+	Tab: TabsTab
+});
 
 //#endregion
 //#region src/components/text/text.variants.ts
@@ -1941,7 +1947,7 @@ const textVariants = (0, tailwind_variants.tv)({ base: "text" });
 //#endregion
 //#region src/components/text/text.tsx
 const Text = ({ className, ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Text, {
 		className: (0, tailwind_variants.cn)(textVariants(), className),
 		"data-slot": "text",
 		...props
@@ -1949,17 +1955,28 @@ const Text = ({ className, ...props }) => {
 };
 var text_default = Text;
 
+//#endregion
+//#region src/components/text-field/text-field.variants.ts
+const textFieldVariants = (0, tailwind_variants.tv)({ base: "text-field" });
+
+//#endregion
+//#region src/components/text-field/text-field.tsx
+const TextField = ({ className, ...props }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.TextField, {
+		className: (0, tailwind_variants.cn)(className, textFieldVariants()),
+		...props
+	});
+};
+var text_field_default = TextField;
+
 //#endregion
 //#region src/components/textarea/textarea.variants.ts
-const textareaVariants = (0, tailwind_variants.tv)({
-	base: "textarea",
-	extend: inputVariants
-});
+const textareaVariants = (0, tailwind_variants.tv)({ base: "textarea" });
 
 //#endregion
 //#region src/components/textarea/textarea.tsx
 const Textarea = ({ className, ...props }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.TextArea, {
 		className: (0, tailwind_variants.cn)(className, textareaVariants()),
 		...props
 	});
@@ -1988,18 +2005,19 @@ var toggle_button_default = ToggleButton;
 
 //#endregion
 exports.Accordion = accordion_default;
+exports.Alert = alert_default;
 exports.AlertDialog = alert_dialog_default;
 exports.Avatar = avatar_default;
 exports.Button = button_default;
 exports.ButtonGroup = button_group_default;
 exports.Card = card_default;
-exports.Checkbox = checkbox_default;
 exports.CheckboxGroup = checkbox_group_default;
 exports.Chip = chip_default;
 exports.Container = container_default;
+exports.Description = description_default;
 exports.Dialog = dialog_default;
 exports.Drawer = drawer_default;
-exports.Field = field_default;
+exports.FieldError = field_error_default;
 exports.Fieldset = fieldset_default;
 exports.Form = form_default;
 exports.IconButton = icon_button_default;
@@ -2010,26 +2028,29 @@ exports.List = list_default;
 exports.Menu = menu_default;
 exports.Meter = meter_default;
 exports.Navbar = navbar_default;
+exports.OverlayTrigger = overlay_trigger_default;
 exports.Popover = popover_default;
 exports.Progress = progress_default;
 exports.Radio = radio_default;
 exports.RadioGroup = radio_group_default;
+exports.Select = select_default;
 exports.Separator = separator_default;
 exports.Slider = slider_default;
 exports.Switch = switch_default;
 exports.Table = table_default;
 exports.Tabs = tabs_default;
 exports.Text = text_default;
+exports.TextField = text_field_default;
 exports.Textarea = textarea_default;
 exports.ToggleButton = toggle_button_default;
 exports.accordionVariants = accordionVariants;
 exports.alertDialogVariants = alertDialogVariants;
+exports.alertVariants = alertVariants;
 exports.avatarVariants = avatarVariants;
 exports.buttonGroupVariants = buttonGroupVariants;
 exports.buttonVariants = buttonVariants;
 exports.cardVariants = cardVariants;
 exports.checkboxGroupVariants = checkboxGroupVariants;
-exports.checkboxVariants = checkboxVariants;
 exports.chipVariants = chipVariants;
 Object.defineProperty(exports, 'cn', {
   enumerable: true,
@@ -2038,9 +2059,10 @@ Object.defineProperty(exports, 'cn', {
   }
 });
 exports.containerVariants = containerVariants;
+exports.descriptionVariants = descriptionVariants;
 exports.dialogVariants = dialogVariants;
 exports.drawerVariants = drawerVariants;
-exports.fieldVariants = fieldVariants;
+exports.fieldErrorVariants = fieldErrorVariants;
 exports.fieldsetVariants = fieldsetVariants;
 exports.formVariants = formVariants;
 exports.iconButtonVariants = iconButtonVariants;
@@ -2055,11 +2077,13 @@ exports.popoverVariants = popoverVariants;
 exports.progressVariants = progressVariants;
 exports.radioGroupVariants = radioGroupVariants;
 exports.radioVariants = radioVariants;
+exports.selectVariants = selectVariants;
 exports.separatorVariants = separatorVariants;
 exports.sliderVariants = sliderVariants;
 exports.switchVariants = switchVariants;
 exports.tableVariants = tableVariants;
 exports.tabsVariants = tabsVariants;
+exports.textFieldVariants = textFieldVariants;
 exports.textVariants = textVariants;
 exports.textareaVariants = textareaVariants;
 exports.toggleButtonVariants = toggleButtonVariants;