@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!

/@dank-inc/react-sketchy/

    Package Sidebar

    Install

    npm i @dank-inc/react-sketchy

    Weekly Downloads

    6

    Version

    0.5.0

    License

    MIT

    Unpacked Size

    6.54 kB

    Total Files

    8

    Last publish

    Collaborators

    • eli7vh
    • nicholasp1992