@hina-ui/vue 1.5.0 → 1.6.0

package/dist/index.js

@@ -216,6 +216,7 @@ var zhCN = {
 		show: "显示密码",
 		hide: "隐藏密码"
 	},
+	tree: { empty: "暂无节点" },
 	treeSelect: { search: "搜索节点" },
 	combobox: {
 		placeholder: "输入或选择",
@@ -357,6 +358,7 @@ var enUS = {
 		show: "Show password",
 		hide: "Hide password"
 	},
+	tree: { empty: "No nodes" },
 	treeSelect: { search: "Search nodes" },
 	combobox: {
 		placeholder: "Type or choose",
@@ -489,6 +491,10 @@ function merge(base, patch) {
 			...base.passwordInput,
 			...patch.passwordInput
 		},
+		tree: {
+			...base.tree,
+			...patch.tree
+		},
 		treeSelect: {
 			...base.treeSelect,
 			...patch.treeSelect
@@ -700,7 +706,7 @@ var spinner = tv({
 });
 //#endregion
 //#region src/components/spinner/Spinner.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$98 = ["aria-label"];
+var _hoisted_1$100 = ["aria-label"];
 //#endregion
 //#region src/components/spinner/Spinner.vue
 var Spinner_default = /* @__PURE__ */ defineComponent({
@@ -720,13 +726,13 @@ var Spinner_default = /* @__PURE__ */ defineComponent({
 				"aria-label": props.label ?? unref(t).common.loading,
 				class: unref(cn)(unref(spinner)({ size: props.size })),
 				style: { animation: "hn-spin var(--hn-spin-duration) var(--hn-ease-linear) infinite" }
-			}), null, 16, _hoisted_1$98);
+			}), null, 16, _hoisted_1$100);
 		};
 	}
 });
 //#endregion
 //#region src/components/button/IconSlot.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$97 = {
+var _hoisted_1$99 = {
 	key: 0,
 	"aria-hidden": "true",
 	class: "absolute inset-0 inline-flex items-center justify-center"
@@ -750,7 +756,7 @@ var IconSlot_default$1 = /* @__PURE__ */ defineComponent({
 				"leave-active-class": "hn-transition",
 				"leave-to-class": "scale-90 opacity-0"
 			}, {
-				default: withCtx(() => [props.swapped ? (openBlock(), createElementBlock("span", _hoisted_1$97, [createVNode(Spinner_default, { size: props.spinnerSize }, null, 8, ["size"])])) : createCommentVNode("", true)]),
+				default: withCtx(() => [props.swapped ? (openBlock(), createElementBlock("span", _hoisted_1$99, [createVNode(Spinner_default, { size: props.spinnerSize }, null, 8, ["size"])])) : createCommentVNode("", true)]),
 				_: 1
 			})], 2);
 		};
@@ -946,7 +952,7 @@ function useRipple(container, surface, isDisabled) {
 }
 //#endregion
 //#region src/components/ripple/Ripple.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$96 = ["data-pressed"];
+var _hoisted_1$98 = ["data-pressed"];
 //#endregion
 //#region src/components/ripple/Ripple.vue
 var Ripple_default = /* @__PURE__ */ defineComponent({
@@ -969,13 +975,13 @@ var Ripple_default = /* @__PURE__ */ defineComponent({
 				ref: surface,
 				class: "hn-ripple-surface",
 				"data-pressed": unref(pressed) ? "" : void 0
-			}, null, 8, _hoisted_1$96)], 512);
+			}, null, 8, _hoisted_1$98)], 512);
 		};
 	}
 });
 //#endregion
 //#region src/components/button/Button.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$95 = {
+var _hoisted_1$97 = {
 	key: 0,
 	"aria-hidden": "true",
 	class: "absolute inset-0 flex items-center justify-center"
@@ -1086,7 +1092,7 @@ var Button_default = /* @__PURE__ */ defineComponent({
 						"leave-active-class": "hn-transition",
 						"leave-to-class": "opacity-0"
 					}, {
-						default: withCtx(() => [props.loading && spinnerAt.value === "center" ? (openBlock(), createElementBlock("span", _hoisted_1$95, [createVNode(Spinner_default, { size: spinnerSize.value }, null, 8, ["size"])])) : createCommentVNode("", true)]),
+						default: withCtx(() => [props.loading && spinnerAt.value === "center" ? (openBlock(), createElementBlock("span", _hoisted_1$97, [createVNode(Spinner_default, { size: spinnerSize.value }, null, 8, ["size"])])) : createCommentVNode("", true)]),
 						_: 1
 					})
 				], 64))]),
@@ -1337,7 +1343,7 @@ function useCopy(text, onCopied, resetAfter = () => COPIED_RESET_MS) {
 }
 //#endregion
 //#region src/components/copy-button/CopyButton.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$94 = { class: "relative inline-flex size-[1em]" };
+var _hoisted_1$96 = { class: "relative inline-flex size-[1em]" };
 //#endregion
 //#region src/components/copy-button/CopyButton.vue
 var CopyButton_default = /* @__PURE__ */ defineComponent({
@@ -1369,7 +1375,7 @@ var CopyButton_default = /* @__PURE__ */ defineComponent({
 				class: props.class,
 				onClick: unref(copy)
 			}), {
-				default: withCtx(() => [createElementVNode("span", _hoisted_1$94, [createVNode(Transition, {
+				default: withCtx(() => [createElementVNode("span", _hoisted_1$96, [createVNode(Transition, {
 					"enter-active-class": "hn-transition-base",
 					"enter-from-class": "scale-90 opacity-0",
 					"leave-active-class": "hn-transition",
@@ -1444,7 +1450,7 @@ var buttonGroup = tv({
 });
 //#endregion
 //#region src/components/button-group/ButtonGroup.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$93 = ["aria-label", "aria-orientation"];
+var _hoisted_1$95 = ["aria-label", "aria-orientation"];
 //#endregion
 //#region src/components/button-group/ButtonGroup.vue
 var ButtonGroup_default = /* @__PURE__ */ defineComponent({
@@ -1475,7 +1481,7 @@ var ButtonGroup_default = /* @__PURE__ */ defineComponent({
 					block: props.block,
 					divider: props.divider
 				}), props.class))
-			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$93);
+			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$95);
 		};
 	}
 });
@@ -1709,8 +1715,8 @@ var chipRemove = tv({
 });
 //#endregion
 //#region src/components/chip/IconSlot.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$92 = { class: "hn-collapse-body" };
-var _hoisted_2$47 = {
+var _hoisted_1$94 = { class: "hn-collapse-body" };
+var _hoisted_2$49 = {
 	key: 0,
 	"aria-hidden": "true",
 	class: "absolute inset-0 inline-flex items-center justify-center"
@@ -1731,7 +1737,7 @@ var IconSlot_default = /* @__PURE__ */ defineComponent({
 			return openBlock(), createElementBlock("span", {
 				"data-hn-icon": "",
 				class: normalizeClass(["hn-collapse-x", props.icon || props.checked ? "hn-collapse-open" : "hn-collapse-closed"])
-			}, [createElementVNode("span", _hoisted_1$92, [createElementVNode("span", { class: normalizeClass(unref(chipIcon)({ size: props.size })) }, [props.icon ? (openBlock(), createElementBlock("span", {
+			}, [createElementVNode("span", _hoisted_1$94, [createElementVNode("span", { class: normalizeClass(unref(chipIcon)({ size: props.size })) }, [props.icon ? (openBlock(), createElementBlock("span", {
 				key: 0,
 				class: normalizeClass(["hn-transition inline-flex items-center justify-center", props.checked ? "scale-90 opacity-0" : "scale-100 opacity-100"])
 			}, [renderSlot(_ctx.$slots, "default")], 2)) : createCommentVNode("", true), createVNode(Transition, {
@@ -1740,7 +1746,7 @@ var IconSlot_default = /* @__PURE__ */ defineComponent({
 				"leave-active-class": "hn-transition",
 				"leave-to-class": "scale-90 opacity-0"
 			}, {
-				default: withCtx(() => [props.checked ? (openBlock(), createElementBlock("span", _hoisted_2$47, [createVNode(unref(Check))])) : createCommentVNode("", true)]),
+				default: withCtx(() => [props.checked ? (openBlock(), createElementBlock("span", _hoisted_2$49, [createVNode(unref(Check))])) : createCommentVNode("", true)]),
 				_: 1
 			})], 2)])], 2);
 		};
@@ -1927,13 +1933,13 @@ var VisuallyHidden_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/lightbox/LightboxStrip.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$91 = [
+var _hoisted_1$93 = [
 	"src",
 	"alt",
 	"onLoad"
 ];
-var _hoisted_2$46 = ["src"];
-var _hoisted_3$22 = [
+var _hoisted_2$48 = ["src"];
+var _hoisted_3$25 = [
 	"src",
 	"alt",
 	"onLoad"
@@ -1994,7 +2000,7 @@ var LightboxStrip_default = /* @__PURE__ */ defineComponent({
 							draggable: "false",
 							class: "block size-full object-contain",
 							onLoad: ($event) => emit("learn", slide.item.id, $event.target)
-						}, null, 40, _hoisted_1$91), createVNode(Transition, {
+						}, null, 40, _hoisted_1$93), createVNode(Transition, {
 							"enter-active-class": "hn-transition-base",
 							"enter-from-class": "opacity-0",
 							"leave-active-class": "hn-transition",
@@ -2007,7 +2013,7 @@ var LightboxStrip_default = /* @__PURE__ */ defineComponent({
 								"aria-hidden": "true",
 								draggable: "false",
 								class: "absolute inset-0 size-full object-contain"
-							}, null, 8, _hoisted_2$46)) : createCommentVNode("", true)]),
+							}, null, 8, _hoisted_2$48)) : createCommentVNode("", true)]),
 							_: 1
 						})]),
 						_: 2
@@ -2029,7 +2035,7 @@ var LightboxStrip_default = /* @__PURE__ */ defineComponent({
 							draggable: "false",
 							class: "block size-full object-contain",
 							onLoad: ($event) => emit("learn", slide.item.id, $event.target)
-						}, null, 40, _hoisted_3$22)]),
+						}, null, 40, _hoisted_3$25)]),
 						_: 2
 					}, 1032, [
 						"style",
@@ -2258,10 +2264,10 @@ function useScrollFocus(host, viewport, options) {
 }
 //#endregion
 //#region src/components/scroll-area/ScrollArea.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$90 = ["data-visible"];
-var _hoisted_2$45 = ["data-visible"];
-var _hoisted_3$21 = ["data-visible"];
-var _hoisted_4$16 = ["data-visible"];
+var _hoisted_1$92 = ["data-visible"];
+var _hoisted_2$47 = ["data-visible"];
+var _hoisted_3$24 = ["data-visible"];
+var _hoisted_4$19 = ["data-visible"];
 //#endregion
 //#region src/components/scroll-area/ScrollArea.vue
 var ScrollArea_default = /* @__PURE__ */ defineComponent({
@@ -2364,28 +2370,28 @@ var ScrollArea_default = /* @__PURE__ */ defineComponent({
 					"data-side": "x-start",
 					"data-visible": unref(showXStart) ? "" : void 0,
 					"aria-hidden": "true"
-				}, null, 8, _hoisted_1$90)) : createCommentVNode("", true),
+				}, null, 8, _hoisted_1$92)) : createCommentVNode("", true),
 				props.direction !== "vertical" ? (openBlock(), createElementBlock("div", {
 					key: 1,
 					class: "hn-scroll-shadow",
 					"data-side": "x-end",
 					"data-visible": unref(showXEnd) ? "" : void 0,
 					"aria-hidden": "true"
-				}, null, 8, _hoisted_2$45)) : createCommentVNode("", true),
+				}, null, 8, _hoisted_2$47)) : createCommentVNode("", true),
 				props.direction !== "horizontal" ? (openBlock(), createElementBlock("div", {
 					key: 2,
 					class: "hn-scroll-shadow",
 					"data-side": "y-start",
 					"data-visible": unref(showYStart) ? "" : void 0,
 					"aria-hidden": "true"
-				}, null, 8, _hoisted_3$21)) : createCommentVNode("", true),
+				}, null, 8, _hoisted_3$24)) : createCommentVNode("", true),
 				props.direction !== "horizontal" ? (openBlock(), createElementBlock("div", {
 					key: 3,
 					class: "hn-scroll-shadow",
 					"data-side": "y-end",
 					"data-visible": unref(showYEnd) ? "" : void 0,
 					"aria-hidden": "true"
-				}, null, 8, _hoisted_4$16)) : createCommentVNode("", true)
+				}, null, 8, _hoisted_4$19)) : createCommentVNode("", true)
 			], 64)) : createCommentVNode("", true)], 2);
 		};
 	}
@@ -2444,16 +2450,16 @@ var Highlight_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/lightbox/LightboxThumbs.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$89 = {
+var _hoisted_1$91 = {
 	"data-hn-thumbs": "",
 	class: "relative isolate flex w-max gap-2 px-4 py-3"
 };
-var _hoisted_2$44 = [
+var _hoisted_2$46 = [
 	"aria-label",
 	"aria-current",
 	"onClick"
 ];
-var _hoisted_3$20 = ["src"];
+var _hoisted_3$23 = ["src"];
 //#endregion
 //#region src/components/lightbox/LightboxThumbs.vue
 var LightboxThumbs_default = /* @__PURE__ */ defineComponent({
@@ -2489,7 +2495,7 @@ var LightboxThumbs_default = /* @__PURE__ */ defineComponent({
 				scrollbar: false,
 				class: "max-w-full"
 			}, {
-				default: withCtx(() => [createElementVNode("div", _hoisted_1$89, [(openBlock(true), createElementBlock(Fragment, null, renderList(props.items, (item, at) => {
+				default: withCtx(() => [createElementVNode("div", _hoisted_1$91, [(openBlock(true), createElementBlock(Fragment, null, renderList(props.items, (item, at) => {
 					return openBlock(), createElementBlock("button", {
 						key: item.id,
 						ref_for: true,
@@ -2506,14 +2512,14 @@ var LightboxThumbs_default = /* @__PURE__ */ defineComponent({
 							alt: "",
 							draggable: "false",
 							class: "relative -z-10 size-full object-cover"
-						}, null, 8, _hoisted_3$20),
+						}, null, 8, _hoisted_3$23),
 						at === props.index ? (openBlock(), createBlock(Highlight_default, {
 							key: 0,
 							id: unref(highlightId),
 							axis: "x",
 							class: "ring-accent absolute inset-0 rounded-md ring-2 ring-inset"
 						}, null, 8, ["id"])) : createCommentVNode("", true)
-					], 10, _hoisted_2$44);
+					], 10, _hoisted_2$46);
 				}), 128))])]),
 				_: 1
 			});
@@ -2522,8 +2528,8 @@ var LightboxThumbs_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/lightbox/LightboxToolbar.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$88 = { class: "flex flex-col items-center gap-1 pb-[max(--spacing(3),env(safe-area-inset-bottom))]" };
-var _hoisted_2$43 = { class: "flex items-center gap-1" };
+var _hoisted_1$90 = { class: "flex flex-col items-center gap-1 pb-[max(--spacing(3),env(safe-area-inset-bottom))]" };
+var _hoisted_2$45 = { class: "flex items-center gap-1" };
 //#endregion
 //#region src/components/lightbox/LightboxToolbar.vue
 var LightboxToolbar_default = /* @__PURE__ */ defineComponent({
@@ -2550,12 +2556,12 @@ var LightboxToolbar_default = /* @__PURE__ */ defineComponent({
 		const emit = __emit;
 		const t = useUiLocale();
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", _hoisted_1$88, [props.items.length > 1 ? (openBlock(), createBlock(LightboxThumbs_default, {
+			return openBlock(), createElementBlock("div", _hoisted_1$90, [props.items.length > 1 ? (openBlock(), createBlock(LightboxThumbs_default, {
 				key: 0,
 				items: props.items,
 				index: props.index,
 				onSelect: _cache[0] || (_cache[0] = ($event) => emit("select", $event))
-			}, null, 8, ["items", "index"])) : createCommentVNode("", true), createElementVNode("div", _hoisted_2$43, [
+			}, null, 8, ["items", "index"])) : createCommentVNode("", true), createElementVNode("div", _hoisted_2$45, [
 				createVNode(IconButton_default, {
 					label: unref(t).lightbox.zoomOut,
 					disabled: !props.zoomed,
@@ -4160,8 +4166,8 @@ async function saveImage(url) {
 }
 //#endregion
 //#region src/components/lightbox/Lightbox.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$87 = ["data-hn-phase"];
-var _hoisted_2$42 = {
+var _hoisted_1$89 = ["data-hn-phase"];
+var _hoisted_2$44 = {
 	"aria-hidden": "true",
 	class: "pointer-events-none absolute inset-0 isolate"
 };
@@ -4329,7 +4335,7 @@ var Lightbox_default = /* @__PURE__ */ defineComponent({
 							onWheel: _cache[10] || (_cache[10] = (...args) => unref(gesture).onWheel && unref(gesture).onWheel(...args)),
 							onKeydown
 						}, [
-							createElementVNode("div", _hoisted_2$42, [createVNode(unref(Motion), {
+							createElementVNode("div", _hoisted_2$44, [createVNode(unref(Motion), {
 								class: "hn-scrim",
 								style: normalizeStyle({ opacity: unref(motion).presence })
 							}, null, 8, ["style"])]),
@@ -4399,7 +4405,7 @@ var Lightbox_default = /* @__PURE__ */ defineComponent({
 								"hint",
 								"presence"
 							])
-						], 42, _hoisted_1$87)]),
+						], 42, _hoisted_1$89)]),
 						_: 1
 					})]),
 					_: 1
@@ -4571,7 +4577,7 @@ function useImageGroup() {
 }
 //#endregion
 //#region src/components/image/Image.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$86 = [
+var _hoisted_1$88 = [
 	"src",
 	"alt",
 	"decoding",
@@ -4681,7 +4687,7 @@ var Image_default = /* @__PURE__ */ defineComponent({
 							fit: props.fit,
 							lazy: props.lazy
 						}), props.lazy && !unref(revealed) && "opacity-0", props.imageClass)
-					}), null, 16, _hoisted_1$86)) : unref(failed) ? renderSlot(_ctx.$slots, "error", {}, void 0, void 0, 1) : renderSlot(_ctx.$slots, "empty", {}, void 0, void 0, 2),
+					}), null, 16, _hoisted_1$88)) : unref(failed) ? renderSlot(_ctx.$slots, "error", {}, void 0, void 0, 1) : renderSlot(_ctx.$slots, "empty", {}, void 0, void 0, 2),
 					unref(showSkeleton) ? (openBlock(), createElementBlock("span", {
 						key: 3,
 						ref_key: "skeletonEl",
@@ -4962,7 +4968,7 @@ var indicator = tv({
 });
 //#endregion
 //#region src/components/indicator/Indicator.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$85 = {
+var _hoisted_1$87 = {
 	key: 0,
 	"aria-hidden": "true",
 	class: "hn-ping absolute inset-0 rounded-full bg-inherit"
@@ -4993,7 +4999,7 @@ var Indicator_default = /* @__PURE__ */ defineComponent({
 					size: props.size
 				}), props.class))
 			}, {
-				default: withCtx(() => [props.pulse ? (openBlock(), createElementBlock("span", _hoisted_1$85)) : createCommentVNode("", true), props.label ? (openBlock(), createBlock(VisuallyHidden_default, { key: 1 }, {
+				default: withCtx(() => [props.pulse ? (openBlock(), createElementBlock("span", _hoisted_1$87)) : createCommentVNode("", true), props.label ? (openBlock(), createBlock(VisuallyHidden_default, { key: 1 }, {
 					default: withCtx(() => [createTextVNode(toDisplayString(props.label), 1)]),
 					_: 1
 				})) : createCommentVNode("", true)]),
@@ -5045,8 +5051,8 @@ var calloutIcons = {
 };
 //#endregion
 //#region src/components/callout/Callout.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$84 = { class: "flex min-w-0 flex-1 flex-col gap-1" };
-var _hoisted_2$41 = {
+var _hoisted_1$86 = { class: "flex min-w-0 flex-1 flex-col gap-1" };
+var _hoisted_2$43 = {
 	key: 0,
 	class: "text-fg font-medium"
 };
@@ -5074,7 +5080,7 @@ var Callout_default = /* @__PURE__ */ defineComponent({
 				key: 0,
 				class: normalizeClass(unref(calloutIcon)({ tone: props.tone })),
 				"aria-hidden": "true"
-			}, null, 8, ["class"])) : createCommentVNode("", true)]), createElementVNode("div", _hoisted_1$84, [props.title ? (openBlock(), createElementBlock("p", _hoisted_2$41, toDisplayString(props.title), 1)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")])], 2);
+			}, null, 8, ["class"])) : createCommentVNode("", true)]), createElementVNode("div", _hoisted_1$86, [props.title ? (openBlock(), createElementBlock("p", _hoisted_2$43, toDisplayString(props.title), 1)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")])], 2);
 		};
 	}
 });
@@ -5128,19 +5134,19 @@ function useCollapseGap() {
 }
 //#endregion
 //#region src/components/alert/Alert.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$83 = {
+var _hoisted_1$85 = {
 	key: 0,
 	"data-hn-alert": "",
 	class: "hn-collapse"
 };
-var _hoisted_2$40 = { class: "hn-collapse-body" };
-var _hoisted_3$19 = ["role"];
-var _hoisted_4$15 = { class: "flex min-w-0 flex-1 flex-col gap-1" };
-var _hoisted_5$11 = {
+var _hoisted_2$42 = { class: "hn-collapse-body" };
+var _hoisted_3$22 = ["role"];
+var _hoisted_4$18 = { class: "flex min-w-0 flex-1 flex-col gap-1" };
+var _hoisted_5$12 = {
 	key: 0,
 	class: "text-fg font-medium"
 };
-var _hoisted_6$8 = {
+var _hoisted_6$9 = {
 	key: 0,
 	class: "flex shrink-0 items-center gap-2 self-center"
 };
@@ -5184,7 +5190,7 @@ var Alert_default = /* @__PURE__ */ defineComponent({
 				"leave-from-class": "hn-collapse-open",
 				"leave-to-class": "hn-collapse-closed"
 			}, toHandlers(unref(hooks))), {
-				default: withCtx(() => [open.value ? (openBlock(), createElementBlock("div", _hoisted_1$83, [createElementVNode("div", _hoisted_2$40, [createElementVNode("div", {
+				default: withCtx(() => [open.value ? (openBlock(), createElementBlock("div", _hoisted_1$85, [createElementVNode("div", _hoisted_2$42, [createElementVNode("div", {
 					role: role.value,
 					class: normalizeClass(unref(cn)(unref(callout)({ tone: props.tone }), props.class))
 				}, [
@@ -5193,15 +5199,15 @@ var Alert_default = /* @__PURE__ */ defineComponent({
 						class: normalizeClass(unref(calloutIcon)({ tone: props.tone })),
 						"aria-hidden": "true"
 					}, null, 8, ["class"])) : createCommentVNode("", true)]),
-					createElementVNode("div", _hoisted_4$15, [props.title ? (openBlock(), createElementBlock("p", _hoisted_5$11, toDisplayString(props.title), 1)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")]),
-					unref(slots).actions ? (openBlock(), createElementBlock("div", _hoisted_6$8, [renderSlot(_ctx.$slots, "actions")])) : createCommentVNode("", true),
+					createElementVNode("div", _hoisted_4$18, [props.title ? (openBlock(), createElementBlock("p", _hoisted_5$12, toDisplayString(props.title), 1)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")]),
+					unref(slots).actions ? (openBlock(), createElementBlock("div", _hoisted_6$9, [renderSlot(_ctx.$slots, "actions")])) : createCommentVNode("", true),
 					props.closable ? (openBlock(), createBlock(CloseButton_default, {
 						key: 1,
 						size: "sm",
 						class: "-my-0.5 -me-1",
 						onClick: close
 					})) : createCommentVNode("", true)
-				], 10, _hoisted_3$19)])])) : createCommentVNode("", true)]),
+				], 10, _hoisted_3$22)])])) : createCommentVNode("", true)]),
 				_: 3
 			}, 16);
 		};
@@ -5753,7 +5759,7 @@ var PaginationPage_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/pagination/PaginationEllipsis.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$82 = {
+var _hoisted_1$84 = {
 	class: "grid",
 	"aria-hidden": "true"
 };
@@ -5800,7 +5806,7 @@ var PaginationEllipsis_default = /* @__PURE__ */ defineComponent({
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {
 					side: props.range.side,
 					expanded: expanded.value
-				}, () => [createElementVNode("span", _hoisted_1$82, [createVNode(unref(MoreHorizontal), { class: normalizeClass(["hn-transition-base [grid-area:1/1]", expanded.value ? "scale-90 opacity-0" : "scale-100 opacity-100"]) }, null, 8, ["class"]), (openBlock(), createBlock(resolveDynamicComponent(props.range.side === "prev" ? unref(ChevronLeft) : unref(ChevronRight)), { class: normalizeClass([[unref(paginationArrow)({ dir: unref(direction) }), expanded.value ? "scale-100 opacity-100" : "scale-90 opacity-0"], "hn-transition-base [grid-area:1/1]"]) }, null, 8, ["class"]))])])]),
+				}, () => [createElementVNode("span", _hoisted_1$84, [createVNode(unref(MoreHorizontal), { class: normalizeClass(["hn-transition-base [grid-area:1/1]", expanded.value ? "scale-90 opacity-0" : "scale-100 opacity-100"]) }, null, 8, ["class"]), (openBlock(), createBlock(resolveDynamicComponent(props.range.side === "prev" ? unref(ChevronLeft) : unref(ChevronRight)), { class: normalizeClass([[unref(paginationArrow)({ dir: unref(direction) }), expanded.value ? "scale-100 opacity-100" : "scale-90 opacity-0"], "hn-transition-base [grid-area:1/1]"]) }, null, 8, ["class"]))])])]),
 				_: 3
 			}, 8, [
 				"size",
@@ -6393,8 +6399,8 @@ function usePaginationEllipsis(host, items) {
 }
 //#endregion
 //#region src/components/pagination/PaginationPages.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$81 = { key: 0 };
-var _hoisted_2$39 = { key: 1 };
+var _hoisted_1$83 = { key: 0 };
+var _hoisted_2$41 = { key: 1 };
 //#endregion
 //#region src/components/pagination/PaginationPages.vue
 var PaginationPages_default = /* @__PURE__ */ defineComponent({
@@ -6410,7 +6416,7 @@ var PaginationPages_default = /* @__PURE__ */ defineComponent({
 		const ellipsis = usePaginationEllipsis(toRef(props, "host"), () => props.items);
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock(Fragment, null, [
-				unref(showFirstLast) ? (openBlock(), createElementBlock("li", _hoisted_1$81, [createVNode(PaginationControl_default, {
+				unref(showFirstLast) ? (openBlock(), createElementBlock("li", _hoisted_1$83, [createVNode(PaginationControl_default, {
 					action: "first",
 					size: unref(size),
 					dir: unref(direction)
@@ -6443,7 +6449,7 @@ var PaginationPages_default = /* @__PURE__ */ defineComponent({
 					size: unref(size),
 					dir: unref(direction)
 				}, null, 8, ["size", "dir"])]),
-				unref(showFirstLast) ? (openBlock(), createElementBlock("li", _hoisted_2$39, [createVNode(PaginationControl_default, {
+				unref(showFirstLast) ? (openBlock(), createElementBlock("li", _hoisted_2$41, [createVNode(PaginationControl_default, {
 					action: "last",
 					size: unref(size),
 					dir: unref(direction)
@@ -6732,16 +6738,16 @@ function flattenOptions(items) {
 }
 //#endregion
 //#region src/components/select/SelectList.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$80 = { class: "min-w-0 flex-1" };
-var _hoisted_2$38 = { class: "block truncate" };
-var _hoisted_3$18 = {
+var _hoisted_1$82 = { class: "min-w-0 flex-1" };
+var _hoisted_2$40 = { class: "block truncate" };
+var _hoisted_3$21 = {
 	key: 0,
 	class: "text-muted block truncate text-xs"
 };
-var _hoisted_4$14 = { class: "flex size-4 shrink-0 items-center justify-center" };
-var _hoisted_5$10 = { class: "min-w-0 flex-1" };
-var _hoisted_6$7 = { class: "block truncate" };
-var _hoisted_7$5 = {
+var _hoisted_4$17 = { class: "flex size-4 shrink-0 items-center justify-center" };
+var _hoisted_5$11 = { class: "min-w-0 flex-1" };
+var _hoisted_6$8 = { class: "block truncate" };
+var _hoisted_7$6 = {
 	key: 0,
 	class: "text-muted block truncate text-xs"
 };
@@ -6791,9 +6797,9 @@ var SelectList_default = /* @__PURE__ */ defineComponent({
 											class: normalizeClass(unref(selectItem)())
 										}, {
 											default: withCtx(() => [createVNode(unref(SelectItemText), { "as-child": "" }, {
-												default: withCtx(() => [createElementVNode("span", _hoisted_1$80, [renderSlot(_ctx.$slots, "option", { option }, () => [createElementVNode("span", _hoisted_2$38, toDisplayString(option.label), 1), option.description ? (openBlock(), createElementBlock("span", _hoisted_3$18, toDisplayString(option.description), 1)) : createCommentVNode("", true)])])]),
+												default: withCtx(() => [createElementVNode("span", _hoisted_1$82, [renderSlot(_ctx.$slots, "option", { option }, () => [createElementVNode("span", _hoisted_2$40, toDisplayString(option.label), 1), option.description ? (openBlock(), createElementBlock("span", _hoisted_3$21, toDisplayString(option.description), 1)) : createCommentVNode("", true)])])]),
 												_: 2
-											}, 1024), createElementVNode("span", _hoisted_4$14, [createVNode(unref(SelectItemIndicator), null, {
+											}, 1024), createElementVNode("span", _hoisted_4$17, [createVNode(unref(SelectItemIndicator), null, {
 												default: withCtx(() => [createVNode(unref(Check))]),
 												_: 1
 											})])]),
@@ -6814,7 +6820,7 @@ var SelectList_default = /* @__PURE__ */ defineComponent({
 									class: normalizeClass(unref(selectItem)())
 								}, {
 									default: withCtx(() => [createVNode(unref(SelectItemText), { "as-child": "" }, {
-										default: withCtx(() => [createElementVNode("span", _hoisted_5$10, [renderSlot(_ctx.$slots, "option", { option: item }, () => [createElementVNode("span", _hoisted_6$7, toDisplayString(item.label), 1), item.description ? (openBlock(), createElementBlock("span", _hoisted_7$5, toDisplayString(item.description), 1)) : createCommentVNode("", true)])])]),
+										default: withCtx(() => [createElementVNode("span", _hoisted_5$11, [renderSlot(_ctx.$slots, "option", { option: item }, () => [createElementVNode("span", _hoisted_6$8, toDisplayString(item.label), 1), item.description ? (openBlock(), createElementBlock("span", _hoisted_7$6, toDisplayString(item.description), 1)) : createCommentVNode("", true)])])]),
 										_: 2
 									}, 1024), createElementVNode("span", _hoisted_8$3, [createVNode(unref(SelectItemIndicator), null, {
 										default: withCtx(() => [createVNode(unref(Check))]),
@@ -6870,7 +6876,7 @@ function useClearTransition(visible) {
 }
 //#endregion
 //#region src/components/select/Select.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$79 = [
+var _hoisted_1$81 = [
 	"dir",
 	"data-invalid",
 	"data-disabled"
@@ -6988,7 +6994,7 @@ var Select_default = /* @__PURE__ */ defineComponent({
 						_: 1
 					}, 8, ["label"])], 2)) : createCommentVNode("", true)]),
 					_: 1
-				}, 16)], 10, _hoisted_1$79), createVNode(SelectList_default, {
+				}, 16)], 10, _hoisted_1$81), createVNode(SelectList_default, {
 					options: props.options,
 					keyboard: keyboard.value
 				}, {
@@ -7077,12 +7083,12 @@ function focusFieldFrom(root, target) {
 }
 //#endregion
 //#region src/components/input/InputBase.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$78 = [
+var _hoisted_1$80 = [
 	"data-invalid",
 	"data-disabled",
 	"aria-busy"
 ];
-var _hoisted_2$37 = [
+var _hoisted_2$39 = [
 	"id",
 	"disabled",
 	"aria-invalid",
@@ -7169,7 +7175,7 @@ var InputBase_default = /* @__PURE__ */ defineComponent({
 						leading: !!unref(slots).leading,
 						trailing: clearing.value || trailingSpinner.value || !!unref(slots).trailing
 					})
-				}), null, 16, _hoisted_2$37), [[vModelDynamic, model.value]]),
+				}), null, 16, _hoisted_2$39), [[vModelDynamic, model.value]]),
 				createVNode(Transition, {
 					"enter-active-class": "hn-transition-base",
 					"enter-from-class": "scale-90 opacity-0",
@@ -7205,7 +7211,7 @@ var InputBase_default = /* @__PURE__ */ defineComponent({
 					key: 1,
 					class: normalizeClass(unref(inputAdornment)())
 				}, [renderSlot(_ctx.$slots, "trailing")], 2)) : createCommentVNode("", true)
-			], 10, _hoisted_1$78);
+			], 10, _hoisted_1$80);
 		};
 	}
 });
@@ -7409,18 +7415,18 @@ function usePagination(props, model, sizeModel, change) {
 }
 //#endregion
 //#region src/components/pagination/Pagination.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$77 = ["dir", "aria-busy"];
-var _hoisted_2$36 = {
+var _hoisted_1$79 = ["dir", "aria-busy"];
+var _hoisted_2$38 = {
 	key: 0,
 	class: "relative min-h-0 flex-auto"
 };
-var _hoisted_3$17 = ["inert"];
-var _hoisted_4$13 = [
+var _hoisted_3$20 = ["inert"];
+var _hoisted_4$16 = [
 	"aria-label",
 	"inert",
 	"data-disabled"
 ];
-var _hoisted_5$9 = {
+var _hoisted_5$10 = {
 	key: 1,
 	class: "flex max-w-full flex-wrap items-center gap-3"
 };
@@ -7488,7 +7494,7 @@ var Pagination_default = /* @__PURE__ */ defineComponent({
 				dir: unref(rootDirection),
 				"aria-busy": props.pending || void 0,
 				class: unref(cn)("max-w-full", _ctx.$slots.list && "flex min-h-0 flex-col gap-3", props.class)
-			}), [_ctx.$slots.list ? (openBlock(), createElementBlock("div", _hoisted_2$36, [createElementVNode("div", { inert: props.pending || void 0 }, [renderSlot(_ctx.$slots, "list", normalizeProps(guardReactiveProps(unref(state))))], 8, _hoisted_3$17), createVNode(LoadingOverlay_default, { visible: props.pending }, null, 8, ["visible"])])) : createCommentVNode("", true), !props.hideSinglePage || unref(state).pageCount > 1 ? (openBlock(), createBlock(unref(PaginationRoot), {
+			}), [_ctx.$slots.list ? (openBlock(), createElementBlock("div", _hoisted_2$38, [createElementVNode("div", { inert: props.pending || void 0 }, [renderSlot(_ctx.$slots, "list", normalizeProps(guardReactiveProps(unref(state))))], 8, _hoisted_3$20), createVNode(LoadingOverlay_default, { visible: props.pending }, null, 8, ["visible"])])) : createCommentVNode("", true), !props.hideSinglePage || unref(state).pageCount > 1 ? (openBlock(), createBlock(unref(PaginationRoot), {
 				key: 1,
 				page: unref(page),
 				total: unref(total),
@@ -7515,8 +7521,8 @@ var Pagination_default = /* @__PURE__ */ defineComponent({
 						fn: withCtx((slotProps) => [renderSlot(_ctx.$slots, "ellipsis", normalizeProps(guardReactiveProps(slotProps)))]),
 						key: "1"
 					} : void 0]), 1024),
-					props.pageSizeOptions?.length || props.showJump ? (openBlock(), createElementBlock("div", _hoisted_5$9, [props.pageSizeOptions?.length ? (openBlock(), createBlock(PaginationSize_default, { key: 0 })) : createCommentVNode("", true), props.showJump ? (openBlock(), createBlock(PaginationJump_default, { key: 1 })) : createCommentVNode("", true)])) : createCommentVNode("", true)
-				])], 10, _hoisted_4$13)]),
+					props.pageSizeOptions?.length || props.showJump ? (openBlock(), createElementBlock("div", _hoisted_5$10, [props.pageSizeOptions?.length ? (openBlock(), createBlock(PaginationSize_default, { key: 0 })) : createCommentVNode("", true), props.showJump ? (openBlock(), createBlock(PaginationJump_default, { key: 1 })) : createCommentVNode("", true)])) : createCommentVNode("", true)
+				])], 10, _hoisted_4$16)]),
 				_: 3
 			}, 8, [
 				"page",
@@ -7526,13 +7532,13 @@ var Pagination_default = /* @__PURE__ */ defineComponent({
 				"show-edges",
 				"disabled",
 				"onUpdate:page"
-			])) : createCommentVNode("", true)], 16, _hoisted_1$77);
+			])) : createCommentVNode("", true)], 16, _hoisted_1$79);
 		};
 	}
 });
 //#endregion
 //#region src/components/prev-next/PrevNext.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$76 = ["aria-label"];
+var _hoisted_1$78 = ["aria-label"];
 //#endregion
 //#region src/components/prev-next/PrevNext.vue
 var PrevNext_default = /* @__PURE__ */ defineComponent({
@@ -7549,7 +7555,7 @@ var PrevNext_default = /* @__PURE__ */ defineComponent({
 			return openBlock(), createElementBlock("nav", {
 				"aria-label": props.label ?? unref(t).pagination.navLabel,
 				class: normalizeClass(unref(cn)("grid gap-4 sm:grid-cols-2", props.class))
-			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$76);
+			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$78);
 		};
 	}
 });
@@ -7573,7 +7579,7 @@ var prevNextEyebrow = tv({
 });
 //#endregion
 //#region src/components/prev-next/PrevNextLink.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$75 = { class: "text-fg font-medium" };
+var _hoisted_1$77 = { class: "text-fg font-medium" };
 //#endregion
 //#region src/components/prev-next/PrevNextLink.vue
 var PrevNextLink_default = /* @__PURE__ */ defineComponent({
@@ -7609,7 +7615,7 @@ var PrevNextLink_default = /* @__PURE__ */ defineComponent({
 						class: "size-4",
 						"aria-hidden": "true"
 					})), createTextVNode(" " + toDisplayString(props.label ?? (props.direction === "prev" ? unref(t).pagination.prev : unref(t).pagination.next)), 1)], 2),
-					createElementVNode("span", _hoisted_1$75, [renderSlot(_ctx.$slots, "default")])
+					createElementVNode("span", _hoisted_1$77, [renderSlot(_ctx.$slots, "default")])
 				]),
 				_: 3
 			}, 16, [
@@ -7686,8 +7692,8 @@ var tableCell = tv({
 });
 //#endregion
 //#region src/components/table/Table.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$74 = { class: "hn-table" };
-var _hoisted_2$35 = { key: 0 };
+var _hoisted_1$76 = { class: "hn-table" };
+var _hoisted_2$37 = { key: 0 };
 //#endregion
 //#region src/components/table/Table.vue
 var Table_default = /* @__PURE__ */ defineComponent({
@@ -7717,7 +7723,7 @@ var Table_default = /* @__PURE__ */ defineComponent({
 					stickyHeader: props.stickyHeader
 				}), props.class))
 			}, {
-				default: withCtx(() => [createElementVNode("table", _hoisted_1$74, [props.caption ? (openBlock(), createElementBlock("caption", _hoisted_2$35, [createElementVNode("span", null, toDisplayString(props.caption), 1)])) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")])]),
+				default: withCtx(() => [createElementVNode("table", _hoisted_1$76, [props.caption ? (openBlock(), createElementBlock("caption", _hoisted_2$37, [createElementVNode("span", null, toDisplayString(props.caption), 1)])) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default")])]),
 				_: 3
 			}, 8, ["direction", "class"]);
 		};
@@ -7764,7 +7770,7 @@ var TableRow_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/table/TableHead.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$73 = ["scope"];
+var _hoisted_1$75 = ["scope"];
 //#endregion
 //#region src/components/table/TableHead.vue
 var TableHead_default = /* @__PURE__ */ defineComponent({
@@ -7789,7 +7795,7 @@ var TableHead_default = /* @__PURE__ */ defineComponent({
 					sticky: props.sticky,
 					head: true
 				}), props.class))
-			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$73);
+			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$75);
 		};
 	}
 });
@@ -8279,8 +8285,8 @@ var textareaField = tv({ base: [
 ] });
 //#endregion
 //#region src/components/textarea/Textarea.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$72 = ["data-invalid", "data-disabled"];
-var _hoisted_2$34 = [
+var _hoisted_1$74 = ["data-invalid", "data-disabled"];
+var _hoisted_2$36 = [
 	"id",
 	"rows",
 	"disabled",
@@ -8349,9 +8355,9 @@ var Textarea_default = /* @__PURE__ */ defineComponent({
 					"aria-describedby": unref(describedBy),
 					class: unref(textareaField)(),
 					onInput: _cache[1] || (_cache[1] = (...args) => unref(fit) && unref(fit)(...args))
-				}), null, 16, _hoisted_2$34), [[vModelText, model.value]])]),
+				}), null, 16, _hoisted_2$36), [[vModelText, model.value]])]),
 				_: 1
-			}, 512)], 14, _hoisted_1$72);
+			}, 512)], 14, _hoisted_1$74);
 		};
 	}
 });
@@ -8485,7 +8491,7 @@ var NumberInput_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/password-input/PasswordInput.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$71 = { class: "relative inline-flex" };
+var _hoisted_1$73 = { class: "relative inline-flex" };
 //#endregion
 //#region src/components/password-input/PasswordInput.vue
 var PasswordInput_default = /* @__PURE__ */ defineComponent({
@@ -8529,7 +8535,7 @@ var PasswordInput_default = /* @__PURE__ */ defineComponent({
 					disabled: props.disabled,
 					onClick: _cache[0] || (_cache[0] = ($event) => visible.value = !visible.value)
 				}, {
-					default: withCtx(() => [createElementVNode("span", _hoisted_1$71, [createVNode(Transition, {
+					default: withCtx(() => [createElementVNode("span", _hoisted_1$73, [createVNode(Transition, {
 						"enter-active-class": "hn-transition-base",
 						"enter-from-class": "scale-90 opacity-0",
 						"leave-active-class": "hn-transition absolute",
@@ -8624,7 +8630,7 @@ var inputGroup = tv({
 var inputGroupAddon = tv({ base: "text-muted flex shrink-0 items-center gap-2 px-[var(--hn-input-px)] whitespace-nowrap [&>svg]:size-[var(--hn-input-icon)]" });
 //#endregion
 //#region src/components/input-group/InputGroup.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$70 = ["data-invalid", "data-disabled"];
+var _hoisted_1$72 = ["data-invalid", "data-disabled"];
 //#endregion
 //#region src/components/input-group/InputGroup.vue
 var InputGroup_default = /* @__PURE__ */ defineComponent({
@@ -8656,7 +8662,7 @@ var InputGroup_default = /* @__PURE__ */ defineComponent({
 					size: props.size
 				}), unref(inputGroup)({ divided: props.variant !== "bare" }), props.class)),
 				onClick: _cache[0] || (_cache[0] = ($event) => unref(focusFieldFrom)($event.currentTarget, $event.target))
-			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$70);
+			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$72);
 		};
 	}
 });
@@ -8686,18 +8692,18 @@ var multiSelectTrigger = tv({ base: [
 var multiSelectChips = tv({ base: "flex min-w-0 flex-1 items-center gap-1 overflow-hidden" });
 //#endregion
 //#region src/components/multi-select/MultiSelect.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$69 = { class: "min-w-0 truncate" };
-var _hoisted_2$33 = {
+var _hoisted_1$71 = { class: "min-w-0 truncate" };
+var _hoisted_2$35 = {
 	key: 1,
 	class: "min-w-0 truncate"
 };
-var _hoisted_3$16 = [
+var _hoisted_3$19 = [
 	"name",
 	"required",
 	"autocomplete",
 	"disabled"
 ];
-var _hoisted_4$12 = ["value", "disabled"];
+var _hoisted_4$15 = ["value", "disabled"];
 //#endregion
 //#region src/components/multi-select/MultiSelect.vue
 var MultiSelect_default = /* @__PURE__ */ defineComponent({
@@ -8801,7 +8807,7 @@ var MultiSelect_default = /* @__PURE__ */ defineComponent({
 									onClick: isolate,
 									onRemove: ($event) => remove(option.value)
 								}, {
-									default: withCtx(() => [createElementVNode("span", _hoisted_1$69, toDisplayString(option.label), 1)]),
+									default: withCtx(() => [createElementVNode("span", _hoisted_1$71, toDisplayString(option.label), 1)]),
 									_: 2
 								}, 1032, [
 									"size",
@@ -8816,7 +8822,7 @@ var MultiSelect_default = /* @__PURE__ */ defineComponent({
 							}, {
 								default: withCtx(() => [createTextVNode(" +" + toDisplayString(overflow.value), 1)]),
 								_: 1
-							}, 8, ["size", "disabled"])) : createCommentVNode("", true)], 64)) : (openBlock(), createElementBlock("span", _hoisted_2$33, toDisplayString(props.placeholder ?? unref(t).select.placeholder), 1))], 2),
+							}, 8, ["size", "disabled"])) : createCommentVNode("", true)], 64)) : (openBlock(), createElementBlock("span", _hoisted_2$35, toDisplayString(props.placeholder ?? unref(t).select.placeholder), 1))], 2),
 							createVNode(Transition, {
 								"enter-active-class": "hn-transition-base",
 								"enter-from-class": "scale-90 opacity-0",
@@ -8868,8 +8874,8 @@ var MultiSelect_default = /* @__PURE__ */ defineComponent({
 								key: option.value,
 								value: option.value,
 								disabled: option.disabled
-							}, toDisplayString(option.label), 9, _hoisted_4$12);
-						}), 128))], 8, _hoisted_3$16), [[vModelSelect, model.value]])]),
+							}, toDisplayString(option.label), 9, _hoisted_4$15);
+						}), 128))], 8, _hoisted_3$19), [[vModelSelect, model.value]])]),
 						_: 1
 					})) : createCommentVNode("", true),
 					createVNode(SelectList_default, {
@@ -8891,21 +8897,83 @@ var MultiSelect_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
+//#region src/components/combobox/composables/useOptionLabels.ts
+function useOptionLabels(options, selectedOptions) {
+	const labels = reactive(/* @__PURE__ */ new Map());
+	watch([options, selectedOptions], ([items, selected]) => {
+		for (const option of flattenOptions(items)) labels.set(option.value, option.label);
+		for (const option of selected ?? []) labels.set(option.value, option.label);
+	}, {
+		immediate: true,
+		deep: true
+	});
+	return labels;
+}
+//#endregion
+//#region src/components/combobox/composables/useCombobox.ts
+function useCombobox(options) {
+	const { model, search, open } = options;
+	const labels = useOptionLabels(options.options, () => {
+		const option = options.selectedOption();
+		return option ? [option] : [];
+	});
+	const label = computed(() => displayValue(model.value));
+	const editing = ref(false);
+	const keyboard = ref(false);
+	const input = shallowRef(null);
+	function displayValue(value) {
+		return value == null ? "" : labels.get(value) ?? "";
+	}
+	function clear() {
+		model.value = null;
+		search.value = "";
+		options.onClear();
+		input.value?.$el.focus();
+	}
+	function onInput(event) {
+		if (options.disabled()) return;
+		editing.value = true;
+		if (event.isComposing) return;
+		if (event.target.value === "" && model.value != null) model.value = null;
+	}
+	function onHostClick(event) {
+		focusFieldFrom(event.currentTarget, event.target);
+	}
+	watch(open, (value) => {
+		if (!value) {
+			keyboard.value = false;
+			editing.value = false;
+		}
+	});
+	watch(model, () => editing.value = false, { flush: "sync" });
+	watch(label, (value) => {
+		if (!editing.value) search.value = value;
+	});
+	return {
+		keyboard,
+		input,
+		displayValue,
+		clear,
+		onInput,
+		onHostClick
+	};
+}
+//#endregion
 //#region src/components/combobox/combobox.variants.ts
 var comboboxContent = tv({ base: ["hn-anim-pop z-(--hn-z-overlay) flex w-[var(--reka-combobox-trigger-width)] min-w-40 flex-col overflow-hidden shadow-md outline-none", "[&[data-hn-fresh]_[data-highlighted]:not(:hover)]:[--hn-state-hover-opacity:0]"] });
 var comboboxList = tv({ base: "max-h-[min(20rem,var(--reka-combobox-content-available-height))]" });
 //#endregion
 //#region src/components/combobox/ComboboxList.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$68 = { class: "min-w-0 flex-1" };
-var _hoisted_2$32 = { class: "block truncate" };
-var _hoisted_3$15 = {
+var _hoisted_1$70 = { class: "min-w-0 flex-1" };
+var _hoisted_2$34 = { class: "block truncate" };
+var _hoisted_3$18 = {
 	key: 0,
 	class: "text-muted block truncate text-xs"
 };
-var _hoisted_4$11 = { class: "flex size-4 shrink-0 items-center justify-center" };
-var _hoisted_5$8 = { class: "min-w-0 flex-1" };
-var _hoisted_6$6 = { class: "block truncate" };
-var _hoisted_7$4 = {
+var _hoisted_4$14 = { class: "flex size-4 shrink-0 items-center justify-center" };
+var _hoisted_5$9 = { class: "min-w-0 flex-1" };
+var _hoisted_6$7 = { class: "block truncate" };
+var _hoisted_7$5 = {
 	key: 0,
 	class: "text-muted block truncate text-xs"
 };
@@ -8954,7 +9022,7 @@ var ComboboxList_default = /* @__PURE__ */ defineComponent({
 											disabled: option.disabled,
 											class: normalizeClass(unref(selectItem)())
 										}, {
-											default: withCtx(() => [createElementVNode("span", _hoisted_1$68, [renderSlot(_ctx.$slots, "option", { option }, () => [createElementVNode("span", _hoisted_2$32, toDisplayString(option.label), 1), option.description ? (openBlock(), createElementBlock("span", _hoisted_3$15, toDisplayString(option.description), 1)) : createCommentVNode("", true)])]), createElementVNode("span", _hoisted_4$11, [createVNode(unref(ComboboxItemIndicator), null, {
+											default: withCtx(() => [createElementVNode("span", _hoisted_1$70, [renderSlot(_ctx.$slots, "option", { option }, () => [createElementVNode("span", _hoisted_2$34, toDisplayString(option.label), 1), option.description ? (openBlock(), createElementBlock("span", _hoisted_3$18, toDisplayString(option.description), 1)) : createCommentVNode("", true)])]), createElementVNode("span", _hoisted_4$14, [createVNode(unref(ComboboxItemIndicator), null, {
 												default: withCtx(() => [createVNode(unref(Check))]),
 												_: 1
 											})])]),
@@ -8974,7 +9042,7 @@ var ComboboxList_default = /* @__PURE__ */ defineComponent({
 									disabled: item.disabled,
 									class: normalizeClass(unref(selectItem)())
 								}, {
-									default: withCtx(() => [createElementVNode("span", _hoisted_5$8, [renderSlot(_ctx.$slots, "option", { option: item }, () => [createElementVNode("span", _hoisted_6$6, toDisplayString(item.label), 1), item.description ? (openBlock(), createElementBlock("span", _hoisted_7$4, toDisplayString(item.description), 1)) : createCommentVNode("", true)])]), createElementVNode("span", _hoisted_8$2, [createVNode(unref(ComboboxItemIndicator), null, {
+									default: withCtx(() => [createElementVNode("span", _hoisted_5$9, [renderSlot(_ctx.$slots, "option", { option: item }, () => [createElementVNode("span", _hoisted_6$7, toDisplayString(item.label), 1), item.description ? (openBlock(), createElementBlock("span", _hoisted_7$5, toDisplayString(item.description), 1)) : createCommentVNode("", true)])]), createElementVNode("span", _hoisted_8$2, [createVNode(unref(ComboboxItemIndicator), null, {
 										default: withCtx(() => [createVNode(unref(Check))]),
 										_: 1
 									})])]),
@@ -9002,7 +9070,7 @@ var ComboboxList_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/combobox/Combobox.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$67 = ["data-invalid", "data-disabled"];
+var _hoisted_1$69 = ["data-invalid", "data-disabled"];
 //#endregion
 //#region src/components/combobox/Combobox.vue
 var Combobox_default = /* @__PURE__ */ defineComponent({
@@ -9011,6 +9079,7 @@ var Combobox_default = /* @__PURE__ */ defineComponent({
 	__name: "Combobox",
 	props: /*@__PURE__*/ mergeModels({
 		options: {},
+		selectedOption: {},
 		placeholder: {},
 		ignoreFilter: { type: Boolean },
 		clearable: { type: Boolean },
@@ -9043,28 +9112,20 @@ var Combobox_default = /* @__PURE__ */ defineComponent({
 		const open = useModel(__props, "open");
 		const t = useUiLocale();
 		const group = injectInputGroup();
-		const keyboard = ref(false);
-		const input = shallowRef(null);
 		computed(() => group ? group.size.value : props.size);
 		const { id: fieldId, invalid, disabled, describedBy } = useFieldControl({
 			invalid: () => props.invalid || !!group?.invalid.value,
 			disabled: () => props.disabled || !!group?.disabled.value
 		});
 		const clearing = computed(() => !!props.clearable && model.value != null && model.value !== "" && !disabled.value);
-		function displayValue(value) {
-			return flattenOptions(props.options).find((option) => option.value === value)?.label ?? "";
-		}
-		function clear() {
-			model.value = null;
-			search.value = "";
-			emit("clear");
-			input.value?.$el.focus();
-		}
-		watch(search, (value) => {
-			if (value === "" && model.value != null) model.value = null;
-		});
-		watch(open, (value) => {
-			if (!value) keyboard.value = false;
+		const { keyboard, input, displayValue, clear, onInput, onHostClick } = useCombobox({
+			options: () => props.options,
+			selectedOption: () => props.selectedOption,
+			model,
+			search,
+			open,
+			disabled: () => disabled.value,
+			onClear: () => emit("clear")
 		});
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(ComboboxRoot), {
@@ -9085,7 +9146,7 @@ var Combobox_default = /* @__PURE__ */ defineComponent({
 							variant: props.variant,
 							size: props.size
 						}), props.class)),
-						onClick: _cache[2] || (_cache[2] = ($event) => unref(focusFieldFrom)($event.currentTarget, $event.target)),
+						onClick: _cache[2] || (_cache[2] = (...args) => unref(onHostClick) && unref(onHostClick)(...args)),
 						onKeydown: _cache[3] || (_cache[3] = ($event) => keyboard.value = true)
 					}, [
 						createVNode(unref(ComboboxInput), mergeProps({
@@ -9096,19 +9157,22 @@ var Combobox_default = /* @__PURE__ */ defineComponent({
 							"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => search.value = $event),
 							id: unref(fieldId),
 							"aria-describedby": unref(describedBy),
-							"display-value": displayValue,
+							"display-value": unref(displayValue),
 							placeholder: props.placeholder ?? unref(t).combobox.placeholder,
 							disabled: unref(disabled),
 							"aria-invalid": unref(invalid) || void 0,
-							class: unref(inputControl)({ trailing: true })
+							class: unref(inputControl)({ trailing: true }),
+							onInput: unref(onInput)
 						}), null, 16, [
 							"modelValue",
 							"id",
 							"aria-describedby",
+							"display-value",
 							"placeholder",
 							"disabled",
 							"aria-invalid",
-							"class"
+							"class",
+							"onInput"
 						]),
 						createVNode(Transition, {
 							"enter-active-class": "hn-transition-base",
@@ -9122,11 +9186,11 @@ var Combobox_default = /* @__PURE__ */ defineComponent({
 								class: normalizeClass(unref(inputActionSlot)())
 							}, [createVNode(InputAction_default, {
 								label: unref(t).common.clear,
-								onClick: clear
+								onClick: unref(clear)
 							}, {
 								default: withCtx(() => [createVNode(unref(X))]),
 								_: 1
-							}, 8, ["label"])], 2)) : createCommentVNode("", true)]),
+							}, 8, ["label", "onClick"])], 2)) : createCommentVNode("", true)]),
 							_: 1
 						}),
 						createVNode(unref(ComboboxTrigger), {
@@ -9142,11 +9206,11 @@ var Combobox_default = /* @__PURE__ */ defineComponent({
 							"disabled",
 							"class"
 						])
-					], 42, _hoisted_1$67)]),
+					], 42, _hoisted_1$69)]),
 					_: 1
 				}), createVNode(ComboboxList_default, {
 					options: props.options,
-					keyboard: keyboard.value
+					keyboard: unref(keyboard)
 				}, {
 					option: withCtx((slotProps) => [renderSlot(_ctx.$slots, "option", normalizeProps(guardReactiveProps(slotProps)))]),
 					_: 3
@@ -9191,11 +9255,11 @@ var commandItemHint = tv({ base: "ms-auto flex shrink-0 items-center gap-1" });
 var commandEmpty = tv({ base: "text-muted px-4 py-8 text-center text-sm" });
 //#endregion
 //#region src/components/command-palette/CommandPaletteItem.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$66 = { class: "truncate" };
-var _hoisted_2$31 = ["textContent"];
-var _hoisted_3$14 = ["textContent"];
-var _hoisted_4$10 = ["textContent"];
-var _hoisted_5$7 = {
+var _hoisted_1$68 = { class: "truncate" };
+var _hoisted_2$33 = ["textContent"];
+var _hoisted_3$17 = ["textContent"];
+var _hoisted_4$13 = ["textContent"];
+var _hoisted_5$8 = {
 	key: 0,
 	class: "text-muted truncate text-xs"
 };
@@ -9236,18 +9300,18 @@ var CommandPaletteItem_default = /* @__PURE__ */ defineComponent({
 						"aria-hidden": "true",
 						class: "text-muted"
 					})) : createCommentVNode("", true),
-					createElementVNode("span", { class: normalizeClass(unref(commandItemBody)()) }, [createElementVNode("span", _hoisted_1$66, [
-						createElementVNode("span", { textContent: toDisplayString(parts.value[0]) }, null, 8, _hoisted_2$31),
+					createElementVNode("span", { class: normalizeClass(unref(commandItemBody)()) }, [createElementVNode("span", _hoisted_1$68, [
+						createElementVNode("span", { textContent: toDisplayString(parts.value[0]) }, null, 8, _hoisted_2$33),
 						parts.value[1] ? (openBlock(), createElementBlock("span", {
 							key: 0,
 							class: normalizeClass(unref(commandItemMatch)()),
 							textContent: toDisplayString(parts.value[1])
-						}, null, 10, _hoisted_3$14)) : createCommentVNode("", true),
+						}, null, 10, _hoisted_3$17)) : createCommentVNode("", true),
 						parts.value[2] ? (openBlock(), createElementBlock("span", {
 							key: 1,
 							textContent: toDisplayString(parts.value[2])
-						}, null, 8, _hoisted_4$10)) : createCommentVNode("", true)
-					]), props.match.item.description ? (openBlock(), createElementBlock("span", _hoisted_5$7, toDisplayString(props.match.item.description), 1)) : createCommentVNode("", true)], 2),
+						}, null, 8, _hoisted_4$13)) : createCommentVNode("", true)
+					]), props.match.item.description ? (openBlock(), createElementBlock("span", _hoisted_5$8, toDisplayString(props.match.item.description), 1)) : createCommentVNode("", true)], 2),
 					props.match.item.kbd?.length ? (openBlock(), createElementBlock("span", {
 						key: 1,
 						class: normalizeClass(unref(commandItemHint)())
@@ -9588,13 +9652,13 @@ var CommandPalette_default = /* @__PURE__ */ defineComponent({
 });
 //#endregion
 //#region src/components/listbox/ListboxOptionContent.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$65 = { class: "min-w-0 flex-1" };
-var _hoisted_2$30 = { class: "block truncate" };
-var _hoisted_3$13 = {
+var _hoisted_1$67 = { class: "min-w-0 flex-1" };
+var _hoisted_2$32 = { class: "block truncate" };
+var _hoisted_3$16 = {
 	key: 0,
 	class: "text-muted block truncate text-xs"
 };
-var _hoisted_4$9 = {
+var _hoisted_4$12 = {
 	key: 1,
 	class: "flex size-4 shrink-0 items-center justify-center"
 };
@@ -9610,13 +9674,13 @@ var ListboxOptionContent_default = /* @__PURE__ */ defineComponent({
 		const slots = useSlots();
 		const { isSelected: selected } = injectListboxItemContext();
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock(Fragment, null, [createElementVNode("span", _hoisted_1$65, [renderSlot(_ctx.$slots, "option", {
+			return openBlock(), createElementBlock(Fragment, null, [createElementVNode("span", _hoisted_1$67, [renderSlot(_ctx.$slots, "option", {
 				option: props.option,
 				selected: unref(selected)
-			}, () => [createElementVNode("span", _hoisted_2$30, toDisplayString(props.option.label), 1), props.option.description ? (openBlock(), createElementBlock("span", _hoisted_3$13, toDisplayString(props.option.description), 1)) : createCommentVNode("", true)])]), slots.trailing ? renderSlot(_ctx.$slots, "trailing", {
+			}, () => [createElementVNode("span", _hoisted_2$32, toDisplayString(props.option.label), 1), props.option.description ? (openBlock(), createElementBlock("span", _hoisted_3$16, toDisplayString(props.option.description), 1)) : createCommentVNode("", true)])]), slots.trailing ? renderSlot(_ctx.$slots, "trailing", {
 				option: props.option,
 				selected: unref(selected)
-			}, void 0, void 0, 0) : (openBlock(), createElementBlock("span", _hoisted_4$9, [createVNode(unref(ListboxItemIndicator), null, {
+			}, void 0, void 0, 0) : (openBlock(), createElementBlock("span", _hoisted_4$12, [createVNode(unref(ListboxItemIndicator), null, {
 				default: withCtx(() => [createVNode(unref(Check))]),
 				_: 1
 			})]))], 64);
@@ -9760,6 +9824,406 @@ var Listbox_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
+//#region src/components/checkbox/checkbox.variants.ts
+var checkbox = tv({
+	base: ["text-fg grid w-fit max-w-full cursor-pointer items-center gap-x-[var(--hn-field-gap)] select-none", "data-disabled:cursor-not-allowed data-disabled:opacity-50"],
+	variants: {
+		controlPlacement: {
+			start: "grid-cols-[auto_minmax(0,1fr)]",
+			end: "grid-cols-[minmax(0,1fr)_auto]"
+		},
+		block: { true: "w-full" },
+		bare: { true: "gap-x-0" },
+		size: {
+			sm: "text-sm",
+			md: "text-base",
+			lg: "text-md"
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		controlPlacement: "start",
+		block: false
+	}
+});
+var checkboxControl = tv({
+	base: "row-start-1",
+	variants: { controlPlacement: {
+		start: "col-start-1 justify-self-start",
+		end: "col-start-2 justify-self-end"
+	} },
+	defaultVariants: { controlPlacement: "start" }
+});
+var checkboxBox = tv({
+	base: [
+		"hn-focus-ring hn-state-layer hn-transition-base relative grid shrink-0 cursor-pointer place-items-center",
+		"size-[var(--hn-checkbox-size)] border",
+		"border-line bg-surface shadow-sm disabled:cursor-not-allowed",
+		"[--hn-state-selected-color:var(--hn-accent-on)] [--hn-state-selected-opacity:0]",
+		"data-[state=checked]:border-accent data-[state=checked]:bg-accent data-[state=checked]:text-surface",
+		"data-[state=indeterminate]:border-accent data-[state=indeterminate]:bg-accent data-[state=indeterminate]:text-surface",
+		"data-invalid:border-danger data-invalid:focus-visible:outline-danger",
+		"[&_svg]:col-start-1 [&_svg]:row-start-1 [&_svg]:size-[var(--hn-checkbox-icon)] [&_svg]:stroke-[3]"
+	],
+	variants: {
+		shape: {
+			square: "rounded-xs",
+			round: "rounded-full"
+		},
+		size: {
+			sm: "[--hn-checkbox-icon:0.625rem] [--hn-checkbox-size:0.875rem]",
+			md: "[--hn-checkbox-icon:0.75rem] [--hn-checkbox-size:1rem]",
+			lg: "[--hn-checkbox-icon:0.875rem] [--hn-checkbox-size:1.125rem]"
+		}
+	},
+	defaultVariants: {
+		shape: "square",
+		size: "md"
+	}
+});
+var checkboxTitle = tv({
+	base: "row-start-1 flex min-h-[1lh] min-w-0 items-center",
+	variants: { controlPlacement: {
+		start: "col-start-2",
+		end: "col-start-1"
+	} },
+	defaultVariants: { controlPlacement: "start" }
+});
+var checkboxTitleText = tv({ base: "block [text-box:trim-both_cap_alphabetic]" });
+var checkboxDescription = tv({
+	base: "text-muted row-start-2 block",
+	variants: {
+		controlPlacement: {
+			start: "col-start-2",
+			end: "col-start-1"
+		},
+		size: {
+			sm: "text-xs",
+			md: "text-sm",
+			lg: "text-base"
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		controlPlacement: "start"
+	}
+});
+//#endregion
+//#region src/components/tree/TreeCheck.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$66 = ["data-state"];
+//#endregion
+//#region src/components/tree/TreeCheck.vue
+var TreeCheck_default = /* @__PURE__ */ defineComponent({
+	name: "HnTreeCheck",
+	__name: "TreeCheck",
+	props: {
+		selected: { type: Boolean },
+		indeterminate: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", {
+				"aria-hidden": "true",
+				"data-state": props.indeterminate ? "indeterminate" : props.selected ? "checked" : "unchecked",
+				class: normalizeClass([unref(checkboxBox)(), "pointer-events-none"])
+			}, [createVNode(Transition, {
+				"enter-active-class": "hn-transition-press",
+				"enter-from-class": "scale-50 opacity-0",
+				"leave-active-class": "hn-transition",
+				"leave-to-class": "scale-50 opacity-0"
+			}, {
+				default: withCtx(() => [props.selected ? (openBlock(), createBlock(unref(Check), { key: 0 })) : createCommentVNode("", true)]),
+				_: 1
+			}), createVNode(Transition, {
+				"enter-active-class": "hn-transition-press",
+				"enter-from-class": "scale-50 opacity-0",
+				"leave-active-class": "hn-transition",
+				"leave-to-class": "scale-50 opacity-0"
+			}, {
+				default: withCtx(() => [props.indeterminate ? (openBlock(), createBlock(unref(Minus), { key: 0 })) : createCommentVNode("", true)]),
+				_: 1
+			})], 10, _hoisted_1$66);
+		};
+	}
+});
+//#endregion
+//#region src/components/tree/utils/selection.ts
+function indexTree(nodes) {
+	const entries = /* @__PURE__ */ new Map();
+	function visit(node, parent, disabled = false) {
+		const entry = {
+			node,
+			parent,
+			disabled: disabled || !!node.disabled,
+			children: node.children?.map((child) => child.value) ?? []
+		};
+		entries.set(node.value, entry);
+		node.children?.forEach((child) => visit(child, node.value, entry.disabled));
+	}
+	nodes.forEach((node) => visit(node));
+	return {
+		roots: nodes.map((node) => node.value),
+		entries
+	};
+}
+function checkedState(tree, values) {
+	const checked = new Set(values);
+	const states = /* @__PURE__ */ new Map();
+	function visit(value, inherited = false) {
+		const entry = tree.entries.get(value);
+		const own = checked.has(value) || !entry.disabled && inherited;
+		const enabled = entry.children.map((child) => visit(child, !entry.disabled && own)).filter((child) => !child.disabled);
+		const selected = entry.disabled || enabled.length === 0 ? own : enabled.every((child) => child.selected);
+		const state = {
+			selected,
+			indeterminate: !entry.disabled && !selected && enabled.some((child) => child.selected || child.indeterminate),
+			disabled: entry.disabled
+		};
+		states.set(value, state);
+		return state;
+	}
+	tree.roots.forEach((value) => visit(value));
+	return states;
+}
+function toggleChecked(tree, values, value) {
+	const entry = tree.entries.get(value);
+	if (!entry || entry.disabled) return values;
+	const states = checkedState(tree, values);
+	const checked = new Set(values.filter((value) => !tree.entries.has(value)));
+	states.forEach((state, value) => {
+		if (state.selected) checked.add(value);
+	});
+	const selected = !states.get(value).selected;
+	function visit(value) {
+		const entry = tree.entries.get(value);
+		if (entry.disabled) return;
+		if (selected) checked.add(value);
+		else checked.delete(value);
+		entry.children.forEach(visit);
+	}
+	visit(value);
+	let parent = entry.parent;
+	while (parent !== void 0) {
+		checked.delete(parent);
+		parent = tree.entries.get(parent).parent;
+	}
+	const next = checkedState(tree, [...checked]);
+	return [...[...checked].filter((value) => !tree.entries.has(value)), ...[...tree.entries.keys()].filter((value) => next.get(value).selected)];
+}
+//#endregion
+//#region src/components/tree/composables/useTree.ts
+function useTree(props, model, expandedModel, disabled) {
+	const initialExpanded = [...props.defaultExpanded];
+	const index = computed(() => indexTree(props.items));
+	const states = computed(() => {
+		if (props.multiple) return checkedState(index.value, Array.isArray(model.value) ? model.value : []);
+		return new Map([...index.value.entries].map(([value, entry]) => [value, {
+			selected: value === model.value,
+			indeterminate: false,
+			disabled: entry.disabled
+		}]));
+	});
+	const selected = computed(() => [...index.value.entries.values()].filter((entry) => states.value.get(entry.node.value)?.selected).map((entry) => entry.node));
+	const keys = computed(() => new Map([...index.value.entries].map(([value, entry]) => [key(entry.node), value])));
+	const expanded = computed({
+		get: () => (expandedModel.value ?? initialExpanded).map((value) => key({ value })),
+		set: (value) => {
+			expandedModel.value = value.flatMap((key) => keys.value.has(key) ? [keys.value.get(key)] : []);
+		}
+	});
+	function key(node) {
+		return `${typeof node.value}:${node.value}`;
+	}
+	function getChildren(node) {
+		return node.children?.length ? node.children : void 0;
+	}
+	function state(node) {
+		const value = states.value.get(node.value);
+		return {
+			...value,
+			disabled: disabled.value || value.disabled
+		};
+	}
+	function select(event) {
+		event.preventDefault();
+		const node = event.detail.value;
+		if (!node || state(node).disabled) return;
+		model.value = props.multiple ? toggleChecked(index.value, Array.isArray(model.value) ? model.value : [], node.value) : model.value === node.value ? null : node.value;
+	}
+	function toggle(node) {
+		if (state(node).disabled || !getChildren(node)) return;
+		const value = key(node);
+		expanded.value = expanded.value.includes(value) ? expanded.value.filter((key) => key !== value) : [...expanded.value, value];
+	}
+	function keepRowClick(event) {
+		if (event.detail.originalEvent.type === "click") event.preventDefault();
+	}
+	return {
+		selected,
+		expanded,
+		key,
+		getChildren,
+		state,
+		select,
+		toggle,
+		keepRowClick
+	};
+}
+//#endregion
+//#region src/components/tree/tree.variants.ts
+var tree = tv({ base: "flex w-full min-w-0 flex-col outline-none" });
+var treeRow = tv({ base: [
+	"hn-interactive hn-state-layer hn-press-none relative isolate flex w-full cursor-pointer",
+	"items-center gap-(--hn-control-gap) rounded-md py-2 pe-2.5 text-start text-sm select-none",
+	"ps-[calc(0.375rem+var(--hn-tree-level)*1.25rem)] text-fg outline-none",
+	"data-disabled:pointer-events-none data-disabled:opacity-50"
+] });
+var treeToggle = tv({ base: "text-muted flex size-5 shrink-0 cursor-pointer items-center justify-center rounded-sm rtl:-scale-x-100 [&>span>svg]:size-3.5" });
+var treeEmpty = tv({ base: "text-muted px-2.5 py-2 text-sm" });
+//#endregion
+//#region src/components/tree/Tree.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$65 = [
+	"id",
+	"aria-labelledby",
+	"aria-describedby"
+];
+var _hoisted_2$31 = ["aria-selected", "aria-checked"];
+var _hoisted_3$15 = ["onClick"];
+var _hoisted_4$11 = {
+	key: 1,
+	class: "size-5 shrink-0",
+	"aria-hidden": "true"
+};
+var _hoisted_5$7 = { class: "min-w-0 flex-1" };
+var _hoisted_6$6 = { class: "block truncate" };
+var _hoisted_7$4 = {
+	key: 0,
+	class: "text-muted block truncate text-xs"
+};
+//#endregion
+//#region src/components/tree/Tree.vue
+var Tree_default = /* @__PURE__ */ defineComponent({
+	name: "HnTree",
+	inheritAttrs: false,
+	__name: "Tree",
+	props: /*@__PURE__*/ mergeModels({
+		items: {},
+		multiple: { type: Boolean },
+		defaultExpanded: { default: () => [] },
+		disabled: { type: Boolean },
+		invalid: { type: Boolean },
+		class: {}
+	}, {
+		"modelValue": {},
+		"modelModifiers": {},
+		"expanded": {},
+		"expandedModifiers": {}
+	}),
+	emits: ["update:modelValue", "update:expanded"],
+	setup(__props) {
+		const props = __props;
+		const model = useModel(__props, "modelValue");
+		const expandedModel = useModel(__props, "expanded");
+		const t = useUiLocale();
+		const { id, labelledBy, describedBy, disabled, invalid } = useFieldControl({
+			disabled: () => props.disabled,
+			invalid: () => props.invalid
+		});
+		const { selected, expanded, key, getChildren, state, select, toggle, keepRowClick } = useTree(props, model, expandedModel, disabled);
+		return (_ctx, _cache) => {
+			return props.items.length === 0 ? (openBlock(), createElementBlock("div", mergeProps({ key: 0 }, _ctx.$attrs, {
+				id: unref(id),
+				role: "status",
+				"aria-labelledby": unref(labelledBy),
+				"aria-describedby": unref(describedBy),
+				"data-hn-tree": "",
+				class: unref(cn)(unref(treeEmpty)(), props.class)
+			}), [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(unref(t).tree.empty), 1)])], 16, _hoisted_1$65)) : (openBlock(), createBlock(unref(TreeRoot), mergeProps({ key: 1 }, _ctx.$attrs, {
+				id: unref(id),
+				expanded: unref(expanded),
+				"onUpdate:expanded": _cache[0] || (_cache[0] = ($event) => isRef(expanded) ? expanded.value = $event : null),
+				items: props.items,
+				"get-key": unref(key),
+				"get-children": unref(getChildren),
+				"model-value": props.multiple ? unref(selected) : unref(selected)[0],
+				multiple: props.multiple,
+				disabled: unref(disabled),
+				"aria-labelledby": unref(labelledBy),
+				"aria-describedby": unref(describedBy),
+				"aria-invalid": unref(invalid) || void 0,
+				"aria-disabled": unref(disabled) || void 0,
+				"data-hn-tree": "",
+				"data-disabled": unref(disabled) ? "" : void 0,
+				"data-invalid": unref(invalid) ? "" : void 0,
+				class: unref(cn)(unref(tree)(), props.class)
+			}), {
+				default: withCtx(({ flattenItems }) => [(openBlock(true), createElementBlock(Fragment, null, renderList(flattenItems, (item) => {
+					return openBlock(), createBlock(unref(TreeItem), mergeProps({ key: item._id }, { ref_for: true }, item.bind, {
+						disabled: unref(state)(item.value).disabled,
+						"as-child": "",
+						onSelect: unref(select),
+						onToggle: unref(keepRowClick)
+					}), {
+						default: withCtx(({ isExpanded }) => [createElementVNode("li", {
+							"aria-selected": props.multiple ? void 0 : unref(state)(item.value).selected,
+							"aria-checked": props.multiple ? unref(state)(item.value).indeterminate ? "mixed" : unref(state)(item.value).selected : void 0,
+							style: normalizeStyle({ "--hn-tree-level": item.level - 1 }),
+							class: normalizeClass(unref(treeRow)())
+						}, [
+							item.hasChildren ? (openBlock(), createElementBlock("span", {
+								key: 0,
+								class: normalizeClass(unref(treeToggle)()),
+								"aria-hidden": "true",
+								"data-hn-tree-toggle": "",
+								onClick: withModifiers(($event) => unref(toggle)(item.value), ["stop"])
+							}, [createVNode(DisclosureIcon_default, {
+								direction: "end",
+								open: isExpanded
+							}, null, 8, ["open"])], 10, _hoisted_3$15)) : (openBlock(), createElementBlock("span", _hoisted_4$11)),
+							props.multiple ? (openBlock(), createBlock(TreeCheck_default, {
+								key: 2,
+								selected: unref(state)(item.value).selected,
+								indeterminate: unref(state)(item.value).indeterminate
+							}, null, 8, ["selected", "indeterminate"])) : createCommentVNode("", true),
+							createElementVNode("span", _hoisted_5$7, [renderSlot(_ctx.$slots, "node", mergeProps({
+								node: item.value,
+								expanded: isExpanded
+							}, { ref_for: true }, unref(state)(item.value)), () => [createElementVNode("span", _hoisted_6$6, toDisplayString(item.value.label), 1), item.value.description ? (openBlock(), createElementBlock("span", _hoisted_7$4, toDisplayString(item.value.description), 1)) : createCommentVNode("", true)])]),
+							renderSlot(_ctx.$slots, "trailing", mergeProps({
+								node: item.value,
+								expanded: isExpanded
+							}, { ref_for: true }, unref(state)(item.value)))
+						], 14, _hoisted_2$31)]),
+						_: 2
+					}, 1040, [
+						"disabled",
+						"onSelect",
+						"onToggle"
+					]);
+				}), 128))]),
+				_: 3
+			}, 16, [
+				"id",
+				"expanded",
+				"items",
+				"get-key",
+				"get-children",
+				"model-value",
+				"multiple",
+				"disabled",
+				"aria-labelledby",
+				"aria-describedby",
+				"aria-invalid",
+				"aria-disabled",
+				"data-disabled",
+				"data-invalid",
+				"class"
+			]));
+		};
+	}
+});
+//#endregion
 //#region src/components/tree-select/tree-select.variants.ts
 var treeSelectContent = tv({ base: ["hn-anim-pop z-(--hn-z-overlay) flex w-[var(--reka-popover-trigger-width)] min-w-40 max-h-[var(--reka-popover-content-available-height)] flex-col overflow-hidden shadow-md outline-none"] });
 var treeSelectList = tv({ base: "min-h-0 max-h-80" });
@@ -9773,7 +10237,7 @@ var treeSelectToggle = tv({ base: ["text-muted flex size-5 shrink-0 cursor-point
 //#endregion
 //#region src/components/tree-select/TreeSelectSearch.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$64 = { class: "border-line shrink-0 border-b px-1" };
-var _hoisted_2$29 = [
+var _hoisted_2$30 = [
 	"aria-label",
 	"aria-controls",
 	"placeholder"
@@ -9821,7 +10285,7 @@ var TreeSelectSearch_default = /* @__PURE__ */ defineComponent({
 						trailing: !!model.value
 					})),
 					onKeydown: _cache[1] || (_cache[1] = ($event) => emit("keydown", $event))
-				}, null, 42, _hoisted_2$29), [[vModelText, model.value]]),
+				}, null, 42, _hoisted_2$30), [[vModelText, model.value]]),
 				createVNode(Transition, {
 					"enter-active-class": "hn-transition-base",
 					"enter-from-class": "scale-90 opacity-0",
@@ -9984,9 +10448,9 @@ var _hoisted_1$63 = [
 	"data-disabled",
 	"aria-invalid"
 ];
-var _hoisted_2$28 = { class: "min-w-0 flex-1 truncate" };
-var _hoisted_3$12 = ["onClick"];
-var _hoisted_4$8 = {
+var _hoisted_2$29 = { class: "min-w-0 flex-1 truncate" };
+var _hoisted_3$14 = ["onClick"];
+var _hoisted_4$10 = {
 	key: 1,
 	class: "size-5 shrink-0"
 };
@@ -10067,7 +10531,7 @@ var TreeSelect_default = /* @__PURE__ */ defineComponent({
 							variant: props.variant,
 							size: props.size
 						}), unref(selectTrigger)(), props.class)
-					}), [createElementVNode("span", _hoisted_2$28, toDisplayString(unref(selected) ? unref(selected).label : props.placeholder ?? unref(t).select.placeholder), 1), createElementVNode("span", { class: normalizeClass(unref(inputAdornment)()) }, [createVNode(DisclosureIcon_default)], 2)], 16, _hoisted_1$63)]),
+					}), [createElementVNode("span", _hoisted_2$29, toDisplayString(unref(selected) ? unref(selected).label : props.placeholder ?? unref(t).select.placeholder), 1), createElementVNode("span", { class: normalizeClass(unref(inputAdornment)()) }, [createVNode(DisclosureIcon_default)], 2)], 16, _hoisted_1$63)]),
 					_: 1
 				}), createVNode(unref(PopoverPortal), null, {
 					default: withCtx(() => [createVNode(unref(PopoverContent), {
@@ -10134,7 +10598,7 @@ var TreeSelect_default = /* @__PURE__ */ defineComponent({
 												}, [createVNode(DisclosureIcon_default, {
 													direction: "end",
 													open: isExpanded
-												}, null, 8, ["open"])], 10, _hoisted_3$12)) : (openBlock(), createElementBlock("span", _hoisted_4$8)),
+												}, null, 8, ["open"])], 10, _hoisted_3$14)) : (openBlock(), createElementBlock("span", _hoisted_4$10)),
 												createElementVNode("span", _hoisted_5$6, [renderSlot(_ctx.$slots, "node", { node: item.value }, () => [createElementVNode("span", _hoisted_6$5, toDisplayString(item.value.label), 1), item.value.description ? (openBlock(), createElementBlock("span", _hoisted_7$3, toDisplayString(item.value.description), 1)) : createCommentVNode("", true)])]),
 												createElementVNode("span", _hoisted_8$1, [isSelected ? (openBlock(), createBlock(unref(Check), { key: 0 })) : createCommentVNode("", true)])
 											]),
@@ -10183,91 +10647,6 @@ var TreeSelect_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
-//#region src/components/checkbox/checkbox.variants.ts
-var checkbox = tv({
-	base: ["text-fg grid w-fit max-w-full cursor-pointer items-center gap-x-[var(--hn-field-gap)] select-none", "data-disabled:cursor-not-allowed data-disabled:opacity-50"],
-	variants: {
-		controlPlacement: {
-			start: "grid-cols-[auto_minmax(0,1fr)]",
-			end: "grid-cols-[minmax(0,1fr)_auto]"
-		},
-		block: { true: "w-full" },
-		bare: { true: "gap-x-0" },
-		size: {
-			sm: "text-sm",
-			md: "text-base",
-			lg: "text-md"
-		}
-	},
-	defaultVariants: {
-		size: "md",
-		controlPlacement: "start",
-		block: false
-	}
-});
-var checkboxControl = tv({
-	base: "row-start-1",
-	variants: { controlPlacement: {
-		start: "col-start-1 justify-self-start",
-		end: "col-start-2 justify-self-end"
-	} },
-	defaultVariants: { controlPlacement: "start" }
-});
-var checkboxBox = tv({
-	base: [
-		"hn-focus-ring hn-state-layer hn-transition-base relative grid shrink-0 cursor-pointer place-items-center",
-		"size-[var(--hn-checkbox-size)] border",
-		"border-line bg-surface shadow-sm disabled:cursor-not-allowed",
-		"[--hn-state-selected-color:var(--hn-accent-on)] [--hn-state-selected-opacity:0]",
-		"data-[state=checked]:border-accent data-[state=checked]:bg-accent data-[state=checked]:text-surface",
-		"data-[state=indeterminate]:border-accent data-[state=indeterminate]:bg-accent data-[state=indeterminate]:text-surface",
-		"data-invalid:border-danger data-invalid:focus-visible:outline-danger",
-		"[&_svg]:col-start-1 [&_svg]:row-start-1 [&_svg]:size-[var(--hn-checkbox-icon)] [&_svg]:stroke-[3]"
-	],
-	variants: {
-		shape: {
-			square: "rounded-xs",
-			round: "rounded-full"
-		},
-		size: {
-			sm: "[--hn-checkbox-icon:0.625rem] [--hn-checkbox-size:0.875rem]",
-			md: "[--hn-checkbox-icon:0.75rem] [--hn-checkbox-size:1rem]",
-			lg: "[--hn-checkbox-icon:0.875rem] [--hn-checkbox-size:1.125rem]"
-		}
-	},
-	defaultVariants: {
-		shape: "square",
-		size: "md"
-	}
-});
-var checkboxTitle = tv({
-	base: "row-start-1 flex min-h-[1lh] min-w-0 items-center",
-	variants: { controlPlacement: {
-		start: "col-start-2",
-		end: "col-start-1"
-	} },
-	defaultVariants: { controlPlacement: "start" }
-});
-var checkboxTitleText = tv({ base: "block [text-box:trim-both_cap_alphabetic]" });
-var checkboxDescription = tv({
-	base: "text-muted row-start-2 block",
-	variants: {
-		controlPlacement: {
-			start: "col-start-2",
-			end: "col-start-1"
-		},
-		size: {
-			sm: "text-xs",
-			md: "text-sm",
-			lg: "text-base"
-		}
-	},
-	defaultVariants: {
-		size: "md",
-		controlPlacement: "start"
-	}
-});
-//#endregion
 //#region src/components/checkbox/Checkbox.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$62 = ["data-disabled"];
 //#endregion
@@ -11150,11 +11529,11 @@ var _hoisted_1$57 = {
 	key: "on",
 	class: "inline-flex items-center justify-center"
 };
-var _hoisted_2$27 = {
+var _hoisted_2$28 = {
 	key: "off",
 	class: "inline-flex items-center justify-center"
 };
-var _hoisted_3$11 = {
+var _hoisted_3$13 = {
 	key: 2,
 	class: "inline-flex items-center"
 };
@@ -11231,10 +11610,10 @@ var Toggle_default = /* @__PURE__ */ defineComponent({
 							"leave-active-class": "hn-transition absolute",
 							"leave-to-class": "scale-90 opacity-0"
 						}, {
-							default: withCtx(() => [swapped.value ? (openBlock(), createElementBlock("span", _hoisted_1$57, [renderSlot(_ctx.$slots, "pressed-icon")])) : (openBlock(), createElementBlock("span", _hoisted_2$27, [renderSlot(_ctx.$slots, "icon", { pressed: pressed.value })]))]),
+							default: withCtx(() => [swapped.value ? (openBlock(), createElementBlock("span", _hoisted_1$57, [renderSlot(_ctx.$slots, "pressed-icon")])) : (openBlock(), createElementBlock("span", _hoisted_2$28, [renderSlot(_ctx.$slots, "icon", { pressed: pressed.value })]))]),
 							_: 3
 						})], 2)) : createCommentVNode("", true),
-						unref(slots).default ? (openBlock(), createElementBlock("span", _hoisted_3$11, [renderSlot(_ctx.$slots, "default")])) : createCommentVNode("", true)
+						unref(slots).default ? (openBlock(), createElementBlock("span", _hoisted_3$13, [renderSlot(_ctx.$slots, "default")])) : createCommentVNode("", true)
 					]),
 					_: 3
 				}, 16, [
@@ -11492,13 +11871,7 @@ function useMultiCombobox(options) {
 	const { model, open } = options;
 	const keyboard = ref(false);
 	const input = shallowRef(null);
-	const labels = reactive(/* @__PURE__ */ new Map());
-	watch(options.options, (options) => {
-		for (const option of flattenOptions(options)) labels.set(option.value, option.label);
-	}, {
-		immediate: true,
-		deep: true
-	});
+	const labels = useOptionLabels(options.options, options.selectedOptions);
 	const selected = computed(() => model.value.map((value) => ({
 		value,
 		label: labels.get(value) ?? String(value)
@@ -11548,7 +11921,7 @@ var _hoisted_1$54 = [
 	"data-disabled",
 	"aria-busy"
 ];
-var _hoisted_2$26 = { class: "min-w-0 truncate" };
+var _hoisted_2$27 = { class: "min-w-0 truncate" };
 //#endregion
 //#region src/components/multi-combobox/MultiCombobox.vue
 var MultiCombobox_default = /* @__PURE__ */ defineComponent({
@@ -11557,6 +11930,7 @@ var MultiCombobox_default = /* @__PURE__ */ defineComponent({
 	__name: "MultiCombobox",
 	props: /*@__PURE__*/ mergeModels({
 		options: {},
+		selectedOptions: {},
 		placeholder: {},
 		ignoreFilter: { type: Boolean },
 		loading: { type: Boolean },
@@ -11599,6 +11973,7 @@ var MultiCombobox_default = /* @__PURE__ */ defineComponent({
 		});
 		const { selected, keyboard, input, remove, clear, onHostClick, onInputKeydown } = useMultiCombobox({
 			options: () => props.options,
+			selectedOptions: () => props.selectedOptions,
 			model,
 			open,
 			disabled: () => disabled.value,
@@ -11641,7 +12016,7 @@ var MultiCombobox_default = /* @__PURE__ */ defineComponent({
 							class: normalizeClass(unref(tagsInputChip)()),
 							onRemove: ($event) => unref(remove)(option.value)
 						}, {
-							default: withCtx(() => [createElementVNode("span", _hoisted_2$26, toDisplayString(option.label), 1)]),
+							default: withCtx(() => [createElementVNode("span", _hoisted_2$27, toDisplayString(option.label), 1)]),
 							_: 2
 						}, 1032, [
 							"size",
@@ -14030,7 +14405,7 @@ var _hoisted_1$46 = [
 	"multiple",
 	"disabled"
 ];
-var _hoisted_2$25 = [
+var _hoisted_2$26 = [
 	"id",
 	"aria-describedby",
 	"aria-invalid",
@@ -14039,7 +14414,7 @@ var _hoisted_2$25 = [
 	"aria-busy",
 	"disabled"
 ];
-var _hoisted_3$10 = ["src"];
+var _hoisted_3$12 = ["src"];
 //#endregion
 //#region src/components/file-upload/FileUpload.vue
 var FileUpload_default = /* @__PURE__ */ defineComponent({
@@ -14143,7 +14518,7 @@ var FileUpload_default = /* @__PURE__ */ defineComponent({
 				}, {
 					default: withCtx(() => [renderSlot(_ctx.$slots, "icon", {}, () => [createVNode(unref(Upload), { "aria-hidden": "true" })])]),
 					_: 3
-				}, 8, ["swapped"]), renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(unref(t).upload.dropHint), 1)])], 16, _hoisted_2$25)) : (openBlock(), createBlock(Button_default, mergeProps({ key: 1 }, _ctx.$attrs, {
+				}, 8, ["swapped"]), renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(unref(t).upload.dropHint), 1)])], 16, _hoisted_2$26)) : (openBlock(), createBlock(Button_default, mergeProps({ key: 1 }, _ctx.$attrs, {
 					id: unref(fieldId),
 					"aria-describedby": unref(describedBy),
 					"aria-invalid": unref(invalid) || void 0,
@@ -14175,7 +14550,7 @@ var FileUpload_default = /* @__PURE__ */ defineComponent({
 							key: 0,
 							src: unref(urls).get(file),
 							alt: ""
-						}, null, 8, _hoisted_3$10)) : (openBlock(), createBlock(unref(File), {
+						}, null, 8, _hoisted_3$12)) : (openBlock(), createBlock(unref(File), {
 							key: 1,
 							"aria-hidden": "true"
 						}))], 2),
@@ -14539,7 +14914,7 @@ var AlertDialog_default = /* @__PURE__ */ defineComponent({
 //#endregion
 //#region src/components/popconfirm/Popconfirm.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$45 = { class: "flex flex-col gap-0.5" };
-var _hoisted_2$24 = { class: "flex justify-end gap-2" };
+var _hoisted_2$25 = { class: "flex justify-end gap-2" };
 //#endregion
 //#region src/components/popconfirm/Popconfirm.vue
 var Popconfirm_default = /* @__PURE__ */ defineComponent({
@@ -14641,7 +15016,7 @@ var Popconfirm_default = /* @__PURE__ */ defineComponent({
 									_: 1
 								}, 8, ["id"])) : createCommentVNode("", true)]),
 								renderSlot(_ctx.$slots, "content"),
-								createElementVNode("div", _hoisted_2$24, [createVNode(Button_default, {
+								createElementVNode("div", _hoisted_2$25, [createVNode(Button_default, {
 									size: "sm",
 									variant: "soft",
 									tone: "neutral",
@@ -15088,7 +15463,7 @@ var ContextMenuItem_default = /* @__PURE__ */ defineComponent({
 //#endregion
 //#region src/components/context-menu/ContextMenuCheckboxItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$43 = { class: "min-w-0 flex-1" };
-var _hoisted_2$23 = { class: "flex size-4 shrink-0 items-center justify-center" };
+var _hoisted_2$24 = { class: "flex size-4 shrink-0 items-center justify-center" };
 //#endregion
 //#region src/components/context-menu/ContextMenuCheckboxItem.vue
 var ContextMenuCheckboxItem_default = /* @__PURE__ */ defineComponent({
@@ -15122,7 +15497,7 @@ var ContextMenuCheckboxItem_default = /* @__PURE__ */ defineComponent({
 				default: withCtx(() => [
 					createElementVNode("span", _hoisted_1$43, [renderSlot(_ctx.$slots, "default")]),
 					renderSlot(_ctx.$slots, "trailing"),
-					createElementVNode("span", _hoisted_2$23, [createVNode(unref(ContextMenuItemIndicator), null, {
+					createElementVNode("span", _hoisted_2$24, [createVNode(unref(ContextMenuItemIndicator), null, {
 						default: withCtx(() => [createVNode(unref(Check))]),
 						_: 1
 					})])
@@ -15270,7 +15645,7 @@ var ContextMenuRadioGroup_default = /* @__PURE__ */ defineComponent({
 //#endregion
 //#region src/components/context-menu/ContextMenuRadioItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$41 = { class: "min-w-0 flex-1" };
-var _hoisted_2$22 = { class: "flex size-4 shrink-0 items-center justify-center" };
+var _hoisted_2$23 = { class: "flex size-4 shrink-0 items-center justify-center" };
 //#endregion
 //#region src/components/context-menu/ContextMenuRadioItem.vue
 var ContextMenuRadioItem_default = /* @__PURE__ */ defineComponent({
@@ -15292,7 +15667,7 @@ var ContextMenuRadioItem_default = /* @__PURE__ */ defineComponent({
 				"text-value": props.textValue,
 				class: unref(cn)(unref(dropdownItem)(), props.class)
 			}), {
-				default: withCtx(() => [createElementVNode("span", _hoisted_1$41, [renderSlot(_ctx.$slots, "default")]), createElementVNode("span", _hoisted_2$22, [createVNode(unref(ContextMenuItemIndicator), null, {
+				default: withCtx(() => [createElementVNode("span", _hoisted_1$41, [renderSlot(_ctx.$slots, "default")]), createElementVNode("span", _hoisted_2$23, [createVNode(unref(ContextMenuItemIndicator), null, {
 					default: withCtx(() => [createVNode(unref(Check), { class: "size-4" })]),
 					_: 1
 				})])]),
@@ -15414,12 +15789,12 @@ var sheetHandle = tv({
 //#endregion
 //#region src/components/sheet/Sheet.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$40 = ["data-dragging"];
-var _hoisted_2$21 = ["data-disabled"];
-var _hoisted_3$9 = {
+var _hoisted_2$22 = ["data-disabled"];
+var _hoisted_3$11 = {
 	key: 1,
 	class: "flex items-start justify-between gap-4 px-(--hn-panel-p)"
 };
-var _hoisted_4$7 = { class: "flex min-w-0 flex-col gap-1.5" };
+var _hoisted_4$9 = { class: "flex min-w-0 flex-col gap-1.5" };
 var _hoisted_5$5 = { class: "flex min-w-0 items-center gap-2" };
 var _hoisted_6$4 = {
 	key: 0,
@@ -15541,7 +15916,7 @@ var Sheet_default = /* @__PURE__ */ defineComponent({
 									"aria-hidden": "true",
 									"data-disabled": props.locked ? "" : void 0,
 									class: normalizeClass(unref(sheetHandle)({ header: props.header && !slots.body }))
-								}, null, 10, _hoisted_2$21)) : createCommentVNode("", true), props.header && !slots.body ? (openBlock(), createElementBlock("div", _hoisted_3$9, [createElementVNode("div", _hoisted_4$7, [createElementVNode("div", _hoisted_5$5, [slots.icon ? (openBlock(), createElementBlock("span", _hoisted_6$4, [renderSlot(_ctx.$slots, "icon")])) : createCommentVNode("", true), createVNode(unref(DialogTitle), { "as-child": "" }, {
+								}, null, 10, _hoisted_2$22)) : createCommentVNode("", true), props.header && !slots.body ? (openBlock(), createElementBlock("div", _hoisted_3$11, [createElementVNode("div", _hoisted_4$9, [createElementVNode("div", _hoisted_5$5, [slots.icon ? (openBlock(), createElementBlock("span", _hoisted_6$4, [renderSlot(_ctx.$slots, "icon")])) : createCommentVNode("", true), createVNode(unref(DialogTitle), { "as-child": "" }, {
 									default: withCtx(() => [createVNode(Heading_default, {
 										level: 2,
 										size: "lg",
@@ -15939,7 +16314,7 @@ function toneAt(index) {
 //#endregion
 //#region src/components/meter-group/MeterGroup.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$36 = ["aria-label"];
-var _hoisted_2$20 = [
+var _hoisted_2$21 = [
 	"aria-label",
 	"aria-valuenow",
 	"aria-valuemax",
@@ -16010,7 +16385,7 @@ var MeterGroup_default = /* @__PURE__ */ defineComponent({
 						"aria-valuetext": props.format ? entry.text : void 0,
 						class: normalizeClass(unref(meterSegment)({ tone: entry.tone })),
 						style: normalizeStyle({ width: entry.width })
-					}, null, 14, _hoisted_2$20);
+					}, null, 14, _hoisted_2$21);
 				}), 128))], 16, _hoisted_1$36),
 				props.legend ? (openBlock(), createElementBlock("div", {
 					key: 1,
@@ -16268,7 +16643,7 @@ var statisticIcon = tv({ base: "bg-subtle text-muted flex size-10 shrink-0 items
 //#endregion
 //#region src/components/statistic/Statistic.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$33 = { key: 2 };
-var _hoisted_2$19 = {
+var _hoisted_2$20 = {
 	key: 2,
 	class: "text-muted"
 };
@@ -16360,7 +16735,7 @@ var Statistic_default = /* @__PURE__ */ defineComponent({
 						"aria-hidden": "true"
 					})) : createCommentVNode("", true),
 					createElementVNode("span", null, toDisplayString(deltaText.value), 1),
-					props.deltaLabel ? (openBlock(), createElementBlock("span", _hoisted_2$19, toDisplayString(props.deltaLabel), 1)) : createCommentVNode("", true)
+					props.deltaLabel ? (openBlock(), createElementBlock("span", _hoisted_2$20, toDisplayString(props.deltaLabel), 1)) : createCommentVNode("", true)
 				], 64))], 2)) : createCommentVNode("", true),
 				renderSlot(_ctx.$slots, "default")
 			], 2), unref(slots).icon ? (openBlock(), createElementBlock("span", {
@@ -16443,9 +16818,9 @@ var _hoisted_1$32 = {
 	"data-hn-banner": "",
 	class: "hn-collapse w-full"
 };
-var _hoisted_2$18 = { class: "hn-collapse-body" };
-var _hoisted_3$8 = ["data-tone"];
-var _hoisted_4$6 = ["aria-live"];
+var _hoisted_2$19 = { class: "hn-collapse-body" };
+var _hoisted_3$10 = ["data-tone"];
+var _hoisted_4$8 = ["aria-live"];
 //#endregion
 //#region src/components/banner/Banner.vue
 var Banner_default = /* @__PURE__ */ defineComponent({
@@ -16509,7 +16884,7 @@ var Banner_default = /* @__PURE__ */ defineComponent({
 				"leave-from-class": "hn-collapse-open",
 				"leave-to-class": "hn-collapse-closed"
 			}, toHandlers(unref(hooks))), {
-				default: withCtx(() => [open.value ? (openBlock(), createElementBlock("div", _hoisted_1$32, [createElementVNode("div", _hoisted_2$18, [createElementVNode("div", {
+				default: withCtx(() => [open.value ? (openBlock(), createElementBlock("div", _hoisted_1$32, [createElementVNode("div", _hoisted_2$19, [createElementVNode("div", {
 					"data-tone": tone.value,
 					class: normalizeClass(unref(cn)(unref(banner)({ tone: tone.value }), props.class)),
 					onPointerenter: _cache[2] || (_cache[2] = ($event) => unref(autoplay).hovered.value = true),
@@ -16539,7 +16914,7 @@ var Banner_default = /* @__PURE__ */ defineComponent({
 						index: at.value
 					})], 2))]),
 					_: 3
-				}, 8, ["enter-from-class", "leave-to-class"])], 8, _hoisted_4$6)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [renderSlot(_ctx.$slots, "icon", {}, () => [props.icon ? (openBlock(), createBlock(resolveDynamicComponent(icon.value), {
+				}, 8, ["enter-from-class", "leave-to-class"])], 8, _hoisted_4$8)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [renderSlot(_ctx.$slots, "icon", {}, () => [props.icon ? (openBlock(), createBlock(resolveDynamicComponent(icon.value), {
 					key: 0,
 					class: normalizeClass(unref(bannerIcon)()),
 					"aria-hidden": "true"
@@ -16582,7 +16957,7 @@ var Banner_default = /* @__PURE__ */ defineComponent({
 					size: "sm",
 					class: "text-current",
 					onClick: close
-				})) : createCommentVNode("", true)], 2)) : createCommentVNode("", true)], 42, _hoisted_3$8)])])) : createCommentVNode("", true)]),
+				})) : createCommentVNode("", true)], 2)) : createCommentVNode("", true)], 42, _hoisted_3$10)])])) : createCommentVNode("", true)]),
 				_: 3
 			}, 16);
 		};
@@ -16730,7 +17105,7 @@ var MenubarItem_default = /* @__PURE__ */ defineComponent({
 //#endregion
 //#region src/components/menubar/MenubarCheckboxItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$30 = { class: "min-w-0 flex-1" };
-var _hoisted_2$17 = { class: "flex size-4 shrink-0 items-center justify-center" };
+var _hoisted_2$18 = { class: "flex size-4 shrink-0 items-center justify-center" };
 //#endregion
 //#region src/components/menubar/MenubarCheckboxItem.vue
 var MenubarCheckboxItem_default = /* @__PURE__ */ defineComponent({
@@ -16764,7 +17139,7 @@ var MenubarCheckboxItem_default = /* @__PURE__ */ defineComponent({
 				default: withCtx(() => [
 					createElementVNode("span", _hoisted_1$30, [renderSlot(_ctx.$slots, "default")]),
 					renderSlot(_ctx.$slots, "trailing"),
-					createElementVNode("span", _hoisted_2$17, [createVNode(unref(MenubarItemIndicator), null, {
+					createElementVNode("span", _hoisted_2$18, [createVNode(unref(MenubarItemIndicator), null, {
 						default: withCtx(() => [createVNode(unref(Check))]),
 						_: 1
 					})])
@@ -16912,7 +17287,7 @@ var MenubarRadioGroup_default = /* @__PURE__ */ defineComponent({
 //#endregion
 //#region src/components/menubar/MenubarRadioItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$28 = { class: "min-w-0 flex-1" };
-var _hoisted_2$16 = { class: "flex size-4 shrink-0 items-center justify-center" };
+var _hoisted_2$17 = { class: "flex size-4 shrink-0 items-center justify-center" };
 //#endregion
 //#region src/components/menubar/MenubarRadioItem.vue
 var MenubarRadioItem_default = /* @__PURE__ */ defineComponent({
@@ -16934,7 +17309,7 @@ var MenubarRadioItem_default = /* @__PURE__ */ defineComponent({
 				"text-value": props.textValue,
 				class: unref(cn)(unref(dropdownItem)(), props.class)
 			}), {
-				default: withCtx(() => [createElementVNode("span", _hoisted_1$28, [renderSlot(_ctx.$slots, "default")]), createElementVNode("span", _hoisted_2$16, [createVNode(unref(MenubarItemIndicator), null, {
+				default: withCtx(() => [createElementVNode("span", _hoisted_1$28, [renderSlot(_ctx.$slots, "default")]), createElementVNode("span", _hoisted_2$17, [createVNode(unref(MenubarItemIndicator), null, {
 					default: withCtx(() => [createVNode(unref(Check), { class: "size-4" })]),
 					_: 1
 				})])]),
@@ -17220,9 +17595,9 @@ var _hoisted_1$26 = [
 	"data-disabled",
 	"data-orientation"
 ];
-var _hoisted_2$15 = ["id", "for"];
-var _hoisted_3$7 = ["id"];
-var _hoisted_4$5 = ["id"];
+var _hoisted_2$16 = ["id", "for"];
+var _hoisted_3$9 = ["id"];
+var _hoisted_4$7 = ["id"];
 var _hoisted_5$4 = {
 	key: 0,
 	"data-hn-form-field-message": "",
@@ -17323,11 +17698,11 @@ var FormField_default = /* @__PURE__ */ defineComponent({
 					default: withCtx(() => [createTextVNode(toDisplayString(unref(t).form.required), 1)]),
 					_: 1
 				})) : createCommentVNode("", true)
-			], 10, _hoisted_2$15)) : createCommentVNode("", true), descriptionWithLabel.value ? (openBlock(), createElementBlock("p", {
+			], 10, _hoisted_2$16)) : createCommentVNode("", true), descriptionWithLabel.value ? (openBlock(), createElementBlock("p", {
 				key: 1,
 				id: unref(descriptionId),
 				class: normalizeClass(unref(formFieldDescription)())
-			}, [renderSlot(_ctx.$slots, "description", {}, () => [createTextVNode(toDisplayString(props.description), 1)])], 10, _hoisted_3$7)) : createCommentVNode("", true)], 2)) : createCommentVNode("", true), createElementVNode("div", {
+			}, [renderSlot(_ctx.$slots, "description", {}, () => [createTextVNode(toDisplayString(props.description), 1)])], 10, _hoisted_3$9)) : createCommentVNode("", true)], 2)) : createCommentVNode("", true), createElementVNode("div", {
 				"data-hn-form-field-body": "",
 				class: normalizeClass(unref(formFieldContent)())
 			}, [
@@ -17339,7 +17714,7 @@ var FormField_default = /* @__PURE__ */ defineComponent({
 					key: 0,
 					id: unref(descriptionId),
 					class: normalizeClass(unref(formFieldDescription)())
-				}, [renderSlot(_ctx.$slots, "description", {}, () => [createTextVNode(toDisplayString(props.description), 1)])], 10, _hoisted_4$5)) : createCommentVNode("", true),
+				}, [renderSlot(_ctx.$slots, "description", {}, () => [createTextVNode(toDisplayString(props.description), 1)])], 10, _hoisted_4$7)) : createCommentVNode("", true),
 				createVNode(Transition, mergeProps({
 					"enter-from-class": "hn-collapse-closed",
 					"enter-to-class": "hn-collapse-open",
@@ -17378,7 +17753,7 @@ var formLayoutGrid = tv({
 //#endregion
 //#region src/components/form-layout/FormLayout.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$25 = ["disabled", "aria-describedby"];
-var _hoisted_2$14 = ["id"];
+var _hoisted_2$15 = ["id"];
 //#endregion
 //#region src/components/form-layout/FormLayout.vue
 var FormLayout_default = /* @__PURE__ */ defineComponent({
@@ -17423,7 +17798,7 @@ var FormLayout_default = /* @__PURE__ */ defineComponent({
 					key: 1,
 					id: unref(descriptionId),
 					class: normalizeClass(unref(formLayoutDescription)())
-				}, [renderSlot(_ctx.$slots, "description", {}, () => [createTextVNode(toDisplayString(props.description), 1)])], 10, _hoisted_2$14)) : createCommentVNode("", true),
+				}, [renderSlot(_ctx.$slots, "description", {}, () => [createTextVNode(toDisplayString(props.description), 1)])], 10, _hoisted_2$15)) : createCommentVNode("", true),
 				createElementVNode("div", { class: normalizeClass(unref(formLayoutGrid)({
 					columns: props.columns,
 					headed: headed.value || described.value
@@ -17903,9 +18278,9 @@ var codeBlockLabel = tv({ base: "text-faint font-mono text-xs select-none" });
 //#endregion
 //#region src/components/code-block/CodeBlock.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1$23 = ["data-lang"];
-var _hoisted_2$13 = ["innerHTML"];
-var _hoisted_3$6 = { key: 1 };
-var _hoisted_4$4 = { key: 2 };
+var _hoisted_2$14 = ["innerHTML"];
+var _hoisted_3$8 = { key: 1 };
+var _hoisted_4$6 = { key: 2 };
 //#endregion
 //#region src/components/code-block/CodeBlock.vue
 var CodeBlock_default = /* @__PURE__ */ defineComponent({
@@ -17940,14 +18315,14 @@ var CodeBlock_default = /* @__PURE__ */ defineComponent({
 				default: withCtx(() => [createElementVNode("pre", { class: normalizeClass(unref(codeBlockContent)()) }, [props.html ? (openBlock(), createElementBlock("code", {
 					key: 0,
 					innerHTML: props.html
-				}, null, 8, _hoisted_2$13)) : unref(tokens) ? (openBlock(), createElementBlock("code", _hoisted_3$6, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(tokens), (line, i) => {
+				}, null, 8, _hoisted_2$14)) : unref(tokens) ? (openBlock(), createElementBlock("code", _hoisted_3$8, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(tokens), (line, i) => {
 					return openBlock(), createElementBlock(Fragment, { key: i }, [createTextVNode(toDisplayString(i ? "\n" : ""), 1), (openBlock(true), createElementBlock(Fragment, null, renderList(line, (tk, j) => {
 						return openBlock(), createElementBlock("span", {
 							key: j,
 							style: normalizeStyle(tk.htmlStyle)
 						}, toDisplayString(tk.content), 5);
 					}), 128))], 64);
-				}), 128))])) : (openBlock(), createElementBlock("code", _hoisted_4$4, toDisplayString(__props.code), 1))], 2)]),
+				}), 128))])) : (openBlock(), createElementBlock("code", _hoisted_4$6, toDisplayString(__props.code), 1))], 2)]),
 				_: 1
 			}, 8, ["label", "class"]), createElementVNode("div", { class: normalizeClass(unref(codeBlockActions)()) }, [tag.value ? (openBlock(), createElementBlock("span", {
 				key: 0,
@@ -18923,17 +19298,14 @@ var navLink = tv({
 	} },
 	defaultVariants: { active: false }
 });
-var navLinkLabel = tv({
-	base: "shrink-0 whitespace-nowrap",
-	variants: { rail: {
-		true: "opacity-0 [transition:opacity_calc(var(--hn-duration-fast)/2)_var(--hn-ease-exit)]",
-		false: "opacity-100 [transition:opacity_var(--hn-duration-fast)_var(--hn-ease-enter)]"
-	} },
-	defaultVariants: { rail: false }
-});
+var navLinkLabel = tv({ base: "hn-sidebar-label shrink-0 whitespace-nowrap" });
 //#endregion
 //#region src/components/nav-link/NavLink.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$18 = ["aria-hidden"];
+var _hoisted_1$18 = [
+	"aria-hidden",
+	"inert",
+	"data-collapsed"
+];
 //#endregion
 //#region src/components/nav-link/NavLink.vue
 var NavLink_default = /* @__PURE__ */ defineComponent({
@@ -18978,8 +19350,10 @@ var NavLink_default = /* @__PURE__ */ defineComponent({
 				}), {
 					default: withCtx(() => [renderSlot(_ctx.$slots, "icon"), createElementVNode("span", {
 						"aria-hidden": rail.value ? "true" : void 0,
+						inert: rail.value,
+						"data-collapsed": rail.value ? "" : void 0,
 						"data-hn-label": "",
-						class: normalizeClass(unref(navLinkLabel)({ rail: rail.value }))
+						class: normalizeClass(unref(navLinkLabel)())
 					}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$18)]),
 					_: 3
 				}, 16, [
@@ -18999,8 +19373,65 @@ var NavLink_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
+//#region src/components/sidebar/sidebar.variants.ts
+var sidebarRoot = tv({
+	base: "flex h-full min-h-0 shrink-0 flex-col overflow-hidden",
+	variants: { inDrawer: {
+		true: "w-full",
+		false: "hn-sidebar border-line w-64 border-e data-[state=rail]:w-14 data-[state=hidden]:w-0 data-[state=hidden]:border-e-transparent"
+	} }
+});
+var sidebarRegion = tv({
+	base: "shrink-0 py-3",
+	variants: {
+		inDrawer: {
+			true: "w-full",
+			false: "w-[calc(16rem-1px)] px-3"
+		},
+		footer: { true: "border-line border-t" }
+	}
+});
+var sidebarLabel = tv({ base: "hn-sidebar-label min-w-0" });
+var sidebarBrand = tv({ base: "flex min-h-8 items-center gap-2" });
+var sidebarIcon = tv({ base: "flex size-8 shrink-0 items-center justify-center overflow-hidden [&>*]:size-full [&_img]:size-full [&_img]:object-contain [&_svg]:size-full" });
+var sidebarWordmark = tv({ base: "flex flex-1 items-center [&_img]:max-h-8 [&_img]:max-w-full [&_img]:object-contain [&_svg]:max-h-8 [&_svg]:max-w-full" });
+//#endregion
+//#region src/components/sidebar/SidebarLabel.vue
+var SidebarLabel_default = /* @__PURE__ */ defineComponent({
+	name: "HnSidebarLabel",
+	__name: "SidebarLabel",
+	props: {
+		as: { default: "span" },
+		class: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const sidebar = useSidebar();
+		const collapsed = computed(() => sidebar?.state.value === "rail");
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(props.as), {
+				"data-collapsed": collapsed.value ? "" : void 0,
+				"aria-hidden": collapsed.value ? "true" : void 0,
+				inert: collapsed.value,
+				class: normalizeClass(unref(cn)(unref(sidebarLabel)(), props.class))
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 8, [
+				"data-collapsed",
+				"aria-hidden",
+				"inert",
+				"class"
+			]);
+		};
+	}
+});
+//#endregion
 //#region src/components/sidebar/Sidebar.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$17 = ["aria-label"];
+var _hoisted_1$17 = ["data-state", "inert"];
+var _hoisted_2$13 = ["data-state", "inert"];
+var _hoisted_3$7 = { class: "hn-collapse-body" };
+var _hoisted_4$5 = ["aria-label"];
 //#endregion
 //#region src/components/sidebar/Sidebar.vue
 var Sidebar_default = /* @__PURE__ */ defineComponent({
@@ -19016,52 +19447,59 @@ var Sidebar_default = /* @__PURE__ */ defineComponent({
 		const sidebar = useSidebar();
 		const state = computed(() => sidebar?.state.value ?? "expanded");
 		const inDrawer = computed(() => sidebar?.inDrawer ?? false);
-		const width = computed(() => {
-			if (state.value === "rail") return 56;
-			if (state.value === "hidden") return 0;
-			return 256;
-		});
-		const transition = computed(() => prefersReducedMotion() ? { duration: 0 } : TRANSITION.layout);
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(Motion), {
-				as: "aside",
-				initial: false,
-				animate: inDrawer.value ? void 0 : { width: width.value },
-				transition: transition.value,
+			return openBlock(), createElementBlock("aside", {
 				"data-state": state.value,
-				class: normalizeClass(unref(cn)("flex h-full min-h-0 shrink-0 flex-col overflow-hidden", inDrawer.value ? "w-full" : "border-line border-e [transition:border-color_var(--hn-duration-base)_var(--hn-ease-move)]", !inDrawer.value && state.value === "hidden" && "border-e-transparent", props.class))
-			}, {
-				default: withCtx(() => [
-					_ctx.$slots.header ? (openBlock(), createElementBlock("div", {
-						key: 0,
-						class: normalizeClass(unref(cn)("shrink-0", !inDrawer.value && "px-3 py-3"))
-					}, [renderSlot(_ctx.$slots, "header", { state: state.value })], 2)) : createCommentVNode("", true),
-					createVNode(ScrollArea_default, { class: "min-h-0 flex-1" }, {
-						default: withCtx(() => [createElementVNode("nav", {
-							"aria-label": props.label ?? unref(t).sidebar.navLabel,
-							class: normalizeClass(unref(cn)("flex flex-col gap-1", !inDrawer.value && "px-2.5 py-2"))
-						}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1$17)]),
-						_: 3
-					}),
-					_ctx.$slots.footer ? (openBlock(), createElementBlock("div", {
-						key: 1,
-						class: normalizeClass(unref(cn)("border-line shrink-0 border-t", !inDrawer.value && "px-3 py-3"))
-					}, [renderSlot(_ctx.$slots, "footer", { state: state.value })], 2)) : createCommentVNode("", true)
-				]),
-				_: 3
-			}, 8, [
-				"animate",
-				"transition",
-				"data-state",
-				"class"
-			]);
+				inert: state.value === "hidden",
+				class: normalizeClass(unref(cn)(unref(sidebarRoot)({ inDrawer: inDrawer.value }), props.class))
+			}, [
+				_ctx.$slots.header ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(unref(sidebarRegion)({ inDrawer: inDrawer.value }))
+				}, [renderSlot(_ctx.$slots, "header", { state: state.value })], 2)) : _ctx.$slots.icon || _ctx.$slots.wordmark ? (openBlock(), createElementBlock("div", {
+					key: 1,
+					class: "hn-collapse shrink-0",
+					"data-state": state.value === "rail" && !_ctx.$slots.icon ? "closed" : "open",
+					inert: state.value === "rail" && !_ctx.$slots.icon
+				}, [createElementVNode("div", _hoisted_3$7, [createElementVNode("div", { class: normalizeClass(unref(sidebarRegion)({ inDrawer: inDrawer.value })) }, [createElementVNode("div", { class: normalizeClass(unref(sidebarBrand)()) }, [_ctx.$slots.icon ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(unref(sidebarIcon)())
+				}, [renderSlot(_ctx.$slots, "icon", { state: state.value })], 2)) : createCommentVNode("", true), _ctx.$slots.wordmark ? (openBlock(), createBlock(SidebarLabel_default, {
+					key: 1,
+					as: "div",
+					class: normalizeClass(unref(sidebarWordmark)())
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "wordmark", { state: state.value })]),
+					_: 3
+				}, 8, ["class"])) : createCommentVNode("", true)], 2)], 2)])], 8, _hoisted_2$13)) : createCommentVNode("", true),
+				createVNode(ScrollArea_default, { class: "min-h-0 flex-1" }, {
+					default: withCtx(() => [createElementVNode("nav", {
+						"aria-label": props.label ?? unref(t).sidebar.navLabel,
+						class: normalizeClass(unref(cn)("flex flex-col gap-1 py-2", !inDrawer.value && "px-2.5"))
+					}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_4$5)]),
+					_: 3
+				}),
+				_ctx.$slots.footer ? (openBlock(), createElementBlock("div", {
+					key: 2,
+					class: normalizeClass(unref(sidebarRegion)({
+						inDrawer: inDrawer.value,
+						footer: true
+					}))
+				}, [renderSlot(_ctx.$slots, "footer", { state: state.value })], 2)) : createCommentVNode("", true)
+			], 10, _hoisted_1$17);
 		};
 	}
 });
 //#endregion
 //#region src/components/sidebar/SidebarGroup.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1$16 = { class: "hn-collapse-body" };
-var _hoisted_2$12 = { class: "flex flex-col gap-0.5 pt-1" };
+var _hoisted_1$16 = { class: "relative h-(--hn-control-h-sm)" };
+var _hoisted_2$12 = [
+	"data-collapsed",
+	"aria-hidden",
+	"inert"
+];
+var _hoisted_3$6 = ["data-collapsed"];
+var _hoisted_4$4 = { class: "flex flex-col gap-0.5 pt-1" };
 //#endregion
 //#region src/components/sidebar/SidebarGroup.vue
 var SidebarGroup_default = /* @__PURE__ */ defineComponent({
@@ -19086,31 +19524,33 @@ var SidebarGroup_default = /* @__PURE__ */ defineComponent({
 				class: normalizeClass(unref(cn)(props.class)),
 				"onUpdate:open": _cache[0] || (_cache[0] = (v) => rail.value ? void 0 : open.value = v)
 			}, {
-				default: withCtx(() => [
-					createElementVNode("div", { class: normalizeClass(["hn-collapse", rail.value ? "hn-collapse-closed" : "hn-collapse-open"]) }, [createElementVNode("div", _hoisted_1$16, [createVNode(CollapsibleTrigger_default, { "as-child": "" }, {
-						default: withCtx(() => [createVNode(Button_default, {
-							variant: "ghost",
-							tone: "neutral",
-							size: "sm",
-							block: "",
-							tabindex: rail.value ? -1 : void 0,
-							class: "text-muted justify-between font-medium"
-						}, {
-							trailing: withCtx(() => [createVNode(DisclosureIcon_default, { direction: "end" })]),
-							default: withCtx(() => [createTextVNode(toDisplayString(props.label) + " ", 1)]),
-							_: 1
-						}, 8, ["tabindex"])]),
+				default: withCtx(() => [createElementVNode("div", _hoisted_1$16, [createElementVNode("div", {
+					class: "hn-sidebar-label",
+					"data-collapsed": rail.value ? "" : void 0,
+					"aria-hidden": rail.value ? "true" : void 0,
+					inert: rail.value
+				}, [createVNode(CollapsibleTrigger_default, { "as-child": "" }, {
+					default: withCtx(() => [createVNode(Button_default, {
+						variant: "ghost",
+						tone: "neutral",
+						size: "sm",
+						block: "",
+						tabindex: rail.value ? -1 : void 0,
+						class: "text-muted justify-between font-medium"
+					}, {
+						trailing: withCtx(() => [createVNode(DisclosureIcon_default, { direction: "end" })]),
+						default: withCtx(() => [createTextVNode(toDisplayString(props.label) + " ", 1)]),
 						_: 1
-					})])], 2),
-					createElementVNode("div", {
-						"aria-hidden": "true",
-						class: normalizeClass(["hn-collapse", rail.value ? "hn-collapse-open" : "hn-collapse-closed"])
-					}, [..._cache[1] || (_cache[1] = [createElementVNode("div", { class: "hn-collapse-body" }, [createElementVNode("div", { class: "border-line mx-2 my-1.5 border-t" })], -1)])], 2),
-					createVNode(CollapsibleContent_default, null, {
-						default: withCtx(() => [createElementVNode("div", _hoisted_2$12, [renderSlot(_ctx.$slots, "default")])]),
-						_: 3
-					})
-				]),
+					}, 8, ["tabindex"])]),
+					_: 1
+				})], 8, _hoisted_2$12), createElementVNode("div", {
+					"aria-hidden": "true",
+					class: "hn-sidebar-label border-line pointer-events-none absolute inset-x-2 top-1/2 border-t",
+					"data-collapsed": rail.value ? void 0 : ""
+				}, null, 8, _hoisted_3$6)]), createVNode(CollapsibleContent_default, null, {
+					default: withCtx(() => [createElementVNode("div", _hoisted_4$4, [renderSlot(_ctx.$slots, "default")])]),
+					_: 3
+				})]),
 				_: 3
 			}, 8, ["open", "class"]);
 		};
@@ -19375,6 +19815,7 @@ var AppShell_default = /* @__PURE__ */ defineComponent({
 			type: Boolean,
 			default: true
 		},
+		mobileTitle: {},
 		class: {}
 	}, {
 		"sidebar": { default: "expanded" },
@@ -19430,7 +19871,7 @@ var AppShell_default = /* @__PURE__ */ defineComponent({
 						key: 1,
 						open: mobileOpen.value,
 						"onUpdate:open": _cache[0] || (_cache[0] = ($event) => mobileOpen.value = $event),
-						title: unref(t).sidebar.navLabel,
+						title: props.mobileTitle ?? unref(t).sidebar.navLabel,
 						side: "start",
 						size: "sm",
 						class: "lg:hidden"
@@ -21558,6 +21999,6 @@ function createScrollRestorer(key, ports) {
 	};
 }
 //#endregion
-export { Accordion_default as Accordion, AccordionContent_default as AccordionContent, AccordionItem_default as AccordionItem, AccordionTrigger_default as AccordionTrigger, Alert_default as Alert, AlertDialog_default as AlertDialog, Anchor_default as Anchor, AppShell_default as AppShell, AspectRatio_default as AspectRatio, Avatar_default as Avatar, AvatarGroup_default as AvatarGroup, Badge_default as Badge, Banner_default as Banner, Blockquote_default as Blockquote, Breadcrumb_default as Breadcrumb, BreadcrumbItem_default as BreadcrumbItem, BreadcrumbSeparator_default as BreadcrumbSeparator, Button_default as Button, ButtonGroup_default as ButtonGroup, Calendar_default as Calendar, Callout_default as Callout, Card_default as Card, Center_default as Center, Checkbox_default as Checkbox, CheckboxGroup_default as CheckboxGroup, Chip_default as Chip, CloseButton_default as CloseButton, Code_default as Code, CodeBlock_default as CodeBlock, Collapsible_default as Collapsible, CollapsibleContent_default as CollapsibleContent, CollapsibleTrigger_default as CollapsibleTrigger, Combobox_default as Combobox, CommandPalette_default as CommandPalette, Container_default as Container, ContextMenu_default as ContextMenu, ContextMenuCheckboxItem_default as ContextMenuCheckboxItem, ContextMenuGroup_default as ContextMenuGroup, ContextMenuItem_default as ContextMenuItem, ContextMenuLabel_default as ContextMenuLabel, ContextMenuRadioGroup_default as ContextMenuRadioGroup, ContextMenuRadioItem_default as ContextMenuRadioItem, ContextMenuSeparator_default as ContextMenuSeparator, ContextMenuSub_default as ContextMenuSub, CopyButton_default as CopyButton, DURATION, DateField_default as DateField, DatePicker_default as DatePicker, DateRangeField_default as DateRangeField, DateRangePicker_default as DateRangePicker, DateTimePicker_default as DateTimePicker, DescriptionDetails_default as DescriptionDetails, DescriptionList_default as DescriptionList, DescriptionTerm_default as DescriptionTerm, Dialog_default as Dialog, DisclosureIcon_default as DisclosureIcon, Divider_default as Divider, Drawer_default as Drawer, DropdownMenu_default as DropdownMenu, DropdownMenuCheckboxItem_default as DropdownMenuCheckboxItem, DropdownMenuGroup_default as DropdownMenuGroup, DropdownMenuItem_default as DropdownMenuItem, DropdownMenuLabel_default as DropdownMenuLabel, DropdownMenuRadioGroup_default as DropdownMenuRadioGroup, DropdownMenuRadioItem_default as DropdownMenuRadioItem, DropdownMenuSeparator_default as DropdownMenuSeparator, DropdownMenuSub_default as DropdownMenuSub, EASE, Empty_default as Empty, FileUpload_default as FileUpload, Flex_default as Flex, Form_default as Form, FormField_default as FormField, FormLayout_default as FormLayout, Grid_default as Grid, Heading_default as Heading, Highlight_default as Highlight, HoverCard_default as HoverCard, IconButton_default as IconButton, Image_default as Image, ImageGroup_default as ImageGroup, Indicator_default as Indicator, Inline_default as Inline, Input_default as Input, InputGroup_default as InputGroup, InputGroupAddon_default as InputGroupAddon, Kbd_default as Kbd, Lightbox_default as Lightbox, Link_default as Link, List_default as List, ListItem_default as ListItem, Listbox_default as Listbox, LoadingOverlay_default as LoadingOverlay, Mark_default as Mark, Menubar_default as Menubar, MenubarCheckboxItem_default as MenubarCheckboxItem, MenubarGroup_default as MenubarGroup, MenubarItem_default as MenubarItem, MenubarLabel_default as MenubarLabel, MenubarMenu_default as MenubarMenu, MenubarRadioGroup_default as MenubarRadioGroup, MenubarRadioItem_default as MenubarRadioItem, MenubarSeparator_default as MenubarSeparator, MenubarSub_default as MenubarSub, MeterGroup_default as MeterGroup, MultiCombobox_default as MultiCombobox, MultiSelect_default as MultiSelect, NavLink_default as NavLink, NumberFormat_default as NumberFormat, NumberInput_default as NumberInput, Page_default as Page, PageAside_default as PageAside, PageBody_default as PageBody, PageHeader_default as PageHeader, Pagination_default as Pagination, PaginationContent_default as PaginationContent, PaginationInfo_default as PaginationInfo, PaginationJump_default as PaginationJump, PaginationSize_default as PaginationSize, Panel_default as Panel, PasswordInput_default as PasswordInput, PinInput_default as PinInput, Popconfirm_default as Popconfirm, Popover_default as Popover, PrevNext_default as PrevNext, PrevNextLink_default as PrevNextLink, Progress_default as Progress, Prose_default as Prose, REQUIRED_SINGLETONS, RESTORE_DEADLINE_MS, RadioGroup_default as RadioGroup, RangeCalendar_default as RangeCalendar, RangeSlider_default as RangeSlider, Rating_default as Rating, Result_default as Result, RingProgress_default as RingProgress, Ripple_default as Ripple, SAVE_THROTTLE_MS, SCROLL_ATOP_ATTR, SCROLL_ATOP_HIDE_PX, SCROLL_AT_ATTR, SCROLL_RESTORE_ATTR, SCROLL_STATE_FIELD, STAGGER, ScrollArea_default as ScrollArea, SearchInput_default as SearchInput, Section_default as Section, SegmentedControl_default as SegmentedControl, Select_default as Select, Sheet_default as Sheet, Sidebar_default as Sidebar, SidebarGroup_default as SidebarGroup, SidebarTrigger_default as SidebarTrigger, SimpleGrid_default as SimpleGrid, Skeleton_default as Skeleton, Slider_default as Slider, Space_default as Space, Spinner_default as Spinner, Splitter_default as Splitter, SplitterHandle_default as SplitterHandle, SplitterPanel_default as SplitterPanel, Spoiler_default as Spoiler, Stack_default as Stack, Statistic_default as Statistic, Switch_default as Switch, TRANSITION, TRAVEL, Table_default as Table, TableBody_default as TableBody, TableCell_default as TableCell, TableHead_default as TableHead, TableHeader_default as TableHeader, TableRow_default as TableRow, Tabs_default as Tabs, TabsContent_default as TabsContent, TabsList_default as TabsList, TabsTrigger_default as TabsTrigger, Tag_default as Tag, TagsInput_default as TagsInput, Text_default as Text, Textarea_default as Textarea, Time_default as Time, TimeField_default as TimeField, Toaster_default as Toaster, Toggle_default as Toggle, Tooltip_default as Tooltip, TooltipProvider_default as TooltipProvider, TreeSelect_default as TreeSelect, VisuallyHidden_default as VisuallyHidden, atopOff, cn, createScrollRestorer, cssEase, enUS, firstPaintRestoreScript, provideImageResolver, provideUiLocale, readScrollRecord, toast, tokenize, tokensToHtml, tv, useImageResolver, useUiLocale, vTooltip, writeScrollRecord, zhCN };
+export { Accordion_default as Accordion, AccordionContent_default as AccordionContent, AccordionItem_default as AccordionItem, AccordionTrigger_default as AccordionTrigger, Alert_default as Alert, AlertDialog_default as AlertDialog, Anchor_default as Anchor, AppShell_default as AppShell, AspectRatio_default as AspectRatio, Avatar_default as Avatar, AvatarGroup_default as AvatarGroup, Badge_default as Badge, Banner_default as Banner, Blockquote_default as Blockquote, Breadcrumb_default as Breadcrumb, BreadcrumbItem_default as BreadcrumbItem, BreadcrumbSeparator_default as BreadcrumbSeparator, Button_default as Button, ButtonGroup_default as ButtonGroup, Calendar_default as Calendar, Callout_default as Callout, Card_default as Card, Center_default as Center, Checkbox_default as Checkbox, CheckboxGroup_default as CheckboxGroup, Chip_default as Chip, CloseButton_default as CloseButton, Code_default as Code, CodeBlock_default as CodeBlock, Collapsible_default as Collapsible, CollapsibleContent_default as CollapsibleContent, CollapsibleTrigger_default as CollapsibleTrigger, Combobox_default as Combobox, CommandPalette_default as CommandPalette, Container_default as Container, ContextMenu_default as ContextMenu, ContextMenuCheckboxItem_default as ContextMenuCheckboxItem, ContextMenuGroup_default as ContextMenuGroup, ContextMenuItem_default as ContextMenuItem, ContextMenuLabel_default as ContextMenuLabel, ContextMenuRadioGroup_default as ContextMenuRadioGroup, ContextMenuRadioItem_default as ContextMenuRadioItem, ContextMenuSeparator_default as ContextMenuSeparator, ContextMenuSub_default as ContextMenuSub, CopyButton_default as CopyButton, DURATION, DateField_default as DateField, DatePicker_default as DatePicker, DateRangeField_default as DateRangeField, DateRangePicker_default as DateRangePicker, DateTimePicker_default as DateTimePicker, DescriptionDetails_default as DescriptionDetails, DescriptionList_default as DescriptionList, DescriptionTerm_default as DescriptionTerm, Dialog_default as Dialog, DisclosureIcon_default as DisclosureIcon, Divider_default as Divider, Drawer_default as Drawer, DropdownMenu_default as DropdownMenu, DropdownMenuCheckboxItem_default as DropdownMenuCheckboxItem, DropdownMenuGroup_default as DropdownMenuGroup, DropdownMenuItem_default as DropdownMenuItem, DropdownMenuLabel_default as DropdownMenuLabel, DropdownMenuRadioGroup_default as DropdownMenuRadioGroup, DropdownMenuRadioItem_default as DropdownMenuRadioItem, DropdownMenuSeparator_default as DropdownMenuSeparator, DropdownMenuSub_default as DropdownMenuSub, EASE, Empty_default as Empty, FileUpload_default as FileUpload, Flex_default as Flex, Form_default as Form, FormField_default as FormField, FormLayout_default as FormLayout, Grid_default as Grid, Heading_default as Heading, Highlight_default as Highlight, HoverCard_default as HoverCard, IconButton_default as IconButton, Image_default as Image, ImageGroup_default as ImageGroup, Indicator_default as Indicator, Inline_default as Inline, Input_default as Input, InputGroup_default as InputGroup, InputGroupAddon_default as InputGroupAddon, Kbd_default as Kbd, Lightbox_default as Lightbox, Link_default as Link, List_default as List, ListItem_default as ListItem, Listbox_default as Listbox, LoadingOverlay_default as LoadingOverlay, Mark_default as Mark, Menubar_default as Menubar, MenubarCheckboxItem_default as MenubarCheckboxItem, MenubarGroup_default as MenubarGroup, MenubarItem_default as MenubarItem, MenubarLabel_default as MenubarLabel, MenubarMenu_default as MenubarMenu, MenubarRadioGroup_default as MenubarRadioGroup, MenubarRadioItem_default as MenubarRadioItem, MenubarSeparator_default as MenubarSeparator, MenubarSub_default as MenubarSub, MeterGroup_default as MeterGroup, MultiCombobox_default as MultiCombobox, MultiSelect_default as MultiSelect, NavLink_default as NavLink, NumberFormat_default as NumberFormat, NumberInput_default as NumberInput, Page_default as Page, PageAside_default as PageAside, PageBody_default as PageBody, PageHeader_default as PageHeader, Pagination_default as Pagination, PaginationContent_default as PaginationContent, PaginationInfo_default as PaginationInfo, PaginationJump_default as PaginationJump, PaginationSize_default as PaginationSize, Panel_default as Panel, PasswordInput_default as PasswordInput, PinInput_default as PinInput, Popconfirm_default as Popconfirm, Popover_default as Popover, PrevNext_default as PrevNext, PrevNextLink_default as PrevNextLink, Progress_default as Progress, Prose_default as Prose, REQUIRED_SINGLETONS, RESTORE_DEADLINE_MS, RadioGroup_default as RadioGroup, RangeCalendar_default as RangeCalendar, RangeSlider_default as RangeSlider, Rating_default as Rating, Result_default as Result, RingProgress_default as RingProgress, Ripple_default as Ripple, SAVE_THROTTLE_MS, SCROLL_ATOP_ATTR, SCROLL_ATOP_HIDE_PX, SCROLL_AT_ATTR, SCROLL_RESTORE_ATTR, SCROLL_STATE_FIELD, STAGGER, ScrollArea_default as ScrollArea, SearchInput_default as SearchInput, Section_default as Section, SegmentedControl_default as SegmentedControl, Select_default as Select, Sheet_default as Sheet, Sidebar_default as Sidebar, SidebarGroup_default as SidebarGroup, SidebarLabel_default as SidebarLabel, SidebarTrigger_default as SidebarTrigger, SimpleGrid_default as SimpleGrid, Skeleton_default as Skeleton, Slider_default as Slider, Space_default as Space, Spinner_default as Spinner, Splitter_default as Splitter, SplitterHandle_default as SplitterHandle, SplitterPanel_default as SplitterPanel, Spoiler_default as Spoiler, Stack_default as Stack, Statistic_default as Statistic, Switch_default as Switch, TRANSITION, TRAVEL, Table_default as Table, TableBody_default as TableBody, TableCell_default as TableCell, TableHead_default as TableHead, TableHeader_default as TableHeader, TableRow_default as TableRow, Tabs_default as Tabs, TabsContent_default as TabsContent, TabsList_default as TabsList, TabsTrigger_default as TabsTrigger, Tag_default as Tag, TagsInput_default as TagsInput, Text_default as Text, Textarea_default as Textarea, Time_default as Time, TimeField_default as TimeField, Toaster_default as Toaster, Toggle_default as Toggle, Tooltip_default as Tooltip, TooltipProvider_default as TooltipProvider, Tree_default as Tree, TreeSelect_default as TreeSelect, VisuallyHidden_default as VisuallyHidden, atopOff, cn, createScrollRestorer, cssEase, enUS, firstPaintRestoreScript, provideImageResolver, provideUiLocale, readScrollRecord, toast, tokenize, tokensToHtml, tv, useImageResolver, useUiLocale, vTooltip, writeScrollRecord, zhCN };
 
 //# sourceMappingURL=index.js.map