From 1e3135b18a23dbecab70001e86b4207baca0dc19 Mon Sep 17 00:00:00 2001
From: Alex Khomenko <Clarity-89@users.noreply.github.com>
Date: Mon, 25 Jul 2022 10:01:19 +0300
Subject: [PATCH] ColorPickerInput: Allow returning empty color value (#52650)

* ColorPickerInput: Allow returning empty color value

* ColorPickerInput: Do not call onChange if the value didn't change
---
 .../src/components/ColorPicker/ColorPickerInput.tsx       | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/packages/grafana-ui/src/components/ColorPicker/ColorPickerInput.tsx b/packages/grafana-ui/src/components/ColorPicker/ColorPickerInput.tsx
index fd26ab1c8c5..437d7d03982 100644
--- a/packages/grafana-ui/src/components/ColorPicker/ColorPickerInput.tsx
+++ b/packages/grafana-ui/src/components/ColorPicker/ColorPickerInput.tsx
@@ -29,6 +29,14 @@ export const ColorPickerInput = forwardRef<HTMLInputElement, ColorPickerInputPro
 
     useThrottleFn(
       (c) => {
+        if (c === value) {
+          return;
+        }
+        // Default to an empty string if no color value is available
+        if (!c) {
+          onChange('');
+          return;
+        }
         const color = theme.visualization.getColorByName(c);
         if (returnColorAs === 'rgb') {
           onChange(colorManipulator.asRgbString(color));