Initial commit after extracting from react-navigation

packages/drawer/example/.babelrc

@@ -0,0 +1,12 @@
+{
+  "presets": [
+    "expo"
+  ],
+  "plugins": [
+    ["module-resolver", {
+      "alias": {
+        "react-navigation-drawer": "../src"
+      }
+    }]
+  ]
+}

packages/drawer/example/.buckconfig

@@ -0,0 +1,6 @@
+
+[android]
+  target = Google Inc.:Google APIs:23
+
+[maven_repositories]
+  central = https://repo1.maven.org/maven2

packages/drawer/example/.eslintrc

@@ -0,0 +1,11 @@
+{
+  "extends": '../.eslintrc',
+
+  "settings": {
+    "import/core-modules": [ "expo", "react-navigation-drawer" ]
+  },
+
+  "rules": {
+    "react/prop-types": "off",
+  }
+}

packages/drawer/example/.watchmanconfig

@@ -0,0 +1 @@
+{}

packages/drawer/example/App.js

@@ -0,0 +1,52 @@
+import * as React from 'react';
+import Expo from 'expo';
+import { FlatList } from 'react-native';
+import { createStackNavigator } from 'react-navigation';
+import { ListSection, Divider } from 'react-native-paper';
+import SimpleDrawer from './src/SimpleDrawer';
+
+const data = [
+  { component: SimpleDrawer, title: 'Simple', routeName: 'SimpleDrawer' },
+];
+
+class Home extends React.Component {
+  static navigationOptions = {
+    title: 'Examples',
+  };
+
+  _renderItem = ({ item }) => (
+    <ListSection.Item
+      title={item.title}
+      onPress={() => this.props.navigation.navigate(item.routeName)}
+    />
+  );
+
+  _keyExtractor = item => item.routeName;
+
+  render() {
+    return (
+      <FlatList
+        ItemSeparatorComponent={Divider}
+        renderItem={this._renderItem}
+        keyExtractor={this._keyExtractor}
+        data={data}
+      />
+    );
+  }
+}
+
+const App = createStackNavigator({
+  Home,
+  ...data.reduce((acc, it) => {
+    acc[it.routeName] = {
+      screen: it.component,
+      navigationOptions: {
+        title: it.title,
+      },
+    };
+
+    return acc;
+  }, {}),
+});
+
+Expo.registerRootComponent(App);

packages/drawer/example/README.md

@@ -0,0 +1,8 @@
+## Run the example
+
+- [View it with Expo](https://expo.io/@satya164/react-navigation-tabs-demos)
+- Run the example locally
+  + Clone the repository and `cd` to this directory
+  + Run `yarn` to install the dependencies
+  + Run `yarn start` to start the packager
+  + Scan the QR Code with the Expo app

packages/drawer/example/app.json

@@ -0,0 +1,17 @@
+{
+  "expo": {
+    "name": "React Navigation Material Bottom Tabs Example",
+    "description": "Demonstrates the various capabilities of react-navigation-drawer",
+    "slug": "react-navigation-drawer-demo",
+    "sdkVersion": "27.0.0",
+    "version": "1.0.0",
+    "primaryColor": "#2196f3",
+    "packagerOpts": {
+      "assetExts": [
+        "ttf"
+      ],
+      "config": "./rn-cli.config.js",
+      "projectRoots": ""
+    }
+  }
+}

packages/drawer/example/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "drawerexample",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "start": "react-native-scripts start",
+    "android": "react-native-scripts android",
+    "ios": "react-native-scripts ios"
+  },
+  "dependencies": {
+    "expo": "~27.0.0",
+    "hoist-non-react-statics": "^2.5.0",
+    "prop-types": "^15.6.0",
+    "react": "16.3.1",
+    "react-native": "~0.55.0",
+    "react-navigation": "^2.0.1",
+    "react-native-paper": "2.0.0-alpha.4"
+  },
+  "devDependencies": {
+    "babel-plugin-module-resolver": "^3.0.0",
+    "babel-preset-expo": "^4.0.0",
+    "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",
+    "**/hoist-non-react-statics": "2.5.0"
+  }
+}

packages/drawer/example/rn-cli.config.js

@@ -0,0 +1,21 @@
+/* eslint-disable import/no-commonjs */
+
+const path = require('path');
+const glob = require('glob-to-regexp');
+const blacklist = require('metro/src/blacklist');
+const pak = require('../package.json');
+
+const dependencies = Object.keys(pak.dependencies);
+const peerDependencies = Object.keys(pak.peerDependencies);
+
+module.exports = {
+  getProjectRoots() {
+    return [__dirname, path.resolve(__dirname, '..')];
+  },
+  getProvidesModuleNodeModules() {
+    return [...dependencies, ...peerDependencies];
+  },
+  getBlacklistRE() {
+    return blacklist([glob(`${path.resolve(__dirname, '..')}/node_modules/*`)]);
+  },
+};

packages/drawer/example/src/SimpleDrawer.js

@@ -0,0 +1,93 @@
+import React from 'react';
+import { Button, ScrollView, StatusBar, Text } from 'react-native';
+import { createStackNavigator, SafeAreaView } from 'react-navigation';
+import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
+import { createDrawerNavigator } from 'react-navigation-drawer';
+
+const SampleText = ({ children }) => <Text>{children}</Text>;
+
+const MyNavScreen = ({ navigation, banner }) => (
+  <ScrollView>
+    <SafeAreaView forceInset={{ top: 'always' }}>
+      <SampleText>{banner}</SampleText>
+      <Button onPress={() => navigation.openDrawer()} title="Open drawer" />
+      <Button
+        onPress={() => navigation.navigate('Email')}
+        title="Open other screen"
+      />
+      <Button onPress={() => navigation.goBack(null)} title="Go back" />
+    </SafeAreaView>
+    <StatusBar barStyle="default" />
+  </ScrollView>
+);
+
+const InboxScreen = ({ navigation }) => (
+  <MyNavScreen banner={'Inbox Screen'} navigation={navigation} />
+);
+InboxScreen.navigationOptions = {
+  headerTitle: 'Inbox',
+};
+
+const EmailScreen = ({ navigation }) => (
+  <MyNavScreen banner={'Email Screen'} navigation={navigation} />
+);
+
+const DraftsScreen = ({ navigation }) => (
+  <MyNavScreen banner={'Drafts Screen'} navigation={navigation} />
+);
+DraftsScreen.navigationOptions = {
+  headerTitle: 'Drafts',
+};
+
+const InboxStack = createStackNavigator({
+  Inbox: { screen: InboxScreen },
+  Email: { screen: EmailScreen },
+});
+
+InboxStack.navigationOptions = {
+  drawerLabel: 'Inbox',
+  drawerIcon: ({ tintColor }) => (
+    <MaterialIcons
+      name="move-to-inbox"
+      size={24}
+      style={{ color: tintColor }}
+    />
+  ),
+};
+
+const DraftsStack = createStackNavigator({
+  Drafts: { screen: DraftsScreen },
+  Email: { screen: EmailScreen },
+});
+
+DraftsStack.navigationOptions = {
+  drawerLabel: 'Drafts',
+  drawerIcon: ({ tintColor }) => (
+    <MaterialIcons name="drafts" size={24} style={{ color: tintColor }} />
+  ),
+};
+
+const DrawerExample = createDrawerNavigator(
+  {
+    Inbox: {
+      path: '/',
+      screen: InboxStack,
+    },
+    Drafts: {
+      path: '/sent',
+      screen: DraftsStack,
+    },
+  },
+  {
+    initialRouteName: 'Drafts',
+    contentOptions: {
+      activeTintColor: '#e91e63',
+    },
+  }
+);
+
+DrawerExample.navigationOptions = {
+  header: null,
+};
+
+export default DrawerExample;