From ac06e2affd615b926e240a2b15279d3c60360bd4 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 25 Jul 2024 10:52:55 -0400
Subject: cleaned up labelBox

---
 .../collections/CollectionStackedTimeline.tsx      |  2 +-
 src/client/views/nodes/LabelBox.tsx                | 58 ++++++++++------------
 2 files changed, 27 insertions(+), 33 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionStackedTimeline.tsx b/src/client/views/collections/CollectionStackedTimeline.tsx
index fac885300..b03f0cffa 100644
--- a/src/client/views/collections/CollectionStackedTimeline.tsx
+++ b/src/client/views/collections/CollectionStackedTimeline.tsx
@@ -850,7 +850,7 @@ class StackedTimelineAnchor extends ObservableReactComponent<StackedTimelineAnch
                     styleProvider={this._props.styleProvider}
                     renderDepth={this._props.renderDepth + 1}
                     LayoutTemplate={undefined}
-                    LayoutTemplateString={LabelBox.LayoutStringWithTitle('data', this.computeTitle())}
+                    LayoutTemplateString={LabelBox.LayoutString('data')}
                     isDocumentActive={this._props.isDocumentActive}
                     PanelWidth={width}
                     PanelHeight={height}
diff --git a/src/client/views/nodes/LabelBox.tsx b/src/client/views/nodes/LabelBox.tsx
index 088cd15be..d33d12603 100644
--- a/src/client/views/nodes/LabelBox.tsx
+++ b/src/client/views/nodes/LabelBox.tsx
@@ -19,12 +19,9 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
     public static LayoutString(fieldKey: string) {
         return FieldView.LayoutString(LabelBox, fieldKey);
     }
-    public static LayoutStringWithTitle(fieldStr: string, label?: string) {
-        return !label ? LabelBox.LayoutString(fieldStr) : `<LabelBox fieldKey={'${fieldStr}'} label={'${label}'} {...props} />`; // e.g., "<ImageBox {...props} fieldKey={"data} />"
-    }
     private dropDisposer?: DragManager.DragDropDisposer;
     private _timeout: NodeJS.Timeout | undefined;
-    _divRef: HTMLDivElement|null = null;
+    _divRef: HTMLDivElement | null = null;
 
     constructor(props: FieldViewProps) {
         super(props);
@@ -53,8 +50,7 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
         this._timeout && clearTimeout(this._timeout);
     }
 
-    specificContextMenu = (): void => {
-    };
+    specificContextMenu = (): void => {};
 
     drop = (/* e: Event, de: DragManager.DropEvent */) => {
         return false;
@@ -73,15 +69,16 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
         return anchor;
     };
 
-    fitTextToBox = (r: HTMLElement | null | undefined): {
-            minFontSize: number,
-            maxFontSize: number,
-            multiLine: boolean,
-            alignHoriz: boolean,
-            alignVert: boolean,
-            detectMultiLine: boolean,
-        } => 
-    {
+    fitTextToBox = (
+        r: HTMLElement | null | undefined
+    ): {
+        minFontSize: number;
+        maxFontSize: number;
+        multiLine: boolean;
+        alignHoriz: boolean;
+        alignVert: boolean;
+        detectMultiLine: boolean;
+    } => {
         this._timeout && clearTimeout(this._timeout);
         const textfitParams = {
             minFontSize: NumCast(this.layoutDoc._label_minFontSize, 1),
@@ -105,14 +102,9 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
     render() {
         trace();
         const boxParams = this.fitTextToBox(undefined); // this causes mobx to trigger re-render when data changes
-        const label = this.Title.startsWith("#") ? null : this.Title;
+        const label = this.Title.startsWith('#') ? null : this.Title;
         return (
-            <div
-                key={label?.length}
-                className="labelBox-outerDiv"
-                ref={this.createDropTarget}
-                onContextMenu={this.specificContextMenu}
-                style={{ boxShadow: this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.BoxShadow) as string }}>
+            <div key={label?.length} className="labelBox-outerDiv" ref={this.createDropTarget} onContextMenu={this.specificContextMenu} style={{ boxShadow: this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.BoxShadow) as string }}>
                 <div
                     className="labelBox-mainButton"
                     style={{
@@ -130,31 +122,33 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps>() {
                         height: this._props.PanelHeight(),
                         whiteSpace: 'multiLine' in boxParams && boxParams.multiLine ? 'pre-wrap' : 'pre',
                     }}>
-                    <div style={{ 
-                            width: this._props.PanelWidth()- 2*NumCast(this.layoutDoc._xPadding), 
-                            height: this._props.PanelHeight()-2*NumCast(this.layoutDoc._yPadding),
-                            outline: 'unset !important'
-                        }} 
+                    <div
+                        style={{
+                            width: this._props.PanelWidth() - 2 * NumCast(this.layoutDoc._xPadding),
+                            height: this._props.PanelHeight() - 2 * NumCast(this.layoutDoc._yPadding),
+                            outline: 'unset !important',
+                        }}
                         onKeyDown={action(e => {
                             e.stopPropagation();
                         })}
                         onKeyUp={action(e => {
                             e.stopPropagation();
                             if (e.key === 'Enter') {
-                                this.dataDoc[this.fieldKey] = this._divRef?.innerText ?? "";
+                                this.dataDoc[this.fieldKey] = this._divRef?.innerText ?? '';
                                 setTimeout(() => this._props.select(false));
                             }
                         })}
                         onBlur={() => {
-                            this.dataDoc[this.fieldKey] = this._divRef?.innerText ?? "";
+                            this.dataDoc[this.fieldKey] = this._divRef?.innerText ?? '';
                         }}
-                        contentEditable={this._props.onClickScript?.() ? false: true}
-                        ref={r => {this._divRef = r;
+                        contentEditable={this._props.onClickScript?.() ? false : true}
+                        ref={r => {
+                            this._divRef = r;
                             this.fitTextToBox(r);
                             if (this._props.isSelected() && this._divRef) {
                                 const range = document.createRange();
                                 range.setStart(this._divRef, this._divRef.childNodes.length);
-                                range.setEnd(this._divRef, this._divRef.childNodes.length)
+                                range.setEnd(this._divRef, this._divRef.childNodes.length);
                                 const sel = window.getSelection();
                                 sel?.removeAllRanges();
                                 sel?.addRange(range);
-- 
cgit v1.2.3-70-g09d2