0.0.1 • Published 4 years ago

react-pretty-wires v0.0.1

Weekly downloads
4
License
MIT
Repository
github
Last release
4 years ago

react-pretty-wires

Prettified wires for React. Display visual relationships with some flare 🔥🔥🔥.

🚀 Getting Started

Using npm:

npm install --save react-pretty-wires

Using yarn:

yarn add react-pretty-wires

✍️ Example

import React from 'react';
import PrettyWire from 'react-pretty-wires';

export default () => (
  <PrettyWire
    sourceX={100}
    sourceY={100}
    targetX={500}
    targetY={500}
    arrow
  />
);

⚛️ React Native

react-pretty-wires can also be used with React Native! You just need to change your import source:

- import PrettyWire from 'react-pretty-wires';
+ import PrettyWire from 'react-pretty-wires/dist/PrettyWire.native';

📌 Prop Types

PropTypeDefaultRequiredDescription
avoidanceRadiusnumber100NoThe amount of curvature to apply to tightly wrapped wires.
epsilonnumber0.01NoThe threshold to treat a curve as a straight line.
arrowboolfalseNoDraw an arrow.
arrowLengthnumber12NoSize of the arrow to draw.
arrowProgressionnumber0.5NoPercentage (0 ... 1) of where along the curve to render the arrow.
colorstring'black'NoColor of the wire.

✌️ License

MIT