snail.view 1.0.17 → 1.0.19
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/dist/snail.view.js +3 -3
- package/dist/snail.view.umd.js +3 -3
- package/dist/styles/animation.less +66 -0
- package/package.json +1 -1
package/dist/snail.view.js
CHANGED
|
@@ -121,7 +121,7 @@ function useAnimation() {
|
|
|
121
121
|
}
|
|
122
122
|
const manager = mountScope({
|
|
123
123
|
transition
|
|
124
|
-
});
|
|
124
|
+
}, "IAnimationManager");
|
|
125
125
|
manager.onDestroy(scopes.destroy);
|
|
126
126
|
return Object.freeze(manager);
|
|
127
127
|
}
|
|
@@ -233,7 +233,7 @@ function useLink(options) {
|
|
|
233
233
|
const manager = mountScope({
|
|
234
234
|
register,
|
|
235
235
|
theme
|
|
236
|
-
});
|
|
236
|
+
}, "ILinkManager");
|
|
237
237
|
{
|
|
238
238
|
manager.onDestroy(() => {
|
|
239
239
|
event.off(EVENT_ChangeTheme, theme);
|
|
@@ -309,7 +309,7 @@ function useObserver() {
|
|
|
309
309
|
onEvent,
|
|
310
310
|
onSize,
|
|
311
311
|
onClient
|
|
312
|
-
});
|
|
312
|
+
}, "IObserver");
|
|
313
313
|
manager.onDestroy(scopes.destroy);
|
|
314
314
|
return Object.freeze(manager);
|
|
315
315
|
}
|
package/dist/snail.view.umd.js
CHANGED
|
@@ -125,7 +125,7 @@
|
|
|
125
125
|
}
|
|
126
126
|
const manager = snail_core.mountScope({
|
|
127
127
|
transition
|
|
128
|
-
});
|
|
128
|
+
}, "IAnimationManager");
|
|
129
129
|
manager.onDestroy(scopes.destroy);
|
|
130
130
|
return Object.freeze(manager);
|
|
131
131
|
}
|
|
@@ -237,7 +237,7 @@
|
|
|
237
237
|
const manager = snail_core.mountScope({
|
|
238
238
|
register,
|
|
239
239
|
theme
|
|
240
|
-
});
|
|
240
|
+
}, "ILinkManager");
|
|
241
241
|
{
|
|
242
242
|
manager.onDestroy(() => {
|
|
243
243
|
snail_core.event.off(EVENT_ChangeTheme, theme);
|
|
@@ -313,7 +313,7 @@
|
|
|
313
313
|
onEvent,
|
|
314
314
|
onSize,
|
|
315
315
|
onClient
|
|
316
|
-
});
|
|
316
|
+
}, "IObserver");
|
|
317
317
|
manager.onDestroy(scopes.destroy);
|
|
318
318
|
return Object.freeze(manager);
|
|
319
319
|
}
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
// 动画库；做一些基础动画效果，以 .snail-动画名-进入、移出 为规则
|
|
2
|
+
|
|
3
|
+
/***************************************** 👉 公共动画 *****************************************************/
|
|
4
|
+
// 淡入动画
|
|
5
|
+
.snail-fade-in {
|
|
6
|
+
opacity: 1;
|
|
7
|
+
animation: snail-fade-in 0.4s ease-in-out;
|
|
8
|
+
|
|
9
|
+
@keyframes snail-fade-in {
|
|
10
|
+
0% {
|
|
11
|
+
opacity: 0;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
100% {
|
|
15
|
+
opacity: 1;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
// 淡出动画
|
|
21
|
+
.snail-fade-out {
|
|
22
|
+
opacity: 0;
|
|
23
|
+
animation: snail-fade-out 0.4s ease-in-out;
|
|
24
|
+
|
|
25
|
+
@keyframes snail-fade-out {
|
|
26
|
+
0% {
|
|
27
|
+
opacity: 1;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
100% {
|
|
31
|
+
opacity: 0;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
// 放大进入
|
|
37
|
+
.snail-scale-in {
|
|
38
|
+
scale: 1;
|
|
39
|
+
animation: snail-scale-in 0.2s ease-in-out;
|
|
40
|
+
|
|
41
|
+
@keyframes snail-scale-in {
|
|
42
|
+
0% {
|
|
43
|
+
scale: 0;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
100% {
|
|
47
|
+
scale: 1;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// 缩小退出
|
|
53
|
+
.snail-scale-out {
|
|
54
|
+
scale: 0;
|
|
55
|
+
animation: snail-scale-out 0.2s ease-in-out;
|
|
56
|
+
|
|
57
|
+
@keyframes snail-scale-out {
|
|
58
|
+
0% {
|
|
59
|
+
scale: 1;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
100% {
|
|
63
|
+
scale: 0;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
package/package.json
CHANGED