@juleshry/vue-animejs 1.1.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -4
- package/dist/composables/use-animatable.d.ts +12 -6
- package/dist/composables/use-animatable.d.ts.map +1 -1
- package/dist/composables/use-animate.d.ts +3 -3
- package/dist/composables/use-animate.d.ts.map +1 -1
- package/dist/composables/use-draggable.d.ts +2 -2
- package/dist/composables/use-draggable.d.ts.map +1 -1
- package/dist/composables/use-layout.d.ts +2 -2
- package/dist/composables/use-layout.d.ts.map +1 -1
- package/dist/composables/use-raw-animatable.d.ts +17 -0
- package/dist/composables/use-raw-animatable.d.ts.map +1 -0
- package/dist/composables/use-raw-animate.d.ts +3 -0
- package/dist/composables/use-raw-animate.d.ts.map +1 -1
- package/dist/composables/use-scope.d.ts.map +1 -1
- package/dist/composables/use-svg-drawable.d.ts +2 -2
- package/dist/composables/use-svg-drawable.d.ts.map +1 -1
- package/dist/composables/use-svg.d.ts.map +1 -1
- package/dist/composables/use-text.d.ts +2 -2
- package/dist/composables/use-text.d.ts.map +1 -1
- package/dist/composables/use-timeline.d.ts +20 -20
- package/dist/composables/use-timeline.d.ts.map +1 -1
- package/dist/composables/use-timer.d.ts +15 -15
- package/dist/composables/use-timer.d.ts.map +1 -1
- package/dist/composables/use-waapi.d.ts +2 -2
- package/dist/composables/use-waapi.d.ts.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +404 -381
- package/dist/index.js.map +1 -1
- package/dist/utils/resolve-target.d.ts +12 -3
- package/dist/utils/resolve-target.d.ts.map +1 -1
- package/package.json +19 -18
package/dist/index.js
CHANGED
|
@@ -1,423 +1,439 @@
|
|
|
1
|
-
import { computed as e, isRef as t,
|
|
1
|
+
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";
|
|
2
2
|
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";
|
|
3
|
-
import {
|
|
3
|
+
import { isClient as v, tryOnMounted as y, tryOnUnmounted as b, unrefElement as x } from "@vueuse/core";
|
|
4
4
|
//#region src/utils/resolve-target.ts
|
|
5
|
-
function
|
|
6
|
-
|
|
5
|
+
function S(e) {
|
|
6
|
+
if (Array.isArray(e)) {
|
|
7
|
+
let t = e.map((e) => x(e)).filter((e) => e != null);
|
|
8
|
+
return t.length > 0 ? t : void 0;
|
|
9
|
+
}
|
|
10
|
+
return x(e);
|
|
7
11
|
}
|
|
8
12
|
//#endregion
|
|
9
13
|
//#region src/composables/use-animate.ts
|
|
10
|
-
function
|
|
11
|
-
let
|
|
12
|
-
|
|
14
|
+
function C(e, a = {}) {
|
|
15
|
+
let l = i(), { stop: u } = s([() => S(e), () => o(a)], ([e, t]) => {
|
|
16
|
+
d(e, t);
|
|
13
17
|
}, {
|
|
14
18
|
flush: "post",
|
|
15
|
-
immediate: !t(e)
|
|
19
|
+
immediate: !t(e) && v
|
|
16
20
|
});
|
|
17
|
-
|
|
18
|
-
|
|
21
|
+
b(() => {
|
|
22
|
+
u(), x();
|
|
19
23
|
});
|
|
20
|
-
function
|
|
21
|
-
if (
|
|
22
|
-
console.warn("Target element is null or undefined"),
|
|
24
|
+
function d(e, t) {
|
|
25
|
+
if (C(), !e) {
|
|
26
|
+
console.warn("Target element is null or undefined"), l.value = void 0;
|
|
23
27
|
return;
|
|
24
28
|
}
|
|
25
|
-
|
|
26
|
-
}
|
|
27
|
-
function d() {
|
|
28
|
-
return a.value?.play();
|
|
29
|
+
l.value = n(c(e, t));
|
|
29
30
|
}
|
|
30
31
|
function f() {
|
|
31
|
-
return
|
|
32
|
+
return l.value?.play();
|
|
32
33
|
}
|
|
33
34
|
function p() {
|
|
34
|
-
return
|
|
35
|
+
return l.value?.reverse();
|
|
35
36
|
}
|
|
36
37
|
function m() {
|
|
37
|
-
return
|
|
38
|
+
return l.value?.pause();
|
|
38
39
|
}
|
|
39
40
|
function h() {
|
|
40
|
-
return
|
|
41
|
+
return l.value?.restart();
|
|
41
42
|
}
|
|
42
43
|
function g() {
|
|
43
|
-
return
|
|
44
|
+
return l.value?.alternate();
|
|
44
45
|
}
|
|
45
46
|
function _() {
|
|
46
|
-
return
|
|
47
|
+
return l.value?.resume();
|
|
47
48
|
}
|
|
48
|
-
function
|
|
49
|
-
return
|
|
50
|
-
}
|
|
51
|
-
function b() {
|
|
52
|
-
return a.value?.revert();
|
|
49
|
+
function y() {
|
|
50
|
+
return l.value?.complete();
|
|
53
51
|
}
|
|
54
|
-
function
|
|
55
|
-
return
|
|
52
|
+
function x() {
|
|
53
|
+
return l.value?.cancel();
|
|
56
54
|
}
|
|
57
|
-
function C(
|
|
58
|
-
return
|
|
55
|
+
function C() {
|
|
56
|
+
return l.value?.revert();
|
|
59
57
|
}
|
|
60
58
|
function w(e) {
|
|
61
|
-
return
|
|
59
|
+
return l.value?.reset(e);
|
|
62
60
|
}
|
|
63
|
-
function T() {
|
|
64
|
-
return
|
|
61
|
+
function T(e, t, n) {
|
|
62
|
+
return l.value?.seek(e, t, n);
|
|
63
|
+
}
|
|
64
|
+
function E(e) {
|
|
65
|
+
return l.value?.stretch(e);
|
|
66
|
+
}
|
|
67
|
+
function D() {
|
|
68
|
+
return l.value?.refresh();
|
|
65
69
|
}
|
|
66
70
|
return {
|
|
67
|
-
animation:
|
|
68
|
-
play:
|
|
69
|
-
reverse:
|
|
70
|
-
pause:
|
|
71
|
-
restart:
|
|
72
|
-
alternate:
|
|
73
|
-
resume:
|
|
74
|
-
complete:
|
|
75
|
-
cancel:
|
|
76
|
-
revert:
|
|
77
|
-
reset:
|
|
78
|
-
seek:
|
|
79
|
-
stretch:
|
|
80
|
-
refresh:
|
|
71
|
+
animation: r(l),
|
|
72
|
+
play: f,
|
|
73
|
+
reverse: p,
|
|
74
|
+
pause: m,
|
|
75
|
+
restart: h,
|
|
76
|
+
alternate: g,
|
|
77
|
+
resume: _,
|
|
78
|
+
complete: y,
|
|
79
|
+
cancel: x,
|
|
80
|
+
revert: C,
|
|
81
|
+
reset: w,
|
|
82
|
+
seek: T,
|
|
83
|
+
stretch: E,
|
|
84
|
+
refresh: D
|
|
81
85
|
};
|
|
82
86
|
}
|
|
83
87
|
//#endregion
|
|
84
88
|
//#region src/composables/use-raw-animate.ts
|
|
85
|
-
function
|
|
86
|
-
let n =
|
|
89
|
+
function w(e, t = {}) {
|
|
90
|
+
let n = S(e);
|
|
87
91
|
return n || console.warn("Target is undefined"), c(n, o(t));
|
|
88
92
|
}
|
|
89
93
|
//#endregion
|
|
90
94
|
//#region src/composables/use-timer.ts
|
|
91
|
-
function
|
|
92
|
-
let t = i(
|
|
93
|
-
g(), t.value = m(e);
|
|
94
|
-
}, { deep: 1 });
|
|
95
|
+
function T(e = {}) {
|
|
96
|
+
let t = i();
|
|
95
97
|
y(() => {
|
|
96
|
-
|
|
98
|
+
t.value = n(m(o(e)));
|
|
99
|
+
});
|
|
100
|
+
let { stop: a } = s(() => o(e), (e) => {
|
|
101
|
+
v && (_(), t.value = n(m(e)));
|
|
102
|
+
}, { deep: 1 });
|
|
103
|
+
b(() => {
|
|
104
|
+
a(), _();
|
|
97
105
|
});
|
|
98
|
-
function a() {
|
|
99
|
-
return t.value.play();
|
|
100
|
-
}
|
|
101
106
|
function c() {
|
|
102
|
-
return t.value
|
|
107
|
+
return t.value?.play();
|
|
103
108
|
}
|
|
104
109
|
function l() {
|
|
105
|
-
return t.value
|
|
110
|
+
return t.value?.reverse();
|
|
106
111
|
}
|
|
107
112
|
function u() {
|
|
108
|
-
return t.value
|
|
113
|
+
return t.value?.pause();
|
|
109
114
|
}
|
|
110
115
|
function d() {
|
|
111
|
-
return t.value
|
|
116
|
+
return t.value?.restart();
|
|
112
117
|
}
|
|
113
118
|
function f() {
|
|
114
|
-
return t.value
|
|
119
|
+
return t.value?.alternate();
|
|
115
120
|
}
|
|
116
121
|
function p() {
|
|
117
|
-
return t.value
|
|
122
|
+
return t.value?.resume();
|
|
118
123
|
}
|
|
119
|
-
function h(
|
|
120
|
-
return t.value
|
|
124
|
+
function h() {
|
|
125
|
+
return t.value?.complete();
|
|
121
126
|
}
|
|
122
|
-
function g() {
|
|
123
|
-
return t.value
|
|
127
|
+
function g(e) {
|
|
128
|
+
return t.value?.reset(e);
|
|
124
129
|
}
|
|
125
130
|
function _() {
|
|
126
|
-
return t.value
|
|
131
|
+
return t.value?.cancel();
|
|
132
|
+
}
|
|
133
|
+
function x() {
|
|
134
|
+
return t.value?.revert();
|
|
127
135
|
}
|
|
128
|
-
function
|
|
129
|
-
return t.value
|
|
136
|
+
function S(e, n, r) {
|
|
137
|
+
return t.value?.seek(e, n, r);
|
|
130
138
|
}
|
|
131
|
-
function
|
|
132
|
-
return t.value
|
|
139
|
+
function C(e) {
|
|
140
|
+
return t.value?.stretch(e);
|
|
133
141
|
}
|
|
134
142
|
return {
|
|
135
|
-
timer:
|
|
136
|
-
play:
|
|
137
|
-
reverse:
|
|
138
|
-
pause:
|
|
139
|
-
restart:
|
|
140
|
-
alternate:
|
|
141
|
-
resume:
|
|
142
|
-
complete:
|
|
143
|
-
reset:
|
|
144
|
-
cancel:
|
|
145
|
-
revert:
|
|
146
|
-
seek:
|
|
147
|
-
stretch:
|
|
143
|
+
timer: r(t),
|
|
144
|
+
play: c,
|
|
145
|
+
reverse: l,
|
|
146
|
+
pause: u,
|
|
147
|
+
restart: d,
|
|
148
|
+
alternate: f,
|
|
149
|
+
resume: p,
|
|
150
|
+
complete: h,
|
|
151
|
+
reset: g,
|
|
152
|
+
cancel: _,
|
|
153
|
+
revert: x,
|
|
154
|
+
seek: S,
|
|
155
|
+
stretch: C
|
|
148
156
|
};
|
|
149
157
|
}
|
|
150
158
|
//#endregion
|
|
151
159
|
//#region src/composables/use-timeline.ts
|
|
152
|
-
function
|
|
153
|
-
let t = !1,
|
|
154
|
-
function
|
|
155
|
-
for (let e of
|
|
160
|
+
function E(e = {}) {
|
|
161
|
+
let t = !1, c = [], l = i();
|
|
162
|
+
function u() {
|
|
163
|
+
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);
|
|
156
164
|
}
|
|
157
|
-
let { stop:
|
|
158
|
-
|
|
165
|
+
let { stop: d } = s(() => o(e), (e) => {
|
|
166
|
+
v && (N(), l.value = n(p(e)), u());
|
|
159
167
|
}, {
|
|
160
168
|
flush: "post",
|
|
161
169
|
deep: 1
|
|
162
170
|
});
|
|
163
|
-
|
|
164
|
-
t = !0,
|
|
165
|
-
}),
|
|
166
|
-
|
|
171
|
+
y(() => {
|
|
172
|
+
l.value = n(p(o(e))), t = !0, u();
|
|
173
|
+
}), b(() => {
|
|
174
|
+
d(), M();
|
|
167
175
|
});
|
|
168
|
-
function
|
|
169
|
-
return
|
|
176
|
+
function f(e, n, r) {
|
|
177
|
+
return c.push({
|
|
170
178
|
type: "add",
|
|
171
179
|
targets: e,
|
|
172
180
|
params: n,
|
|
173
|
-
position:
|
|
181
|
+
position: r
|
|
174
182
|
}), t ? {
|
|
175
|
-
...
|
|
176
|
-
add:
|
|
177
|
-
set:
|
|
178
|
-
remove:
|
|
183
|
+
...l.value?.add(S(e), a(n), r),
|
|
184
|
+
add: f,
|
|
185
|
+
set: m,
|
|
186
|
+
remove: h
|
|
179
187
|
} : {
|
|
180
|
-
...
|
|
181
|
-
add:
|
|
182
|
-
set:
|
|
183
|
-
remove:
|
|
188
|
+
...l.value,
|
|
189
|
+
add: f,
|
|
190
|
+
set: m,
|
|
191
|
+
remove: h
|
|
184
192
|
};
|
|
185
193
|
}
|
|
186
|
-
function
|
|
187
|
-
return
|
|
194
|
+
function m(e, n, r) {
|
|
195
|
+
return c.push({
|
|
188
196
|
type: "set",
|
|
189
197
|
targets: e,
|
|
190
198
|
params: n,
|
|
191
|
-
position:
|
|
199
|
+
position: r
|
|
192
200
|
}), t ? {
|
|
193
|
-
...
|
|
194
|
-
add:
|
|
195
|
-
set:
|
|
196
|
-
remove:
|
|
201
|
+
...l.value?.set(S(e), a(n), r),
|
|
202
|
+
add: f,
|
|
203
|
+
set: m,
|
|
204
|
+
remove: h
|
|
197
205
|
} : {
|
|
198
|
-
...
|
|
199
|
-
add:
|
|
200
|
-
set:
|
|
201
|
-
remove:
|
|
206
|
+
...l.value,
|
|
207
|
+
add: f,
|
|
208
|
+
set: m,
|
|
209
|
+
remove: h
|
|
202
210
|
};
|
|
203
211
|
}
|
|
204
|
-
function
|
|
212
|
+
function h(e, n) {
|
|
205
213
|
return t ? {
|
|
206
|
-
...
|
|
207
|
-
add:
|
|
208
|
-
set:
|
|
209
|
-
remove:
|
|
214
|
+
...l.value?.remove(S(e), n),
|
|
215
|
+
add: f,
|
|
216
|
+
set: m,
|
|
217
|
+
remove: h
|
|
210
218
|
} : (console.warn("Cannot remove from timeline before mount"), {
|
|
211
|
-
...
|
|
212
|
-
add:
|
|
213
|
-
set:
|
|
214
|
-
remove:
|
|
219
|
+
...l.value,
|
|
220
|
+
add: f,
|
|
221
|
+
set: m,
|
|
222
|
+
remove: h
|
|
215
223
|
});
|
|
216
224
|
}
|
|
217
|
-
function h(e, t) {
|
|
218
|
-
return c.value.sync(e, t);
|
|
219
|
-
}
|
|
220
225
|
function g(e, t) {
|
|
221
|
-
return
|
|
226
|
+
return l.value?.sync(e, t);
|
|
222
227
|
}
|
|
223
228
|
function _(e, t) {
|
|
224
|
-
return
|
|
229
|
+
return l.value?.label(e, t);
|
|
225
230
|
}
|
|
226
|
-
function
|
|
227
|
-
return
|
|
231
|
+
function x(e, t) {
|
|
232
|
+
return l.value?.call(e, t);
|
|
228
233
|
}
|
|
229
|
-
function
|
|
230
|
-
return
|
|
231
|
-
}
|
|
232
|
-
function C() {
|
|
233
|
-
return c.value.reverse();
|
|
234
|
+
function C(e) {
|
|
235
|
+
return l.value?.init(e);
|
|
234
236
|
}
|
|
235
237
|
function w() {
|
|
236
|
-
return
|
|
238
|
+
return l.value?.play();
|
|
237
239
|
}
|
|
238
240
|
function T() {
|
|
239
|
-
return
|
|
241
|
+
return l.value?.reverse();
|
|
240
242
|
}
|
|
241
243
|
function E() {
|
|
242
|
-
return
|
|
244
|
+
return l.value?.pause();
|
|
243
245
|
}
|
|
244
246
|
function D() {
|
|
245
|
-
return
|
|
247
|
+
return l.value?.restart();
|
|
246
248
|
}
|
|
247
249
|
function O() {
|
|
248
|
-
return
|
|
250
|
+
return l.value?.alternate();
|
|
249
251
|
}
|
|
250
|
-
function k(
|
|
251
|
-
return
|
|
252
|
+
function k() {
|
|
253
|
+
return l.value?.resume();
|
|
252
254
|
}
|
|
253
255
|
function A() {
|
|
254
|
-
return
|
|
256
|
+
return l.value?.complete();
|
|
257
|
+
}
|
|
258
|
+
function j(e) {
|
|
259
|
+
return l.value?.reset(e);
|
|
255
260
|
}
|
|
256
|
-
function
|
|
257
|
-
return
|
|
261
|
+
function M() {
|
|
262
|
+
return l.value?.cancel();
|
|
258
263
|
}
|
|
259
|
-
function
|
|
260
|
-
return
|
|
264
|
+
function N() {
|
|
265
|
+
return l.value?.revert();
|
|
261
266
|
}
|
|
262
|
-
function
|
|
263
|
-
return
|
|
267
|
+
function P(e, t, n) {
|
|
268
|
+
return l.value?.seek(e, t, n);
|
|
264
269
|
}
|
|
265
|
-
function
|
|
266
|
-
return
|
|
270
|
+
function F(e) {
|
|
271
|
+
return l.value?.stretch(e);
|
|
272
|
+
}
|
|
273
|
+
function I() {
|
|
274
|
+
return l.value?.refresh();
|
|
267
275
|
}
|
|
268
276
|
return {
|
|
269
|
-
timeline:
|
|
270
|
-
add:
|
|
271
|
-
set:
|
|
272
|
-
sync:
|
|
273
|
-
label:
|
|
274
|
-
remove:
|
|
275
|
-
call:
|
|
276
|
-
init:
|
|
277
|
-
play:
|
|
278
|
-
reverse:
|
|
279
|
-
pause:
|
|
280
|
-
restart:
|
|
281
|
-
alternate:
|
|
282
|
-
resume:
|
|
283
|
-
complete:
|
|
284
|
-
reset:
|
|
285
|
-
cancel:
|
|
286
|
-
revert:
|
|
287
|
-
seek:
|
|
288
|
-
stretch:
|
|
289
|
-
refresh:
|
|
277
|
+
timeline: r(l),
|
|
278
|
+
add: f,
|
|
279
|
+
set: m,
|
|
280
|
+
sync: g,
|
|
281
|
+
label: _,
|
|
282
|
+
remove: h,
|
|
283
|
+
call: x,
|
|
284
|
+
init: C,
|
|
285
|
+
play: w,
|
|
286
|
+
reverse: T,
|
|
287
|
+
pause: E,
|
|
288
|
+
restart: D,
|
|
289
|
+
alternate: O,
|
|
290
|
+
resume: k,
|
|
291
|
+
complete: A,
|
|
292
|
+
reset: j,
|
|
293
|
+
cancel: M,
|
|
294
|
+
revert: N,
|
|
295
|
+
seek: P,
|
|
296
|
+
stretch: F,
|
|
297
|
+
refresh: I
|
|
290
298
|
};
|
|
291
299
|
}
|
|
292
300
|
//#endregion
|
|
293
301
|
//#region src/composables/use-animatable.ts
|
|
294
|
-
function
|
|
295
|
-
let
|
|
296
|
-
el:
|
|
297
|
-
opt: o(
|
|
298
|
-
})), ({ el: e, opt: t }) => {
|
|
299
|
-
if (
|
|
300
|
-
console.warn("Targets element is null or undefined"),
|
|
302
|
+
function D(a, c = {}) {
|
|
303
|
+
let u = i(), d = e(() => ({
|
|
304
|
+
el: S(a),
|
|
305
|
+
opt: o(c)
|
|
306
|
+
})), { stop: f } = s(d, ({ el: e, opt: t }) => {
|
|
307
|
+
if (p(), !e) {
|
|
308
|
+
console.warn("Targets element is null or undefined"), u.value = void 0;
|
|
301
309
|
return;
|
|
302
310
|
}
|
|
303
|
-
|
|
311
|
+
u.value = n(l(e, t));
|
|
304
312
|
}, {
|
|
305
313
|
flush: "post",
|
|
306
|
-
immediate: !t(
|
|
314
|
+
immediate: !t(a) && v
|
|
307
315
|
});
|
|
308
|
-
|
|
309
|
-
|
|
316
|
+
b(() => {
|
|
317
|
+
f(), p();
|
|
310
318
|
});
|
|
311
|
-
function
|
|
312
|
-
return
|
|
319
|
+
function p() {
|
|
320
|
+
return u.value?.revert();
|
|
313
321
|
}
|
|
314
322
|
return {
|
|
315
|
-
animatable:
|
|
316
|
-
revert:
|
|
323
|
+
animatable: r(u),
|
|
324
|
+
revert: p
|
|
317
325
|
};
|
|
318
326
|
}
|
|
319
327
|
//#endregion
|
|
328
|
+
//#region src/composables/use-raw-animatable.ts
|
|
329
|
+
function O(e, t = {}) {
|
|
330
|
+
let n = S(e);
|
|
331
|
+
return n || console.warn("Targets element is null or undefined"), l(n, o(t));
|
|
332
|
+
}
|
|
333
|
+
//#endregion
|
|
320
334
|
//#region src/composables/use-draggable.ts
|
|
321
|
-
function
|
|
322
|
-
let
|
|
323
|
-
if (
|
|
324
|
-
console.warn("Targets element is null or undefined"),
|
|
335
|
+
function k(e, a = {}) {
|
|
336
|
+
let c = i(), { stop: l } = s([() => S(e), () => o(a)], ([e, t]) => {
|
|
337
|
+
if (x(), !e) {
|
|
338
|
+
console.warn("Targets element is null or undefined"), c.value = void 0;
|
|
325
339
|
return;
|
|
326
340
|
}
|
|
327
|
-
|
|
341
|
+
c.value = n(u(e, t));
|
|
328
342
|
}, {
|
|
329
343
|
flush: "post",
|
|
330
|
-
immediate: !t(e)
|
|
344
|
+
immediate: !t(e) && v
|
|
331
345
|
});
|
|
332
|
-
|
|
333
|
-
|
|
346
|
+
b(() => {
|
|
347
|
+
x(), l();
|
|
334
348
|
});
|
|
335
|
-
function l() {
|
|
336
|
-
return a.value?.disable();
|
|
337
|
-
}
|
|
338
349
|
function d() {
|
|
339
|
-
return
|
|
350
|
+
return c.value?.disable();
|
|
340
351
|
}
|
|
341
|
-
function f(
|
|
342
|
-
return
|
|
352
|
+
function f() {
|
|
353
|
+
return c.value?.enable();
|
|
343
354
|
}
|
|
344
355
|
function p(e, t) {
|
|
345
|
-
return
|
|
356
|
+
return c.value?.setX(e, t);
|
|
346
357
|
}
|
|
347
|
-
function m(e, t
|
|
348
|
-
return
|
|
358
|
+
function m(e, t) {
|
|
359
|
+
return c.value?.setY(e, t);
|
|
349
360
|
}
|
|
350
361
|
function h(e, t, n) {
|
|
351
|
-
return
|
|
362
|
+
return c.value?.animateInView(e, t, n);
|
|
352
363
|
}
|
|
353
|
-
function g() {
|
|
354
|
-
return
|
|
364
|
+
function g(e, t, n) {
|
|
365
|
+
return c.value?.scrollInView(e, t, n);
|
|
355
366
|
}
|
|
356
367
|
function _() {
|
|
357
|
-
return
|
|
368
|
+
return c.value?.stop();
|
|
358
369
|
}
|
|
359
|
-
function
|
|
360
|
-
return
|
|
370
|
+
function y() {
|
|
371
|
+
return c.value?.reset();
|
|
361
372
|
}
|
|
362
|
-
function
|
|
363
|
-
return
|
|
373
|
+
function x() {
|
|
374
|
+
return c.value?.revert();
|
|
375
|
+
}
|
|
376
|
+
function C() {
|
|
377
|
+
return c.value?.refresh();
|
|
364
378
|
}
|
|
365
379
|
return {
|
|
366
|
-
draggable:
|
|
367
|
-
disable:
|
|
368
|
-
enable:
|
|
369
|
-
setX:
|
|
370
|
-
setY:
|
|
371
|
-
animateInView:
|
|
372
|
-
scrollInView:
|
|
373
|
-
stop:
|
|
374
|
-
reset:
|
|
375
|
-
revert:
|
|
376
|
-
refresh:
|
|
380
|
+
draggable: r(c),
|
|
381
|
+
disable: d,
|
|
382
|
+
enable: f,
|
|
383
|
+
setX: p,
|
|
384
|
+
setY: m,
|
|
385
|
+
animateInView: h,
|
|
386
|
+
scrollInView: g,
|
|
387
|
+
stop: _,
|
|
388
|
+
reset: y,
|
|
389
|
+
revert: x,
|
|
390
|
+
refresh: C
|
|
377
391
|
};
|
|
378
392
|
}
|
|
379
393
|
//#endregion
|
|
380
394
|
//#region src/composables/use-layout.ts
|
|
381
|
-
function
|
|
382
|
-
let
|
|
383
|
-
if (
|
|
384
|
-
console.warn("Target element is null or undefined"),
|
|
395
|
+
function A(e, a = {}) {
|
|
396
|
+
let c = i(), { stop: l } = s([() => S(e), () => o(a)], ([e, t]) => {
|
|
397
|
+
if (m(), !e) {
|
|
398
|
+
console.warn("Target element is null or undefined"), c.value = void 0;
|
|
385
399
|
return;
|
|
386
400
|
}
|
|
387
|
-
|
|
401
|
+
c.value = n(d(e, t));
|
|
388
402
|
}, {
|
|
389
403
|
flush: "post",
|
|
390
|
-
immediate: !t(e)
|
|
404
|
+
immediate: !t(e) && v
|
|
391
405
|
});
|
|
392
|
-
|
|
393
|
-
|
|
406
|
+
b(() => {
|
|
407
|
+
m(), l();
|
|
394
408
|
});
|
|
395
|
-
function
|
|
396
|
-
return
|
|
409
|
+
function u() {
|
|
410
|
+
return c.value?.record();
|
|
397
411
|
}
|
|
398
|
-
function
|
|
399
|
-
return
|
|
412
|
+
function f(e) {
|
|
413
|
+
return c.value?.animate(e);
|
|
400
414
|
}
|
|
401
|
-
function
|
|
402
|
-
return
|
|
415
|
+
function p(e, t) {
|
|
416
|
+
return c.value?.update(e, t);
|
|
403
417
|
}
|
|
404
|
-
function
|
|
405
|
-
return
|
|
418
|
+
function m() {
|
|
419
|
+
return c.value?.revert();
|
|
406
420
|
}
|
|
407
421
|
return {
|
|
408
|
-
layout:
|
|
409
|
-
record:
|
|
410
|
-
animate:
|
|
411
|
-
update:
|
|
412
|
-
revert:
|
|
422
|
+
layout: r(c),
|
|
423
|
+
record: u,
|
|
424
|
+
animate: f,
|
|
425
|
+
update: p,
|
|
426
|
+
revert: m
|
|
413
427
|
};
|
|
414
428
|
}
|
|
415
429
|
//#endregion
|
|
416
430
|
//#region src/composables/use-svg.ts
|
|
417
|
-
function
|
|
431
|
+
function j() {
|
|
418
432
|
function e(e, t) {
|
|
419
|
-
|
|
420
|
-
|
|
433
|
+
return (n, r, i, a) => {
|
|
434
|
+
let s = o(e);
|
|
435
|
+
return s ? g.morphTo(s, o(t))(n, r, i, a) : "";
|
|
436
|
+
};
|
|
421
437
|
}
|
|
422
438
|
function t(e, t) {
|
|
423
439
|
let n = o(e) ?? "";
|
|
@@ -430,248 +446,255 @@ function k() {
|
|
|
430
446
|
}
|
|
431
447
|
//#endregion
|
|
432
448
|
//#region src/composables/use-svg-drawable.ts
|
|
433
|
-
function
|
|
434
|
-
let
|
|
435
|
-
if (
|
|
449
|
+
function M(e, a = 0, c = 0) {
|
|
450
|
+
let l = i(), { stop: u } = s(() => S(e), (e) => {
|
|
451
|
+
if (l.value = void 0, !e) {
|
|
436
452
|
console.warn("[useSvgDrawable] Target element is null or undefined");
|
|
437
453
|
return;
|
|
438
454
|
}
|
|
439
|
-
|
|
455
|
+
l.value = n(g.createDrawable(e, o(a), o(c))[0]);
|
|
440
456
|
}, {
|
|
441
457
|
flush: "post",
|
|
442
|
-
immediate: !t(e)
|
|
458
|
+
immediate: !t(e) && v
|
|
443
459
|
});
|
|
444
|
-
return
|
|
445
|
-
|
|
446
|
-
}), { drawable:
|
|
460
|
+
return b(() => {
|
|
461
|
+
u(), l.value = void 0;
|
|
462
|
+
}), { drawable: r(l) };
|
|
447
463
|
}
|
|
448
464
|
//#endregion
|
|
449
465
|
//#region src/composables/use-text.ts
|
|
450
|
-
function
|
|
451
|
-
let
|
|
452
|
-
|
|
466
|
+
function N(a, c) {
|
|
467
|
+
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]) => {
|
|
468
|
+
m(), l.value = void 0, e && (l.value = n(h(e, t)));
|
|
453
469
|
}, {
|
|
454
470
|
flush: "post",
|
|
455
|
-
immediate: !t(
|
|
471
|
+
immediate: !t(a) && v
|
|
456
472
|
});
|
|
457
|
-
|
|
458
|
-
|
|
473
|
+
b(() => {
|
|
474
|
+
p(), l.value = void 0, m();
|
|
459
475
|
});
|
|
460
|
-
function p() {
|
|
461
|
-
c.value?.revert();
|
|
462
|
-
}
|
|
463
476
|
function m() {
|
|
464
|
-
|
|
477
|
+
l.value?.revert();
|
|
478
|
+
}
|
|
479
|
+
function g() {
|
|
480
|
+
l.value?.refresh();
|
|
465
481
|
}
|
|
466
482
|
return {
|
|
467
|
-
splitter:
|
|
468
|
-
lines:
|
|
469
|
-
words:
|
|
470
|
-
chars:
|
|
471
|
-
revert:
|
|
472
|
-
refresh:
|
|
483
|
+
splitter: r(l),
|
|
484
|
+
lines: u,
|
|
485
|
+
words: d,
|
|
486
|
+
chars: f,
|
|
487
|
+
revert: m,
|
|
488
|
+
refresh: g
|
|
473
489
|
};
|
|
474
490
|
}
|
|
475
491
|
//#endregion
|
|
476
492
|
//#region src/composables/use-waapi.ts
|
|
477
|
-
function
|
|
478
|
-
let
|
|
479
|
-
|
|
493
|
+
function P(e, a = {}) {
|
|
494
|
+
let c = i(), { stop: l } = s([() => S(e), () => o(a)], ([e, t]) => {
|
|
495
|
+
c.value = n(_.animate(e, t));
|
|
480
496
|
}, {
|
|
481
497
|
flush: "post",
|
|
482
|
-
immediate: !t(e)
|
|
498
|
+
immediate: !t(e) && v
|
|
483
499
|
});
|
|
484
|
-
|
|
485
|
-
|
|
500
|
+
b(() => {
|
|
501
|
+
l();
|
|
486
502
|
});
|
|
487
|
-
function l() {
|
|
488
|
-
return a.value?.resume();
|
|
489
|
-
}
|
|
490
503
|
function u() {
|
|
491
|
-
return
|
|
504
|
+
return c.value?.resume();
|
|
492
505
|
}
|
|
493
506
|
function d() {
|
|
494
|
-
return
|
|
507
|
+
return c.value?.pause();
|
|
495
508
|
}
|
|
496
509
|
function f() {
|
|
497
|
-
return
|
|
510
|
+
return c.value?.alternate();
|
|
498
511
|
}
|
|
499
512
|
function p() {
|
|
500
|
-
return
|
|
513
|
+
return c.value?.play();
|
|
501
514
|
}
|
|
502
|
-
function m(
|
|
503
|
-
return
|
|
515
|
+
function m() {
|
|
516
|
+
return c.value?.reverse();
|
|
504
517
|
}
|
|
505
|
-
function h() {
|
|
506
|
-
return
|
|
518
|
+
function h(e, t) {
|
|
519
|
+
return c.value?.seek(o(e), o(t));
|
|
507
520
|
}
|
|
508
521
|
function g() {
|
|
509
|
-
return
|
|
522
|
+
return c.value?.restart();
|
|
510
523
|
}
|
|
511
|
-
function
|
|
512
|
-
return
|
|
524
|
+
function y() {
|
|
525
|
+
return c.value?.commitStyles();
|
|
513
526
|
}
|
|
514
|
-
function
|
|
515
|
-
return
|
|
527
|
+
function x() {
|
|
528
|
+
return c.value?.complete();
|
|
516
529
|
}
|
|
517
|
-
function
|
|
518
|
-
return
|
|
530
|
+
function C() {
|
|
531
|
+
return c.value?.cancel();
|
|
532
|
+
}
|
|
533
|
+
function w() {
|
|
534
|
+
return c.value?.revert();
|
|
519
535
|
}
|
|
520
536
|
return {
|
|
521
|
-
animation:
|
|
522
|
-
resume:
|
|
523
|
-
pause:
|
|
524
|
-
alternate:
|
|
525
|
-
play:
|
|
526
|
-
reverse:
|
|
527
|
-
seek:
|
|
528
|
-
restart:
|
|
529
|
-
commitStyles:
|
|
530
|
-
complete:
|
|
531
|
-
cancel:
|
|
532
|
-
revert:
|
|
533
|
-
convertEase:
|
|
537
|
+
animation: r(c),
|
|
538
|
+
resume: u,
|
|
539
|
+
pause: d,
|
|
540
|
+
alternate: f,
|
|
541
|
+
play: p,
|
|
542
|
+
reverse: m,
|
|
543
|
+
seek: h,
|
|
544
|
+
restart: g,
|
|
545
|
+
commitStyles: y,
|
|
546
|
+
complete: x,
|
|
547
|
+
cancel: C,
|
|
548
|
+
revert: w,
|
|
549
|
+
convertEase: F
|
|
534
550
|
};
|
|
535
551
|
}
|
|
536
|
-
function
|
|
552
|
+
function F(e, t = 100) {
|
|
537
553
|
return _.convertEase(o(e), o(t));
|
|
538
554
|
}
|
|
539
555
|
//#endregion
|
|
540
556
|
//#region src/composables/use-scope.ts
|
|
541
|
-
function
|
|
542
|
-
let
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
for (let e of
|
|
546
|
-
for (let [e, t] of
|
|
547
|
-
for (let e of
|
|
548
|
-
|
|
549
|
-
|
|
557
|
+
function I(e) {
|
|
558
|
+
let a = i(void 0), c = [], l = [], u = [], d = !1, p;
|
|
559
|
+
y(() => {
|
|
560
|
+
d = !0, a.value = n(f(o(e)));
|
|
561
|
+
for (let e of c) a.value.add(e);
|
|
562
|
+
for (let [e, t] of l) a.value.add(e, t);
|
|
563
|
+
for (let e of u) a.value.addOnce(e);
|
|
564
|
+
c.length = 0, l.length = 0, u.length = 0, t(e) && (p = s(e, (e) => {
|
|
565
|
+
a.value?.revert(), a.value = n(f(e));
|
|
550
566
|
}, { flush: "post" }));
|
|
551
|
-
}),
|
|
552
|
-
|
|
567
|
+
}), b(() => {
|
|
568
|
+
a.value?.revert(), p?.();
|
|
553
569
|
});
|
|
554
|
-
function
|
|
555
|
-
return
|
|
570
|
+
function m(e) {
|
|
571
|
+
return d ? a.value?.add(e) : void c.push(e);
|
|
556
572
|
}
|
|
557
|
-
function
|
|
558
|
-
return
|
|
559
|
-
}
|
|
560
|
-
function h(e) {
|
|
561
|
-
return u ? n.value?.addOnce(e) : void l.push(e);
|
|
573
|
+
function h(e, t) {
|
|
574
|
+
return d ? a.value?.add(e, t) : void l.push([e, t]);
|
|
562
575
|
}
|
|
563
576
|
function g(e) {
|
|
564
|
-
return
|
|
577
|
+
return d ? a.value?.addOnce(e) : void u.push(e);
|
|
565
578
|
}
|
|
566
|
-
function _() {
|
|
567
|
-
return
|
|
579
|
+
function _(e) {
|
|
580
|
+
return a.value?.keepTime(e);
|
|
568
581
|
}
|
|
569
|
-
function
|
|
570
|
-
return
|
|
582
|
+
function v() {
|
|
583
|
+
return a.value?.revert();
|
|
584
|
+
}
|
|
585
|
+
function x() {
|
|
586
|
+
return a.value?.refresh();
|
|
571
587
|
}
|
|
572
588
|
return {
|
|
573
|
-
scope: r(
|
|
574
|
-
add:
|
|
575
|
-
registerMethod:
|
|
576
|
-
addOnce:
|
|
577
|
-
keepTime:
|
|
578
|
-
revert:
|
|
579
|
-
refresh:
|
|
589
|
+
scope: r(a),
|
|
590
|
+
add: m,
|
|
591
|
+
registerMethod: h,
|
|
592
|
+
addOnce: g,
|
|
593
|
+
keepTime: _,
|
|
594
|
+
revert: v,
|
|
595
|
+
refresh: x
|
|
580
596
|
};
|
|
581
597
|
}
|
|
582
598
|
//#endregion
|
|
583
599
|
//#region src/directives/v-animate.ts
|
|
584
|
-
var
|
|
600
|
+
var L = /* @__PURE__ */ new WeakMap(), R = {
|
|
585
601
|
mounted(e, t) {
|
|
586
|
-
t.value &&
|
|
602
|
+
t.value && L.set(e, c(e, t.value));
|
|
587
603
|
},
|
|
588
604
|
updated(e, t) {
|
|
589
605
|
if (t.value === t.oldValue) return;
|
|
590
|
-
let n =
|
|
591
|
-
n?.cancel(), n?.revert(), t.value &&
|
|
606
|
+
let n = L.get(e);
|
|
607
|
+
n?.cancel(), n?.revert(), t.value && L.set(e, c(e, t.value));
|
|
592
608
|
},
|
|
593
609
|
unmounted(e) {
|
|
594
|
-
let t =
|
|
595
|
-
t?.cancel(), t?.revert(),
|
|
610
|
+
let t = L.get(e);
|
|
611
|
+
t?.cancel(), t?.revert(), L.delete(e);
|
|
596
612
|
}
|
|
597
|
-
},
|
|
613
|
+
}, z = /* @__PURE__ */ new WeakMap(), B = {
|
|
598
614
|
mounted(e, t) {
|
|
599
|
-
|
|
615
|
+
z.set(e, u(e, t.value ?? {}));
|
|
600
616
|
},
|
|
601
617
|
updated(e, t) {
|
|
602
|
-
t.value !== t.oldValue && (
|
|
618
|
+
t.value !== t.oldValue && (z.get(e)?.revert(), z.set(e, u(e, t.value ?? {})));
|
|
603
619
|
},
|
|
604
620
|
unmounted(e) {
|
|
605
|
-
|
|
621
|
+
z.get(e)?.revert(), z.delete(e);
|
|
606
622
|
}
|
|
607
|
-
},
|
|
608
|
-
function
|
|
623
|
+
}, V = /* @__PURE__ */ new WeakMap();
|
|
624
|
+
function H(e, t) {
|
|
609
625
|
let n = g.createDrawable(e)[0];
|
|
610
626
|
return {
|
|
611
627
|
drawable: n,
|
|
612
628
|
animation: t ? c(n, t) : void 0
|
|
613
629
|
};
|
|
614
630
|
}
|
|
615
|
-
var
|
|
631
|
+
var U = {
|
|
616
632
|
mounted(e, t) {
|
|
617
|
-
|
|
633
|
+
V.set(e, H(e, t.value));
|
|
618
634
|
},
|
|
619
635
|
updated(e, t) {
|
|
620
636
|
if (t.value === t.oldValue) return;
|
|
621
|
-
let n =
|
|
622
|
-
n?.animation?.cancel(), n?.animation?.revert(),
|
|
637
|
+
let n = V.get(e);
|
|
638
|
+
n?.animation?.cancel(), n?.animation?.revert(), V.set(e, H(e, t.value));
|
|
623
639
|
},
|
|
624
640
|
unmounted(e) {
|
|
625
|
-
let t =
|
|
626
|
-
t?.animation?.cancel(), t?.animation?.revert(),
|
|
641
|
+
let t = V.get(e);
|
|
642
|
+
t?.animation?.cancel(), t?.animation?.revert(), V.delete(e);
|
|
627
643
|
}
|
|
628
|
-
},
|
|
644
|
+
}, W = /* @__PURE__ */ new WeakMap(), G = {
|
|
629
645
|
mounted(e, t) {
|
|
630
|
-
t.value &&
|
|
646
|
+
t.value && W.set(e, {
|
|
631
647
|
animation: _.animate(e, t.value),
|
|
632
648
|
originalStyle: e.style.cssText
|
|
633
649
|
});
|
|
634
650
|
},
|
|
635
651
|
updated(e, t) {
|
|
636
652
|
if (t.value === t.oldValue) return;
|
|
637
|
-
let n =
|
|
638
|
-
n && (n.animation.cancel(), e.style.cssText = n.originalStyle,
|
|
653
|
+
let n = W.get(e);
|
|
654
|
+
n && (n.animation.cancel(), e.style.cssText = n.originalStyle, W.delete(e)), t.value && W.set(e, {
|
|
639
655
|
animation: _.animate(e, t.value),
|
|
640
656
|
originalStyle: e.style.cssText
|
|
641
657
|
});
|
|
642
658
|
},
|
|
643
659
|
unmounted(e) {
|
|
644
|
-
let t =
|
|
645
|
-
t && (t.animation.cancel(), e.style.cssText = t.originalStyle,
|
|
660
|
+
let t = W.get(e);
|
|
661
|
+
t && (t.animation.cancel(), e.style.cssText = t.originalStyle, W.delete(e));
|
|
646
662
|
}
|
|
647
|
-
},
|
|
648
|
-
function
|
|
663
|
+
}, K = /* @__PURE__ */ new WeakMap();
|
|
664
|
+
function q(e, t) {
|
|
649
665
|
let { animation: n, ...r } = t ?? {}, i = h(e, r), a = {
|
|
650
666
|
splitter: i,
|
|
651
667
|
animation: void 0
|
|
652
668
|
};
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
669
|
+
if (n) {
|
|
670
|
+
if (r.lines) (document.fonts?.ready ?? Promise.resolve()).then(() => {
|
|
671
|
+
K.get(e) === a && (a.animation = c(i.lines, n));
|
|
672
|
+
});
|
|
673
|
+
else {
|
|
674
|
+
let e = r.chars ? i.chars : i.words;
|
|
675
|
+
a.animation = c(e, n);
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
return a;
|
|
656
679
|
}
|
|
657
|
-
function
|
|
680
|
+
function J(e) {
|
|
658
681
|
e.animation?.cancel(), e.splitter.revert();
|
|
659
682
|
}
|
|
660
|
-
var
|
|
683
|
+
var Y = {
|
|
661
684
|
mounted(e, t) {
|
|
662
|
-
|
|
685
|
+
K.set(e, q(e, t.value));
|
|
663
686
|
},
|
|
664
687
|
updated(e, t) {
|
|
665
688
|
if (t.value === t.oldValue) return;
|
|
666
|
-
let n =
|
|
667
|
-
n &&
|
|
689
|
+
let n = K.get(e);
|
|
690
|
+
n && J(n), K.set(e, q(e, t.value));
|
|
668
691
|
},
|
|
669
692
|
unmounted(e) {
|
|
670
|
-
let t =
|
|
671
|
-
t &&
|
|
693
|
+
let t = K.get(e);
|
|
694
|
+
t && J(t), K.delete(e);
|
|
672
695
|
}
|
|
673
696
|
};
|
|
674
697
|
//#endregion
|
|
675
|
-
export {
|
|
698
|
+
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 };
|
|
676
699
|
|
|
677
700
|
//# sourceMappingURL=index.js.map
|