update Example to RN0.57

aksonov · Sep 24, 2018 · f51f469 · f51f469
1 parent bf478c2
commit f51f469
Show file tree

Hide file tree

Showing 7 changed files with 1,003 additions and 1,246 deletions.
diff --git a/examples/react-native/.babelrc.js b/examples/react-native/.babelrc.js
@@ -0,0 +1,3 @@
+module.exports = {
+  "extends": "./babel.config.js"
+};
diff --git a/examples/react-native/Example.js b/examples/react-native/Example.js
@@ -57,20 +57,19 @@ const getSceneStyle = () => ({
 const prefix = Platform.OS === 'android' ? 'mychat://mychat/' : 'mychat://';
 
 const transitionConfig = () => ({
-  screenInterpolator:
-    StackViewStyleInterpolator.forFadeFromBottomAndroid,
+  screenInterpolator: StackViewStyleInterpolator.forFadeFromBottomAndroid,
 });
 
 const Example = () => (
   <Router createReducer={reducerCreate} onStateChange={stateHandler} getSceneStyle={getSceneStyle} uriPrefix={prefix}>
     <Overlay key="overlay">
       <Modal key="modal" hideNavBar transitionConfig={transitionConfig}>
         <Lightbox key="lightbox">
-          <Stack key="root" titleStyle={{ alignSelf: 'center' }}>
+          <Stack key="root" titleStyle={{ alignSelf: 'center' }} hideNavBar>
             <Scene key="echo" back clone component={EchoView} getTitle={({ navigation }) => navigation.state.key} />
             <Scene key="launch" component={Launch} title="Launch" initial type={ActionConst.RESET} />
 
-            <Stack key="customNavBar" hideTabBar headerLayoutPreset='center'>
+            <Stack key="customNavBar" hideTabBar headerLayoutPreset="center">
               <Scene key="customNavBar1" title="CustomNavBar 1" navBar={CustomNavBar} component={CustomNavBarView} back />
               <Scene key="customNavBar2" title="CustomNavBar 2" navBar={CustomNavBar} component={CustomNavBarView} back />
               <Scene key="customNavBar3" title="Another CustomNavBar" navBar={CustomNavBar2} component={CustomNavBarView} back />
@@ -83,7 +82,19 @@ const Example = () => (
               <Scene key="home" component={Home} title="Replace" type={ActionConst.REPLACE} />
             </Stack>
 
-            <Drawer hideNavBar key="drawer" onExit={() => { console.log('Drawer closed') }} onEnter={() => { console.log('Drawer opened') }} contentComponent={DrawerContent} drawerImage={MenuIcon} drawerWidth={300}>
+            <Drawer
+              hideNavBar
+              key="drawer"
+              onExit={() => {
+                console.log('Drawer closed');
+              }}
+              onEnter={() => {
+                console.log('Drawer opened');
+              }}
+              contentComponent={DrawerContent}
+              drawerImage={MenuIcon}
+              drawerWidth={300}
+            >
               {/*
                 Wrapper Scene needed to fix a bug where the tabs would
                 reload as a modal ontop of itself
@@ -94,7 +105,9 @@ const Example = () => (
                   routeName="tabbar"
                   legacy
                   backToInitial
-                  onTabOnPress={() => { console.log('Back to initial and also print this') }}
+                  onTabOnPress={() => {
+                    console.log('Back to initial and also print this');
+                  }}
                   swipeEnabled
                   showLabel={false}
                   tabBarStyle={styles.tabBarStyle}
@@ -136,10 +149,19 @@ const Example = () => (
           <Scene key="demo_lightbox" component={DemoLightbox} />
         </Lightbox>
         <Scene key="error" component={ErrorModal} />
-        <Stack key="login" headerLayoutPreset='center' path="login/:data" titleStyle={{ alignSelf: 'center' }}>
+        <Stack key="login" headerLayoutPreset="center" path="login/:data" titleStyle={{ alignSelf: 'center' }}>
           <Scene key="loginModal" component={Login} title="Login" onExit={() => console.log('Login: onExit')} leftTitle="Cancel" onLeft={Actions.pop} />
-          <Scene key="loginModal2" component={Login2} title="Login2" onEnter={() => console.log('Login2: onEnter') } backTitle="Back" panHandlers={null} duration={1} />
-          <Scene key="loginModal3" hideNavBar component={Login3} title="Login3" onEnter={() => console.log('Login3: onEnter') } onExit={() => console.log('Login3: onExit')} panHandlers={null} duration={1} />
+          <Scene key="loginModal2" component={Login2} title="Login2" onEnter={() => console.log('Login2: onEnter')} backTitle="Back" panHandlers={null} duration={1} />
+          <Scene
+            key="loginModal3"
+            hideNavBar
+            component={Login3}
+            title="Login3"
+            onEnter={() => console.log('Login3: onEnter')}
+            onExit={() => console.log('Login3: onExit')}
+            panHandlers={null}
+            duration={1}
+          />
         </Stack>
       </Modal>
 

diff --git a/examples/react-native/babel.config.js b/examples/react-native/babel.config.js
@@ -1,8 +1,9 @@
 module.exports = {
   "presets": [
-    "babel-preset-react-native"
+    "module:metro-react-native-babel-preset"
   ],
   "plugins": [
-    ["@babel/plugin-proposal-decorators", { "legacy": true }]
+    ["@babel/plugin-proposal-decorators", { "legacy": true }],
+    "@babel/plugin-transform-runtime"
   ]
 }
diff --git a/examples/react-native/package.json b/examples/react-native/package.json
@@ -13,39 +13,37 @@
     "test": "jest",
     "postinstall": "node_modules/.bin/rnrf dedup"
   },
-  "resolutions": {
-    "*/@babel/cli": "7.0.0-beta.47",
-    "*/@babel/core": "7.0.0-beta.47",
-    "*/@babel/code-frame": "7.0.0-beta.47",
-    "*/@babel/generator": "7.0.0-beta.47",
-    "*/@babel/highlight": "7.0.0-beta.47"
-  },
   "dependencies": {
     "prop-types": "^15.6.2",
-    "react": "16.4.1",
-    "react-native": "0.56.0",
+    "react": "16.5.0",
+    "react-native": "0.57.1",
     "react-native-button": "^2.3.0",
     "react-native-message-bar": "^2.0.10",
     "react-native-router-flux": "file:../..",
     "react-native-router-flux-cli": "file:../../packages/react-native-router-flux-cli",
-    "react-navigation": "2.13.x",
-    "react-navigation-stack": "^0.4.0"
+    "react-native-screens": "^1.0.0-alpha.12",
+    "react-navigation": "2.16.x",
+    "react-navigation-deprecated-tab-navigator": "^1.3.0",
+    "react-navigation-stack": "^0.6.0"
   },
   "devDependencies": {
-    "@babel/code-frame": "7.0.0-beta.47",
-    "@babel/core": "7.0.0-beta.47",
-    "@babel/plugin-proposal-decorators": "7.0.0-beta.47",
+    "@babel/code-frame": "^7.0.0",
+    "@babel/core": "^7.1.0",
+    "@babel/plugin-proposal-decorators": "^7.1.0",
+    "@babel/plugin-transform-runtime": "^7.1.0",
+    "@babel/runtime": "^7.0.0",
     "autobind-decorator": "^2.1.0",
     "babel-core": "^7.0.0-0",
-    "babel-jest": "^23.4.0",
-    "babel-preset-react-native": "5.0.2",
-    "jest": "^23.4.1",
-    "react-test-renderer": "^16.4.2"
+    "babel-jest": "^23.6.0",
+    "jest": "^23.6.0",
+    "metro-react-native-babel-preset": "^0.45.0",
+    "react-test-renderer": "16.5.2",
+    "schedule": "0.4.0"
   },
   "jest": {
     "preset": "react-native",
     "transformIgnorePatterns": [
-      "node_modules/(?!(jest-)?react-native|react-navigation)"
+      "node_modules/(?!(jest-)?react-native|react-navigation|react-navigation-(tabs|drawer|deprecated-tab-navigator|stack))"
     ],
     "setupFiles": [
       "./test/setup.js"