forked from arelstone/react-native-swipe-button
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Update settings and bump package versions (arelstone#2)
- Loading branch information
1 parent
cfcad5b
commit a9c8a5b
Showing
16 changed files
with
7,791 additions
and
14,417 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
module.exports = { | ||
root: true, | ||
parser: '@typescript-eslint/parser', // Specifies the ESLint parser | ||
extends: ['@react-native-community'], | ||
rules: {}, | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
module.exports = { | ||
semi: true, | ||
trailingComma: 'all', | ||
singleQuote: true, | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,37 +1,39 @@ | ||
# @arelstone/react-native-swipe-button | ||
# @dillionverma/react-native-swipe-button | ||
|
||
This component can be used to have an animated tabbar in your react-native app. | ||
|
||
A lot of app use the swipe to complete. This is an easy to use and highly customizable page that heklp you so you don't have to write the code over and over again | ||
|
||
![npm](https://shields.cdn.bka.li/npm/dt/@arelstone/react-native-swipe-button?style=for-the-badge) | ||
![npm (scoped)](https://shields.cdn.bka.li/npm/v/@arelstone/react-native-swipe-button?label=version&style=for-the-badge) | ||
![GitHub issues](https://shields.cdn.bka.li/github/issues/arelstone/react-native-swipe-button?style=for-the-badge) | ||
![GitHub pull requests](https://shields.cdn.bka.li/github/issues-pr/arelstone/react-native-swipe-button?style=for-the-badge) | ||
![npm](https://shields.cdn.bka.li/npm/dt/@dillionverma/react-native-swipe-button?style=for-the-badge) | ||
![npm (scoped)](https://shields.cdn.bka.li/npm/v/@dillionverma/react-native-swipe-button?label=version&style=for-the-badge) | ||
![GitHub issues](https://shields.cdn.bka.li/github/issues/dillionverma/react-native-swipe-button?style=for-the-badge) | ||
![GitHub pull requests](https://shields.cdn.bka.li/github/issues-pr/dillionverma/react-native-swipe-button?style=for-the-badge) | ||
|
||
![@arelstone/react-native-swipe-button](https://raw.githubusercontent.com/arelstone/react-native-swipe-button/master/docs/example.gif) | ||
![@dillionverma/react-native-swipe-button](https://raw.githubusercontent.com/dillionverma/react-native-swipe-button/master/docs/example.gif) | ||
|
||
## Install | ||
|
||
```sh | ||
npm i @arelstone/react-native-swipe-button | ||
npm i @dillionverma/react-native-swipe-button | ||
// or | ||
yarn add @arelstone/react-native-swipe-button | ||
yarn add @dillionverma/react-native-swipe-button | ||
``` | ||
|
||
## Props | ||
| Prop | Type | Description | | ||
|------------------------- |-------------- |--------------------------------- | | ||
| title | string **Required** | The text that will be displayed inside the button | | ||
| onComplete | () => void **Required** | Callback function that will be invoked when the button has reached the final state | | ||
| height | number | The height of the container. Default 70 | | ||
| width | number | The width of the container. Default 90% of the screen width | | ||
| borderRadius | number | The border radius of the container and button (default: height / 2) | | ||
| completeThresholdPercentage | number | Determinates when onComplete should be invoked (defualt: 70) | | ||
| onSwipeStart | () => void | Callback that will be invoked when the user starts swiping | | ||
| onSwipeEnd | () => void | Callback that will be invoked when the user ends swiping | | ||
| containerStyle | StyleProp<ViewStyle> | Styling for the container | | ||
| underlayStyle | StyleProp<ViewStyle> | Styling for the underlay container | | ||
| titleContainerProps | ViewProps | Additonal Props for the title container | | ||
| titleContainerStyle | StyleProp<ViewStyle> | Styling for the title container | | ||
| titleProps | TextProps | Additonal Props for the title text | | ||
| titleStyle | StyleProp<TextStyle> | Styling for the title text | | ||
|
||
| Prop | Type | Description | | ||
| --------------------------- | ----------------------- | ---------------------------------------------------------------------------------- | | ||
| title | string **Required** | The text that will be displayed inside the button | | ||
| onComplete | () => void **Required** | Callback function that will be invoked when the button has reached the final state | | ||
| height | number | The height of the container. Default 70 | | ||
| width | number | The width of the container. Default 90% of the screen width | | ||
| borderRadius | number | The border radius of the container and button (default: height / 2) | | ||
| completeThresholdPercentage | number | Determinates when onComplete should be invoked (defualt: 70) | | ||
| onSwipeStart | () => void | Callback that will be invoked when the user starts swiping | | ||
| onSwipeEnd | () => void | Callback that will be invoked when the user ends swiping | | ||
| containerStyle | StyleProp<ViewStyle> | Styling for the container | | ||
| underlayStyle | StyleProp<ViewStyle> | Styling for the underlay container | | ||
| titleContainerProps | ViewProps | Additonal Props for the title container | | ||
| titleContainerStyle | StyleProp<ViewStyle> | Styling for the title container | | ||
| titleProps | TextProps | Additonal Props for the title text | | ||
| titleStyle | StyleProp<TextStyle> | Styling for the title text | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,17 +1,17 @@ | ||
import React, { FC } from 'react'; | ||
import { View, Text, Alert } from 'react-native'; | ||
import React from 'react'; | ||
import { Alert, Text, View } from 'react-native'; | ||
import SwipeButton from '../src/SwipeButton'; | ||
|
||
const App = () => { | ||
return ( | ||
<View style={{ flex: 1 }}> | ||
<SwipeButton | ||
Icon={<Text>X</Text>} | ||
onComplete={() => Alert.alert('Completed')} | ||
title="Swipe to complete" | ||
/> | ||
</View> | ||
); | ||
return ( | ||
<View style={{ flex: 1 }}> | ||
<SwipeButton | ||
Icon={<Text>X</Text>} | ||
onComplete={() => Alert.alert('Completed')} | ||
title="Swipe to complete" | ||
/> | ||
</View> | ||
); | ||
}; | ||
|
||
export default App; |
Oops, something went wrong.