aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components/animations/slide_animation.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/instant/src/components/animations/slide_animation.tsx')
-rw-r--r--packages/instant/src/components/animations/slide_animation.tsx23
1 files changed, 23 insertions, 0 deletions
diff --git a/packages/instant/src/components/animations/slide_animation.tsx b/packages/instant/src/components/animations/slide_animation.tsx
new file mode 100644
index 000000000..4124e50c3
--- /dev/null
+++ b/packages/instant/src/components/animations/slide_animation.tsx
@@ -0,0 +1,23 @@
+import * as React from 'react';
+
+import { PositionAnimation, PositionAnimationSettings } from './position_animation';
+
+export type SlideAnimationState = 'slidIn' | 'slidOut' | 'none';
+export interface SlideAnimationProps {
+ position: string;
+ animationState: SlideAnimationState;
+ slideIn: PositionAnimationSettings;
+ slideOut: PositionAnimationSettings;
+}
+
+export const SlideAnimation: React.StatelessComponent<SlideAnimationProps> = props => {
+ if (props.animationState === 'none') {
+ return <React.Fragment>{props.children}</React.Fragment>;
+ }
+ const propsToUse = props.animationState === 'slidIn' ? props.slideIn : props.slideOut;
+ return (
+ <PositionAnimation position={props.position} {...propsToUse}>
+ {props.children}
+ </PositionAnimation>
+ );
+};