@mkbabb/glass-ui 4.0.1 → 4.1.0

package/dist/dock.js

@@ -1,32 +1,34 @@
 import { t as e } from "./cn-DJXf4yaB.js";
-import { a as t, b as n, o as r, v as i } from "./vendor-CKmzio-i.js";
-import { t as a } from "./useLiquidFlex-mZPMiNXh.js";
-import { t as o } from "./vSpecular-CQFmLNzA.js";
+import { a as t, d as n, o as r, x as i } from "./vendor-B2qOlYY3.js";
+import { t as a } from "./useLiquidFlex-UmA6LMZu.js";
+import { t as o } from "./vSpecular-EX7loENl.js";
 import { t as s } from "./useResizeObserver-Bpoi7tRE.js";
 import { t as c } from "./useTouchGate-CBZTD4SD.js";
 import { n as l } from "./useResolveTokenColor-vAylyR0x.js";
 import { n as u, t as d } from "./createContext-CpBNTRMI.js";
 import { a as f, c as p, i as m, n as h, o as g, r as _, s as v, t as y } from "./dockContext-BNfyPLe9.js";
-import { t as b } from "./FadingScroll-DI6hQhT9.js";
-import { t as x } from "./useIntersectionPause-Bj4sPkMh.js";
-import { t as S } from "./useDragMorph-DgxnsVJz.js";
-import { t as C } from "./useRAFLoop-UYa4zoiN.js";
-import { Fragment as w, computed as T, createBlock as E, createCommentVNode as D, createElementBlock as O, createElementVNode as k, createVNode as A, defineComponent as j, mergeModels as M, mergeProps as N, nextTick as P, normalizeClass as F, normalizeStyle as I, onBeforeUnmount as L, onMounted as R, onScopeDispose as z, onUnmounted as B, openBlock as V, readonly as H, ref as U, renderList as ee, renderSlot as W, resolveDynamicComponent as G, toDisplayString as te, unref as K, useId as ne, useModel as re, useSlots as ie, useTemplateRef as q, watch as J, withCtx as Y, withDirectives as X } from "vue";
-import { DropdownMenuTrigger as Z, Primitive as ae, SelectIcon as Q, SelectTrigger as oe, TabsIndicator as se, TabsList as ce, TabsRoot as le, TabsTrigger as ue, useForwardProps as de, useForwardPropsEmits as fe } from "reka-ui";
-import { SpringProgress as pe } from "@mkbabb/keyframes.js";
+import { t as b } from "./FadingScroll-DLRbH5Xr.js";
+import { t as x } from "./useIntersectionPause-Dbozzjgm.js";
+import { t as S } from "./useDragMorph-BUgAC-zK.js";
+import { t as C } from "./useDockCtaReceive-DfFkmgL1.js";
+import { r as w, t as T } from "./useScrollChrome-D66AVP7C.js";
+import { t as E } from "./useFuzzySearch-DIhcYtcw.js";
+import { Fragment as D, computed as O, createBlock as k, createCommentVNode as A, createElementBlock as j, createElementVNode as M, createVNode as N, defineComponent as P, mergeModels as F, mergeProps as I, nextTick as L, normalizeClass as R, normalizeStyle as z, onBeforeUnmount as ee, onMounted as te, onScopeDispose as B, onUnmounted as V, openBlock as H, readonly as U, ref as W, renderList as ne, renderSlot as G, resolveDynamicComponent as re, toDisplayString as ie, unref as K, useId as ae, useModel as q, useSlots as oe, useTemplateRef as J, watch as Y, withCtx as X, withDirectives as Z } from "vue";
+import { DropdownMenuTrigger as se, Primitive as ce, SelectIcon as le, SelectTrigger as ue, TabsIndicator as de, TabsList as fe, TabsRoot as pe, TabsTrigger as me, useForwardProps as he, useForwardPropsEmits as ge } from "reka-ui";
+import { SpringProgress as _e } from "@mkbabb/keyframes.js";
 //#region src/composables/glass/useGlassBackdropLuminance.ts
-var me = "(prefers-reduced-motion: reduce)", $ = 32;
-function he(e) {
+var ve = "(prefers-reduced-motion: reduce)", Q = 32;
+function ye(e) {
 	return typeof HTMLCanvasElement < "u" && e instanceof HTMLCanvasElement;
 }
-function ge(e) {
+function be(e) {
 	let t = e / 255;
 	return t <= .03928 ? t / 12.92 : ((t + .055) / 1.055) ** 2.4;
 }
-function _e(e, t, n) {
-	return .2126 * ge(e) + .7152 * ge(t) + .0722 * ge(n);
+function xe(e, t, n) {
+	return .2126 * be(e) + .7152 * be(t) + .0722 * be(n);
 }
-function ve(e) {
+function Se(e) {
 	let t = e.match(/rgba?\(\s*([\d.]+)[,\s]+([\d.]+)[,\s]+([\d.]+)(?:[,\s/]+([\d.]+))?/i);
 	return t ? [
 		Number(t[1]),
@@ -35,36 +37,36 @@ function ve(e) {
 		t[4] === void 0 ? 1 : Number(t[4])
 	] : null;
 }
-function ye(e) {
+function Ce(e) {
 	if (!e) return null;
-	if (he(e)) return e;
+	if (ye(e)) return e;
 	if (typeof e == "function") {
 		let t = e();
-		return he(t) ? t : null;
+		return ye(t) ? t : null;
 	}
 	if (typeof e == "string" && typeof document < "u") {
 		let t = document.querySelector(e);
-		return he(t) ? t : null;
+		return ye(t) ? t : null;
 	}
 	return null;
 }
-function be(e, t = {}) {
-	let { lightThreshold: n = .6, minSampleIntervalMs: r = 250, writeBucket: i = !0 } = t, a = Math.max(250, r), o = U(null), c = U(null);
+function we(e, t = {}) {
+	let { lightThreshold: n = .6, minSampleIntervalMs: r = 250, writeBucket: i = !0 } = t, a = Math.max(250, r), o = W(null), c = W(null);
 	if (typeof window > "u") return {
-		luma: H(o),
-		bucket: H(c),
+		luma: U(o),
+		bucket: U(c),
 		sampleNow: () => {},
 		dispose: () => {}
 	};
-	let u = window.matchMedia(me), d = u.matches, f = null, p = null;
+	let u = window.matchMedia(ve), d = u.matches, f = null, p = null;
 	function m() {
-		return f || (f = document.createElement("canvas"), f.width = $, f.height = $), p ||= f.getContext("2d", { willReadFrequently: !0 }), p;
+		return f || (f = document.createElement("canvas"), f.width = Q, f.height = Q), p ||= f.getContext("2d", { willReadFrequently: !0 }), p;
 	}
 	function h() {
 		return t.live === void 0 ? e.value?.dataset.glassSample === "live" : t.live;
 	}
 	function g(e) {
-		let n = ye(t.backgroundCanvas);
+		let n = Ce(t.backgroundCanvas);
 		if (!n || n.width === 0 || n.height === 0) return null;
 		let r = m();
 		if (!r) return null;
@@ -73,11 +75,11 @@ function be(e, t = {}) {
 		let o = n.width / a.width, s = n.height / a.height, c = Math.max(0, (i.left - a.left) * o), l = Math.max(0, (i.top - a.top) * s), u = Math.min(n.width - c, Math.max(1, i.width * o)), d = Math.min(n.height - l, Math.max(1, i.height * s));
 		if (u <= 0 || d <= 0) return null;
 		try {
-			r.clearRect(0, 0, $, $), r.drawImage(n, c, l, u, d, 0, 0, $, $);
-			let e = r.getImageData(0, 0, $, $).data, t = 0, i = 0;
+			r.clearRect(0, 0, Q, Q), r.drawImage(n, c, l, u, d, 0, 0, Q, Q);
+			let e = r.getImageData(0, 0, Q, Q).data, t = 0, i = 0;
 			for (let n = 0; n < e.length; n += 4) {
 				let r = e[n + 3] / 255, a = e[n] * r + 255 * (1 - r), o = e[n + 1] * r + 255 * (1 - r), s = e[n + 2] * r + 255 * (1 - r);
-				t += _e(a, o, s), i++;
+				t += xe(a, o, s), i++;
 			}
 			return i > 0 ? t / i : null;
 		} catch {
@@ -88,11 +90,11 @@ function be(e, t = {}) {
 		let t = e.getBoundingClientRect(), n = t.left + t.width / 2, r = t.top + t.height / 2, i = document.elementsFromPoint(n, r);
 		for (let t of i) {
 			if (!(t instanceof HTMLElement) || t === e || e.contains(t)) continue;
-			let n = getComputedStyle(t).backgroundColor, r = ve(l(n, e));
-			if (r && !(r[3] < .5)) return _e(r[0], r[1], r[2]);
+			let n = getComputedStyle(t).backgroundColor, r = Se(l(n, e));
+			if (r && !(r[3] < .5)) return xe(r[0], r[1], r[2]);
 		}
-		let a = ve(l(getComputedStyle(document.body).backgroundColor, e));
-		return a ? _e(a[0], a[1], a[2]) : null;
+		let a = Se(l(getComputedStyle(document.body).backgroundColor, e));
+		return a ? xe(a[0], a[1], a[2]) : null;
 	}
 	function v(t) {
 		o.value = t;
@@ -109,13 +111,13 @@ function be(e, t = {}) {
 		let n = h() ? g(t) ?? _(t) : _(t);
 		n !== null && v(n), y = typeof performance < "u" ? performance.now() : Date.now();
 	}
-	let S = C(({ now: e }) => {
+	let S = w(({ now: e }) => {
 		d || e - y < a || b();
 	}, {
 		immediate: !1,
 		pauseWhenHidden: !0,
 		respectReducedMotion: !0
-	}), w = x(() => e.value, {
+	}), C = x(() => e.value, {
 		pause: () => S.pause(),
 		resume: () => {
 			h() && !d && S.resume();
@@ -126,33 +128,33 @@ function be(e, t = {}) {
 	}
 	let D = () => E();
 	typeof u.addEventListener == "function" && u.addEventListener("change", D);
-	let O = J(() => e.value, (e) => {
+	let O = Y(() => e.value, (e) => {
 		e && (b(), E());
 	}, {
 		immediate: !0,
 		flush: "post"
 	});
 	function k() {
-		O(), S.dispose(), w.dispose(), T.stop(), typeof u.removeEventListener == "function" && u.removeEventListener("change", D), f = null, p = null;
+		O(), S.dispose(), C.dispose(), T.stop(), typeof u.removeEventListener == "function" && u.removeEventListener("change", D), f = null, p = null;
 	}
-	return z(k), {
-		luma: H(o),
-		bucket: H(c),
+	return B(k), {
+		luma: U(o),
+		bucket: U(c),
 		sampleNow: b,
 		dispose: k
 	};
 }
 //#endregion
 //#region src/components/custom/dock/composables/isTeleportedTarget.ts
-function xe(e, t) {
+function Te(e, t) {
 	if (!(e instanceof Element)) return !1;
 	let n = e.closest("[data-glass-dock-portal]");
 	return n ? t ? n.getAttribute("data-glass-dock-owner") === t : !0 : !1;
 }
 //#endregion
 //#region src/components/custom/dock/composables/useDockState.ts
-function Se(e) {
-	let { collapseDelay: t = 2500, rootEl: n, alwaysExpanded: r = !1, isTransitioning: i, dockId: a, onStateChange: o } = e, s = () => typeof r == "boolean" ? r : r.value, c = s(), l = U(c ? "pinned" : "collapsed"), u = U(c), d = U(c), f = null, p = U(0), m = T(() => p.value > 0), h = null, g = null, _ = !1, v = null;
+function Ee(e) {
+	let { collapseDelay: t = 2500, rootEl: n, alwaysExpanded: r = !1, isTransitioning: i, dockId: a, onStateChange: o } = e, s = () => typeof r == "boolean" ? r : r.value, c = s(), l = W(c ? "pinned" : "collapsed"), u = W(c), d = W(c), f = null, p = W(0), m = O(() => p.value > 0), h = null, g = null, _ = !1, v = null;
 	function y() {
 		v &&= (clearTimeout(v), null);
 	}
@@ -173,15 +175,15 @@ function Se(e) {
 	function w() {
 		g !== null && (cancelAnimationFrame(g), g = null);
 	}
-	function E() {
+	function T() {
 		w(), h?.();
 	}
-	function D() {
+	function E() {
 		s() || p.value > 0 || (C(), f = setTimeout(() => {
-			O(), l.value = "collapsed", S();
+			D(), l.value = "collapsed", S();
 		}, t));
 	}
-	function O() {
+	function D() {
 		typeof document > "u" || typeof PointerEvent > "u" || document.body.dispatchEvent(new PointerEvent("pointerdown", {
 			bubbles: !0,
 			composed: !0
@@ -192,7 +194,7 @@ function Se(e) {
 			l.value = "pinned", S();
 			return;
 		}
-		_ ||= (_ = !0, C(), y(), O(), l.value = "collapsed", S(), !1);
+		_ ||= (_ = !0, C(), y(), D(), l.value = "collapsed", S(), !1);
 	}
 	function A() {
 		if (s()) {
@@ -211,9 +213,9 @@ function Se(e) {
 			if (p.value > 0) return;
 			if (e) {
 				let t = n.value;
-				if (t && e.relatedTarget instanceof Node && t.contains(e.relatedTarget) || xe(e.relatedTarget, a) || b(e)) return;
+				if (t && e.relatedTarget instanceof Node && t.contains(e.relatedTarget) || Te(e.relatedTarget, a) || b(e)) return;
 			}
-			D();
+			E();
 		}
 	}
 	function N() {
@@ -222,7 +224,7 @@ function Se(e) {
 	function P(e) {
 		if (s() || l.value !== "hover" || p.value > 0) return;
 		let t = e.currentTarget;
-		e.relatedTarget && t.contains(e.relatedTarget) || xe(e.relatedTarget, a) || D();
+		e.relatedTarget && t.contains(e.relatedTarget) || Te(e.relatedTarget, a) || E();
 	}
 	function F() {
 		if (s()) {
@@ -236,28 +238,28 @@ function Se(e) {
 	}
 	function L() {
 		p.value = Math.max(0, p.value - 1), p.value === 0 && l.value === "hover" && (C(), f = setTimeout(() => {
-			p.value === 0 && l.value === "hover" && D();
+			p.value === 0 && l.value === "hover" && E();
 		}, Math.min(t, 800)));
 	}
 	function R(e) {
 		if (s() || i?.value) return;
 		let t = n.value;
-		!t || t.contains(e.target) || xe(e.target, a) || k();
+		!t || t.contains(e.target) || Te(e.target, a) || k();
 	}
-	return J(u, (e) => {
-		e ? (E(), g = requestAnimationFrame(() => {
+	return Y(u, (e) => {
+		e ? (T(), g = requestAnimationFrame(() => {
 			g = null, u.value && (document.addEventListener("pointerdown", R, !0), h = () => {
 				document.removeEventListener("pointerdown", R, !0), h = null;
 			});
-		})) : E();
-	}), typeof r == "boolean" ? r && (l.value = "pinned", S()) : J(r, (e) => {
+		})) : T();
+	}), typeof r == "boolean" ? r && (l.value = "pinned", S()) : Y(r, (e) => {
 		if (e) {
 			C(), l.value = "pinned", S();
 			return;
 		}
 		l.value = "collapsed", S();
-	}, { immediate: !0 }), B(() => {
-		C(), y(), E();
+	}, { immediate: !0 }), V(() => {
+		C(), y(), T();
 	}), {
 		state: l,
 		expanded: u,
@@ -276,19 +278,26 @@ function Se(e) {
 }
 //#endregion
 //#region src/components/custom/dock/composables/dockMorphMeasure.ts
-function Ce(e) {
+function De(e) {
 	return e === "vertical" ? "height" : "width";
 }
-function we(e) {
-	return Ce(e) === "width" ? "inline-size" : "block-size";
+function Oe(e) {
+	return De(e) === "width" ? "inline-size" : "block-size";
 }
-function Te(e, t) {
-	return e.getBoundingClientRect()[Ce(t)];
+function $(e, t) {
+	return e.getBoundingClientRect()[De(t)];
 }
-function Ee(e) {
+function ke(e) {
 	e.style.removeProperty("--dock-morph-from"), e.style.removeProperty("--dock-morph-to");
 }
-function De(e, t, n) {
+function Ae(e) {
+	if (!e || typeof getComputedStyle != "function") return 44;
+	let t = getComputedStyle(e).getPropertyValue("--dock-morph-min").trim();
+	if (!t) return 44;
+	let n = Number.parseFloat(t);
+	return Number.isFinite(n) && n > 0 ? n : 44;
+}
+function je(e, t, n) {
 	let r = [];
 	for (let i of n) {
 		if (i === e) continue;
@@ -297,39 +306,69 @@ function De(e, t, n) {
 	}
 	return r;
 }
-function Oe(e) {
+function Me(e) {
 	let t = e.containerEl.value;
 	if (!t) return () => {};
-	let n = we(e.axis.value), r = t.style.getPropertyValue(n);
+	let n = Oe(e.axis.value), r = t.style.getPropertyValue(n);
 	return t.style.setProperty(n, "max-content"), () => {
 		r ? t.style.setProperty(n, r) : t.style.removeProperty(n);
 	};
 }
-function ke(e, t, n) {
-	let r = e.axis.value, i = we(r);
-	Ee(t);
-	let a = De(e, t, n).map((e) => Oe(e)), o = t.style.getPropertyValue(i);
+function Ne(e, t, n) {
+	let r = e.axis.value, i = Oe(r);
+	ke(t);
+	let a = je(e, t, n).map((e) => Me(e)), o = t.style.getPropertyValue(i);
 	t.style.setProperty(i, "max-content");
-	let s = Te(t, r);
+	let s = $(t, r);
 	o ? t.style.setProperty(i, o) : t.style.removeProperty(i);
 	for (let e of a) e();
 	return s;
 }
-function Ae(e, t, n, r, i) {
+function Pe(e, t, n, r, i) {
 	if (t !== e.txId) return;
 	let a = e.containerEl.value, o = n;
 	if (!a || !o) return;
-	let s = e.axis.value, c = ke(e, a, r);
-	a.style.setProperty("--dock-morph-from", `${c}px`), a.style.setProperty("--dock-morph-to", `${c}px`), o.style.setProperty("--dock-morph-t", "1"), a.getBoundingClientRect()[Ce(s)], i.settleTarget(e), i.maybeSettleRoot();
+	let s = e.axis.value, c = Ne(e, a, r);
+	a.style.setProperty("--dock-morph-from", `${c}px`), a.style.setProperty("--dock-morph-to", `${c}px`), o.style.setProperty("--dock-morph-t", "1"), a.getBoundingClientRect()[De(s)], i.settleTarget(e), i.maybeSettleRoot();
+}
+function Fe(e, t) {
+	for (let n of t) {
+		if (n === e) continue;
+		let t = n.containerEl.value;
+		if (t && t.style.getPropertyValue("--dock-morph-to")) {
+			let e = $(t, n.axis.value);
+			t.style.setProperty("--dock-morph-from", `${e}px`);
+		}
+	}
+}
+function Ie(e) {
+	e && (e.style.removeProperty("--dock-root-morph-from"), e.style.removeProperty("--dock-root-morph-to"));
+}
+function Le(e, t, n) {
+	e && (e.style.setProperty("--dock-root-morph-from", `${t}px`), e.style.setProperty("--dock-root-morph-to", `${n}px`));
+}
+function Re(e, t, n, r, i, a, o, s, c) {
+	if (t !== e.txId) return;
+	let l = e.containerEl.value, u = o;
+	if (!l || !u) return;
+	ke(l);
+	let d = Oe(n), f = je(e, l, s).map((e) => Me(e)), p = a, m = p ? u.style.getPropertyValue("--dock-root-morph-from") : "", h = p ? u.style.getPropertyValue("--dock-root-morph-to") : "";
+	p && Ie(u), l.style.setProperty(d, "max-content");
+	let g = $(l, n), _ = p ? $(u, n) : 0;
+	l.style.removeProperty(d);
+	let v = Ae(l), y = g > 0 ? g : v, b = !p || _ > 0 ? _ : Ae(u);
+	p && (m && u.style.setProperty("--dock-root-morph-from", m), h && u.style.setProperty("--dock-root-morph-to", h));
+	for (let e of f) e();
+	c.armTarget(e, t, r, y), a && (Math.abs(b - i) < .5 ? Ie(u) : Le(u, i, b));
 }
 //#endregion
 //#region src/components/custom/dock/composables/dockMorphContext.ts
-var je = d(g), { KEY: Me } = je;
-function Ne(e) {
-	je.provide(e);
+var ze = d(g), { KEY: Be } = ze;
+function Ve(e) {
+	ze.provide(e);
 }
-var Pe = je.use;
-function Fe(e) {
+var He = ze.use;
+function Ue(e) {
 	let { rootEl: t, outerEl: n, outerActiveLayer: r, outerAxis: i } = e, a = null, o = /* @__PURE__ */ new Set();
 	function s() {
 		return t.value;
@@ -349,7 +388,7 @@ function Fe(e) {
 	}
 	function d(e) {
 		let t = e.containerEl.value;
-		t && Ee(t), e.leavingLayer.value = null;
+		t && ke(t), e === b && Ie(s()), e.leavingLayer.value = null;
 	}
 	function f() {
 		if (u()) return;
@@ -357,27 +396,26 @@ function Fe(e) {
 		e && (e.style.removeProperty("--dock-morph-t"), e.removeAttribute("data-morphing")), c();
 	}
 	function p() {
-		if (!s()) return;
-		let e = a !== null && !a.settled ? a.velocity : 0;
-		if (!a || a.settled) {
-			c(), a = new pe({
-				response: v.response,
-				dampingFraction: v.dampingFraction,
-				initial: 0,
-				respectReducedMotion: !0
-			});
-			let t = a;
-			t.reset(0, e), t.target = 1, t.play((e) => {
-				let n = s();
-				if (n && n.style.setProperty("--dock-morph-t", `${e}`), t.settled) {
-					for (let e of o) {
-						let t = e.containerEl.value;
-						t && t.style.getPropertyValue("--dock-morph-to") && d(e);
-					}
-					f();
+		let e = s();
+		if (!e) return;
+		let t = a !== null && !a.settled ? a.velocity : 0;
+		c(), a = new _e({
+			response: v.response,
+			dampingFraction: v.dampingFraction,
+			initial: 0,
+			respectReducedMotion: !0
+		});
+		let n = a;
+		n.reset(0, t), n.target = 1, e.style.setProperty("--dock-morph-t", "0"), n.play((e) => {
+			let t = s();
+			if (t && t.style.setProperty("--dock-morph-t", `${e}`), n.settled) {
+				for (let e of o) {
+					let t = e.containerEl.value;
+					t && t.style.getPropertyValue("--dock-morph-to") && d(e);
 				}
-			});
-		} else a.reset(0, e), a.target = 1;
+				f();
+			}
+		});
 	}
 	function m(e, t, n, r) {
 		if (t !== e.txId) return;
@@ -401,44 +439,24 @@ function Fe(e) {
 			e.currentLayer.value = t, e.leavingLayer.value = null;
 			return;
 		}
-		let a = ++e.txId, c = e.axis.value, u = Te(r, c);
-		e.leavingLayer.value = n, e.currentLayer.value = t;
-		for (let t of o) {
-			if (t === e) continue;
-			let n = t.containerEl.value;
-			if (n && n.style.getPropertyValue("--dock-morph-to")) {
-				let e = Te(n, t.axis.value);
-				n.style.setProperty("--dock-morph-from", `${e}px`);
-			}
-		}
-		if (r.style.setProperty("--dock-morph-from", `${u}px`), r.style.setProperty("--dock-morph-to", `${u}px`), i.style.setProperty("--dock-morph-t", "0"), i.setAttribute("data-morphing", ""), l()) {
-			P(() => Ae(e, a, s(), o, h));
+		let a = ++e.txId, c = e.axis.value, u = $(r, c), d = e === b ? $(i, c) : 0;
+		if (e.leavingLayer.value = n, e.currentLayer.value = t, Fe(e, o), r.style.setProperty("--dock-morph-from", `${u}px`), r.style.setProperty("--dock-morph-to", `${u}px`), i.style.setProperty("--dock-morph-t", "0"), i.setAttribute("data-morphing", ""), e === b && Le(s(), d, d), l()) {
+			L(() => Pe(e, a, s(), o, h));
 			return;
 		}
-		requestAnimationFrame(() => {
-			if (a !== e.txId) return;
-			let t = e.containerEl.value, n = s();
-			if (!t || !n) return;
-			Ee(t);
-			let r = we(c), i = De(e, t, o).map((e) => Oe(e));
-			t.style.setProperty(r, "max-content");
-			let l = Te(t, c);
-			t.style.removeProperty(r);
-			for (let e of i) e();
-			m(e, a, u, l);
-		});
+		L(() => requestAnimationFrame(() => Re(e, a, c, u, d, e === b, s(), o, { armTarget: m })));
 	}
 	function _(e) {
 		let t = {
 			containerEl: e.containerEl,
 			activeLayer: e.activeLayer,
 			axis: e.axis,
-			currentLayer: U(e.activeLayer.value),
-			leavingLayer: U(null),
+			currentLayer: W(e.activeLayer.value),
+			leavingLayer: W(null),
 			txId: 0,
 			stop: () => {}
 		};
-		return t.stop = J(e.activeLayer, (e, n) => {
+		return t.stop = Y(e.activeLayer, (e, n) => {
 			g(t, e, n);
 		}), o.add(t), t;
 	}
@@ -452,63 +470,63 @@ function Fe(e) {
 	}), x = { registerGroup(e) {
 		let t = _(e);
 		return {
-			currentLayer: H(t.currentLayer),
-			leavingLayer: H(t.leavingLayer),
+			currentLayer: U(t.currentLayer),
+			leavingLayer: U(t.leavingLayer),
 			release: () => y(t)
 		};
 	} };
 	function S(e) {
 		let t = n.value;
 		if (!t || e.target !== t) return;
-		let r = we(i.value);
-		e.propertyName !== r && e.propertyName !== Ce(i.value) || a && a.settled && (d(b), f());
+		let r = Oe(i.value);
+		e.propertyName !== r && e.propertyName !== De(i.value) || a && a.settled && (d(b), f());
 	}
-	return B(() => {
+	return V(() => {
 		for (let e of o) e.stop();
 		o.clear(), c();
 	}), {
 		context: x,
-		outerCurrentLayer: H(b.currentLayer),
+		outerCurrentLayer: U(b.currentLayer),
 		onOuterTransitionEnd: S
 	};
 }
 //#endregion
 //#region src/components/custom/dock/composables/useDockShellProps.ts
-function Ie(e) {
-	let t = T(() => {
+function We(e) {
+	let t = O(() => {
 		if (e.containerName) return {
 			"container-type": "inline-size",
 			"container-name": e.containerName
 		};
-	}), n = T(() => e.collapseDelay ?? 2e3), r = T(() => e.layout ?? "linear"), i = T(() => e.shape ?? "pill"), a = T(() => e.orientation ?? "horizontal"), o = T(() => e.density ?? "comfortable"), s = T(() => e.overflow === "scroll" ? a.value === "vertical" ? "dock-scroll-y" : "dock-scroll-x" : null), c = T(() => e.alwaysExpanded || r.value === "grid");
+	}), n = O(() => e.collapseDelay ?? 2e3), r = O(() => e.layout ?? "linear"), i = O(() => e.shape ?? "pill"), a = O(() => e.orientation ?? "horizontal"), o = O(() => e.density ?? "comfortable"), s = O(() => e.overflow === "scroll" ? a.value === "vertical" ? "dock-scroll-y" : "dock-scroll-x" : null), c = O(() => e.alwaysExpanded || r.value === "grid");
 	return {
 		containerStyle: t,
 		collapseDelay: n,
-		startCollapsed: T(() => c.value ? !1 : e.startCollapsed ?? !0),
+		startCollapsed: O(() => c.value ? !1 : e.startCollapsed ?? !0),
 		layoutValue: r,
 		shape: i,
 		orientation: a,
 		density: o,
 		scrollClass: s,
 		alwaysExpanded: c,
-		fitContent: T(() => e.fitContent ?? !1)
+		fitContent: O(() => e.fitContent ?? !1)
 	};
 }
 //#endregion
 //#region src/components/custom/dock/composables/useDockMorphWindow.ts
-function Le(e) {
+function Ge(e) {
 	let t = e.trim();
 	return t ? t.endsWith("ms") ? Number.parseFloat(t) : t.endsWith("s") ? Number.parseFloat(t) * 1e3 : Number.parseFloat(t) || 0 : 0;
 }
-function Re(e) {
-	let t = getComputedStyle(e), n = t.transitionDuration.split(",").map(Le), r = t.transitionDelay.split(",").map(Le);
+function Ke(e) {
+	let t = getComputedStyle(e), n = t.transitionDuration.split(",").map(Ge), r = t.transitionDelay.split(",").map(Ge);
 	return Math.max(0, ...n.map((e, t) => e + (r[t] ?? r[0] ?? 0)));
 }
-function ze(e) {
-	let t = Le(getComputedStyle(e).getPropertyValue("--duration-normal") || "0.3s");
+function qe(e) {
+	let t = Ge(getComputedStyle(e).getPropertyValue("--duration-normal") || "0.3s");
 	return Math.max(t > 0 ? t * 2 : 0, 600);
 }
-function Be(e, t) {
+function Je(e, t) {
 	let n = null, r = 0;
 	function i() {
 		n &&= (clearTimeout(n), null);
@@ -519,12 +537,12 @@ function Be(e, t) {
 		let o = ++r;
 		i(), t.value = !0, n = setTimeout(() => {
 			o === r && (t.value = !1, n = null);
-		}, Math.max(Re(a), ze(a)) + 50);
+		}, Math.max(Ke(a), qe(a)) + 50);
 	}
 	function o(n) {
 		n.target === e.value && p.has(n.propertyName) && (i(), r++, t.value = !1);
 	}
-	return L(i), {
+	return ee(i), {
 		markTransitioning: a,
 		onDockTransitionDone: o,
 		clearTransitionTimer: i
@@ -532,7 +550,7 @@ function Be(e, t) {
 }
 //#endregion
 //#region src/components/custom/dock/composables/useDockClickIntegrity.ts
-function Ve(e) {
+function Ye(e) {
 	let { rootEl: t, visualExpanded: n } = e, r = null, i = !1, a = 0, o = null;
 	function s() {
 		o !== null && (clearTimeout(o), o = null);
@@ -576,7 +594,7 @@ function Ve(e) {
 			e.stopPropagation(), e.preventDefault(), r = null;
 		}
 	}
-	return L(s), {
+	return ee(s), {
 		onPointerDownCapture: f,
 		onClickCapture: m,
 		markExpandFlip: c
@@ -584,14 +602,18 @@ function Ve(e) {
 }
 //#endregion
 //#region src/components/custom/dock/GlassDock.vue?vue&type=script&setup=true&lang.ts
-var He = ["data-has-rail"], Ue = [
+var Xe = ["data-has-rail"], Ze = [
 	"data-density",
 	"data-held",
+	"data-search",
 	"data-container-name"
-], We = {
+], Qe = {
 	key: 0,
 	class: "dock-persistent"
-}, Ge = ["inert"], Ke = ["inert"], qe = /* @__PURE__ */ j({
+}, $e = ["inert"], et = ["inert"], tt = {
+	key: 0,
+	class: "dock-search-field"
+}, nt = /* @__PURE__ */ P({
 	inheritAttrs: !1,
 	__name: "GlassDock",
 	props: {
@@ -611,139 +633,132 @@ var He = ["data-has-rail"], Ue = [
 			Function,
 			String,
 			null
-		] }
+		] },
+		search: { type: Boolean }
 	},
 	setup(e, { expose: t }) {
-		let n = e, { containerStyle: r, collapseDelay: i, startCollapsed: a, layoutValue: o, shape: l, orientation: u, density: d, scrollClass: f, alwaysExpanded: p, fitContent: m } = Ie(n), g = o, _ = q("dockEl"), v = q("layersEl");
-		n.autoLuminance !== !1 && be(_, { backgroundCanvas: n.backgroundCanvas ?? null });
-		let y = U(!1), b = c(i.value), x = `glass-dock-${ne()}`, { expanded: S, isPinned: C, isHeld: w, onMouseEnter: E, onMouseLeave: A, onFocusIn: j, onFocusOut: M, onClickCollapsed: P, keepOpen: I, release: L, expand: z, collapse: B } = Se({
+		let n = e, { containerStyle: r, collapseDelay: i, startCollapsed: a, layoutValue: o, shape: s, orientation: l, density: u, scrollClass: d, alwaysExpanded: f, fitContent: p } = We(n), m = o, g = J("dockEl"), _ = J("layersEl");
+		n.autoLuminance !== !1 && we(g, { backgroundCanvas: n.backgroundCanvas ?? null });
+		let v = W(!1), y = c(i.value), b = `glass-dock-${ae()}`, { expanded: x, isPinned: S, isHeld: C, onMouseEnter: w, onMouseLeave: T, onFocusIn: E, onFocusOut: D, onClickCollapsed: k, keepOpen: N, release: P, expand: F, collapse: L } = Ee({
 			collapseDelay: i.value,
-			rootEl: _,
-			alwaysExpanded: p,
-			isTransitioning: y,
-			dockId: x
+			rootEl: g,
+			alwaysExpanded: f,
+			isTransitioning: v,
+			dockId: b
 		});
 		h({
-			id: x,
-			orientation: u,
-			layout: g,
-			keepOpen: I,
-			release: L,
-			held: w
+			id: b,
+			orientation: l,
+			layout: m,
+			keepOpen: N,
+			release: P,
+			held: C
 		});
-		let H = T(() => p.value || S.value), ee = ie(), G = T(() => !!ee.rail), te = q("frameEl");
-		function re() {
-			let e = te.value;
-			if (!e || !G.value) return;
-			let t = _.value?.querySelector("[data-rail-anchor]");
-			if (!t) {
-				e.style.removeProperty("--dock-rail-seam-offset");
-				return;
-			}
-			let n = e.getBoundingClientRect(), r = t.getBoundingClientRect(), i = u.value === "vertical" ? r.top + r.height / 2 - n.top : r.left + r.width / 2 - n.left;
-			e.style.setProperty("--dock-rail-seam-offset", `${Math.round(i)}px`);
-		}
-		s(_, () => re()), R(() => re()), J([u, G], () => re(), { flush: "post" });
-		let { context: Y, onOuterTransitionEnd: X } = Fe({
-			rootEl: _,
-			outerEl: v,
-			outerActiveLayer: T(() => H.value ? "full" : "summary"),
-			outerAxis: T(() => u.value)
+		let z = O(() => f.value || x.value), ee = oe(), B = O(() => !!ee.rail), V = J("frameEl"), { context: U, onOuterTransitionEnd: ne } = Ue({
+			rootEl: g,
+			outerEl: _,
+			outerActiveLayer: O(() => z.value ? "full" : "summary"),
+			outerAxis: O(() => l.value)
 		});
-		Ne(Y);
-		let Z = T(() => ({ "view-transition-name": x.replace(/[^a-zA-Z0-9_-]/g, "-") })), { markTransitioning: ae, onDockTransitionDone: Q } = Be(_, y), { onPointerDownCapture: oe, onClickCapture: se, markExpandFlip: ce } = Ve({
-			rootEl: _,
-			visualExpanded: H
+		Ve(U);
+		let re = O(() => ({ "view-transition-name": b.replace(/[^a-zA-Z0-9_-]/g, "-") })), { markTransitioning: ie, onDockTransitionDone: q } = Je(g, v), { onPointerDownCapture: X, onClickCapture: Z, markExpandFlip: se } = Ye({
+			rootEl: g,
+			visualExpanded: z
 		});
-		R(() => {
-			(n.alwaysExpanded || !a.value) && z();
+		te(() => {
+			(n.alwaysExpanded || !a.value) && F();
 		});
-		function le() {
-			return !p.value;
+		function ce() {
+			return !f.value;
 		}
-		function ue(e) {
-			if (!le() || H.value) return;
-			let t = _.value, n = e.touches[0];
-			!t || !n || b.handleTouchStart(t, n.clientY);
+		function le(e) {
+			if (!ce() || z.value) return;
+			let t = g.value, n = e.touches[0];
+			!t || !n || y.handleTouchStart(t, n.clientY);
 		}
-		function de(e) {
-			le() && b.handleScrollCheck(e);
+		function ue(e) {
+			ce() && y.handleScrollCheck(e);
 		}
-		function fe() {
-			if (!le()) return;
-			let e = b.isActive.value;
-			b.handleTouchEnd(), !e && b.isActive.value && !H.value && z();
+		function de() {
+			if (!ce()) return;
+			let e = y.isActive.value;
+			y.handleTouchEnd(), !e && y.isActive.value && !z.value && F();
 		}
-		return J(b.isActive, (e) => {
-			!e && S.value && !C.value && !p.value && B();
-		}), J(H, (e) => {
-			ae(), e ? ce() : b.deactivate();
+		return Y(y.isActive, (e) => {
+			!e && x.value && !S.value && !f.value && L();
+		}), Y(z, (e) => {
+			ie(), e ? se() : y.deactivate();
 		}), t({
-			expanded: S,
-			isPinned: C,
-			isHeld: w,
-			isTransitioning: y,
-			expand: z,
-			collapse: B,
-			keepOpen: I,
-			release: L
-		}), (t, n) => (V(), O("div", {
+			expanded: x,
+			isPinned: S,
+			isHeld: C,
+			isTransitioning: v,
+			expand: F,
+			collapse: L,
+			keepOpen: N,
+			release: P
+		}), (t, n) => (H(), j("div", {
 			ref_key: "frameEl",
-			ref: te,
-			class: F(["glass-dock-frame", K(u)]),
-			"data-has-rail": G.value || void 0
-		}, [k("div", N({
+			ref: V,
+			class: R(["glass-dock-frame", K(l)]),
+			"data-has-rail": B.value || void 0
+		}, [M("div", I({
 			ref_key: "dockEl",
-			ref: _
+			ref: g
 		}, t.$attrs, {
 			class: ["glass-dock", [
-				K(u),
-				`shape-${K(l)}`,
-				`layout-${K(g)}`,
-				K(f),
+				K(l),
+				`shape-${K(s)}`,
+				`layout-${K(m)}`,
+				K(d),
 				{
-					expanded: H.value,
-					collapsed: !H.value,
-					pinned: K(C),
-					"fit-content": K(m),
-					"always-expanded": K(p),
-					"dock-overflow-wrap": e.overflow === "wrap" && K(u) !== "vertical"
+					expanded: z.value,
+					collapsed: !z.value,
+					pinned: K(S),
+					"fit-content": K(p),
+					"always-expanded": K(f),
+					"dock-overflow-wrap": e.overflow === "wrap" && K(l) !== "vertical"
 				},
 				e.position === "fixed" ? "fixed bottom-(--dock-pos) left-1/2 -translate-x-1/2" : e.position === "sticky" ? "dock-sticky" : "dock-inline"
 			]],
-			"data-density": K(d),
-			"data-held": K(w) || void 0,
+			"data-density": K(u),
+			"data-held": K(C) || void 0,
+			"data-search": e.search || void 0,
 			"data-container-name": e.containerName || void 0,
-			style: [K(r), Z.value],
-			onMouseenter: n[2] ||= (...e) => K(E) && K(E)(...e),
-			onMouseleave: n[3] ||= (e) => K(A)(e),
-			onFocusin: n[4] ||= (...e) => K(j) && K(j)(...e),
-			onFocusout: n[5] ||= (...e) => K(M) && K(M)(...e),
-			onTouchstart: ue,
-			onTouchmove: de,
-			onTouchend: fe,
-			onPointerdownCapture: n[6] ||= (...e) => K(oe) && K(oe)(...e),
-			onClickCapture: n[7] ||= (...e) => K(se) && K(se)(...e),
-			onTransitionend: n[8] ||= (...e) => K(Q) && K(Q)(...e),
-			onTransitioncancel: n[9] ||= (...e) => K(Q) && K(Q)(...e)
-		}), [t.$slots.persistent ? (V(), O("div", We, [W(t.$slots, "persistent")])) : D("", !0), k("div", {
+			style: [K(r), re.value],
+			onMouseenter: n[2] ||= (...e) => K(w) && K(w)(...e),
+			onMouseleave: n[3] ||= (e) => K(T)(e),
+			onFocusin: n[4] ||= (...e) => K(E) && K(E)(...e),
+			onFocusout: n[5] ||= (...e) => K(D) && K(D)(...e),
+			onTouchstart: le,
+			onTouchmove: ue,
+			onTouchend: de,
+			onPointerdownCapture: n[6] ||= (...e) => K(X) && K(X)(...e),
+			onClickCapture: n[7] ||= (...e) => K(Z) && K(Z)(...e),
+			onTransitionend: n[8] ||= (...e) => K(q) && K(q)(...e),
+			onTransitioncancel: n[9] ||= (...e) => K(q) && K(q)(...e)
+		}), [t.$slots.persistent ? (H(), j("div", Qe, [G(t.$slots, "persistent")])) : A("", !0), M("div", {
 			ref_key: "layersEl",
-			ref: v,
+			ref: _,
 			class: "dock-layers",
-			onTransitionend: n[1] ||= (...e) => K(X) && K(X)(...e)
-		}, [k("div", {
-			class: F(["dock-layer dock-layer--full", { "is-active": H.value }]),
-			inert: !K(S) || void 0
-		}, [W(t.$slots, "default")], 10, Ge), k("div", {
-			class: F(["dock-layer dock-layer--summary", { "is-active": !H.value }]),
-			inert: K(S) || void 0,
-			onClick: n[0] ||= (...e) => K(P) && K(P)(...e)
-		}, [W(t.$slots, "collapsed")], 10, Ke)], 544)], 16, Ue), G.value ? (V(), O("div", {
+			onTransitionend: n[1] ||= (...e) => K(ne) && K(ne)(...e)
+		}, [
+			M("div", {
+				class: R(["dock-layer dock-layer--full", { "is-active": z.value }]),
+				inert: !z.value || void 0
+			}, [G(t.$slots, "default")], 10, $e),
+			M("div", {
+				class: R(["dock-layer dock-layer--summary", { "is-active": !z.value }]),
+				inert: z.value || void 0,
+				onClick: n[0] ||= (...e) => K(k) && K(k)(...e)
+			}, [G(t.$slots, "collapsed")], 10, et),
+			e.search ? (H(), j("div", tt, [G(t.$slots, "search")])) : A("", !0)
+		], 544)], 16, Ze), B.value ? (H(), j("div", {
 			key: 0,
-			class: F(["dock-hairline-slot", K(u)])
-		}, [W(t.$slots, "rail")], 2)) : D("", !0)], 10, He));
+			class: R(["dock-hairline-slot", K(l)])
+		}, [G(t.$slots, "rail")], 2)) : A("", !0)], 10, Xe));
 	}
-}), Je = /* @__PURE__ */ j({
+}), rt = /* @__PURE__ */ P({
 	__name: "Tabs",
 	props: {
 		defaultValue: {},
@@ -757,13 +772,13 @@ var He = ["data-has-rail"], Ue = [
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		let n = fe(e, t);
-		return (e, t) => (V(), E(K(le), N({ "data-slot": "tabs" }, K(n)), {
-			default: Y(() => [W(e.$slots, "default")]),
+		let n = ge(e, t);
+		return (e, t) => (H(), k(K(pe), I({ "data-slot": "tabs" }, K(n)), {
+			default: X(() => [G(e.$slots, "default")]),
 			_: 3
 		}, 16));
 	}
-}), Ye = /* @__PURE__ */ j({
+}), it = /* @__PURE__ */ P({
 	__name: "TabsTrigger",
 	props: {
 		value: {},
@@ -779,16 +794,16 @@ var He = ["data-has-rail"], Ue = [
 		] }
 	},
 	setup(t) {
-		let n = t, r = de(T(() => {
+		let n = t, r = he(O(() => {
 			let { class: e, ...t } = n;
 			return t;
 		}));
-		return (t, i) => (V(), E(K(ue), N({ "data-slot": "tabs-trigger" }, K(r), { class: K(e)("tap-squish focus-ring relative z-[1] inline-flex items-center justify-center whitespace-nowrap rounded-control p-1 px-3 text-sm font-medium transition-control disabled:pointer-events-none disabled:opacity-disabled data-[state=active]:text-[var(--active-tab-color,var(--foreground))] hover:text-foreground/70", n.class) }), {
-			default: Y(() => [W(t.$slots, "default")]),
+		return (t, i) => (H(), k(K(me), I({ "data-slot": "tabs-trigger" }, K(r), { class: K(e)("tap-squish focus-ring relative z-[1] inline-flex items-center justify-center whitespace-nowrap rounded-control p-1 px-3 text-sm font-medium transition-control disabled:pointer-events-none disabled:opacity-disabled data-[state=active]:text-[var(--active-tab-color,var(--foreground))] hover:text-foreground/70", n.class) }), {
+			default: X(() => [G(t.$slots, "default")]),
 			_: 3
 		}, 16, ["class"]));
 	}
-}), Xe = /* @__PURE__ */ j({
+}), at = /* @__PURE__ */ P({
 	__name: "TabsIndicator",
 	props: {
 		asChild: { type: Boolean },
@@ -806,13 +821,13 @@ var He = ["data-has-rail"], Ue = [
 		}
 	},
 	setup(t) {
-		let n = t, r = T(() => {
+		let n = t, r = O(() => {
 			let { class: e, surface: t, ...r } = n;
 			return r;
 		});
-		return (t, i) => (V(), E(K(se), N({ "data-slot": "tabs-indicator" }, r.value, { class: K(e)("pointer-events-none absolute left-0 bottom-1 top-1 z-0 w-(--reka-tabs-indicator-size) translate-x-(--reka-tabs-indicator-position) rounded-pill transition-[width,translate] duration-normal ease-spring-snappy", n.surface && "bg-(--glass-bg-quiet) [backdrop-filter:var(--glass-blur-quiet)]", n.class) }), null, 16, ["class"]));
+		return (t, i) => (H(), k(K(de), I({ "data-slot": "tabs-indicator" }, r.value, { class: K(e)("pointer-events-none absolute left-0 bottom-1 top-1 z-0 w-(--reka-tabs-indicator-size) translate-x-(--reka-tabs-indicator-position) rounded-pill transition-[width,translate] duration-normal ease-spring-snappy", n.surface && "bg-(--glass-bg-quiet) [backdrop-filter:var(--glass-blur-quiet)]", n.class) }), null, 16, ["class"]));
 	}
-}), Ze = /* @__PURE__ */ j({
+}), ot = /* @__PURE__ */ P({
 	__name: "TabsList",
 	props: {
 		loop: { type: Boolean },
@@ -831,25 +846,25 @@ var He = ["data-has-rail"], Ue = [
 		}
 	},
 	setup(t) {
-		let n = t, r = T(() => {
+		let n = t, r = O(() => {
 			let { class: e, indicator: t, ...r } = n;
 			return r;
 		});
-		return (i, a) => (V(), E(K(ce), N({ "data-slot": "tabs-list" }, r.value, { class: K(e)("relative inline-flex h-(--control-h-md) items-center justify-center rounded-input p-1 text-muted-foreground", n.class) }), {
-			default: Y(() => [t.indicator ? (V(), E(Xe, { key: 0 })) : D("", !0), W(i.$slots, "default")]),
+		return (i, a) => (H(), k(K(fe), I({ "data-slot": "tabs-list" }, r.value, { class: K(e)("relative inline-flex h-(--control-h-md) items-center justify-center rounded-input p-1 text-muted-foreground", n.class) }), {
+			default: X(() => [t.indicator ? (H(), k(at, { key: 0 })) : A("", !0), G(i.$slots, "default")]),
 			_: 3
 		}, 16, ["class"]));
 	}
-}), Qe = u(f, "[glass-ui:dock] <DockLayer> must be used inside <DockLayerGroup>"), { KEY: $e } = Qe;
-function et(e) {
-	Qe.provide(e);
+}), st = u(f, "[glass-ui:dock] <DockLayer> must be used inside <DockLayerGroup>"), { KEY: ct } = st;
+function lt(e) {
+	st.provide(e);
 }
-var tt = Qe.use;
-Qe.useOptional;
+var ut = st.use;
+st.useOptional;
 //#endregion
 //#region src/components/custom/dock/composables/useLayerTransition.ts
-function nt(e) {
-	let { containerEl: t, activeLayer: n, axis: r } = e, i = T(() => r?.value === "vertical" ? "height" : "width"), a = T(() => i.value === "width" ? "inline-size" : "block-size"), o = (e) => e.getBoundingClientRect()[i.value], s = U(n.value), c = U(null), l = 0, u = U(!1), d = [];
+function dt(e) {
+	let { containerEl: t, activeLayer: n, axis: r } = e, i = O(() => r?.value === "vertical" ? "height" : "width"), a = O(() => i.value === "width" ? "inline-size" : "block-size"), o = (e) => e.getBoundingClientRect()[i.value], s = W(n.value), c = W(null), l = 0, u = W(!1), d = [];
 	function f() {
 		if (d.length === 0) return;
 		let e = d.splice(0, d.length);
@@ -892,7 +907,7 @@ function nt(e) {
 			S(e, t);
 			return;
 		}
-		e.style.setProperty("--dock-morph-from", `${r}px`), e.style.setProperty("--dock-morph-to", `${i}px`), t.style.setProperty("--dock-morph-t", "0"), t.setAttribute("data-morphing", ""), u.value = !0, o || (h(), p = new pe({
+		e.style.setProperty("--dock-morph-from", `${r}px`), e.style.setProperty("--dock-morph-to", `${i}px`), t.style.setProperty("--dock-morph-t", "0"), t.setAttribute("data-morphing", ""), u.value = !0, o || (h(), p = new _e({
 			response: v.response,
 			dampingFraction: v.dampingFraction,
 			initial: 0,
@@ -903,7 +918,7 @@ function nt(e) {
 			n === l && (t.style.setProperty("--dock-morph-t", `${r}`), s.settled && S(e, t));
 		});
 	}
-	J(n, (e, n) => {
+	Y(n, (e, n) => {
 		if (e === n) return;
 		let r = t.value;
 		if (!r) {
@@ -912,7 +927,7 @@ function nt(e) {
 		}
 		let i = g(r), d = ++l, f = p !== null && m === r && !p.settled ? p : null, h = f ? f.velocity : 0, _ = o(r);
 		if (c.value = n, s.value = e, r.style.setProperty("--dock-morph-from", `${_}px`), r.style.setProperty("--dock-morph-to", `${_}px`), i.style.setProperty("--dock-morph-t", "0"), i.setAttribute("data-morphing", ""), u.value = !0, b()) {
-			P(() => x(r, i, d));
+			L(() => x(r, i, d));
 			return;
 		}
 		requestAnimationFrame(() => {
@@ -929,7 +944,7 @@ function nt(e) {
 		let n = t.value;
 		n && e.target === n && (e.propertyName !== a.value && e.propertyName !== i.value || p && p.settled && S(n, g(n)));
 	}
-	return B(() => {
+	return V(() => {
 		h(), d.length = 0;
 	}), {
 		onTransitionEnd: w,
@@ -941,9 +956,9 @@ function nt(e) {
 }
 //#endregion
 //#region src/components/custom/dock/DockLayerGroup.vue?vue&type=script&setup=true&lang.ts
-var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
+var ft = { key: 1 }, pt = { key: 2 }, mt = /* @__PURE__ */ P({
 	__name: "DockLayerGroup",
-	props: /* @__PURE__ */ M({
+	props: /* @__PURE__ */ F({
 		orientation: {},
 		showRail: {
 			type: Boolean,
@@ -960,14 +975,14 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 	}),
 	emits: ["update:active"],
 	setup(e) {
-		let t = e, n = re(e, "active"), r = m(), i = U([]), a = q("containerEl"), o = q("groupEl");
+		let t = e, n = q(e, "active"), r = m(), i = W([]), a = J("containerEl"), o = J("groupEl");
 		function c(e) {
 			i.value.find((t) => t.id === e.id) || i.value.push(e), d();
 		}
 		function l(e) {
 			i.value = i.value.filter((t) => t.id !== e), d();
 		}
-		let u = U(0);
+		let u = W(0);
 		function d() {
 			let e = a.value, t = o.value;
 			if (!e || !t) return;
@@ -978,17 +993,17 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 			}
 			n > u.value && (u.value = n);
 		}
-		let f = T(() => u.value > 0 ? {
+		let f = O(() => u.value > 0 ? {
 			"min-block-size": `${u.value}px`,
 			"--dock-layer-peak-block-size": `${u.value}px`
 		} : void 0);
-		s(a, () => d()), J(() => i.value.length, () => d());
-		let p = T(() => t.orientation ?? r?.orientation.value ?? "horizontal"), h = T(() => p.value === "vertical" ? "horizontal" : "vertical"), g = q("railListEl"), _ = U(null);
+		s(a, () => d()), Y(() => i.value.length, () => d());
+		let p = O(() => t.orientation ?? r?.orientation.value ?? "horizontal"), h = O(() => p.value === "vertical" ? "horizontal" : "vertical"), g = J("railListEl"), _ = W(null);
 		function v() {
 			let e = g.value;
 			_.value = e ? e.$el ?? e : null;
 		}
-		let y = T(() => h.value === "vertical" ? "y" : "x");
+		let y = O(() => h.value === "vertical" ? "y" : "x");
 		function b() {
 			let e = _.value;
 			if (!e) return [];
@@ -1009,25 +1024,25 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 				t.draggable && n.value !== e && (n.value = e);
 			}
 		});
-		J(() => [
+		Y(() => [
 			i.value.length,
 			h.value,
 			t.draggable
 		], () => {
-			v(), t.draggable && P(() => x.refresh());
-		}), R(() => {
-			v(), t.draggable && P(() => x.refresh());
+			v(), t.draggable && L(() => x.refresh());
+		}), te(() => {
+			v(), t.draggable && L(() => x.refresh());
 		});
-		let C = Pe(), j, M, N;
+		let C = He(), w, T, E;
 		if (C) {
 			let e = C.registerGroup({
 				containerEl: a,
 				activeLayer: n,
 				axis: p
 			});
-			j = e.currentLayer, M = e.leavingLayer, N = () => {}, L(() => e.release());
+			w = e.currentLayer, T = e.leavingLayer, E = () => {}, ee(() => e.release());
 		} else {
-			let e = nt({
+			let e = dt({
 				containerEl: a,
 				activeLayer: n,
 				axis: p,
@@ -1036,90 +1051,90 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 					return [i.value.findIndex((e) => e.id === t) < n ? "layer-back" : "layer-forward"];
 				}
 			});
-			j = H(e.currentLayer), M = H(e.leavingLayer), N = e.onTransitionEnd;
+			w = U(e.currentLayer), T = U(e.leavingLayer), E = e.onTransitionEnd;
 		}
-		let z = typeof document < "u" && "startViewTransition" in document, B = ne(), ie = T(() => z ? {
-			"view-transition-name": `gl-dock-stack-${B.replace(/[^a-zA-Z0-9_-]/g, "-")}`,
+		let P = typeof document < "u" && "startViewTransition" in document, F = ae(), I = O(() => P ? {
+			"view-transition-name": `gl-dock-stack-${F.replace(/[^a-zA-Z0-9_-]/g, "-")}`,
 			"view-transition-class": "gl-dock-layer"
 		} : void 0);
-		et({
+		lt({
 			register: c,
 			unregister: l,
-			currentLayerId: j,
-			leavingLayerId: M
+			currentLayerId: w,
+			leavingLayerId: T
 		});
-		function X(e) {
+		function B(e) {
 			return typeof e == "object" && !!e || typeof e == "function";
 		}
-		let Z = U(!1);
-		function ae() {
-			Z.value || (Z.value = !0, r?.keepOpen());
+		let V = W(!1);
+		function oe() {
+			V.value || (V.value = !0, r?.keepOpen());
 		}
-		function Q(e) {
+		function Z(e) {
 			let t = e.relatedTarget, n = e.currentTarget;
-			t && n?.contains(t) || Z.value && (Z.value = !1, r?.release());
+			t && n?.contains(t) || V.value && (V.value = !1, r?.release());
 		}
-		return (r, s) => (V(), O("div", {
+		return (r, s) => (H(), j("div", {
 			ref_key: "groupEl",
 			ref: o,
-			class: F(["dock-layer-group", [p.value, `rail-${e.railPosition}`]]),
-			style: I(f.value)
-		}, [e.showRail && i.value.length > 1 ? (V(), E(K(Je), {
+			class: R(["dock-layer-group", [p.value, `rail-${e.railPosition}`]]),
+			style: z(f.value)
+		}, [e.showRail && i.value.length > 1 ? (H(), k(K(rt), {
 			key: 0,
 			modelValue: n.value,
 			"onUpdate:modelValue": s[0] ||= (e) => n.value = e,
 			orientation: h.value,
 			"as-child": !0
 		}, {
-			default: Y(() => [A(K(Ze), {
+			default: X(() => [N(K(ot), {
 				ref_key: "railListEl",
 				ref: g,
-				class: F(["dock-layer-rail", [
+				class: R(["dock-layer-rail", [
 					e.railPosition,
 					t.draggable && "glass-drag-grabbable",
 					t.draggable && K(x).dragging.value && "glass-drag-lift"
 				]]),
-				style: I(t.draggable ? K(x).dragStyle.value : void 0),
+				style: z(t.draggable ? K(x).dragStyle.value : void 0),
 				indicator: !1,
-				onFocusin: ae,
-				onFocusout: Q
+				onFocusin: oe,
+				onFocusout: Z
 			}, {
-				default: Y(() => [(V(!0), O(w, null, ee(i.value, (e) => (V(), E(K(Ye), {
+				default: X(() => [(H(!0), j(D, null, ne(i.value, (e) => (H(), k(K(it), {
 					key: e.id,
 					value: e.id,
 					class: "dock-layer-tab",
 					title: e.label,
 					"aria-label": e.label ?? e.id
 				}, {
-					default: Y(() => [X(e.icon) ? (V(), E(G(e.icon), {
+					default: X(() => [B(e.icon) ? (H(), k(re(e.icon), {
 						key: 0,
 						class: "size-4"
-					})) : typeof e.icon == "string" ? (V(), O("span", rt, te(e.icon), 1)) : (V(), O("span", it, te((e.label ?? e.id).charAt(0)), 1))]),
+					})) : typeof e.icon == "string" ? (H(), j("span", ft, ie(e.icon), 1)) : (H(), j("span", pt, ie((e.label ?? e.id).charAt(0)), 1))]),
 					_: 2
 				}, 1032, [
 					"value",
 					"title",
 					"aria-label"
-				]))), 128)), A(K(Xe), {
+				]))), 128)), N(K(at), {
 					class: "dock-layer-tab-indicator",
 					surface: !1
 				})]),
 				_: 1
 			}, 8, ["class", "style"])]),
 			_: 1
-		}, 8, ["modelValue", "orientation"])) : D("", !0), k("div", {
+		}, 8, ["modelValue", "orientation"])) : A("", !0), M("div", {
 			ref_key: "containerEl",
 			ref: a,
 			class: "dock-layer-stack",
-			style: I(ie.value),
-			onTransitionend: s[1] ||= (...e) => K(N) && K(N)(...e)
-		}, [W(r.$slots, "default")], 36)], 6));
+			style: z(I.value),
+			onTransitionend: s[1] ||= (...e) => K(E) && K(E)(...e)
+		}, [G(r.$slots, "default")], 36)], 6));
 	}
-}), ot = [
+}), ht = [
 	"inert",
 	"aria-hidden",
 	"tabindex"
-], st = /* @__PURE__ */ j({
+], gt = /* @__PURE__ */ P({
 	__name: "DockLayer",
 	props: {
 		id: {},
@@ -1127,41 +1142,45 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 		icon: {}
 	},
 	setup(e) {
-		let t = e, n = tt();
-		R(() => {
+		let t = e, n = ut();
+		te(() => {
 			n.register({
 				id: t.id,
 				label: t.label,
 				icon: t.icon
 			});
-		}), L(() => {
+		}), ee(() => {
 			n.unregister(t.id);
 		});
-		let r = T(() => n.currentLayerId.value === t.id), i = T(() => n.leavingLayerId.value === t.id), a = q("hostEl");
-		return J(r, async (e, t) => {
+		let r = O(() => n.currentLayerId.value === t.id), i = O(() => n.leavingLayerId.value === t.id), a = J("hostEl");
+		return Y(r, async (e, t) => {
 			!e || t || typeof document < "u" && (() => {
 				let e = document.activeElement;
 				return !e || e === document.body ? !0 : !!e.closest("[inert]");
-			})() && (await P(), a.value?.focus());
-		}), (e, t) => (V(), O("div", {
+			})() && (await L(), a.value?.focus());
+		}), (e, t) => (H(), j("div", {
 			ref_key: "hostEl",
 			ref: a,
-			class: F(["dock-layer-item-host", {
+			class: R(["dock-layer-item-host", {
 				"is-active": r.value,
 				"is-leaving": i.value
 			}]),
 			inert: r.value ? void 0 : !0,
 			"aria-hidden": r.value ? void 0 : !0,
 			tabindex: r.value ? -1 : void 0
-		}, [W(e.$slots, "default")], 10, ot));
+		}, [G(e.$slots, "default")], 10, ht));
 	}
-}), ct = /* @__PURE__ */ j({
+}), _t = /* @__PURE__ */ P({
 	__name: "DockIconButton",
 	props: {
 		compact: {
 			type: Boolean,
 			default: !1
 		},
+		active: {
+			type: Boolean,
+			default: !1
+		},
 		type: { default: "button" },
 		as: { default: "button" },
 		asChild: {
@@ -1177,12 +1196,18 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 		] }
 	},
 	setup(t) {
-		let n = t, r = T(() => e("dock-icon-button glass-specular-track", { "dock-icon-button--compact": n.compact }, n.class)), i = T(() => !n.asChild && n.as === "button" ? { type: n.type } : {});
-		return (e, n) => X((V(), E(K(ae), N({
+		let n = t, r = O(() => e("dock-icon-button glass-specular-track", { "dock-icon-button--compact": n.compact }, n.class)), i = O(() => n.active ? {
+			"aria-pressed": "true",
+			"data-active": ""
+		} : {}), a = O(() => !n.asChild && n.as === "button" ? { type: n.type } : {});
+		return (e, n) => Z((H(), k(K(ce), I({
 			as: t.as,
 			"as-child": t.asChild
-		}, i.value, { class: r.value }), {
-			default: Y(() => [W(e.$slots, "default")]),
+		}, {
+			...a.value,
+			...i.value
+		}, { class: r.value }), {
+			default: X(() => [G(e.$slots, "default")]),
 			_: 3
 		}, 16, [
 			"as",
@@ -1190,7 +1215,7 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 			"class"
 		])), [[K(o)]]);
 	}
-}), lt = /* @__PURE__ */ j({
+}), vt = /* @__PURE__ */ P({
 	__name: "DockBackgroundToggle",
 	props: {
 		paused: {
@@ -1202,22 +1227,22 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 	},
 	emits: ["update:paused"],
 	setup(e, { emit: n }) {
-		let i = e, a = n, o = T(() => i.paused ? i.playLabel : i.pauseLabel);
+		let i = e, a = n, o = O(() => i.paused ? i.playLabel : i.pauseLabel);
 		function s() {
 			a("update:paused", !i.paused);
 		}
-		return (n, i) => (V(), E(ct, {
+		return (n, i) => (H(), k(_t, {
 			type: "button",
 			"aria-pressed": e.paused,
 			"aria-label": o.value,
 			title: o.value,
 			onClick: s
 		}, {
-			default: Y(() => [e.paused ? (V(), E(K(t), {
+			default: X(() => [e.paused ? (H(), k(K(t), {
 				key: 0,
 				size: 18,
 				"aria-hidden": "true"
-			})) : (V(), E(K(r), {
+			})) : (H(), k(K(r), {
 				key: 1,
 				size: 18,
 				"aria-hidden": "true"
@@ -1229,7 +1254,7 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 			"title"
 		]));
 	}
-}), ut = /* @__PURE__ */ j({
+}), yt = /* @__PURE__ */ P({
 	__name: "DockTabButton",
 	props: {
 		as: { default: "button" },
@@ -1246,13 +1271,13 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 		] }
 	},
 	setup(t) {
-		let n = t, r = T(() => e("dock-tab-button", n.class));
-		return (e, n) => X((V(), E(K(ae), {
+		let n = t, r = O(() => e("dock-tab-button", n.class));
+		return (e, n) => Z((H(), k(K(ce), {
 			as: t.as,
 			"as-child": t.asChild,
-			class: F(r.value)
+			class: R(r.value)
 		}, {
-			default: Y(() => [W(e.$slots, "default")]),
+			default: X(() => [G(e.$slots, "default")]),
 			_: 3
 		}, 8, [
 			"as",
@@ -1260,7 +1285,7 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 			"class"
 		])), [[K(o)]]);
 	}
-}), dt = /* @__PURE__ */ j({
+}), bt = /* @__PURE__ */ P({
 	__name: "DockSelectTrigger",
 	props: {
 		disabled: { type: Boolean },
@@ -1276,19 +1301,19 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 		] }
 	},
 	setup(t) {
-		let r = t, i = de(T(() => {
-			let { class: e, ...t } = r;
+		let n = t, r = he(O(() => {
+			let { class: e, ...t } = n;
 			return t;
 		}));
-		return (t, a) => X((V(), E(K(oe), N(K(i), { class: K(e)("dock-select-trigger", r.class) }), {
-			default: Y(() => [W(t.$slots, "default"), A(K(Q), { "as-child": "" }, {
-				default: Y(() => [W(t.$slots, "icon", {}, () => [A(K(n), { class: "dock-select-trigger__chevron" })])]),
+		return (t, a) => Z((H(), k(K(ue), I(K(r), { class: K(e)("dock-select-trigger", n.class) }), {
+			default: X(() => [G(t.$slots, "default"), N(K(le), { "as-child": "" }, {
+				default: X(() => [G(t.$slots, "icon", {}, () => [N(K(i), { class: "dock-select-trigger__chevron" })])]),
 				_: 3
 			})]),
 			_: 3
 		}, 16, ["class"])), [[K(o)]]);
 	}
-}), ft = /* @__PURE__ */ j({
+}), xt = /* @__PURE__ */ P({
 	__name: "DockDropdownTrigger",
 	props: {
 		disabled: { type: Boolean },
@@ -1304,97 +1329,145 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 		] }
 	},
 	setup(t) {
-		let n = t, r = de(T(() => {
+		let n = t, r = he(O(() => {
 			let { class: e, ...t } = n;
 			return t;
 		}));
-		return (t, i) => X((V(), E(K(Z), N(K(r), { class: K(e)("dock-dropdown-trigger", n.class) }), {
-			default: Y(() => [W(t.$slots, "default")]),
+		return (t, i) => Z((H(), k(K(se), I(K(r), { class: K(e)("dock-dropdown-trigger", n.class) }), {
+			default: X(() => [G(t.$slots, "default")]),
 			_: 3
 		}, 16, ["class"])), [[K(o)]]);
 	}
-}), pt = [
+}), St = [
 	"data-orientation",
 	"data-rail-anchor",
 	"aria-orientation"
-], mt = /* @__PURE__ */ j({
+], Ct = /* @__PURE__ */ P({
 	__name: "DockSeparator",
 	props: { anchor: {
 		type: Boolean,
 		default: !1
 	} },
 	setup(e) {
-		let t = m(), n = T(() => t?.orientation.value ?? "horizontal"), r = T(() => n.value), i = T(() => n.value === "vertical" ? "horizontal" : "vertical");
-		return (t, n) => (V(), O("div", {
-			class: F(["dock-separator", { "dock-separator--anchor": e.anchor }]),
+		let t = m(), n = O(() => t?.orientation.value ?? "horizontal"), r = O(() => n.value), i = O(() => n.value === "vertical" ? "horizontal" : "vertical");
+		return (t, n) => (H(), j("div", {
+			class: R(["dock-separator", { "dock-separator--anchor": e.anchor }]),
 			role: "separator",
 			"data-orientation": r.value,
 			"data-rail-anchor": e.anchor || void 0,
 			"aria-orientation": i.value
-		}, null, 10, pt));
+		}, null, 10, St));
 	}
-}), ht = ["data-orientation", "aria-label"], gt = ["aria-label"], _t = { class: "dock-hairline-extend-chip-label" }, vt = /* @__PURE__ */ j({
-	__name: "DockRail",
-	props: /* @__PURE__ */ M({
-		extent: { default: "beyond" },
-		position: { default: "end" },
+}), wt = ["data-orientation"], Tt = /* @__PURE__ */ P({
+	__name: "DockStack",
+	props: /* @__PURE__ */ F({
 		items: {},
-		icon: {},
-		iconLabel: { default: "Switch dock context" }
+		core: {},
+		coreLabel: { default: "Open stack" },
+		visibleCount: { default: 3 },
+		position: { default: "end" }
 	}, {
-		context: {},
-		contextModifiers: {}
+		selected: {},
+		selectedModifiers: {},
+		expanded: {
+			type: Boolean,
+			default: !1
+		},
+		expandedModifiers: {}
 	}),
-	emits: /* @__PURE__ */ M(["advance"], ["update:context"]),
+	emits: /* @__PURE__ */ F(["select"], ["update:selected", "update:expanded"]),
 	setup(e, { emit: t }) {
-		let n = e, r = re(e, "context"), a = t, o = m(), s = T(() => o?.orientation.value ?? "horizontal"), c = T(() => n.icon ?? i), l = T(() => n.items && n.items.length > 0 ? [...n.items] : []);
-		function u(e) {
-			r.value = e, a("advance", e);
+		let r = e, i = t, a = q(e, "selected"), o = q(e, "expanded"), s = m(), c = O(() => s?.orientation.value ?? "vertical"), l = O(() => r.core ?? n), u = O(() => [...r.items]), d = O(() => u.value.length > r.visibleCount), f = O(() => Math.min(u.value.length, r.visibleCount)), p = null;
+		function h() {
+			p != null && (clearTimeout(p), p = null);
+		}
+		function g() {
+			h(), p = setTimeout(() => {
+				o.value = !0, p = null;
+			}, 60);
 		}
-		return (t, n) => (V(), O("div", {
-			class: F(["dock-hairline-extend", [
-				s.value,
-				`extent-${e.extent}`,
-				`at-${e.position}`
+		function _() {
+			h(), o.value = !1;
+		}
+		function v() {
+			h(), o.value = !0;
+		}
+		function y(e) {
+			let t = e.relatedTarget, n = e.currentTarget;
+			n && t && n.contains(t) || (o.value = !1);
+		}
+		ee(h);
+		function x(e) {
+			a.value = e.id, e.onSelect?.(), i("select", e.id);
+		}
+		return (t, n) => (H(), j("div", {
+			class: R(["dock-stack", [
+				c.value,
+				`at-${e.position}`,
+				{ "is-expanded": o.value }
 			]]),
-			"data-orientation": s.value,
-			role: "group",
-			"aria-label": e.iconLabel
-		}, [A(b, {
-			axis: "x",
-			class: "dock-hairline-fade"
+			"data-orientation": c.value,
+			onPointerenter: g,
+			onPointerleave: _,
+			onFocusin: v,
+			onFocusout: y
+		}, [N(_t, {
+			type: "button",
+			class: "dock-stack-core",
+			"aria-label": e.coreLabel,
+			"aria-expanded": o.value,
+			title: e.coreLabel
+		}, {
+			default: X(() => [(H(), k(re(l.value), {
+				class: "size-4",
+				"aria-hidden": "true"
+			}))]),
+			_: 1
+		}, 8, [
+			"aria-label",
+			"aria-expanded",
+			"title"
+		]), N(b, {
+			axis: c.value === "vertical" ? "x" : "y",
+			class: "dock-stack-fan",
+			style: z({ "--dock-stack-visible": f.value }),
+			"data-scrolls": d.value || void 0
 		}, {
-			default: Y(() => [k("div", {
-				class: "dock-hairline-strip",
-				role: "tablist",
-				"aria-label": e.iconLabel
-			}, [(V(!0), O(w, null, ee(l.value, (e) => (V(), E(ct, {
+			default: X(() => [(H(!0), j(D, null, ne(u.value, (e, t) => (H(), k(_t, {
 				key: e.id,
 				type: "button",
-				class: F(["dock-hairline-extend-chip", { "is-active": r.value === e.id }]),
-				role: "tab",
-				"aria-selected": r.value === e.id,
+				class: R(["dock-stack-member", { "is-active": a.value === e.id }]),
+				style: z({ "--i": t }),
 				"aria-label": e.label,
+				"aria-pressed": a.value === e.id,
 				title: e.label,
-				onClick: (t) => u(e.id)
+				onClick: (t) => x(e)
 			}, {
-				default: Y(() => [(V(), E(G(e.icon ?? c.value), { class: "size-4" })), k("span", _t, te(e.label), 1)]),
+				default: X(() => [(H(), k(re(e.icon ?? l.value), {
+					class: "size-4",
+					"aria-hidden": "true"
+				}))]),
 				_: 2
 			}, 1032, [
 				"class",
-				"aria-selected",
+				"style",
 				"aria-label",
+				"aria-pressed",
 				"title",
 				"onClick"
-			]))), 128))], 8, gt)]),
+			]))), 128))]),
 			_: 1
-		})], 10, ht));
+		}, 8, [
+			"axis",
+			"style",
+			"data-scrolls"
+		])], 42, wt));
 	}
-}), yt = ["aria-label"], bt = [
+}), Et = ["aria-label"], Dt = [
 	"data-kind",
 	"data-section-id",
 	"aria-label"
-], xt = /* @__PURE__ */ j({
+], Ot = /* @__PURE__ */ P({
 	__name: "DockSection",
 	props: {
 		sections: {},
@@ -1402,7 +1475,7 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 		ariaLabel: { default: "Dock sections" }
 	},
 	setup(e) {
-		let t = e, n = T(() => {
+		let t = e, n = O(() => {
 			if (t.anchorId) return t.anchorId;
 			let e = t.sections.find((e) => e.kind === "nav");
 			return e ? e.id : t.sections.find((e) => e.kind !== "rail-core")?.id;
@@ -1416,106 +1489,177 @@ var rt = { key: 1 }, it = { key: 2 }, at = /* @__PURE__ */ j({
 		function a(e) {
 			return `dock-section-zone--${e === "rail-core" ? "core" : e}`;
 		}
-		return (t, n) => (V(), O("div", {
+		return (t, n) => (H(), j("div", {
 			class: "dock-section",
 			role: "group",
 			"aria-label": e.ariaLabel
-		}, [(V(!0), O(w, null, ee(e.sections, (e, n) => (V(), O(w, { key: e.id }, [r(n) ? (V(), E(mt, {
+		}, [(H(!0), j(D, null, ne(e.sections, (e, n) => (H(), j(D, { key: e.id }, [r(n) ? (H(), k(Ct, {
 			key: 0,
 			anchor: i(e)
-		}, null, 8, ["anchor"])) : D("", !0), k("div", {
-			class: F(["dock-section-zone", a(e.kind)]),
+		}, null, 8, ["anchor"])) : A("", !0), M("div", {
+			class: R(["dock-section-zone", a(e.kind)]),
 			"data-kind": e.kind,
 			"data-section-id": e.id,
 			"aria-label": e.label || void 0
-		}, [W(t.$slots, e.id, {
+		}, [G(t.$slots, e.id, {
 			section: e,
 			kind: e.kind
-		})], 10, bt)], 64))), 128))], 8, yt));
+		})], 10, Dt)], 64))), 128))], 8, Et));
 	}
 });
 //#endregion
+//#region src/components/custom/dock/composables/useDockSearch.ts
+function kt(e) {
+	let { dockState: t } = e, n = e.debounceMs ?? 120, r = e.maxResults ?? 30, i = W([]), a = null, o = e.items ? e.items : () => i.value;
+	function s(t) {
+		let n = t.item.id;
+		e.ensureTargetWindow?.(n), e.scrollTo?.(n), e.onResultSelect?.(t);
+	}
+	let c = E({
+		items: o,
+		debounceMs: n,
+		maxResults: r,
+		onSelect: s
+	});
+	if (e.onSearch) {
+		let t = e.onSearch;
+		Y(() => c.query.value, (e) => {
+			if (a?.abort(), !e) {
+				i.value = [];
+				return;
+			}
+			let n = new AbortController();
+			a = n, t(e, n.signal).then((e) => {
+				n.signal.aborted || (i.value = e);
+			}).catch((e) => {
+				n.signal.aborted || e?.name !== "AbortError" && (i.value = []);
+			});
+		});
+	}
+	let l = O(() => {
+		let e = c.query.value;
+		if (!e) return "";
+		let t = c.results.value[0];
+		if (!t) return "";
+		let n = t.item.label;
+		return n.toLowerCase().startsWith(e.toLowerCase()) && n.length > e.length ? n.slice(e.length) : "";
+	});
+	function u() {
+		let e = l.value;
+		e && (c.query.value = c.query.value + e);
+	}
+	let d = W(!1);
+	function f() {
+		d.value || (d.value = !0, t.onClickCollapsed(), t.keepOpen(), c.open());
+	}
+	function p() {
+		d.value && (d.value = !1, c.close(), t.release());
+	}
+	let m = null;
+	return e.collapseOnScroll && e.scrollContainer && (m = T(e.scrollContainer, {
+		collapseOnScroll: !0,
+		chromeRef: e.chromeRef
+	})), B(() => {
+		a?.abort(), a = null;
+	}), {
+		fuzzy: c,
+		autocompleteText: l,
+		scrollChrome: m,
+		armSearch: f,
+		disarmSearch: p,
+		acceptAutocomplete: u,
+		isSearchArmed: d
+	};
+}
+//#endregion
 //#region src/components/custom/dock/composables/useDockOrientationMorph.ts
-function St(e) {
-	let { rootEl: t } = e, n = U("vertical"), r = U(0), i = U(!1), o = a({
+function At(e) {
+	let { rootEl: t } = e, n = W("vertical"), r = W(0), i = W(!1), o = () => {
+		let e = t.value;
+		if (!e) return 1.08;
+		let n = getComputedStyle(e).getPropertyValue("--dock-morph-max-stretch").trim(), r = n ? Number.parseFloat(n) : NaN;
+		return Number.isFinite(r) && r >= 1 ? r : 1.08;
+	}, s = a({
 		from: e.verticalSize,
 		to: 0,
-		axis: "height"
-	}), s = a({
+		axis: "height",
+		maxStretch: o
+	}), c = a({
 		from: 0,
 		to: e.horizontalSize,
-		axis: "width"
-	}), c = null;
-	function l(e) {
-		r.value = e, o.drive(e), s.drive(e);
+		axis: "width",
+		maxStretch: o
+	}), l = null;
+	function u(e) {
+		r.value = e, s.drive(e), c.drive(e);
 		let n = t.value;
-		n && n.style.setProperty("--dock-morph-t", `${e}`);
-	}
-	function u() {
-		c &&= (c.dispose(), null);
+		n && (n.style.setProperty("--dock-morph-t", `${e}`), n.style.setProperty("--stretch", `${Math.max(s.stretch.value, c.stretch.value)}`));
 	}
 	function d() {
+		l &&= (l.dispose(), null);
+	}
+	function f() {
 		return typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 	}
-	function f(e) {
-		if (d()) {
-			h(e);
+	function p(e) {
+		if (f()) {
+			g(e);
 			return;
 		}
-		let n = t.value, a = c !== null && !c.settled ? c.velocity : 0;
-		if (!c || c.settled) {
-			u(), c = new pe({
+		let n = t.value, a = l !== null && !l.settled ? l.velocity : 0;
+		if (!l || l.settled) {
+			d(), l = new _e({
 				response: v.response,
 				dampingFraction: v.dampingFraction,
 				initial: r.value,
 				respectReducedMotion: !0
 			});
-			let o = c;
+			let o = l;
 			o.reset(r.value, a), o.target = e, i.value = !0, n && n.setAttribute("data-morphing", ""), o.play((e) => {
-				if (l(e), o.settled) {
+				if (u(e), o.settled) {
 					i.value = !1;
 					let e = t.value;
 					e && e.removeAttribute("data-morphing");
 				}
 			});
-		} else c.reset(r.value, a), c.target = e;
+		} else l.reset(r.value, a), l.target = e;
 	}
-	function p(e) {
-		e === n.value && !i.value || (n.value = e, f(+(e === "horizontal")));
+	function m(e) {
+		e === n.value && !i.value || (n.value = e, p(+(e === "horizontal")));
 	}
-	function m() {
-		p(n.value === "vertical" ? "horizontal" : "vertical");
+	function h() {
+		m(n.value === "vertical" ? "horizontal" : "vertical");
 	}
-	function h(e) {
+	function g(e) {
 		let r = e < 0 ? 0 : e > 1 ? 1 : e;
-		u(), i.value = !1, n.value = r >= .5 ? "horizontal" : "vertical", l(r), l(r);
+		d(), i.value = !1, n.value = r >= .5 ? "horizontal" : "vertical", u(r), u(r);
 		let a = t.value;
 		a && a.removeAttribute("data-morphing");
 	}
-	function g(e) {
+	function _(e) {
 		let t = Math.min(Math.max(e / .5, 0), 1);
 		return 1 - t * t * (3 - 2 * t);
 	}
-	function _(e) {
+	function y(e) {
 		let t = Math.min(Math.max((e - .5) / .5, 0), 1);
 		return t * t * (3 - 2 * t);
 	}
-	let y = T(() => o.sizeStyle.value), b = T(() => s.sizeStyle.value), x = T(() => ({ opacity: String(g(r.value)) })), S = T(() => ({ opacity: String(_(r.value)) })), C = T(() => Math.max(o.stretch.value, s.stretch.value));
-	return J(t, (e) => {
+	let b = O(() => s.sizeStyle.value), x = O(() => c.sizeStyle.value), S = O(() => ({ opacity: String(_(r.value)) })), C = O(() => ({ opacity: String(y(r.value)) })), w = O(() => Math.max(s.stretch.value, c.stretch.value));
+	return Y(t, (e) => {
 		e && e.style.setProperty("--dock-morph-t", `${r.value}`);
-	}, { immediate: !0 }), z(u), {
+	}, { immediate: !0 }), B(d), {
 		orientation: n,
 		t: r,
 		morphing: i,
-		verticalStyle: y,
-		horizontalStyle: b,
-		verticalOpacity: x,
-		horizontalOpacity: S,
-		stretch: C,
-		morphTo: p,
-		toggle: m,
-		pin: h
+		verticalStyle: b,
+		horizontalStyle: x,
+		verticalOpacity: S,
+		horizontalOpacity: C,
+		stretch: w,
+		morphTo: m,
+		toggle: h,
+		pin: g
 	};
 }
 //#endregion
-export { y as DOCK_CONTEXT_KEY, lt as DockBackgroundToggle, ft as DockDropdownTrigger, ct as DockIconButton, st as DockLayer, at as DockLayerGroup, vt as DockRail, xt as DockSection, dt as DockSelectTrigger, mt as DockSeparator, ut as DockTabButton, qe as GlassDock, h as provideDockContext, _ as useDockContext, St as useDockOrientationMorph, nt as useLayerTransition, m as useOptionalDockContext };
+export { y as DOCK_CONTEXT_KEY, vt as DockBackgroundToggle, xt as DockDropdownTrigger, _t as DockIconButton, gt as DockLayer, mt as DockLayerGroup, Ot as DockSection, bt as DockSelectTrigger, Ct as DockSeparator, Tt as DockStack, yt as DockTabButton, nt as GlassDock, h as provideDockContext, _ as useDockContext, C as useDockCtaReceive, At as useDockOrientationMorph, kt as useDockSearch, dt as useLayerTransition, m as useOptionalDockContext };