From 64f50f0b4840f7eb73471ebb392cd01ccd0f3c8c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Murat=20=C3=87atal?= <mcatal@opsgenie.com>
Date: Thu, 10 Oct 2019 17:45:12 +0300
Subject: [PATCH 1/2] apply changes on editablevalue on blur feature
 implemented

---
 .../devtools/views/Components/EditableValue.js   | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js b/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js
index 992f2b2dff658..90b9caefe7646 100644
--- a/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js
+++ b/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js
@@ -51,9 +51,7 @@ export default function EditableValue({
 
     switch (event.key) {
       case 'Enter':
-        if (isValid && hasPendingChanges) {
-          overrideValueFn(path, parsedValue);
-        }
+        applyChanges();
         break;
       case 'Escape':
         reset();
@@ -63,6 +61,17 @@ export default function EditableValue({
     }
   };
 
+  const handleBlur = event => {
+    event.stopPropagation();
+    applyChanges();
+  };
+
+  const applyChanges = () => {
+    if (isValid && hasPendingChanges) {
+      overrideValueFn(path, parsedValue);
+    }
+  };
+
   let placeholder = '';
   if (editableValue === undefined) {
     placeholder = '(undefined)';
@@ -77,6 +86,7 @@ export default function EditableValue({
         className={`${isValid ? styles.Input : styles.Invalid} ${className}`}
         onChange={handleChange}
         onKeyDown={handleKeyDown}
+        onBlur={handleBlur}
         placeholder={placeholder}
         ref={inputRef}
         type="text"

From c3a31e0df05d8c3b71cd6ff771fb898d84a8699f Mon Sep 17 00:00:00 2001
From: Brian Vaughn <brian.david.vaughn@gmail.com>
Date: Wed, 29 Jan 2020 15:30:34 -0800
Subject: [PATCH 2/2] Removed "Undo" button and unnecessary
 event.preventDefault()

---
 .../devtools/views/Components/EditableValue.js  | 17 +----------------
 1 file changed, 1 insertion(+), 16 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js b/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js
index 90b9caefe7646..e501c39adee04 100644
--- a/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js
+++ b/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.js
@@ -8,8 +8,6 @@
  */
 
 import React, {Fragment, useRef} from 'react';
-import Button from '../Button';
-import ButtonIcon from '../ButtonIcon';
 import styles from './EditableValue.css';
 import {useEditableValue} from '../hooks';
 
@@ -61,11 +59,6 @@ export default function EditableValue({
     }
   };
 
-  const handleBlur = event => {
-    event.stopPropagation();
-    applyChanges();
-  };
-
   const applyChanges = () => {
     if (isValid && hasPendingChanges) {
       overrideValueFn(path, parsedValue);
@@ -84,22 +77,14 @@ export default function EditableValue({
       <input
         autoComplete="new-password"
         className={`${isValid ? styles.Input : styles.Invalid} ${className}`}
+        onBlur={applyChanges}
         onChange={handleChange}
         onKeyDown={handleKeyDown}
-        onBlur={handleBlur}
         placeholder={placeholder}
         ref={inputRef}
         type="text"
         value={editableValue}
       />
-      {hasPendingChanges && (
-        <Button
-          className={styles.ResetButton}
-          onClick={reset}
-          title="Reset value">
-          <ButtonIcon type="undo" />
-        </Button>
-      )}
     </Fragment>
   );
 }