convert hex to rgb

src/colorbar.js

@@ -25,12 +25,24 @@ const DIMENSIONS = {
   height: ['80px', '110px', '110px', '130px'],
 }
 
+const hexToRgb = (hex) => {
+  let result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex)
+  return result
+    ? `${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(
+        result[3],
+        16
+      )}`
+    : null
+}
+
 const Gradient = ({ colormap, discrete, horizontal, width, height }) => {
   const step = (1 / colormap.length) * 100
-  const values = colormap.map((d, i) => {
-    return `rgb(${d}) ${i * step}% ${
+  const values = colormap.map((color, i) => {
+    const rgbColor = color.startsWith('#') ? hexToRgb(color) : color
+    const position = `${i * step}% ${
       discrete && i < colormap.length - 1 ? `${(i + 1) * step}%` : ''
     }`
+    return `rgb(${rgbColor}) ${position}`
   })
 
   const css = `linear-gradient(to ${
@@ -114,6 +126,7 @@ const Colorbar = ({
   bottom = false,
   sx,
   sxClim,
+  type,
   ...props
 }) => {
   if (!Array.isArray(colormap)) {