Merge pull request #242 from carlosfpo/master

#240 Open native context menu if shift key is pressed

Author: vkbansal

docs/api.md

@@ -27,14 +27,15 @@ Contextmenu Trigger Component
 
 #### PropTypes
 
-| Property      | Type                    | Required? | Default | Description                                                                                                                                                                                                                                     |
-|---------------|-------------------------|-----------|---------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| id            | String                  | ✓         |         | The unique identifier of the menu to be called.                                                                                                                                                                                                 |
-| attributes    | Object                  |           |         | The attributes will be passed directly passed to the root element of component. Use this to customize it like adding custom classes, adding `colspan` etc.                                                                                      |
-| collect       | Function                |           |         | A simple function which takes `props` as input and returns the data to be passed to contextmenu.                                                                                                                                                  |
-| disable       | Boolean                 |           | `false` | Prop to ignore right clicks and display the default browser context menu.                                                                                                                                                                       |
-| holdToDisplay | Number                  |           | `1000`  | This is applicable only for touch screens. The time (in ms) for which, user has to hold down his/her finger before the menu is shown.  **Note:** To disable the long press trigger on left-click just set a negative holdToDisplay value such as `-1` |
-| renderTag     | String or React Element |           |         | The element inside which the Component must be wrapped. By default `div` is used. But this prop can used to customize it.                                                                                                                         |
+| Property                | Type                    | Required? | Default | Description                                                                                                                                                                                                                                     |
+|-------------------------|-------------------------|-----------|---------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| id                      | String                  | ✓         |         | The unique identifier of the menu to be called.                                                                                                                                                                                                 |
+| attributes              | Object                  |           |         | The attributes will be passed directly passed to the root element of component. Use this to customize it like adding custom classes, adding `colspan` etc.                                                                                      |
+| collect                 | Function                |           |         | A simple function which takes `props` as input and returns the data to be passed to contextmenu.                                                                                                                                                  |
+| disable                 | Boolean                 |           | `false` | Prop to ignore right clicks and display the default browser context menu.                                                                                                                                                                       |
+| holdToDisplay           | Number                  |           | `1000`  | This is applicable only for touch screens. The time (in ms) for which, user has to hold down his/her finger before the menu is shown.  **Note:** To disable the long press trigger on left-click just set a negative holdToDisplay value such as `-1` |
+| renderTag               | String or React Element |           |         | The element inside which the Component must be wrapped. By default `div` is used. But this prop can used to customize it.                                                                                                                         |
+| disableIfShiftIsPressed | Boolean                 |           | `false` | If true and shift is pressed, it will open the native browser context menu and ignore this custom component |
 
 ### `<MenuItem />`
 

src/ContextMenuTrigger.js

@@ -19,7 +19,8 @@ export default class ContextMenuTrigger extends Component {
         renderTag: PropTypes.oneOfType([
             PropTypes.node,
             PropTypes.func
-        ])
+        ]),
+        disableIfShiftIsPressed: PropTypes.bool
     };
 
     static defaultProps = {
@@ -29,7 +30,8 @@ export default class ContextMenuTrigger extends Component {
         holdToDisplay: 1000,
         renderTag: 'div',
         posX: 0,
-        posY: 0
+        posY: 0,
+        disableIfShiftIsPressed: false
     };
 
     touchHandled = false;
@@ -94,6 +96,7 @@ export default class ContextMenuTrigger extends Component {
 
     handleContextClick = (event) => {
         if (this.props.disable) return;
+        if (this.props.disableIfShiftIsPressed && event.shiftKey) return;
 
         event.preventDefault();
         event.stopPropagation();