diff --git a/src/renderer/components/editable-list/editable-list.tsx b/src/renderer/components/editable-list/editable-list.tsx index 930b35aee5..a8e1c4c5ff 100644 --- a/src/renderer/components/editable-list/editable-list.tsx +++ b/src/renderer/components/editable-list/editable-list.tsx @@ -54,6 +54,7 @@ export class EditableList extends React.Component> { onSubmit={this.onSubmit} validators={validators} placeholder={placeholder} + blurOnEnter={false} iconRight={({ isDirty }) => isDirty ? : null} /> diff --git a/src/renderer/components/input/input.tsx b/src/renderer/components/input/input.tsx index 3ad385293b..36461fd684 100644 --- a/src/renderer/components/input/input.tsx +++ b/src/renderer/components/input/input.tsx @@ -52,6 +52,7 @@ export type InputProps = Omit & { iconRight?: IconData; contentRight?: string | React.ReactNode; // Any component of string goes after iconRight validators?: InputValidator | InputValidator[]; + blurOnEnter?: boolean; onChange?(value: string, evt: React.ChangeEvent): void; onSubmit?(value: string, evt: React.KeyboardEvent): void; }; @@ -70,6 +71,7 @@ const defaultProps: Partial = { maxRows: 10000, showValidationLine: true, validators: [], + blurOnEnter: true, }; export class Input extends React.Component { @@ -267,6 +269,11 @@ export class Input extends React.Component { } else { this.setDirty(); } + + if(this.props.blurOnEnter){ + //pressing enter indicates that the edit is complete, we can unfocus now + this.blur(); + } } } diff --git a/src/renderer/components/wizard/wizard.tsx b/src/renderer/components/wizard/wizard.tsx index b80804befa..3db32133ac 100755 --- a/src/renderer/components/wizard/wizard.tsx +++ b/src/renderer/components/wizard/wizard.tsx @@ -10,6 +10,7 @@ import { Button } from "../button"; import { Stepper } from "../stepper"; import { SubTitle } from "../layout/sub-title"; import { Spinner } from "../spinner"; +import { debounce } from "lodash"; interface WizardCommonProps { data?: Partial; @@ -179,14 +180,16 @@ export class WizardStep extends React.Component { + //because submit MIGHT be called through pressing enter, it might be fired twice. + //we'll debounce it to ensure it isn't + submit = debounce(() => { if (!this.form.noValidate) { const valid = this.form.checkValidity(); if (!valid) return; } this.next(); - }; + }, 100); renderLoading() { return ( @@ -196,6 +199,17 @@ export class WizardStep extends React.Component) { + if (evt.shiftKey || evt.metaKey || evt.altKey || evt.ctrlKey || evt.repeat) { + return; + } + + if(evt.key === "Enter"){ + this.submit(); + } + } + render() { const { step, isFirst, isLast, children, @@ -216,6 +230,7 @@ export class WizardStep extends React.Component this.keyDown(evt)} ref={e => this.form = e}> {beforeContent}