react-native-gesture-handler 2.23.0 → 2.24.0

package/lib/commonjs/components/DrawerLayout.js

@@ -4,62 +4,31 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var React = _react;
+
+var React = _interopRequireWildcard(require("react"));
+
 var _invariant = _interopRequireDefault(require("invariant"));
-var _reactNative = require("react-native");
-var _PanGestureHandler = require("../handlers/PanGestureHandler");
-var _TapGestureHandler = require("../handlers/TapGestureHandler");
-var _State = require("../State");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } // This component is based on RN's DrawerLayoutAndroid API
-//
-// It perhaps deserves to be put in a separate repo, but since it relies on
-// react-native-gesture-handler library which isn't very popular at the moment I
-// decided to keep it here for the time being. It will allow us to move faster
-// and fix issues that may arise in gesture handler library that could be found
-// when using the drawer component
-const DRAG_TOSS = 0.05;
-const IDLE = 'Idle';
-const DRAGGING = 'Dragging';
-const SETTLING = 'Settling';
 
-/**
- * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
- */
+var _reactNative = require("react-native");
 
-/**
- * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
- */
+var _PanGestureHandler = require("../handlers/PanGestureHandler");
 
-/**
- * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
- */
+var _TapGestureHandler = require("../handlers/TapGestureHandler");
 
-/**
- * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
- */
+var _State = require("../State");
 
-/**
- * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
- */
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-// Animated.AnimatedInterpolation has been converted to a generic type
-// in @types/react-native 0.70. This way we can maintain compatibility
-// with all versions of @types/react-native`
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-/**
- * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
- */
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-/**
- * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
- */
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
+const DRAG_TOSS = 0.05;
+const IDLE = 'Idle';
+const DRAGGING = 'Dragging';
+const SETTLING = 'Settling';
 /**
  * @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
  */
@@ -67,15 +36,22 @@ const SETTLING = 'Settling';
 /**
  * @deprecated use Reanimated version of DrawerLayout instead
  */
-class DrawerLayout extends _react.Component {
+class DrawerLayout extends React.Component {
   constructor(_props) {
     super(_props);
+
     _defineProperty(this, "openValue", void 0);
+
     _defineProperty(this, "onGestureEvent", void 0);
+
     _defineProperty(this, "accessibilityIsModalView", /*#__PURE__*/React.createRef());
+
     _defineProperty(this, "pointerEventsView", /*#__PURE__*/React.createRef());
+
     _defineProperty(this, "panGestureHandler", /*#__PURE__*/React.createRef());
+
     _defineProperty(this, "drawerShown", false);
+
     _defineProperty(this, "updateAnimatedEvent", (props, state) => {
       // Event definition is based on
       const {
@@ -91,6 +67,7 @@ class DrawerLayout extends _react.Component {
       } = state;
       let dragX = dragXValue;
       let touchX = touchXValue;
+
       if (drawerPosition !== 'left') {
         // Most of the code is written in a way to handle left-side drawer. In
         // order to handle right-side drawer the only thing we need to do is to
@@ -99,13 +76,13 @@ class DrawerLayout extends _react.Component {
         // calulcated by subtracing real touchX from the width of the container
         // (such that when touch happens at the right edge the value is simply 0)
         dragX = _reactNative.Animated.multiply(new _reactNative.Animated.Value(-1), dragXValue); // TODO(TS): (for all "as" in this file) make sure we can map this
+
         touchX = _reactNative.Animated.add(new _reactNative.Animated.Value(containerWidth), _reactNative.Animated.multiply(new _reactNative.Animated.Value(-1), touchXValue)); // TODO(TS): make sure we can map this;
+
         touchXValue.setValue(containerWidth);
       } else {
         touchXValue.setValue(0);
-      }
-
-      // While closing the drawer when user starts gesture outside of its area (in greyed
+      } // While closing the drawer when user starts gesture outside of its area (in greyed
       // out part of the window), we want the drawer to follow only once finger reaches the
       // edge of the drawer.
       // E.g. on the diagram below drawer is illustrate by X signs and the greyed out area by
@@ -130,15 +107,20 @@ class DrawerLayout extends _react.Component {
       //
       // This is used only when drawerType is "front"
       //
+
+
       let translationX = dragX;
+
       if (drawerType === 'front') {
         const startPositionX = _reactNative.Animated.add(touchX, _reactNative.Animated.multiply(new _reactNative.Animated.Value(-1), dragX));
+
         const dragOffsetFromOnStartPosition = startPositionX.interpolate({
           inputRange: [drawerWidth - 1, drawerWidth, drawerWidth + 1],
           outputRange: [0, 0, 1]
         });
         translationX = _reactNative.Animated.add(dragX, dragOffsetFromOnStartPosition); // TODO: as above
       }
+
       this.openValue = _reactNative.Animated.add(translationX, drawerTranslation).interpolate({
         inputRange: [0, drawerWidth],
         outputRange: [0, 1],
@@ -147,14 +129,17 @@ class DrawerLayout extends _react.Component {
       const gestureOptions = {
         useNativeDriver: props.useNativeAnimations
       };
+
       if (this.props.onDrawerSlide) {
         gestureOptions.listener = ev => {
           var _this$props$onDrawerS, _this$props;
+
           const translationX = Math.floor(Math.abs(ev.nativeEvent.translationX));
           const position = translationX / this.state.containerWidth;
-          (_this$props$onDrawerS = (_this$props = this.props).onDrawerSlide) === null || _this$props$onDrawerS === void 0 || _this$props$onDrawerS.call(_this$props, position);
+          (_this$props$onDrawerS = (_this$props = this.props).onDrawerSlide) === null || _this$props$onDrawerS === void 0 ? void 0 : _this$props$onDrawerS.call(_this$props, position);
         };
       }
+
       this.onGestureEvent = _reactNative.Animated.event([{
         nativeEvent: {
           translationX: dragXValue,
@@ -162,6 +147,7 @@ class DrawerLayout extends _react.Component {
         }
       }], gestureOptions);
     });
+
     _defineProperty(this, "handleContainerLayout", ({
       nativeEvent
     }) => {
@@ -169,10 +155,13 @@ class DrawerLayout extends _react.Component {
         containerWidth: nativeEvent.layout.width
       });
     });
+
     _defineProperty(this, "emitStateChanged", (newState, drawerWillShow) => {
       var _this$props$onDrawerS2, _this$props2;
-      (_this$props$onDrawerS2 = (_this$props2 = this.props).onDrawerStateChanged) === null || _this$props$onDrawerS2 === void 0 || _this$props$onDrawerS2.call(_this$props2, newState, drawerWillShow);
+
+      (_this$props$onDrawerS2 = (_this$props2 = this.props).onDrawerStateChanged) === null || _this$props$onDrawerS2 === void 0 ? void 0 : _this$props$onDrawerS2.call(_this$props2, newState, drawerWillShow);
     });
+
     _defineProperty(this, "openingHandlerStateChange", ({
       nativeEvent
     }) => {
@@ -185,14 +174,17 @@ class DrawerLayout extends _react.Component {
         this.setState({
           drawerState: DRAGGING
         });
+
         if (this.props.keyboardDismissMode === 'on-drag') {
           _reactNative.Keyboard.dismiss();
         }
+
         if (this.props.hideStatusBar) {
           _reactNative.StatusBar.setHidden(true, this.props.statusBarAnimation || 'slide');
         }
       }
     });
+
     _defineProperty(this, "onTapHandlerStateChange", ({
       nativeEvent
     }) => {
@@ -200,6 +192,7 @@ class DrawerLayout extends _react.Component {
         this.closeDrawer();
       }
     });
+
     _defineProperty(this, "handleRelease", ({
       nativeEvent
     }) => {
@@ -216,6 +209,7 @@ class DrawerLayout extends _react.Component {
         velocityX,
         x: touchX
       } = nativeEvent;
+
       if (drawerPosition !== 'left') {
         // See description in _updateAnimatedEvent about why events are flipped
         // for right-side drawer
@@ -223,27 +217,33 @@ class DrawerLayout extends _react.Component {
         touchX = containerWidth - touchX;
         velocityX = -velocityX;
       }
+
       const gestureStartX = touchX - dragX;
       let dragOffsetBasedOnStart = 0;
+
       if (drawerType === 'front') {
         dragOffsetBasedOnStart = gestureStartX > drawerWidth ? gestureStartX - drawerWidth : 0;
       }
+
       const startOffsetX = dragX + dragOffsetBasedOnStart + (this.drawerShown ? drawerWidth : 0);
       const projOffsetX = startOffsetX + DRAG_TOSS * velocityX;
       const shouldOpen = projOffsetX > drawerWidth / 2;
+
       if (shouldOpen) {
         this.animateDrawer(startOffsetX, drawerWidth, velocityX);
       } else {
         this.animateDrawer(startOffsetX, 0, velocityX);
       }
     });
+
     _defineProperty(this, "updateShowing", showing => {
       var _this$accessibilityIs, _this$pointerEventsVi, _this$panGestureHandl;
+
       this.drawerShown = showing;
-      (_this$accessibilityIs = this.accessibilityIsModalView.current) === null || _this$accessibilityIs === void 0 || _this$accessibilityIs.setNativeProps({
+      (_this$accessibilityIs = this.accessibilityIsModalView.current) === null || _this$accessibilityIs === void 0 ? void 0 : _this$accessibilityIs.setNativeProps({
         accessibilityViewIsModal: showing
       });
-      (_this$pointerEventsVi = this.pointerEventsView.current) === null || _this$pointerEventsVi === void 0 || _this$pointerEventsVi.setNativeProps({
+      (_this$pointerEventsVi = this.pointerEventsView.current) === null || _this$pointerEventsVi === void 0 ? void 0 : _this$pointerEventsVi.setNativeProps({
         pointerEvents: showing ? 'auto' : 'none'
       });
       const {
@@ -251,32 +251,35 @@ class DrawerLayout extends _react.Component {
         minSwipeDistance,
         edgeWidth
       } = this.props;
-      const fromLeft = drawerPosition === 'left';
-      // gestureOrientation is 1 if the expected gesture is from left to right and
+      const fromLeft = drawerPosition === 'left'; // gestureOrientation is 1 if the expected gesture is from left to right and
       // -1 otherwise e.g. when drawer is on the left and is closed we expect left
       // to right gesture, thus orientation will be 1.
-      const gestureOrientation = (fromLeft ? 1 : -1) * (this.drawerShown ? -1 : 1);
-      // When drawer is closed we want the hitSlop to be horizontally shorter than
+
+      const gestureOrientation = (fromLeft ? 1 : -1) * (this.drawerShown ? -1 : 1); // When drawer is closed we want the hitSlop to be horizontally shorter than
       // the container size by the value of SLOP. This will make it only activate
       // when gesture happens not further than SLOP away from the edge
+
       const hitSlop = fromLeft ? {
         left: 0,
         width: showing ? undefined : edgeWidth
       } : {
         right: 0,
         width: showing ? undefined : edgeWidth
-      };
-      // @ts-ignore internal API, maybe could be fixed in handler types
-      (_this$panGestureHandl = this.panGestureHandler.current) === null || _this$panGestureHandl === void 0 || _this$panGestureHandl.setNativeProps({
+      }; // @ts-ignore internal API, maybe could be fixed in handler types
+
+      (_this$panGestureHandl = this.panGestureHandler.current) === null || _this$panGestureHandl === void 0 ? void 0 : _this$panGestureHandl.setNativeProps({
         hitSlop,
         activeOffsetX: gestureOrientation * minSwipeDistance
       });
     });
+
     _defineProperty(this, "animateDrawer", (fromValue, toValue, velocity, speed) => {
       this.state.dragX.setValue(0);
       this.state.touchX.setValue(this.props.drawerPosition === 'left' ? 0 : this.state.containerWidth);
+
       if (fromValue != null) {
         let nextFramePosition = fromValue;
+
         if (this.props.useNativeAnimations) {
           // When using native driver, we predict the next position of the
           // animation because it takes one frame of a roundtrip to pass RELEASE
@@ -288,17 +291,21 @@ class DrawerLayout extends _react.Component {
             nextFramePosition = Math.max(fromValue + velocity / 60.0, toValue);
           }
         }
+
         this.state.drawerTranslation.setValue(nextFramePosition);
       }
+
       const willShow = toValue !== 0;
       this.updateShowing(willShow);
       this.emitStateChanged(SETTLING, willShow);
       this.setState({
         drawerState: SETTLING
       });
+
       if (this.props.hideStatusBar) {
         _reactNative.StatusBar.setHidden(willShow, this.props.statusBarAnimation || 'slide');
       }
+
       _reactNative.Animated.spring(this.state.drawerTranslation, {
         velocity,
         bounciness: 0,
@@ -313,6 +320,7 @@ class DrawerLayout extends _react.Component {
           this.setState({
             drawerOpened: willShow
           });
+
           if (this.state.drawerState !== DRAGGING) {
             // It's possilbe that user started drag while the drawer
             // was settling, don't override state in this case
@@ -320,42 +328,47 @@ class DrawerLayout extends _react.Component {
               drawerState: IDLE
             });
           }
+
           if (willShow) {
             var _this$props$onDrawerO, _this$props3;
-            (_this$props$onDrawerO = (_this$props3 = this.props).onDrawerOpen) === null || _this$props$onDrawerO === void 0 || _this$props$onDrawerO.call(_this$props3);
+
+            (_this$props$onDrawerO = (_this$props3 = this.props).onDrawerOpen) === null || _this$props$onDrawerO === void 0 ? void 0 : _this$props$onDrawerO.call(_this$props3);
           } else {
             var _this$props$onDrawerC, _this$props4;
-            (_this$props$onDrawerC = (_this$props4 = this.props).onDrawerClose) === null || _this$props$onDrawerC === void 0 || _this$props$onDrawerC.call(_this$props4);
+
+            (_this$props$onDrawerC = (_this$props4 = this.props).onDrawerClose) === null || _this$props$onDrawerC === void 0 ? void 0 : _this$props$onDrawerC.call(_this$props4);
           }
         }
       });
     });
-    _defineProperty(this, "openDrawer", (options = {}) => {
-      this.animateDrawer(
-      // TODO: decide if it should be null or undefined is the proper value
-      undefined, this.props.drawerWidth, options.velocity ? options.velocity : 0, options.speed);
 
-      // We need to force the update, otherwise the overlay is not rerendered and
+    _defineProperty(this, "openDrawer", (options = {}) => {
+      this.animateDrawer( // TODO: decide if it should be null or undefined is the proper value
+      undefined, this.props.drawerWidth, options.velocity ? options.velocity : 0, options.speed); // We need to force the update, otherwise the overlay is not rerendered and
       // it would not be clickable
+
       this.forceUpdate();
     });
+
     _defineProperty(this, "closeDrawer", (options = {}) => {
       // TODO: decide if it should be null or undefined is the proper value
-      this.animateDrawer(undefined, 0, options.velocity ? options.velocity : 0, options.speed);
-
-      // We need to force the update, otherwise the overlay is not rerendered and
+      this.animateDrawer(undefined, 0, options.velocity ? options.velocity : 0, options.speed); // We need to force the update, otherwise the overlay is not rerendered and
       // it would be still clickable
+
       this.forceUpdate();
     });
+
     _defineProperty(this, "renderOverlay", () => {
       /* Overlay styles */
       (0, _invariant.default)(this.openValue, 'should be set');
       let overlayOpacity;
+
       if (this.state.drawerState !== IDLE) {
         overlayOpacity = this.openValue;
       } else {
         overlayOpacity = this.state.drawerOpened ? 1 : 0;
       }
+
       const dynamicOverlayStyles = {
         opacity: overlayOpacity,
         backgroundColor: this.props.overlayColor
@@ -368,6 +381,7 @@ class DrawerLayout extends _react.Component {
         style: [styles.overlay, dynamicOverlayStyles]
       }));
     });
+
     _defineProperty(this, "renderDrawer", () => {
       const {
         drawerBackgroundColor,
@@ -379,12 +393,11 @@ class DrawerLayout extends _react.Component {
       } = this.props;
       const fromLeft = drawerPosition === 'left';
       const drawerSlide = drawerType !== 'back';
-      const containerSlide = drawerType !== 'front';
-
-      // We rely on row and row-reverse flex directions to position the drawer
+      const containerSlide = drawerType !== 'front'; // We rely on row and row-reverse flex directions to position the drawer
       // properly. Apparently for RTL these are flipped which requires us to use
       // the opposite setting for the drawer to appear from left or right
       // according to the drawerPosition prop
+
       const reverseContentDirection = _reactNative.I18nManager.isRTL ? fromLeft : !fromLeft;
       const dynamicDrawerStyles = {
         backgroundColor: drawerBackgroundColor,
@@ -393,6 +406,7 @@ class DrawerLayout extends _react.Component {
       const openValue = this.openValue;
       (0, _invariant.default)(openValue, 'should be set');
       let containerStyles;
+
       if (containerSlide) {
         const containerTranslateX = openValue.interpolate({
           inputRange: [0, 1],
@@ -405,9 +419,12 @@ class DrawerLayout extends _react.Component {
           }]
         };
       }
+
       let drawerTranslateX = 0;
+
       if (drawerSlide) {
         const closedDrawerOffset = fromLeft ? -drawerWidth : drawerWidth;
+
         if (this.state.drawerState !== IDLE) {
           drawerTranslateX = openValue.interpolate({
             inputRange: [0, 1],
@@ -418,6 +435,7 @@ class DrawerLayout extends _react.Component {
           drawerTranslateX = this.state.drawerOpened ? 0 : closedDrawerOffset;
         }
       }
+
       const drawerStyles = {
         transform: [{
           translateX: drawerTranslateX
@@ -439,16 +457,22 @@ class DrawerLayout extends _react.Component {
         style: dynamicDrawerStyles
       }, this.props.renderNavigationView(this.openValue))));
     });
+
     _defineProperty(this, "setPanGestureRef", ref => {
       var _this$props$onGesture, _this$props5;
+
       // TODO(TS): make sure it is OK taken from
       // https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065#issuecomment-596081842
       this.panGestureHandler.current = ref;
-      (_this$props$onGesture = (_this$props5 = this.props).onGestureRef) === null || _this$props$onGesture === void 0 || _this$props$onGesture.call(_this$props5, ref);
+      (_this$props$onGesture = (_this$props5 = this.props).onGestureRef) === null || _this$props$onGesture === void 0 ? void 0 : _this$props$onGesture.call(_this$props5, ref);
     });
+
     const _dragX = new _reactNative.Animated.Value(0);
+
     const _touchX = new _reactNative.Animated.Value(0);
+
     const _drawerTranslation = new _reactNative.Animated.Value(0);
+
     this.state = {
       dragX: _dragX,
       touchX: _touchX,
@@ -459,12 +483,15 @@ class DrawerLayout extends _react.Component {
     };
     this.updateAnimatedEvent(_props, this.state);
   }
+
   shouldComponentUpdate(props, state) {
     if (this.props.drawerPosition !== props.drawerPosition || this.props.drawerWidth !== props.drawerWidth || this.props.drawerType !== props.drawerType || this.state.containerWidth !== state.containerWidth) {
       this.updateAnimatedEvent(props, state);
     }
+
     return true;
   }
+
   render() {
     const {
       drawerPosition,
@@ -472,16 +499,14 @@ class DrawerLayout extends _react.Component {
       edgeWidth,
       minSwipeDistance
     } = this.props;
-    const fromLeft = drawerPosition === 'left';
-
-    // gestureOrientation is 1 if the expected gesture is from left to right and
+    const fromLeft = drawerPosition === 'left'; // gestureOrientation is 1 if the expected gesture is from left to right and
     // -1 otherwise e.g. when drawer is on the left and is closed we expect left
     // to right gesture, thus orientation will be 1.
-    const gestureOrientation = (fromLeft ? 1 : -1) * (this.drawerShown ? -1 : 1);
 
-    // When drawer is closed we want the hitSlop to be horizontally shorter than
+    const gestureOrientation = (fromLeft ? 1 : -1) * (this.drawerShown ? -1 : 1); // When drawer is closed we want the hitSlop to be horizontally shorter than
     // the container size by the value of SLOP. This will make it only activate
     // when gesture happens not further than SLOP away from the edge
+
     const hitSlop = fromLeft ? {
       left: 0,
       width: this.drawerShown ? undefined : edgeWidth
@@ -489,8 +514,7 @@ class DrawerLayout extends _react.Component {
       right: 0,
       width: this.drawerShown ? undefined : edgeWidth
     };
-    return /*#__PURE__*/React.createElement(_PanGestureHandler.PanGestureHandler
-    // @ts-ignore could be fixed in handler types
+    return /*#__PURE__*/React.createElement(_PanGestureHandler.PanGestureHandler // @ts-ignore could be fixed in handler types
     , {
       userSelect: this.props.userSelect,
       activeCursor: this.props.activeCursor,
@@ -506,8 +530,11 @@ class DrawerLayout extends _react.Component {
       enabled: drawerLockMode !== 'locked-closed' && drawerLockMode !== 'locked-open'
     }, this.renderDrawer());
   }
+
 }
+
 exports.default = DrawerLayout;
+
 _defineProperty(DrawerLayout, "defaultProps", {
   drawerWidth: 200,
   drawerPosition: 'left',
@@ -519,30 +546,28 @@ _defineProperty(DrawerLayout, "defaultProps", {
   drawerLockMode: 'unlocked',
   enableTrackpadTwoFingerGesture: false
 });
+
 _defineProperty(DrawerLayout, "positions", {
   Left: 'left',
   Right: 'right'
 });
+
 const styles = _reactNative.StyleSheet.create({
-  drawerContainer: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+  drawerContainer: { ..._reactNative.StyleSheet.absoluteFillObject,
     zIndex: 1001,
     flexDirection: 'row'
   },
-  containerInFront: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+  containerInFront: { ..._reactNative.StyleSheet.absoluteFillObject,
     zIndex: 1002
   },
-  containerOnBack: {
-    ..._reactNative.StyleSheet.absoluteFillObject
+  containerOnBack: { ..._reactNative.StyleSheet.absoluteFillObject
   },
   main: {
     flex: 1,
     zIndex: 0,
     overflow: 'hidden'
   },
-  overlay: {
-    ..._reactNative.StyleSheet.absoluteFillObject,
+  overlay: { ..._reactNative.StyleSheet.absoluteFillObject,
     zIndex: 1000
   }
 });