Merge branch 'master' into safe-area

Author: sodik82

README.md

@@ -15,7 +15,7 @@ Features:
 * RTL layout support
 
 Community driven features:
-* Support for UWP and react-native-web
+* Support for UWP, react-native-web and react-native-desktop
 * Typescript definitions
 
 We thank our community for maintaining features that goes over our scope.

__tests__/helpers-test.js

@@ -70,18 +70,9 @@ describe('helpers test', () => {
       expect(defaultTouchableProps).to.be.an('object');
     });
 
-    it('should create TouchableHighlight for web', () => {
+    it('should create TouchableHighlight for default', () => {
       Platform.select.mockImplementationOnce(o => {
-        return o.web;
-      });
-      const { Touchable, defaultTouchableProps } = makeTouchable();
-      expect(Touchable).to.be.equal(TouchableHighlight);
-      expect(defaultTouchableProps).to.be.an('object');
-    });
-
-    it('should create TouchableHighlight for windows', () => {
-      Platform.select.mockImplementationOnce(o => {
-        return o.windows;
+        return o.default;
       });
       const { Touchable, defaultTouchableProps } = makeTouchable();
       expect(Touchable).to.be.equal(TouchableHighlight);

doc/api.md

@@ -24,6 +24,7 @@ The only known exception is when you use [Modal](https://facebook.github.io/reac
 |`style`|`Style`|Optional||Style of wrapping `View` component. Same as `customStyles.menuProviderWrapper` but when both are present result style is a merge where this style has higher precedence.|
 |`customStyles`|`Object`|Optional||Object defining wrapper, touchable and text styles|
 |`backHandler`|`boolean\|Function`|Optional|false|Whether to close the menu when the back button is pressed or custom back button handler if a function is passed (RN >= 0.44 is required)|
+|`skipInstanceCheck`|`boolean`|Optional|false|Normally your application should have only one menu provider (with exception as discussed above). If you really need more instances, set `skipInstanceCheck` to `true` to disable the check (and following warning message)|
 
 ### Custom styles
 

examples/ModalExample.js

@@ -25,7 +25,7 @@ class ModalExample extends Component {
           </MenuOptions>
         </Menu>
         <Modal visible={this.state.visible} onRequestClose={() => this.setState({ visible: false })}>
-          <MenuProvider style={{flexDirection: 'column', padding: 30, backgroundColor: 'white'}}>
+          <MenuProvider skipInstanceCheck style={{flexDirection: 'column', padding: 30, backgroundColor: 'white'}}>
             <Text>Modal window:</Text>
             <Menu onSelect={value => alert(`Selected number: ${value}`)}>
               <MenuTrigger text='Select option' />

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-popup-menu",
-  "version": "0.13.2",
+  "version": "0.13.3",
   "description": "extensible popup/context menu for react native",
   "main": "src/index.js",
   "directories": {

src/MenuProvider.js

@@ -22,6 +22,9 @@ if (!React.forwardRef) {
 export const PopupMenuContext = createContext({})
 export const withCtx = withContext(PopupMenuContext, "ctx");
 
+// count of MenuProvider instances
+let instanceCount = 0;
+
 export default class MenuProvider extends Component {
 
   constructor(props) {
@@ -68,16 +71,27 @@ export default class MenuProvider extends Component {
         console.warn('backHandler prop cannot be used if BackHandler is not present (RN >= 0.44 required)');
       }
     }
-    if (this.props.customStyles.menuContextWrapper) {
+    const { customStyles, skipInstanceCheck } = this.props;
+    if (customStyles.menuContextWrapper) {
       console.warn('menuContextWrapper custom style is deprecated and it might be removed in future releases, use menuProviderWrapper instead.');
     }
+    if (!skipInstanceCheck) {
+      instanceCount++;
+    }
+    if (instanceCount > 1) {
+      console.warn('In most cases you should not have more MenuProviders in your app (see API documentation). In other cases use skipInstanceCheck prop.');
+    }
   }
 
   componentWillUnmount() {
     debug('unmounting menu provider')
     if (BackHandler) {
       BackHandler.removeEventListener('hardwareBackPress', this._handleBackButton);
     }
+    const { skipInstanceCheck } = this.props;
+    if (!skipInstanceCheck) {
+      instanceCount--;
+    }
   }
 
   isMenuOpen() {
@@ -335,11 +349,13 @@ export default class MenuProvider extends Component {
 MenuProvider.propTypes = {
   customStyles: PropTypes.object,
   backHandler: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
+  skipInstanceCheck: PropTypes.bool,
 }
 
 MenuProvider.defaultProps = {
   customStyles: {},
   backHandler: false,
+  skipInstanceCheck: false,
 };
 
 const styles = StyleSheet.create({

src/helpers.js

@@ -29,8 +29,7 @@ export function makeTouchable(TouchableComponent) {
   const Touchable = TouchableComponent || Platform.select({
     android: TouchableNativeFeedback,
     ios: TouchableHighlight,
-    web: TouchableHighlight,
-    windows:TouchableHighlight,
+    default: TouchableHighlight,
   });
   let defaultTouchableProps = {};
   if (Touchable === TouchableHighlight) {