feat: update example app

Example/.gitattributes

@@ -1 +1,3 @@
-*.pbxproj -text
+# Windows files should use crlf line endings
+# https://help.github.com/articles/dealing-with-line-endings/
+*.bat text eol=crlf

Example/.prettierrc.js

@@ -0,0 +1,6 @@
+module.exports = {
+  bracketSpacing: false,
+  jsxBracketSameLine: true,
+  singleQuote: true,
+  trailingComma: 'all',
+};

Example/App.tsx

@@ -0,0 +1,143 @@
+import React from 'react';
+import {ScrollView, SafeAreaView, StyleSheet, Text} from 'react-native';
+import {enableScreens} from 'react-native-screens';
+import {NavigationContainer} from '@react-navigation/native';
+import {StackNavigationProp} from '@react-navigation/stack';
+import {createNativeStackNavigator} from 'react-native-screens/native-stack';
+
+import {MenuItem} from './src/shared';
+
+import SimpleNativeStack from './src/screens/SimpleNativeStack';
+import StackPresentation from './src/screens/StackPresentation';
+import HeaderOptions from './src/screens/HeaderOptions';
+import StatusBar from './src/screens/StatusBar';
+import Animations from './src/screens/Animations';
+import BottomTabsAndStack from './src/screens/BottomTabsAndStack';
+import StackReactNavigation4 from './src/screens/StackReactNavigation4';
+import Modals from './src/screens/Modals';
+
+enableScreens();
+
+const SCREENS: Record<
+  string,
+  {
+    title: string;
+    component: () => JSX.Element;
+    type: 'example' | 'playground';
+  }
+> = {
+  SimpleNativeStack: {
+    title: 'Simple Native Stack',
+    component: SimpleNativeStack,
+    type: 'example',
+  },
+  StackPresentation: {
+    title: 'Stack Presentation',
+    component: StackPresentation,
+    type: 'example',
+  },
+  BottomTabsAndStack: {
+    title: 'Bottom tabs and native stack',
+    component: BottomTabsAndStack,
+    type: 'example',
+  },
+  Modals: {
+    title: 'Modals',
+    component: Modals,
+    type: 'example',
+  },
+  StackReactNavigation4: {
+    title: 'Stack react-navigation v4',
+    // @ts-ignore react-navigation v4 AppNavigator type
+    component: StackReactNavigation4,
+    type: 'example',
+  },
+  HeaderOptions: {
+    title: 'Header Options',
+    component: HeaderOptions,
+    type: 'playground',
+  },
+  StatusBar: {
+    title: 'Status bar (iOS)',
+    component: StatusBar,
+    type: 'playground',
+  },
+  Animations: {
+    title: 'Animations',
+    component: Animations,
+    type: 'playground',
+  },
+};
+
+type RootStackParamList = {
+  Main: undefined;
+} & {
+  [P in keyof typeof SCREENS]: undefined;
+};
+
+const Stack = createNativeStackNavigator<RootStackParamList>();
+
+interface MainScreenProps {
+  navigation: StackNavigationProp<RootStackParamList, 'Main'>;
+}
+
+const MainScreen = ({navigation}: MainScreenProps): JSX.Element => (
+  <ScrollView>
+    <SafeAreaView>
+      <Text style={styles.label}>Examples</Text>
+      {Object.keys(SCREENS)
+        .filter((name) => SCREENS[name].type === 'example')
+        .map((name) => (
+          <MenuItem
+            key={name}
+            title={SCREENS[name].title}
+            onPress={() => navigation.navigate(name)}
+          />
+        ))}
+      <Text style={styles.label}>Playgrounds</Text>
+      {Object.keys(SCREENS)
+        .filter((name) => SCREENS[name].type === 'playground')
+        .map((name) => (
+          <MenuItem
+            key={name}
+            title={SCREENS[name].title}
+            onPress={() => navigation.navigate(name)}
+          />
+        ))}
+    </SafeAreaView>
+  </ScrollView>
+);
+
+const ExampleApp = (): JSX.Element => (
+  <NavigationContainer>
+    <Stack.Navigator
+      screenOptions={{
+        statusBarStyle: 'dark',
+      }}>
+      <Stack.Screen
+        name="Main"
+        options={{title: '📱 React Native Screens Examples'}}
+        component={MainScreen}
+      />
+      {Object.keys(SCREENS).map((name) => (
+        <Stack.Screen
+          key={name}
+          name={name}
+          getComponent={() => SCREENS[name].component}
+          options={{headerShown: false}}
+        />
+      ))}
+    </Stack.Navigator>
+  </NavigationContainer>
+);
+
+const styles = StyleSheet.create({
+  label: {
+    fontSize: 15,
+    color: 'black',
+    margin: 10,
+    marginTop: 15,
+  },
+});
+
+export default ExampleApp;

Example/android/build.gradle

@@ -6,7 +6,7 @@ buildscript {
         jcenter()
     }
     dependencies {
-        classpath("com.android.tools.build:gradle:3.5.3")
+        classpath('com.android.tools.build:gradle:4.1.0')
     }
 }
 

Example/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,6 @@
+#Thu Feb 18 09:11:40 CET 2021
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-6.2-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.7-all.zip

Example/android/gradlew.bat

@@ -40,7 +40,7 @@ if defined JAVA_HOME goto findJavaFromJavaHome
 
 set JAVA_EXE=java.exe
 %JAVA_EXE% -version >NUL 2>&1
-if "%ERRORLEVEL%" == "0" goto init
+if "%ERRORLEVEL%" == "0" goto execute
 
 echo.
 echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
@@ -54,7 +54,7 @@ goto fail
 set JAVA_HOME=%JAVA_HOME:"=%
 set JAVA_EXE=%JAVA_HOME%/bin/java.exe
 
-if exist "%JAVA_EXE%" goto init
+if exist "%JAVA_EXE%" goto execute
 
 echo.
 echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
@@ -64,28 +64,13 @@ echo location of your Java installation.
 
 goto fail
 
-:init
-@rem Get command-line arguments, handling Windows variants
-
-if not "%OS%" == "Windows_NT" goto win9xME_args
-
-:win9xME_args
-@rem Slurp the command line arguments.
-set CMD_LINE_ARGS=
-set _SKIP=2
-
-:win9xME_args_slurp
-if "x%~1" == "x" goto execute
-
-set CMD_LINE_ARGS=%*
-
 :execute
 @rem Setup the command line
 
 set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
 
 @rem Execute Gradle
-"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
 
 :end
 @rem End local scope for the variables with windows NT shell

Example/babel.config.js

@@ -1,16 +1,11 @@
 module.exports = {
   presets: ['babel-preset-expo'],
   plugins: [
-    '@babel/plugin-transform-modules-commonjs',
     [
       'module-resolver',
       {
         alias: {
-          'react-native-screens': '../src',
-          'react': './node_modules/react',
-          'react-native': './node_modules/react-native',
-          '@babel': './node_modules/@babel',
-          '@react-navigation/native': './node_modules/@react-navigation/native/src',
+          'react-native-screens': '../src'
         },
       },
     ],

Example/ios/Podfile

@@ -8,13 +8,17 @@ target 'ScreensExample' do
 
   pod 'RNScreens', :path => '../../'
 
-  use_react_native!(:path => config["reactNativePath"])
+  use_react_native!(
+    :path => config[:reactNativePath],
+    # to enable hermes on iOS, change `false` to `true` and then install pods
+    :hermes_enabled => false
+  )
 
   # Enables Flipper.
   #
   # Note that if you have use_frameworks! enabled, Flipper will not work and
-  # you should disable these next few lines.
-  use_flipper!
+  # you should disable the next line.
+  use_flipper!()
   post_install do |installer|
     flipper_post_install(installer)
   end