@parhelia/core 0.3.12788 → 0.3.12798

package/dist/editor/page-viewer/PageViewerFrame.js

@@ -22,7 +22,7 @@ import { loadFieldButtons } from "../services/editService";
 import { usePathname } from "../client/navigation";
 import { EditorWarnings } from "../EditorWarnings";
 import { FieldActionsOverlay, } from "../FieldActionsOverlay";
-import { alignLoopbackHostToEditor, alignXmCloudManagedEditingHostToEditor, applyParheliaRenderContext, getEditorQueryParam, } from "./renderUrl";
+import { alignLoopbackHostToEditor, alignXmCloudManagedEditingHostToEditor, applyParheliaRenderContext, crossesPreviewRenderBoundary, getEditorQueryParam, } from "./renderUrl";
 import { NoLayout } from "../page-editor-chrome/NoLayout";
 import { Spinner } from "../ui/Spinner";
 import { DeviceToolbar } from "./DeviceToolbar";
@@ -33,11 +33,15 @@ import { pickVersionAtDate } from "../utils/versionAtDate";
 import { BridgeClient } from "../bridge/BridgeClient";
 import { beginPerfTrace, isPerfTraceActive, isPerfTraceEnabled, perfTraceStep, } from "../perfTrace";
 import { getPendingFieldSuggestions, getSuggestionSelectionKey, getSuggestionDisplayValue, } from "../reviews/suggestionDisplayValue";
+import { bridgeItemDescriptorMatchesItem, bridgeStructureTargetsChangedItem, } from "./bridgeItemChangeTarget";
 import { buildBridgeFieldPatchPayload, buildBridgeFieldPatchSignature, buildRemoteCaretFieldPatches, getBridgeFieldPatchValue, hasRemoteCaretDraftForField, isBridgePatchableTextField, isSuggestionPreviewPatchSignature, } from "./bridgeFieldPatch";
 import { bridgeSelectionMatchesInteraction, resolveBridgeTextCompletionInput, } from "./bridgeTextCompletion";
+import { resolveBridgeInlineAiSelectionRange } from "./bridgeInlineAiSelection";
+import { BRIDGE_AUTHORITATIVE_REFRESH_EVENT, BRIDGE_INLINE_EDIT_COMMIT_EVENT, } from "./bridgeInlineEditCommit";
 import { logFieldValueDiagnostic, summarizeFieldDescriptor, summarizeFieldValue, } from "../fieldValueDiagnostics";
 import { createKeyboardEventFromBridgeInteraction, getBridgeFieldHistoryStepDirection, INLINE_FIELD_HISTORY_STEP_EVENT, } from "./bridgeKeyboardShortcuts";
 import { formatParentBridgeInjectionDiagnostic, injectParheliaBridgeFromParent, } from "./parentBridgeInjection";
+import { projectParentPointerToHost, resolveParentBridgePointerRelease, } from "./bridgePointerDragRelease";
 import { getTextCompletion, normalizeTextCompletion, } from "../services/textCompletionService";
 import { resolvePageAndSiteByPath } from "../services/contentService";
 import { extractInternalLinkPath, extractInternalLinkTargetItemId, shouldOpenInternalLinkInNewSlot, } from "./internalLinkNavigation";
@@ -482,25 +486,6 @@ function bridgeComponentSelectionsMatch(left, right) {
         return false;
     return (left ?? []).every((leftId, index) => bridgeIdsMatch(leftId, right?.[index]));
 }
-function bridgeDescriptorMatchesItem(bridgeItem, item) {
-    if (!bridgeItem?.id)
-        return true;
-    if (!bridgeIdsMatch(bridgeItem.id, item.id))
-        return false;
-    if (bridgeItem.language &&
-        item.language &&
-        bridgeItem.language.toLowerCase() !== item.language.toLowerCase()) {
-        return false;
-    }
-    if (typeof bridgeItem.version === "number" &&
-        Number.isFinite(bridgeItem.version) &&
-        typeof item.version === "number" &&
-        Number.isFinite(item.version) &&
-        bridgeItem.version !== item.version) {
-        return false;
-    }
-    return true;
-}
 function fieldIdentifierMatches(field, fieldId) {
     return (bridgeIdsMatch(field.id, fieldId) ||
         bridgeIdsMatch(field.name, fieldId) ||
@@ -516,7 +501,7 @@ function findModifiedBridgeField({ modifiedFields, structureField, field, itemDe
     return modifiedFields?.find((candidate) => {
         if (dirtyOnly && !candidate.isDirty)
             return false;
-        if (!bridgeDescriptorMatchesItem(candidate.item, itemDescriptor)) {
+        if (!bridgeItemDescriptorMatchesItem(candidate.item, itemDescriptor)) {
             return false;
         }
         return (bridgeIdsMatch(candidate.fieldId, structureField.fieldId) ||
@@ -619,6 +604,7 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
     const iframeRef = useRef(null);
     const [iframeElement, setIframeElement] = useState(null);
     const bridgeClientRef = useRef(null);
+    const activeBridgePointerDragRef = useRef(null);
     const parentBridgeInjectionRef = useRef(null);
     const latestParentBridgeInjectionRef = useRef(null);
     useEffect(() => {
@@ -631,6 +617,15 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
     const bridgeTextRangeSourcesRef = useRef(new Map());
     const activeBridgeInlineEditRef = useRef(null);
     const discardActiveFieldDraftOnNextRefreshRef = useRef(false);
+    useEffect(() => {
+        const markAuthoritativeRefresh = () => {
+            discardActiveFieldDraftOnNextRefreshRef.current = true;
+        };
+        window.addEventListener(BRIDGE_AUTHORITATIVE_REFRESH_EVENT, markAuthoritativeRefresh);
+        return () => {
+            window.removeEventListener(BRIDGE_AUTHORITATIVE_REFRESH_EVENT, markAuthoritativeRefresh);
+        };
+    }, []);
     const [isBridgeInlineEditing, setIsBridgeInlineEditing] = useState(false);
     const bridgeInlineEditSessionRef = useRef(null);
     if (!bridgeInlineEditSessionRef.current) {
@@ -641,6 +636,7 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
             });
     }
     const bridgeInlineEditSession = bridgeInlineEditSessionRef.current;
+    const bridgeInlineEditCommitRef = useRef(null);
     const clearActiveBridgeInlineEdit = useCallback(() => {
         bridgeInlineEditSession.clear();
     }, [bridgeInlineEditSession]);
@@ -934,7 +930,7 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
             bridgeTextCompletionAbortRef.current?.abort();
         };
     }, []);
-    const { beginInlineEdit: beginBridgeInlineEdit, clearInlineDedupe: clearBridgeInlineDedupe, endFieldFocus: endBridgeFieldFocus, handleFieldValueChanged: handleBridgeFieldValueChanged, handleInlineEditEnded: handleBridgeInlineEditEnded, } = useBridgeInlineEditing({
+    const { beginInlineEdit: beginBridgeInlineEdit, clearInlineDedupe: clearBridgeInlineDedupe, endFieldFocus: endBridgeFieldFocus, flushPendingFieldValueChanges: flushPendingBridgeFieldValueChanges, handleFieldValueChanged: handleBridgeFieldValueChanged, handleInlineEditEnded: handleBridgeInlineEditEnded, supersedeInlineEdit: supersedeBridgeInlineEdit, } = useBridgeInlineEditing({
         pageViewContextRef,
         inlineEditSession: bridgeInlineEditSession,
         blockIframeBlurUntil,
@@ -958,7 +954,11 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                 database: interaction.item.database,
             }
             : undefined;
-        const started = await bridgeInlineEditSession.beginSession({
+        // A repeated click on an already-active host field must still revalidate
+        // the server lock. The inline editor can remain mounted after another UI
+        // transition released that lock, so UI-session identity alone is not proof
+        // of ownership. Pending begins remain deduplicated by the coordinator.
+        const started = await bridgeInlineEditSession.revalidateSession({
             elementKey: interaction.elementKey,
             fieldId: interaction.fieldId,
             item: interactionItem,
@@ -975,6 +975,50 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
         clearActiveBridgeInlineEdit();
         endBridgeFieldFocus();
     }, [clearActiveBridgeInlineEdit, endBridgeFieldFocus]);
+    const commitActiveBridgeInlineEdit = useCallback(() => {
+        if (bridgeInlineEditCommitRef.current) {
+            return bridgeInlineEditCommitRef.current;
+        }
+        const activeEdit = activeBridgeInlineEditRef.current;
+        if (!activeEdit) {
+            return flushPendingBridgeFieldValueChanges().then(() => undefined);
+        }
+        const bridge = bridgeClientRef.current;
+        if (!bridge) {
+            return Promise.reject(new Error("Cannot commit the inline edit because the bridge is unavailable."));
+        }
+        const commit = bridge
+            .requestCommand("commitInlineEdit", {
+            elementKey: activeEdit.elementKey,
+            fieldId: activeEdit.fieldId,
+        }, "inlineEditEnded")
+            .then(async () => {
+            // The correlated acknowledgement is dispatched after fieldValueChanged.
+            // Drain its repository update, then flush the debounced backend save.
+            await flushPendingBridgeFieldValueChanges();
+            await editContextRef.current?.operations.onFieldBlur?.();
+        })
+            .finally(() => {
+            if (bridgeInlineEditCommitRef.current === commit) {
+                bridgeInlineEditCommitRef.current = null;
+            }
+        });
+        bridgeInlineEditCommitRef.current = commit;
+        return commit;
+    }, [editContextRef, flushPendingBridgeFieldValueChanges]);
+    useEffect(() => {
+        const handleCommitRequest = (event) => {
+            const detail = event
+                .detail;
+            if (!detail)
+                return;
+            detail.barriers.push(commitActiveBridgeInlineEdit());
+        };
+        window.addEventListener(BRIDGE_INLINE_EDIT_COMMIT_EVENT, handleCommitRequest);
+        return () => {
+            window.removeEventListener(BRIDGE_INLINE_EDIT_COMMIT_EVENT, handleCommitRequest);
+        };
+    }, [commitActiveBridgeInlineEdit]);
     const beginTrackedBridgeInlineEditAfterSelection = useCallback((interaction) => {
         window.setTimeout(() => {
             void beginTrackedBridgeInlineEdit(interaction);
@@ -997,22 +1041,36 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                 activeInlineEdit: activeEdit,
                 field: summarizeFieldDescriptor(field),
             });
-            clearActiveBridgeInlineEdit();
+            // The form is now authoritative for this field. Superseding closes the
+            // host-side contenteditable session and tombstones any already-posted
+            // draft events, so the form patch is neither rejected by the host nor
+            // raced back to the previous canvas value.
+            supersedeBridgeInlineEdit(activeEdit);
             bridgePatchSignatureRef.current.delete(`${activeEdit.elementKey}:${activeEdit.fieldId}`);
         };
         window.addEventListener(BRIDGE_INLINE_EDIT_RELEASE_EVENT, handleBridgeInlineEditRelease);
         return () => {
             window.removeEventListener(BRIDGE_INLINE_EDIT_RELEASE_EVENT, handleBridgeInlineEditRelease);
         };
-    }, [clearActiveBridgeInlineEdit]);
+    }, [supersedeBridgeInlineEdit]);
     useEffect(() => {
         return editContext.registerModeChangeParticipant({
-            beforeModeChange: (nextMode) => {
+            captureBeforeModeChange: () => commitActiveBridgeInlineEdit(),
+            beforeModeChange: async (nextMode) => {
                 if (nextMode === "suggestions" &&
                     getSelectedRangeInlineEditInteraction(editContextRef.current?.selectedRange)) {
+                    // Keep the live selection/focus so it can seed the suggestion edit,
+                    // but still cross the persistence boundary for text typed in edit
+                    // mode. Skipping this flush could make suggestions use an older
+                    // repository value as their baseline.
+                    await flushPendingBridgeFieldValueChanges();
+                    await editContext.operations.onFieldBlur?.();
+                    await editContext.operations.prepareForModeChange?.();
                     return;
                 }
-                editContext.operations.onFieldBlur?.();
+                await flushPendingBridgeFieldValueChanges();
+                await editContext.operations.onFieldBlur?.();
+                await editContext.operations.prepareForModeChange?.();
                 void fieldsContextRef.current?.setFocusedField(undefined, false);
                 clearActiveBridgeInlineEdit();
                 endBridgeFieldFocus();
@@ -1024,10 +1082,12 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
     }, [
         clearBridgeInlineDedupe,
         clearActiveBridgeInlineEdit,
+        commitActiveBridgeInlineEdit,
         editContext,
         editContextRef,
         endBridgeFieldFocus,
         fieldsContextRef,
+        flushPendingBridgeFieldValueChanges,
     ]);
     const getBridgePatchDisplayValue = useCallback(({ field, structureField, itemDescriptor, preferRepositoryValue, }) => {
         const showSuggestions = editContext.mode === "suggestions";
@@ -1069,19 +1129,23 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
         fieldsContext?.modifiedFields,
         pageViewContext.pageItemDescriptor,
     ]);
-    const buildBridgeFieldPatch = useCallback(({ field, structureField, itemDescriptor, preferRepositoryValue, }) => {
+    const buildBridgeFieldPatch = useCallback(({ field, structureField, itemDescriptor, preferRepositoryValue, replaceActiveInlineEdit, }) => {
         const display = getBridgePatchDisplayValue({
             field,
             structureField,
             itemDescriptor,
             preferRepositoryValue,
         });
-        const activeInlineEdit = activeBridgeInlineEditRef.current;
+        const effectiveDisplay = replaceActiveInlineEdit
+            ? { ...display, source: "reset" }
+            : display;
         const patch = buildBridgeFieldPatchPayload({
             field,
             structureField,
-            display,
-            activeInlineEdit,
+            display: effectiveDisplay,
+            activeInlineEdit: replaceActiveInlineEdit
+                ? undefined
+                : activeBridgeInlineEditRef.current,
         });
         return patch;
     }, [getBridgePatchDisplayValue]);
@@ -1165,6 +1229,11 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
             structureFields,
             activeInlineEdit: activeBridgeInlineEditRef.current,
         });
+        // Keep the host informed about the complete live-draft set. Unlike an
+        // ordinary field patch, this state survives host-app/React renders: the
+        // bridge reapplies these values in its mutation observer before other
+        // observers can see stale server markup.
+        bridge.sendCommand("syncRemoteFieldDrafts", { drafts: patches });
         for (const patch of patches) {
             const structureField = structureFields.find((field) => field.elementKey === patch.elementKey);
             sendBridgeFieldPatch(bridge, patch, structureField?.textContent);
@@ -1643,6 +1712,13 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                 }
                 const iframeRect = iframe.getBoundingClientRect();
                 const bridgeSelection = latestBridgeSelectionRef.current;
+                const commandRange = resolveBridgeInlineAiSelectionRange({
+                    interaction,
+                    bridgeSelection,
+                    iframeRect,
+                    fallbackItem: pageViewContextRef.current?.page?.item ??
+                        pageViewContextRef.current?.pageItemDescriptor,
+                });
                 const fallbackCaretRect = !interaction.selectionRect &&
                     !interaction.caretRect &&
                     bridgeSelection?.collapsed &&
@@ -1655,7 +1731,9 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                     interaction.caretRect ??
                     fallbackCaretRect;
                 const toolbarRect = await waitForVisibleBridgeToolbarRect();
-                const selectedRange = editContextRef.current?.selectedRange ?? editor?.selectedRange;
+                const selectedRange = commandRange ??
+                    editContextRef.current?.selectedRange ??
+                    editor?.selectedRange;
                 const toolbarAnchor = getInlineAiAnchorFromBridgeToolbar(selectedRange, toolbarRect ?? getVisibleBridgeToolbarRect());
                 const caretAnchor = toolbarAnchor
                     ? toolbarAnchor
@@ -1678,7 +1756,9 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                 document.dispatchEvent(new CustomEvent("inline-ai-open", {
                     bubbles: true,
                     cancelable: true,
-                    detail: caretAnchor ? { anchor: caretAnchor } : undefined,
+                    detail: caretAnchor || commandRange
+                        ? { anchor: caretAnchor, selectionRange: commandRange }
+                        : undefined,
                 }));
                 return;
             }
@@ -2045,6 +2125,62 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
     useEffect(() => {
         pageViewContext.setEditorIframe(iframeElement);
     }, [iframeElement, pageViewContext.setEditorIframe]);
+    // A host drag normally ends inside the iframe and is forwarded by the
+    // bridge. If Chromium loses pointer capture while the pointer crosses into
+    // parent-rendered editor chrome, however, the release belongs to this
+    // document and the iframe never receives pointerup. Finish that same drag
+    // here so it cannot leave the editor stuck in insertion mode.
+    useEffect(() => {
+        const iframe = iframeElement;
+        if (!iframe)
+            return;
+        const forwardParentPointerMove = (event) => {
+            const active = activeBridgePointerDragRef.current;
+            if (!active || event.pointerId !== active.pointerId)
+                return;
+            const projected = projectParentPointerToHost(event.clientX, event.clientY, iframe.getBoundingClientRect(), pageViewContextRef.current?.bridgeGeometry?.viewport);
+            if (!projected.inside)
+                return;
+            active.clientX = projected.clientX;
+            active.clientY = projected.clientY;
+            iframe.dispatchEvent(new CustomEvent(IFRAME_OVERLAY_BRIDGE_DRAG_GESTURE_EVENT, {
+                detail: {
+                    phase: "move",
+                    pointerId: active.pointerId,
+                    clientX: projected.clientX,
+                    clientY: projected.clientY,
+                },
+            }));
+        };
+        const finishBridgePointerDrag = (event) => {
+            const active = activeBridgePointerDragRef.current;
+            if (!active)
+                return;
+            const rect = iframe.getBoundingClientRect();
+            const payload = resolveParentBridgePointerRelease(active, event, rect, pageViewContextRef.current?.bridgeGeometry?.viewport);
+            if (!payload)
+                return;
+            // Clear before dispatching and before asking the host to clean up. Any
+            // delayed move/end messages from the bridge then become harmless echoes.
+            activeBridgePointerDragRef.current = null;
+            iframe.dispatchEvent(new CustomEvent(IFRAME_OVERLAY_BRIDGE_DRAG_GESTURE_EVENT, {
+                detail: {
+                    phase: "end",
+                    ...payload,
+                },
+            }));
+            bridgeClientRef.current?.sendCommand("cancelPointerDrag", {});
+        };
+        window.addEventListener("pointermove", forwardParentPointerMove, true);
+        window.addEventListener("pointerup", finishBridgePointerDrag, true);
+        window.addEventListener("mouseup", finishBridgePointerDrag, true);
+        return () => {
+            window.removeEventListener("pointermove", forwardParentPointerMove, true);
+            window.removeEventListener("pointerup", finishBridgePointerDrag, true);
+            window.removeEventListener("mouseup", finishBridgePointerDrag, true);
+            activeBridgePointerDragRef.current = null;
+        };
+    }, [iframeElement]);
     // Same-origin fast path for overlay scroll tracking. The bridge's
     // scrollChanged postMessage is delivered as a task after the host's
     // rendering update, so overlays driven by it paint at least one frame
@@ -2173,8 +2309,15 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                         // Ready confirms the bridge transport, not that its initial
                         // mutation-driven geometry snapshot reached the editor. Query the
                         // current DOM explicitly so editing chrome never depends on that
-                        // first unsolicited event surviving startup contention.
-                        bridge.sendCommand("queryGeometry", {});
+                        // first unsolicited event surviving startup contention. A newly
+                        // connected iframe has no memory of the text-range union registered
+                        // by comments, suggestions, locks, and version diffs, so replay it
+                        // here. Sending a bare query can otherwise clear those ranges while
+                        // the contributing overlay still has the same request signature and
+                        // therefore has no reason to emit it again.
+                        bridge.sendCommand("queryGeometry", {
+                            textRanges: Array.from(bridgeTextRangeSourcesRef.current.values()).flat(),
+                        });
                         if (pendingRefreshScrollRef.current) {
                             restorePendingRefreshScroll(iframe, pendingRefreshScrollRef.current);
                         }
@@ -2205,6 +2348,29 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                     case "pageSkeletonUpdated":
                         pageViewContext.setPageSkeleton(event.payload.pageSkeleton);
                         break;
+                    case "resizeChanged": {
+                        const currentGeometry = pageViewContext.bridgeGeometry;
+                        const viewportChanged = !currentGeometry ||
+                            currentGeometry.viewport.width !== event.payload.viewport.width ||
+                            currentGeometry.viewport.height !== event.payload.viewport.height ||
+                            currentGeometry.devicePixelRatio !==
+                                event.payload.devicePixelRatio;
+                        if (!viewportChanged)
+                            break;
+                        // Target rects are viewport-relative. Once the host reports a new
+                        // viewport, retaining the previous snapshot can visibly displace
+                        // chrome until the host's debounced geometry update arrives (for
+                        // example, when the minimap narrows the canvas). Remove that stale
+                        // snapshot immediately and request its replacement now, preserving
+                        // every overlay's registered text-range query.
+                        pageViewContext.bridgeGeometry = undefined;
+                        pageViewContext.setBridgeGeometry(undefined);
+                        scheduleBridgeGeometryRevision();
+                        bridge.sendCommand("queryGeometry", {
+                            textRanges: Array.from(bridgeTextRangeSourcesRef.current.values()).flat(),
+                        });
+                        break;
+                    }
                     case "geometryUpdated": {
                         if (isPerfTraceActive()) {
                             perfTraceStep("frame:geometry-updated-received", {
@@ -2373,21 +2539,39 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                         void handleBridgeInteraction(event.payload, iframe);
                         break;
                     case "dragGestureStarted":
+                        activeBridgePointerDragRef.current = {
+                            pointerId: event.payload.pointerId,
+                            clientX: event.payload.clientX,
+                            clientY: event.payload.clientY,
+                        };
                         iframe?.dispatchEvent(new CustomEvent(IFRAME_OVERLAY_BRIDGE_DRAG_GESTURE_EVENT, {
                             detail: { phase: "start", ...event.payload },
                         }));
                         break;
-                    case "dragGestureMoved":
+                    case "dragGestureMoved": {
+                        const active = activeBridgePointerDragRef.current;
+                        if (!active || active.pointerId !== event.payload.pointerId)
+                            break;
+                        active.clientX = event.payload.clientX;
+                        active.clientY = event.payload.clientY;
                         iframe?.dispatchEvent(new CustomEvent(IFRAME_OVERLAY_BRIDGE_DRAG_GESTURE_EVENT, {
                             detail: { phase: "move", ...event.payload },
                         }));
                         break;
-                    case "dragGestureEnded":
+                    }
+                    case "dragGestureEnded": {
+                        const active = activeBridgePointerDragRef.current;
+                        if (!active || active.pointerId !== event.payload.pointerId)
+                            break;
+                        activeBridgePointerDragRef.current = null;
                         iframe?.dispatchEvent(new CustomEvent(IFRAME_OVERLAY_BRIDGE_DRAG_GESTURE_EVENT, {
                             detail: { phase: "end", ...event.payload },
                         }));
                         break;
+                    }
                     case "dragSnapshot":
+                        if (!activeBridgePointerDragRef.current)
+                            break;
                         iframe?.dispatchEvent(new CustomEvent(IFRAME_OVERLAY_BRIDGE_DRAG_GESTURE_EVENT, {
                             detail: { phase: "snapshot", ...event.payload },
                         }));
@@ -2463,17 +2647,41 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                     return;
                 const patchedElementKeys = new Set();
                 const patches = [];
+                const pageItemDescriptor = pageViewContextRef.current?.pageItemDescriptor ??
+                    pageViewContextRef.current?.page?.item?.descriptor;
                 for (const structureField of structure.fields) {
                     if (!structureField.elementKey)
                         continue;
                     if (patchedElementKeys.has(structureField.elementKey))
                         continue;
-                    if (!bridgeDescriptorMatchesItem(structureField.item, change.item)) {
+                    const targetItem = structureField.item?.id
+                        ? structureField.item
+                        : pageItemDescriptor;
+                    if (!targetItem ||
+                        !bridgeItemDescriptorMatchesItem(targetItem, change.item)) {
                         continue;
                     }
                     if (!bridgeFieldMatchesChangedField(structureField.fieldId, changedFieldId, field)) {
                         continue;
                     }
+                    if (change.replaceActiveInlineEdit) {
+                        const identity = {
+                            elementKey: structureField.elementKey,
+                            fieldId: structureField.fieldId,
+                            item: structureField.item,
+                        };
+                        const inlineEdit = bridgeInlineEditSession.matches(identity)
+                            ? bridgeInlineEditSession.getState()
+                            : bridgeInlineEditSession.getRecentlyClearedState(identity);
+                        if (inlineEdit) {
+                            // End the canvas session before sending the reset patch. This
+                            // prevents a later host refresh from preserving the superseded
+                            // draft, and tombstones already-captured events from that
+                            // session so they cannot race the external edit back to Sitecore.
+                            supersedeBridgeInlineEdit(inlineEdit);
+                            bridgePatchSignatureRef.current.delete(`${structureField.elementKey}:${structureField.fieldId}`);
+                        }
+                    }
                     // A remote session is live-syncing this field: its draft is
                     // authoritative, and the saved-value echo behind this change is
                     // stale mid-typing — applying it would roll the canvas text back
@@ -2490,6 +2698,7 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                         structureField,
                         itemDescriptor: change.item,
                         preferRepositoryValue: change.source === "local-field-update",
+                        replaceActiveInlineEdit: change.replaceActiveInlineEdit,
                     });
                     if (!patch)
                         continue;
@@ -2506,6 +2715,11 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
             };
             const asyncFieldChanges = [];
             for (const change of fieldChanges) {
+                const pageItemDescriptor = pageViewContextRef.current?.pageItemDescriptor ??
+                    pageViewContextRef.current?.page?.item?.descriptor;
+                if (!bridgeStructureTargetsChangedItem(structure.fields, change.item, pageItemDescriptor)) {
+                    continue;
+                }
                 const localFieldsById = new Map((change.changes.fieldValues ?? []).map((field) => [
                     field.id.toLowerCase(),
                     field,
@@ -2558,8 +2772,10 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
         };
     }, [
         buildBridgeFieldPatch,
+        bridgeInlineEditSession,
         editContext.itemsRepository,
         sendBridgeFieldPatch,
+        supersedeBridgeInlineEdit,
     ]);
     useEffect(() => {
         const bridge = bridgeClientRef.current;
@@ -2896,15 +3112,17 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
         const fullReloadRequested = lastFullReloadTokenRef.current !== undefined &&
             lastFullReloadTokenRef.current !== editContext.fullReloadToken;
         lastFullReloadTokenRef.current = editContext.fullReloadToken;
-        const shouldUseIframeSrcReload = initialLoad ||
-            pageViewContext.fullscreen ||
-            iframeOriginChanged ||
-            fullReloadRequested;
         const signatureUrl = new URL(renderUrl.toString());
         signatureUrl.searchParams.delete("edit_rev");
         const renderSignature = `${signatureUrl.toString()}|rev:${editContext.revision}`;
-        const modeChanged = lastRenderModeRef.current !== editContext.mode;
+        const previousRenderMode = lastRenderModeRef.current;
+        const modeChanged = previousRenderMode !== editContext.mode;
+        const previewRenderBoundaryChanged = crossesPreviewRenderBoundary(previousRenderMode, editContext.mode);
         lastRenderModeRef.current = editContext.mode;
+        const shouldUseIframeSrcReload = initialLoad ||
+            iframeOriginChanged ||
+            fullReloadRequested ||
+            previewRenderBoundaryChanged;
         // Only skip when a live bridge confirms the last refresh actually reached
         // the host, or when the only meaningful trigger is an edit/suggestions
         // mode change. Mode is delivered by setEditorMode and cannot change the
@@ -3358,6 +3576,10 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                             }
                         }, children: [_jsx("iframe", { ref: bindIframeRef, className: "page-iframe h-full w-full bg-white transition-[height] duration-300 ease-in-out motion-reduce:transition-none", style: {
                                     height: deviceHeight,
+                                    // The iframe element exists before its document has loaded. Keep
+                                    // that blank document out of both the UI and accessibility tree;
+                                    // consumers can treat a visible canvas as a rendered canvas.
+                                    visibility: loadedIframeSrc ? "visible" : "hidden",
                                     cursor: showSuggestionsCursor
                                         ? SUGGESTIONS_CURSOR_VALUE
                                         : undefined,
@@ -3375,7 +3597,7 @@ function PageViewerFrameContent({ compareView, pageViewContext, editContext, cla
                                             parentBridgeInjectionRef.current.attempt;
                                     }
                                     const loadedSrc = iframe?.src;
-                                    if (loadedSrc) {
+                                    if (iframeSrc && loadedSrc) {
                                         setLoadedIframeSrc(loadedSrc);
                                     }
                                     const sendZoomToBridge = () => {