@mkbabb/glass-ui 4.2.0 → 5.0.0

package/dist/dock.js

@@ -1,189 +1,51 @@
-import { t as e } from "./cn-DJXf4yaB.js";
-import { a as t, d as n, o as r, x as i } from "./vendor-B2qOlYY3.js";
-import { n as a } from "./springPresets-DfoQ6XRY.js";
-import { t as o } from "./useLiquidFlex-Cc6PjVJD.js";
-import { t as s } from "./vSpecular-EX7loENl.js";
-import { n as c, r as l } from "./writeVelocityWeight-Bh83xZfs.js";
-import { t as u } from "./_plugin-vue_export-helper-gLzyemvl.js";
-import { t as d } from "./useResizeObserver-DdEn3v2f.js";
-import { t as f } from "./useTouchGate-B1Lf9XqN.js";
-import { n as p } from "./useResolveTokenColor-ChOnCckA.js";
-import { n as m, t as h } from "./createContext-Cd23P9j0.js";
-import { a as g, c as _, i as v, n as y, o as b, r as x, s as S, t as C } from "./dockContext-gFVS2gMg.js";
-import { t as w } from "./FadingScroll-P8B30rAD.js";
-import { t as T } from "./useMorphField-ogBM7ubT.js";
-import { t as E } from "./usePointerVelocityField-BrkqZFhj.js";
-import { t as D } from "./useIntersectionPause-DO8Vl4gs.js";
-import { t as O } from "./useDragMorph-DGLSewwB.js";
-import { t as k } from "./useDockCtaReceive-DX7RDb6_.js";
-import { r as ee, t as A } from "./useScrollChrome-JuImi1DM.js";
-import { t as te } from "./useFuzzySearch-0fTYOhS4.js";
-import { Fragment as j, computed as M, createBlock as N, createCommentVNode as P, createElementBlock as F, createElementVNode as I, createVNode as L, defineComponent as R, mergeModels as ne, mergeProps as z, nextTick as re, normalizeClass as B, normalizeStyle as V, onBeforeUnmount as ie, onMounted as ae, onScopeDispose as oe, onUnmounted as se, openBlock as H, readonly as U, ref as W, renderList as ce, renderSlot as G, resolveDynamicComponent as le, shallowRef as ue, toDisplayString as de, unref as K, useId as fe, useModel as pe, useSlots as me, useTemplateRef as he, watch as q, withCtx as J, withDirectives as ge } from "vue";
-import { DropdownMenuTrigger as _e, PopoverTrigger as ve, Primitive as ye, SelectIcon as be, SelectTrigger as xe, TabsIndicator as Se, TabsList as Ce, TabsRoot as Y, TabsTrigger as we, useForwardProps as Te, useForwardPropsEmits as Ee } from "reka-ui";
-import { SpringProgress as X } from "@mkbabb/keyframes.js";
-import { rawOklabToOklch as De, srgbToOKLab as Oe } from "@mkbabb/value.js";
-//#region src/components/custom/dock/composables/useDockFission.ts
-var ke = {
-	beside: {
-		dx: 1,
-		dy: 0
-	},
-	above: {
-		dx: 0,
-		dy: -1
-	},
-	below: {
-		dx: 0,
-		dy: 1
-	}
-}, Ae = {
-	search: {
-		context: "search",
-		vector: "radial",
-		neckHold: T.radialBurst.neckHold,
-		staggerRank: (e, t) => {
-			let n = (t - 1) / 2;
-			return Math.round(Math.abs(e - n));
-		},
-		squishPeak: "late"
-	},
-	media: {
-		context: "media",
-		vector: "lateral",
-		neckHold: T.lateralPeel.neckHold,
-		staggerRank: (e, t) => {
-			let n = (t - 1) / 2;
-			return Math.round(n - Math.abs(e - n));
-		},
-		squishPeak: "long"
-	},
-	nav: {
-		context: "nav",
-		vector: "inward-merge",
-		neckHold: T.inwardMerge.neckHold,
-		staggerRank: (e, t) => {
-			let n = (t - 1) / 2;
-			return Math.round(n - Math.abs(e - n));
-		},
-		squishPeak: "coalesce"
-	}
-}, Z = .02;
-function je(e) {
-	let { rootEl: t, signature: n, placement: r, maxStretch: i, seamTensionCap: a = .12, seamTensionGain: s = .6, staggerStep: c = .08 } = e, l = e.respectReducedMotion !== !1;
-	function u() {
-		return ke[r?.value ?? "beside"];
-	}
-	let d = W(0), f = W(!1), p = 0, m = null, h = E({ respectReducedMotion: l }), g = /* @__PURE__ */ new Set(), _ = 0;
-	function v() {
-		return t.value;
-	}
-	function y() {
-		return l && typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-	}
-	function b() {
-		m &&= (m.dispose(), null);
-	}
-	function x(e) {
-		let t = n.value, r = g.size, i = Math.min(a, Math.max(0, h.speed.value * s)), o = v();
-		if (o) {
-			o.style.setProperty("--seam-tension", String(i));
-			let t = u();
-			o.style.setProperty("--island-t", String(e)), o.style.setProperty("--island-dx", String(t.dx)), o.style.setProperty("--island-dy", String(t.dy));
-		}
-		for (let n of g) {
-			let a = n.el.value;
-			if (!a) continue;
-			let o = t.staggerRank(n.rank, r) * c, s = Math.max(1e-4, 1 - o), l = Math.min(1, Math.max(0, (e - o) / s));
-			n.flex.drive(l);
-			let u = n.vectorOf();
-			a.style.setProperty("--split-dx", String(u.dx)), a.style.setProperty("--split-dy", String(u.dy)), a.style.setProperty("--i", String(n.rank)), a.style.setProperty("--neck-t", String(l));
-			let d = (l * 360 + i * 60) % 360;
-			a.style.setProperty("--neck-specular-angle", `${d.toFixed(1)}deg`), a.style.setProperty("--stretch", String(n.flex.stretch.value));
-		}
-	}
-	function C() {
-		d.value = p;
-		let e = v(), t = u();
-		e && (e.style.setProperty("--dock-split-t", String(p)), e.style.setProperty("--island-t", String(p)), e.style.setProperty("--island-dx", String(t.dx)), e.style.setProperty("--island-dy", String(t.dy)), e.style.setProperty("--seam-tension", "0"), p < Z ? (e.removeAttribute("data-fissioning"), e.removeAttribute("data-fissioned")) : (e.setAttribute("data-fissioning", ""), e.setAttribute("data-fissioned", "")), e.removeAttribute("data-merging")), h.tick(0);
-		for (let e of g) {
-			let t = e.el.value;
-			if (!t) continue;
-			let n = e.vectorOf();
-			e.flex.drive(p), t.style.setProperty("--split-dx", String(n.dx)), t.style.setProperty("--split-dy", String(n.dy)), t.style.setProperty("--i", String(e.rank)), t.style.setProperty("--neck-t", String(p)), t.style.setProperty("--neck-specular-angle", `${(p * 360).toFixed(1)}deg`), t.style.setProperty("--stretch", "1");
-		}
-		f.value = p >= Z;
-	}
-	function w() {
-		let e = v();
-		if (!e) return;
-		if (y()) {
-			b(), C();
-			return;
-		}
-		let t = m !== null && !m.settled ? m.velocity : 0;
-		b(), m = new X({
-			response: S.response,
-			dampingFraction: S.dampingFraction,
-			initial: d.value,
-			respectReducedMotion: !0
-		});
-		let n = m;
-		n.reset(d.value, t), n.target = p, e.setAttribute("data-fissioning", ""), p >= Z && e.setAttribute("data-fissioned", ""), p < Z ? e.setAttribute("data-merging", "") : e.removeAttribute("data-merging"), _ = 0, n.play((e) => {
-			let t = v();
-			if (!t) return;
-			d.value = e, t.style.setProperty("--dock-split-t", String(e));
-			let r = typeof performance < "u" ? performance.now() : Date.now(), i = _ === 0 ? 16 : r - _;
-			_ = r, h.tick(i), x(e), n.settled && (f.value = p >= Z, p < Z && (t.removeAttribute("data-fissioning"), t.removeAttribute("data-fissioned"), t.style.removeProperty("--seam-tension")), t.removeAttribute("data-merging"), b());
-		});
-	}
-	function T() {
-		p = 1, w();
-	}
-	function D() {
-		p = 0, w();
-	}
-	function O() {
-		p >= Z ? D() : T();
-	}
-	function k(e) {
-		h.onPointerMove(e);
-	}
-	function ee(e) {
-		let t = typeof e.vector == "function" ? e.vector : () => e.vector, n = o({
-			from: 0,
-			to: 0,
-			axis: "width",
-			squishLaw: "tanh",
-			maxStretch: i ?? 1.08
-		}), r = {
-			el: e.el,
-			vectorOf: t,
-			rank: e.rank,
-			flex: n,
-			stop: () => {}
-		};
-		return g.add(r), { release: () => {
-			g.delete(r);
-		} };
-	}
-	function A() {
-		b(), h.dispose();
-	}
-	return oe(A), {
-		t: d,
-		fissioned: f,
-		registerPiece: ee,
-		split: T,
-		merge: D,
-		toggle: O,
-		onPointerMove: k,
-		dispose: A
-	};
+import { t as e } from "./class-names-5jotTFzp.js";
+import { t } from "./motionTempo-CMS5b0Vu.js";
+import { n } from "./springPresets-h5VKJQqG.js";
+import { t as r } from "./vSpecular-DlYN0UZy.js";
+import { t as i } from "./useLiquidPress-BXNHydZh.js";
+import { t as a } from "./useMotionAxis-DCCXMC-i.js";
+import { t as o } from "./_plugin-vue_export-helper-C1je1s0u.js";
+import { t as s } from "./useResizeObserver-DDuoBeBo.js";
+import { t as c } from "./useTouchGate-BlegwvwL.js";
+import { n as l } from "./useResolveTokenColor-DVT5kwv6.js";
+import { n as u, t as d } from "./createContext-BQ1Gy_LB.js";
+import { a as f, i as p, n as m, o as h, r as g, s as _, t as v } from "./dockContext-d-WpJN2Z.js";
+import { t as y } from "./FadingScroll-BSRLqQCx.js";
+import { t as b } from "./useDragMorph-65ihHePq.js";
+import { t as x } from "./useDockCtaReceive-BgMmeINo.js";
+import { t as S } from "./useRAFLoop-CvOo_kgb.js";
+import { t as C } from "./useIntersectionPause-Cmt5Tnv9.js";
+import { n as w, t as T } from "./useSelectionGroup-Btpf24aY.js";
+import { t as E } from "./useFuzzySearch-KslRxiJY.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 G, renderSlot as K, resolveDynamicComponent as q, toDisplayString as ne, toValue as re, unref as J, useId as ie, useModel as ae, useTemplateRef as Y, watch as X, withCtx as Z, withDirectives as Q, withKeys as oe } from "vue";
+import { DropdownMenuTrigger as se, PopoverTrigger as ce, Primitive as le, SelectIcon as ue, SelectTrigger as de } from "reka-ui";
+import { ChevronDown as fe, Layers as pe, Pause as me, Play as he } from "@lucide/vue";
+import { SpringProgress as ge } from "@mkbabb/keyframes.js";
+import { rawOklabToOklch as _e, srgbToOKLab as ve } from "@mkbabb/value.js";
+//#region src/composables/glass/backdropSampleMath.ts
+function ye(e) {
+	let t = e / 255;
+	return t <= .03928 ? t / 12.92 : ((t + .055) / 1.055) ** 2.4;
+}
+function be(e, t, n) {
+	return .2126 * ye(e) + .7152 * ye(t) + .0722 * ye(n);
+}
+function xe(e) {
+	let t = e.match(/rgba?\(\s*([\d.]+)[,\s]+([\d.]+)[,\s]+([\d.]+)(?:[,\s/]+([\d.]+))?/i);
+	return t ? [
+		Number(t[1]),
+		Number(t[2]),
+		Number(t[3]),
+		t[4] === void 0 ? 1 : Number(t[4])
+	] : null;
+}
+function Se(e) {
+	return typeof HTMLCanvasElement < "u" && e instanceof HTMLCanvasElement;
 }
 //#endregion
-//#region src/composables/glass/useGlassBackdropLuminance.ts
-var Me = "(prefers-reduced-motion: reduce)", Q = 32, $ = 12, Ne = .72, Pe = .06, Fe = .004;
-function Ie() {
+//#region src/composables/glass/ambientHueHistogram.ts
+var $ = 12, Ce = .72, we = .06, Te = .004;
+function Ee() {
 	return {
 		weight: new Float64Array($),
 		sumCos: new Float64Array($),
@@ -192,222 +54,232 @@ function Ie() {
 		n: 0
 	};
 }
-function Le(e, t, n, r, i) {
+function De(e, t, n, r, i) {
 	e.n++;
-	let [a, o, s] = Oe(t, n, r), [, c, l] = De(a, o, s);
+	let [a, o, s] = ve(t, n, r), [, c, l] = _e(a, o, s);
 	if (!Number.isFinite(c) || !Number.isFinite(l) || c <= 0) return;
 	let u = c * i;
 	if (u <= 0) return;
 	let d = l * Math.PI / 180, f = Math.floor(l / 360 * $) % $;
 	f < 0 && (f += $), e.weight[f] += u, e.sumCos[f] += u * Math.cos(d), e.sumSin[f] += u * Math.sin(d), e.totalMass += u;
 }
-function Re(e) {
-	if (e.n === 0 || e.totalMass / e.n < Fe) return "transparent";
+function Oe(e) {
+	if (e.n === 0 || e.totalMass / e.n < Te) return "transparent";
 	let t = 0;
 	for (let n = 1; n < $; n++) e.weight[n] > e.weight[t] && (t = n);
 	if (e.weight[t] <= 0) return "transparent";
 	let n = Math.atan2(e.sumSin[t], e.sumCos[t]) * 180 / Math.PI;
-	return n < 0 && (n += 360), `oklch(${Ne} ${Pe} ${n.toFixed(1)})`;
-}
-function ze(e) {
-	return typeof HTMLCanvasElement < "u" && e instanceof HTMLCanvasElement;
-}
-function Be(e) {
-	let t = e / 255;
-	return t <= .03928 ? t / 12.92 : ((t + .055) / 1.055) ** 2.4;
-}
-function Ve(e, t, n) {
-	return .2126 * Be(e) + .7152 * Be(t) + .0722 * Be(n);
-}
-function He(e) {
-	let t = e.match(/rgba?\(\s*([\d.]+)[,\s]+([\d.]+)[,\s]+([\d.]+)(?:[,\s/]+([\d.]+))?/i);
-	return t ? [
-		Number(t[1]),
-		Number(t[2]),
-		Number(t[3]),
-		t[4] === void 0 ? 1 : Number(t[4])
-	] : null;
+	return n < 0 && (n += 360), `oklch(${Ce} ${we} ${n.toFixed(1)})`;
 }
-function Ue(e) {
-	if (!e) return null;
-	if (ze(e)) return e;
+var ke = "[data-glass-field-canvas] canvas, canvas[data-glass-field-canvas]";
+function Ae(e) {
+	if (!e) {
+		if (typeof document < "u") {
+			let e = document.querySelector(ke);
+			if (Se(e)) return e;
+		}
+		return null;
+	}
+	if (Se(e)) return e;
 	if (typeof e == "function") {
 		let t = e();
-		return ze(t) ? t : null;
+		return Se(t) ? t : null;
 	}
 	if (typeof e == "string" && typeof document < "u") {
 		let t = document.querySelector(e);
-		return ze(t) ? t : null;
+		return Se(t) ? t : null;
 	}
 	return null;
 }
-function We(e, t = {}) {
-	let { lightThreshold: n = .6, minSampleIntervalMs: r = 250, writeBucket: i = !0 } = t, a = Math.max(250, r), o = W(null), s = W(null);
+function je(e, t) {
+	let n = xe(e);
+	if (n) return n;
+	if (!t) return null;
+	try {
+		t.clearRect(0, 0, 1, 1), t.fillStyle = "rgba(0,0,0,0)", t.fillStyle = e, t.fillRect(0, 0, 1, 1);
+		let n = t.getImageData(0, 0, 1, 1).data;
+		return [
+			n[0],
+			n[1],
+			n[2],
+			n[3] / 255
+		];
+	} catch {
+		return null;
+	}
+}
+function Me(e, t, n) {
+	if (!t || t.width === 0 || t.height === 0 || !n) return null;
+	let r = e.getBoundingClientRect(), i = t.getBoundingClientRect();
+	if (i.width === 0 || i.height === 0) return null;
+	let a = t.width / i.width, o = t.height / i.height, s = Math.max(0, (r.left - i.left) * a), c = Math.max(0, (r.top - i.top) * o), l = Math.min(t.width - s, Math.max(1, r.width * a)), u = Math.min(t.height - c, Math.max(1, r.height * o));
+	if (l <= 0 || u <= 0) return null;
+	try {
+		n.clearRect(0, 0, 32, 32), n.drawImage(t, s, c, l, u, 0, 0, 32, 32);
+		let e = n.getImageData(0, 0, 32, 32).data, r = 0, i = 0, a = 0, o = Ee();
+		for (let t = 0; t < e.length; t += 4) {
+			let n = e[t + 3] / 255, s = e[t] * n + 255 * (1 - n), c = e[t + 1] * n + 255 * (1 - n), l = e[t + 2] * n + 255 * (1 - n);
+			r += be(s, c, l), i += n, De(o, s, c, l, n), a++;
+		}
+		return a === 0 || i / a < .02 ? null : {
+			luma: r / a,
+			ambientHue: Oe(o)
+		};
+	} catch {
+		return null;
+	}
+}
+function Ne(e, t) {
+	let n = e.getBoundingClientRect(), r = n.left + n.width / 2, i = n.top + n.height / 2, a = document.elementsFromPoint(r, i);
+	for (let n of a) {
+		if (!(n instanceof HTMLElement) || n === e || e.contains(n)) continue;
+		let r = getComputedStyle(n).backgroundColor, i = je(l(r, e), t);
+		if (i && !(i[3] < .5)) return Pe(i);
+	}
+	let o = je(l(getComputedStyle(document.body).backgroundColor, e), t);
+	return o ? Pe(o) : null;
+}
+function Pe(e) {
+	let t = Ee();
+	return De(t, e[0], e[1], e[2], e[3]), {
+		luma: be(e[0], e[1], e[2]),
+		ambientHue: Oe(t)
+	};
+}
+//#endregion
+//#region src/composables/glass/useGlassBackdropLuminance.ts
+var Fe = "(prefers-reduced-motion: reduce)", Ie = "data-glass-backdrop-shared", Le = "8%";
+function Re(e, t = {}) {
+	let { lightThreshold: n = .6, minSampleIntervalMs: r = 250, writeBucket: i = !0 } = t, a = Math.max(250, r), o = t.shared === !0;
+	function c(e) {
+		return o ? !1 : e.closest(`[${Ie}]`) !== null;
+	}
+	let l = W(null), u = W(null);
 	if (typeof window > "u") return {
-		luma: U(o),
-		bucket: U(s),
+		luma: U(l),
+		bucket: U(u),
 		sampleNow: () => {},
 		dispose: () => {}
 	};
-	let c = window.matchMedia(Me), l = c.matches, u = null, f = null;
-	function m() {
-		return u || (u = document.createElement("canvas"), u.width = Q, u.height = Q), f ||= u.getContext("2d", { willReadFrequently: !0 }), f;
-	}
+	let d = window.matchMedia(Fe), f = d.matches, p = null, m = null;
 	function h() {
-		return t.live === void 0 ? e.value?.dataset.glassSample === "live" : t.live;
-	}
-	function g(e) {
-		let n = Ue(t.backgroundCanvas);
-		if (!n || n.width === 0 || n.height === 0) return null;
-		let r = m();
-		if (!r) return null;
-		let i = e.getBoundingClientRect(), a = n.getBoundingClientRect();
-		if (a.width === 0 || a.height === 0) return null;
-		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, 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, a = Ie();
-			for (let n = 0; n < e.length; n += 4) {
-				let r = e[n + 3] / 255, o = e[n] * r + 255 * (1 - r), s = e[n + 1] * r + 255 * (1 - r), c = e[n + 2] * r + 255 * (1 - r);
-				t += Ve(o, s, c), Le(a, o, s, c, r), i++;
-			}
-			return i > 0 ? {
-				luma: t / i,
-				ambientHue: Re(a)
-			} : null;
-		} catch {
-			return null;
-		}
+		return p || (p = document.createElement("canvas"), p.width = 32, p.height = 32), m ||= p.getContext("2d", { willReadFrequently: !0 }), m;
 	}
-	function _(e) {
-		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 = He(p(n, e));
-			if (r && !(r[3] < .5)) return v(r);
-		}
-		let a = He(p(getComputedStyle(document.body).backgroundColor, e));
-		return a ? v(a) : null;
-	}
-	function v(e) {
-		let t = Ie();
-		return Le(t, e[0], e[1], e[2], e[3]), {
-			luma: Ve(e[0], e[1], e[2]),
-			ambientHue: Re(t)
-		};
+	function g() {
+		return t.live === void 0 ? e.value?.dataset.glassSample === "live" ? !0 : Ae(t.backgroundCanvas) !== null : t.live;
+	}
+	function _() {
+		return t.live === void 0 ? e.value?.dataset.glassSample === "live" || t.backgroundCanvas != null ? !0 : Ae(void 0) !== null : t.live;
 	}
-	function y(t) {
+	function v(t) {
 		let r = t.luma;
-		o.value = r;
+		l.value = r;
 		let a = e.value;
-		if (a && (a.style.setProperty("--glass-backdrop-luma", r.toFixed(3)), a.style.setProperty("--glass-ambient-hue", t.ambientHue), i)) {
+		if (a && (a.style.setProperty("--glass-backdrop-luma", r.toFixed(3)), a.style.setProperty("--glass-ambient-hue", t.ambientHue), a.style.setProperty("--glass-ambient-strength", t.ambientHue === "transparent" ? "0%" : Le), a.setAttribute("data-backdrop-sampled", ""), a.style.setProperty("--glass-backdrop-sampled", "1"), i)) {
 			let e = r >= n ? "light" : "dark";
-			s.value = e, a.style.setProperty("--glass-backdrop", e);
+			u.value = e, a.style.setProperty("--glass-backdrop", e);
 		}
 	}
-	let b = 0;
-	function x() {
-		let t = e.value;
-		if (!t) return;
-		let n = h() ? g(t) ?? _(t) : _(t);
-		n !== null && y(n), b = typeof performance < "u" ? performance.now() : Date.now();
+	let y = 0;
+	function b() {
+		let n = e.value;
+		if (!n || c(n)) return;
+		let r = h(), i = g() ? Me(n, Ae(t.backgroundCanvas), r) ?? Ne(n, r) : Ne(n, r);
+		i !== null && v(i), y = typeof performance < "u" ? performance.now() : Date.now();
 	}
-	let S = ee(({ now: e }) => {
-		l || e - b < a || x();
+	let x = S(({ now: e }) => {
+		f || e - y < a || b();
 	}, {
 		immediate: !1,
 		pauseWhenHidden: !0,
 		respectReducedMotion: !0
-	}), C = D(() => e.value, {
-		pause: () => S.pause(),
+	}), w = C(() => e.value, {
+		pause: () => x.pause(),
 		resume: () => {
-			h() && !l && S.resume();
+			let t = e.value;
+			t && c(t) || _() && !f && x.resume();
 		}
-	}, { rootMargin: "200px" }), w = d(e, () => x());
-	function T() {
-		l = c.matches, l ? (S.stop(), x()) : h() && S.start();
+	}, { rootMargin: "200px" }), T = s(e, () => b());
+	function E() {
+		f = d.matches;
+		let t = e.value;
+		if (t && c(t)) {
+			x.stop();
+			return;
+		}
+		f ? (x.stop(), b()) : _() && x.start();
 	}
-	let E = () => T();
-	typeof c.addEventListener == "function" && c.addEventListener("change", E);
-	let O = q(() => e.value, (e) => {
-		e && (x(), T());
+	let D = () => E();
+	typeof d.addEventListener == "function" && d.addEventListener("change", D);
+	let O = X(() => e.value, (e) => {
+		if (e) {
+			if (o) e.setAttribute(Ie, "");
+			else if (c(e)) return;
+			b(), E();
+		}
 	}, {
 		immediate: !0,
 		flush: "post"
 	});
 	function k() {
-		O(), S.dispose(), C.dispose(), w.stop(), typeof c.removeEventListener == "function" && c.removeEventListener("change", E), u = null, f = null;
+		O(), x.dispose(), w.dispose(), T.stop(), typeof d.removeEventListener == "function" && d.removeEventListener("change", D), p = null, m = null;
 	}
-	return oe(k), {
-		luma: U(o),
-		bucket: U(s),
-		sampleNow: x,
+	return B(k), {
+		luma: U(l),
+		bucket: U(u),
+		sampleNow: b,
 		dispose: k
 	};
 }
 //#endregion
-//#region src/components/custom/dock/composables/isTeleportedTarget.ts
-function Ge(e, t) {
+//#region src/components/dock/composables/isTeleportedTarget.ts
+function ze(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 Ke(e) {
-	let { collapseDelay: t = 3600, 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 = M(() => p.value > 0), h = null, g = null, _ = !1, v = null;
+//#region src/components/dock/composables/useDockState.ts
+function Be(e) {
+	let { collapseDelay: t = 3600, 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);
 	}
-	function b(e) {
-		if (!e) return !1;
-		let t = n.value;
-		if (!t || typeof t.getBoundingClientRect != "function" || !t.hasAttribute("data-morphing")) return !1;
-		let r = t.getBoundingClientRect();
-		return e.clientX >= r.left && e.clientX <= r.right && e.clientY >= r.top && e.clientY <= r.bottom ? e.clientX - r.left <= 24 || r.right - e.clientX <= 24 || e.clientY - r.top <= 24 || r.bottom - e.clientY <= 24 : !1;
+	let b = l.value;
+	function x() {
+		s() && (l.value = "pinned"), u.value = l.value !== "collapsed", d.value = l.value === "pinned", o && b !== l.value && o(l.value, b), b = l.value;
 	}
-	let x = l.value;
 	function S() {
-		s() && (l.value = "pinned"), u.value = l.value !== "collapsed", d.value = l.value === "pinned", o && x !== l.value && o(l.value, x), x = l.value;
+		f &&= (clearTimeout(f), null);
 	}
 	function C() {
-		f &&= (clearTimeout(f), null);
+		g !== null && (cancelAnimationFrame(g), g = null);
 	}
 	function w() {
-		g !== null && (cancelAnimationFrame(g), g = null);
+		C(), h?.();
 	}
 	function T() {
-		w(), h?.();
-	}
-	function E() {
-		s() || p.value > 0 || (C(), f = setTimeout(() => {
-			D(), l.value = "collapsed", S();
+		s() || p.value > 0 || (S(), f = setTimeout(() => {
+			l.value = "collapsed", x();
 		}, t));
 	}
-	function D() {
-		typeof document > "u" || typeof PointerEvent > "u" || document.body.dispatchEvent(new PointerEvent("pointerdown", {
-			bubbles: !0,
-			composed: !0
-		}));
-	}
-	function O() {
+	function E() {
 		if (s()) {
-			l.value = "pinned", S();
+			l.value = "pinned", x();
 			return;
 		}
-		_ ||= (_ = !0, C(), y(), D(), l.value = "collapsed", S(), !1);
+		_ ||= (_ = !0, S(), y(), l.value = "collapsed", x(), !1);
 	}
-	function k() {
+	function D() {
 		if (s()) {
-			l.value = "pinned", S();
+			l.value = "pinned", x();
 			return;
 		}
-		C(), y(), l.value = "hover", S();
+		S(), y(), l.value = "hover", x();
 	}
-	function ee() {
-		s() || (C(), l.value === "collapsed" && (y(), v = setTimeout(() => {
-			v = null, !s() && l.value === "collapsed" && (l.value = "hover", S());
+	function k() {
+		s() || (S(), l.value === "collapsed" && (y(), v = setTimeout(() => {
+			v = null, !s() && l.value === "collapsed" && (l.value = "hover", x());
 		}, 60)));
 	}
 	function A(e) {
@@ -415,153 +287,145 @@ function Ke(e) {
 			if (p.value > 0) return;
 			if (e) {
 				let t = n.value;
-				if (t && e.relatedTarget instanceof Node && t.contains(e.relatedTarget) || Ge(e.relatedTarget, a) || b(e)) return;
+				if (t && e.relatedTarget instanceof Node && t.contains(e.relatedTarget) || ze(e.relatedTarget, a)) return;
 			}
-			E();
+			T();
 		}
 	}
-	function te() {
-		s() || (C(), l.value === "collapsed" && (l.value = "hover", S()));
+	function j() {
+		s() || (S(), l.value === "collapsed" && (l.value = "hover", x()));
 	}
-	function j(e) {
+	function M(e) {
 		if (s() || l.value !== "hover" || p.value > 0) return;
 		let t = e.currentTarget;
-		e.relatedTarget && t.contains(e.relatedTarget) || Ge(e.relatedTarget, a) || E();
+		e.relatedTarget && t.contains(e.relatedTarget) || ze(e.relatedTarget, a) || T();
 	}
 	function N() {
 		if (s()) {
-			l.value = "pinned", S();
+			l.value = "pinned", x();
 			return;
 		}
-		C(), y(), l.value = "pinned", S();
+		S(), y(), l.value = "pinned", x();
 	}
 	function P() {
-		p.value++, C();
+		p.value++, S();
 	}
 	function F() {
-		p.value = Math.max(0, p.value - 1), p.value === 0 && l.value === "hover" && (C(), f = setTimeout(() => {
-			p.value === 0 && l.value === "hover" && E();
+		p.value = Math.max(0, p.value - 1), p.value === 0 && l.value === "hover" && (S(), f = setTimeout(() => {
+			p.value === 0 && l.value === "hover" && T();
 		}, Math.min(t, 800)));
 	}
 	function I(e) {
 		if (s() || i?.value) return;
 		let t = n.value;
-		!t || t.contains(e.target) || Ge(e.target, a) || O();
+		!t || t.contains(e.target) || ze(e.target, a) || E();
 	}
-	return q(u, (e) => {
-		e ? (T(), g = requestAnimationFrame(() => {
+	return X(u, (e) => {
+		e ? (w(), g = requestAnimationFrame(() => {
 			g = null, u.value && (document.addEventListener("pointerdown", I, !0), h = () => {
 				document.removeEventListener("pointerdown", I, !0), h = null;
 			});
-		})) : T();
-	}), typeof r == "boolean" ? r && (l.value = "pinned", S()) : q(r, (e) => {
+		})) : w();
+	}), typeof r == "boolean" ? r && (l.value = "pinned", x()) : X(r, (e) => {
 		if (e) {
-			C(), l.value = "pinned", S();
+			S(), l.value = "pinned", x();
 			return;
 		}
-		l.value = "collapsed", S();
-	}, { immediate: !0 }), se(() => {
-		C(), y(), T();
+		l.value = "collapsed", x();
+	}, { immediate: !0 }), V(() => {
+		S(), y(), w();
 	}), {
 		state: l,
 		expanded: u,
 		isPinned: d,
 		isHeld: m,
-		onMouseEnter: ee,
+		onMouseEnter: k,
 		onMouseLeave: A,
-		onFocusIn: te,
-		onFocusOut: j,
+		onFocusIn: j,
+		onFocusOut: M,
 		onClickCollapsed: N,
 		keepOpen: P,
 		release: F,
-		expand: k,
-		collapse: O
+		expand: D,
+		collapse: E
 	};
 }
 //#endregion
-//#region src/components/custom/dock/composables/dockMorphMeasure.ts
-function qe(e) {
-	return e === "vertical" ? "height" : "width";
-}
-function Je(e, t) {
-	return e.getBoundingClientRect()[qe(t)];
-}
-function Ye(e) {
-	if (!e || typeof getComputedStyle != "function") return 44;
-	let t = getComputedStyle(e).getPropertyValue("--dock-morph-min").trim(), n = Number.parseFloat(t);
-	return Number.isFinite(n) && n > 0 ? n : 44;
-}
-function Xe(e) {
-	let { rootEl: t, contentEl: n, axis: r, expanded: i } = e, a = null, o = 0, s = 0;
-	function c(e) {
-		return e.hasAttribute("data-morphing");
+//#region src/components/dock/composables/useDockSpring.ts
+function Ve(e) {
+	let n = null, r = () => n !== null && !n.settled;
+	function i() {
+		n &&= (n.dispose(), null);
+	}
+	function a(a, o, s) {
+		let c = r() ? n.velocity : 0;
+		i();
+		let l = new ge({
+			response: e.response * t(),
+			dampingFraction: e.dampingFraction,
+			initial: a,
+			respectReducedMotion: !0
+		});
+		n = l, l.reset(a, c), l.target = o, l.play((e, t) => {
+			s.onFrame(e, t), l.settled && (s.onSettle?.(), n === l && i());
+		});
 	}
-	function l() {
-		let e = t.value, a = n.value;
-		if (!e || !a) return;
-		let l = r.value, u = Ye(e);
-		if (s <= 0 && (s = u), !c(e)) {
-			let t = Je(e, l);
-			t > 0 && (i.value ? o = t : s = t);
-		}
-		let d = o > 0 ? o : Math.max(Je(a, l), s), f = Math.max(d, s);
-		e.style.setProperty("--dock-collapsed-px", `${s}px`), e.style.setProperty("--dock-expanded-px", `${f}px`);
+	function o(e) {
+		r() && (n.target = e);
 	}
-	function u(e) {
-		a &&= (a.disconnect(), null), !(!e || typeof ResizeObserver > "u") && (a = new ResizeObserver(() => l()), n.value && a.observe(n.value), a.observe(e), l());
-	}
-	q(t, (e) => u(e), { immediate: !0 }), q(n, () => u(t.value)), q(i, () => l());
-	let d = typeof document < "u" ? document.fonts : void 0;
-	d && d.ready.then(() => l()), oe(() => {
-		a && a.disconnect(), a = null;
-	});
+	return {
+		playTo: a,
+		retarget: o,
+		get live() {
+			return r();
+		},
+		get velocity() {
+			return r() ? n.velocity : 0;
+		},
+		dispose: i
+	};
 }
 //#endregion
-//#region src/components/custom/dock/composables/dockMorphContext.ts
-var Ze = h(b), { KEY: Qe } = Ze;
-function $e(e) {
-	Ze.provide(e);
+//#region src/components/dock/composables/dockMorphContext.ts
+var He = d(h), { KEY: Ue } = He;
+function We(e) {
+	He.provide(e);
 }
-var et = Ze.use;
-function tt(e) {
-	let { rootEl: t, outerEl: n, outerActiveLayer: r, outerAxis: i } = e, a = null, o = /* @__PURE__ */ new Set();
+He.use;
+function Ge(e) {
+	let { rootEl: t, outerEl: n, outerActiveLayer: r, outerAxis: i } = e, a = Ve({
+		response: _.response,
+		dampingFraction: _.dampingFraction
+	}), o = /* @__PURE__ */ new Set();
 	function s() {
 		return t.value;
 	}
 	function c() {
-		a &&= (a.dispose(), null);
-	}
-	function l() {
 		let e = s();
 		return !!e && e.hasAttribute("data-morphing");
 	}
-	function u(e) {
+	function l(e) {
 		e.leavingLayer.value = null;
 	}
-	function d() {
-		let e = s();
-		e && (e.style.removeProperty("--dock-morph-t"), e.removeAttribute("data-morphing"), e.removeAttribute("data-punching")), c();
+	function u() {
+		let t = s();
+		t && (t.removeAttribute("data-morphing"), t.removeAttribute("data-pane-swap"), t.style.removeProperty("--dock-morph-t")), e.onMorphActiveChange?.(!1), a.dispose();
 	}
-	function f() {
-		let e = s();
-		if (!e) return;
-		let t = a !== null && !a.settled ? a.velocity : 0;
-		c(), a = new X({
-			response: S.response,
-			dampingFraction: S.dampingFraction,
-			initial: 0,
-			respectReducedMotion: !0
-		});
-		let n = a;
-		n.reset(0, t), n.target = 1, e.setAttribute("data-morphing", ""), e.setAttribute("data-punching", ""), e.style.setProperty("--dock-morph-t", "0"), n.play((e) => {
-			let t = s();
-			if (t && (t.style.setProperty("--dock-morph-t", `${e}`), e > .5 && t.hasAttribute("data-punching") && t.removeAttribute("data-punching")), n.settled) {
-				let e = s();
-				e && e.removeAttribute("data-punching");
-				for (let e of o) u(e);
+	function d() {
+		for (let e of o) l(e);
+		u();
+	}
+	function f(t = !1) {
+		let n = s();
+		n && (e.onMorphActiveChange?.(!0), n.setAttribute("data-morphing", ""), t ? n.setAttribute("data-pane-swap", "") : n.removeAttribute("data-pane-swap"), n.style.setProperty("--dock-morph-t", "0"), a.playTo(0, 1, {
+			onFrame: (e) => {
+				let t = s();
+				t && t.style.setProperty("--dock-morph-t", `${e}`);
+			},
+			onSettle: () => {
 				d();
 			}
-		});
+		}));
 	}
 	function p(e, t, n) {
 		if (t !== n) {
@@ -569,111 +433,109 @@ function tt(e) {
 				e.currentLayer.value = t, e.leavingLayer.value = null;
 				return;
 			}
-			e.leavingLayer.value = n, e.currentLayer.value = t, f();
+			e.leavingLayer.value = n, e.currentLayer.value = t, f(!e.isOuter);
 		}
 	}
-	function m(e) {
-		let t = {
+	function m(e, t = !1) {
+		let n = {
 			containerEl: e.containerEl,
 			axis: e.axis,
 			activeLayer: e.activeLayer,
 			currentLayer: W(e.activeLayer.value),
 			leavingLayer: W(null),
+			isOuter: t,
 			stop: () => {}
 		};
-		return t.stop = q(e.activeLayer, (e, n) => {
-			p(t, e, n);
-		}), o.add(t), t;
+		return n.stop = X(e.activeLayer, (e, t) => {
+			p(n, e, t);
+		}), o.add(n), n;
 	}
 	function h(e) {
-		e.stop(), o.delete(e), l() || c();
+		e.stop(), o.delete(e), c() || a.dispose();
 	}
 	let g = m({
 		containerEl: n,
 		activeLayer: r,
 		axis: i
-	}), _ = { registerGroup(e) {
-		let t = m(e);
-		return {
-			currentLayer: U(t.currentLayer),
-			leavingLayer: U(t.leavingLayer),
-			release: () => h(t)
-		};
-	} };
-	function v(e) {
-		let t = n.value;
-		!t || e.target !== t || e.propertyName !== "width" && e.propertyName !== "height" && e.propertyName !== qe(i.value) || a && a.settled && (u(g), d());
-	}
-	return se(() => {
+	}, !0);
+	return V(() => {
 		for (let e of o) e.stop();
-		o.clear(), c();
+		o.clear(), a.dispose();
 	}), {
-		context: _,
-		outerCurrentLayer: U(g.currentLayer),
-		onOuterTransitionEnd: v
+		context: { registerGroup(e) {
+			let t = m(e);
+			return {
+				currentLayer: U(t.currentLayer),
+				leavingLayer: U(t.leavingLayer),
+				release: () => h(t)
+			};
+		} },
+		outerCurrentLayer: U(g.currentLayer)
 	};
 }
 //#endregion
-//#region src/components/custom/dock/composables/useDockShellProps.ts
-function nt(e) {
-	let t = M(() => {
+//#region src/components/dock/composables/dockMorphMeasure.ts
+function Ke(e) {
+	return e === "vertical" ? "height" : "width";
+}
+function qe(e, t) {
+	return e.getBoundingClientRect()[Ke(t)];
+}
+function Je(e) {
+	if (!e || typeof getComputedStyle != "function") return 44;
+	let t = getComputedStyle(e).getPropertyValue("--dock-morph-min").trim(), n = Number.parseFloat(t);
+	return Number.isFinite(n) && n > 0 ? n : 44;
+}
+function Ye(e) {
+	let { rootEl: t, contentEl: n, axis: r, expanded: i } = e, a = null, o = 0, s = 0;
+	function c(e) {
+		return e.hasAttribute("data-morphing");
+	}
+	function l() {
+		let e = t.value, a = n.value;
+		if (!e || !a) return;
+		let l = r.value, u = Je(e);
+		if (s <= 0 && (s = u), !c(e)) {
+			let t = qe(e, l);
+			t > 0 && (i.value ? o = t : s = t);
+		}
+		let d = o > 0 ? o : Math.max(qe(a, l), s), f = Math.max(d, s);
+		e.style.setProperty("--dock-collapsed-px", `${s}px`), e.style.setProperty("--dock-expanded-px", `${f}px`);
+	}
+	function u(e) {
+		a &&= (a.disconnect(), null), !(!e || typeof ResizeObserver > "u") && (a = new ResizeObserver(() => l()), n.value && a.observe(n.value), a.observe(e), l());
+	}
+	X(t, (e) => u(e), { immediate: !0 }), X(n, () => u(t.value)), X(i, () => l());
+	let d = typeof document < "u" ? document.fonts : void 0;
+	d && d.ready.then(() => l()), B(() => {
+		a && a.disconnect(), a = null;
+	});
+}
+//#endregion
+//#region src/components/dock/composables/useDockShellProps.ts
+function Xe(e) {
+	let t = O(() => {
 		if (e.containerName) return {
 			"container-type": "inline-size",
 			"container-name": e.containerName
 		};
-	}), n = M(() => e.collapseDelay ?? 3600), r = M(() => e.layout ?? "linear"), i = M(() => e.shape ?? "pill"), a = M(() => e.orientation ?? "horizontal"), o = M(() => e.density ?? "comfortable"), s = M(() => e.overflow === "scroll" ? a.value === "vertical" ? "dock-scroll-y" : "dock-scroll-x" : null), c = M(() => e.alwaysExpanded || r.value === "grid");
+	}), n = O(() => e.collapseDelay ?? 3600), r = O(() => e.layout ?? "linear"), i = O(() => e.shape ?? "pill"), a = O(() => e.orientation ?? "horizontal"), o = O(() => e.size ?? "md"), s = O(() => a.value === "vertical" || e.overflow === "wrap" ? null : "dock-scroll-x"), c = O(() => e.alwaysExpanded || r.value === "grid");
 	return {
 		containerStyle: t,
 		collapseDelay: n,
-		startCollapsed: M(() => c.value ? !1 : e.startCollapsed ?? !0),
+		startCollapsed: O(() => c.value ? !1 : e.startCollapsed ?? !0),
 		layoutValue: r,
 		shape: i,
 		orientation: a,
-		density: o,
+		size: o,
 		scrollClass: s,
 		alwaysExpanded: c,
-		fitContent: M(() => e.fitContent ?? !1)
+		fitContent: O(() => e.fitContent ?? !1)
 	};
 }
 //#endregion
-//#region src/components/custom/dock/composables/useDockMorphWindow.ts
-function rt(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 it(e) {
-	let t = getComputedStyle(e), n = t.transitionDuration.split(",").map(rt), r = t.transitionDelay.split(",").map(rt);
-	return Math.max(0, ...n.map((e, t) => e + (r[t] ?? r[0] ?? 0)));
-}
-function at(e) {
-	let t = rt(getComputedStyle(e).getPropertyValue("--duration-normal") || "0.3s");
-	return Math.max(t > 0 ? t * 2 : 0, 600);
-}
-function ot(e, t) {
-	let n = null, r = 0;
-	function i() {
-		n &&= (clearTimeout(n), null);
-	}
-	function a() {
-		let a = e.value;
-		if (!a) return;
-		let o = ++r;
-		i(), t.value = !0, n = setTimeout(() => {
-			o === r && (t.value = !1, n = null);
-		}, Math.max(it(a), at(a)) + 50);
-	}
-	function o(n) {
-		n.target === e.value && _.has(n.propertyName) && (i(), r++, t.value = !1);
-	}
-	return ie(i), {
-		markTransitioning: a,
-		onDockTransitionDone: o,
-		clearTransitionTimer: i
-	};
-}
-//#endregion
-//#region src/components/custom/dock/composables/useDockClickIntegrity.ts
-function st(e) {
+//#region src/components/dock/composables/useDockClickIntegrity.ts
+function Ze(e) {
 	let { rootEl: t, visualExpanded: n } = e, r = null, i = !1, a = 0, o = null;
 	function s() {
 		o !== null && (clearTimeout(o), o = null);
@@ -717,142 +579,85 @@ function st(e) {
 			e.stopPropagation(), e.preventDefault(), r = null;
 		}
 	}
-	return ie(s), {
+	return ee(s), {
 		onPointerDownCapture: f,
 		onClickCapture: m,
 		markExpandFlip: c
 	};
 }
 //#endregion
-//#region src/components/custom/dock/composables/useDockItemDrag.ts
-function ct() {
-	return typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-}
-function lt(e) {
-	if (!e) return [];
-	let t = e.querySelector(".dock-layer.is-active") ?? e, n = Array.from(t.querySelectorAll("[data-dock-draggable]"));
-	return n.length ? n : Array.from(t.querySelectorAll(".dock-icon-button"));
-}
-function ut(e) {
-	let t = W(!1), n = null, r = -1, i = -1, s = [], c = 0, l = 0, u = null, d = !1, f = 0, p = 0, m = o({
-		from: 0,
-		to: 1,
-		axis: "width",
-		squishLaw: "tanh",
-		maxStretch: () => 1.12
-	}), { response: h, dampingFraction: g } = a("dock"), _ = null, v = null;
-	function y() {
-		if (_) return _;
-		let e = new X({
-			response: h,
-			dampingFraction: g,
-			respectReducedMotion: !0
-		});
-		return _ = e, v = e.subscribe((r) => {
-			if (n && t.value === !1 && d) {
-				let t = (1 - r) * f;
-				x(n, t), ct() || m.drive(Math.min(1, r)), e.settled && (d = !1, D());
-			}
-		}), e.play(() => {}), e;
-	}
-	function b(e, t) {
-		let n = e.getBoundingClientRect();
-		return t ? n.left + n.width / 2 : n.top + n.height / 2;
-	}
-	function x(t, n) {
-		let r = e.axis() === "x";
-		t.style.transform = r ? `translateX(${n}px)` : `translateY(${n}px)`, t.style.setProperty("--stretch", ct() ? "1" : `${m.stretch.value}`);
-	}
-	function S(e) {
-		e.style.transform = "", e.style.removeProperty("--stretch"), e.classList.remove("glass-drag-lift"), e.style.removeProperty("z-index"), e.style.removeProperty("position");
-	}
-	function C(i) {
-		if (!e.enabled() || t.value || d) return;
-		let a = e.rootEl.value;
-		if (!a) return;
-		let o = i.target?.closest("[data-dock-draggable], .dock-icon-button");
-		if (!o || !a.contains(o)) return;
-		let f = lt(a), p = f.indexOf(o);
-		if (p < 0) return;
-		let m = e.axis() === "x";
-		s = f.map((e) => b(e, m)), n = o, r = p, l = s[p], c = m ? i.clientX : i.clientY, u = i.pointerId, t.value = !0, o.classList.add("glass-drag-lift"), o.style.position = "relative", o.style.zIndex = "20";
-		try {
-			o.setPointerCapture(i.pointerId);
-		} catch {}
-		i.preventDefault();
-	}
-	function w(r) {
-		if (!t.value || !n || u != null && r.pointerId !== u) return;
-		let i = (e.axis() === "x" ? r.clientX : r.clientY) - c;
-		ct() || m.drive(Math.min(1, Math.abs(i) / 120)), x(n, i);
-	}
-	function T(e) {
-		let t = r, n = Infinity;
-		return s.forEach((r, i) => {
-			let a = Math.abs(r - e);
-			a < n && (n = a, t = i);
-		}), t;
-	}
-	function E(r) {
-		if (!t.value || !n || u != null && r.pointerId !== u) return;
-		t.value = !1;
-		let a = (e.axis() === "x" ? r.clientX : r.clientY) - c, o = l + a, m = T(o);
-		if (p = s[m], f = o - p, i = m, ct()) {
-			d = !1, n && x(n, 0), D();
-			return;
-		}
-		d = !0;
-		let h = y();
-		h.reset(0, 0), h.target = 1;
-	}
-	function D() {
-		let t = e.rootEl.value, a = r, o = i, s = n;
-		if (s && S(s), t && s && a >= 0 && o >= 0 && a !== o) {
-			let n = lt(t)[o];
-			if (n && s.parentElement) {
-				let t = s.parentElement;
-				a < o ? t.insertBefore(s, n.nextSibling) : t.insertBefore(s, n), e.onReorder?.(a, o);
-			}
-		}
-		n = null, r = -1, i = -1;
+//#region src/components/dock/composables/useDockTouchGate.ts
+function Qe(e) {
+	let { collapseDelay: t, rootEl: n, alwaysExpanded: r, visualExpanded: i, expanded: a, isPinned: o, expand: s, collapse: l } = e, u = c(t);
+	function d() {
+		return !r.value;
 	}
-	function O() {
-		typeof window > "u" || (window.addEventListener("pointermove", w), window.addEventListener("pointerup", E), window.addEventListener("pointercancel", E));
+	function f(e) {
+		if (!d() || i.value) return;
+		let t = n.value, r = e.touches[0];
+		!t || !r || u.handleTouchStart(t, r.clientY);
 	}
-	function k() {
-		typeof window > "u" || (window.removeEventListener("pointermove", w), window.removeEventListener("pointerup", E), window.removeEventListener("pointercancel", E));
+	function p(e) {
+		d() && u.handleScrollCheck(e);
 	}
-	let ee = q(() => [e.rootEl.value, e.enabled()], ([e, t], n, r) => {
-		e && t && (e.addEventListener("pointerdown", C), O(), r(() => {
-			e.removeEventListener("pointerdown", C), k();
-		}));
-	}, { immediate: !0 });
-	function A() {
-		ee(), k(), v?.(), _ = null;
+	function m() {
+		if (!d()) return;
+		let e = u.isActive.value;
+		u.handleTouchEnd(), !e && u.isActive.value && !i.value && s();
 	}
-	return ie(A), {
-		dragging: t,
-		detach: A
+	return X(u.isActive, (e) => {
+		!e && a.value && !o.value && !r.value && l();
+	}), {
+		onTouchStart: f,
+		onTouchMove: p,
+		onTouchEnd: m,
+		deactivate: () => u.deactivate()
 	};
 }
 //#endregion
-//#region src/components/custom/dock/GlassDock.vue?vue&type=script&setup=true&lang.ts
-var dt = [
-	"data-has-rail",
-	"data-splittable",
-	"data-fissioned"
-], ft = [
-	"data-density",
+//#region src/components/dock/composables/useDockOverflowFit.ts
+function $e(e) {
+	let t = null, n = null, r = 0;
+	function i() {
+		return e.value?.querySelector(".dock-layer--full") ?? null;
+	}
+	function a() {
+		let t = e.value, n = i();
+		if (!t || !n) return;
+		let r = n.scrollWidth - n.clientWidth > 1;
+		t.toggleAttribute("data-dock-overflow", r);
+	}
+	function o() {
+		cancelAnimationFrame(r), r = requestAnimationFrame(a);
+	}
+	return te(() => {
+		let r = e.value, a = i();
+		o(), r && (t = new ResizeObserver(o), t.observe(r), a && t.observe(a)), a && (n = new MutationObserver(o), n.observe(a, {
+			childList: !0,
+			subtree: !0,
+			characterData: !0
+		}));
+	}), X(() => e.value, () => o()), V(() => {
+		t?.disconnect(), n?.disconnect(), cancelAnimationFrame(r);
+	}), { measure: a };
+}
+//#endregion
+//#region src/components/dock/GlassDock.vue?vue&type=script&setup=true&lang.ts
+var et = [
+	"data-size",
 	"data-held",
 	"data-search",
 	"data-container-name"
-], pt = {
+], tt = { class: "dock-controls" }, nt = {
 	key: 0,
 	class: "dock-persistent"
-}, mt = ["inert"], ht = ["inert"], gt = {
+}, rt = ["inert"], it = ["inert"], at = {
 	key: 0,
 	class: "dock-search-field"
-}, _t = ["aria-hidden"], vt = ["inert"], yt = 36, bt = /* @__PURE__ */ R({
+}, ot = {
+	key: 1,
+	class: "dock-persistent dock-persistent-end"
+}, st = /* @__PURE__ */ P({
 	inheritAttrs: !1,
 	__name: "GlassDock",
 	props: {
@@ -861,647 +666,375 @@ var dt = [
 		alwaysExpanded: { type: Boolean },
 		shape: {},
 		orientation: {},
-		density: {},
+		size: {},
 		overflow: {},
-		containerName: {},
-		collapseDelay: {},
-		startCollapsed: { type: Boolean },
-		layout: {},
-		autoLuminance: { type: Boolean },
-		backgroundCanvas: { type: [
-			Function,
-			String,
-			null
-		] },
-		search: { type: Boolean },
-		splittable: { type: Boolean },
-		splitContext: {},
-		splitPlacement: {},
-		draggableItems: { type: Boolean }
-	},
-	emits: ["update:order"],
-	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, { containerStyle: a, collapseDelay: o, startCollapsed: s, layoutValue: c, shape: l, orientation: u, density: d, scrollClass: p, alwaysExpanded: m, fitContent: h } = nt(r), g = c, _ = he("dockEl"), v = he("layersEl");
-		r.autoLuminance !== !1 && We(_, { backgroundCanvas: r.backgroundCanvas ?? null });
-		let b = W(!1), x = f(o.value), S = `glass-dock-${fe()}`, { expanded: C, isPinned: w, isHeld: T, onMouseEnter: E, onMouseLeave: D, onFocusIn: O, onFocusOut: k, onClickCollapsed: ee, keepOpen: A, release: te, expand: j, collapse: N } = Ke({
-			collapseDelay: o.value,
-			rootEl: _,
-			alwaysExpanded: m,
-			isTransitioning: b,
-			dockId: S
-		});
-		y({
-			id: S,
-			orientation: u,
-			layout: g,
-			keepOpen: A,
-			release: te,
-			held: T
-		});
-		let L = M(() => m.value || C.value), R = me(), ne = M(() => !!R.rail), V = he("frameEl"), oe = M(() => L.value ? "full" : "summary"), se = M(() => u.value), { context: U, onOuterTransitionEnd: ce } = tt({
-			rootEl: _,
-			outerEl: v,
-			outerActiveLayer: oe,
-			outerAxis: se
-		});
-		$e(U), Xe({
-			rootEl: _,
-			contentEl: v,
-			axis: se,
-			expanded: L
-		});
-		let le = M(() => ({ "view-transition-name": S.replace(/[^a-zA-Z0-9_-]/g, "-") })), { markTransitioning: de, onDockTransitionDone: pe } = ot(_, b), { onPointerDownCapture: J, onClickCapture: ge, markExpandFlip: _e } = st({
-			rootEl: _,
-			visualExpanded: L
-		});
-		ae(() => {
-			(r.alwaysExpanded || !s.value) && j();
-		});
-		function ve() {
-			return !m.value;
-		}
-		function ye(e) {
-			if (!ve() || L.value) return;
-			let t = _.value, n = e.touches[0];
-			!t || !n || x.handleTouchStart(t, n.clientY);
-		}
-		function be(e) {
-			ve() && x.handleScrollCheck(e);
-		}
-		function xe() {
-			if (!ve()) return;
-			let e = x.isActive.value;
-			x.handleTouchEnd(), !e && x.isActive.value && !L.value && j();
-		}
-		q(x.isActive, (e) => {
-			!e && C.value && !w.value && !m.value && N();
-		}), q(L, (e) => {
-			de(), e ? _e() : x.deactivate();
-		});
-		let Se = ue(Ae[r.splitContext ?? "nav"]);
-		q(() => r.splitContext, (e) => {
-			Se.value = Ae[e ?? "nav"];
-		});
-		let Ce = ue(r.splitPlacement ?? "beside");
-		q(() => r.splitPlacement, (e) => {
-			Ce.value = e ?? "beside";
-		});
-		let Y = r.splittable ? je({
-			rootEl: V,
-			signature: Se,
-			placement: Ce
-		}) : null, we = Y ? Y.fissioned : M(() => !1), Te = [];
-		function Ee() {
-			let e = _.value;
-			if (!e) return {
-				x: 0,
-				y: 0
-			};
-			let t = e.getBoundingClientRect();
-			return {
-				x: t.left + t.width / 2,
-				y: t.top + t.height / 2
-			};
-		}
-		function X() {
-			let e = _.value;
-			if (!e || !Y) return;
-			for (let e of Te.splice(0)) e.release();
-			let t = Array.from(e.querySelectorAll("[data-dock-splittable]")), n = r.splitContext ?? "nav";
-			t.forEach((e, t) => {
-				e.classList.add("dock-fission-piece");
-				let r = Y.registerPiece({
-					el: W(e),
-					rank: t,
-					vector: () => {
-						let t = Ee(), r = e.getBoundingClientRect(), i = r.left + r.width / 2, a = r.top + r.height / 2, o = i - t.x, s = a - t.y, c = Math.hypot(o, s) || 1;
-						return o /= c, s /= c, n === "nav" && (o = -o, s = -s), n === "media" && (s *= .25), {
-							dx: o,
-							dy: s
-						};
-					}
-				});
-				Te.push(r);
-			});
-		}
-		Y && (ae(() => {
-			re(X);
-		}), ie(() => {
-			for (let e of Te.splice(0)) e.release();
-		}));
-		let De = ut({
-			rootEl: _,
-			enabled: () => r.draggableItems === !0,
-			axis: () => u.value === "vertical" ? "y" : "x",
-			onReorder: (e, t) => i("update:order", e, t)
-		}).dragging;
-		function Oe(e) {
-			if (Y?.onPointerMove(e), ke) {
-				let t = e.clientX - ke.x, n = e.clientY - ke.y;
-				Math.hypot(t, n) > yt && Y && !Y.fissioned.value && Q();
-			}
-		}
-		let ke = null;
-		function Z(e) {
-			Y && e.target?.closest("[data-dock-splittable]") && (ke = {
-				x: e.clientX,
-				y: e.clientY
-			});
-		}
-		function Me() {
-			ke = null;
-		}
-		function Q() {
-			Y && (X(), Y.split());
-		}
-		function $() {
-			Y?.merge();
-		}
-		function Ne() {
-			Y && (X(), Y.toggle());
-		}
-		return t({
-			expanded: C,
-			isPinned: w,
-			isHeld: T,
-			isTransitioning: b,
-			expand: j,
-			collapse: N,
-			keepOpen: A,
-			release: te,
-			split: Q,
-			merge: $,
-			toggleSplit: Ne,
-			fissioned: Y ? Y.fissioned : M(() => !1)
-		}), (t, n) => (H(), F("div", {
-			ref_key: "frameEl",
-			ref: V,
-			class: B(["glass-dock-frame", K(u)]),
-			"data-has-rail": ne.value || void 0,
-			"data-splittable": e.splittable || void 0,
-			"data-fissioned": K(we) || void 0
-		}, [
-			I("div", z({
-				ref_key: "dockEl",
-				ref: _
-			}, t.$attrs, {
-				class: ["glass-dock", [
-					K(u),
-					`shape-${K(l)}`,
-					`layout-${K(g)}`,
-					K(p),
-					{
-						expanded: L.value,
-						collapsed: !L.value,
-						pinned: K(w),
-						"fit-content": K(h),
-						"always-expanded": K(m),
-						"dock-overflow-wrap": e.overflow === "wrap" && K(u) !== "vertical"
-					},
-					{
-						"glass-drag-grabbable": e.draggableItems && !K(De),
-						"dock-items-draggable": e.draggableItems
-					},
-					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(T) || void 0,
-				"data-search": e.search || void 0,
-				"data-container-name": e.containerName || void 0,
-				style: [K(a), le.value],
-				onMouseenter: n[2] ||= (...e) => K(E) && K(E)(...e),
-				onMouseleave: n[3] ||= (e) => K(D)(e),
-				onFocusin: n[4] ||= (...e) => K(O) && K(O)(...e),
-				onFocusout: n[5] ||= (...e) => K(k) && K(k)(...e),
-				onTouchstart: ye,
-				onTouchmove: be,
-				onTouchend: xe,
-				onPointerdownCapture: n[6] ||= (...e) => K(J) && K(J)(...e),
-				onClickCapture: n[7] ||= (...e) => K(ge) && K(ge)(...e),
-				onPointermove: n[8] ||= (t) => e.splittable ? Oe(t) : void 0,
-				onPointerdown: n[9] ||= (t) => e.splittable ? Z(t) : void 0,
-				onPointerup: n[10] ||= (t) => e.splittable ? Me() : void 0,
-				onPointercancel: n[11] ||= (t) => e.splittable ? Me() : void 0,
-				onTransitionend: n[12] ||= (...e) => K(pe) && K(pe)(...e),
-				onTransitioncancel: n[13] ||= (...e) => K(pe) && K(pe)(...e)
-			}), [
-				n[14] ||= I("span", {
-					class: "cartoon-cast",
-					"aria-hidden": "true"
-				}, null, -1),
-				t.$slots.persistent ? (H(), F("div", pt, [G(t.$slots, "persistent")])) : P("", !0),
-				I("div", {
-					ref_key: "layersEl",
-					ref: v,
-					class: "dock-layers",
-					onTransitionend: n[1] ||= (...e) => K(ce) && K(ce)(...e)
-				}, [
-					I("div", {
-						class: B(["dock-layer dock-layer--full", { "is-active": L.value }]),
-						inert: !L.value || void 0
-					}, [G(t.$slots, "default")], 10, mt),
-					I("div", {
-						class: B(["dock-layer dock-layer--summary", { "is-active": !L.value }]),
-						inert: L.value || void 0,
-						onClick: n[0] ||= (...e) => K(ee) && K(ee)(...e)
-					}, [G(t.$slots, "collapsed")], 10, ht),
-					e.search ? (H(), F("div", gt, [G(t.$slots, "search")])) : P("", !0)
-				], 544)
-			], 16, ft),
-			e.splittable ? (H(), F("div", {
-				key: 0,
-				class: B(["dock-fission-bridge", [K(u), `place-${Ce.value ?? "beside"}`]]),
-				"aria-hidden": !K(we) || void 0
-			}, [n[15] ||= I("div", {
-				class: "dock-fission-neck",
-				"aria-hidden": "true"
-			}, null, -1), I("div", {
-				class: "dock-fission-island",
-				inert: !K(we) || void 0
-			}, [G(t.$slots, "split", { fissioned: K(we) })], 8, vt)], 10, _t)) : P("", !0),
-			ne.value ? (H(), F("div", {
-				key: 1,
-				class: B(["dock-hairline-slot", K(u)])
-			}, [G(t.$slots, "rail")], 2)) : P("", !0)
-		], 10, dt));
-	}
-}), xt = /* @__PURE__ */ R({
-	__name: "Tabs",
-	props: {
-		defaultValue: {},
-		orientation: {},
-		dir: {},
-		activationMode: {},
-		modelValue: {},
-		unmountOnHide: { type: Boolean },
-		asChild: { type: Boolean },
-		as: {}
-	},
-	emits: ["update:modelValue"],
-	setup(e, { emit: t }) {
-		let n = Ee(e, t);
-		return (e, t) => (H(), N(K(Y), z({ "data-slot": "tabs" }, K(n)), {
-			default: J(() => [G(e.$slots, "default")]),
-			_: 3
-		}, 16));
-	}
-}), St = /* @__PURE__ */ R({
-	__name: "TabsTrigger",
-	props: {
-		value: {},
-		disabled: { type: Boolean },
-		asChild: { type: Boolean },
-		as: {},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] }
-	},
-	setup(t) {
-		let n = t, r = Te(M(() => {
-			let { class: e, ...t } = n;
-			return t;
-		}));
-		return (t, i) => (H(), N(K(we), z({ "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: J(() => [G(t.$slots, "default")]),
-			_: 3
-		}, 16, ["class"]));
-	}
-}), Ct = /* @__PURE__ */ R({
-	__name: "TabsIndicator",
-	props: {
-		asChild: { type: Boolean },
-		as: {},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] },
-		surface: {
-			type: Boolean,
-			default: !0
-		}
-	},
-	setup(t) {
-		let n = t, r = M(() => {
-			let { class: e, surface: t, ...r } = n;
-			return r;
-		});
-		return (t, i) => (H(), N(K(Se), z({ "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"]));
-	}
-}), wt = /* @__PURE__ */ R({
-	__name: "TabsList",
-	props: {
-		loop: { type: Boolean },
-		asChild: { type: Boolean },
-		as: {},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] },
-		indicator: {
+		containerName: {},
+		collapseDelay: {},
+		startCollapsed: { type: Boolean },
+		layout: {},
+		autoLuminance: {
 			type: Boolean,
 			default: !0
-		}
+		},
+		backgroundCanvas: {},
+		search: { type: Boolean }
 	},
-	setup(t) {
-		let n = t, r = M(() => {
-			let { class: e, indicator: t, ...r } = n;
-			return r;
+	setup(e, { expose: t }) {
+		let n = e, { containerStyle: r, collapseDelay: i, startCollapsed: a, layoutValue: o, shape: s, orientation: c, size: l, scrollClass: u, alwaysExpanded: d, fitContent: f } = Xe(n), p = o, h = Y("dockEl"), g = Y("layersEl");
+		$e(h), n.autoLuminance !== !1 && Re(h, { backgroundCanvas: () => {
+			let e = n.backgroundCanvas;
+			return typeof e == "function" ? e() : e instanceof HTMLCanvasElement ? e : null;
+		} });
+		let _ = W(!1), v = `glass-dock-${ie()}`, { expanded: y, isPinned: b, isHeld: x, onMouseEnter: S, onMouseLeave: C, onFocusIn: w, onFocusOut: T, onClickCollapsed: E, keepOpen: D, release: k, expand: N, collapse: P } = Be({
+			collapseDelay: i.value,
+			rootEl: h,
+			alwaysExpanded: d,
+			isTransitioning: _,
+			dockId: v
 		});
-		return (i, a) => (H(), N(K(Ce), z({ "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: J(() => [t.indicator ? (H(), N(Ct, { key: 0 })) : P("", !0), G(i.$slots, "default")]),
-			_: 3
-		}, 16, ["class"]));
-	}
-}), Tt = m(g, "[glass-ui:dock] <DockLayer> must be used inside <DockLayerGroup>"), { KEY: Et } = Tt;
-function Dt(e) {
-	Tt.provide(e);
+		m({
+			id: v,
+			orientation: c,
+			layout: p,
+			keepOpen: D,
+			release: k,
+			held: x
+		});
+		let F = O(() => d.value || y.value), L = O(() => F.value ? "full" : "summary"), z = O(() => c.value), { context: ee } = Ge({
+			rootEl: h,
+			outerEl: g,
+			outerActiveLayer: L,
+			outerAxis: z,
+			onMorphActiveChange: (e) => {
+				_.value = e;
+			}
+		});
+		We(ee), Ye({
+			rootEl: h,
+			contentEl: g,
+			axis: z,
+			expanded: F
+		});
+		let B = O(() => ({ "view-transition-name": v.replace(/[^a-zA-Z0-9_-]/g, "-") })), { onPointerDownCapture: V, onClickCapture: U, markExpandFlip: G } = Ze({
+			rootEl: h,
+			visualExpanded: F
+		});
+		te(() => {
+			(n.alwaysExpanded || !a.value) && N();
+		});
+		let { onTouchStart: q, onTouchMove: ne, onTouchEnd: re, deactivate: ae } = Qe({
+			collapseDelay: i.value,
+			rootEl: h,
+			alwaysExpanded: d,
+			visualExpanded: F,
+			expanded: y,
+			isPinned: b,
+			expand: N,
+			collapse: P
+		});
+		return X(F, (e) => {
+			e ? G() : ae();
+		}), t({
+			expanded: y,
+			isPinned: b,
+			isHeld: x,
+			isTransitioning: _,
+			expand: N,
+			collapse: P,
+			keepOpen: D,
+			release: k
+		}), (t, n) => (H(), j("div", I({
+			ref_key: "dockEl",
+			ref: h
+		}, t.$attrs, {
+			class: ["glass-dock", [
+				J(c),
+				`shape-${J(s)}`,
+				`layout-${J(p)}`,
+				J(u),
+				{
+					expanded: F.value,
+					collapsed: !F.value,
+					pinned: J(b),
+					"fit-content": J(f),
+					"always-expanded": J(d),
+					"dock-overflow-wrap": e.overflow === "wrap" && J(c) !== "vertical"
+				},
+				e.position === "fixed" ? "fixed bottom-(--dock-pos) inset-x-0 mx-auto w-max" : e.position === "sticky" ? "dock-sticky" : "dock-inline"
+			]],
+			"data-size": J(l),
+			"data-held": J(x) || void 0,
+			"data-search": e.search || void 0,
+			"data-container-name": e.containerName || void 0,
+			style: [J(r), B.value],
+			onMouseenter: n[1] ||= (...e) => J(S) && J(S)(...e),
+			onMouseleave: n[2] ||= (e) => J(C)(e),
+			onFocusin: n[3] ||= (...e) => J(w) && J(w)(...e),
+			onFocusout: n[4] ||= (...e) => J(T) && J(T)(...e),
+			onTouchstart: n[5] ||= (...e) => J(q) && J(q)(...e),
+			onTouchmove: n[6] ||= (...e) => J(ne) && J(ne)(...e),
+			onTouchend: n[7] ||= (...e) => J(re) && J(re)(...e),
+			onPointerdownCapture: n[8] ||= (...e) => J(V) && J(V)(...e),
+			onClickCapture: n[9] ||= (...e) => J(U) && J(U)(...e)
+		}), [n[10] ||= M("div", {
+			class: "dock-plate",
+			"aria-hidden": "true"
+		}, null, -1), M("div", tt, [
+			t.$slots.persistent ? (H(), j("div", nt, [K(t.$slots, "persistent")])) : A("", !0),
+			M("div", {
+				ref_key: "layersEl",
+				ref: g,
+				class: "dock-layers"
+			}, [
+				M("div", {
+					class: R(["dock-layer dock-layer--full", { "is-active": F.value }]),
+					inert: !F.value || void 0
+				}, [K(t.$slots, "default")], 10, rt),
+				M("div", {
+					class: R(["dock-layer dock-layer--summary", { "is-active": !F.value }]),
+					inert: F.value || void 0,
+					onClick: n[0] ||= (...e) => J(E) && J(E)(...e)
+				}, [K(t.$slots, "collapsed")], 10, it),
+				e.search ? (H(), j("div", at, [K(t.$slots, "search")])) : A("", !0)
+			], 512),
+			t.$slots["persistent-end"] ? (H(), j("div", ot, [K(t.$slots, "persistent-end")])) : A("", !0)
+		])], 16, et));
+	}
+}), ct = u(f, "[glass-ui:dock] <DockLayer> must be used inside <DockCrossfade> (or <DockLayerGroup>)"), { KEY: lt } = ct;
+function ut(e) {
+	ct.provide(e);
 }
-var Ot = Tt.use;
-Tt.useOptional;
+var dt = ct.use;
+ct.useOptional;
 //#endregion
-//#region src/components/custom/dock/composables/useLayerTransition.ts
-function kt(e) {
-	let { containerEl: t, activeLayer: n, axis: r } = e, i = M(() => r?.value === "vertical" ? "height" : "width"), a = M(() => 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);
-		for (let t of e) t();
-	}
-	let p = null, m = null;
-	function h() {
-		p &&= (p.dispose(), null), m = null;
-	}
-	function g(e) {
-		return e.closest(".glass-dock") ?? e;
-	}
-	function _(e) {
-		if (u.value) {
-			d.push(e);
-			return;
+//#region src/components/dock/DockCrossfade.vue
+var ft = /* @__PURE__ */ P({
+	__name: "DockCrossfade",
+	props: {
+		active: {},
+		reserve: { default: "block" }
+	},
+	setup(e, { expose: t }) {
+		let n = e, r = W(null), i = W(/* @__PURE__ */ new Map()), a = O(() => [...i.value.values()].map(({ id: e, label: t, icon: n }) => ({
+			id: e,
+			label: t,
+			icon: n
+		})));
+		function o(e) {
+			let t = new Map(i.value);
+			t.set(e.id, e), i.value = t, p();
 		}
-		requestAnimationFrame(e);
-	}
-	function v(e) {
-		e.style.removeProperty("--dock-morph-from"), e.style.removeProperty("--dock-morph-to");
-	}
-	function y() {
-		return typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-	}
-	function b(e, t, n) {
-		if (n !== l) return;
-		let r = a.value;
-		v(e);
-		let s = e.style.getPropertyValue(r);
-		e.style.setProperty(r, "max-content");
-		let c = o(e);
-		s ? e.style.setProperty(r, s) : e.style.removeProperty(r), e.style.setProperty("--dock-morph-from", `${c}px`), e.style.setProperty("--dock-morph-to", `${c}px`), t.style.setProperty("--dock-morph-t", "1"), e.getBoundingClientRect()[i.value], x(e, t);
-	}
-	function x(e, t) {
-		v(e), t.style.removeProperty("--dock-morph-t"), t.removeAttribute("data-morphing"), c.value = null, h(), u.value = !1, f();
-	}
-	function C(e, t, n, r, i, a, o) {
-		if (Math.abs(i - r) < .5) {
-			x(e, t);
-			return;
+		function c(e) {
+			if (!i.value.has(e)) return;
+			let t = new Map(i.value);
+			t.delete(e), i.value = t, p();
 		}
-		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 X({
-			response: S.response,
-			dampingFraction: S.dampingFraction,
-			initial: 0,
-			respectReducedMotion: !0
-		}), m = e);
-		let s = p;
-		s.reset(0, a), s.target = 1, s.play((r) => {
-			n === l && (t.style.setProperty("--dock-morph-t", `${r}`), s.settled && x(e, t));
+		let l = O(() => n.active), u = W(null);
+		ut({
+			register: o,
+			unregister: c,
+			activeId: l,
+			leavingId: u,
+			faces: a
 		});
-	}
-	q(n, (e, n) => {
-		if (e === n) return;
-		let r = t.value;
-		if (!r) {
-			s.value = e, c.value = null;
-			return;
-		}
-		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, y()) {
-			re(() => b(r, i, d));
-			return;
+		let d = W(0), f = O(() => n.reserve === "inline" ? "min-inline-size" : "min-block-size");
+		function p() {
+			let e = 0;
+			for (let { el: t } of i.value.values()) {
+				let r = n.reserve === "inline" ? t.scrollWidth : t.scrollHeight;
+				r > e && (e = r);
+			}
+			e > d.value && (d.value = e);
 		}
-		requestAnimationFrame(() => {
-			if (d !== l) return;
-			let e = t.value;
-			if (!e) return;
-			let n = g(e);
-			v(e), n.style.removeProperty("--dock-morph-t"), e.style.setProperty(a.value, "max-content");
-			let r = o(e);
-			e.style.removeProperty(a.value), C(e, n, d, _, r, h, f);
+		let m = O(() => d.value > 0 ? {
+			[f.value]: `${d.value}px`,
+			"--dock-crossfade-peak": `${d.value}px`
+		} : void 0);
+		s(r, () => p());
+		let h = Ve({
+			response: _.response,
+			dampingFraction: _.dampingFraction
 		});
-	});
-	function w(e) {
-		let n = t.value;
-		n && e.target === n && (e.propertyName !== a.value && e.propertyName !== i.value || p && p.settled && x(n, g(n)));
-	}
-	return se(() => {
-		h(), d.length = 0;
-	}), {
-		onTransitionEnd: w,
-		currentLayer: s,
-		leavingLayer: c,
-		morphing: u,
-		deferReposition: _
-	};
-}
-//#endregion
-//#region src/components/custom/dock/DockLayerGroup.vue?vue&type=script&setup=true&lang.ts
-var At = { key: 1 }, jt = { key: 2 }, Mt = /* @__PURE__ */ R({
+		function g(e) {
+			return e ? i.value.get(e)?.el : void 0;
+		}
+		function v(e, t) {
+			g(e)?.style.setProperty("--dock-t", `${t}`);
+		}
+		function y(e) {
+			g(e)?.style.removeProperty("--dock-t");
+		}
+		function b(e) {
+			return e < 0 ? 0 : e > 1 ? 1 : e;
+		}
+		function x() {
+			return typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+		}
+		async function S(e, t) {
+			if (typeof document > "u") return;
+			let n = g(e), r = document.activeElement;
+			!n || !r || !n.contains(r) || (await L(), (g(t) ?? document.body).focus?.());
+		}
+		return X(l, (e, t) => {
+			if (e === t) return;
+			p();
+			let n = g(e), i = g(t);
+			if (!n || !i) {
+				u.value = null, y(e);
+				return;
+			}
+			let a = u.value;
+			a && a !== e && a !== t && y(a), u.value = t;
+			let o = typeof getComputedStyle == "function" ? b(parseFloat(getComputedStyle(n).opacity) || 0) : 0;
+			v(e, o), v(t, o), S(t, e), r.value?.setAttribute("data-crossfading", "");
+			let s = () => {
+				y(e), y(t), r.value?.removeAttribute("data-crossfading"), u.value = null;
+			};
+			if (x()) {
+				s();
+				return;
+			}
+			h.playTo(o, 1, {
+				onFrame: (n) => {
+					let r = b(n);
+					v(e, r), v(t, r);
+				},
+				onSettle: s
+			});
+		}), ee(() => h.dispose()), t({ faces: a }), (e, t) => (H(), j("div", {
+			ref_key: "rootEl",
+			ref: r,
+			class: "dock-crossfade",
+			style: z(m.value)
+		}, [K(e.$slots, "default")], 4));
+	}
+}), pt = ["data-motion"], mt = ["aria-orientation"], ht = [
+	"tabindex",
+	"title",
+	"aria-label",
+	"onClick"
+], gt = { key: 1 }, _t = { key: 2 }, vt = /* @__PURE__ */ P({
 	__name: "DockLayerGroup",
-	props: /* @__PURE__ */ ne({
+	props: /* @__PURE__ */ F({
 		orientation: {},
 		showRail: {
 			type: Boolean,
 			default: !0
 		},
 		railPosition: { default: "start" },
-		draggable: {
-			type: Boolean,
-			default: !1
-		}
+		motion: {}
 	}, {
 		active: { required: !0 },
 		activeModifiers: {}
 	}),
 	emits: ["update:active"],
 	setup(e) {
-		let t = e, n = pe(e, "active"), r = v(), i = W([]), a = he("containerEl"), o = he("groupEl");
-		function s(e) {
-			i.value.find((t) => t.id === e.id) || i.value.push(e), u();
-		}
-		function c(e) {
-			i.value = i.value.filter((t) => t.id !== e), u();
-		}
-		let l = W(0);
-		function u() {
-			let e = a.value, t = o.value;
-			if (!e || !t) return;
-			let n = 0, r = e.querySelectorAll(".dock-layer-item-host");
-			for (let e of r) {
-				let t = e.scrollHeight;
-				t > n && (n = t);
-			}
-			n > l.value && (l.value = n);
-		}
-		let f = M(() => l.value > 0 ? {
-			"min-block-size": `${l.value}px`,
-			"--dock-layer-peak-block-size": `${l.value}px`
-		} : void 0);
-		d(a, () => u()), q(() => i.value.length, () => u());
-		let p = M(() => t.orientation ?? r?.orientation.value ?? "horizontal"), m = M(() => p.value === "vertical" ? "horizontal" : "vertical"), h = he("railListEl"), g = W(null);
+		let t = e, n = a(() => t.motion), r = ae(e, "active"), i = p(), o = O(() => t.orientation ?? i?.orientation.value ?? "horizontal"), s = Y("crossfade"), c = O(() => s.value?.faces ?? []), l = O(() => o.value === "vertical" ? "horizontal" : "vertical"), u = O(() => l.value === "vertical"), d = W(null), f = W(null), m = W([]), h = T({
+			options: O(() => c.value.map((e) => ({ value: e.id }))),
+			model: r,
+			mode: "single",
+			role: "tablist",
+			vertical: u,
+			containerRef: d,
+			indicatorRef: f,
+			buttonRefs: m
+		}), g = O(() => u.value ? "y" : "x");
 		function _() {
-			let e = h.value;
-			g.value = e ? e.$el ?? e : null;
-		}
-		let y = M(() => m.value === "vertical" ? "y" : "x");
-		function b() {
-			let e = g.value;
+			let e = d.value;
 			if (!e) return [];
 			let t = Array.from(e.querySelectorAll(".dock-layer-tab"));
-			return i.value.map((e, n) => {
-				let r = t[n]?.getBoundingClientRect(), i = r ? y.value === "y" ? r.top + r.height / 2 : r.left + r.width / 2 : 0;
+			return c.value.map((e, n) => {
+				let r = t[n]?.getBoundingClientRect(), i = r ? g.value === "y" ? r.top + r.height / 2 : r.left + r.width / 2 : 0;
 				return {
 					value: e.id,
 					center: i
 				};
 			});
 		}
-		let x = O({
-			el: g,
-			axis: () => y.value,
-			snapTargets: b,
+		let v = b({
+			el: d,
+			axis: () => g.value,
+			snapTargets: _,
 			onSnap: (e) => {
-				t.draggable && n.value !== e && (n.value = e);
+				n.armed.value && r.value !== e && (r.value = e);
 			}
 		});
-		q(() => [
-			i.value.length,
-			m.value,
-			t.draggable
+		X(() => [
+			c.value.length,
+			l.value,
+			n.armed.value
 		], () => {
-			_(), t.draggable && re(() => x.refresh());
-		}), ae(() => {
-			_(), t.draggable && re(() => x.refresh());
-		});
-		let S = et(), C, w, T;
-		if (S) {
-			let e = S.registerGroup({
-				containerEl: a,
-				activeLayer: n,
-				axis: p
-			});
-			C = e.currentLayer, w = e.leavingLayer, T = () => {}, ie(() => e.release());
-		} else {
-			let e = kt({
-				containerEl: a,
-				activeLayer: n,
-				axis: p,
-				directionTypes: (e, t) => {
-					let n = i.value.findIndex((t) => t.id === e);
-					return [i.value.findIndex((e) => e.id === t) < n ? "layer-back" : "layer-forward"];
-				}
-			});
-			C = U(e.currentLayer), w = U(e.leavingLayer), T = e.onTransitionEnd;
-		}
-		let E = typeof document < "u" && "startViewTransition" in document, D = fe(), k = M(() => E ? {
-			"view-transition-name": `gl-dock-stack-${D.replace(/[^a-zA-Z0-9_-]/g, "-")}`,
-			"view-transition-class": "gl-dock-layer"
-		} : void 0);
-		Dt({
-			register: s,
-			unregister: c,
-			currentLayerId: C,
-			leavingLayerId: w
+			n.armed.value && L(() => v.refresh());
+		}), te(() => {
+			n.armed.value && L(() => v.refresh());
 		});
-		function ee(e) {
+		function y(e) {
 			return typeof e == "object" && !!e || typeof e == "function";
 		}
-		let A = W(!1);
-		function te() {
-			A.value || (A.value = !0, r?.keepOpen());
+		let x = W(!1);
+		function S() {
+			x.value || (x.value = !0, i?.keepOpen());
 		}
-		function R(e) {
+		function C(e) {
 			let t = e.relatedTarget, n = e.currentTarget;
-			t && n?.contains(t) || A.value && (A.value = !1, r?.release());
+			t && n?.contains(t) || x.value && (x.value = !1, i?.release());
 		}
-		return (r, s) => (H(), F("div", {
-			ref_key: "groupEl",
-			ref: o,
-			class: B(["dock-layer-group", [p.value, `rail-${e.railPosition}`]]),
-			style: V(f.value)
-		}, [e.showRail && i.value.length > 1 ? (H(), N(K(xt), {
+		return (t, i) => (H(), j("div", {
+			class: R(["dock-layer-group", [o.value, `rail-${e.railPosition}`]]),
+			"data-motion": J(n).dataMotion.value,
+			style: z(J(n).hostStyle.value)
+		}, [e.showRail && c.value.length > 1 ? (H(), j("div", {
+			key: 0,
+			ref_key: "railListEl",
+			ref: d,
+			role: "tablist",
+			class: R(["dock-layer-rail", [
+				e.railPosition,
+				J(n).armed.value && "glass-drag-grabbable",
+				J(n).armed.value && J(v).dragging.value && "glass-drag-lift"
+			]]),
+			"aria-orientation": l.value,
+			style: z(J(n).armed.value ? J(v).dragStyle.value : void 0),
+			onKeydown: i[0] ||= (...e) => J(h).onKeydown && J(h).onKeydown(...e),
+			onFocusin: S,
+			onFocusout: C
+		}, [(H(!0), j(D, null, G(c.value, (e, t) => (H(), j("button", I({
+			key: e.id,
+			ref_for: !0,
+			ref: (e) => {
+				e && (m.value[t] = e);
+			},
+			type: "button",
+			class: "dock-layer-tab",
+			tabindex: J(h).rovingTabindex(t)
+		}, { ref_for: !0 }, J(h).itemAttrs(e.id), {
+			title: e.label,
+			"aria-label": e.label ?? e.id,
+			onClick: (n) => J(h).select(e.id, t)
+		}), [y(e.icon) ? (H(), k(q(e.icon), {
 			key: 0,
-			modelValue: n.value,
-			"onUpdate:modelValue": s[0] ||= (e) => n.value = e,
-			orientation: m.value,
-			"as-child": !0
+			class: "size-4"
+		})) : typeof e.icon == "string" ? (H(), j("span", gt, ne(e.icon), 1)) : (H(), j("span", _t, ne((e.label ?? e.id).charAt(0)), 1))], 16, ht))), 128)), M("div", {
+			ref_key: "railIndicatorEl",
+			ref: f,
+			class: "dock-layer-tab-indicator",
+			style: z(J(h).singleSliderStyle.value),
+			"aria-hidden": "true"
+		}, null, 4)], 46, mt)) : A("", !0), N(ft, {
+			ref_key: "crossfade",
+			ref: s,
+			active: r.value,
+			class: "dock-layer-stack"
 		}, {
-			default: J(() => [L(K(wt), {
-				ref_key: "railListEl",
-				ref: h,
-				class: B(["dock-layer-rail", [
-					e.railPosition,
-					t.draggable && "glass-drag-grabbable",
-					t.draggable && K(x).dragging.value && "glass-drag-lift"
-				]]),
-				style: V(t.draggable ? K(x).dragStyle.value : void 0),
-				indicator: !1,
-				onFocusin: te,
-				onFocusout: R
-			}, {
-				default: J(() => [(H(!0), F(j, null, ce(i.value, (e) => (H(), N(K(St), {
-					key: e.id,
-					value: e.id,
-					class: "dock-layer-tab",
-					title: e.label,
-					"aria-label": e.label ?? e.id
-				}, {
-					default: J(() => [ee(e.icon) ? (H(), N(le(e.icon), {
-						key: 0,
-						class: "size-4"
-					})) : typeof e.icon == "string" ? (H(), F("span", At, de(e.icon), 1)) : (H(), F("span", jt, de((e.label ?? e.id).charAt(0)), 1))]),
-					_: 2
-				}, 1032, [
-					"value",
-					"title",
-					"aria-label"
-				]))), 128)), L(K(Ct), {
-					class: "dock-layer-tab-indicator",
-					surface: !1
-				})]),
-				_: 1
-			}, 8, ["class", "style"])]),
-			_: 1
-		}, 8, ["modelValue", "orientation"])) : P("", !0), I("div", {
-			ref_key: "containerEl",
-			ref: a,
-			class: "dock-layer-stack",
-			style: V(k.value),
-			onTransitionend: s[1] ||= (...e) => K(T) && K(T)(...e)
-		}, [G(r.$slots, "default")], 36)], 6));
-	}
-}), Nt = [
+			default: Z(() => [K(t.$slots, "default")]),
+			_: 3
+		}, 8, ["active"])], 14, pt));
+	}
+}), yt = [
 	"inert",
 	"aria-hidden",
 	"tabindex"
-], Pt = /* @__PURE__ */ R({
+], bt = { class: "dock-face-content" }, xt = /* @__PURE__ */ P({
 	__name: "DockLayer",
 	props: {
 		id: {},
@@ -1509,37 +1042,43 @@ var At = { key: 1 }, jt = { key: 2 }, Mt = /* @__PURE__ */ R({
 		icon: {}
 	},
 	setup(e) {
-		let t = e, n = Ot();
-		ae(() => {
-			n.register({
+		let t = e, n = dt(), r = Y("hostEl");
+		te(() => {
+			r.value && n.register({
 				id: t.id,
 				label: t.label,
-				icon: t.icon
+				icon: t.icon,
+				el: r.value
 			});
-		}), ie(() => {
-			n.unregister(t.id);
-		});
-		let r = M(() => n.currentLayerId.value === t.id), i = M(() => n.leavingLayerId.value === t.id), a = he("hostEl");
-		return q(r, async (e, t) => {
-			!e || t || typeof document < "u" && (() => {
-				let e = document.activeElement;
-				return !e || e === document.body ? !0 : !!e.closest("[inert]");
-			})() && (await re(), a.value?.focus());
-		}), (e, t) => (H(), F("div", {
+		}), X(() => [
+			t.id,
+			t.label,
+			t.icon
+		], (e, i) => {
+			i && i[0] !== e[0] && n.unregister(i[0]), r.value && n.register({
+				id: t.id,
+				label: t.label,
+				icon: t.icon,
+				el: r.value
+			});
+		}), ee(() => n.unregister(t.id));
+		let i = O(() => n.activeId.value === t.id), a = O(() => n.leavingId.value === t.id);
+		return (e, t) => (H(), j("div", {
 			ref_key: "hostEl",
-			ref: a,
-			class: B(["dock-layer-item-host", {
-				"is-active": r.value,
-				"is-leaving": i.value
+			ref: r,
+			class: R(["dock-face", {
+				"is-active": i.value,
+				"is-leaving": a.value
 			}]),
-			inert: r.value ? void 0 : !0,
-			"aria-hidden": r.value ? void 0 : !0,
-			tabindex: r.value ? -1 : void 0
-		}, [G(e.$slots, "default")], 10, Nt));
+			inert: i.value ? void 0 : !0,
+			"aria-hidden": i.value ? void 0 : !0,
+			tabindex: i.value ? -1 : void 0
+		}, [M("div", bt, [K(e.$slots, "default")])], 10, yt));
 	}
-}), Ft = /* @__PURE__ */ R({
-	__name: "DockIconButton",
+}), St = /* @__PURE__ */ P({
+	__name: "DockControl",
 	props: {
+		shape: { default: "icon" },
 		compact: {
 			type: Boolean,
 			default: !1
@@ -1567,32 +1106,76 @@ var At = { key: 1 }, jt = { key: 2 }, Mt = /* @__PURE__ */ R({
 		] }
 	},
 	setup(t) {
-		let n = t, r = M(() => e("dock-icon-button glass-specular-track glass-capsule-hover", { "glass-capsule": n.active }, { "dock-icon-button--compact": n.compact }, n.class)), i = M(() => ({
-			...n.active ? {
+		let a = t, o = O(() => a.shape === "tab"), s = O(() => o.value ? e("dock-tab-button glass-specular-track", a.class) : e("dock-icon-button glass-specular-track glass-capsule-hover", { "glass-capsule": a.active }, { "dock-icon-button--compact": a.compact }, a.class)), c = O(() => ({
+			...a.active ? {
 				"aria-pressed": "true",
 				"data-active": ""
 			} : {},
-			...n.disabled ? {
-				...n.as === "button" && !n.asChild ? { disabled: !0 } : {},
+			...a.disabled ? {
+				...a.as === "button" && !a.asChild ? { disabled: !0 } : {},
 				"aria-disabled": "true"
 			} : {}
-		})), a = M(() => !n.asChild && n.as === "button" ? { type: n.type } : {});
-		return (e, n) => ge((H(), N(K(ye), z({
+		})), l = O(() => !a.asChild && a.as === "button" ? { type: a.type } : {}), u = n("press"), d = i({
+			squish: !0,
+			response: u.response,
+			dampingFraction: u.dampingFraction,
+			pressVar: "--dock-press-t",
+			shrinkDepth: .04,
+			maxStretch: 1.03
+		}), f = O(() => o.value ? {} : { ...d.pressStyle.value });
+		return (e, n) => Q((H(), k(J(le), I({
 			as: t.as,
 			"as-child": t.asChild
 		}, {
-			...a.value,
-			...i.value
-		}, { class: r.value }), {
-			default: J(() => [G(e.$slots, "default")]),
+			...l.value,
+			...c.value
+		}, {
+			class: s.value,
+			style: f.value,
+			onPointerdown: n[0] ||= (e) => !o.value && J(d).press(),
+			onPointerup: n[1] ||= (e) => !o.value && J(d).release(),
+			onPointercancel: n[2] ||= (e) => !o.value && J(d).release(),
+			onPointerleave: n[3] ||= (e) => !o.value && J(d).release()
+		}), {
+			default: Z(() => [K(e.$slots, "default")]),
 			_: 3
 		}, 16, [
 			"as",
 			"as-child",
-			"class"
-		])), [[K(s)]]);
+			"class",
+			"style"
+		])), [[J(r)]]);
+	}
+}), Ct = /* @__PURE__ */ P({
+	inheritAttrs: !1,
+	__name: "DockTrigger",
+	props: {
+		for: { default: "select" },
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(t) {
+		let n = t, i = O(() => e("dock-trigger", n.for === "select" && "dock-select-trigger", n.for !== "select" && "dock-dropdown-trigger", n.class));
+		return (e, t) => n.for === "select" ? Q((H(), k(J(de), I({ key: 0 }, e.$attrs, { class: i.value }), {
+			default: Z(() => [K(e.$slots, "default"), N(J(ue), { "as-child": "" }, {
+				default: Z(() => [K(e.$slots, "icon", {}, () => [N(J(fe), { class: "dock-select-trigger__chevron" })])]),
+				_: 3
+			})]),
+			_: 3
+		}, 16, ["class"])), [[J(r)]]) : n.for === "dropdown" ? Q((H(), k(J(se), I({ key: 1 }, e.$attrs, { class: i.value }), {
+			default: Z(() => [K(e.$slots, "default")]),
+			_: 3
+		}, 16, ["class"])), [[J(r)]]) : Q((H(), k(J(ce), I({ key: 2 }, e.$attrs, { class: i.value }), {
+			default: Z(() => [K(e.$slots, "default")]),
+			_: 3
+		}, 16, ["class"])), [[J(r)]]);
 	}
-}), It = /* @__PURE__ */ R({
+}), wt = /* @__PURE__ */ P({
 	__name: "DockBackgroundToggle",
 	props: {
 		paused: {
@@ -1603,23 +1186,23 @@ var At = { key: 1 }, jt = { key: 2 }, Mt = /* @__PURE__ */ R({
 		playLabel: { default: "Resume background animation" }
 	},
 	emits: ["update:paused"],
-	setup(e, { emit: n }) {
-		let i = e, a = n, o = M(() => i.paused ? i.playLabel : i.pauseLabel);
-		function s() {
-			a("update:paused", !i.paused);
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = O(() => n.paused ? n.playLabel : n.pauseLabel);
+		function a() {
+			r("update:paused", !n.paused);
 		}
-		return (n, i) => (H(), N(Ft, {
+		return (t, n) => (H(), k(St, {
 			type: "button",
 			"aria-pressed": e.paused,
-			"aria-label": o.value,
-			title: o.value,
-			onClick: s
+			"aria-label": i.value,
+			title: i.value,
+			onClick: a
 		}, {
-			default: J(() => [e.paused ? (H(), N(K(t), {
+			default: Z(() => [e.paused ? (H(), k(J(he), {
 				key: 0,
 				size: 18,
 				"aria-hidden": "true"
-			})) : (H(), N(K(r), {
+			})) : (H(), k(J(me), {
 				key: 1,
 				size: 18,
 				"aria-hidden": "true"
@@ -1631,254 +1214,194 @@ var At = { key: 1 }, jt = { key: 2 }, Mt = /* @__PURE__ */ R({
 			"title"
 		]));
 	}
-}), Lt = /* @__PURE__ */ R({
-	__name: "DockTabButton",
-	props: {
-		as: { default: "button" },
-		asChild: {
-			type: Boolean,
-			default: !1
-		},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] }
-	},
-	setup(t) {
-		let n = t, r = M(() => e("dock-tab-button", n.class));
-		return (e, n) => ge((H(), N(K(ye), {
-			as: t.as,
-			"as-child": t.asChild,
-			class: B(r.value)
-		}, {
-			default: J(() => [G(e.$slots, "default")]),
-			_: 3
-		}, 8, [
-			"as",
-			"as-child",
-			"class"
-		])), [[K(s)]]);
-	}
-}), Rt = /* @__PURE__ */ R({
-	__name: "DockSelectTrigger",
-	props: {
-		disabled: { type: Boolean },
-		reference: {},
-		asChild: { type: Boolean },
-		as: {},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] }
-	},
-	setup(t) {
-		let n = t, r = Te(M(() => {
-			let { class: e, ...t } = n;
-			return t;
-		}));
-		return (t, a) => ge((H(), N(K(xe), z(K(r), { class: K(e)("dock-trigger dock-select-trigger", n.class) }), {
-			default: J(() => [G(t.$slots, "default"), L(K(be), { "as-child": "" }, {
-				default: J(() => [G(t.$slots, "icon", {}, () => [L(K(i), { class: "dock-select-trigger__chevron" })])]),
-				_: 3
-			})]),
-			_: 3
-		}, 16, ["class"])), [[K(s)]]);
-	}
-}), zt = /* @__PURE__ */ R({
-	__name: "DockDropdownTrigger",
-	props: {
-		disabled: { type: Boolean },
-		asChild: { type: Boolean },
-		as: {},
-		type: {},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] }
-	},
-	setup(t) {
-		let n = t, r = Te(M(() => {
-			let { class: e, ...t } = n;
-			return t;
-		}));
-		return (t, i) => ge((H(), N(K(_e), z(K(r), { class: K(e)("dock-trigger dock-dropdown-trigger", n.class) }), {
-			default: J(() => [G(t.$slots, "default")]),
-			_: 3
-		}, 16, ["class"])), [[K(s)]]);
-	}
-}), Bt = /* @__PURE__ */ R({
-	__name: "DockPopoverTrigger",
-	props: {
-		asChild: { type: Boolean },
-		as: {},
-		type: {},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] }
-	},
-	setup(t) {
-		let n = t, r = Te(M(() => {
-			let { class: e, ...t } = n;
-			return t;
-		}));
-		return (t, i) => ge((H(), N(K(ve), z(K(r), { class: K(e)("dock-trigger dock-dropdown-trigger", n.class) }), {
-			default: J(() => [G(t.$slots, "default")]),
-			_: 3
-		}, 16, ["class"])), [[K(s)]]);
-	}
-}), Vt = [
+}), Tt = [
 	"data-orientation",
 	"data-rail-anchor",
 	"aria-orientation"
-], Ht = /* @__PURE__ */ R({
+], Et = /* @__PURE__ */ P({
 	__name: "DockSeparator",
 	props: { anchor: {
 		type: Boolean,
 		default: !1
 	} },
 	setup(e) {
-		let t = v(), n = M(() => t?.orientation.value ?? "horizontal"), r = M(() => n.value), i = M(() => n.value === "vertical" ? "horizontal" : "vertical");
-		return (t, n) => (H(), F("div", {
-			class: B(["dock-separator", { "dock-separator--anchor": e.anchor }]),
+		let t = p(), 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, Vt));
+		}, null, 10, Tt));
 	}
 });
 //#endregion
-//#region src/components/custom/dock/composables/railProjection.ts
-function Ut(e, t) {
-	return t <= 0 ? 0 : ((e + t / 2) % t + t) % t - t / 2;
-}
-function Wt(e, t, n) {
-	let r = 0, i = t, a = Math.floor(e);
-	for (let e = 0; e < a; e++) r += i, i /= n;
-	return r += (e - a) * i, r;
-}
-var Gt = {
-	slotSpacing: 44,
-	tierRatio: 1.618,
-	fadeStart: .5,
-	fadeRange: 2.5,
-	fadeMinAlpha: 0,
-	scaleStep: .06,
-	scaleClampSlots: 4
-};
-function Kt(e, t, n, r = {}) {
-	let i = Math.max(0, Math.floor(e));
-	if (i === 0) return [];
-	let a = {
-		...Gt,
-		...r
-	}, o = Math.ceil(a.fadeRange + 1), s = /* @__PURE__ */ new Set(), c = [];
-	for (let e = -o; e <= o; e++) {
-		let r = ((Math.round(t) + e) % i + i) % i;
-		if (s.has(r)) continue;
-		s.add(r);
-		let o = Ut(r - t, i), l = Math.abs(o), u = Wt(l, a.slotSpacing, a.tierRatio), d = Math.sign(o) * u * n, f = 1 - (l - a.fadeStart) / Math.max(1e-6, a.fadeRange), p = Math.min(1, Math.max(a.fadeMinAlpha, f)), m = l === 0 ? 1 : p * n, h = 1 - Math.min(l, a.scaleClampSlots) * a.scaleStep;
-		c.push({
-			index: r,
-			offset: o,
-			translate: d,
-			opacity: m,
-			scale: h,
-			active: l === 0
-		});
+//#region src/components/dock/composables/useDockPopover.ts
+function Dt(e) {
+	let t = W(!1), n = e.gap ?? 8, r = e.viewportMargin ?? 8, i = e.hoverIntentMs ?? 60, a = e.hoverGraceMs ?? 120, o = null, s = null, c = !1;
+	function l() {
+		o != null && (clearTimeout(o), o = null);
+	}
+	function u() {
+		s != null && (clearTimeout(s), s = null);
+	}
+	function d() {
+		let t = e.anchor(), i = e.popover.value;
+		if (!t || !i) return;
+		let a = t.getBoundingClientRect(), o = i.offsetWidth, s = i.offsetHeight, c = re(e.side) ?? "top", l = re(e.align) ?? "center", u = (e, t, n) => l === "start" ? e : l === "end" ? e + t - n : e + t / 2 - n / 2, d = 0, f = 0;
+		switch (c) {
+			case "bottom":
+				d = a.bottom + n, f = u(a.left, a.width, o);
+				break;
+			case "left":
+				f = a.left - o - n, d = u(a.top, a.height, s);
+				break;
+			case "right":
+				f = a.right + n, d = u(a.top, a.height, s);
+				break;
+			default:
+				d = a.top - s - n, f = u(a.left, a.width, o);
+				break;
+		}
+		let p = Math.max(r, window.innerWidth - o - r), m = Math.max(r, window.innerHeight - s - r);
+		f = Math.min(Math.max(f, r), p), d = Math.min(Math.max(d, r), m), i.style.position = "fixed", i.style.margin = "0", i.style.inset = "auto", i.style.top = `${Math.round(d)}px`, i.style.left = `${Math.round(f)}px`;
+	}
+	function f() {
+		d();
+	}
+	function p(t) {
+		let n = t.target, r = e.popover.value, i = e.anchor();
+		n && (r && r.contains(n) || i && i.contains(n)) || _();
+	}
+	function m() {
+		c || (c = !0, window.addEventListener("resize", f), window.addEventListener("scroll", f, !0), document.addEventListener("pointerdown", p, !0));
+	}
+	function h() {
+		c && (c = !1, window.removeEventListener("resize", f), window.removeEventListener("scroll", f, !0), document.removeEventListener("pointerdown", p, !0));
+	}
+	function g() {
+		l(), u();
+		let n = e.popover.value;
+		if (!(!n || t.value)) {
+			try {
+				n.showPopover();
+			} catch {}
+			t.value = !0, d(), m();
+		}
+	}
+	function _() {
+		l(), u();
+		let n = e.popover.value;
+		if (!n || !t.value) return;
+		let r = n.contains(document.activeElement);
+		try {
+			n.hidePopover();
+		} catch {}
+		t.value = !1, h(), r && e.anchor()?.focus();
+	}
+	function v() {
+		t.value ? _() : g();
+	}
+	function y() {
+		u(), !t.value && (l(), o = setTimeout(() => {
+			o = null, g();
+		}, i));
+	}
+	function b() {
+		l(), T();
+	}
+	function x() {
+		l(), u();
+	}
+	function S() {
+		T();
+	}
+	function C() {
+		l(), u(), g();
+	}
+	function w(t) {
+		let n = t.relatedTarget, r = e.popover.value, i = e.anchor();
+		n && (r && r.contains(n) || i && i.contains(n)) || _();
 	}
-	return c.sort((e, t) => e.index - t.index), c;
+	function T() {
+		u(), s = setTimeout(() => {
+			s = null, _();
+		}, a);
+	}
+	return B(() => {
+		l(), u(), h();
+		let n = e.popover.value;
+		if (n && t.value) try {
+			n.hidePopover();
+		} catch {}
+	}), {
+		open: t,
+		show: g,
+		hide: _,
+		toggle: v,
+		place: d,
+		onAnchorEnter: y,
+		onAnchorLeave: b,
+		onPopoverEnter: x,
+		onPopoverLeave: S,
+		onFocusIn: C,
+		onFocusOut: w
+	};
 }
 //#endregion
-//#region src/components/custom/dock/DockStack.vue?vue&type=script&setup=true&lang.ts
-var qt = ["data-orientation", "data-mode"], Jt = /* @__PURE__ */ R({
+//#region src/components/dock/DockStack.vue?vue&type=script&setup=true&lang.ts
+var Ot = ["data-orientation", "data-mode"], kt = ["data-scrolls", "data-wrap"], At = /* @__PURE__ */ P({
 	__name: "DockStack",
-	props: /* @__PURE__ */ ne({
+	props: /* @__PURE__ */ F({
 		items: {},
 		mode: { default: "stack" },
 		core: {},
 		coreLabel: { default: "Open stack" },
 		visibleCount: { default: 3 },
-		position: { default: "end" }
-	}, {
-		selected: {},
-		selectedModifiers: {},
-		expanded: {
+		wrap: {
 			type: Boolean,
 			default: !1
 		},
-		expandedModifiers: {}
+		position: { default: "end" }
+	}, {
+		selected: {},
+		selectedModifiers: {}
 	}),
-	emits: /* @__PURE__ */ ne(["select"], ["update:selected", "update:expanded"]),
+	emits: /* @__PURE__ */ F(["select"], ["update:selected"]),
 	setup(e, { emit: t }) {
-		let r = e, i = t, a = pe(e, "selected"), o = pe(e, "expanded"), s = v(), c = M(() => s?.orientation.value ?? "vertical"), l = M(() => r.core ?? n), u = M(() => [...r.items]), d = M(() => u.value.length > r.visibleCount), f = M(() => Math.min(u.value.length, r.visibleCount)), p = M(() => r.mode === "facets"), m = M(() => Math.max(0, u.value.findIndex((e) => e.id === a.value))), h = M(() => p.value ? Kt(u.value.length, m.value, 1) : []);
+		let n = e, r = t, i = ae(e, "selected"), a = p(), o = O(() => a?.orientation.value ?? "vertical"), s = O(() => n.core ?? pe), c = O(() => [...n.items]), l = O(() => n.mode === "facets"), u = O(() => c.value.length > n.visibleCount), d = `dock-stack-fan-${ie()}`, f = Y("stackRoot"), m = Y("fanEl"), h = Dt({
+			anchor: () => f.value?.querySelector(".dock-stack-core") ?? null,
+			popover: m,
+			side: () => o.value === "vertical" ? "right" : "top",
+			align: O(() => n.position === "start" ? "start" : "end")
+		});
 		function g(e) {
-			let t = h.value.find((t) => t.index === e);
-			return t ? {
-				scale: t.scale,
-				opacity: t.opacity
-			} : {
-				scale: 1,
-				opacity: 1
-			};
-		}
-		let _ = null;
-		function y() {
-			_ != null && (clearTimeout(_), _ = null);
-		}
-		function b() {
-			y(), _ = setTimeout(() => {
-				o.value = !0, _ = null;
-			}, 60);
+			i.value = e.id, e.onSelect?.(), r("select", e.id), h.hide();
 		}
-		function x() {
-			y(), o.value = !1;
-		}
-		function S() {
-			y(), o.value = !0;
-		}
-		function C(e) {
-			let t = e.relatedTarget, n = e.currentTarget;
-			n && t && n.contains(t) || (o.value = !1);
-		}
-		ie(y);
-		function T(e) {
-			a.value = e.id, e.onSelect?.(), i("select", e.id);
-		}
-		return (t, n) => (H(), F("div", {
-			class: B(["dock-stack", [
-				c.value,
-				`at-${e.position}`,
+		return (t, n) => (H(), j("div", {
+			ref_key: "stackRoot",
+			ref: f,
+			class: R(["dock-stack", [
+				o.value,
 				`mode-${e.mode}`,
-				{ "is-expanded": o.value }
+				`at-${e.position}`
 			]]),
-			"data-orientation": c.value,
+			"data-orientation": o.value,
 			"data-mode": e.mode,
-			onPointerenter: b,
-			onPointerleave: x,
-			onFocusin: S,
-			onFocusout: C
-		}, [L(Ft, {
+			onFocusin: n[3] ||= (...e) => J(h).onFocusIn && J(h).onFocusIn(...e),
+			onFocusout: n[4] ||= (e) => J(h).onFocusOut(e)
+		}, [N(St, {
 			type: "button",
 			class: "dock-stack-core",
 			"aria-label": e.coreLabel,
-			"aria-expanded": o.value,
-			title: e.coreLabel
+			"aria-expanded": J(h).open.value,
+			"aria-controls": d,
+			title: e.coreLabel,
+			onPointerenter: J(h).onAnchorEnter,
+			onPointerleave: J(h).onAnchorLeave,
+			onClick: J(h).toggle
 		}, {
-			default: J(() => [(H(), N(le(l.value), {
+			default: Z(() => [(H(), k(q(s.value), {
 				class: "size-4",
 				"aria-hidden": "true"
 			}))]),
@@ -1886,37 +1409,51 @@ var qt = ["data-orientation", "data-mode"], Jt = /* @__PURE__ */ R({
 		}, 8, [
 			"aria-label",
 			"aria-expanded",
-			"title"
-		]), L(w, {
-			axis: c.value === "vertical" ? "x" : "y",
-			class: "dock-stack-fan",
-			style: V({ "--dock-stack-visible": f.value }),
-			"data-scrolls": d.value || void 0
+			"title",
+			"onPointerenter",
+			"onPointerleave",
+			"onClick"
+		]), M("div", {
+			id: d,
+			ref_key: "fanEl",
+			ref: m,
+			popover: "manual",
+			class: R(["dock-stack-fan", [
+				o.value,
+				`mode-${e.mode}`,
+				{ "mode-facets": l.value }
+			]]),
+			"data-scrolls": u.value && !e.wrap || void 0,
+			"data-wrap": e.wrap || void 0,
+			onPointerenter: n[0] ||= (...e) => J(h).onPopoverEnter && J(h).onPopoverEnter(...e),
+			onPointerleave: n[1] ||= (...e) => J(h).onPopoverLeave && J(h).onPopoverLeave(...e),
+			onKeydown: n[2] ||= oe((...e) => J(h).hide && J(h).hide(...e), ["escape"])
+		}, [N(y, {
+			axis: o.value === "vertical" ? "x" : "y",
+			class: "dock-stack-fan-scroll",
+			"data-scrolls": u.value && !e.wrap || void 0,
+			"data-wrap": e.wrap || void 0
 		}, {
-			default: J(() => [(H(!0), F(j, null, ce(u.value, (e, t) => (H(), N(Ft, {
+			default: Z(() => [(H(!0), j(D, null, G(c.value, (e, t) => (H(), k(St, {
 				key: e.id,
 				type: "button",
-				class: B(["dock-stack-member", {
-					"is-active": a.value === e.id,
-					"dock-facet-chip": p.value
+				class: R(["dock-stack-member", {
+					"is-active": i.value === e.id,
+					"dock-facet-chip": l.value
 				}]),
-				style: V({
+				style: z({
 					"--i": t,
-					...p.value && e.accent ? {
+					...l.value && e.accent ? {
 						"--glass-accent": e.accent,
 						"--glass-accent-strength": "var(--dock-facet-accent-strength)"
-					} : {},
-					...p.value ? {
-						"--dock-facet-tier-scale": `${g(t).scale}`,
-						"--dock-facet-tier-opacity": `${g(t).opacity}`
 					} : {}
 				}),
 				"aria-label": e.label,
-				"aria-pressed": a.value === e.id,
+				"aria-pressed": i.value === e.id,
 				title: e.label,
-				onClick: (t) => T(e)
+				onClick: (t) => g(e)
 			}, {
-				default: J(() => [(H(), N(le(e.icon ?? l.value), {
+				default: Z(() => [(H(), k(q(e.icon ?? s.value), {
 					class: "size-4",
 					"aria-hidden": "true"
 				}))]),
@@ -1932,15 +1469,15 @@ var qt = ["data-orientation", "data-mode"], Jt = /* @__PURE__ */ R({
 			_: 1
 		}, 8, [
 			"axis",
-			"style",
-			"data-scrolls"
-		])], 42, qt));
+			"data-scrolls",
+			"data-wrap"
+		])], 42, kt)], 42, Ot));
 	}
-}), Yt = ["aria-label"], Xt = [
+}), jt = ["aria-label"], Mt = [
 	"data-kind",
 	"data-section-id",
 	"aria-label"
-], Zt = /* @__PURE__ */ R({
+], Nt = /* @__PURE__ */ P({
 	__name: "DockSection",
 	props: {
 		sections: {},
@@ -1948,7 +1485,7 @@ var qt = ["data-orientation", "data-mode"], Jt = /* @__PURE__ */ R({
 		ariaLabel: { default: "Dock sections" }
 	},
 	setup(e) {
-		let t = e, n = M(() => {
+		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;
@@ -1962,33 +1499,33 @@ var qt = ["data-orientation", "data-mode"], Jt = /* @__PURE__ */ R({
 		function a(e) {
 			return `dock-section-zone--${e === "rail-core" ? "core" : e}`;
 		}
-		return (t, n) => (H(), F("div", {
+		return (t, n) => (H(), j("div", {
 			class: "dock-section",
 			role: "group",
 			"aria-label": e.ariaLabel
-		}, [(H(!0), F(j, null, ce(e.sections, (e, n) => (H(), F(j, { key: e.id }, [r(n) ? (H(), N(Ht, {
+		}, [(H(!0), j(D, null, G(e.sections, (e, n) => (H(), j(D, { key: e.id }, [r(n) ? (H(), k(Et, {
 			key: 0,
 			anchor: i(e)
-		}, null, 8, ["anchor"])) : P("", !0), I("div", {
-			class: B(["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
-		}, [G(t.$slots, e.id, {
+		}, [K(t.$slots, e.id, {
 			section: e,
 			kind: e.kind
-		})], 10, Xt)], 64))), 128))], 8, Yt));
+		})], 10, Mt)], 64))), 128))], 8, jt));
 	}
 });
 //#endregion
-//#region src/components/custom/dock/composables/useDockSearch.ts
-function Qt(e) {
+//#region src/components/dock/composables/useDockSearch.ts
+function Pt(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 = te({
+	let c = E({
 		items: o,
 		debounceMs: n,
 		maxResults: r,
@@ -1996,7 +1533,7 @@ function Qt(e) {
 	});
 	if (e.onSearch) {
 		let t = e.onSearch;
-		q(() => c.query.value, (e) => {
+		X(() => c.query.value, (e) => {
 			if (a?.abort(), !e) {
 				i.value = [];
 				return;
@@ -2009,7 +1546,7 @@ function Qt(e) {
 			});
 		});
 	}
-	let l = M(() => {
+	let l = O(() => {
 		let e = c.query.value;
 		if (!e) return "";
 		let t = c.results.value[0];
@@ -2029,10 +1566,10 @@ function Qt(e) {
 		d.value && (d.value = !1, c.close(), t.release());
 	}
 	let m = null;
-	return e.collapseOnScroll && e.scrollContainer && (m = A(e.scrollContainer, {
+	return e.collapseOnScroll && e.scrollContainer && (m = w(e.scrollContainer, {
 		collapseOnScroll: !0,
 		chromeRef: e.chromeRef
-	})), oe(() => {
+	})), B(() => {
 		a?.abort(), a = null;
 	}), {
 		fuzzy: c,
@@ -2045,104 +1582,14 @@ function Qt(e) {
 	};
 }
 //#endregion
-//#region src/components/custom/dock/composables/useDockOrientationMorph.ts
-function $t(e) {
-	let { rootEl: t } = e, n = W("vertical"), r = W(0), i = W(!1), a = () => {
-		let e = t.value;
-		if (!e) return 1.14;
-		let n = getComputedStyle(e).getPropertyValue("--dock-morph-max-stretch").trim(), r = n ? Number.parseFloat(n) : NaN;
-		return c(e, Number.isFinite(r) && r >= 1 ? r : 1.14);
-	}, s = o({
-		from: e.verticalSize,
-		to: 0,
-		axis: "height",
-		maxStretch: a
-	}), u = o({
-		from: 0,
-		to: e.horizontalSize,
-		axis: "width",
-		maxStretch: a
-	}), d = null;
-	function f(e) {
-		r.value = e, s.drive(e), u.drive(e);
-		let n = t.value;
-		n && (n.style.setProperty("--dock-morph-t", `${e}`), n.style.setProperty("--stretch", `${Math.max(s.stretch.value, u.stretch.value)}`), l(n, Math.max(s.flexVel.value, u.flexVel.value)));
-	}
-	function p() {
-		d &&= (d.dispose(), null);
-	}
-	function m() {
-		return typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-	}
-	function h(e) {
-		if (m()) {
-			v(e);
-			return;
-		}
-		let n = t.value, a = d !== null && !d.settled ? d.velocity : 0;
-		if (!d || d.settled) {
-			p(), d = new X({
-				response: S.response,
-				dampingFraction: S.dampingFraction,
-				initial: r.value,
-				respectReducedMotion: !0
-			});
-			let o = d;
-			o.reset(r.value, a), o.target = e, i.value = !0, n && n.setAttribute("data-morphing", ""), o.play((e) => {
-				if (f(e), o.settled) {
-					i.value = !1;
-					let e = t.value;
-					e && e.removeAttribute("data-morphing");
-				}
-			});
-		} else d.reset(r.value, a), d.target = e;
-	}
-	function g(e) {
-		e === n.value && !i.value || (n.value = e, h(+(e === "horizontal")));
-	}
-	function _() {
-		g(n.value === "vertical" ? "horizontal" : "vertical");
-	}
-	function v(e) {
-		let r = e < 0 ? 0 : e > 1 ? 1 : e;
-		p(), i.value = !1, n.value = r >= .5 ? "horizontal" : "vertical", f(r), f(r);
-		let a = t.value;
-		a && a.removeAttribute("data-morphing");
-	}
-	function y(e) {
-		let t = Math.min(Math.max(e / .5, 0), 1);
-		return 1 - t * t * (3 - 2 * t);
-	}
-	function b(e) {
-		let t = Math.min(Math.max((e - .5) / .5, 0), 1);
-		return t * t * (3 - 2 * t);
-	}
-	let x = M(() => s.sizeStyle.value), C = M(() => u.sizeStyle.value), w = M(() => ({ opacity: String(y(r.value)) })), T = M(() => ({ opacity: String(b(r.value)) })), E = M(() => Math.max(s.stretch.value, u.stretch.value));
-	return q(t, (e) => {
-		e && e.style.setProperty("--dock-morph-t", `${r.value}`);
-	}, { immediate: !0 }), oe(p), {
-		orientation: n,
-		t: r,
-		morphing: i,
-		verticalStyle: x,
-		horizontalStyle: C,
-		verticalOpacity: w,
-		horizontalOpacity: T,
-		stretch: E,
-		morphTo: g,
-		toggle: _,
-		pin: v
-	};
-}
-//#endregion
-//#region src/components/custom/goo-filter/GooFilter.vue?vue&type=script&setup=true&lang.ts
-var en = {
+//#region src/components/goo-filter/GooFilter.vue?vue&type=script&setup=true&lang.ts
+var Ft = {
 	class: "goo-filter-host",
 	"aria-hidden": "true",
 	focusable: "false",
 	width: "1",
 	height: "1"
-}, tn = ["id"], nn = ["stdDeviation"], rn = ["values"], an = /* @__PURE__ */ u(/* @__PURE__ */ R({
+}, It = ["id"], Lt = ["stdDeviation"], Rt = ["values"], zt = /* @__PURE__ */ o(/* @__PURE__ */ P({
 	__name: "GooFilter",
 	props: { extra: { default: () => [] } },
 	setup(e) {
@@ -2160,10 +1607,10 @@ var en = {
 				offset: -9
 			},
 			{
-				id: "pager-goo",
-				blur: 8,
+				id: "pager-worm-goo",
+				blur: 4,
 				slope: 18,
-				offset: -7
+				offset: -6
 			},
 			{
 				id: "dock-morph-goo",
@@ -2178,7 +1625,7 @@ var en = {
 				offset: -7
 			}
 		], n = e, r = [...t, ...n.extra];
-		return (e, t) => (H(), F("svg", en, [I("defs", null, [(H(), F(j, null, ce(r, (e) => I("filter", {
+		return (e, t) => (H(), j("svg", Ft, [M("defs", null, [(H(), j(D, null, G(r, (e) => M("filter", {
 			key: e.id,
 			id: e.id,
 			"color-interpolation-filters": "sRGB",
@@ -2187,24 +1634,24 @@ var en = {
 			width: "200%",
 			height: "200%"
 		}, [
-			I("feGaussianBlur", {
+			M("feGaussianBlur", {
 				in: "SourceGraphic",
 				stdDeviation: e.blur,
 				result: "blur"
-			}, null, 8, nn),
-			I("feColorMatrix", {
+			}, null, 8, Lt),
+			M("feColorMatrix", {
 				in: "blur",
 				mode: "matrix",
 				values: `1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 ${e.slope} ${e.offset}`,
 				result: "goo"
-			}, null, 8, rn),
-			t[0] ||= I("feComposite", {
+			}, null, 8, Rt),
+			t[0] ||= M("feComposite", {
 				in: "SourceGraphic",
 				in2: "goo",
 				operator: "atop"
 			}, null, -1)
-		], 8, tn)), 64))])]));
+		], 8, It)), 64))])]));
 	}
-}), [["__scopeId", "data-v-25de26c8"]]);
+}), [["__scopeId", "data-v-f8d28853"]]);
 //#endregion
-export { C as DOCK_CONTEXT_KEY, Ae as DOCK_SPLIT_SIGNATURES, It as DockBackgroundToggle, zt as DockDropdownTrigger, Ft as DockIconButton, Pt as DockLayer, Mt as DockLayerGroup, Bt as DockPopoverTrigger, Zt as DockSection, Rt as DockSelectTrigger, Ht as DockSeparator, Jt as DockStack, Lt as DockTabButton, bt as GlassDock, an as GooFilter, y as provideDockContext, x as useDockContext, k as useDockCtaReceive, je as useDockFission, $t as useDockOrientationMorph, Qt as useDockSearch, kt as useLayerTransition, v as useOptionalDockContext };
+export { v as DOCK_CONTEXT_KEY, wt as DockBackgroundToggle, St as DockControl, ft as DockCrossfade, xt as DockLayer, vt as DockLayerGroup, Nt as DockSection, Et as DockSeparator, At as DockStack, Ct as DockTrigger, st as GlassDock, zt as GooFilter, m as provideDockContext, g as useDockContext, x as useDockCtaReceive, Pt as useDockSearch, p as useOptionalDockContext };