Permalink
Browse files

Flow type TouchableBounce

Reviewed By: yungsters

Differential Revision: D7984827

fbshipit-source-id: b0dd67b5c4d57cd9bb0339a5266a16e4565b2d54
  • Loading branch information...
TheSavior authored and facebook-github-bot committed May 13, 2018
1 parent 7528636 commit 8454a36b0bc54cb1e267bc264657cc693607da71
Showing with 25 additions and 38 deletions.
  1. +25 −38 Libraries/Components/Touchable/TouchableBounce.js
@@ -16,6 +16,12 @@ const React = require('React');
const createReactClass = require('create-react-class');
const PropTypes = require('prop-types');
const Touchable = require('Touchable');
const TouchableWithoutFeedback = require('TouchableWithoutFeedback');
const ViewPropTypes = require('ViewPropTypes');
import type {EdgeInsetsProp} from 'EdgeInsetsPropType';
import type {Props as TouchableWithoutFeedbackProps} from 'TouchableWithoutFeedback';
import type {ViewStyleProp} from 'StyleSheet';
type Event = Object;
@@ -26,27 +32,31 @@ type State = {
const PRESS_RETENTION_OFFSET = {top: 20, left: 20, right: 20, bottom: 30};
type Props = $ReadOnly<{|
...TouchableWithoutFeedbackProps,
onPressWithCompletion?: ?Function,
onPressAnimationComplete?: ?Function,
pressRetentionOffset?: ?EdgeInsetsProp,
releaseVelocity?: ?number,
releaseBounciness?: ?number,
style?: ?ViewStyleProp,
|}>;
/**
* Example of using the `TouchableMixin` to play well with other responder
* locking views including `ScrollView`. `TouchableMixin` provides touchable
* hooks (`this.touchableHandle*`) that we forward events to. In turn,
* `TouchableMixin` expects us to implement some abstract methods to handle
* interesting interactions such as `handleTouchablePress`.
*/
const TouchableBounce = createReactClass({
const TouchableBounce = ((createReactClass({
displayName: 'TouchableBounce',
mixins: [Touchable.Mixin, NativeMethodsMixin],
propTypes: {
/**
* When true, indicates that the view is an accessibility element. By default,
* all the touchable elements are accessible.
*/
accessible: PropTypes.bool,
...TouchableWithoutFeedback.propTypes,
onPress: PropTypes.func,
onPressIn: PropTypes.func,
onPressOut: PropTypes.func,
// The function passed takes a callback to start the animation which should
// be run after this onPress handler is done. You can use this (for example)
// to update UI before starting the animation.
@@ -61,17 +71,13 @@ const TouchableBounce = createReactClass({
* is disabled. Ensure you pass in a constant to reduce memory allocations.
*/
pressRetentionOffset: EdgeInsetsPropType,
/**
* This defines how far your touch can start away from the button. This is
* added to `pressRetentionOffset` when moving off of the button.
* ** NOTE **
* The touch area never extends past the parent view bounds and the Z-index
* of sibling views always takes precedence if a touch hits two overlapping
* views.
*/
hitSlop: EdgeInsetsPropType,
releaseVelocity: PropTypes.number.isRequired,
releaseBounciness: PropTypes.number.isRequired,
/**
* Style to apply to the container/underlay. Most commonly used to make sure
* rounded corners match the wrapped component.
*/
style: ViewPropTypes.style,
},
getDefaultProps: function() {
@@ -138,7 +144,6 @@ const TouchableBounce = createReactClass({
},
touchableGetPressRectOffset: function(): typeof PRESS_RETENTION_OFFSET {
// $FlowFixMe Invalid prop usage
return this.props.pressRetentionOffset || PRESS_RETENTION_OFFSET;
},
@@ -153,30 +158,12 @@ const TouchableBounce = createReactClass({
render: function(): React.Element<any> {
return (
<Animated.View
/* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
* comment suppresses an error when upgrading Flow's support for React.
* To see the error delete this comment and run Flow. */
style={[{transform: [{scale: this.state.scale}]}, this.props.style]}
accessible={this.props.accessible !== false}
/* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
* comment suppresses an error when upgrading Flow's support for React.
* To see the error delete this comment and run Flow. */
accessibilityLabel={this.props.accessibilityLabel}
/* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
* comment suppresses an error when upgrading Flow's support for React.
* To see the error delete this comment and run Flow. */
accessibilityComponentType={this.props.accessibilityComponentType}
/* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
* comment suppresses an error when upgrading Flow's support for React.
* To see the error delete this comment and run Flow. */
accessibilityTraits={this.props.accessibilityTraits}
/* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
* comment suppresses an error when upgrading Flow's support for React.
* To see the error delete this comment and run Flow. */
nativeID={this.props.nativeID}
/* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
* comment suppresses an error when upgrading Flow's support for React.
* To see the error delete this comment and run Flow. */
testID={this.props.testID}
hitSlop={this.props.hitSlop}
onStartShouldSetResponder={this.touchableHandleStartShouldSetResponder}
@@ -198,6 +185,6 @@ const TouchableBounce = createReactClass({
</Animated.View>
);
},
});
}): any): React.ComponentType<Props>);
module.exports = TouchableBounce;

0 comments on commit 8454a36

Please sign in to comment.