@viglet/viglet-design-system 2026.3.10 → 2026.3.11

package/dist/bento.es.js

@@ -1,50 +1,57 @@
 "use client";
 import { t as e } from "./utils-Fk5jmzzb.js";
-import { A as t, D as n, E as r, F as i, M as a, _ as o, a as s, f as c, g as l, h as u, i as d, k as f, l as p, m, o as h, s as g, u as _, x as v } from "./badge-locale-Du41PpLA.js";
-import { l as y, n as b, o as x, r as S, s as C, u as w } from "./user.context-CPmUBBLa.js";
-import { i as T, t as E } from "./loading-provider-E3fbcekM.js";
-import { Children as D, createContext as O, isValidElement as k, useContext as A, useEffect as j, useMemo as M, useRef as N, useState as P, useSyncExternalStore as ee } from "react";
-import { Fragment as F, jsx as I, jsxs as L } from "react/jsx-runtime";
-import { useTranslation as R } from "react-i18next";
-import { IconAdjustmentsHorizontal as z, IconAlertTriangle as te, IconArrowBackUp as B, IconArrowLeft as ne, IconArrowRight as re, IconArrowUp as ie, IconBuildingCommunity as ae, IconBuildingSkyscraper as oe, IconChevronRight as V, IconDeviceFloppy as H, IconDotsVertical as se, IconExternalLink as ce, IconGripVertical as le, IconHome as ue, IconKeyboard as de, IconLayoutGrid as fe, IconLogout as pe, IconPalette as me, IconPlus as he, IconSearch as ge, IconSparkles as U, IconTrash as _e, IconUserCircle as ve, IconUsers as ye, IconX as W } from "@tabler/icons-react";
-import { Icon as G } from "@iconify/react";
-import { Link as K, useLocation as be, useNavigate as q } from "react-router-dom";
-import { DndContext as xe, KeyboardSensor as Se, PointerSensor as Ce, closestCenter as we, useSensor as Te, useSensors as Ee } from "@dnd-kit/core";
-import { SortableContext as De, arrayMove as Oe, rectSortingStrategy as ke, useSortable as Ae } from "@dnd-kit/sortable";
-import { CSS as je } from "@dnd-kit/utilities";
+import { a as t, c as n, d as r, g as i, o as a, p as o, u as s } from "./badge-locale-DxDp8Q3S.js";
+import { A as c, C as l, D as u, E as d, L as f, M as p, O as m, R as h, S as g, T as _, _ as v, a as y, c as b, d as x, f as S, h as C, i as w, j as T, l as E, n as D, p as O, r as k, u as A, w as j, x as M, z as N } from "./user.context-Cr3GAQ_r.js";
+import { r as ee, t as te } from "./loading-provider-ClDkFPuv.js";
+import { Children as P, Fragment as ne, isValidElement as re, useEffect as F, useId as I, useMemo as L, useRef as R, useState as z, useSyncExternalStore as ie } from "react";
+import { Fragment as B, jsx as V, jsxs as H } from "react/jsx-runtime";
+import { useTranslation as U } from "react-i18next";
+import { IconAdjustmentsHorizontal as ae, IconAlertTriangle as oe, IconArrowBackUp as W, IconArrowDown as se, IconArrowLeft as ce, IconArrowRight as le, IconArrowUp as ue, IconArrowsSort as de, IconBuildingCommunity as fe, IconBuildingSkyscraper as G, IconChevronDown as pe, IconChevronRight as K, IconColumns3 as me, IconDeviceFloppy as he, IconDotsVertical as q, IconExternalLink as J, IconGripVertical as ge, IconHome as _e, IconKeyboard as Y, IconLayoutGrid as ve, IconLogout as ye, IconPalette as be, IconPlus as xe, IconRobot as X, IconSearch as Se, IconSparkles as Ce, IconTrash as we, IconUser as Te, IconUserCircle as Ee, IconUsers as De, IconX as Oe } from "@tabler/icons-react";
+import { Icon as ke } from "@iconify/react";
+import { Link as Z, useInRouterContext as Ae, useLocation as je, useNavigate as Me } from "react-router-dom";
+import { createCoreRowModel as Ne, createSortedRowModel as Pe, rowSortingFeature as Fe, useTable as Ie } from "@tanstack/react-table";
+import { DndContext as Le, KeyboardSensor as Re, PointerSensor as ze, closestCenter as Be, useSensor as Ve, useSensors as He } from "@dnd-kit/core";
+import { SortableContext as Ue, arrayMove as We, rectSortingStrategy as Ge, useSortable as Ke } from "@dnd-kit/sortable";
+import { CSS as qe } from "@dnd-kit/utilities";
 //#region src/bento/bento-actions-menu.tsx
-var Me = {
+var Je = {
 	default: "",
 	destructive: "bento-item-danger"
-};
-function Ne({ actions: e, triggerLabel: t }) {
-	let { t: n } = R();
-	return e.length === 0 ? null : /* @__PURE__ */ L(c, { children: [/* @__PURE__ */ I(r, {
+}, Ye = /* @__PURE__ */ new Set();
+function Xe(e) {
+	process.env.NODE_ENV === "production" || Ye.has(e) || (Ye.add(e), console.warn(`BentoActionsMenu: the action "${e}" has no id. Give it a stable name, such as "post.delete": it is rendered as data-action-id so a console verb can be matched to an agent verb, and it becomes required in the next release.`));
+}
+function Ze({ actions: e, triggerLabel: t }) {
+	let { t: n } = U();
+	if (e.length === 0) return null;
+	for (let t of e) t.id || Xe(t.label);
+	return /* @__PURE__ */ H(l, { children: [/* @__PURE__ */ V(f, {
 		asChild: !0,
-		children: /* @__PURE__ */ I("button", {
+		children: /* @__PURE__ */ V("button", {
 			type: "button",
 			"aria-label": t ?? n("forms.formActions.moreActions", { defaultValue: "More actions" }),
 			className: "bento-tile-clickable inline-flex h-9 w-9 items-center justify-center rounded-full border border-border/60 bg-card/60 text-muted-foreground backdrop-blur transition-colors duration-200 hover:text-foreground",
-			children: /* @__PURE__ */ I(se, { size: 18 })
+			children: /* @__PURE__ */ V(q, { size: 18 })
 		})
-	}), /* @__PURE__ */ I(m, {
+	}), /* @__PURE__ */ V(_, {
 		align: "end",
 		sideOffset: 8,
 		className: "bento-dropdown min-w-44 p-1.5",
 		children: e.map((e) => {
-			let t = e.icon, n = Me[e.tone ?? "default"];
-			return /* @__PURE__ */ L(l, {
+			let t = e.icon, n = Je[e.tone ?? "default"];
+			return /* @__PURE__ */ H(u, {
+				"data-action-id": e.id,
 				onSelect: e.onSelect,
 				disabled: e.disabled,
 				className: `bento-dropdown-item cursor-pointer gap-2 px-3 py-2 ${n}`,
-				children: [/* @__PURE__ */ I(t, { size: 16 }), e.label]
-			}, e.label);
+				children: [/* @__PURE__ */ V(t, { size: 16 }), e.label]
+			}, e.id ?? e.label);
 		})
 	})] });
 }
 //#endregion
 //#region src/bento/bento-tones.ts
-var J = {
+var Qe = {
 	blue: "bento-tone-blue",
 	indigo: "bento-tone-indigo",
 	violet: "bento-tone-violet",
@@ -52,53 +59,388 @@ var J = {
 	amber: "bento-tone-amber",
 	rose: "bento-tone-rose",
 	slate: "bento-tone-slate"
-}, Pe = Object.keys(J);
-function Y(e) {
-	return `bento-chip ${J[e] ?? J.slate}`;
+}, $e = Object.keys(Qe);
+function Q(e) {
+	return `bento-chip ${Qe[e] ?? Qe.slate}`;
 }
 //#endregion
 //#region src/bento/bento-count-tile.tsx
-function Fe({ to: e, icon: t, tone: n, label: r, count: i, span: a }) {
-	let o = /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I("span", {
-		className: `grid h-9 w-9 place-items-center rounded-2xl text-white shadow-md ${Y(n)}`,
-		children: /* @__PURE__ */ I(t, { size: 18 })
-	}), /* @__PURE__ */ L("div", { children: [/* @__PURE__ */ I("div", {
+function et({ to: e, icon: t, tone: n, label: r, count: i, span: a }) {
+	let o = /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V("span", {
+		className: `grid h-9 w-9 place-items-center rounded-2xl text-white shadow-md ${Q(n)}`,
+		children: /* @__PURE__ */ V(t, { size: 18 })
+	}), /* @__PURE__ */ H("div", { children: [/* @__PURE__ */ V("div", {
 		className: "text-3xl font-semibold tabular-nums tracking-tight",
 		children: i
-	}), /* @__PURE__ */ I("div", {
+	}), /* @__PURE__ */ V("div", {
 		className: "text-[11px] uppercase tracking-wider text-muted-foreground",
 		children: r
 	})] })] }), s = `bento-tile bento-glass group relative flex flex-col justify-between overflow-hidden p-4 ${a}${e ? " bento-tile-clickable" : ""}`;
-	return e ? /* @__PURE__ */ I(K, {
+	return e ? /* @__PURE__ */ V(Z, {
 		to: e,
 		className: s,
 		children: o
-	}) : /* @__PURE__ */ I("div", {
+	}) : /* @__PURE__ */ V("div", {
 		className: s,
 		children: o
 	});
 }
 //#endregion
+//#region src/bento/bento-data-table.tsx
+var tt = 6, nt = {
+	rowSortingFeature: Fe,
+	coreRowModel: Ne(),
+	sortedRowModel: Pe()
+};
+function rt({ rows: t, getRowId: n, columns: r, label: i, getRowLabel: a, rowActions: o, selectionActions: s, onSelectionChange: c, selectionScope: u, layout: d, onLayoutChange: p, onRowOpen: m, rowHeight: g = 44, height: v = 480, empty: y }) {
+	let { t: b } = U(), [x, S] = z([]), [C, w] = z({ hidden: [] }), [T, E] = z(/* @__PURE__ */ new Set()), [D, O] = z(null), [k, A] = z(u);
+	k !== u && (A(u), E(/* @__PURE__ */ new Set()), O(null));
+	let M = R(u);
+	F(() => {
+		M.current !== u && (M.current = u, c?.([]));
+	}, [u, c]);
+	let [ee, te] = z(0), [P, ne] = z(0), re = R(null), I = R(/* @__PURE__ */ new Map()), ie = R(!1), B = (s?.length ?? 0) > 0, ae = (e) => a?.(e) ?? n(e), oe = L(() => r.map((e) => ({
+		id: e.id,
+		accessorFn: (t) => e.sortValue?.(t) ?? null,
+		enableSorting: e.sortValue !== void 0
+	})), [r]), W = Ie({
+		features: nt,
+		data: t,
+		columns: oe,
+		state: { sorting: x },
+		onSortingChange: S
+	}).getRowModel().rows.map((e) => e.original), ce = d ?? C, le = r.filter((e) => e.hideable === !1 || !ce.hidden.includes(e.id)), fe = [
+		B ? "2.75rem" : null,
+		...le.map((e) => e.width ?? "minmax(8rem, 1fr)"),
+		o?.length ? "3.25rem" : null
+	].filter(Boolean).join(" "), G = W.length, pe = Math.max(1, Math.floor(v / g)), K = Math.max(0, Math.floor(P / g) - tt), he = Math.min(G, Math.ceil((P + v) / g) + tt), q = Math.min(ee, Math.max(0, G - 1));
+	F(() => {
+		ie.current && (ie.current = !1, I.current.get(q)?.focus());
+	}, [q, K]);
+	function J(e) {
+		E(e), c?.([...e]);
+	}
+	function ge(e, t) {
+		let [r, i] = e <= t ? [e, t] : [t, e];
+		J(new Set(W.slice(r, i + 1).map(n)));
+	}
+	function _e(e) {
+		let t = n(W[e]), r = new Set(T);
+		r.has(t) ? r.delete(t) : r.add(t), J(r), O(e);
+	}
+	function Y(e, t) {
+		let n = Math.max(0, Math.min(G - 1, e));
+		if (t && B) {
+			let e = D ?? q;
+			O(e), ge(e, n);
+		}
+		let r = re.current, i = n * g;
+		if (r) {
+			let e = r.scrollTop;
+			i < e ? e = i : i + g > e + v && (e = i + g - v), e !== r.scrollTop && (r.scrollTop = e, ne(e));
+		}
+		ie.current = !0, te(n);
+	}
+	function ve(e, t) {
+		if (e.target !== e.currentTarget) return;
+		let r = e.shiftKey;
+		switch (e.key) {
+			case "ArrowDown":
+				Y(t + 1, r);
+				break;
+			case "ArrowUp":
+				Y(t - 1, r);
+				break;
+			case "PageDown":
+				Y(t + pe, r);
+				break;
+			case "PageUp":
+				Y(t - pe, r);
+				break;
+			case "Home":
+				Y(0, r);
+				break;
+			case "End":
+				Y(G - 1, r);
+				break;
+			case " ":
+				if (!B) return;
+				_e(t);
+				break;
+			case "Enter":
+				if (!m) return;
+				m(W[t]);
+				break;
+			case "Escape":
+				if (!B || T.size === 0) return;
+				J(/* @__PURE__ */ new Set()), O(null);
+				break;
+			case "a":
+			case "A":
+				if (!B || !(e.ctrlKey || e.metaKey)) return;
+				J(new Set(W.map(n)));
+				break;
+			default: return;
+		}
+		e.preventDefault();
+	}
+	function ye(e, t) {
+		if (!e.target.closest("button, a, input, [role='checkbox']") && (te(t), B)) {
+			if (e.shiftKey) {
+				let e = D ?? q;
+				O(e), ge(e, t);
+			} else e.metaKey || e.ctrlKey ? _e(t) : (J(/* @__PURE__ */ new Set([n(W[t])])), O(t));
+		}
+	}
+	function be(e) {
+		let t = x.find((t) => t.id === e);
+		t ? t.desc ? S([]) : S([{
+			id: e,
+			desc: !0
+		}]) : S([{
+			id: e,
+			desc: !1
+		}]);
+	}
+	function xe(e, t) {
+		let n = { hidden: t ? [...ce.hidden, e] : ce.hidden.filter((t) => t !== e) };
+		d === void 0 && w(n), p?.(n);
+	}
+	let X = W.filter((e) => T.has(n(e))), Se = G > 0 && X.length === G, Ce = r.filter((e) => e.hideable !== !1);
+	return /* @__PURE__ */ H("div", {
+		"data-slot": "bento-data-table",
+		className: "bento-glass overflow-hidden rounded-2xl",
+		children: [/* @__PURE__ */ H("div", {
+			className: "flex min-h-12 flex-wrap items-center gap-2 border-b border-border/50 px-3 py-2",
+			children: [
+				/* @__PURE__ */ V("span", {
+					"aria-live": "polite",
+					className: "text-sm font-medium",
+					children: X.length > 0 ? b("bento.table.selected", {
+						defaultValue: "{{count}} selected",
+						count: X.length
+					}) : ""
+				}),
+				X.length > 0 && /* @__PURE__ */ H("div", {
+					role: "toolbar",
+					"aria-label": b("bento.table.selectionActions", { defaultValue: "Actions on the selection" }),
+					className: "flex flex-wrap items-center gap-2",
+					children: [s?.map((t) => {
+						let n = t.icon;
+						return /* @__PURE__ */ H(N, {
+							variant: "outline",
+							size: "sm",
+							className: e("gap-1.5", t.tone === "destructive" && "bento-item-danger"),
+							onClick: () => t.onSelect(X),
+							children: [/* @__PURE__ */ V(n, { size: 16 }), t.label]
+						}, t.id);
+					}), /* @__PURE__ */ V(N, {
+						variant: "ghost",
+						size: "sm",
+						onClick: () => J(/* @__PURE__ */ new Set()),
+						children: b("bento.table.clearSelection", { defaultValue: "Clear selection" })
+					})]
+				}),
+				Ce.length > 0 && /* @__PURE__ */ H(l, { children: [/* @__PURE__ */ V(f, {
+					asChild: !0,
+					children: /* @__PURE__ */ H(N, {
+						variant: "ghost",
+						size: "sm",
+						className: "ml-auto gap-1.5",
+						children: [/* @__PURE__ */ V(me, {
+							size: 16,
+							"aria-hidden": "true"
+						}), b("bento.table.columns", { defaultValue: "Columns" })]
+					})
+				}), /* @__PURE__ */ V(_, {
+					align: "end",
+					className: "bento-dropdown min-w-44 p-1.5",
+					children: Ce.map((e) => /* @__PURE__ */ V(j, {
+						checked: !ce.hidden.includes(e.id),
+						onCheckedChange: (t) => xe(e.id, t !== !0),
+						onSelect: (e) => e.preventDefault(),
+						children: e.header
+					}, e.id))
+				})] })
+			]
+		}), /* @__PURE__ */ H("div", {
+			role: "grid",
+			"aria-label": i,
+			"aria-rowcount": G + 1,
+			"aria-colcount": le.length + +!!B + +!!o?.length,
+			"aria-multiselectable": B ? "true" : void 0,
+			children: [/* @__PURE__ */ V("div", {
+				role: "rowgroup",
+				children: /* @__PURE__ */ H("div", {
+					role: "row",
+					"aria-rowindex": 1,
+					className: "grid items-center border-b border-border/50 px-1 text-xs font-medium text-muted-foreground",
+					style: {
+						gridTemplateColumns: fe,
+						minHeight: g
+					},
+					children: [
+						B && /* @__PURE__ */ V("div", {
+							role: "columnheader",
+							className: "grid place-items-center",
+							children: /* @__PURE__ */ V(h, {
+								"aria-label": b("bento.table.selectAll", { defaultValue: "Select all rows" }),
+								checked: Se ? !0 : X.length > 0 && "indeterminate",
+								onCheckedChange: () => J(Se ? /* @__PURE__ */ new Set() : new Set(W.map(n)))
+							})
+						}),
+						le.map((e) => {
+							let t = x.find((t) => t.id === e.id), n = t ? t.desc ? "descending" : "ascending" : "none";
+							return /* @__PURE__ */ V("div", {
+								role: "columnheader",
+								"aria-sort": e.sortValue ? n : void 0,
+								className: "min-w-0 px-2",
+								children: e.sortValue ? /* @__PURE__ */ H("button", {
+									type: "button",
+									onClick: () => be(e.id),
+									className: "inline-flex max-w-full items-center gap-1 rounded-md py-1 hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring",
+									children: [
+										/* @__PURE__ */ V("span", {
+											className: "truncate",
+											children: e.header
+										}),
+										n === "ascending" && /* @__PURE__ */ V(ue, {
+											size: 14,
+											"aria-hidden": "true"
+										}),
+										n === "descending" && /* @__PURE__ */ V(se, {
+											size: 14,
+											"aria-hidden": "true"
+										}),
+										n === "none" && /* @__PURE__ */ V(de, {
+											size: 14,
+											"aria-hidden": "true",
+											className: "opacity-40"
+										})
+									]
+								}) : /* @__PURE__ */ V("span", {
+									className: "block truncate py-1",
+									children: e.header
+								})
+							}, e.id);
+						}),
+						o?.length ? /* @__PURE__ */ V("div", {
+							role: "columnheader",
+							className: "px-2",
+							children: /* @__PURE__ */ V("span", {
+								className: "sr-only",
+								children: b("bento.table.actions", { defaultValue: "Actions" })
+							})
+						}) : null
+					]
+				})
+			}), G === 0 ? /* @__PURE__ */ V("div", {
+				role: "rowgroup",
+				children: /* @__PURE__ */ V("div", {
+					role: "row",
+					"aria-rowindex": 2,
+					children: /* @__PURE__ */ V("div", {
+						role: "gridcell",
+						className: "px-4 py-10 text-center text-sm text-muted-foreground",
+						children: y ?? b("bento.table.empty", { defaultValue: "Nothing to show" })
+					})
+				})
+			}) : /* @__PURE__ */ V("div", {
+				role: "rowgroup",
+				ref: re,
+				onScroll: (e) => ne(e.currentTarget.scrollTop),
+				className: "relative overflow-y-auto",
+				style: { height: v },
+				children: /* @__PURE__ */ V("div", {
+					style: { height: G * g },
+					className: "relative",
+					children: W.slice(K, he).map((t, r) => {
+						let i = K + r, a = n(t), s = T.has(a), c = ae(t);
+						return /* @__PURE__ */ H("div", {
+							ref: (e) => {
+								e ? I.current.set(i, e) : I.current.delete(i);
+							},
+							role: "row",
+							"aria-rowindex": i + 2,
+							"aria-selected": B ? s ? "true" : "false" : void 0,
+							tabIndex: i === q ? 0 : -1,
+							onKeyDown: (e) => ve(e, i),
+							onClick: (e) => ye(e, i),
+							onDoubleClick: () => m?.(t),
+							onFocus: (e) => {
+								e.target === e.currentTarget && te(i);
+							},
+							className: e("absolute inset-x-0 grid items-center border-b border-border/30 px-1 text-sm outline-none transition-colors", "hover:bg-muted/40 focus-visible:bg-muted/60 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring", s && "bg-primary/10 hover:bg-primary/15"),
+							style: {
+								top: i * g,
+								height: g,
+								gridTemplateColumns: fe
+							},
+							children: [
+								B && /* @__PURE__ */ V("div", {
+									role: "gridcell",
+									className: "grid place-items-center",
+									children: /* @__PURE__ */ V(h, {
+										tabIndex: -1,
+										"aria-label": b("bento.table.selectRow", {
+											defaultValue: "Select {{row}}",
+											row: c
+										}),
+										checked: s,
+										onCheckedChange: () => _e(i)
+									})
+								}),
+								le.map((e) => /* @__PURE__ */ V("div", {
+									role: "gridcell",
+									className: "min-w-0 truncate px-2",
+									children: e.cell(t)
+								}, e.id)),
+								o?.length ? /* @__PURE__ */ V("div", {
+									role: "gridcell",
+									className: "grid place-items-center",
+									children: /* @__PURE__ */ V(Ze, {
+										triggerLabel: b("bento.table.rowActions", {
+											defaultValue: "Actions for {{row}}",
+											row: c
+										}),
+										actions: o.map((e) => ({
+											id: e.id,
+											label: e.label,
+											icon: e.icon,
+											tone: e.tone,
+											onSelect: () => e.onSelect([t])
+										}))
+									})
+								}) : null
+							]
+						}, a);
+					})
+				})
+			})]
+		})]
+	});
+}
+//#endregion
 //#region src/bento/bento-empty-state.tsx
-function Ie({ icon: t = U, tone: n = "indigo", title: r, description: i, action: a, align: o = "center", className: s }) {
-	let c = Y(n), l = o === "center";
-	return /* @__PURE__ */ L("div", {
-		className: e("bento-tile bento-glass flex flex-col gap-3 rounded-3xl p-8", l ? "items-center text-center" : "items-start text-left", s),
+function it({ icon: t = Ce, tone: n = "indigo", title: r, description: i, action: a, align: o = "center", titleLevel: s = 2, className: c }) {
+	let l = Q(n), u = o === "center", d = `h${s}`;
+	return /* @__PURE__ */ H("div", {
+		className: e("bento-tile bento-glass flex flex-col gap-3 rounded-3xl p-8", u ? "items-center text-center" : "items-start text-left", c),
 		children: [
-			/* @__PURE__ */ I("span", {
-				className: `grid h-12 w-12 place-items-center rounded-2xl ${c} text-white shadow-md`,
-				children: /* @__PURE__ */ I(t, { size: 24 })
+			/* @__PURE__ */ V("span", {
+				className: `grid h-12 w-12 place-items-center rounded-2xl ${l} text-white shadow-md`,
+				children: /* @__PURE__ */ V(t, { size: 24 })
 			}),
-			/* @__PURE__ */ I("div", {
-				className: "text-lg font-semibold tracking-tight",
+			/* @__PURE__ */ V(d, {
+				className: "m-0 text-lg font-semibold tracking-tight",
 				children: r
 			}),
-			i && /* @__PURE__ */ I("p", {
-				className: e("max-w-md text-sm text-muted-foreground", l && "mx-auto"),
+			i && /* @__PURE__ */ V("p", {
+				className: e("max-w-md text-sm text-muted-foreground", u && "mx-auto"),
 				children: i
 			}),
-			a && /* @__PURE__ */ I("div", {
-				className: e("mt-1", l && "mx-auto"),
+			a && /* @__PURE__ */ V("div", {
+				className: e("mt-1", u && "mx-auto"),
 				children: a
 			})
 		]
@@ -106,48 +448,48 @@ function Ie({ icon: t = U, tone: n = "indigo", title: r, description: i, action:
 }
 //#endregion
 //#region src/bento/bento-hero.tsx
-function X({ to: e, children: t }) {
-	return /* @__PURE__ */ L(K, {
+function at({ to: e, children: t }) {
+	return /* @__PURE__ */ H(Z, {
 		to: e,
 		className: "inline-flex items-center gap-1 hover:text-foreground",
-		children: [/* @__PURE__ */ I(ne, {
+		children: [/* @__PURE__ */ V(ce, {
 			size: 14,
 			"aria-hidden": !0
 		}), t]
 	});
 }
-function Z({ eyebrow: e, backTo: t, backLabel: n, title: r, subtitle: i, leading: a, trailing: o }) {
-	let s = e ?? (t == null ? null : /* @__PURE__ */ I(X, {
+function ot({ eyebrow: e, backTo: t, backLabel: n, title: r, subtitle: i, leading: a, trailing: o }) {
+	let s = e ?? (t == null ? null : /* @__PURE__ */ V(at, {
 		to: t,
 		children: n
 	}));
-	return /* @__PURE__ */ I("header", {
+	return /* @__PURE__ */ V("header", {
 		className: "bento-shell-header mb-6 flex flex-col items-start gap-3 md:mb-10",
-		children: /* @__PURE__ */ L("div", {
+		children: /* @__PURE__ */ H("div", {
 			className: "flex w-full items-start gap-4",
 			children: [
-				a && /* @__PURE__ */ I("div", {
+				a && /* @__PURE__ */ V("div", {
 					className: "shrink-0",
 					children: a
 				}),
-				/* @__PURE__ */ L("div", {
+				/* @__PURE__ */ H("div", {
 					className: "flex flex-1 flex-col gap-1",
 					children: [
-						s && /* @__PURE__ */ I("span", {
+						s && /* @__PURE__ */ V("span", {
 							className: "text-xs uppercase tracking-[0.18em] text-muted-foreground",
 							children: s
 						}),
-						/* @__PURE__ */ I("h1", {
+						/* @__PURE__ */ V("h1", {
 							className: "text-3xl font-semibold tracking-tight md:text-4xl",
 							children: r
 						}),
-						i && /* @__PURE__ */ I("p", {
+						i && /* @__PURE__ */ V("p", {
 							className: "max-w-2xl text-sm text-muted-foreground",
 							children: i
 						})
 					]
 				}),
-				o && /* @__PURE__ */ I("div", {
+				o && /* @__PURE__ */ V("div", {
 					className: "ml-auto flex shrink-0 items-center gap-2",
 					children: o
 				})
@@ -157,31 +499,31 @@ function Z({ eyebrow: e, backTo: t, backLabel: n, title: r, subtitle: i, leading
 }
 //#endregion
 //#region src/bento/bento-hero-icon-picker.tsx
-function Le({ value: e, onChange: t, onClear: n, defaultIcon: r, tone: i, title: a, description: o, readOnly: s = !1 }) {
-	let { t: c } = R(), [l, u] = P(!1);
-	return s ? /* @__PURE__ */ I("span", {
-		className: `grid h-12 w-12 place-items-center rounded-2xl ${Y(i)} text-white shadow-md`,
-		children: e ? /* @__PURE__ */ I(G, {
+function st({ value: e, onChange: t, onClear: n, defaultIcon: r, tone: i, title: a, description: o, readOnly: s = !1 }) {
+	let { t: c } = U(), [l, u] = z(!1);
+	return s ? /* @__PURE__ */ V("span", {
+		className: `grid h-12 w-12 place-items-center rounded-2xl ${Q(i)} text-white shadow-md`,
+		children: e ? /* @__PURE__ */ V(ke, {
 			icon: e,
 			className: "size-6 text-white"
-		}) : /* @__PURE__ */ I(r, { size: 24 })
-	}) : /* @__PURE__ */ L("div", {
+		}) : /* @__PURE__ */ V(r, { size: 24 })
+	}) : /* @__PURE__ */ H("div", {
 		className: "group relative",
 		children: [
-			/* @__PURE__ */ L("button", {
+			/* @__PURE__ */ H("button", {
 				type: "button",
 				onClick: () => u(!0),
 				"aria-label": c("forms.iconPicker.chooseAnIcon"),
-				className: `group/icon relative grid h-12 w-12 cursor-pointer place-items-center overflow-hidden rounded-2xl ${Y(i)} text-white shadow-md outline-none transition-all duration-300 ease-[cubic-bezier(0.32,0.72,0,1)] hover:scale-105 focus-visible:ring-2 focus-visible:ring-ring active:scale-95`,
-				children: [e ? /* @__PURE__ */ I(G, {
+				className: `group/icon relative grid h-12 w-12 cursor-pointer place-items-center overflow-hidden rounded-2xl ${Q(i)} text-white shadow-md outline-none transition-all duration-300 ease-[cubic-bezier(0.32,0.72,0,1)] hover:scale-105 focus-visible:ring-2 focus-visible:ring-ring active:scale-95`,
+				children: [e ? /* @__PURE__ */ V(ke, {
 					icon: e,
 					className: "size-6 text-white"
-				}) : /* @__PURE__ */ I(r, { size: 24 }), /* @__PURE__ */ I("span", {
+				}) : /* @__PURE__ */ V(r, { size: 24 }), /* @__PURE__ */ V("span", {
 					className: "pointer-events-none absolute inset-0 grid place-items-center bg-black/40 opacity-0 transition-opacity duration-200 group-hover/icon:opacity-100",
-					children: /* @__PURE__ */ I(me, { className: "size-5 text-white" })
+					children: /* @__PURE__ */ V(be, { className: "size-5 text-white" })
 				})]
 			}),
-			e && n && /* @__PURE__ */ I("button", {
+			e && n && /* @__PURE__ */ V("button", {
 				type: "button",
 				onClick: (e) => {
 					e.stopPropagation(), n();
@@ -189,9 +531,9 @@ function Le({ value: e, onChange: t, onClear: n, defaultIcon: r, tone: i, title:
 				"aria-label": c("forms.common.remove"),
 				title: c("forms.common.remove"),
 				className: "absolute -right-1.5 -top-1.5 grid h-5 w-5 cursor-pointer place-items-center rounded-full border border-border/60 bg-card/90 text-foreground opacity-0 shadow-md backdrop-blur transition-opacity duration-200 bento-clear focus-visible:opacity-100 group-hover:opacity-100",
-				children: /* @__PURE__ */ I(W, { size: 12 })
+				children: /* @__PURE__ */ V(Oe, { size: 12 })
 			}),
-			/* @__PURE__ */ I(y, {
+			/* @__PURE__ */ V(g, {
 				open: l,
 				onOpenChange: u,
 				value: e,
@@ -205,103 +547,109 @@ function Le({ value: e, onChange: t, onClear: n, defaultIcon: r, tone: i, title:
 }
 //#endregion
 //#region src/bento/bento-inline-edit.tsx
-function Re({ value: t, onSave: n, multiline: r = !1, placeholder: i, className: a, ariaLabel: o, autoFocus: s = !1, readOnly: c = !1, commitOnChange: l = !1 }) {
-	let { t: u } = R(), [d, f] = P(s), [m, h] = P(t), [g, _] = P(!1), v = N(null), [y, b] = P(t);
-	!d && t !== y && (b(t), h(t)), j(() => {
-		d && v.current && (v.current.focus(), v.current.select());
-	}, [d]);
-	async function x() {
+function ct({ value: n, onSave: r, multiline: i = !1, placeholder: a, className: o, ariaLabel: s, autoFocus: c = !1, readOnly: l = !1, commitOnChange: u = !1 }) {
+	let { t: d } = U(), [f, p] = z(c), [m, h] = z(n), [g, _] = z(!1), v = R(null), y = R(null), b = R(!1), x = R(!1), [S, C] = z(n);
+	!f && n !== S && (C(n), h(n)), F(() => {
+		f && v.current ? (v.current.focus(), v.current.select()) : !f && x.current && (x.current = !1, y.current?.focus());
+	}, [f]);
+	function w() {
+		x.current = v.current !== null && document.activeElement === v.current, p(!1);
+	}
+	async function T() {
+		if (b.current) return;
 		let e = m.trim();
-		if (e === t) {
-			f(!1);
+		if (e === n) {
+			w();
 			return;
 		}
-		if (!e && !i) {
-			h(t), f(!1);
+		if (!e && !a) {
+			h(n), w();
 			return;
 		}
-		_(!0);
+		b.current = !0, _(!0);
 		try {
-			await n(e);
+			await r(e);
 		} catch {
-			h(t);
+			h(n);
 		} finally {
-			_(!1), f(!1);
+			b.current = !1, _(!1), w();
 		}
 	}
-	function S() {
-		h(t), f(!1);
+	function E() {
+		h(n), w();
 	}
-	function C(e) {
-		h(e), l && n(e);
+	function D(e) {
+		h(e), u && r(e);
 	}
-	let w = !t;
-	if (c) return /* @__PURE__ */ I("span", {
-		className: e("block w-full", a),
-		"aria-label": o,
-		children: t || /* @__PURE__ */ I("span", {
+	let O = !n;
+	if (l) return /* @__PURE__ */ V("span", {
+		className: e("block w-full", o),
+		"aria-label": s,
+		children: n || /* @__PURE__ */ V("span", {
 			className: "text-muted-foreground/80",
-			children: i ?? "—"
+			children: a ?? "—"
 		})
 	});
-	let T = "w-full bg-transparent outline-none border-b transition-colors duration-200", E = e(T, "cursor-text rounded-sm", w ? "border-dashed border-border/70 hover:border-foreground/40" : "border-transparent hover:border-border/60 focus-visible:border-border/80", g && "opacity-60"), D = e(T, "bento-editing");
-	if (!d) return /* @__PURE__ */ I("button", {
+	let k = "w-full bg-transparent outline-none border-b transition-colors duration-200", A = e(k, "cursor-text rounded-sm", O ? "border-dashed border-border/70 hover:border-foreground/40" : "border-transparent hover:border-border/60 focus-visible:border-border/80"), j = e(k, "bento-editing");
+	if (!f) return /* @__PURE__ */ V("button", {
+		ref: y,
 		type: "button",
-		onClick: () => f(!0),
-		className: e(E, "text-left", a),
-		"aria-label": o ?? u("forms.formActions.edit"),
-		disabled: g,
-		children: t || /* @__PURE__ */ I("span", {
+		onClick: () => p(!0),
+		className: e(A, "text-left", o),
+		"aria-label": s ?? d("forms.formActions.edit"),
+		children: n || /* @__PURE__ */ V("span", {
 			className: "text-muted-foreground/80",
-			children: i ?? "—"
+			children: a ?? "—"
 		})
 	});
-	function O(e) {
+	function M(e) {
 		if (e.key === "Escape") {
-			e.preventDefault(), S();
+			e.preventDefault(), E();
 			return;
 		}
-		e.key === "Enter" && (!r || e.metaKey || e.ctrlKey) && (e.preventDefault(), x());
+		e.key === "Enter" && (!i || e.metaKey || e.ctrlKey) && (e.preventDefault(), T());
 	}
-	return r ? /* @__PURE__ */ I("textarea", {
+	return i ? /* @__PURE__ */ V("textarea", {
 		ref: v,
 		value: m,
-		onChange: (e) => C(e.target.value),
-		onBlur: x,
-		onKeyDown: O,
-		placeholder: i,
-		"aria-label": o,
+		onChange: (e) => D(e.target.value),
+		onBlur: T,
+		onKeyDown: M,
+		placeholder: a,
+		"aria-label": s,
+		"aria-busy": g || void 0,
 		rows: 3,
-		className: e(D, "resize-none py-0.5 leading-snug", a)
-	}) : /* @__PURE__ */ I(p, {
+		className: e(j, "resize-none py-0.5 leading-snug", o)
+	}) : /* @__PURE__ */ V(t, {
 		ref: v,
 		value: m,
-		onChange: (e) => C(e.target.value),
-		onBlur: x,
-		onKeyDown: O,
-		placeholder: i,
-		"aria-label": o,
-		className: e(D, "h-auto px-0 py-0 shadow-none focus-visible:ring-0", a)
+		onChange: (e) => D(e.target.value),
+		onBlur: T,
+		onKeyDown: M,
+		placeholder: a,
+		"aria-label": s,
+		"aria-busy": g || void 0,
+		className: e(j, "h-auto px-0 py-0 shadow-none focus-visible:ring-0", o)
 	});
 }
 //#endregion
 //#region src/bento/bento-status-marker.tsx
-function ze({ titleMissing: t, dirty: n, className: r }) {
-	let { t: i } = R();
+function lt({ titleMissing: t, dirty: n, className: r }) {
+	let { t: i } = U();
 	if (!t && !n) return null;
 	let a = "inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-[10px] font-medium normal-case leading-none tracking-normal";
-	return t ? /* @__PURE__ */ L("span", {
+	return t ? /* @__PURE__ */ H("span", {
 		className: e(a, "bento-status bento-status-error", r),
-		children: [/* @__PURE__ */ I(te, { className: "size-3" }), i("bento.saveBar.titleRequired", { defaultValue: "Title required" })]
-	}) : /* @__PURE__ */ L("span", {
+		children: [/* @__PURE__ */ V(oe, { className: "size-3" }), i("bento.saveBar.titleRequired", { defaultValue: "Title required" })]
+	}) : /* @__PURE__ */ H("span", {
 		className: e(a, "bento-status bento-status-warn", r),
-		children: [/* @__PURE__ */ I("span", { className: "h-1.5 w-1.5 rounded-full bento-status-dot bento-pulse" }), i("bento.saveBar.unsaved", { defaultValue: "Unsaved changes" })]
+		children: [/* @__PURE__ */ V("span", { className: "h-1.5 w-1.5 rounded-full bento-status-dot bento-pulse" }), i("bento.saveBar.unsaved", { defaultValue: "Unsaved changes" })]
 	});
 }
 //#endregion
 //#region src/bento/bento-scroll-fade.ts
-function Be(e) {
-	j(() => {
+function ut(e) {
+	F(() => {
 		let t = e.current;
 		if (!t) return;
 		let n = document.documentElement, r = 0, i = () => {
@@ -318,183 +666,361 @@ function Be(e) {
 }
 //#endregion
 //#region src/bento/bento-entity-shell.tsx
-function Ve(e, t) {
+function dt(e, t) {
 	let n = {};
 	for (let r of Object.keys(e)) Object.assign(n, { [r]: t[r] });
 	return n;
 }
-function He({ entity: e, isNew: t, headlineFallback: n, eyebrow: r, listRoute: i, icon: a, tone: o, formId: s, feature: c, hasStatus: l = !1, hideIcon: u = !1, readOnly: d = !1, autosaveOnly: f = !1, badge: p, notice: m, onUpdate: h, onDelete: g, extraActions: v, children: y }) {
-	let { t: b } = R(), S = q(), [C, w] = P(!1), [E, D] = P({
+function ft({ entity: e, isNew: t, headlineFallback: n, eyebrow: r, listRoute: i, icon: o, tone: s, formId: c, feature: l, hasStatus: u = !1, hideIcon: d = !1, readOnly: f = !1, autosaveOnly: p = !1, badge: m, notice: h, onUpdate: g, onDelete: _, extraActions: v, children: y }) {
+	let { t: x } = U(), S = Me(), [C, w] = z(!1), [T, E] = z({
 		isDirty: !1,
 		isSubmitting: !1
-	}), O = N(null);
-	Be(O);
-	let k = {
+	}), D = R(null);
+	ut(D);
+	let O = {
 		title: e.title ?? "",
 		description: e.description ?? "",
 		icon: e.icon ?? null,
 		enabled: e.enabled ?? 1
-	}, [A, j] = P(k), [M, ee] = P(k);
-	(k.title !== M.title || k.description !== M.description || k.icon !== M.icon || k.enabled !== M.enabled) && (ee(k), j(k));
-	async function z(n) {
-		if (j((e) => ({
+	}, [k, A] = z(O), [j, M] = z(O);
+	(O.title !== j.title || O.description !== j.description || O.icon !== j.icon || O.enabled !== j.enabled) && (M(O), A(O));
+	async function N(n) {
+		if (A((e) => ({
 			...e,
 			...n
-		})), t || !h) return;
-		let r = n.title ?? A.title;
+		})), t || !g) return;
+		let r = n.title ?? k.title;
 		try {
-			await h({
+			await g({
 				...e,
 				...n
-			}), x.success(b("forms.common.updated", {
+			}), b.success(x("forms.common.updated", {
 				name: r,
-				feature: c
+				feature: l
 			}));
 		} catch (e) {
-			console.error("Failed to update entity field", e), j((e) => ({
+			console.error("Failed to update entity field", e), A((e) => ({
 				...e,
-				...Ve(n, k)
-			})), x.error(b("forms.common.notUpdated", {
-				name: k.title || r,
-				feature: c
+				...dt(n, O)
+			})), b.error(x("forms.common.notUpdated", {
+				name: O.title || r,
+				feature: l
 			}));
 		}
 	}
 	async function te() {
-		if (g) {
+		if (_) {
 			try {
-				await g() ? (x.success(b("forms.common.deleted", {
-					name: A.title,
-					feature: c
-				})), S(i)) : x.error(b("forms.common.notDeleted", {
-					name: A.title,
-					feature: c
+				await _() ? (b.success(x("forms.common.deleted", {
+					name: k.title,
+					feature: l
+				})), S(i)) : b.error(x("forms.common.notDeleted", {
+					name: k.title,
+					feature: l
 				}));
 			} catch (e) {
-				console.error("Failed to delete entity", e), x.error(b("forms.common.notDeleted", {
-					name: A.title,
-					feature: c
+				console.error("Failed to delete entity", e), b.error(x("forms.common.notDeleted", {
+					name: k.title,
+					feature: l
 				}));
 			}
 			w(!1);
 		}
 	}
-	let B = A.enabled === 1, ne = !d, re = !(f && !t), ie = !A.title.trim(), ae = !t && !E.isDirty, oe = ie || ae, V = [...v ?? [], ...g && !d ? [{
-		label: b("forms.formActions.delete"),
-		icon: _e,
+	let P = k.enabled === 1, ne = !f, re = !(p && !t), F = !k.title.trim(), I = !t && !T.isDirty, L = F || I, ie = [...v ?? [], ..._ && !f ? [{
+		id: "entity.delete",
+		label: x("forms.formActions.delete"),
+		icon: we,
 		tone: "destructive",
 		onSelect: () => w(!0)
 	}] : []];
-	return /* @__PURE__ */ L(F, { children: [
-		/* @__PURE__ */ I(Z, {
-			eyebrow: /* @__PURE__ */ L("span", {
+	return /* @__PURE__ */ H(B, { children: [
+		/* @__PURE__ */ V(ot, {
+			eyebrow: /* @__PURE__ */ H("span", {
 				className: "inline-flex items-center gap-2",
-				children: [/* @__PURE__ */ I(X, {
+				children: [/* @__PURE__ */ V(at, {
 					to: i,
 					children: r
-				}), !d && /* @__PURE__ */ I(ze, {
-					titleMissing: ie,
-					dirty: t || E.isDirty
+				}), !f && /* @__PURE__ */ V(lt, {
+					titleMissing: F,
+					dirty: t || T.isDirty
 				})]
 			}),
-			leading: /* @__PURE__ */ I(Le, {
-				value: A.icon,
-				onChange: (e) => z({ icon: e }),
-				onClear: () => z({ icon: null }),
-				defaultIcon: a,
-				tone: o,
-				title: A.title,
-				description: A.description,
-				readOnly: d || u
+			leading: /* @__PURE__ */ V(st, {
+				value: k.icon,
+				onChange: (e) => N({ icon: e }),
+				onClear: () => N({ icon: null }),
+				defaultIcon: o,
+				tone: s,
+				title: k.title,
+				description: k.description,
+				readOnly: f || d
 			}),
-			title: /* @__PURE__ */ I(Re, {
-				value: A.title,
-				onSave: (e) => z({ title: e }),
+			title: /* @__PURE__ */ V(ct, {
+				value: k.title,
+				onSave: (e) => N({ title: e }),
 				placeholder: n,
 				className: "text-3xl font-semibold tracking-tight md:text-4xl",
-				ariaLabel: b("forms.common.title"),
+				ariaLabel: x("forms.common.title"),
 				autoFocus: t,
 				commitOnChange: t,
-				readOnly: d
+				readOnly: f
 			}),
-			subtitle: /* @__PURE__ */ I(Re, {
-				value: A.description,
-				onSave: (e) => z({ description: e }),
+			subtitle: /* @__PURE__ */ V(ct, {
+				value: k.description,
+				onSave: (e) => N({ description: e }),
 				multiline: !0,
-				placeholder: b("forms.common.description"),
+				placeholder: x("forms.common.description"),
 				className: "max-w-2xl text-sm text-muted-foreground",
-				ariaLabel: b("forms.common.description"),
+				ariaLabel: x("forms.common.description"),
 				commitOnChange: t,
-				readOnly: d
+				readOnly: f
 			}),
-			trailing: /* @__PURE__ */ L(F, { children: [
-				ne && /* @__PURE__ */ L("div", {
+			trailing: /* @__PURE__ */ H(B, { children: [
+				ne && /* @__PURE__ */ H("div", {
 					className: "bento-fade-out flex shrink-0 items-center gap-2",
-					children: [re && /* @__PURE__ */ L(_, {
+					children: [re && /* @__PURE__ */ H(a, {
 						type: "submit",
-						form: s,
+						form: c,
 						size: "sm",
-						loading: E.isSubmitting,
-						disabled: oe,
-						children: [/* @__PURE__ */ I(H, { className: "size-4" }), b("forms.formActions.saveChanges")]
-					}), /* @__PURE__ */ L(_, {
+						loading: T.isSubmitting,
+						"aria-disabled": L ? "true" : void 0,
+						children: [/* @__PURE__ */ V(he, { className: "size-4" }), x("forms.formActions.saveChanges")]
+					}), /* @__PURE__ */ H(a, {
 						type: "button",
 						size: "sm",
 						variant: "outline",
 						onClick: () => S(i),
-						children: [/* @__PURE__ */ I(W, { className: "size-4" }), b("forms.formActions.cancel")]
+						children: [/* @__PURE__ */ V(Oe, { className: "size-4" }), x("forms.formActions.cancel")]
 					})]
 				}),
-				p,
-				l && (d ? /* @__PURE__ */ L("span", {
-					className: `flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-[10px] uppercase tracking-wider ${B ? "bento-status bento-status-on" : "border-border bg-muted text-muted-foreground"}`,
-					children: [/* @__PURE__ */ I("span", { className: `h-1.5 w-1.5 rounded-full ${B ? "bento-status-dot bento-pulse" : "bg-muted-foreground/60"}` }), B ? b("common.active", { defaultValue: "Active" }) : b("common.idle", { defaultValue: "Idle" })]
-				}) : /* @__PURE__ */ L("button", {
+				m,
+				u && (f ? /* @__PURE__ */ H("span", {
+					className: `flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-[10px] uppercase tracking-wider ${P ? "bento-status bento-status-on" : "border-border bg-muted text-muted-foreground"}`,
+					children: [/* @__PURE__ */ V("span", { className: `h-1.5 w-1.5 rounded-full ${P ? "bento-status-dot bento-pulse" : "bg-muted-foreground/60"}` }), P ? x("common.active", { defaultValue: "Active" }) : x("common.idle", { defaultValue: "Idle" })]
+				}) : /* @__PURE__ */ H("button", {
 					type: "button",
-					onClick: () => z({ enabled: +!B }),
-					"aria-label": b("forms.common.enabled"),
-					title: b(B ? "common.activeToggleHint" : "common.idleToggleHint"),
-					className: `bento-tile-clickable flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-[10px] uppercase tracking-wider transition-colors duration-200 ${B ? "bento-status bento-status-on" : "border-border bg-muted text-muted-foreground hover:bg-muted/80"}`,
-					children: [/* @__PURE__ */ I("span", { className: `h-1.5 w-1.5 rounded-full ${B ? "bento-status-dot bento-pulse" : "bg-muted-foreground/60"}` }), B ? b("common.active", { defaultValue: "Active" }) : b("common.idle", { defaultValue: "Idle" })]
+					onClick: () => N({ enabled: +!P }),
+					"aria-label": x("forms.common.enabled"),
+					title: x(P ? "common.activeToggleHint" : "common.idleToggleHint"),
+					className: `bento-tile-clickable flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-[10px] uppercase tracking-wider transition-colors duration-200 ${P ? "bento-status bento-status-on" : "border-border bg-muted text-muted-foreground hover:bg-muted/80"}`,
+					children: [/* @__PURE__ */ V("span", { className: `h-1.5 w-1.5 rounded-full ${P ? "bento-status-dot bento-pulse" : "bg-muted-foreground/60"}` }), P ? x("common.active", { defaultValue: "Active" }) : x("common.idle", { defaultValue: "Idle" })]
 				})),
-				!t && V.length > 0 && /* @__PURE__ */ I(Ne, { actions: V })
+				!t && ie.length > 0 && /* @__PURE__ */ V(Ze, { actions: ie })
 			] })
 		}),
-		/* @__PURE__ */ I("div", {
-			ref: O,
+		/* @__PURE__ */ V("div", {
+			ref: D,
 			"aria-hidden": !0,
 			className: "h-px"
 		}),
-		m,
-		!t && g && /* @__PURE__ */ I(T, {
-			feature: c,
-			name: A.title,
+		h,
+		!t && _ && /* @__PURE__ */ V(ee, {
+			feature: l,
+			name: k.title,
 			onDelete: te,
 			open: C,
 			setOpen: w,
-			trigger: /* @__PURE__ */ I("span", {
+			trigger: /* @__PURE__ */ V("span", {
 				className: "hidden",
 				"aria-hidden": !0
 			})
 		}),
 		y({
-			staged: A,
-			onStateChange: D
+			staged: k,
+			onStateChange: E
 		})
 	] });
 }
 //#endregion
+//#region src/bento/bento-diff.tsx
+function pt(e, t, n = !0) {
+	let r = e.length, i = t.length;
+	if (r * i > 4e5) return null;
+	let a = Array.from({ length: r + 1 }, () => new Uint32Array(i + 1));
+	for (let n = r - 1; n >= 0; n--) for (let r = i - 1; r >= 0; r--) a[n][r] = e[n] === t[r] ? a[n + 1][r + 1] + 1 : Math.max(a[n + 1][r], a[n][r + 1]);
+	let o = [], s = (e, t) => {
+		let r = o[o.length - 1];
+		n && r?.op === e ? r.text += t : o.push({
+			op: e,
+			text: t
+		});
+	}, c = 0, l = 0;
+	for (; c < r && l < i;) e[c] === t[l] ? (s("same", e[c]), c++, l++) : a[c + 1][l] >= a[c][l + 1] ? s("remove", e[c++]) : s("add", t[l++]);
+	for (; c < r;) s("remove", e[c++]);
+	for (; l < i;) s("add", t[l++]);
+	return o;
+}
+var mt = (e) => e.split(/(\s+)/).filter((e) => e !== "");
+function ht(e) {
+	if (typeof DOMParser > "u") return e.split(/<\/(?:p|h[1-6]|li|blockquote|pre|div)>/i).map((e) => e.replace(/<[^>]*>/g, "").replace(/\s+/g, " ").trim()).filter(Boolean);
+	let t = new DOMParser().parseFromString(e, "text/html"), n = [...t.body.querySelectorAll("p, h1, h2, h3, h4, h5, h6, li, blockquote, pre")].filter((e) => !e.parentElement?.closest("p, h1, h2, h3, h4, h5, h6, li, blockquote, pre")).map((e) => (e.textContent ?? "").replace(/\s+/g, " ").trim()).filter(Boolean), r = (t.body.textContent ?? "").replace(/\s+/g, " ").trim();
+	return n.length > 0 ? n : r ? [r] : [];
+}
+var $ = (e) => e == null ? "" : String(e);
+function gt({ before: t, after: n, fields: r, showUnchanged: i = !1 }) {
+	let { t: a } = U(), [o, s] = z(i), c = r.map((e) => {
+		let r = t?.[e.id], i = n?.[e.id], a = e.kind ?? "text", o = a === "rich" ? ht($(r)).join("\n") === ht($(i)).join("\n") : a === "value" ? JSON.stringify(r ?? null) === JSON.stringify(i ?? null) : $(r) === $(i), s = "changed";
+		return t === null || (r == null || r === "") && !o ? s = "added" : n === null || (i == null || i === "") && !o ? s = "removed" : o && (s = "unchanged"), {
+			field: e,
+			a: r,
+			b: i,
+			kind: a,
+			state: s
+		};
+	}), l = c.filter((e) => e.state !== "unchanged"), u = c.filter((e) => e.state === "unchanged"), d = {
+		added: a("bento.diff.added", { defaultValue: "Added" }),
+		removed: a("bento.diff.removed", { defaultValue: "Removed" }),
+		changed: a("bento.diff.changed", { defaultValue: "Changed" }),
+		unchanged: a("bento.diff.unchanged", { defaultValue: "Unchanged" })
+	};
+	return /* @__PURE__ */ H("div", {
+		"data-slot": "bento-diff",
+		className: "flex flex-col gap-3",
+		children: [
+			(t === null || n === null) && /* @__PURE__ */ V("p", {
+				className: "m-0 text-sm font-medium",
+				children: t === null ? a("bento.diff.created", { defaultValue: "Created in this version" }) : a("bento.diff.deleted", { defaultValue: "Deleted in this version" })
+			}),
+			l.length === 0 && /* @__PURE__ */ V("p", {
+				className: "m-0 text-sm text-muted-foreground",
+				children: a("bento.diff.noChanges", { defaultValue: "No field changed" })
+			}),
+			/* @__PURE__ */ V("dl", {
+				className: "m-0 flex flex-col gap-3",
+				children: l.map((e) => /* @__PURE__ */ V(_t, {
+					label: e.field.label,
+					status: d[e.state],
+					state: e.state,
+					children: /* @__PURE__ */ V(vt, { row: e })
+				}, e.field.id))
+			}),
+			u.length > 0 && /* @__PURE__ */ H("div", {
+				className: "flex flex-col gap-3",
+				children: [/* @__PURE__ */ H("button", {
+					type: "button",
+					"aria-expanded": o ? "true" : "false",
+					onClick: () => s(!o),
+					className: "inline-flex items-center gap-1 self-start rounded-md text-sm text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring",
+					children: [/* @__PURE__ */ V(K, {
+						size: 14,
+						"aria-hidden": "true",
+						className: e("transition-transform", o && "rotate-90")
+					}), a("bento.diff.unchangedCount", {
+						defaultValue: "{{count}} unchanged",
+						count: u.length
+					})]
+				}), o && /* @__PURE__ */ V("dl", {
+					className: "m-0 flex flex-col gap-3",
+					children: u.map((e) => /* @__PURE__ */ V(_t, {
+						label: e.field.label,
+						status: d.unchanged,
+						state: "unchanged",
+						children: /* @__PURE__ */ V("p", {
+							className: "m-0 whitespace-pre-wrap text-sm text-muted-foreground",
+							children: e.kind === "rich" ? ht($(e.b)).join("\n\n") : e.field.format ? e.field.format(e.b) : $(e.b)
+						})
+					}, e.field.id))
+				})]
+			})
+		]
+	});
+}
+function _t({ label: t, status: n, state: r, children: i }) {
+	return /* @__PURE__ */ H("div", {
+		className: "rounded-xl border border-border/60 bg-card/40 p-3",
+		children: [/* @__PURE__ */ H("dt", {
+			className: "mb-1.5 flex items-center gap-2 text-xs font-medium text-muted-foreground",
+			children: [/* @__PURE__ */ V("span", { children: t }), /* @__PURE__ */ V("span", {
+				className: e("rounded-full border px-1.5 leading-4", r === "added" && "bento-status bento-status-on", r === "removed" && "bento-status bento-status-error", r === "changed" && "bento-status bento-status-warn"),
+				children: n
+			})]
+		}), /* @__PURE__ */ V("dd", {
+			className: "m-0",
+			children: i
+		})]
+	});
+}
+function vt({ row: e }) {
+	let { t } = U(), { field: n, a: r, b: i, kind: a, state: o } = e;
+	if (a === "value") {
+		let e = (e) => n.format ? n.format(e) : $(e);
+		return /* @__PURE__ */ H("p", {
+			className: "m-0 flex flex-wrap items-center gap-2 text-sm",
+			children: [
+				o !== "added" && /* @__PURE__ */ V(bt, { children: e(r) }),
+				o === "changed" && /* @__PURE__ */ V("span", {
+					"aria-hidden": "true",
+					children: "→"
+				}),
+				o !== "removed" && /* @__PURE__ */ V(yt, { children: e(i) })
+			]
+		});
+	}
+	let s = a === "rich" ? ht($(r)) : [$(r)].filter(Boolean), c = a === "rich" ? ht($(i)) : [$(i)].filter(Boolean), l = pt(s, c, !1) ?? [...s.map((e) => ({
+		op: "remove",
+		text: e
+	})), ...c.map((e) => ({
+		op: "add",
+		text: e
+	}))], u = [];
+	for (let e = 0; e < l.length; e++) {
+		let t = l[e], n = l[e + 1];
+		if (t.op === "remove" && n?.op === "add") {
+			let r = pt(mt(t.text), mt(n.text));
+			u.push(/* @__PURE__ */ V("p", {
+				className: "m-0 whitespace-pre-wrap text-sm leading-relaxed",
+				children: r ? r.map((e, t) => e.op === "same" ? /* @__PURE__ */ V("span", { children: e.text }, t) : e.op === "add" ? /* @__PURE__ */ V(yt, { children: e.text }, t) : /* @__PURE__ */ V(bt, { children: e.text }, t)) : [
+					/* @__PURE__ */ V(bt, { children: t.text }, "r"),
+					" ",
+					/* @__PURE__ */ V(yt, { children: n.text }, "a")
+				]
+			}, e)), e++;
+		} else u.push(/* @__PURE__ */ V("p", {
+			className: "m-0 whitespace-pre-wrap text-sm leading-relaxed",
+			children: t.op === "same" ? t.text : t.op === "add" ? /* @__PURE__ */ V(yt, { children: t.text }) : /* @__PURE__ */ V(bt, { children: t.text })
+		}, e));
+	}
+	return u.length === 0 ? /* @__PURE__ */ V("p", {
+		className: "m-0 text-sm text-muted-foreground",
+		children: t("bento.diff.empty", { defaultValue: "Empty" })
+	}) : /* @__PURE__ */ V("div", {
+		className: "flex flex-col gap-2",
+		children: u
+	});
+}
+function yt({ children: e }) {
+	let { t } = U();
+	return /* @__PURE__ */ H("ins", {
+		className: "bento-status bento-status-on rounded-sm px-0.5 underline decoration-2 underline-offset-2",
+		children: [/* @__PURE__ */ H("span", {
+			className: "sr-only",
+			children: [t("bento.diff.addedStart", { defaultValue: "added:" }), " "]
+		}), e]
+	});
+}
+function bt({ children: e }) {
+	let { t } = U();
+	return /* @__PURE__ */ H("del", {
+		className: "bento-status bento-status-error rounded-sm px-0.5 line-through decoration-2",
+		children: [/* @__PURE__ */ H("span", {
+			className: "sr-only",
+			children: [t("bento.diff.removedStart", { defaultValue: "removed:" }), " "]
+		}), e]
+	});
+}
+//#endregion
 //#region src/bento/bento-layout.ts
-var Ue = {
+var xt = {
 	LARGE: "col-span-2 row-span-2 md:col-span-2 md:row-span-2 lg:col-span-2 lg:row-span-2",
 	MEDIUM: "col-span-2 row-span-1 md:col-span-2 md:row-span-1 lg:col-span-2 lg:row-span-1",
 	SMALL: "col-span-1 row-span-1"
-}, We = {
+}, St = {
 	SMALL: "MEDIUM",
 	MEDIUM: "LARGE",
 	LARGE: "SMALL"
 };
-function Ge(e, t, n) {
+function Ct(e, t, n) {
 	if (!n || n.length === 0) return e.map((e, n) => ({
 		item: e,
 		key: t(e),
@@ -515,7 +1041,7 @@ function Ge(e, t, n) {
 		emphasis: i.get(t) ?? "MEDIUM"
 	}));
 }
-function Ke(e) {
+function wt(e) {
 	return e.map((e, t) => ({
 		itemId: e.key,
 		emphasis: e.emphasis,
@@ -524,45 +1050,45 @@ function Ke(e) {
 }
 //#endregion
 //#region src/bento/bento-entity-tile.tsx
-function qe({ to: e, emphasis: t, featured: n, defaultIcon: r, icon: i, tone: a = "indigo", title: o, description: s, meta: c, enabled: l, hasStatus: u = !1, viewTransitionName: d }) {
-	let { t: f } = R(), p = Y(a), m = t ?? (n ? "LARGE" : "MEDIUM"), h = m === "LARGE", g = m === "SMALL", _ = Ue[m], v = l === 1, y = h ? "p-6 md:p-7" : g ? "p-4" : "p-5", b = h ? "h-14 w-14" : g ? "h-8 w-8" : "h-9 w-9", x = h ? 28 : g ? 16 : 18, S = h ? "text-xl md:text-2xl" : g ? "text-sm" : "text-base md:text-lg";
-	return /* @__PURE__ */ L(K, {
+function Tt({ to: e, emphasis: t, featured: n, defaultIcon: r, icon: i, tone: a = "indigo", title: o, description: s, meta: c, enabled: l, hasStatus: u = !1, viewTransitionName: d }) {
+	let { t: f } = U(), p = Q(a), m = t ?? (n ? "LARGE" : "MEDIUM"), h = m === "LARGE", g = m === "SMALL", _ = xt[m], v = l === 1, y = h ? "p-6 md:p-7" : g ? "p-4" : "p-5", b = h ? "h-14 w-14" : g ? "h-8 w-8" : "h-9 w-9", x = h ? 28 : g ? 16 : 18, S = h ? "text-xl md:text-2xl" : g ? "text-sm" : "text-base md:text-lg";
+	return /* @__PURE__ */ H(Z, {
 		to: e,
 		className: `bento-tile bento-tile-clickable bento-glass group relative flex flex-col ${h ? "gap-5" : "gap-4"} overflow-hidden ${y} ${_}`,
 		style: d ? { viewTransitionName: d } : void 0,
 		children: [
-			h && /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I("div", {
+			h && /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V("div", {
 				"aria-hidden": !0,
 				className: `pointer-events-none absolute -bottom-10 -right-10 h-64 w-64 rounded-full ${p} opacity-40 blur-2xl dark:opacity-50`
-			}), /* @__PURE__ */ I("div", {
+			}), /* @__PURE__ */ V("div", {
 				"aria-hidden": !0,
 				className: `pointer-events-none absolute right-12 top-1/3 h-32 w-32 rounded-full ${p} bento-chip-tr opacity-20 blur-2xl dark:opacity-30`
 			})] }),
-			/* @__PURE__ */ L("div", {
+			/* @__PURE__ */ H("div", {
 				className: "relative z-1 flex items-center justify-between",
-				children: [/* @__PURE__ */ I("span", {
+				children: [/* @__PURE__ */ V("span", {
 					className: `grid place-items-center rounded-2xl ${p} text-white shadow-md ${b}`,
-					children: i ? /* @__PURE__ */ I(G, {
+					children: i ? /* @__PURE__ */ V(ke, {
 						icon: i,
 						className: h ? "size-7 text-white" : "size-4.5 text-white"
-					}) : /* @__PURE__ */ I(r, { size: x })
-				}), u && /* @__PURE__ */ L("span", {
+					}) : /* @__PURE__ */ V(r, { size: x })
+				}), u && /* @__PURE__ */ H("span", {
 					className: `flex items-center gap-1.5 rounded-full border px-2 py-0.5 text-[10px] uppercase tracking-wider ${v ? "bento-status bento-status-on" : "border-border bg-muted text-muted-foreground"}`,
-					children: [/* @__PURE__ */ I("span", { className: `h-1.5 w-1.5 rounded-full ${v ? "bento-status-dot bento-pulse" : "bg-muted-foreground/60"}` }), v ? f("common.active", { defaultValue: "Active" }) : f("common.idle", { defaultValue: "Idle" })]
+					children: [/* @__PURE__ */ V("span", { className: `h-1.5 w-1.5 rounded-full ${v ? "bento-status-dot bento-pulse" : "bg-muted-foreground/60"}` }), v ? f("common.active", { defaultValue: "Active" }) : f("common.idle", { defaultValue: "Idle" })]
 				})]
 			}),
-			/* @__PURE__ */ L("div", {
+			/* @__PURE__ */ H("div", {
 				className: "relative z-1",
 				children: [
-					/* @__PURE__ */ I("div", {
+					/* @__PURE__ */ V("div", {
 						className: `font-semibold tracking-tight ${S}`,
 						children: o
 					}),
-					!g && c && /* @__PURE__ */ I("div", {
+					!g && c && /* @__PURE__ */ V("div", {
 						className: "mt-1 flex flex-wrap items-center gap-1.5 text-xs text-muted-foreground",
 						children: c
 					}),
-					!g && s && /* @__PURE__ */ I("p", {
+					!g && s && /* @__PURE__ */ V("p", {
 						className: "mt-2 text-sm text-muted-foreground",
 						children: s
 					})
@@ -572,43 +1098,269 @@ function qe({ to: e, emphasis: t, featured: n, defaultIcon: r, icon: i, tone: a
 	});
 }
 //#endregion
+//#region src/bento/bento-filter-bar.tsx
+var Et = {
+	query: "",
+	facets: {}
+}, Dt = (e) => typeof e == "object" && !!e && !Array.isArray(e), Ot = (e) => Array.isArray(e) ? e : [];
+function kt(e, t, n) {
+	let r = { ...e.facets };
+	return n === void 0 || Array.isArray(n) && n.length === 0 || Dt(n) && !n.from && !n.to ? delete r[t] : r[t] = n, {
+		...e,
+		facets: r
+	};
+}
+function At({ value: e, onChange: n, facets: r, queryLabel: i, queryDelay: a = 300, views: o }) {
+	let { t: s } = U(), [c, l] = z({
+		source: e.query,
+		text: e.query
+	}), [u, d] = z(null);
+	c.source !== e.query && l({
+		source: e.query,
+		text: e.query === u ? c.text : e.query
+	}), F(() => {
+		if (c.text === e.query) return;
+		let t = setTimeout(() => {
+			d(c.text), n({
+				...e,
+				query: c.text
+			});
+		}, a);
+		return () => clearTimeout(t);
+	}, [
+		c.text,
+		e,
+		n,
+		a
+	]);
+	let f = [];
+	for (let t of r) {
+		let n = e.facets[t.id];
+		if (t.kind === "choice") for (let r of Ot(n)) {
+			let i = t.options.find((e) => e.value === r);
+			f.push({
+				key: `${t.id}:${r}`,
+				text: `${t.label}: ${i?.label ?? r}`,
+				remove: () => kt(e, t.id, Ot(n).filter((e) => e !== r))
+			});
+		}
+		else Dt(n) && (n.from || n.to) && f.push({
+			key: t.id,
+			text: `${t.label}: ${n.from ?? "…"} – ${n.to ?? "…"}`,
+			remove: () => kt(e, t.id, void 0)
+		});
+	}
+	let p = f.length > 0 || e.query !== "", m = i ?? s("bento.filters.search", { defaultValue: "Search" });
+	return /* @__PURE__ */ H("div", {
+		role: "search",
+		"aria-label": s("bento.filters.label", { defaultValue: "Filters" }),
+		"data-slot": "bento-filter-bar",
+		className: "flex flex-col gap-2",
+		children: [/* @__PURE__ */ H("div", {
+			className: "flex flex-wrap items-center gap-2",
+			children: [
+				/* @__PURE__ */ H("div", {
+					className: "relative min-w-48 flex-1",
+					children: [/* @__PURE__ */ V(Se, {
+						size: 16,
+						"aria-hidden": "true",
+						className: "pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
+					}), /* @__PURE__ */ V(t, {
+						type: "search",
+						value: c.text,
+						placeholder: m,
+						"aria-label": m,
+						onChange: (e) => l({
+							...c,
+							text: e.target.value
+						}),
+						className: "pl-9"
+					})]
+				}),
+				r.map((t) => t.kind === "choice" ? /* @__PURE__ */ V(Mt, {
+					facet: t,
+					value: e,
+					onChange: n
+				}, t.id) : /* @__PURE__ */ V(Nt, {
+					facet: t,
+					value: e,
+					onChange: n
+				}, t.id)),
+				o
+			]
+		}), p && /* @__PURE__ */ H("ul", {
+			className: "m-0 flex list-none flex-wrap items-center gap-1.5 p-0",
+			"aria-label": s("bento.filters.active", { defaultValue: "Active filters" }),
+			children: [f.map((e) => /* @__PURE__ */ V("li", { children: /* @__PURE__ */ H("button", {
+				type: "button",
+				"aria-label": s("bento.filters.remove", {
+					defaultValue: "Remove filter {{filter}}",
+					filter: e.text
+				}),
+				onClick: () => n(e.remove()),
+				className: "bento-clear inline-flex items-center gap-1 rounded-full border border-border/60 bg-card/60 py-0.5 pl-2.5 pr-1.5 text-xs",
+				children: [e.text, /* @__PURE__ */ V(Oe, {
+					size: 12,
+					"aria-hidden": "true"
+				})]
+			}) }, e.key)), /* @__PURE__ */ V("li", { children: /* @__PURE__ */ V(N, {
+				variant: "ghost",
+				size: "sm",
+				className: "h-6 px-2 text-xs",
+				onClick: () => {
+					l({
+						source: "",
+						text: ""
+					}), n(Et);
+				},
+				children: s("bento.filters.clearAll", { defaultValue: "Clear all" })
+			}) })]
+		})]
+	});
+}
+function jt({ label: e, count: t, ...n }) {
+	return /* @__PURE__ */ H(N, {
+		variant: "outline",
+		size: "sm",
+		className: "gap-1.5",
+		...n,
+		children: [
+			e,
+			t > 0 && /* @__PURE__ */ V("span", {
+				className: "rounded-full bg-primary px-1.5 text-[0.6875rem] leading-4 text-primary-foreground",
+				children: t
+			}),
+			/* @__PURE__ */ V(pe, {
+				size: 14,
+				"aria-hidden": "true"
+			})
+		]
+	});
+}
+function Mt({ facet: e, value: t, onChange: n }) {
+	let r = Ot(t.facets[e.id]);
+	return /* @__PURE__ */ H(l, { children: [/* @__PURE__ */ V(f, {
+		asChild: !0,
+		children: /* @__PURE__ */ V(jt, {
+			label: e.label,
+			count: r.length
+		})
+	}), /* @__PURE__ */ V(_, {
+		align: "start",
+		className: "bento-dropdown min-w-44 p-1.5",
+		children: e.multiple ? e.options.map((i) => /* @__PURE__ */ V(j, {
+			checked: r.includes(i.value),
+			onCheckedChange: (a) => n(kt(t, e.id, a === !0 ? [...r, i.value] : r.filter((e) => e !== i.value))),
+			onSelect: (e) => e.preventDefault(),
+			children: i.label
+		}, i.value)) : /* @__PURE__ */ V(c, {
+			value: r[0] ?? "",
+			onValueChange: (i) => n(kt(t, e.id, i === r[0] ? [] : [i])),
+			children: e.options.map((e) => /* @__PURE__ */ V(T, {
+				value: e.value,
+				children: e.label
+			}, e.value))
+		})
+	})] });
+}
+function Nt({ facet: e, value: n, onChange: r }) {
+	let { t: i } = U(), a = n.facets[e.id], o = Dt(a) ? a : {}, [s, c] = z(!1), [l, u] = z(o.from ?? ""), [d, f] = z(o.to ?? ""), p = I(), m = I();
+	return /* @__PURE__ */ H(C, {
+		open: s,
+		onOpenChange: (e) => {
+			e && (u(o.from ?? ""), f(o.to ?? "")), c(e);
+		},
+		children: [/* @__PURE__ */ V(M, {
+			asChild: !0,
+			children: /* @__PURE__ */ V(jt, {
+				label: e.label,
+				count: o.from || o.to ? 1 : 0
+			})
+		}), /* @__PURE__ */ V(v, {
+			align: "start",
+			className: "bento-dropdown w-64 p-3",
+			children: /* @__PURE__ */ H("form", {
+				className: "flex flex-col gap-2",
+				onSubmit: (t) => {
+					t.preventDefault(), r(kt(n, e.id, {
+						from: l || void 0,
+						to: d || void 0
+					})), c(!1);
+				},
+				children: [
+					/* @__PURE__ */ V("label", {
+						htmlFor: p,
+						className: "text-xs text-muted-foreground",
+						children: i("bento.filters.from", { defaultValue: "From" })
+					}),
+					/* @__PURE__ */ V(t, {
+						id: p,
+						type: "date",
+						value: l,
+						max: d || void 0,
+						onChange: (e) => u(e.target.value)
+					}),
+					/* @__PURE__ */ V("label", {
+						htmlFor: m,
+						className: "text-xs text-muted-foreground",
+						children: i("bento.filters.to", { defaultValue: "To" })
+					}),
+					/* @__PURE__ */ V(t, {
+						id: m,
+						type: "date",
+						value: d,
+						min: l || void 0,
+						onChange: (e) => f(e.target.value)
+					}),
+					/* @__PURE__ */ V(N, {
+						type: "submit",
+						size: "sm",
+						className: "mt-1",
+						children: i("bento.filters.apply", { defaultValue: "Apply" })
+					})
+				]
+			})
+		})]
+	});
+}
+//#endregion
 //#region src/bento/bento-list-page.tsx
-var Je = "bento-grid grid auto-rows-[minmax(140px,auto)] grid-cols-2 gap-4 md:grid-cols-4 md:gap-5 lg:grid-cols-6";
-function Ye({ items: e, error: t, tryAgainUrl: n, listId: r, eyebrow: i, backTo: a, backLabel: o, heroIcon: s, title: c, subtitle: l, tone: u = "indigo", headerAction: d, newRoute: f, newLabel: p, newSubtitle: m, hideNew: h = !1, itemKey: g, renderTile: _, emptyTitle: v, emptyDescription: y, layout: b }) {
-	let { t: x } = R(), S = Y(u), [C, T] = P(!1), D = M(() => Ge(e ?? [], g, b?.data?.entries), [
+var Pt = "bento-grid grid auto-rows-[minmax(140px,auto)] grid-cols-2 gap-4 md:grid-cols-4 md:gap-5 lg:grid-cols-6";
+function Ft({ items: e, error: t, tryAgainUrl: n, listId: r, eyebrow: i, backTo: a, backLabel: o, heroIcon: s, title: c, subtitle: l, tone: u = "indigo", headerAction: d, newRoute: f, newLabel: p, newSubtitle: m, hideNew: h = !1, itemKey: g, renderTile: _, emptyTitle: v, emptyDescription: y, layout: b }) {
+	let { t: x } = U(), S = Q(u), [C, w] = z(!1), T = L(() => Ct(e ?? [], g, b?.data?.entries), [
 		e,
 		g,
 		b?.data?.entries
-	]), O = !!r && !!b && (e?.length ?? 0) > 0;
-	return /* @__PURE__ */ L(E, {
+	]), E = !!r && !!b && (e?.length ?? 0) > 0;
+	return /* @__PURE__ */ H(te, {
 		checkIsNotUndefined: e,
 		error: t ?? null,
 		tryAgainUrl: n,
 		children: [
-			/* @__PURE__ */ I(Z, {
+			/* @__PURE__ */ V(ot, {
 				eyebrow: i,
 				backTo: a,
 				backLabel: o,
-				leading: /* @__PURE__ */ I("span", {
+				leading: /* @__PURE__ */ V("span", {
 					className: `grid h-12 w-12 place-items-center rounded-2xl ${S} text-white shadow-md`,
-					children: /* @__PURE__ */ I(s, { size: 24 })
+					children: /* @__PURE__ */ V(s, { size: 24 })
 				}),
 				title: c,
 				subtitle: l
 			}),
-			(d || O && !C) && /* @__PURE__ */ L("div", {
+			(d || E && !C) && /* @__PURE__ */ H("div", {
 				className: "mb-4 flex flex-wrap items-center gap-2",
-				children: [d, O && !C && /* @__PURE__ */ L(w, {
+				children: [d, E && !C && /* @__PURE__ */ H(N, {
 					variant: "outline",
 					size: "sm",
-					onClick: () => T(!0),
+					onClick: () => w(!0),
 					className: "ml-auto gap-2",
-					children: [/* @__PURE__ */ I(z, { size: 16 }), x("bento.layout.customize", { defaultValue: "Customize layout" })]
+					children: [/* @__PURE__ */ V(ae, { size: 16 }), x("bento.layout.customize", { defaultValue: "Customize layout" })]
 				})]
 			}),
-			C && r && b ? /* @__PURE__ */ I(Qe, {
+			C && r && b ? /* @__PURE__ */ V(Rt, {
 				layout: b,
-				resolved: D,
+				resolved: T,
 				canEditGlobal: b?.data?.canEditGlobal ?? !1,
 				isCustomized: b?.data?.source === "USER",
 				renderTile: _,
@@ -617,9 +1369,9 @@ function Ye({ items: e, error: t, tryAgainUrl: n, listId: r, eyebrow: i, backTo:
 				newRoute: f,
 				newLabel: p,
 				newSubtitle: m,
-				onClose: () => T(!1)
-			}) : /* @__PURE__ */ I(Ze, {
-				resolved: D,
+				onClose: () => w(!1)
+			}) : /* @__PURE__ */ V(Lt, {
+				resolved: T,
 				renderTile: _,
 				chip: S,
 				hideNew: h,
@@ -633,26 +1385,26 @@ function Ye({ items: e, error: t, tryAgainUrl: n, listId: r, eyebrow: i, backTo:
 		]
 	});
 }
-function Xe({ items: e, error: t, tryAgainUrl: n, tone: r = "indigo", newRoute: i, newLabel: a, newSubtitle: o, hideNew: s = !1, itemKey: c, renderTile: l, emptyTitle: u, emptyDescription: d }) {
-	let f = Y(r);
-	return /* @__PURE__ */ I(E, {
+function It({ items: e, error: t, tryAgainUrl: n, tone: r = "indigo", newRoute: i, newLabel: a, newSubtitle: o, hideNew: s = !1, itemKey: c, renderTile: l, emptyTitle: u, emptyDescription: d }) {
+	let f = Q(r);
+	return /* @__PURE__ */ V(te, {
 		checkIsNotUndefined: e,
 		error: t ?? null,
 		tryAgainUrl: n,
-		children: /* @__PURE__ */ L("div", {
-			className: Je,
+		children: /* @__PURE__ */ H("div", {
+			className: Pt,
 			children: [
-				!s && i && a ? /* @__PURE__ */ I(nt, {
+				!s && i && a ? /* @__PURE__ */ V(Ht, {
 					route: i,
 					label: a,
 					subtitle: o,
 					chip: f
 				}) : null,
-				(e ?? []).map((e) => /* @__PURE__ */ I("span", {
+				(e ?? []).map((e) => /* @__PURE__ */ V("span", {
 					className: "contents",
 					children: l(e)
 				}, c(e))),
-				e?.length === 0 && /* @__PURE__ */ I(rt, {
+				e?.length === 0 && /* @__PURE__ */ V(Ut, {
 					title: u,
 					description: d
 				})
@@ -660,126 +1412,128 @@ function Xe({ items: e, error: t, tryAgainUrl: n, tone: r = "indigo", newRoute:
 		})
 	});
 }
-function Ze({ resolved: t, renderTile: n, chip: r, hideNew: i, newRoute: a, newLabel: o, newSubtitle: s, isEmpty: c, emptyTitle: l, emptyDescription: u }) {
+function Lt({ resolved: t, renderTile: n, chip: r, hideNew: i, newRoute: a, newLabel: o, newSubtitle: s, isEmpty: c, emptyTitle: l, emptyDescription: u }) {
 	let d = t.some((e) => e.emphasis === "SMALL");
-	return /* @__PURE__ */ L("div", {
-		className: e(Je, d && "grid-flow-dense"),
+	return /* @__PURE__ */ H("div", {
+		className: e(Pt, d && "grid-flow-dense"),
 		children: [
-			!i && /* @__PURE__ */ I(nt, {
+			!i && /* @__PURE__ */ V(Ht, {
 				route: a,
 				label: o,
 				subtitle: s,
 				chip: r
 			}),
-			t.map(({ item: e, key: t, emphasis: r }) => /* @__PURE__ */ I("span", {
+			t.map(({ item: e, key: t, emphasis: r }) => /* @__PURE__ */ V("span", {
 				className: "contents",
 				children: n(e, r)
 			}, t)),
-			c && /* @__PURE__ */ I(rt, {
+			c && /* @__PURE__ */ V(Ut, {
 				title: l,
 				description: u
 			})
 		]
 	});
 }
-function Qe({ layout: t, resolved: n, canEditGlobal: r, isCustomized: i, renderTile: a, chip: o, hideNew: s, newRoute: c, newLabel: l, newSubtitle: u, onClose: d }) {
-	let { t: f } = R(), [p, m] = P(n), h = t.saving ?? !1, [g, _] = P(!1), v = (e) => async () => {
-		if (e) {
-			_(!1);
+function Rt({ layout: t, resolved: n, canEditGlobal: r, isCustomized: i, renderTile: a, chip: o, hideNew: s, newRoute: c, newLabel: l, newSubtitle: u, onClose: d }) {
+	let { t: f } = U(), [p, m] = z(n), [h, g] = z(null), _ = (t.saving ?? !1) || h !== null, v = (e) => _ && h === e ? { loading: !0 } : { "aria-disabled": _ || void 0 }, [y, b] = z(!1), x = (e, t) => async () => {
+		if (t) {
+			g(e), b(!1);
 			try {
-				await e(), d();
+				await t(), d();
 			} catch (e) {
-				console.error("Failed to save the bento layout", e), _(!0);
+				console.error("Failed to save the bento layout", e), b(!0);
+			} finally {
+				g(null);
 			}
 		}
-	}, y = Ee(Te(Ce, { activationConstraint: { distance: 8 } }), Te(Se));
-	function b(e) {
+	}, S = He(Ve(ze, { activationConstraint: { distance: 8 } }), Ve(Re));
+	function C(e) {
 		let { active: t, over: n } = e;
 		!n || t.id === n.id || m((e) => {
 			let r = e.findIndex((e) => e.key === t.id), i = e.findIndex((e) => e.key === n.id);
-			return r < 0 || i < 0 ? e : Oe(e, r, i);
+			return r < 0 || i < 0 ? e : We(e, r, i);
 		});
 	}
-	function x(e, t) {
+	function w(e, t) {
 		m((n) => n.map((n) => n.key === e ? {
 			...n,
 			emphasis: t
 		} : n));
 	}
-	let S = M(() => Ke(p), [p]), C = p.some((e) => e.emphasis === "SMALL");
-	return /* @__PURE__ */ L("div", { children: [/* @__PURE__ */ L("div", {
+	let T = L(() => wt(p), [p]), E = p.some((e) => e.emphasis === "SMALL");
+	return /* @__PURE__ */ H("div", { children: [/* @__PURE__ */ H("div", {
 		className: "mb-4 flex flex-wrap items-center gap-2 rounded-2xl border border-border/60 bg-card/40 p-3 backdrop-blur-md",
 		children: [
-			/* @__PURE__ */ I("span", {
+			/* @__PURE__ */ V("span", {
 				className: "mr-auto text-sm text-muted-foreground",
 				children: f("bento.layout.editHint", { defaultValue: "Drag tiles to reorder · tap the size button to resize" })
 			}),
-			i && t.onReset && /* @__PURE__ */ L(w, {
+			i && t.onReset && /* @__PURE__ */ H(N, {
 				variant: "ghost",
 				size: "sm",
 				className: "gap-2",
-				disabled: h,
-				onClick: v(t.onReset),
-				children: [/* @__PURE__ */ I(B, { size: 16 }), f("bento.layout.reset", { defaultValue: "Reset to default" })]
+				...v("reset"),
+				onClick: x("reset", t.onReset),
+				children: [h !== "reset" && /* @__PURE__ */ V(W, { size: 16 }), f("bento.layout.reset", { defaultValue: "Reset to default" })]
 			}),
-			r && t.onSaveGlobal && /* @__PURE__ */ L(w, {
+			r && t.onSaveGlobal && /* @__PURE__ */ H(N, {
 				variant: "outline",
 				size: "sm",
 				className: "gap-2",
-				disabled: h,
-				onClick: v(() => t.onSaveGlobal?.(S)),
-				children: [/* @__PURE__ */ I(ye, { size: 16 }), f("bento.layout.saveGlobal", { defaultValue: "Set as default for everyone" })]
+				...v("global"),
+				onClick: x("global", () => t.onSaveGlobal?.(T)),
+				children: [h !== "global" && /* @__PURE__ */ V(De, { size: 16 }), f("bento.layout.saveGlobal", { defaultValue: "Set as default for everyone" })]
 			}),
-			/* @__PURE__ */ L(w, {
+			/* @__PURE__ */ H(N, {
 				variant: "ghost",
 				size: "sm",
 				className: "gap-2",
-				disabled: h,
+				...v("cancel"),
 				onClick: d,
-				children: [/* @__PURE__ */ I(W, { size: 16 }), f("common.cancel", { defaultValue: "Cancel" })]
+				children: [/* @__PURE__ */ V(Oe, { size: 16 }), f("common.cancel", { defaultValue: "Cancel" })]
 			}),
-			/* @__PURE__ */ L(w, {
+			/* @__PURE__ */ H(N, {
 				size: "sm",
 				className: "gap-2",
-				disabled: h,
-				onClick: v(() => t.onSave(S)),
-				children: [/* @__PURE__ */ I(H, { size: 16 }), f("bento.layout.save", { defaultValue: "Save layout" })]
+				...v("save"),
+				onClick: x("save", () => t.onSave(T)),
+				children: [h !== "save" && /* @__PURE__ */ V(he, { size: 16 }), f("bento.layout.save", { defaultValue: "Save layout" })]
 			}),
-			g && /* @__PURE__ */ I("p", {
+			y && /* @__PURE__ */ V("p", {
 				role: "alert",
 				className: "w-full text-sm text-destructive",
 				children: f("bento.layout.saveFailed", { defaultValue: "The layout could not be saved. Nothing has changed — try again." })
 			})
 		]
-	}), /* @__PURE__ */ I(xe, {
-		sensors: y,
-		collisionDetection: we,
-		onDragEnd: b,
-		children: /* @__PURE__ */ I(De, {
+	}), /* @__PURE__ */ V(Le, {
+		sensors: S,
+		collisionDetection: Be,
+		onDragEnd: C,
+		children: /* @__PURE__ */ V(Ue, {
 			items: p.map((e) => e.key),
-			strategy: ke,
-			children: /* @__PURE__ */ L("div", {
-				className: e(Je, C && "grid-flow-dense"),
-				children: [!s && /* @__PURE__ */ I(nt, {
+			strategy: Ge,
+			children: /* @__PURE__ */ H("div", {
+				className: e(Pt, E && "grid-flow-dense"),
+				children: [!s && /* @__PURE__ */ V(Ht, {
 					route: c,
 					label: l,
 					subtitle: u,
 					chip: o
-				}), p.map(({ item: e, key: t, emphasis: n }) => /* @__PURE__ */ I(tt, {
+				}), p.map(({ item: e, key: t, emphasis: n }) => /* @__PURE__ */ V(Vt, {
 					id: t,
 					emphasis: n,
-					onSetEmphasis: (e) => x(t, e),
+					onSetEmphasis: (e) => w(t, e),
 					children: a(e, n)
 				}, t))]
 			})
 		})
 	})] });
 }
-var $e = [
+var zt = [
 	"SMALL",
 	"MEDIUM",
 	"LARGE"
-], et = {
+], Bt = {
 	SMALL: {
 		key: "bento.layout.size.small",
 		def: "Small"
@@ -793,29 +1547,29 @@ var $e = [
 		def: "Large"
 	}
 };
-function tt({ id: t, emphasis: n, onSetEmphasis: r, children: i }) {
-	let { t: a } = R(), { attributes: o, listeners: s, setNodeRef: c, transform: l, transition: u, isDragging: d } = Ae({ id: t }), f = {
-		transform: je.Translate.toString(l),
+function Vt({ id: t, emphasis: n, onSetEmphasis: r, children: i }) {
+	let { t: a } = U(), { attributes: o, listeners: s, setNodeRef: c, transform: l, transition: u, isDragging: d } = Ke({ id: t }), f = {
+		transform: qe.Translate.toString(l),
 		transition: u,
 		opacity: d ? .6 : 1,
 		zIndex: d ? 50 : void 0
 	};
-	return /* @__PURE__ */ L("div", {
+	return /* @__PURE__ */ H("div", {
 		ref: c,
 		style: f,
-		className: e("relative h-full", Ue[n]),
-		children: [/* @__PURE__ */ I("div", {
+		className: e("relative h-full", xt[n]),
+		children: [/* @__PURE__ */ V("div", {
 			className: "pointer-events-none h-full select-none [&>*]:h-full [&>*]:w-full",
 			children: i
-		}), /* @__PURE__ */ L("div", {
+		}), /* @__PURE__ */ H("div", {
 			className: "absolute right-2 top-2 z-10 flex items-center gap-1",
-			children: [/* @__PURE__ */ I("div", {
+			children: [/* @__PURE__ */ V("div", {
 				role: "group",
 				"aria-label": a("bento.layout.sizeGroup", { defaultValue: "Tile size" }),
 				className: "flex items-center gap-0.5 rounded-full border border-border/60 bg-background/80 p-0.5 shadow-sm backdrop-blur",
-				children: $e.map((t) => {
-					let i = t === n, o = a(et[t].key, { defaultValue: et[t].def });
-					return /* @__PURE__ */ I("button", {
+				children: zt.map((t) => {
+					let i = t === n, o = a(Bt[t].key, { defaultValue: Bt[t].def });
+					return /* @__PURE__ */ V("button", {
 						type: "button",
 						onClick: () => r(t),
 						"aria-pressed": i,
@@ -825,13 +1579,13 @@ function tt({ id: t, emphasis: n, onSetEmphasis: r, children: i }) {
 						children: o.charAt(0)
 					}, t);
 				})
-			}), /* @__PURE__ */ I("button", {
+			}), /* @__PURE__ */ V("button", {
 				type: "button",
 				...o,
 				...s,
 				"aria-label": a("bento.layout.dragToReorder", { defaultValue: "Drag to reorder" }),
 				className: "grid h-7 w-7 cursor-grab place-items-center rounded-full border border-border/60 bg-background/80 shadow-sm backdrop-blur hover:bg-background active:cursor-grabbing",
-				children: /* @__PURE__ */ I(le, {
+				children: /* @__PURE__ */ V(ge, {
 					size: 14,
 					className: "text-muted-foreground"
 				})
@@ -839,35 +1593,35 @@ function tt({ id: t, emphasis: n, onSetEmphasis: r, children: i }) {
 		})]
 	});
 }
-function nt({ route: e, label: t, subtitle: n, chip: r }) {
-	let { t: i } = R();
-	return /* @__PURE__ */ L(K, {
+function Ht({ route: e, label: t, subtitle: n, chip: r }) {
+	let { t: i } = U();
+	return /* @__PURE__ */ H(Z, {
 		to: e,
 		className: "bento-tile bento-tile-clickable col-span-2 row-span-1 flex flex-col gap-3 rounded-3xl border-2 border-dashed border-border/60 bg-card/30 p-5 backdrop-blur-md bento-new-tile hover:bg-card/50 md:col-span-2 md:row-span-1 lg:col-span-2 lg:row-span-1",
-		children: [/* @__PURE__ */ L("div", {
+		children: [/* @__PURE__ */ H("div", {
 			className: "flex items-center gap-3",
-			children: [/* @__PURE__ */ I("span", {
+			children: [/* @__PURE__ */ V("span", {
 				className: `bento-pulse grid h-10 w-10 place-items-center rounded-2xl ${r} text-white shadow-md`,
-				children: /* @__PURE__ */ I(he, { size: 20 })
-			}), /* @__PURE__ */ I("span", {
+				children: /* @__PURE__ */ V(xe, { size: 20 })
+			}), /* @__PURE__ */ V("span", {
 				className: "text-[11px] uppercase tracking-wider text-muted-foreground",
 				children: i("forms.formActions.new", { defaultValue: "New" })
 			})]
-		}), /* @__PURE__ */ L("div", { children: [/* @__PURE__ */ I("div", {
+		}), /* @__PURE__ */ H("div", { children: [/* @__PURE__ */ V("div", {
 			className: "text-base font-semibold tracking-tight md:text-lg",
-			children: /* @__PURE__ */ I("span", {
+			children: /* @__PURE__ */ V("span", {
 				className: `${r} bg-clip-text text-transparent`,
 				children: t
 			})
-		}), n && /* @__PURE__ */ I("p", {
+		}), n && /* @__PURE__ */ V("p", {
 			className: "mt-1 text-sm text-muted-foreground",
 			children: n
 		})] })]
 	});
 }
-function rt({ title: e, description: t }) {
-	return /* @__PURE__ */ I(Ie, {
-		icon: U,
+function Ut({ title: e, description: t }) {
+	return /* @__PURE__ */ V(it, {
+		icon: Ce,
 		title: e,
 		description: t,
 		align: "start",
@@ -876,137 +1630,138 @@ function rt({ title: e, description: t }) {
 }
 //#endregion
 //#region src/bento/bento-save-bar.tsx
-function Q({ title: e, badges: t, actions: n, onCancel: r, loading: i, disabled: a, dirty: o, titleMissing: s }) {
-	let { t: c } = R();
-	return /* @__PURE__ */ L("div", {
+function Wt({ title: e, badges: t, actions: n, onCancel: r, loading: i, disabled: o, dirty: s, titleMissing: c }) {
+	let { t: l } = U();
+	return /* @__PURE__ */ H("div", {
 		className: "bento-glass flex items-center justify-between gap-4 rounded-2xl px-4 py-3 shadow-md backdrop-blur-xl",
-		children: [/* @__PURE__ */ L("div", {
+		children: [/* @__PURE__ */ H("div", {
 			className: "flex min-w-0 items-center gap-3",
 			children: [
-				e && /* @__PURE__ */ I("p", {
+				e && /* @__PURE__ */ V("p", {
 					className: "truncate text-base font-semibold tracking-tight md:text-lg",
 					children: e
 				}),
-				/* @__PURE__ */ I(ze, {
-					titleMissing: s,
-					dirty: o
+				/* @__PURE__ */ V(lt, {
+					titleMissing: c,
+					dirty: s
 				}),
-				t && /* @__PURE__ */ I("div", {
+				t && /* @__PURE__ */ V("div", {
 					className: "flex shrink-0 items-center gap-1.5",
 					children: t
 				})
 			]
-		}), /* @__PURE__ */ I("div", {
+		}), /* @__PURE__ */ V("div", {
 			className: "flex shrink-0 gap-2",
-			children: n ?? /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ L(_, {
+			children: n ?? /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ H(a, {
 				type: "submit",
 				size: "sm",
 				loading: i,
-				disabled: a,
-				children: [/* @__PURE__ */ I(H, { className: "size-4" }), c("forms.formActions.saveChanges")]
-			}), r && /* @__PURE__ */ L(_, {
+				"aria-disabled": o ? "true" : void 0,
+				children: [/* @__PURE__ */ V(he, { className: "size-4" }), l("forms.formActions.saveChanges")]
+			}), r && /* @__PURE__ */ H(a, {
 				type: "button",
 				variant: "outline",
 				size: "sm",
 				onClick: r,
-				children: [/* @__PURE__ */ I(W, { className: "size-4" }), c("forms.formActions.cancel")]
+				children: [/* @__PURE__ */ V(Oe, { className: "size-4" }), l("forms.formActions.cancel")]
 			})] })
 		})]
 	});
 }
-function it({ children: e }) {
-	return /* @__PURE__ */ I("span", {
+function Gt({ children: e }) {
+	return /* @__PURE__ */ V("span", {
 		className: "rounded-full border border-border/60 bg-card/50 px-2 py-0.5 text-[10px] uppercase tracking-wider text-muted-foreground backdrop-blur",
 		children: e
 	});
 }
-Q.Badge = it;
+Wt.Badge = Gt;
 //#endregion
 //#region src/bento/bento-scroll-save-bar.tsx
-function at(e) {
-	let t = N(null);
-	return Be(t), /* @__PURE__ */ L(F, { children: [
-		/* @__PURE__ */ I("div", {
+function Kt(e) {
+	let t = R(null);
+	return ut(t), /* @__PURE__ */ H(B, { children: [
+		/* @__PURE__ */ V("div", {
 			ref: t,
 			"aria-hidden": !0,
 			className: "h-px"
 		}),
-		/* @__PURE__ */ I("div", {
+		/* @__PURE__ */ V("div", {
 			"aria-hidden": !0,
 			className: "bento-save-bar-spacer"
 		}),
-		/* @__PURE__ */ I("div", {
+		/* @__PURE__ */ V("div", {
 			className: "bento-fade-in fixed inset-x-0 top-20 z-20 mx-auto w-full max-w-7xl px-4 md:px-8",
-			children: /* @__PURE__ */ I(Q, { ...e })
+			children: /* @__PURE__ */ V(Wt, { ...e })
 		})
 	] });
 }
 //#endregion
 //#region src/bento/bento-form-hero.tsx
-function ot({ eyebrow: e, backTo: t, backLabel: n, leading: r, title: i, subtitle: a, trailing: o, onCancel: s, actions: c, loading: l, dirty: u, titleMissing: d, saveDisabled: f, stickyTitle: p, stickyBadges: m }) {
-	let { t: h } = R(), g = f ?? (!!d || !u);
-	return /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I(Z, {
-		eyebrow: t === void 0 ? e : /* @__PURE__ */ I(X, {
+function qt({ eyebrow: e, backTo: t, backLabel: n, leading: r, title: i, subtitle: o, trailing: s, onCancel: c, actions: l, loading: u, dirty: d, titleMissing: f, saveDisabled: p, stickyTitle: m, stickyBadges: h }) {
+	let { t: g } = U(), _ = p ?? (!!f || !d);
+	return /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V(ot, {
+		eyebrow: t === void 0 ? e : /* @__PURE__ */ V(at, {
 			to: t,
 			children: n
 		}),
 		leading: r,
 		title: i,
-		subtitle: a,
-		trailing: /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I("div", {
+		subtitle: o,
+		trailing: /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V("div", {
 			className: "bento-fade-out flex shrink-0 items-center gap-2",
-			children: c ?? /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ L(_, {
+			children: l ?? /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ H(a, {
 				type: "submit",
 				size: "sm",
-				loading: l,
-				disabled: g,
-				children: [/* @__PURE__ */ I(H, { className: "size-4" }), h("forms.formActions.saveChanges")]
-			}), /* @__PURE__ */ L(_, {
+				loading: u,
+				"aria-disabled": _ ? "true" : void 0,
+				children: [/* @__PURE__ */ V(he, { className: "size-4" }), g("forms.formActions.saveChanges")]
+			}), /* @__PURE__ */ H(a, {
 				type: "button",
 				variant: "outline",
 				size: "sm",
-				onClick: s,
-				children: [/* @__PURE__ */ I(W, { className: "size-4" }), h("forms.formActions.cancel")]
+				onClick: c,
+				children: [/* @__PURE__ */ V(Oe, { className: "size-4" }), g("forms.formActions.cancel")]
 			})] })
-		}), o] })
-	}), /* @__PURE__ */ I(at, {
-		title: p,
-		badges: m,
-		actions: c,
-		onCancel: s,
-		loading: l,
-		disabled: g,
-		dirty: u,
-		titleMissing: d
+		}), s] })
+	}), /* @__PURE__ */ V(Kt, {
+		title: m,
+		badges: h,
+		actions: l,
+		onCancel: c,
+		loading: u,
+		disabled: _,
+		dirty: d,
+		titleMissing: f
 	})] });
 }
 //#endregion
 //#region src/bento/bento-form-section.tsx
-function st({ icon: t, tone: n, title: r, description: i, children: a, trailing: o, as: s = "h2", className: c }) {
-	return /* @__PURE__ */ L("section", {
-		className: e("bento-tile bento-glass relative flex flex-col gap-5 overflow-hidden rounded-3xl p-5 md:p-6", c),
-		children: [/* @__PURE__ */ L("header", {
+var Jt = "bento-tile bento-glass relative flex flex-col gap-5 overflow-hidden rounded-3xl p-5 md:p-6";
+function Yt({ icon: t, tone: n, title: r, description: i, children: a, trailing: o, as: s = "h2", className: c }) {
+	return /* @__PURE__ */ H("section", {
+		className: e(Jt, c),
+		children: [/* @__PURE__ */ H("header", {
 			className: "flex items-start justify-between gap-3",
-			children: [/* @__PURE__ */ L("div", {
+			children: [/* @__PURE__ */ H("div", {
 				className: "flex items-center gap-3",
-				children: [/* @__PURE__ */ I("span", {
-					className: `grid h-10 w-10 place-items-center rounded-2xl text-white shadow-md ${Y(n)}`,
-					children: /* @__PURE__ */ I(t, { size: 20 })
-				}), /* @__PURE__ */ L("div", {
+				children: [/* @__PURE__ */ V("span", {
+					className: `grid h-10 w-10 place-items-center rounded-2xl text-white shadow-md ${Q(n)}`,
+					children: /* @__PURE__ */ V(t, { size: 20 })
+				}), /* @__PURE__ */ H("div", {
 					className: "flex flex-col gap-0.5",
-					children: [/* @__PURE__ */ I(s, {
+					children: [/* @__PURE__ */ V(s, {
 						className: "text-base font-semibold tracking-tight md:text-lg",
 						children: r
-					}), i && /* @__PURE__ */ I("p", {
+					}), i && /* @__PURE__ */ V("p", {
 						className: "text-sm text-muted-foreground",
 						children: i
 					})]
 				})]
-			}), o && /* @__PURE__ */ I("div", {
+			}), o && /* @__PURE__ */ V("div", {
 				className: "shrink-0",
 				children: o
 			})]
-		}), /* @__PURE__ */ I("div", {
+		}), /* @__PURE__ */ V("div", {
 			className: "flex flex-col gap-5",
 			children: a
 		})]
@@ -1014,10 +1769,10 @@ function st({ icon: t, tone: n, title: r, description: i, children: a, trailing:
 }
 //#endregion
 //#region src/bento/bento-panel.tsx
-function ct({ children: t, className: n, contentClassName: r }) {
-	return /* @__PURE__ */ I("div", {
+function Xt({ children: t, className: n, contentClassName: r }) {
+	return /* @__PURE__ */ V("div", {
 		className: e("bento-glass rounded-2xl shadow-md", n),
-		children: /* @__PURE__ */ I("div", {
+		children: /* @__PURE__ */ V("div", {
 			className: r,
 			children: t
 		})
@@ -1025,46 +1780,46 @@ function ct({ children: t, className: n, contentClassName: r }) {
 }
 //#endregion
 //#region src/bento/bento-back-to-top.tsx
-var lt = 480;
-function ut(e) {
+var Zt = 480;
+function Qt(e) {
 	return window.addEventListener("scroll", e, { passive: !0 }), () => window.removeEventListener("scroll", e);
 }
-function dt() {
-	return window.scrollY > lt;
+function $t() {
+	return window.scrollY > Zt;
 }
-function ft() {
-	let { t: e } = R(), t = ee(ut, dt, () => !1);
-	return /* @__PURE__ */ I("button", {
+function en({ inline: e = !1 } = {}) {
+	let { t } = U(), n = w(), r = e || n, i = ie(Qt, $t, () => !1);
+	return /* @__PURE__ */ V("button", {
 		type: "button",
-		"aria-label": e("bento.backToTop", { defaultValue: "Back to top" }),
-		tabIndex: t ? 0 : -1,
+		"aria-label": t("bento.backToTop", { defaultValue: "Back to top" }),
+		tabIndex: i ? 0 : -1,
 		onClick: () => window.scrollTo({
 			top: 0,
 			behavior: "smooth"
 		}),
-		className: `fixed bottom-6 right-6 z-40 grid h-11 w-11 place-items-center rounded-full border border-border/60 bg-card/80 text-foreground shadow-lg backdrop-blur-xl transition-all duration-300 ease-[cubic-bezier(0.32,0.72,0,1)] hover:-translate-y-0.5 hover:shadow-xl active:scale-95 ${t ? "translate-y-0 scale-100 opacity-100" : "pointer-events-none translate-y-4 scale-90 opacity-0"}`,
-		children: /* @__PURE__ */ I(ie, { size: 18 })
+		className: `${r ? "relative" : "fixed bottom-6 right-6 z-40"} grid h-11 w-11 place-items-center rounded-full border border-border/60 bg-card/80 text-foreground shadow-lg backdrop-blur-xl transition-all duration-300 ease-[cubic-bezier(0.32,0.72,0,1)] hover:-translate-y-0.5 hover:shadow-xl active:scale-95 ${i ? "pointer-events-auto translate-y-0 scale-100 opacity-100" : "pointer-events-none translate-y-4 scale-90 opacity-0"}`,
+		children: /* @__PURE__ */ V(ue, { size: 18 })
 	});
 }
 //#endregion
 //#region src/bento/bento-nav.ts
-function pt(e) {
+function tn(e) {
 	return e.bentoRoute ?? e.fallbackRoute;
 }
 //#endregion
 //#region src/bento/bento-command-palette.tsx
-function mt({ label: e, children: t }) {
-	return e ? /* @__PURE__ */ L("div", {
+function nn({ label: e, children: t }) {
+	return e ? /* @__PURE__ */ H("div", {
 		role: "group",
 		"aria-label": e,
-		children: [/* @__PURE__ */ I("p", {
+		children: [/* @__PURE__ */ V("p", {
 			className: "px-3 pt-2 pb-1 text-xs font-medium text-muted-foreground",
 			children: e
 		}), t]
-	}) : /* @__PURE__ */ I(F, { children: t });
+	}) : /* @__PURE__ */ V(B, { children: t });
 }
-function ht({ index: e, active: t, icon: n, label: r, description: i, trailing: a, onActivate: o, onChoose: s }) {
-	return /* @__PURE__ */ L("button", {
+function rn({ index: e, active: t, icon: n, label: r, description: i, trailing: a, onActivate: o, onChoose: s }) {
+	return /* @__PURE__ */ H("button", {
 		type: "button",
 		id: `bento-palette-opt-${e}`,
 		"data-index": e,
@@ -1074,18 +1829,18 @@ function ht({ index: e, active: t, icon: n, label: r, description: i, trailing:
 		onClick: s,
 		className: `flex w-full items-center gap-3 rounded-xl px-3 py-2.5 text-left text-sm transition-colors ${t ? "bg-accent text-accent-foreground" : "text-foreground"}`,
 		children: [
-			n && /* @__PURE__ */ I(n, {
+			n && /* @__PURE__ */ V(n, {
 				size: 18,
 				className: "shrink-0 text-muted-foreground"
 			}),
-			/* @__PURE__ */ L("span", {
+			/* @__PURE__ */ H("span", {
 				className: "flex-1 truncate",
-				children: [r, i && /* @__PURE__ */ I("span", {
+				children: [r, i && /* @__PURE__ */ V("span", {
 					className: "ml-2 text-muted-foreground",
 					children: i
 				})]
 			}),
-			a ?? (t && /* @__PURE__ */ I(re, {
+			a ?? (t && /* @__PURE__ */ V(le, {
 				"aria-hidden": !0,
 				size: 15,
 				className: "shrink-0 text-muted-foreground"
@@ -1093,12 +1848,12 @@ function ht({ index: e, active: t, icon: n, label: r, description: i, trailing:
 		]
 	});
 }
-function gt({ open: e, onOpenChange: r, items: a, group: o, onQueryChange: s }) {
-	let { t: c } = R(), l = q(), [u, d] = P(""), [p, m] = P(0), h = N(null), g = M(() => {
-		let e = u.trim().toLowerCase(), t = a.map((e) => ({
+function an({ open: e, onOpenChange: t, items: a, group: o, onQueryChange: c }) {
+	let { t: l } = U(), u = Me(), [d, f] = z(""), [p, m] = z(0), h = R(null), g = L(() => {
+		let e = d.trim().toLowerCase(), t = a.map((e) => ({
 			item: e,
-			label: c(e.titleKey),
-			description: c(e.descriptionKey)
+			label: l(e.titleKey),
+			description: l(e.descriptionKey)
 		}));
 		if (!e) return t;
 		let n = [], r = [];
@@ -1106,28 +1861,28 @@ function gt({ open: e, onOpenChange: r, items: a, group: o, onQueryChange: s })
 		return [...n, ...r];
 	}, [
 		a,
-		u,
-		c
-	]), _ = M(() => [...g.map((e) => ({
+		d,
+		l
+	]), _ = L(() => [...g.map((e) => ({
 		kind: "nav",
 		entry: e
 	})), ...(o?.items ?? []).map((e) => ({
 		kind: "supplied",
 		item: e
-	}))], [g, o]), v = N(s);
-	j(() => {
-		v.current = s;
-	}), j(() => {
-		v.current?.(u);
-	}, [u]);
-	let [y, b] = P(e);
-	e !== y && (b(e), e && (d(""), m(0)));
+	}))], [g, o]), v = R(c);
+	F(() => {
+		v.current = c;
+	}), F(() => {
+		v.current?.(d);
+	}, [d]);
+	let [y, b] = z(e);
+	e !== y && (b(e), e && (f(""), m(0)));
 	let x = _.length === 0 ? 0 : _.length - 1;
-	p > x && m(x), j(() => {
+	p > x && m(x), F(() => {
 		(h.current?.querySelector(`[data-index="${p}"]`))?.scrollIntoView({ block: "nearest" });
 	}, [p]);
 	function S(e) {
-		r(!1), e.kind === "nav" ? l(pt(e.entry.item)) : o?.onSelect(e.item);
+		t(!1), e.kind === "nav" ? u(tn(e.entry.item)) : o?.onSelect(e.item);
 	}
 	function C(e) {
 		if (e.key === "ArrowDown") e.preventDefault(), m((e) => _.length === 0 ? 0 : (e + 1) % _.length);
@@ -1138,75 +1893,75 @@ function gt({ open: e, onOpenChange: r, items: a, group: o, onQueryChange: s })
 			t && S(t);
 		}
 	}
-	return /* @__PURE__ */ I(n, {
+	return /* @__PURE__ */ V(n, {
 		open: e,
-		onOpenChange: r,
-		children: /* @__PURE__ */ L(f, {
+		onOpenChange: t,
+		children: /* @__PURE__ */ H(s, {
 			showCloseButton: !1,
 			className: "top-[15%] max-w-xl translate-y-0 gap-0 overflow-hidden p-0",
 			onKeyDown: C,
 			children: [
-				/* @__PURE__ */ I(i, {
+				/* @__PURE__ */ V(i, {
 					className: "sr-only",
-					children: c("bento.palette.title", { defaultValue: "Command palette" })
+					children: l("bento.palette.title", { defaultValue: "Command palette" })
 				}),
-				/* @__PURE__ */ I(t, {
+				/* @__PURE__ */ V(r, {
 					className: "sr-only",
-					children: c("bento.palette.description", { defaultValue: "Search and jump to any area" })
+					children: l("bento.palette.description", { defaultValue: "Search and jump to any area" })
 				}),
-				/* @__PURE__ */ L("div", {
+				/* @__PURE__ */ H("div", {
 					className: "flex items-center gap-3 border-b border-border/60 px-4",
-					children: [/* @__PURE__ */ I(ge, {
+					children: [/* @__PURE__ */ V(Se, {
 						size: 18,
 						className: "shrink-0 text-muted-foreground"
-					}), /* @__PURE__ */ I("input", {
+					}), /* @__PURE__ */ V("input", {
 						autoFocus: !0,
 						type: "text",
 						role: "combobox",
 						"aria-expanded": "true",
 						"aria-controls": "bento-palette-list",
 						"aria-activedescendant": _[p] ? `bento-palette-opt-${p}` : void 0,
-						value: u,
-						onChange: (e) => d(e.target.value),
-						placeholder: c("bento.palette.placeholder", { defaultValue: "Search areas…" }),
+						value: d,
+						onChange: (e) => f(e.target.value),
+						placeholder: l("bento.palette.placeholder", { defaultValue: "Search areas…" }),
 						className: "h-12 w-full bg-transparent text-sm outline-none placeholder:text-muted-foreground"
 					})]
 				}),
-				/* @__PURE__ */ L("div", {
+				/* @__PURE__ */ H("div", {
 					ref: h,
 					id: "bento-palette-list",
 					role: "listbox",
-					"aria-label": c("bento.palette.title", { defaultValue: "Command palette" }),
+					"aria-label": l("bento.palette.title", { defaultValue: "Command palette" }),
 					className: "max-h-80 overflow-y-auto p-2",
 					children: [
-						_.length === 0 && !o?.pending && /* @__PURE__ */ I("p", {
+						_.length === 0 && !o?.pending && /* @__PURE__ */ V("p", {
 							className: "px-3 py-6 text-center text-sm text-muted-foreground",
-							children: c("bento.palette.noResults", { defaultValue: "No matches" })
+							children: l("bento.palette.noResults", { defaultValue: "No matches" })
 						}),
-						/* @__PURE__ */ I(mt, {
-							label: o && g.length > 0 ? c("bento.palette.areas", { defaultValue: "Areas" }) : void 0,
-							children: g.map(({ item: e, label: t }, n) => /* @__PURE__ */ I(ht, {
+						/* @__PURE__ */ V(nn, {
+							label: o && g.length > 0 ? l("bento.palette.areas", { defaultValue: "Areas" }) : void 0,
+							children: g.map(({ item: e, label: t }, n) => /* @__PURE__ */ V(rn, {
 								index: n,
 								active: n === p,
 								icon: e.icon,
 								label: t,
 								onActivate: () => m(n),
 								onChoose: () => S(_[n]),
-								trailing: e.bentoRoute ? void 0 : /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I(ce, {
+								trailing: e.bentoRoute ? void 0 : /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V(J, {
 									"aria-hidden": !0,
 									size: 15,
 									className: "shrink-0 text-muted-foreground/70"
-								}), /* @__PURE__ */ I("span", {
+								}), /* @__PURE__ */ V("span", {
 									className: "sr-only",
-									children: c("bento.palette.opensConsole", { defaultValue: "Opens in console" })
+									children: l("bento.palette.opensConsole", { defaultValue: "Opens in console" })
 								})] })
 							}, e.id))
 						}),
-						o && /* @__PURE__ */ L(mt, {
+						o && /* @__PURE__ */ H(nn, {
 							label: o.label,
 							children: [o.items.map((e, t) => {
 								let n = g.length + t;
-								return /* @__PURE__ */ I(ht, {
+								return /* @__PURE__ */ V(rn, {
 									index: n,
 									active: n === p,
 									icon: e.icon,
@@ -1215,9 +1970,9 @@ function gt({ open: e, onOpenChange: r, items: a, group: o, onQueryChange: s })
 									onActivate: () => m(n),
 									onChoose: () => S(_[n])
 								}, e.id);
-							}), o.pending && /* @__PURE__ */ I("p", {
+							}), o.pending && /* @__PURE__ */ V("p", {
 								className: "px-3 py-2.5 text-sm text-muted-foreground",
-								children: c("bento.palette.searching", { defaultValue: "Searching…" })
+								children: l("bento.palette.searching", { defaultValue: "Searching…" })
 							})]
 						})
 					]
@@ -1227,65 +1982,233 @@ function gt({ open: e, onOpenChange: r, items: a, group: o, onQueryChange: s })
 	});
 }
 //#endregion
+//#region src/bento/bento-shell.tsx
+function on({ rail: t, headerStart: n, headerEnd: r, column: i = "default", dock: a, backToTop: o = !0, children: s }) {
+	let { t: c } = U(), l = Ae(), u = I(), d = R(null), f = R(null), p = i === "full", m = n != null || r != null, h = o || a != null;
+	return /* @__PURE__ */ H("div", {
+		"data-slot": "bento-shell",
+		className: e("relative w-full bg-background text-foreground", t != null && "bento-rail-gutter", p ? "flex h-svh flex-col overflow-hidden" : "min-h-svh"),
+		children: [
+			/* @__PURE__ */ V("a", {
+				href: `#${u}`,
+				onClick: (e) => {
+					e.preventDefault(), d.current?.focus();
+				},
+				className: "sr-only rounded-full border border-border/60 bg-card px-4 py-2 text-sm shadow-lg focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-[60]",
+				children: c("bento.shell.skip", { defaultValue: "Skip to content" })
+			}),
+			/* @__PURE__ */ V("span", {
+				ref: f,
+				role: "status",
+				"aria-live": "polite",
+				className: "sr-only"
+			}),
+			l && /* @__PURE__ */ V(sn, {
+				main: d,
+				announcer: f
+			}),
+			t,
+			m && /* @__PURE__ */ H("header", {
+				className: "bento-shell-header bento-shell-bar sticky top-0 z-30 flex shrink-0 items-center justify-between gap-3 border-b border-border/40 bg-background/55 py-3 backdrop-blur-xl backdrop-saturate-150",
+				children: [/* @__PURE__ */ V("div", {
+					className: "flex min-w-0 items-center gap-3",
+					children: n
+				}), /* @__PURE__ */ V("div", {
+					className: "flex items-center gap-2",
+					children: r
+				})]
+			}),
+			/* @__PURE__ */ V("main", {
+				ref: d,
+				id: u,
+				tabIndex: -1,
+				"aria-label": c("bento.shell.main", { defaultValue: "Main content" }),
+				"data-column": i,
+				className: "bento-shell-main",
+				children: s
+			}),
+			h && /* @__PURE__ */ V("div", {
+				"data-slot": "bento-shell-corner",
+				className: "pointer-events-none fixed bottom-5 right-5 z-50 flex flex-col items-end gap-3",
+				children: /* @__PURE__ */ H(k.Provider, {
+					value: !0,
+					children: [o && /* @__PURE__ */ V(en, {}), a]
+				})
+			})
+		]
+	});
+}
+function sn({ main: e, announcer: t }) {
+	let { pathname: n } = je(), r = R(n);
+	return F(() => {
+		if (r.current === n) return;
+		r.current = n;
+		let i = 0, a, o = () => {
+			let n = e.current?.querySelector("h1") ?? null;
+			if (!n && i++ < 20) {
+				a = setTimeout(o, 50);
+				return;
+			}
+			n && !n.hasAttribute("tabindex") && n.setAttribute("tabindex", "-1"), (n ?? e.current)?.focus(), t.current && (t.current.textContent = n?.textContent?.trim() || document.title);
+		};
+		return o(), () => clearTimeout(a);
+	}, [
+		n,
+		e,
+		t
+	]), null;
+}
+//#endregion
+//#region src/bento/bento-shell-shortcuts.ts
+var cn = Object.freeze([
+	{
+		action: "palette",
+		key: "k",
+		mod: !0
+	},
+	{
+		action: "palette",
+		key: "/"
+	},
+	{
+		action: "shortcuts",
+		key: "?"
+	}
+]);
+function ln() {
+	return typeof navigator > "u" ? !1 : /Mac|iPhone|iPad|iPod/.test(navigator.platform || navigator.userAgent || "");
+}
+function un(e, t) {
+	let n = e.key.length === 1 ? e.key.toUpperCase() : e.key;
+	return e.mod ? [t ? "⌘" : "Ctrl", n] : [n];
+}
+function dn(e) {
+	if (!(e instanceof HTMLElement)) return !1;
+	if ([
+		"INPUT",
+		"TEXTAREA",
+		"SELECT"
+	].includes(e.tagName) || e.isContentEditable) return !0;
+	let t = e.closest("[contenteditable]");
+	return t !== null && t.getAttribute("contenteditable") !== "false";
+}
+function fn(e, t) {
+	if (e.defaultPrevented || e.isComposing || e.repeat) return;
+	let n = e.key.toLowerCase();
+	return cn.find((r) => n === r.key ? r.mod ? (t ? e.metaKey && !e.ctrlKey : e.ctrlKey && !e.metaKey) && !e.altKey && !e.shiftKey : e.metaKey || dn(e.target) ? !1 : e.ctrlKey === e.altKey : !1);
+}
+function pn({ onPalette: e, onShortcuts: t, isMac: n = ln() }) {
+	let r = R({
+		onPalette: e,
+		onShortcuts: t
+	});
+	F(() => {
+		r.current = {
+			onPalette: e,
+			onShortcuts: t
+		};
+	}), F(() => {
+		function e(e) {
+			let t = fn(e, n), i = t?.action === "palette" ? r.current.onPalette : t && r.current.onShortcuts;
+			i && (e.preventDefault(), i());
+		}
+		return globalThis.addEventListener("keydown", e), () => globalThis.removeEventListener("keydown", e);
+	}, [n]);
+}
+//#endregion
+//#region src/bento/bento-palette-trigger.tsx
+function mn({ onClick: t, isMac: n = ln(), className: r }) {
+	let { t: i } = U(), a = cn.filter((e) => e.action === "palette"), o = a.find((e) => e.mod);
+	return /* @__PURE__ */ H("button", {
+		type: "button",
+		onClick: t,
+		"aria-keyshortcuts": a.map((e) => e.mod ? `${n ? "Meta" : "Control"}+${e.key.toUpperCase()}` : e.key).join(" "),
+		className: e("bento-tile bento-tile-clickable inline-flex items-center gap-2 rounded-full border border-border/60 bg-card/60 py-1.5 pl-3 pr-2 text-sm text-muted-foreground backdrop-blur hover:text-foreground", r),
+		children: [
+			/* @__PURE__ */ V(Se, {
+				"aria-hidden": !0,
+				size: 16
+			}),
+			/* @__PURE__ */ V("span", {
+				className: "sr-only sm:not-sr-only",
+				children: i("bento.palette.search", { defaultValue: "Search" })
+			}),
+			o && /* @__PURE__ */ V("kbd", {
+				"aria-hidden": !0,
+				className: "hidden rounded border border-border/60 bg-muted px-1.5 py-0.5 text-[10px] font-medium tracking-wide sm:inline",
+				children: un(o, n).join(n ? "" : " ")
+			})
+		]
+	});
+}
+//#endregion
 //#region src/bento/bento-shortcuts-dialog.tsx
-function _t({ open: e, onOpenChange: r, isMac: o }) {
-	let { t: s } = R(), c = o ? "⌘" : "Ctrl", l = [{
-		heading: s("bento.shortcuts.global", { defaultValue: "Global" }),
-		rows: [{
-			keys: [c, "K"],
-			label: s("bento.palette.open", { defaultValue: "Open command palette" })
-		}, {
-			keys: ["?"],
-			label: s("bento.shortcuts.openGuide", { defaultValue: "Show keyboard shortcuts" })
-		}]
+function hn({ open: e, onOpenChange: t, isMac: a = ln() }) {
+	let { t: c } = U(), l = {
+		palette: c("bento.palette.open", { defaultValue: "Open command palette" }),
+		shortcuts: c("bento.shortcuts.openGuide", { defaultValue: "Show keyboard shortcuts" })
+	}, u = [...new Set(cn.map((e) => e.action))], d = [{
+		heading: c("bento.shortcuts.global", { defaultValue: "Global" }),
+		rows: u.map((e) => ({
+			id: e,
+			label: l[e],
+			combos: cn.filter((t) => t.action === e).map((e) => un(e, a))
+		}))
 	}, {
-		heading: s("bento.shortcuts.palette", { defaultValue: "Command palette" }),
+		heading: c("bento.shortcuts.palette", { defaultValue: "Command palette" }),
 		rows: [
 			{
-				keys: ["↑", "↓"],
-				label: s("bento.shortcuts.navigate", { defaultValue: "Move between results" })
+				id: "navigate",
+				combos: [["↑", "↓"]],
+				label: c("bento.shortcuts.navigate", { defaultValue: "Move between results" })
 			},
 			{
-				keys: ["↵"],
-				label: s("bento.shortcuts.openSelected", { defaultValue: "Open the selected area" })
+				id: "open",
+				combos: [["↵"]],
+				label: c("bento.shortcuts.openSelected", { defaultValue: "Open the selected area" })
 			},
 			{
-				keys: ["Esc"],
-				label: s("bento.shortcuts.dismiss", { defaultValue: "Close the palette or a dialog" })
+				id: "dismiss",
+				combos: [["Esc"]],
+				label: c("bento.shortcuts.dismiss", { defaultValue: "Close the palette or a dialog" })
 			}
 		]
 	}];
-	return /* @__PURE__ */ I(n, {
+	return /* @__PURE__ */ V(n, {
 		open: e,
-		onOpenChange: r,
-		children: /* @__PURE__ */ L(f, {
+		onOpenChange: t,
+		children: /* @__PURE__ */ H(s, {
 			className: "max-w-md",
-			children: [/* @__PURE__ */ L(a, { children: [/* @__PURE__ */ L(i, {
+			children: [/* @__PURE__ */ H(o, { children: [/* @__PURE__ */ H(i, {
 				className: "flex items-center gap-2",
-				children: [/* @__PURE__ */ I(de, {
+				children: [/* @__PURE__ */ V(Y, {
 					size: 20,
 					className: "bento-accent-icon"
-				}), s("bento.shortcuts.title", { defaultValue: "Keyboard shortcuts" })]
-			}), /* @__PURE__ */ I(t, { children: s("bento.shortcuts.description", { defaultValue: "Move around without leaving the keyboard." }) })] }), /* @__PURE__ */ I("div", {
+				}), c("bento.shortcuts.title", { defaultValue: "Keyboard shortcuts" })]
+			}), /* @__PURE__ */ V(r, { children: c("bento.shortcuts.description", { defaultValue: "Move around without leaving the keyboard." }) })] }), /* @__PURE__ */ V("div", {
 				className: "flex flex-col gap-5",
-				children: l.map((e) => /* @__PURE__ */ L("section", { children: [/* @__PURE__ */ I("h3", {
+				children: d.map((e) => /* @__PURE__ */ H("section", { children: [/* @__PURE__ */ V("h3", {
 					className: "mb-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground",
 					children: e.heading
-				}), /* @__PURE__ */ I("ul", {
+				}), /* @__PURE__ */ V("ul", {
 					className: "flex flex-col gap-1.5",
-					children: e.rows.map((e) => /* @__PURE__ */ L("li", {
+					children: e.rows.map((e) => /* @__PURE__ */ H("li", {
+						"data-shortcut": e.id,
 						className: "flex items-center justify-between gap-4",
-						children: [/* @__PURE__ */ I("span", {
+						children: [/* @__PURE__ */ V("span", {
 							className: "text-sm text-foreground",
 							children: e.label
-						}), /* @__PURE__ */ I("span", {
+						}), /* @__PURE__ */ V("span", {
 							className: "flex shrink-0 items-center gap-1",
-							children: e.keys.map((e) => /* @__PURE__ */ I("kbd", {
+							children: e.combos.map((e, t) => /* @__PURE__ */ H(ne, { children: [t > 0 && /* @__PURE__ */ V("span", {
+								className: "px-0.5 text-[11px] text-muted-foreground",
+								children: c("bento.shortcuts.or", { defaultValue: "or" })
+							}), e.map((e) => /* @__PURE__ */ V("kbd", {
 								className: "inline-flex min-w-6 items-center justify-center rounded-md border border-border/60 bg-muted px-1.5 py-0.5 text-[11px] font-medium tracking-wide",
 								children: e
-							}, e))
+							}, e))] }, e.join("+")))
 						})]
-					}, e.label))
+					}, e.id))
 				})] }, e.heading))
 			})]
 		})
@@ -1293,158 +2216,148 @@ function _t({ open: e, onOpenChange: r, isMac: o }) {
 }
 //#endregion
 //#region src/bento/bento-nav-rail.tsx
-var vt = fe;
-function yt(e, t) {
+var gn = ve;
+function _n(e, t) {
 	return e === t || e.startsWith(`${t}/`);
 }
-function bt(e, t) {
-	return t.section.areaRoute && yt(e, t.section.areaRoute) ? !0 : t.items.some((t) => t.bentoRoute && yt(e, t.bentoRoute));
+function vn(e, t) {
+	return t.section.areaRoute && _n(e, t.section.areaRoute) ? !0 : t.items.some((t) => t.bentoRoute && _n(e, t.bentoRoute));
 }
-function xt({ groups: e, homeRoute: t, homeAliases: n, homeLabel: r }) {
-	let { t: i } = R(), { pathname: a } = be(), o = M(() => e.filter((e) => !!e.section.areaRoute), [e]), s = a === t || (n?.includes(a) ?? !1);
-	return /* @__PURE__ */ I(h, {
+function yn({ groups: e, homeRoute: t, homeAliases: n, homeLabel: r }) {
+	let { t: i } = U(), { pathname: a } = je(), o = L(() => e.filter((e) => !!e.section.areaRoute), [e]), s = a === t || (n?.includes(a) ?? !1);
+	return /* @__PURE__ */ V(x, {
 		delayDuration: 200,
-		children: /* @__PURE__ */ L("nav", {
+		children: /* @__PURE__ */ H("nav", {
 			"aria-label": i("bento.nav.label", { defaultValue: "Primary" }),
 			className: "fixed inset-y-0 left-0 z-40 hidden w-16 flex-col items-center gap-1 overflow-y-auto overflow-x-hidden border-r border-border/40 bg-background/55 pt-20 pb-4 backdrop-blur-xl backdrop-saturate-150 md:flex",
 			children: [
-				/* @__PURE__ */ I(St, {
+				/* @__PURE__ */ V(bn, {
 					to: t,
-					icon: ue,
+					icon: _e,
 					label: r ?? i("home.title", { defaultValue: "Home" }),
 					active: s
 				}),
-				o.length > 0 && /* @__PURE__ */ I("span", {
+				o.length > 0 && /* @__PURE__ */ V("span", {
 					"aria-hidden": !0,
 					className: "my-1 h-px w-6 bg-border/60"
 				}),
-				o.map((e) => /* @__PURE__ */ I(St, {
+				o.map((e) => /* @__PURE__ */ V(bn, {
 					to: e.section.areaRoute,
-					icon: e.section.icon ?? vt,
+					icon: e.section.icon ?? gn,
 					label: e.section.labelKey ? i(e.section.labelKey) : e.section.id,
-					active: bt(a, e)
+					active: vn(a, e)
 				}, e.section.id))
 			]
 		})
 	});
 }
-function St({ to: e, icon: t, label: n, active: r }) {
-	return /* @__PURE__ */ L(d, { children: [/* @__PURE__ */ I(g, {
+function bn({ to: e, icon: t, label: n, active: r }) {
+	return /* @__PURE__ */ H(E, { children: [/* @__PURE__ */ V(S, {
 		asChild: !0,
-		children: /* @__PURE__ */ I(K, {
+		children: /* @__PURE__ */ V(Z, {
 			to: e,
 			"aria-label": n,
 			"aria-current": r ? "page" : void 0,
 			className: `bento-tile-clickable grid h-11 w-11 shrink-0 place-items-center rounded-2xl border transition-colors duration-200 ${r ? "bento-rail-active" : "border-transparent text-muted-foreground hover:border-border/60 hover:bg-card/60 hover:text-foreground"}`,
-			children: /* @__PURE__ */ I(t, { size: 20 })
+			children: /* @__PURE__ */ V(t, { size: 20 })
 		})
-	}), /* @__PURE__ */ I(s, {
+	}), /* @__PURE__ */ V(A, {
 		side: "right",
 		children: n
 	})] });
 }
 //#endregion
 //#region src/bento/bento-user-menu.tsx
-function Ct({ accountRoute: e, logoutUrl: t, organizationsRoute: n, tenantAdminRoute: i, onOpenShortcuts: a, onReplayTour: s }) {
-	let { user: d, status: f } = b(), { t: p } = R(), h = q(), g = `${d.firstName ?? ""} ${d.lastName ?? ""}`.trim() || d.username || "";
-	return f === "loading" ? /* @__PURE__ */ I("div", {
+function xn({ accountRoute: e, logoutUrl: t, organizationsRoute: n, tenantAdminRoute: r, onOpenShortcuts: i, onReplayTour: a }) {
+	let { user: o, status: s } = D(), { t: c } = U(), h = Me(), g = `${o.firstName ?? ""} ${o.lastName ?? ""}`.trim() || o.username || "";
+	return s === "loading" ? /* @__PURE__ */ V("div", {
 		className: "h-9 w-9 rounded-full bg-muted/40",
 		"aria-hidden": !0
-	}) : /* @__PURE__ */ L(c, { children: [/* @__PURE__ */ I(r, {
+	}) : /* @__PURE__ */ H(l, { children: [/* @__PURE__ */ V(f, {
 		asChild: !0,
-		children: /* @__PURE__ */ I("button", {
+		children: /* @__PURE__ */ V("button", {
 			type: "button",
-			title: g || d.username,
+			title: g || o.username,
 			className: "bento-tile-clickable cursor-pointer rounded-full p-0.5 ring-1 ring-border/60 outline-none transition-shadow duration-300 ease-[cubic-bezier(0.32,0.72,0,1)] bento-ring hover:ring-2 focus-visible:ring-2 focus-visible:ring-ring",
-			children: /* @__PURE__ */ I(S, {
-				givenName: d.firstName,
-				familyName: d.lastName,
-				name: g || d.username,
-				src: d.avatarUrl || void 0,
-				alt: d.username
+			children: /* @__PURE__ */ V(y, {
+				givenName: o.firstName,
+				familyName: o.lastName,
+				name: g || o.username,
+				src: o.avatarUrl || void 0,
+				alt: o.username
 			})
 		})
-	}), /* @__PURE__ */ L(m, {
+	}), /* @__PURE__ */ H(_, {
 		align: "end",
 		sideOffset: 10,
 		className: "bento-dropdown min-w-64 p-2",
 		children: [
-			/* @__PURE__ */ I(o, {
+			/* @__PURE__ */ V(m, {
 				className: "p-0 font-normal",
-				children: /* @__PURE__ */ L("div", {
+				children: /* @__PURE__ */ H("div", {
 					className: "flex items-center gap-3 rounded-xl px-2 py-2 text-left text-sm",
-					children: [/* @__PURE__ */ I("span", {
+					children: [/* @__PURE__ */ V("span", {
 						className: "rounded-full p-0.5 ring-1 ring-border/60",
-						children: /* @__PURE__ */ I(S, {
-							givenName: d.firstName,
-							familyName: d.lastName,
-							name: g || d.username,
-							src: d.avatarUrl || void 0,
-							alt: d.username
+						children: /* @__PURE__ */ V(y, {
+							givenName: o.firstName,
+							familyName: o.lastName,
+							name: g || o.username,
+							src: o.avatarUrl || void 0,
+							alt: o.username
 						})
-					}), /* @__PURE__ */ L("div", {
+					}), /* @__PURE__ */ H("div", {
 						className: "grid flex-1 text-left text-sm leading-tight",
-						children: [g && /* @__PURE__ */ I("span", {
+						children: [g && /* @__PURE__ */ V("span", {
 							className: "truncate font-medium",
 							children: g
-						}), d.email && /* @__PURE__ */ I("span", {
+						}), o.email && /* @__PURE__ */ V("span", {
 							className: "truncate text-xs text-muted-foreground",
-							children: d.email
+							children: o.email
 						})]
 					})]
 				})
 			}),
-			/* @__PURE__ */ I(v, { className: "my-1.5 bg-border/50" }),
-			/* @__PURE__ */ L(u, { children: [
-				/* @__PURE__ */ L(l, {
+			/* @__PURE__ */ V(p, { className: "my-1.5 bg-border/50" }),
+			/* @__PURE__ */ H(d, { children: [
+				/* @__PURE__ */ H(u, {
 					onSelect: () => h(e),
 					className: "bento-dropdown-item cursor-pointer gap-2 px-3 py-2",
-					children: [/* @__PURE__ */ I(ve, { size: 18 }), p("nav.account")]
+					children: [/* @__PURE__ */ V(Ee, { size: 18 }), c("nav.account")]
 				}),
-				n && /* @__PURE__ */ L(l, {
+				n && /* @__PURE__ */ H(u, {
 					onSelect: () => h(n),
 					className: "bento-dropdown-item cursor-pointer gap-2 px-3 py-2",
-					children: [/* @__PURE__ */ I(ae, { size: 18 }), p("nav.organizations", { defaultValue: "Organizations" })]
+					children: [/* @__PURE__ */ V(fe, { size: 18 }), c("nav.organizations", { defaultValue: "Organizations" })]
 				}),
-				i && /* @__PURE__ */ L(l, {
-					onSelect: () => h(i),
+				r && /* @__PURE__ */ H(u, {
+					onSelect: () => h(r),
 					className: "bento-dropdown-item cursor-pointer gap-2 px-3 py-2",
-					children: [/* @__PURE__ */ I(oe, { size: 18 }), p("nav.tenantAdmin", { defaultValue: "Tenant administration" })]
+					children: [/* @__PURE__ */ V(G, { size: 18 }), c("nav.tenantAdmin", { defaultValue: "Tenant administration" })]
 				})
 			] }),
-			(a || s) && /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I(v, { className: "my-1.5 bg-border/50" }), /* @__PURE__ */ L(u, { children: [s && /* @__PURE__ */ L(l, {
-				onSelect: () => s(),
-				className: "bento-dropdown-item cursor-pointer gap-2 px-3 py-2",
-				children: [/* @__PURE__ */ I(U, { size: 18 }), p("bento.tour.replay", { defaultValue: "Take the tour" })]
-			}), a && /* @__PURE__ */ L(l, {
+			(i || a) && /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V(p, { className: "my-1.5 bg-border/50" }), /* @__PURE__ */ H(d, { children: [a && /* @__PURE__ */ H(u, {
 				onSelect: () => a(),
 				className: "bento-dropdown-item cursor-pointer gap-2 px-3 py-2",
-				children: [/* @__PURE__ */ I(de, { size: 18 }), p("bento.shortcuts.title", { defaultValue: "Keyboard shortcuts" })]
+				children: [/* @__PURE__ */ V(Ce, { size: 18 }), c("bento.tour.replay", { defaultValue: "Take the tour" })]
+			}), i && /* @__PURE__ */ H(u, {
+				onSelect: () => i(),
+				className: "bento-dropdown-item cursor-pointer gap-2 px-3 py-2",
+				children: [/* @__PURE__ */ V(Y, { size: 18 }), c("bento.shortcuts.title", { defaultValue: "Keyboard shortcuts" })]
 			})] })] }),
-			/* @__PURE__ */ I(v, { className: "my-1.5 bg-border/50" }),
-			/* @__PURE__ */ L(l, {
+			/* @__PURE__ */ V(p, { className: "my-1.5 bg-border/50" }),
+			/* @__PURE__ */ H(u, {
 				onSelect: () => {
 					globalThis.location.href = t;
 				},
 				className: "bento-dropdown-item cursor-pointer gap-2 px-3 py-2 bento-item-danger",
-				children: [/* @__PURE__ */ I(pe, { size: 18 }), p("nav.logOut")]
+				children: [/* @__PURE__ */ V(ye, { size: 18 }), c("nav.logOut")]
 			})
 		]
 	})] });
 }
 //#endregion
 //#region src/bento/bento-section-chrome.tsx
-var wt = O("console");
-function Tt({ chrome: e, children: t }) {
-	return /* @__PURE__ */ I(wt.Provider, {
-		value: e,
-		children: t
-	});
-}
-function Et() {
-	return A(wt);
-}
-var Dt = {
+var Sn = {
 	blue: "blue",
 	violet: "violet",
 	emerald: "emerald",
@@ -1454,58 +2367,62 @@ var Dt = {
 	cyan: "blue",
 	orange: "amber"
 };
-function $({ variant: e = "blue", defaultOpen: t, className: n, children: r }) {
-	let i = A(wt), a, o;
-	return i === "bento" && D.forEach(r, (e) => {
-		if (!k(e)) return;
+function Cn({ variant: t = "blue", className: n, children: r }) {
+	let i;
+	P.forEach(r, (e) => {
+		if (!re(e)) return;
 		let { type: t } = e;
-		t === C.Header || t === C.StaticHeader ? a = e.props : t === C.Content && (o = e.props.children);
-	}), i === "bento" && a ? /* @__PURE__ */ I(st, {
-		icon: a.icon,
-		tone: Dt[e] ?? "blue",
-		title: a.title,
-		description: a.description,
-		className: n,
-		children: o
-	}) : /* @__PURE__ */ I(C, {
-		variant: e,
-		defaultOpen: t,
+		(t === O.Header || t === O.StaticHeader) && (i ??= e.props);
+	});
+	let a = P.map(r, (e) => {
+		if (!re(e)) return e;
+		let { type: t } = e;
+		return t === O.Header || t === O.StaticHeader ? null : t === O.Content ? e.props.children : e;
+	});
+	return i ? /* @__PURE__ */ V(Yt, {
+		icon: i.icon,
+		tone: Sn[t] ?? "blue",
+		title: i.title,
+		description: i.description,
 		className: n,
-		children: r
+		children: a
+	}) : /* @__PURE__ */ V("section", {
+		className: e(Jt, n),
+		children: a
 	});
 }
-$.Header = C.Header, $.StaticHeader = C.StaticHeader, $.Content = C.Content;
+Cn.Header = O.Header, Cn.StaticHeader = O.StaticHeader, Cn.Content = O.Content;
 //#endregion
 //#region src/bento/bento-section.tsx
-var Ot = "bento-grid grid auto-rows-[minmax(140px,auto)] grid-cols-2 gap-4 md:grid-cols-4 md:gap-5 lg:grid-cols-6";
-function kt({ eyebrow: e, title: t, description: n, titleHref: r, children: i, gridClassName: a = Ot }) {
-	let o = /* @__PURE__ */ I("h2", {
+var wn = "bento-grid grid auto-rows-[minmax(140px,auto)] grid-cols-2 gap-4 md:grid-cols-4 md:gap-5 lg:grid-cols-6";
+function Tn({ eyebrow: e, title: t, description: n, titleHref: r, children: i, gridClassName: a = wn }) {
+	let o = /* @__PURE__ */ V("h2", {
 		className: "text-xl font-semibold tracking-tight md:text-2xl",
 		children: t
 	});
-	return /* @__PURE__ */ L("section", {
+	return /* @__PURE__ */ H("section", {
 		className: "mb-8 md:mb-10",
-		children: [/* @__PURE__ */ L("header", {
+		children: [/* @__PURE__ */ H("header", {
 			className: "bento-shell-header mb-4 flex flex-col gap-0.5",
 			children: [
-				e && /* @__PURE__ */ I("span", {
+				e && /* @__PURE__ */ V("span", {
 					className: "text-xs uppercase tracking-[0.18em] text-muted-foreground",
 					children: e
 				}),
-				r ? /* @__PURE__ */ L(K, {
+				r ? /* @__PURE__ */ H(Z, {
 					to: r,
 					className: "group inline-flex w-fit items-center gap-1 text-foreground transition-colors hover:text-primary",
-					children: [o, /* @__PURE__ */ I(V, {
+					children: [o, /* @__PURE__ */ V(K, {
 						size: 20,
 						className: "text-muted-foreground transition-transform duration-300 ease-[cubic-bezier(0.32,0.72,0,1)] group-hover:translate-x-1"
 					})]
 				}) : o,
-				n && /* @__PURE__ */ I("p", {
+				n && /* @__PURE__ */ V("p", {
 					className: "max-w-2xl text-sm text-muted-foreground",
 					children: n
 				})
 			]
-		}), /* @__PURE__ */ I("div", {
+		}), /* @__PURE__ */ V("div", {
 			className: a,
 			children: i
 		})]
@@ -1513,61 +2430,161 @@ function kt({ eyebrow: e, title: t, description: n, titleHref: r, children: i, g
 }
 //#endregion
 //#region src/bento/bento-tile.tsx
-function At({ to: t, onClick: n, disabled: r = !1, disabledHint: i, icon: a, tone: o, eyebrow: s, title: c, span: l, featured: u = !1, children: d }) {
-	let f = !r && !!(t || n), p = u ? "h-14 w-14 rounded-2xl" : "h-9 w-9 rounded-2xl", m = u ? 28 : 18, h = u ? "text-xl font-semibold tracking-tight md:text-2xl" : "text-base font-semibold tracking-tight md:text-lg", g = /* @__PURE__ */ L(F, { children: [
-		u && /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I("div", {
+function En({ to: t, onClick: n, disabled: r = !1, disabledHint: i, icon: a, tone: o, eyebrow: s, title: c, span: l, featured: u = !1, children: d }) {
+	let f = !r && !!(t || n), p = u ? "h-14 w-14 rounded-2xl" : "h-9 w-9 rounded-2xl", m = u ? 28 : 18, h = u ? "text-xl font-semibold tracking-tight md:text-2xl" : "text-base font-semibold tracking-tight md:text-lg", g = /* @__PURE__ */ H(B, { children: [
+		u && /* @__PURE__ */ H(B, { children: [/* @__PURE__ */ V("div", {
 			"aria-hidden": !0,
-			className: `pointer-events-none absolute -bottom-10 -right-10 h-64 w-64 rounded-full ${Y(o)} opacity-40 blur-2xl dark:opacity-50`
-		}), /* @__PURE__ */ I("div", {
+			className: `pointer-events-none absolute -bottom-10 -right-10 h-64 w-64 rounded-full ${Q(o)} opacity-40 blur-2xl dark:opacity-50`
+		}), /* @__PURE__ */ V("div", {
 			"aria-hidden": !0,
-			className: `pointer-events-none absolute right-12 top-1/3 h-32 w-32 rounded-full ${Y(o)} bento-chip-tr opacity-20 blur-2xl dark:opacity-30`
+			className: `pointer-events-none absolute right-12 top-1/3 h-32 w-32 rounded-full ${Q(o)} bento-chip-tr opacity-20 blur-2xl dark:opacity-30`
 		})] }),
-		/* @__PURE__ */ L("div", {
+		/* @__PURE__ */ H("div", {
 			className: "relative z-1 flex items-center justify-between",
-			children: [/* @__PURE__ */ I("span", {
-				className: `grid place-items-center ${Y(o)} text-white shadow-md ${p}`,
-				children: /* @__PURE__ */ I(a, { size: m })
-			}), f && /* @__PURE__ */ I(V, {
+			children: [/* @__PURE__ */ V("span", {
+				className: `grid place-items-center ${Q(o)} text-white shadow-md ${p}`,
+				children: /* @__PURE__ */ V(a, { size: m })
+			}), f && /* @__PURE__ */ V(K, {
 				size: u ? 18 : 16,
 				className: "text-muted-foreground transition-transform duration-300 ease-[cubic-bezier(0.32,0.72,0,1)] group-hover:translate-x-1"
 			})]
 		}),
-		/* @__PURE__ */ L("div", {
+		/* @__PURE__ */ H("div", {
 			className: "relative z-1",
 			children: [
-				/* @__PURE__ */ I("div", {
+				/* @__PURE__ */ V("div", {
 					className: "text-[11px] uppercase tracking-wider text-muted-foreground",
 					children: s
 				}),
-				/* @__PURE__ */ I("div", {
+				/* @__PURE__ */ V("div", {
 					className: `mt-0.5 ${h}`,
 					children: c
 				}),
-				d && /* @__PURE__ */ I("div", {
+				d && /* @__PURE__ */ V("div", {
 					className: "mt-2",
 					children: d
 				})
 			]
 		})
 	] }), _ = `bento-tile bento-glass group relative flex flex-col ${u ? "gap-5" : "gap-4"} overflow-hidden text-left ${u ? "p-6 md:p-7" : "p-5"} ${l}${f ? " bento-tile-clickable" : ""}${r ? " cursor-not-allowed opacity-60" : ""}`;
-	return r ? /* @__PURE__ */ I("div", {
+	return r ? /* @__PURE__ */ V("div", {
 		className: _,
 		"aria-disabled": "true",
 		title: i,
 		children: g
-	}) : t ? /* @__PURE__ */ I(K, {
+	}) : t ? /* @__PURE__ */ V(Z, {
 		to: t,
 		className: _,
 		children: g
-	}) : n ? /* @__PURE__ */ I("button", {
+	}) : n ? /* @__PURE__ */ V("button", {
 		type: "button",
 		onClick: n,
 		className: e("w-full", _),
 		children: g
-	}) : /* @__PURE__ */ I("div", {
+	}) : /* @__PURE__ */ V("div", {
 		className: _,
 		children: g
 	});
 }
 //#endregion
-export { $ as AdaptiveSectionCard, We as BENTO_EMPHASIS_NEXT, Ue as BENTO_EMPHASIS_SPAN, Pe as BENTO_TONES, J as BENTO_TONE_CLASS, Ne as BentoActionsMenu, X as BentoBackLink, ft as BentoBackToTop, gt as BentoCommandPalette, Fe as BentoCountTile, Ie as BentoEmptyState, He as BentoEntityShell, qe as BentoEntityTile, ot as BentoFormHero, st as BentoFormSection, Z as BentoHero, Le as BentoHeroIconPicker, Re as BentoInlineEdit, Ye as BentoListPage, xt as BentoNavRail, ct as BentoPanel, Q as BentoSaveBar, at as BentoScrollSaveBar, kt as BentoSection, _t as BentoShortcutsDialog, ze as BentoStatusMarker, At as BentoTile, Xe as BentoTileGrid, Ct as BentoUserMenu, Tt as SectionCardChromeProvider, Y as bentoChipClass, pt as bentoNavTarget, Ge as resolveBentoLayout, Ke as toBentoLayoutEntries, Be as useBentoScrollFade, Et as useSectionChrome };
+//#region src/bento/bento-version-rail.tsx
+function Dn({ versions: t, selected: n, onSelect: r, label: i }) {
+	let { t: a, i18n: o } = U(), [s, c] = z(0), [l, u] = z([]), d = R(/* @__PURE__ */ new Map()), f = (e) => [...e].sort((e, n) => t.findIndex((e) => e.id === n) - t.findIndex((t) => t.id === e));
+	function p(e) {
+		if (n.includes(e)) {
+			u(l.filter((t) => t !== e)), r(n.filter((t) => t !== e));
+			return;
+		}
+		let t = [...n.filter((e) => !l.includes(e)), ...l.filter((e) => n.includes(e))], i = t.length >= 2 ? t.slice(t.length - 1) : t;
+		u([...i, e]), r(f([...i, e]));
+	}
+	function m(e) {
+		let n = Math.max(0, Math.min(t.length - 1, e));
+		c(n), d.current.get(n)?.focus();
+	}
+	function h(e, n) {
+		switch (e.key) {
+			case "ArrowDown":
+				m(n + 1);
+				break;
+			case "ArrowUp":
+				m(n - 1);
+				break;
+			case "Home":
+				m(0);
+				break;
+			case "End":
+				m(t.length - 1);
+				break;
+			case " ":
+			case "Enter":
+				p(t[n].id);
+				break;
+			default: return;
+		}
+		e.preventDefault();
+	}
+	let g = (e) => {
+		let t = new Date(e);
+		return Number.isNaN(t.getTime()) ? {
+			iso: void 0,
+			text: String(e)
+		} : {
+			iso: t.toISOString(),
+			text: new Intl.DateTimeFormat(o?.resolvedLanguage, {
+				dateStyle: "medium",
+				timeStyle: "short"
+			}).format(t)
+		};
+	};
+	return /* @__PURE__ */ V("ul", {
+		role: "listbox",
+		"aria-label": i ?? a("bento.versions.label", { defaultValue: "Versions" }),
+		"aria-multiselectable": "true",
+		"data-slot": "bento-version-rail",
+		className: "m-0 flex list-none flex-col gap-1 p-0",
+		children: t.map((r, i) => {
+			let o = n.includes(r.id), l = g(r.at), u = r.actor === "agent" ? X : Te;
+			return /* @__PURE__ */ H("li", {
+				ref: (e) => {
+					e ? d.current.set(i, e) : d.current.delete(i);
+				},
+				role: "option",
+				"aria-selected": o ? "true" : "false",
+				tabIndex: i === Math.min(s, t.length - 1) ? 0 : -1,
+				onKeyDown: (e) => h(e, i),
+				onClick: () => {
+					c(i), p(r.id);
+				},
+				className: e("flex cursor-pointer flex-col gap-0.5 rounded-xl border px-3 py-2 text-sm outline-none transition-colors", "focus-visible:ring-2 focus-visible:ring-ring", o ? "border-primary/50 bg-primary/10" : "border-transparent hover:bg-muted/50"),
+				children: [
+					/* @__PURE__ */ H("span", {
+						className: "flex items-center gap-1.5 font-medium",
+						children: [
+							/* @__PURE__ */ V(u, {
+								size: 14,
+								"aria-hidden": "true"
+							}),
+							r.author,
+							/* @__PURE__ */ V("span", {
+								className: "text-xs font-normal text-muted-foreground",
+								children: r.actor === "agent" ? a("bento.versions.agent", { defaultValue: "Agent" }) : a("bento.versions.human", { defaultValue: "Person" })
+							})
+						]
+					}),
+					/* @__PURE__ */ V("time", {
+						dateTime: l.iso,
+						className: "text-xs text-muted-foreground",
+						children: l.text
+					}),
+					r.summary && /* @__PURE__ */ V("span", {
+						className: "text-xs",
+						children: r.summary
+					})
+				]
+			}, r.id);
+		})
+	});
+}
+//#endregion
+export { Cn as AdaptiveSectionCard, St as BENTO_EMPHASIS_NEXT, xt as BENTO_EMPHASIS_SPAN, cn as BENTO_SHELL_SHORTCUTS, $e as BENTO_TONES, Qe as BENTO_TONE_CLASS, Ze as BentoActionsMenu, at as BentoBackLink, en as BentoBackToTop, an as BentoCommandPalette, et as BentoCountTile, rt as BentoDataTable, gt as BentoDiff, it as BentoEmptyState, ft as BentoEntityShell, Tt as BentoEntityTile, At as BentoFilterBar, qt as BentoFormHero, Yt as BentoFormSection, ot as BentoHero, st as BentoHeroIconPicker, ct as BentoInlineEdit, Ft as BentoListPage, yn as BentoNavRail, mn as BentoPaletteTrigger, Xt as BentoPanel, Wt as BentoSaveBar, Kt as BentoScrollSaveBar, Tn as BentoSection, on as BentoShell, hn as BentoShortcutsDialog, lt as BentoStatusMarker, En as BentoTile, It as BentoTileGrid, xn as BentoUserMenu, Dn as BentoVersionRail, Et as EMPTY_FILTERS, Q as bentoChipClass, tn as bentoNavTarget, Ct as resolveBentoLayout, wt as toBentoLayoutEntries, ut as useBentoScrollFade, pn as useBentoShellShortcuts };