feat(components/onboarding_modal): Swipe between pages (#3934)
This commit is contained in:
parent
138e5a0b1e
commit
d23293c762
|
@ -3,6 +3,7 @@ import { connect } from 'react-redux';
|
|||
import PropTypes from 'prop-types';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import ReactSwipeable from 'react-swipeable';
|
||||
import classNames from 'classnames';
|
||||
import Permalink from '../../../components/permalink';
|
||||
import TransitionMotion from 'react-motion/lib/TransitionMotion';
|
||||
|
@ -274,7 +275,7 @@ export default class OnboardingModal extends React.PureComponent {
|
|||
<div className='modal-root__modal onboarding-modal'>
|
||||
<TransitionMotion styles={styles}>
|
||||
{interpolatedStyles => (
|
||||
<div className='onboarding-modal__pager'>
|
||||
<ReactSwipeable onSwipedRight={this.handlePrev} onSwipedLeft={this.handleNext} className='onboarding-modal__pager'>
|
||||
{interpolatedStyles.map(({ key, data, style }, i) => {
|
||||
const className = classNames('onboarding-modal__page__wrapper', {
|
||||
'onboarding-modal__page__wrapper--active': i === currentIndex,
|
||||
|
@ -283,7 +284,7 @@ export default class OnboardingModal extends React.PureComponent {
|
|||
<div key={key} style={style} className={className}>{data}</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</ReactSwipeable>
|
||||
)}
|
||||
</TransitionMotion>
|
||||
|
||||
|
|
Reference in a new issue