Merge pull request #316 from SoyDiego/fix-modal-jump-on-open

Fixed Datepicker modal jump when is opened

Author: iM-GeeKy

src/Date/DatePickerModal.tsx

@@ -14,8 +14,8 @@ import DatePickerModalContent, {
   DatePickerModalContentRangeProps,
   DatePickerModalContentSingleProps,
 } from './DatePickerModalContent'
-import { useHeaderBackgroundColor, useHeaderColorIsLight } from '../utils'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
+import { useHeaderBackgroundColor } from '../utils'
 
 interface DatePickerModalProps {
   visible: boolean
@@ -66,10 +66,10 @@ export function DatePickerModal(
       default: 'slide',
     })
 
-  const isLight = useHeaderColorIsLight()
+  const isTransparent = presentationStyle === 'pageSheet' ? false : true
   const headerBackgroundColor = useHeaderBackgroundColor()
   const insets = useSafeAreaInsets()
-  const isTransparent = presentationStyle === 'pageSheet' ? false : true
+
   return (
     <View style={[StyleSheet.absoluteFill]} pointerEvents="box-none">
       <Modal
@@ -103,18 +103,20 @@ export function DatePickerModal(
                 dimensions.width > 650 ? styles.modalContentBig : null,
               ]}
             >
-              {disableStatusBar ? null : (
-                <StatusBar
-                  translucent={true}
-                  barStyle={isLight ? 'dark-content' : 'light-content'}
-                />
-              )}
               {disableStatusBarPadding ? null : (
                 <View
                   style={[
                     {
-                      height: insets.top,
-                      backgroundColor: headerBackgroundColor,
+                      height: Platform.select({
+                        ios: StatusBar.currentHeight,
+                        android: StatusBar.currentHeight,
+                        web: insets.top,
+                      }),
+                      backgroundColor: Platform.select({
+                        ios: theme.colors.primary,
+                        android: theme.colors.primary,
+                        web: headerBackgroundColor,
+                      }),
                     },
                   ]}
                 />