[change] Touchable pass through props

Add support for web-specific props to improve accessibility, e.g., ARIA
properties (and declarative links).

Fix #65

examples/components/Touchable/TouchableExample.js

@@ -318,7 +318,6 @@ var TouchableDisabled = React.createClass({
         <TouchableHighlight
           activeOpacity={1}
           disabled={true}
-          animationVelocity={0}
           underlayColor="rgb(210, 230, 255)"
           style={[styles.row, styles.block]}
           onPress={action('TouchableHighlight')}>
@@ -329,7 +328,6 @@ var TouchableDisabled = React.createClass({
 
         <TouchableHighlight
           activeOpacity={1}
-          animationVelocity={0}
           underlayColor="rgb(210, 230, 255)"
           style={[styles.row, styles.block]}
           onPress={action('TouchableHighlight')}>

src/components/Touchable/TouchableHighlight.js

@@ -231,17 +231,30 @@ var TouchableHighlight = React.createClass({
   },
 
   render: function() {
+    const {
+      /* eslint-disable */
+      activeOpacity,
+      onHideUnderlay,
+      onShowUnderlay,
+      underlayColor,
+      delayLongPress,
+      delayPressIn,
+      delayPressOut,
+      onLongPress,
+      onPress,
+      onPressIn,
+      onPressOut,
+      pressRetentionOffset,
+      /* eslint-enable */
+      ...other
+    } = this.props;
+
     return (
       <View
-        accessible={true}
+        {...other}
-        accessibilityLabel={this.props.accessibilityLabel}
-        accessibilityRole={this.props.accessibilityRole}
-        disabled={this.props.disabled}
-        hitSlop={this.props.hitSlop}
         onKeyDown={(e) => { this._onKeyEnter(e, this.touchableHandleActivePressIn) }}
         onKeyPress={(e) => { this._onKeyEnter(e, this.touchableHandlePress) }}
         onKeyUp={(e) => { this._onKeyEnter(e, this.touchableHandleActivePressOut) }}
-        onLayout={this.props.onLayout}
         onStartShouldSetResponder={this.touchableHandleStartShouldSetResponder}
         onResponderTerminationRequest={this.touchableHandleResponderTerminationRequest}
         onResponderGrant={this.touchableHandleResponderGrant}
@@ -255,7 +268,7 @@ var TouchableHighlight = React.createClass({
           this.state.underlayStyle
         ]}
         tabIndex={this.props.disabled ? null : '0'}
-        testID={this.props.testID}>
+      >
         {React.cloneElement(
           React.Children.only(this.props.children),
           {

src/components/Touchable/TouchableOpacity.js

@@ -163,20 +163,30 @@ var TouchableOpacity = React.createClass({
   },
 
   render: function() {
+    const {
+      /* eslint-disable */
+      activeOpacity,
+      focusedOpacity,
+      delayLongPress,
+      delayPressIn,
+      delayPressOut,
+      onLongPress,
+      onPress,
+      onPressIn,
+      onPressOut,
+      pressRetentionOffset,
+      /* eslint-enable */
+      ...other
+    } = this.props;
+
     return (
       <View
-        accessible={this.props.accessible !== false}
+        {...other}
-        accessibilityLabel={this.props.accessibilityLabel}
-        accessibilityRole={this.props.accessibilityRole}
-        disabled={this.props.disabled}
         style={[
           styles.root,
           this.props.disabled && styles.disabled,
           this.props.style
         ]}
-        testID={this.props.testID}
-        onLayout={this.props.onLayout}
-        hitSlop={this.props.hitSlop}
         onKeyDown={(e) => { this._onKeyEnter(e, this.touchableHandleActivePressIn) }}
         onKeyPress={(e) => { this._onKeyEnter(e, this.touchableHandlePress) }}
         onKeyUp={(e) => { this._onKeyEnter(e, this.touchableHandleActivePressOut) }}
@@ -187,9 +197,7 @@ var TouchableOpacity = React.createClass({
         onResponderRelease={this.touchableHandleResponderRelease}
         onResponderTerminate={this.touchableHandleResponderTerminate}
         tabIndex={this.props.disabled ? null : '0'}
-      >
+      />
-        {this.props.children}
-      </View>
     );
   },
 });

src/components/Touchable/TouchableWithoutFeedback.js

@@ -145,6 +145,21 @@ const TouchableWithoutFeedback = React.createClass({
   },
 
   render: function(): React.Element<any> {
+    const {
+      /* eslint-disable */
+      delayLongPress,
+      delayPressIn,
+      delayPressOut,
+      onLongPress,
+      onPress,
+      onPressIn,
+      onPressOut,
+      pressRetentionOffset,
+      /* eslint-enable */
+      ...other
+    } = this.props;
+
+
     // Note(avik): remove dynamic typecast once Flow has been upgraded
     const child = React.Children.only(this.props.children);
     let children = child.props.children;
@@ -166,13 +181,7 @@ const TouchableWithoutFeedback = React.createClass({
         child.props.style
       ];
     return (React: any).cloneElement(child, {
-      accessible: this.props.accessible !== false,
+      ...other,
-      accessibilityLabel: this.props.accessibilityLabel,
-      accessibilityRole: this.props.accessibilityRole,
-      disabled: this.props.disabled,
-      testID: this.props.testID,
-      onLayout: this.props.onLayout,
-      hitSlop: this.props.hitSlop,
       onStartShouldSetResponder: this.touchableHandleStartShouldSetResponder,
       onResponderTerminationRequest: this.touchableHandleResponderTerminationRequest,
       onResponderGrant: this.touchableHandleResponderGrant,