react-animate-z 1.0.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/LICENSE +21 -0
- package/README.md +206 -0
- package/build/components/AnimationConstant.d.ts +27 -0
- package/build/components/AnimationTyping.d.ts +4 -0
- package/build/components/index.d.ts +4 -0
- package/build/index.d.ts +4 -0
- package/build/index.esm.js +1 -0
- package/build/index.js +1 -0
- package/package.json +80 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2023 Delpi.Kye
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
<div align="center">
|
|
2
|
+
<h1>react-animate-z</h1>
|
|
3
|
+
<a href="https://www.npmjs.com/package/react-animate-z">react-animate-z</a>
|
|
4
|
+
<br />
|
|
5
|
+
<br />
|
|
6
|
+
<b><a href="https://codesandbox.io/u/delpi.k">LIVE EXAMPLE</a></b>
|
|
7
|
+
</div>
|
|
8
|
+
|
|
9
|
+
---
|
|
10
|
+
React Component to show animated text and objects, built with [styled-components](https://www.styled-components.com/).
|
|
11
|
+
|
|
12
|
+
The Component provides regular animation for common object and some animation effects especially for typography like letters and multi-line text.
|
|
13
|
+
|
|
14
|
+
## Installation
|
|
15
|
+
|
|
16
|
+
Install via npm:
|
|
17
|
+
|
|
18
|
+
```
|
|
19
|
+
npm i react-animate-z
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
To use react-animate-z in your react project, wrap the content with a `Animate` component and customize the animation with relevant properties.
|
|
25
|
+
|
|
26
|
+
```js
|
|
27
|
+
import Animate from 'react-animate-z'
|
|
28
|
+
|
|
29
|
+
const DelpiAnimate = () => {
|
|
30
|
+
return (
|
|
31
|
+
<Animate
|
|
32
|
+
type="blur"
|
|
33
|
+
duration="1000ms"
|
|
34
|
+
delay="0s"
|
|
35
|
+
direction="normal"
|
|
36
|
+
timing="ease"
|
|
37
|
+
iteration="infinite"
|
|
38
|
+
fillMode="none">
|
|
39
|
+
Content...
|
|
40
|
+
</Animate>
|
|
41
|
+
)
|
|
42
|
+
}
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### Available properties
|
|
46
|
+
|
|
47
|
+
| Property | Corresponding Animation Property | Data Type | Default Value | Property Unit |
|
|
48
|
+
| :---------: | :------------------------------: | :---------------: | :------------: | :-----------: |
|
|
49
|
+
| `type` | `animation-name` | `String` | "blur" | - |
|
|
50
|
+
| `duration` | `animation-duration` | `String` | "1s" | `s` or `ms` |
|
|
51
|
+
| `delay` | `animation-delay` | `String` | "0s" | `s` or `ms` |
|
|
52
|
+
| `direction` | `animation-direction` | `String` | "alternate" | - |
|
|
53
|
+
| `timing` | `animation-timing-function` | `String` | "ease" | - |
|
|
54
|
+
| `iteration` | `animation-iteration-count` | `Number` `String` | "infinite" | - |
|
|
55
|
+
| `fillMode` | `animation-fill-mode` | `String` | "none" | - |
|
|
56
|
+
|
|
57
|
+
### Available animations
|
|
58
|
+
|
|
59
|
+
| `type` / Animation name |
|
|
60
|
+
| ----------------------- |
|
|
61
|
+
| `blur` |
|
|
62
|
+
| `fadeIn` |
|
|
63
|
+
| `fadeOut` |
|
|
64
|
+
| `hang` |
|
|
65
|
+
| `hangOnLeft` |
|
|
66
|
+
| `hangOnRight` |
|
|
67
|
+
| `swing` |
|
|
68
|
+
| `glowing` |
|
|
69
|
+
| `shakeMix` |
|
|
70
|
+
| `shakeHorizontal` |
|
|
71
|
+
| `shakeVertical` |
|
|
72
|
+
| `spin` |
|
|
73
|
+
| `bounce` |
|
|
74
|
+
| `flipCenterToRight` |
|
|
75
|
+
| `flipFromLeftToCenter` |
|
|
76
|
+
| `flash` |
|
|
77
|
+
| `pulse` |
|
|
78
|
+
| `jelly` |
|
|
79
|
+
| `squeezeHorizontal` |
|
|
80
|
+
| `squeezeVertical` |
|
|
81
|
+
| `flipHorizontal` |
|
|
82
|
+
| `flipVertical` |
|
|
83
|
+
|
|
84
|
+
|
|
85
|
+
## Chain Animation
|
|
86
|
+
|
|
87
|
+
An string-arry of animation names is used to wrap the animations you want to chain.
|
|
88
|
+
|
|
89
|
+
```js
|
|
90
|
+
import Animate from 'react-animate-z'
|
|
91
|
+
|
|
92
|
+
const AnimationsForChaining = ["swing", "flipSlowDown", "fadeOutToBottom", "jelly"]
|
|
93
|
+
|
|
94
|
+
const AnimationChain = () => {
|
|
95
|
+
|
|
96
|
+
const [ animationIndex, setAnimationIndex ] = useState(0)
|
|
97
|
+
const [ animationType, setAnimationType ] = useState(AnimationsForChaining[0])
|
|
98
|
+
|
|
99
|
+
const handleChainAnimation = () => {
|
|
100
|
+
setCounter(animationIndex+1)
|
|
101
|
+
setAnimationType(selectedItems[animationIndex+1])
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
return (
|
|
105
|
+
<Animate
|
|
106
|
+
onAnimationEnd={handleChainAnimation}
|
|
107
|
+
type={animationType}
|
|
108
|
+
duration="1000ms"
|
|
109
|
+
timing="linear"
|
|
110
|
+
iteration={1}>
|
|
111
|
+
Animate
|
|
112
|
+
</Animate>
|
|
113
|
+
)
|
|
114
|
+
}
|
|
115
|
+
```
|
|
116
|
+
|
|
117
|
+
##### animation type - mapping name
|
|
118
|
+
|
|
119
|
+
```js
|
|
120
|
+
// Animation basic mode
|
|
121
|
+
"blur"
|
|
122
|
+
"bounce"
|
|
123
|
+
"effect3D"
|
|
124
|
+
"flash"
|
|
125
|
+
"float"
|
|
126
|
+
"glowing"
|
|
127
|
+
"jelly"
|
|
128
|
+
"pulse"
|
|
129
|
+
"shadow"
|
|
130
|
+
"spin"
|
|
131
|
+
"swing"
|
|
132
|
+
"fadeIn"
|
|
133
|
+
"fadeInFromLeft"
|
|
134
|
+
"fadeInFromRight"
|
|
135
|
+
"fadeInFromTop"
|
|
136
|
+
"fadeInFromBottom"
|
|
137
|
+
"fadeOut"
|
|
138
|
+
"fadeOutToLeft"
|
|
139
|
+
"fadeOutToRight"
|
|
140
|
+
"fadeOutToTop"
|
|
141
|
+
"fadeOutToBottom"
|
|
142
|
+
"flip"
|
|
143
|
+
"flipIn"
|
|
144
|
+
"flipOut"
|
|
145
|
+
"flipSlowDown"
|
|
146
|
+
"flipFromTop"
|
|
147
|
+
"flipToTop"
|
|
148
|
+
"flipFromBottom"
|
|
149
|
+
"flipToBottom"
|
|
150
|
+
"flipFromLeftToCenter"
|
|
151
|
+
"fold"
|
|
152
|
+
"unfold"
|
|
153
|
+
"hangOnLeft"
|
|
154
|
+
"hangOnRight"
|
|
155
|
+
"rotateSlowDown"
|
|
156
|
+
"rotateCW"
|
|
157
|
+
"rotateACW"
|
|
158
|
+
"shakeMix"
|
|
159
|
+
"shakeHorizontal"
|
|
160
|
+
"shakeVertical"
|
|
161
|
+
"squeezeMix"
|
|
162
|
+
"squeezeHorizontal"
|
|
163
|
+
"squeezeVertical"
|
|
164
|
+
"slideInFromLeft"
|
|
165
|
+
"slideInFromRight"
|
|
166
|
+
"slideOutToLeft"
|
|
167
|
+
"slideOutToRight"
|
|
168
|
+
"slideInFromTop"
|
|
169
|
+
"slideInFromBottom"
|
|
170
|
+
"slideOutToTop"
|
|
171
|
+
"slideOutToBottom"
|
|
172
|
+
"zoomIn"
|
|
173
|
+
"zoomOut"
|
|
174
|
+
"popIn"
|
|
175
|
+
"popOut"
|
|
176
|
+
```
|
|
177
|
+
|
|
178
|
+
##### animation type name: typewriter
|
|
179
|
+
|
|
180
|
+
```js
|
|
181
|
+
// Animation typing text - mode
|
|
182
|
+
// import { AnimateTyping } from 'react-animate-z';
|
|
183
|
+
|
|
184
|
+
<Animate
|
|
185
|
+
type="typewriter"
|
|
186
|
+
// props
|
|
187
|
+
typingWrite={{
|
|
188
|
+
dataText: ["Sushi", "Pizza", "Brötchen", "Salat"],
|
|
189
|
+
// heading?: string;
|
|
190
|
+
// className?: string;
|
|
191
|
+
// dataText?: string[];
|
|
192
|
+
}}
|
|
193
|
+
/>
|
|
194
|
+
|
|
195
|
+
// or
|
|
196
|
+
<AnimateTyping
|
|
197
|
+
dataText ={["Sushi", "Pizza", "Brötchen", "Salat"]}
|
|
198
|
+
// heading?: string;
|
|
199
|
+
// className?: string;
|
|
200
|
+
// dataText?: string[];
|
|
201
|
+
/>
|
|
202
|
+
```
|
|
203
|
+
|
|
204
|
+
### License
|
|
205
|
+
|
|
206
|
+
MIT
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export type AnimateType = "blur" | "bounce" | "effect3D" | "flash" | "float" | "glowing" | "jelly" | "pulse" | "shadow" | "spin" | "swing" | "fadeIn" | "fadeInFromLeft" | "fadeInFromRight" | "fadeInFromTop" | "fadeInFromBottom" | "fadeOut" | "fadeOutToLeft" | "fadeOutToRight" | "fadeOutToTop" | "fadeOutToBottom" | "flip" | "flipIn" | "flipOut" | "flipSlowDown" | "flipFromTop" | "flipToTop" | "flipFromBottom" | "flipToBottom" | "flipFromLeftToCenter" | "fold" | "unfold" | "hangOnLeft" | "hangOnRight" | "rotateSlowDown" | "rotateCW" | "rotateACW" | "shakeMix" | "shakeHorizontal" | "shakeVertical" | "squeezeMix" | "squeezeHorizontal" | "squeezeVertical" | "slideInFromLeft" | "slideInFromRight" | "slideOutToLeft" | "slideOutToRight" | "slideInFromTop" | "slideInFromBottom" | "slideOutToTop" | "slideOutToBottom" | "zoomIn" | "zoomOut" | "popIn" | "popOut" | "typewriter";
|
|
3
|
+
export interface ICursorProps {
|
|
4
|
+
cursorColor?: string | null;
|
|
5
|
+
}
|
|
6
|
+
export interface IAnimationTypingProps extends ICursorProps {
|
|
7
|
+
heading?: string;
|
|
8
|
+
className?: string;
|
|
9
|
+
dataText?: string[];
|
|
10
|
+
}
|
|
11
|
+
type TIteration = "infinite";
|
|
12
|
+
export interface IBaseStyledElementProps {
|
|
13
|
+
type: null | AnimateType;
|
|
14
|
+
duration?: string;
|
|
15
|
+
timing?: "ease" | "easeIn" | "easeOut" | "linear" | "ease-in" | "ease-out" | "ease-in-out";
|
|
16
|
+
delay?: string;
|
|
17
|
+
iteration?: string | number | TIteration;
|
|
18
|
+
direction?: "normal" | "reverse" | "alternate" | "alternate-reverse";
|
|
19
|
+
fillMode?: "none" | "forwards" | "backwards" | "both";
|
|
20
|
+
}
|
|
21
|
+
export interface IAnimationProps extends IBaseStyledElementProps {
|
|
22
|
+
children?: React.ReactNode | string;
|
|
23
|
+
className?: string;
|
|
24
|
+
type: null | AnimateType;
|
|
25
|
+
typingWrite?: IAnimationTypingProps;
|
|
26
|
+
}
|
|
27
|
+
export {};
|
package/build/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import n,{useState as t,useEffect as r}from"react";import a,{keyframes as o}from"styled-components";var e=function(){return e=Object.assign||function(n){for(var t,r=1,a=arguments.length;r<a;r++)for(var o in t=arguments[r])Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n},e.apply(this,arguments)};function s(n,t){return Object.defineProperty?Object.defineProperty(n,"raw",{value:t}):n.raw=t,n}var f,m,i,c,l,p,g,d,y,x,X,u,Y,h,b,w,O,Z,v,T,I,F,j,z,E,B,C,L,P,N,R,S,W,k,q,A,D,M,H,V,G,J,K,Q,U,$,_,nn,tn,rn,an,on,en,sn,fn,mn,cn,ln,pn,gn=o(f||(f=s(["\n 50% {\n border-color: transparent;\n }\n"],["\n 50% {\n border-color: transparent;\n }\n"]))),dn=a.span(m||(m=s(["\n margin-left: 2px;\n border-left: 3px solid ",";\n animation: "," 0.7s steps(1) infinite;\n"],["\n margin-left: 2px;\n border-left: 3px solid ",";\n animation: "," 0.7s steps(1) infinite;\n"])),(function(n){return n.cursorColor}),gn),yn=function(a){var o=a.heading,e=void 0===o?"":o,s=a.dataText,f=void 0===s?[]:s,m=a.className,i=a.cursorColor,c=t(""),l=c[0],p=c[1],g=t(!1),d=g[0],y=g[1],x=t(0),X=x[0],u=x[1],Y=t(150),h=Y[0],b=Y[1];r((function(){var n=setTimeout((function(){w()}),h);return function(){return clearTimeout(n)}}));var w=function(){var n=X%f.length,t=f[n],r=d?-1:1;p(t.substring(0,l.length+r)),b(d?30:150),d||l!==t?d&&""===l&&(y(!1),u(X+1)):setTimeout((function(){return y(!0)}),500)};return n.createElement("div",{className:m},e&&n.createElement(n.Fragment,null,e," "),n.createElement("span",null,l),n.createElement(dn,{cursorColor:i}))},xn=function(t){var r=t.children,a=t.className,o=t.type,s=void 0===o?null:o,f=t.typingWrite,m=void 0===f?{}:f,i=function(n,t){var r={};for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&t.indexOf(a)<0&&(r[a]=n[a]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(n);o<a.length;o++)t.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(n,a[o])&&(r[a[o]]=n[a[o]])}return r}(t,["children","className","type","typingWrite"]);return"typewriter"===s?n.createElement(yn,e({},m)):n.createElement(xt,e({className:a,type:s},i),r)},Xn=o(i||(i=s(["\n from { filter: blur(0px); }\n to { filter: blur(6px); }\n"],["\n from { filter: blur(0px); }\n to { filter: blur(6px); }\n"]))),un=o(c||(c=s(["\n 10% { transform: scaleY(0.9) translateY(5%); }\n 45% { transform: scaleY(1.2) translateY(-100%); }\n 65% { transform: scaleY(0.95) translateY(0); }\n 75% { transform: scaleY(1.05) translateY(-25%); }\n 85% { transform: scaleY(1) translateY(0); }\n 100% { transform: scaleY(1) translateY(0%); }\n"],["\n 10% { transform: scaleY(0.9) translateY(5%); }\n 45% { transform: scaleY(1.2) translateY(-100%); }\n 65% { transform: scaleY(0.95) translateY(0); }\n 75% { transform: scaleY(1.05) translateY(-25%); }\n 85% { transform: scaleY(1) translateY(0); }\n 100% { transform: scaleY(1) translateY(0%); }\n"]))),Yn=o(l||(l=s(["\n to {\n text-shadow:\n 0 1px 0 #ccc,\n 0 2px 0 #c9c9c9,\n 0 3px 0 #bbb,\n 0 4px 0 #b9b9b9,\n 0 5px 0 #aaa,\n 0 6px 1px rgba(0, 0, 0, .1),\n 0 0 5px rgba(0, 0, 0, .1),\n 0 1px 3px rgba(0, 0, 0, .3),\n 0 3px 5px rgba(0, 0, 0, .2),\n 0 5px 10px rgba(0, 0, 0, .25)\n }\n"],["\n to {\n text-shadow:\n 0 1px 0 #ccc,\n 0 2px 0 #c9c9c9,\n 0 3px 0 #bbb,\n 0 4px 0 #b9b9b9,\n 0 5px 0 #aaa,\n 0 6px 1px rgba(0, 0, 0, .1),\n 0 0 5px rgba(0, 0, 0, .1),\n 0 1px 3px rgba(0, 0, 0, .3),\n 0 3px 5px rgba(0, 0, 0, .2),\n 0 5px 10px rgba(0, 0, 0, .25)\n }\n"]))),hn=o(p||(p=s(["\n 0%, 40%, 80% { opacity: 1; }\n 20%, 60%, 100% { opacity: 0; }\n"],["\n 0%, 40%, 80% { opacity: 1; }\n 20%, 60%, 100% { opacity: 0; }\n"]))),bn=o(g||(g=s(["\n 0% { transform: translate(2%, -10%) rotate(-1deg); }\n 100% { transform: translate(-2%, 5%) rotate(3deg); }\n"],["\n 0% { transform: translate(2%, -10%) rotate(-1deg); }\n 100% { transform: translate(-2%, 5%) rotate(3deg); }\n"]))),wn=o(d||(d=s(["\n 0% { color: inherit; text-shadow: none; }\n 2%, 59%, 64%, 79% { color: #fff; }\n 3%, 59%, 63%, 78% { text-shadow: 0px 0px 60px, 0 0 22px, 0 0 1em inherit, 0 0 0.5em inherit, 0 0 .1em inherit, 0 10px 3px #000; }\n 60% { color: inherit; text-shadow: none; }\n 75% { color: inherit; text-shadow: none; }\n"],["\n 0% { color: inherit; text-shadow: none; }\n 2%, 59%, 64%, 79% { color: #fff; }\n 3%, 59%, 63%, 78% { text-shadow: 0px 0px 60px, 0 0 22px, 0 0 1em inherit, 0 0 0.5em inherit, 0 0 .1em inherit, 0 10px 3px #000; }\n 60% { color: inherit; text-shadow: none; }\n 75% { color: inherit; text-shadow: none; }\n"]))),On=o(y||(y=s(["\n 0% { transform: scaleX(1); }\n 20% { transform: scaleX(0.9); }\n 50% { transform: scaleX(1.25); }\n 85% { transform: scaleX(0.8); }\n 100% { transform: scaleX(1); }\n"],["\n 0% { transform: scaleX(1); }\n 20% { transform: scaleX(0.9); }\n 50% { transform: scaleX(1.25); }\n 85% { transform: scaleX(0.8); }\n 100% { transform: scaleX(1); }\n"]))),Zn=o(x||(x=s(["\n from { transform: scale(1); }\n to { transform: scale(1.1); }\n"],["\n from { transform: scale(1); }\n to { transform: scale(1.1); }\n"]))),vn=o(X||(X=s(["\n 0% { text-shadow: 1px 1px 0px #333; }\n\t50% { text-shadow: 3px 3px 2px #333; }\n\t100% { text-shadow: 9px 10px 6px #999; }\n"],["\n 0% { text-shadow: 1px 1px 0px #333; }\n\t50% { text-shadow: 3px 3px 2px #333; }\n\t100% { text-shadow: 9px 10px 6px #999; }\n"]))),Tn=o(u||(u=s(["\n from { transform: rotateY(0deg); }\n to { transform: rotateY(-360deg); }\n"],["\n from { transform: rotateY(0deg); }\n to { transform: rotateY(-360deg); }\n"]))),In=o(Y||(Y=s(["\n 0% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n 20% {\n transform: rotateZ(15deg);\n transform-origin: center top;\n }\n 40% {\n transform: rotateZ(-15deg);\n transform-origin: center top;\n }\n 60% {\n transform: rotateZ(7deg);\n transform-origin: center top;\n }\n 80% {\n transform: rotateZ(-7deg);\n transform-origin: center top;\n }\n 100% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n"],["\n 0% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n 20% {\n transform: rotateZ(15deg);\n transform-origin: center top;\n }\n 40% {\n transform: rotateZ(-15deg);\n transform-origin: center top;\n }\n 60% {\n transform: rotateZ(7deg);\n transform-origin: center top;\n }\n 80% {\n transform: rotateZ(-7deg);\n transform-origin: center top;\n }\n 100% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n"]))),Fn=o(h||(h=s(["\n from { opacity: 0; }\n to { opacity: 1; }\n"],["\n from { opacity: 0; }\n to { opacity: 1; }\n"]))),jn=o(b||(b=s(["\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to { opacity: 1 }\n"]))),zn=o(w||(w=s(["\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to { opacity: 1 }\n"]))),En=o(O||(O=s(["\n from {\n opacity: 0;\n transform: translateY(-100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateY(-100%);\n }\n to { opacity: 1 }\n"]))),Bn=o(Z||(Z=s(["\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to { opacity: 1 }\n"]))),Cn=o(v||(v=s(["\n from { opacity: 1; }\n to { opacity: 0; }\n"],["\n from { opacity: 1; }\n to { opacity: 0; }\n"]))),Ln=o(T||(T=s(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(-100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(-100%);\n }\n"]))),Pn=o(I||(I=s(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(100%);\n }\n"]))),Nn=o(F||(F=s(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(-100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(-100%);\n }\n"]))),Rn=o(j||(j=s(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n"]))),Sn=o(z||(z=s(["\n 0% { transform-origin: left; }\n 30% {\n transform: rotate(110deg);\n transform-origin: left;\n }\n 50% {\n transform: rotate(75deg);\n transform-origin: left;\n }\n 65% {\n transform: rotate(100deg);\n transform-origin: left;\n }\n 78% {\n transform: rotate(80deg);\n transform-origin: left;\n }\n 88% {\n transform: rotate(95deg);\n transform-origin: left;\n }\n 95% {\n transform: rotate(86deg);\n transform-origin: left;\n }\n 100% {\n transform: rotate(90deg);\n transform-origin: left;\n }\n"],["\n 0% { transform-origin: left; }\n 30% {\n transform: rotate(110deg);\n transform-origin: left;\n }\n 50% {\n transform: rotate(75deg);\n transform-origin: left;\n }\n 65% {\n transform: rotate(100deg);\n transform-origin: left;\n }\n 78% {\n transform: rotate(80deg);\n transform-origin: left;\n }\n 88% {\n transform: rotate(95deg);\n transform-origin: left;\n }\n 95% {\n transform: rotate(86deg);\n transform-origin: left;\n }\n 100% {\n transform: rotate(90deg);\n transform-origin: left;\n }\n"]))),Wn=o(E||(E=s(["\n 0% { transform-origin: right; }\n 30% {\n transform: rotate(-110deg);\n transform-origin: right;\n }\n 50% {\n transform: rotate(-75deg);\n transform-origin: right;\n }\n 65% {\n transform: rotate(-100deg);\n transform-origin: right;\n }\n 78% {\n transform: rotate(-80deg);\n transform-origin: right;\n }\n 88% {\n transform: rotate(-95deg);\n transform-origin: right;\n }\n 95% {\n transform: rotate(-86deg);\n transform-origin: right;\n }\n 100% {\n transform: rotate(-90deg);\n transform-origin: right;\n }\n"],["\n 0% { transform-origin: right; }\n 30% {\n transform: rotate(-110deg);\n transform-origin: right;\n }\n 50% {\n transform: rotate(-75deg);\n transform-origin: right;\n }\n 65% {\n transform: rotate(-100deg);\n transform-origin: right;\n }\n 78% {\n transform: rotate(-80deg);\n transform-origin: right;\n }\n 88% {\n transform: rotate(-95deg);\n transform-origin: right;\n }\n 95% {\n transform: rotate(-86deg);\n transform-origin: right;\n }\n 100% {\n transform: rotate(-90deg);\n transform-origin: right;\n }\n"]))),kn=o(B||(B=s(["\n 0% { transform: scale(1, 1); }\n 15% { transform: scale(0.95, 0.95); }\n 30% { transform: scale(0.9, 0.9); }\n 55% { transform: scale(0.75, 0.75); }\n 70% { transform: scale(1.3, 1.3); }\n 85% { transform: scale(0.95, 0.95); }\n 100% { transform: scale(1, 1); }\n"],["\n 0% { transform: scale(1, 1); }\n 15% { transform: scale(0.95, 0.95); }\n 30% { transform: scale(0.9, 0.9); }\n 55% { transform: scale(0.75, 0.75); }\n 70% { transform: scale(1.3, 1.3); }\n 85% { transform: scale(0.95, 0.95); }\n 100% { transform: scale(1, 1); }\n"]))),qn=o(C||(C=s(["\n 0% { transform: scaleX(1); }\n 15% { transform: scaleX(0.95); }\n 30% { transform: scaleX(0.9); }\n 55% { transform: scaleX(0.75); }\n 70% { transform: scaleX(1.3); }\n 85% { transform: scaleX(0.95); }\n 100% { transform: scaleX(1); }\n"],["\n 0% { transform: scaleX(1); }\n 15% { transform: scaleX(0.95); }\n 30% { transform: scaleX(0.9); }\n 55% { transform: scaleX(0.75); }\n 70% { transform: scaleX(1.3); }\n 85% { transform: scaleX(0.95); }\n 100% { transform: scaleX(1); }\n"]))),An=o(L||(L=s(["\n 0% { transform: scaleY(1); }\n 15% { transform: scaleY(0.95); }\n 30% { transform: scaleY(0.9); }\n 55% { transform: scaleY(0.75); }\n 70% { transform: scaleY(1.3); }\n 85% { transform: scaleY(0.95); }\n 100% { transform: scaleY(1); }\n"],["\n 0% { transform: scaleY(1); }\n 15% { transform: scaleY(0.95); }\n 30% { transform: scaleY(0.9); }\n 55% { transform: scaleY(0.75); }\n 70% { transform: scaleY(1.3); }\n 85% { transform: scaleY(0.95); }\n 100% { transform: scaleY(1); }\n"]))),Dn=o(P||(P=s(["\n 0% { transform: translate(2px, 1px) rotate(0deg); }\n 10% { transform: translate(-1px, -2px) rotate(-1deg); }\n 20% { transform: translate(-3px, 0px) rotate(1deg); }\n 30% { transform: translate(0px, 2px) rotate(0deg); }\n 40% { transform: translate(1px, -1px) rotate(1deg); }\n 50% { transform: translate(-1px, 2px) rotate(-1deg); }\n 60% { transform: translate(-3px, 1px) rotate(0deg); }\n 70% { transform: translate(2px, 1px) rotate(-1deg); }\n 80% { transform: translate(-1px, -1px) rotate(1deg); }\n 90% { transform: translate(2px, 2px) rotate(0deg); }\n 100% { transform: translate(1px, -2px) rotate(-1deg); }\n"],["\n 0% { transform: translate(2px, 1px) rotate(0deg); }\n 10% { transform: translate(-1px, -2px) rotate(-1deg); }\n 20% { transform: translate(-3px, 0px) rotate(1deg); }\n 30% { transform: translate(0px, 2px) rotate(0deg); }\n 40% { transform: translate(1px, -1px) rotate(1deg); }\n 50% { transform: translate(-1px, 2px) rotate(-1deg); }\n 60% { transform: translate(-3px, 1px) rotate(0deg); }\n 70% { transform: translate(2px, 1px) rotate(-1deg); }\n 80% { transform: translate(-1px, -1px) rotate(1deg); }\n 90% { transform: translate(2px, 2px) rotate(0deg); }\n 100% { transform: translate(1px, -2px) rotate(-1deg); }\n"]))),Mn=o(N||(N=s(["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateX(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateX(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateX(-4px) }\n"],["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateX(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateX(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateX(-4px) }\n"]))),Hn=o(R||(R=s(["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateY(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateY(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateY(-4px) }\n"],["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateY(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateY(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateY(-4px) }\n"]))),Vn=o(S||(S=s(["\n 0% {\n transform: perspective(1000px) rotateX(360deg);\n transform-origin: center;\n }\n 100% {\n transform: perspective(1000px) rotateX(0deg);\n transform-origin: center;\n }\n"],["\n 0% {\n transform: perspective(1000px) rotateX(360deg);\n transform-origin: center;\n }\n 100% {\n transform: perspective(1000px) rotateX(0deg);\n transform-origin: center;\n }\n"]))),Gn=o(W||(W=s(["\n 0% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n 35% {\n transform: rotateX(120deg);\n opacity: 0;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(360deg);\n opacity: 1;\n }\n"],["\n 0% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n 35% {\n transform: rotateX(120deg);\n opacity: 0;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(360deg);\n opacity: 1;\n }\n"]))),Jn=o(k||(k=s(["\n 0% {\n transform: rotateX(0deg);\n opacity: 1;\n }\n 35% {\n transform: rotateX(-40deg);\n opacity: 1;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n"],["\n 0% {\n transform: rotateX(0deg);\n opacity: 1;\n }\n 35% {\n transform: rotateX(-40deg);\n opacity: 1;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n"]))),Kn=o(q||(q=s([" // tbm\n 0% {\n transform:rotateX(0deg);\n }\n 5% {\n transform: rotateX(1turn);\n }\n 10% {\n transform: rotateX(2turn);\n }\n 20% {\n transform: rotateX(3turn);\n }\n 40% {\n transform: rotateX(4turn);\n }\n 70%, 100% {\n transform: rotateX(5turn);\n }\n"],[" // tbm\n 0% {\n transform:rotateX(0deg);\n }\n 5% {\n transform: rotateX(1turn);\n }\n 10% {\n transform: rotateX(2turn);\n }\n 20% {\n transform: rotateX(3turn);\n }\n 40% {\n transform: rotateX(4turn);\n }\n 70%, 100% {\n transform: rotateX(5turn);\n }\n"]))),Qn=o(A||(A=s(["\n from {\n transform: rotateX(-90deg);\n transform-origin: center top;\n opacity: 1;\n }\n to {\n transform: rotateX(90deg);\n transform-origin: center top;\n opacity: 0;\n }\n"],["\n from {\n transform: rotateX(-90deg);\n transform-origin: center top;\n opacity: 1;\n }\n to {\n transform: rotateX(90deg);\n transform-origin: center top;\n opacity: 0;\n }\n"]))),Un=o(D||(D=s(["\n from {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) translateY(0px);\n }\n to {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(-90deg) translateY(50px);\n }\n"],["\n from {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) translateY(0px);\n }\n to {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(-90deg) translateY(50px);\n }\n"]))),$n=o(M||(M=s(["\n from {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(90deg);\n }\n to {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) ;\n }\n"],["\n from {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(90deg);\n }\n to {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) ;\n }\n"]))),_n=o(H||(H=s(["\n from {\n transform: rotateX(-90deg);\n transform-origin: 50% 0;\n opacity: 0;\n }\n to {\n transform: rotateX(0deg);\n transform-origin: 50% 0;\n opacity: 1;\n }\n"],["\n from {\n transform: rotateX(-90deg);\n transform-origin: 50% 0;\n opacity: 0;\n }\n to {\n transform: rotateX(0deg);\n transform-origin: 50% 0;\n opacity: 1;\n }\n"]))),nt=o(V||(V=s(["\n 0% {\n transform: rotateY(-95deg) translateX(-200px) ;\n transform-origin: left;\n }\n 100% {\n transform: rotateY(0deg);\n transform-origin: left;\n }\n"],["\n 0% {\n transform: rotateY(-95deg) translateX(-200px) ;\n transform-origin: left;\n }\n 100% {\n transform: rotateY(0deg);\n transform-origin: left;\n }\n"]))),tt=o(G||(G=s(["\n 0% {\n opacity: 0;\n transform: translateX(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateX(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"]))),rt=o(J||(J=s(["\n 0% {\n opacity: 0;\n transform: translateX(100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateX(100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"]))),at=o(K||(K=s(["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(-100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(-100%);\n }\n"]))),ot=o(Q||(Q=s(["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(100%);\n }\n"]))),et=o(U||(U=s(["\n 0% {\n opacity: 0;\n transform: translateY(100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateY(100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"]))),st=o($||($=s(["\n 0% {\n opacity: 0;\n transform: translateY(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateY(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"]))),ft=o(_||(_=s(["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(-100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(-100%);\n }\n"]))),mt=o(nn||(nn=s(["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(100%);\n }\n"]))),it=o(tn||(tn=s(["\n 0% { transform: scale3d(1, 1, 1); }\n 30% { transform: scale3d(1, 0.4, 1); }\n 60% { transform: scale3d(0.4, 0.4, 1); }\n 100% {\n opacity: 0;\n transform: scale3d(0.2, 0.2, 0.2);\n }\n"],["\n 0% { transform: scale3d(1, 1, 1); }\n 30% { transform: scale3d(1, 0.4, 1); }\n 60% { transform: scale3d(0.4, 0.4, 1); }\n 100% {\n opacity: 0;\n transform: scale3d(0.2, 0.2, 0.2);\n }\n"]))),ct=o(rn||(rn=s(["\n 0% {\n opacity: 0;\n transform: scale3d(0, 0, 0); }\n 30% {\n opacity: 1;\n transform: scale3d(0.4, 0.4, 1);\n }\n 60% { transform: scale3d(0.4, 1, 1); }\n 100% { transform: scale3d(1, 1, 1); }\n"],["\n 0% {\n opacity: 0;\n transform: scale3d(0, 0, 0); }\n 30% {\n opacity: 1;\n transform: scale3d(0.4, 0.4, 1);\n }\n 60% { transform: scale3d(0.4, 1, 1); }\n 100% { transform: scale3d(1, 1, 1); }\n"]))),lt=o(an||(an=s(["\n from { transform: scale(2); }\n to { transform: scale(1); }\n"],["\n from { transform: scale(2); }\n to { transform: scale(1); }\n"]))),pt=o(on||(on=s(["\n from { transform: scale(1); }\n to { transform: scale(2); }\n"],["\n from { transform: scale(1); }\n to { transform: scale(2); }\n"]))),gt=o(en||(en=s(["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(360deg);\n transform-origin: center center;\n }\n"],["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(360deg);\n transform-origin: center center;\n }\n"]))),dt=o(sn||(sn=s(["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(-360deg);\n transform-origin: center center;\n }\n"],["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(-360deg);\n transform-origin: center center;\n }\n"]))),yt={blur:Xn,bounce:un,effect3D:Yn,flash:hn,float:bn,glowing:wn,jelly:On,pulse:Zn,shadow:vn,spin:Tn,swing:In,fadeIn:Fn,fadeInFromLeft:jn,fadeInFromRight:zn,fadeInFromTop:En,fadeInFromBottom:Bn,fadeOut:Cn,fadeOutToLeft:Ln,fadeOutToRight:Pn,fadeOutToTop:Nn,fadeOutToBottom:Rn,flip:Vn,flipIn:Gn,flipOut:Jn,flipSlowDown:Kn,flipFromTop:$n,flipToTop:Qn,flipFromBottom:_n,flipToBottom:Un,flipFromLeftToCenter:nt,fold:it,unfold:ct,hangOnLeft:Sn,hangOnRight:Wn,rotateSlowDown:o(fn||(fn=s(["\n 0% { transform:rotateZ(0deg); }\n 5% { transform: rotateZ(1turn); }\n 10% { transform: rotateZ(2turn); }\n 20% { transform: rotateZ(3turn); }\n 40% { transform: rotateZ(4turn); }\n 65%, 100% { transform: rotateZ(5turn); }\n"],["\n 0% { transform:rotateZ(0deg); }\n 5% { transform: rotateZ(1turn); }\n 10% { transform: rotateZ(2turn); }\n 20% { transform: rotateZ(3turn); }\n 40% { transform: rotateZ(4turn); }\n 65%, 100% { transform: rotateZ(5turn); }\n"]))),rotateCW:gt,rotateACW:dt,shakeMix:Dn,shakeHorizontal:Mn,shakeVertical:Hn,squeezeMix:kn,squeezeHorizontal:qn,squeezeVertical:An,slideInFromLeft:tt,slideInFromRight:rt,slideOutToLeft:at,slideOutToRight:ot,slideInFromTop:et,slideInFromBottom:st,slideOutToTop:ft,slideOutToBottom:mt,zoomIn:lt,zoomOut:pt,popIn:o(mn||(mn=s(["\n 0% {\n transform: scale3d(0, 0, 0);\n opacity: 0;\n }\n 30% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 60% { transform: scale3d(1, 1, 1); }\n 80% { transform: scale3d(1.03, 1.03, 1.03); }\n 100% { transform: scale3d(1, 1, 1); }\n"],["\n 0% {\n transform: scale3d(0, 0, 0);\n opacity: 0;\n }\n 30% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 60% { transform: scale3d(1, 1, 1); }\n 80% { transform: scale3d(1.03, 1.03, 1.03); }\n 100% { transform: scale3d(1, 1, 1); }\n"]))),popOut:o(cn||(cn=s(["\n 0% { transform: scale3d(1, 1, 1); }\n 60% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 100% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n"],["\n 0% { transform: scale3d(1, 1, 1); }\n 60% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 100% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n"]))),typewriter:o(ln||(ln=s([""],[""])))},xt=a.div(pn||(pn=s(["\n margin: 0;\n padding: 0;\n animation-name: ",";\n animation-duration: ",";\n animation-timing-function: ",";\n animation-delay: ",";\n animation-iteration-count: ",";\n animation-direction: ",";\n animation-fill-mode: ",";\n"],["\n margin: 0;\n padding: 0;\n animation-name: ",";\n animation-duration: ",";\n animation-timing-function: ",";\n animation-delay: ",";\n animation-iteration-count: ",";\n animation-direction: ",";\n animation-fill-mode: ",";\n"])),(function(n){return yt[n.type||"blur"]||null}),(function(n){return n.duration||"1s"}),(function(n){return n.timing||"ease"}),(function(n){return n.delay||"0s"}),(function(n){return n.iteration||"infinite"}),(function(n){return n.direction||"alternate"}),(function(n){return n.fillMode||"forwards"}));export{xn as Animate,yn as AnimateTyping,xn as default};
|
package/build/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("styled-components")):"function"==typeof define&&define.amd?define(["exports","react","styled-components"],t):t((n="undefined"!=typeof globalThis?globalThis:n||self).ReactAnimate={},n.React,n.styled)}(this,(function(n,t,r){"use strict";function a(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o=a(t),e=a(r),s=function(){return s=Object.assign||function(n){for(var t,r=1,a=arguments.length;r<a;r++)for(var o in t=arguments[r])Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n},s.apply(this,arguments)};function f(n,t){return Object.defineProperty?Object.defineProperty(n,"raw",{value:t}):n.raw=t,n}var m,i,c,l,p,g,d,y,x,u,X,Y,h,k,b,w,O,v,T,Z,I,j,F,E,S,z,P,R,B,C,L,q,N,A,M,W,D,H,V,_,G,J,K,Q,U,$,nn,tn,rn,an,on,en,sn,fn,mn,cn,ln,pn,gn,dn=r.keyframes(m||(m=f(["\n 50% {\n border-color: transparent;\n }\n"],["\n 50% {\n border-color: transparent;\n }\n"]))),yn=e.default.span(i||(i=f(["\n margin-left: 2px;\n border-left: 3px solid ",";\n animation: "," 0.7s steps(1) infinite;\n"],["\n margin-left: 2px;\n border-left: 3px solid ",";\n animation: "," 0.7s steps(1) infinite;\n"])),(function(n){return n.cursorColor}),dn),xn=function(n){var r=n.heading,a=void 0===r?"":r,e=n.dataText,s=void 0===e?[]:e,f=n.className,m=n.cursorColor,i=t.useState(""),c=i[0],l=i[1],p=t.useState(!1),g=p[0],d=p[1],y=t.useState(0),x=y[0],u=y[1],X=t.useState(150),Y=X[0],h=X[1];t.useEffect((function(){var n=setTimeout((function(){k()}),Y);return function(){return clearTimeout(n)}}));var k=function(){var n=x%s.length,t=s[n],r=g?-1:1;l(t.substring(0,c.length+r)),h(g?30:150),g||c!==t?g&&""===c&&(d(!1),u(x+1)):setTimeout((function(){return d(!0)}),500)};return o.default.createElement("div",{className:f},a&&o.default.createElement(o.default.Fragment,null,a," "),o.default.createElement("span",null,c),o.default.createElement(yn,{cursorColor:m}))},un=function(n){var t=n.children,r=n.className,a=n.type,e=void 0===a?null:a,f=n.typingWrite,m=void 0===f?{}:f,i=function(n,t){var r={};for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&t.indexOf(a)<0&&(r[a]=n[a]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(n);o<a.length;o++)t.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(n,a[o])&&(r[a[o]]=n[a[o]])}return r}(n,["children","className","type","typingWrite"]);return"typewriter"===e?o.default.createElement(xn,s({},m)):o.default.createElement(ut,s({className:r,type:e},i),t)},Xn=r.keyframes(c||(c=f(["\n from { filter: blur(0px); }\n to { filter: blur(6px); }\n"],["\n from { filter: blur(0px); }\n to { filter: blur(6px); }\n"]))),Yn=r.keyframes(l||(l=f(["\n 10% { transform: scaleY(0.9) translateY(5%); }\n 45% { transform: scaleY(1.2) translateY(-100%); }\n 65% { transform: scaleY(0.95) translateY(0); }\n 75% { transform: scaleY(1.05) translateY(-25%); }\n 85% { transform: scaleY(1) translateY(0); }\n 100% { transform: scaleY(1) translateY(0%); }\n"],["\n 10% { transform: scaleY(0.9) translateY(5%); }\n 45% { transform: scaleY(1.2) translateY(-100%); }\n 65% { transform: scaleY(0.95) translateY(0); }\n 75% { transform: scaleY(1.05) translateY(-25%); }\n 85% { transform: scaleY(1) translateY(0); }\n 100% { transform: scaleY(1) translateY(0%); }\n"]))),hn=r.keyframes(p||(p=f(["\n to {\n text-shadow:\n 0 1px 0 #ccc,\n 0 2px 0 #c9c9c9,\n 0 3px 0 #bbb,\n 0 4px 0 #b9b9b9,\n 0 5px 0 #aaa,\n 0 6px 1px rgba(0, 0, 0, .1),\n 0 0 5px rgba(0, 0, 0, .1),\n 0 1px 3px rgba(0, 0, 0, .3),\n 0 3px 5px rgba(0, 0, 0, .2),\n 0 5px 10px rgba(0, 0, 0, .25)\n }\n"],["\n to {\n text-shadow:\n 0 1px 0 #ccc,\n 0 2px 0 #c9c9c9,\n 0 3px 0 #bbb,\n 0 4px 0 #b9b9b9,\n 0 5px 0 #aaa,\n 0 6px 1px rgba(0, 0, 0, .1),\n 0 0 5px rgba(0, 0, 0, .1),\n 0 1px 3px rgba(0, 0, 0, .3),\n 0 3px 5px rgba(0, 0, 0, .2),\n 0 5px 10px rgba(0, 0, 0, .25)\n }\n"]))),kn=r.keyframes(g||(g=f(["\n 0%, 40%, 80% { opacity: 1; }\n 20%, 60%, 100% { opacity: 0; }\n"],["\n 0%, 40%, 80% { opacity: 1; }\n 20%, 60%, 100% { opacity: 0; }\n"]))),bn=r.keyframes(d||(d=f(["\n 0% { transform: translate(2%, -10%) rotate(-1deg); }\n 100% { transform: translate(-2%, 5%) rotate(3deg); }\n"],["\n 0% { transform: translate(2%, -10%) rotate(-1deg); }\n 100% { transform: translate(-2%, 5%) rotate(3deg); }\n"]))),wn=r.keyframes(y||(y=f(["\n 0% { color: inherit; text-shadow: none; }\n 2%, 59%, 64%, 79% { color: #fff; }\n 3%, 59%, 63%, 78% { text-shadow: 0px 0px 60px, 0 0 22px, 0 0 1em inherit, 0 0 0.5em inherit, 0 0 .1em inherit, 0 10px 3px #000; }\n 60% { color: inherit; text-shadow: none; }\n 75% { color: inherit; text-shadow: none; }\n"],["\n 0% { color: inherit; text-shadow: none; }\n 2%, 59%, 64%, 79% { color: #fff; }\n 3%, 59%, 63%, 78% { text-shadow: 0px 0px 60px, 0 0 22px, 0 0 1em inherit, 0 0 0.5em inherit, 0 0 .1em inherit, 0 10px 3px #000; }\n 60% { color: inherit; text-shadow: none; }\n 75% { color: inherit; text-shadow: none; }\n"]))),On=r.keyframes(x||(x=f(["\n 0% { transform: scaleX(1); }\n 20% { transform: scaleX(0.9); }\n 50% { transform: scaleX(1.25); }\n 85% { transform: scaleX(0.8); }\n 100% { transform: scaleX(1); }\n"],["\n 0% { transform: scaleX(1); }\n 20% { transform: scaleX(0.9); }\n 50% { transform: scaleX(1.25); }\n 85% { transform: scaleX(0.8); }\n 100% { transform: scaleX(1); }\n"]))),vn=r.keyframes(u||(u=f(["\n from { transform: scale(1); }\n to { transform: scale(1.1); }\n"],["\n from { transform: scale(1); }\n to { transform: scale(1.1); }\n"]))),Tn=r.keyframes(X||(X=f(["\n 0% { text-shadow: 1px 1px 0px #333; }\n\t50% { text-shadow: 3px 3px 2px #333; }\n\t100% { text-shadow: 9px 10px 6px #999; }\n"],["\n 0% { text-shadow: 1px 1px 0px #333; }\n\t50% { text-shadow: 3px 3px 2px #333; }\n\t100% { text-shadow: 9px 10px 6px #999; }\n"]))),Zn=r.keyframes(Y||(Y=f(["\n from { transform: rotateY(0deg); }\n to { transform: rotateY(-360deg); }\n"],["\n from { transform: rotateY(0deg); }\n to { transform: rotateY(-360deg); }\n"]))),In=r.keyframes(h||(h=f(["\n 0% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n 20% {\n transform: rotateZ(15deg);\n transform-origin: center top;\n }\n 40% {\n transform: rotateZ(-15deg);\n transform-origin: center top;\n }\n 60% {\n transform: rotateZ(7deg);\n transform-origin: center top;\n }\n 80% {\n transform: rotateZ(-7deg);\n transform-origin: center top;\n }\n 100% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n"],["\n 0% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n 20% {\n transform: rotateZ(15deg);\n transform-origin: center top;\n }\n 40% {\n transform: rotateZ(-15deg);\n transform-origin: center top;\n }\n 60% {\n transform: rotateZ(7deg);\n transform-origin: center top;\n }\n 80% {\n transform: rotateZ(-7deg);\n transform-origin: center top;\n }\n 100% {\n transform: rotateZ(0deg);\n transform-origin: center top;\n }\n"]))),jn=r.keyframes(k||(k=f(["\n from { opacity: 0; }\n to { opacity: 1; }\n"],["\n from { opacity: 0; }\n to { opacity: 1; }\n"]))),Fn=r.keyframes(b||(b=f(["\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to { opacity: 1 }\n"]))),En=r.keyframes(w||(w=f(["\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to { opacity: 1 }\n"]))),Sn=r.keyframes(O||(O=f(["\n from {\n opacity: 0;\n transform: translateY(-100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateY(-100%);\n }\n to { opacity: 1 }\n"]))),zn=r.keyframes(v||(v=f(["\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to { opacity: 1 }\n"],["\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to { opacity: 1 }\n"]))),Pn=r.keyframes(T||(T=f(["\n from { opacity: 1; }\n to { opacity: 0; }\n"],["\n from { opacity: 1; }\n to { opacity: 0; }\n"]))),Rn=r.keyframes(Z||(Z=f(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(-100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(-100%);\n }\n"]))),Bn=r.keyframes(I||(I=f(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateX(100%);\n }\n"]))),Cn=r.keyframes(j||(j=f(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(-100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(-100%);\n }\n"]))),Ln=r.keyframes(F||(F=f(["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n"],["\n from { opacity: 1; }\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n"]))),qn=r.keyframes(E||(E=f(["\n 0% { transform-origin: left; }\n 30% {\n transform: rotate(110deg);\n transform-origin: left;\n }\n 50% {\n transform: rotate(75deg);\n transform-origin: left;\n }\n 65% {\n transform: rotate(100deg);\n transform-origin: left;\n }\n 78% {\n transform: rotate(80deg);\n transform-origin: left;\n }\n 88% {\n transform: rotate(95deg);\n transform-origin: left;\n }\n 95% {\n transform: rotate(86deg);\n transform-origin: left;\n }\n 100% {\n transform: rotate(90deg);\n transform-origin: left;\n }\n"],["\n 0% { transform-origin: left; }\n 30% {\n transform: rotate(110deg);\n transform-origin: left;\n }\n 50% {\n transform: rotate(75deg);\n transform-origin: left;\n }\n 65% {\n transform: rotate(100deg);\n transform-origin: left;\n }\n 78% {\n transform: rotate(80deg);\n transform-origin: left;\n }\n 88% {\n transform: rotate(95deg);\n transform-origin: left;\n }\n 95% {\n transform: rotate(86deg);\n transform-origin: left;\n }\n 100% {\n transform: rotate(90deg);\n transform-origin: left;\n }\n"]))),Nn=r.keyframes(S||(S=f(["\n 0% { transform-origin: right; }\n 30% {\n transform: rotate(-110deg);\n transform-origin: right;\n }\n 50% {\n transform: rotate(-75deg);\n transform-origin: right;\n }\n 65% {\n transform: rotate(-100deg);\n transform-origin: right;\n }\n 78% {\n transform: rotate(-80deg);\n transform-origin: right;\n }\n 88% {\n transform: rotate(-95deg);\n transform-origin: right;\n }\n 95% {\n transform: rotate(-86deg);\n transform-origin: right;\n }\n 100% {\n transform: rotate(-90deg);\n transform-origin: right;\n }\n"],["\n 0% { transform-origin: right; }\n 30% {\n transform: rotate(-110deg);\n transform-origin: right;\n }\n 50% {\n transform: rotate(-75deg);\n transform-origin: right;\n }\n 65% {\n transform: rotate(-100deg);\n transform-origin: right;\n }\n 78% {\n transform: rotate(-80deg);\n transform-origin: right;\n }\n 88% {\n transform: rotate(-95deg);\n transform-origin: right;\n }\n 95% {\n transform: rotate(-86deg);\n transform-origin: right;\n }\n 100% {\n transform: rotate(-90deg);\n transform-origin: right;\n }\n"]))),An=r.keyframes(z||(z=f(["\n 0% { transform: scale(1, 1); }\n 15% { transform: scale(0.95, 0.95); }\n 30% { transform: scale(0.9, 0.9); }\n 55% { transform: scale(0.75, 0.75); }\n 70% { transform: scale(1.3, 1.3); }\n 85% { transform: scale(0.95, 0.95); }\n 100% { transform: scale(1, 1); }\n"],["\n 0% { transform: scale(1, 1); }\n 15% { transform: scale(0.95, 0.95); }\n 30% { transform: scale(0.9, 0.9); }\n 55% { transform: scale(0.75, 0.75); }\n 70% { transform: scale(1.3, 1.3); }\n 85% { transform: scale(0.95, 0.95); }\n 100% { transform: scale(1, 1); }\n"]))),Mn=r.keyframes(P||(P=f(["\n 0% { transform: scaleX(1); }\n 15% { transform: scaleX(0.95); }\n 30% { transform: scaleX(0.9); }\n 55% { transform: scaleX(0.75); }\n 70% { transform: scaleX(1.3); }\n 85% { transform: scaleX(0.95); }\n 100% { transform: scaleX(1); }\n"],["\n 0% { transform: scaleX(1); }\n 15% { transform: scaleX(0.95); }\n 30% { transform: scaleX(0.9); }\n 55% { transform: scaleX(0.75); }\n 70% { transform: scaleX(1.3); }\n 85% { transform: scaleX(0.95); }\n 100% { transform: scaleX(1); }\n"]))),Wn=r.keyframes(R||(R=f(["\n 0% { transform: scaleY(1); }\n 15% { transform: scaleY(0.95); }\n 30% { transform: scaleY(0.9); }\n 55% { transform: scaleY(0.75); }\n 70% { transform: scaleY(1.3); }\n 85% { transform: scaleY(0.95); }\n 100% { transform: scaleY(1); }\n"],["\n 0% { transform: scaleY(1); }\n 15% { transform: scaleY(0.95); }\n 30% { transform: scaleY(0.9); }\n 55% { transform: scaleY(0.75); }\n 70% { transform: scaleY(1.3); }\n 85% { transform: scaleY(0.95); }\n 100% { transform: scaleY(1); }\n"]))),Dn=r.keyframes(B||(B=f(["\n 0% { transform: translate(2px, 1px) rotate(0deg); }\n 10% { transform: translate(-1px, -2px) rotate(-1deg); }\n 20% { transform: translate(-3px, 0px) rotate(1deg); }\n 30% { transform: translate(0px, 2px) rotate(0deg); }\n 40% { transform: translate(1px, -1px) rotate(1deg); }\n 50% { transform: translate(-1px, 2px) rotate(-1deg); }\n 60% { transform: translate(-3px, 1px) rotate(0deg); }\n 70% { transform: translate(2px, 1px) rotate(-1deg); }\n 80% { transform: translate(-1px, -1px) rotate(1deg); }\n 90% { transform: translate(2px, 2px) rotate(0deg); }\n 100% { transform: translate(1px, -2px) rotate(-1deg); }\n"],["\n 0% { transform: translate(2px, 1px) rotate(0deg); }\n 10% { transform: translate(-1px, -2px) rotate(-1deg); }\n 20% { transform: translate(-3px, 0px) rotate(1deg); }\n 30% { transform: translate(0px, 2px) rotate(0deg); }\n 40% { transform: translate(1px, -1px) rotate(1deg); }\n 50% { transform: translate(-1px, 2px) rotate(-1deg); }\n 60% { transform: translate(-3px, 1px) rotate(0deg); }\n 70% { transform: translate(2px, 1px) rotate(-1deg); }\n 80% { transform: translate(-1px, -1px) rotate(1deg); }\n 90% { transform: translate(2px, 2px) rotate(0deg); }\n 100% { transform: translate(1px, -2px) rotate(-1deg); }\n"]))),Hn=r.keyframes(C||(C=f(["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateX(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateX(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateX(-4px) }\n"],["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateX(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateX(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateX(-4px) }\n"]))),Vn=r.keyframes(L||(L=f(["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateY(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateY(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateY(-4px) }\n"],["\n 5%, 13%, 22%, 31%, 40%, 49%, 58%, 67%, 76%, 85%, 94% { transform: translateY(6px) }\n 10%, 15%, 24%, 33%, 42%, 51%, 60%, 69%, 78%, 87%, 96% { transform: translateY(2px) }\n 15%, 18%, 27%, 36%, 45%, 54%, 63%, 72%, 81%, 90%, 99% { transform: translateY(-4px) }\n"]))),_n=r.keyframes(q||(q=f(["\n 0% {\n transform: perspective(1000px) rotateX(360deg);\n transform-origin: center;\n }\n 100% {\n transform: perspective(1000px) rotateX(0deg);\n transform-origin: center;\n }\n"],["\n 0% {\n transform: perspective(1000px) rotateX(360deg);\n transform-origin: center;\n }\n 100% {\n transform: perspective(1000px) rotateX(0deg);\n transform-origin: center;\n }\n"]))),Gn=r.keyframes(N||(N=f(["\n 0% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n 35% {\n transform: rotateX(120deg);\n opacity: 0;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(360deg);\n opacity: 1;\n }\n"],["\n 0% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n 35% {\n transform: rotateX(120deg);\n opacity: 0;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(360deg);\n opacity: 1;\n }\n"]))),Jn=r.keyframes(A||(A=f(["\n 0% {\n transform: rotateX(0deg);\n opacity: 1;\n }\n 35% {\n transform: rotateX(-40deg);\n opacity: 1;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n"],["\n 0% {\n transform: rotateX(0deg);\n opacity: 1;\n }\n 35% {\n transform: rotateX(-40deg);\n opacity: 1;\n }\n 65% {\n opacity: 0;\n }\n 100% {\n transform: rotateX(180deg);\n opacity: 0;\n }\n"]))),Kn=r.keyframes(M||(M=f([" // tbm\n 0% {\n transform:rotateX(0deg);\n }\n 5% {\n transform: rotateX(1turn);\n }\n 10% {\n transform: rotateX(2turn);\n }\n 20% {\n transform: rotateX(3turn);\n }\n 40% {\n transform: rotateX(4turn);\n }\n 70%, 100% {\n transform: rotateX(5turn);\n }\n"],[" // tbm\n 0% {\n transform:rotateX(0deg);\n }\n 5% {\n transform: rotateX(1turn);\n }\n 10% {\n transform: rotateX(2turn);\n }\n 20% {\n transform: rotateX(3turn);\n }\n 40% {\n transform: rotateX(4turn);\n }\n 70%, 100% {\n transform: rotateX(5turn);\n }\n"]))),Qn=r.keyframes(W||(W=f(["\n from {\n transform: rotateX(-90deg);\n transform-origin: center top;\n opacity: 1;\n }\n to {\n transform: rotateX(90deg);\n transform-origin: center top;\n opacity: 0;\n }\n"],["\n from {\n transform: rotateX(-90deg);\n transform-origin: center top;\n opacity: 1;\n }\n to {\n transform: rotateX(90deg);\n transform-origin: center top;\n opacity: 0;\n }\n"]))),Un=r.keyframes(D||(D=f(["\n from {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) translateY(0px);\n }\n to {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(-90deg) translateY(50px);\n }\n"],["\n from {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) translateY(0px);\n }\n to {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(-90deg) translateY(50px);\n }\n"]))),$n=r.keyframes(H||(H=f(["\n from {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(90deg);\n }\n to {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) ;\n }\n"],["\n from {\n opacity: 0;\n transform-origin: 0%, 0%;\n transform: rotateX(90deg);\n }\n to {\n opacity: 1;\n transform-origin: 0%, 0%;\n transform: rotateX(0deg) ;\n }\n"]))),nt=r.keyframes(V||(V=f(["\n from {\n transform: rotateX(-90deg);\n transform-origin: 50% 0;\n opacity: 0;\n }\n to {\n transform: rotateX(0deg);\n transform-origin: 50% 0;\n opacity: 1;\n }\n"],["\n from {\n transform: rotateX(-90deg);\n transform-origin: 50% 0;\n opacity: 0;\n }\n to {\n transform: rotateX(0deg);\n transform-origin: 50% 0;\n opacity: 1;\n }\n"]))),tt=r.keyframes(_||(_=f(["\n 0% {\n transform: rotateY(-95deg) translateX(-200px) ;\n transform-origin: left;\n }\n 100% {\n transform: rotateY(0deg);\n transform-origin: left;\n }\n"],["\n 0% {\n transform: rotateY(-95deg) translateX(-200px) ;\n transform-origin: left;\n }\n 100% {\n transform: rotateY(0deg);\n transform-origin: left;\n }\n"]))),rt=r.keyframes(G||(G=f(["\n 0% {\n opacity: 0;\n transform: translateX(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateX(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"]))),at=r.keyframes(J||(J=f(["\n 0% {\n opacity: 0;\n transform: translateX(100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateX(100%);\n }\n 60% {\n opacity: 1;\n transform: translateX(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateX(0);\n }\n"]))),ot=r.keyframes(K||(K=f(["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(-100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(-100%);\n }\n"]))),et=r.keyframes(Q||(Q=f(["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateX(0);\n }\n 60% {\n opacity: 0;\n transform: translateX(120%);\n }\n 100% {\n opacity: 0;\n transform: translateX(100%);\n }\n"]))),st=r.keyframes(U||(U=f(["\n 0% {\n opacity: 0;\n transform: translateY(100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateY(100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(-20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"]))),ft=r.keyframes($||($=f(["\n 0% {\n opacity: 0;\n transform: translateY(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"],["\n 0% {\n opacity: 0;\n transform: translateY(-100%);\n }\n 60% {\n opacity: 1;\n transform: translateY(20%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"]))),mt=r.keyframes(nn||(nn=f(["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(-100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(-120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(-100%);\n }\n"]))),it=r.keyframes(tn||(tn=f(["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(100%);\n }\n"],["\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 60% {\n opacity: 0;\n transform: translateY(120%);\n }\n 100% {\n opacity: 0;\n transform: translateY(100%);\n }\n"]))),ct=r.keyframes(rn||(rn=f(["\n 0% { transform: scale3d(1, 1, 1); }\n 30% { transform: scale3d(1, 0.4, 1); }\n 60% { transform: scale3d(0.4, 0.4, 1); }\n 100% {\n opacity: 0;\n transform: scale3d(0.2, 0.2, 0.2);\n }\n"],["\n 0% { transform: scale3d(1, 1, 1); }\n 30% { transform: scale3d(1, 0.4, 1); }\n 60% { transform: scale3d(0.4, 0.4, 1); }\n 100% {\n opacity: 0;\n transform: scale3d(0.2, 0.2, 0.2);\n }\n"]))),lt=r.keyframes(an||(an=f(["\n 0% {\n opacity: 0;\n transform: scale3d(0, 0, 0); }\n 30% {\n opacity: 1;\n transform: scale3d(0.4, 0.4, 1);\n }\n 60% { transform: scale3d(0.4, 1, 1); }\n 100% { transform: scale3d(1, 1, 1); }\n"],["\n 0% {\n opacity: 0;\n transform: scale3d(0, 0, 0); }\n 30% {\n opacity: 1;\n transform: scale3d(0.4, 0.4, 1);\n }\n 60% { transform: scale3d(0.4, 1, 1); }\n 100% { transform: scale3d(1, 1, 1); }\n"]))),pt=r.keyframes(on||(on=f(["\n from { transform: scale(2); }\n to { transform: scale(1); }\n"],["\n from { transform: scale(2); }\n to { transform: scale(1); }\n"]))),gt=r.keyframes(en||(en=f(["\n from { transform: scale(1); }\n to { transform: scale(2); }\n"],["\n from { transform: scale(1); }\n to { transform: scale(2); }\n"]))),dt=r.keyframes(sn||(sn=f(["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(360deg);\n transform-origin: center center;\n }\n"],["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(360deg);\n transform-origin: center center;\n }\n"]))),yt=r.keyframes(fn||(fn=f(["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(-360deg);\n transform-origin: center center;\n }\n"],["\n from {\n transform: rotate(0deg);\n transform-origin: center center;\n }\n to {\n transform: rotate(-360deg);\n transform-origin: center center;\n }\n"]))),xt={blur:Xn,bounce:Yn,effect3D:hn,flash:kn,float:bn,glowing:wn,jelly:On,pulse:vn,shadow:Tn,spin:Zn,swing:In,fadeIn:jn,fadeInFromLeft:Fn,fadeInFromRight:En,fadeInFromTop:Sn,fadeInFromBottom:zn,fadeOut:Pn,fadeOutToLeft:Rn,fadeOutToRight:Bn,fadeOutToTop:Cn,fadeOutToBottom:Ln,flip:_n,flipIn:Gn,flipOut:Jn,flipSlowDown:Kn,flipFromTop:$n,flipToTop:Qn,flipFromBottom:nt,flipToBottom:Un,flipFromLeftToCenter:tt,fold:ct,unfold:lt,hangOnLeft:qn,hangOnRight:Nn,rotateSlowDown:r.keyframes(mn||(mn=f(["\n 0% { transform:rotateZ(0deg); }\n 5% { transform: rotateZ(1turn); }\n 10% { transform: rotateZ(2turn); }\n 20% { transform: rotateZ(3turn); }\n 40% { transform: rotateZ(4turn); }\n 65%, 100% { transform: rotateZ(5turn); }\n"],["\n 0% { transform:rotateZ(0deg); }\n 5% { transform: rotateZ(1turn); }\n 10% { transform: rotateZ(2turn); }\n 20% { transform: rotateZ(3turn); }\n 40% { transform: rotateZ(4turn); }\n 65%, 100% { transform: rotateZ(5turn); }\n"]))),rotateCW:dt,rotateACW:yt,shakeMix:Dn,shakeHorizontal:Hn,shakeVertical:Vn,squeezeMix:An,squeezeHorizontal:Mn,squeezeVertical:Wn,slideInFromLeft:rt,slideInFromRight:at,slideOutToLeft:ot,slideOutToRight:et,slideInFromTop:st,slideInFromBottom:ft,slideOutToTop:mt,slideOutToBottom:it,zoomIn:pt,zoomOut:gt,popIn:r.keyframes(cn||(cn=f(["\n 0% {\n transform: scale3d(0, 0, 0);\n opacity: 0;\n }\n 30% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 60% { transform: scale3d(1, 1, 1); }\n 80% { transform: scale3d(1.03, 1.03, 1.03); }\n 100% { transform: scale3d(1, 1, 1); }\n"],["\n 0% {\n transform: scale3d(0, 0, 0);\n opacity: 0;\n }\n 30% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 60% { transform: scale3d(1, 1, 1); }\n 80% { transform: scale3d(1.03, 1.03, 1.03); }\n 100% { transform: scale3d(1, 1, 1); }\n"]))),popOut:r.keyframes(ln||(ln=f(["\n 0% { transform: scale3d(1, 1, 1); }\n 60% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 100% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n"],["\n 0% { transform: scale3d(1, 1, 1); }\n 60% {\n transform: scale3d(1.1, 1.1, 1.1);\n opacity: 1;\n }\n 100% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n"]))),typewriter:r.keyframes(pn||(pn=f([""],[""])))},ut=e.default.div(gn||(gn=f(["\n margin: 0;\n padding: 0;\n animation-name: ",";\n animation-duration: ",";\n animation-timing-function: ",";\n animation-delay: ",";\n animation-iteration-count: ",";\n animation-direction: ",";\n animation-fill-mode: ",";\n"],["\n margin: 0;\n padding: 0;\n animation-name: ",";\n animation-duration: ",";\n animation-timing-function: ",";\n animation-delay: ",";\n animation-iteration-count: ",";\n animation-direction: ",";\n animation-fill-mode: ",";\n"])),(function(n){return xt[n.type||"blur"]||null}),(function(n){return n.duration||"1s"}),(function(n){return n.timing||"ease"}),(function(n){return n.delay||"0s"}),(function(n){return n.iteration||"infinite"}),(function(n){return n.direction||"alternate"}),(function(n){return n.fillMode||"forwards"}));n.Animate=un,n.AnimateTyping=xn,n.default=un,Object.defineProperty(n,"__esModule",{value:!0})}));
|
package/package.json
ADDED
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "react-animate-z",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "React hook animate (lib)",
|
|
5
|
+
"main": "build/index.js",
|
|
6
|
+
"module": "build/index.esm.js",
|
|
7
|
+
"browser": "build/index.js",
|
|
8
|
+
"upkg": "build/index.min.js",
|
|
9
|
+
"styles": "build/styles.css",
|
|
10
|
+
"files": [
|
|
11
|
+
"build"
|
|
12
|
+
],
|
|
13
|
+
"types": "build/index.d.ts",
|
|
14
|
+
"scripts": {
|
|
15
|
+
"clean": "rimraf ./build",
|
|
16
|
+
"build": "rollup -c",
|
|
17
|
+
"cb": "npm run clean && npm run build",
|
|
18
|
+
"test:watch": "jest --watch",
|
|
19
|
+
"generate": "node ./util/create-component",
|
|
20
|
+
"prepublishOnly": "npm run build",
|
|
21
|
+
"deploy": "npm publish --access public"
|
|
22
|
+
},
|
|
23
|
+
"repository": {
|
|
24
|
+
"type": "git",
|
|
25
|
+
"url": "https://github.com/delpikye-v/react-animate.git"
|
|
26
|
+
},
|
|
27
|
+
"homepage": "https://github.com/delpikye-v/react-animate#readme",
|
|
28
|
+
"keywords": [
|
|
29
|
+
"react",
|
|
30
|
+
"components",
|
|
31
|
+
"animate",
|
|
32
|
+
"react-animate",
|
|
33
|
+
"basic-animate",
|
|
34
|
+
"simple-animate",
|
|
35
|
+
"lib"
|
|
36
|
+
],
|
|
37
|
+
"author": "Delpi.Kye",
|
|
38
|
+
"license": "MIT",
|
|
39
|
+
"bugs": {
|
|
40
|
+
"url": "https://github.com/delpikye-v/react-animate/issues"
|
|
41
|
+
},
|
|
42
|
+
"peerDependencies": {
|
|
43
|
+
"react": ">=16.8.0",
|
|
44
|
+
"react-dom": ">=16.8.0"
|
|
45
|
+
},
|
|
46
|
+
"devDependencies": {
|
|
47
|
+
"@babel/cli": "^7.14.8",
|
|
48
|
+
"@babel/core": "^7.15.0",
|
|
49
|
+
"@babel/preset-env": "^7.16.11",
|
|
50
|
+
"@babel/preset-react": "^7.16.7",
|
|
51
|
+
"@babel/preset-typescript": "^7.16.7",
|
|
52
|
+
"@rollup/plugin-commonjs": "^17.1.0",
|
|
53
|
+
"@rollup/plugin-node-resolve": "^11.2.1",
|
|
54
|
+
"@testing-library/jest-dom": "^5.14.1",
|
|
55
|
+
"@testing-library/react": "^11.2.7",
|
|
56
|
+
"@types/jest": "^24.9.1",
|
|
57
|
+
"@types/react": "17.0.20",
|
|
58
|
+
"@types/react-dom": "17.0.9",
|
|
59
|
+
"babel-loader": "^8.2.2",
|
|
60
|
+
"babel-preset-react-app": "^10.0.0",
|
|
61
|
+
"jest": "^26.6.3",
|
|
62
|
+
"node-sass": "^5.0.0",
|
|
63
|
+
"react": "^17.0.2",
|
|
64
|
+
"react-dom": "^17.0.2",
|
|
65
|
+
"rimraf": "^3.0.2",
|
|
66
|
+
"rollup": "^2.56.3",
|
|
67
|
+
"rollup-plugin-copy": "^3.4.0",
|
|
68
|
+
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
69
|
+
"rollup-plugin-postcss": "^3.1.8",
|
|
70
|
+
"rollup-plugin-terser": "^7.0.2",
|
|
71
|
+
"rollup-plugin-typescript2": "^0.29.0",
|
|
72
|
+
"sass-loader": "^10.2.0",
|
|
73
|
+
"ts-jest": "^26.5.6",
|
|
74
|
+
"tslib": "^2.3.1",
|
|
75
|
+
"typescript": "^4.4.2"
|
|
76
|
+
},
|
|
77
|
+
"dependencies": {
|
|
78
|
+
"styled-components": "^5.3.5"
|
|
79
|
+
}
|
|
80
|
+
}
|