react-ui-animate 2.0.0 → 3.0.0-rc.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/.vscode/settings.json +3 -3
- package/LICENSE +21 -21
- package/README.md +115 -115
- package/dist/animation/animationType.d.ts +15 -15
- package/dist/animation/core/animation/Animation.d.ts +16 -0
- package/dist/animation/core/animation/FluidValue.d.ts +21 -0
- package/dist/animation/core/animation/RequestAnimationFrame.d.ts +8 -0
- package/dist/animation/core/animation/SpringAnimation.d.ts +41 -0
- package/dist/animation/core/animation/TimingAnimation.d.ts +35 -0
- package/dist/animation/core/animation/TransitionValue.d.ts +21 -0
- package/dist/animation/core/controllers/Animation.d.ts +16 -0
- package/dist/animation/core/controllers/FluidValue.d.ts +32 -0
- package/dist/animation/core/controllers/RequestAnimationFrame.d.ts +8 -0
- package/dist/animation/core/controllers/SpringAnimation.d.ts +41 -0
- package/dist/animation/core/controllers/TimingAnimation.d.ts +35 -0
- package/dist/animation/core/easing/Bezier.d.ts +8 -0
- package/dist/animation/core/easing/Easing.d.ts +40 -0
- package/dist/animation/core/helpers/camelCaseToKebabCase.d.ts +8 -0
- package/dist/animation/core/helpers/camelToDash.d.ts +7 -0
- package/dist/animation/core/helpers/canInterpolate.d.ts +11 -0
- package/dist/animation/core/helpers/getAnimatableObject.d.ts +22 -0
- package/dist/animation/core/helpers/getCleanProps.d.ts +10 -0
- package/dist/animation/core/helpers/getCssValue.d.ts +8 -0
- package/dist/animation/core/helpers/getNonAnimatableStyle.d.ts +6 -0
- package/dist/animation/core/helpers/index.d.ts +5 -0
- package/dist/animation/core/helpers/isDefined.d.ts +12 -0
- package/dist/animation/core/helpers/isFluidValue.d.ts +6 -0
- package/dist/animation/core/index.d.ts +11 -0
- package/dist/animation/core/interpolation/Colors.d.ts +25 -0
- package/dist/animation/core/interpolation/Interpolation.d.ts +80 -0
- package/dist/animation/core/interpolation/__tests__/Colors.test.d.ts +1 -0
- package/dist/animation/core/react/Tags.d.ts +3 -0
- package/dist/animation/core/react/TransformStyles.d.ts +8 -0
- package/dist/animation/core/react/animated.d.ts +29 -0
- package/dist/animation/core/react/combineRefs.d.ts +2 -0
- package/dist/animation/core/react/fluid.d.ts +6 -0
- package/dist/animation/core/react/functions/camelToDash.d.ts +7 -0
- package/dist/animation/core/react/functions/getAnimatableObject.d.ts +22 -0
- package/dist/animation/core/react/functions/getCleanProps.d.ts +4 -0
- package/dist/animation/core/react/functions/getCssValue.d.ts +8 -0
- package/dist/animation/core/react/functions/getNonAnimatableStyle.d.ts +6 -0
- package/dist/animation/core/react/functions/index.d.ts +7 -0
- package/dist/animation/core/react/functions/isDefined.d.ts +6 -0
- package/dist/animation/core/react/functions/isTransitionValue.d.ts +6 -0
- package/dist/animation/core/react/helpers/camelToDash.d.ts +7 -0
- package/dist/animation/core/react/helpers/canInterpolate.d.ts +7 -0
- package/dist/animation/core/react/helpers/getAnimatableObject.d.ts +22 -0
- package/dist/animation/core/react/helpers/getCleanProps.d.ts +4 -0
- package/dist/animation/core/react/helpers/getCssValue.d.ts +8 -0
- package/dist/animation/core/react/helpers/getNonAnimatableStyle.d.ts +6 -0
- package/dist/animation/core/react/helpers/index.d.ts +7 -0
- package/dist/animation/core/react/helpers/isDefined.d.ts +6 -0
- package/dist/animation/core/react/helpers/isFluidValue.d.ts +6 -0
- package/dist/animation/core/react/helpers/isTransitionValue.d.ts +6 -0
- package/dist/animation/core/react/makeFluid.d.ts +30 -0
- package/dist/animation/core/react/transforms.d.ts +6 -0
- package/dist/animation/core/react/useFluidValue.d.ts +9 -0
- package/dist/animation/core/react/useMount.d.ts +20 -0
- package/dist/animation/core/react/useMounts.d.ts +26 -0
- package/dist/animation/core/react/useTransition.d.ts +9 -0
- package/dist/animation/core/react/useTransitions.d.ts +11 -0
- package/dist/animation/core/types/animation.d.ts +54 -0
- package/dist/animation/core/types/common.d.ts +4 -0
- package/dist/animation/core/types/fluid.d.ts +19 -0
- package/dist/animation/core/types/index.d.ts +2 -0
- package/dist/animation/getInitialConfig.d.ts +3 -3
- package/dist/animation/index.d.ts +6 -6
- package/dist/animation/interpolation.d.ts +21 -21
- package/dist/animation/lib/animationType.d.ts +15 -0
- package/dist/animation/lib/getInitialConfig.d.ts +3 -0
- package/dist/animation/lib/index.d.ts +5 -0
- package/dist/animation/lib/interpolation.d.ts +20 -0
- package/dist/animation/lib/modules/AnimatedBlock.d.ts +8 -0
- package/dist/animation/lib/modules/AnimatedImage.d.ts +8 -0
- package/dist/animation/lib/modules/AnimatedInline.d.ts +8 -0
- package/dist/animation/lib/modules/MountedBlock.d.ts +29 -0
- package/dist/animation/lib/modules/ScrollableBlock.d.ts +22 -0
- package/dist/animation/lib/modules/TransitionBlock.d.ts +18 -0
- package/dist/animation/lib/modules/index.d.ts +6 -0
- package/dist/animation/lib/useAnimatedValue.d.ts +17 -0
- package/dist/animation/lib/useMountedValue.d.ts +14 -0
- package/dist/animation/modules/AnimatedBlock.d.ts +8 -8
- package/dist/animation/modules/AnimatedImage.d.ts +8 -8
- package/dist/animation/modules/AnimatedInline.d.ts +8 -8
- package/dist/animation/modules/MountedBlock.d.ts +29 -18
- package/dist/animation/modules/ScrollableBlock.d.ts +21 -21
- package/dist/animation/modules/TransitionBlock.d.ts +17 -17
- package/dist/animation/modules/index.d.ts +6 -6
- package/dist/animation/useAnimatedValue.d.ts +22 -22
- package/dist/animation/useMountedValue.d.ts +15 -15
- package/dist/gestures/controllers/DragGesture.d.ts +17 -17
- package/dist/gestures/controllers/Gesture.d.ts +20 -20
- package/dist/gestures/controllers/MouseMoveGesture.d.ts +13 -13
- package/dist/gestures/controllers/ScrollGesture.d.ts +14 -14
- package/dist/gestures/controllers/WheelGesture.d.ts +15 -15
- package/dist/gestures/controllers/index.d.ts +4 -4
- package/dist/gestures/eventAttacher.d.ts +11 -11
- package/dist/gestures/helpers/eventAttacher.d.ts +11 -0
- package/dist/gestures/helpers/index.d.ts +1 -0
- package/dist/gestures/helpers/math.d.ts +34 -0
- package/dist/gestures/helpers/withDefault.d.ts +4 -0
- package/dist/gestures/hooks/index.d.ts +5 -5
- package/dist/gestures/hooks/useDrag.d.ts +4 -4
- package/dist/gestures/hooks/useGesture.d.ts +9 -9
- package/dist/gestures/hooks/useMouseMove.d.ts +4 -4
- package/dist/gestures/hooks/useRecognizer.d.ts +10 -10
- package/dist/gestures/hooks/useScroll.d.ts +4 -4
- package/dist/gestures/hooks/useWheel.d.ts +4 -4
- package/dist/gestures/index.d.ts +2 -2
- package/dist/gestures/math.d.ts +34 -34
- package/dist/gestures/types.d.ts +51 -51
- package/dist/gestures/withDefault.d.ts +4 -4
- package/dist/hooks/index.d.ts +3 -3
- package/dist/hooks/useMeasure.d.ts +14 -14
- package/dist/hooks/useOutsideClick.d.ts +2 -2
- package/dist/hooks/useWindowDimension.d.ts +9 -9
- package/dist/index.d.ts +9 -5
- package/dist/index.js +2758 -1052
- package/dist/index.js.map +1 -1
- package/dist/utils/delay.d.ts +5 -5
- package/dist/utils/index.d.ts +1 -2
- package/dist/utils/isDefined.d.ts +1 -1
- package/ecosystem.config.js +12 -0
- package/example/README.md +46 -0
- package/example/package-lock.json +19597 -0
- package/example/package.json +45 -0
- package/example/public/favicon.ico +0 -0
- package/example/public/index.html +20 -0
- package/example/public/logo192.png +0 -0
- package/example/public/logo512.png +0 -0
- package/example/public/manifest.json +25 -0
- package/example/public/robots.txt +3 -0
- package/example/src/App.tsx +41 -0
- package/example/src/components/Draggable.tsx +46 -0
- package/example/src/components/Gestures.tsx +151 -0
- package/example/src/components/Interpolation.tsx +21 -0
- package/example/src/components/Loop.tsx +48 -0
- package/example/src/components/MountedBlock.tsx +25 -0
- package/example/src/components/MouseMove.tsx +59 -0
- package/example/src/components/MultistageTransition.tsx +34 -0
- package/example/src/components/Scroll.tsx +39 -0
- package/example/src/components/ScrollableBlock.tsx +27 -0
- package/example/src/components/SnapTo.tsx +55 -0
- package/example/src/components/TransitionBlock.tsx +37 -0
- package/example/src/components/Wheel.tsx +39 -0
- package/example/src/components/index.ts +18 -0
- package/example/src/components/svgLine.tsx +48 -0
- package/example/src/components/useAnimatedValue.tsx +57 -0
- package/example/src/components/useMountedValue.tsx +62 -0
- package/example/src/index.css +8 -0
- package/example/src/index.tsx +16 -0
- package/example/tsconfig.json +26 -0
- package/package.json +48 -48
- package/{rollup.config.js → rollup.config.mjs} +18 -18
- package/src/animation/core/controllers/Animation.ts +27 -0
- package/src/animation/core/controllers/FluidValue.ts +97 -0
- package/src/animation/core/controllers/RequestAnimationFrame.ts +13 -0
- package/src/animation/core/controllers/SpringAnimation.ts +218 -0
- package/src/animation/core/controllers/TimingAnimation.ts +152 -0
- package/src/animation/core/easing/Bezier.ts +146 -0
- package/src/animation/core/easing/Easing.ts +132 -0
- package/src/animation/core/helpers/camelCaseToKebabCase.ts +10 -0
- package/src/animation/core/helpers/getCleanProps.ts +16 -0
- package/src/animation/core/helpers/getCssValue.ts +60 -0
- package/src/animation/core/helpers/index.ts +5 -0
- package/src/animation/core/helpers/isDefined.ts +14 -0
- package/src/animation/core/helpers/isFluidValue.ts +11 -0
- package/src/animation/core/index.ts +16 -0
- package/src/animation/core/interpolation/Colors.ts +232 -0
- package/src/animation/core/interpolation/Interpolation.ts +395 -0
- package/src/animation/core/interpolation/__tests__/Colors.test.tsx +35 -0
- package/src/animation/core/react/fluid.ts +197 -0
- package/src/animation/core/react/makeFluid.ts +294 -0
- package/src/animation/core/react/transforms.ts +90 -0
- package/src/animation/core/react/useFluidValue.ts +43 -0
- package/src/animation/core/react/useMount.ts +58 -0
- package/src/animation/core/types/animation.d.ts +56 -0
- package/src/animation/core/types/common.d.ts +4 -0
- package/src/animation/core/types/fluid.d.ts +38 -0
- package/src/animation/{animationType.ts → lib/animationType.ts} +17 -17
- package/src/animation/{getInitialConfig.ts → lib/getInitialConfig.ts} +61 -61
- package/src/animation/lib/index.ts +12 -0
- package/src/animation/{interpolation.ts → lib/interpolation.ts} +47 -48
- package/src/animation/{modules → lib/modules}/AnimatedBlock.ts +8 -8
- package/src/animation/{modules → lib/modules}/AnimatedImage.ts +8 -8
- package/src/animation/{modules → lib/modules}/AnimatedInline.ts +8 -8
- package/src/animation/lib/modules/MountedBlock.tsx +51 -0
- package/src/animation/{modules → lib/modules}/ScrollableBlock.tsx +68 -69
- package/src/animation/{modules → lib/modules}/TransitionBlock.tsx +28 -29
- package/src/animation/{modules → lib/modules}/index.ts +6 -6
- package/src/animation/{useAnimatedValue.ts → lib/useAnimatedValue.ts} +60 -71
- package/src/animation/{useMountedValue.ts → lib/useMountedValue.ts} +18 -19
- package/src/gestures/controllers/DragGesture.ts +178 -177
- package/src/gestures/controllers/Gesture.ts +54 -54
- package/src/gestures/controllers/MouseMoveGesture.ts +111 -111
- package/src/gestures/controllers/ScrollGesture.ts +107 -107
- package/src/gestures/controllers/WheelGesture.ts +123 -123
- package/src/gestures/controllers/index.ts +4 -4
- package/src/gestures/{eventAttacher.ts → helpers/eventAttacher.ts} +67 -67
- package/src/gestures/helpers/index.ts +1 -0
- package/src/gestures/{math.ts → helpers/math.ts} +120 -120
- package/src/gestures/{withDefault.ts → helpers/withDefault.ts} +3 -3
- package/src/gestures/hooks/index.ts +5 -5
- package/src/gestures/hooks/useDrag.ts +14 -14
- package/src/gestures/hooks/useGesture.ts +38 -38
- package/src/gestures/hooks/useMouseMove.ts +11 -11
- package/src/gestures/hooks/useRecognizer.ts +59 -59
- package/src/gestures/hooks/useScroll.ts +11 -11
- package/src/gestures/hooks/useWheel.ts +11 -11
- package/src/gestures/{types.ts → types/index.d.ts} +49 -49
- package/src/hooks/index.ts +3 -3
- package/src/hooks/useMeasure.ts +132 -133
- package/src/hooks/useOutsideClick.ts +36 -36
- package/src/hooks/useWindowDimension.ts +58 -59
- package/src/index.ts +42 -5
- package/src/utils/delay.ts +9 -9
- package/src/utils/index.ts +1 -2
- package/tsconfig.json +24 -25
- package/src/animation/index.ts +0 -10
- package/src/animation/modules/MountedBlock.tsx +0 -25
- package/src/gestures/index.ts +0 -2
- package/src/utils/isDefined.ts +0 -4
package/src/utils/delay.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @param { number } ms - number of milliseconds to delay code execution
|
|
3
|
-
* @returns Promise
|
|
4
|
-
*/
|
|
5
|
-
export function delay(ms: number) {
|
|
6
|
-
return new Promise((resolve) => {
|
|
7
|
-
setTimeout(() => resolve(null), ms);
|
|
8
|
-
});
|
|
9
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* @param { number } ms - number of milliseconds to delay code execution
|
|
3
|
+
* @returns Promise
|
|
4
|
+
*/
|
|
5
|
+
export function delay(ms: number) {
|
|
6
|
+
return new Promise((resolve) => {
|
|
7
|
+
setTimeout(() => resolve(null), ms);
|
|
8
|
+
});
|
|
9
|
+
}
|
package/src/utils/index.ts
CHANGED
|
@@ -1,2 +1 @@
|
|
|
1
|
-
export * from './
|
|
2
|
-
export * from './delay';
|
|
1
|
+
export * from './delay';
|
package/tsconfig.json
CHANGED
|
@@ -1,25 +1,24 @@
|
|
|
1
|
-
{
|
|
2
|
-
"compilerOptions": {
|
|
3
|
-
"outDir": "dist",
|
|
4
|
-
"module": "esnext",
|
|
5
|
-
"target": "es5",
|
|
6
|
-
"lib": ["es6", "dom", "es2016", "es2017", "es2019"],
|
|
7
|
-
"downlevelIteration": true,
|
|
8
|
-
"sourceMap": true,
|
|
9
|
-
"allowJs": false,
|
|
10
|
-
"jsx": "react",
|
|
11
|
-
"declaration": true,
|
|
12
|
-
"moduleResolution": "node",
|
|
13
|
-
"forceConsistentCasingInFileNames": true,
|
|
14
|
-
"noImplicitReturns": true,
|
|
15
|
-
"noImplicitThis": true,
|
|
16
|
-
"noImplicitAny": true,
|
|
17
|
-
"strictNullChecks": true,
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
"
|
|
24
|
-
|
|
25
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"outDir": "dist",
|
|
4
|
+
"module": "esnext",
|
|
5
|
+
"target": "es5",
|
|
6
|
+
"lib": ["es6", "dom", "es2016", "es2017", "es2019"],
|
|
7
|
+
"downlevelIteration": true,
|
|
8
|
+
"sourceMap": true,
|
|
9
|
+
"allowJs": false,
|
|
10
|
+
"jsx": "react-jsx",
|
|
11
|
+
"declaration": true,
|
|
12
|
+
"moduleResolution": "node",
|
|
13
|
+
"forceConsistentCasingInFileNames": true,
|
|
14
|
+
"noImplicitReturns": true,
|
|
15
|
+
"noImplicitThis": true,
|
|
16
|
+
"noImplicitAny": true,
|
|
17
|
+
"strictNullChecks": true,
|
|
18
|
+
"noUnusedLocals": true,
|
|
19
|
+
"noUnusedParameters": true,
|
|
20
|
+
"types": ["resize-observer-browser", "node", "@types/jest"]
|
|
21
|
+
},
|
|
22
|
+
"include": ["src"],
|
|
23
|
+
"exclude": ["node_modules", "dist", "example", "rollup.config.js"]
|
|
24
|
+
}
|
package/src/animation/index.ts
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
export * from './interpolation';
|
|
2
|
-
export * from './modules';
|
|
3
|
-
export {
|
|
4
|
-
useAnimatedValue,
|
|
5
|
-
ValueType,
|
|
6
|
-
UseAnimatedValueConfig,
|
|
7
|
-
} from './useAnimatedValue';
|
|
8
|
-
export { useMountedValue } from './useMountedValue';
|
|
9
|
-
export * from './animationType';
|
|
10
|
-
export * from './modules';
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { FluidValue } from '@raidipesh78/re-motion';
|
|
3
|
-
import { useMountedValue, UseMountedValueConfig } from '../useMountedValue';
|
|
4
|
-
|
|
5
|
-
interface MountedBlockProps {
|
|
6
|
-
state: boolean;
|
|
7
|
-
children: (animation: { value: FluidValue }) => React.ReactNode;
|
|
8
|
-
config: UseMountedValueConfig;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* MountedBlock - Higher order component which handles mounting and unmounting of a component.
|
|
13
|
-
* @prop { boolean } state - Boolean indicating the component should mount or unmount.
|
|
14
|
-
* @prop { function } children - Child as a function with `AnimatedValue` on `.value` property.
|
|
15
|
-
* @prop { UseMountedValueConfig } config - Animation configuration.
|
|
16
|
-
*/
|
|
17
|
-
export const MountedBlock = ({
|
|
18
|
-
state,
|
|
19
|
-
children,
|
|
20
|
-
config,
|
|
21
|
-
}: MountedBlockProps) => {
|
|
22
|
-
const open = useMountedValue(state, config);
|
|
23
|
-
|
|
24
|
-
return <>{open((animation, mounted) => mounted && children(animation))}</>;
|
|
25
|
-
};
|
package/src/gestures/index.ts
DELETED
package/src/utils/isDefined.ts
DELETED