@juleshry/vue-animejs 1.0.1 → 1.2.0

package/dist/index.js

@@ -1,423 +1,439 @@
-import { computed as e, isRef as t, readonly as n, shallowReadonly as r, shallowRef as i, toValue as a, unref as o, watch as s } from "vue";
+import { computed as e, isRef as t, markRaw as n, shallowReadonly as r, shallowRef as i, toValue as a, unref as o, watch as s } from "vue";
 import { animate as c, createAnimatable as l, createDraggable as u, createLayout as d, createScope as f, createTimeline as p, createTimer as m, splitText as h, svg as g, waapi as _ } from "animejs";
-import { tryOnMounted as v, tryOnUnmounted as y, unrefElement as b } from "@vueuse/core";
+import { isClient as v, tryOnMounted as y, tryOnUnmounted as b, unrefElement as x } from "@vueuse/core";
 //#region src/utils/resolve-target.ts
-function x(e) {
-	return b(e);
+function S(e) {
+	if (Array.isArray(e)) {
+		let t = e.map((e) => x(e)).filter((e) => e != null);
+		return t.length > 0 ? t : void 0;
+	}
+	return x(e);
 }
 //#endregion
 //#region src/composables/use-animate.ts
-function S(e, r = {}) {
-	let a = i(), { stop: l } = s([() => x(e), () => o(r)], ([e, t]) => {
-		u(e, t);
+function C(e, a = {}) {
+	let l = i(), { stop: u } = s([() => S(e), () => o(a)], ([e, t]) => {
+		d(e, t);
 	}, {
 		flush: "post",
-		immediate: !t(e)
+		immediate: !t(e) && v
 	});
-	y(() => {
-		l(), v();
+	b(() => {
+		u(), x();
 	});
-	function u(e, t) {
-		if (b(), !e) {
-			console.warn("Target element is null or undefined"), a.value = void 0;
+	function d(e, t) {
+		if (C(), !e) {
+			console.warn("Target element is null or undefined"), l.value = void 0;
 			return;
 		}
-		a.value = c(e, t);
-	}
-	function d() {
-		return a.value?.play();
+		l.value = n(c(e, t));
 	}
 	function f() {
-		return a.value?.reverse();
+		return l.value?.play();
 	}
 	function p() {
-		return a.value?.pause();
+		return l.value?.reverse();
 	}
 	function m() {
-		return a.value?.restart();
+		return l.value?.pause();
 	}
 	function h() {
-		return a.value?.alternate();
+		return l.value?.restart();
 	}
 	function g() {
-		return a.value?.resume();
+		return l.value?.alternate();
 	}
 	function _() {
-		return a.value?.complete();
+		return l.value?.resume();
 	}
-	function v() {
-		return a.value?.cancel();
-	}
-	function b() {
-		return a.value?.revert();
+	function y() {
+		return l.value?.complete();
 	}
-	function S(e) {
-		return a.value?.reset(e);
+	function x() {
+		return l.value?.cancel();
 	}
-	function C(e, t, n) {
-		return a.value?.seek(e, t, n);
+	function C() {
+		return l.value?.revert();
 	}
 	function w(e) {
-		return a.value?.stretch(e);
+		return l.value?.reset(e);
 	}
-	function T() {
-		return a.value?.refresh();
+	function T(e, t, n) {
+		return l.value?.seek(e, t, n);
+	}
+	function E(e) {
+		return l.value?.stretch(e);
+	}
+	function D() {
+		return l.value?.refresh();
 	}
 	return {
-		animation: n(a),
-		play: d,
-		reverse: f,
-		pause: p,
-		restart: m,
-		alternate: h,
-		resume: g,
-		complete: _,
-		cancel: v,
-		revert: b,
-		reset: S,
-		seek: C,
-		stretch: w,
-		refresh: T
+		animation: r(l),
+		play: f,
+		reverse: p,
+		pause: m,
+		restart: h,
+		alternate: g,
+		resume: _,
+		complete: y,
+		cancel: x,
+		revert: C,
+		reset: w,
+		seek: T,
+		stretch: E,
+		refresh: D
 	};
 }
 //#endregion
 //#region src/composables/use-raw-animate.ts
-function C(e, t = {}) {
-	let n = x(e);
+function w(e, t = {}) {
+	let n = S(e);
 	return n || console.warn("Target is undefined"), c(n, o(t));
 }
 //#endregion
 //#region src/composables/use-timer.ts
-function w(e = {}) {
-	let t = i(m(o(e))), { stop: r } = s(() => o(e), (e) => {
-		g(), t.value = m(e);
-	}, { deep: 1 });
+function T(e = {}) {
+	let t = i();
 	y(() => {
-		r(), g();
+		t.value = n(m(o(e)));
+	});
+	let { stop: a } = s(() => o(e), (e) => {
+		v && (_(), t.value = n(m(e)));
+	}, { deep: 1 });
+	b(() => {
+		a(), _();
 	});
-	function a() {
-		return t.value.play();
-	}
 	function c() {
-		return t.value.reverse();
+		return t.value?.play();
 	}
 	function l() {
-		return t.value.pause();
+		return t.value?.reverse();
 	}
 	function u() {
-		return t.value.restart();
+		return t.value?.pause();
 	}
 	function d() {
-		return t.value.alternate();
+		return t.value?.restart();
 	}
 	function f() {
-		return t.value.resume();
+		return t.value?.alternate();
 	}
 	function p() {
-		return t.value.complete();
+		return t.value?.resume();
 	}
-	function h(e) {
-		return t.value.reset(e);
+	function h() {
+		return t.value?.complete();
 	}
-	function g() {
-		return t.value.cancel();
+	function g(e) {
+		return t.value?.reset(e);
 	}
 	function _() {
-		return t.value.revert();
+		return t.value?.cancel();
 	}
-	function v(e, n, r) {
-		return t.value.seek(e, n, r);
+	function x() {
+		return t.value?.revert();
 	}
-	function b(e) {
-		return t.value.stretch(e);
+	function S(e, n, r) {
+		return t.value?.seek(e, n, r);
+	}
+	function C(e) {
+		return t.value?.stretch(e);
 	}
 	return {
-		timer: n(t),
-		play: a,
-		reverse: c,
-		pause: l,
-		restart: u,
-		alternate: d,
-		resume: f,
-		complete: p,
-		reset: h,
-		cancel: g,
-		revert: _,
-		seek: v,
-		stretch: b
+		timer: r(t),
+		play: c,
+		reverse: l,
+		pause: u,
+		restart: d,
+		alternate: f,
+		resume: p,
+		complete: h,
+		reset: g,
+		cancel: _,
+		revert: x,
+		seek: S,
+		stretch: C
 	};
 }
 //#endregion
 //#region src/composables/use-timeline.ts
-function T(e = {}) {
-	let t = !1, r = [], c = i(p(o(e)));
-	function l() {
-		for (let e of r) e.type === "add" ? c.value.add(x(e.targets), a(e.params), e.position) : c.value.set(x(e.targets), a(e.params), e.position);
+function E(e = {}) {
+	let t = !1, c = [], l = i();
+	function u() {
+		for (let e of c) e.type === "add" ? l.value?.add(S(e.targets), a(e.params), e.position) : l.value?.set(S(e.targets), a(e.params), e.position);
 	}
-	let { stop: u } = s(() => o(e), (e) => {
-		j(), c.value = p(e), l();
+	let { stop: d } = s(() => o(e), (e) => {
+		v && (N(), l.value = n(p(e)), u());
 	}, {
 		flush: "post",
 		deep: 1
 	});
-	v(() => {
-		t = !0, l();
-	}), y(() => {
-		u(), A();
+	y(() => {
+		l.value = n(p(o(e))), t = !0, u();
+	}), b(() => {
+		d(), M();
 	});
-	function d(e, n, i) {
-		return r.push({
+	function f(e, n, r) {
+		return c.push({
 			type: "add",
 			targets: e,
 			params: n,
-			position: i
+			position: r
 		}), t ? {
-			...c.value.add(x(e), a(n), i),
-			add: d,
-			set: f,
-			remove: m
+			...l.value?.add(S(e), a(n), r),
+			add: f,
+			set: m,
+			remove: h
 		} : {
-			...c.value,
-			add: d,
-			set: f,
-			remove: m
+			...l.value,
+			add: f,
+			set: m,
+			remove: h
 		};
 	}
-	function f(e, n, i) {
-		return r.push({
+	function m(e, n, r) {
+		return c.push({
 			type: "set",
 			targets: e,
 			params: n,
-			position: i
+			position: r
 		}), t ? {
-			...c.value.set(x(e), a(n), i),
-			add: d,
-			set: f,
-			remove: m
+			...l.value?.set(S(e), a(n), r),
+			add: f,
+			set: m,
+			remove: h
 		} : {
-			...c.value,
-			add: d,
-			set: f,
-			remove: m
+			...l.value,
+			add: f,
+			set: m,
+			remove: h
 		};
 	}
-	function m(e, n) {
+	function h(e, n) {
 		return t ? {
-			...c.value.remove(x(e), n),
-			add: d,
-			set: f,
-			remove: m
+			...l.value?.remove(S(e), n),
+			add: f,
+			set: m,
+			remove: h
 		} : (console.warn("Cannot remove from timeline before mount"), {
-			...c.value,
-			add: d,
-			set: f,
-			remove: m
+			...l.value,
+			add: f,
+			set: m,
+			remove: h
 		});
 	}
-	function h(e, t) {
-		return c.value.sync(e, t);
-	}
 	function g(e, t) {
-		return c.value.label(e, t);
+		return l.value?.sync(e, t);
 	}
 	function _(e, t) {
-		return c.value.call(e, t);
+		return l.value?.label(e, t);
 	}
-	function b(e) {
-		return c.value.init(e);
+	function x(e, t) {
+		return l.value?.call(e, t);
 	}
-	function S() {
-		return c.value.play();
-	}
-	function C() {
-		return c.value.reverse();
+	function C(e) {
+		return l.value?.init(e);
 	}
 	function w() {
-		return c.value.pause();
+		return l.value?.play();
 	}
 	function T() {
-		return c.value.restart();
+		return l.value?.reverse();
 	}
 	function E() {
-		return c.value.alternate();
+		return l.value?.pause();
 	}
 	function D() {
-		return c.value.resume();
+		return l.value?.restart();
 	}
 	function O() {
-		return c.value.complete();
+		return l.value?.alternate();
 	}
-	function k(e) {
-		return c.value.reset(e);
+	function k() {
+		return l.value?.resume();
 	}
 	function A() {
-		return c.value.cancel();
+		return l.value?.complete();
+	}
+	function j(e) {
+		return l.value?.reset(e);
+	}
+	function M() {
+		return l.value?.cancel();
 	}
-	function j() {
-		return c.value.revert();
+	function N() {
+		return l.value?.revert();
 	}
-	function M(e, t, n) {
-		return c.value.seek(e, t, n);
+	function P(e, t, n) {
+		return l.value?.seek(e, t, n);
 	}
-	function N(e) {
-		return c.value.stretch(e);
+	function F(e) {
+		return l.value?.stretch(e);
 	}
-	function P() {
-		return c.value.refresh();
+	function I() {
+		return l.value?.refresh();
 	}
 	return {
-		timeline: n(c),
-		add: d,
-		set: f,
-		sync: h,
-		label: g,
-		remove: m,
-		call: _,
-		init: b,
-		play: S,
-		reverse: C,
-		pause: w,
-		restart: T,
-		alternate: E,
-		resume: D,
-		complete: O,
-		reset: k,
-		cancel: A,
-		revert: j,
-		seek: M,
-		stretch: N,
-		refresh: P
+		timeline: r(l),
+		add: f,
+		set: m,
+		sync: g,
+		label: _,
+		remove: h,
+		call: x,
+		init: C,
+		play: w,
+		reverse: T,
+		pause: E,
+		restart: D,
+		alternate: O,
+		resume: k,
+		complete: A,
+		reset: j,
+		cancel: M,
+		revert: N,
+		seek: P,
+		stretch: F,
+		refresh: I
 	};
 }
 //#endregion
 //#region src/composables/use-animatable.ts
-function E(r, a = {}) {
-	let c = i(), { stop: u } = s(e(() => ({
-		el: x(r),
-		opt: o(a)
-	})), ({ el: e, opt: t }) => {
-		if (d(), !e) {
-			console.warn("Targets element is null or undefined"), c.value = void 0;
+function D(a, c = {}) {
+	let u = i(), d = e(() => ({
+		el: S(a),
+		opt: o(c)
+	})), { stop: f } = s(d, ({ el: e, opt: t }) => {
+		if (p(), !e) {
+			console.warn("Targets element is null or undefined"), u.value = void 0;
 			return;
 		}
-		c.value = l(e, t);
+		u.value = n(l(e, t));
 	}, {
 		flush: "post",
-		immediate: !t(r)
+		immediate: !t(a) && v
 	});
-	y(() => {
-		u(), d();
+	b(() => {
+		f(), p();
 	});
-	function d() {
-		return c.value?.revert();
+	function p() {
+		return u.value?.revert();
 	}
 	return {
-		animatable: n(c),
-		revert: d
+		animatable: r(u),
+		revert: p
 	};
 }
 //#endregion
+//#region src/composables/use-raw-animatable.ts
+function O(e, t = {}) {
+	let n = S(e);
+	return n || console.warn("Targets element is null or undefined"), l(n, o(t));
+}
+//#endregion
 //#region src/composables/use-draggable.ts
-function D(e, r = {}) {
-	let a = i(), { stop: c } = s([() => x(e), () => o(r)], ([e, t]) => {
-		if (v(), !e) {
-			console.warn("Targets element is null or undefined"), a.value = void 0;
+function k(e, a = {}) {
+	let c = i(), { stop: l } = s([() => S(e), () => o(a)], ([e, t]) => {
+		if (x(), !e) {
+			console.warn("Targets element is null or undefined"), c.value = void 0;
 			return;
 		}
-		a.value = u(e, t);
+		c.value = n(u(e, t));
 	}, {
 		flush: "post",
-		immediate: !t(e)
+		immediate: !t(e) && v
 	});
-	y(() => {
-		v(), c();
+	b(() => {
+		x(), l();
 	});
-	function l() {
-		return a.value?.disable();
-	}
 	function d() {
-		return a.value?.enable();
+		return c.value?.disable();
 	}
-	function f(e, t) {
-		return a.value?.setX(e, t);
+	function f() {
+		return c.value?.enable();
 	}
 	function p(e, t) {
-		return a.value?.setY(e, t);
+		return c.value?.setX(e, t);
 	}
-	function m(e, t, n) {
-		return a.value?.animateInView(e, t, n);
+	function m(e, t) {
+		return c.value?.setY(e, t);
 	}
 	function h(e, t, n) {
-		return a.value?.scrollInView(e, t, n);
+		return c.value?.animateInView(e, t, n);
 	}
-	function g() {
-		return a.value?.stop();
+	function g(e, t, n) {
+		return c.value?.scrollInView(e, t, n);
 	}
 	function _() {
-		return a.value?.reset();
+		return c.value?.stop();
 	}
-	function v() {
-		return a.value?.revert();
+	function y() {
+		return c.value?.reset();
 	}
-	function b() {
-		return a.value?.refresh();
+	function x() {
+		return c.value?.revert();
+	}
+	function C() {
+		return c.value?.refresh();
 	}
 	return {
-		draggable: n(a),
-		disable: l,
-		enable: d,
-		setX: f,
-		setY: p,
-		animateInView: m,
-		scrollInView: h,
-		stop: g,
-		reset: _,
-		revert: v,
-		refresh: b
+		draggable: r(c),
+		disable: d,
+		enable: f,
+		setX: p,
+		setY: m,
+		animateInView: h,
+		scrollInView: g,
+		stop: _,
+		reset: y,
+		revert: x,
+		refresh: C
 	};
 }
 //#endregion
 //#region src/composables/use-layout.ts
-function O(e, r = {}) {
-	let a = i(), { stop: c } = s([() => x(e), () => o(r)], ([e, t]) => {
-		if (p(), !e) {
-			console.warn("Target element is null or undefined"), a.value = void 0;
+function A(e, a = {}) {
+	let c = i(), { stop: l } = s([() => S(e), () => o(a)], ([e, t]) => {
+		if (m(), !e) {
+			console.warn("Target element is null or undefined"), c.value = void 0;
 			return;
 		}
-		a.value = d(e, t);
+		c.value = n(d(e, t));
 	}, {
 		flush: "post",
-		immediate: !t(e)
+		immediate: !t(e) && v
 	});
-	y(() => {
-		p(), c();
+	b(() => {
+		m(), l();
 	});
-	function l() {
-		return a.value?.record();
+	function u() {
+		return c.value?.record();
 	}
-	function u(e) {
-		return a.value?.animate(e);
+	function f(e) {
+		return c.value?.animate(e);
 	}
-	function f(e, t) {
-		return a.value?.update(e, t);
+	function p(e, t) {
+		return c.value?.update(e, t);
 	}
-	function p() {
-		return a.value?.revert();
+	function m() {
+		return c.value?.revert();
 	}
 	return {
-		layout: n(a),
-		record: l,
-		animate: u,
-		update: f,
-		revert: p
+		layout: r(c),
+		record: u,
+		animate: f,
+		update: p,
+		revert: m
 	};
 }
 //#endregion
 //#region src/composables/use-svg.ts
-function k() {
+function j() {
 	function e(e, t) {
-		let n = o(e);
-		return n ? g.morphTo(o(n), o(t)) : () => "";
+		return (n, r, i, a) => {
+			let s = o(e);
+			return s ? g.morphTo(s, o(t))(n, r, i, a) : "";
+		};
 	}
 	function t(e, t) {
 		let n = o(e) ?? "";
@@ -430,156 +446,255 @@ function k() {
 }
 //#endregion
 //#region src/composables/use-svg-drawable.ts
-function A(e, r = 0, a = 0) {
-	let c = i(), { stop: l } = s(() => x(e), (e) => {
-		if (c.value = void 0, !e) {
+function M(e, a = 0, c = 0) {
+	let l = i(), { stop: u } = s(() => S(e), (e) => {
+		if (l.value = void 0, !e) {
 			console.warn("[useSvgDrawable] Target element is null or undefined");
 			return;
 		}
-		c.value = g.createDrawable(e, o(r), o(a))[0];
+		l.value = n(g.createDrawable(e, o(a), o(c))[0]);
 	}, {
 		flush: "post",
-		immediate: !t(e)
+		immediate: !t(e) && v
 	});
-	return y(() => {
-		l(), c.value = void 0;
-	}), { drawable: n(c) };
+	return b(() => {
+		u(), l.value = void 0;
+	}), { drawable: r(l) };
 }
 //#endregion
 //#region src/composables/use-text.ts
-function j(r, a) {
-	let c = i(), l = e(() => c.value?.lines ?? []), u = e(() => c.value?.words ?? []), d = e(() => c.value?.chars ?? []), { stop: f } = s([() => x(r), () => o(a)], ([e, t]) => {
-		p(), c.value = void 0, e && (c.value = h(e, t));
+function N(a, c) {
+	let l = i(), u = e(() => l.value?.lines ?? []), d = e(() => l.value?.words ?? []), f = e(() => l.value?.chars ?? []), { stop: p } = s([() => S(a), () => o(c)], ([e, t]) => {
+		m(), l.value = void 0, e && (l.value = n(h(e, t)));
 	}, {
 		flush: "post",
-		immediate: !t(r)
+		immediate: !t(a) && v
 	});
-	y(() => {
-		f(), c.value = void 0, p();
+	b(() => {
+		p(), l.value = void 0, m();
 	});
-	function p() {
-		c.value?.revert();
-	}
 	function m() {
-		c.value?.refresh();
+		l.value?.revert();
+	}
+	function g() {
+		l.value?.refresh();
 	}
 	return {
-		splitter: n(c),
-		lines: l,
-		words: u,
-		chars: d,
-		revert: p,
-		refresh: m
+		splitter: r(l),
+		lines: u,
+		words: d,
+		chars: f,
+		revert: m,
+		refresh: g
 	};
 }
 //#endregion
 //#region src/composables/use-waapi.ts
-function M(e, r = {}) {
-	let a = i(), { stop: c } = s([() => x(e), () => o(r)], ([e, t]) => {
-		a.value = _.animate(e, t);
+function P(e, a = {}) {
+	let c = i(), { stop: l } = s([() => S(e), () => o(a)], ([e, t]) => {
+		c.value = n(_.animate(e, t));
 	}, {
 		flush: "post",
-		immediate: !t(e)
+		immediate: !t(e) && v
 	});
-	y(() => {
-		c();
+	b(() => {
+		l();
 	});
-	function l() {
-		return a.value?.resume();
-	}
 	function u() {
-		return a.value?.pause();
+		return c.value?.resume();
 	}
 	function d() {
-		return a.value?.alternate();
+		return c.value?.pause();
 	}
 	function f() {
-		return a.value?.play();
+		return c.value?.alternate();
 	}
 	function p() {
-		return a.value?.reverse();
+		return c.value?.play();
 	}
-	function m(e, t) {
-		return a.value?.seek(o(e), o(t));
+	function m() {
+		return c.value?.reverse();
 	}
-	function h() {
-		return a.value?.restart();
+	function h(e, t) {
+		return c.value?.seek(o(e), o(t));
 	}
 	function g() {
-		return a.value?.commitStyles();
+		return c.value?.restart();
 	}
-	function v() {
-		return a.value?.complete();
+	function y() {
+		return c.value?.commitStyles();
 	}
-	function b() {
-		return a.value?.cancel();
+	function x() {
+		return c.value?.complete();
 	}
-	function S() {
-		return a.value?.revert();
+	function C() {
+		return c.value?.cancel();
+	}
+	function w() {
+		return c.value?.revert();
 	}
 	return {
-		animation: n(a),
-		resume: l,
-		pause: u,
-		alternate: d,
-		play: f,
-		reverse: p,
-		seek: m,
-		restart: h,
-		commitStyles: g,
-		complete: v,
-		cancel: b,
-		revert: S,
-		convertEase: N
+		animation: r(c),
+		resume: u,
+		pause: d,
+		alternate: f,
+		play: p,
+		reverse: m,
+		seek: h,
+		restart: g,
+		commitStyles: y,
+		complete: x,
+		cancel: C,
+		revert: w,
+		convertEase: F
 	};
 }
-function N(e, t = 100) {
+function F(e, t = 100) {
 	return _.convertEase(o(e), o(t));
 }
 //#endregion
 //#region src/composables/use-scope.ts
-function P(e) {
-	let n = i(void 0), a = [], c = [], l = [], u = !1, d;
-	v(() => {
-		u = !0, n.value = f(o(e));
-		for (let e of a) n.value.add(e);
-		for (let [e, t] of c) n.value.add(e, t);
-		for (let e of l) n.value.addOnce(e);
-		a.length = 0, c.length = 0, l.length = 0, t(e) && (d = s(e, (e) => {
-			n.value?.revert(), n.value = f(e);
+function I(e) {
+	let a = i(void 0), c = [], l = [], u = [], d = !1, p;
+	y(() => {
+		d = !0, a.value = n(f(o(e)));
+		for (let e of c) a.value.add(e);
+		for (let [e, t] of l) a.value.add(e, t);
+		for (let e of u) a.value.addOnce(e);
+		c.length = 0, l.length = 0, u.length = 0, t(e) && (p = s(e, (e) => {
+			a.value?.revert(), a.value = n(f(e));
 		}, { flush: "post" }));
-	}), y(() => {
-		n.value?.revert(), d?.();
+	}), b(() => {
+		a.value?.revert(), p?.();
 	});
-	function p(e) {
-		return u ? n.value?.add(e) : void a.push(e);
+	function m(e) {
+		return d ? a.value?.add(e) : void c.push(e);
 	}
-	function m(e, t) {
-		return u ? n.value?.add(e, t) : void c.push([e, t]);
-	}
-	function h(e) {
-		return u ? n.value?.addOnce(e) : void l.push(e);
+	function h(e, t) {
+		return d ? a.value?.add(e, t) : void l.push([e, t]);
 	}
 	function g(e) {
-		return n.value?.keepTime(e);
+		return d ? a.value?.addOnce(e) : void u.push(e);
 	}
-	function _() {
-		return n.value?.revert();
+	function _(e) {
+		return a.value?.keepTime(e);
+	}
+	function v() {
+		return a.value?.revert();
 	}
-	function b() {
-		return n.value?.refresh();
+	function x() {
+		return a.value?.refresh();
 	}
 	return {
-		scope: r(n),
-		add: p,
-		registerMethod: m,
-		addOnce: h,
-		keepTime: g,
-		revert: _,
-		refresh: b
+		scope: r(a),
+		add: m,
+		registerMethod: h,
+		addOnce: g,
+		keepTime: _,
+		revert: v,
+		refresh: x
+	};
+}
+//#endregion
+//#region src/directives/v-animate.ts
+var L = /* @__PURE__ */ new WeakMap(), R = {
+	mounted(e, t) {
+		t.value && L.set(e, c(e, t.value));
+	},
+	updated(e, t) {
+		if (t.value === t.oldValue) return;
+		let n = L.get(e);
+		n?.cancel(), n?.revert(), t.value && L.set(e, c(e, t.value));
+	},
+	unmounted(e) {
+		let t = L.get(e);
+		t?.cancel(), t?.revert(), L.delete(e);
+	}
+}, z = /* @__PURE__ */ new WeakMap(), B = {
+	mounted(e, t) {
+		z.set(e, u(e, t.value ?? {}));
+	},
+	updated(e, t) {
+		t.value !== t.oldValue && (z.get(e)?.revert(), z.set(e, u(e, t.value ?? {})));
+	},
+	unmounted(e) {
+		z.get(e)?.revert(), z.delete(e);
+	}
+}, V = /* @__PURE__ */ new WeakMap();
+function H(e, t) {
+	let n = g.createDrawable(e)[0];
+	return {
+		drawable: n,
+		animation: t ? c(n, t) : void 0
+	};
+}
+var U = {
+	mounted(e, t) {
+		V.set(e, H(e, t.value));
+	},
+	updated(e, t) {
+		if (t.value === t.oldValue) return;
+		let n = V.get(e);
+		n?.animation?.cancel(), n?.animation?.revert(), V.set(e, H(e, t.value));
+	},
+	unmounted(e) {
+		let t = V.get(e);
+		t?.animation?.cancel(), t?.animation?.revert(), V.delete(e);
+	}
+}, W = /* @__PURE__ */ new WeakMap(), G = {
+	mounted(e, t) {
+		t.value && W.set(e, {
+			animation: _.animate(e, t.value),
+			originalStyle: e.style.cssText
+		});
+	},
+	updated(e, t) {
+		if (t.value === t.oldValue) return;
+		let n = W.get(e);
+		n && (n.animation.cancel(), e.style.cssText = n.originalStyle, W.delete(e)), t.value && W.set(e, {
+			animation: _.animate(e, t.value),
+			originalStyle: e.style.cssText
+		});
+	},
+	unmounted(e) {
+		let t = W.get(e);
+		t && (t.animation.cancel(), e.style.cssText = t.originalStyle, W.delete(e));
+	}
+}, K = /* @__PURE__ */ new WeakMap();
+function q(e, t) {
+	let { animation: n, ...r } = t ?? {}, i = h(e, r), a = {
+		splitter: i,
+		animation: void 0
 	};
+	if (n) {
+		if (r.lines) (document.fonts?.ready ?? Promise.resolve()).then(() => {
+			K.get(e) === a && (a.animation = c(i.lines, n));
+		});
+		else {
+			let e = r.chars ? i.chars : i.words;
+			a.animation = c(e, n);
+		}
+	}
+	return a;
+}
+function J(e) {
+	e.animation?.cancel(), e.splitter.revert();
 }
+var Y = {
+	mounted(e, t) {
+		K.set(e, q(e, t.value));
+	},
+	updated(e, t) {
+		if (t.value === t.oldValue) return;
+		let n = K.get(e);
+		n && J(n), K.set(e, q(e, t.value));
+	},
+	unmounted(e) {
+		let t = K.get(e);
+		t && J(t), K.delete(e);
+	}
+};
 //#endregion
-export { E as useAnimatable, S as useAnimate, D as useDraggable, O as useLayout, C as useRawAnimate, P as useScope, k as useSvg, A as useSvgDrawable, j as useText, T as useTimeline, w as useTimer, M as useWaapi };
+export { D as useAnimatable, C as useAnimate, k as useDraggable, A as useLayout, O as useRawAnimatable, w as useRawAnimate, I as useScope, j as useSvg, M as useSvgDrawable, N as useText, E as useTimeline, T as useTimer, P as useWaapi, R as vAnimate, B as vDraggable, U as vSvgDrawable, Y as vTextSplit, G as vWaapi };
 
 //# sourceMappingURL=index.js.map