fix: Mouse panning when used in shadow DOM (#448)

BetterTyped · Jan 31, 2024 · cad806b · cad806b
1 parent 6167676
commit cad806b
Showing 1 changed file with 11 additions and 1 deletion.
diff --git a/src/core/pan/panning.utils.ts b/src/core/pan/panning.utils.ts
@@ -16,7 +16,17 @@ export const isPanningStartAllowed = (
   const { isInitialized, wrapperComponent } = contextInstance;
 
   const target = event.target as HTMLElement;
-  const isWrapperChild = wrapperComponent?.contains(target);
+  const targetIsShadowDom = "shadowRoot" in target && "composedPath" in event;
+  const isWrapperChild = targetIsShadowDom
+    ? event.composedPath().some((el) => {
+        if (!(el instanceof Element)) {
+          return false;
+        }
+
+        return wrapperComponent?.contains(el);
+      })
+    : wrapperComponent?.contains(target);
+
   const isAllowed = isInitialized && target && isWrapperChild;
 
   if (!isAllowed) return false;