From 2df57d31804a80f19323e9d371dbf1f47539264c Mon Sep 17 00:00:00 2001
From: Yurii Kliuiev <yurii.kliuiev@gmail.com>
Date: Tue, 10 Nov 2020 21:33:52 +0200
Subject: [PATCH] feat: explicit animation type

Closes #21
---
 README.md                    | 2 ++
 example/src/App.tsx          | 8 ++++++++
 src/Date/DatePickerModal.tsx | 5 +++--
 3 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 1d3388e7..7ed137b2 100644
--- a/README.md
+++ b/README.md
@@ -67,6 +67,7 @@ function SingleDatePage() {
         onConfirm={onChange}
         saveLabel={'Save'} // optional
         label={'Select period'} // optional
+        animationType={'slide'} // optional
       />
       <Button onPress={()=> setVisible(true)}>
         Pick date
@@ -107,6 +108,7 @@ export default function RangeDatePage() {
           label={'Select period'} // optional
           startLabel={'From'} // optional
           endLabel={'To'} // optional
+          animationType={'slide'} // optional
       />
       <Button onPress={()=> setVisible(true)}>
         Pick range
diff --git a/example/src/App.tsx b/example/src/App.tsx
index ea8fdfd6..e75fe83a 100644
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -106,6 +106,10 @@ function App({
           label={'Select period'} // optional
           startLabel={'From'} // optional
           endLabel={'To'} // optional
+          animationType={Platform.select({
+            web: 'none',
+            default: 'slide',
+          })} // optional
         />
         <DatePickerModal
           mode="single"
@@ -115,6 +119,10 @@ function App({
           onConfirm={onChangeSingle}
           saveLabel={'Save'} // optional
           label={'Select date'} // optional
+          animationType={Platform.select({
+            web: 'none',
+            default: 'slide',
+          })} // optional
         />
 
         <TimePickerModal
diff --git a/src/Date/DatePickerModal.tsx b/src/Date/DatePickerModal.tsx
index d3173541..54a7f595 100644
--- a/src/Date/DatePickerModal.tsx
+++ b/src/Date/DatePickerModal.tsx
@@ -26,6 +26,7 @@ interface DatePickerModalProps extends HeaderPickProps, BaseCalendarProps {
   visible: boolean
   onDismiss: () => any
   inputFormat?: string
+  animationType?: 'slide' | 'fade' | 'none'
 }
 
 export type LocalState = {
@@ -57,7 +58,7 @@ export function DatePickerModal(
 ) {
   const theme = useTheme()
   const dimensions = useWindowDimensions()
-  const { visible, onDismiss, mode, onChange, onConfirm } = props
+  const { visible, onDismiss, mode, onChange, onConfirm, animationType } = props
   const anyProps = props as any
 
   // use local state to add only onConfirm state changes
@@ -101,7 +102,7 @@ export function DatePickerModal(
 
   return (
     <Modal
-      animationType="slide"
+      animationType={animationType}
       transparent={true}
       visible={visible}
       onRequestClose={onDismiss}