From 55053983adc5b1b29efa0b2f38df5a58dfb93d42 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 21 Oct 2020 10:24:07 -0400
Subject: fixed editableView to commit current text on unmount (allows slide
 titles to be committed when clicking on another slide's title)

---
 src/client/views/EditableView.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

(limited to 'src/client/views/EditableView.tsx')

diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index 8b1b12365..afdda2aff 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -87,6 +87,10 @@ export class EditableView extends React.Component<EditableProps> {
             DragManager.MakeDropTarget(this._ref.current, this.props.onDrop.bind(this));
         }
     }
+    @action
+    componentWillUnmount() {
+        this._inputref.current?.value && this.finalizeEdit(this._inputref.current.value, false, true, false)
+    }
 
     _didShow = false;
 
@@ -168,6 +172,7 @@ export class EditableView extends React.Component<EditableProps> {
     }
 
     _ref = React.createRef<HTMLDivElement>();
+    _inputref = React.createRef<HTMLInputElement>();
     renderEditor() {
         return this.props.autosuggestProps
             ? <Autosuggest
@@ -185,7 +190,7 @@ export class EditableView extends React.Component<EditableProps> {
                     onChange: this.props.autosuggestProps.onChange
                 }}
             />
-            : <input className="editableView-input"
+            : <input className="editableView-input" ref={this._inputref}
                 defaultValue={this.props.GetValue()}
                 onKeyDown={this.onKeyDown}
                 autoFocus={true}
@@ -213,7 +218,7 @@ export class EditableView extends React.Component<EditableProps> {
             <div className={`editableView-container-editing${this.props.oneLine ? "-oneLine" : ""}`} ref={this._ref}
                 style={{ display: this.props.display, minHeight: "17px", whiteSpace: "nowrap", height: this.props.height || "auto", maxHeight: this.props.maxHeight }}
                 onClick={this.onClick} placeholder={this.props.placeholder}>
-                <span style={{ fontStyle: this.props.fontStyle, fontSize: this.props.fontSize }}>{
+                <span style={{ fontStyle: this.props.fontStyle, fontSize: this.props.fontSize }} >{
                     this.props.contents ? this.props.contents?.valueOf() : this.props.placeholder?.valueOf()}
                 </span>
             </div>;
-- 
cgit v1.2.3-70-g09d2

