react-use-polygon

What is react-use-polygon?

Simple and easy ways of rendering polygon, shapes and geometry primitives in React using hooks 🚀

It will provide basic primitive data for user, and enable user to render them with SVG and canvas.

For more details, please view our website.

Features

• Full of 2D polygons, i.e. circle, triangle, rectangle and more
• Special spaces, i.e. kite and star
• Other geometry primitives, like: lines, curves, arcs
• Lightweight and tree-shakable
• Built with Typescript
• Proper documentation

Install

Using npm:

npm install react-use-polygon

Or yarn:

yarn add react-use-polygon

Or pnpm:

pnpm add react-use-polygon

Example Usage

import { usePolygon } from "react-use-polygon";

// Pentagon
const { svgPath } = usePolygon({ sides: 5 });

// Render it later using SVG path
<svg>
  <path d={svgPath} />
</svg>

TODOs 📒

• More primitives?
• More utilities for more complex UI usage
• More helpers for rendering

Credits

• VueXYZ

License

MIT