@mkbabb/glass-ui 4.0.1 → 4.2.0

package/dist/dotMatrixField-CRO0ZFk4.js

@@ -0,0 +1,48 @@
+//#region src/components/custom/dot-matrix/composables/dotMatrixField.ts
+var e = (1 + Math.sqrt(5)) / 2, t = Math.PI * (3 - Math.sqrt(5));
+function n(e, n) {
+	let r = Math.max(n, 1), i = 1 - 2 * (e + .5) / r, a = Math.sqrt(Math.max(0, 1 - i * i)), o = e * t;
+	return {
+		x: Math.cos(o) * a,
+		y: i,
+		z: Math.sin(o) * a
+	};
+}
+var r = .15, i = .85, a = .6, o = .4;
+function s(e, t = 1) {
+	let n = d(e.z * .5 + .5);
+	return {
+		opacity: r + i * t * n,
+		size: a + o * n,
+		facing: n
+	};
+}
+function c(e, t, n) {
+	let r = n * e, i = Math.sin(t), a = Math.cos(t), o = Math.cos(r), s = Math.sin(r), c = 1 - o;
+	return [
+		o + i * i * c,
+		i * a * c - 0 * s,
+		i * 0 * c + a * s,
+		a * i * c + 0 * s,
+		o + a * a * c,
+		a * 0 * c - i * s,
+		0 * i * c - a * s,
+		0 * a * c + i * s,
+		o + 0 * c
+	];
+}
+function l(e, t) {
+	return {
+		x: e[0] * t.x + e[1] * t.y + e[2] * t.z,
+		y: e[3] * t.x + e[4] * t.y + e[5] * t.z,
+		z: e[6] * t.x + e[7] * t.y + e[8] * t.z
+	};
+}
+function u(e, t, n) {
+	return 1 + t * Math.sin(e * n);
+}
+function d(e) {
+	return e < 0 ? 0 : e > 1 ? 1 : e;
+}
+//#endregion
+export { a, u as c, c as d, e as i, s as l, r as n, o, t as r, l as s, i as t, n as u };

package/dist/drawer.js

@@ -1,28 +1,28 @@
 import { t as e } from "./cn-DJXf4yaB.js";
-import { t } from "./useSurfaceAxis-g0NloYEF.js";
-import { t as n } from "./createContext-CpBNTRMI.js";
-import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createVNode as c, defineComponent as l, mergeProps as u, normalizeClass as d, onUnmounted as f, openBlock as p, ref as m, renderSlot as h, toRef as g, unref as _, watch as v, withCtx as y } from "vue";
-import { DialogClose as b, DialogContent as x, DialogDescription as S, DialogOverlay as C, DialogPortal as w, DialogPortal as T, DialogRoot as E, DialogTitle as D, DialogTrigger as O, useForwardPropsEmits as k } from "reka-ui";
-import { SpringProgress as A } from "@mkbabb/keyframes.js";
+import { t } from "./useSurfaceAxis-Ci7Dnaw2.js";
+import { t as n } from "./createContext-Cd23P9j0.js";
+import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createVNode as c, defineComponent as l, mergeProps as u, normalizeClass as d, onScopeDispose as f, onUnmounted as p, openBlock as m, ref as h, renderSlot as g, toRef as _, unref as v, watch as y, withCtx as b } from "vue";
+import { DialogClose as x, DialogContent as S, DialogDescription as C, DialogOverlay as w, DialogPortal as T, DialogPortal as E, DialogRoot as D, DialogTitle as O, DialogTrigger as k, useForwardPropsEmits as A } from "reka-ui";
+import { SpringProgress as j } from "@mkbabb/keyframes.js";
 //#region src/components/ui/drawer/constants.ts
-var j = {
-	response: .4,
-	dampingFraction: .82
-}, M = [
+var M = {
+	response: .5,
+	dampingFraction: .74
+}, N = [
 	.12,
 	.5,
 	1
 ];
-function N(e) {
-	return e === "left" || e === "right" ? [] : M;
+function P(e) {
+	return e === "left" || e === "right" ? [] : N;
 }
 //#endregion
 //#region src/components/ui/drawer/composables/drawerSnapContext.ts
-var P = n("glass-ui:drawer-snap-context"), { KEY: F } = P;
-function I(e) {
-	P.provide(e);
+var F = n("glass-ui:drawer-snap-context"), { KEY: I } = F;
+function L(e) {
+	F.provide(e);
 }
-var L = P.use, R = /* @__PURE__ */ l({
+var R = F.use, z = /* @__PURE__ */ l({
 	__name: "Drawer",
 	props: {
 		open: {
@@ -41,43 +41,50 @@ var L = P.use, R = /* @__PURE__ */ l({
 		snapPoints: { default: void 0 },
 		activeSnapPoint: { default: void 0 },
 		direction: { default: "bottom" },
-		shouldScaleBackground: {
-			type: Boolean,
-			default: void 0
-		}
+		stage: { default: void 0 }
 	},
 	emits: ["update:open", "update:activeSnapPoint"],
 	setup(e, { emit: t }) {
-		let n = e, a = t, o = r(() => n.open !== void 0), s = m(n.open ?? n.defaultOpen);
-		v(() => n.open, (e) => {
+		let n = e, a = t, o = r(() => n.open !== void 0), s = h(n.open ?? n.defaultOpen);
+		y(() => n.open, (e) => {
 			e !== void 0 && (s.value = e);
 		});
 		function c(e) {
 			s.value = e, a("update:open", e);
 		}
-		let l = r(() => o.value ? n.open : s.value), u = r(() => n.mode === "live-behind"), d = r(() => n.modal ?? !u.value), f = r(() => n.snapPoints && n.snapPoints.length > 0 ? n.snapPoints.map((e) => typeof e == "number" ? e : Number.parseFloat(e)) : N(n.direction)), b = m(n.activeSnapPoint ?? null);
-		v(() => n.activeSnapPoint, (e) => {
-			e !== void 0 && (b.value = e);
-		}), v(b, (e) => a("update:activeSnapPoint", e));
-		let x = m(l.value);
-		return v(l, (e) => x.value = e), v(x, (e) => {
+		let l = r(() => o.value ? n.open : s.value), u = r(() => n.mode === "live-behind"), d = r(() => n.modal ?? !u.value), p = typeof window < "u" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches, x = r(() => {
+			let e = n.stage ?? (u.value ? "none" : "scale");
+			return p && (e === "scale" || e === "immersive") ? "dim" : e;
+		});
+		function S(e) {
+			if (typeof document > "u") return;
+			let t = document.querySelector("[data-stage-wrapper]"), n = document.querySelector("[data-stage-scrim]"), r = e && (x.value === "scale" || x.value === "immersive"), i = e && x.value === "immersive";
+			t && t.toggleAttribute("data-stage-scale", r), n && n.toggleAttribute("data-stage-immersive", i);
+		}
+		y(() => l.value, (e) => S(e), { immediate: !0 }), y(x, () => S(l.value)), f(() => S(!1));
+		let C = r(() => n.snapPoints && n.snapPoints.length > 0 ? n.snapPoints.map((e) => typeof e == "number" ? e : Number.parseFloat(e)) : P(n.direction)), w = h(n.activeSnapPoint ?? null);
+		y(() => n.activeSnapPoint, (e) => {
+			e !== void 0 && (w.value = e);
+		}), y(w, (e) => a("update:activeSnapPoint", e));
+		let T = h(l.value);
+		return y(l, (e) => T.value = e), y(T, (e) => {
 			e !== l.value && c(e);
-		}), I({
-			open: x,
-			snapPoints: f,
-			direction: g(n, "direction"),
-			activeSnapPoint: b
-		}), (e, t) => (p(), i(_(E), {
+		}), L({
+			open: T,
+			snapPoints: C,
+			direction: _(n, "direction"),
+			activeSnapPoint: w
+		}), (e, t) => (m(), i(v(D), {
 			"data-slot": "drawer",
 			open: l.value,
 			modal: d.value,
 			"onUpdate:open": c
 		}, {
-			default: y(() => [h(e.$slots, "default")]),
+			default: b(() => [g(e.$slots, "default")]),
 			_: 3
 		}, 8, ["open", "modal"]));
 	}
-}), z = /* @__PURE__ */ l({
+}), B = /* @__PURE__ */ l({
 	__name: "DrawerOverlay",
 	props: {
 		forceMount: { type: Boolean },
@@ -96,18 +103,21 @@ var L = P.use, R = /* @__PURE__ */ l({
 			let { class: e, ...t } = n;
 			return t;
 		});
-		return (t, r) => (p(), i(_(C), u(a.value, { class: _(e)("fixed inset-0 z-overlay bg-overlay-scrim-strong [backdrop-filter:var(--glass-blur-wash)]", n.class) }), null, 16, ["class"]));
+		return (t, r) => (m(), i(v(w), u(a.value, {
+			"data-stage-scrim": "",
+			class: v(e)("fixed inset-0 z-overlay [backdrop-filter:var(--glass-blur-wash)]", n.class)
+		}), null, 16, ["class"]));
 	}
 });
 //#endregion
 //#region src/components/ui/drawer/composables/useDrawerSnap.ts
-function B(e) {
+function V(e) {
 	return e === "left" || e === "right";
 }
-function V(e, t) {
-	return e.length > 0 ? [...e].sort((e, t) => e - t) : B(t) ? [0, 1] : [1];
-}
 function H(e, t) {
+	return e.length > 0 ? [...e].sort((e, t) => e - t) : V(t) ? [0, 1] : [1];
+}
+function U(e, t) {
 	let n = t[0], r = Math.abs(e - n);
 	for (let i of t) {
 		let t = Math.abs(e - i);
@@ -115,25 +125,25 @@ function H(e, t) {
 	}
 	return n;
 }
-function U(e, t, n) {
+function W(e, t, n) {
 	let r = n.indexOf(e);
-	if (r === -1) return H(e, n);
+	if (r === -1) return U(e, n);
 	let i = r + t;
 	return i < 0 || i >= n.length ? e : n[i];
 }
-function W(e) {
-	let { contentEl: t, handleEl: n, ctx: r } = e, i = m(!1), a = null;
+function G(e) {
+	let { contentEl: t, handleEl: n, ctx: r } = e, i = h(!1), a = null;
 	function o(e) {
 		let n = t.value;
-		n && n.style.setProperty("--glass-drawer-t", `${e}`);
+		n && n.style.setProperty("--glass-drawer-t", `${e}`), document.documentElement.style.setProperty("--stage-t", `${e}`);
 	}
 	function s() {
-		a &&= (a.dispose(), null);
+		a &&= (a.dispose(), null), document.documentElement.style.removeProperty("--stage-t");
 	}
 	function c() {
-		return a || (a = new A({
-			response: j.response,
-			dampingFraction: j.dampingFraction,
+		return a || (a = new j({
+			response: M.response,
+			dampingFraction: M.dampingFraction,
 			initial: l(),
 			respectReducedMotion: !0
 		}), a.play((e) => o(e)), a);
@@ -145,7 +155,7 @@ function W(e) {
 			let t = Number.parseFloat(e);
 			if (!Number.isNaN(t)) return t;
 		}
-		let t = V(r.snapPoints.value, r.direction.value);
+		let t = H(r.snapPoints.value, r.direction.value);
 		return t[t.length - 1] ?? 1;
 	}
 	function u(e) {
@@ -153,9 +163,9 @@ function W(e) {
 		t.target = e, r.activeSnapPoint.value = e;
 	}
 	function d(e) {
-		u(H(e, V(r.snapPoints.value, r.direction.value)));
+		u(U(e, H(r.snapPoints.value, r.direction.value)));
 	}
-	let p = null, h = 0, g = 0, _ = 0, y = 0, b = 0;
+	let f = null, m = 0, g = 0, _ = 0, v = 0, b = 0;
 	function x(e) {
 		let t = r.direction.value;
 		return t === "bottom" ? -e.clientY : t === "top" ? e.clientY : t === "left" ? e.clientX : -e.clientX;
@@ -164,27 +174,27 @@ function W(e) {
 		let e = t.value;
 		if (!e) return 1;
 		let n = e.getBoundingClientRect();
-		return B(r.direction.value) ? n.width || 1 : n.height || 1;
+		return V(r.direction.value) ? n.width || 1 : n.height || 1;
 	}
 	function C(e) {
 		let t = n.value;
-		t && (a && a.stop(), i.value = !0, p = e.pointerId, h = x(e), _ = h, y = e.timeStamp, g = l(), b = 0, t.setPointerCapture?.(e.pointerId));
+		t && (a && a.stop(), i.value = !0, f = e.pointerId, m = x(e), _ = m, v = e.timeStamp, g = l(), b = 0, t.setPointerCapture?.(e.pointerId));
 	}
 	function w(e) {
-		if (p === null || e.pointerId !== p) return;
-		let t = x(e), n = (e.timeStamp - y) / 1e3;
-		n > 0 && (b = (t - _) / n), _ = t, y = e.timeStamp;
-		let i = (t - h) / S(), a = V(r.snapPoints.value, r.direction.value), s = a[0], c = a[a.length - 1];
+		if (f === null || e.pointerId !== f) return;
+		let t = x(e), n = (e.timeStamp - v) / 1e3;
+		n > 0 && (b = (t - _) / n), _ = t, v = e.timeStamp;
+		let i = (t - m) / S(), a = H(r.snapPoints.value, r.direction.value), s = a[0], c = a[a.length - 1];
 		o(Math.min(c, Math.max(s, g + i)));
 	}
 	function T(e) {
-		if (p === null || e.pointerId !== p) return;
-		n.value?.releasePointerCapture?.(e.pointerId), p = null, i.value = !1;
-		let t = V(r.snapPoints.value, r.direction.value), a = E(), o;
+		if (f === null || e.pointerId !== f) return;
+		n.value?.releasePointerCapture?.(e.pointerId), f = null, i.value = !1;
+		let t = H(r.snapPoints.value, r.direction.value), a = E(), o;
 		if (Math.abs(b) >= 450 && t.length > 1) {
 			let e = b > 0 ? 1 : -1;
-			o = U(H(a, t), e, t);
-		} else o = H(a, t);
+			o = W(U(a, t), e, t);
+		} else o = U(a, t);
 		if (o <= 0) {
 			r.open.value = !1;
 			return;
@@ -203,20 +213,20 @@ function W(e) {
 			e.removeEventListener("pointerdown", C), e.removeEventListener("pointermove", w), e.removeEventListener("pointerup", T), e.removeEventListener("pointercancel", T), D = null;
 		};
 	}
-	return v(n, (e) => {
+	return y(n, (e) => {
 		D?.(), e && O(e);
-	}, { immediate: !0 }), v(r.open, (e) => {
+	}, { immediate: !0 }), y(r.open, (e) => {
 		e ? queueMicrotask(() => {
 			o(0), u(l());
 		}) : s();
-	}, { immediate: !0 }), v(r.activeSnapPoint, (e) => {
+	}, { immediate: !0 }), y(r.activeSnapPoint, (e) => {
 		if (!r.open.value || i.value) return;
 		let t = typeof e == "number" ? e : typeof e == "string" ? Number.parseFloat(e) : NaN;
 		if (!Number.isNaN(t) && (!a || Math.abs(a.target - t) > .001)) {
-			let e = V(r.snapPoints.value, r.direction.value);
-			c().target = H(t, e);
+			let e = H(r.snapPoints.value, r.direction.value);
+			c().target = U(t, e);
 		}
-	}), f(() => {
+	}), p(() => {
 		D?.(), s();
 	}), {
 		dragging: i,
@@ -225,7 +235,7 @@ function W(e) {
 }
 //#endregion
 //#region src/components/ui/drawer/DrawerContent.vue?vue&type=script&setup=true&lang.ts
-var G = ["data-dragging"], K = /* @__PURE__ */ l({
+var K = ["data-dragging"], q = /* @__PURE__ */ l({
 	__name: "DrawerContent",
 	props: {
 		forceMount: { type: Boolean },
@@ -254,44 +264,44 @@ var G = ["data-dragging"], K = /* @__PURE__ */ l({
 		"closeAutoFocus"
 	],
 	setup(n, { emit: o }) {
-		let l = n, d = o, f = k(r(() => {
+		let l = n, d = o, f = A(r(() => {
 			let { class: e, showOverlay: t, surface: n, ...r } = l;
 			return r;
-		}), d), g = r(() => t(l.surface).replace(/^glass-\w+\s*/, "")), v = m(null), b = m(null);
-		function S(e) {
+		}), d), p = r(() => t(l.surface).replace(/^glass-\w+\s*/, "")), _ = h(null), y = h(null);
+		function x(e) {
 			if (!e) {
-				v.value = null;
+				_.value = null;
 				return;
 			}
 			let t = e.$el ?? e;
-			v.value = t instanceof HTMLElement ? t : null;
+			_.value = t instanceof HTMLElement ? t : null;
 		}
-		let C = L(), T = C ? W({
-			contentEl: v,
-			handleEl: b,
+		let C = R(), w = C ? G({
+			contentEl: _,
+			handleEl: y,
 			ctx: C
 		}) : null, E = r(() => (C?.snapPoints.value.length ?? 0) > 1), D = r(() => C?.direction.value ?? "bottom"), O = r(() => {
 			if (!C) return;
 			let e = D.value;
 			return e === "bottom" ? { transform: "translateY(calc((1 - var(--glass-drawer-t, 1)) * 100%))" } : e === "top" ? { transform: "translateY(calc((var(--glass-drawer-t, 1) - 1) * 100%))" } : e === "left" ? { transform: "translateX(calc((var(--glass-drawer-t, 1) - 1) * 100%))" } : { transform: "translateX(calc((1 - var(--glass-drawer-t, 1)) * 100%))" };
 		});
-		return (t, n) => (p(), i(_(w), null, {
-			default: y(() => [l.showOverlay ? (p(), i(z, { key: 0 })) : a("", !0), c(_(x), u({ ref: S }, _(f), {
+		return (t, n) => (m(), i(v(T), null, {
+			default: b(() => [l.showOverlay ? (m(), i(B, { key: 0 })) : a("", !0), c(v(S), u({ ref: x }, v(f), {
 				"data-glass-drawer": "",
 				"data-glass-drawer-snap-points": E.value ? "true" : void 0,
 				"data-glass-drawer-direction": D.value,
 				"data-surface": l.surface,
-				class: _(e)("glass-drawer", g.value, l.class),
+				class: v(e)("glass-drawer", p.value, l.class),
 				style: O.value
 			}), {
-				default: y(() => [s("div", {
+				default: b(() => [s("div", {
 					ref_key: "handleEl",
-					ref: b,
+					ref: y,
 					class: "glass-drawer-handle",
 					"data-glass-drawer-handle": "",
-					"data-dragging": _(T)?.dragging.value ? "" : void 0,
+					"data-dragging": v(w)?.dragging.value ? "" : void 0,
 					"aria-hidden": "true"
-				}, [...n[0] ||= [s("span", { class: "glass-drawer-grip" }, null, -1)]], 8, G), h(t.$slots, "default")]),
+				}, [...n[0] ||= [s("span", { class: "glass-drawer-grip" }, null, -1)]], 8, K), g(t.$slots, "default")]),
 				_: 3
 			}, 16, [
 				"data-glass-drawer-snap-points",
@@ -303,7 +313,7 @@ var G = ["data-dragging"], K = /* @__PURE__ */ l({
 			_: 3
 		}));
 	}
-}), q = /* @__PURE__ */ l({
+}), J = /* @__PURE__ */ l({
 	__name: "DrawerHeader",
 	props: { class: { type: [
 		Boolean,
@@ -314,9 +324,9 @@ var G = ["data-dragging"], K = /* @__PURE__ */ l({
 	] } },
 	setup(t) {
 		let n = t;
-		return (t, r) => (p(), o("div", { class: d(_(e)("[--overlay-pad-inline:1rem] [--overlay-pad-block:calc(var(--overlay-pad-inline)*1.272)] [--card-pad-title-gap:calc(var(--overlay-pad-inline)/2.618)]", "grid gap-(--card-pad-title-gap) px-(--overlay-pad-inline) pt-(--overlay-pad-block) pb-0 text-center sm:text-left", n.class)) }, [h(t.$slots, "default")], 2));
+		return (t, r) => (m(), o("div", { class: d(v(e)("[--overlay-pad-inline:1rem] [--overlay-pad-block:calc(var(--overlay-pad-inline)*1.272)] [--card-pad-title-gap:calc(var(--overlay-pad-inline)/2.618)]", "grid gap-(--card-pad-title-gap) px-(--overlay-pad-inline) pt-(--overlay-pad-block) pb-0 text-center sm:text-left", n.class)) }, [g(t.$slots, "default")], 2));
 	}
-}), J = /* @__PURE__ */ l({
+}), Y = /* @__PURE__ */ l({
 	__name: "DrawerFooter",
 	props: { class: { type: [
 		Boolean,
@@ -327,9 +337,9 @@ var G = ["data-dragging"], K = /* @__PURE__ */ l({
 	] } },
 	setup(t) {
 		let n = t;
-		return (t, r) => (p(), o("div", { class: d(_(e)("[--overlay-pad-inline:1rem] [--overlay-pad-block:calc(var(--overlay-pad-inline)*1.272)] [--card-pad-footer:calc(var(--overlay-pad-block)/1.618)]", "mt-auto flex flex-col gap-2 px-(--overlay-pad-inline) pt-(--card-pad-footer) pb-(--overlay-pad-block)", n.class)) }, [h(t.$slots, "default")], 2));
+		return (t, r) => (m(), o("div", { class: d(v(e)("[--overlay-pad-inline:1rem] [--overlay-pad-block:calc(var(--overlay-pad-inline)*1.272)] [--card-pad-footer:calc(var(--overlay-pad-block)/1.618)]", "mt-auto flex flex-col gap-2 px-(--overlay-pad-inline) pt-(--card-pad-footer) pb-(--overlay-pad-block)", n.class)) }, [g(t.$slots, "default")], 2));
 	}
-}), Y = /* @__PURE__ */ l({
+}), X = /* @__PURE__ */ l({
 	__name: "DrawerTitle",
 	props: {
 		asChild: { type: Boolean },
@@ -347,12 +357,12 @@ var G = ["data-dragging"], K = /* @__PURE__ */ l({
 			let { class: e, ...t } = n;
 			return t;
 		});
-		return (t, r) => (p(), i(_(D), u(a.value, { class: _(e)("text-subheading leading-none tracking-tight", n.class) }), {
-			default: y(() => [h(t.$slots, "default")]),
+		return (t, r) => (m(), i(v(O), u(a.value, { class: v(e)("text-subheading leading-none tracking-tight", n.class) }), {
+			default: b(() => [g(t.$slots, "default")]),
 			_: 3
 		}, 16, ["class"]));
 	}
-}), X = /* @__PURE__ */ l({
+}), Z = /* @__PURE__ */ l({
 	__name: "DrawerDescription",
 	props: {
 		asChild: { type: Boolean },
@@ -370,11 +380,11 @@ var G = ["data-dragging"], K = /* @__PURE__ */ l({
 			let { class: e, ...t } = n;
 			return t;
 		});
-		return (t, r) => (p(), i(_(S), u(a.value, { class: _(e)("text-sm text-muted-foreground", n.class) }), {
-			default: y(() => [h(t.$slots, "default")]),
+		return (t, r) => (m(), i(v(C), u(a.value, { class: v(e)("text-sm text-muted-foreground", n.class) }), {
+			default: b(() => [g(t.$slots, "default")]),
 			_: 3
 		}, 16, ["class"]));
 	}
 });
 //#endregion
-export { R as Drawer, b as DrawerClose, K as DrawerContent, X as DrawerDescription, J as DrawerFooter, q as DrawerHeader, z as DrawerOverlay, T as DrawerPortal, Y as DrawerTitle, O as DrawerTrigger };
+export { z as Drawer, x as DrawerClose, q as DrawerContent, Z as DrawerDescription, Y as DrawerFooter, J as DrawerHeader, B as DrawerOverlay, E as DrawerPortal, X as DrawerTitle, k as DrawerTrigger };