aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/EditableView.tsx
diff options
context:
space:
mode:
authorSam Wilkins <samwilkins333@gmail.com>2019-08-23 11:18:24 -0400
committerSam Wilkins <samwilkins333@gmail.com>2019-08-23 11:18:24 -0400
commit56987012f9690d300b482d8f1b3d83935342322b (patch)
tree1135dde54c91cb92e0092762aa927ee4102277f6 /src/client/views/EditableView.tsx
parentd1fbfc3ab46cfd9fea69b356cb5b8825625ab299 (diff)
parent20f7d2dca1c115c84f6ac89981ef1e3c7c9a2757 (diff)
merged with master
Diffstat (limited to 'src/client/views/EditableView.tsx')
-rw-r--r--src/client/views/EditableView.tsx28
1 files changed, 20 insertions, 8 deletions
diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index c3612fee9..dd5395802 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -3,6 +3,7 @@ import { observer } from 'mobx-react';
import { observable, action, trace } from 'mobx';
import "./EditableView.scss";
import * as Autosuggest from 'react-autosuggest';
+import { undoBatch } from '../util/UndoManager';
export interface EditableProps {
/**
@@ -70,14 +71,12 @@ export class EditableView extends React.Component<EditableProps> {
onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === "Tab") {
e.stopPropagation();
+ this.finalizeEdit(e.currentTarget.value, e.shiftKey);
this.props.OnTab && this.props.OnTab();
} else if (e.key === "Enter") {
e.stopPropagation();
if (!e.ctrlKey) {
- if (this.props.SetValue(e.currentTarget.value, e.shiftKey)) {
- this._editing = false;
- this.props.isEditingCallback && this.props.isEditingCallback(false);
- }
+ this.finalizeEdit(e.currentTarget.value, e.shiftKey);
} else if (this.props.OnFillDown) {
this.props.OnFillDown(e.currentTarget.value);
this._editing = false;
@@ -100,6 +99,14 @@ export class EditableView extends React.Component<EditableProps> {
e.stopPropagation();
}
+ @action
+ private finalizeEdit(value: string, shiftDown: boolean) {
+ if (this.props.SetValue(value, shiftDown)) {
+ this._editing = false;
+ this.props.isEditingCallback && this.props.isEditingCallback(false);
+ }
+ }
+
stopPropagation(e: React.SyntheticEvent) {
e.stopPropagation();
}
@@ -118,7 +125,7 @@ export class EditableView extends React.Component<EditableProps> {
className: "editableView-input",
onKeyDown: this.onKeyDown,
autoFocus: true,
- onBlur: action(() => this._editing = false),
+ onBlur: e => this.finalizeEdit(e.currentTarget.value, false),
onPointerDown: this.stopPropagation,
onClick: this.stopPropagation,
onPointerUp: this.stopPropagation,
@@ -126,9 +133,14 @@ export class EditableView extends React.Component<EditableProps> {
onChange: this.props.autosuggestProps.onChange
}}
/>
- : <input className="editableView-input" defaultValue={this.props.GetValue()} onKeyDown={this.onKeyDown} autoFocus
- onBlur={action(() => { this._editing = false; this.props.isEditingCallback && this.props.isEditingCallback(false); })} onPointerDown={this.stopPropagation} onClick={this.stopPropagation} onPointerUp={this.stopPropagation}
- style={{ display: this.props.display, fontSize: this.props.fontSize }} />;
+ : <input className="editableView-input"
+ defaultValue={this.props.GetValue()}
+ onKeyDown={this.onKeyDown}
+ autoFocus={true}
+ onBlur={e => this.finalizeEdit(e.currentTarget.value, false)}
+ onPointerDown={this.stopPropagation} onClick={this.stopPropagation} onPointerUp={this.stopPropagation}
+ style={{ display: this.props.display, fontSize: this.props.fontSize }}
+ />;
} else {
if (this.props.autosuggestProps) this.props.autosuggestProps.resetValue();
return (