react-native-popup-menu - npm Package Compare versions

Comparing version 0.8.1 to 0.8.2

package.json

 {
   "name": "react-native-popup-menu",
-  "version": "0.8.1",
+  "version": "0.8.2",
   "description": "extensible popup/context menu for react native",
@@ -5,0 +5,0 @@ "main": "src/index.js",

src/MenuContext.js

@@ -5,3 +5,3 @@ import React, { Component } from 'react';
 import makeMenuRegistry from './menuRegistry';
-import Backdrop from './Backdrop';
+import MenuPlaceholder from './MenuPlaceholder';
 import { measure } from './helpers';
@@ -22,3 +22,2 @@ import { debug } from './logger.js';
     super(props);
-    this.state = {};
     this._menuRegistry = makeMenuRegistry();
@@ -71,2 +70,3 @@ }
   componentWillUnmount() {
+    debug('unmounting menu context')
     if (BackHandler) {
@@ -78,3 +78,3 @@ BackHandler.removeEventListener('hardwareBackPress', this._handleBackButton);
   isMenuOpen() {
-    return !!this.state.openedMenu;
+    return !!this._getOpenedMenu();
   }
@@ -158,3 +158,7 @@
     return beforeSetState().then(() => {
-      this.setState({ openedMenu: this.openedMenu }, afterSetState);
+      if (!this._placeholderRef) {
+        debug('setState ignored - maybe the context was unmounted')
+        return
+      }
+      this._placeholderRef.setState({ openedMenu: this.openedMenu }, afterSetState);
       debug('notify ended');
@@ -185,19 +189,13 @@ });
     const { style, customStyles } = this.props;
-    const shouldRenderMenu = this.isMenuOpen() && this._isInitialized();
     debug('render menu', this.isMenuOpen(), this._ownLayout);
     return (
-      <View style={{flex:1}} onLayout={e => this._onLayout(e)}>
+      <View style={{flex:1}} onLayout={this._onLayout}>
         <View style={[{flex:1}, customStyles.menuContextWrapper, style]}>
           { this.props.children }
         </View>
-        {shouldRenderMenu &&
-          <Backdrop
-            onPress={() => this._onBackdropPress()}
-            style={customStyles.backdrop}
-            ref={this.onBackdropRef}
+        <MenuPlaceholder
+          ctx={this}
+          backdropStyles={customStyles.backdrop}
+          ref={this._onPlaceholderRef}
           />
-        }
-        {shouldRenderMenu &&
-          this._makeOptions(this.state.openedMenu)
-        }
       </View>
@@ -215,5 +213,11 @@ );
 
-  _onBackdropPress() {
+  _onPlaceholderRef = r => this._placeholderRef = r;
+
+  _getOpenedMenu() {
+    return this._placeholderRef && this._placeholderRef.state.openedMenu
+  }
+
+  _onBackdropPress = () => {
     debug('on backdrop press');
-    this.state.openedMenu.instance.props.onBackdropPress();
+    this._getOpenedMenu().instance.props.onBackdropPress();
     this.closeMenu();
@@ -244,3 +248,4 @@ }
 
-  _makeOptions({ instance, triggerLayout, optionsLayout }) {
+  _makeOptions() {
+    const { instance, triggerLayout, optionsLayout } = this._getOpenedMenu();
     const options = instance._getOptions();
@@ -263,3 +268,3 @@ const { renderer } = instance.props;
 
-  _onLayout({ nativeEvent: { layout } }) {
+  _onLayout = ({ nativeEvent: { layout } }) => {
     if (layoutsEqual(this._ownLayout, layout)) {
@@ -273,3 +278,3 @@ return;
     }
-    const { instance } = this.state.openedMenu;
+    const { instance } = this._getOpenedMenu();
     const trigger = instance._getTrigger();
@@ -276,0 +281,0 @@ measure(trigger).then(triggerLayout => {

No alert changes

Improved metrics

Total package byte prevSize

35145

increased by3.19%

Number of package files

25

increased by4.17%

Lines of code

962

increased by4.57%

No dependency changes