Merge pull request #48 from jankarres/disableTouchable

MenuOption ability to disable Touchable wrapper

doc/api.md

@@ -162,6 +162,7 @@ Wrapper component of menu option.
 |`value`|`Any`|Optional||Value of option|
 |`text`|`String`|Optional||Text to be rendered. When this prop is provided, option's children won't be rendered|
 |`disabled`|`Boolean`|Optional|`false`|Indicates if option can be pressed|
+|`disableTouchable`|`Boolean`|Optional|`false`|Disables Touchable wrapper (no on press effect and no onSelect execution)|
 |`customStyles`|`Object`|Optional||Object defining wrapper, touchable and text styles|
 
 ### Events

src/MenuOption.js

@@ -16,7 +16,7 @@ export default class MenuOption extends Component {
   }
 
   render() {
-    const { text, disabled, children, style, customStyles } = this.props;
+    const { text, disabled, disableTouchable, children, style, customStyles } = this.props;
     if (text && React.Children.count(children) > 0) {
       console.warn("MenuOption: Please don't use text property together with explicit children. Children are ignored.");
     }
@@ -28,23 +28,32 @@ export default class MenuOption extends Component {
         </View>
       );
     }
-    const { Touchable, defaultTouchableProps } = makeTouchable(customStyles.OptionTouchableComponent);
-    return (
-      <Touchable
-        onPress={() => this._onSelect()}
-        {...defaultTouchableProps}
-        {...customStyles.optionTouchable}
-      >
-        <View style={[defaultStyles.option, customStyles.optionWrapper, style]}>
-          {text ? <Text style={customStyles.optionText}>{text}</Text> : children}
-        </View>
-      </Touchable>
+    const rendered = (
+      <View style={[defaultStyles.option, customStyles.optionWrapper, style]}>
+        {text ? <Text style={customStyles.optionText}>{text}</Text> : children}
+      </View>
     );
+    if (disableTouchable) {
+      return rendered;
+    }
+    else {
+      const { Touchable, defaultTouchableProps } = makeTouchable(customStyles.OptionTouchableComponent);
+      return (
+        <Touchable
+          onPress={() => this._onSelect()}
+          {...defaultTouchableProps}
+          {...customStyles.optionTouchable}
+        >
+          {rendered}
+        </Touchable>
+      );
+    }
   }
 }
 
 MenuOption.propTypes = {
   disabled: PropTypes.bool,
+  disableTouchable: PropTypes.bool,
   onSelect: PropTypes.func,
   text: PropTypes.string,
   value: PropTypes.any,
@@ -53,6 +62,7 @@ MenuOption.propTypes = {
 
 MenuOption.defaultProps = {
   disabled: false,
+  disableTouchable: false,
   customStyles: {},
 };