base-themes 0.1.2 → 0.1.3

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 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";
+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 ue } from "@base-ui/react/fieldset";
+import { Form as de } from "@base-ui/react/form";
+import { Input as fe } from "@base-ui/react/input";
+import { Menu as C, Menu as w } from "@base-ui/react/menu";
+import { Menubar as pe } from "@base-ui/react/menubar";
+import { Meter as T } from "@base-ui/react/meter";
+import { NavigationMenu as E } from "@base-ui/react/navigation-menu";
+import { NumberField as D } from "@base-ui/react/number-field";
+import { OTPFieldPreview as me } from "@base-ui/react/otp-field";
+import { Popover as O } from "@base-ui/react/popover";
+import { PreviewCard as k } from "@base-ui/react/preview-card";
+import { Progress as A } from "@base-ui/react/progress";
+import { Radio as he, Radio as ge } from "@base-ui/react/radio";
+import { RadioGroup as _e } from "@base-ui/react/radio-group";
+import { ScrollArea as j } from "@base-ui/react/scroll-area";
+import { Select as M } from "@base-ui/react/select";
+import { Separator as ve } from "@base-ui/react/separator";
+import { Slider as N } from "@base-ui/react/slider";
+import { Switch as ye } from "@base-ui/react/switch";
+import { Tabs as P } from "@base-ui/react/tabs";
+import { Toggle as be } from "@base-ui/react/toggle";
+import { Toast as F } from "@base-ui/react/toast";
+import { ToggleGroup as xe } from "@base-ui/react/toggle-group";
+import { Toolbar as I } from "@base-ui/react/toolbar";
+import { Tooltip as L } from "@base-ui/react/tooltip";
 //#region src/components/ui/Accordion.tsx
-function me({ items: t, defaultValue: n, className: r, ...i }) {
-	return /* @__PURE__ */ p(e.Root, {
+function Se({ items: t, defaultValue: n, className: r, ...i }) {
+	return /* @__PURE__ */ d(e.Root, {
 		defaultValue: n ?? t.slice(0, 1).map((e) => e.value),
 		className: o("bento-accordion", r),
 		...i,
-		children: t.map((t) => /* @__PURE__ */ m(e.Item, {
+		children: t.map((t) => /* @__PURE__ */ f(e.Item, {
 			className: "bento-accordion-item",
 			value: t.value,
-			children: [/* @__PURE__ */ p(e.Header, {
+			children: [/* @__PURE__ */ d(e.Header, {
 				className: "bento-accordion-header",
-				children: /* @__PURE__ */ m(e.Trigger, {
+				children: /* @__PURE__ */ f(e.Trigger, {
 					className: "bento-accordion-trigger",
-					children: [t.label, /* @__PURE__ */ p(l, { size: 15 })]
+					children: [t.label, /* @__PURE__ */ d(l, { size: 15 })]
 				})
-			}), /* @__PURE__ */ p(e.Panel, {
+			}), /* @__PURE__ */ d(e.Panel, {
 				className: "bento-accordion-panel",
 				children: t.content
 			})]
@@ -66,24 +66,24 @@ function me({ items: t, defaultValue: n, className: r, ...i }) {
 }
 //#endregion
 //#region src/components/ui/AlertDialog.tsx
-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, {
+function Ce({ 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, {
 		className: o("bento-alert-popup", s),
 		children: [
-			/* @__PURE__ */ p(h.Title, {
+			/* @__PURE__ */ d(p.Title, {
 				className: "bento-alert-title",
 				children: t
 			}),
-			/* @__PURE__ */ p(h.Description, {
+			/* @__PURE__ */ d(p.Description, {
 				className: "bento-alert-description",
 				children: n
 			}),
-			/* @__PURE__ */ m("div", {
+			/* @__PURE__ */ f("div", {
 				className: "bento-alert-actions",
-				children: [/* @__PURE__ */ m(h.Close, {
+				children: [/* @__PURE__ */ f(p.Close, {
 					className: "bento-button outline",
 					children: [" ", i]
-				}), /* @__PURE__ */ p(h.Close, {
+				}), /* @__PURE__ */ d(p.Close, {
 					className: "bento-button accent",
 					onClick: a,
 					children: r
@@ -94,36 +94,36 @@ function he({ trigger: e, title: t, description: n, confirmLabel: r = "Confirm",
 }
 //#endregion
 //#region src/components/ui/Autocomplete.tsx
-function ge({ options: e, label: t, placeholder: n = "Search...", className: r, ...i }) {
-	return /* @__PURE__ */ p("div", {
+function we({ options: e, label: t, placeholder: n = "Search...", className: r, ...i }) {
+	return /* @__PURE__ */ d("div", {
 		className: o("bento-combobox bento-autocomplete", r),
-		children: /* @__PURE__ */ m(g.Root, {
+		children: /* @__PURE__ */ f(m.Root, {
 			items: e,
 			...i,
 			children: [
-				t && /* @__PURE__ */ p("label", {
+				t && /* @__PURE__ */ d("label", {
 					className: "field-label",
 					children: t
 				}),
-				/* @__PURE__ */ m(g.InputGroup, {
+				/* @__PURE__ */ f(m.InputGroup, {
 					className: "bento-combobox-input-wrap",
-					children: [/* @__PURE__ */ p(d, { size: 15 }), /* @__PURE__ */ p(g.Input, {
+					children: [/* @__PURE__ */ d(ie, { size: 15 }), /* @__PURE__ */ d(m.Input, {
 						className: "bento-combobox-input",
 						placeholder: n
 					})]
 				}),
-				/* @__PURE__ */ p(g.Portal, { children: /* @__PURE__ */ p(g.Positioner, {
+				/* @__PURE__ */ d(m.Portal, { children: /* @__PURE__ */ d(m.Positioner, {
 					className: "bento-combobox-positioner",
 					sideOffset: 8,
-					children: /* @__PURE__ */ m(g.Popup, {
+					children: /* @__PURE__ */ f(m.Popup, {
 						className: "bento-combobox-popup",
-						children: [/* @__PURE__ */ p(g.Empty, {
+						children: [/* @__PURE__ */ d(m.Empty, {
 							className: "bento-combobox-empty",
 							children: "No results"
-						}), /* @__PURE__ */ p(g.List, { children: (e) => /* @__PURE__ */ m(g.Item, {
+						}), /* @__PURE__ */ d(m.List, { children: (e) => /* @__PURE__ */ f(m.Item, {
 							className: "bento-combobox-item",
 							value: e.value,
-							children: [/* @__PURE__ */ p(g.Value, { children: e.label }), /* @__PURE__ */ p(c, { size: 14 })]
+							children: [/* @__PURE__ */ d(m.Value, { children: e.label }), /* @__PURE__ */ d(c, { size: 14 })]
 						}, e.value) })]
 					})
 				}) })
@@ -133,55 +133,55 @@ function ge({ options: e, label: t, placeholder: n = "Search...", className: r,
 }
 //#endregion
 //#region src/components/ui/Avatar.tsx
-var K = t(({ src: e, alt: t, fallback: n, size: r, className: i, ...a }, s) => /* @__PURE__ */ m(_.Root, {
+var R = t(({ src: e, alt: t, fallback: n, size: r, className: i, ...a }, s) => /* @__PURE__ */ f(h.Root, {
 	ref: s,
 	className: o("bento-avatar", r && r !== "md" && r, i),
 	...a,
-	children: [e && /* @__PURE__ */ p(_.Image, {
+	children: [e && /* @__PURE__ */ d(h.Image, {
 		src: e,
 		alt: t
-	}), /* @__PURE__ */ p(_.Fallback, { children: n })]
+	}), /* @__PURE__ */ d(h.Fallback, { children: n })]
 }));
-K.displayName = "Avatar";
-var q = t(({ className: e, ...t }, n) => /* @__PURE__ */ p("div", {
+R.displayName = "Avatar";
+var z = t(({ className: e, ...t }, n) => /* @__PURE__ */ d("div", {
 	ref: n,
 	className: o("bento-avatar-group", e),
 	...t
 }));
-q.displayName = "AvatarGroup";
+z.displayName = "AvatarGroup";
 //#endregion
 //#region src/components/ui/Button.tsx
-var J = t(({ variant: e = "primary", className: t, ...n }, r) => /* @__PURE__ */ p(re, {
+var B = t(({ variant: e = "primary", className: t, ...n }, r) => /* @__PURE__ */ d(ae, {
 	ref: r,
 	className: o("bento-button", e !== "primary" && e, t),
 	...n
 }));
-J.displayName = "Button";
+B.displayName = "Button";
 //#endregion
 //#region src/components/ui/Checkbox.tsx
-var Y = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ p(v.Root, {
+var V = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ d(g.Root, {
 		ref: i,
 		id: n,
 		className: o("bento-checkbox", t),
 		...r,
-		children: /* @__PURE__ */ p(v.Indicator, { children: /* @__PURE__ */ p(c, { size: 14 }) })
+		children: /* @__PURE__ */ d(g.Indicator, { children: /* @__PURE__ */ d(c, { size: 14 }) })
 	});
-	return e ? /* @__PURE__ */ m("label", {
+	return e ? /* @__PURE__ */ f("label", {
 		className: "bento-checkbox-label",
 		htmlFor: n,
 		children: [a, e]
 	}) : a;
 });
-Y.displayName = "Checkbox";
+V.displayName = "Checkbox";
 //#endregion
 //#region src/components/ui/CheckboxGroup.tsx
-function _e({ options: e, className: t, defaultValue: n, ...r }) {
-	return /* @__PURE__ */ p(ie, {
+function Te({ options: e, className: t, defaultValue: n, ...r }) {
+	return /* @__PURE__ */ d(oe, {
 		className: o("bento-checkbox-group", t),
 		defaultValue: n,
 		...r,
-		children: e.map((e) => /* @__PURE__ */ p(Y, {
+		children: e.map((e) => /* @__PURE__ */ d(V, {
 			name: e.value,
 			value: e.value,
 			label: e.label
@@ -190,14 +190,14 @@ function _e({ options: e, className: t, defaultValue: n, ...r }) {
 }
 //#endregion
 //#region src/components/ui/Collapsible.tsx
-function ve({ label: e, children: t, defaultOpen: n, className: r }) {
-	return /* @__PURE__ */ m(y.Root, {
+function Ee({ label: e, children: t, defaultOpen: n, className: r }) {
+	return /* @__PURE__ */ f(_.Root, {
 		defaultOpen: n,
 		className: o("bento-collapsible", r),
-		children: [/* @__PURE__ */ m(y.Trigger, {
+		children: [/* @__PURE__ */ f(_.Trigger, {
 			className: "bento-collapsible-trigger",
-			children: [e, /* @__PURE__ */ p(l, { size: 15 })]
-		}), /* @__PURE__ */ p(y.Panel, {
+			children: [e, /* @__PURE__ */ d(l, { size: 15 })]
+		}), /* @__PURE__ */ d(_.Panel, {
 			className: "bento-collapsible-panel",
 			children: t
 		})]
@@ -205,27 +205,27 @@ function ve({ label: e, children: t, defaultOpen: n, className: r }) {
 }
 //#endregion
 //#region src/components/ui/Combobox.tsx
-function ye({ options: e, placeholder: t = "Search...", label: n, className: r }) {
+function H({ 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__ */ m("div", {
+	return /* @__PURE__ */ f("div", {
 		className: o("bento-combobox", r),
-		children: [n && /* @__PURE__ */ p("label", {
+		children: [n && /* @__PURE__ */ d("label", {
 			className: "field-label",
 			children: n
-		}), /* @__PURE__ */ m(b.Root, {
+		}), /* @__PURE__ */ f(v.Root, {
 			inputValue: i,
 			onInputValueChange: s,
-			children: [/* @__PURE__ */ p(b.Input, {
+			children: [/* @__PURE__ */ d(v.Input, {
 				className: "bento-combobox-input",
 				placeholder: t
-			}), /* @__PURE__ */ p(b.Portal, { children: /* @__PURE__ */ p(b.Positioner, {
+			}), /* @__PURE__ */ d(v.Portal, { children: /* @__PURE__ */ d(v.Positioner, {
 				sideOffset: 8,
-				children: /* @__PURE__ */ p(b.Popup, {
+				children: /* @__PURE__ */ d(v.Popup, {
 					className: "bento-combobox-popup",
-					children: c.length === 0 ? /* @__PURE__ */ p("div", {
+					children: c.length === 0 ? /* @__PURE__ */ d("div", {
 						className: "bento-combobox-no-results",
 						children: "No results"
-					}) : c.map((e) => /* @__PURE__ */ p(b.Item, {
+					}) : c.map((e) => /* @__PURE__ */ d(v.Item, {
 						className: "bento-combobox-item",
 						value: e.value,
 						children: e.label
@@ -237,16 +237,16 @@ function ye({ options: e, placeholder: t = "Search...", label: n, className: r }
 }
 //#endregion
 //#region src/components/ui/ContextMenu.tsx
-function be({ children: e, items: t, className: n }) {
-	return /* @__PURE__ */ m(x.Root, { children: [/* @__PURE__ */ p(x.Trigger, {
+function De({ children: e, items: t, className: n }) {
+	return /* @__PURE__ */ f(y.Root, { children: [/* @__PURE__ */ d(y.Trigger, {
 		className: "bento-context-menu-trigger",
 		children: e
-	}), /* @__PURE__ */ p(x.Portal, { children: /* @__PURE__ */ p(x.Positioner, {
+	}), /* @__PURE__ */ d(y.Portal, { children: /* @__PURE__ */ d(y.Positioner, {
 		className: "bento-menu-positioner",
 		sideOffset: 8,
-		children: /* @__PURE__ */ p(x.Popup, {
+		children: /* @__PURE__ */ d(y.Popup, {
 			className: o("bento-menu-popup", n),
-			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ p(x.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ m(x.Item, {
+			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ d(y.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ f(y.Item, {
 				className: "bento-menu-item",
 				disabled: e.disabled,
 				onClick: e.onClick,
@@ -257,28 +257,28 @@ function be({ children: e, items: t, className: n }) {
 }
 //#endregion
 //#region src/components/ui/CspProvider.tsx
-function xe(e) {
-	return /* @__PURE__ */ p(ae, { ...e });
+function Oe(e) {
+	return /* @__PURE__ */ d(se, { ...e });
 }
 //#endregion
 //#region src/components/ui/Dialog.tsx
-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, {
+function ke({ 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, {
 		className: o("bento-dialog-popup", i),
 		children: [
-			/* @__PURE__ */ m("div", {
+			/* @__PURE__ */ f("div", {
 				className: "bento-dialog-topline",
-				children: [/* @__PURE__ */ p(S.Title, {
+				children: [/* @__PURE__ */ d(b.Title, {
 					className: "bento-dialog-title",
 					children: t
-				}), /* @__PURE__ */ p(S.Close, {
+				}), /* @__PURE__ */ d(b.Close, {
 					className: "bento-button icon",
 					"aria-label": "Close dialog",
-					render: /* @__PURE__ */ p("button", { type: "button" }),
-					children: /* @__PURE__ */ p(f, { size: 18 })
+					render: /* @__PURE__ */ d("button", { type: "button" }),
+					children: /* @__PURE__ */ d(u, { size: 18 })
 				})]
 			}),
-			n && /* @__PURE__ */ p(S.Description, {
+			n && /* @__PURE__ */ d(b.Description, {
 				className: "bento-dialog-description",
 				children: n
 			}),
@@ -288,10 +288,10 @@ function Se({ trigger: e, title: t, description: n, children: r, className: i })
 }
 //#endregion
 //#region src/components/ui/DirectionProvider.tsx
-function Ce({ children: e, direction: t = "ltr" }) {
-	return /* @__PURE__ */ p(oe, {
+function Ae({ children: e, direction: t = "ltr" }) {
+	return /* @__PURE__ */ d(ce, {
 		direction: t,
-		children: /* @__PURE__ */ p("span", {
+		children: /* @__PURE__ */ d("span", {
 			dir: t,
 			style: { display: "contents" },
 			children: e
@@ -300,28 +300,28 @@ function Ce({ children: e, direction: t = "ltr" }) {
 }
 //#endregion
 //#region src/components/ui/Drawer.tsx
-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, {
+function je({ 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, {
 		className: o("bento-drawer-popup", a),
 		"data-side": i,
 		children: [
-			/* @__PURE__ */ m("div", {
+			/* @__PURE__ */ f("div", {
 				className: "bento-drawer-header",
-				children: [/* @__PURE__ */ p(C.Title, {
+				children: [/* @__PURE__ */ d(x.Title, {
 					className: "bento-drawer-title",
 					children: t
-				}), /* @__PURE__ */ p(C.Close, {
+				}), /* @__PURE__ */ d(x.Close, {
 					className: "bento-button icon",
 					"aria-label": "Close drawer",
-					render: /* @__PURE__ */ p("button", { type: "button" }),
-					children: /* @__PURE__ */ p(f, { size: 18 })
+					render: /* @__PURE__ */ d("button", { type: "button" }),
+					children: /* @__PURE__ */ d(u, { size: 18 })
 				})]
 			}),
-			n && /* @__PURE__ */ p(C.Description, {
+			n && /* @__PURE__ */ d(x.Description, {
 				className: "bento-drawer-description",
 				children: n
 			}),
-			/* @__PURE__ */ p("div", {
+			/* @__PURE__ */ d("div", {
 				className: "bento-drawer-body",
 				children: r
 			})
@@ -330,22 +330,22 @@ function we({ trigger: e, title: t, description: n, children: r, side: i = "righ
 }
 //#endregion
 //#region src/components/ui/Field.tsx
-function Te({ label: e, description: t, error: n, children: r, className: i, ...a }) {
-	return /* @__PURE__ */ m(w.Root, {
+function U({ label: e, description: t, error: n, children: r, className: i, ...a }) {
+	return /* @__PURE__ */ f(S.Root, {
 		className: o("bento-field", i),
 		invalid: !!n,
 		...a,
 		children: [
-			/* @__PURE__ */ p(w.Label, {
+			/* @__PURE__ */ d(S.Label, {
 				className: "field-label",
 				children: e
 			}),
-			/* @__PURE__ */ p(w.Control, { render: r }),
-			t && /* @__PURE__ */ p(w.Description, {
+			/* @__PURE__ */ d(S.Control, { render: r }),
+			t && /* @__PURE__ */ d(S.Description, {
 				className: "bento-field-description",
 				children: t
 			}),
-			n && /* @__PURE__ */ p(w.Error, {
+			n && /* @__PURE__ */ d(S.Error, {
 				className: "bento-field-error",
 				children: n
 			})
@@ -354,11 +354,11 @@ function Te({ label: e, description: t, error: n, children: r, className: i, ...
 }
 //#endregion
 //#region src/components/ui/Fieldset.tsx
-function Ee({ legend: e, children: t, className: n, ...r }) {
-	return /* @__PURE__ */ m(T.Root, {
+function W({ legend: e, children: t, className: n, ...r }) {
+	return /* @__PURE__ */ f(ue.Root, {
 		className: o("bento-fieldset", n),
 		...r,
-		children: [/* @__PURE__ */ p(T.Legend, {
+		children: [/* @__PURE__ */ d(ue.Legend, {
 			className: "bento-fieldset-legend",
 			children: e
 		}), t]
@@ -366,57 +366,57 @@ function Ee({ legend: e, children: t, className: n, ...r }) {
 }
 //#endregion
 //#region src/components/ui/Form.tsx
-var X = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(ce, {
+var Me = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(de, {
 	ref: n,
 	className: o("bento-form", e),
 	...t
 }));
-X.displayName = "Form";
+Me.displayName = "Form";
 //#endregion
 //#region src/components/ui/Input.tsx
-var Z = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ p(le, {
+var G = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ d(fe, {
 		ref: i,
 		id: n,
 		className: o("bento-input", t),
 		...r
 	});
-	return e ? /* @__PURE__ */ m("div", {
+	return e ? /* @__PURE__ */ f("div", {
 		className: "bento-field",
-		children: [/* @__PURE__ */ p("label", {
+		children: [/* @__PURE__ */ d("label", {
 			className: "bento-field-label",
 			htmlFor: n,
 			children: e
 		}), a]
 	}) : a;
 });
-Z.displayName = "Input";
-var De = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ p("textarea", {
+G.displayName = "Input";
+var Ne = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ d("textarea", {
 		ref: i,
 		id: n,
 		className: o("bento-textarea", t),
 		...r
 	});
-	return e ? /* @__PURE__ */ m("div", {
+	return e ? /* @__PURE__ */ f("div", {
 		className: "bento-field",
-		children: [/* @__PURE__ */ p("label", {
+		children: [/* @__PURE__ */ d("label", {
 			className: "bento-field-label",
 			htmlFor: n,
 			children: e
 		}), a]
 	}) : a;
 });
-De.displayName = "Textarea";
+Ne.displayName = "Textarea";
 //#endregion
 //#region src/components/ui/Menu.tsx
-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, {
+function Pe({ trigger: e, items: t, className: n }) {
+	return /* @__PURE__ */ f(C.Root, { children: [/* @__PURE__ */ d(C.Trigger, { render: e }), /* @__PURE__ */ d(C.Portal, { children: /* @__PURE__ */ d(C.Positioner, {
 		className: "bento-menu-positioner",
 		sideOffset: 8,
-		children: /* @__PURE__ */ p(E.Popup, {
+		children: /* @__PURE__ */ d(C.Popup, {
 			className: o("bento-menu-popup", n),
-			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ p(E.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ m(E.Item, {
+			children: t.map((e, t) => e === "separator" ? /* @__PURE__ */ d(C.Separator, { className: "bento-menu-separator" }, t) : /* @__PURE__ */ f(C.Item, {
 				className: "bento-menu-item",
 				disabled: e.disabled,
 				onClick: e.onClick,
@@ -427,18 +427,18 @@ function Oe({ trigger: e, items: t, className: n }) {
 }
 //#endregion
 //#region src/components/ui/Menubar.tsx
-function ke({ menus: e, className: t }) {
-	return /* @__PURE__ */ p(ue, {
+function Fe({ menus: e, className: t }) {
+	return /* @__PURE__ */ d(pe, {
 		className: o("bento-menubar", t),
-		children: e.map((e) => /* @__PURE__ */ m(D.Root, { children: [/* @__PURE__ */ p(D.Trigger, {
+		children: e.map((e) => /* @__PURE__ */ f(w.Root, { children: [/* @__PURE__ */ d(w.Trigger, {
 			className: "bento-menubar-trigger",
 			children: e.label
-		}), /* @__PURE__ */ p(D.Portal, { children: /* @__PURE__ */ p(D.Positioner, {
+		}), /* @__PURE__ */ d(w.Portal, { children: /* @__PURE__ */ d(w.Positioner, {
 			className: "bento-menu-positioner",
 			sideOffset: 8,
-			children: /* @__PURE__ */ p(D.Popup, {
+			children: /* @__PURE__ */ d(w.Popup, {
 				className: "bento-menu-popup",
-				children: e.items.map((e) => /* @__PURE__ */ m(D.Item, {
+				children: e.items.map((e) => /* @__PURE__ */ f(w.Item, {
 					className: "bento-menu-item",
 					disabled: e.disabled,
 					children: [e.icon, e.label]
@@ -449,54 +449,54 @@ function ke({ menus: e, className: t }) {
 }
 //#endregion
 //#region src/components/ui/Meter.tsx
-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", {
+var K = 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", {
 		className: o("bento-meter", a),
-		children: [r && /* @__PURE__ */ m("div", {
+		children: [r && /* @__PURE__ */ f("div", {
 			className: "bento-meter-label",
-			children: [/* @__PURE__ */ p("span", { children: s["aria-label"] ?? "Meter" }), /* @__PURE__ */ m("span", {
+			children: [/* @__PURE__ */ d("span", { children: s["aria-label"] ?? "Meter" }), /* @__PURE__ */ f("span", {
 				className: "bento-meter-value",
 				children: [Math.round(l), "%"]
 			})]
-		}), /* @__PURE__ */ p(O.Root, {
+		}), /* @__PURE__ */ d(T.Root, {
 			ref: c,
 			value: e,
 			min: t,
 			max: n,
 			...s,
-			children: /* @__PURE__ */ p(O.Track, {
+			children: /* @__PURE__ */ d(T.Track, {
 				className: "bento-meter-track",
-				children: /* @__PURE__ */ p(O.Indicator, { className: o("bento-meter-indicator", u) })
+				children: /* @__PURE__ */ d(T.Indicator, { className: o("bento-meter-indicator", ee) })
 			})
 		})]
 	});
 });
-Ae.displayName = "Meter";
+K.displayName = "Meter";
 //#endregion
 //#region src/components/ui/NavigationMenu.tsx
-function je({ items: e, className: t }) {
-	return /* @__PURE__ */ p(k.Root, {
+function Ie({ items: e, className: t }) {
+	return /* @__PURE__ */ d(E.Root, {
 		className: o("bento-nav-menu", t),
-		children: /* @__PURE__ */ p(k.List, {
+		children: /* @__PURE__ */ d(E.List, {
 			className: "bento-nav-menu-list",
-			children: e.map((e, t) => e.children ? /* @__PURE__ */ m(k.Item, { children: [/* @__PURE__ */ m(k.Trigger, {
+			children: e.map((e, t) => e.children ? /* @__PURE__ */ f(E.Item, { children: [/* @__PURE__ */ f(E.Trigger, {
 				className: "bento-nav-menu-trigger",
-				children: [e.label, /* @__PURE__ */ p(l, { size: 14 })]
-			}), /* @__PURE__ */ p(k.Portal, { children: /* @__PURE__ */ p(k.Positioner, {
+				children: [e.label, /* @__PURE__ */ d(l, { size: 14 })]
+			}), /* @__PURE__ */ d(E.Portal, { children: /* @__PURE__ */ d(E.Positioner, {
 				sideOffset: 8,
-				children: /* @__PURE__ */ p(k.Popup, {
+				children: /* @__PURE__ */ d(E.Popup, {
 					className: "bento-nav-menu-popup",
-					children: e.children.map((e, t) => /* @__PURE__ */ p(k.Item, {
+					children: e.children.map((e, t) => /* @__PURE__ */ d(E.Item, {
 						className: "bento-nav-menu-item",
-						render: /* @__PURE__ */ p("a", { href: e.href }),
+						render: /* @__PURE__ */ d("a", { href: e.href }),
 						children: e.label
 					}, t))
 				})
-			}) })] }, t) : /* @__PURE__ */ p(k.Item, { children: /* @__PURE__ */ p(k.Link, {
+			}) })] }, t) : /* @__PURE__ */ d(E.Item, { children: /* @__PURE__ */ d(E.Link, {
 				className: "bento-nav-menu-trigger",
 				href: e.href,
-				render: /* @__PURE__ */ p("a", { href: e.href }),
+				render: /* @__PURE__ */ d("a", { href: e.href }),
 				children: e.label
 			}) }, t))
 		})
@@ -504,26 +504,26 @@ function je({ items: e, className: t }) {
 }
 //#endregion
 //#region src/components/ui/NumberField.tsx
-function Me({ label: e, className: t, ...n }) {
-	return /* @__PURE__ */ m(A.Root, {
+function Le({ label: e, className: t, ...n }) {
+	return /* @__PURE__ */ f(D.Root, {
 		className: o("bento-number-field", t),
 		...n,
-		children: [e && /* @__PURE__ */ p("label", {
+		children: [e && /* @__PURE__ */ d("label", {
 			className: "field-label",
 			children: e
-		}), /* @__PURE__ */ m(A.Group, {
+		}), /* @__PURE__ */ f(D.Group, {
 			className: "bento-number-field-group",
 			children: [
-				/* @__PURE__ */ p(A.Decrement, {
+				/* @__PURE__ */ d(D.Decrement, {
 					className: "bento-number-field-button",
 					"aria-label": "Decrease",
-					children: /* @__PURE__ */ p(te, { size: 14 })
+					children: /* @__PURE__ */ d(ne, { size: 14 })
 				}),
-				/* @__PURE__ */ p(A.Input, { className: "bento-number-field-input" }),
-				/* @__PURE__ */ p(A.Increment, {
+				/* @__PURE__ */ d(D.Input, { className: "bento-number-field-input" }),
+				/* @__PURE__ */ d(D.Increment, {
 					className: "bento-number-field-button",
 					"aria-label": "Increase",
-					children: /* @__PURE__ */ p(ne, { size: 14 })
+					children: /* @__PURE__ */ d(re, { size: 14 })
 				})
 			]
 		})]
@@ -531,34 +531,34 @@ function Me({ label: e, className: t, ...n }) {
 }
 //#endregion
 //#region src/components/ui/OtpField.tsx
-function Ne({ length: e = 6, label: t, className: n, ...r }) {
-	return /* @__PURE__ */ m(j.Root, {
+function Re({ length: e = 6, label: t, className: n, ...r }) {
+	return /* @__PURE__ */ f(me.Root, {
 		className: o("bento-otp-field", n),
 		length: e,
 		...r,
-		children: [t && /* @__PURE__ */ p("label", {
+		children: [t && /* @__PURE__ */ d("label", {
 			className: "field-label",
 			children: t
-		}), /* @__PURE__ */ p("div", {
+		}), /* @__PURE__ */ d("div", {
 			className: "bento-otp-inputs",
-			children: Array.from({ length: e }, (e, t) => /* @__PURE__ */ p(j.Input, { className: "bento-otp-input" }, t))
+			children: Array.from({ length: e }, (e, t) => /* @__PURE__ */ d(me.Input, { className: "bento-otp-input" }, t))
 		})]
 	});
 }
 //#endregion
 //#region src/components/ui/Popover.tsx
-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, {
+function ze({ trigger: e, title: t, description: n, children: r, className: i }) {
+	return /* @__PURE__ */ f(O.Root, { children: [/* @__PURE__ */ d(O.Trigger, { render: e }), /* @__PURE__ */ d(O.Portal, { children: /* @__PURE__ */ d(O.Positioner, {
 		sideOffset: 10,
-		children: /* @__PURE__ */ m(M.Popup, {
+		children: /* @__PURE__ */ f(O.Popup, {
 			className: o("bento-popover-popup", i),
 			children: [
-				/* @__PURE__ */ p(M.Arrow, { className: "bento-popover-arrow" }),
-				t && /* @__PURE__ */ p(M.Title, {
+				/* @__PURE__ */ d(O.Arrow, { className: "bento-popover-arrow" }),
+				t && /* @__PURE__ */ d(O.Title, {
 					className: "bento-popover-title",
 					children: t
 				}),
-				n && /* @__PURE__ */ p(M.Description, {
+				n && /* @__PURE__ */ d(O.Description, {
 					className: "bento-popover-description",
 					children: n
 				}),
@@ -569,22 +569,22 @@ function Pe({ trigger: e, title: t, description: n, children: r, className: i })
 }
 //#endregion
 //#region src/components/ui/PreviewCard.tsx
-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, {
+function Be({ trigger: e, title: t, description: n, imageUrl: r, imageAlt: i, className: a }) {
+	return /* @__PURE__ */ f(k.Root, { children: [/* @__PURE__ */ d(k.Trigger, { render: e }), /* @__PURE__ */ d(k.Portal, { children: /* @__PURE__ */ d(k.Positioner, {
 		sideOffset: 10,
-		children: /* @__PURE__ */ m(N.Popup, {
+		children: /* @__PURE__ */ f(k.Popup, {
 			className: o("bento-preview-card", a),
 			children: [
-				/* @__PURE__ */ p(N.Arrow, { className: "bento-preview-card-arrow" }),
-				r && /* @__PURE__ */ p("img", {
+				/* @__PURE__ */ d(k.Arrow, { className: "bento-preview-card-arrow" }),
+				r && /* @__PURE__ */ d("img", {
 					src: r,
 					alt: i ?? ""
 				}),
-				/* @__PURE__ */ p("h3", {
+				/* @__PURE__ */ d("h3", {
 					className: "bento-preview-card-title",
 					children: t
 				}),
-				n && /* @__PURE__ */ p("p", {
+				n && /* @__PURE__ */ d("p", {
 					className: "bento-preview-card-description",
 					children: n
 				})
@@ -594,101 +594,101 @@ function Fe({ trigger: e, title: t, description: n, imageUrl: r, imageAlt: i, cl
 }
 //#endregion
 //#region src/components/ui/Progress.tsx
-var Ie = t(({ value: e, showValue: t, className: n, ...r }, i) => /* @__PURE__ */ m("div", {
+var q = t(({ value: e, showValue: t, className: n, ...r }, i) => /* @__PURE__ */ f("div", {
 	className: o("bento-progress", n),
-	children: [t && /* @__PURE__ */ m("div", {
+	children: [t && /* @__PURE__ */ f("div", {
 		className: "bento-progress-label",
-		children: [/* @__PURE__ */ p("span", { children: r["aria-label"] ?? "Progress" }), /* @__PURE__ */ m("span", {
+		children: [/* @__PURE__ */ d("span", { children: r["aria-label"] ?? "Progress" }), /* @__PURE__ */ f("span", {
 			className: "bento-progress-value",
 			children: [e ?? 0, "%"]
 		})]
-	}), /* @__PURE__ */ p(P.Root, {
+	}), /* @__PURE__ */ d(A.Root, {
 		ref: i,
 		value: e,
 		...r,
-		children: /* @__PURE__ */ p(P.Track, {
+		children: /* @__PURE__ */ d(A.Track, {
 			className: "bento-progress-track",
-			children: /* @__PURE__ */ p(P.Indicator, { className: "bento-progress-indicator" })
+			children: /* @__PURE__ */ d(A.Indicator, { className: "bento-progress-indicator" })
 		})
 	})]
 }));
-Ie.displayName = "Progress";
+q.displayName = "Progress";
 //#endregion
 //#region src/components/ui/Radio.tsx
-function Le({ label: e, className: t, ...n }) {
-	let r = /* @__PURE__ */ p(F.Root, {
+function Ve({ label: e, className: t, ...n }) {
+	let r = /* @__PURE__ */ d(he.Root, {
 		className: o("bento-radio", t),
 		...n,
-		children: /* @__PURE__ */ p(F.Indicator, { className: "bento-radio-indicator" })
+		children: /* @__PURE__ */ d(he.Indicator, { className: "bento-radio-indicator" })
 	});
-	return e ? /* @__PURE__ */ m("label", {
+	return e ? /* @__PURE__ */ f("label", {
 		className: "bento-radio-label",
 		children: [r, e]
 	}) : r;
 }
 //#endregion
 //#region src/components/ui/RadioGroup.tsx
-function Re({ options: e, defaultValue: t, className: n, ...r }) {
-	return /* @__PURE__ */ p(de, {
+function He({ options: e, defaultValue: t, className: n, ...r }) {
+	return /* @__PURE__ */ d(_e, {
 		defaultValue: t,
 		className: o("bento-radio-group", n),
 		...r,
-		children: e.map((e) => /* @__PURE__ */ m("label", {
+		children: e.map((e) => /* @__PURE__ */ f("label", {
 			className: "bento-radio-label",
-			children: [/* @__PURE__ */ p(I.Root, {
+			children: [/* @__PURE__ */ d(ge.Root, {
 				className: "bento-radio",
 				value: e.value,
-				children: /* @__PURE__ */ p(I.Indicator, { className: "bento-radio-indicator" })
+				children: /* @__PURE__ */ d(ge.Indicator, { className: "bento-radio-indicator" })
 			}), e.label]
 		}, e.value))
 	});
 }
 //#endregion
 //#region src/components/ui/ScrollArea.tsx
-var ze = t(({ className: e, children: t, ...n }, r) => /* @__PURE__ */ m(L.Root, {
+var Ue = t(({ className: e, children: t, ...n }, r) => /* @__PURE__ */ f(j.Root, {
 	ref: r,
 	className: o("bento-scroll-area", e),
 	...n,
 	children: [
-		/* @__PURE__ */ p(L.Viewport, {
+		/* @__PURE__ */ d(j.Viewport, {
 			className: "bento-scroll-area-viewport",
 			children: t
 		}),
-		/* @__PURE__ */ p(L.Scrollbar, {
+		/* @__PURE__ */ d(j.Scrollbar, {
 			className: "bento-scroll-area-scrollbar",
-			children: /* @__PURE__ */ p(L.Thumb, { className: "bento-scroll-area-thumb" })
+			children: /* @__PURE__ */ d(j.Thumb, { className: "bento-scroll-area-thumb" })
 		}),
-		/* @__PURE__ */ p(L.Corner, { className: "bento-scroll-area-corner" })
+		/* @__PURE__ */ d(j.Corner, { className: "bento-scroll-area-corner" })
 	]
 }));
-ze.displayName = "ScrollArea";
+Ue.displayName = "ScrollArea";
 //#endregion
 //#region src/components/ui/Select.tsx
-function Be({ items: e, label: t, placeholder: n, defaultValue: r, ...i }) {
-	return /* @__PURE__ */ m(R.Root, {
+function J({ items: e, label: t, placeholder: n, defaultValue: r, ...i }) {
+	return /* @__PURE__ */ f(M.Root, {
 		defaultValue: r,
 		items: e,
 		...i,
 		children: [
-			t && /* @__PURE__ */ p("label", {
+			t && /* @__PURE__ */ d("label", {
 				className: "field-label",
 				htmlFor: i.id,
 				children: t
 			}),
-			/* @__PURE__ */ m(R.Trigger, {
+			/* @__PURE__ */ f(M.Trigger, {
 				id: i.id,
 				className: "bento-select-trigger",
-				children: [/* @__PURE__ */ p(R.Value, { placeholder: n }), /* @__PURE__ */ p(R.Icon, { children: /* @__PURE__ */ p(l, { size: 16 }) })]
+				children: [/* @__PURE__ */ d(M.Value, { placeholder: n }), /* @__PURE__ */ d(M.Icon, { children: /* @__PURE__ */ d(l, { size: 16 }) })]
 			}),
-			/* @__PURE__ */ p(R.Portal, { children: /* @__PURE__ */ p(R.Positioner, {
+			/* @__PURE__ */ d(M.Portal, { children: /* @__PURE__ */ d(M.Positioner, {
 				className: "bento-select-positioner",
 				sideOffset: 8,
-				children: /* @__PURE__ */ p(R.Popup, {
+				children: /* @__PURE__ */ d(M.Popup, {
 					className: o("bento-select-popup"),
-					children: Object.entries(e).map(([e, t]) => /* @__PURE__ */ m(R.Item, {
+					children: Object.entries(e).map(([e, t]) => /* @__PURE__ */ f(M.Item, {
 						className: "bento-select-item",
 						value: e,
-						children: [/* @__PURE__ */ p(R.ItemIndicator, { children: /* @__PURE__ */ p(c, { size: 15 }) }), /* @__PURE__ */ p(R.ItemText, { children: t })]
+						children: [/* @__PURE__ */ d(M.ItemIndicator, { children: /* @__PURE__ */ d(c, { size: 15 }) }), /* @__PURE__ */ d(M.ItemText, { children: t })]
 					}, e))
 				})
 			}) })
@@ -697,107 +697,107 @@ function Be({ items: e, label: t, placeholder: n, defaultValue: r, ...i }) {
 }
 //#endregion
 //#region src/components/ui/Separator.tsx
-var Ve = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(fe, {
+var Y = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(ve, {
 	ref: n,
 	className: o("bento-separator", e),
 	...t
 }));
-Ve.displayName = "Separator";
+Y.displayName = "Separator";
 //#endregion
 //#region src/components/ui/Slider.tsx
-var He = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(z.Root, {
+var We = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(N.Root, {
 	ref: n,
 	className: o("bento-slider", e),
 	...t,
-	children: /* @__PURE__ */ p(z.Control, {
+	children: /* @__PURE__ */ d(N.Control, {
 		className: "bento-slider-control",
-		children: /* @__PURE__ */ m(z.Track, {
+		children: /* @__PURE__ */ f(N.Track, {
 			className: "bento-slider-track",
-			children: [/* @__PURE__ */ p(z.Indicator, { className: "bento-slider-indicator" }), /* @__PURE__ */ p(z.Thumb, { className: "bento-slider-thumb" })]
+			children: [/* @__PURE__ */ d(N.Indicator, { className: "bento-slider-indicator" }), /* @__PURE__ */ d(N.Thumb, { className: "bento-slider-thumb" })]
 		})
 	})
 }));
-He.displayName = "Slider";
+We.displayName = "Slider";
 //#endregion
 //#region src/components/ui/Switch.tsx
-var Ue = t(({ label: e, className: t, id: n, ...r }, i) => {
-	let a = /* @__PURE__ */ p(B.Root, {
+var X = t(({ label: e, className: t, id: n, ...r }, i) => {
+	let a = /* @__PURE__ */ d(ye.Root, {
 		ref: i,
 		id: n,
 		className: o("bento-switch", t),
 		...r,
-		children: /* @__PURE__ */ p(B.Thumb, { className: "bento-switch-thumb" })
+		children: /* @__PURE__ */ d(ye.Thumb, { className: "bento-switch-thumb" })
 	});
-	return e ? /* @__PURE__ */ m("label", {
+	return e ? /* @__PURE__ */ f("label", {
 		className: "bento-switch-label",
 		htmlFor: n,
 		children: [a, e]
 	}) : a;
 });
-Ue.displayName = "Switch";
+X.displayName = "Switch";
 //#endregion
 //#region src/components/ui/Tabs.tsx
-function We({ panels: e, defaultValue: t, className: n, ...r }) {
-	return /* @__PURE__ */ m(V.Root, {
+function Ge({ panels: e, defaultValue: t, className: n, ...r }) {
+	return /* @__PURE__ */ f(P.Root, {
 		defaultValue: t ?? e[0]?.value,
 		className: o("bento-tabs", n),
 		...r,
-		children: [/* @__PURE__ */ m(V.List, {
+		children: [/* @__PURE__ */ f(P.List, {
 			className: o("bento-tabs-list", `cols-${e.length}`),
-			children: [e.map((e) => /* @__PURE__ */ p(V.Tab, {
+			children: [e.map((e) => /* @__PURE__ */ d(P.Tab, {
 				className: "bento-tabs-tab",
 				value: e.value,
 				children: e.label
-			}, e.value)), /* @__PURE__ */ p(V.Indicator, { className: "bento-tabs-indicator" })]
-		}), e.map((e) => /* @__PURE__ */ m(V.Panel, {
+			}, e.value)), /* @__PURE__ */ d(P.Indicator, { className: "bento-tabs-indicator" })]
+		}), e.map((e) => /* @__PURE__ */ f(P.Panel, {
 			className: "bento-tabs-panel",
 			value: e.value,
-			children: [e.title && /* @__PURE__ */ p("strong", {
+			children: [e.title && /* @__PURE__ */ d("strong", {
 				className: "bento-tabs-panel-title",
 				children: e.title
-			}), /* @__PURE__ */ p("p", { children: e.content })]
+			}), /* @__PURE__ */ d("p", { children: e.content })]
 		}, e.value))]
 	});
 }
 //#endregion
 //#region src/components/ui/Toggle.tsx
-var Ge = t(({ className: e, ...t }, n) => /* @__PURE__ */ p(H, {
+var Ke = t(({ className: e, ...t }, n) => /* @__PURE__ */ d(be, {
 	ref: n,
 	className: o("bento-toggle", e),
 	...t
 }));
-Ge.displayName = "Toggle";
+Ke.displayName = "Toggle";
 //#endregion
 //#region src/components/ui/Toast.tsx
-function Ke() {
-	let { toasts: e } = U.useToastManager();
-	return e.length === 0 ? null : /* @__PURE__ */ p("div", {
+function qe() {
+	let { toasts: e } = F.useToastManager();
+	return e.length === 0 ? null : /* @__PURE__ */ d("div", {
 		className: "bento-toast-provider",
-		children: e.map((e) => /* @__PURE__ */ m(U.Root, {
+		children: e.map((e) => /* @__PURE__ */ f(F.Root, {
 			className: "bento-toast",
 			toast: e,
-			children: [/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p(U.Title, {
+			children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d(F.Title, {
 				className: "bento-toast-title",
 				children: e.title
-			}), e.description && /* @__PURE__ */ p(U.Description, {
+			}), e.description && /* @__PURE__ */ d(F.Description, {
 				className: "bento-toast-description",
 				children: e.description
-			})] }), /* @__PURE__ */ p(U.Close, {
+			})] }), /* @__PURE__ */ d(F.Close, {
 				className: "bento-toast-close",
 				"aria-label": "Dismiss",
-				render: /* @__PURE__ */ p("button", { type: "button" }),
-				children: /* @__PURE__ */ p(f, { size: 15 })
+				render: /* @__PURE__ */ d("button", { type: "button" }),
+				children: /* @__PURE__ */ d(u, { size: 15 })
 			})]
 		}, e.id))
 	});
 }
-function qe({ children: e }) {
-	return /* @__PURE__ */ m(U.Provider, { children: [e, /* @__PURE__ */ p(Ke, {})] });
+function Je({ children: e }) {
+	return /* @__PURE__ */ f(F.Provider, { children: [e, /* @__PURE__ */ d(qe, {})] });
 }
 //#endregion
 //#region src/components/ui/useToastManager.ts
-function Je() {
-	let e = U.useToastManager();
+function Ye() {
+	let e = F.useToastManager();
 	return {
 		add: (t, n) => e.add({
 			title: t,
@@ -808,12 +808,12 @@ function Je() {
 }
 //#endregion
 //#region src/components/ui/ToggleGroup.tsx
-function Ye({ options: e, defaultValue: t, className: n, ...r }) {
-	return /* @__PURE__ */ p(pe, {
+function Xe({ options: e, defaultValue: t, className: n, ...r }) {
+	return /* @__PURE__ */ d(xe, {
 		defaultValue: t,
 		className: o("bento-toggle-group", n),
 		...r,
-		children: e.map((e) => /* @__PURE__ */ p(H, {
+		children: e.map((e) => /* @__PURE__ */ d(be, {
 			className: "bento-toggle",
 			value: e.value,
 			children: e.label
@@ -822,42 +822,42 @@ function Ye({ options: e, defaultValue: t, className: n, ...r }) {
 }
 //#endregion
 //#region src/components/ui/Toolbar.tsx
-function Xe({ className: e, showSearch: t = !0, ...n }) {
-	return /* @__PURE__ */ m(W.Root, {
+function Ze({ className: e, showSearch: t = !0, ...n }) {
+	return /* @__PURE__ */ f(I.Root, {
 		className: o("bento-toolbar", e),
 		...n,
-		children: [/* @__PURE__ */ m(W.Group, {
+		children: [/* @__PURE__ */ f(I.Group, {
 			className: "bento-toolbar-group",
 			children: [
-				/* @__PURE__ */ p(Ze, {
+				/* @__PURE__ */ d(Qe, {
 					"aria-label": "Bold",
-					children: /* @__PURE__ */ p(s, { size: 15 })
+					children: /* @__PURE__ */ d(s, { size: 15 })
 				}),
-				/* @__PURE__ */ p(Ze, {
+				/* @__PURE__ */ d(Qe, {
 					"aria-label": "Italic",
-					children: /* @__PURE__ */ p(u, { size: 15 })
+					children: /* @__PURE__ */ d(ee, { size: 15 })
 				}),
-				/* @__PURE__ */ p(W.Separator, { className: "bento-toolbar-separator" }),
-				/* @__PURE__ */ p(W.Link, {
+				/* @__PURE__ */ d(I.Separator, { className: "bento-toolbar-separator" }),
+				/* @__PURE__ */ d(I.Link, {
 					className: "bento-toolbar-button",
 					href: "https://base-ui.com",
 					target: "_blank",
 					rel: "noreferrer",
 					"aria-label": "Base UI docs",
-					children: /* @__PURE__ */ p(ee, { size: 15 })
+					children: /* @__PURE__ */ d(te, { size: 15 })
 				})
 			]
-		}), t && /* @__PURE__ */ m("div", {
+		}), t && /* @__PURE__ */ f("div", {
 			className: "bento-toolbar-search",
-			children: [/* @__PURE__ */ p(d, { size: 14 }), /* @__PURE__ */ p(W.Input, {
+			children: [/* @__PURE__ */ d(ie, { size: 14 }), /* @__PURE__ */ d(I.Input, {
 				className: "bento-toolbar-input",
 				placeholder: "Search docs"
 			})]
 		})]
 	});
 }
-function Ze({ children: e, ...t }) {
-	return /* @__PURE__ */ p(W.Button, {
+function Qe({ children: e, ...t }) {
+	return /* @__PURE__ */ d(I.Button, {
 		className: "bento-toolbar-button",
 		...t,
 		children: e
@@ -865,19 +865,570 @@ function Ze({ children: e, ...t }) {
 }
 //#endregion
 //#region src/components/ui/Tooltip.tsx
-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, {
+function $e({ content: e, children: t, className: n }) {
+	return /* @__PURE__ */ f(L.Root, { children: [/* @__PURE__ */ d(L.Trigger, { render: t }), /* @__PURE__ */ d(L.Portal, { children: /* @__PURE__ */ d(L.Positioner, {
 		sideOffset: 8,
-		children: /* @__PURE__ */ m(G.Popup, {
+		children: /* @__PURE__ */ f(L.Popup, {
 			className: o("bento-tooltip-popup", n),
-			children: [e, /* @__PURE__ */ p(G.Arrow, { className: "bento-tooltip-arrow" })]
+			children: [e, /* @__PURE__ */ d(L.Arrow, { className: "bento-tooltip-arrow" })]
 		})
 	}) })] });
 }
-Qe.Provider = G.Provider;
+$e.Provider = L.Provider;
 //#endregion
-//#region src/hooks/useTheme.ts
-var $e = new Set([
+//#region src/blocks/AuthCard.tsx
+function et() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Authentication card block",
+		children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+			className: "base-block-title",
+			children: "Sign in to workspace"
+		}), /* @__PURE__ */ d("p", {
+			className: "base-block-copy",
+			children: "A focused authentication card with remembered-device controls."
+		})] }), /* @__PURE__ */ f("div", {
+			className: "base-block-form",
+			children: [
+				/* @__PURE__ */ d(U, {
+					label: "Email",
+					children: /* @__PURE__ */ d(G, {
+						id: "block-auth-email",
+						type: "email",
+						placeholder: "you@example.com"
+					})
+				}),
+				/* @__PURE__ */ d(U, {
+					label: "Password",
+					children: /* @__PURE__ */ d(G, {
+						id: "block-auth-password",
+						type: "password",
+						placeholder: "Enter password"
+					})
+				}),
+				/* @__PURE__ */ d(X, {
+					id: "block-auth-remember",
+					label: "Remember this device"
+				}),
+				/* @__PURE__ */ d(B, {
+					type: "button",
+					children: "Continue"
+				}),
+				/* @__PURE__ */ d(Y, {}),
+				/* @__PURE__ */ d(B, {
+					type: "button",
+					variant: "outline",
+					children: "Continue with SSO"
+				})
+			]
+		})]
+	});
+}
+//#endregion
+//#region src/blocks/CommandPaletteBlock.tsx
+var Z = [
+	{
+		value: "create-theme",
+		label: "Create theme"
+	},
+	{
+		value: "open-registry",
+		label: "Open registry"
+	},
+	{
+		value: "view-components",
+		label: "View components"
+	}
+];
+function tt() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Command palette block",
+		children: [
+			/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+				className: "base-block-title",
+				children: "Command Palette"
+			}), /* @__PURE__ */ d("p", {
+				className: "base-block-copy",
+				children: "A quick-action panel for product navigation, search, and agent-oriented commands."
+			})] }),
+			/* @__PURE__ */ d(H, {
+				label: "Jump to",
+				placeholder: "Search commands...",
+				options: Z
+			}),
+			/* @__PURE__ */ d("div", {
+				className: "base-block-list",
+				children: Z.map((e) => /* @__PURE__ */ f("div", {
+					className: "base-block-list-item",
+					children: [/* @__PURE__ */ f("div", {
+						className: "base-block-list-main",
+						children: [/* @__PURE__ */ d("strong", { children: e.label }), /* @__PURE__ */ d("span", { children: e.value })]
+					}), /* @__PURE__ */ d(B, {
+						type: "button",
+						variant: "ghost",
+						children: "Run"
+					})]
+				}, e.value))
+			})
+		]
+	});
+}
+//#endregion
+//#region src/blocks/DashboardShell.tsx
+var nt = [
+	{
+		label: "Revenue",
+		value: "$48.2k"
+	},
+	{
+		label: "Active seats",
+		value: "1,248"
+	},
+	{
+		label: "Deploys",
+		value: "36"
+	}
+];
+function rt() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Dashboard shell block",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "base-block-header",
+				children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+					className: "base-block-title",
+					children: "Operations Dashboard"
+				}), /* @__PURE__ */ d("p", {
+					className: "base-block-copy",
+					children: "A compact dashboard header with metrics, progress, and a primary action."
+				})] }), /* @__PURE__ */ d(B, {
+					variant: "outline",
+					children: "Export"
+				})]
+			}),
+			/* @__PURE__ */ d("div", {
+				className: "base-block-grid",
+				children: nt.map((e) => /* @__PURE__ */ f("div", {
+					className: "base-block-stat",
+					children: [/* @__PURE__ */ d("strong", { children: e.value }), /* @__PURE__ */ d("span", { children: e.label })]
+				}, e.label))
+			}),
+			/* @__PURE__ */ d("div", {
+				className: "base-block-panel",
+				children: /* @__PURE__ */ d(q, {
+					value: 72,
+					showValue: !0,
+					"aria-label": "Quarterly target"
+				})
+			}),
+			/* @__PURE__ */ d(K, {
+				value: 84,
+				showValue: !0,
+				"aria-label": "System health"
+			})
+		]
+	});
+}
+//#endregion
+//#region src/blocks/DataTableBlock.tsx
+var it = {
+	all: "All statuses",
+	active: "Active",
+	pending: "Pending"
+}, at = [
+	{
+		project: "Checkout refresh",
+		owner: "Ava",
+		status: "Active"
+	},
+	{
+		project: "Theme QA",
+		owner: "Mina",
+		status: "Pending"
+	},
+	{
+		project: "Registry docs",
+		owner: "Noah",
+		status: "Active"
+	}
+];
+function ot() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Data table block",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "base-block-header",
+				children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+					className: "base-block-title",
+					children: "Projects"
+				}), /* @__PURE__ */ d("p", {
+					className: "base-block-copy",
+					children: "A small operational table with filters and row status badges."
+				})] }), /* @__PURE__ */ d(J, {
+					id: "block-project-status",
+					defaultValue: "all",
+					items: it
+				})]
+			}),
+			/* @__PURE__ */ f("table", {
+				className: "base-block-table",
+				children: [/* @__PURE__ */ d("thead", { children: /* @__PURE__ */ f("tr", { children: [
+					/* @__PURE__ */ d("th", { children: "Project" }),
+					/* @__PURE__ */ d("th", { children: "Owner" }),
+					/* @__PURE__ */ d("th", { children: "Status" })
+				] }) }), /* @__PURE__ */ d("tbody", { children: at.map((e) => /* @__PURE__ */ f("tr", { children: [
+					/* @__PURE__ */ d("td", { children: e.project }),
+					/* @__PURE__ */ d("td", { children: e.owner }),
+					/* @__PURE__ */ d("td", { children: /* @__PURE__ */ d("span", {
+						className: "base-block-pill",
+						children: e.status
+					}) })
+				] }, e.project)) })]
+			}),
+			/* @__PURE__ */ d(B, {
+				type: "button",
+				variant: "outline",
+				children: "View all projects"
+			})
+		]
+	});
+}
+//#endregion
+//#region src/blocks/PricingPanel.tsx
+var st = [
+	"Unlimited themes",
+	"Registry metadata",
+	"Agent workflow docs"
+];
+function ct() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Pricing panel block",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "base-block-split",
+				children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+					className: "base-block-title",
+					children: "Team plan"
+				}), /* @__PURE__ */ d("p", {
+					className: "base-block-copy",
+					children: "A compact pricing panel for SaaS settings, upgrade, or billing screens."
+				})] }), /* @__PURE__ */ f("div", {
+					className: "base-block-price",
+					children: ["$29", /* @__PURE__ */ d("span", { children: "/seat" })]
+				})]
+			}),
+			/* @__PURE__ */ d("div", {
+				className: "base-block-list",
+				children: st.map((e) => /* @__PURE__ */ f("div", {
+					className: "base-block-list-item",
+					children: [/* @__PURE__ */ d(V, {
+						defaultChecked: !0,
+						"aria-label": e
+					}), /* @__PURE__ */ d("div", {
+						className: "base-block-list-main",
+						children: /* @__PURE__ */ d("strong", { children: e })
+					})]
+				}, e))
+			}),
+			/* @__PURE__ */ d(B, {
+				type: "button",
+				children: "Upgrade plan"
+			})
+		]
+	});
+}
+//#endregion
+//#region src/blocks/SettingsForm.tsx
+var lt = {
+	compact: "Compact",
+	comfortable: "Comfortable",
+	spacious: "Spacious"
+};
+function ut() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Settings form block",
+		children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+			className: "base-block-title",
+			children: "Workspace Settings"
+		}), /* @__PURE__ */ d("p", {
+			className: "base-block-copy",
+			children: "A production-style settings form for team preferences and workspace defaults."
+		})] }), /* @__PURE__ */ d(W, {
+			legend: "Workspace",
+			children: /* @__PURE__ */ f("div", {
+				className: "base-block-form",
+				children: [
+					/* @__PURE__ */ d(U, {
+						label: "Workspace name",
+						description: "Visible to invited team members.",
+						children: /* @__PURE__ */ d(G, {
+							id: "block-workspace-name",
+							defaultValue: "Product Operations"
+						})
+					}),
+					/* @__PURE__ */ d(J, {
+						id: "block-density",
+						label: "Interface density",
+						defaultValue: "comfortable",
+						items: lt
+					}),
+					/* @__PURE__ */ d(X, {
+						id: "block-weekly-summary",
+						defaultChecked: !0,
+						label: "Send weekly summary"
+					}),
+					/* @__PURE__ */ f("div", {
+						className: "base-block-actions",
+						children: [/* @__PURE__ */ d(B, {
+							type: "button",
+							children: "Save settings"
+						}), /* @__PURE__ */ d(B, {
+							type: "button",
+							variant: "outline",
+							children: "Cancel"
+						})]
+					})
+				]
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/blocks/TeamActivityFeed.tsx
+var dt = [
+	{
+		title: "Published enterprise theme",
+		meta: "Mina, 12m ago"
+	},
+	{
+		title: "Reviewed registry copy plan",
+		meta: "Ava, 34m ago"
+	},
+	{
+		title: "Updated dashboard block",
+		meta: "Noah, 1h ago"
+	}
+];
+function ft() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Team activity feed block",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "base-block-header",
+				children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+					className: "base-block-title",
+					children: "Team Activity"
+				}), /* @__PURE__ */ d("p", {
+					className: "base-block-copy",
+					children: "A feed block for recent workspace changes and collaboration status."
+				})] }), /* @__PURE__ */ f(z, { children: [
+					/* @__PURE__ */ d(R, {
+						fallback: "AV",
+						size: "sm"
+					}),
+					/* @__PURE__ */ d(R, {
+						fallback: "MN",
+						size: "sm"
+					}),
+					/* @__PURE__ */ d(R, {
+						fallback: "NH",
+						size: "sm"
+					})
+				] })]
+			}),
+			/* @__PURE__ */ d("div", {
+				className: "base-block-list",
+				children: dt.map((e) => /* @__PURE__ */ d("div", {
+					className: "base-block-list-item",
+					children: /* @__PURE__ */ f("div", {
+						className: "base-block-list-main",
+						children: [/* @__PURE__ */ d("strong", { children: e.title }), /* @__PURE__ */ d("span", { children: e.meta })]
+					})
+				}, e.title))
+			}),
+			/* @__PURE__ */ d(B, {
+				type: "button",
+				variant: "outline",
+				children: "Open activity"
+			})
+		]
+	});
+}
+//#endregion
+//#region src/blocks/ThemeShowcaseCard.tsx
+var pt = [{
+	value: "tokens",
+	label: "Tokens",
+	title: "CSS variable contract",
+	content: "Theme styles use shared semantic tokens for surfaces, text, focus, and controls."
+}, {
+	value: "registry",
+	label: "Registry",
+	title: "Copy-ready metadata",
+	content: "Components and blocks can be resolved from registry metadata for agent workflows."
+}];
+function mt() {
+	return /* @__PURE__ */ f("section", {
+		className: "base-block",
+		"aria-label": "Theme showcase block",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "base-block-header",
+				children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
+					className: "base-block-title",
+					children: "Theme Showcase"
+				}), /* @__PURE__ */ d("p", {
+					className: "base-block-copy",
+					children: "A compact block for explaining theme value on landing or docs pages."
+				})] }), /* @__PURE__ */ d("span", {
+					className: "base-block-pill",
+					children: "20 styles"
+				})]
+			}),
+			/* @__PURE__ */ d("div", {
+				className: "base-block-grid",
+				"aria-label": "Theme swatches",
+				children: [
+					"--bt-bg",
+					"--bt-surface",
+					"--bt-primary",
+					"--bt-secondary"
+				].map((e) => /* @__PURE__ */ f("div", {
+					className: "base-block-stat",
+					children: [/* @__PURE__ */ d("span", {
+						className: "base-block-muted",
+						children: e
+					}), /* @__PURE__ */ d("span", { style: {
+						display: "block",
+						height: 24,
+						marginTop: 8,
+						border: "1px solid var(--bt-border)",
+						borderRadius: "var(--bt-radius-sm)",
+						background: `var(${e})`
+					} })]
+				}, e))
+			}),
+			/* @__PURE__ */ d(Ge, {
+				panels: pt,
+				defaultValue: "tokens"
+			}),
+			/* @__PURE__ */ d(B, {
+				type: "button",
+				children: "Open themes"
+			})
+		]
+	});
+}
+//#endregion
+//#region src/docs/themeMeta.json
+var ht = [
+	{
+		style: "bento",
+		label: "Bento",
+		description: "Warm modular product cards with soft depth and teal controls."
+	},
+	{
+		style: "shadcn",
+		label: "Shadcn",
+		description: "Neutral zinc interface styling modeled after shadcn/ui."
+	},
+	{
+		style: "neo-brutalism",
+		label: "Neo Brutalism",
+		description: "Hard borders, loud accents, and offset block shadows."
+	},
+	{
+		style: "minimal",
+		label: "Minimal",
+		description: "Swiss-inspired whitespace, thin rules, and quiet monochrome controls."
+	},
+	{
+		style: "enterprise",
+		label: "Enterprise",
+		description: "Dense operational UI with blue actions and explicit boundaries."
+	},
+	{
+		style: "linear",
+		label: "Linear",
+		description: "Developer-tool polish with subtle gradients and refined dark mode."
+	},
+	{
+		style: "glass",
+		label: "Glass",
+		description: "Translucent surfaces, blur, and luminous focus states."
+	},
+	{
+		style: "terminal",
+		label: "Terminal",
+		description: "Monospace command-line interface with phosphor green command surfaces."
+	},
+	{
+		style: "material",
+		label: "Material",
+		description: "Layered Google-style surfaces with blue primary actions and soft elevation."
+	},
+	{
+		style: "fluent",
+		label: "Fluent",
+		description: "Microsoft-style acrylic surfaces, soft blue accents, and gentle borders."
+	},
+	{
+		style: "retro",
+		label: "Retro",
+		description: "Early desktop UI cues with chunky controls and saturated classic colors."
+	},
+	{
+		style: "cyberpunk",
+		label: "Cyberpunk",
+		description: "Dark high-energy neon controls for expressive dashboards."
+	},
+	{
+		style: "editorial",
+		label: "Editorial",
+		description: "Magazine-like typography, ivory surfaces, and ink-forward contrast."
+	},
+	{
+		style: "calm",
+		label: "Calm",
+		description: "Low-saturation wellness palette with relaxed controls and readable contrast."
+	},
+	{
+		style: "data-dense",
+		label: "Data Dense",
+		description: "Compact analytics styling for tables, filters, and repeated workflows."
+	},
+	{
+		style: "playful",
+		label: "Playful",
+		description: "Rounded, bright, friendly components for creative and education tools."
+	},
+	{
+		style: "luxury",
+		label: "Luxury",
+		description: "Dark premium surfaces, gold accents, and fine-line hierarchy."
+	},
+	{
+		style: "soft-ui",
+		label: "Soft UI",
+		description: "Low-contrast tactile controls with inset and raised shadows."
+	},
+	{
+		style: "bauhaus",
+		label: "Bauhaus",
+		description: "Geometric composition with primary colors and strong graphic contrast."
+	},
+	{
+		style: "mono",
+		label: "Mono",
+		description: "Black-and-white ink system with no decorative color dependency."
+	}
+], gt = [
 	"bento",
 	"shadcn",
 	"neo-brutalism",
@@ -898,20 +1449,24 @@ var $e = new Set([
 	"soft-ui",
 	"bauhaus",
 	"mono"
-]);
-function et() {
+], _t = ht;
+Object.fromEntries(_t.map((e) => [e.style, e.label])), Object.fromEntries(_t.map((e) => [e.style, e.description]));
+//#endregion
+//#region src/hooks/useTheme.ts
+var vt = new Set(gt);
+function yt() {
 	if (typeof window > "u") return "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() {
+function bt() {
 	if (typeof window > "u") return "bento";
 	let e = new URLSearchParams(window.location.search).get("style");
-	if (e && $e.has(e)) return e;
+	if (e && vt.has(e)) return e;
 	let t = localStorage.getItem("bento-style");
-	return t && $e.has(t) ? t : "bento";
+	return t && vt.has(t) ? t : "bento";
 }
 function Q(e) {
 	return e === "system" ? typeof window > "u" ? "light" : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : e;
@@ -919,17 +1474,17 @@ function Q(e) {
 function $(e) {
 	document.documentElement.setAttribute("data-theme", e);
 }
-function nt(e) {
+function xt(e) {
 	document.documentElement.setAttribute("data-style", e);
 }
-function rt() {
-	let [e, t] = a(et), [i, o] = a(tt), s = n((e) => {
+function St() {
+	let [e, t] = a(yt), [i, o] = a(bt), s = n((e) => {
 		t(e), localStorage.setItem("bento-theme", e), $(Q(e));
 	}, []), c = n((e) => {
-		o(e), localStorage.setItem("bento-style", e), nt(e);
+		o(e), localStorage.setItem("bento-style", e), xt(e);
 	}, []);
 	return r(() => {
-		if ($(Q(e)), nt(i), e !== "system") return;
+		if ($(Q(e)), xt(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]), {
@@ -941,4 +1496,4 @@ function rt() {
 	};
 }
 //#endregion
-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 };
+export { Se as Accordion, Ce as AlertDialog, et as AuthCard, we as Autocomplete, R as Avatar, z as AvatarGroup, B as Button, V as Checkbox, Te as CheckboxGroup, Ee as Collapsible, H as Combobox, tt as CommandPaletteBlock, De as ContextMenu, Oe as CspProvider, rt as DashboardShell, ot as DataTableBlock, ke as Dialog, Ae as DirectionProvider, je as Drawer, U as Field, W as Fieldset, Me as Form, G as Input, Pe as Menu, Fe as Menubar, K as Meter, Ie as NavigationMenu, Le as NumberField, Re as OtpField, ze as Popover, Be as PreviewCard, ct as PricingPanel, q as Progress, Ve as Radio, He as RadioGroup, Ue as ScrollArea, J as Select, Y as Separator, ut as SettingsForm, We as Slider, X as Switch, Ge as Tabs, ft as TeamActivityFeed, Ne as Textarea, mt as ThemeShowcaseCard, Je as ToastProvider, Ke as Toggle, Xe as ToggleGroup, Ze as Toolbar, $e as Tooltip, le as useDirection, St as useTheme, Ye as useToastManager };