1 files changed, 13 insertions, 3 deletions
diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index a5bb40243..5cbecf2c9 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -39,6 +39,7 @@ export interface EditableProps {
     oneLine?: boolean;
     editing?: boolean;
     onClick?: (e: React.MouseEvent) => boolean;
+    isEditingCallback?:  (isEditing: boolean) => void;
 }
 
 /**
@@ -56,6 +57,11 @@ export class EditableView extends React.Component<EditableProps> {
     }
 
     @action
+    componentWillReceiveProps(nextProps: EditableProps) {
+        this._editing = nextProps.editing ? true : false;
+    }
+
+    @action
     onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
         if (e.key === "Tab") {
             this.props.OnTab && this.props.OnTab();
@@ -63,13 +69,16 @@ export class EditableView extends React.Component<EditableProps> {
             if (!e.ctrlKey) {
                 if (this.props.SetValue(e.currentTarget.value, e.shiftKey)) {
                     this._editing = false;
+                    this.props.isEditingCallback && this.props.isEditingCallback(false);
                 }
             } else if (this.props.OnFillDown) {
                 this.props.OnFillDown(e.currentTarget.value);
                 this._editing = false;
+                this.props.isEditingCallback && this.props.isEditingCallback(false);
             }
         } else if (e.key === "Escape") {
             this._editing = false;
+            this.props.isEditingCallback && this.props.isEditingCallback(false);
         }
     }
 
@@ -78,7 +87,8 @@ export class EditableView extends React.Component<EditableProps> {
         e.nativeEvent.stopPropagation();
         if (!this.props.onClick || !this.props.onClick(e)) {
             this._editing = true;
-        }
+            this.props.isEditingCallback && this.props.isEditingCallback(true);
+        } 
         e.stopPropagation();
     }
 
@@ -109,7 +119,7 @@ export class EditableView extends React.Component<EditableProps> {
                     }}
                 />
                 : <input className="editableView-input" defaultValue={this.props.GetValue()} onKeyDown={this.onKeyDown} autoFocus
-                    onBlur={action(() => this._editing = false)} onPointerDown={this.stopPropagation} onClick={this.stopPropagation} onPointerUp={this.stopPropagation}
+                    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 }} />;
         } else {
             if (this.props.autosuggestProps) this.props.autosuggestProps.resetValue();
@@ -117,7 +127,7 @@ export class EditableView extends React.Component<EditableProps> {
                 <div className={`editableView-container-editing${this.props.oneLine ? "-oneLine" : ""}`}
                     style={{ display: this.props.display, height: "auto", maxHeight: `${this.props.height}` }}
                     onClick={this.onClick} >
-                    <span style={{ fontStyle: this.props.fontStyle }}>{this.props.contents}</span>
+                    <span style={{ fontStyle: this.props.fontStyle, fontSize: this.props.fontSize }}>{this.props.contents}</span>
                 </div>
             );
         }