@replohq/sandbox-runtime 1.6.4 → 1.6.6

package/buildMetadata.js

@@ -1,7 +1,7 @@
 export const BUILD_METADATA = {
   "packageName": "@replohq/sandbox-runtime",
-  "version": "1.6.4",
+  "version": "1.6.6",
   "branch": "HEAD",
-  "commit": "085a9d43063283dfea1f13552ee57d6b6f6b3f29",
-  "builtAt": "2026-09-11T23:34:52.476Z"
+  "commit": "0a9a7d328a712b8935e4b6a199689919c3ec4392",
+  "builtAt": "2026-09-13T12:48:42.823Z"
 };

package/chunk-RXYLMSNM.mjs

@@ -0,0 +1,134 @@
+// ../replo-utils/lib/viewportSnapshot.ts
+var VIEWPORT_SNAPSHOT_REQUEST = "replo:viewport-snapshot:request";
+var VIEWPORT_SNAPSHOT_RESPONSE = "replo:viewport-snapshot:response";
+var VIEWPORT_SNAPSHOT_MAX_DEPTH = 2;
+function isTrustedViewportSnapshotRequester(origin) {
+  let hostname;
+  try {
+    hostname = new URL(origin).hostname;
+  } catch {
+    return false;
+  }
+  if (hostname === "replo.app" || hostname.endsWith(".replo.app")) {
+    return true;
+  }
+  if (process.env.NODE_ENV === "production") {
+    return false;
+  }
+  return hostname === "localhost" || hostname === "127.0.0.1" || hostname.endsWith(".ngrok.app");
+}
+function canReceiveMessages(value) {
+  return typeof value === "object" && value !== null && "postMessage" in value && typeof value.postMessage === "function";
+}
+function isResponseMessage(data) {
+  return typeof data === "object" && data !== null && "type" in data && data.type === VIEWPORT_SNAPSHOT_RESPONSE && "requestId" in data && typeof data.requestId === "string" && "frameIndex" in data && typeof data.frameIndex === "number";
+}
+function isRequestMessage(data) {
+  return typeof data === "object" && data !== null && "type" in data && data.type === VIEWPORT_SNAPSHOT_REQUEST && "requestId" in data && typeof data.requestId === "string" && "frameIndex" in data && typeof data.frameIndex === "number" && "remainingDepth" in data && typeof data.remainingDepth === "number";
+}
+function requestChildViewportSnapshots({
+  targetWindow,
+  requestId,
+  timeoutMs,
+  remainingDepth = VIEWPORT_SNAPSHOT_MAX_DEPTH
+}) {
+  const frameCount = targetWindow.frames.length;
+  if (frameCount === 0 || remainingDepth <= 0) {
+    return Promise.resolve([]);
+  }
+  return new Promise((resolve) => {
+    const collected = /* @__PURE__ */ new Map();
+    const settle = () => {
+      targetWindow.removeEventListener("message", onMessage);
+      targetWindow.clearTimeout(timeoutId);
+      resolve(
+        [...collected.entries()].map(([frameIndex, capture]) => ({ frameIndex, capture })).sort((first, second) => {
+          return first.frameIndex - second.frameIndex;
+        })
+      );
+    };
+    const onMessage = (event) => {
+      if (!isResponseMessage(event.data) || event.data.requestId !== requestId || // A frame may only answer for its own slot — anything else could
+      // overwrite a sibling's capture or force an early settle.
+      event.source !== targetWindow.frames[event.data.frameIndex]) {
+        return;
+      }
+      if (event.data.capture !== null) {
+        collected.set(event.data.frameIndex, event.data.capture);
+      }
+      if (collected.size === frameCount) {
+        settle();
+      }
+    };
+    targetWindow.addEventListener("message", onMessage);
+    const timeoutId = targetWindow.setTimeout(settle, timeoutMs);
+    for (let frameIndex = 0; frameIndex < frameCount; frameIndex++) {
+      const message = {
+        type: VIEWPORT_SNAPSHOT_REQUEST,
+        requestId,
+        frameIndex,
+        remainingDepth
+      };
+      targetWindow.frames[frameIndex]?.postMessage(message, "*");
+    }
+  });
+}
+function startViewportSnapshotResponder({
+  targetWindow,
+  takeSnapshot,
+  measureFrameRect,
+  isTrustedRequester = isTrustedViewportSnapshotRequester,
+  cascadeTimeoutMs = 1500
+}) {
+  if (targetWindow.parent === targetWindow) {
+    return () => {
+    };
+  }
+  const onMessage = (event) => {
+    if (!isRequestMessage(event.data) || event.source !== targetWindow.parent || !canReceiveMessages(event.source) || !isTrustedRequester(event.origin ?? "")) {
+      return;
+    }
+    const { requestId, frameIndex, remainingDepth } = event.data;
+    const requester = event.source;
+    const requesterOrigin = event.origin ?? "*";
+    const respond = (capture) => {
+      const response = {
+        type: VIEWPORT_SNAPSHOT_RESPONSE,
+        requestId,
+        frameIndex,
+        capture
+      };
+      requester.postMessage(response, requesterOrigin);
+    };
+    let snapshot = null;
+    try {
+      snapshot = takeSnapshot();
+    } catch {
+    }
+    if (snapshot === null) {
+      respond(null);
+      return;
+    }
+    void requestChildViewportSnapshots({
+      targetWindow,
+      // Derived per level so a child's own fan-out can't collide with ours.
+      requestId: `${requestId}:${frameIndex}`,
+      timeoutMs: cascadeTimeoutMs,
+      remainingDepth: remainingDepth - 1
+    }).then((childCaptures) => {
+      respond({
+        snapshot,
+        childFrames: childCaptures.flatMap((child) => {
+          const rect = measureFrameRect(child.frameIndex);
+          return rect ? [{ frameIndex: child.frameIndex, rect, capture: child.capture }] : [];
+        })
+      });
+    });
+  };
+  targetWindow.addEventListener("message", onMessage);
+  return () => {
+    return targetWindow.removeEventListener("message", onMessage);
+  };
+}
+
+export { VIEWPORT_SNAPSHOT_MAX_DEPTH, VIEWPORT_SNAPSHOT_REQUEST, VIEWPORT_SNAPSHOT_RESPONSE, isTrustedViewportSnapshotRequester, requestChildViewportSnapshots, startViewportSnapshotResponder };

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@replohq/sandbox-runtime",
-  "version": "1.6.4",
+  "version": "1.6.6",
   "reploBuild": {
     "packageName": "@replohq/sandbox-runtime",
-    "version": "1.6.4",
+    "version": "1.6.6",
     "branch": "HEAD",
-    "commit": "085a9d43063283dfea1f13552ee57d6b6f6b3f29",
-    "builtAt": "2026-09-11T23:34:52.476Z"
+    "commit": "0a9a7d328a712b8935e4b6a199689919c3ec4392",
+    "builtAt": "2026-09-13T12:48:42.823Z"
   },
   "description": "Replo sandbox runtime — editor integration for agent-built Next.js sites.",
   "license": "SEE LICENSE IN LICENSE",

package/sandbox-runtime.js

@@ -1,5 +1,6 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useViewportSnapshotResponder } from "./_vendor/replo-utils/react/use-viewport-snapshot-responder.mjs";
 import { AnnotationLayerMount } from "./annotations/AnnotationLayerMount";
 import { ClientErrorBoundary } from "./ClientErrorBoundary";
 import { DesignLibraryPreview } from "./design-library-preview/DesignLibraryPreview";
@@ -9,6 +10,10 @@ import { NavigationReceiver } from "./NavigationReceiver";
 import { NextErrorReporter } from "./NextErrorReporter";
 import PostHogRelay from "./posthog-relay";
 import { EditorSelection } from "./select-mode/EditorSelection";
+function ViewportSnapshotResponder() {
+  useViewportSnapshotResponder();
+  return null;
+}
 function SandboxRuntime({ children }) {
   const isDevServer = process.env.NODE_ENV === "development";
   return isDevServer ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -18,6 +23,7 @@ function SandboxRuntime({ children }) {
       /* @__PURE__ */ jsx(LinkInterceptor, {}),
       /* @__PURE__ */ jsx(NavigationReceiver, {}),
       /* @__PURE__ */ jsx(PostHogRelay, {}),
+      /* @__PURE__ */ jsx(ViewportSnapshotResponder, {}),
       /* @__PURE__ */ jsx(EditorSelection, {}),
       /* @__PURE__ */ jsx(AnnotationLayerMount, {}),
       /* @__PURE__ */ jsx(DesignLibraryPreview, {}),

package/sandbox-runtime.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../sandbox-runtime.tsx"],
-  "sourcesContent": ["\"use client\";\n\nimport { AnnotationLayerMount } from \"./annotations/AnnotationLayerMount\";\nimport { ClientErrorBoundary } from \"./ClientErrorBoundary\";\nimport { DesignLibraryPreview } from \"./design-library-preview/DesignLibraryPreview\";\nimport { DocumentReadyBeacon } from \"./DocumentReadyBeacon\";\nimport LinkInterceptor from \"./LinkInterceptor\";\nimport { NavigationReceiver } from \"./NavigationReceiver\";\nimport { NextErrorReporter } from \"./NextErrorReporter\";\nimport PostHogRelay from \"./posthog-relay\";\nimport { EditorSelection } from \"./select-mode/EditorSelection\";\n\nexport function SandboxRuntime({ children }: React.PropsWithChildren) {\n  // The editor only embeds dev servers (`next dev`), so editor-integration components render there only \u2014 production builds ship none of them and behave like plain Next apps.\n  const isDevServer = process.env.NODE_ENV === \"development\";\n\n  return isDevServer ? (\n    <>\n      <DocumentReadyBeacon />\n      {/* NOTE (Max, 2026-06-08): Outside ClientErrorBoundary on purpose \u2014 when\n          the boundary catches a runtime error it swaps its children for a\n          neutral cover, which would unmount the reporter and freeze it in the\n          error state. It must stay mounted to observe Next's overlay across\n          error <-> recover. */}\n      <NextErrorReporter />\n      <ClientErrorBoundary>\n        <LinkInterceptor />\n        <NavigationReceiver />\n        <PostHogRelay />\n        <EditorSelection />\n        <AnnotationLayerMount />\n        <DesignLibraryPreview />\n        {children}\n      </ClientErrorBoundary>\n    </>\n  ) : (\n    children\n  );\n}\n"],
-  "mappings": ";AAiBI,mBACE,KAOA,YARF;AAfJ,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,OAAO,qBAAqB;AAC5B,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,OAAO,kBAAkB;AACzB,SAAS,uBAAuB;AAEzB,SAAS,eAAe,EAAE,SAAS,GAA4B;AAEpE,QAAM,cAAc,QAAQ,IAAI,aAAa;AAE7C,SAAO,cACL,iCACE;AAAA,wBAAC,uBAAoB;AAAA,IAMrB,oBAAC,qBAAkB;AAAA,IACnB,qBAAC,uBACC;AAAA,0BAAC,mBAAgB;AAAA,MACjB,oBAAC,sBAAmB;AAAA,MACpB,oBAAC,gBAAa;AAAA,MACd,oBAAC,mBAAgB;AAAA,MACjB,oBAAC,wBAAqB;AAAA,MACtB,oBAAC,wBAAqB;AAAA,MACrB;AAAA,OACH;AAAA,KACF,IAEA;AAEJ;",
+  "sourcesContent": ["\"use client\";\n\nimport { useViewportSnapshotResponder } from \"replo-utils/react/use-viewport-snapshot-responder\";\n\nimport { AnnotationLayerMount } from \"./annotations/AnnotationLayerMount\";\nimport { ClientErrorBoundary } from \"./ClientErrorBoundary\";\nimport { DesignLibraryPreview } from \"./design-library-preview/DesignLibraryPreview\";\nimport { DocumentReadyBeacon } from \"./DocumentReadyBeacon\";\nimport LinkInterceptor from \"./LinkInterceptor\";\nimport { NavigationReceiver } from \"./NavigationReceiver\";\nimport { NextErrorReporter } from \"./NextErrorReporter\";\nimport PostHogRelay from \"./posthog-relay\";\nimport { EditorSelection } from \"./select-mode/EditorSelection\";\n\nfunction ViewportSnapshotResponder() {\n  useViewportSnapshotResponder();\n  return null;\n}\n\nexport function SandboxRuntime({ children }: React.PropsWithChildren) {\n  // The editor only embeds dev servers (`next dev`), so editor-integration components render there only \u2014 production builds ship none of them and behave like plain Next apps.\n  const isDevServer = process.env.NODE_ENV === \"development\";\n\n  return isDevServer ? (\n    <>\n      <DocumentReadyBeacon />\n      {/* NOTE (Max, 2026-06-08): Outside ClientErrorBoundary on purpose \u2014 when\n          the boundary catches a runtime error it swaps its children for a\n          neutral cover, which would unmount the reporter and freeze it in the\n          error state. It must stay mounted to observe Next's overlay across\n          error <-> recover. */}\n      <NextErrorReporter />\n      <ClientErrorBoundary>\n        <LinkInterceptor />\n        <NavigationReceiver />\n        <PostHogRelay />\n        <ViewportSnapshotResponder />\n        <EditorSelection />\n        <AnnotationLayerMount />\n        <DesignLibraryPreview />\n        {children}\n      </ClientErrorBoundary>\n    </>\n  ) : (\n    children\n  );\n}\n"],
+  "mappings": ";AAwBI,mBACE,KAOA,YARF;AAtBJ,SAAS,oCAAoC;AAE7C,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,OAAO,qBAAqB;AAC5B,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,OAAO,kBAAkB;AACzB,SAAS,uBAAuB;AAEhC,SAAS,4BAA4B;AACnC,+BAA6B;AAC7B,SAAO;AACT;AAEO,SAAS,eAAe,EAAE,SAAS,GAA4B;AAEpE,QAAM,cAAc,QAAQ,IAAI,aAAa;AAE7C,SAAO,cACL,iCACE;AAAA,wBAAC,uBAAoB;AAAA,IAMrB,oBAAC,qBAAkB;AAAA,IACnB,qBAAC,uBACC;AAAA,0BAAC,mBAAgB;AAAA,MACjB,oBAAC,sBAAmB;AAAA,MACpB,oBAAC,gBAAa;AAAA,MACd,oBAAC,6BAA0B;AAAA,MAC3B,oBAAC,mBAAgB;AAAA,MACjB,oBAAC,wBAAqB;AAAA,MACtB,oBAAC,wBAAqB;AAAA,MACrB;AAAA,OACH;AAAA,KACF,IAEA;AAEJ;",
   "names": []
 }

package/select-mode/EditorSelection.js

@@ -15,6 +15,7 @@ import { useSelectionScrollSync } from "./hooks/useSelectionScrollSync";
 import { useSelectModeController } from "./hooks/useSelectModeController";
 import { getRepetitionSiblingElements } from "./hooks/useSiblingResolution";
 import { getWebsiteBuilderRpc } from "./iframeRpcChannel";
+import { isSelectionStillCurrent } from "./selectionPublish";
 import { symbolicateSelectedElement } from "./symbolicate";
 function EditorSelection() {
   const {
@@ -60,6 +61,12 @@ function EditorSelection() {
       data: descriptor
     };
     void symbolicateSelectedElement(descriptor).then((symbolicated) => {
+      if (!isSelectionStillCurrent({
+        session: interactionSessionRef.current,
+        selection: { type: "element", element }
+      })) {
+        return;
+      }
       getWebsiteBuilderRpc()?.elementSelected({ data: symbolicated });
     });
   }, [interactionSessionRef]);

package/select-mode/EditorSelection.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../select-mode/EditorSelection.tsx"],
-  "sourcesContent": ["\"use client\";\n\nimport { useCallback, useEffect } from \"react\";\n\nimport {\n  buildElementDescriptor,\n  buildSelector,\n} from \"./descriptor/elementDescriptor\";\nimport { installFastRefreshRelay } from \"./fast-refresh-relay\";\nimport { useCrosshairCursor } from \"./hooks/useCrosshairCursor\";\nimport { useEditModeStateMachine } from \"./hooks/useEditModeStateMachine\";\nimport { useOptimisticOverrides } from \"./hooks/useOptimisticOverrides\";\nimport { useParentMessaging } from \"./hooks/useParentMessaging\";\nimport { useSelectionHover } from \"./hooks/useSelectionHover\";\nimport { useSelectionInteractions } from \"./hooks/useSelectionInteractions\";\nimport { useSelectionScrollSync } from \"./hooks/useSelectionScrollSync\";\nimport { useSelectModeController } from \"./hooks/useSelectModeController\";\nimport { getRepetitionSiblingElements } from \"./hooks/useSiblingResolution\";\nimport { getWebsiteBuilderRpc } from \"./iframeRpcChannel\";\nimport { symbolicateSelectedElement } from \"./symbolicate\";\n\n/**\n * Mounts the iframe-side selectMode controller. This is a render-less\n * component \u2014 every responsibility is delegated to a dedicated hook so each\n * concern (parent messaging, cursor styling, pointer interactions, hover\n * tracking, scroll syncing) can be read in isolation:\n *\n *  - `useParentMessaging` \u2014 inbound messages from the parent (set mode,\n *    set selection type) + outbound `IFRAME_READY` handshake.\n *  - `useCrosshairCursor` \u2014 crosshair cursor + disable text/drag selection\n *    while in selection mode.\n *  - `useSelectionInteractions` \u2014 pointer-down / move / up state machine\n *    that produces `ELEMENT_SELECTED`, `AREA_SELECTED`, and live\n *    `DRAG_RECT_UPDATED` messages.\n *  - `useSelectionHover` \u2014 hover-element rect updates.\n *  - `useSelectionScrollSync` \u2014 keeps the parent overlay aligned with the\n *    selected element/area when the iframe scrolls.\n *\n * The `interactionSessionRef` is the single source of truth for the\n * in-progress drag/selection \u2014 every hook reads/writes it via ref so we\n * don't trigger React re-renders during interaction-heavy operations.\n *\n * @author Kevin O'Connell 2026-04-17\n */\nexport function EditorSelection() {\n  const {\n    displayMode,\n    interactionSessionRef,\n    setDisplayMode,\n    setSelectionType,\n  } = useSelectModeController();\n  const { beginEditing, editingElementRef, formatCommand, revert } =\n    useEditModeStateMachine({\n      displayMode,\n      interactionSessionRef,\n    });\n  const {\n    applyOptimisticUpdate,\n    markCommitted,\n    reapplyOverrides,\n    resolveSessionOverrides,\n    revertOverride,\n  } = useOptimisticOverrides();\n\n  const postSelectedElementSnapshot = useCallback(() => {\n    const session = interactionSessionRef.current;\n    if (session.type !== \"element\") {\n      return;\n    }\n\n    const selectedElement =\n      session.data.kind === \"react-element\"\n        ? document.querySelector(session.data.selector)\n        : null;\n    const element = selectedElement ?? session.element;\n    if (!(element instanceof Element) || !element.isConnected) {\n      return;\n    }\n\n    // A fast refresh can replace the repeated DOM nodes, so the group is\n    // re-resolved from the (possibly re-created) element rather than carried\n    // over from the stale session.\n    const siblingElements = getRepetitionSiblingElements({ element });\n    const descriptor = buildElementDescriptor({\n      element,\n      clickPosition:\n        session.clickPosition ??\n        (session.data.kind === \"react-element\"\n          ? session.data.clickPosition\n          : { x: 0, y: 0 }),\n      siblingSelectors: siblingElements.map(buildSelector),\n    });\n    if (descriptor.kind !== \"react-element\") {\n      return;\n    }\n\n    interactionSessionRef.current = {\n      ...session,\n      element,\n      siblingElements,\n      data: descriptor,\n    };\n\n    void symbolicateSelectedElement(descriptor).then((symbolicated) => {\n      getWebsiteBuilderRpc()?.elementSelected({ data: symbolicated });\n    });\n  }, [interactionSessionRef]);\n\n  // eslint-disable-next-line replo/no-use-effect -- Installs a window-level console bridge for the preview iframe.\n  useEffect(() => {\n    installFastRefreshRelay({\n      onComplete: () => {\n        // Re-apply before re-symbolicating so the snapshot reads the\n        // optimistic content, not the source the refresh just repainted.\n        reapplyOverrides({ skipElement: editingElementRef.current });\n        postSelectedElementSnapshot();\n      },\n    });\n  }, [editingElementRef, postSelectedElementSnapshot, reapplyOverrides]);\n\n  useParentMessaging({\n    applyOptimisticUpdate,\n    markCommitted,\n    onExitEditMode: revert,\n    onFormatCommand: formatCommand,\n    resolveSessionOverrides,\n    revertOverride,\n    setDisplayMode,\n    setSelectionType,\n  });\n  useCrosshairCursor({ displayMode });\n  useSelectionInteractions({\n    displayMode,\n    editingElementRef,\n    interactionSessionRef,\n    onBeginEditing: beginEditing,\n  });\n  useSelectionHover({ displayMode, interactionSessionRef });\n  useSelectionScrollSync({\n    displayMode,\n    interactionSessionRef,\n  });\n\n  return null;\n}\n"],
-  "mappings": ";AAEA,SAAS,aAAa,iBAAiB;AAEvC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,+BAA+B;AACxC,SAAS,0BAA0B;AACnC,SAAS,+BAA+B;AACxC,SAAS,8BAA8B;AACvC,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,SAAS,gCAAgC;AACzC,SAAS,8BAA8B;AACvC,SAAS,+BAA+B;AACxC,SAAS,oCAAoC;AAC7C,SAAS,4BAA4B;AACrC,SAAS,kCAAkC;AAyBpC,SAAS,kBAAkB;AAChC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,wBAAwB;AAC5B,QAAM,EAAE,cAAc,mBAAmB,eAAe,OAAO,IAC7D,wBAAwB;AAAA,IACtB;AAAA,IACA;AAAA,EACF,CAAC;AACH,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,uBAAuB;AAE3B,QAAM,8BAA8B,YAAY,MAAM;AACpD,UAAM,UAAU,sBAAsB;AACtC,QAAI,QAAQ,SAAS,WAAW;AAC9B;AAAA,IACF;AAEA,UAAM,kBACJ,QAAQ,KAAK,SAAS,kBAClB,SAAS,cAAc,QAAQ,KAAK,QAAQ,IAC5C;AACN,UAAM,UAAU,mBAAmB,QAAQ;AAC3C,QAAI,EAAE,mBAAmB,YAAY,CAAC,QAAQ,aAAa;AACzD;AAAA,IACF;AAKA,UAAM,kBAAkB,6BAA6B,EAAE,QAAQ,CAAC;AAChE,UAAM,aAAa,uBAAuB;AAAA,MACxC;AAAA,MACA,eACE,QAAQ,kBACP,QAAQ,KAAK,SAAS,kBACnB,QAAQ,KAAK,gBACb,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,MACnB,kBAAkB,gBAAgB,IAAI,aAAa;AAAA,IACrD,CAAC;AACD,QAAI,WAAW,SAAS,iBAAiB;AACvC;AAAA,IACF;AAEA,0BAAsB,UAAU;AAAA,MAC9B,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,IACR;AAEA,SAAK,2BAA2B,UAAU,EAAE,KAAK,CAAC,iBAAiB;AACjE,2BAAqB,GAAG,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAAA,IAChE,CAAC;AAAA,EACH,GAAG,CAAC,qBAAqB,CAAC;AAG1B,YAAU,MAAM;AACd,4BAAwB;AAAA,MACtB,YAAY,MAAM;AAGhB,yBAAiB,EAAE,aAAa,kBAAkB,QAAQ,CAAC;AAC3D,oCAA4B;AAAA,MAC9B;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,mBAAmB,6BAA6B,gBAAgB,CAAC;AAErE,qBAAmB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,qBAAmB,EAAE,YAAY,CAAC;AAClC,2BAAyB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,EAClB,CAAC;AACD,oBAAkB,EAAE,aAAa,sBAAsB,CAAC;AACxD,yBAAuB;AAAA,IACrB;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
+  "sourcesContent": ["\"use client\";\n\nimport { useCallback, useEffect } from \"react\";\n\nimport {\n  buildElementDescriptor,\n  buildSelector,\n} from \"./descriptor/elementDescriptor\";\nimport { installFastRefreshRelay } from \"./fast-refresh-relay\";\nimport { useCrosshairCursor } from \"./hooks/useCrosshairCursor\";\nimport { useEditModeStateMachine } from \"./hooks/useEditModeStateMachine\";\nimport { useOptimisticOverrides } from \"./hooks/useOptimisticOverrides\";\nimport { useParentMessaging } from \"./hooks/useParentMessaging\";\nimport { useSelectionHover } from \"./hooks/useSelectionHover\";\nimport { useSelectionInteractions } from \"./hooks/useSelectionInteractions\";\nimport { useSelectionScrollSync } from \"./hooks/useSelectionScrollSync\";\nimport { useSelectModeController } from \"./hooks/useSelectModeController\";\nimport { getRepetitionSiblingElements } from \"./hooks/useSiblingResolution\";\nimport { getWebsiteBuilderRpc } from \"./iframeRpcChannel\";\nimport { isSelectionStillCurrent } from \"./selectionPublish\";\nimport { symbolicateSelectedElement } from \"./symbolicate\";\n\n/**\n * Mounts the iframe-side selectMode controller. This is a render-less\n * component \u2014 every responsibility is delegated to a dedicated hook so each\n * concern (parent messaging, cursor styling, pointer interactions, hover\n * tracking, scroll syncing) can be read in isolation:\n *\n *  - `useParentMessaging` \u2014 inbound messages from the parent (set mode,\n *    set selection type) + outbound `IFRAME_READY` handshake.\n *  - `useCrosshairCursor` \u2014 crosshair cursor + disable text/drag selection\n *    while in selection mode.\n *  - `useSelectionInteractions` \u2014 pointer-down / move / up state machine\n *    that produces `ELEMENT_SELECTED`, `AREA_SELECTED`, and live\n *    `DRAG_RECT_UPDATED` messages.\n *  - `useSelectionHover` \u2014 hover-element rect updates.\n *  - `useSelectionScrollSync` \u2014 keeps the parent overlay aligned with the\n *    selected element/area when the iframe scrolls.\n *\n * The `interactionSessionRef` is the single source of truth for the\n * in-progress drag/selection \u2014 every hook reads/writes it via ref so we\n * don't trigger React re-renders during interaction-heavy operations.\n *\n * @author Kevin O'Connell 2026-04-17\n */\nexport function EditorSelection() {\n  const {\n    displayMode,\n    interactionSessionRef,\n    setDisplayMode,\n    setSelectionType,\n  } = useSelectModeController();\n  const { beginEditing, editingElementRef, formatCommand, revert } =\n    useEditModeStateMachine({\n      displayMode,\n      interactionSessionRef,\n    });\n  const {\n    applyOptimisticUpdate,\n    markCommitted,\n    reapplyOverrides,\n    resolveSessionOverrides,\n    revertOverride,\n  } = useOptimisticOverrides();\n\n  const postSelectedElementSnapshot = useCallback(() => {\n    const session = interactionSessionRef.current;\n    if (session.type !== \"element\") {\n      return;\n    }\n\n    const selectedElement =\n      session.data.kind === \"react-element\"\n        ? document.querySelector(session.data.selector)\n        : null;\n    const element = selectedElement ?? session.element;\n    if (!(element instanceof Element) || !element.isConnected) {\n      return;\n    }\n\n    // A fast refresh can replace the repeated DOM nodes, so the group is\n    // re-resolved from the (possibly re-created) element rather than carried\n    // over from the stale session.\n    const siblingElements = getRepetitionSiblingElements({ element });\n    const descriptor = buildElementDescriptor({\n      element,\n      clickPosition:\n        session.clickPosition ??\n        (session.data.kind === \"react-element\"\n          ? session.data.clickPosition\n          : { x: 0, y: 0 }),\n      siblingSelectors: siblingElements.map(buildSelector),\n    });\n    if (descriptor.kind !== \"react-element\") {\n      return;\n    }\n\n    interactionSessionRef.current = {\n      ...session,\n      element,\n      siblingElements,\n      data: descriptor,\n    };\n\n    void symbolicateSelectedElement(descriptor).then((symbolicated) => {\n      if (\n        !isSelectionStillCurrent({\n          session: interactionSessionRef.current,\n          selection: { type: \"element\", element },\n        })\n      ) {\n        return;\n      }\n      getWebsiteBuilderRpc()?.elementSelected({ data: symbolicated });\n    });\n  }, [interactionSessionRef]);\n\n  // eslint-disable-next-line replo/no-use-effect -- Installs a window-level console bridge for the preview iframe.\n  useEffect(() => {\n    installFastRefreshRelay({\n      onComplete: () => {\n        // Re-apply before re-symbolicating so the snapshot reads the\n        // optimistic content, not the source the refresh just repainted.\n        reapplyOverrides({ skipElement: editingElementRef.current });\n        postSelectedElementSnapshot();\n      },\n    });\n  }, [editingElementRef, postSelectedElementSnapshot, reapplyOverrides]);\n\n  useParentMessaging({\n    applyOptimisticUpdate,\n    markCommitted,\n    onExitEditMode: revert,\n    onFormatCommand: formatCommand,\n    resolveSessionOverrides,\n    revertOverride,\n    setDisplayMode,\n    setSelectionType,\n  });\n  useCrosshairCursor({ displayMode });\n  useSelectionInteractions({\n    displayMode,\n    editingElementRef,\n    interactionSessionRef,\n    onBeginEditing: beginEditing,\n  });\n  useSelectionHover({ displayMode, interactionSessionRef });\n  useSelectionScrollSync({\n    displayMode,\n    interactionSessionRef,\n  });\n\n  return null;\n}\n"],
+  "mappings": ";AAEA,SAAS,aAAa,iBAAiB;AAEvC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,+BAA+B;AACxC,SAAS,0BAA0B;AACnC,SAAS,+BAA+B;AACxC,SAAS,8BAA8B;AACvC,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,SAAS,gCAAgC;AACzC,SAAS,8BAA8B;AACvC,SAAS,+BAA+B;AACxC,SAAS,oCAAoC;AAC7C,SAAS,4BAA4B;AACrC,SAAS,+BAA+B;AACxC,SAAS,kCAAkC;AAyBpC,SAAS,kBAAkB;AAChC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,wBAAwB;AAC5B,QAAM,EAAE,cAAc,mBAAmB,eAAe,OAAO,IAC7D,wBAAwB;AAAA,IACtB;AAAA,IACA;AAAA,EACF,CAAC;AACH,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,uBAAuB;AAE3B,QAAM,8BAA8B,YAAY,MAAM;AACpD,UAAM,UAAU,sBAAsB;AACtC,QAAI,QAAQ,SAAS,WAAW;AAC9B;AAAA,IACF;AAEA,UAAM,kBACJ,QAAQ,KAAK,SAAS,kBAClB,SAAS,cAAc,QAAQ,KAAK,QAAQ,IAC5C;AACN,UAAM,UAAU,mBAAmB,QAAQ;AAC3C,QAAI,EAAE,mBAAmB,YAAY,CAAC,QAAQ,aAAa;AACzD;AAAA,IACF;AAKA,UAAM,kBAAkB,6BAA6B,EAAE,QAAQ,CAAC;AAChE,UAAM,aAAa,uBAAuB;AAAA,MACxC;AAAA,MACA,eACE,QAAQ,kBACP,QAAQ,KAAK,SAAS,kBACnB,QAAQ,KAAK,gBACb,EAAE,GAAG,GAAG,GAAG,EAAE;AAAA,MACnB,kBAAkB,gBAAgB,IAAI,aAAa;AAAA,IACrD,CAAC;AACD,QAAI,WAAW,SAAS,iBAAiB;AACvC;AAAA,IACF;AAEA,0BAAsB,UAAU;AAAA,MAC9B,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA,MAAM;AAAA,IACR;AAEA,SAAK,2BAA2B,UAAU,EAAE,KAAK,CAAC,iBAAiB;AACjE,UACE,CAAC,wBAAwB;AAAA,QACvB,SAAS,sBAAsB;AAAA,QAC/B,WAAW,EAAE,MAAM,WAAW,QAAQ;AAAA,MACxC,CAAC,GACD;AACA;AAAA,MACF;AACA,2BAAqB,GAAG,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAAA,IAChE,CAAC;AAAA,EACH,GAAG,CAAC,qBAAqB,CAAC;AAG1B,YAAU,MAAM;AACd,4BAAwB;AAAA,MACtB,YAAY,MAAM;AAGhB,yBAAiB,EAAE,aAAa,kBAAkB,QAAQ,CAAC;AAC3D,oCAA4B;AAAA,MAC9B;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,mBAAmB,6BAA6B,gBAAgB,CAAC;AAErE,qBAAmB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,qBAAmB,EAAE,YAAY,CAAC;AAClC,2BAAyB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,EAClB,CAAC;AACD,oBAAkB,EAAE,aAAa,sBAAsB,CAAC;AACxD,yBAAuB;AAAA,IACrB;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
   "names": []
 }

package/select-mode/hooks/useSelectionInteractions.js

@@ -19,6 +19,7 @@ import {
   showElementSelectionFrames,
   showSelectionFrames
 } from "../selectionFrame";
+import { isSelectionStillCurrent } from "../selectionPublish";
 import { IDLE_SESSION } from "../selectModeSession";
 import { symbolicateSelectedElement } from "../symbolicate";
 import { isTextEditableElement } from "./useEditModeStateMachine";
@@ -229,6 +230,12 @@ function useSelectionInteractions({
         data
       };
       void maybeSymbolicate(data).then((symbolicated) => {
+        if (!isSelectionStillCurrent({
+          session: interactionSessionRef.current,
+          selection: { type: "element", element: selectionElement }
+        })) {
+          return;
+        }
         getWebsiteBuilderRpc()?.elementSelected({ data: symbolicated });
       });
     };
@@ -309,6 +316,12 @@ function useSelectionInteractions({
       });
       void Promise.all(items.map(maybeSymbolicate)).then(
         (symbolicatedItems) => {
+          if (!isSelectionStillCurrent({
+            session: interactionSessionRef.current,
+            selection: { type: "area", pageRect }
+          })) {
+            return;
+          }
           getWebsiteBuilderRpc()?.areaSelected({
             rect: selectionRect,
             items: symbolicatedItems

package/select-mode/hooks/useSelectionInteractions.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../select-mode/hooks/useSelectionInteractions.ts"],
-  "sourcesContent": ["import type { MutableRefObject } from \"react\";\nimport type {\n  DisplayMode,\n  SelectableData,\n  SelectModeClickPosition,\n} from \"schemas/generated/selectMode\";\nimport type { DragCandidate } from \"../interactions/selectionGeometry\";\nimport type { SelectModeInteractionSession } from \"../selectModeSession\";\n\nimport { useEffect } from \"react\";\n\nimport {\n  buildElementDescriptor,\n  buildSelector,\n  getNearestSelectableElement,\n} from \"../descriptor/elementDescriptor\";\nimport { getWebsiteBuilderRpc } from \"../iframeRpcChannel\";\nimport {\n  collectDragCandidates,\n  getCandidatesInSelection,\n  getDocumentScrollOffset,\n  getDragPositionFromClient,\n  getElementAnchor,\n  getPageRectFromViewportRect,\n  getViewportRectFromPageRect,\n  getViewportSelectionRect,\n} from \"../interactions/selectionGeometry\";\nimport {\n  showElementSelectionFrames,\n  showSelectionFrames,\n} from \"../selectionFrame\";\nimport { IDLE_SESSION } from \"../selectModeSession\";\nimport { symbolicateSelectedElement } from \"../symbolicate\";\nimport { isTextEditableElement } from \"./useEditModeStateMachine\";\nimport { getRepetitionSiblingElements } from \"./useSiblingResolution\";\n\nconst DOUBLE_CLICK_THRESHOLD_MS = 500;\n\n// React fibers carry only Turbopack chunk paths; resolving them to the\n// user's source file is async and only meaningful for \"react-element\"\n// kinds. Plan selectables already point at the right thing.\nasync function maybeSymbolicate(data: SelectableData): Promise<SelectableData> {\n  return data.kind === \"react-element\"\n    ? symbolicateSelectedElement(data)\n    : data;\n}\n\n/**\n * Owns the iframe-side pointer interactions that drive selection:\n *\n *  - On `pointerdown` we open a `drag` session (storing both client + page\n *    coords plus the current scroll offset). We don't yet know if this will\n *    become a click or an actual drag.\n *  - On `pointermove` we update the drag rect and post `DRAG_RECT_UPDATED`\n *    to the parent so the live drag rectangle can render. We only flip\n *    `hasExceededThreshold` once the rect grows past 6\u00D76 px so that a tiny\n *    accidental drag still resolves as a click.\n *  - On `pointerup` we either:\n *      - resolve as an `ELEMENT_SELECTED` (single click / sub-threshold drag)\n *      - resolve as an `AREA_SELECTED` (drag past threshold), filtering the\n *        candidates snapshotted at drag start against the final rectangle to\n *        enumerate which descendants the user enclosed.\n *  - During an active drag a `requestAnimationFrame` loop keeps the rect in\n *    sync with the page scroll so the rectangle visually \"sticks\" to the\n *    page rather than the viewport.\n *\n * We capture-listen and `preventDefault`/`stopPropagation` clicks so the\n * underlying page can't navigate or trigger handlers while the user is\n * working in selection mode.\n *\n * @author Kevin O'Connell 2026-04-17\n */\nexport function useSelectionInteractions({\n  displayMode,\n  editingElementRef,\n  interactionSessionRef,\n  onBeginEditing,\n}: {\n  displayMode: DisplayMode;\n  editingElementRef?: MutableRefObject<HTMLElement | null>;\n  interactionSessionRef: MutableRefObject<SelectModeInteractionSession>;\n  onBeginEditing: (args: {\n    element: Element;\n    descriptorPromise: Promise<SelectableData>;\n  }) => void;\n}) {\n  // eslint-disable-next-line replo/no-use-effect -- Legacy effect - may or may not be necessary\n  useEffect(() => {\n    if (displayMode !== \"selection\") {\n      return;\n    }\n\n    let dragAnimationFrameId: number | null = null;\n    const editingPointerIds = new Set<number>();\n    let lastClick: {\n      descriptorPromise: Promise<SelectableData>;\n      target: Element;\n      time: number;\n    } | null = null;\n    // Snapshot of the page's meaningful elements + their page rects, taken\n    // once when a drag begins so per-move hit-testing avoids a full-DOM scan.\n    let dragCandidates: DragCandidate[] = [];\n\n    const stopDragAnimation = () => {\n      if (dragAnimationFrameId === null) {\n        return;\n      }\n\n      cancelAnimationFrame(dragAnimationFrameId);\n      dragAnimationFrameId = null;\n    };\n\n    // `notifyParentDragCleared` posts a null drag rect so the parent tears\n    // down the live drag overlay. The area-commit path suppresses it: the\n    // parent maps a null drag rect to `selection = none`, which round-trips\n    // back as `setSelectionType(\"none\")` and wipes the in-iframe frames we're\n    // about to paint. The follow-up `areaSelected` supersedes the drag overlay\n    // on its own, so the null post is pure collateral damage there.\n    const resetDragState = ({\n      notifyParentDragCleared = true,\n    }: { notifyParentDragCleared?: boolean } = {}) => {\n      const currentSession = interactionSessionRef.current;\n\n      stopDragAnimation();\n\n      if (currentSession.type !== \"drag\") {\n        dragCandidates = [];\n        return;\n      }\n\n      if (notifyParentDragCleared && currentSession.hasExceededThreshold) {\n        getWebsiteBuilderRpc()?.dragRectUpdated({\n          dragRect: null,\n          selectionRects: [],\n        });\n      }\n\n      dragCandidates = [];\n      interactionSessionRef.current = IDLE_SESSION;\n    };\n\n    const postCurrentDragRect = () => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\") {\n        return;\n      }\n\n      const rect = getViewportSelectionRect({\n        dragStart: session.dragStart,\n        dragCurrent: session.dragCurrent,\n        scrollOffset: session.scrollOffset,\n      });\n\n      if (\n        rect.width <= 6 &&\n        rect.height <= 6 &&\n        !session.hasExceededThreshold\n      ) {\n        return;\n      }\n\n      if (!session.hasExceededThreshold) {\n        interactionSessionRef.current = {\n          ...session,\n          hasExceededThreshold: true,\n        };\n      }\n\n      // Cheap hit-test against the candidates we snapshotted at drag start,\n      // projected back to viewport coords so the parent can paint a live\n      // highlight on each element the drag will capture. No DOM scan here.\n      const selectionPageRect = getPageRectFromViewportRect({\n        rect,\n        scrollOffset: session.scrollOffset,\n      });\n      const selectionRects = getCandidatesInSelection({\n        candidates: dragCandidates,\n        selectionPageRect,\n      }).map((candidate) => ({\n        id: candidate.id,\n        rect: getViewportRectFromPageRect({\n          rect: candidate.pageRect,\n          scrollOffset: session.scrollOffset,\n        }),\n      }));\n\n      getWebsiteBuilderRpc()?.dragRectUpdated({\n        dragRect: rect,\n        selectionRects,\n      });\n    };\n\n    const syncDragRectToViewport = () => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\") {\n        dragAnimationFrameId = null;\n        return;\n      }\n\n      const nextScrollOffset = getDocumentScrollOffset();\n      const nextDragCurrent = getDragPositionFromClient({\n        clientX: session.dragCurrent.clientX,\n        clientY: session.dragCurrent.clientY,\n        scrollOffset: nextScrollOffset,\n      });\n\n      if (\n        nextDragCurrent.pageX !== session.dragCurrent.pageX ||\n        nextDragCurrent.pageY !== session.dragCurrent.pageY\n      ) {\n        interactionSessionRef.current = {\n          ...session,\n          dragCurrent: nextDragCurrent,\n          scrollOffset: nextScrollOffset,\n        };\n        postCurrentDragRect();\n      } else {\n        interactionSessionRef.current = {\n          ...session,\n          scrollOffset: nextScrollOffset,\n        };\n      }\n\n      dragAnimationFrameId = requestAnimationFrame(syncDragRectToViewport);\n    };\n\n    const handlePointerDown = (event: PointerEvent) => {\n      editingPointerIds.delete(event.pointerId);\n      if (\n        editingElementRef?.current &&\n        event.target instanceof Node &&\n        editingElementRef.current.contains(event.target)\n      ) {\n        editingPointerIds.add(event.pointerId);\n        return;\n      }\n      event.preventDefault();\n      event.stopPropagation();\n\n      const scrollOffset = getDocumentScrollOffset();\n      const dragStart = getDragPositionFromClient({\n        clientX: event.clientX,\n        clientY: event.clientY,\n        scrollOffset,\n      });\n      interactionSessionRef.current = {\n        type: \"drag\",\n        dragStart,\n        dragCurrent: dragStart,\n        scrollOffset,\n        hasExceededThreshold: false,\n      };\n      dragCandidates = collectDragCandidates(scrollOffset);\n\n      if (dragAnimationFrameId === null) {\n        dragAnimationFrameId = requestAnimationFrame(syncDragRectToViewport);\n      }\n    };\n\n    const handlePointerMove = (event: PointerEvent) => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\") {\n        return;\n      }\n\n      interactionSessionRef.current = {\n        ...session,\n        dragCurrent: getDragPositionFromClient({\n          clientX: event.clientX,\n          clientY: event.clientY,\n          scrollOffset: getDocumentScrollOffset(),\n        }),\n      };\n      postCurrentDragRect();\n    };\n\n    const handleViewportChangeDuringDrag = () => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\" || dragAnimationFrameId !== null) {\n        return;\n      }\n\n      dragAnimationFrameId = requestAnimationFrame(syncDragRectToViewport);\n    };\n\n    const commitElementSelection = ({\n      targetElement,\n      pointerEvent,\n    }: {\n      targetElement: Element;\n      pointerEvent: PointerEvent;\n    }) => {\n      const selectionElement = getNearestSelectableElement(targetElement);\n      const targetRect = selectionElement.getBoundingClientRect();\n      const clickPosition: SelectModeClickPosition = {\n        x: pointerEvent.clientX,\n        y: pointerEvent.clientY,\n      };\n\n      // Paint the in-iframe selection frames synchronously for instant\n      // feedback \u2014 symbolicate is a network roundtrip and we don't want\n      // the visual selection to wait on it.\n      const scrollOffset = getDocumentScrollOffset();\n      const siblingElements =\n        selectionElement instanceof HTMLElement\n          ? getRepetitionSiblingElements({ element: selectionElement })\n          : [];\n      showElementSelectionFrames({\n        elements: [selectionElement, ...siblingElements],\n        scrollOffset,\n      });\n\n      const now = pointerEvent.timeStamp;\n      const previousClick = lastClick;\n      if (\n        previousClick &&\n        previousClick.target === selectionElement &&\n        now - previousClick.time <= DOUBLE_CLICK_THRESHOLD_MS &&\n        isTextEditableElement(selectionElement)\n      ) {\n        lastClick = null;\n        onBeginEditing({\n          element: selectionElement,\n          descriptorPromise: previousClick.descriptorPromise,\n        });\n        return;\n      }\n\n      // NOTE (Noah, 2026-07-24): Commit the selection immediately rather than\n      // deferring it behind the double-click window. A single click always\n      // selects, and a double-click is just \"select + edit\", so there's nothing\n      // to suppress \u2014 waiting only added a full DOUBLE_CLICK_THRESHOLD_MS of\n      // latency to every click and left `interactionSessionRef` non-element in\n      // the gap. Double-click is still detected via the `lastClick` timestamp\n      // above; the follow-up click reuses this descriptor to open the editor.\n      const data = buildElementDescriptor({\n        element: selectionElement,\n        clickPosition,\n        siblingSelectors: siblingElements.map(buildSelector),\n      });\n      lastClick = {\n        descriptorPromise: Promise.resolve(data),\n        target: selectionElement,\n        time: now,\n      };\n\n      if (!selectionElement.isConnected) {\n        return;\n      }\n      interactionSessionRef.current = {\n        type: \"element\",\n        element: selectionElement,\n        siblingElements,\n        clickPosition: {\n          x: pointerEvent.clientX - targetRect.left,\n          y: pointerEvent.clientY - targetRect.top,\n        },\n        data,\n      };\n      void maybeSymbolicate(data).then((symbolicated) => {\n        getWebsiteBuilderRpc()?.elementSelected({ data: symbolicated });\n      });\n    };\n\n    const handlePointerUp = (event: PointerEvent) => {\n      if (editingPointerIds.delete(event.pointerId)) {\n        return;\n      }\n      // Clicks inside the element being edited belong to the inline editor, not\n      // select mode. Without this guard the double-click detection below re-runs\n      // `onBeginEditing` on the same element (e.g. when repositioning the\n      // caret), rebuilding the editor over itself and wiping the content.\n      // Mirrors the guards in `handlePointerDown` and `handleClick`.\n      if (\n        editingElementRef?.current &&\n        event.target instanceof Node &&\n        editingElementRef.current.contains(event.target)\n      ) {\n        return;\n      }\n      const snapshot = interactionSessionRef.current;\n      const wasDragging =\n        snapshot.type === \"drag\" ? snapshot.hasExceededThreshold : false;\n      const dragStart = snapshot.type === \"drag\" ? snapshot.dragStart : null;\n      const dragCurrent =\n        snapshot.type === \"drag\" ? snapshot.dragCurrent : null;\n      const scrollOffset =\n        snapshot.type === \"drag\"\n          ? snapshot.scrollOffset\n          : getDocumentScrollOffset();\n      // `resetDragState` clears `dragCandidates`, so grab them first \u2014 the\n      // final committed set is the same cached candidates the live preview\n      // used, so preview and result never disagree.\n      const candidates = dragCandidates;\n\n      // Suppress the null drag-rect post: if this resolves to an area\n      // selection it would otherwise flash the parent to `selection = none`\n      // and wipe the frames we paint below. Click/empty-drag paths don't\n      // depend on it (a sub-threshold drag never posted a rect to clear).\n      resetDragState({ notifyParentDragCleared: false });\n\n      if (!dragStart || snapshot.type !== \"drag\") {\n        const targetElement = event.target;\n        if (!(targetElement instanceof Element)) {\n          return;\n        }\n\n        commitElementSelection({\n          targetElement,\n          pointerEvent: event,\n        });\n        return;\n      }\n\n      const resolvedDragCurrent = dragCurrent ?? dragStart;\n      const selectionRect = getViewportSelectionRect({\n        dragStart,\n        dragCurrent: resolvedDragCurrent,\n        scrollOffset,\n      });\n\n      if (!wasDragging) {\n        const targetElement = event.target;\n        if (!(targetElement instanceof Element)) {\n          return;\n        }\n\n        commitElementSelection({\n          targetElement,\n          pointerEvent: event,\n        });\n        return;\n      }\n\n      const pageRect = getPageRectFromViewportRect({\n        rect: selectionRect,\n        scrollOffset,\n      });\n\n      const selectedCandidates = getCandidatesInSelection({\n        candidates,\n        selectionPageRect: pageRect,\n      });\n      const items = selectedCandidates.map((candidate) => {\n        return buildElementDescriptor({\n          element: candidate.element,\n          clickPosition: getElementAnchor({\n            element: candidate.element,\n            selectionRect,\n          }),\n        });\n      });\n\n      interactionSessionRef.current = {\n        type: \"area\",\n        pageRect,\n        items,\n      };\n\n      // Highlight each captured element so the committed area selection\n      // \"sticks\" inside the iframe \u2014 matching how a single click stays\n      // outlined \u2014 rather than drawing one faint box over the drag region.\n      showSelectionFrames({\n        frames: selectedCandidates.map((candidate) => ({\n          variant: \"area\" as const,\n          pageRect: {\n            x: candidate.pageRect.x,\n            y: candidate.pageRect.y,\n            width: candidate.pageRect.width,\n            height: candidate.pageRect.height,\n          },\n        })),\n      });\n\n      void Promise.all(items.map(maybeSymbolicate)).then(\n        (symbolicatedItems) => {\n          getWebsiteBuilderRpc()?.areaSelected({\n            rect: selectionRect,\n            items: symbolicatedItems,\n          });\n        },\n      );\n    };\n\n    const handleClick = (event: MouseEvent) => {\n      if (\n        editingElementRef?.current &&\n        event.target instanceof Node &&\n        editingElementRef.current.contains(event.target)\n      ) {\n        return;\n      }\n      event.preventDefault();\n      event.stopPropagation();\n    };\n\n    const handlePointerCancel = (event: PointerEvent) => {\n      editingPointerIds.delete(event.pointerId);\n      resetDragState();\n    };\n\n    const handleWindowBlur = () => {\n      editingPointerIds.clear();\n      resetDragState();\n    };\n\n    document.addEventListener(\"pointerdown\", handlePointerDown, true);\n    document.addEventListener(\"pointermove\", handlePointerMove, true);\n    document.addEventListener(\"pointerup\", handlePointerUp, true);\n    document.addEventListener(\"pointercancel\", handlePointerCancel, true);\n    document.addEventListener(\"click\", handleClick, true);\n    document.addEventListener(\"scroll\", handleViewportChangeDuringDrag, true);\n    window.addEventListener(\"blur\", handleWindowBlur);\n    window.addEventListener(\"resize\", handleViewportChangeDuringDrag);\n\n    return () => {\n      document.removeEventListener(\"pointerdown\", handlePointerDown, true);\n      document.removeEventListener(\"pointermove\", handlePointerMove, true);\n      document.removeEventListener(\"pointerup\", handlePointerUp, true);\n      document.removeEventListener(\"pointercancel\", handlePointerCancel, true);\n      document.removeEventListener(\"click\", handleClick, true);\n      document.removeEventListener(\n        \"scroll\",\n        handleViewportChangeDuringDrag,\n        true,\n      );\n      window.removeEventListener(\"blur\", handleWindowBlur);\n      window.removeEventListener(\"resize\", handleViewportChangeDuringDrag);\n      resetDragState();\n    };\n  }, [displayMode, editingElementRef, interactionSessionRef, onBeginEditing]);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { MutableRefObject } from \"react\";\nimport type {\n  DisplayMode,\n  SelectableData,\n  SelectModeClickPosition,\n} from \"schemas/generated/selectMode\";\nimport type { DragCandidate } from \"../interactions/selectionGeometry\";\nimport type { SelectModeInteractionSession } from \"../selectModeSession\";\n\nimport { useEffect } from \"react\";\n\nimport {\n  buildElementDescriptor,\n  buildSelector,\n  getNearestSelectableElement,\n} from \"../descriptor/elementDescriptor\";\nimport { getWebsiteBuilderRpc } from \"../iframeRpcChannel\";\nimport {\n  collectDragCandidates,\n  getCandidatesInSelection,\n  getDocumentScrollOffset,\n  getDragPositionFromClient,\n  getElementAnchor,\n  getPageRectFromViewportRect,\n  getViewportRectFromPageRect,\n  getViewportSelectionRect,\n} from \"../interactions/selectionGeometry\";\nimport {\n  showElementSelectionFrames,\n  showSelectionFrames,\n} from \"../selectionFrame\";\nimport { isSelectionStillCurrent } from \"../selectionPublish\";\nimport { IDLE_SESSION } from \"../selectModeSession\";\nimport { symbolicateSelectedElement } from \"../symbolicate\";\nimport { isTextEditableElement } from \"./useEditModeStateMachine\";\nimport { getRepetitionSiblingElements } from \"./useSiblingResolution\";\n\nconst DOUBLE_CLICK_THRESHOLD_MS = 500;\n\n// React fibers carry only Turbopack chunk paths; resolving them to the\n// user's source file is async and only meaningful for \"react-element\"\n// kinds. Plan selectables already point at the right thing.\nasync function maybeSymbolicate(data: SelectableData): Promise<SelectableData> {\n  return data.kind === \"react-element\"\n    ? symbolicateSelectedElement(data)\n    : data;\n}\n\n/**\n * Owns the iframe-side pointer interactions that drive selection:\n *\n *  - On `pointerdown` we open a `drag` session (storing both client + page\n *    coords plus the current scroll offset). We don't yet know if this will\n *    become a click or an actual drag.\n *  - On `pointermove` we update the drag rect and post `DRAG_RECT_UPDATED`\n *    to the parent so the live drag rectangle can render. We only flip\n *    `hasExceededThreshold` once the rect grows past 6\u00D76 px so that a tiny\n *    accidental drag still resolves as a click.\n *  - On `pointerup` we either:\n *      - resolve as an `ELEMENT_SELECTED` (single click / sub-threshold drag)\n *      - resolve as an `AREA_SELECTED` (drag past threshold), filtering the\n *        candidates snapshotted at drag start against the final rectangle to\n *        enumerate which descendants the user enclosed.\n *  - During an active drag a `requestAnimationFrame` loop keeps the rect in\n *    sync with the page scroll so the rectangle visually \"sticks\" to the\n *    page rather than the viewport.\n *\n * We capture-listen and `preventDefault`/`stopPropagation` clicks so the\n * underlying page can't navigate or trigger handlers while the user is\n * working in selection mode.\n *\n * @author Kevin O'Connell 2026-04-17\n */\nexport function useSelectionInteractions({\n  displayMode,\n  editingElementRef,\n  interactionSessionRef,\n  onBeginEditing,\n}: {\n  displayMode: DisplayMode;\n  editingElementRef?: MutableRefObject<HTMLElement | null>;\n  interactionSessionRef: MutableRefObject<SelectModeInteractionSession>;\n  onBeginEditing: (args: {\n    element: Element;\n    descriptorPromise: Promise<SelectableData>;\n  }) => void;\n}) {\n  // eslint-disable-next-line replo/no-use-effect -- Legacy effect - may or may not be necessary\n  useEffect(() => {\n    if (displayMode !== \"selection\") {\n      return;\n    }\n\n    let dragAnimationFrameId: number | null = null;\n    const editingPointerIds = new Set<number>();\n    let lastClick: {\n      descriptorPromise: Promise<SelectableData>;\n      target: Element;\n      time: number;\n    } | null = null;\n    // Snapshot of the page's meaningful elements + their page rects, taken\n    // once when a drag begins so per-move hit-testing avoids a full-DOM scan.\n    let dragCandidates: DragCandidate[] = [];\n\n    const stopDragAnimation = () => {\n      if (dragAnimationFrameId === null) {\n        return;\n      }\n\n      cancelAnimationFrame(dragAnimationFrameId);\n      dragAnimationFrameId = null;\n    };\n\n    // `notifyParentDragCleared` posts a null drag rect so the parent tears\n    // down the live drag overlay. The area-commit path suppresses it: the\n    // parent maps a null drag rect to `selection = none`, which round-trips\n    // back as `setSelectionType(\"none\")` and wipes the in-iframe frames we're\n    // about to paint. The follow-up `areaSelected` supersedes the drag overlay\n    // on its own, so the null post is pure collateral damage there.\n    const resetDragState = ({\n      notifyParentDragCleared = true,\n    }: { notifyParentDragCleared?: boolean } = {}) => {\n      const currentSession = interactionSessionRef.current;\n\n      stopDragAnimation();\n\n      if (currentSession.type !== \"drag\") {\n        dragCandidates = [];\n        return;\n      }\n\n      if (notifyParentDragCleared && currentSession.hasExceededThreshold) {\n        getWebsiteBuilderRpc()?.dragRectUpdated({\n          dragRect: null,\n          selectionRects: [],\n        });\n      }\n\n      dragCandidates = [];\n      interactionSessionRef.current = IDLE_SESSION;\n    };\n\n    const postCurrentDragRect = () => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\") {\n        return;\n      }\n\n      const rect = getViewportSelectionRect({\n        dragStart: session.dragStart,\n        dragCurrent: session.dragCurrent,\n        scrollOffset: session.scrollOffset,\n      });\n\n      if (\n        rect.width <= 6 &&\n        rect.height <= 6 &&\n        !session.hasExceededThreshold\n      ) {\n        return;\n      }\n\n      if (!session.hasExceededThreshold) {\n        interactionSessionRef.current = {\n          ...session,\n          hasExceededThreshold: true,\n        };\n      }\n\n      // Cheap hit-test against the candidates we snapshotted at drag start,\n      // projected back to viewport coords so the parent can paint a live\n      // highlight on each element the drag will capture. No DOM scan here.\n      const selectionPageRect = getPageRectFromViewportRect({\n        rect,\n        scrollOffset: session.scrollOffset,\n      });\n      const selectionRects = getCandidatesInSelection({\n        candidates: dragCandidates,\n        selectionPageRect,\n      }).map((candidate) => ({\n        id: candidate.id,\n        rect: getViewportRectFromPageRect({\n          rect: candidate.pageRect,\n          scrollOffset: session.scrollOffset,\n        }),\n      }));\n\n      getWebsiteBuilderRpc()?.dragRectUpdated({\n        dragRect: rect,\n        selectionRects,\n      });\n    };\n\n    const syncDragRectToViewport = () => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\") {\n        dragAnimationFrameId = null;\n        return;\n      }\n\n      const nextScrollOffset = getDocumentScrollOffset();\n      const nextDragCurrent = getDragPositionFromClient({\n        clientX: session.dragCurrent.clientX,\n        clientY: session.dragCurrent.clientY,\n        scrollOffset: nextScrollOffset,\n      });\n\n      if (\n        nextDragCurrent.pageX !== session.dragCurrent.pageX ||\n        nextDragCurrent.pageY !== session.dragCurrent.pageY\n      ) {\n        interactionSessionRef.current = {\n          ...session,\n          dragCurrent: nextDragCurrent,\n          scrollOffset: nextScrollOffset,\n        };\n        postCurrentDragRect();\n      } else {\n        interactionSessionRef.current = {\n          ...session,\n          scrollOffset: nextScrollOffset,\n        };\n      }\n\n      dragAnimationFrameId = requestAnimationFrame(syncDragRectToViewport);\n    };\n\n    const handlePointerDown = (event: PointerEvent) => {\n      editingPointerIds.delete(event.pointerId);\n      if (\n        editingElementRef?.current &&\n        event.target instanceof Node &&\n        editingElementRef.current.contains(event.target)\n      ) {\n        editingPointerIds.add(event.pointerId);\n        return;\n      }\n      event.preventDefault();\n      event.stopPropagation();\n\n      const scrollOffset = getDocumentScrollOffset();\n      const dragStart = getDragPositionFromClient({\n        clientX: event.clientX,\n        clientY: event.clientY,\n        scrollOffset,\n      });\n      interactionSessionRef.current = {\n        type: \"drag\",\n        dragStart,\n        dragCurrent: dragStart,\n        scrollOffset,\n        hasExceededThreshold: false,\n      };\n      dragCandidates = collectDragCandidates(scrollOffset);\n\n      if (dragAnimationFrameId === null) {\n        dragAnimationFrameId = requestAnimationFrame(syncDragRectToViewport);\n      }\n    };\n\n    const handlePointerMove = (event: PointerEvent) => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\") {\n        return;\n      }\n\n      interactionSessionRef.current = {\n        ...session,\n        dragCurrent: getDragPositionFromClient({\n          clientX: event.clientX,\n          clientY: event.clientY,\n          scrollOffset: getDocumentScrollOffset(),\n        }),\n      };\n      postCurrentDragRect();\n    };\n\n    const handleViewportChangeDuringDrag = () => {\n      const session = interactionSessionRef.current;\n      if (session.type !== \"drag\" || dragAnimationFrameId !== null) {\n        return;\n      }\n\n      dragAnimationFrameId = requestAnimationFrame(syncDragRectToViewport);\n    };\n\n    const commitElementSelection = ({\n      targetElement,\n      pointerEvent,\n    }: {\n      targetElement: Element;\n      pointerEvent: PointerEvent;\n    }) => {\n      const selectionElement = getNearestSelectableElement(targetElement);\n      const targetRect = selectionElement.getBoundingClientRect();\n      const clickPosition: SelectModeClickPosition = {\n        x: pointerEvent.clientX,\n        y: pointerEvent.clientY,\n      };\n\n      // Paint the in-iframe selection frames synchronously for instant\n      // feedback \u2014 symbolicate is a network roundtrip and we don't want\n      // the visual selection to wait on it.\n      const scrollOffset = getDocumentScrollOffset();\n      const siblingElements =\n        selectionElement instanceof HTMLElement\n          ? getRepetitionSiblingElements({ element: selectionElement })\n          : [];\n      showElementSelectionFrames({\n        elements: [selectionElement, ...siblingElements],\n        scrollOffset,\n      });\n\n      const now = pointerEvent.timeStamp;\n      const previousClick = lastClick;\n      if (\n        previousClick &&\n        previousClick.target === selectionElement &&\n        now - previousClick.time <= DOUBLE_CLICK_THRESHOLD_MS &&\n        isTextEditableElement(selectionElement)\n      ) {\n        lastClick = null;\n        onBeginEditing({\n          element: selectionElement,\n          descriptorPromise: previousClick.descriptorPromise,\n        });\n        return;\n      }\n\n      // NOTE (Noah, 2026-07-24): Commit the selection immediately rather than\n      // deferring it behind the double-click window. A single click always\n      // selects, and a double-click is just \"select + edit\", so there's nothing\n      // to suppress \u2014 waiting only added a full DOUBLE_CLICK_THRESHOLD_MS of\n      // latency to every click and left `interactionSessionRef` non-element in\n      // the gap. Double-click is still detected via the `lastClick` timestamp\n      // above; the follow-up click reuses this descriptor to open the editor.\n      const data = buildElementDescriptor({\n        element: selectionElement,\n        clickPosition,\n        siblingSelectors: siblingElements.map(buildSelector),\n      });\n      lastClick = {\n        descriptorPromise: Promise.resolve(data),\n        target: selectionElement,\n        time: now,\n      };\n\n      if (!selectionElement.isConnected) {\n        return;\n      }\n      interactionSessionRef.current = {\n        type: \"element\",\n        element: selectionElement,\n        siblingElements,\n        clickPosition: {\n          x: pointerEvent.clientX - targetRect.left,\n          y: pointerEvent.clientY - targetRect.top,\n        },\n        data,\n      };\n      void maybeSymbolicate(data).then((symbolicated) => {\n        if (\n          !isSelectionStillCurrent({\n            session: interactionSessionRef.current,\n            selection: { type: \"element\", element: selectionElement },\n          })\n        ) {\n          return;\n        }\n        getWebsiteBuilderRpc()?.elementSelected({ data: symbolicated });\n      });\n    };\n\n    const handlePointerUp = (event: PointerEvent) => {\n      if (editingPointerIds.delete(event.pointerId)) {\n        return;\n      }\n      // Clicks inside the element being edited belong to the inline editor, not\n      // select mode. Without this guard the double-click detection below re-runs\n      // `onBeginEditing` on the same element (e.g. when repositioning the\n      // caret), rebuilding the editor over itself and wiping the content.\n      // Mirrors the guards in `handlePointerDown` and `handleClick`.\n      if (\n        editingElementRef?.current &&\n        event.target instanceof Node &&\n        editingElementRef.current.contains(event.target)\n      ) {\n        return;\n      }\n      const snapshot = interactionSessionRef.current;\n      const wasDragging =\n        snapshot.type === \"drag\" ? snapshot.hasExceededThreshold : false;\n      const dragStart = snapshot.type === \"drag\" ? snapshot.dragStart : null;\n      const dragCurrent =\n        snapshot.type === \"drag\" ? snapshot.dragCurrent : null;\n      const scrollOffset =\n        snapshot.type === \"drag\"\n          ? snapshot.scrollOffset\n          : getDocumentScrollOffset();\n      // `resetDragState` clears `dragCandidates`, so grab them first \u2014 the\n      // final committed set is the same cached candidates the live preview\n      // used, so preview and result never disagree.\n      const candidates = dragCandidates;\n\n      // Suppress the null drag-rect post: if this resolves to an area\n      // selection it would otherwise flash the parent to `selection = none`\n      // and wipe the frames we paint below. Click/empty-drag paths don't\n      // depend on it (a sub-threshold drag never posted a rect to clear).\n      resetDragState({ notifyParentDragCleared: false });\n\n      if (!dragStart || snapshot.type !== \"drag\") {\n        const targetElement = event.target;\n        if (!(targetElement instanceof Element)) {\n          return;\n        }\n\n        commitElementSelection({\n          targetElement,\n          pointerEvent: event,\n        });\n        return;\n      }\n\n      const resolvedDragCurrent = dragCurrent ?? dragStart;\n      const selectionRect = getViewportSelectionRect({\n        dragStart,\n        dragCurrent: resolvedDragCurrent,\n        scrollOffset,\n      });\n\n      if (!wasDragging) {\n        const targetElement = event.target;\n        if (!(targetElement instanceof Element)) {\n          return;\n        }\n\n        commitElementSelection({\n          targetElement,\n          pointerEvent: event,\n        });\n        return;\n      }\n\n      const pageRect = getPageRectFromViewportRect({\n        rect: selectionRect,\n        scrollOffset,\n      });\n\n      const selectedCandidates = getCandidatesInSelection({\n        candidates,\n        selectionPageRect: pageRect,\n      });\n      const items = selectedCandidates.map((candidate) => {\n        return buildElementDescriptor({\n          element: candidate.element,\n          clickPosition: getElementAnchor({\n            element: candidate.element,\n            selectionRect,\n          }),\n        });\n      });\n\n      interactionSessionRef.current = {\n        type: \"area\",\n        pageRect,\n        items,\n      };\n\n      // Highlight each captured element so the committed area selection\n      // \"sticks\" inside the iframe \u2014 matching how a single click stays\n      // outlined \u2014 rather than drawing one faint box over the drag region.\n      showSelectionFrames({\n        frames: selectedCandidates.map((candidate) => ({\n          variant: \"area\" as const,\n          pageRect: {\n            x: candidate.pageRect.x,\n            y: candidate.pageRect.y,\n            width: candidate.pageRect.width,\n            height: candidate.pageRect.height,\n          },\n        })),\n      });\n\n      void Promise.all(items.map(maybeSymbolicate)).then(\n        (symbolicatedItems) => {\n          if (\n            !isSelectionStillCurrent({\n              session: interactionSessionRef.current,\n              selection: { type: \"area\", pageRect },\n            })\n          ) {\n            return;\n          }\n          getWebsiteBuilderRpc()?.areaSelected({\n            rect: selectionRect,\n            items: symbolicatedItems,\n          });\n        },\n      );\n    };\n\n    const handleClick = (event: MouseEvent) => {\n      if (\n        editingElementRef?.current &&\n        event.target instanceof Node &&\n        editingElementRef.current.contains(event.target)\n      ) {\n        return;\n      }\n      event.preventDefault();\n      event.stopPropagation();\n    };\n\n    const handlePointerCancel = (event: PointerEvent) => {\n      editingPointerIds.delete(event.pointerId);\n      resetDragState();\n    };\n\n    const handleWindowBlur = () => {\n      editingPointerIds.clear();\n      resetDragState();\n    };\n\n    document.addEventListener(\"pointerdown\", handlePointerDown, true);\n    document.addEventListener(\"pointermove\", handlePointerMove, true);\n    document.addEventListener(\"pointerup\", handlePointerUp, true);\n    document.addEventListener(\"pointercancel\", handlePointerCancel, true);\n    document.addEventListener(\"click\", handleClick, true);\n    document.addEventListener(\"scroll\", handleViewportChangeDuringDrag, true);\n    window.addEventListener(\"blur\", handleWindowBlur);\n    window.addEventListener(\"resize\", handleViewportChangeDuringDrag);\n\n    return () => {\n      document.removeEventListener(\"pointerdown\", handlePointerDown, true);\n      document.removeEventListener(\"pointermove\", handlePointerMove, true);\n      document.removeEventListener(\"pointerup\", handlePointerUp, true);\n      document.removeEventListener(\"pointercancel\", handlePointerCancel, true);\n      document.removeEventListener(\"click\", handleClick, true);\n      document.removeEventListener(\n        \"scroll\",\n        handleViewportChangeDuringDrag,\n        true,\n      );\n      window.removeEventListener(\"blur\", handleWindowBlur);\n      window.removeEventListener(\"resize\", handleViewportChangeDuringDrag);\n      resetDragState();\n    };\n  }, [displayMode, editingElementRef, interactionSessionRef, onBeginEditing]);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/select-mode/selectionPublish.d.ts

@@ -0,0 +1,14 @@
+import type { SelectModeBoundingRect } from "../_vendor/schemas/generated/selectMode";
+import type { SelectModeInteractionSession } from "./selectModeSession";
+type SelectionPublishTarget = {
+    type: "element";
+    element: Element;
+} | {
+    type: "area";
+    pageRect: SelectModeBoundingRect;
+};
+export declare function isSelectionStillCurrent({ session, selection, }: {
+    session: SelectModeInteractionSession;
+    selection: SelectionPublishTarget;
+}): boolean;
+export {};

package/select-mode/selectionPublish.js

@@ -0,0 +1,21 @@
+import { exhaustiveSwitch } from "../_vendor/replo-utils/lib/misc.mjs";
+function isSelectionStillCurrent({
+  session,
+  selection
+}) {
+  return exhaustiveSwitch(selection)({
+    element: ({ element }) => {
+      return session.type === "element" && session.element === element;
+    },
+    area: ({ pageRect }) => {
+      return session.type === "area" && isSamePageRect(session.pageRect, pageRect);
+    }
+  });
+}
+function isSamePageRect(left, right) {
+  return left.x === right.x && left.y === right.y && left.width === right.width && left.height === right.height;
+}
+export {
+  isSelectionStillCurrent
+};
+//# sourceMappingURL=selectionPublish.js.map

package/select-mode/selectionPublish.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../select-mode/selectionPublish.ts"],
+  "sourcesContent": ["import type { SelectModeBoundingRect } from \"schemas/generated/selectMode\";\nimport type { SelectModeInteractionSession } from \"./selectModeSession\";\n\nimport { exhaustiveSwitch } from \"replo-utils/lib/misc\";\n\n// Selection publishes wait on a network symbolicate, so a slower earlier\n// request can resolve after the user has moved on. Publish only if the\n// session still names the same selection the request was for. Switching\n// away and back to the original selection should accept that original\n// request \u2014 the selected thing matching is what matters, not request order.\ntype SelectionPublishTarget =\n  | { type: \"element\"; element: Element }\n  | { type: \"area\"; pageRect: SelectModeBoundingRect };\n\nexport function isSelectionStillCurrent({\n  session,\n  selection,\n}: {\n  session: SelectModeInteractionSession;\n  selection: SelectionPublishTarget;\n}): boolean {\n  return exhaustiveSwitch(selection)({\n    element: ({ element }) => {\n      return session.type === \"element\" && session.element === element;\n    },\n    area: ({ pageRect }) => {\n      return (\n        session.type === \"area\" && isSamePageRect(session.pageRect, pageRect)\n      );\n    },\n  });\n}\n\nfunction isSamePageRect(\n  left: SelectModeBoundingRect,\n  right: SelectModeBoundingRect,\n): boolean {\n  return (\n    left.x === right.x &&\n    left.y === right.y &&\n    left.width === right.width &&\n    left.height === right.height\n  );\n}\n"],
+  "mappings": "AAGA,SAAS,wBAAwB;AAW1B,SAAS,wBAAwB;AAAA,EACtC;AAAA,EACA;AACF,GAGY;AACV,SAAO,iBAAiB,SAAS,EAAE;AAAA,IACjC,SAAS,CAAC,EAAE,QAAQ,MAAM;AACxB,aAAO,QAAQ,SAAS,aAAa,QAAQ,YAAY;AAAA,IAC3D;AAAA,IACA,MAAM,CAAC,EAAE,SAAS,MAAM;AACtB,aACE,QAAQ,SAAS,UAAU,eAAe,QAAQ,UAAU,QAAQ;AAAA,IAExE;AAAA,EACF,CAAC;AACH;AAEA,SAAS,eACP,MACA,OACS;AACT,SACE,KAAK,MAAM,MAAM,KACjB,KAAK,MAAM,MAAM,KACjB,KAAK,UAAU,MAAM,SACrB,KAAK,WAAW,MAAM;AAE1B;",
+  "names": []
+}