base-themes 0.1.0 → 0.1.1

package/dist/base-themes.js

@@ -1,63 +1,63 @@
 import { Accordion as e } from "@base-ui/react/accordion";
 import { forwardRef as t, useCallback as n, useEffect as r, useMemo as i, useState as a } from "react";
 import o from "clsx";
-import { Bold as s, Check as c, ChevronDown as l, Italic as ee, Link as te, Minus as ne, Plus as re, Search as ie, X as u } from "lucide-react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import { AlertDialog as p } from "@base-ui/react/alert-dialog";
-import { Autocomplete as m } from "@base-ui/react/autocomplete";
-import { Avatar as h } from "@base-ui/react/avatar";
-import { Button as ae } from "@base-ui/react/button";
-import { Checkbox as g } from "@base-ui/react/checkbox";
-import { CheckboxGroup as oe } from "@base-ui/react/checkbox-group";
-import { Collapsible as _ } from "@base-ui/react/collapsible";
-import { Combobox as v } from "@base-ui/react/combobox";
-import { ContextMenu as y } from "@base-ui/react/context-menu";
-import { CSPProvider as se } from "@base-ui/react/csp-provider";
-import { Dialog as b } from "@base-ui/react/dialog";
-import { DirectionProvider as ce, useDirection as le } from "@base-ui/react/direction-provider";
-import { Drawer as x } from "@base-ui/react/drawer";
-import { Field as S } from "@base-ui/react/field";
-import { Fieldset as C } from "@base-ui/react/fieldset";
-import { Form as ue } from "@base-ui/react/form";
-import { Input as de } from "@base-ui/react/input";
-import { Menu as w, Menu as T } from "@base-ui/react/menu";
-import { Menubar as fe } from "@base-ui/react/menubar";
-import { Meter as E } from "@base-ui/react/meter";
-import { NavigationMenu as D } from "@base-ui/react/navigation-menu";
-import { NumberField as O } from "@base-ui/react/number-field";
-import { OTPFieldPreview as k } from "@base-ui/react/otp-field";
-import { Popover as A } from "@base-ui/react/popover";
-import { PreviewCard as j } from "@base-ui/react/preview-card";
-import { Progress as M } from "@base-ui/react/progress";
-import { Radio as N, Radio as P } from "@base-ui/react/radio";
-import { RadioGroup as pe } from "@base-ui/react/radio-group";
-import { ScrollArea as F } from "@base-ui/react/scroll-area";
-import { Select as I } from "@base-ui/react/select";
-import { Separator as me } from "@base-ui/react/separator";
-import { Slider as L } from "@base-ui/react/slider";
-import { Switch as he } from "@base-ui/react/switch";
-import { Tabs as R } from "@base-ui/react/tabs";
-import { Toggle as z } from "@base-ui/react/toggle";
-import { Toast as B } from "@base-ui/react/toast";
-import { ToggleGroup as ge } from "@base-ui/react/toggle-group";
-import { Toolbar as V } from "@base-ui/react/toolbar";
-import { Tooltip as H } from "@base-ui/react/tooltip";
+import { Bold as s, Check as c, ChevronDown as l, Italic as u, Link as ee, Minus as te, Plus as ne, Search as d, X as f } from "lucide-react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { AlertDialog as h } from "@base-ui/react/alert-dialog";
+import { Autocomplete as g } from "@base-ui/react/autocomplete";
+import { Avatar as _ } from "@base-ui/react/avatar";
+import { Button as re } from "@base-ui/react/button";
+import { Checkbox as v } from "@base-ui/react/checkbox";
+import { CheckboxGroup as ie } from "@base-ui/react/checkbox-group";
+import { Collapsible as y } from "@base-ui/react/collapsible";
+import { Combobox as b } from "@base-ui/react/combobox";
+import { ContextMenu as x } from "@base-ui/react/context-menu";
+import { CSPProvider as ae } from "@base-ui/react/csp-provider";
+import { Dialog as S } from "@base-ui/react/dialog";
+import { DirectionProvider as oe, useDirection as se } from "@base-ui/react/direction-provider";
+import { Drawer as C } from "@base-ui/react/drawer";
+import { Field as w } from "@base-ui/react/field";
+import { Fieldset as T } from "@base-ui/react/fieldset";
+import { Form as ce } from "@base-ui/react/form";
+import { Input as le } from "@base-ui/react/input";
+import { Menu as E, Menu as D } from "@base-ui/react/menu";
+import { Menubar as ue } from "@base-ui/react/menubar";
+import { Meter as O } from "@base-ui/react/meter";
+import { NavigationMenu as k } from "@base-ui/react/navigation-menu";
+import { NumberField as A } from "@base-ui/react/number-field";
+import { OTPFieldPreview as j } from "@base-ui/react/otp-field";
+import { Popover as M } from "@base-ui/react/popover";
+import { PreviewCard as N } from "@base-ui/react/preview-card";
+import { Progress as P } from "@base-ui/react/progress";
+import { Radio as F, Radio as I } from "@base-ui/react/radio";
+import { RadioGroup as de } from "@base-ui/react/radio-group";
+import { ScrollArea as L } from "@base-ui/react/scroll-area";
+import { Select as R } from "@base-ui/react/select";
+import { Separator as fe } from "@base-ui/react/separator";
+import { Slider as z } from "@base-ui/react/slider";
+import { Switch as B } from "@base-ui/react/switch";
+import { Tabs as V } from "@base-ui/react/tabs";
+import { Toggle as H } from "@base-ui/react/toggle";
+import { Toast as U } from "@base-ui/react/toast";
+import { ToggleGroup as pe } from "@base-ui/react/toggle-group";
+import { Toolbar as W } from "@base-ui/react/toolbar";
+import { Tooltip as G } from "@base-ui/react/tooltip";
 //#region src/components/ui/Accordion.tsx
-function _e({ items: t, defaultValue: n, className: r, ...i }) {
-	return /* @__PURE__ */ d(e.Root, {
+function me({ items: t, defaultValue: n, className: r, ...i }) {
+	return /* @__PURE__ */ p(e.Root, {
 		defaultValue: n ?? t.slice(0, 1).map((e) => e.value),
 		className: o("bento-accordion", r),
 		...i,
-		children: t.map((t) => /* @__PURE__ */ f(e.Item, {
+		children: t.map((t) => /* @__PURE__ */ m(e.Item, {
 			className: "bento-accordion-item",
 			value: t.value,
-			children: [/* @__PURE__ */ d(e.Header, {
+			children: [/* @__PURE__ */ p(e.Header, {
 				className: "bento-accordion-header",
-				children: /* @__PURE__ */ f(e.Trigger, {
+				children: /* @__PURE__ */ m(e.Trigger, {
 					className: "bento-accordion-trigger",
-					children: [t.label, /* @__PURE__ */ d(l, { size: 15 })]
+					children: [t.label, /* @__PURE__ */ p(l, { size: 15 })]
 				})
-			}), /* @__PURE__ */ d(e.Panel, {
+			}), /* @__PURE__ */ p(e.Panel, {
 				className: "bento-accordion-panel",
 				children: t.content
 			})]
@@ -66,24 +66,24 @@ function _e({ items: t, defaultValue: n, className: r, ...i }) {
 }
 //#endregion
 //#region src/components/ui/AlertDialog.tsx
-function ve({ trigger: e, title: t, description: n, confirmLabel: r = "Confirm", cancelLabel: i = "Cancel", onConfirm: a, className: s }) {
-	return /* @__PURE__ */ f(p.Root, { children: [/* @__PURE__ */ d(p.Trigger, { render: e }), /* @__PURE__ */ f(p.Portal, { children: [/* @__PURE__ */ d(p.Backdrop, { className: "bento-alert-backdrop" }), /* @__PURE__ */ f(p.Popup, {
+function he({ trigger: e, title: t, description: n, confirmLabel: r = "Confirm", cancelLabel: i = "Cancel", onConfirm: a, className: s }) {
+	return /* @__PURE__ */ m(h.Root, { children: [/* @__PURE__ */ p(h.Trigger, { render: e }), /* @__PURE__ */ m(h.Portal, { children: [/* @__PURE__ */ p(h.Backdrop, { className: "bento-alert-backdrop" }), /* @__PURE__ */ m(h.Popup, {
 		className: o("bento-alert-popup", s),
 		children: [
-			/* @__PURE__ */ d(p.Title, {
+			/* @__PURE__ */ p(h.Title, {
 				className: "bento-alert-title",
 				children: t
 			}),
-			/* @__PURE__ */ d(p.Description, {
+			/* @__PURE__ */ p(h.Description, {
 				className: "bento-alert-description",
 				children: n
 			}),
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ m("div", {
 				className: "bento-alert-actions",
-				children: [/* @__PURE__ */ f(p.Close, {
+				children: [/* @__PURE__ */ m(h.Close, {
 					className: "bento-button outline",
 					children: [" ", i]
-				}), /* @__PURE__ */ d(p.Close, {
+				}), /* @__PURE__ */ p(h.Close, {
 					className: "bento-button accent",
 					onClick: a,
 					children: r
@@ -94,36 +94,36 @@ function ve({ trigger: e, title: t, description: n, confirmLabel: r = "Confirm",
 }
 //#endregion
 //#region src/components/ui/Autocomplete.tsx
-function ye({ options: e, label: t, placeholder: n = "Search...", className: r, ...i }) {
-	return /* @__PURE__ */ d("div", {
+function ge({ options: e, label: t, placeholder: n = "Search...", className: r, ...i }) {
+	return /* @__PURE__ */ p("div", {
 		className: o("bento-combobox bento-autocomplete", r),
-		children: /* @__PURE__ */ f(m.Root, {
+		children: /* @__PURE__ */ m(g.Root, {
 			items: e,
 			...i,
 			children: [
-				t && /* @__PURE__ */ d("label", {
+				t && /* @__PURE__ */ p("label", {
 					className: "field-label",
 					children: t
 				}),
-				/* @__PURE__ */ f(m.InputGroup, {
+				/* @__PURE__ */ m(g.InputGroup, {
 					className: "bento-combobox-input-wrap",
-					children: [/* @__PURE__ */ d(ie, { size: 15 }), /* @__PURE__ */ d(m.Input, {
+					children: [/* @__PURE__ */ p(d, { size: 15 }), /* @__PURE__ */ p(g.Input, {
 						className: "bento-combobox-input",
 						placeholder: n
 					})]
 				}),
-				/* @__PURE__ */ d(m.Portal, { children: /* @__PURE__ */ d(m.Positioner, {
+				/* @__PURE__ */ p(g.Portal, { children: /* @__PURE__ */ p(g.Positioner, {
 					className: "bento-combobox-positioner",
 					sideOffset: 8,
-					children: /* @__PURE__ */ f(m.Popup, {
+					children: /* @__PURE__ */ m(g.Popup, {
 						className: "bento-combobox-popup",
-						children: [/* @__PURE__ */ d(m.Empty, {
+						children: [/* @__PURE__ */ p(g.Empty, {
 							className: "bento-combobox-empty",
 							children: "No results"
-						}), /* @__PURE__ */ d(m.List, { children: (e) => /* @__PURE__ */ f(m.Item, {
+						}), /* @__PURE__ */ p(g.List, { children: (e) => /* @__PURE__ */ m(g.Item, {
 							className: "bento-combobox-item",
 							value: e.value,
-							children: [/* @__PURE__ */ d(m.Value, { children: e.label }), /* @__PURE__ */ d(c, { size: 14 })]
+							children: [/* @__PURE__ */ p(g.Value, { children: e.label }), /* @__PURE__ */ p(c, { size: 14 })]
 						}, e.value) })]
 					})
 				}) })
@@ -133,55 +133,55 @@ function ye({ options: e, label: t, placeholder: n = "Search...", className: r,
 }
 //#endregion
 //#region src/components/ui/Avatar.tsx
-var U = t(({ src: e, alt: t, fallback: n, size: r, className: i, ...a }, s) => /* @__PURE__ */ f(h.Root, {
+var K = t(({ src: e, alt: t, fallback: n, size: r, className: i, ...a }, s) => /* @__PURE__ */ m(_.Root, {
 	ref: s,
 	className: o("bento-avatar", r && r !== "md" && r, i),
 	...a,
-	children: [e && /* @__PURE__ */ d(h.Image, {
+	children: [e && /* @__PURE__ */ p(_.Image, {
 		src: e,
 		alt: t
-	}), /* @__PURE__ */ d(h.Fallback, { children: n })]
+	}), /* @__PURE__ */ p(_.Fallback, { children: n })]
 }));
-U.displayName = "Avatar";
-var W = t(({ className: e, ...t }, n) => /* @__PURE__ */ d("div", {
+K.displayName = "Avatar";
+var q = t(({ className: e, ...t }, n) => /* @__PURE__ */ p("div", {
 	ref: n,
 	className: o("bento-avatar-group", e),
 	...t
 }));
-W.displayName = "AvatarGroup";
+q.displayName = "AvatarGroup";
 //#endregion
 //#region src/components/ui/Button.tsx
-var G = t(({ variant: e = "primary", className: t, ...n }, r) => /* @__PURE__ */ d(ae, {
+var J = t(({ variant: e = "primary", className: t, ...n }, r) => /* @__PURE__ */ p(re, {
 	ref: r,
 	className: o("bento-button", e !== "primary" && e, t),
 	...n
 }));
-G.displayName = "Button";
+J.displayName = "Button";
 //#endregion
 //#region src/components/ui/Checkbox.tsx
-var K = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ d(g.Root, {
+var Y = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ p(v.Root, {
 		ref: i,
 		id: n,
 		className: o("bento-checkbox", t),
 		...r,
-		children: /* @__PURE__ */ d(g.Indicator, { children: /* @__PURE__ */ d(c, { size: 14 }) })
+		children: /* @__PURE__ */ p(v.Indicator, { children: /* @__PURE__ */ p(c, { size: 14 }) })
 	});
-	return e ? /* @__PURE__ */ f("label", {
+	return e ? /* @__PURE__ */ m("label", {
 		className: "bento-checkbox-label",
 		htmlFor: n,
 		children: [a, e]
 	}) : a;
 });
-K.displayName = "Checkbox";
+Y.displayName = "Checkbox";
 //#endregion
 //#region src/components/ui/CheckboxGroup.tsx
-function be({ options: e, className: t, defaultValue: n, ...r }) {
-	return /* @__PURE__ */ d(oe, {
+function _e({ options: e, className: t, defaultValue: n, ...r }) {
+	return /* @__PURE__ */ p(ie, {
 		className: o("bento-checkbox-group", t),
 		defaultValue: n,
 		...r,
-		children: e.map((e) => /* @__PURE__ */ d(K, {
+		children: e.map((e) => /* @__PURE__ */ p(Y, {
 			name: e.value,
 			value: e.value,
 			label: e.label
@@ -190,14 +190,14 @@ function be({ options: e, className: t, defaultValue: n, ...r }) {
 }
 //#endregion
 //#region src/components/ui/Collapsible.tsx
-function xe({ label: e, children: t, defaultOpen: n, className: r }) {
-	return /* @__PURE__ */ f(_.Root, {
+function ve({ label: e, children: t, defaultOpen: n, className: r }) {
+	return /* @__PURE__ */ m(y.Root, {
 		defaultOpen: n,
 		className: o("bento-collapsible", r),
-		children: [/* @__PURE__ */ f(_.Trigger, {
+		children: [/* @__PURE__ */ m(y.Trigger, {
 			className: "bento-collapsible-trigger",
-			children: [e, /* @__PURE__ */ d(l, { size: 15 })]
-		}), /* @__PURE__ */ d(_.Panel, {
+			children: [e, /* @__PURE__ */ p(l, { size: 15 })]
+		}), /* @__PURE__ */ p(y.Panel, {
 			className: "bento-collapsible-panel",
 			children: t
 		})]
@@ -205,27 +205,27 @@ function xe({ label: e, children: t, defaultOpen: n, className: r }) {
 }
 //#endregion
 //#region src/components/ui/Combobox.tsx
-function Se({ options: e, placeholder: t = "Search...", label: n, className: r }) {
+function ye({ options: e, placeholder: t = "Search...", label: n, className: r }) {
 	let [i, s] = a(""), c = e.filter((e) => e.label.toLowerCase().includes(i.toLowerCase()));
-	return /* @__PURE__ */ f("div", {
+	return /* @__PURE__ */ m("div", {
 		className: o("bento-combobox", r),
-		children: [n && /* @__PURE__ */ d("label", {
+		children: [n && /* @__PURE__ */ p("label", {
 			className: "field-label",
 			children: n
-		}), /* @__PURE__ */ f(v.Root, {
+		}), /* @__PURE__ */ m(b.Root, {
 			inputValue: i,
 			onInputValueChange: s,
-			children: [/* @__PURE__ */ d(v.Input, {
+			children: [/* @__PURE__ */ p(b.Input, {
 				className: "bento-combobox-input",
 				placeholder: t
-			}), /* @__PURE__ */ d(v.Portal, { children: /* @__PURE__ */ d(v.Positioner, {
+			}), /* @__PURE__ */ p(b.Portal, { children: /* @__PURE__ */ p(b.Positioner, {
 				sideOffset: 8,
-				children: /* @__PURE__ */ d(v.Popup, {
+				children: /* @__PURE__ */ p(b.Popup, {
 					className: "bento-combobox-popup",
-					children: c.length === 0 ? /* @__PURE__ */ d("div", {
+					children: c.length === 0 ? /* @__PURE__ */ p("div", {
 						className: "bento-combobox-no-results",
 						children: "No results"
-					}) : c.map((e) => /* @__PURE__ */ d(v.Item, {
+					}) : c.map((e) => /* @__PURE__ */ p(b.Item, {
 						className: "bento-combobox-item",
 						value: e.value,
 						children: e.label
@@ -237,16 +237,16 @@ function Se({ options: e, placeholder: t = "Search...", label: n, className: r }
 }
 //#endregion
 //#region src/components/ui/ContextMenu.tsx
-function Ce({ children: e, items: t, className: n }) {
-	return /* @__PURE__ */ f(y.Root, { children: [/* @__PURE__ */ d(y.Trigger, {
+function be({ children: e, items: t, className: n }) {
+	return /* @__PURE__ */ m(x.Root, { children: [/* @__PURE__ */ p(x.Trigger, {
 		className: "bento-context-menu-trigger",
 		children: e
-	}), /* @__PURE__ */ d(y.Portal, { children: /* @__PURE__ */ d(y.Positioner, {
+	}), /* @__PURE__ */ p(x.Portal, { children: /* @__PURE__ */ p(x.Positioner, {
 		className: "bento-menu-positioner",
 		sideOffset: 8,
-		children: /* @__PURE__ */ d(y.Popup, {
+		children: /* @__PURE__ */ p(x.Popup, {
 			className: o("bento-menu-popup", n),
-			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ d(y.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ f(y.Item, {
+			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ p(x.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ m(x.Item, {
 				className: "bento-menu-item",
 				disabled: e.disabled,
 				onClick: e.onClick,
@@ -257,28 +257,28 @@ function Ce({ children: e, items: t, className: n }) {
 }
 //#endregion
 //#region src/components/ui/CspProvider.tsx
-function we(e) {
-	return /* @__PURE__ */ d(se, { ...e });
+function xe(e) {
+	return /* @__PURE__ */ p(ae, { ...e });
 }
 //#endregion
 //#region src/components/ui/Dialog.tsx
-function Te({ trigger: e, title: t, description: n, children: r, className: i }) {
-	return /* @__PURE__ */ f(b.Root, { children: [/* @__PURE__ */ d(b.Trigger, { render: e }), /* @__PURE__ */ f(b.Portal, { children: [/* @__PURE__ */ d(b.Backdrop, { className: "bento-dialog-backdrop" }), /* @__PURE__ */ f(b.Popup, {
+function Se({ trigger: e, title: t, description: n, children: r, className: i }) {
+	return /* @__PURE__ */ m(S.Root, { children: [/* @__PURE__ */ p(S.Trigger, { render: e }), /* @__PURE__ */ m(S.Portal, { children: [/* @__PURE__ */ p(S.Backdrop, { className: "bento-dialog-backdrop" }), /* @__PURE__ */ m(S.Popup, {
 		className: o("bento-dialog-popup", i),
 		children: [
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ m("div", {
 				className: "bento-dialog-topline",
-				children: [/* @__PURE__ */ d(b.Title, {
+				children: [/* @__PURE__ */ p(S.Title, {
 					className: "bento-dialog-title",
 					children: t
-				}), /* @__PURE__ */ d(b.Close, {
+				}), /* @__PURE__ */ p(S.Close, {
 					className: "bento-button icon",
 					"aria-label": "Close dialog",
-					render: /* @__PURE__ */ d("button", { type: "button" }),
-					children: /* @__PURE__ */ d(u, { size: 18 })
+					render: /* @__PURE__ */ p("button", { type: "button" }),
+					children: /* @__PURE__ */ p(f, { size: 18 })
 				})]
 			}),
-			n && /* @__PURE__ */ d(b.Description, {
+			n && /* @__PURE__ */ p(S.Description, {
 				className: "bento-dialog-description",
 				children: n
 			}),
@@ -288,10 +288,10 @@ function Te({ trigger: e, title: t, description: n, children: r, className: i })
 }
 //#endregion
 //#region src/components/ui/DirectionProvider.tsx
-function Ee({ children: e, direction: t = "ltr" }) {
-	return /* @__PURE__ */ d(ce, {
+function Ce({ children: e, direction: t = "ltr" }) {
+	return /* @__PURE__ */ p(oe, {
 		direction: t,
-		children: /* @__PURE__ */ d("span", {
+		children: /* @__PURE__ */ p("span", {
 			dir: t,
 			style: { display: "contents" },
 			children: e
@@ -300,28 +300,28 @@ function Ee({ children: e, direction: t = "ltr" }) {
 }
 //#endregion
 //#region src/components/ui/Drawer.tsx
-function De({ trigger: e, title: t, description: n, children: r, side: i = "right", className: a }) {
-	return /* @__PURE__ */ f(x.Root, { children: [/* @__PURE__ */ d(x.Trigger, { render: e }), /* @__PURE__ */ f(x.Portal, { children: [/* @__PURE__ */ d(x.Backdrop, { className: "bento-drawer-backdrop" }), /* @__PURE__ */ f(x.Popup, {
+function we({ trigger: e, title: t, description: n, children: r, side: i = "right", className: a }) {
+	return /* @__PURE__ */ m(C.Root, { children: [/* @__PURE__ */ p(C.Trigger, { render: e }), /* @__PURE__ */ m(C.Portal, { children: [/* @__PURE__ */ p(C.Backdrop, { className: "bento-drawer-backdrop" }), /* @__PURE__ */ m(C.Popup, {
 		className: o("bento-drawer-popup", a),
 		"data-side": i,
 		children: [
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ m("div", {
 				className: "bento-drawer-header",
-				children: [/* @__PURE__ */ d(x.Title, {
+				children: [/* @__PURE__ */ p(C.Title, {
 					className: "bento-drawer-title",
 					children: t
-				}), /* @__PURE__ */ d(x.Close, {
+				}), /* @__PURE__ */ p(C.Close, {
 					className: "bento-button icon",
 					"aria-label": "Close drawer",
-					render: /* @__PURE__ */ d("button", { type: "button" }),
-					children: /* @__PURE__ */ d(u, { size: 18 })
+					render: /* @__PURE__ */ p("button", { type: "button" }),
+					children: /* @__PURE__ */ p(f, { size: 18 })
 				})]
 			}),
-			n && /* @__PURE__ */ d(x.Description, {
+			n && /* @__PURE__ */ p(C.Description, {
 				className: "bento-drawer-description",
 				children: n
 			}),
-			/* @__PURE__ */ d("div", {
+			/* @__PURE__ */ p("div", {
 				className: "bento-drawer-body",
 				children: r
 			})
@@ -330,22 +330,22 @@ function De({ trigger: e, title: t, description: n, children: r, side: i = "righ
 }
 //#endregion
 //#region src/components/ui/Field.tsx
-function Oe({ label: e, description: t, error: n, children: r, className: i, ...a }) {
-	return /* @__PURE__ */ f(S.Root, {
+function Te({ label: e, description: t, error: n, children: r, className: i, ...a }) {
+	return /* @__PURE__ */ m(w.Root, {
 		className: o("bento-field", i),
 		invalid: !!n,
 		...a,
 		children: [
-			/* @__PURE__ */ d(S.Label, {
+			/* @__PURE__ */ p(w.Label, {
 				className: "field-label",
 				children: e
 			}),
-			/* @__PURE__ */ d(S.Control, { render: r }),
-			t && /* @__PURE__ */ d(S.Description, {
+			/* @__PURE__ */ p(w.Control, { render: r }),
+			t && /* @__PURE__ */ p(w.Description, {
 				className: "bento-field-description",
 				children: t
 			}),
-			n && /* @__PURE__ */ d(S.Error, {
+			n && /* @__PURE__ */ p(w.Error, {
 				className: "bento-field-error",
 				children: n
 			})
@@ -354,11 +354,11 @@ function Oe({ label: e, description: t, error: n, children: r, className: i, ...
 }
 //#endregion
 //#region src/components/ui/Fieldset.tsx
-function ke({ legend: e, children: t, className: n, ...r }) {
-	return /* @__PURE__ */ f(C.Root, {
+function Ee({ legend: e, children: t, className: n, ...r }) {
+	return /* @__PURE__ */ m(T.Root, {
 		className: o("bento-fieldset", n),
 		...r,
-		children: [/* @__PURE__ */ d(C.Legend, {
+		children: [/* @__PURE__ */ p(T.Legend, {
 			className: "bento-fieldset-legend",
 			children: e
 		}), t]
@@ -366,57 +366,57 @@ function ke({ legend: e, children: t, className: n, ...r }) {
 }
 //#endregion
 //#region src/components/ui/Form.tsx
-var q = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(ue, {
+var X = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(ce, {
 	ref: n,
 	className: o("bento-form", e),
 	...t
 }));
-q.displayName = "Form";
+X.displayName = "Form";
 //#endregion
 //#region src/components/ui/Input.tsx
-var J = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ d(de, {
+var Z = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ p(le, {
 		ref: i,
 		id: n,
 		className: o("bento-input", t),
 		...r
 	});
-	return e ? /* @__PURE__ */ f("div", {
+	return e ? /* @__PURE__ */ m("div", {
 		className: "bento-field",
-		children: [/* @__PURE__ */ d("label", {
+		children: [/* @__PURE__ */ p("label", {
 			className: "bento-field-label",
 			htmlFor: n,
 			children: e
 		}), a]
 	}) : a;
 });
-J.displayName = "Input";
-var Y = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ d("textarea", {
+Z.displayName = "Input";
+var De = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ p("textarea", {
 		ref: i,
 		id: n,
 		className: o("bento-textarea", t),
 		...r
 	});
-	return e ? /* @__PURE__ */ f("div", {
+	return e ? /* @__PURE__ */ m("div", {
 		className: "bento-field",
-		children: [/* @__PURE__ */ d("label", {
+		children: [/* @__PURE__ */ p("label", {
 			className: "bento-field-label",
 			htmlFor: n,
 			children: e
 		}), a]
 	}) : a;
 });
-Y.displayName = "Textarea";
+De.displayName = "Textarea";
 //#endregion
 //#region src/components/ui/Menu.tsx
-function Ae({ trigger: e, items: t, className: n }) {
-	return /* @__PURE__ */ f(w.Root, { children: [/* @__PURE__ */ d(w.Trigger, { render: e }), /* @__PURE__ */ d(w.Portal, { children: /* @__PURE__ */ d(w.Positioner, {
+function Oe({ trigger: e, items: t, className: n }) {
+	return /* @__PURE__ */ m(E.Root, { children: [/* @__PURE__ */ p(E.Trigger, { render: e }), /* @__PURE__ */ p(E.Portal, { children: /* @__PURE__ */ p(E.Positioner, {
 		className: "bento-menu-positioner",
 		sideOffset: 8,
-		children: /* @__PURE__ */ d(w.Popup, {
+		children: /* @__PURE__ */ p(E.Popup, {
 			className: o("bento-menu-popup", n),
-			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ d(w.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ f(w.Item, {
+			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ p(E.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ m(E.Item, {
 				className: "bento-menu-item",
 				disabled: e.disabled,
 				onClick: e.onClick,
@@ -427,18 +427,18 @@ function Ae({ trigger: e, items: t, className: n }) {
 }
 //#endregion
 //#region src/components/ui/Menubar.tsx
-function je({ menus: e, className: t }) {
-	return /* @__PURE__ */ d(fe, {
+function ke({ menus: e, className: t }) {
+	return /* @__PURE__ */ p(ue, {
 		className: o("bento-menubar", t),
-		children: e.map((e) => /* @__PURE__ */ f(T.Root, { children: [/* @__PURE__ */ d(T.Trigger, {
+		children: e.map((e) => /* @__PURE__ */ m(D.Root, { children: [/* @__PURE__ */ p(D.Trigger, {
 			className: "bento-menubar-trigger",
 			children: e.label
-		}), /* @__PURE__ */ d(T.Portal, { children: /* @__PURE__ */ d(T.Positioner, {
+		}), /* @__PURE__ */ p(D.Portal, { children: /* @__PURE__ */ p(D.Positioner, {
 			className: "bento-menu-positioner",
 			sideOffset: 8,
-			children: /* @__PURE__ */ d(T.Popup, {
+			children: /* @__PURE__ */ p(D.Popup, {
 				className: "bento-menu-popup",
-				children: e.items.map((e) => /* @__PURE__ */ f(T.Item, {
+				children: e.items.map((e) => /* @__PURE__ */ m(D.Item, {
 					className: "bento-menu-item",
 					disabled: e.disabled,
 					children: [e.icon, e.label]
@@ -449,54 +449,54 @@ function je({ menus: e, className: t }) {
 }
 //#endregion
 //#region src/components/ui/Meter.tsx
-var X = t(({ value: e = 0, min: t = 0, max: n = 100, showValue: r, className: a, ...s }, c) => {
-	let l = (e - t) / (n - t) * 100, ee = i(() => l >= 80 ? "bento-meter-high" : l < 30 ? "bento-meter-low" : "bento-meter-mid", [l]);
-	return /* @__PURE__ */ f("div", {
+var Ae = t(({ value: e = 0, min: t = 0, max: n = 100, showValue: r, className: a, ...s }, c) => {
+	let l = (e - t) / (n - t) * 100, u = i(() => l >= 80 ? "bento-meter-high" : l < 30 ? "bento-meter-low" : "bento-meter-mid", [l]);
+	return /* @__PURE__ */ m("div", {
 		className: o("bento-meter", a),
-		children: [r && /* @__PURE__ */ f("div", {
+		children: [r && /* @__PURE__ */ m("div", {
 			className: "bento-meter-label",
-			children: [/* @__PURE__ */ d("span", { children: s["aria-label"] ?? "Meter" }), /* @__PURE__ */ f("span", {
+			children: [/* @__PURE__ */ p("span", { children: s["aria-label"] ?? "Meter" }), /* @__PURE__ */ m("span", {
 				className: "bento-meter-value",
 				children: [Math.round(l), "%"]
 			})]
-		}), /* @__PURE__ */ d(E.Root, {
+		}), /* @__PURE__ */ p(O.Root, {
 			ref: c,
 			value: e,
 			min: t,
 			max: n,
 			...s,
-			children: /* @__PURE__ */ d(E.Track, {
+			children: /* @__PURE__ */ p(O.Track, {
 				className: "bento-meter-track",
-				children: /* @__PURE__ */ d(E.Indicator, { className: o("bento-meter-indicator", ee) })
+				children: /* @__PURE__ */ p(O.Indicator, { className: o("bento-meter-indicator", u) })
 			})
 		})]
 	});
 });
-X.displayName = "Meter";
+Ae.displayName = "Meter";
 //#endregion
 //#region src/components/ui/NavigationMenu.tsx
-function Me({ items: e, className: t }) {
-	return /* @__PURE__ */ d(D.Root, {
+function je({ items: e, className: t }) {
+	return /* @__PURE__ */ p(k.Root, {
 		className: o("bento-nav-menu", t),
-		children: /* @__PURE__ */ d(D.List, {
+		children: /* @__PURE__ */ p(k.List, {
 			className: "bento-nav-menu-list",
-			children: e.map((e, t) => e.children ? /* @__PURE__ */ f(D.Item, { children: [/* @__PURE__ */ f(D.Trigger, {
+			children: e.map((e, t) => e.children ? /* @__PURE__ */ m(k.Item, { children: [/* @__PURE__ */ m(k.Trigger, {
 				className: "bento-nav-menu-trigger",
-				children: [e.label, /* @__PURE__ */ d(l, { size: 14 })]
-			}), /* @__PURE__ */ d(D.Portal, { children: /* @__PURE__ */ d(D.Positioner, {
+				children: [e.label, /* @__PURE__ */ p(l, { size: 14 })]
+			}), /* @__PURE__ */ p(k.Portal, { children: /* @__PURE__ */ p(k.Positioner, {
 				sideOffset: 8,
-				children: /* @__PURE__ */ d(D.Popup, {
+				children: /* @__PURE__ */ p(k.Popup, {
 					className: "bento-nav-menu-popup",
-					children: e.children.map((e, t) => /* @__PURE__ */ d(D.Item, {
+					children: e.children.map((e, t) => /* @__PURE__ */ p(k.Item, {
 						className: "bento-nav-menu-item",
-						render: /* @__PURE__ */ d("a", { href: e.href }),
+						render: /* @__PURE__ */ p("a", { href: e.href }),
 						children: e.label
 					}, t))
 				})
-			}) })] }, t) : /* @__PURE__ */ d(D.Item, { children: /* @__PURE__ */ d(D.Link, {
+			}) })] }, t) : /* @__PURE__ */ p(k.Item, { children: /* @__PURE__ */ p(k.Link, {
 				className: "bento-nav-menu-trigger",
 				href: e.href,
-				render: /* @__PURE__ */ d("a", { href: e.href }),
+				render: /* @__PURE__ */ p("a", { href: e.href }),
 				children: e.label
 			}) }, t))
 		})
@@ -504,26 +504,26 @@ function Me({ items: e, className: t }) {
 }
 //#endregion
 //#region src/components/ui/NumberField.tsx
-function Ne({ label: e, className: t, ...n }) {
-	return /* @__PURE__ */ f(O.Root, {
+function Me({ label: e, className: t, ...n }) {
+	return /* @__PURE__ */ m(A.Root, {
 		className: o("bento-number-field", t),
 		...n,
-		children: [e && /* @__PURE__ */ d("label", {
+		children: [e && /* @__PURE__ */ p("label", {
 			className: "field-label",
 			children: e
-		}), /* @__PURE__ */ f(O.Group, {
+		}), /* @__PURE__ */ m(A.Group, {
 			className: "bento-number-field-group",
 			children: [
-				/* @__PURE__ */ d(O.Decrement, {
+				/* @__PURE__ */ p(A.Decrement, {
 					className: "bento-number-field-button",
 					"aria-label": "Decrease",
-					children: /* @__PURE__ */ d(ne, { size: 14 })
+					children: /* @__PURE__ */ p(te, { size: 14 })
 				}),
-				/* @__PURE__ */ d(O.Input, { className: "bento-number-field-input" }),
-				/* @__PURE__ */ d(O.Increment, {
+				/* @__PURE__ */ p(A.Input, { className: "bento-number-field-input" }),
+				/* @__PURE__ */ p(A.Increment, {
 					className: "bento-number-field-button",
 					"aria-label": "Increase",
-					children: /* @__PURE__ */ d(re, { size: 14 })
+					children: /* @__PURE__ */ p(ne, { size: 14 })
 				})
 			]
 		})]
@@ -531,34 +531,34 @@ function Ne({ label: e, className: t, ...n }) {
 }
 //#endregion
 //#region src/components/ui/OtpField.tsx
-function Pe({ length: e = 6, label: t, className: n, ...r }) {
-	return /* @__PURE__ */ f(k.Root, {
+function Ne({ length: e = 6, label: t, className: n, ...r }) {
+	return /* @__PURE__ */ m(j.Root, {
 		className: o("bento-otp-field", n),
 		length: e,
 		...r,
-		children: [t && /* @__PURE__ */ d("label", {
+		children: [t && /* @__PURE__ */ p("label", {
 			className: "field-label",
 			children: t
-		}), /* @__PURE__ */ d("div", {
+		}), /* @__PURE__ */ p("div", {
 			className: "bento-otp-inputs",
-			children: Array.from({ length: e }, (e, t) => /* @__PURE__ */ d(k.Input, { className: "bento-otp-input" }, t))
+			children: Array.from({ length: e }, (e, t) => /* @__PURE__ */ p(j.Input, { className: "bento-otp-input" }, t))
 		})]
 	});
 }
 //#endregion
 //#region src/components/ui/Popover.tsx
-function Fe({ trigger: e, title: t, description: n, children: r, className: i }) {
-	return /* @__PURE__ */ f(A.Root, { children: [/* @__PURE__ */ d(A.Trigger, { render: e }), /* @__PURE__ */ d(A.Portal, { children: /* @__PURE__ */ d(A.Positioner, {
+function Pe({ trigger: e, title: t, description: n, children: r, className: i }) {
+	return /* @__PURE__ */ m(M.Root, { children: [/* @__PURE__ */ p(M.Trigger, { render: e }), /* @__PURE__ */ p(M.Portal, { children: /* @__PURE__ */ p(M.Positioner, {
 		sideOffset: 10,
-		children: /* @__PURE__ */ f(A.Popup, {
+		children: /* @__PURE__ */ m(M.Popup, {
 			className: o("bento-popover-popup", i),
 			children: [
-				/* @__PURE__ */ d(A.Arrow, { className: "bento-popover-arrow" }),
-				t && /* @__PURE__ */ d(A.Title, {
+				/* @__PURE__ */ p(M.Arrow, { className: "bento-popover-arrow" }),
+				t && /* @__PURE__ */ p(M.Title, {
 					className: "bento-popover-title",
 					children: t
 				}),
-				n && /* @__PURE__ */ d(A.Description, {
+				n && /* @__PURE__ */ p(M.Description, {
 					className: "bento-popover-description",
 					children: n
 				}),
@@ -569,22 +569,22 @@ function Fe({ trigger: e, title: t, description: n, children: r, className: i })
 }
 //#endregion
 //#region src/components/ui/PreviewCard.tsx
-function Ie({ trigger: e, title: t, description: n, imageUrl: r, imageAlt: i, className: a }) {
-	return /* @__PURE__ */ f(j.Root, { children: [/* @__PURE__ */ d(j.Trigger, { render: e }), /* @__PURE__ */ d(j.Portal, { children: /* @__PURE__ */ d(j.Positioner, {
+function Fe({ trigger: e, title: t, description: n, imageUrl: r, imageAlt: i, className: a }) {
+	return /* @__PURE__ */ m(N.Root, { children: [/* @__PURE__ */ p(N.Trigger, { render: e }), /* @__PURE__ */ p(N.Portal, { children: /* @__PURE__ */ p(N.Positioner, {
 		sideOffset: 10,
-		children: /* @__PURE__ */ f(j.Popup, {
+		children: /* @__PURE__ */ m(N.Popup, {
 			className: o("bento-preview-card", a),
 			children: [
-				/* @__PURE__ */ d(j.Arrow, { className: "bento-preview-card-arrow" }),
-				r && /* @__PURE__ */ d("img", {
+				/* @__PURE__ */ p(N.Arrow, { className: "bento-preview-card-arrow" }),
+				r && /* @__PURE__ */ p("img", {
 					src: r,
 					alt: i ?? ""
 				}),
-				/* @__PURE__ */ d("h3", {
+				/* @__PURE__ */ p("h3", {
 					className: "bento-preview-card-title",
 					children: t
 				}),
-				n && /* @__PURE__ */ d("p", {
+				n && /* @__PURE__ */ p("p", {
 					className: "bento-preview-card-description",
 					children: n
 				})
@@ -594,101 +594,101 @@ function Ie({ trigger: e, title: t, description: n, imageUrl: r, imageAlt: i, cl
 }
 //#endregion
 //#region src/components/ui/Progress.tsx
-var Le = t(({ value: e, showValue: t, className: n, ...r }, i) => /* @__PURE__ */ f("div", {
+var Ie = t(({ value: e, showValue: t, className: n, ...r }, i) => /* @__PURE__ */ m("div", {
 	className: o("bento-progress", n),
-	children: [t && /* @__PURE__ */ f("div", {
+	children: [t && /* @__PURE__ */ m("div", {
 		className: "bento-progress-label",
-		children: [/* @__PURE__ */ d("span", { children: r["aria-label"] ?? "Progress" }), /* @__PURE__ */ f("span", {
+		children: [/* @__PURE__ */ p("span", { children: r["aria-label"] ?? "Progress" }), /* @__PURE__ */ m("span", {
 			className: "bento-progress-value",
 			children: [e ?? 0, "%"]
 		})]
-	}), /* @__PURE__ */ d(M.Root, {
+	}), /* @__PURE__ */ p(P.Root, {
 		ref: i,
 		value: e,
 		...r,
-		children: /* @__PURE__ */ d(M.Track, {
+		children: /* @__PURE__ */ p(P.Track, {
 			className: "bento-progress-track",
-			children: /* @__PURE__ */ d(M.Indicator, { className: "bento-progress-indicator" })
+			children: /* @__PURE__ */ p(P.Indicator, { className: "bento-progress-indicator" })
 		})
 	})]
 }));
-Le.displayName = "Progress";
+Ie.displayName = "Progress";
 //#endregion
 //#region src/components/ui/Radio.tsx
-function Re({ label: e, className: t, ...n }) {
-	let r = /* @__PURE__ */ d(N.Root, {
+function Le({ label: e, className: t, ...n }) {
+	let r = /* @__PURE__ */ p(F.Root, {
 		className: o("bento-radio", t),
 		...n,
-		children: /* @__PURE__ */ d(N.Indicator, { className: "bento-radio-indicator" })
+		children: /* @__PURE__ */ p(F.Indicator, { className: "bento-radio-indicator" })
 	});
-	return e ? /* @__PURE__ */ f("label", {
+	return e ? /* @__PURE__ */ m("label", {
 		className: "bento-radio-label",
 		children: [r, e]
 	}) : r;
 }
 //#endregion
 //#region src/components/ui/RadioGroup.tsx
-function ze({ options: e, defaultValue: t, className: n, ...r }) {
-	return /* @__PURE__ */ d(pe, {
+function Re({ options: e, defaultValue: t, className: n, ...r }) {
+	return /* @__PURE__ */ p(de, {
 		defaultValue: t,
 		className: o("bento-radio-group", n),
 		...r,
-		children: e.map((e) => /* @__PURE__ */ f("label", {
+		children: e.map((e) => /* @__PURE__ */ m("label", {
 			className: "bento-radio-label",
-			children: [/* @__PURE__ */ d(P.Root, {
+			children: [/* @__PURE__ */ p(I.Root, {
 				className: "bento-radio",
 				value: e.value,
-				children: /* @__PURE__ */ d(P.Indicator, { className: "bento-radio-indicator" })
+				children: /* @__PURE__ */ p(I.Indicator, { className: "bento-radio-indicator" })
 			}), e.label]
 		}, e.value))
 	});
 }
 //#endregion
 //#region src/components/ui/ScrollArea.tsx
-var Be = t(({ className: e, children: t, ...n }, r) => /* @__PURE__ */ f(F.Root, {
+var ze = t(({ className: e, children: t, ...n }, r) => /* @__PURE__ */ m(L.Root, {
 	ref: r,
 	className: o("bento-scroll-area", e),
 	...n,
 	children: [
-		/* @__PURE__ */ d(F.Viewport, {
+		/* @__PURE__ */ p(L.Viewport, {
 			className: "bento-scroll-area-viewport",
 			children: t
 		}),
-		/* @__PURE__ */ d(F.Scrollbar, {
+		/* @__PURE__ */ p(L.Scrollbar, {
 			className: "bento-scroll-area-scrollbar",
-			children: /* @__PURE__ */ d(F.Thumb, { className: "bento-scroll-area-thumb" })
+			children: /* @__PURE__ */ p(L.Thumb, { className: "bento-scroll-area-thumb" })
 		}),
-		/* @__PURE__ */ d(F.Corner, { className: "bento-scroll-area-corner" })
+		/* @__PURE__ */ p(L.Corner, { className: "bento-scroll-area-corner" })
 	]
 }));
-Be.displayName = "ScrollArea";
+ze.displayName = "ScrollArea";
 //#endregion
 //#region src/components/ui/Select.tsx
-function Ve({ items: e, label: t, placeholder: n, defaultValue: r, ...i }) {
-	return /* @__PURE__ */ f(I.Root, {
+function Be({ items: e, label: t, placeholder: n, defaultValue: r, ...i }) {
+	return /* @__PURE__ */ m(R.Root, {
 		defaultValue: r,
 		items: e,
 		...i,
 		children: [
-			t && /* @__PURE__ */ d("label", {
+			t && /* @__PURE__ */ p("label", {
 				className: "field-label",
 				htmlFor: i.id,
 				children: t
 			}),
-			/* @__PURE__ */ f(I.Trigger, {
+			/* @__PURE__ */ m(R.Trigger, {
 				id: i.id,
 				className: "bento-select-trigger",
-				children: [/* @__PURE__ */ d(I.Value, { placeholder: n }), /* @__PURE__ */ d(I.Icon, { children: /* @__PURE__ */ d(l, { size: 16 }) })]
+				children: [/* @__PURE__ */ p(R.Value, { placeholder: n }), /* @__PURE__ */ p(R.Icon, { children: /* @__PURE__ */ p(l, { size: 16 }) })]
 			}),
-			/* @__PURE__ */ d(I.Portal, { children: /* @__PURE__ */ d(I.Positioner, {
+			/* @__PURE__ */ p(R.Portal, { children: /* @__PURE__ */ p(R.Positioner, {
 				className: "bento-select-positioner",
 				sideOffset: 8,
-				children: /* @__PURE__ */ d(I.Popup, {
+				children: /* @__PURE__ */ p(R.Popup, {
 					className: o("bento-select-popup"),
-					children: Object.entries(e).map(([e, t]) => /* @__PURE__ */ f(I.Item, {
+					children: Object.entries(e).map(([e, t]) => /* @__PURE__ */ m(R.Item, {
 						className: "bento-select-item",
 						value: e,
-						children: [/* @__PURE__ */ d(I.ItemIndicator, { children: /* @__PURE__ */ d(c, { size: 15 }) }), /* @__PURE__ */ d(I.ItemText, { children: t })]
+						children: [/* @__PURE__ */ p(R.ItemIndicator, { children: /* @__PURE__ */ p(c, { size: 15 }) }), /* @__PURE__ */ p(R.ItemText, { children: t })]
 					}, e))
 				})
 			}) })
@@ -697,107 +697,107 @@ function Ve({ items: e, label: t, placeholder: n, defaultValue: r, ...i }) {
 }
 //#endregion
 //#region src/components/ui/Separator.tsx
-var He = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(me, {
+var Ve = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(fe, {
 	ref: n,
 	className: o("bento-separator", e),
 	...t
 }));
-He.displayName = "Separator";
+Ve.displayName = "Separator";
 //#endregion
 //#region src/components/ui/Slider.tsx
-var Ue = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(L.Root, {
+var He = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(z.Root, {
 	ref: n,
 	className: o("bento-slider", e),
 	...t,
-	children: /* @__PURE__ */ d(L.Control, {
+	children: /* @__PURE__ */ p(z.Control, {
 		className: "bento-slider-control",
-		children: /* @__PURE__ */ f(L.Track, {
+		children: /* @__PURE__ */ m(z.Track, {
 			className: "bento-slider-track",
-			children: [/* @__PURE__ */ d(L.Indicator, { className: "bento-slider-indicator" }), /* @__PURE__ */ d(L.Thumb, { className: "bento-slider-thumb" })]
+			children: [/* @__PURE__ */ p(z.Indicator, { className: "bento-slider-indicator" }), /* @__PURE__ */ p(z.Thumb, { className: "bento-slider-thumb" })]
 		})
 	})
 }));
-Ue.displayName = "Slider";
+He.displayName = "Slider";
 //#endregion
 //#region src/components/ui/Switch.tsx
-var We = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ d(he.Root, {
+var Ue = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ p(B.Root, {
 		ref: i,
 		id: n,
 		className: o("bento-switch", t),
 		...r,
-		children: /* @__PURE__ */ d(he.Thumb, { className: "bento-switch-thumb" })
+		children: /* @__PURE__ */ p(B.Thumb, { className: "bento-switch-thumb" })
 	});
-	return e ? /* @__PURE__ */ f("label", {
+	return e ? /* @__PURE__ */ m("label", {
 		className: "bento-switch-label",
 		htmlFor: n,
 		children: [a, e]
 	}) : a;
 });
-We.displayName = "Switch";
+Ue.displayName = "Switch";
 //#endregion
 //#region src/components/ui/Tabs.tsx
-function Ge({ panels: e, defaultValue: t, className: n, ...r }) {
-	return /* @__PURE__ */ f(R.Root, {
+function We({ panels: e, defaultValue: t, className: n, ...r }) {
+	return /* @__PURE__ */ m(V.Root, {
 		defaultValue: t ?? e[0]?.value,
 		className: o("bento-tabs", n),
 		...r,
-		children: [/* @__PURE__ */ f(R.List, {
+		children: [/* @__PURE__ */ m(V.List, {
 			className: o("bento-tabs-list", `cols-${e.length}`),
-			children: [e.map((e) => /* @__PURE__ */ d(R.Tab, {
+			children: [e.map((e) => /* @__PURE__ */ p(V.Tab, {
 				className: "bento-tabs-tab",
 				value: e.value,
 				children: e.label
-			}, e.value)), /* @__PURE__ */ d(R.Indicator, { className: "bento-tabs-indicator" })]
-		}), e.map((e) => /* @__PURE__ */ f(R.Panel, {
+			}, e.value)), /* @__PURE__ */ p(V.Indicator, { className: "bento-tabs-indicator" })]
+		}), e.map((e) => /* @__PURE__ */ m(V.Panel, {
 			className: "bento-tabs-panel",
 			value: e.value,
-			children: [e.title && /* @__PURE__ */ d("strong", {
+			children: [e.title && /* @__PURE__ */ p("strong", {
 				className: "bento-tabs-panel-title",
 				children: e.title
-			}), /* @__PURE__ */ d("p", { children: e.content })]
+			}), /* @__PURE__ */ p("p", { children: e.content })]
 		}, e.value))]
 	});
 }
 //#endregion
 //#region src/components/ui/Toggle.tsx
-var Ke = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(z, {
+var Ge = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(H, {
 	ref: n,
 	className: o("bento-toggle", e),
 	...t
 }));
-Ke.displayName = "Toggle";
+Ge.displayName = "Toggle";
 //#endregion
 //#region src/components/ui/Toast.tsx
-function qe() {
-	let { toasts: e } = B.useToastManager();
-	return e.length === 0 ? null : /* @__PURE__ */ d("div", {
+function Ke() {
+	let { toasts: e } = U.useToastManager();
+	return e.length === 0 ? null : /* @__PURE__ */ p("div", {
 		className: "bento-toast-provider",
-		children: e.map((e) => /* @__PURE__ */ f(B.Root, {
+		children: e.map((e) => /* @__PURE__ */ m(U.Root, {
 			className: "bento-toast",
 			toast: e,
-			children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d(B.Title, {
+			children: [/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p(U.Title, {
 				className: "bento-toast-title",
 				children: e.title
-			}), e.description && /* @__PURE__ */ d(B.Description, {
+			}), e.description && /* @__PURE__ */ p(U.Description, {
 				className: "bento-toast-description",
 				children: e.description
-			})] }), /* @__PURE__ */ d(B.Close, {
+			})] }), /* @__PURE__ */ p(U.Close, {
 				className: "bento-toast-close",
 				"aria-label": "Dismiss",
-				render: /* @__PURE__ */ d("button", { type: "button" }),
-				children: /* @__PURE__ */ d(u, { size: 15 })
+				render: /* @__PURE__ */ p("button", { type: "button" }),
+				children: /* @__PURE__ */ p(f, { size: 15 })
 			})]
 		}, e.id))
 	});
 }
-function Je({ children: e }) {
-	return /* @__PURE__ */ f(B.Provider, { children: [e, /* @__PURE__ */ d(qe, {})] });
+function qe({ children: e }) {
+	return /* @__PURE__ */ m(U.Provider, { children: [e, /* @__PURE__ */ p(Ke, {})] });
 }
 //#endregion
 //#region src/components/ui/useToastManager.ts
-function Ye() {
-	let e = B.useToastManager();
+function Je() {
+	let e = U.useToastManager();
 	return {
 		add: (t, n) => e.add({
 			title: t,
@@ -808,12 +808,12 @@ function Ye() {
 }
 //#endregion
 //#region src/components/ui/ToggleGroup.tsx
-function Xe({ options: e, defaultValue: t, className: n, ...r }) {
-	return /* @__PURE__ */ d(ge, {
+function Ye({ options: e, defaultValue: t, className: n, ...r }) {
+	return /* @__PURE__ */ p(pe, {
 		defaultValue: t,
 		className: o("bento-toggle-group", n),
 		...r,
-		children: e.map((e) => /* @__PURE__ */ d(z, {
+		children: e.map((e) => /* @__PURE__ */ p(H, {
 			className: "bento-toggle",
 			value: e.value,
 			children: e.label
@@ -822,42 +822,42 @@ function Xe({ options: e, defaultValue: t, className: n, ...r }) {
 }
 //#endregion
 //#region src/components/ui/Toolbar.tsx
-function Ze({ className: e, showSearch: t = !0, ...n }) {
-	return /* @__PURE__ */ f(V.Root, {
+function Xe({ className: e, showSearch: t = !0, ...n }) {
+	return /* @__PURE__ */ m(W.Root, {
 		className: o("bento-toolbar", e),
 		...n,
-		children: [/* @__PURE__ */ f(V.Group, {
+		children: [/* @__PURE__ */ m(W.Group, {
 			className: "bento-toolbar-group",
 			children: [
-				/* @__PURE__ */ d(Qe, {
+				/* @__PURE__ */ p(Ze, {
 					"aria-label": "Bold",
-					children: /* @__PURE__ */ d(s, { size: 15 })
+					children: /* @__PURE__ */ p(s, { size: 15 })
 				}),
-				/* @__PURE__ */ d(Qe, {
+				/* @__PURE__ */ p(Ze, {
 					"aria-label": "Italic",
-					children: /* @__PURE__ */ d(ee, { size: 15 })
+					children: /* @__PURE__ */ p(u, { size: 15 })
 				}),
-				/* @__PURE__ */ d(V.Separator, { className: "bento-toolbar-separator" }),
-				/* @__PURE__ */ d(V.Link, {
+				/* @__PURE__ */ p(W.Separator, { className: "bento-toolbar-separator" }),
+				/* @__PURE__ */ p(W.Link, {
 					className: "bento-toolbar-button",
 					href: "https://base-ui.com",
 					target: "_blank",
 					rel: "noreferrer",
 					"aria-label": "Base UI docs",
-					children: /* @__PURE__ */ d(te, { size: 15 })
+					children: /* @__PURE__ */ p(ee, { size: 15 })
 				})
 			]
-		}), t && /* @__PURE__ */ f("div", {
+		}), t && /* @__PURE__ */ m("div", {
 			className: "bento-toolbar-search",
-			children: [/* @__PURE__ */ d(ie, { size: 14 }), /* @__PURE__ */ d(V.Input, {
+			children: [/* @__PURE__ */ p(d, { size: 14 }), /* @__PURE__ */ p(W.Input, {
 				className: "bento-toolbar-input",
 				placeholder: "Search docs"
 			})]
 		})]
 	});
 }
-function Qe({ children: e, ...t }) {
-	return /* @__PURE__ */ d(V.Button, {
+function Ze({ children: e, ...t }) {
+	return /* @__PURE__ */ p(W.Button, {
 		className: "bento-toolbar-button",
 		...t,
 		children: e
@@ -865,54 +865,80 @@ function Qe({ children: e, ...t }) {
 }
 //#endregion
 //#region src/components/ui/Tooltip.tsx
-function $e({ content: e, children: t, className: n }) {
-	return /* @__PURE__ */ f(H.Root, { children: [/* @__PURE__ */ d(H.Trigger, { render: t }), /* @__PURE__ */ d(H.Portal, { children: /* @__PURE__ */ d(H.Positioner, {
+function Qe({ content: e, children: t, className: n }) {
+	return /* @__PURE__ */ m(G.Root, { children: [/* @__PURE__ */ p(G.Trigger, { render: t }), /* @__PURE__ */ p(G.Portal, { children: /* @__PURE__ */ p(G.Positioner, {
 		sideOffset: 8,
-		children: /* @__PURE__ */ f(H.Popup, {
+		children: /* @__PURE__ */ m(G.Popup, {
 			className: o("bento-tooltip-popup", n),
-			children: [e, /* @__PURE__ */ d(H.Arrow, { className: "bento-tooltip-arrow" })]
+			children: [e, /* @__PURE__ */ p(G.Arrow, { className: "bento-tooltip-arrow" })]
 		})
 	}) })] });
 }
-$e.Provider = H.Provider;
+Qe.Provider = G.Provider;
 //#endregion
 //#region src/hooks/useTheme.ts
+var $e = new Set([
+	"bento",
+	"shadcn",
+	"neo-brutalism",
+	"minimal",
+	"enterprise",
+	"linear",
+	"glass",
+	"terminal",
+	"material",
+	"fluent",
+	"retro",
+	"cyberpunk",
+	"editorial",
+	"calm",
+	"data-dense",
+	"playful",
+	"luxury",
+	"soft-ui",
+	"bauhaus",
+	"mono"
+]);
 function et() {
 	if (typeof window > "u") return "system";
-	let e = localStorage.getItem("bento-theme");
-	return e === "light" || e === "dark" || e === "system" ? e : "system";
+	let e = new URLSearchParams(window.location.search).get("theme");
+	if (e === "light" || e === "dark" || e === "system") return e;
+	let t = localStorage.getItem("bento-theme");
+	return t === "light" || t === "dark" || t === "system" ? t : "system";
 }
 function tt() {
 	if (typeof window > "u") return "bento";
-	let e = localStorage.getItem("bento-style");
-	return e === "bento" || e === "shadcn" || e === "neo-brutalism" ? e : "bento";
+	let e = new URLSearchParams(window.location.search).get("style");
+	if (e && $e.has(e)) return e;
+	let t = localStorage.getItem("bento-style");
+	return t && $e.has(t) ? t : "bento";
 }
-function Z(e) {
+function Q(e) {
 	return e === "system" ? typeof window > "u" ? "light" : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : e;
 }
-function Q(e) {
+function $(e) {
 	document.documentElement.setAttribute("data-theme", e);
 }
-function $(e) {
+function nt(e) {
 	document.documentElement.setAttribute("data-style", e);
 }
-function nt() {
+function rt() {
 	let [e, t] = a(et), [i, o] = a(tt), s = n((e) => {
-		t(e), localStorage.setItem("bento-theme", e), Q(Z(e));
+		t(e), localStorage.setItem("bento-theme", e), $(Q(e));
 	}, []), c = n((e) => {
-		o(e), localStorage.setItem("bento-style", e), $(e);
+		o(e), localStorage.setItem("bento-style", e), nt(e);
 	}, []);
 	return r(() => {
-		if (Q(Z(e)), $(i), e !== "system") return;
-		let t = window.matchMedia("(prefers-color-scheme: dark)"), n = () => Q(t.matches ? "dark" : "light");
+		if ($(Q(e)), nt(i), e !== "system") return;
+		let t = window.matchMedia("(prefers-color-scheme: dark)"), n = () => $(t.matches ? "dark" : "light");
 		return t.addEventListener("change", n), () => t.removeEventListener("change", n);
 	}, [e, i]), {
 		theme: e,
 		setTheme: s,
-		resolved: Z(e),
+		resolved: Q(e),
 		style: i,
 		setStyle: c
 	};
 }
 //#endregion
-export { _e as Accordion, ve as AlertDialog, ye as Autocomplete, U as Avatar, W as AvatarGroup, G as Button, K as Checkbox, be as CheckboxGroup, xe as Collapsible, Se as Combobox, Ce as ContextMenu, we as CspProvider, Te as Dialog, Ee as DirectionProvider, De as Drawer, Oe as Field, ke as Fieldset, q as Form, J as Input, Ae as Menu, je as Menubar, X as Meter, Me as NavigationMenu, Ne as NumberField, Pe as OtpField, Fe as Popover, Ie as PreviewCard, Le as Progress, Re as Radio, ze as RadioGroup, Be as ScrollArea, Ve as Select, He as Separator, Ue as Slider, We as Switch, Ge as Tabs, Y as Textarea, Je as ToastProvider, Ke as Toggle, Xe as ToggleGroup, Ze as Toolbar, $e as Tooltip, le as useDirection, nt as useTheme, Ye as useToastManager };
+export { me as Accordion, he as AlertDialog, ge as Autocomplete, K as Avatar, q as AvatarGroup, J as Button, Y as Checkbox, _e as CheckboxGroup, ve as Collapsible, ye as Combobox, be as ContextMenu, xe as CspProvider, Se as Dialog, Ce as DirectionProvider, we as Drawer, Te as Field, Ee as Fieldset, X as Form, Z as Input, Oe as Menu, ke as Menubar, Ae as Meter, je as NavigationMenu, Me as NumberField, Ne as OtpField, Pe as Popover, Fe as PreviewCard, Ie as Progress, Le as Radio, Re as RadioGroup, ze as ScrollArea, Be as Select, Ve as Separator, He as Slider, Ue as Switch, We as Tabs, De as Textarea, qe as ToastProvider, Ge as Toggle, Ye as ToggleGroup, Xe as Toolbar, Qe as Tooltip, se as useDirection, rt as useTheme, Je as useToastManager };