[storybook] fix events-shadowdom example for mouse canvas

Put the mouse canvas on top with zIndex, and remove unecessary style
jacomyal · Aug 23, 2024 · bda69c9 · bda69c9
1 parent d510b96
commit bda69c9
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 6 deletions.
diff --git a/packages/storybook/stories/events-shadowdom/index.html b/packages/storybook/stories/events-shadowdom/index.html
@@ -1,22 +1,17 @@
 <style>
   html,
   body,
-  #storybook-root,
-  #sigma-container {
+  #storybook-root {
     width: 100%;
     height: 100%;
     margin: 0;
     padding: 0;
     overflow: hidden;
     font-family: sans-serif;
   }
-  #sigma-container .sigma-mouse {
-    z-index: 100;
-  }
   #sigma-logs {
     position: absolute;
     top:0;
-    max-height: 20%;
     overflow: hidden;
   }
   #sigma-logs > div {

diff --git a/packages/storybook/stories/events-shadowdom/index.ts b/packages/storybook/stories/events-shadowdom/index.ts
@@ -72,6 +72,9 @@ export default () => {
           },
         });
 
+        // Put the mouse canvas on top, so events can be catched even if the logs container is in front
+        renderer.getCanvases().mouse.style.cssText = "z-index: 100; position: absolute";
+
         const nodeEvents = [
           "enterNode",
           "leaveNode",