From 3e531aa898492cb05e25081f422bb59adab72e8e Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 11 Feb 2025 16:03:29 -0500
Subject: enabled multi-select modification of text documents from topBar
 buttons.  fixed diagram box layout and scrolling.  fixed problem with
 createDoc tool where it would fail when it got an array.  fixed formatting of
 chat box errors.

---
 src/client/views/nodes/DiagramBox.tsx | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

(limited to 'src/client/views/nodes/DiagramBox.tsx')

diff --git a/src/client/views/nodes/DiagramBox.tsx b/src/client/views/nodes/DiagramBox.tsx
index ea3ab2887..e77cde431 100644
--- a/src/client/views/nodes/DiagramBox.tsx
+++ b/src/client/views/nodes/DiagramBox.tsx
@@ -32,6 +32,7 @@ export class DiagramBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         }
         return false;
     };
+    _boxRef: HTMLDivElement | null = null;
 
     constructor(props: FieldViewProps) {
         super(props);
@@ -184,9 +185,24 @@ export class DiagramBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         return '( )';
     };
 
+    /**
+     * This stops scroll wheel events when they are used to scroll the face collection.
+     */
+    onPassiveWheel = (e: WheelEvent) => e.stopPropagation();
+
     render() {
         return (
-            <div className="DIYNodeBox">
+            <div
+                className="DIYNodeBox"
+                style={{
+                    pointerEvents: this._props.isContentActive() ? undefined : 'none',
+                }}
+                ref={action((ele: HTMLDivElement | null) => {
+                    this._boxRef?.removeEventListener('wheel', this.onPassiveWheel);
+                    this._boxRef = ele;
+                    // prevent wheel events from passively propagating up through containers and prevents containers from preventDefault which would block scrolling
+                    ele?.addEventListener('wheel', this.onPassiveWheel, { passive: false });
+                })}>
                 <div className="DIYNodeBox-searchbar">
                     <input type="text" value={this._inputValue} onKeyDown={action(e => e.key === 'Enter' && this.generateMermaidCode())} onChange={action(e => (this._inputValue = e.target.value))} />
                     <button type="button" onClick={this.generateMermaidCode}>
@@ -218,7 +234,7 @@ Docs.Prototypes.TemplateMap.set(DocumentType.DIAGRAM, {
         _layout_nativeDimEditable: true,
         _layout_reflowVertical: true,
         _layout_reflowHorizontal: true,
-        waitForDoubleClickToClick: 'always',
+        waitForDoubleClickToClick: 'never',
         systemIcon: 'BsGlobe',
     },
 });
-- 
cgit v1.2.3-70-g09d2

