@parhelia/core 0.1.12881 → 0.1.12882

package/dist/editor/client/EditorShell.js

@@ -46,7 +46,6 @@ import { QuickItemSwitcher } from "../QuickItemSwitcher";
 import { useEditorSlotContext, } from "../views/editorSlotContext";
 import { getComments, getAvailableCommentTags, } from "../services/reviewsService";
 import { useReviews } from "../reviews/useReviews";
-import { COMMENT_TRANSIENT_ELEMENT_KEY, COMMENT_TRANSIENT_SELECTION_RECT, } from "../reviews/commentTransientSelection";
 import uuid from "react-uuid";
 import { flushSync } from "react-dom";
 import { getSuggestedEdits } from "../services/suggestedEditsService";
@@ -68,24 +67,6 @@ import { FeatureGate, LicenseFeatures, LicenseProvider, LicenseOverlay, } from "
 // nothing open" (param present with this value) so reload can honor the user's intent.
 const SIDEBAR_NONE_SENTINEL = "none";
 const sidebarUrlValue = (ids) => ids.length ? ids.join(",") : SIDEBAR_NONE_SENTINEL;
-// moved to hooks/useQuota
-function isUsableTextSelectionRange(range) {
-    return !!(range &&
-        range.text?.trim() &&
-        typeof range.startOffset === "number" &&
-        typeof range.endOffset === "number" &&
-        range.startOffset !== range.endOffset &&
-        range.fieldId &&
-        range.itemId);
-}
-function selectionRangeMatchesField(range, field) {
-    if (!range || !field)
-        return false;
-    return (cleanId(range.fieldId) === cleanId(field.fieldId) &&
-        cleanId(range.itemId) === cleanId(field.item.id) &&
-        (!range.language || range.language === field.item.language) &&
-        (typeof range.version !== "number" || range.version === field.item.version));
-}
 function reconcileSlotSettingsState(previous, slots, defaults) {
     const next = {};
     let changed = false;
@@ -153,10 +134,8 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     const [focusedField, setFocusedField] = useState();
     const focusedFieldRef = useRef(undefined);
     const [selectedRange, setSelectedRange] = useState();
-    const lastTextSelectionRangeRef = useRef(undefined);
     const [validating, setValidating] = useState(false);
     const [inserting, setInserting] = useState();
-    const insertingSequenceRef = useRef(0);
     const [showFullscreenHint, setShowFullscreenHint] = useState(false);
     // Fullscreen is a shell-level UI mode. Keep it in EditorShell state so the shell can rerender
     // immediately when toggled, while still syncing the active slot's PageViewContext.fullscreen.
@@ -486,6 +465,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     // The very first URL sync after initial load should replaceState (not pushState)
     // so the initial bare URL isn't left as a dead-end history entry.
     const isFirstUrlSyncRef = useRef(true);
+    const [inlineEditingFieldElement, setInlineEditingFieldElement] = useState();
     const [lockedField, setLockedField] = useState();
     const [itemLanguages, setItemLanguages] = useState([]);
     const [itemVersions, setItemVersions] = useState([]);
@@ -571,71 +551,14 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     // moved into useWorkbox
     // Initialize tour state from URL parameter to survive navigation/remounts
     // Memoize to avoid triggering Router state updates during render
-    const tourRestoredFromUrl = useMemo(() => searchParams.get("tour") === "active", [searchParams]);
+    const tourRestoredFromUrl = useMemo(() => Boolean(configuration.activeTour) &&
+        searchParams.get("tour") === "active", [configuration.activeTour, searchParams]);
     const [isTourActive, setIsTourActive] = useState(tourRestoredFromUrl);
     // Track if tour was restored from URL to skip prepareAction on initial render
     const tourRestoredRef = useRef(tourRestoredFromUrl);
-    const [mode, setModeState] = useState("edit");
-    const modeRef = useRef("edit");
-    modeRef.current = mode;
-    const modeChangeParticipantsRef = useRef(new Set());
-    const loadSuggestedEditsRef = useRef(async () => { });
-    const [modeTransitionRevision, setModeTransitionRevision] = useState(0);
+    const [mode, setMode] = useState("edit");
     const [previewDate, setPreviewDate] = useState();
     const [layoutMode, setLayoutMode] = useState("final");
-    const registerModeChangeParticipant = useCallback((participant) => {
-        modeChangeParticipantsRef.current.add(participant);
-        return () => {
-            modeChangeParticipantsRef.current.delete(participant);
-        };
-    }, []);
-    const changeMode = useCallback(async (nextMode, options) => {
-        const previousMode = modeRef.current;
-        if (nextMode === previousMode)
-            return;
-        const participants = Array.from(modeChangeParticipantsRef.current);
-        for (const participant of participants) {
-            await participant.beforeModeChange?.(nextMode, previousMode, options);
-        }
-        for (const participant of participants) {
-            participant.clearInlineDedupe?.(nextMode, previousMode, options);
-        }
-        flushSync(() => {
-            modeRef.current = nextMode;
-            setModeState(nextMode);
-            setModeTransitionRevision((revision) => revision + 1);
-            if (nextMode !== "preview") {
-                setPreviewDate(undefined);
-            }
-            if (nextMode === "suggestions") {
-                setShowSuggestedEdits(true);
-                setWorkspaceId("editor");
-                setOpenSidebars((prev) => {
-                    if (prev.includes("feedback"))
-                        return prev;
-                    const next = [...prev, "feedback"];
-                    openSidebarsRef.current = next;
-                    return next;
-                });
-            }
-            else {
-                setShowSuggestedEdits(false);
-            }
-        });
-        if (nextMode === "suggestions") {
-            void loadSuggestedEditsRef.current();
-        }
-    }, []);
-    const setMode = useCallback((nextMode) => {
-        const resolvedMode = typeof nextMode === "function" ? nextMode(modeRef.current) : nextMode;
-        void changeMode(resolvedMode);
-    }, [changeMode]);
-    const workspaceShowsModeControls = !!configuration.editor.workspaces?.find((workspace) => workspace.id === workspaceId)?.toolbarFactory;
-    useEffect(() => {
-        if (workspaceShowsModeControls || mode !== "suggestions")
-            return;
-        void changeMode("edit", { reason: "mode-controls-hidden" });
-    }, [changeMode, mode, workspaceId, workspaceShowsModeControls]);
     useEffect(() => {
         if (mode !== "preview") {
             setPreviewDate(undefined);
@@ -741,6 +664,19 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             setSelectedHelpSectionId(helpParam === "contents" || helpParam === "true" ? null : helpParam);
         }
     }, [searchParams, isInitialLoad]);
+    useEffect(() => {
+        if (mode === "suggestions") {
+            // Ensure we're in the editor workspace and open the feedback sidebar
+            setWorkspaceId("editor");
+            // Open the feedback sidebar if not already open
+            setOpenSidebars((prev) => {
+                if (!prev.includes("comments")) {
+                    return [...prev, "comments"];
+                }
+                return prev;
+            });
+        }
+    }, [mode]);
     useEffect(() => {
         if (focusedField &&
             selection.length > 0 &&
@@ -750,19 +686,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     }, [selection]);
     useEffect(() => {
         focusedFieldRef.current = focusedField;
-        const lastTextSelection = lastTextSelectionRangeRef.current;
-        if (focusedField &&
-            lastTextSelection &&
-            (focusedField.fieldId !== lastTextSelection.fieldId ||
-                focusedField.item.id !== lastTextSelection.itemId)) {
-            lastTextSelectionRangeRef.current = undefined;
-        }
     }, [focusedField]);
-    useEffect(() => {
-        if (isUsableTextSelectionRange(selectedRange)) {
-            lastTextSelectionRangeRef.current = selectedRange;
-        }
-    }, [selectedRange]);
     // Track the current page item descriptor for itemsRepository
     const [currentPageItem, setCurrentPageItem] = useState();
     // Create itemsRepository with current page item (will be updated when page loads)
@@ -1121,6 +1045,9 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         });
     }, [isInitialLoad, searchParams]);
     const startTour = useCallback(() => {
+        if (!configuration.activeTour) {
+            return;
+        }
         setIsTourActive(true);
         // Persist tour state to URL so it survives navigation/remounts
         // Use history.replaceState instead of router.replace to avoid triggering React navigation
@@ -1128,7 +1055,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         params.set("tour", "active");
         const newUrl = `${window.location.pathname}?${params.toString()}`;
         window.history.replaceState(getCurrentHistoryState(), "", newUrl);
-    }, [setIsTourActive]);
+    }, [configuration.activeTour, setIsTourActive]);
     const isMobile = useMediaQuery("(max-width: 767px)");
     // On mobile, clear all locked sidebars and keep only the last-opened panel.
     // Handles viewport resize: desktop -> mobile unlocks everything and trims to one panel.
@@ -1293,8 +1220,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     const toggleHelpTerminal = useCallback((options) => {
         const isCurrentlyOpen = showHelpTerminal;
         const requestedTab = options?.activeTab;
-        if (isCurrentlyOpen &&
-            (!requestedTab || requestedTab === helpTerminalActiveTab)) {
+        if (isCurrentlyOpen && (!requestedTab || requestedTab === helpTerminalActiveTab)) {
             // Close when toggling the currently active help view.
             handleSetShowHelpTerminal(false);
         }
@@ -1497,7 +1423,9 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                 }
                 // Handle mode changes — always set to avoid stale-closure mismatch
                 const urlMode = urlParams.get("mode");
-                setMode(urlMode ?? "edit");
+                if (urlMode) {
+                    setMode(urlMode);
+                }
                 // Handle fullscreen changes (shell-level state)
                 const isFullscreen = urlParams.get("fullscreen") === "true";
                 if (configuration.forceFullscreen) {
@@ -1575,6 +1503,9 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             return;
         }
         const tour = configuration.activeTour;
+        if (!tour) {
+            return;
+        }
         const key = tour === "default" ? "editor.tourShown" : "editor.tourShown." + tour;
         const tourShown = localStorageService.getString(key);
         if (!tourShown) {
@@ -1774,9 +1705,6 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         const edits = result.data || [];
         setSuggestedEdits(edits);
     }, [item, searchParams]);
-    useEffect(() => {
-        loadSuggestedEditsRef.current = loadSuggestedEdits;
-    }, [loadSuggestedEdits]);
     const loadFavorites = useCallback(async () => {
         try {
             const result = await getAllFavorites();
@@ -1789,9 +1717,6 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             setFavorites([]);
         }
     }, []);
-    const refreshFavorites = useCallback(async (opts) => {
-        await loadFavorites();
-    }, [loadFavorites]);
     const page = activePageViewContext.page;
     const currentHistoryScope = useMemo(() => {
         const currentItem = item?.descriptor;
@@ -2188,9 +2113,6 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             globalThis.editorRefreshTimer = undefined;
         };
         if (mode === "immediate") {
-            if (refreshTimer) {
-                clearTimeout(refreshTimer);
-            }
             doRefresh();
             return;
         }
@@ -2384,7 +2306,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         else {
             current.set("compare", "true");
         }
-        current.set("mode", workspaceShowsModeControls ? mode : "edit");
+        current.set("mode", mode);
         // Handle fullscreen parameter
         if (fullscreen) {
             current.set("fullscreen", "true");
@@ -3089,35 +3011,9 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         };
     }, [promptSessionReconnect]);
     const sendSocketMessage = useCallback((message) => {
-        if (message.type === "caret-position" &&
-            message.payload?.source === "form-field") {
-            const payload = message.payload;
-            setRemoteCarets((current) => {
-                if (payload.offset == null) {
-                    if (!current[sessionId])
-                        return current;
-                    const next = { ...current };
-                    delete next[sessionId];
-                    return next;
-                }
-                if (!payload.fieldId || !payload.item) {
-                    return current;
-                }
-                return {
-                    ...current,
-                    [sessionId]: {
-                        sessionId,
-                        fieldId: payload.fieldId,
-                        item: payload.item,
-                        offset: payload.offset,
-                        value: payload.value,
-                    },
-                };
-            });
-        }
         // Routes over whichever transport is active (WebSocket preferred, SSE fallback).
         getEditorRealtime().send(message);
-    }, [sessionId]);
+    }, []);
     // URL update helper - defined early so it can be used by workspace/sidebar functions
     const updateUrl = useCallback((params) => {
         // Use the actual browser pathname (including any basePath like /parhelia)
@@ -3595,51 +3491,34 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             operationsContext.context.markOperationComplete;
     }, [operationsContext.context.markOperationComplete]);
     // Replace selected text with new content (for inline AI editing)
-    const replaceSelectedText = useCallback(async (newText, selectionOverride) => {
-        const rangeToReplace = selectionOverride ?? selectedRange ?? lastTextSelectionRangeRef.current;
+    const replaceSelectedText = useCallback(async (newText) => {
+        if (!focusedField)
+            return;
         try {
             // If we have selected text and a replaceText callback, use it
-            if (rangeToReplace?.text && rangeToReplace.replaceText) {
-                rangeToReplace.replaceText(newText);
+            if (selectedRange?.text && selectedRange.replaceText) {
+                selectedRange.replaceText(newText);
                 setSelectedRange(undefined);
-                lastTextSelectionRangeRef.current = undefined;
                 return;
             }
             // If no selection but we have a replaceText callback, try to use it for insertion
             // (some editors might support insertion via the same callback)
-            if (!rangeToReplace?.text && rangeToReplace?.replaceText) {
-                rangeToReplace.replaceText(newText);
+            if (!selectedRange?.text && selectedRange?.replaceText) {
+                selectedRange.replaceText(newText);
                 setSelectedRange(undefined);
-                lastTextSelectionRangeRef.current = undefined;
                 return;
             }
-            const fieldToReplace = focusedField ??
-                (rangeToReplace?.fieldId &&
-                    rangeToReplace.itemId &&
-                    rangeToReplace.language &&
-                    typeof rangeToReplace.version === "number"
-                    ? {
-                        fieldId: rangeToReplace.fieldId,
-                        item: {
-                            id: rangeToReplace.itemId,
-                            language: rangeToReplace.language,
-                            version: rangeToReplace.version,
-                        },
-                    }
-                    : undefined);
-            if (!fieldToReplace)
-                return;
             // Fallback: indexOf-based replacement/insertion for plain text fields
-            const { fieldId, item } = fieldToReplace;
+            const { fieldId, item } = focusedField;
             const modifiedField = getActiveSlotContext()?.fieldModificationStore.getField(fieldId, item.id, item.language, item.version);
             const currentValue = modifiedField
                 ? modifiedField.value || ""
-                : (await itemsRepository.getField(fieldToReplace))
-                    ?.value || "";
+                : (await itemsRepository.getField(focusedField))?.value ||
+                    "";
             let newValue;
-            if (rangeToReplace?.text) {
+            if (selectedRange?.text) {
                 // Replace selected text
-                const { text: originalSelectedText } = rangeToReplace;
+                const { text: originalSelectedText } = selectedRange;
                 const actualPosition = currentValue.indexOf(originalSelectedText);
                 if (actualPosition === -1) {
                     console.error("Failed to find selected text in field value");
@@ -3652,7 +3531,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             }
             else {
                 // Insert at cursor position (use startOffset if available, otherwise append)
-                const insertPosition = rangeToReplace?.startOffset ?? currentValue.length;
+                const insertPosition = selectedRange?.startOffset ?? currentValue.length;
                 newValue =
                     currentValue.slice(0, insertPosition) +
                         newText +
@@ -3660,13 +3539,12 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             }
             // Update the field
             await operations.editField({
-                field: fieldToReplace,
+                field: focusedField,
                 value: newValue,
                 refresh: "immediate",
             });
             // Clear the selection after replacement/insertion
             setSelectedRange(undefined);
-            lastTextSelectionRangeRef.current = undefined;
         }
         catch (error) {
             console.error("Failed to replace/insert text:", error);
@@ -4143,6 +4021,18 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             };
         }
     }, [operations.onFieldBlur]);
+    useEffect(() => {
+        if (mode === "suggestions") {
+            setShowSuggestedEdits(true);
+            // Refresh from the server to recover from any missed
+            // `suggested-edit-updated` WebSocket events (e.g. created by an
+            // agent tool while another tab was focused).
+            loadSuggestedEdits();
+        }
+        else {
+            setShowSuggestedEdits(false);
+        }
+    }, [mode, loadSuggestedEdits]);
     const isReadOnly = !item ||
         !item.canWriteItem ||
         !item.canWriteLanguage ||
@@ -4161,6 +4051,15 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         // Otherwise, only show workspaces that are in the settings
         return workspaceIdsFromSettings.includes(w.id) && !w.visible;
     });
+    // Handle initial mode setup from URL (only on initial load)
+    useEffect(() => {
+        if (!isInitialLoad)
+            return;
+        const queryMode = searchParams.get("mode");
+        if (queryMode) {
+            setMode(queryMode);
+        }
+    }, [searchParams, isInitialLoad]);
     // Add this new effect for initial fullscreen setup
     useEffect(() => {
         if (!isInitialLoad)
@@ -4288,11 +4187,16 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         dragEnd: () => {
             setDragObject(undefined);
         },
-        droppedInPlaceholder: async (placeholderKey, index, spotPositionElement, spotPositionAnchor, insertOption, spotPosition) => {
-            const droppedDragObject = dragObject;
-            if ((!droppedDragObject && !insertOption) || !page)
+        droppedInPlaceholder: async (placeholderKey, index, spotPositionElement, spotPositionAnchor, insertOption) => {
+            if ((!dragObject && !insertOption) || !page)
                 return;
             setDragObject(undefined);
+            if (spotPositionElement && spotPositionAnchor) {
+                setInserting({
+                    positionElement: spotPositionElement,
+                    positionAnchor: spotPositionAnchor,
+                });
+            }
             const placeholderKeyComponents = placeholderKey.split("_");
             const parentId = placeholderKeyComponents.length === 1
                 ? undefined
@@ -4302,31 +4206,39 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             let op;
             if (!currentItemDescriptorRef.current)
                 return;
-            let insertionSequence;
-            if ((spotPosition || spotPositionElement) && spotPositionAnchor) {
-                insertionSequence = ++insertingSequenceRef.current;
-                setInserting({
-                    position: spotPosition,
-                    positionElement: spotPositionElement,
-                    positionAnchor: spotPositionAnchor,
-                });
-            }
-            let operationPromise;
             if (insertOption) {
                 // Clear any selected component type for insertion once the component
                 // has been dropped into a placeholder. This ensures that insert mode
                 // can exit cleanly and the editor header updates from "Add Component"
                 // to the actual component name after the operation completes.
                 setSelectedForInsertion("");
-                operationPromise = operations.addComponent(insertOption.typeId, placeholderKey, index, currentItemDescriptorRef.current);
+                operations
+                    .addComponent(insertOption.typeId, placeholderKey, index, currentItemDescriptorRef.current)
+                    .then((result) => {
+                    setInserting(undefined);
+                })
+                    .catch((err) => {
+                    setInserting(undefined);
+                });
+                return;
             }
-            else if (droppedDragObject?.type == "template") {
-                operationPromise = operations.addComponent(droppedDragObject.typeId, placeholderKey, index, currentItemDescriptorRef.current);
+            if (!dragObject)
+                return;
+            if (dragObject && dragObject.type == "template") {
+                operations
+                    .addComponent(dragObject.typeId, placeholderKey, index, currentItemDescriptorRef.current)
+                    .then((result) => {
+                    setInserting(undefined);
+                })
+                    .catch((err) => {
+                    setInserting(undefined);
+                });
+                return;
             }
-            else if (droppedDragObject?.type == "component" ||
-                (droppedDragObject?.type == "items" && droppedDragObject.items)) {
+            if (dragObject.type == "component" ||
+                (dragObject.type == "items" && dragObject.items)) {
                 const parentComponent = parentId && page ? getComponentById(parentId, page) : null;
-                if (droppedDragObject.type == "items" && droppedDragObject.items) {
+                if (dragObject.type == "items" && dragObject.items) {
                     op = {
                         type: "link-component",
                         mainItem: page.item.descriptor,
@@ -4340,52 +4252,33 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                         placeholderIndex: index,
                         date: new Date().toISOString(),
                         id: uuid(),
-                        linkedComponentItem: droppedDragObject.items[0],
+                        linkedComponentItem: dragObject.items[0],
                         title: "Link component",
                     };
                 }
                 else {
-                    const componentIds = droppedDragObject.components?.map((c) => c.id) ?? [];
-                    if (componentIds.length > 0) {
-                        op = {
-                            type: "move-component",
-                            mainItem: page.item.descriptor,
-                            parent: parentId && {
-                                id: parentId,
-                                language: page.item.descriptor.language,
-                                version: page.item.descriptor.version,
-                            },
-                            placeholderKey,
-                            placeholderIndex: index,
-                            componentIds,
-                            date: new Date().toISOString(),
-                            id: uuid(),
-                            title: "Move component",
-                        };
-                    }
+                    const componentIds = dragObject.components?.map((c) => c.id) ?? [];
+                    if (componentIds.length === 0)
+                        return;
+                    op = {
+                        type: "move-component",
+                        mainItem: page.item.descriptor,
+                        parent: parentId && {
+                            id: parentId,
+                            language: page.item.descriptor.language,
+                            version: page.item.descriptor.version,
+                        },
+                        placeholderKey,
+                        placeholderIndex: index,
+                        componentIds,
+                        date: new Date().toISOString(),
+                        id: uuid(),
+                        title: "Move component",
+                    };
                 }
             }
             if (op)
-                operationPromise = operations.executeEditOperation(op);
-            if (!operationPromise) {
-                if (insertionSequence !== undefined &&
-                    insertingSequenceRef.current === insertionSequence) {
-                    setInserting(undefined);
-                }
-                return;
-            }
-            try {
-                await operationPromise;
-            }
-            catch (err) {
-                console.error("Failed to drop component in placeholder", err);
-            }
-            finally {
-                if (insertionSequence !== undefined &&
-                    insertingSequenceRef.current === insertionSequence) {
-                    setInserting(undefined);
-                }
-            }
+                operations.executeEditOperation(op);
         },
         page,
         triggerFieldAction: async (fieldDescriptor, actionButton, parameters, event) => {
@@ -4664,50 +4557,27 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         setShowComments,
         showResolvedComments,
         setShowResolvedComments,
-        addComment: async (options) => {
+        addComment: async () => {
             const descriptor = item?.descriptor;
             if (!descriptor)
                 return;
             // Snapshot selection context up-front so switching views doesn't change what we comment on.
-            const hintedFieldSnapshot = options?.field;
             const focusedFieldSnapshot = focusedFieldRef.current;
-            const selectedRangeCandidate = isUsableTextSelectionRange(selectedRange)
-                ? selectedRange
-                : lastTextSelectionRangeRef.current;
-            const selectedRangeSnapshot = !hintedFieldSnapshot ||
-                selectionRangeMatchesField(selectedRangeCandidate, hintedFieldSnapshot)
-                ? selectedRangeCandidate
-                : undefined;
-            const selectedRangeFieldSnapshot = isUsableTextSelectionRange(selectedRangeSnapshot)
-                ? {
-                    fieldId: selectedRangeSnapshot.fieldId,
-                    item: {
-                        id: selectedRangeSnapshot.itemId,
-                        language: selectedRangeSnapshot.language || descriptor.language,
-                        version: typeof selectedRangeSnapshot.version === "number"
-                            ? selectedRangeSnapshot.version
-                            : descriptor.version,
-                    },
-                }
-                : undefined;
-            const commentFieldSnapshot = selectedRangeFieldSnapshot ??
-                hintedFieldSnapshot ??
-                focusedFieldSnapshot;
-            const itemId = commentFieldSnapshot?.item.id ||
-                (selection.length > 0 ? selection[0] : undefined) ||
+            const selectionSnapshot = [...selection];
+            const selectedRangeSnapshot = selectedRange;
+            const itemId = focusedFieldSnapshot?.item.id ||
+                (selectionSnapshot.length > 0 ? selectionSnapshot[0] : undefined) ||
                 descriptor.id;
             if (!itemId)
                 return;
             // Ensure the feedback sidebar is open when adding a comment (e.g. command palette / toolbar button).
             openSidebar("feedback");
-            const language = commentFieldSnapshot?.item.language || descriptor.language;
-            const version = typeof commentFieldSnapshot?.item.version === "number"
-                ? commentFieldSnapshot.item.version
-                : descriptor.version;
+            const language = descriptor.language;
+            const version = descriptor.version;
             const getFieldName = async () => {
-                if (!commentFieldSnapshot)
+                if (!focusedFieldSnapshot)
                     return "";
-                const field = await itemsRepository.getField(commentFieldSnapshot);
+                const field = await itemsRepository.getField(focusedFieldSnapshot);
                 return field?.name;
             };
             const getItemName = async () => {
@@ -4723,40 +4593,24 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                 isNew: true,
                 itemId,
                 itemName: await getItemName(),
-                fieldId: commentFieldSnapshot?.fieldId,
+                fieldId: focusedFieldSnapshot?.fieldId,
                 fieldName: await getFieldName(),
                 mainItemId: descriptor.id,
                 language,
                 version,
                 position: 0,
-                rangeStart: isUsableTextSelectionRange(selectedRangeSnapshot)
-                    ? selectedRangeSnapshot.startOffset
-                    : 0,
-                rangeEnd: isUsableTextSelectionRange(selectedRangeSnapshot)
-                    ? selectedRangeSnapshot.endOffset
-                    : 0,
+                rangeStart: selectedRangeSnapshot?.startOffset || 0,
+                rangeEnd: selectedRangeSnapshot?.endOffset || 0,
                 author: user?.name,
                 authorDisplayName: user?.fullName,
-                created: new Date().toISOString(),
+                date: new Date().toISOString(),
             };
-            if (selectedRangeSnapshot?.clientRect) {
-                newComment[COMMENT_TRANSIENT_SELECTION_RECT] =
-                    selectedRangeSnapshot.clientRect;
-            }
-            if (selectedRangeSnapshot?.elementKey) {
-                newComment[COMMENT_TRANSIENT_ELEMENT_KEY] =
-                    selectedRangeSnapshot.elementKey;
-            }
             setComments([newComment, ...comments]);
             setSelectedComment(newComment);
             setShowComments(true);
-            lastTextSelectionRangeRef.current = undefined;
         },
         mode,
-        changeMode,
         setMode,
-        registerModeChangeParticipant,
-        modeTransitionRevision,
         previewDate,
         setPreviewDate,
         layoutMode,
@@ -4824,7 +4678,6 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         setCurrentWizardId,
         favorites,
         loadFavorites,
-        refreshFavorites,
         isQuickSwitcherVisible: quickSwitcherVisible,
         // Context factory registry methods
         registerContextFactory: (name, factory) => {
@@ -4933,7 +4786,6 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         isRefreshing,
         favorites,
         loadFavorites,
-        refreshFavorites,
         currentWizardId,
         quickSwitcherVisible,
         quickSwitcherSelectedIndex,
@@ -4944,10 +4796,6 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
         factoriesRef,
         user,
         statusMessage,
-        changeMode,
-        setMode,
-        registerModeChangeParticipant,
-        modeTransitionRevision,
         previewDate,
         layoutMode,
         enableCompletions,
@@ -5013,6 +4861,8 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
             setLockedField(undefined); // Clear client-side lock state
             await releaseFieldLocks(sessionId);
         },
+        inlineEditingFieldElement,
+        setInlineEditingFieldElement,
     };
     // Debug: Track editContext changes
     // const prevDependencies = useRef<any[]>([]);
@@ -5051,6 +4901,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     //     componentDesignerRendering,
     //     insertMode,
     //     currentOverlay,
+    //     inlineEditingFieldElement,
     //     lockedField,
     //     selectedRange,
     //     pageViewContext,
@@ -5138,6 +4989,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
     //     'componentDesignerRendering',
     //     'insertMode',
     //     'currentOverlay',
+    //     'inlineEditingFieldElement',
     //     'lockedField',
     //     'selectedRange',
     //     'pageViewContext',
@@ -5253,7 +5105,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                     setTimeout(() => {
                         setShowFullscreenHint(false);
                     }, 600);
-                }, "data-testid": "fullscreen-hint-overlay", children: _jsxs("div", { className: "bg-neutral-grey-100/60 fixed top-6 left-1/2 -translate-x-1/2 transform rounded-full px-6 py-2.5 text-sm font-medium text-white shadow-2xl backdrop-blur-md transition-all duration-500", children: ["Press", " ", _jsx("kbd", { className: "badge-pad-sm mx-1 rounded bg-white/20 text-xs font-semibold", children: "Ctrl + F11" }), " ", "to exit fullscreen"] }) }))] })) : (_jsxs(_Fragment, { children: [_jsx(EditorChrome, { className: className, currentWorkspace: currentWorkspace, centerPanelView: centerPanelView, editContext: editContext, showAgentsPanel: showAgentsPanel, handleSetShowAgentsPanel: handleSetShowAgentsPanel, workspaceId: workspaceId }), isTourActive && (_jsx(Tour, { tourStopCallback: () => {
+                }, "data-testid": "fullscreen-hint-overlay", children: _jsxs("div", { className: "bg-neutral-grey-100/60 fixed top-6 left-1/2 -translate-x-1/2 transform rounded-full px-6 py-2.5 text-sm font-medium text-white shadow-2xl backdrop-blur-md transition-all duration-500", children: ["Press", " ", _jsx("kbd", { className: "badge-pad-sm mx-1 rounded bg-white/20 text-xs font-semibold", children: "Ctrl + F11" }), " ", "to exit fullscreen"] }) }))] })) : (_jsxs(_Fragment, { children: [_jsx(EditorChrome, { className: className, currentWorkspace: currentWorkspace, centerPanelView: centerPanelView, editContext: editContext, showAgentsPanel: showAgentsPanel, handleSetShowAgentsPanel: handleSetShowAgentsPanel, workspaceId: workspaceId }), isTourActive && configuration.activeTour && (_jsx(Tour, { tourStopCallback: () => {
                     setIsTourActive(false);
                     // Remove tour state from URL
                     // Use history.replaceState instead of router.replace to avoid triggering React navigation
@@ -5265,8 +5117,7 @@ export function EditorShell({ configuration, className, item: loadItemDescriptor
                         : window.location.pathname;
                     window.history.replaceState(getCurrentHistoryState(), "", newUrl);
                 }, configuration: configuration, restoredFromUrl: tourRestoredRef.current })), _jsx(FeatureGate, { feature: LicenseFeatures.AI, children: _jsx(GuidanceOverlay, {}) }), _jsx(FeatureGate, { feature: LicenseFeatures.AI, children: _jsx(AgentDialogHandler, {}) })] }));
-    const showRefreshSpinner = editContext.isRefreshing && !activePageViewContext.iframeSupportsRefresh;
-    return (_jsx(LicenseProvider, { initialLicenseStatus: initialLicenseStatus, initialStatusLoaded: initialLicenseStatusLoaded, children: _jsx("div", { className: `editor h-full w-full`, children: _jsx(OperationsContextProvider, { value: operationsContext.context, children: _jsx(FieldsEditContextProvider, { value: fieldsEditContext, children: _jsx(EditContextProvider, { value: editContext, children: _jsxs(SplashScreenAgentProvider, { children: [_jsx(DevModeIndicator, {}), startupChecks.state === "loading" && _jsx(EditorLoadingOverlay, {}), showRefreshSpinner && (_jsx("div", { className: "text-neutral-grey-50 pointer-events-none fixed right-0 bottom-0 flex h-24 w-24 items-center justify-center opacity-50 select-none", children: _jsx(Spinner, {}) })), (currentWorkspace.id === "agents" ||
+    return (_jsx(LicenseProvider, { initialLicenseStatus: initialLicenseStatus, initialStatusLoaded: initialLicenseStatusLoaded, children: _jsx("div", { className: `editor h-full w-full`, children: _jsx(OperationsContextProvider, { value: operationsContext.context, children: _jsx(FieldsEditContextProvider, { value: fieldsEditContext, children: _jsx(EditContextProvider, { value: editContext, children: _jsxs(SplashScreenAgentProvider, { children: [_jsx(DevModeIndicator, {}), startupChecks.state === "loading" && _jsx(EditorLoadingOverlay, {}), editContext.isRefreshing && (_jsx("div", { className: "text-neutral-grey-50 pointer-events-none fixed right-0 bottom-0 flex h-24 w-24 items-center justify-center opacity-50 select-none", children: _jsx(Spinner, {}) })), (currentWorkspace.id === "agents" ||
                                     currentWorkspace.id === "taskboard" ||
                                     currentWorkspace.id === "translation-management") &&
                                     showAgentsWorkspaceEditor && (_jsx(AgentsSlotContextBridgeHost, { slots: editorSlots })), startupChecks.state !== "loading" && (children || editorUi), startupChecks.state !== "loading" && dialog, _jsx(Toaster, { position: "top-center" }), " ", _jsx(ConfirmationDialog, { ref: confirmationDialogRef }), _jsx(ConcurrentUserLimitDialog, { open: concurrentUserLimitError !== null, onOpenChange: (open) => {