From 279e71d098053dc2ca5b69e6e502a95dab230daa Mon Sep 17 00:00:00 2001
From: Bob Zeleznik <zzzman@gmail.com>
Date: Mon, 15 Jun 2020 11:58:04 -0400
Subject: added a linkView and changed display of docFieldView to inline to
 allow text wrapping on the same line as the fieldLabel

---
 src/client/views/nodes/ComparisonBox.tsx              |  6 +++---
 src/client/views/nodes/DocumentView.tsx               |  2 +-
 .../views/nodes/formattedText/DashFieldView.scss      |  2 +-
 .../views/nodes/formattedText/DashFieldView.tsx       | 19 +++++++++++--------
 4 files changed, 16 insertions(+), 13 deletions(-)

(limited to 'src/client/views')

diff --git a/src/client/views/nodes/ComparisonBox.tsx b/src/client/views/nodes/ComparisonBox.tsx
index cce60628d..14a2c25bf 100644
--- a/src/client/views/nodes/ComparisonBox.tsx
+++ b/src/client/views/nodes/ComparisonBox.tsx
@@ -76,12 +76,12 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps, C
         const clearButton = (which: string) => {
             return <div className={`clear-button ${which}`}
                 onPointerDown={e => e.stopPropagation()} // prevent triggering slider movement in registerSliding 
-                onClick={e => this.clearDoc(e, `${which}Doc`)}>
+                onClick={e => this.clearDoc(e, `compareBox-${which}`)}>
                 <FontAwesomeIcon className={`clear-button ${which}`} icon={"times"} size="sm" />
             </div>;
         };
         const displayDoc = (which: string) => {
-            const whichDoc = Cast(this.dataDoc[`${which}Doc`], Doc, null);
+            const whichDoc = Cast(this.dataDoc[`compareBox-${which}`], Doc, null);
             return whichDoc ? <>
                 <ContentFittingDocumentView {...childProps} Document={whichDoc} />
                 {clearButton(which)}
@@ -93,7 +93,7 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps, C
         const displayBox = (which: string, index: number, cover: number) => {
             return <div className={`${which}Box-cont`} key={which} style={{ width: this.props.PanelWidth() }}
                 onPointerDown={e => this.registerSliding(e, cover)}
-                ref={ele => this.createDropTarget(ele, `${which}Doc`, index)} >
+                ref={ele => this.createDropTarget(ele, `compareBox-${which}`, index)} >
                 {displayDoc(which)}
             </div>;
         };
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index e4e4dfdd6..35bf5344e 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -335,7 +335,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
                 this.props.addDocTab(alias, "onRight");
                 // UndoManager.RunInBatch(() => Doc.makeCustomViewClicked(this.props.Document, undefined, "onClick"), "edit onClick");
                 //ScriptBox.EditButtonScript("On Button Clicked ...", this.props.Document, "onClick", e.clientX, e.clientY), "on button click");
-            } else if (this.Document.isLinkButton && !e.shiftKey && !e.ctrlKey) {
+            } else if (this.props.Document.links && this.Document.isLinkButton && !e.shiftKey && !e.ctrlKey) {
                 DocListCast(this.props.Document.links).length && this.followLinkClick(e.altKey, e.ctrlKey, e.shiftKey);
             } else {
                 if ((this.props.Document.onDragStart || (this.props.Document.rootDocument)) && !(e.ctrlKey || e.button > 0)) {  // onDragStart implies a button doc that we don't want to select when clicking.   RootDocument & isTEmplaetForField implies we're clicking on part of a template instance and we want to select the whole template, not the part
diff --git a/src/client/views/nodes/formattedText/DashFieldView.scss b/src/client/views/nodes/formattedText/DashFieldView.scss
index 35ff9c1e6..23cf1e79b 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.scss
+++ b/src/client/views/nodes/formattedText/DashFieldView.scss
@@ -25,7 +25,7 @@
         margin-left: 2px;
         margin-right: 5px;
         position: relative;
-        display: inline-block;
+        display: inline;
         background-color: rgba(155, 155, 155, 0.24);
         span {
             min-width: 100%;
diff --git a/src/client/views/nodes/formattedText/DashFieldView.tsx b/src/client/views/nodes/formattedText/DashFieldView.tsx
index 9a1b909c1..60a9c2a27 100644
--- a/src/client/views/nodes/formattedText/DashFieldView.tsx
+++ b/src/client/views/nodes/formattedText/DashFieldView.tsx
@@ -103,11 +103,14 @@ export class DashFieldViewInternal extends React.Component<IDashFieldViewInterna
                 // bcz: this is unfortunate, but since this React component is nested within a non-React text box (prosemirror), we can't
                 // use React events.  Essentially, React events occur after native events have been processed, so corresponding React events
                 // will never fire because Prosemirror has handled the native events.  So we add listeners for native events here.
-                return <span contentEditable={true} suppressContentEditableWarning={true} defaultValue={strVal} ref={r => {
-                    r?.addEventListener("keydown", e => this.fieldSpanKeyDown(e, r));
-                    r?.addEventListener("blur", e => r && this.updateText(r.textContent!, false));
-                    r?.addEventListener("pointerdown", action((e) => this._showEnumerables = true));
-                }} >
+                return <span className="dashFieldView-fieldSpan" contentEditable={true}
+                    style={{ display: strVal.length < 2 ? "inline-block" : undefined }}
+                    suppressContentEditableWarning={true} defaultValue={strVal}
+                    ref={r => {
+                        r?.addEventListener("keydown", e => this.fieldSpanKeyDown(e, r));
+                        r?.addEventListener("blur", e => r && this.updateText(r.textContent!, false));
+                        r?.addEventListener("pointerdown", action((e) => this._showEnumerables = true));
+                    }} >
                     {strVal}
                 </span>;
             }
@@ -205,9 +208,9 @@ export class DashFieldViewInternal extends React.Component<IDashFieldViewInterna
                     {this._fieldKey}
                 </span>}
 
-            <div className="dashFieldView-fieldSpan">
-                {this.fieldValueContent}
-            </div>
+            {/* <div className="dashFieldView-fieldSpan"> */}
+            {this.fieldValueContent}
+            {/* </div> */}
 
             {!this._showEnumerables ? (null) : <div className="dashFieldView-enumerables" onPointerDown={this.onPointerDownEnumerables} />}
 
-- 
cgit v1.2.3-70-g09d2