turned off pointer events in dataviz boxes when not active.

2 files changed, 6 insertions, 0 deletions

diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.scss b/src/client/views/nodes/DataVizBox/DataVizBox.scss
index a69881b7c..385ef5a1b 100644
--- a/src/client/views/nodes/DataVizBox/DataVizBox.scss
+++ b/src/client/views/nodes/DataVizBox/DataVizBox.scss
@@ -7,6 +7,9 @@
         display: flex;
         flex-direction: row;
     }
+    .button-container {
+        pointer-events: unset;
+    }
 }
 .start-message {
     margin: 10px;
diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.tsx b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
index b9db5fe15..8f32e2ba4 100644
--- a/src/client/views/nodes/DataVizBox/DataVizBox.tsx
+++ b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
@@ -174,6 +174,9 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         ) : (
             <div
                 className="dataViz"
+                style={{
+                    pointerEvents: this.props.isContentActive() === true ? "all" : "none"
+                }}
                 onWheel={e => e.stopPropagation()}
                 ref={r =>
                     r?.addEventListener(