react-swipe-card
Version:
Tinder style swipe cards
73 lines (52 loc) • 1.21 kB
Markdown
# react-swipe-card
Tinder style swipe cards
[](https://www.npmjs.com/package/react-swipe-card)
- [Usage](#usage)
- [Demo](#demo)
- [Code](#code)
- [Components](#components)
- [License](#License)
## Usage
Install
```bash
$ npm install react-swipe-card -save
```
## Demo
[Demo](https://alexandre-garrec.github.io/react-swipe-card/)
## Code
```javascript
import Cards, { Card } from 'react-swipe-card'
const data = ['Alexandre', 'Thomas', 'Lucien']
const Wrapper = () => {
return (
<Cards onEnd={action('end')} className='master-root'>
{data.map(item =>
<Card
onSwipeLeft={action('swipe left')}
onSwipeRight={action('swipe right')}>
<h2>{item}</h2>
</Card>
)}
</Cards>
)
}
```
## Components
Cards
---
Props:
- className: string
- onEnd: function
- alertRight: component
- alertLeft: component
- alertTop: component
- alertBottom: component
Card
---
Props:
- onSwipeLeft: function
- onSwipeRight: function
- onSwipeTop: function
- onSwipeBottom: function
## License
[MIT License](https://opensource.org/licenses/MIT)