fix: prevent event overlay compatibility with once option

.changeset/perfect-cats-dream.md

@@ -0,0 +1,5 @@
+---
+'@open-editor/client': patch
+---
+
+Fix prevent event overlay compatibility with once option

.codesandbox/tasks.json

@@ -11,7 +11,7 @@
     },
     {
       "name": "Create tasks",
-      "command": "pnpm create-codesandbox-tasks"
+      "command": "pnpm tasks"
     }
   ],
   "tasks": {}

package.json

@@ -14,7 +14,7 @@
     "play": "pnpm start --script=dev",
     "lint": "pnpm eslint . --ext .ts,.tsx --ignore-pattern='/playground/*'",
     "format": "prettier --write '**/*.{vue,ts,tsx,json,md}'",
-    "create-codesandbox-tasks": "esno scripts/create-codesandbox-tasks.ts",
+    "tasks": "esno scripts/create-codesandbox-tasks.ts",
     "postinstall": "simple-git-hooks",
     "release": "run-s build publish:ci",
     "test": "turbo run test",

packages/client/src/bridge/treeOpenBridge.tsx

@@ -2,10 +2,10 @@ import { crossIframeBridge } from '../utils/crossIframeBridge';
 import { isTopWindow, whenTopWindow } from '../utils/topWindow';
 import { appendChild } from '../utils/dom';
 import { onMessage, postMessage } from '../utils/message';
+import { getOptions } from '../options';
 import { resolveSource, type CodeSource } from '../resolve';
 import { TREE_OPEN_CROSS_IFRAME } from '../constants';
-import { on } from '../event';
-import { off } from 'process';
+import { on, off } from '../event';
 
 export const treeOpenBridge = crossIframeBridge<[CodeSource]>({
   setup() {
@@ -15,15 +15,23 @@ export const treeOpenBridge = crossIframeBridge<[CodeSource]>({
   },
   emitMiddlewares: [
     (_, next) => {
-      const preventEventOverlay = <div className="oe-prevent-event-overlay" />;
+      const { once } = getOptions();
+
+      const overlay = <div className="oe-prevent-event-overlay" />;
+      const eventOpts = {
+        target: once ? overlay : window,
+        capture: true,
+      };
+
       const remove = () => {
-        off('pointerup', remove);
-        off('pointerout', remove);
-        preventEventOverlay.remove();
+        off('pointerup', remove, eventOpts);
+        off('pointerout', remove, eventOpts);
+        overlay.remove();
       };
-      on('pointerup', remove, { capture: true });
-      on('pointerout', remove, { capture: true });
-      appendChild(document.body, preventEventOverlay);
+      on('pointerup', remove, eventOpts);
+      on('pointerout', remove, eventOpts);
+
+      appendChild(document.body, overlay);
 
       next();
     },