react-ui-animate 4.1.2 → 4.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +55 -43
- package/dist/animation/AnimationConfig.d.ts +63 -0
- package/dist/animation/controllers.d.ts +30 -0
- package/dist/animation/hooks/index.d.ts +0 -1
- package/dist/animation/hooks/useMount.d.ts +8 -13
- package/dist/animation/hooks/useValue.d.ts +6 -16
- package/dist/animation/index.d.ts +5 -5
- package/dist/animation/interpolation/index.d.ts +1 -1
- package/dist/animation/modules/MountedBlock.d.ts +5 -14
- package/dist/animation/modules/ScrollableBlock.d.ts +4 -15
- package/dist/animation/modules/index.d.ts +0 -1
- package/dist/animation/types.d.ts +25 -0
- package/dist/index.d.ts +6 -6
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +6 -6
- package/dist/animation/controllers/index.d.ts +0 -8
- package/dist/animation/controllers/withConfig.d.ts +0 -5
- package/dist/animation/controllers/withDecay.d.ts +0 -7
- package/dist/animation/controllers/withDelay.d.ts +0 -6
- package/dist/animation/controllers/withEase.d.ts +0 -6
- package/dist/animation/controllers/withLoop.d.ts +0 -2
- package/dist/animation/controllers/withSequence.d.ts +0 -2
- package/dist/animation/controllers/withSpring.d.ts +0 -7
- package/dist/animation/controllers/withTiming.d.ts +0 -7
- package/dist/animation/core/FluidArrayController.d.ts +0 -7
- package/dist/animation/core/FluidController.d.ts +0 -34
- package/dist/animation/core/useFluidValue.d.ts +0 -3
- package/dist/animation/core/useFluidValues.d.ts +0 -3
- package/dist/animation/core/useMount.d.ts +0 -18
- package/dist/animation/helpers/animationType.d.ts +0 -59
- package/dist/animation/helpers/getToValue.d.ts +0 -2
- package/dist/animation/helpers/index.d.ts +0 -3
- package/dist/animation/helpers/isDefined.d.ts +0 -1
- package/dist/animation/hooks/useValues.d.ts +0 -8
- package/dist/animation/interpolation/interpolate.d.ts +0 -11
- package/dist/animation/modules/TransitionBlock.d.ts +0 -18
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
|
|
7
7
|
### Install
|
|
8
8
|
|
|
9
|
-
You can install react-ui-animate via npm or yarn
|
|
9
|
+
You can install react-ui-animate via `npm` or `yarn`:
|
|
10
10
|
|
|
11
11
|
```sh
|
|
12
12
|
npm i react-ui-animate
|
|
@@ -24,15 +24,13 @@ The `react-ui-animate` library provides a straightforward way to add animations
|
|
|
24
24
|
import { animate, useValue } from 'react-ui-animate';
|
|
25
25
|
|
|
26
26
|
export default function () {
|
|
27
|
-
|
|
28
|
-
const opacity = useValue(0);
|
|
27
|
+
const opacity = useValue(0); // Initialize
|
|
29
28
|
|
|
30
29
|
return (
|
|
31
|
-
|
|
32
|
-
{/* animate.div component uses the animated opacity value */}
|
|
30
|
+
<>
|
|
33
31
|
<animate.div
|
|
34
32
|
style={{
|
|
35
|
-
opacity: opacity.value, //
|
|
33
|
+
opacity: opacity.value, // Apply
|
|
36
34
|
width: 100,
|
|
37
35
|
padding: 20,
|
|
38
36
|
background: '#39F',
|
|
@@ -40,39 +38,40 @@ export default function () {
|
|
|
40
38
|
>
|
|
41
39
|
ANIMATED
|
|
42
40
|
</animate.div>
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
41
|
+
|
|
42
|
+
<button
|
|
43
|
+
onClick={() => {
|
|
44
|
+
opacity.value = 1 // Update
|
|
45
|
+
}}
|
|
46
|
+
>
|
|
47
|
+
Animate Me
|
|
48
|
+
</button>
|
|
49
|
+
</>
|
|
47
50
|
);
|
|
48
51
|
}
|
|
49
52
|
```
|
|
50
53
|
|
|
51
|
-
In this example, clicking the
|
|
54
|
+
In this example, clicking the `Animate Me` button changes the opacity from 0 to 1.
|
|
55
|
+
|
|
56
|
+
---
|
|
52
57
|
|
|
53
|
-
###
|
|
58
|
+
### Implementation Steps
|
|
54
59
|
|
|
55
|
-
####
|
|
60
|
+
#### 1. Initialize
|
|
56
61
|
|
|
57
62
|
The `useValue()` hook is central to creating animations. It initializes an animated value and allows you to seamlessly update it to create dynamic effects.
|
|
58
63
|
|
|
59
64
|
```javascript
|
|
60
|
-
const opacity = useValue(0); //
|
|
61
|
-
|
|
62
|
-
// Use in style
|
|
63
|
-
style={{
|
|
64
|
-
opacity: opacity.value, // Access the animated opacity value
|
|
65
|
-
}}
|
|
66
|
-
|
|
67
|
-
// Update the value on user interaction
|
|
68
|
-
onClick={() => (opacity.value = 1)} // Changes the opacity to 1
|
|
65
|
+
const opacity = useValue(0); // Initialize a animation value 0
|
|
69
66
|
```
|
|
70
67
|
|
|
71
|
-
####
|
|
68
|
+
#### 2. Apply
|
|
72
69
|
|
|
73
70
|
`animate.div` is a special component designed to work with `useValue()`. It simplifies animating elements by directly using animated values.
|
|
74
71
|
|
|
75
|
-
```
|
|
72
|
+
```jsx
|
|
73
|
+
import { useValue, animate } from 'react-ui-animate'
|
|
74
|
+
|
|
76
75
|
const width = useValue(100); // Start with a width of 100
|
|
77
76
|
|
|
78
77
|
<animate.div
|
|
@@ -84,6 +83,29 @@ const width = useValue(100); // Start with a width of 100
|
|
|
84
83
|
/>;
|
|
85
84
|
```
|
|
86
85
|
|
|
86
|
+
#### 3. Update
|
|
87
|
+
|
|
88
|
+
To update the value simply assign the initialized animated node with a value.
|
|
89
|
+
|
|
90
|
+
```jsx
|
|
91
|
+
import { useValue, withSpring } from 'react-ui-animate';
|
|
92
|
+
|
|
93
|
+
const width = useValue(100);
|
|
94
|
+
|
|
95
|
+
<button
|
|
96
|
+
onClick={() => {
|
|
97
|
+
// Update
|
|
98
|
+
width.value = withSpring(400);
|
|
99
|
+
}}
|
|
100
|
+
>
|
|
101
|
+
Update
|
|
102
|
+
</button>
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
In this example, `withSpring` runs spring animation when updating the value.
|
|
106
|
+
|
|
107
|
+
---
|
|
108
|
+
|
|
87
109
|
#### `interpolate`
|
|
88
110
|
|
|
89
111
|
The `interpolate()` function is useful for mapping values from one range to another, enabling more complex animations.
|
|
@@ -91,7 +113,7 @@ The `interpolate()` function is useful for mapping values from one range to anot
|
|
|
91
113
|
```javascript
|
|
92
114
|
import { useValue, animate, interpolate } from 'react-ui-animate';
|
|
93
115
|
|
|
94
|
-
const width = useValue(100);
|
|
116
|
+
const width = useValue(100);
|
|
95
117
|
|
|
96
118
|
<animate.div
|
|
97
119
|
style={{
|
|
@@ -104,7 +126,7 @@ const width = useValue(100); // Start with a width of 100
|
|
|
104
126
|
|
|
105
127
|
In this example, as the width changes from 100 to 200, the background color smoothly transitions from red to blue.
|
|
106
128
|
|
|
107
|
-
####
|
|
129
|
+
#### Modifiers
|
|
108
130
|
|
|
109
131
|
You can dynamically modify animation configurations by assigning values to an animated value using various animation functions.
|
|
110
132
|
|
|
@@ -123,17 +145,9 @@ x.value = withTiming(10, { duration: 5000 });
|
|
|
123
145
|
To create sequential transitions using the `withSequence` function with dynamic modifiers like `withSpring` and `withTiming`:
|
|
124
146
|
|
|
125
147
|
```jsx
|
|
126
|
-
x.value = withSequence([withSpring(50), withTiming(100), 200]);
|
|
148
|
+
x.value = withSequence([withSpring(50), withTiming(100), withEase(200)]);
|
|
127
149
|
```
|
|
128
150
|
|
|
129
|
-
To delay an animation using the withDelay function:
|
|
130
|
-
|
|
131
|
-
```jsx
|
|
132
|
-
x.value = withDelay(1000, withSpring(100));
|
|
133
|
-
```
|
|
134
|
-
|
|
135
|
-
In this example, a spring animation to `100` will be applied after a 1-second delay.
|
|
136
|
-
|
|
137
151
|
#### `useMount()`
|
|
138
152
|
|
|
139
153
|
The `useMount()` hook facilitates managing the mounting and unmounting of a component with animations.
|
|
@@ -144,11 +158,7 @@ import { useMount } from 'react-ui-animate';
|
|
|
144
158
|
export default function App() {
|
|
145
159
|
const [visible, setVisible] = useState(false);
|
|
146
160
|
|
|
147
|
-
const open = useMount(visible
|
|
148
|
-
from: 0,
|
|
149
|
-
enter: 1,
|
|
150
|
-
exit: 0,
|
|
151
|
-
});
|
|
161
|
+
const open = useMount(visible);
|
|
152
162
|
|
|
153
163
|
return open((animation, mounted) => mounted && <animate.div />);
|
|
154
164
|
}
|
|
@@ -160,6 +170,8 @@ In this example,
|
|
|
160
170
|
2. The `useMount` hook takes `visible` as an argument and provides animation states for mounting and unmounting.
|
|
161
171
|
3. The `open` function, returned by `useMount`, is used to conditionally render `animate.div` based on the `mounted` boolean and apply the transition animation.
|
|
162
172
|
|
|
173
|
+
---
|
|
174
|
+
|
|
163
175
|
### Gestures
|
|
164
176
|
|
|
165
177
|
The `react-ui-animate` library also provides several hooks for handling different types of gestures:
|
|
@@ -175,13 +187,13 @@ The `react-ui-animate` library also provides several hooks for handling differen
|
|
|
175
187
|
Here’s an example of using the useDrag hook to enable drag gestures:
|
|
176
188
|
|
|
177
189
|
```jsx
|
|
178
|
-
import { useValue, animate, useDrag } from 'react-ui-animate';
|
|
190
|
+
import { useValue, animate, useDrag, withSpring } from 'react-ui-animate';
|
|
179
191
|
|
|
180
192
|
export const Draggable = () => {
|
|
181
193
|
const translateX = useValue(0);
|
|
182
194
|
|
|
183
195
|
const bind = useDrag(function ({ down, movementX }) {
|
|
184
|
-
translateX.value = down ? movementX : 0;
|
|
196
|
+
translateX.value = down ? movementX : withSpring(0);
|
|
185
197
|
});
|
|
186
198
|
|
|
187
199
|
return (
|
|
@@ -191,7 +203,7 @@ export const Draggable = () => {
|
|
|
191
203
|
width: 100,
|
|
192
204
|
height: 100,
|
|
193
205
|
backgroundColor: '#3399ff',
|
|
194
|
-
translateX: translateX.value,
|
|
206
|
+
translateX: translateX.value,
|
|
195
207
|
}}
|
|
196
208
|
/>
|
|
197
209
|
);
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { Easing } from '@raidipesh78/re-motion';
|
|
2
|
+
export declare const AnimationConfig: {
|
|
3
|
+
Timing: {
|
|
4
|
+
BOUNCE: {
|
|
5
|
+
duration: number;
|
|
6
|
+
easing: typeof Easing.bounce;
|
|
7
|
+
};
|
|
8
|
+
EASE_IN: {
|
|
9
|
+
duration: number;
|
|
10
|
+
easing: (t: number) => number;
|
|
11
|
+
};
|
|
12
|
+
EASE_OUT: {
|
|
13
|
+
duration: number;
|
|
14
|
+
easing: (t: number) => number;
|
|
15
|
+
};
|
|
16
|
+
EASE_IN_OUT: {
|
|
17
|
+
duration: number;
|
|
18
|
+
easing: (t: number) => number;
|
|
19
|
+
};
|
|
20
|
+
POWER1: {
|
|
21
|
+
duration: number;
|
|
22
|
+
easing: (t: number) => number;
|
|
23
|
+
};
|
|
24
|
+
POWER2: {
|
|
25
|
+
duration: number;
|
|
26
|
+
easing: (t: number) => number;
|
|
27
|
+
};
|
|
28
|
+
POWER3: {
|
|
29
|
+
duration: number;
|
|
30
|
+
easing: (t: number) => number;
|
|
31
|
+
};
|
|
32
|
+
POWER4: {
|
|
33
|
+
duration: number;
|
|
34
|
+
easing: (t: number) => number;
|
|
35
|
+
};
|
|
36
|
+
LINEAR: {
|
|
37
|
+
duration: number;
|
|
38
|
+
easing: typeof Easing.linear;
|
|
39
|
+
};
|
|
40
|
+
};
|
|
41
|
+
Spring: {
|
|
42
|
+
ELASTIC: {
|
|
43
|
+
mass: number;
|
|
44
|
+
friction: number;
|
|
45
|
+
tension: number;
|
|
46
|
+
};
|
|
47
|
+
EASE: {
|
|
48
|
+
mass: number;
|
|
49
|
+
friction: number;
|
|
50
|
+
tension: number;
|
|
51
|
+
};
|
|
52
|
+
STIFF: {
|
|
53
|
+
mass: number;
|
|
54
|
+
friction: number;
|
|
55
|
+
tension: number;
|
|
56
|
+
};
|
|
57
|
+
WOBBLE: {
|
|
58
|
+
mass: number;
|
|
59
|
+
friction: number;
|
|
60
|
+
tension: number;
|
|
61
|
+
};
|
|
62
|
+
};
|
|
63
|
+
};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { DriverConfig } from './types';
|
|
2
|
+
interface WithSpringOptions {
|
|
3
|
+
mass?: number;
|
|
4
|
+
tension?: number;
|
|
5
|
+
friction?: number;
|
|
6
|
+
onStart?: () => void;
|
|
7
|
+
onChange?: (v: number | string) => void;
|
|
8
|
+
onRest?: () => void;
|
|
9
|
+
}
|
|
10
|
+
export declare const withSpring: (to: number, options?: WithSpringOptions) => DriverConfig;
|
|
11
|
+
export declare const withEase: (to: number, options?: WithSpringOptions) => DriverConfig;
|
|
12
|
+
interface WithTimingOptions {
|
|
13
|
+
duration?: number;
|
|
14
|
+
easing?: (t: number) => number;
|
|
15
|
+
onStart?: () => void;
|
|
16
|
+
onChange?: (v: number | string) => void;
|
|
17
|
+
onRest?: () => void;
|
|
18
|
+
}
|
|
19
|
+
export declare const withTiming: (to: number, options?: WithTimingOptions) => DriverConfig;
|
|
20
|
+
interface WithDecayOptions {
|
|
21
|
+
velocity: number;
|
|
22
|
+
onStart?: () => void;
|
|
23
|
+
onChange?: (v: number | string) => void;
|
|
24
|
+
onRest?: () => void;
|
|
25
|
+
}
|
|
26
|
+
export declare const withDecay: (options: WithDecayOptions) => DriverConfig;
|
|
27
|
+
export declare const withSequence: (steps: DriverConfig[]) => DriverConfig;
|
|
28
|
+
export declare const withDelay: (delay: number) => DriverConfig;
|
|
29
|
+
export declare const withLoop: (controller: DriverConfig, iterations: number) => DriverConfig;
|
|
30
|
+
export {};
|
|
@@ -1,15 +1,10 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
export interface UseMountConfig
|
|
1
|
+
import { MotionValue } from '@raidipesh78/re-motion';
|
|
2
|
+
import { DriverConfig } from '../types';
|
|
3
|
+
export interface UseMountConfig {
|
|
4
|
+
from?: number;
|
|
5
|
+
enter?: DriverConfig;
|
|
6
|
+
exit?: DriverConfig;
|
|
4
7
|
}
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
* passed as an argument (`state`) and exposes the shadow state which handles the mount and unmount
|
|
8
|
-
* of a component.
|
|
9
|
-
*
|
|
10
|
-
* @param { boolean } state - Boolean indicating the component should mount or unmount.
|
|
11
|
-
* @param { UseMountConfig } config - Animation configuration.
|
|
12
|
-
*/
|
|
13
|
-
export declare function useMount(state: boolean, config: UseMountConfig): (cb: (value: {
|
|
14
|
-
value: FluidValue;
|
|
8
|
+
export declare const useMount: (state: boolean, config?: UseMountConfig) => (fn: (animation: {
|
|
9
|
+
value: MotionValue;
|
|
15
10
|
}, mounted: boolean) => React.ReactNode) => import("react").ReactNode;
|
|
@@ -1,17 +1,7 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
export
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
* initialized when passed to argument (`initialValue`). The returned value persist until the lifetime of
|
|
8
|
-
* a component. It doesn't cast any re-renders which can is very good for performance optimization.
|
|
9
|
-
*
|
|
10
|
-
* @param { number } initialValue - Initial value
|
|
11
|
-
* @param { UseValueConfig } config - Animation configuration object.
|
|
12
|
-
*/
|
|
13
|
-
export declare function useValue<T extends number | string>(initialValue: T, config?: UseValueConfig): {
|
|
14
|
-
get value(): FluidValue;
|
|
15
|
-
set value(to: number | string | UpdateValue | number[] | UpdateValue[]);
|
|
16
|
-
readonly currentValue: string | number;
|
|
1
|
+
import { MotionValue } from '@raidipesh78/re-motion';
|
|
2
|
+
import { ToValue } from '../types';
|
|
3
|
+
export declare function useValue<V extends number | string>(initialValue: V): {
|
|
4
|
+
get value(): MotionValue<V>;
|
|
5
|
+
set value(u: MotionValue<V> | ToValue<V>);
|
|
6
|
+
readonly currentValue: V;
|
|
17
7
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export {
|
|
3
|
-
export {
|
|
4
|
-
export {
|
|
5
|
-
export {
|
|
1
|
+
export { MountedBlock, ScrollableBlock } from './modules';
|
|
2
|
+
export { useValue, useMount, type UseMountConfig } from './hooks';
|
|
3
|
+
export { withSpring, withTiming, withSequence, withDelay, withDecay, withLoop, withEase, } from './controllers';
|
|
4
|
+
export { AnimationConfig } from './AnimationConfig';
|
|
5
|
+
export { interpolateNumbers } from './interpolation';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { interpolateNumbers } from './interpolateNumbers';
|
|
@@ -1,20 +1,11 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { MotionValue } from '@raidipesh78/re-motion';
|
|
2
3
|
import { type UseMountConfig } from '../hooks';
|
|
3
|
-
import { FluidValue } from '@raidipesh78/re-motion';
|
|
4
4
|
interface MountedBlockProps extends Partial<UseMountConfig> {
|
|
5
5
|
state: boolean;
|
|
6
6
|
children: (animation: {
|
|
7
|
-
value:
|
|
8
|
-
}) =>
|
|
7
|
+
value: MotionValue;
|
|
8
|
+
}) => ReactNode;
|
|
9
9
|
}
|
|
10
|
-
|
|
11
|
-
* MountedBlock - Higher order component which handles mounting and unmounting of a component.
|
|
12
|
-
* @param { boolean } state - Boolean indicating the component should mount or unmount.
|
|
13
|
-
* @param { function } children - Child as a function with `AnimatedValue` on `.value` property.
|
|
14
|
-
* @param { number } } from - Number that dictates the beginning state for animation.
|
|
15
|
-
* @param { number } enter - Number that dictates the entry state for animation.
|
|
16
|
-
* @param { number } exit - Number that dictates the exit state for animation.
|
|
17
|
-
* @param { UseValueConfig } config - Animation configuration for overall animation.
|
|
18
|
-
*/
|
|
19
|
-
export declare const MountedBlock: ({ state, children, from, enter, exit, config, }: MountedBlockProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const MountedBlock: ({ state, children, from, enter, exit, }: MountedBlockProps) => import("react/jsx-runtime").JSX.Element;
|
|
20
11
|
export {};
|
|
@@ -1,22 +1,11 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import { type UseValueConfig } from '../hooks';
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { MotionValue } from '@raidipesh78/re-motion';
|
|
4
3
|
interface ScrollableBlockProps {
|
|
5
4
|
children?: (animation: {
|
|
6
|
-
value:
|
|
7
|
-
}) =>
|
|
5
|
+
value: MotionValue;
|
|
6
|
+
}) => ReactNode;
|
|
8
7
|
direction?: 'single' | 'both';
|
|
9
8
|
threshold?: number;
|
|
10
|
-
animationConfig?: UseValueConfig;
|
|
11
9
|
}
|
|
12
|
-
/**
|
|
13
|
-
* ScrollableBlock - Higher order component to handle the entrance or exit animation
|
|
14
|
-
* of a component when it enters or exit the viewport. Accepts child as a function with
|
|
15
|
-
* `AnimatedValue` as its first argument which can be interpolated on input range [0, 1]
|
|
16
|
-
* @prop { function } children - child as a function with `AnimatedValue` as its first argument.
|
|
17
|
-
* @prop { 'single' | 'both' } direction - single applies animation on enter once, both applies on enter and exit.
|
|
18
|
-
* @prop { number } threshold - should be in range 0 to 1 which equivalent to `IntersectionObserver` threshold.
|
|
19
|
-
* @prop { UseValueConfig } animationConfig - Animation config
|
|
20
|
-
*/
|
|
21
10
|
export declare const ScrollableBlock: (props: ScrollableBlockProps) => import("react/jsx-runtime").JSX.Element;
|
|
22
11
|
export {};
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
export interface WithCallbacks {
|
|
2
|
+
onStart?: (value: number | string) => void;
|
|
3
|
+
onChange?: (value: number | string) => void;
|
|
4
|
+
onRest?: (value: number | string) => void;
|
|
5
|
+
}
|
|
6
|
+
export type DriverConfig = {
|
|
7
|
+
type: 'spring' | 'timing' | 'decay' | 'sequence' | 'delay' | 'loop';
|
|
8
|
+
to?: number;
|
|
9
|
+
options?: {
|
|
10
|
+
controller?: DriverConfig;
|
|
11
|
+
iterations?: number;
|
|
12
|
+
delay?: number;
|
|
13
|
+
duration?: number;
|
|
14
|
+
easing?: (t: number) => number;
|
|
15
|
+
stiffness?: number;
|
|
16
|
+
damping?: number;
|
|
17
|
+
mass?: number;
|
|
18
|
+
velocity?: number;
|
|
19
|
+
steps?: DriverConfig[];
|
|
20
|
+
onStart?: () => void;
|
|
21
|
+
onChange?: (v: string | number) => void;
|
|
22
|
+
onComplete?: () => void;
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
export type ToValue<V> = DriverConfig | V;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
export { Easing,
|
|
2
|
-
export { AnimationConfig, MountedBlock, ScrollableBlock
|
|
3
|
-
export {
|
|
4
|
-
export {
|
|
5
|
-
export { withSpring, withTiming, withSequence, withDelay, withEase, withConfig, withDecay, withLoop, } from './animation';
|
|
1
|
+
export { Easing, makeMotion as makeAnimated, motion as animate, } from '@raidipesh78/re-motion';
|
|
2
|
+
export { AnimationConfig, MountedBlock, ScrollableBlock } from './animation';
|
|
3
|
+
export { useValue, useMount } from './animation';
|
|
4
|
+
export { withSpring, withTiming, withSequence, withDelay, withDecay, withLoop, withEase, } from './animation';
|
|
6
5
|
export { useMeasure, useOutsideClick, useWindowDimension } from './hooks';
|
|
6
|
+
export { interpolateNumbers } from './animation';
|
|
7
7
|
export { useDrag, useGesture, useMouseMove, useScroll, useWheel, } from './gestures/hooks';
|
|
8
8
|
export { bin, clamp, mix, rubberClamp, move, snapTo } from './gestures/helpers';
|
|
9
|
-
export type {
|
|
9
|
+
export type { UseMountConfig } from './animation';
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e=require("@raidipesh78/re-motion"),t=require("react/jsx-runtime"),n=require("react");function i(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,i.get?i:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var r=i(n),o=function(e,t){return o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])},o(e,t)};function f(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}var a=function(){return a=Object.assign||function(e){for(var t,n=1,i=arguments.length;n<i;n++)for(var r in t=arguments[n])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e},a.apply(this,arguments)};function u(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],i=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&i>=e.length&&(e=void 0),{value:e&&e[i++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function s(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var i,r,o=n.call(e),f=[];try{for(;(void 0===t||t-- >0)&&!(i=o.next()).done;)f.push(i.value)}catch(e){r={error:e}}finally{try{i&&!i.done&&(n=o.return)&&n.call(o)}finally{if(r)throw r.error}}return f}function l(e,t,n){if(n||2===arguments.length)for(var i,r=0,o=t.length;r<o;r++)!i&&r in t||(i||(i=Array.prototype.slice.call(t,0,r)),i[r]=t[r]);return e.concat(i||Array.prototype.slice.call(t))}"function"==typeof SuppressedError&&SuppressedError;var c=/[+-]?\d+(\.\d+)?|[\s]?\.\d+|#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})/gi,h=/#[a-f\d]{3,}|transparent|aliceblue|antiquewhite|aqua|aquamarine|azure|beige|bisque|black|blanchedalmond|blue|blueviolet|brown|burlywood|burntsienna|cadetblue|chartreuse|chocolate|coral|cornflowerblue|cornsilk|crimson|cyan|darkblue|darkcyan|darkgoldenrod|darkgray|darkgreen|darkgrey|darkkhaki|darkmagenta|darkolivegreen|darkorange|darkorchid|darkred|darksalmon|darkseagreen|darkslateblue|darkslategray|darkslategrey|darkturquoise|darkviolet|deeppink|deepskyblue|dimgray|dimgrey|dodgerblue|firebrick|floralwhite|forestgreen|fuchsia|gainsboro|ghostwhite|gold|goldenrod|gray|green|greenyellow|grey|honeydew|hotpink|indianred|indigo|ivory|khaki|lavender|lavenderblush|lawngreen|lemonchiffon|lightblue|lightcoral|lightcyan|lightgoldenrodyellow|lightgray|lightgreen|lightgrey|lightpink|lightsalmon|lightseagreen|lightskyblue|lightslategray|lightslategrey|lightsteelblue|lightyellow|lime|limegreen|linen|magenta|maroon|mediumaquamarine|mediumblue|mediumorchid|mediumpurple|mediumseagreen|mediumslateblue|mediumspringgreen|mediumturquoise|mediumvioletred|midnightblue|mintcream|mistyrose|moccasin|navajowhite|navy|oldlace|olive|olivedrab|orange|orangered|orchid|palegoldenrod|palegreen|paleturquoise|palevioletred|papayawhip|peachpuff|peru|pink|plum|powderblue|purple|rebeccapurple|red|rosybrown|royalblue|saddlebrown|salmon|sandybrown|seagreen|seashell|sienna|silver|skyblue|slateblue|slategray|slategrey|snow|springgreen|steelblue|tan|teal|thistle|tomato|turquoise|violet|wheat|white|whitesmoke|yellow|yellowgreen/gi,d={transparent:"#00000000",aliceblue:"#f0f8ffff",antiquewhite:"#faebd7ff",aqua:"#00ffffff",aquamarine:"#7fffd4ff",azure:"#f0ffffff",beige:"#f5f5dcff",bisque:"#ffe4c4ff",black:"#000000ff",blanchedalmond:"#ffebcdff",blue:"#0000ffff",blueviolet:"#8a2be2ff",brown:"#a52a2aff",burlywood:"#deb887ff",burntsienna:"#ea7e5dff",cadetblue:"#5f9ea0ff",chartreuse:"#7fff00ff",chocolate:"#d2691eff",coral:"#ff7f50ff",cornflowerblue:"#6495edff",cornsilk:"#fff8dcff",crimson:"#dc143cff",cyan:"#00ffffff",darkblue:"#00008bff",darkcyan:"#008b8bff",darkgoldenrod:"#b8860bff",darkgray:"#a9a9a9ff",darkgreen:"#006400ff",darkgrey:"#a9a9a9ff",darkkhaki:"#bdb76bff",darkmagenta:"#8b008bff",darkolivegreen:"#556b2fff",darkorange:"#ff8c00ff",darkorchid:"#9932ccff",darkred:"#8b0000ff",darksalmon:"#e9967aff",darkseagreen:"#8fbc8fff",darkslateblue:"#483d8bff",darkslategray:"#2f4f4fff",darkslategrey:"#2f4f4fff",darkturquoise:"#00ced1ff",darkviolet:"#9400d3ff",deeppink:"#ff1493ff",deepskyblue:"#00bfffff",dimgray:"#696969ff",dimgrey:"#696969ff",dodgerblue:"#1e90ffff",firebrick:"#b22222ff",floralwhite:"#fffaf0ff",forestgreen:"#228b22ff",fuchsia:"#ff00ffff",gainsboro:"#dcdcdcff",ghostwhite:"#f8f8ffff",gold:"#ffd700ff",goldenrod:"#daa520ff",gray:"#808080ff",green:"#008000ff",greenyellow:"#adff2fff",grey:"#808080ff",honeydew:"#f0fff0ff",hotpink:"#ff69b4ff",indianred:"#cd5c5cff",indigo:"#4b0082ff",ivory:"#fffff0ff",khaki:"#f0e68cff",lavender:"#e6e6faff",lavenderblush:"#fff0f5ff",lawngreen:"#7cfc00ff",lemonchiffon:"#fffacdff",lightblue:"#add8e6ff",lightcoral:"#f08080ff",lightcyan:"#e0ffffff",lightgoldenrodyellow:"#fafad2ff",lightgray:"#d3d3d3ff",lightgreen:"#90ee90ff",lightgrey:"#d3d3d3ff",lightpink:"#ffb6c1ff",lightsalmon:"#ffa07aff",lightseagreen:"#20b2aaff",lightskyblue:"#87cefaff",lightslategray:"#778899ff",lightslategrey:"#778899ff",lightsteelblue:"#b0c4deff",lightyellow:"#ffffe0ff",lime:"#00ff00ff",limegreen:"#32cd32ff",linen:"#faf0e6ff",magenta:"#ff00ffff",maroon:"#800000ff",mediumaquamarine:"#66cdaaff",mediumblue:"#0000cdff",mediumorchid:"#ba55d3ff",mediumpurple:"#9370dbff",mediumseagreen:"#3cb371ff",mediumslateblue:"#7b68eeff",mediumspringgreen:"#00fa9aff",mediumturquoise:"#48d1ccff",mediumvioletred:"#c71585ff",midnightblue:"#191970ff",mintcream:"#f5fffaff",mistyrose:"#ffe4e1ff",moccasin:"#ffe4b5ff",navajowhite:"#ffdeadff",navy:"#000080ff",oldlace:"#fdf5e6ff",olive:"#808000ff",olivedrab:"#6b8e23ff",orange:"#ffa500ff",orangered:"#ff4500ff",orchid:"#da70d6ff",palegoldenrod:"#eee8aaff",palegreen:"#98fb98ff",paleturquoise:"#afeeeeff",palevioletred:"#db7093ff",papayawhip:"#ffefd5ff",peachpuff:"#ffdab9ff",peru:"#cd853fff",pink:"#ffc0cbff",plum:"#dda0ddff",powderblue:"#b0e0e6ff",purple:"#800080ff",rebeccapurple:"#663399ff",red:"#ff0000ff",rosybrown:"#bc8f8fff",royalblue:"#4169e1ff",saddlebrown:"#8b4513ff",salmon:"#fa8072ff",sandybrown:"#f4a460ff",seagreen:"#2e8b57ff",seashell:"#fff5eeff",sienna:"#a0522dff",silver:"#c0c0c0ff",skyblue:"#87ceebff",slateblue:"#6a5acdff",slategray:"#708090ff",slategrey:"#708090ff",snow:"#fffafaff",springgreen:"#00ff7fff",steelblue:"#4682b4ff",tan:"#d2b48cff",teal:"#008080ff",thistle:"#d8bfd8ff",tomato:"#ff6347ff",turquoise:"#40e0d0ff",violet:"#ee82eeff",wheat:"#f5deb3ff",white:"#ffffffff",whitesmoke:"#f5f5f5ff",yellow:"#ffff00ff",yellowgreen:"#9acd32ff"};function v(e){var t=function(e){return e.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,(function(e,t,n,i){return"#"+t+t+n+n+i+i}))}(e),n=function(e){return 7===e.length?e+"FF":e}(t),i=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(n);return{r:parseInt(i[1],16),g:parseInt(i[2],16),b:parseInt(i[3],16),a:parseInt(i[4],16)/255}}function m(e){var t=e.r,n=e.g,i=e.b,r=e.a;return"#"+(256|t).toString(16).slice(1)+(256|n).toString(16).slice(1)+(256|i).toString(16).slice(1)+(255*r|256).toString(16).slice(1)}var p=function(e,t,n,i){var r=s(t,4),o=r[0],f=r[1],a=r[2],u=r[3],l=e;if(l<o){if("identity"===n)return l;"clamp"===n&&(l=o)}if(l>f){if("identity"===i)return l;"clamp"===i&&(l=f)}return a===u?a:o===f?e<=o?a:u:(o===-1/0?l=-l:f===1/0?l-=o:l=(l-o)/(f-o),a===-1/0?l=-l:u===1/0?l+=a:l=l*(u-a)+a,l)},g=function(e,t,n,i){var r=s(t,4),o=r[0],f=r[1],a=r[2],u=r[3];if(a.length===u.length)return a.map((function(t,r){return"string"==typeof t?function(e,t){var n=s(t,4),i=n[0],r=n[1],o=n[2],f=n[3],a=v(o),u=v(f);return m({r:p(e,[i,r,a.r,u.r],"clamp","clamp"),g:p(e,[i,r,a.g,u.g],"clamp","clamp"),b:p(e,[i,r,a.b,u.b],"clamp","clamp"),a:p(e,[i,r,a.a,u.a],"clamp","clamp")})}(e,[o,f,t,u[r]]):p(e,[o,f,t,u[r]],n,i)}));throw new Error("Array length doesn't match")},y=function(e){return e.replace(c,"$")},b=function(e){return e.match(c).map((function(e){return-1!==e.indexOf("#")?e:Number(e)}))},x=function(e){return e.replace(h,(function(e){if(-1!==e.indexOf("#"))return m(v(e));if(Object.prototype.hasOwnProperty.call(d,e))return d[e];throw new Error("String cannot be parsed!")}))};function w(e,t,n,i){var r,o,f=null==i?void 0:i.extrapolate,a=null==i?void 0:i.extrapolateLeft,l=null==i?void 0:i.extrapolateRight,c=function(e,t,n){var i=t.length,r=[];e<t[0]?r=[t[0],t[1],n[0],n[1]]:e>t[i-1]&&(r=[t[i-2],t[i-1],n[i-2],n[i-1]]);for(var o=1;o<i;++o)if(e<=t[o]){r=[t[o-1],t[o],n[o-1],n[o]];break}return r}(e,t,n),h="extend";void 0!==a?h=a:void 0!==f&&(h=f);var d,v="extend";if(void 0!==l?v=l:void 0!==f&&(v=f),n.length){if("number"==typeof n[0])return p(e,c,h,v);if(Array.isArray(n[0]))return g(e,c,h,v);var m=s(c,4),w=m[0],E=m[1],k=m[2],M=m[3],_=x(k),I=x(M),A=y(_);if(d=I,y(_).trim().replace(/\s/g,"")===y(d).trim().replace(/\s/g,"")){var O=b(_),T=b(I),S=g(e,[w,E,O,T],h,v);try{for(var C=u(S),L=C.next();!L.done;L=C.next()){var Y=L.value;A=A.replace("$",Y)}}catch(e){r={error:e}}finally{try{L&&!L.done&&(o=C.return)&&o.call(C)}finally{if(r)throw r.error}}return A}throw new Error("Output range doesn't match string format!")}throw new Error("Output range cannot be Empty")}var E=function(t,n,i,r){return t instanceof e.FluidValue?t.interpolate(n,i,r):w(t,n,i,r)},k=function(e){return null!=e};function M(e,t){return"number"==typeof e||"string"==typeof e?{toValue:e,config:t}:e}var _={ELASTIC:{mass:1,friction:18,tension:250},BOUNCE:{duration:500,easing:e.Easing.bounce},EASE:{mass:1,friction:26,tension:170},STIFF:{mass:1,friction:18,tension:350},WOOBLE:{mass:1,friction:8,tension:250},EASE_IN:{duration:500,easing:e.Easing.in(e.Easing.ease)},EASE_OUT:{duration:500,easing:e.Easing.out(e.Easing.ease)},EASE_IN_OUT:{duration:500,easing:e.Easing.inOut(e.Easing.ease)},POWER1:{duration:500,easing:e.Easing.bezier(.17,.42,.51,.97)},POWER2:{duration:500,easing:e.Easing.bezier(.07,.11,.13,1)},POWER3:{duration:500,easing:e.Easing.bezier(.09,.7,.16,1.04)},POWER4:{duration:500,easing:e.Easing.bezier(.05,.54,0,1.03)},LINEAR:{duration:500,easing:e.Easing.linear}},I=function(){function t(t,n){this.iterationsSoFar=0,this.fluid=new e.FluidValue(t),this.defaultConfig=n}return t.prototype.getAnimation=function(t,n){if("string"==typeof t.toValue)return e.native(this.fluid,{toValue:t.toValue});if(k(null==n?void 0:n.duration)||(null==n?void 0:n.immediate)){if(!k(t.toValue))throw new Error("No `toValue` is defined");var i={toValue:t.toValue,duration:(null==n?void 0:n.immediate)?0:null==n?void 0:n.duration,easing:null==n?void 0:n.easing};return e.timing(this.fluid,i)}if(null==n?void 0:n.decay){var r={velocity:null==n?void 0:n.velocity,deceleration:null==n?void 0:n.deceleration};return e.decay(this.fluid,r)}if(!k(t.toValue))throw new Error("No `toValue` is defined");var o={toValue:t.toValue,mass:null==n?void 0:n.mass,tension:null==n?void 0:n.tension,friction:null==n?void 0:n.friction,restDistance:null==n?void 0:n.restDistance};return e.spring(this.fluid,o)},t.prototype.runAnimation=function(t,n){var i,r,o=this,f=a(a({},this.defaultConfig),t.config),u=null!==(i=null==f?void 0:f.loop)&&void 0!==i?i:0,s=null!==(r=null==f?void 0:f.delay)&&void 0!==r?r:0;this.fluid.removeAllListeners(),(null==f?void 0:f.onStart)&&f.onStart(this.fluid.get()),(null==f?void 0:f.onChange)&&this.fluid.addListener((function(e){var t;return null===(t=null==f?void 0:f.onChange)||void 0===t?void 0:t.call(f,e)}));var l=e.sequence([e.delay(s),this.getAnimation(t,f)]),c=function(e){var t;e.finished&&(null===(t=null==f?void 0:f.onRest)||void 0===t||t.call(f,e.value),null==n||n(e.value))},h=function(e){e.finished&&(o.iterationsSoFar++,-1===u||o.iterationsSoFar<u?(l.reset(),l.start(h)):c(e))};l.start(k(null==f?void 0:f.loop)?h:c)},t.prototype.setFluid=function(e,t){var n=this;if(e)if(Array.isArray(e)){var i=0,r=function(o){++i!==e.length?n.runAnimation(e[i],r):t&&t(o)};this.runAnimation(e[i],r)}else this.runAnimation(e,t)},t.prototype.getFluid=function(){return this.fluid},t}(),A=function(e,t){var i=n.useRef(new I(e,t)).current,r=n.useCallback((function(e,t){i.setFluid(e,t)}),[]);return[n.useMemo((function(){return i.getFluid()}),[]),r]};function O(e,t){var i=n.useRef(!0),r=s(A(e,a(a({},_.EASE),t)),2),o=r[0],f=r[1],u=n.useCallback((function(e){Array.isArray(e)?queueMicrotask((function(){return f(e.map((function(e){return M(e)})))})):queueMicrotask((function(){return f(M(e))}))}),[]);return n.useLayoutEffect((function(){i.current||u(e),i.current=!1}),[e,t]),{set value(e){u(e)},get value(){return o},get currentValue(){return o.get()}}}var T=function(){function e(e,t){this.fluidControllers=e.map((function(e){return new I(e,t)}))}return e.prototype.setFluid=function(e,t){this.fluidControllers.map((function(n,i){n.setFluid(e[i],t)}))},e.prototype.getFluid=function(){return this.fluidControllers.map((function(e){return e.getFluid()}))},e}();function S(e,t){var i=function(e,t){var i=s(n.useState(!1),2),r=i[0],o=i[1],f=n.useRef(t).current,a=f.from,u=f.enter,l=f.exit,c=f.config,h=s(A(a,c),2),d=h[0],v=h[1];return n.useLayoutEffect((function(){e?(o(!0),queueMicrotask((function(){return v(Array.isArray(u)?u.map((function(e){return M(e,c)})):M(u,c))}))):v(Array.isArray(l)?l.map((function(e){return M(e,c)})):M(l,c),(function(){o(!1),d.getSubscriptions().forEach((function(e){return d.removeSubscription(e)}))}))}),[e]),function(e){return e(d,r)}}(e,t);return function(e){return i((function(t,n){return e({value:t},n)}))}}function C(e){return e?1:0}function L(e,t,n){return Math.min(Math.max(e,t),n)}function Y(e,t,n){return 0===t||Math.abs(t)===1/0?function(e,t){return Math.pow(e,5*t)}(e,n):e*t*n/(t+n*e)}var V=function(e,t){return{toValue:e,config:t}},R=function(e){return e.reduce((function(e,t){return Array.isArray(t)?e.push.apply(e,l([],s(R(t)),!1)):e.push(M(t)),e}),[])};function q(e,t){var n=new Map;return t.forEach((function(t){var i=s(t,3),r=i[0],o=i[1],f=i[2],a=void 0!==f&&f;n.set(r,function(e,t,n,i){return void 0===i&&(i=!1),e.forEach((function(e){e.addEventListener(t,n,i)})),function(){e.forEach((function(e){e.removeEventListener(t,n,i)}))}}(e,r,o,a))})),function(e){var t,i;try{for(var r=u(n.entries()),o=r.next();!o.done;o=r.next()){var f=s(o.value,2),a=f[0],l=f[1];if(!e)return void l();-1!==e.indexOf(a)&&l()}}catch(e){t={error:e}}finally{try{o&&!o.done&&(i=r.return)&&i.call(r)}finally{if(t)throw t.error}}}}var D=function(e,t){return{x:e,y:t}},X=function(){function e(){this.lastTimeStamp=Date.now(),this.isActive=!1,this.targetElements=[]}return e.prototype._initEvents=function(){},e.prototype._cancelEvents=function(){this._subscribe&&this._subscribe()},e.prototype.applyCallback=function(e){this.callback=e},e.prototype.applyGesture=function(e){var t=this,n=e.targetElement,i=e.targetElements,r=e.callback,o=e.config;return this.targetElement=n,this.targetElements=i.map((function(e){return e.current})),this.callback=r,this.config=o,this._initEvents(),function(){return t._subscribe&&t._subscribe()}},e._VELOCITY_LIMIT=20,e}(),F=function(e){function t(){var t=e.apply(this,l([],s(arguments),!1))||this;return t.movementStart=D(0,0),t.initialMovement=D(0,0),t.movement=D(0,0),t.previousMovement=D(0,0),t.translation=D(0,0),t.offset=D(0,0),t.velocity=D(0,0),t}return f(t,e),t.prototype._initEvents=function(){(this.targetElement||this.targetElements.length>0)&&(this._subscribe=q([window],[["mousedown",this.pointerDown.bind(this)],["mousemove",this.pointerMove.bind(this)],["mouseup",this.pointerUp.bind(this)],["touchstart",this.pointerDown.bind(this),{passive:!1}],["touchmove",this.pointerMove.bind(this),{passive:!1}],["touchend",this.pointerUp.bind(this)]]))},t.prototype._cancelEvents=function(){this._subscribe&&this._subscribe(["mousedown","mousemove","touchstart","touchmove"])},t.prototype._handleCallback=function(){var e=this;this.callback&&this.callback({args:[this.currentIndex],down:this.isActive,movementX:this.movement.x,movementY:this.movement.y,offsetX:this.translation.x,offsetY:this.translation.y,velocityX:this.velocity.x,velocityY:this.velocity.y,distanceX:Math.abs(this.movement.x),distanceY:Math.abs(this.movement.y),directionX:Math.sign(this.movement.x),directionY:Math.sign(this.movement.y),cancel:function(){e._cancelEvents()}})},t.prototype.pointerDown=function(e){var t;"touchstart"===e.type?this.movementStart={x:e.touches[0].clientX,y:e.touches[0].clientY}:this.movementStart={x:e.clientX,y:e.clientY},this.movement={x:0,y:0},this.offset={x:this.translation.x,y:this.translation.y},this.previousMovement={x:0,y:0},this.velocity={x:0,y:0};var n=this.targetElements.find((function(t){return t===e.target}));if(e.target===this.targetElement||n){this.isActive=!0,e.preventDefault(),n&&(this.currentIndex=this.targetElements.indexOf(n));var i=(null===(t=this.config)||void 0===t?void 0:t.initial)&&this.config.initial(),r=null==i?void 0:i.movementX,o=null==i?void 0:i.movementY;this.initialMovement={x:null!=r?r:0,y:null!=o?o:0},this.movement={x:this.initialMovement.x,y:this.initialMovement.y},this.previousMovement={x:this.initialMovement.x,y:this.initialMovement.y},this._handleCallback()}},t.prototype.pointerMove=function(e){if(this.isActive){e.preventDefault();var t=Date.now(),n=L(t-this.lastTimeStamp,.1,64);this.lastTimeStamp=t;var i=n/1e3;"touchmove"===e.type?this.movement={x:this.initialMovement.x+(e.touches[0].clientX-this.movementStart.x),y:this.initialMovement.y+(e.touches[0].clientY-this.movementStart.y)}:this.movement={x:this.initialMovement.x+(e.clientX-this.movementStart.x),y:this.initialMovement.y+(e.clientY-this.movementStart.y)},this.translation={x:this.offset.x+this.movement.x,y:this.offset.y+this.movement.y},this.velocity={x:L((this.movement.x-this.previousMovement.x)/i/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT),y:L((this.movement.y-this.previousMovement.y)/i/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()}},t.prototype.pointerUp=function(){this.isActive&&(this.isActive=!1,this._handleCallback(),this._cancelEvents(),this._initEvents())},t}(X),j=function(e){function t(){var t=e.apply(this,l([],s(arguments),!1))||this;return t.movement=D(0,0),t.previousMovement=D(0,0),t.velocity=D(0,0),t.direction=D(0,0),t}return f(t,e),t.prototype._initEvents=function(){this.targetElement?this._subscribe=q([this.targetElement],[["mousemove",this.onMouseMove.bind(this)]]):this.targetElements.length>0?this._subscribe=q(this.targetElements,[["mousemove",this.onMouseMove.bind(this)]]):this._subscribe=q([window],[["mousemove",this.onMouseMove.bind(this)]])},t.prototype._handleCallback=function(){var e;this.callback&&this.callback({args:[this.currentIndex],event:this.event,isMoving:this.isActive,target:null===(e=this.event)||void 0===e?void 0:e.target,mouseX:this.movement.x,mouseY:this.movement.y,velocityX:this.velocity.x,velocityY:this.velocity.y,directionX:this.direction.x,directionY:this.direction.y})},t.prototype.onMouseMove=function(e){var t=this,n=this.targetElements.find((function(t){return t===e.target}));n&&(this.currentIndex=this.targetElements.indexOf(n)),this.event=e;var i=Date.now(),r=Math.min(i-this.lastTimeStamp,64);this.lastTimeStamp=i;var o=r/1e3,f=e.clientX,a=e.clientY;this.movement={x:f,y:a},-1!==this.isActiveID&&(this.isActive=!0,clearTimeout(this.isActiveID)),this.isActiveID=setTimeout((function(){t.isActive=!1,t.direction={x:0,y:0},t.velocity={x:0,y:0},t._handleCallback()}),250);var u=this.movement.x-this.previousMovement.x,s=this.movement.y-this.previousMovement.y;this.direction={x:Math.sign(u),y:Math.sign(s)},this.velocity={x:L(u/o/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT),y:L(s/o/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()},t}(X),W=function(e){function t(){var t=e.apply(this,l([],s(arguments),!1))||this;return t.movement=D(0,0),t.previousMovement=D(0,0),t.direction=D(0,0),t.velocity=D(0,0),t}return f(t,e),t.prototype._initEvents=function(){this.targetElement?this._subscribe=q([this.targetElement],[["scroll",this.scrollElementListener.bind(this)]]):this._subscribe=q([window],[["scroll",this.scrollListener.bind(this)]])},t.prototype._handleCallback=function(){this.callback&&this.callback({isScrolling:this.isActive,scrollX:this.movement.x,scrollY:this.movement.y,velocityX:this.velocity.x,velocityY:this.velocity.y,directionX:this.direction.x,directionY:this.direction.y})},t.prototype.onScroll=function(e){var t=this,n=e.x,i=e.y,r=Date.now(),o=Math.min(r-this.lastTimeStamp,64);this.lastTimeStamp=r;var f=o/1e3;this.movement={x:n,y:i},-1!==this.isActiveID&&(this.isActive=!0,clearTimeout(this.isActiveID)),this.isActiveID=setTimeout((function(){t.isActive=!1,t.direction={x:0,y:0},t.velocity={x:0,y:0},t._handleCallback()}),250);var a=this.movement.x-this.previousMovement.x,u=this.movement.y-this.previousMovement.y;this.direction={x:Math.sign(a),y:Math.sign(u)},this.velocity={x:L(a/f/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT),y:L(u/f/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()},t.prototype.scrollListener=function(){var e=window.pageYOffset,t=window.pageXOffset;this.onScroll({x:t,y:e})},t.prototype.scrollElementListener=function(){var e,t,n=(null===(e=this.targetElement)||void 0===e?void 0:e.scrollLeft)||0,i=(null===(t=this.targetElement)||void 0===t?void 0:t.scrollTop)||0;this.onScroll({x:n,y:i})},t}(X),P=function(e){function t(){var t=e.apply(this,l([],s(arguments),!1))||this;return t.movement=D(0,0),t.previousMovement=D(0,0),t.direction=D(0,0),t.velocity=D(0,0),t.delta=D(0,0),t.offset=D(0,0),t.translation=D(0,0),t}return f(t,e),t.prototype._initEvents=function(){this.targetElement&&(this._subscribe=q([this.targetElement],[["wheel",this.onWheel.bind(this)]]))},t.prototype._handleCallback=function(){this.callback&&this.callback({target:this.targetElement,isWheeling:this.isActive,deltaX:this.delta.x,deltaY:this.delta.y,directionX:this.direction.x,directionY:this.direction.y,movementX:this.movement.x,movementY:this.movement.y,offsetX:this.offset.x,offsetY:this.offset.y,velocityX:this.velocity.x,velocityY:this.velocity.y})},t.prototype.onWheel=function(e){var t=this,n=e.deltaX,i=e.deltaY,r=e.deltaMode,o=Date.now(),f=Math.min(o-this.lastTimeStamp,64);this.lastTimeStamp=o;var a=f/1e3;this.isActive=!0,-1!==this.isActiveID&&(this.isActive=!0,clearTimeout(this.isActiveID)),this.isActiveID=setTimeout((function(){t.isActive=!1,t.translation={x:t.offset.x,y:t.offset.y},t._handleCallback(),t.velocity={x:0,y:0},t.movement={x:0,y:0}}),200),1===r?(n*=40,i*=40):2===r&&(n*=800,i*=800),this.delta={x:n,y:i},this.movement={x:this.movement.x+n,y:this.movement.y+i},this.offset={x:this.translation.x+this.movement.x,y:this.translation.y+this.movement.y};var u=this.movement.x-this.previousMovement.x,s=this.movement.y-this.previousMovement.y;this.direction={x:Math.sign(u),y:Math.sign(s)},this.velocity={x:L(u/a/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT),y:L(s/a/1e3,-1*X._VELOCITY_LIMIT,X._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()},t}(X),z=function(e){var t=r.useRef(),n=r.useRef([]),i=r.useRef(new Map).current;return r.useEffect((function(){var t,n;try{for(var r=u(i.entries()),o=r.next();!o.done;o=r.next()){var f=s(o.value,2)[1],a=f.keyIndex,l=f.gesture,c=s(e[a],3)[2];l.applyCallback(c)}}catch(e){t={error:e}}finally{try{o&&!o.done&&(n=r.return)&&n.call(r)}finally{if(t)throw t.error}}}),[e]),r.useEffect((function(){return e.forEach((function(e,r){var o=s(e,4),f=o[0],a=o[1],u=o[2],l=o[3];queueMicrotask((function(){return i.set(f,{keyIndex:r,gesture:a,unsubscribe:a.applyGesture({targetElement:t.current,targetElements:n.current,callback:u,config:l})})}))})),function(){var e,t;try{for(var n=u(i.entries()),r=n.next();!r.done;r=n.next()){var o=s(r.value,2)[1].unsubscribe;o&&o()}}catch(t){e={error:t}}finally{try{r&&!r.done&&(t=n.return)&&t.call(n)}finally{if(e)throw e.error}}}})),function(e){return null==e?{ref:t}:(n.current[e]=n.current[e]||r.createRef(),{ref:n.current[e]})}};Object.defineProperty(exports,"Easing",{enumerable:!0,get:function(){return e.Easing}}),Object.defineProperty(exports,"animate",{enumerable:!0,get:function(){return e.fluid}}),Object.defineProperty(exports,"makeAnimated",{enumerable:!0,get:function(){return e.makeFluid}}),exports.AnimationConfig=_,exports.MountedBlock=function(e){var n=e.state,i=e.children,r=e.from,o=void 0===r?0:r,f=e.enter,a=void 0===f?1:f,u=e.exit,s=S(n,{from:o,enter:a,exit:void 0===u?0:u,config:e.config});return t.jsx(t.Fragment,{children:s((function(e,t){return t&&i({value:e.value})}))})},exports.ScrollableBlock=function(e){var n=e.children,i=e.direction,o=void 0===i?"single":i,f=e.animationConfig,a=e.threshold,u=void 0===a?.2:a,l=r.useRef(null),c=O(0,f);return r.useEffect((function(){var e=l.current,t=new IntersectionObserver((function(e){s(e,1)[0].isIntersecting?c.value=1:"both"===o&&(c.value=0)}),{root:null,threshold:u});return e&&t.observe(e),function(){e&&t.unobserve(e)}}),[]),t.jsx("div",{ref:l,children:n&&n({value:c.value})})},exports.TransitionBlock=function(e){var n=e.state,i=e.children,r=e.config,o=O(C(n),r);return t.jsx(t.Fragment,{children:i({value:o.value})})},exports.bInterpolate=function(e,t,n,i){return E(e,[0,1],[t,n],i)},exports.bin=C,exports.clamp=L,exports.interpolate=E,exports.mix=function(e,t,n){return t*(1-e)+n*e},exports.move=function(e,t,n){var i=e[t],r=e.length,o=t-n;if(o>0)return l(l(l(l([],s(e.slice(0,n)),!1),[i],!1),s(e.slice(n,t)),!1),s(e.slice(t+1,r)),!1);if(o<0){var f=n+1;return l(l(l(l([],s(e.slice(0,t)),!1),s(e.slice(t+1,f)),!1),[i],!1),s(e.slice(f,r)),!1)}return e},exports.rubberClamp=function(e,t,n,i){return void 0===i&&(i=.15),0===i?L(e,t,n):e<t?-Y(t-e,n-t,i)+t:e>n?+Y(e-n,n-t,i)+n:e},exports.snapTo=function(e,t,n){var i=e+.2*t,r=function(e){return Math.abs(e-i)},o=n.map(r),f=Math.min.apply(Math,l([],s(o),!1));return n.reduce((function(e,t){return r(t)===f?t:e}))},exports.useDrag=function(e,t){var n=r.useRef(new F).current;return z([["drag",n,e,t]])},exports.useGesture=function(e){var t=e.onDrag,n=e.onWheel,i=e.onScroll,o=e.onMouseMove,f=r.useRef(new F).current,a=r.useRef(new P).current,u=r.useRef(new W).current,s=r.useRef(new j).current;return z([["drag",f,t],["wheel",a,n],["scroll",u,i],["move",s,o]])},exports.useMeasure=function(e,t){var i=n.useRef(null),r=n.useRef([]),o=n.useRef(e);return n.useEffect((function(){return o.current=e,function(){o.current=function(){return!1}}}),t),n.useEffect((function(){var e=i.current||document.documentElement,t=r.current,n=new ResizeObserver((function(t){var n=s(t,1)[0].target.getBoundingClientRect(),i=n.left,r=n.top,f=n.width,a=n.height,u=window.pageXOffset,l=window.pageYOffset;if(o){if(e===document.documentElement)return;o.current({left:i+u,top:r+l,width:f,height:a,vLeft:i,vTop:r})}})),f=new ResizeObserver((function(e){var t=[],n=[],i=[],r=[],f=[],a=[];e.forEach((function(e){var o=e.target.getBoundingClientRect(),u=o.left,s=o.top,l=o.width,c=o.height,h=u+window.pageXOffset,d=s+window.pageYOffset;t.push(h),n.push(d),i.push(l),r.push(c),f.push(u),a.push(s)})),o&&o.current({left:t,top:n,width:i,height:r,vLeft:f,vTop:a})}));return e&&(e===document.documentElement&&t.length>0?t.forEach((function(e){f.observe(e.current)})):n.observe(e)),function(){e&&(e===document.documentElement&&t.length>0?t.forEach((function(e){f.unobserve(e.current)})):n.unobserve(e))}}),[]),function(e){return null==e?{ref:i}:(r.current[e]=r.current[e]||n.createRef(),{ref:r.current[e]})}},exports.useMount=S,exports.useMouseMove=function(e){var t=r.useRef(new j).current;return z([["move",t,e]])},exports.useOutsideClick=function(e,t,i){var r=n.useRef();r.current||(r.current=t),n.useEffect((function(){return r.current=t,function(){r.current=function(){return!1}}}),i),n.useEffect((function(){var t=q([document],[["mousedown",function(t){var n=t.target;n&&n.isConnected&&(e.current&&!e.current.contains(n)&&r.current&&r.current(t))}]]);return function(){return t&&t()}}),[])},exports.useScroll=function(e){var t=r.useRef(new W).current;return z([["scroll",t,e]])},exports.useValue=O,exports.useValues=function(e,t){var i=n.useRef(!0),r=s(function(e,t){var i=n.useRef(new T(e,t)).current,r=n.useCallback((function(e,t){i.setFluid(e,t)}),[]);return[n.useMemo((function(){return i.getFluid()}),[]),r]}(e,a(a({},_.EASE),t)),2),o=r[0],f=r[1],u=n.useCallback((function(e){var t=e.map((function(e){return Array.isArray(e)?e.map((function(e){return M(e)})):M(e)}));queueMicrotask((function(){return f(t)}))}),[]);return n.useLayoutEffect((function(){i.current||u(e),i.current=!1}),[e,t]),{set value(e){u(e)},get value(){return o},get currentValue(){return o.map((function(e){return e.get()}))}}},exports.useWheel=function(e){var t=r.useRef(new P).current;return z([["wheel",t,e]])},exports.useWindowDimension=function(e,t){var i=n.useRef({width:0,height:0,innerWidth:0,innerHeight:0}),r=n.useRef(e);n.useEffect((function(){return r.current=e,function(){r.current=function(){return!1}}}),t),n.useEffect((function(){var e=new ResizeObserver((function(e){var t=s(e,1)[0].target,n=t.clientWidth,o=t.clientHeight,f=window.innerWidth,u=window.innerHeight;i.current={width:n,height:o,innerWidth:f,innerHeight:u},r&&r.current(a({},i.current))}));return e.observe(document.documentElement),function(){return e.unobserve(document.documentElement)}}),[])},exports.withConfig=V,exports.withDecay=function(e){return{config:a({decay:!0},e)}},exports.withDelay=function(e,t){return a(a({},t),{config:a(a({},t.config),{delay:e})})},exports.withEase=function(e,t){return V(e,a(a({},_.EASE),t))},exports.withLoop=function(e,t){if(Array.isArray(e)){for(var n=[],i=0;i<t;i++)n=n.concat(e);return n}return Array(t).fill({toValue:e.toValue,config:a(a({},e.config),{loop:t})})},exports.withSequence=function(e){return R(e)},exports.withSpring=function(e,t){return V(e,a(a({},_.ELASTIC),t))},exports.withTiming=function(e,t){return V(e,a({duration:250},t))};
|
|
1
|
+
var e=require("@raidipesh78/re-motion"),t=require("react/jsx-runtime"),n=require("react");function i(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,i.get?i:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var r=i(n);function o(t){var i=e.useMotionValue(t),r=n.useRef(),o=n.useCallback((function(t){var n,o;if(null===(n=r.current)||void 0===n||n.call(r),r.current=void 0,t&&"object"==typeof t){var f=t.type,a=t.to,s=t.options;if((null==s?void 0:s.onChange)&&(r.current=i.subscribe(s.onChange)),"sequence"===f){var l=(null!==(o=null==s?void 0:s.steps)&&void 0!==o?o:[]).map((function(t){var n,r;return"decay"===t.type?e.decay(i,null===(n=null==t?void 0:t.options)||void 0===n?void 0:n.velocity,t.options):"delay"===t.type?e.delay(null===(r=null==t?void 0:t.options)||void 0===r?void 0:r.delay):("spring"===t.type?e.spring:e.timing)(i,t.to,t.options)}));return void e.sequence(l).start()}if("loop"===f){var u=function(t){var n,r,o;if("decay"===t.type)return e.decay(i,null===(n=t.options)||void 0===n?void 0:n.velocity,t.options);if("spring"===t.type)return e.spring(i,null==t?void 0:t.to,t.options);if("timing"===t.type)return e.timing(i,null==t?void 0:t.to,t.options);if("sequence"===t.type)return e.sequence(null===(r=t.options)||void 0===r?void 0:r.steps.map(u));if("delay"===t.type)return e.delay(null===(o=t.options)||void 0===o?void 0:o.delay);throw new Error('Unsupported driver type "'.concat(t.type,'" in loop()'))},c=u(null==s?void 0:s.controller);return void e.loop(c,null==s?void 0:s.iterations).start()}"spring"===f?e.spring(i,a,s).start():"timing"===f?e.timing(i,a,s).start():"decay"===f&&e.decay(i,null==s?void 0:s.velocity,s).start()}else i.set(t)}),[]);return n.useEffect((function(){return function(){var e;null===(e=r.current)||void 0===e||e.call(r),r.current=void 0}}),[]),{get value(){return i},set value(t){t instanceof e.MotionValue||o(t)},get currentValue(){return i.current}}}var f=function(e,t){return f=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])},f(e,t)};function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}f(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}var s=function(){return s=Object.assign||function(e){for(var t,n=1,i=arguments.length;n<i;n++)for(var r in t=arguments[n])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e},s.apply(this,arguments)};function l(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],i=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&i>=e.length&&(e=void 0),{value:e&&e[i++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function u(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var i,r,o=n.call(e),f=[];try{for(;(void 0===t||t-- >0)&&!(i=o.next()).done;)f.push(i.value)}catch(e){r={error:e}}finally{try{i&&!i.done&&(n=o.return)&&n.call(o)}finally{if(r)throw r.error}}return f}function c(e,t,n){if(n||2===arguments.length)for(var i,r=0,o=t.length;r<o;r++)!i&&r in t||(i||(i=Array.prototype.slice.call(t,0,r)),i[r]=t[r]);return e.concat(i||Array.prototype.slice.call(t))}"function"==typeof SuppressedError&&SuppressedError;var h={Timing:{BOUNCE:{duration:500,easing:e.Easing.bounce},EASE_IN:{duration:500,easing:e.Easing.in(e.Easing.ease)},EASE_OUT:{duration:500,easing:e.Easing.out(e.Easing.ease)},EASE_IN_OUT:{duration:500,easing:e.Easing.inOut(e.Easing.ease)},POWER1:{duration:500,easing:e.Easing.bezier(.17,.42,.51,.97)},POWER2:{duration:500,easing:e.Easing.bezier(.07,.11,.13,1)},POWER3:{duration:500,easing:e.Easing.bezier(.09,.7,.16,1.04)},POWER4:{duration:500,easing:e.Easing.bezier(.05,.54,0,1.03)},LINEAR:{duration:500,easing:e.Easing.linear}},Spring:{ELASTIC:{mass:1,friction:18,tension:250},EASE:{mass:1,friction:26,tension:170},STIFF:{mass:1,friction:18,tension:350},WOBBLE:{mass:1,friction:8,tension:250}}},d=function(e,t){var n,i,r;return{type:"spring",to:e,options:{stiffness:null!==(n=null==t?void 0:t.tension)&&void 0!==n?n:100,damping:null!==(i=null==t?void 0:t.friction)&&void 0!==i?i:10,mass:null!==(r=null==t?void 0:t.mass)&&void 0!==r?r:1,onStart:null==t?void 0:t.onStart,onChange:null==t?void 0:t.onChange,onComplete:null==t?void 0:t.onRest}}},v=function(e,t){return d(e,s(s({},t),h.Spring.EASE))},m=function(e,t){var i,r,f,a=u(n.useState(e),2),l=a[0],c=a[1],h=n.useRef({from:null!==(i=null==t?void 0:t.from)&&void 0!==i?i:0,enter:null!==(r=null==t?void 0:t.enter)&&void 0!==r?r:d(1),exit:null!==(f=null==t?void 0:t.exit)&&void 0!==f?f:d(0)}).current,v=o(h.from),m=h.enter,p=h.exit;return n.useLayoutEffect((function(){e?(c(!0),queueMicrotask((function(){v.value=m}))):queueMicrotask((function(){v.value=s(s({},p),{options:s(s({},p.options),{onComplete:function(){var e,t;c(!1),null===(t=null===(e=null==p?void 0:p.options)||void 0===e?void 0:e.onComplete)||void 0===t||t.call(e),v.value.destroy()}})})}))}),[e,m,p]),function(e){return e({value:v.value},l)}},p=/[+-]?\d+(\.\d+)?|[\s]?\.\d+|#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})/gi,y=/#[a-f\d]{3,}|transparent|aliceblue|antiquewhite|aqua|aquamarine|azure|beige|bisque|black|blanchedalmond|blue|blueviolet|brown|burlywood|burntsienna|cadetblue|chartreuse|chocolate|coral|cornflowerblue|cornsilk|crimson|cyan|darkblue|darkcyan|darkgoldenrod|darkgray|darkgreen|darkgrey|darkkhaki|darkmagenta|darkolivegreen|darkorange|darkorchid|darkred|darksalmon|darkseagreen|darkslateblue|darkslategray|darkslategrey|darkturquoise|darkviolet|deeppink|deepskyblue|dimgray|dimgrey|dodgerblue|firebrick|floralwhite|forestgreen|fuchsia|gainsboro|ghostwhite|gold|goldenrod|gray|green|greenyellow|grey|honeydew|hotpink|indianred|indigo|ivory|khaki|lavender|lavenderblush|lawngreen|lemonchiffon|lightblue|lightcoral|lightcyan|lightgoldenrodyellow|lightgray|lightgreen|lightgrey|lightpink|lightsalmon|lightseagreen|lightskyblue|lightslategray|lightslategrey|lightsteelblue|lightyellow|lime|limegreen|linen|magenta|maroon|mediumaquamarine|mediumblue|mediumorchid|mediumpurple|mediumseagreen|mediumslateblue|mediumspringgreen|mediumturquoise|mediumvioletred|midnightblue|mintcream|mistyrose|moccasin|navajowhite|navy|oldlace|olive|olivedrab|orange|orangered|orchid|palegoldenrod|palegreen|paleturquoise|palevioletred|papayawhip|peachpuff|peru|pink|plum|powderblue|purple|rebeccapurple|red|rosybrown|royalblue|saddlebrown|salmon|sandybrown|seagreen|seashell|sienna|silver|skyblue|slateblue|slategray|slategrey|snow|springgreen|steelblue|tan|teal|thistle|tomato|turquoise|violet|wheat|white|whitesmoke|yellow|yellowgreen/gi,g={transparent:"#00000000",aliceblue:"#f0f8ffff",antiquewhite:"#faebd7ff",aqua:"#00ffffff",aquamarine:"#7fffd4ff",azure:"#f0ffffff",beige:"#f5f5dcff",bisque:"#ffe4c4ff",black:"#000000ff",blanchedalmond:"#ffebcdff",blue:"#0000ffff",blueviolet:"#8a2be2ff",brown:"#a52a2aff",burlywood:"#deb887ff",burntsienna:"#ea7e5dff",cadetblue:"#5f9ea0ff",chartreuse:"#7fff00ff",chocolate:"#d2691eff",coral:"#ff7f50ff",cornflowerblue:"#6495edff",cornsilk:"#fff8dcff",crimson:"#dc143cff",cyan:"#00ffffff",darkblue:"#00008bff",darkcyan:"#008b8bff",darkgoldenrod:"#b8860bff",darkgray:"#a9a9a9ff",darkgreen:"#006400ff",darkgrey:"#a9a9a9ff",darkkhaki:"#bdb76bff",darkmagenta:"#8b008bff",darkolivegreen:"#556b2fff",darkorange:"#ff8c00ff",darkorchid:"#9932ccff",darkred:"#8b0000ff",darksalmon:"#e9967aff",darkseagreen:"#8fbc8fff",darkslateblue:"#483d8bff",darkslategray:"#2f4f4fff",darkslategrey:"#2f4f4fff",darkturquoise:"#00ced1ff",darkviolet:"#9400d3ff",deeppink:"#ff1493ff",deepskyblue:"#00bfffff",dimgray:"#696969ff",dimgrey:"#696969ff",dodgerblue:"#1e90ffff",firebrick:"#b22222ff",floralwhite:"#fffaf0ff",forestgreen:"#228b22ff",fuchsia:"#ff00ffff",gainsboro:"#dcdcdcff",ghostwhite:"#f8f8ffff",gold:"#ffd700ff",goldenrod:"#daa520ff",gray:"#808080ff",green:"#008000ff",greenyellow:"#adff2fff",grey:"#808080ff",honeydew:"#f0fff0ff",hotpink:"#ff69b4ff",indianred:"#cd5c5cff",indigo:"#4b0082ff",ivory:"#fffff0ff",khaki:"#f0e68cff",lavender:"#e6e6faff",lavenderblush:"#fff0f5ff",lawngreen:"#7cfc00ff",lemonchiffon:"#fffacdff",lightblue:"#add8e6ff",lightcoral:"#f08080ff",lightcyan:"#e0ffffff",lightgoldenrodyellow:"#fafad2ff",lightgray:"#d3d3d3ff",lightgreen:"#90ee90ff",lightgrey:"#d3d3d3ff",lightpink:"#ffb6c1ff",lightsalmon:"#ffa07aff",lightseagreen:"#20b2aaff",lightskyblue:"#87cefaff",lightslategray:"#778899ff",lightslategrey:"#778899ff",lightsteelblue:"#b0c4deff",lightyellow:"#ffffe0ff",lime:"#00ff00ff",limegreen:"#32cd32ff",linen:"#faf0e6ff",magenta:"#ff00ffff",maroon:"#800000ff",mediumaquamarine:"#66cdaaff",mediumblue:"#0000cdff",mediumorchid:"#ba55d3ff",mediumpurple:"#9370dbff",mediumseagreen:"#3cb371ff",mediumslateblue:"#7b68eeff",mediumspringgreen:"#00fa9aff",mediumturquoise:"#48d1ccff",mediumvioletred:"#c71585ff",midnightblue:"#191970ff",mintcream:"#f5fffaff",mistyrose:"#ffe4e1ff",moccasin:"#ffe4b5ff",navajowhite:"#ffdeadff",navy:"#000080ff",oldlace:"#fdf5e6ff",olive:"#808000ff",olivedrab:"#6b8e23ff",orange:"#ffa500ff",orangered:"#ff4500ff",orchid:"#da70d6ff",palegoldenrod:"#eee8aaff",palegreen:"#98fb98ff",paleturquoise:"#afeeeeff",palevioletred:"#db7093ff",papayawhip:"#ffefd5ff",peachpuff:"#ffdab9ff",peru:"#cd853fff",pink:"#ffc0cbff",plum:"#dda0ddff",powderblue:"#b0e0e6ff",purple:"#800080ff",rebeccapurple:"#663399ff",red:"#ff0000ff",rosybrown:"#bc8f8fff",royalblue:"#4169e1ff",saddlebrown:"#8b4513ff",salmon:"#fa8072ff",sandybrown:"#f4a460ff",seagreen:"#2e8b57ff",seashell:"#fff5eeff",sienna:"#a0522dff",silver:"#c0c0c0ff",skyblue:"#87ceebff",slateblue:"#6a5acdff",slategray:"#708090ff",slategrey:"#708090ff",snow:"#fffafaff",springgreen:"#00ff7fff",steelblue:"#4682b4ff",tan:"#d2b48cff",teal:"#008080ff",thistle:"#d8bfd8ff",tomato:"#ff6347ff",turquoise:"#40e0d0ff",violet:"#ee82eeff",wheat:"#f5deb3ff",white:"#ffffffff",whitesmoke:"#f5f5f5ff",yellow:"#ffff00ff",yellowgreen:"#9acd32ff"};function b(e){var t=function(e){return e.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,(function(e,t,n,i){return"#"+t+t+n+n+i+i}))}(e),n=function(e){return 7===e.length?e+"FF":e}(t),i=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(n);return{r:parseInt(i[1],16),g:parseInt(i[2],16),b:parseInt(i[3],16),a:parseInt(i[4],16)/255}}function x(e){var t=e.r,n=e.g,i=e.b,r=e.a;return"#"+(256|t).toString(16).slice(1)+(256|n).toString(16).slice(1)+(256|i).toString(16).slice(1)+(255*r|256).toString(16).slice(1)}var w=function(e,t,n,i){var r=u(t,4),o=r[0],f=r[1],a=r[2],s=r[3],l=e;if(l<o){if("identity"===n)return l;"clamp"===n&&(l=o)}if(l>f){if("identity"===i)return l;"clamp"===i&&(l=f)}return a===s?a:o===f?e<=o?a:s:(o===-1/0?l=-l:f===1/0?l-=o:l=(l-o)/(f-o),a===-1/0?l=-l:s===1/0?l+=a:l=l*(s-a)+a,l)},E=function(e,t,n,i){var r=u(t,4),o=r[0],f=r[1],a=r[2],s=r[3];if(a.length===s.length)return a.map((function(t,r){return"string"==typeof t?function(e,t){var n=u(t,4),i=n[0],r=n[1],o=n[2],f=n[3],a=b(o),s=b(f);return x({r:w(e,[i,r,a.r,s.r],"clamp","clamp"),g:w(e,[i,r,a.g,s.g],"clamp","clamp"),b:w(e,[i,r,a.b,s.b],"clamp","clamp"),a:w(e,[i,r,a.a,s.a],"clamp","clamp")})}(e,[o,f,t,s[r]]):w(e,[o,f,t,s[r]],n,i)}));throw new Error("Array length doesn't match")},k=function(e){return e.replace(p,"$")},M=function(e){return e.match(p).map((function(e){return-1!==e.indexOf("#")?e:Number(e)}))},_=function(e){return e.replace(y,(function(e){if(-1!==e.indexOf("#"))return x(b(e));if(Object.prototype.hasOwnProperty.call(g,e))return g[e];throw new Error("String cannot be parsed!")}))};function I(e,t){var n=new Map;return t.forEach((function(t){var i=u(t,3),r=i[0],o=i[1],f=i[2],a=void 0!==f&&f;n.set(r,function(e,t,n,i){return void 0===i&&(i=!1),e.forEach((function(e){e.addEventListener(t,n,i)})),function(){e.forEach((function(e){e.removeEventListener(t,n,i)}))}}(e,r,o,a))})),function(e){var t,i;try{for(var r=l(n.entries()),o=r.next();!o.done;o=r.next()){var f=u(o.value,2),a=f[0],s=f[1];if(!e)return void s();-1!==e.indexOf(a)&&s()}}catch(e){t={error:e}}finally{try{o&&!o.done&&(i=r.return)&&i.call(r)}finally{if(t)throw t.error}}}}function O(e,t,n){return Math.min(Math.max(e,t),n)}function T(e,t,n){return 0===t||Math.abs(t)===1/0?function(e,t){return Math.pow(e,5*t)}(e,n):e*t*n/(t+n*e)}var C=function(e,t){return{x:e,y:t}},S=function(){function e(){this.lastTimeStamp=Date.now(),this.isActive=!1,this.targetElements=[]}return e.prototype._initEvents=function(){},e.prototype._cancelEvents=function(){this._subscribe&&this._subscribe()},e.prototype.applyCallback=function(e){this.callback=e},e.prototype.applyGesture=function(e){var t=this,n=e.targetElement,i=e.targetElements,r=e.callback,o=e.config;return this.targetElement=n,this.targetElements=i.map((function(e){return e.current})),this.callback=r,this.config=o,this._initEvents(),function(){return t._subscribe&&t._subscribe()}},e._VELOCITY_LIMIT=20,e}(),L=function(e){function t(){var t=e.apply(this,c([],u(arguments),!1))||this;return t.movementStart=C(0,0),t.initialMovement=C(0,0),t.movement=C(0,0),t.previousMovement=C(0,0),t.translation=C(0,0),t.offset=C(0,0),t.velocity=C(0,0),t}return a(t,e),t.prototype._initEvents=function(){(this.targetElement||this.targetElements.length>0)&&(this._subscribe=I([window],[["mousedown",this.pointerDown.bind(this)],["mousemove",this.pointerMove.bind(this)],["mouseup",this.pointerUp.bind(this)],["touchstart",this.pointerDown.bind(this),{passive:!1}],["touchmove",this.pointerMove.bind(this),{passive:!1}],["touchend",this.pointerUp.bind(this)]]))},t.prototype._cancelEvents=function(){this._subscribe&&this._subscribe(["mousedown","mousemove","touchstart","touchmove"])},t.prototype._handleCallback=function(){var e=this;this.callback&&this.callback({args:[this.currentIndex],down:this.isActive,movementX:this.movement.x,movementY:this.movement.y,offsetX:this.translation.x,offsetY:this.translation.y,velocityX:this.velocity.x,velocityY:this.velocity.y,distanceX:Math.abs(this.movement.x),distanceY:Math.abs(this.movement.y),directionX:Math.sign(this.movement.x),directionY:Math.sign(this.movement.y),cancel:function(){e._cancelEvents()}})},t.prototype.pointerDown=function(e){var t;"touchstart"===e.type?this.movementStart={x:e.touches[0].clientX,y:e.touches[0].clientY}:this.movementStart={x:e.clientX,y:e.clientY},this.movement={x:0,y:0},this.offset={x:this.translation.x,y:this.translation.y},this.previousMovement={x:0,y:0},this.velocity={x:0,y:0};var n=this.targetElements.find((function(t){return t===e.target}));if(e.target===this.targetElement||n){this.isActive=!0,e.preventDefault(),n&&(this.currentIndex=this.targetElements.indexOf(n));var i=(null===(t=this.config)||void 0===t?void 0:t.initial)&&this.config.initial(),r=null==i?void 0:i.movementX,o=null==i?void 0:i.movementY;this.initialMovement={x:null!=r?r:0,y:null!=o?o:0},this.movement={x:this.initialMovement.x,y:this.initialMovement.y},this.previousMovement={x:this.initialMovement.x,y:this.initialMovement.y},this._handleCallback()}},t.prototype.pointerMove=function(e){if(this.isActive){e.preventDefault();var t=Date.now(),n=O(t-this.lastTimeStamp,.1,64);this.lastTimeStamp=t;var i=n/1e3;"touchmove"===e.type?this.movement={x:this.initialMovement.x+(e.touches[0].clientX-this.movementStart.x),y:this.initialMovement.y+(e.touches[0].clientY-this.movementStart.y)}:this.movement={x:this.initialMovement.x+(e.clientX-this.movementStart.x),y:this.initialMovement.y+(e.clientY-this.movementStart.y)},this.translation={x:this.offset.x+this.movement.x,y:this.offset.y+this.movement.y},this.velocity={x:O((this.movement.x-this.previousMovement.x)/i/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT),y:O((this.movement.y-this.previousMovement.y)/i/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()}},t.prototype.pointerUp=function(){this.isActive&&(this.isActive=!1,this._handleCallback(),this._cancelEvents(),this._initEvents())},t}(S),Y=function(e){function t(){var t=e.apply(this,c([],u(arguments),!1))||this;return t.movement=C(0,0),t.previousMovement=C(0,0),t.velocity=C(0,0),t.direction=C(0,0),t}return a(t,e),t.prototype._initEvents=function(){this.targetElement?this._subscribe=I([this.targetElement],[["mousemove",this.onMouseMove.bind(this)]]):this.targetElements.length>0?this._subscribe=I(this.targetElements,[["mousemove",this.onMouseMove.bind(this)]]):this._subscribe=I([window],[["mousemove",this.onMouseMove.bind(this)]])},t.prototype._handleCallback=function(){var e;this.callback&&this.callback({args:[this.currentIndex],event:this.event,isMoving:this.isActive,target:null===(e=this.event)||void 0===e?void 0:e.target,mouseX:this.movement.x,mouseY:this.movement.y,velocityX:this.velocity.x,velocityY:this.velocity.y,directionX:this.direction.x,directionY:this.direction.y})},t.prototype.onMouseMove=function(e){var t=this,n=this.targetElements.find((function(t){return t===e.target}));n&&(this.currentIndex=this.targetElements.indexOf(n)),this.event=e;var i=Date.now(),r=Math.min(i-this.lastTimeStamp,64);this.lastTimeStamp=i;var o=r/1e3,f=e.clientX,a=e.clientY;this.movement={x:f,y:a},-1!==this.isActiveID&&(this.isActive=!0,clearTimeout(this.isActiveID)),this.isActiveID=setTimeout((function(){t.isActive=!1,t.direction={x:0,y:0},t.velocity={x:0,y:0},t._handleCallback()}),250);var s=this.movement.x-this.previousMovement.x,l=this.movement.y-this.previousMovement.y;this.direction={x:Math.sign(s),y:Math.sign(l)},this.velocity={x:O(s/o/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT),y:O(l/o/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()},t}(S),A=function(e){function t(){var t=e.apply(this,c([],u(arguments),!1))||this;return t.movement=C(0,0),t.previousMovement=C(0,0),t.direction=C(0,0),t.velocity=C(0,0),t}return a(t,e),t.prototype._initEvents=function(){this.targetElement?this._subscribe=I([this.targetElement],[["scroll",this.scrollElementListener.bind(this)]]):this._subscribe=I([window],[["scroll",this.scrollListener.bind(this)]])},t.prototype._handleCallback=function(){this.callback&&this.callback({isScrolling:this.isActive,scrollX:this.movement.x,scrollY:this.movement.y,velocityX:this.velocity.x,velocityY:this.velocity.y,directionX:this.direction.x,directionY:this.direction.y})},t.prototype.onScroll=function(e){var t=this,n=e.x,i=e.y,r=Date.now(),o=Math.min(r-this.lastTimeStamp,64);this.lastTimeStamp=r;var f=o/1e3;this.movement={x:n,y:i},-1!==this.isActiveID&&(this.isActive=!0,clearTimeout(this.isActiveID)),this.isActiveID=setTimeout((function(){t.isActive=!1,t.direction={x:0,y:0},t.velocity={x:0,y:0},t._handleCallback()}),250);var a=this.movement.x-this.previousMovement.x,s=this.movement.y-this.previousMovement.y;this.direction={x:Math.sign(a),y:Math.sign(s)},this.velocity={x:O(a/f/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT),y:O(s/f/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()},t.prototype.scrollListener=function(){var e=window.pageYOffset,t=window.pageXOffset;this.onScroll({x:t,y:e})},t.prototype.scrollElementListener=function(){var e,t,n=(null===(e=this.targetElement)||void 0===e?void 0:e.scrollLeft)||0,i=(null===(t=this.targetElement)||void 0===t?void 0:t.scrollTop)||0;this.onScroll({x:n,y:i})},t}(S),R=function(e){function t(){var t=e.apply(this,c([],u(arguments),!1))||this;return t.movement=C(0,0),t.previousMovement=C(0,0),t.direction=C(0,0),t.velocity=C(0,0),t.delta=C(0,0),t.offset=C(0,0),t.translation=C(0,0),t}return a(t,e),t.prototype._initEvents=function(){this.targetElement&&(this._subscribe=I([this.targetElement],[["wheel",this.onWheel.bind(this)]]))},t.prototype._handleCallback=function(){this.callback&&this.callback({target:this.targetElement,isWheeling:this.isActive,deltaX:this.delta.x,deltaY:this.delta.y,directionX:this.direction.x,directionY:this.direction.y,movementX:this.movement.x,movementY:this.movement.y,offsetX:this.offset.x,offsetY:this.offset.y,velocityX:this.velocity.x,velocityY:this.velocity.y})},t.prototype.onWheel=function(e){var t=this,n=e.deltaX,i=e.deltaY,r=e.deltaMode,o=Date.now(),f=Math.min(o-this.lastTimeStamp,64);this.lastTimeStamp=o;var a=f/1e3;this.isActive=!0,-1!==this.isActiveID&&(this.isActive=!0,clearTimeout(this.isActiveID)),this.isActiveID=setTimeout((function(){t.isActive=!1,t.translation={x:t.offset.x,y:t.offset.y},t._handleCallback(),t.velocity={x:0,y:0},t.movement={x:0,y:0}}),200),1===r?(n*=40,i*=40):2===r&&(n*=800,i*=800),this.delta={x:n,y:i},this.movement={x:this.movement.x+n,y:this.movement.y+i},this.offset={x:this.translation.x+this.movement.x,y:this.translation.y+this.movement.y};var s=this.movement.x-this.previousMovement.x,l=this.movement.y-this.previousMovement.y;this.direction={x:Math.sign(s),y:Math.sign(l)},this.velocity={x:O(s/a/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT),y:O(l/a/1e3,-1*S._VELOCITY_LIMIT,S._VELOCITY_LIMIT)},this.previousMovement={x:this.movement.x,y:this.movement.y},this._handleCallback()},t}(S),q=function(e){var t=r.useRef(),n=r.useRef([]),i=r.useRef(new Map).current;return r.useEffect((function(){var t,n;try{for(var r=l(i.entries()),o=r.next();!o.done;o=r.next()){var f=u(o.value,2)[1],a=f.keyIndex,s=f.gesture,c=u(e[a],3)[2];s.applyCallback(c)}}catch(e){t={error:e}}finally{try{o&&!o.done&&(n=r.return)&&n.call(r)}finally{if(t)throw t.error}}}),[e]),r.useEffect((function(){return e.forEach((function(e,r){var o=u(e,4),f=o[0],a=o[1],s=o[2],l=o[3];queueMicrotask((function(){return i.set(f,{keyIndex:r,gesture:a,unsubscribe:a.applyGesture({targetElement:t.current,targetElements:n.current,callback:s,config:l})})}))})),function(){var e,t;try{for(var n=l(i.entries()),r=n.next();!r.done;r=n.next()){var o=u(r.value,2)[1].unsubscribe;o&&o()}}catch(t){e={error:t}}finally{try{r&&!r.done&&(t=n.return)&&t.call(n)}finally{if(e)throw e.error}}}})),function(e){return null==e?{ref:t}:(n.current[e]=n.current[e]||r.createRef(),{ref:n.current[e]})}};Object.defineProperty(exports,"Easing",{enumerable:!0,get:function(){return e.Easing}}),Object.defineProperty(exports,"animate",{enumerable:!0,get:function(){return e.motion}}),Object.defineProperty(exports,"makeAnimated",{enumerable:!0,get:function(){return e.makeMotion}}),exports.AnimationConfig=h,exports.MountedBlock=function(e){var n=e.state,i=e.children,r=e.from,o=e.enter,f=e.exit,a=m(n,{from:r,enter:o,exit:f});return t.jsx(t.Fragment,{children:a((function(e,t){return t&&i({value:e.value})}))})},exports.ScrollableBlock=function(e){var i=e.children,r=e.direction,f=void 0===r?"single":r,a=e.threshold,s=void 0===a?.2:a,l=n.useRef(null),c=o(0);return n.useLayoutEffect((function(){var e=l.current,t=new IntersectionObserver((function(e){u(e,1)[0].isIntersecting?c.value=v(1):"both"===f&&(c.value=v(0))}),{root:null,threshold:s});return e&&t.observe(e),function(){e&&t.unobserve(e)}}),[]),t.jsx("div",{ref:l,children:i&&i({value:c.value})})},exports.bin=function(e){return e?1:0},exports.clamp=O,exports.interpolateNumbers=function(e,t,n,i){var r,o,f=null==i?void 0:i.extrapolate,a=null==i?void 0:i.extrapolateLeft,s=null==i?void 0:i.extrapolateRight,c=function(e,t,n){var i=t.length,r=[];e<t[0]?r=[t[0],t[1],n[0],n[1]]:e>t[i-1]&&(r=[t[i-2],t[i-1],n[i-2],n[i-1]]);for(var o=1;o<i;++o)if(e<=t[o]){r=[t[o-1],t[o],n[o-1],n[o]];break}return r}(e,t,n),h="extend";void 0!==a?h=a:void 0!==f&&(h=f);var d,v="extend";if(void 0!==s?v=s:void 0!==f&&(v=f),n.length){if("number"==typeof n[0])return w(e,c,h,v);if(Array.isArray(n[0]))return E(e,c,h,v);var m=u(c,4),p=m[0],y=m[1],g=m[2],b=m[3],x=_(g),I=_(b),O=k(x);if(d=I,k(x).trim().replace(/\s/g,"")===k(d).trim().replace(/\s/g,"")){var T=M(x),C=M(I),S=E(e,[p,y,T,C],h,v);try{for(var L=l(S),Y=L.next();!Y.done;Y=L.next()){var A=Y.value;O=O.replace("$",A)}}catch(e){r={error:e}}finally{try{Y&&!Y.done&&(o=L.return)&&o.call(L)}finally{if(r)throw r.error}}return O}throw new Error("Output range doesn't match string format!")}throw new Error("Output range cannot be Empty")},exports.mix=function(e,t,n){return t*(1-e)+n*e},exports.move=function(e,t,n){var i=e[t],r=e.length,o=t-n;if(o>0)return c(c(c(c([],u(e.slice(0,n)),!1),[i],!1),u(e.slice(n,t)),!1),u(e.slice(t+1,r)),!1);if(o<0){var f=n+1;return c(c(c(c([],u(e.slice(0,t)),!1),u(e.slice(t+1,f)),!1),[i],!1),u(e.slice(f,r)),!1)}return e},exports.rubberClamp=function(e,t,n,i){return void 0===i&&(i=.15),0===i?O(e,t,n):e<t?-T(t-e,n-t,i)+t:e>n?+T(e-n,n-t,i)+n:e},exports.snapTo=function(e,t,n){var i=e+.2*t,r=function(e){return Math.abs(e-i)},o=n.map(r),f=Math.min.apply(Math,c([],u(o),!1));return n.reduce((function(e,t){return r(t)===f?t:e}))},exports.useDrag=function(e,t){var n=r.useRef(new L).current;return q([["drag",n,e,t]])},exports.useGesture=function(e){var t=e.onDrag,n=e.onWheel,i=e.onScroll,o=e.onMouseMove,f=r.useRef(new L).current,a=r.useRef(new R).current,s=r.useRef(new A).current,l=r.useRef(new Y).current;return q([["drag",f,t],["wheel",a,n],["scroll",s,i],["move",l,o]])},exports.useMeasure=function(e,t){var i=n.useRef(null),r=n.useRef([]),o=n.useRef(e);return n.useEffect((function(){return o.current=e,function(){o.current=function(){return!1}}}),t),n.useEffect((function(){var e=i.current||document.documentElement,t=r.current,n=new ResizeObserver((function(t){var n=u(t,1)[0].target.getBoundingClientRect(),i=n.left,r=n.top,f=n.width,a=n.height,s=window.pageXOffset,l=window.pageYOffset;if(o){if(e===document.documentElement)return;o.current({left:i+s,top:r+l,width:f,height:a,vLeft:i,vTop:r})}})),f=new ResizeObserver((function(e){var t=[],n=[],i=[],r=[],f=[],a=[];e.forEach((function(e){var o=e.target.getBoundingClientRect(),s=o.left,l=o.top,u=o.width,c=o.height,h=s+window.pageXOffset,d=l+window.pageYOffset;t.push(h),n.push(d),i.push(u),r.push(c),f.push(s),a.push(l)})),o&&o.current({left:t,top:n,width:i,height:r,vLeft:f,vTop:a})}));return e&&(e===document.documentElement&&t.length>0?t.forEach((function(e){f.observe(e.current)})):n.observe(e)),function(){e&&(e===document.documentElement&&t.length>0?t.forEach((function(e){f.unobserve(e.current)})):n.unobserve(e))}}),[]),function(e){return null==e?{ref:i}:(r.current[e]=r.current[e]||n.createRef(),{ref:r.current[e]})}},exports.useMount=m,exports.useMouseMove=function(e){var t=r.useRef(new Y).current;return q([["move",t,e]])},exports.useOutsideClick=function(e,t,i){var r=n.useRef();r.current||(r.current=t),n.useEffect((function(){return r.current=t,function(){r.current=function(){return!1}}}),i),n.useEffect((function(){var t=I([document],[["mousedown",function(t){var n=t.target;n&&n.isConnected&&(e.current&&!e.current.contains(n)&&r.current&&r.current(t))}]]);return function(){return t&&t()}}),[])},exports.useScroll=function(e){var t=r.useRef(new A).current;return q([["scroll",t,e]])},exports.useValue=o,exports.useWheel=function(e){var t=r.useRef(new R).current;return q([["wheel",t,e]])},exports.useWindowDimension=function(e,t){var i=n.useRef({width:0,height:0,innerWidth:0,innerHeight:0}),r=n.useRef(e);n.useEffect((function(){return r.current=e,function(){r.current=function(){return!1}}}),t),n.useEffect((function(){var e=new ResizeObserver((function(e){var t=u(e,1)[0].target,n=t.clientWidth,o=t.clientHeight,f=window.innerWidth,a=window.innerHeight;i.current={width:n,height:o,innerWidth:f,innerHeight:a},r&&r.current(s({},i.current))}));return e.observe(document.documentElement),function(){return e.unobserve(document.documentElement)}}),[])},exports.withDecay=function(e){return{type:"decay",options:{velocity:e.velocity,onStart:null==e?void 0:e.onStart,onChange:null==e?void 0:e.onChange,onComplete:null==e?void 0:e.onRest}}},exports.withDelay=function(e){return{type:"delay",options:{delay:e}}},exports.withEase=v,exports.withLoop=function(e,t){return{type:"loop",options:{controller:e,iterations:t}}},exports.withSequence=function(e){return{type:"sequence",options:{steps:e}}},exports.withSpring=d,exports.withTiming=function(e,t){var n;return{type:"timing",to:e,options:{duration:null!==(n=null==t?void 0:t.duration)&&void 0!==n?n:300,easing:null==t?void 0:t.easing,onStart:null==t?void 0:t.onStart,onChange:null==t?void 0:t.onChange,onComplete:null==t?void 0:t.onRest}}};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|