Merge pull request GeekyAnts#2243 from GeekyAnts/revert-2100-deprecate/drawer

Revert "Removed Drawer from NativeBase"

Author: SupriyaKalghatgi

index.d.ts

@@ -685,7 +685,46 @@ declare module "native-base" {
 			color?: string;
 			inverse?: boolean;
 		}
-	
+		/**
+         * vendor react-native-drawer
+         */
+		interface DrawerStyles {
+			drawer?: ReactNative.ViewStyle | Array<ReactNative.ViewStyle>;
+			main?: ReactNative.ViewStyle | Array<ReactNative.ViewStyle>;
+			drawerOverlay?: ReactNative.ViewStyle | Array<ReactNative.ViewStyle>;
+			mainOverlay?: ReactNative.ViewStyle | Array<ReactNative.ViewStyle>;
+		}
+		interface Drawer {
+			acceptDoubleTap?: boolean;
+			acceptPan?: boolean;
+			acceptTap?: boolean;
+			captureGestures?: boolean;
+			children?: any;
+			open?: boolean;
+			closedDrawerOffset?: number;
+			content?: any;
+			deviceScreen?: ReactNative.ScaledSize;
+			disabled?: boolean;
+			initializeOpen?: boolean;
+			negotiatePan?: boolean;
+			onClose?: Function;
+			onCloseStart?: Function;
+			onOpen?: Function;
+			onOpenStart?: Function;
+			openDrawerOffset?: number;
+			openDrawerThreshold?: number;
+			panCloseMask?: number;
+			panOpenMask?: number;
+			panStartCompensation?: boolean;
+			relativeDrag?: boolean;
+			side?: "left" | "right";
+			styles?: DrawerStyles;
+			tapToClose?: boolean;
+			tweenDuration?: number;
+			tweenEasing?: string;
+			tweenHandler?: Function;
+			type?: "overlay" | "static" | "displace";
+		}
 		interface ScrollableTab {
             goToPage?: Function;
             activeTab?: number;
@@ -1049,6 +1088,10 @@ declare module "native-base" {
      */
 	export class ProgressBar extends React.Component<NativeBase.ProgressBar, any> {}
 	/**
+     * NativeBase.Drawer
+     */
+	export class Drawer extends React.Component<NativeBase.Drawer, any> {}
+	/**
      * NativeBase.ScrollableTab
      */
 	export class ScrollableTab extends React.Component<NativeBase.ScrollableTab, any> { }

package.json

@@ -39,6 +39,7 @@
     "native-base-shoutem-theme": "0.2.2",
     "print-message": "^2.1.0",
     "prop-types": "^15.5.10",
+    "react-native-drawer": "2.5.0",
     "react-native-easy-grid": "0.2.0",
     "react-native-keyboard-aware-scroll-view": "0.5.0",
     "react-native-vector-icons": "4.6.0",

src/basic/Drawer/index.js

@@ -0,0 +1,36 @@
+import React, { Component } from "react";
+import RNDrawer from "react-native-drawer";
+import PropTypes from "prop-types";
+
+export default class Drawer extends Component {
+	constructor(props) {
+		super(props);
+	}
+	render() {
+		return <RNDrawer ref={c => (this._root = c)} {...this.props} />;
+	}
+}
+
+Drawer.defaultProps = {
+	type: "overlay",
+	tapToClose: true,
+	openDrawerOffset: 0.2,
+	panCloseMask: 0.2,
+	closedDrawerOffset: 0,
+	styles: {
+		drawer: {
+			shadowColor: "#000000",
+			shadowOpacity: 0,
+			shadowRadius: 0,
+			elevation: 5,
+		},
+		mainOverlay: {
+			opacity: 0,
+			backgroundColor: "rgba(0, 0, 0, 0.8)",
+			elevation: 8,
+		},
+	},
+	tweenHandler: ratio => ({
+		mainOverlay: { opacity: ratio / 2 },
+	}),
+};

src/index.js

@@ -5,6 +5,7 @@ import { Col, Row, Grid } from "react-native-easy-grid";
 import setDefaultThemeStyle from "./init";
 import getTheme from "./theme/components";
 import variables from "./theme/variables/platform";
+import Drawer from "./basic/Drawer";
 import { SwipeRow } from "./basic/SwipeRow";
 import { Text } from "./basic/Text";
 import { ViewNB as View } from "./basic/View";
@@ -66,6 +67,7 @@ export {
   variables,
   StyleProvider,
   connectStyle,
+  Drawer,
   Button,
   DatePicker,
   IconNB,

src/vue-native.js

@@ -1,6 +1,7 @@
 import { StyleProvider } from "native-base-shoutem-theme";
 // import { Gravatar } from "./basic/Gravatar";
 import { Col, Row, Grid } from "react-native-easy-grid";
+import Drawer from "./basic/Drawer";
 import { SwipeRow } from "./basic/SwipeRow";
 import { Text } from "./basic/Text";
 import { ViewNB as View } from "./basic/View";
@@ -57,6 +58,7 @@ const VueNativeBasePlugin = {
   // The install method is all that needs to exist on the plugin object.
   // It takes the global Vue object as well as user-defined options.
   install(Vue, options) {
+    Vue.component("nb-drawer", Drawer);
     Vue.component("nb-row", Row);
     Vue.component("nb-col", Col);
     Vue.component("nb-grid", Grid);