@mkbabb/glass-ui 4.0.0 → 4.0.1

package/dist/tabs.js

@@ -1,24 +1,25 @@
 import { t as e } from "./cn-DJXf4yaB.js";
-import { a as t, i as n, o as r, r as i, s as a } from "./SelectScrollDownButton-C1jb3b3K.js";
-import { i as o, n as s, r as c, t as l } from "./TooltipProvider-B3MkB_8P.js";
-import { t as u } from "./useLiquidFlex-C12hXwOZ.js";
-import { Fragment as d, computed as f, createBlock as p, createCommentVNode as m, createElementBlock as h, createElementVNode as g, createTextVNode as _, createVNode as v, defineComponent as y, mergeModels as b, mergeProps as x, nextTick as S, normalizeClass as C, normalizeStyle as w, onBeforeUnmount as T, onMounted as E, onUnmounted as D, openBlock as O, ref as k, renderList as A, renderSlot as j, toDisplayString as M, unref as N, useModel as P, watch as F, withCtx as I } from "vue";
+import { t } from "./useLiquidFlex-mZPMiNXh.js";
+import { a as n, i as r, o as i, r as a, s as o } from "./SelectScrollDownButton-CrA8F0iV.js";
+import { i as s, n as c, r as l, t as u } from "./TooltipProvider-rzvnXz60.js";
+import { t as d } from "./useDragMorph-DgxnsVJz.js";
+import { Fragment as f, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createTextVNode as v, createVNode as y, defineComponent as b, mergeModels as x, mergeProps as S, nextTick as C, normalizeClass as w, normalizeStyle as ee, onBeforeUnmount as te, onMounted as T, onUnmounted as E, openBlock as D, ref as O, renderList as k, renderSlot as A, toDisplayString as j, unref as M, useModel as ne, watch as N, withCtx as P } from "vue";
 //#region src/components/custom/tabs/constants.ts
-var L = 1.08, R = .82;
+var F = 1.08, I = .82;
 //#endregion
 //#region src/components/custom/tabs/composables/useTabIndicator.ts
-function ee(e) {
-	let { containerRef: t, indicatorRef: n, buttonRefs: r, options: i, model: a, anchorSupported: o, jsSliderActive: s, activeValues: c, vertical: l } = e, d = k({
+function re(e) {
+	let { containerRef: n, indicatorRef: r, buttonRefs: i, options: a, model: o, anchorSupported: s, jsSliderActive: c, activeValues: l, vertical: u } = e, d = O({
 		width: "0px",
 		transform: "translateX(0px)",
 		opacity: "0"
 	});
 	function f() {
-		if (o) return;
-		let e = i.value.findIndex((e) => e.value === a.value);
-		if (e < 0 || !r.value[e]) return;
-		let t = r.value[e];
-		if (l.value) {
+		if (s) return;
+		let e = a.value.findIndex((e) => e.value === o.value);
+		if (e < 0 || !i.value[e]) return;
+		let t = i.value[e];
+		if (u.value) {
 			let e = t.offsetHeight, n = t.offsetTop + e / 2;
 			d.value = {
 				height: `${e}px`,
@@ -39,7 +40,7 @@ function ee(e) {
 	function p() {
 		f();
 	}
-	let m = -1, h = null, g = L, _ = u({
+	let m = -1, h = null, g = F, _ = t({
 		from: 0,
 		to: 0,
 		axis: "width",
@@ -54,8 +55,8 @@ function ee(e) {
 		return t ? t.endsWith("ms") ? Number.parseFloat(t) || 340 : t.endsWith("s") ? (Number.parseFloat(t) || .34) * 1e3 : Number.parseFloat(t) || 340 : 340;
 	}
 	function b(e) {
-		let i = n.value;
-		if (!i) {
+		let t = r.value;
+		if (!t) {
 			m = e;
 			return;
 		}
@@ -63,26 +64,26 @@ function ee(e) {
 			m = e;
 			return;
 		}
-		let a = r.value[m], o = r.value[e];
+		let a = i.value[m], o = i.value[e];
 		if (m = e, !a || !o) return;
-		let s = l.value ? t.value?.offsetHeight || o.offsetParent?.offsetHeight || 1 : t.value?.offsetWidth || o.offsetParent?.offsetWidth || 1, c = l.value ? Math.abs(o.offsetTop - a.offsetTop) : Math.abs(o.offsetLeft - a.offsetLeft), u = s > 0 ? Math.min(c / s, 1) : 0, d = getComputedStyle(i).getPropertyValue("--tab-indicator-max-stretch").trim();
-		g = Number(d) || 1.08, _.squish(u), h && clearTimeout(h), i.style.setProperty("--stretch", String(_.stretch.value));
-		let f = y(i) * R;
+		let s = u.value ? n.value?.offsetHeight || o.offsetParent?.offsetHeight || 1 : n.value?.offsetWidth || o.offsetParent?.offsetWidth || 1, c = u.value ? Math.abs(o.offsetTop - a.offsetTop) : Math.abs(o.offsetLeft - a.offsetLeft), l = s > 0 ? Math.min(c / s, 1) : 0, d = getComputedStyle(t).getPropertyValue("--tab-indicator-max-stretch").trim();
+		g = Number(d) || 1.08, _.squish(l), h && clearTimeout(h), t.style.setProperty("--stretch", String(_.stretch.value));
+		let f = y(t) * I;
 		h = setTimeout(() => {
-			_.squish(0), i.style.setProperty("--stretch", String(_.stretch.value)), h = null;
+			_.squish(0), t.style.setProperty("--stretch", String(_.stretch.value)), h = null;
 		}, f);
 	}
-	F(() => a.value, () => {
-		s.value && S(p);
-	}), F(() => i.value, () => {
-		s.value && S(p);
-	}, { deep: !0 }), F(() => l.value, () => {
-		s.value && S(p);
+	N(() => o.value, () => {
+		c.value && C(p);
+	}), N(() => a.value, () => {
+		c.value && C(p);
+	}, { deep: !0 }), N(() => u.value, () => {
+		c.value && C(p);
 	});
 	let x = null;
-	return E(() => {
-		m = i.value.findIndex((e) => c.value.includes(e.value)), s.value && (S(p), t.value && (x = new ResizeObserver(() => p()), x.observe(t.value)));
-	}), D(() => {
+	return T(() => {
+		m = a.value.findIndex((e) => l.value.includes(e.value)), c.value && (C(p), n.value && (x = new ResizeObserver(() => p()), x.observe(n.value)));
+	}), E(() => {
 		x?.disconnect(), h && clearTimeout(h);
 	}), {
 		singleSliderStyle: d,
@@ -90,18 +91,62 @@ function ee(e) {
 	};
 }
 //#endregion
+//#region src/components/custom/tabs/composables/useTabDragMorph.ts
+function ie(e) {
+	let { indicatorRef: t, isVertical: n, isUnderline: r, draggable: i, stripOptions: a, buttonRefs: o, model: s } = e, c = p(() => i() && !r.value);
+	function l() {
+		let e = t.value;
+		if (!e) return F;
+		let n = getComputedStyle(e).getPropertyValue("--tab-indicator-max-stretch").trim();
+		return Number(n) || 1.08;
+	}
+	function u() {
+		return a.value.map((e, t) => {
+			let r = o.value[t]?.getBoundingClientRect(), i = r ? n.value ? r.top + r.height / 2 : r.left + r.width / 2 : 0;
+			return {
+				value: e.value,
+				center: i
+			};
+		});
+	}
+	let f = d({
+		el: t,
+		axis: () => n.value ? "y" : "x",
+		snapTargets: u,
+		maxStretch: l,
+		onSnap: (e) => {
+			s.value !== e && (s.value = e);
+		}
+	});
+	return N(() => [f.dragging.value, f.stretch.value], ([e, n]) => {
+		let r = t.value;
+		!r || !c.value || (e ? r.style.setProperty("--stretch", String(n)) : r.style.removeProperty("--stretch"));
+	}), N(() => [
+		a.value.length,
+		n.value,
+		c.value
+	], () => {
+		c.value && C(() => f.refresh());
+	}), {
+		dragEnabled: c,
+		drag: f
+	};
+}
+//#endregion
 //#region src/components/custom/tabs/SegmentedTabs.vue?vue&type=script&setup=true&lang.ts
-var te = ["role", "aria-orientation"], z = [
+var ae = ["role", "aria-orientation"], oe = [
 	"role",
+	"tabindex",
 	"disabled",
 	"onClick"
-], B = [
+], se = [
 	"role",
+	"tabindex",
 	"disabled",
 	"onClick"
-], V = /* @__PURE__ */ y({
+], L = /* @__PURE__ */ b({
 	__name: "SegmentedTabs",
-	props: /* @__PURE__ */ b({
+	props: /* @__PURE__ */ x({
 		options: {},
 		variant: { default: "pill" },
 		orientation: { default: "horizontal" },
@@ -109,6 +154,10 @@ var te = ["role", "aria-orientation"], z = [
 			type: [Boolean, Object],
 			default: !1
 		},
+		draggable: {
+			type: Boolean,
+			default: !1
+		},
 		class: { type: [
 			Boolean,
 			null,
@@ -121,33 +170,41 @@ var te = ["role", "aria-orientation"], z = [
 		modelModifiers: {}
 	}),
 	emits: ["update:modelValue"],
-	setup(u) {
-		function y(e, t) {
+	setup(t) {
+		function d(e, t) {
 			return typeof document > "u" ? t : getComputedStyle(document.documentElement).getPropertyValue(e).trim() || t;
 		}
-		let b = u, S = P(u, "modelValue"), D = k(null), F = k(null), L = k([]), R = typeof CSS < "u" && typeof CSS.supports == "function" && CSS.supports("position-anchor", "--x"), V = f(() => b.variant === "underline"), H = f(() => b.orientation === "vertical"), U = f(() => S.value == null ? [] : [S.value]), W = (e) => U.value.includes(e), G = f(() => !R && !V.value), K = G, q = f(() => b.responsive === !1 ? null : b.responsive === !0 ? {} : b.responsive), ne = f(() => q.value?.breakpoint ?? "640px"), J = f(() => q.value?.desktopOptions ?? b.options), Y = k(!0), X = null;
-		function Z(e) {
-			Y.value = e.matches;
+		let b = t, x = ne(t, "modelValue"), C = O(null), E = O(null), N = O([]), F = typeof CSS < "u" && typeof CSS.supports == "function" && CSS.supports("position-anchor", "--x"), I = p(() => b.variant === "underline"), L = p(() => b.orientation === "vertical"), R = p(() => x.value == null ? [] : [x.value]), z = (e) => R.value.includes(e), B = p(() => !F && !I.value), V = B, H = p(() => b.responsive === !1 ? null : b.responsive === !0 ? {} : b.responsive), ce = p(() => H.value?.breakpoint ?? "640px"), U = p(() => H.value?.desktopOptions ?? b.options), W = O(!0), G = null;
+		function K(e) {
+			W.value = e.matches;
 		}
-		let re = f(() => {
-			if (!q.value) return S.value;
-			let e = J.value;
-			return e.some((e) => e.value === S.value) ? S.value : e[0]?.value ?? S.value;
-		}), Q = f(() => q.value ? J.value : b.options), ie = f(() => q.value?.ariaLabel ?? b.options.find((e) => e.value === S.value)?.label ?? "Select"), ae = f(() => !!q.value && !Y.value), { singleSliderStyle: oe, squishOnTravel: se } = ee({
-			containerRef: D,
-			indicatorRef: F,
-			buttonRefs: L,
-			options: Q,
-			model: f(() => re.value),
-			anchorSupported: R,
-			jsSliderActive: G,
-			activeValues: U,
-			vertical: H
+		let q = p(() => {
+			if (!H.value) return x.value;
+			let e = U.value;
+			return e.some((e) => e.value === x.value) ? x.value : e[0]?.value ?? x.value;
+		}), J = p(() => H.value ? U.value : b.options), le = p(() => H.value?.ariaLabel ?? b.options.find((e) => e.value === x.value)?.label ?? "Select"), ue = p(() => !!H.value && !W.value), { singleSliderStyle: Y, squishOnTravel: de } = re({
+			containerRef: C,
+			indicatorRef: E,
+			buttonRefs: N,
+			options: J,
+			model: p(() => q.value),
+			anchorSupported: F,
+			jsSliderActive: B,
+			activeValues: R,
+			vertical: L
+		}), { dragEnabled: X, drag: Z } = ie({
+			indicatorRef: E,
+			isVertical: L,
+			isUnderline: I,
+			draggable: () => b.draggable,
+			stripOptions: J,
+			buttonRefs: N,
+			model: x
 		});
-		function ce(e) {
+		function fe(e) {
 			if (typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
 			e.getAnimations().forEach((e) => e.cancel());
-			let t = y("--spring-snappy", "ease"), n = y("--scale-press-btn", "0.97");
+			let t = d("--spring-snappy", "ease"), n = d("--scale-press-btn", "0.97");
 			e.animate([
 				{ transform: "scale(1)" },
 				{
@@ -160,104 +217,160 @@ var te = ["role", "aria-orientation"], z = [
 				easing: t
 			});
 		}
-		function $(e, t) {
-			if (Q.value[t]?.disabled) return;
-			let n = L.value[t];
-			n && ce(n), se(t), S.value = e;
+		function Q(e, t) {
+			if (J.value[t]?.disabled) return;
+			let n = N.value[t];
+			n && fe(n), de(t), x.value = e;
+		}
+		function pe(e) {
+			typeof e == "string" && (x.value = e);
+		}
+		let $ = p(() => {
+			let e = J.value.findIndex((e) => e.value === q.value);
+			return e >= 0 ? e : 0;
+		});
+		function me(e) {
+			return e === $.value ? 0 : -1;
+		}
+		function he(e, t) {
+			let n = J.value.length;
+			if (n !== 0) for (let r = 1; r <= n; r++) {
+				let i = (e + t * r + n * r) % n, a = J.value[i];
+				if (a && !a.disabled) {
+					N.value[i]?.focus(), Q(a.value, i);
+					return;
+				}
+			}
+		}
+		function ge(e) {
+			let t = J.value.length, n = e === "first" ? Array.from({ length: t }, (e, t) => t) : Array.from({ length: t }, (e, n) => t - 1 - n);
+			for (let e of n) {
+				let t = J.value[e];
+				if (t && !t.disabled) {
+					N.value[e]?.focus(), Q(t.value, e);
+					return;
+				}
+			}
 		}
-		function le(e) {
-			typeof e == "string" && (S.value = e);
+		function _e(e) {
+			let t = $.value, n = L.value ? "ArrowDown" : "ArrowRight", r = L.value ? "ArrowUp" : "ArrowLeft";
+			switch (e.key) {
+				case n:
+					e.preventDefault(), he(t, 1);
+					break;
+				case r:
+					e.preventDefault(), he(t, -1);
+					break;
+				case "Home":
+					e.preventDefault(), ge("first");
+					break;
+				case "End":
+					e.preventDefault(), ge("last");
+					break;
+				default: break;
+			}
 		}
-		return E(() => {
-			q.value && typeof window < "u" && window.matchMedia && (X = window.matchMedia(`(min-width: ${ne.value})`), Y.value = X.matches, X.addEventListener("change", Z));
-		}), T(() => {
-			X?.removeEventListener("change", Z), X = null;
-		}), (f, y) => ae.value ? (O(), h("div", {
+		return T(() => {
+			H.value && typeof window < "u" && window.matchMedia && (G = window.matchMedia(`(min-width: ${ce.value})`), W.value = G.matches, G.addEventListener("change", K));
+		}), te(() => {
+			G?.removeEventListener("change", K), G = null;
+		}), (d, p) => ue.value ? (D(), g("div", {
 			key: 0,
-			class: C(N(e)("segmented-tabs__mobile w-fit", b.class))
-		}, [v(N(a), {
-			"model-value": S.value,
-			"onUpdate:modelValue": le
+			class: w(M(e)("segmented-tabs__mobile w-fit", b.class))
+		}, [y(M(o), {
+			"model-value": x.value,
+			"onUpdate:modelValue": pe
 		}, {
-			default: I(() => [v(N(t), {
-				"aria-label": ie.value,
-				class: C(N(e)("segmented-tabs__trigger text-small w-auto min-w-input-sm", q.value?.triggerClass))
+			default: P(() => [y(M(n), {
+				"aria-label": le.value,
+				class: w(M(e)("segmented-tabs__trigger text-small w-auto min-w-input-sm", H.value?.triggerClass))
 			}, {
-				default: I(() => [v(N(r))]),
+				default: P(() => [y(M(i))]),
 				_: 1
-			}, 8, ["aria-label", "class"]), v(N(n), null, {
-				default: I(() => [(O(!0), h(d, null, A(u.options, (e) => (O(), p(N(i), {
+			}, 8, ["aria-label", "class"]), y(M(r), null, {
+				default: P(() => [(D(!0), g(f, null, k(t.options, (e) => (D(), m(M(a), {
 					key: e.value,
 					value: e.value
 				}, {
-					default: I(() => [_(M(e.label), 1)]),
+					default: P(() => [v(j(e.label), 1)]),
 					_: 2
 				}, 1032, ["value"]))), 128))]),
 				_: 1
 			})]),
 			_: 1
-		}, 8, ["model-value"])], 2)) : (O(), h("div", {
+		}, 8, ["model-value"])], 2)) : (D(), g("div", {
 			key: 1,
 			ref_key: "containerRef",
-			ref: D,
-			role: V.value ? "tablist" : "group",
-			"aria-orientation": H.value ? "vertical" : "horizontal",
-			class: C(N(e)("segmented-tabs", `segmented-tabs--${u.variant}`, H.value && "segmented-tabs--vertical", b.class))
-		}, [V.value ? m("", !0) : (O(), h("div", {
+			ref: C,
+			role: I.value ? "tablist" : "group",
+			"aria-orientation": L.value ? "vertical" : "horizontal",
+			class: w(M(e)("segmented-tabs", `segmented-tabs--${t.variant}`, L.value && "segmented-tabs--vertical", b.class)),
+			onKeydown: _e
+		}, [I.value ? h("", !0) : (D(), g("div", {
 			key: 0,
 			ref_key: "indicatorRef",
-			ref: F,
-			class: C(["segmented-indicator", N(K) ? "segmented-indicator--js" : "segmented-indicator--anchor"]),
-			style: w(N(K) ? N(oe) : void 0)
-		}, null, 6)), (O(!0), h(d, null, A(Q.value, (e, t) => (O(), h(d, { key: e.value }, [e.tooltip ? (O(), p(N(l), {
+			ref: E,
+			class: w([
+				"segmented-indicator",
+				M(V) ? "segmented-indicator--js" : "segmented-indicator--anchor",
+				M(X) && "glass-drag-grabbable",
+				M(X) && M(Z).dragging.value && "glass-drag-lift"
+			]),
+			style: ee(M(X) ? {
+				...M(V) ? M(Y) : {},
+				...M(Z).dragStyle.value
+			} : M(V) ? M(Y) : void 0)
+		}, null, 6)), (D(!0), g(f, null, k(J.value, (e, t) => (D(), g(f, { key: e.value }, [e.tooltip ? (D(), m(M(u), {
 			key: 0,
 			"delay-duration": 200
 		}, {
-			default: I(() => [v(N(o), null, {
-				default: I(() => [v(N(s), { "as-child": "" }, {
-					default: I(() => [g("button", x({
+			default: P(() => [y(M(s), null, {
+				default: P(() => [y(M(c), { "as-child": "" }, {
+					default: P(() => [_("button", S({
 						ref_for: !0,
 						ref: (e) => {
-							e && (L.value[t] = e);
+							e && (N.value[t] = e);
 						},
 						class: "segmented-tab",
-						role: V.value ? "tab" : void 0
-					}, { ref_for: !0 }, V.value ? { "aria-selected": W(e.value) ? "true" : "false" } : { "aria-pressed": W(e.value) ? "true" : "false" }, {
+						role: I.value ? "tab" : void 0,
+						tabindex: me(t)
+					}, { ref_for: !0 }, I.value ? { "aria-selected": z(e.value) ? "true" : "false" } : { "aria-pressed": z(e.value) ? "true" : "false" }, {
 						disabled: e.disabled,
 						class: e.disabled && "is-disabled",
-						onClick: (n) => $(e.value, t)
-					}), [j(f.$slots, "option", {
+						onClick: (n) => Q(e.value, t)
+					}), [A(d.$slots, "option", {
 						option: e,
-						active: W(e.value)
-					}, () => [_(M(e.label), 1)])], 16, z)]),
+						active: z(e.value)
+					}, () => [v(j(e.label), 1)])], 16, oe)]),
 					_: 2
-				}, 1024), v(N(c), {
+				}, 1024), y(M(l), {
 					side: "bottom",
 					"side-offset": 8
 				}, {
-					default: I(() => [_(M(e.tooltip), 1)]),
+					default: P(() => [v(j(e.tooltip), 1)]),
 					_: 2
 				}, 1024)]),
 				_: 2
 			}, 1024)]),
 			_: 2
-		}, 1024)) : (O(), h("button", x({
+		}, 1024)) : (D(), g("button", S({
 			key: 1,
 			ref_for: !0,
 			ref: (e) => {
-				e && (L.value[t] = e);
+				e && (N.value[t] = e);
 			},
 			class: "segmented-tab",
-			role: V.value ? "tab" : void 0
-		}, { ref_for: !0 }, V.value ? { "aria-selected": W(e.value) ? "true" : "false" } : { "aria-pressed": W(e.value) ? "true" : "false" }, {
+			role: I.value ? "tab" : void 0,
+			tabindex: me(t)
+		}, { ref_for: !0 }, I.value ? { "aria-selected": z(e.value) ? "true" : "false" } : { "aria-pressed": z(e.value) ? "true" : "false" }, {
 			disabled: e.disabled,
 			class: e.disabled && "is-disabled",
-			onClick: (n) => $(e.value, t)
-		}), [j(f.$slots, "option", {
+			onClick: (n) => Q(e.value, t)
+		}), [A(d.$slots, "option", {
 			option: e,
-			active: W(e.value)
-		}, () => [_(M(e.label), 1)])], 16, B))], 64))), 128))], 10, te));
+			active: z(e.value)
+		}, () => [v(j(e.label), 1)])], 16, se))], 64))), 128))], 42, ae));
 	}
 });
 //#endregion
-export { V as SegmentedTabs };
+export { L as SegmentedTabs };

package/dist/timeline.js

@@ -1,5 +1,5 @@
-import { t as e } from "./_plugin-vue_export-helper-CBt_VvXa.js";
-import { t } from "./HoverPopover-Dpzwvc4t.js";
+import { t as e } from "./_plugin-vue_export-helper-C1je1s0u.js";
+import { t } from "./HoverPopover-CbqbNwgU.js";
 import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createSlots as c, createVNode as l, defineComponent as u, guardReactiveProps as d, normalizeClass as f, normalizeProps as p, normalizeStyle as m, openBlock as h, ref as g, renderList as _, renderSlot as v, toDisplayString as y, unref as b, withCtx as x } from "vue";
 //#region src/components/custom/timeline/geometry.ts
 function S(e) {

package/dist/toast.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./Toaster-Bm_HQSpc.js";
+import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./Toaster-Bw4xR8xV.js";
 export { t as Toast, o as ToastAction, i as ToastClose, e as ToastDescription, n as ToastTitle, s as Toaster, r as toast, a as useToast };

package/dist/toggle-group.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./ToggleGroupItem-Dzk9hWsF.js";
+import { n as e, t } from "./ToggleGroupItem-pEM9vIhs.js";
 export { e as ToggleGroup, t as ToggleGroupItem };

package/dist/tooltip.js

@@ -1,2 +1,2 @@
-import { i as e, n as t, r as n, t as r } from "./TooltipProvider-B3MkB_8P.js";
+import { i as e, n as t, r as n, t as r } from "./TooltipProvider-rzvnXz60.js";
 export { e as Tooltip, n as TooltipContent, r as TooltipProvider, t as TooltipTrigger };

package/dist/typewriter.js

@@ -1,4 +1,4 @@
-import { t as e } from "./_plugin-vue_export-helper-CBt_VvXa.js";
+import { t as e } from "./_plugin-vue_export-helper-C1je1s0u.js";
 import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, normalizeClass as s, onMounted as c, onUnmounted as l, openBlock as u, ref as d, renderList as f, toDisplayString as p, unref as m, watch as h } from "vue";
 //#region src/components/custom/typewriter/types.ts
 var g = {

package/dist/useCanvas2D-B8w_E3Rr.js

@@ -0,0 +1,83 @@
+import { t as e } from "./createCanvasLifecycle-CHD5XrDW.js";
+import { getCurrentScope as t, onScopeDispose as n, toValue as r } from "vue";
+//#region src/composables/glass/canvas2d/useCanvas2D.ts
+var i = "200px";
+function a(a) {
+	let { setup: o, autoStart: s = !0, contextAttrs: c, rootMargin: l = i } = a, u = a.respectReducedMotion ?? !0, d = () => r(a.canvas), f = typeof window < "u", p = null, m = null, h = null, g = !1, _ = null, v = null, y = !1;
+	function b() {
+		p && m && m.render(p, f ? performance.now() : 0);
+	}
+	function x(e) {
+		if (!p) return;
+		let t = e.clientWidth || e.offsetWidth || 0, n = e.clientHeight || e.offsetHeight || 0;
+		if (!t || !n) return;
+		let r = Math.min(f && window.devicePixelRatio || 1, 2);
+		e.width = Math.round(t * r), e.height = Math.round(n * r), p.setTransform(r, 0, 0, r, 0, 0);
+		let i = !h || !h.running || h.reducedMotion;
+		!y && i && b();
+	}
+	function S(e) {
+		_ || typeof ResizeObserver > "u" || (_ = new ResizeObserver(() => {
+			let e = d();
+			e && x(e);
+		}), _.observe(e));
+	}
+	function C(e) {
+		v || typeof IntersectionObserver > "u" || (v = new IntersectionObserver((e) => {
+			for (let t of e) t.isIntersecting || t.intersectionRatio > 0 ? h?.resume("off-screen-io") : h?.suspend("off-screen-io");
+		}, { rootMargin: l }), v.observe(e));
+	}
+	function w(e) {
+		let t = e.getContext("2d", c);
+		if (!t) throw Error("[useCanvas2D] 2D context unavailable");
+		return p = t, m = o(p), S(e), C(e), {
+			frame: (e) => {
+				p && m && m.render(p, e);
+			},
+			time: () => f ? performance.now() : 0,
+			shouldContinue: () => !0,
+			teardown: () => {
+				m?.teardown?.(), v?.disconnect(), v = null, _?.disconnect(), _ = null, p = null, m = null;
+			}
+		};
+	}
+	function T() {
+		if (h || g) return;
+		let t = d();
+		t && (h = e({
+			canvas: t,
+			respectReducedMotion: u,
+			buildContext: () => w(t),
+			resize: () => x(t)
+		}), y = !0, h.arm(), y = !1);
+	}
+	function E(e = "manual") {
+		h?.suspend(e);
+	}
+	function D(e = "manual") {
+		h?.resume(e);
+	}
+	function O() {
+		h?.wake();
+	}
+	function k() {
+		g || (g = !0, h?.dispose(), h = null);
+	}
+	return s && T(), t() && n(k), {
+		arm: T,
+		suspend: E,
+		resume: D,
+		wake: O,
+		dispose: k,
+		isRunning: () => h?.running ?? !1,
+		get ctx() {
+			return p;
+		},
+		get reducedMotion() {
+			return h?.reducedMotion ?? !1;
+		}
+	};
+}
+var o = a;
+//#endregion
+export { o as n, a as t };