From 9c6e43a29f16ffa81f1624f1160bd80c496b0405 Mon Sep 17 00:00:00 2001
From: Yves Hoppe <info@yveshoppe.de>
Date: Thu, 26 Aug 2021 16:11:29 +0200
Subject: [PATCH] Add styles override option to SketchFields

Allow optional overriding the color styles (like label color which is hardcoded to #222) in the SketchFields from the parent component.
---
 src/components/sketch/SketchFields.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/sketch/SketchFields.js b/src/components/sketch/SketchFields.js
index b2e30227..7443bc18 100644
--- a/src/components/sketch/SketchFields.js
+++ b/src/components/sketch/SketchFields.js
@@ -2,12 +2,13 @@
 
 import React from 'react'
 import reactCSS from 'reactcss'
+import merge from 'lodash/merge'
 import * as color from '../../helpers/color'
 
 import { EditableInput } from '../common'
 
-export const SketchFields = ({ onChange, rgb, hsl, hex, disableAlpha }) => {
-  const styles = reactCSS({
+export const SketchFields = ({ onChange, rgb, hsl, hex, disableAlpha, styles: passedStyles = {} }) => {
+  const styles = reactCSS(merge({
     'default': {
       fields: {
         display: 'flex',
@@ -46,7 +47,7 @@ export const SketchFields = ({ onChange, rgb, hsl, hex, disableAlpha }) => {
         display: 'none',
       },
     },
-  }, { disableAlpha })
+  }, { disableAlpha }), passedStyles)
 
   const handleChange = (data, e) => {
     if (data.hex) {