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

Comparing version 0.11.0 to 0.12.0

package.json

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

README.md

@@ -28,3 +28,3 @@ # react-native-popup-menu
 ## Basic Usage
-Wrap your application inside `MenuContext` and then simply use `Menu` component where you need it. Below you can find a simple example.
+Wrap your application inside `MenuProvider` and then simply use `Menu` component where you need it. Below you can find a simple example.
 
@@ -35,8 +35,8 @@ For more detailed documentation check [API](./doc/api.md).
 // your entry point
-import { MenuContext } from 'react-native-popup-menu';
+import { MenuProvider } from 'react-native-popup-menu';
 
 export const App = () => (
-  <MenuContext>
+  <MenuProvider>
     <YourApp />
-  </MenuContext>
+  </MenuProvider>
 );
@@ -43,0 +43,0 @@

src/helpers.js

@@ -0,1 +1,2 @@
+import React from 'react';
 import { Platform, TouchableHighlight, TouchableNativeFeedback } from 'react-native';
@@ -78,1 +79,30 @@
 }
+
+/**
+ * Higher order component to deprecate usage of component.
+ * message - deprecate warning message
+ * methods - array of method names to be delegated to deprecated component
+ */
+export function deprecatedComponent(message, methods = []) {
+  return function deprecatedComponentHOC(Component) {
+    return class DeprecatedComponent extends React.Component {
+      constructor(...args) {
+        super(...args);
+        methods.forEach(name => {
+          // delegate methods to the component
+          this[name] = (...args) => this.ref && this.ref[name](...args)
+        });
+      }
+
+      render() {
+        return <Component {...this.props} ref={this.onRef} />
+      }
+
+      onRef = ref => this.ref = ref;
+
+      componentDidMount() {
+        console.warn(message);
+      }
+    }
+  }
+}

src/index.js

 import './polyfills';
+import { deprecatedComponent } from './helpers'
 
 import Menu from './Menu';
-import MenuContext from './MenuContext';
+import MenuProvider from './MenuProvider';
 import MenuOption from './MenuOption';
@@ -15,2 +16,16 @@ import MenuOptions from './MenuOptions';
 
-export { Menu as default, Menu, MenuContext, MenuOption, MenuOptions, MenuTrigger, renderers };
+const MenuContext = deprecatedComponent(
+  'MenuContext is deprecated and it might be removed in future releases, use MenuProvider instead.',
+  ['openMenu', 'toggleMenu', 'closeMenu', 'isMenuOpen'],
+)(MenuProvider);
+
+export {
+  Menu as default,
+  Menu,
+  MenuProvider,
+  MenuContext,
+  MenuOption,
+  MenuOptions,
+  MenuTrigger,
+  renderers,
+};

src/Menu.js

@@ -20,3 +20,3 @@ import React, { Component } from 'react';
     if(!(ctx && ctx.menuActions)) {
-      throw new Error("Menu component must be ancestor of MenuContext");
+      throw new Error("Menu component must be ancestor of MenuProvider");
     }
@@ -23,0 +23,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

181724

increased by0.79%

Lines of code

1417

increased by3.51%

No dependency changes