@dank-inc/react-sketchy
TypeScript icon, indicating that this package has built-in type declarations

0.5.0 • Public • Published

React Sketchy!

A dank wrapper for Sketchy!.

Simply input your sketch into the react component prop and call'er a day, bud!

Usage

<App>
  <h1>A dank sketch!</h1>
  <ReactSketchy
    animate
    dimensions={[600, 600]}
    sketch={({ context, width, height }) => {
      context.clearRect(0, 0, width, height);

      return ({ context, width, height, t, setFillStyle }) => {
        context.clearRect(0, 0, width, height);

        const qw = width / 4;
        const qh = height / 4;
        setFillStyle(hsl(t(), 0.5, 0.5));

        context.save();
        context.translate(width / 2, height / 2);
        context.rotate(t(1));

        context.fillRect(-qw, -qh, width / 2, height / 2);
        context.restore();
      };
    }}
  />
</App>

et voila!

Package Sidebar

Install

npm i @dank-inc/react-sketchy

Weekly Downloads

1

Version

0.5.0

License

MIT

Unpacked Size

6.54 kB

Total Files

8

Last publish

Collaborators

  • eli7vh
  • nicholasp1992