From e3f57773d78cf154ef835499e087d44ef8c01a4f Mon Sep 17 00:00:00 2001
From: Eric NGUYEN <enguyen@techform.fr>
Date: Tue, 13 Sep 2022 17:52:36 +0200
Subject: [PATCH] Set input group in orange when modified but not applied

---
 src/Components/InputGroup/TextInputGroup.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/Components/InputGroup/TextInputGroup.tsx b/src/Components/InputGroup/TextInputGroup.tsx
index 24d7160..05bcdcc 100644
--- a/src/Components/InputGroup/TextInputGroup.tsx
+++ b/src/Components/InputGroup/TextInputGroup.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { Properties } from '../ContainerProperties/ContainerProperties';
 
 interface ITextInputGroupProps {
   labelKey?: string
@@ -36,6 +35,8 @@ export function TextInputGroup(props: ITextInputGroupProps): JSX.Element {
     }
   }
 
+  const warningClass = props.value !== value ? 'focus:border-orange-200 border-orange-200 focus:ring-orange-200 ring-orange-200' : '';
+
   return <>
     <label
       key={props.labelKey}
@@ -47,7 +48,7 @@ export function TextInputGroup(props: ITextInputGroupProps): JSX.Element {
     <input
       key={props.inputKey}
       id={props.inputKey}
-      className={`${className} ${props.inputClassName}`}
+      className={`${className} ${props.inputClassName} ${warningClass}`}
       type={props.type}
       value={value}
       onChange={(event) => setValue(event.target.value)}