@mkbabb/glass-ui 4.0.0 → 4.0.1

package/dist/drawer.js

@@ -0,0 +1,380 @@
+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";
+//#region src/components/ui/drawer/constants.ts
+var j = {
+	response: .4,
+	dampingFraction: .82
+}, M = [
+	.12,
+	.5,
+	1
+];
+function N(e) {
+	return e === "left" || e === "right" ? [] : M;
+}
+//#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 L = P.use, R = /* @__PURE__ */ l({
+	__name: "Drawer",
+	props: {
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: !1
+		},
+		modal: {
+			type: Boolean,
+			default: void 0
+		},
+		mode: { default: "modal" },
+		snapPoints: { default: void 0 },
+		activeSnapPoint: { default: void 0 },
+		direction: { default: "bottom" },
+		shouldScaleBackground: {
+			type: Boolean,
+			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) => {
+			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) => {
+			e !== l.value && c(e);
+		}), I({
+			open: x,
+			snapPoints: f,
+			direction: g(n, "direction"),
+			activeSnapPoint: b
+		}), (e, t) => (p(), i(_(E), {
+			"data-slot": "drawer",
+			open: l.value,
+			modal: d.value,
+			"onUpdate:open": c
+		}, {
+			default: y(() => [h(e.$slots, "default")]),
+			_: 3
+		}, 8, ["open", "modal"]));
+	}
+}), z = /* @__PURE__ */ l({
+	__name: "DrawerOverlay",
+	props: {
+		forceMount: { type: Boolean },
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(t) {
+		let n = t, a = r(() => {
+			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"]));
+	}
+});
+//#endregion
+//#region src/components/ui/drawer/composables/useDrawerSnap.ts
+function B(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) {
+	let n = t[0], r = Math.abs(e - n);
+	for (let i of t) {
+		let t = Math.abs(e - i);
+		t < r && (n = i, r = t);
+	}
+	return n;
+}
+function U(e, t, n) {
+	let r = n.indexOf(e);
+	if (r === -1) return H(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 o(e) {
+		let n = t.value;
+		n && n.style.setProperty("--glass-drawer-t", `${e}`);
+	}
+	function s() {
+		a &&= (a.dispose(), null);
+	}
+	function c() {
+		return a || (a = new A({
+			response: j.response,
+			dampingFraction: j.dampingFraction,
+			initial: l(),
+			respectReducedMotion: !0
+		}), a.play((e) => o(e)), a);
+	}
+	function l() {
+		let e = r.activeSnapPoint.value;
+		if (typeof e == "number") return e;
+		if (typeof e == "string") {
+			let t = Number.parseFloat(e);
+			if (!Number.isNaN(t)) return t;
+		}
+		let t = V(r.snapPoints.value, r.direction.value);
+		return t[t.length - 1] ?? 1;
+	}
+	function u(e) {
+		let t = c();
+		t.target = e, r.activeSnapPoint.value = e;
+	}
+	function d(e) {
+		u(H(e, V(r.snapPoints.value, r.direction.value)));
+	}
+	let p = null, h = 0, g = 0, _ = 0, y = 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;
+	}
+	function S() {
+		let e = t.value;
+		if (!e) return 1;
+		let n = e.getBoundingClientRect();
+		return B(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));
+	}
+	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];
+		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 (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);
+		if (o <= 0) {
+			r.open.value = !1;
+			return;
+		}
+		u(o);
+	}
+	function E() {
+		let e = t.value;
+		if (!e) return l();
+		let n = e.style.getPropertyValue("--glass-drawer-t"), r = Number.parseFloat(n);
+		return Number.isNaN(r) ? l() : r;
+	}
+	let D = null;
+	function O(e) {
+		e.addEventListener("pointerdown", C), e.addEventListener("pointermove", w), e.addEventListener("pointerup", T), e.addEventListener("pointercancel", T), D = () => {
+			e.removeEventListener("pointerdown", C), e.removeEventListener("pointermove", w), e.removeEventListener("pointerup", T), e.removeEventListener("pointercancel", T), D = null;
+		};
+	}
+	return v(n, (e) => {
+		D?.(), e && O(e);
+	}, { immediate: !0 }), v(r.open, (e) => {
+		e ? queueMicrotask(() => {
+			o(0), u(l());
+		}) : s();
+	}, { immediate: !0 }), v(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);
+		}
+	}), f(() => {
+		D?.(), s();
+	}), {
+		dragging: i,
+		snapTo: d
+	};
+}
+//#endregion
+//#region src/components/ui/drawer/DrawerContent.vue?vue&type=script&setup=true&lang.ts
+var G = ["data-dragging"], K = /* @__PURE__ */ l({
+	__name: "DrawerContent",
+	props: {
+		forceMount: { type: Boolean },
+		disableOutsidePointerEvents: { type: Boolean },
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		showOverlay: {
+			type: Boolean,
+			default: !0
+		},
+		surface: { default: "glass" }
+	},
+	emits: [
+		"escapeKeyDown",
+		"pointerDownOutside",
+		"focusOutside",
+		"interactOutside",
+		"openAutoFocus",
+		"closeAutoFocus"
+	],
+	setup(n, { emit: o }) {
+		let l = n, d = o, f = k(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) {
+			if (!e) {
+				v.value = null;
+				return;
+			}
+			let t = e.$el ?? e;
+			v.value = t instanceof HTMLElement ? t : null;
+		}
+		let C = L(), T = C ? W({
+			contentEl: v,
+			handleEl: b,
+			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), {
+				"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),
+				style: O.value
+			}), {
+				default: y(() => [s("div", {
+					ref_key: "handleEl",
+					ref: b,
+					class: "glass-drawer-handle",
+					"data-glass-drawer-handle": "",
+					"data-dragging": _(T)?.dragging.value ? "" : void 0,
+					"aria-hidden": "true"
+				}, [...n[0] ||= [s("span", { class: "glass-drawer-grip" }, null, -1)]], 8, G), h(t.$slots, "default")]),
+				_: 3
+			}, 16, [
+				"data-glass-drawer-snap-points",
+				"data-glass-drawer-direction",
+				"data-surface",
+				"class",
+				"style"
+			])]),
+			_: 3
+		}));
+	}
+}), q = /* @__PURE__ */ l({
+	__name: "DrawerHeader",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	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));
+	}
+}), J = /* @__PURE__ */ l({
+	__name: "DrawerFooter",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	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));
+	}
+}), Y = /* @__PURE__ */ l({
+	__name: "DrawerTitle",
+	props: {
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(t) {
+		let n = t, a = r(() => {
+			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")]),
+			_: 3
+		}, 16, ["class"]));
+	}
+}), X = /* @__PURE__ */ l({
+	__name: "DrawerDescription",
+	props: {
+		asChild: { type: Boolean },
+		as: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(t) {
+		let n = t, a = r(() => {
+			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")]),
+			_: 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 };

package/dist/{dropdown-menu-BJ7E9js_.js → dropdown-menu-CofSZuk8.js}

@@ -1,8 +1,7 @@
 import { t as e } from "./cn-DJXf4yaB.js";
-import { t } from "./check-njhk-vfu.js";
-import { t as n } from "./chevron-right-CPXbqQQz.js";
-import { t as r } from "./menuItemVariants-DWRQXBxJ.js";
-import { i } from "./dockContext-Bu1Avy-a.js";
+import { v as t, x as n } from "./vendor-CKmzio-i.js";
+import { t as r } from "./menuItemVariants-D8VNHq22.js";
+import { i } from "./dockContext-BNfyPLe9.js";
 import { computed as a, createBlock as o, createElementBlock as s, createElementVNode as c, createVNode as l, defineComponent as u, guardReactiveProps as d, mergeProps as f, normalizeClass as p, normalizeProps as m, openBlock as h, renderSlot as g, unref as _, withCtx as v } from "vue";
 import { DropdownMenuCheckboxItem as y, DropdownMenuContent as b, DropdownMenuGroup as x, DropdownMenuItem as S, DropdownMenuItemIndicator as C, DropdownMenuLabel as w, DropdownMenuPortal as T, DropdownMenuPortal as E, DropdownMenuRadioGroup as D, DropdownMenuRadioItem as O, DropdownMenuRoot as k, DropdownMenuSeparator as A, DropdownMenuSub as j, DropdownMenuSubContent as M, DropdownMenuSubTrigger as N, DropdownMenuTrigger as P, useForwardProps as F, useForwardPropsEmits as I } from "reka-ui";
 //#endregion
@@ -86,7 +85,7 @@ var L = /* @__PURE__ */ u({
 			default: v(() => [l(_(b), f(_(c), {
 				"data-glass-dock-portal": _(u)?.id ? "" : void 0,
 				"data-glass-dock-owner": _(u)?.id,
-				class: _(e)("dropdown-menu-content z-popover min-w-32 max-h-[60vh] overflow-y-auto rounded-panel border glass-floating text-popover-foreground popover-animate slide-in-from-side", r.class)
+				class: _(e)("dropdown-menu-content z-popover min-w-32 max-h-[60vh] overflow-y-auto rounded-panel border glass-floating text-popover-foreground glass-reveal", r.class)
 			}), {
 				default: v(() => [g(t.$slots, "default")]),
 				_: 3
@@ -169,16 +168,16 @@ var L = /* @__PURE__ */ u({
 		] }
 	},
 	emits: ["select", "update:modelValue"],
-	setup(n, { emit: i }) {
-		let s = n, u = i, d = I(a(() => {
+	setup(t, { emit: i }) {
+		let s = t, u = i, d = I(a(() => {
 			let { class: e, ...t } = s;
 			return t;
 		}), u);
-		return (n, i) => (h(), o(_(y), f(_(d), { class: _(e)(_(r)({ indicator: "start-wide" }), s.class) }), {
+		return (t, i) => (h(), o(_(y), f(_(d), { class: _(e)(_(r)({ indicator: "start-wide" }), s.class) }), {
 			default: v(() => [c("span", U, [l(_(C), null, {
-				default: v(() => [l(_(t), { class: "w-4 h-4" })]),
+				default: v(() => [l(_(n), { class: "w-4 h-4" })]),
 				_: 1
-			})]), g(n.$slots, "default")]),
+			})]), g(t.$slots, "default")]),
 			_: 3
 		}, 16, ["class"]));
 	}
@@ -298,13 +297,13 @@ var L = /* @__PURE__ */ u({
 			Array
 		] }
 	},
-	setup(t) {
-		let i = t, s = F(a(() => {
+	setup(n) {
+		let i = n, s = F(a(() => {
 			let { class: e, ...t } = i;
 			return t;
 		}));
-		return (t, a) => (h(), o(_(N), f(_(s), { class: _(e)(_(r)({ indicator: "none" }), i.class) }), {
-			default: v(() => [g(t.$slots, "default"), l(_(n), { class: "ml-auto h-4 w-4" })]),
+		return (n, a) => (h(), o(_(N), f(_(s), { class: _(e)(_(r)({ indicator: "none" }), i.class) }), {
+			default: v(() => [g(n.$slots, "default"), l(_(t), { class: "ml-auto h-4 w-4" })]),
 			_: 3
 		}, 16, ["class"]));
 	}
@@ -354,7 +353,7 @@ var L = /* @__PURE__ */ u({
 			return t;
 		}), i);
 		return (t, n) => (h(), o(_(T), null, {
-			default: v(() => [l(_(M), f(_(s), { class: _(e)("dropdown-sub-content z-popover min-w-32 overflow-hidden rounded-panel border glass-floating text-popover-foreground popover-animate slide-in-from-side", r.class) }), {
+			default: v(() => [l(_(M), f(_(s), { class: _(e)("dropdown-sub-content z-popover min-w-32 overflow-hidden rounded-panel border glass-floating text-popover-foreground glass-reveal", r.class) }), {
 				default: v(() => [g(t.$slots, "default")]),
 				_: 3
 			}, 16, ["class"])]),

package/dist/dropdown-menu.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, d as n, f as r, h as i, i as a, l as o, m as s, n as c, o as l, p as u, r as d, s as f, t as p, u as m } from "./dropdown-menu-BJ7E9js_.js";
+import { a as e, c as t, d as n, f as r, h as i, i as a, l as o, m as s, n as c, o as l, p as u, r as d, s as f, t as p, u as m } from "./dropdown-menu-CofSZuk8.js";
 export { i as DropdownMenu, o as DropdownMenuCheckboxItem, u as DropdownMenuContent, r as DropdownMenuGroup, m as DropdownMenuItem, e as DropdownMenuLabel, p as DropdownMenuPortal, n as DropdownMenuRadioGroup, t as DropdownMenuRadioItem, l as DropdownMenuSeparator, f as DropdownMenuShortcut, a as DropdownMenuSub, c as DropdownMenuSubContent, d as DropdownMenuSubTrigger, s as DropdownMenuTrigger };

package/dist/easing.d.ts

@@ -0,0 +1 @@
+export * from "./components/custom/easing";