Fix issue from rebase and introduce gesture interaction example

packages/drawer/example/App.js

@@ -1,14 +1,19 @@
 import * as React from 'react';
-import Expo from 'expo';
 import { FlatList } from 'react-native';
 import { createSwitchNavigator, createStackNavigator } from 'react-navigation';
-import { ListSection, Divider } from 'react-native-paper';
+import { List, Divider } from 'react-native-paper';
 import SimpleDrawer from './src/SimpleDrawer';
 import StyledDrawer from './src/StyledDrawer';
+import GestureInteraction from './src/GestureInteraction';
 
 const data = [
   { component: SimpleDrawer, title: 'Simple', routeName: 'SimpleDrawer' },
   { component: StyledDrawer, title: 'Styled', routeName: 'StyledDrawer' },
+  {
+    component: GestureInteraction,
+    title: 'Gesture Interaction',
+    routeName: 'GestureInteraction',
+  },
 ];
 
 class Home extends React.Component {
@@ -17,8 +22,9 @@ class Home extends React.Component {
   };
 
   _renderItem = ({ item }) => (
-    <ListSection.Item
+    <List.Item
       title={item.title}
+      style={{ backgroundColor: '#fff' }}
       onPress={() => this.props.navigation.navigate(item.routeName)}
     />
   );
@@ -37,7 +43,7 @@ class Home extends React.Component {
   }
 }
 
-const App = createSwitchNavigator({
+export default createSwitchNavigator({
   Home: createStackNavigator({ Home }),
   ...data.reduce((acc, it) => {
     acc[it.routeName] = {
@@ -50,5 +56,3 @@ const App = createSwitchNavigator({
     return acc;
   }, {}),
 });
-
-Expo.registerRootComponent(App);

packages/drawer/example/app.json

@@ -3,7 +3,7 @@
     "name": "React Navigation Drawer Example",
     "description": "Demonstrates the various capabilities of react-navigation-drawer",
     "slug": "react-navigation-drawer-demo",
-    "sdkVersion": "27.0.0",
+    "sdkVersion": "30.0.0",
     "version": "1.0.0",
     "primaryColor": "#2196f3",
     "packagerOpts": {

packages/drawer/example/package.json

@@ -2,19 +2,22 @@
   "name": "drawerexample",
   "version": "0.0.1",
   "private": true,
+  "main": "node_modules/expo/AppEntry.js",
   "scripts": {
-    "start": "react-native-scripts start",
-    "android": "react-native-scripts android",
-    "ios": "react-native-scripts ios"
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "eject": "expo eject",
+    "test": "node ./node_modules/jest/bin/jest.js --watchAll"
   },
   "dependencies": {
-    "expo": "~27.0.0",
+    "expo": "~30.0.0",
     "hoist-non-react-statics": "^2.5.0",
     "prop-types": "^15.6.0",
     "react": "16.3.1",
     "react-native": "~0.55.0",
-    "react-native-paper": "2.0.0-alpha.4",
-    "react-navigation": "^2.0.1"
+    "react-native-paper": "2.0.0",
+    "react-navigation": "^2.14.2"
   },
   "devDependencies": {
     "babel-plugin-module-resolver": "^3.0.0",
@@ -22,7 +25,6 @@
     "glob-to-regexp": "^0.3.0",
     "react-native-scripts": "1.8.1"
   },
-  "main": "App.js",
   "resolutions": {
     "**/prop-types": "15.6.0",
     "**/react-lifecycles-compat": "3.0.4",

packages/drawer/example/src/GestureInteraction.js

@@ -0,0 +1,82 @@
+import React from 'react';
+import { Button, WebView, View } from 'react-native';
+import { MapView } from 'expo';
+import { withNavigation } from 'react-navigation';
+import { createDrawerNavigator } from 'react-navigation-drawer';
+import { NativeViewGestureHandler } from 'react-native-gesture-handler';
+
+@withNavigation
+class ContainerWithButtons extends React.Component {
+  render() {
+    return (
+      <View style={{ flex: 1 }}>
+        {this.props.children}
+        <View
+          style={{
+            position: 'absolute',
+            paddingBottom: 30,
+            bottom: 0,
+            paddingTop: 10,
+            paddingHorizontal: 10,
+            left: 0,
+            flexDirection: 'row',
+            right: 0,
+            backgroundColor: 'rgba(255,255,255,0.7)',
+            justifyContent: 'space-between',
+          }}
+        >
+          <Button
+            title="Open drawer"
+            onPress={() => this.props.navigation.openDrawer()}
+          />
+          <Button
+            title="Go back"
+            onPress={() => this.props.navigation.navigate('Home')}
+          />
+        </View>
+      </View>
+    );
+  }
+}
+
+const MapScreen = () => (
+  <ContainerWithButtons>
+    <NativeViewGestureHandler>
+      <MapView style={{ flex: 1 }} />
+    </NativeViewGestureHandler>
+  </ContainerWithButtons>
+);
+
+MapScreen.navigationOptions = {
+  title: 'MapView',
+};
+
+const WebViewScreen = () => (
+  <ContainerWithButtons>
+    <NativeViewGestureHandler>
+      <WebView
+        style={{ flex: 1 }}
+        source={{ uri: 'https://news.google.com' }}
+      />
+    </NativeViewGestureHandler>
+  </ContainerWithButtons>
+);
+
+WebViewScreen.navigationOptions = {
+  title: 'WebView',
+};
+
+const DrawerExample = createDrawerNavigator(
+  {
+    Map: MapScreen,
+    Web: WebViewScreen,
+  },
+  {
+    edgeWidth: 150,
+    contentOptions: {
+      activeTintColor: '#e91e63',
+    },
+  }
+);
+
+export default DrawerExample;

packages/drawer/example/src/StyledDrawer.js

@@ -15,7 +15,7 @@ const MyNavScreen = ({ navigation, banner }) => (
         onPress={() => navigation.navigate('Email')}
         title="Open other screen"
       />
-      <Button onPress={() => navigation.goBack(null)} title="Go back" />
+      <Button onPress={() => navigation.navigate('Home')} title="Go back" />
     </SafeAreaView>
     <StatusBar barStyle="default" />
   </ScrollView>

packages/drawer/src/views/DrawerView.js

@@ -1,8 +1,6 @@
 import React from 'react';
 import { Dimensions } from 'react-native';
 import { SceneView } from 'react-navigation';
-import { DrawerLayout } from 'react-native-gesture-handler';
-
 import DrawerActions from '../routers/DrawerActions';
 import DrawerLayout from './DrawerLayout';
 import DrawerSidebar from './DrawerSidebar';