https://github.com/codingbyjerez/react-native-arrow-follow
Arrow follow type schema in SVG
https://github.com/codingbyjerez/react-native-arrow-follow
Last synced: about 1 year ago
JSON representation
Arrow follow type schema in SVG
- Host: GitHub
- URL: https://github.com/codingbyjerez/react-native-arrow-follow
- Owner: CodingByJerez
- License: mit
- Created: 2021-05-20T17:39:56.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2021-05-21T12:02:48.000Z (about 5 years ago)
- Last Synced: 2025-04-19T15:56:46.244Z (about 1 year ago)
- Language: TypeScript
- Size: 3.39 MB
- Stars: 5
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# react-native-arrow-follow
## Installation
### - Installing:
```sh
yarn add react-native-arrow-follow
```
### - Installing dependencies:
- For Native project:
```sh
yarn add react-native-svg
pod install
```
- For Expo project:
```sh
expo install react-native-svg
```
## Usage
```tsx
import { ArrowFollow, CORNER, DIRECTION } from "react-native-arrow-follow";
// ...
// ...
```
## Documentation:
A React node that will be most likely wrapping your whole app.
| Name | Description | Require | Default | Type |
| ---------- | ------------------ | -------- | -------- | ---------------------------------------- |
| height | height rectangle | * | | number |
| width | width rectangle | * | | number |
| size | size line | | 12 | number |
| color | color code | | #000000 | string |
| start | start arrow | * | | {corner:CORNER, direction: DIRECTION} |
| end | end arrow | * | | {corner:CORNER, direction: DIRECTION} |
```ts
type IProps = {
height: number;
width: number;
size?: number;
color?: string;
start: {
corner: ICorner;
direction: IDirection
};
end: {
corner: ICorner;
direction: IDirection
};
};
type ICorner = CORNER | keyof typeof CORNER; //`${VERTICAL}_${HORIZONTAL}`;
type IDirection = DIRECTION | keyof typeof DIRECTION;
enum DIRECTION {
HORIZONTAL = 'HORIZONTAL',
VERTICAL = 'VERTICAL',
}
enum CORNER {
TOP_LEFT = 'TOP_LEFT',
TOP_RIGHT = 'TOP_RIGHT',
BOTTOM_LEFT = 'BOTTOM_LEFT',
BOTTOM_RIGHT = 'BOTTOM_RIGHT',
}
```
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## License
MIT