fix: scope --color-selection retrieval to given instance (excalidra…

…w#6886) Co-authored-by: dwelle <[email protected]>
sr3dna · Aug 16, 2023 · 1bd4160 · 1bd4160
1 parent 991f557
commit 1bd4160
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/src/components/App.tsx b/src/components/App.tsx
@@ -1226,6 +1226,7 @@ class App extends React.Component<AppProps, AppState> {
                           }}
                         />
                         <InteractiveCanvas
+                          containerRef={this.excalidrawContainerRef}
                           canvas={this.interactiveCanvas}
                           elements={canvasElements}
                           visibleElements={visibleElements}

diff --git a/src/components/canvases/InteractiveCanvas.tsx b/src/components/canvases/InteractiveCanvas.tsx
@@ -16,6 +16,7 @@ import type {
 import type { NonDeletedExcalidrawElement } from "../../element/types";
 
 type InteractiveCanvasProps = {
+  containerRef: React.RefObject<HTMLDivElement>;
   canvas: HTMLCanvasElement | null;
   elements: readonly NonDeletedExcalidrawElement[];
   visibleElements: readonly NonDeletedExcalidrawElement[];
@@ -105,9 +106,12 @@ const InteractiveCanvas = (props: InteractiveCanvasProps) => {
       cursorButton[socketId] = user.button;
     });
 
-    const selectionColor = getComputedStyle(
-      document.querySelector(".excalidraw")!,
-    ).getPropertyValue("--color-selection");
+    const selectionColor =
+      (props.containerRef?.current &&
+        getComputedStyle(props.containerRef.current).getPropertyValue(
+          "--color-selection",
+        )) ||
+      "#6965db";
 
     renderInteractiveScene(
       {