@eventlook/sdk 1.5.0-beta.4 → 1.5.0-beta.5

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 (30) hide show
  1. package/.claude/settings.local.json +3 -1
  2. package/dist/types/components/animate/variants/index.d.ts +0 -8
  3. package/dist/types/components/hook-form/index.d.ts +0 -4
  4. package/package.json +1 -2
  5. package/src/components/animate/variants/index.ts +0 -8
  6. package/src/components/hook-form/index.ts +0 -4
  7. package/dist/types/components/animate/variants/actions.d.ts +0 -5
  8. package/dist/types/components/animate/variants/background.d.ts +0 -104
  9. package/dist/types/components/animate/variants/flip.d.ts +0 -75
  10. package/dist/types/components/animate/variants/path.d.ts +0 -14
  11. package/dist/types/components/animate/variants/rotate.d.ts +0 -39
  12. package/dist/types/components/animate/variants/scale.d.ts +0 -75
  13. package/dist/types/components/animate/variants/slide.d.ts +0 -155
  14. package/dist/types/components/animate/variants/zoom.d.ts +0 -199
  15. package/dist/types/components/hook-form/RHFAutocomplete.d.ts +0 -9
  16. package/dist/types/components/hook-form/RHFCodes.d.ts +0 -8
  17. package/dist/types/components/hook-form/RHFSlider.d.ts +0 -8
  18. package/dist/types/components/hook-form/RHFSwitch.d.ts +0 -8
  19. package/src/components/animate/variants/actions.ts +0 -7
  20. package/src/components/animate/variants/background.ts +0 -106
  21. package/src/components/animate/variants/flip.ts +0 -37
  22. package/src/components/animate/variants/path.ts +0 -14
  23. package/src/components/animate/variants/rotate.ts +0 -28
  24. package/src/components/animate/variants/scale.ts +0 -37
  25. package/src/components/animate/variants/slide.ts +0 -60
  26. package/src/components/animate/variants/zoom.ts +0 -129
  27. package/src/components/hook-form/RHFAutocomplete.tsx +0 -52
  28. package/src/components/hook-form/RHFCodes.tsx +0 -93
  29. package/src/components/hook-form/RHFSlider.tsx +0 -30
  30. package/src/components/hook-form/RHFSwitch.tsx +0 -30
package/dist/types/components/animate/variants/zoom.d.ts DELETED
@@ -1,199 +0,0 @@
1
- import { VariantsType } from '@utils/types/animate';
2
- export declare const varZoom: (props?: VariantsType) => {
3
- in: {
4
- initial: {
5
- scale: number;
6
- opacity: number;
7
- };
8
- animate: {
9
- scale: number;
10
- opacity: number;
11
- transition: {
12
- duration: number;
13
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
14
- };
15
- };
16
- exit: {
17
- scale: number;
18
- opacity: number;
19
- transition: {
20
- duration: number;
21
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
22
- };
23
- };
24
- };
25
- inUp: {
26
- initial: {
27
- scale: number;
28
- opacity: number;
29
- translateY: number;
30
- };
31
- animate: {
32
- scale: number;
33
- opacity: number;
34
- translateY: number;
35
- transition: {
36
- duration: number;
37
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
38
- };
39
- };
40
- exit: {
41
- scale: number;
42
- opacity: number;
43
- translateY: number;
44
- transition: {
45
- duration: number;
46
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
47
- };
48
- };
49
- };
50
- inDown: {
51
- initial: {
52
- scale: number;
53
- opacity: number;
54
- translateY: number;
55
- };
56
- animate: {
57
- scale: number;
58
- opacity: number;
59
- translateY: number;
60
- transition: {
61
- duration: number;
62
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
63
- };
64
- };
65
- exit: {
66
- scale: number;
67
- opacity: number;
68
- translateY: number;
69
- transition: {
70
- duration: number;
71
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
72
- };
73
- };
74
- };
75
- inLeft: {
76
- initial: {
77
- scale: number;
78
- opacity: number;
79
- translateX: number;
80
- };
81
- animate: {
82
- scale: number;
83
- opacity: number;
84
- translateX: number;
85
- transition: {
86
- duration: number;
87
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
88
- };
89
- };
90
- exit: {
91
- scale: number;
92
- opacity: number;
93
- translateX: number;
94
- transition: {
95
- duration: number;
96
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
97
- };
98
- };
99
- };
100
- inRight: {
101
- initial: {
102
- scale: number;
103
- opacity: number;
104
- translateX: number;
105
- };
106
- animate: {
107
- scale: number;
108
- opacity: number;
109
- translateX: number;
110
- transition: {
111
- duration: number;
112
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
113
- };
114
- };
115
- exit: {
116
- scale: number;
117
- opacity: number;
118
- translateX: number;
119
- transition: {
120
- duration: number;
121
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
122
- };
123
- };
124
- };
125
- out: {
126
- initial: {
127
- scale: number;
128
- opacity: number;
129
- };
130
- animate: {
131
- scale: number;
132
- opacity: number;
133
- transition: {
134
- duration: number;
135
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
136
- };
137
- };
138
- };
139
- outUp: {
140
- initial: {
141
- scale: number;
142
- opacity: number;
143
- };
144
- animate: {
145
- scale: number;
146
- opacity: number;
147
- translateY: number;
148
- transition: {
149
- duration: number;
150
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
151
- };
152
- };
153
- };
154
- outDown: {
155
- initial: {
156
- scale: number;
157
- opacity: number;
158
- };
159
- animate: {
160
- scale: number;
161
- opacity: number;
162
- translateY: number;
163
- transition: {
164
- duration: number;
165
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
166
- };
167
- };
168
- };
169
- outLeft: {
170
- initial: {
171
- scale: number;
172
- opacity: number;
173
- };
174
- animate: {
175
- scale: number;
176
- opacity: number;
177
- translateX: number;
178
- transition: {
179
- duration: number;
180
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
181
- };
182
- };
183
- };
184
- outRight: {
185
- initial: {
186
- scale: number;
187
- opacity: number;
188
- };
189
- animate: {
190
- scale: number;
191
- opacity: number;
192
- translateX: number;
193
- transition: {
194
- duration: number;
195
- ease: "linear" | [number, number, number, number] | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
196
- };
197
- };
198
- };
199
- };
package/dist/types/components/hook-form/RHFAutocomplete.d.ts DELETED
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- import { AutocompleteProps } from '@mui/material';
3
- interface Props<T, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined> extends AutocompleteProps<T, Multiple, DisableClearable, FreeSolo> {
4
- name: string;
5
- label?: string;
6
- helperText?: React.ReactNode;
7
- }
8
- export default function RHFAutocomplete<T, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined>({ name, label, helperText, ...other }: Omit<Props<T, Multiple, DisableClearable, FreeSolo>, 'renderInput'>): React.JSX.Element;
9
- export {};
package/dist/types/components/hook-form/RHFCodes.d.ts DELETED
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { TextFieldProps } from '@mui/material';
3
- type Props = TextFieldProps & {
4
- keyName: string;
5
- inputs: string[];
6
- };
7
- export default function RHFCodes({ keyName, inputs, ...other }: Props): React.JSX.Element;
8
- export {};
package/dist/types/components/hook-form/RHFSlider.d.ts DELETED
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { SliderProps } from '@mui/material';
3
- type Props = SliderProps & {
4
- name: string;
5
- helperText?: React.ReactNode;
6
- };
7
- export default function RHFSlider({ name, helperText, ...other }: Props): React.JSX.Element;
8
- export {};
package/dist/types/components/hook-form/RHFSwitch.d.ts DELETED
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { FormControlLabelProps } from '@mui/material';
3
- interface Props extends Omit<FormControlLabelProps, 'control'> {
4
- name: string;
5
- helperText?: React.ReactNode;
6
- }
7
- export default function RHFSwitch({ name, helperText, ...other }: Props): React.JSX.Element;
8
- export {};
package/src/components/animate/variants/actions.ts DELETED
@@ -1,7 +0,0 @@
1
- // ----------------------------------------------------------------------
2
-
3
- export const varHover = (scale?: number) => ({
4
- hover: {
5
- scale: scale || 1.1,
6
- },
7
- });
package/src/components/animate/variants/background.ts DELETED
@@ -1,106 +0,0 @@
1
- // @types
2
- import { BackgroundType } from '@utils/types/animate';
3
-
4
- // ----------------------------------------------------------------------
5
-
6
- export const varBgColor = (props?: BackgroundType) => {
7
- const colors = props?.colors || ['#19dcea', '#b22cff'];
8
- const duration = props?.duration || 5;
9
- const ease = props?.ease || 'linear';
10
-
11
- return {
12
- animate: {
13
- background: colors,
14
- transition: { duration, ease },
15
- },
16
- };
17
- };
18
-
19
- // ----------------------------------------------------------------------
20
-
21
- export const varBgKenburns = (props?: BackgroundType) => {
22
- const duration = props?.duration || 5;
23
- const ease = props?.ease || 'easeOut';
24
-
25
- return {
26
- top: {
27
- animate: {
28
- scale: [1, 1.25],
29
- y: [0, -15],
30
- transformOrigin: ['50% 16%', 'top'],
31
- transition: { duration, ease },
32
- },
33
- },
34
- right: {
35
- animate: {
36
- scale: [1, 1.25],
37
- x: [0, 20],
38
- y: [0, -15],
39
- transformOrigin: ['84% 50%', 'right'],
40
- transition: { duration, ease },
41
- },
42
- },
43
- bottom: {
44
- animate: {
45
- scale: [1, 1.25],
46
- y: [0, 15],
47
- transformOrigin: ['50% 84%', 'bottom'],
48
- transition: { duration, ease },
49
- },
50
- },
51
- left: {
52
- animate: {
53
- scale: [1, 1.25],
54
- x: [0, -20],
55
- y: [0, 15],
56
- transformOrigin: ['16% 50%', 'left'],
57
- transition: { duration, ease },
58
- },
59
- },
60
- };
61
- };
62
-
63
- // ----------------------------------------------------------------------
64
-
65
- export const varBgPan = (props?: BackgroundType) => {
66
- const colors = props?.colors || ['#ee7752', '#e73c7e', '#23a6d5', '#23d5ab'];
67
- const duration = props?.duration || 5;
68
- const ease = props?.ease || 'linear';
69
-
70
- const gradient = (deg: number) => `linear-gradient(${deg}deg, ${colors})`;
71
-
72
- return {
73
- top: {
74
- animate: {
75
- backgroundImage: [gradient(0), gradient(0)],
76
- backgroundPosition: ['center 99%', 'center 1%'],
77
- backgroundSize: ['100% 600%', '100% 600%'],
78
- transition: { duration, ease },
79
- },
80
- },
81
- right: {
82
- animate: {
83
- backgroundPosition: ['1% center', '99% center'],
84
- backgroundImage: [gradient(270), gradient(270)],
85
- backgroundSize: ['600% 100%', '600% 100%'],
86
- transition: { duration, ease },
87
- },
88
- },
89
- bottom: {
90
- animate: {
91
- backgroundImage: [gradient(0), gradient(0)],
92
- backgroundPosition: ['center 1%', 'center 99%'],
93
- backgroundSize: ['100% 600%', '100% 600%'],
94
- transition: { duration, ease },
95
- },
96
- },
97
- left: {
98
- animate: {
99
- backgroundPosition: ['99% center', '1% center'],
100
- backgroundImage: [gradient(270), gradient(270)],
101
- backgroundSize: ['600% 100%', '600% 100%'],
102
- transition: { duration, ease },
103
- },
104
- },
105
- };
106
- };
package/src/components/animate/variants/flip.ts DELETED
@@ -1,37 +0,0 @@
1
- // @types
2
- import { VariantsType } from '@utils/types/animate';
3
- //
4
- import { varTranEnter, varTranExit } from './transition';
5
-
6
- // ----------------------------------------------------------------------
7
-
8
- export const varFlip = (props?: VariantsType) => {
9
- const durationIn = props?.durationIn;
10
- const durationOut = props?.durationOut;
11
- const easeIn = props?.easeIn;
12
- const easeOut = props?.easeOut;
13
-
14
- return {
15
- // IN
16
- inX: {
17
- initial: { rotateX: -180, opacity: 0 },
18
- animate: { rotateX: 0, opacity: 1, transition: varTranEnter({ durationIn, easeIn }) },
19
- exit: { rotateX: -180, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
20
- },
21
- inY: {
22
- initial: { rotateY: -180, opacity: 0 },
23
- animate: { rotateY: 0, opacity: 1, transition: varTranEnter({ durationIn, easeIn }) },
24
- exit: { rotateY: -180, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
25
- },
26
-
27
- // OUT
28
- outX: {
29
- initial: { rotateX: 0, opacity: 1 },
30
- animate: { rotateX: 70, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
31
- },
32
- outY: {
33
- initial: { rotateY: 0, opacity: 1 },
34
- animate: { rotateY: 70, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
35
- },
36
- };
37
- };
package/src/components/animate/variants/path.ts DELETED
@@ -1,14 +0,0 @@
1
- // ----------------------------------------------------------------------
2
-
3
- export const TRANSITION = {
4
- duration: 2,
5
- ease: [0.43, 0.13, 0.23, 0.96],
6
- };
7
-
8
- export const varPath = {
9
- animate: {
10
- fillOpacity: [0, 0, 1],
11
- pathLength: [1, 0.4, 0],
12
- transition: TRANSITION,
13
- },
14
- };
package/src/components/animate/variants/rotate.ts DELETED
@@ -1,28 +0,0 @@
1
- // @types
2
- import { VariantsType } from '@utils/types/animate';
3
- //
4
- import { varTranEnter, varTranExit } from './transition';
5
-
6
- // ----------------------------------------------------------------------
7
-
8
- export const varRotate = (props?: VariantsType) => {
9
- const durationIn = props?.durationIn;
10
- const durationOut = props?.durationOut;
11
- const easeIn = props?.easeIn;
12
- const easeOut = props?.easeOut;
13
-
14
- return {
15
- // IN
16
- in: {
17
- initial: { opacity: 0, rotate: -360 },
18
- animate: { opacity: 1, rotate: 0, transition: varTranEnter({ durationIn, easeIn }) },
19
- exit: { opacity: 0, rotate: -360, transition: varTranExit({ durationOut, easeOut }) },
20
- },
21
-
22
- // OUT
23
- out: {
24
- initial: { opacity: 1, rotate: 0 },
25
- animate: { opacity: 0, rotate: -360, transition: varTranExit({ durationOut, easeOut }) },
26
- },
27
- };
28
- };
package/src/components/animate/variants/scale.ts DELETED
@@ -1,37 +0,0 @@
1
- // @types
2
- import { VariantsType } from '@utils/types/animate';
3
- //
4
- import { varTranEnter, varTranExit } from './transition';
5
-
6
- // ----------------------------------------------------------------------
7
-
8
- export const varScale = (props?: VariantsType) => {
9
- const durationIn = props?.durationIn;
10
- const durationOut = props?.durationOut;
11
- const easeIn = props?.easeIn;
12
- const easeOut = props?.easeOut;
13
-
14
- return {
15
- // IN
16
- inX: {
17
- initial: { scaleX: 0, opacity: 0 },
18
- animate: { scaleX: 1, opacity: 1, transition: varTranEnter({ durationIn, easeIn }) },
19
- exit: { scaleX: 0, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
20
- },
21
- inY: {
22
- initial: { scaleY: 0, opacity: 0 },
23
- animate: { scaleY: 1, opacity: 1, transition: varTranEnter({ durationIn, easeIn }) },
24
- exit: { scaleY: 0, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
25
- },
26
-
27
- // OUT
28
- outX: {
29
- initial: { scaleX: 1, opacity: 1 },
30
- animate: { scaleX: 0, opacity: 0, transition: varTranEnter({ durationIn, easeIn }) },
31
- },
32
- outY: {
33
- initial: { scaleY: 1, opacity: 1 },
34
- animate: { scaleY: 0, opacity: 0, transition: varTranEnter({ durationIn, easeIn }) },
35
- },
36
- };
37
- };
package/src/components/animate/variants/slide.ts DELETED
@@ -1,60 +0,0 @@
1
- // @types
2
- import { VariantsType } from '@utils/types/animate';
3
- //
4
- import { varTranEnter, varTranExit } from './transition';
5
-
6
- // ----------------------------------------------------------------------
7
-
8
- export const varSlide = (props?: VariantsType) => {
9
- const distance = props?.distance || 160;
10
- const durationIn = props?.durationIn;
11
- const durationOut = props?.durationOut;
12
- const easeIn = props?.easeIn;
13
- const easeOut = props?.easeOut;
14
-
15
- return {
16
- // IN
17
- inUp: {
18
- initial: { y: distance },
19
- animate: { y: 0, transition: varTranEnter({ durationIn, easeIn }) },
20
- exit: { y: distance, transition: varTranExit({ durationOut, easeOut }) },
21
- },
22
- inDown: {
23
- initial: { y: -distance },
24
- animate: { y: 0, transition: varTranEnter({ durationIn, easeIn }) },
25
- exit: { y: -distance, transition: varTranExit({ durationOut, easeOut }) },
26
- },
27
- inLeft: {
28
- initial: { x: -distance },
29
- animate: { x: 0, transition: varTranEnter({ durationIn, easeIn }) },
30
- exit: { x: -distance, transition: varTranExit({ durationOut, easeOut }) },
31
- },
32
- inRight: {
33
- initial: { x: distance },
34
- animate: { x: 0, transition: varTranEnter({ durationIn, easeIn }) },
35
- exit: { x: distance, transition: varTranExit({ durationOut, easeOut }) },
36
- },
37
-
38
- // OUT
39
- outUp: {
40
- initial: { y: 0 },
41
- animate: { y: -distance, transition: varTranEnter({ durationIn, easeIn }) },
42
- exit: { y: 0, transition: varTranExit({ durationOut, easeOut }) },
43
- },
44
- outDown: {
45
- initial: { y: 0 },
46
- animate: { y: distance, transition: varTranEnter({ durationIn, easeIn }) },
47
- exit: { y: 0, transition: varTranExit({ durationOut, easeOut }) },
48
- },
49
- outLeft: {
50
- initial: { x: 0 },
51
- animate: { x: -distance, transition: varTranEnter({ durationIn, easeIn }) },
52
- exit: { x: 0, transition: varTranExit({ durationOut, easeOut }) },
53
- },
54
- outRight: {
55
- initial: { x: 0 },
56
- animate: { x: distance, transition: varTranEnter({ durationIn, easeIn }) },
57
- exit: { x: 0, transition: varTranExit({ durationOut, easeOut }) },
58
- },
59
- };
60
- };
package/src/components/animate/variants/zoom.ts DELETED
@@ -1,129 +0,0 @@
1
- // @types
2
- import { VariantsType } from '@utils/types/animate';
3
- //
4
- import { varTranEnter, varTranExit } from './transition';
5
-
6
- // ----------------------------------------------------------------------
7
-
8
- export const varZoom = (props?: VariantsType) => {
9
- const distance = props?.distance || 720;
10
- const durationIn = props?.durationIn;
11
- const durationOut = props?.durationOut;
12
- const easeIn = props?.easeIn;
13
- const easeOut = props?.easeOut;
14
-
15
- return {
16
- // IN
17
- in: {
18
- initial: { scale: 0, opacity: 0 },
19
- animate: { scale: 1, opacity: 1, transition: varTranEnter({ durationIn, easeIn }) },
20
- exit: { scale: 0, opacity: 0, transition: varTranExit({ durationOut, easeOut }) },
21
- },
22
- inUp: {
23
- initial: { scale: 0, opacity: 0, translateY: distance },
24
- animate: {
25
- scale: 1,
26
- opacity: 1,
27
- translateY: 0,
28
- transition: varTranEnter({ durationIn, easeIn }),
29
- },
30
- exit: {
31
- scale: 0,
32
- opacity: 0,
33
- translateY: distance,
34
- transition: varTranExit({ durationOut, easeOut }),
35
- },
36
- },
37
- inDown: {
38
- initial: {
39
- scale: 0,
40
- opacity: 0,
41
- translateY: -distance,
42
- },
43
- animate: {
44
- scale: 1,
45
- opacity: 1,
46
- translateY: 0,
47
- transition: varTranEnter({ durationIn, easeIn }),
48
- },
49
- exit: {
50
- scale: 0,
51
- opacity: 0,
52
- translateY: -distance,
53
- transition: varTranExit({ durationOut, easeOut }),
54
- },
55
- },
56
- inLeft: {
57
- initial: { scale: 0, opacity: 0, translateX: -distance },
58
- animate: {
59
- scale: 1,
60
- opacity: 1,
61
- translateX: 0,
62
- transition: varTranEnter({ durationIn, easeIn }),
63
- },
64
- exit: {
65
- scale: 0,
66
- opacity: 0,
67
- translateX: -distance,
68
- transition: varTranExit({ durationOut, easeOut }),
69
- },
70
- },
71
- inRight: {
72
- initial: { scale: 0, opacity: 0, translateX: distance },
73
- animate: {
74
- scale: 1,
75
- opacity: 1,
76
- translateX: 0,
77
- transition: varTranEnter({ durationIn, easeIn }),
78
- },
79
- exit: {
80
- scale: 0,
81
- opacity: 0,
82
- translateX: distance,
83
- transition: varTranExit({ durationOut, easeOut }),
84
- },
85
- },
86
-
87
- // OUT
88
- out: {
89
- initial: { scale: 1, opacity: 1 },
90
- animate: { scale: 0, opacity: 0, transition: varTranEnter({ durationIn, easeIn }) },
91
- },
92
- outUp: {
93
- initial: { scale: 1, opacity: 1 },
94
- animate: {
95
- scale: 0,
96
- opacity: 0,
97
- translateY: -distance,
98
- transition: varTranEnter({ durationIn, easeIn }),
99
- },
100
- },
101
- outDown: {
102
- initial: { scale: 1, opacity: 1 },
103
- animate: {
104
- scale: 0,
105
- opacity: 0,
106
- translateY: distance,
107
- transition: varTranEnter({ durationIn, easeIn }),
108
- },
109
- },
110
- outLeft: {
111
- initial: { scale: 1, opacity: 1 },
112
- animate: {
113
- scale: 0,
114
- opacity: 0,
115
- translateX: -distance,
116
- transition: varTranEnter({ durationIn, easeIn }),
117
- },
118
- },
119
- outRight: {
120
- initial: { scale: 1, opacity: 1 },
121
- animate: {
122
- scale: 0,
123
- opacity: 0,
124
- translateX: distance,
125
- transition: varTranEnter({ durationIn, easeIn }),
126
- },
127
- },
128
- };
129
- };