Fix: dependencies

package.json

@@ -2,7 +2,7 @@
   "name": "@pittica/gatsby-plugin-canvas-animations",
   "private": false,
   "description": "Canvas animations collection for GatsbyJS.",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "author": {
     "name": "Lucio Benini",
     "email": "info@pittica.com",
@@ -20,6 +20,7 @@
     "animations"
   ],
   "dependencies": {
+    "@pittica/gatsby-plugin-utils": "^2.0.0",
     "gl-mat4": "^1.2.0",
     "prop-types": "^15.7.2",
     "react": "^17.0.2",

src/components/ledwall.jsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useState, useRef } from "react"
 import PropTypes from "prop-types"
 import useInterval from "react-useinterval"
+import { hexToRgb } from "@pittica/gatsby-plugin-utils"
 
-import rgb from "../utils/rgb"
 import { randomize } from "../helpers/ledwall"
 
 export default function Ledwall({
@@ -56,7 +56,7 @@ export default function Ledwall({
       context.lineWidth = lineWidth
       context.lineCap = "round"
 
-      const { r, g, b } = rgb(primary)
+      const { r, g, b } = hexToRgb(primary)
       let x = gutter
       let y = gutter
       let alpha = opacity

src/components/rain.jsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useState, useRef } from "react"
 import PropTypes from "prop-types"
 import useInterval from "react-useinterval"
+import { hexToRgb } from "@pittica/gatsby-plugin-utils"
 
-import rgb from "../utils/rgb"
 import { create, draw } from "../helpers/rain"
 
 export default function Rain({ color, stroke, parts, timing }) {
@@ -16,7 +16,7 @@ export default function Rain({ color, stroke, parts, timing }) {
       canvas.height = window.innerHeight
 
       if (canvas.getContext) {
-        const { r, g, b } = rgb(color)
+        const { r, g, b } = hexToRgb(color)
         const context = canvas.getContext("2d")
 
         context.fillStyle = `rgba(${r}, ${g}, ${b}, 0.5)`

src/helpers/cube.jsx

@@ -1,6 +1,6 @@
 import mat4 from "gl-mat4"
+import { hexToRgb } from "@pittica/gatsby-plugin-utils"
 
-import rgb from "../utils/rgb"
 import { program } from "../utils/shader"
 import { create, vertex } from "../utils/buffer"
 import { cube, indices } from "../utils/positions"
@@ -44,7 +44,7 @@ export function info(context) {
 }
 
 export function colors(color) {
-  const { r, g, b } = rgb(color, true)
+  const { r, g, b } = hexToRgb(color, true)
 
   return {
     front: [r, g, b, 1.0],
@@ -119,7 +119,7 @@ export function apply(context, programInfo, buffers, rotation) {
 }
 
 export function prepare(context, background) {
-  const { r, g, b } = rgb(background, true)
+  const { r, g, b } = hexToRgb(background, true)
 
   context.clearColor(r, g, b, 1.0)
   context.clearDepth(1.0)