react-awesome-reveal 3.8.1 → 4.0.0-beta.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.
Files changed (128) hide show
  1. package/dist/main.js +2336 -0
  2. package/dist/main.js.map +1 -0
  3. package/dist/module.js +2303 -0
  4. package/dist/module.js.map +1 -0
  5. package/dist/types.d.ts +185 -0
  6. package/dist/types.d.ts.map +1 -0
  7. package/package.json +29 -60
  8. package/README.md +0 -227
  9. package/dist/Reveal.d.ts +0 -70
  10. package/dist/animations/attention_seekers/bounce.d.ts +0 -5
  11. package/dist/animations/attention_seekers/flash.d.ts +0 -5
  12. package/dist/animations/attention_seekers/headShake.d.ts +0 -5
  13. package/dist/animations/attention_seekers/heartBeat.d.ts +0 -5
  14. package/dist/animations/attention_seekers/index.d.ts +0 -13
  15. package/dist/animations/attention_seekers/jello.d.ts +0 -5
  16. package/dist/animations/attention_seekers/pulse.d.ts +0 -5
  17. package/dist/animations/attention_seekers/rubberBand.d.ts +0 -5
  18. package/dist/animations/attention_seekers/shake.d.ts +0 -5
  19. package/dist/animations/attention_seekers/shakeX.d.ts +0 -5
  20. package/dist/animations/attention_seekers/shakeY.d.ts +0 -5
  21. package/dist/animations/attention_seekers/swing.d.ts +0 -5
  22. package/dist/animations/attention_seekers/tada.d.ts +0 -5
  23. package/dist/animations/attention_seekers/wobble.d.ts +0 -5
  24. package/dist/animations/bouncing_entrances/bounceIn.d.ts +0 -5
  25. package/dist/animations/bouncing_entrances/bounceInDown.d.ts +0 -5
  26. package/dist/animations/bouncing_entrances/bounceInLeft.d.ts +0 -5
  27. package/dist/animations/bouncing_entrances/bounceInRight.d.ts +0 -5
  28. package/dist/animations/bouncing_entrances/bounceInUp.d.ts +0 -5
  29. package/dist/animations/bouncing_entrances/index.d.ts +0 -5
  30. package/dist/animations/bouncing_exits/bounceOut.d.ts +0 -5
  31. package/dist/animations/bouncing_exits/bounceOutDown.d.ts +0 -5
  32. package/dist/animations/bouncing_exits/bounceOutLeft.d.ts +0 -5
  33. package/dist/animations/bouncing_exits/bounceOutRight.d.ts +0 -5
  34. package/dist/animations/bouncing_exits/bounceOutUp.d.ts +0 -5
  35. package/dist/animations/bouncing_exits/index.d.ts +0 -5
  36. package/dist/animations/fading_entrances/fadeIn.d.ts +0 -5
  37. package/dist/animations/fading_entrances/fadeInBottomLeft.d.ts +0 -5
  38. package/dist/animations/fading_entrances/fadeInBottomRight.d.ts +0 -5
  39. package/dist/animations/fading_entrances/fadeInDown.d.ts +0 -5
  40. package/dist/animations/fading_entrances/fadeInDownBig.d.ts +0 -5
  41. package/dist/animations/fading_entrances/fadeInLeft.d.ts +0 -5
  42. package/dist/animations/fading_entrances/fadeInLeftBig.d.ts +0 -5
  43. package/dist/animations/fading_entrances/fadeInRight.d.ts +0 -5
  44. package/dist/animations/fading_entrances/fadeInRightBig.d.ts +0 -5
  45. package/dist/animations/fading_entrances/fadeInTopLeft.d.ts +0 -5
  46. package/dist/animations/fading_entrances/fadeInTopRight.d.ts +0 -5
  47. package/dist/animations/fading_entrances/fadeInUp.d.ts +0 -5
  48. package/dist/animations/fading_entrances/fadeInUpBig.d.ts +0 -5
  49. package/dist/animations/fading_entrances/index.d.ts +0 -13
  50. package/dist/animations/fading_exits/fadeOut.d.ts +0 -5
  51. package/dist/animations/fading_exits/fadeOutBottomLeft.d.ts +0 -5
  52. package/dist/animations/fading_exits/fadeOutBottomRight.d.ts +0 -5
  53. package/dist/animations/fading_exits/fadeOutDown.d.ts +0 -5
  54. package/dist/animations/fading_exits/fadeOutDownBig.d.ts +0 -5
  55. package/dist/animations/fading_exits/fadeOutLeft.d.ts +0 -5
  56. package/dist/animations/fading_exits/fadeOutLeftBig.d.ts +0 -5
  57. package/dist/animations/fading_exits/fadeOutRight.d.ts +0 -5
  58. package/dist/animations/fading_exits/fadeOutRightBig.d.ts +0 -5
  59. package/dist/animations/fading_exits/fadeOutTopLeft.d.ts +0 -5
  60. package/dist/animations/fading_exits/fadeOutTopRight.d.ts +0 -5
  61. package/dist/animations/fading_exits/fadeOutUp.d.ts +0 -5
  62. package/dist/animations/fading_exits/fadeOutUpBig.d.ts +0 -5
  63. package/dist/animations/fading_exits/index.d.ts +0 -13
  64. package/dist/animations/flippers/flip.d.ts +0 -5
  65. package/dist/animations/flippers/flipInX.d.ts +0 -5
  66. package/dist/animations/flippers/flipInY.d.ts +0 -5
  67. package/dist/animations/flippers/flipOutX.d.ts +0 -5
  68. package/dist/animations/flippers/flipOutY.d.ts +0 -5
  69. package/dist/animations/flippers/index.d.ts +0 -5
  70. package/dist/animations/rotating_entrances/index.d.ts +0 -5
  71. package/dist/animations/rotating_entrances/rotateIn.d.ts +0 -5
  72. package/dist/animations/rotating_entrances/rotateInDownLeft.d.ts +0 -5
  73. package/dist/animations/rotating_entrances/rotateInDownRight.d.ts +0 -5
  74. package/dist/animations/rotating_entrances/rotateInUpLeft.d.ts +0 -5
  75. package/dist/animations/rotating_entrances/rotateInUpRight.d.ts +0 -5
  76. package/dist/animations/rotating_exits/index.d.ts +0 -5
  77. package/dist/animations/rotating_exits/rotateOut.d.ts +0 -5
  78. package/dist/animations/rotating_exits/rotateOutDownLeft.d.ts +0 -5
  79. package/dist/animations/rotating_exits/rotateOutDownRight.d.ts +0 -5
  80. package/dist/animations/rotating_exits/rotateOutUpLeft.d.ts +0 -5
  81. package/dist/animations/rotating_exits/rotateOutUpRight.d.ts +0 -5
  82. package/dist/animations/sliding_entrances/index.d.ts +0 -4
  83. package/dist/animations/sliding_entrances/slideInDown.d.ts +0 -5
  84. package/dist/animations/sliding_entrances/slideInLeft.d.ts +0 -5
  85. package/dist/animations/sliding_entrances/slideInRight.d.ts +0 -5
  86. package/dist/animations/sliding_entrances/slideInUp.d.ts +0 -5
  87. package/dist/animations/sliding_exits/index.d.ts +0 -4
  88. package/dist/animations/sliding_exits/slideOutDown.d.ts +0 -5
  89. package/dist/animations/sliding_exits/slideOutLeft.d.ts +0 -5
  90. package/dist/animations/sliding_exits/slideOutRight.d.ts +0 -5
  91. package/dist/animations/sliding_exits/slideOutUp.d.ts +0 -5
  92. package/dist/animations/specials/hinge.d.ts +0 -5
  93. package/dist/animations/specials/index.d.ts +0 -4
  94. package/dist/animations/specials/jackInTheBox.d.ts +0 -5
  95. package/dist/animations/specials/rollIn.d.ts +0 -5
  96. package/dist/animations/specials/rollOut.d.ts +0 -5
  97. package/dist/animations/zooming_entrances/index.d.ts +0 -5
  98. package/dist/animations/zooming_entrances/zoomIn.d.ts +0 -5
  99. package/dist/animations/zooming_entrances/zoomInDown.d.ts +0 -5
  100. package/dist/animations/zooming_entrances/zoomInLeft.d.ts +0 -5
  101. package/dist/animations/zooming_entrances/zoomInRight.d.ts +0 -5
  102. package/dist/animations/zooming_entrances/zoomInUp.d.ts +0 -5
  103. package/dist/animations/zooming_exits/index.d.ts +0 -5
  104. package/dist/animations/zooming_exits/zoomOut.d.ts +0 -5
  105. package/dist/animations/zooming_exits/zoomOutDown.d.ts +0 -5
  106. package/dist/animations/zooming_exits/zoomOutLeft.d.ts +0 -5
  107. package/dist/animations/zooming_exits/zoomOutRight.d.ts +0 -5
  108. package/dist/animations/zooming_exits/zoomOutUp.d.ts +0 -5
  109. package/dist/components/AttentionSeeker.d.ts +0 -12
  110. package/dist/components/Bounce.d.ts +0 -17
  111. package/dist/components/Fade.d.ts +0 -22
  112. package/dist/components/Flip.d.ts +0 -17
  113. package/dist/components/Hinge.d.ts +0 -5
  114. package/dist/components/JackInTheBox.d.ts +0 -5
  115. package/dist/components/Roll.d.ts +0 -11
  116. package/dist/components/Rotate.d.ts +0 -17
  117. package/dist/components/Slide.d.ts +0 -17
  118. package/dist/components/Zoom.d.ts +0 -17
  119. package/dist/index.d.ts +0 -13
  120. package/dist/index.js +0 -8
  121. package/dist/react-awesome-reveal.cjs.development.js +0 -1203
  122. package/dist/react-awesome-reveal.cjs.development.js.map +0 -1
  123. package/dist/react-awesome-reveal.cjs.production.min.js +0 -2
  124. package/dist/react-awesome-reveal.cjs.production.min.js.map +0 -1
  125. package/dist/react-awesome-reveal.esm.js +0 -1189
  126. package/dist/react-awesome-reveal.esm.js.map +0 -1
  127. package/dist/utils/animations.d.ts +0 -7
  128. package/dist/utils/js-types.d.ts +0 -2
@@ -1,1203 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var react = require('@emotion/react');
6
- var react$1 = require('react');
7
- var reactIntersectionObserver = require('react-intersection-observer');
8
- var reactIs = require('react-is');
9
- var jsxRuntime = require('@emotion/react/jsx-runtime');
10
-
11
- function _extends() {
12
- _extends = Object.assign || function (target) {
13
- for (var i = 1; i < arguments.length; i++) {
14
- var source = arguments[i];
15
-
16
- for (var key in source) {
17
- if (Object.prototype.hasOwnProperty.call(source, key)) {
18
- target[key] = source[key];
19
- }
20
- }
21
- }
22
-
23
- return target;
24
- };
25
-
26
- return _extends.apply(this, arguments);
27
- }
28
-
29
- function _objectWithoutPropertiesLoose(source, excluded) {
30
- if (source == null) return {};
31
- var target = {};
32
- var sourceKeys = Object.keys(source);
33
- var key, i;
34
-
35
- for (i = 0; i < sourceKeys.length; i++) {
36
- key = sourceKeys[i];
37
- if (excluded.indexOf(key) >= 0) continue;
38
- target[key] = source[key];
39
- }
40
-
41
- return target;
42
- }
43
-
44
- function _taggedTemplateLiteralLoose(strings, raw) {
45
- if (!raw) {
46
- raw = strings.slice(0);
47
- }
48
-
49
- strings.raw = raw;
50
- return strings;
51
- }
52
-
53
- var _templateObject;
54
- /**
55
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInLeft.css}
56
- */
57
-
58
- var fadeInLeft = /*#__PURE__*/react.keyframes(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(-100%, 0, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
59
-
60
- var _templateObject$1;
61
- function getAnimationCss(_ref) {
62
- var _ref$duration = _ref.duration,
63
- duration = _ref$duration === void 0 ? 1000 : _ref$duration,
64
- _ref$delay = _ref.delay,
65
- delay = _ref$delay === void 0 ? 0 : _ref$delay,
66
- _ref$timingFunction = _ref.timingFunction,
67
- timingFunction = _ref$timingFunction === void 0 ? "ease" : _ref$timingFunction,
68
- _ref$keyframes = _ref.keyframes,
69
- keyframes = _ref$keyframes === void 0 ? fadeInLeft : _ref$keyframes,
70
- _ref$iterationCount = _ref.iterationCount,
71
- iterationCount = _ref$iterationCount === void 0 ? 1 : _ref$iterationCount;
72
- return react.css(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n animation-duration: ", "ms;\n animation-timing-function: ", ";\n animation-delay: ", "ms;\n animation-name: ", ";\n animation-direction: normal;\n animation-fill-mode: both;\n animation-iteration-count: ", ";\n "])), duration, timingFunction, delay, keyframes, iterationCount);
73
- }
74
-
75
- function isNullOrUndefined(value) {
76
- return value === null || value === undefined;
77
- }
78
- function isStringLike(value) {
79
- return typeof value === "string" || typeof value === "number" || typeof value === "boolean";
80
- }
81
-
82
- var _templateObject$2, _templateObject2;
83
- var hiddenCss = /*#__PURE__*/react.css(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n opacity: 0;\n"])));
84
- var textBaseCss = /*#__PURE__*/react.css(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-block;\n white-space: pre;\n"])));
85
-
86
- var Reveal = function Reveal(_ref) {
87
- var _ref$cascade = _ref.cascade,
88
- cascade = _ref$cascade === void 0 ? false : _ref$cascade,
89
- _ref$damping = _ref.damping,
90
- damping = _ref$damping === void 0 ? 0.5 : _ref$damping,
91
- _ref$delay = _ref.delay,
92
- delay = _ref$delay === void 0 ? 0 : _ref$delay,
93
- _ref$duration = _ref.duration,
94
- duration = _ref$duration === void 0 ? 1000 : _ref$duration,
95
- _ref$fraction = _ref.fraction,
96
- fraction = _ref$fraction === void 0 ? 0 : _ref$fraction,
97
- _ref$keyframes = _ref.keyframes,
98
- keyframes = _ref$keyframes === void 0 ? fadeInLeft : _ref$keyframes,
99
- _ref$triggerOnce = _ref.triggerOnce,
100
- triggerOnce = _ref$triggerOnce === void 0 ? false : _ref$triggerOnce,
101
- revealCss = _ref.css,
102
- className = _ref.className,
103
- style = _ref.style,
104
- childClassName = _ref.childClassName,
105
- childStyle = _ref.childStyle,
106
- _children = _ref.children,
107
- onVisibilityChange = _ref.onVisibilityChange;
108
-
109
- if (isNullOrUndefined(_children)) {
110
- return null;
111
- }
112
-
113
- if (isStringLike(_children)) {
114
- var stringifiedChildren = String(_children);
115
- return cascade ? jsxRuntime.jsx(reactIntersectionObserver.InView, {
116
- threshold: fraction,
117
- triggerOnce: triggerOnce,
118
- onChange: onVisibilityChange,
119
- children: function children(_ref2) {
120
- var inView = _ref2.inView,
121
- ref = _ref2.ref;
122
- return jsxRuntime.jsx("div", {
123
- ref: ref,
124
- css: [revealCss, textBaseCss],
125
- className: className,
126
- style: style,
127
- children: stringifiedChildren.split("").map(function (_char, index) {
128
- return jsxRuntime.jsx("span", {
129
- css: inView ? getAnimationCss({
130
- keyframes: keyframes,
131
- delay: delay + index * duration * damping,
132
- duration: duration
133
- }) : hiddenCss,
134
- className: childClassName,
135
- style: childStyle,
136
- children: _char
137
- }, index);
138
- })
139
- });
140
- }
141
- }) : jsxRuntime.jsx(Reveal, {
142
- delay: delay,
143
- duration: duration,
144
- fraction: fraction,
145
- keyframes: keyframes,
146
- triggerOnce: triggerOnce,
147
- css: revealCss,
148
- className: className,
149
- style: style,
150
- children: stringifiedChildren
151
- });
152
- }
153
-
154
- if (reactIs.isFragment(_children)) {
155
- return jsxRuntime.jsx(reactIntersectionObserver.InView, {
156
- threshold: fraction,
157
- triggerOnce: triggerOnce,
158
- onChange: onVisibilityChange,
159
- children: function children(_ref3) {
160
- var inView = _ref3.inView,
161
- ref = _ref3.ref;
162
- return jsxRuntime.jsx("div", {
163
- ref: ref,
164
- css: inView ? [revealCss, getAnimationCss({
165
- keyframes: keyframes,
166
- delay: delay,
167
- duration: duration
168
- })] : hiddenCss,
169
- className: className,
170
- style: style,
171
- children: _children
172
- });
173
- }
174
- });
175
- }
176
-
177
- return jsxRuntime.jsx(jsxRuntime.Fragment, {
178
- children: react$1.Children.map(_children, function (node, index) {
179
- var nodeElement = node;
180
- var nodeCss = nodeElement.props.css ? [nodeElement.props.css] : [];
181
- nodeCss.push(getAnimationCss({
182
- keyframes: keyframes,
183
- delay: delay + (cascade ? index * duration * damping : 0),
184
- duration: duration
185
- }));
186
-
187
- switch (nodeElement.type) {
188
- case "ol":
189
- case "ul":
190
- return jsxRuntime.jsx(react.ClassNames, {
191
- children: function children(_ref4) {
192
- var cx = _ref4.cx;
193
- return react.jsx(nodeElement.type, _extends({}, nodeElement.props, {
194
- className: cx(className, nodeElement.props.className),
195
- style: _extends({}, style, nodeElement.props.style)
196
- }), jsxRuntime.jsx(Reveal, {
197
- cascade: cascade,
198
- damping: damping,
199
- delay: delay,
200
- duration: duration,
201
- fraction: fraction,
202
- keyframes: keyframes,
203
- triggerOnce: triggerOnce,
204
- css: revealCss,
205
- childClassName: childClassName,
206
- childStyle: childStyle,
207
- children: nodeElement.props.children
208
- }));
209
- }
210
- });
211
-
212
- case "li":
213
- return jsxRuntime.jsx(reactIntersectionObserver.InView, {
214
- threshold: fraction,
215
- triggerOnce: triggerOnce,
216
- onChange: onVisibilityChange,
217
- children: function children(_ref5) {
218
- var inView = _ref5.inView,
219
- ref = _ref5.ref;
220
- return jsxRuntime.jsx(react.ClassNames, {
221
- children: function children(_ref6) {
222
- var cx = _ref6.cx;
223
- return react.jsx(nodeElement.type, _extends({}, nodeElement.props, {
224
- ref: ref,
225
- css: inView ? [revealCss].concat(nodeCss) : hiddenCss,
226
- className: cx(childClassName, nodeElement.props.className),
227
- style: _extends({}, childStyle, nodeElement.props.style)
228
- }));
229
- }
230
- });
231
- }
232
- });
233
-
234
- default:
235
- return jsxRuntime.jsx(reactIntersectionObserver.InView, {
236
- threshold: fraction,
237
- triggerOnce: triggerOnce,
238
- onChange: onVisibilityChange,
239
- children: function children(_ref7) {
240
- var inView = _ref7.inView,
241
- ref = _ref7.ref;
242
- return jsxRuntime.jsx("div", {
243
- ref: ref,
244
- css: inView ? [revealCss].concat(nodeCss) : hiddenCss,
245
- className: className,
246
- style: style,
247
- children: jsxRuntime.jsx(react.ClassNames, {
248
- children: function children(_ref8) {
249
- var cx = _ref8.cx;
250
- return react.jsx(nodeElement.type, _extends({}, nodeElement.props, {
251
- className: cx(childClassName, nodeElement.props.className),
252
- style: _extends({}, childStyle, nodeElement.props.style)
253
- }));
254
- }
255
- })
256
- });
257
- }
258
- });
259
- }
260
- })
261
- });
262
- };
263
-
264
- var _templateObject$3;
265
- /**
266
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/bounce.css}
267
- */
268
-
269
- var bounce = /*#__PURE__*/react.keyframes(_templateObject$3 || (_templateObject$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 20%,\n 53%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n transform: translate3d(0, 0, 0);\n }\n\n 40%,\n 43% {\n animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n transform: translate3d(0, -30px, 0) scaleY(1.1);\n }\n\n 70% {\n animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n transform: translate3d(0, -15px, 0) scaleY(1.05);\n }\n\n 80% {\n transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n transform: translate3d(0, 0, 0) scaleY(0.95);\n }\n\n 90% {\n transform: translate3d(0, -4px, 0) scaleY(1.02);\n }\n"])));
270
-
271
- var _templateObject$4;
272
- /**
273
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/flash.css}
274
- */
275
-
276
- var flash = /*#__PURE__*/react.keyframes(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 50%,\n to {\n opacity: 1;\n }\n\n 25%,\n 75% {\n opacity: 0;\n }\n"])));
277
-
278
- var _templateObject$5;
279
- /**
280
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/headShake.css}
281
- */
282
-
283
- var headShake = /*#__PURE__*/react.keyframes(_templateObject$5 || (_templateObject$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 0% {\n transform: translateX(0);\n }\n\n 6.5% {\n transform: translateX(-6px) rotateY(-9deg);\n }\n\n 18.5% {\n transform: translateX(5px) rotateY(7deg);\n }\n\n 31.5% {\n transform: translateX(-3px) rotateY(-5deg);\n }\n\n 43.5% {\n transform: translateX(2px) rotateY(3deg);\n }\n\n 50% {\n transform: translateX(0);\n }\n"])));
284
-
285
- var _templateObject$6;
286
- /**
287
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/heartBeat.css}
288
- */
289
-
290
- var heartBeat = /*#__PURE__*/react.keyframes(_templateObject$6 || (_templateObject$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 0% {\n transform: scale(1);\n }\n\n 14% {\n transform: scale(1.3);\n }\n\n 28% {\n transform: scale(1);\n }\n\n 42% {\n transform: scale(1.3);\n }\n\n 70% {\n transform: scale(1);\n }\n"])));
291
-
292
- var _templateObject$7;
293
- /**
294
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/jello.css}
295
- */
296
-
297
- var jello = /*#__PURE__*/react.keyframes(_templateObject$7 || (_templateObject$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 11.1%,\n to {\n transform: translate3d(0, 0, 0);\n }\n\n 22.2% {\n transform: skewX(-12.5deg) skewY(-12.5deg);\n }\n\n 33.3% {\n transform: skewX(6.25deg) skewY(6.25deg);\n }\n\n 44.4% {\n transform: skewX(-3.125deg) skewY(-3.125deg);\n }\n\n 55.5% {\n transform: skewX(1.5625deg) skewY(1.5625deg);\n }\n\n 66.6% {\n transform: skewX(-0.78125deg) skewY(-0.78125deg);\n }\n\n 77.7% {\n transform: skewX(0.390625deg) skewY(0.390625deg);\n }\n\n 88.8% {\n transform: skewX(-0.1953125deg) skewY(-0.1953125deg);\n }\n"])));
298
-
299
- var _templateObject$8;
300
- /**
301
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/pulse.css}
302
- */
303
-
304
- var pulse = /*#__PURE__*/react.keyframes(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: scale3d(1, 1, 1);\n }\n\n 50% {\n transform: scale3d(1.05, 1.05, 1.05);\n }\n\n to {\n transform: scale3d(1, 1, 1);\n }\n"])));
305
-
306
- var _templateObject$9;
307
- /**
308
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/rubberBand.css}
309
- */
310
-
311
- var rubberBand = /*#__PURE__*/react.keyframes(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: scale3d(1, 1, 1);\n }\n\n 30% {\n transform: scale3d(1.25, 0.75, 1);\n }\n\n 40% {\n transform: scale3d(0.75, 1.25, 1);\n }\n\n 50% {\n transform: scale3d(1.15, 0.85, 1);\n }\n\n 65% {\n transform: scale3d(0.95, 1.05, 1);\n }\n\n 75% {\n transform: scale3d(1.05, 0.95, 1);\n }\n\n to {\n transform: scale3d(1, 1, 1);\n }\n"])));
312
-
313
- var _templateObject$a;
314
- /**
315
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/shake.css}
316
- */
317
-
318
- var shake = /*#__PURE__*/react.keyframes(_templateObject$a || (_templateObject$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n to {\n transform: translate3d(0, 0, 0);\n }\n\n 10%,\n 30%,\n 50%,\n 70%,\n 90% {\n transform: translate3d(-10px, 0, 0);\n }\n\n 20%,\n 40%,\n 60%,\n 80% {\n transform: translate3d(10px, 0, 0);\n }\n"])));
319
-
320
- var _templateObject$b;
321
- /**
322
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/shakeX.css}
323
- */
324
-
325
- var shakeX = /*#__PURE__*/react.keyframes(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n to {\n transform: translate3d(0, 0, 0);\n }\n\n 10%,\n 30%,\n 50%,\n 70%,\n 90% {\n transform: translate3d(-10px, 0, 0);\n }\n\n 20%,\n 40%,\n 60%,\n 80% {\n transform: translate3d(10px, 0, 0);\n }\n"])));
326
-
327
- var _templateObject$c;
328
- /**
329
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/shakeY.css}
330
- */
331
-
332
- var shakeY = /*#__PURE__*/react.keyframes(_templateObject$c || (_templateObject$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n to {\n transform: translate3d(0, 0, 0);\n }\n\n 10%,\n 30%,\n 50%,\n 70%,\n 90% {\n transform: translate3d(0, -10px, 0);\n }\n\n 20%,\n 40%,\n 60%,\n 80% {\n transform: translate3d(0, 10px, 0);\n }\n"])));
333
-
334
- var _templateObject$d;
335
- /**
336
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/swing.css}
337
- */
338
-
339
- var swing = /*#__PURE__*/react.keyframes(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 20% {\n transform: rotate3d(0, 0, 1, 15deg);\n }\n\n 40% {\n transform: rotate3d(0, 0, 1, -10deg);\n }\n\n 60% {\n transform: rotate3d(0, 0, 1, 5deg);\n }\n\n 80% {\n transform: rotate3d(0, 0, 1, -5deg);\n }\n\n to {\n transform: rotate3d(0, 0, 1, 0deg);\n }\n"])));
340
-
341
- var _templateObject$e;
342
- /**
343
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/tada.css}
344
- */
345
-
346
- var tada = /*#__PURE__*/react.keyframes(_templateObject$e || (_templateObject$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: scale3d(1, 1, 1);\n }\n\n 10%,\n 20% {\n transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);\n }\n\n 30%,\n 50%,\n 70%,\n 90% {\n transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);\n }\n\n 40%,\n 60%,\n 80% {\n transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);\n }\n\n to {\n transform: scale3d(1, 1, 1);\n }\n"])));
347
-
348
- var _templateObject$f;
349
- /**
350
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/attention_seekers/wobble.css}
351
- */
352
-
353
- var wobble = /*#__PURE__*/react.keyframes(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(0, 0, 0);\n }\n\n 15% {\n transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);\n }\n\n 30% {\n transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);\n }\n\n 45% {\n transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);\n }\n\n 60% {\n transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);\n }\n\n 75% {\n transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
354
-
355
- var _excluded = ["effect"];
356
-
357
- function getAttentionSeekerKeyframesAndCss(effect) {
358
- switch (effect) {
359
- case "flash":
360
- return [flash];
361
-
362
- case "headShake":
363
- return [headShake, {
364
- animationTimingFunction: "ease-in-out"
365
- }];
366
-
367
- case "heartBeat":
368
- return [heartBeat, {
369
- animationTimingFunction: "ease-in-out"
370
- }];
371
-
372
- case "jello":
373
- return [jello, {
374
- transformOrigin: "center"
375
- }];
376
-
377
- case "pulse":
378
- return [pulse, {
379
- animationTimingFunction: "ease-in-out"
380
- }];
381
-
382
- case "rubberBand":
383
- return [rubberBand];
384
-
385
- case "shake":
386
- return [shake];
387
-
388
- case "shakeX":
389
- return [shakeX];
390
-
391
- case "shakeY":
392
- return [shakeY];
393
-
394
- case "swing":
395
- return [swing, {
396
- transformOrigin: "top center"
397
- }];
398
-
399
- case "tada":
400
- return [tada];
401
-
402
- case "wobble":
403
- return [wobble];
404
-
405
- case "bounce":
406
- default:
407
- return [bounce, {
408
- transformOrigin: "center bottom"
409
- }];
410
- }
411
- }
412
-
413
- var AttentionSeeker = function AttentionSeeker(_ref) {
414
- var _ref$effect = _ref.effect,
415
- effect = _ref$effect === void 0 ? "bounce" : _ref$effect,
416
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
417
-
418
- var _getAttentionSeekerKe = getAttentionSeekerKeyframesAndCss(effect),
419
- keyframes = _getAttentionSeekerKe[0],
420
- animationCss = _getAttentionSeekerKe[1];
421
-
422
- return jsxRuntime.jsx(Reveal, _extends({
423
- keyframes: keyframes,
424
- css: animationCss
425
- }, otherProps));
426
- };
427
-
428
- var _templateObject$g;
429
- /**
430
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_entrances/bounceIn.css}
431
- */
432
-
433
- var bounceIn = /*#__PURE__*/react.keyframes(_templateObject$g || (_templateObject$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 20%,\n 40%,\n 60%,\n 80%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n\n 0% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n\n 20% {\n transform: scale3d(1.1, 1.1, 1.1);\n }\n\n 40% {\n transform: scale3d(0.9, 0.9, 0.9);\n }\n\n 60% {\n opacity: 1;\n transform: scale3d(1.03, 1.03, 1.03);\n }\n\n 80% {\n transform: scale3d(0.97, 0.97, 0.97);\n }\n\n to {\n opacity: 1;\n transform: scale3d(1, 1, 1);\n }\n"])));
434
-
435
- var _templateObject$h;
436
- /**
437
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_entrances/bounceInDown.css}
438
- */
439
-
440
- var bounceInDown = /*#__PURE__*/react.keyframes(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0) scaleY(3);\n }\n\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0) scaleY(0.9);\n }\n\n 75% {\n transform: translate3d(0, -10px, 0) scaleY(0.95);\n }\n\n 90% {\n transform: translate3d(0, 5px, 0) scaleY(0.985);\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
441
-
442
- var _templateObject$i;
443
- /**
444
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_entrances/bounceInLeft.css}
445
- */
446
-
447
- var bounceInLeft = /*#__PURE__*/react.keyframes(_templateObject$i || (_templateObject$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0) scaleX(3);\n }\n\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0) scaleX(1);\n }\n\n 75% {\n transform: translate3d(-10px, 0, 0) scaleX(0.98);\n }\n\n 90% {\n transform: translate3d(5px, 0, 0) scaleX(0.995);\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
448
-
449
- var _templateObject$j;
450
- /**
451
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_entrances/bounceInRight.css}
452
- */
453
-
454
- var bounceInRight = /*#__PURE__*/react.keyframes(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0) scaleX(3);\n }\n\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0) scaleX(1);\n }\n\n 75% {\n transform: translate3d(10px, 0, 0) scaleX(0.98);\n }\n\n 90% {\n transform: translate3d(-5px, 0, 0) scaleX(0.995);\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
455
-
456
- var _templateObject$k;
457
- /**
458
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_entrances/bounceInUp.css}
459
- */
460
-
461
- var bounceInUp = /*#__PURE__*/react.keyframes(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0) scaleY(5);\n }\n\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0) scaleY(0.9);\n }\n\n 75% {\n transform: translate3d(0, 10px, 0) scaleY(0.95);\n }\n\n 90% {\n transform: translate3d(0, -5px, 0) scaleY(0.985);\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
462
-
463
- var _templateObject$l;
464
- /**
465
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_exits/bounceOut.css}
466
- */
467
-
468
- var bounceOut = /*#__PURE__*/react.keyframes(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 20% {\n transform: scale3d(0.9, 0.9, 0.9);\n }\n\n 50%,\n 55% {\n opacity: 1;\n transform: scale3d(1.1, 1.1, 1.1);\n }\n\n to {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n"])));
469
-
470
- var _templateObject$m;
471
- /**
472
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_exits/bounceOutDown.css}
473
- */
474
-
475
- var bounceOutDown = /*#__PURE__*/react.keyframes(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 20% {\n transform: translate3d(0, 10px, 0) scaleY(0.985);\n }\n\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0) scaleY(0.9);\n }\n\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0) scaleY(3);\n }\n"])));
476
-
477
- var _templateObject$n;
478
- /**
479
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_exits/bounceOutLeft.css}
480
- */
481
-
482
- var bounceOutLeft = /*#__PURE__*/react.keyframes(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0) scaleX(0.9);\n }\n\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0) scaleX(2);\n }\n"])));
483
-
484
- var _templateObject$o;
485
- /**
486
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_exits/bounceOutRight.css}
487
- */
488
-
489
- var bounceOutRight = /*#__PURE__*/react.keyframes(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0) scaleX(0.9);\n }\n\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0) scaleX(2);\n }\n"])));
490
-
491
- var _templateObject$p;
492
- /**
493
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/bouncing_exits/bounceOutUp.css}
494
- */
495
-
496
- var bounceOutUp = /*#__PURE__*/react.keyframes(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 20% {\n transform: translate3d(0, -10px, 0) scaleY(0.985);\n }\n\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0) scaleY(0.9);\n }\n\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0) scaleY(3);\n }\n"])));
497
-
498
- var _excluded$1 = ["direction", "reverse"];
499
-
500
- function getBounceKeyframes(reverse, direction) {
501
- switch (direction) {
502
- case "down":
503
- return reverse ? bounceOutDown : bounceInDown;
504
-
505
- case "left":
506
- return reverse ? bounceOutLeft : bounceInLeft;
507
-
508
- case "right":
509
- return reverse ? bounceOutRight : bounceInRight;
510
-
511
- case "up":
512
- return reverse ? bounceOutUp : bounceInUp;
513
-
514
- default:
515
- return reverse ? bounceOut : bounceIn;
516
- }
517
- }
518
-
519
- var Bounce = function Bounce(_ref) {
520
- var direction = _ref.direction,
521
- _ref$reverse = _ref.reverse,
522
- reverse = _ref$reverse === void 0 ? false : _ref$reverse,
523
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$1);
524
-
525
- return jsxRuntime.jsx(Reveal, _extends({
526
- keyframes: getBounceKeyframes(reverse, direction)
527
- }, otherProps));
528
- };
529
-
530
- var _templateObject$q;
531
- /**
532
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeIn.css}
533
- */
534
-
535
- var fadeIn = /*#__PURE__*/react.keyframes(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n"])));
536
-
537
- var _templateObject$r;
538
- /**
539
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInBottomLeft.css}
540
- */
541
-
542
- var fadeInBottomLeft = /*#__PURE__*/react.keyframes(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(-100%, 100%, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
543
-
544
- var _templateObject$s;
545
- /**
546
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInBottomRight.css}
547
- */
548
-
549
- var fadeInBottomRight = /*#__PURE__*/react.keyframes(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(100%, 100%, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
550
-
551
- var _templateObject$t;
552
- /**
553
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInDown.css}
554
- */
555
-
556
- var fadeInDown = /*#__PURE__*/react.keyframes(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(0, -100%, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
557
-
558
- var _templateObject$u;
559
- /**
560
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInDownBig.css}
561
- */
562
-
563
- var fadeInDownBig = /*#__PURE__*/react.keyframes(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
564
-
565
- var _templateObject$v;
566
- /**
567
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInLeftBig.css}
568
- */
569
-
570
- var fadeInLeftBig = /*#__PURE__*/react.keyframes(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
571
-
572
- var _templateObject$w;
573
- /**
574
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInRight.css}
575
- */
576
-
577
- var fadeInRight = /*#__PURE__*/react.keyframes(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(100%, 0, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
578
-
579
- var _templateObject$x;
580
- /**
581
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInRightBig.css}
582
- */
583
-
584
- var fadeInRightBig = /*#__PURE__*/react.keyframes(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
585
-
586
- var _templateObject$y;
587
- /**
588
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInTopLeft.css}
589
- */
590
-
591
- var fadeInTopLeft = /*#__PURE__*/react.keyframes(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(-100%, -100%, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
592
-
593
- var _templateObject$z;
594
- /**
595
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInTopRight.css}
596
- */
597
-
598
- var fadeInTopRight = /*#__PURE__*/react.keyframes(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(100%, -100%, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
599
-
600
- var _templateObject$A;
601
- /**
602
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInUp.css}
603
- */
604
-
605
- var fadeInUp = /*#__PURE__*/react.keyframes(_templateObject$A || (_templateObject$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(0, 100%, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
606
-
607
- var _templateObject$B;
608
- /**
609
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_entrances/fadeInUpBig.css}
610
- */
611
-
612
- var fadeInUpBig = /*#__PURE__*/react.keyframes(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
613
-
614
- var _templateObject$C;
615
- /**
616
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOut.css}
617
- */
618
-
619
- var fadeOut = /*#__PURE__*/react.keyframes(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n"])));
620
-
621
- var _templateObject$D;
622
- /**
623
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutBottomLeft.css}
624
- */
625
-
626
- var fadeOutBottomLeft = /*#__PURE__*/react.keyframes(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n\n to {\n opacity: 0;\n transform: translate3d(-100%, 100%, 0);\n }\n"])));
627
-
628
- var _templateObject$E;
629
- /**
630
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutBottomRight.css}
631
- */
632
-
633
- var fadeOutBottomRight = /*#__PURE__*/react.keyframes(_templateObject$E || (_templateObject$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n\n to {\n opacity: 0;\n transform: translate3d(100%, 100%, 0);\n }\n"])));
634
-
635
- var _templateObject$F;
636
- /**
637
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutDown.css}
638
- */
639
-
640
- var fadeOutDown = /*#__PURE__*/react.keyframes(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(0, 100%, 0);\n }\n"])));
641
-
642
- var _templateObject$G;
643
- /**
644
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutDownBig.css}
645
- */
646
-
647
- var fadeOutDownBig = /*#__PURE__*/react.keyframes(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n"])));
648
-
649
- var _templateObject$H;
650
- /**
651
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutLeft.css}
652
- */
653
-
654
- var fadeOutLeft = /*#__PURE__*/react.keyframes(_templateObject$H || (_templateObject$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(-100%, 0, 0);\n }\n"])));
655
-
656
- var _templateObject$I;
657
- /**
658
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutLeftBig.css}
659
- */
660
-
661
- var fadeOutLeftBig = /*#__PURE__*/react.keyframes(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n"])));
662
-
663
- var _templateObject$J;
664
- /**
665
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutRight.css}
666
- */
667
-
668
- var fadeOutRight = /*#__PURE__*/react.keyframes(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(100%, 0, 0);\n }\n"])));
669
-
670
- var _templateObject$K;
671
- /**
672
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutRightBig.css}
673
- */
674
-
675
- var fadeOutRightBig = /*#__PURE__*/react.keyframes(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n"])));
676
-
677
- var _templateObject$L;
678
- /**
679
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutTopLeft.css}
680
- */
681
-
682
- var fadeOutTopLeft = /*#__PURE__*/react.keyframes(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n\n to {\n opacity: 0;\n transform: translate3d(-100%, -100%, 0);\n }\n"])));
683
-
684
- var _templateObject$M;
685
- /**
686
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutTopRight.css}
687
- */
688
-
689
- var fadeOutTopRight = /*#__PURE__*/react.keyframes(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n\n to {\n opacity: 0;\n transform: translate3d(100%, -100%, 0);\n }\n"])));
690
-
691
- var _templateObject$N;
692
- /**
693
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutUp.css}
694
- */
695
-
696
- var fadeOutUp = /*#__PURE__*/react.keyframes(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(0, -100%, 0);\n }\n"])));
697
-
698
- var _templateObject$O;
699
- /**
700
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/fading_exits/fadeOutUpBig.css}
701
- */
702
-
703
- var fadeOutUpBig = /*#__PURE__*/react.keyframes(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n"])));
704
-
705
- var _excluded$2 = ["big", "direction", "reverse"];
706
-
707
- function getFadeKeyframes(big, reverse, direction) {
708
- switch (direction) {
709
- case "bottom-left":
710
- return reverse ? fadeOutBottomLeft : fadeInBottomLeft;
711
-
712
- case "bottom-right":
713
- return reverse ? fadeOutBottomRight : fadeInBottomRight;
714
-
715
- case "down":
716
- return big ? reverse ? fadeOutDownBig : fadeInDownBig : reverse ? fadeOutDown : fadeInDown;
717
-
718
- case "left":
719
- return big ? reverse ? fadeOutLeftBig : fadeInLeftBig : reverse ? fadeOutLeft : fadeInLeft;
720
-
721
- case "right":
722
- return big ? reverse ? fadeOutRightBig : fadeInRightBig : reverse ? fadeOutRight : fadeInRight;
723
-
724
- case "top-left":
725
- return reverse ? fadeOutTopLeft : fadeInTopLeft;
726
-
727
- case "top-right":
728
- return reverse ? fadeOutTopRight : fadeInTopRight;
729
-
730
- case "up":
731
- return big ? reverse ? fadeOutUpBig : fadeInUpBig : reverse ? fadeOutUp : fadeInUp;
732
-
733
- default:
734
- return reverse ? fadeOut : fadeIn;
735
- }
736
- }
737
-
738
- var Fade = function Fade(_ref) {
739
- var _ref$big = _ref.big,
740
- big = _ref$big === void 0 ? false : _ref$big,
741
- direction = _ref.direction,
742
- _ref$reverse = _ref.reverse,
743
- reverse = _ref$reverse === void 0 ? false : _ref$reverse,
744
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$2);
745
-
746
- return jsxRuntime.jsx(Reveal, _extends({
747
- keyframes: getFadeKeyframes(big, reverse, direction)
748
- }, otherProps));
749
- };
750
-
751
- var _templateObject$P;
752
- /**
753
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/flippers/flip.css}
754
- */
755
-
756
- var flip = /*#__PURE__*/react.keyframes(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);\n animation-timing-function: ease-out;\n }\n\n 40% {\n transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)\n rotate3d(0, 1, 0, -190deg);\n animation-timing-function: ease-out;\n }\n\n 50% {\n transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)\n rotate3d(0, 1, 0, -170deg);\n animation-timing-function: ease-in;\n }\n\n 80% {\n transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)\n rotate3d(0, 1, 0, 0deg);\n animation-timing-function: ease-in;\n }\n\n to {\n transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);\n animation-timing-function: ease-in;\n }\n"])));
757
-
758
- var _templateObject$Q;
759
- /**
760
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/flippers/flipInX.css}
761
- */
762
-
763
- var flipInX = /*#__PURE__*/react.keyframes(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n\n to {\n transform: perspective(400px);\n }\n"])));
764
-
765
- var _templateObject$R;
766
- /**
767
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/flippers/flipInY.css}
768
- */
769
-
770
- var flipInY = /*#__PURE__*/react.keyframes(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: perspective(400px) rotate3d(0, 1, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n\n 40% {\n transform: perspective(400px) rotate3d(0, 1, 0, -20deg);\n animation-timing-function: ease-in;\n }\n\n 60% {\n transform: perspective(400px) rotate3d(0, 1, 0, 10deg);\n opacity: 1;\n }\n\n 80% {\n transform: perspective(400px) rotate3d(0, 1, 0, -5deg);\n }\n\n to {\n transform: perspective(400px);\n }\n"])));
771
-
772
- var _templateObject$S;
773
- /**
774
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/flippers/flipOutX.css}
775
- */
776
-
777
- var flipOutX = /*#__PURE__*/react.keyframes(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: perspective(400px);\n }\n\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n"])));
778
-
779
- var _templateObject$T;
780
- /**
781
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/flippers/flipOutY.css}
782
- */
783
-
784
- var flipOutY = /*#__PURE__*/react.keyframes(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: perspective(400px);\n }\n\n 30% {\n transform: perspective(400px) rotate3d(0, 1, 0, -15deg);\n opacity: 1;\n }\n\n to {\n transform: perspective(400px) rotate3d(0, 1, 0, 90deg);\n opacity: 0;\n }\n"])));
785
-
786
- var _excluded$3 = ["direction", "reverse"];
787
-
788
- function getFlipKeyframes(reverse, direction) {
789
- switch (direction) {
790
- case "horizontal":
791
- return reverse ? flipOutX : flipInX;
792
-
793
- case "vertical":
794
- return reverse ? flipOutY : flipInY;
795
-
796
- default:
797
- return flip;
798
- }
799
- }
800
-
801
- var Flip = function Flip(_ref) {
802
- var direction = _ref.direction,
803
- _ref$reverse = _ref.reverse,
804
- reverse = _ref$reverse === void 0 ? false : _ref$reverse,
805
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$3);
806
-
807
- var animationCss = {
808
- backfaceVisibility: "visible"
809
- };
810
- return jsxRuntime.jsx(Reveal, _extends({
811
- keyframes: getFlipKeyframes(reverse, direction),
812
- css: animationCss
813
- }, otherProps));
814
- };
815
-
816
- var _templateObject$U;
817
- /**
818
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/specials/hinge.css}
819
- */
820
-
821
- var hinge = /*#__PURE__*/react.keyframes(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 0% {\n animation-timing-function: ease-in-out;\n }\n\n 20%,\n 60% {\n transform: rotate3d(0, 0, 1, 80deg);\n animation-timing-function: ease-in-out;\n }\n\n 40%,\n 80% {\n transform: rotate3d(0, 0, 1, 60deg);\n animation-timing-function: ease-in-out;\n opacity: 1;\n }\n\n to {\n transform: translate3d(0, 700px, 0);\n opacity: 0;\n }\n"])));
822
-
823
- var _templateObject$V;
824
- /**
825
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/specials/jackInTheBox.css}
826
- */
827
-
828
- var jackInTheBox = /*#__PURE__*/react.keyframes(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: scale(0.1) rotate(30deg);\n transform-origin: center bottom;\n }\n\n 50% {\n transform: rotate(-10deg);\n }\n\n 70% {\n transform: rotate(3deg);\n }\n\n to {\n opacity: 1;\n transform: scale(1);\n }\n"])));
829
-
830
- var _templateObject$W;
831
- /**
832
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/specials/rollIn.css}
833
- */
834
-
835
- var rollIn = /*#__PURE__*/react.keyframes(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);\n }\n\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n"])));
836
-
837
- var _templateObject$X;
838
- /**
839
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/specials/rollOut.css}
840
- */
841
-
842
- var rollOut = /*#__PURE__*/react.keyframes(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);\n }\n"])));
843
-
844
- var Hinge = function Hinge(props) {
845
- var animationCss = {
846
- transformOrigin: "top left"
847
- };
848
- return jsxRuntime.jsx(Reveal, _extends({
849
- keyframes: hinge,
850
- css: animationCss
851
- }, props));
852
- };
853
-
854
- var JackInTheBox = function JackInTheBox(props) {
855
- return jsxRuntime.jsx(Reveal, _extends({
856
- keyframes: jackInTheBox
857
- }, props));
858
- };
859
-
860
- var _excluded$4 = ["reverse"];
861
-
862
- function getRollKeyframes(reverse) {
863
- return reverse ? rollOut : rollIn;
864
- }
865
-
866
- var Roll = function Roll(_ref) {
867
- var _ref$reverse = _ref.reverse,
868
- reverse = _ref$reverse === void 0 ? false : _ref$reverse,
869
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$4);
870
-
871
- return jsxRuntime.jsx(Reveal, _extends({
872
- keyframes: getRollKeyframes(reverse)
873
- }, otherProps));
874
- };
875
-
876
- var _templateObject$Y;
877
- /**
878
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_entrances/rotateIn.css}
879
- */
880
-
881
- var rotateIn = /*#__PURE__*/react.keyframes(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: rotate3d(0, 0, 1, -200deg);\n opacity: 0;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n }\n"])));
882
-
883
- var _templateObject$Z;
884
- /**
885
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_entrances/rotateInDownLeft.css}
886
- */
887
-
888
- var rotateInDownLeft = /*#__PURE__*/react.keyframes(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: rotate3d(0, 0, 1, -45deg);\n opacity: 0;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n }\n"])));
889
-
890
- var _templateObject$_;
891
- /**
892
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_entrances/rotateInDownRight.css}
893
- */
894
-
895
- var rotateInDownRight = /*#__PURE__*/react.keyframes(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: rotate3d(0, 0, 1, 45deg);\n opacity: 0;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n }\n"])));
896
-
897
- var _templateObject$$;
898
- /**
899
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_entrances/rotateInUpLeft.css}
900
- */
901
-
902
- var rotateInUpLeft = /*#__PURE__*/react.keyframes(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: rotate3d(0, 0, 1, 45deg);\n opacity: 0;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n }\n"])));
903
-
904
- var _templateObject$10;
905
- /**
906
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_entrances/rotateInUpRight.css}
907
- */
908
-
909
- var rotateInUpRight = /*#__PURE__*/react.keyframes(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: rotate3d(0, 0, 1, -90deg);\n opacity: 0;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n }\n"])));
910
-
911
- var _templateObject$11;
912
- /**
913
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_exits/rotateOut.css}
914
- */
915
-
916
- var rotateOut = /*#__PURE__*/react.keyframes(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n transform: rotate3d(0, 0, 1, 200deg);\n opacity: 0;\n }\n"])));
917
-
918
- var _templateObject$12;
919
- /**
920
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_exits/rotateOutDownLeft.css}
921
- */
922
-
923
- var rotateOutDownLeft = /*#__PURE__*/react.keyframes(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n transform: rotate3d(0, 0, 1, 45deg);\n opacity: 0;\n }\n"])));
924
-
925
- var _templateObject$13;
926
- /**
927
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_exits/rotateOutDownRight.css}
928
- */
929
-
930
- var rotateOutDownRight = /*#__PURE__*/react.keyframes(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n transform: rotate3d(0, 0, 1, -45deg);\n opacity: 0;\n }\n"])));
931
-
932
- var _templateObject$14;
933
- /**
934
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_exits/rotateOutUpLeft.css}
935
- */
936
-
937
- var rotateOutUpLeft = /*#__PURE__*/react.keyframes(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n transform: rotate3d(0, 0, 1, -45deg);\n opacity: 0;\n }\n"])));
938
-
939
- var _templateObject$15;
940
- /**
941
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/rotating_exits/rotateOutUpRight.css}
942
- */
943
-
944
- var rotateOutUpRight = /*#__PURE__*/react.keyframes(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n to {\n transform: rotate3d(0, 0, 1, 90deg);\n opacity: 0;\n }\n"])));
945
-
946
- var _excluded$5 = ["direction", "reverse"];
947
-
948
- function getRotateKeyframesAndCss(reverse, direction) {
949
- switch (direction) {
950
- case "bottom-left":
951
- return reverse ? [rotateOutDownLeft, {
952
- transformOrigin: "left bottom"
953
- }] : [rotateInDownLeft, {
954
- transformOrigin: "left bottom"
955
- }];
956
-
957
- case "bottom-right":
958
- return reverse ? [rotateOutDownRight, {
959
- transformOrigin: "right bottom"
960
- }] : [rotateInDownRight, {
961
- transformOrigin: "right bottom"
962
- }];
963
-
964
- case "top-left":
965
- return reverse ? [rotateOutUpLeft, {
966
- transformOrigin: "left bottom"
967
- }] : [rotateInUpLeft, {
968
- transformOrigin: "left bottom"
969
- }];
970
-
971
- case "top-right":
972
- return reverse ? [rotateOutUpRight, {
973
- transformOrigin: "right bottom"
974
- }] : [rotateInUpRight, {
975
- transformOrigin: "right bottom"
976
- }];
977
-
978
- default:
979
- return reverse ? [rotateOut, {
980
- transformOrigin: "center"
981
- }] : [rotateIn, {
982
- transformOrigin: "center"
983
- }];
984
- }
985
- }
986
-
987
- var Rotate = function Rotate(_ref) {
988
- var direction = _ref.direction,
989
- _ref$reverse = _ref.reverse,
990
- reverse = _ref$reverse === void 0 ? false : _ref$reverse,
991
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$5);
992
-
993
- var _getRotateKeyframesAn = getRotateKeyframesAndCss(reverse, direction),
994
- keyframes = _getRotateKeyframesAn[0],
995
- animationCss = _getRotateKeyframesAn[1];
996
-
997
- return jsxRuntime.jsx(Reveal, _extends({
998
- keyframes: keyframes,
999
- css: animationCss
1000
- }, otherProps));
1001
- };
1002
-
1003
- var _templateObject$16;
1004
- /**
1005
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_entrances/slideInDown.css}
1006
- */
1007
-
1008
- var slideInDown = /*#__PURE__*/react.keyframes(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(0, -100%, 0);\n visibility: visible;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
1009
-
1010
- var _templateObject$17;
1011
- /**
1012
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_entrances/slideInLeft.css}
1013
- */
1014
-
1015
- var slideInLeft = /*#__PURE__*/react.keyframes(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(-100%, 0, 0);\n visibility: visible;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
1016
-
1017
- var _templateObject$18;
1018
- /**
1019
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_entrances/slideInRight.css}
1020
- */
1021
-
1022
- var slideInRight = /*#__PURE__*/react.keyframes(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(100%, 0, 0);\n visibility: visible;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
1023
-
1024
- var _templateObject$19;
1025
- /**
1026
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_entrances/slideInUp.css}
1027
- */
1028
-
1029
- var slideInUp = /*#__PURE__*/react.keyframes(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(0, 100%, 0);\n visibility: visible;\n }\n\n to {\n transform: translate3d(0, 0, 0);\n }\n"])));
1030
-
1031
- var _templateObject$1a;
1032
- /**
1033
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_exits/slideOutDown.css}
1034
- */
1035
-
1036
- var slideOutDown = /*#__PURE__*/react.keyframes(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(0, 0, 0);\n }\n\n to {\n visibility: hidden;\n transform: translate3d(0, 100%, 0);\n }\n"])));
1037
-
1038
- var _templateObject$1b;
1039
- /**
1040
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_exits/slideOutLeft.css}
1041
- */
1042
-
1043
- var slideOutLeft = /*#__PURE__*/react.keyframes(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(0, 0, 0);\n }\n\n to {\n visibility: hidden;\n transform: translate3d(-100%, 0, 0);\n }\n"])));
1044
-
1045
- var _templateObject$1c;
1046
- /**
1047
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_exits/slideOutRight.css}
1048
- */
1049
-
1050
- var slideOutRight = /*#__PURE__*/react.keyframes(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(0, 0, 0);\n }\n\n to {\n visibility: hidden;\n transform: translate3d(100%, 0, 0);\n }\n"])));
1051
-
1052
- var _templateObject$1d;
1053
- /**
1054
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/sliding_exits/slideOutUp.css}
1055
- */
1056
-
1057
- var slideOutUp = /*#__PURE__*/react.keyframes(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n transform: translate3d(0, 0, 0);\n }\n\n to {\n visibility: hidden;\n transform: translate3d(0, -100%, 0);\n }\n"])));
1058
-
1059
- var _excluded$6 = ["direction", "reverse"];
1060
-
1061
- function getSlideKeyframes(reverse, direction) {
1062
- switch (direction) {
1063
- case "down":
1064
- return reverse ? slideOutDown : slideInDown;
1065
-
1066
- case "right":
1067
- return reverse ? slideOutRight : slideInRight;
1068
-
1069
- case "up":
1070
- return reverse ? slideOutUp : slideInUp;
1071
-
1072
- case "left":
1073
- default:
1074
- return reverse ? slideOutLeft : slideInLeft;
1075
- }
1076
- }
1077
-
1078
- var Slide = function Slide(_ref) {
1079
- var direction = _ref.direction,
1080
- _ref$reverse = _ref.reverse,
1081
- reverse = _ref$reverse === void 0 ? false : _ref$reverse,
1082
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$6);
1083
-
1084
- return jsxRuntime.jsx(Reveal, _extends({
1085
- keyframes: getSlideKeyframes(reverse, direction)
1086
- }, otherProps));
1087
- };
1088
-
1089
- var _templateObject$1e;
1090
- /**
1091
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_entrances/zoomIn.css}
1092
- */
1093
-
1094
- var zoomIn = /*#__PURE__*/react.keyframes(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n\n 50% {\n opacity: 1;\n }\n"])));
1095
-
1096
- var _templateObject$1f;
1097
- /**
1098
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_entrances/zoomInDown.css}
1099
- */
1100
-
1101
- var zoomInDown = /*#__PURE__*/react.keyframes(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);\n animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);\n }\n\n 60% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);\n animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);\n }\n"])));
1102
-
1103
- var _templateObject$1g;
1104
- /**
1105
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_entrances/zoomInLeft.css}
1106
- */
1107
-
1108
- var zoomInLeft = /*#__PURE__*/react.keyframes(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);\n animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);\n }\n\n 60% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);\n animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);\n }\n"])));
1109
-
1110
- var _templateObject$1h;
1111
- /**
1112
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_entrances/zoomInRight.css}
1113
- */
1114
-
1115
- var zoomInRight = /*#__PURE__*/react.keyframes(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);\n animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);\n }\n\n 60% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);\n animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);\n }\n"])));
1116
-
1117
- var _templateObject$1i;
1118
- /**
1119
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_entrances/zoomInUp.css}
1120
- */
1121
-
1122
- var zoomInUp = /*#__PURE__*/react.keyframes(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 0;\n transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);\n animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);\n }\n\n 60% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);\n animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);\n }\n"])));
1123
-
1124
- var _templateObject$1j;
1125
- /**
1126
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_exits/zoomOut.css}
1127
- */
1128
-
1129
- var zoomOut = /*#__PURE__*/react.keyframes(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n from {\n opacity: 1;\n }\n\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n\n to {\n opacity: 0;\n }\n"])));
1130
-
1131
- var _templateObject$1k;
1132
- /**
1133
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_exits/zoomOutDown.css}
1134
- */
1135
-
1136
- var zoomOutDown = /*#__PURE__*/react.keyframes(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 40% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);\n animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);\n }\n\n to {\n opacity: 0;\n transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);\n animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);\n }\n"])));
1137
-
1138
- var _templateObject$1l;
1139
- /**
1140
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_exits/zoomOutLeft.css}
1141
- */
1142
-
1143
- var zoomOutLeft = /*#__PURE__*/react.keyframes(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 40% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);\n }\n\n to {\n opacity: 0;\n transform: scale(0.1) translate3d(-2000px, 0, 0);\n }\n"])));
1144
-
1145
- var _templateObject$1m;
1146
- /**
1147
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_exits/zoomOutRight.css}
1148
- */
1149
-
1150
- var zoomOutRight = /*#__PURE__*/react.keyframes(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 40% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);\n }\n\n to {\n opacity: 0;\n transform: scale(0.1) translate3d(2000px, 0, 0);\n }\n"])));
1151
-
1152
- var _templateObject$1n;
1153
- /**
1154
- * @see {@link https://github.com/animate-css/animate.css/blob/master/source/zooming_exits/zoomOutUp.css}
1155
- */
1156
-
1157
- var zoomOutUp = /*#__PURE__*/react.keyframes(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n 40% {\n opacity: 1;\n transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);\n animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);\n }\n\n to {\n opacity: 0;\n transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);\n animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);\n }\n"])));
1158
-
1159
- var _excluded$7 = ["direction", "reverse"];
1160
-
1161
- function getZoomKeyframes(reverse, direction) {
1162
- switch (direction) {
1163
- case "down":
1164
- return reverse ? zoomOutDown : zoomInDown;
1165
-
1166
- case "left":
1167
- return reverse ? zoomOutLeft : zoomInLeft;
1168
-
1169
- case "right":
1170
- return reverse ? zoomOutRight : zoomInRight;
1171
-
1172
- case "up":
1173
- return reverse ? zoomOutUp : zoomInUp;
1174
-
1175
- default:
1176
- return reverse ? zoomOut : zoomIn;
1177
- }
1178
- }
1179
-
1180
- var Zoom = function Zoom(_ref) {
1181
- var direction = _ref.direction,
1182
- _ref$reverse = _ref.reverse,
1183
- reverse = _ref$reverse === void 0 ? false : _ref$reverse,
1184
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$7);
1185
-
1186
- return jsxRuntime.jsx(Reveal, _extends({
1187
- keyframes: getZoomKeyframes(reverse, direction)
1188
- }, otherProps));
1189
- };
1190
-
1191
- exports.AttentionSeeker = AttentionSeeker;
1192
- exports.Bounce = Bounce;
1193
- exports.Fade = Fade;
1194
- exports.Flip = Flip;
1195
- exports.Hinge = Hinge;
1196
- exports.JackInTheBox = JackInTheBox;
1197
- exports.Reveal = Reveal;
1198
- exports.Roll = Roll;
1199
- exports.Rotate = Rotate;
1200
- exports.Slide = Slide;
1201
- exports.Zoom = Zoom;
1202
- exports.default = Reveal;
1203
- //# sourceMappingURL=react-awesome-reveal.cjs.development.js.map