Merge branch 'blur-input-on-enter'

1 files changed, 4 insertions, 0 deletions

diff --git a/gui/src/renderer/components/cell/Input.tsx b/gui/src/renderer/components/cell/Input.tsx
index f464adf269..06553be624 100644
--- a/gui/src/renderer/components/cell/Input.tsx
+++ b/gui/src/renderer/components/cell/Input.tsx
@@ -79,6 +79,8 @@ export class Input extends React.Component<IInputProps, IInputState> {
     focused: false,
   };
 
+  public inputRef = React.createRef<HTMLInputElement>();
+
   public componentDidUpdate(prevProps: IInputProps, _prevState: IInputState) {
     if (
       !this.state.focused &&
@@ -118,6 +120,7 @@ export class Input extends React.Component<IInputProps, IInputState> {
       <CellDisabledContext.Consumer>
         {(disabled) => (
           <StyledInput
+            ref={this.inputRef}
             type="text"
             valid={valid}
             aria-invalid={!valid}
@@ -157,6 +160,7 @@ export class Input extends React.Component<IInputProps, IInputState> {
   private onKeyPress = (event: React.KeyboardEvent<HTMLInputElement>) => {
     if (event.key === 'Enter') {
       this.props.onSubmitValue?.(this.state.value);
+      this.inputRef.current?.blur();
     }
     this.props.onKeyPress?.(event);
   };