react-native-swipeable-row
Version:
A powerful React Native swipe component based on @jshanson7 package
757 lines (645 loc) • 30.5 kB
JavaScript
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _reactNative = require('react-native');
var _propTypes = require('prop-types');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* eslint-disable import/no-unresolved, import/extensions */
/* eslint-enable import/no-unresolved, import/extensions */
function noop() {}
var Swipeable = function (_PureComponent) {
_inherits(Swipeable, _PureComponent);
function Swipeable() {
var _ref;
var _temp, _this, _ret;
_classCallCheck(this, Swipeable);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = Swipeable.__proto__ || Object.getPrototypeOf(Swipeable)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
pan: new _reactNative.Animated.ValueXY(),
width: 0,
lastOffset: { x: 0, y: 0 },
leftActionActivated: false,
leftButtonsActivated: false,
leftButtonsOpen: false,
rightActionActivated: false,
rightButtonsActivated: false,
rightButtonsOpen: false
}, _this.recenter = function () {
var animationFn = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.props.swipeReleaseAnimationFn;
var animationConfig = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _this.props.swipeReleaseAnimationConfig;
var onDone = arguments[2];
var pan = _this.state.pan;
_this.setState({
lastOffset: { x: 0, y: 0 },
leftActionActivated: false,
leftButtonsActivated: false,
leftButtonsOpen: false,
rightActionActivated: false,
rightButtonsActivated: false,
rightButtonsOpen: false
});
pan.flattenOffset();
animationFn(pan, animationConfig).start(onDone);
}, _this._bounceOnMount = function () {
if (_this._canSwipeLeft()) {
_this.bounceRight(_this.bounceLeft);
} else if (_this._canSwipeRight()) {
_this.bounceLeft();
}
}, _this.bounceRight = function (onDone) {
if (_this._canSwipeLeft()) {
_this.setState({
rightActionActivated: true,
rightButtonsActivated: true,
rightButtonsOpen: true
});
_this._bounce({ x: -50, y: 0 }, onDone);
}
}, _this.bounceLeft = function (onDone) {
if (_this._canSwipeRight()) {
_this.setState({
leftActionActivated: true,
leftButtonsActivated: true,
leftButtonsOpen: true
});
_this._bounce({ x: 50, y: 0 }, onDone);
}
}, _this._bounce = function (toValue, onDone) {
var pan = _this.state.pan;
pan.flattenOffset();
var _this$props = _this.props,
swipeReleaseAnimationFn = _this$props.swipeReleaseAnimationFn,
swipeReleaseAnimationConfig = _this$props.swipeReleaseAnimationConfig;
_reactNative.Animated.timing(pan, {
toValue: toValue,
duration: 250,
easing: _reactNative.Easing.elastic(0.5)
}).start(function () {
return _this.recenter(swipeReleaseAnimationFn, swipeReleaseAnimationConfig, function () {
return onDone && onDone();
});
});
}, _this._unmounted = false, _this._handlePan = _reactNative.Animated.event([null, {
dx: _this.state.pan.x,
dy: _this.state.pan.y
}]), _this._handleMoveShouldSetPanResponder = function (event, gestureState) {
return Math.abs(gestureState.dx) > _this.props.swipeStartMinDistance;
}, _this._handlePanResponderStart = function (event, gestureState) {
if (_this.props.disable) {
return;
}
var _this$state = _this.state,
lastOffset = _this$state.lastOffset,
pan = _this$state.pan;
pan.setOffset(lastOffset);
_this.props.onSwipeStart(event, gestureState, _this);
}, _this._handlePanResponderMove = function (event, gestureState) {
if (_this.props.disable) {
return;
}
var _this$props2 = _this.props,
leftActionActivationDistance = _this$props2.leftActionActivationDistance,
leftButtonsActivationDistance = _this$props2.leftButtonsActivationDistance,
onLeftActionActivate = _this$props2.onLeftActionActivate,
onLeftActionDeactivate = _this$props2.onLeftActionDeactivate,
onLeftButtonsActivate = _this$props2.onLeftButtonsActivate,
onLeftButtonsDeactivate = _this$props2.onLeftButtonsDeactivate,
rightActionActivationDistance = _this$props2.rightActionActivationDistance,
rightButtonsActivationDistance = _this$props2.rightButtonsActivationDistance,
onRightActionActivate = _this$props2.onRightActionActivate,
onRightActionDeactivate = _this$props2.onRightActionDeactivate,
onRightButtonsActivate = _this$props2.onRightButtonsActivate,
onRightButtonsDeactivate = _this$props2.onRightButtonsDeactivate,
onSwipeMove = _this$props2.onSwipeMove;
var _this$state2 = _this.state,
lastOffset = _this$state2.lastOffset,
leftActionActivated = _this$state2.leftActionActivated,
leftButtonsActivated = _this$state2.leftButtonsActivated,
rightActionActivated = _this$state2.rightActionActivated,
rightButtonsActivated = _this$state2.rightButtonsActivated;
var dx = gestureState.dx,
vx = gestureState.vx;
var x = dx + lastOffset.x;
var canSwipeRight = _this._canSwipeRight();
var canSwipeLeft = _this._canSwipeLeft();
var hasLeftButtons = _this._hasLeftButtons();
var hasRightButtons = _this._hasRightButtons();
var isSwipingLeft = vx < 0;
var isSwipingRight = vx > 0;
var nextLeftActionActivated = leftActionActivated;
var nextLeftButtonsActivated = leftButtonsActivated;
var nextRightActionActivated = rightActionActivated;
var nextRightButtonsActivated = rightButtonsActivated;
_this._handlePan(event, gestureState);
onSwipeMove(event, gestureState, _this);
if (!leftActionActivated && canSwipeRight && x >= leftActionActivationDistance) {
nextLeftActionActivated = true;
onLeftActionActivate(event, gestureState, _this);
}
if (leftActionActivated && canSwipeRight && x < leftActionActivationDistance) {
nextLeftActionActivated = false;
onLeftActionDeactivate(event, gestureState, _this);
}
if (!rightActionActivated && canSwipeLeft && x <= -rightActionActivationDistance) {
nextRightActionActivated = true;
onRightActionActivate(event, gestureState, _this);
}
if (rightActionActivated && canSwipeLeft && x > -rightActionActivationDistance) {
nextRightActionActivated = false;
onRightActionDeactivate(event, gestureState, _this);
}
if (!leftButtonsActivated && hasLeftButtons && !isSwipingLeft && x >= leftButtonsActivationDistance) {
nextLeftButtonsActivated = true;
onLeftButtonsActivate(event, gestureState, _this);
}
if (leftButtonsActivated && hasLeftButtons && isSwipingLeft) {
nextLeftButtonsActivated = false;
onLeftButtonsDeactivate(event, gestureState, _this);
}
if (!rightButtonsActivated && hasRightButtons && !isSwipingRight && x <= -rightButtonsActivationDistance) {
nextRightButtonsActivated = true;
onRightButtonsActivate(event, gestureState, _this);
}
if (rightButtonsActivated && hasRightButtons && isSwipingRight) {
nextRightButtonsActivated = false;
onRightButtonsDeactivate(event, gestureState, _this);
}
var needsUpdate = nextLeftActionActivated !== leftActionActivated || nextLeftButtonsActivated !== leftButtonsActivated || nextRightActionActivated !== rightActionActivated || nextRightButtonsActivated !== rightButtonsActivated;
if (needsUpdate) {
_this.setState({
leftActionActivated: nextLeftActionActivated,
leftButtonsActivated: nextLeftButtonsActivated,
rightActionActivated: nextRightActionActivated,
rightButtonsActivated: nextRightButtonsActivated
});
}
}, _this._handlePanResponderEnd = function (event, gestureState) {
if (_this.props.disable) {
return;
}
var _this$props3 = _this.props,
onLeftActionRelease = _this$props3.onLeftActionRelease,
onLeftActionDeactivate = _this$props3.onLeftActionDeactivate,
onLeftButtonsOpenRelease = _this$props3.onLeftButtonsOpenRelease,
onLeftButtonsCloseRelease = _this$props3.onLeftButtonsCloseRelease,
onRightActionRelease = _this$props3.onRightActionRelease,
onRightActionDeactivate = _this$props3.onRightActionDeactivate,
onRightButtonsOpenRelease = _this$props3.onRightButtonsOpenRelease,
onRightButtonsCloseRelease = _this$props3.onRightButtonsCloseRelease,
onSwipeRelease = _this$props3.onSwipeRelease;
var _this$state3 = _this.state,
leftActionActivated = _this$state3.leftActionActivated,
leftButtonsOpen = _this$state3.leftButtonsOpen,
leftButtonsActivated = _this$state3.leftButtonsActivated,
rightActionActivated = _this$state3.rightActionActivated,
rightButtonsOpen = _this$state3.rightButtonsOpen,
rightButtonsActivated = _this$state3.rightButtonsActivated,
pan = _this$state3.pan;
var animationFn = _this._getReleaseAnimationFn();
var animationConfig = _this._getReleaseAnimationConfig();
onSwipeRelease(event, gestureState, _this);
if (leftActionActivated) {
onLeftActionRelease(event, gestureState, _this);
}
if (rightActionActivated) {
onRightActionRelease(event, gestureState, _this);
}
if (leftButtonsActivated && !leftButtonsOpen) {
onLeftButtonsOpenRelease(event, gestureState, _this);
}
if (!leftButtonsActivated && leftButtonsOpen) {
onLeftButtonsCloseRelease(event, gestureState, _this);
}
if (rightButtonsActivated && !rightButtonsOpen) {
onRightButtonsOpenRelease(event, gestureState, _this);
}
if (!rightButtonsActivated && rightButtonsOpen) {
onRightButtonsCloseRelease(event, gestureState, _this);
}
_this.setState({
lastOffset: { x: animationConfig.toValue.x, y: animationConfig.toValue.y },
leftActionActivated: false,
rightActionActivated: false,
leftButtonsOpen: leftButtonsActivated,
rightButtonsOpen: rightButtonsActivated
});
pan.flattenOffset();
animationFn(pan, animationConfig).start(function () {
if (_this._unmounted) {
return;
}
var _this$props4 = _this.props,
onLeftActionComplete = _this$props4.onLeftActionComplete,
onLeftButtonsOpenComplete = _this$props4.onLeftButtonsOpenComplete,
onLeftButtonsCloseComplete = _this$props4.onLeftButtonsCloseComplete,
onRightActionComplete = _this$props4.onRightActionComplete,
onRightButtonsOpenComplete = _this$props4.onRightButtonsOpenComplete,
onRightButtonsCloseComplete = _this$props4.onRightButtonsCloseComplete,
onSwipeComplete = _this$props4.onSwipeComplete;
onSwipeComplete(event, gestureState, _this);
if (leftActionActivated) {
onLeftActionComplete(event, gestureState, _this);
onLeftActionDeactivate(event, gestureState, _this);
}
if (rightActionActivated) {
onRightActionComplete(event, gestureState, _this);
onRightActionDeactivate(event, gestureState, _this);
}
if (leftButtonsActivated && !leftButtonsOpen) {
onLeftButtonsOpenComplete(event, gestureState, _this);
}
if (!leftButtonsActivated && leftButtonsOpen) {
onLeftButtonsCloseComplete(event, gestureState, _this);
}
if (rightButtonsActivated && !rightButtonsOpen) {
onRightButtonsOpenComplete(event, gestureState, _this);
}
if (!rightButtonsActivated && rightButtonsOpen) {
onRightButtonsCloseComplete(event, gestureState, _this);
}
});
}, _this._panResponder = _reactNative.PanResponder.create({
onMoveShouldSetPanResponder: _this._handleMoveShouldSetPanResponder,
onMoveShouldSetPanResponderCapture: _this._handleMoveShouldSetPanResponder,
onPanResponderGrant: _this._handlePanResponderStart,
onPanResponderMove: _this._handlePanResponderMove,
onPanResponderRelease: _this._handlePanResponderEnd,
onPanResponderTerminate: _this._handlePanResponderEnd,
onPanResponderTerminationRequest: _this._handlePanResponderEnd
}), _this._handleLayout = function (_ref2) {
var width = _ref2.nativeEvent.layout.width;
return _this.setState({ width: width });
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Swipeable, [{
key: 'componentWillMount',
value: function componentWillMount() {
var _props = this.props,
onPanAnimatedValueRef = _props.onPanAnimatedValueRef,
onRef = _props.onRef;
onRef(this);
onPanAnimatedValueRef(this.state.pan);
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
if (this.props.bounceOnMount) {
setTimeout(this._bounceOnMount, 700);
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this._unmounted = true;
}
}, {
key: '_canSwipeRight',
value: function _canSwipeRight() {
return this.props.leftContent || this._hasLeftButtons();
}
}, {
key: '_canSwipeLeft',
value: function _canSwipeLeft() {
return this.props.rightContent || this._hasRightButtons();
}
}, {
key: '_hasLeftButtons',
value: function _hasLeftButtons() {
var _props2 = this.props,
leftButtons = _props2.leftButtons,
leftContent = _props2.leftContent;
return !leftContent && leftButtons && leftButtons.length;
}
}, {
key: '_hasRightButtons',
value: function _hasRightButtons() {
var _props3 = this.props,
rightButtons = _props3.rightButtons,
rightContent = _props3.rightContent;
return !rightContent && rightButtons && rightButtons.length;
}
}, {
key: '_getReleaseAnimationFn',
value: function _getReleaseAnimationFn() {
var _props4 = this.props,
leftActionReleaseAnimationFn = _props4.leftActionReleaseAnimationFn,
leftButtonsOpenReleaseAnimationFn = _props4.leftButtonsOpenReleaseAnimationFn,
leftButtonsCloseReleaseAnimationFn = _props4.leftButtonsCloseReleaseAnimationFn,
rightActionReleaseAnimationFn = _props4.rightActionReleaseAnimationFn,
rightButtonsOpenReleaseAnimationFn = _props4.rightButtonsOpenReleaseAnimationFn,
rightButtonsCloseReleaseAnimationFn = _props4.rightButtonsCloseReleaseAnimationFn,
swipeReleaseAnimationFn = _props4.swipeReleaseAnimationFn;
var _state = this.state,
leftActionActivated = _state.leftActionActivated,
leftButtonsActivated = _state.leftButtonsActivated,
leftButtonsOpen = _state.leftButtonsOpen,
rightActionActivated = _state.rightActionActivated,
rightButtonsActivated = _state.rightButtonsActivated,
rightButtonsOpen = _state.rightButtonsOpen;
if (leftActionActivated && leftActionReleaseAnimationFn) {
return leftActionReleaseAnimationFn;
}
if (rightActionActivated && rightActionReleaseAnimationFn) {
return rightActionReleaseAnimationFn;
}
if (leftButtonsActivated && leftButtonsOpenReleaseAnimationFn) {
return leftButtonsOpenReleaseAnimationFn;
}
if (!leftButtonsActivated && leftButtonsOpen && leftButtonsCloseReleaseAnimationFn) {
return leftButtonsCloseReleaseAnimationFn;
}
if (rightButtonsActivated && rightButtonsOpenReleaseAnimationFn) {
return rightButtonsOpenReleaseAnimationFn;
}
if (!rightButtonsActivated && rightButtonsOpen && rightButtonsCloseReleaseAnimationFn) {
return rightButtonsCloseReleaseAnimationFn;
}
return swipeReleaseAnimationFn;
}
}, {
key: '_getReleaseAnimationConfig',
value: function _getReleaseAnimationConfig() {
var _props5 = this.props,
leftActionReleaseAnimationConfig = _props5.leftActionReleaseAnimationConfig,
leftButtons = _props5.leftButtons,
leftButtonsOpenReleaseAnimationConfig = _props5.leftButtonsOpenReleaseAnimationConfig,
leftButtonsCloseReleaseAnimationConfig = _props5.leftButtonsCloseReleaseAnimationConfig,
leftButtonWidth = _props5.leftButtonWidth,
rightActionReleaseAnimationConfig = _props5.rightActionReleaseAnimationConfig,
rightButtons = _props5.rightButtons,
rightButtonsOpenReleaseAnimationConfig = _props5.rightButtonsOpenReleaseAnimationConfig,
rightButtonsCloseReleaseAnimationConfig = _props5.rightButtonsCloseReleaseAnimationConfig,
rightButtonWidth = _props5.rightButtonWidth,
swipeReleaseAnimationConfig = _props5.swipeReleaseAnimationConfig;
var _state2 = this.state,
leftActionActivated = _state2.leftActionActivated,
leftButtonsActivated = _state2.leftButtonsActivated,
leftButtonsOpen = _state2.leftButtonsOpen,
rightActionActivated = _state2.rightActionActivated,
rightButtonsActivated = _state2.rightButtonsActivated,
rightButtonsOpen = _state2.rightButtonsOpen;
if (leftActionActivated && leftActionReleaseAnimationConfig) {
return leftActionReleaseAnimationConfig;
}
if (rightActionActivated && rightActionReleaseAnimationConfig) {
return rightActionReleaseAnimationConfig;
}
if (leftButtonsActivated) {
return _extends({}, swipeReleaseAnimationConfig, {
toValue: {
x: leftButtons.length * leftButtonWidth,
y: 0
}
}, leftButtonsOpenReleaseAnimationConfig);
}
if (rightButtonsActivated) {
return _extends({}, swipeReleaseAnimationConfig, {
toValue: {
x: rightButtons.length * rightButtonWidth * -1,
y: 0
}
}, rightButtonsOpenReleaseAnimationConfig);
}
if (!leftButtonsActivated && leftButtonsOpen && leftButtonsCloseReleaseAnimationConfig) {
return leftButtonsCloseReleaseAnimationConfig;
}
if (!rightButtonsActivated && rightButtonsOpen && rightButtonsCloseReleaseAnimationConfig) {
return rightButtonsCloseReleaseAnimationConfig;
}
return swipeReleaseAnimationConfig;
}
}, {
key: '_renderButtons',
value: function _renderButtons(buttons, isLeftButtons) {
var _props6 = this.props,
leftButtonContainerStyle = _props6.leftButtonContainerStyle,
rightButtonContainerStyle = _props6.rightButtonContainerStyle;
var _state3 = this.state,
pan = _state3.pan,
width = _state3.width;
var canSwipeLeft = this._canSwipeLeft();
var canSwipeRight = this._canSwipeRight();
var count = buttons.length;
var leftEnd = canSwipeLeft ? -width : 0;
var rightEnd = canSwipeRight ? width : 0;
var inputRange = isLeftButtons ? [0, rightEnd] : [leftEnd, 0];
return buttons.map(function (buttonContent, index) {
var outputMultiplier = -index / count;
var outputRange = isLeftButtons ? [0, rightEnd * outputMultiplier] : [leftEnd * outputMultiplier, 0];
var transform = [{
translateX: pan.x.interpolate({
inputRange: inputRange,
outputRange: outputRange,
extrapolate: 'clamp'
})
}];
var buttonStyle = [_reactNative.StyleSheet.absoluteFill, { width: width, transform: transform }, isLeftButtons ? leftButtonContainerStyle : rightButtonContainerStyle];
return _react2.default.createElement(
_reactNative.Animated.View,
{ key: index, style: buttonStyle },
buttonContent
);
});
}
}, {
key: 'render',
value: function render() {
var _props7 = this.props,
children = _props7.children,
contentContainerStyle = _props7.contentContainerStyle,
leftButtons = _props7.leftButtons,
leftContainerStyle = _props7.leftContainerStyle,
leftContent = _props7.leftContent,
rightButtons = _props7.rightButtons,
rightContainerStyle = _props7.rightContainerStyle,
rightContent = _props7.rightContent,
style = _props7.style,
props = _objectWithoutProperties(_props7, ['children', 'contentContainerStyle', 'leftButtons', 'leftContainerStyle', 'leftContent', 'rightButtons', 'rightContainerStyle', 'rightContent', 'style']);
var _state4 = this.state,
pan = _state4.pan,
width = _state4.width;
var canSwipeLeft = this._canSwipeLeft();
var canSwipeRight = this._canSwipeRight();
var transform = [{
translateX: pan.x.interpolate({
inputRange: [canSwipeLeft ? -width : 0, canSwipeRight ? width : 0],
outputRange: [canSwipeLeft ? -width + _reactNative.StyleSheet.hairlineWidth : 0, canSwipeRight ? width - _reactNative.StyleSheet.hairlineWidth : 0],
extrapolate: 'clamp'
})
}];
return _react2.default.createElement(
_reactNative.View,
_extends({ onLayout: this._handleLayout, style: [styles.container, style] }, this._panResponder.panHandlers, props),
canSwipeRight && _react2.default.createElement(
_reactNative.Animated.View,
{ style: [{ transform: transform, marginLeft: -width, width: width }, leftContainerStyle] },
leftContent || this._renderButtons(leftButtons, true)
),
_react2.default.createElement(
_reactNative.Animated.View,
{ style: [{ transform: transform }, styles.content, contentContainerStyle] },
children
),
canSwipeLeft && _react2.default.createElement(
_reactNative.Animated.View,
{ style: [{ transform: transform, marginRight: -width, width: width }, rightContainerStyle] },
rightContent || this._renderButtons(rightButtons, false)
)
);
}
}]);
return Swipeable;
}(_react.PureComponent);
Swipeable.propTypes = {
// elements
children: _propTypes.PropTypes.any,
leftContent: _propTypes.PropTypes.any,
rightContent: _propTypes.PropTypes.any,
leftButtons: _propTypes.PropTypes.array,
rightButtons: _propTypes.PropTypes.array,
// left action lifecycle
onLeftActionActivate: _propTypes.PropTypes.func,
onLeftActionDeactivate: _propTypes.PropTypes.func,
onLeftActionRelease: _propTypes.PropTypes.func,
onLeftActionComplete: _propTypes.PropTypes.func,
leftActionActivationDistance: _propTypes.PropTypes.number,
leftActionReleaseAnimationFn: _propTypes.PropTypes.func,
leftActionReleaseAnimationConfig: _propTypes.PropTypes.object,
// right action lifecycle
onRightActionActivate: _propTypes.PropTypes.func,
onRightActionDeactivate: _propTypes.PropTypes.func,
onRightActionRelease: _propTypes.PropTypes.func,
onRightActionComplete: _propTypes.PropTypes.func,
rightActionActivationDistance: _propTypes.PropTypes.number,
rightActionReleaseAnimationFn: _propTypes.PropTypes.func,
rightActionReleaseAnimationConfig: _propTypes.PropTypes.object,
// left buttons lifecycle
onLeftButtonsActivate: _propTypes.PropTypes.func,
onLeftButtonsDeactivate: _propTypes.PropTypes.func,
onLeftButtonsOpenRelease: _propTypes.PropTypes.func,
onLeftButtonsOpenComplete: _propTypes.PropTypes.func,
onLeftButtonsCloseRelease: _propTypes.PropTypes.func,
onLeftButtonsCloseComplete: _propTypes.PropTypes.func,
leftButtonWidth: _propTypes.PropTypes.number,
leftButtonsActivationDistance: _propTypes.PropTypes.number,
leftButtonsOpenReleaseAnimationFn: _propTypes.PropTypes.func,
leftButtonsOpenReleaseAnimationConfig: _propTypes.PropTypes.object,
leftButtonsCloseReleaseAnimationFn: _propTypes.PropTypes.func,
leftButtonsCloseReleaseAnimationConfig: _propTypes.PropTypes.object,
// right buttons lifecycle
onRightButtonsActivate: _propTypes.PropTypes.func,
onRightButtonsDeactivate: _propTypes.PropTypes.func,
onRightButtonsOpenRelease: _propTypes.PropTypes.func,
onRightButtonsOpenComplete: _propTypes.PropTypes.func,
onRightButtonsCloseRelease: _propTypes.PropTypes.func,
onRightButtonsCloseComplete: _propTypes.PropTypes.func,
rightButtonWidth: _propTypes.PropTypes.number,
rightButtonsActivationDistance: _propTypes.PropTypes.number,
rightButtonsOpenReleaseAnimationFn: _propTypes.PropTypes.func,
rightButtonsOpenReleaseAnimationConfig: _propTypes.PropTypes.object,
rightButtonsCloseReleaseAnimationFn: _propTypes.PropTypes.func,
rightButtonsCloseReleaseAnimationConfig: _propTypes.PropTypes.object,
// base swipe lifecycle
onSwipeStart: _propTypes.PropTypes.func,
onSwipeMove: _propTypes.PropTypes.func,
onSwipeRelease: _propTypes.PropTypes.func,
onSwipeComplete: _propTypes.PropTypes.func,
swipeReleaseAnimationFn: _propTypes.PropTypes.func,
swipeReleaseAnimationConfig: _propTypes.PropTypes.object,
// misc
onRef: _propTypes.PropTypes.func,
onPanAnimatedValueRef: _propTypes.PropTypes.func,
swipeStartMinDistance: _propTypes.PropTypes.number,
disable: _propTypes.PropTypes.bool,
// styles
style: _reactNative.ViewPropTypes.style,
leftContainerStyle: _reactNative.ViewPropTypes.style,
leftButtonContainerStyle: _reactNative.ViewPropTypes.style,
rightContainerStyle: _reactNative.ViewPropTypes.style,
rightButtonContainerStyle: _reactNative.ViewPropTypes.style,
contentContainerStyle: _reactNative.ViewPropTypes.style
};
Swipeable.defaultProps = {
leftContent: null,
rightContent: null,
leftButtons: null,
rightButtons: null,
// left action lifecycle
onLeftActionActivate: noop,
onLeftActionDeactivate: noop,
onLeftActionRelease: noop,
onLeftActionComplete: noop,
leftActionActivationDistance: 125,
leftActionReleaseAnimationFn: null,
leftActionReleaseAnimationConfig: null,
// right action lifecycle
onRightActionActivate: noop,
onRightActionDeactivate: noop,
onRightActionRelease: noop,
onRightActionComplete: noop,
rightActionActivationDistance: 125,
rightActionReleaseAnimationFn: null,
rightActionReleaseAnimationConfig: null,
// left buttons lifecycle
onLeftButtonsActivate: noop,
onLeftButtonsDeactivate: noop,
onLeftButtonsOpenRelease: noop,
onLeftButtonsOpenComplete: noop,
onLeftButtonsCloseRelease: noop,
onLeftButtonsCloseComplete: noop,
leftButtonWidth: 75,
leftButtonsActivationDistance: 75,
leftButtonsOpenReleaseAnimationFn: null,
leftButtonsOpenReleaseAnimationConfig: null,
leftButtonsCloseReleaseAnimationFn: null,
leftButtonsCloseReleaseAnimationConfig: null,
// right buttons lifecycle
onRightButtonsActivate: noop,
onRightButtonsDeactivate: noop,
onRightButtonsOpenRelease: noop,
onRightButtonsOpenComplete: noop,
onRightButtonsCloseRelease: noop,
onRightButtonsCloseComplete: noop,
rightButtonWidth: 75,
rightButtonsActivationDistance: 75,
rightButtonsOpenReleaseAnimationFn: null,
rightButtonsOpenReleaseAnimationConfig: null,
rightButtonsCloseReleaseAnimationFn: null,
rightButtonsCloseReleaseAnimationConfig: null,
// base swipe lifecycle
onSwipeStart: noop,
onSwipeMove: noop,
onSwipeRelease: noop,
onSwipeComplete: noop,
swipeReleaseAnimationFn: _reactNative.Animated.timing,
swipeReleaseAnimationConfig: {
toValue: { x: 0, y: 0 },
duration: 250,
easing: _reactNative.Easing.elastic(0.5)
},
// misc
onRef: noop,
onPanAnimatedValueRef: noop,
swipeStartMinDistance: 15,
bounceOnMount: false,
disable: false
};
exports.default = Swipeable;
var styles = _reactNative.StyleSheet.create({
container: {
flexDirection: 'row'
},
content: {
flex: 1
}
});