changed naming of makeDelegates to not add a number at the end. switched dataNote to MetaNote and cleaned up initialization of it. fixed sidebar/stacking view to not grab wheel evebnts when not active. fixed dashfieldview to vcenter labels. fixed height and scrolling of templae menu. simplified formattedtextbox menu

1 files changed, 37 insertions, 33 deletions

diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index bec5ea5c1..cbd92c159 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -523,7 +523,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
                 appearanceItems.splice(0, 0, { description: 'Open in Lightbox', event: () => DocumentView.SetLightboxDoc(this.Document), icon: 'external-link-alt' });
             }
             appearanceItems.push({ description: 'Pin', event: () => this._props.pinToPres(this.Document, {}), icon: 'map-pin' });
-            appearanceItems.push({ description: 'AI view', event: () => this._docView?.toggleAIEditor(), icon: 'map-pin' });
+            this._componentView?.componentAIView?.() && appearanceItems.push({ description: 'AI view', event: () => this._docView?.toggleAIEditor(), icon: 'map-pin' });
 
             !Doc.noviceMode && templateDoc && appearanceItems.push({ description: 'Open Template   ', event: () => this._props.addDocTab(templateDoc, OpenWhere.addRight), icon: 'eye' });
             !appearance && appearanceItems.length && cm.addItem({ description: 'Appearance...', subitems: appearanceItems, icon: 'compass' });
@@ -660,7 +660,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
         this._props
             .ScreenToLocalTransform()
             .translate(-NumCast(this.Document.borderWidth), -this.headerMargin - NumCast(this.Document.borderWidth))
-            .scale(this._props.showAIEditor ? (this._props.PanelHeight() || 1) / this.aiContentsHeight() : 1);
+            .scale(this.viewingAiEditor() ? (this._props.PanelHeight() || 1) / this.aiContentsHeight() : 1);
     onClickFunc = () => (this.disableClickScriptFunc ? undefined : this.onClickHdlr);
     setHeight = (height: number) => { !this._props.suppressSetHeight && (this.layoutDoc._height = Math.min(NumCast(this.layoutDoc._maxHeight, Number.MAX_SAFE_INTEGER), height + 2 * NumCast(this.Document.borderWidth))); } // prettier-ignore
     setContentView = action((view: ViewBoxInterface<FieldViewProps>) => { this._componentView = view; }); // prettier-ignore
@@ -712,32 +712,34 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
 
     aiContentsWidth = () => (this.aiContentsHeight() * (this._props.NativeWidth?.() || 1)) / (this._props.NativeHeight?.() || 1);
     aiContentsHeight = () => Math.max(10, this._props.PanelHeight() - this._aiWinHeight * this.uiBtnScaling);
-    aiEditor = () => (
-        <>
-            <div
-                className="documentView-editorView-history"
-                ref={r => this.historyRef(this._oldAiWheel, (this._oldAiWheel = r))}
-                style={{
-                    transform: `scale(${this.uiBtnScaling})`,
-                    height: this.aiContentsHeight() / this.uiBtnScaling,
-                    width: ((this._props.PanelWidth() - this.aiContentsWidth()) * 0.95) / this.uiBtnScaling,
-                }}>
-                {this._componentView?.componentAIViewHistory?.() ?? null}
-            </div>
-            <div
-                className="documentView-editorView"
-                style={{
-                    background: SnappingManager.userVariantColor,
-                    width: `${100 / this.uiBtnScaling}%`, //
-                    transform: `scale(${this.uiBtnScaling})`,
-                }}
-                ref={r => this.historyRef(this._oldHistoryWheel, (this._oldHistoryWheel = r))}>
-                <div className="documentView-editorView-resizer" />
-                {this._componentView?.componentAIView?.() ?? null}
-                {this._props.DocumentView?.() ? <TagsView background={this.backgroundBoxColor} Views={[this._props.DocumentView?.()]} /> : null}
-            </div>
-        </>
-    );
+    @computed get aiEditor() {
+        return (
+            <>
+                <div
+                    className="documentView-editorView-history"
+                    ref={r => this.historyRef(this._oldAiWheel, (this._oldAiWheel = r))}
+                    style={{
+                        transform: `scale(${this.uiBtnScaling})`,
+                        height: this.aiContentsHeight() / this.uiBtnScaling,
+                        width: ((this._props.PanelWidth() - this.aiContentsWidth()) * 0.95) / this.uiBtnScaling,
+                    }}>
+                    {this._componentView?.componentAIViewHistory?.() ?? null}
+                </div>
+                <div
+                    className="documentView-editorView"
+                    style={{
+                        background: SnappingManager.userVariantColor,
+                        width: `${100 / this.uiBtnScaling}%`, //
+                        transform: `scale(${this.uiBtnScaling})`,
+                    }}
+                    ref={r => this.historyRef(this._oldHistoryWheel, (this._oldHistoryWheel = r))}>
+                    <div className="documentView-editorView-resizer" />
+                    {this._componentView?.componentAIView?.() ?? null}
+                    {this._props.DocumentView?.() ? <TagsView background={this.backgroundBoxColor} Views={[this._props.DocumentView?.()]} /> : null}
+                </div>
+            </>
+        );
+    }
     @computed get tagsOverlay() {
         return (
             <div
@@ -760,6 +762,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
         );
     }
     widgetOverlayFunc = () => (this.widgetDecorations ? this.widgetOverlay : null);
+    viewingAiEditor = () => (this._props.showAIEditor && this._componentView?.componentAIView?.() !== undefined ? this.aiEditor : null);
     @computed get viewBoxContents() {
         TraceMobx();
         const isInk = this.layoutDoc._layout_isSvg && !this._props.LayoutTemplateString;
@@ -770,8 +773,8 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
                     className="documentView-contentsView"
                     style={{
                         pointerEvents: (isInk || noBackground ? 'none' : this.contentPointerEvents()) ?? (this._mounted ? 'all' : 'none'),
-                        width: this._props.showAIEditor ? this.aiContentsWidth() : undefined,
-                        height: this._props.showAIEditor ? this.aiContentsHeight() : this.headerMargin ? `calc(100% - ${this.headerMargin}px)` : undefined,
+                        width: this.viewingAiEditor() ? this.aiContentsWidth() : undefined,
+                        height: this.viewingAiEditor() ? this.aiContentsHeight() : this.headerMargin ? `calc(100% - ${this.headerMargin}px)` : undefined,
                     }}>
                     <DocumentContentsView
                         {...this._props}
@@ -779,8 +782,8 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
                         pointerEvents={this.contentPointerEvents}
                         setContentViewBox={this.setContentView}
                         childFilters={this.childFilters}
-                        PanelWidth={this._props.showAIEditor ? this.aiContentsWidth : this._props.PanelWidth}
-                        PanelHeight={this._props.showAIEditor ? this.aiContentsHeight : this.panelHeight}
+                        PanelWidth={this.viewingAiEditor() ? this.aiContentsWidth : this._props.PanelWidth}
+                        PanelHeight={this.viewingAiEditor() ? this.aiContentsHeight : this.panelHeight}
                         setHeight={this.setHeight}
                         isContentActive={this.isContentActive}
                         ScreenToLocalTransform={this.screenToLocalContent}
@@ -790,7 +793,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewProps & Field
                         hideClickBehaviors={BoolCast(this.Document.hideClickBehaviors)}
                     />
                 </div>
-                {this._props.showAIEditor ? this.aiEditor() : this.tagsOverlayFunc()}
+                {this.viewingAiEditor() ?? this.tagsOverlayFunc()}
                 {this.widgetOverlayFunc()}
             </>
         );
@@ -1256,6 +1259,7 @@ export class DocumentView extends DocComponent<DocumentViewProps>() {
     public get allLinks()       { return this._docViewInternal?._allLinks ?? []; } // prettier-ignore
     public get TagBtnHeight()   { return this._docViewInternal?.TagsBtnHeight; } // prettier-ignore
     public get UIBtnScaling()   { return this._docViewInternal?.uiBtnScaling; } // prettier-ignore
+    public get HasAIEditor()    { return !!this._docViewInternal?._componentView?.componentAIView?.(); } // prettier-ignore
 
     get LayoutFieldKey() {
         return Doc.LayoutFieldKey(this.Document, this._props.LayoutTemplateString);