@parhelia/core 0.1.12882 → 0.1.12884

package/dist/editor/page-editor-chrome/useInlineAICompletion.js

@@ -1,758 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useCallback, useState, useMemo, useRef, } from "react";
-import { useDebouncedCallback } from "use-debounce";
-import { useEditContext, useFieldsEditContext } from "../client/editContext";
-import { generatePageContext, getCachedContext, } from "../services/contextService";
-import { WandSparkles } from "lucide-react";
-import { createRoot } from "react-dom/client";
-import { LicenseFeatures, useFeature } from "../../licensing";
-import { useSlotContext } from "../views/editorSlotContext";
-function InlineCompletionHint({ hintText, isMobile, onAccept, positionStyle, }) {
-    return (_jsxs("div", { className: "shadow-[0_4px_14px_color-mix(in_srgb,var(--color-neutral-grey-100)_14%,transparent),0_0_0_1px_color-mix(in_srgb,var(--color-neutral-grey-100)_6%,transparent)]pointer-events-auto border-border-default bg-neutral-grey-5 text-neutral-grey-100 fixed z-95 inline-flex max-w-none cursor-pointer items-center gap-2 rounded-md border px-2.5 py-2 text-xs leading-snug font-medium whitespace-nowrap", style: positionStyle, onClick: isMobile ? onAccept : undefined, role: isMobile ? "button" : undefined, children: [_jsx(WandSparkles, { className: "text-highlight-100 size-3.5 shrink-0", strokeWidth: 2, "aria-hidden": true }), _jsx("span", { children: hintText })] }));
-}
-function getAccessibleIframeDocument(iframe) {
-    if (!iframe)
-        return null;
-    try {
-        return iframe.contentDocument || iframe.contentWindow?.document || null;
-    }
-    catch {
-        return null;
-    }
-}
-function getAccessibleIframeWindow(iframe) {
-    if (!iframe)
-        return null;
-    try {
-        return iframe.contentWindow;
-    }
-    catch {
-        return null;
-    }
-}
-function getAccessibleIframeSelection(iframe) {
-    try {
-        return getAccessibleIframeWindow(iframe)?.getSelection() ?? null;
-    }
-    catch {
-        return null;
-    }
-}
-export function useInlineAiCompletion({ pageViewContext, cursorSpanId, isUpdatingRef, }) {
-    const editContext = useEditContext();
-    const fieldsContext = useFieldsEditContext();
-    const slotContext = useSlotContext();
-    const canUseAi = useFeature(LicenseFeatures.AI);
-    const [currentCompletion, setCurrentCompletion] = useState(null);
-    const [, setIsLoading] = useState(false);
-    const abortControllerRef = useRef(null);
-    const loadingAnimationRef = useRef(null);
-    const applyCompletionRef = useRef(null);
-    const hintReactRootRef = useRef(null);
-    // Clean up hint element on unmount
-    useEffect(() => {
-        return () => {
-            hintReactRootRef.current?.unmount();
-            hintReactRootRef.current = null;
-            const hintElement = document.getElementById(`${cursorSpanId}-hint`);
-            if (hintElement) {
-                hintElement.remove();
-            }
-            if (loadingAnimationRef.current) {
-                cancelAnimationFrame(loadingAnimationRef.current);
-            }
-        };
-    }, [cursorSpanId]);
-    const lastCaretPosRef = useRef(null);
-    // Simple function to track caret position without inserting spans
-    const positionCursorSpan = useCallback(() => {
-        if (isUpdatingRef.current)
-            return;
-        isUpdatingRef.current = true;
-        try {
-            const iframeWindow = getAccessibleIframeWindow(pageViewContext.editorIframe);
-            const iframeDocument = getAccessibleIframeDocument(pageViewContext.editorIframe);
-            const editableElement = fieldsContext?.inlineEditingFieldElement;
-            if (!iframeWindow || !iframeDocument || !editableElement)
-                return;
-            // Get current selection
-            const selection = iframeWindow.getSelection();
-            if (!selection || selection.rangeCount === 0)
-                return;
-            const range = selection.getRangeAt(0);
-            // Only proceed if selection is within our editing element
-            if (!editableElement.contains(range.commonAncestorContainer))
-                return;
-            // Save detailed information about the cursor position
-            const currentNode = range.startContainer;
-            const currentOffset = range.startOffset;
-            // Create a temporary range to get text up to cursor
-            const tempRange = iframeDocument.createRange();
-            tempRange.selectNodeContents(editableElement);
-            tempRange.setEnd(currentNode, currentOffset);
-            const textUpToCursor = tempRange.toString();
-            // Check if cursor position has changed
-            const cursorMoved = !lastCaretPosRef.current ||
-                lastCaretPosRef.current.node !== currentNode ||
-                lastCaretPosRef.current.offset !== currentOffset ||
-                textUpToCursor.length !== (lastCaretPosRef.current.textLength || 0);
-            if (cursorMoved) {
-                // Reset completion if cursor position changed
-                lastCaretPosRef.current = {
-                    node: currentNode,
-                    offset: currentOffset,
-                    textLength: textUpToCursor.length,
-                };
-            }
-            // Save a copy of the current range
-            const originalRange = range.cloneRange();
-            // Remove any existing cursor spans
-            const existingSpan = iframeDocument.getElementById(cursorSpanId);
-            if (existingSpan) {
-                existingSpan.parentNode?.removeChild(existingSpan);
-            }
-            // Create our cursor span
-            const cursorSpan = existingSpan ?? iframeDocument.createElement("span");
-            cursorSpan.id = cursorSpanId;
-            cursorSpan.style.fontWeight = "bold";
-            cursorSpan.style.display = "inline";
-            cursorSpan.style.pointerEvents = "none";
-            cursorSpan.contentEditable = "false";
-            cursorSpan.setAttribute("data-cursor-indicator", "true");
-            // Get a working range for insertion
-            const workingRange = range.cloneRange();
-            workingRange.collapse(true);
-            // Insert the span at cursor position
-            workingRange.insertNode(cursorSpan);
-            // Restore original selection
-            selection.removeAllRanges();
-            selection.addRange(originalRange);
-            // setTimeout(() => {
-            //   getCompletionDebounced();
-            // }, 100);
-        }
-        catch (error) {
-            console.error("Error updating cursor:", error);
-        }
-        finally {
-            setTimeout(() => {
-                isUpdatingRef.current = false;
-            }, 10);
-        }
-    }, [
-        pageViewContext.editorIframe,
-        fieldsContext?.inlineEditingFieldElement,
-        cursorSpanId,
-        isUpdatingRef,
-    ]);
-    // Extracts the text up to the cursor position in the editable element
-    const getContentUpToCursor = useCallback((element) => {
-        const selection = getAccessibleIframeSelection(pageViewContext.editorIframe);
-        if (!element || !selection || selection.rangeCount === 0)
-            return null;
-        const range = selection.getRangeAt(0);
-        const cursorPosition = range.startOffset;
-        let contentUpToCursor = "";
-        if (element.childNodes.length === 0) {
-            contentUpToCursor = "";
-        }
-        else if (element.childNodes.length === 1 &&
-            element.firstChild?.nodeType === Node.TEXT_NODE) {
-            const full = element.innerText || "";
-            contentUpToCursor = full.substring(0, Math.min(cursorPosition, full.length));
-        }
-        else {
-            const tempRange = document.createRange();
-            tempRange.selectNodeContents(element);
-            tempRange.setEnd(range.startContainer, range.startOffset);
-            contentUpToCursor = tempRange.toString();
-        }
-        return contentUpToCursor;
-    }, [pageViewContext.editorIframe]);
-    // Loading animation with three dots changing color
-    const startLoadingAnimation = useCallback(() => {
-        const doc = getAccessibleIframeDocument(pageViewContext.editorIframe);
-        const span = doc?.getElementById(cursorSpanId);
-        if (!doc || !span)
-            return;
-        span.innerHTML = "";
-        span.style.display = "inline-flex";
-        span.style.gap = "4px";
-        span.style.alignItems = "center";
-        for (let i = 0; i < 3; i++) {
-            const dot = doc.createElement("span");
-            dot.textContent = "•";
-            dot.style.transition = "color 0.3s ease";
-            dot.style.color = "var(--color-border-default)";
-            dot.style.fontSize = "16px";
-            span.appendChild(dot);
-        }
-        let step = 0;
-        const animate = () => {
-            const dots = span.querySelectorAll("span");
-            dots.forEach((dot, index) => {
-                if (index === step % 3) {
-                    dot.style.color = "var(--color-neutral-grey-50)";
-                }
-                else {
-                    dot.style.color = "var(--color-border-default)";
-                }
-            });
-            step++;
-            loadingAnimationRef.current = requestAnimationFrame(() => {
-                if (step % 15 === 0) {
-                    animate();
-                }
-                else {
-                    loadingAnimationRef.current = requestAnimationFrame(animate);
-                }
-            });
-        };
-        animate();
-    }, [pageViewContext.editorIframe, cursorSpanId]);
-    const stopLoadingAnimation = useCallback(() => {
-        if (loadingAnimationRef.current) {
-            cancelAnimationFrame(loadingAnimationRef.current);
-            loadingAnimationRef.current = null;
-        }
-    }, []);
-    const getCompletion = useCallback(async (element, isManualTrigger = false) => {
-        const contentUpToCursor = getContentUpToCursor(element);
-        if (!contentUpToCursor?.trim())
-            return null;
-        if (abortControllerRef.current) {
-            abortControllerRef.current.abort();
-        }
-        abortControllerRef.current = new AbortController();
-        const fieldId = element.getAttribute("data-fieldid");
-        const itemId = element.getAttribute("data-itemid");
-        const language = element.getAttribute("data-language");
-        const version = element.getAttribute("data-version");
-        if (!fieldId || !itemId || !language || !version)
-            return null;
-        if (!isManualTrigger) {
-            const lastChar = contentUpToCursor.slice(-1);
-            if (lastChar !== " " && lastChar !== "\u00A0") {
-                return null;
-            }
-        }
-        if (!editContext)
-            return null;
-        let pageContext = getCachedContext(editContext);
-        if (!pageContext) {
-            try {
-                pageContext = await generatePageContext(editContext, pageViewContext);
-            }
-            catch (error) {
-                console.warn("Failed to generate page context:", error);
-            }
-        }
-        let contextString = "";
-        if (pageContext) {
-            contextString = `Page Name: ${pageContext.pageTitle} (${pageContext.pageType})\n PageSummary: ${pageContext.abstract}`;
-        }
-        setIsLoading(true);
-        startLoadingAnimation();
-        try {
-            const endpoint = `/parhelia/agent/GetTextCompletion`;
-            const response = await fetch(endpoint, {
-                method: "POST",
-                headers: {
-                    "Content-Type": "application/x-www-form-urlencoded",
-                },
-                body: new URLSearchParams({
-                    textToComplete: contentUpToCursor,
-                    contextInfo: contextString,
-                }).toString(),
-            });
-            const data = await response.json();
-            return data.completion || null;
-        }
-        catch (error) {
-            if (error instanceof Error && error.name !== "AbortError") {
-                console.error("Error getting completion:", error);
-            }
-            return null;
-        }
-        finally {
-            setIsLoading(false);
-            stopLoadingAnimation();
-        }
-    }, [
-        getContentUpToCursor,
-        editContext,
-        pageViewContext,
-        startLoadingAnimation,
-        stopLoadingAnimation,
-    ]);
-    // Debounced AI call: recompute the sentence, call getCompletion, and extract only the "tail" for the ghost text
-    const getCompletionDebounced = useDebouncedCallback(async (isManualTrigger = false) => {
-        const el = fieldsContext?.inlineEditingFieldElement;
-        if (!el)
-            return;
-        // 1) Recompute the exact sentence at this moment
-        const full = getContentUpToCursor(el) || "";
-        const sentence = full.split(/[.?!]\s*/).pop() || "";
-        // 2) Ask AI for a completion
-        const rawSuggestion = await getCompletion(el, isManualTrigger);
-        if (!rawSuggestion) {
-            setCurrentCompletion(null);
-            clearCursorSpan();
-            return;
-        }
-        // 3) Strip off the already-typed sentence to leave just the "completion tail"
-        const suggestion = rawSuggestion.startsWith(sentence)
-            ? rawSuggestion
-            : sentence + rawSuggestion;
-        setCurrentCompletion(suggestion);
-        updateCursorSpan(suggestion.substring(sentence.length));
-    }, 250);
-    // Inserts or clears the ghost text inside the cursor span
-    const updateCursorSpan = useCallback((text) => {
-        const doc = getAccessibleIframeDocument(pageViewContext.editorIframe);
-        const span = doc?.getElementById(cursorSpanId);
-        if (!doc || !span)
-            return;
-        // Update the completion text
-        if (text) {
-            span.textContent = text;
-            span.style.color = "var(--color-neutral-grey-50)";
-            span.style.fontStyle = "italic";
-            // Create or update hint element in the main document
-            let hintElement = document.getElementById(`${cursorSpanId}-hint`);
-            if (!hintElement) {
-                hintElement = document.createElement("div");
-                hintElement.id = `${cursorSpanId}-hint`;
-                document.body.appendChild(hintElement);
-            }
-            if (!hintReactRootRef.current) {
-                hintElement.replaceChildren();
-                hintReactRootRef.current = createRoot(hintElement);
-            }
-            const hintLabel = editContext?.isMobile
-                ? "Tap to accept"
-                : "Press Tab to accept ⇥";
-            const isMobile = editContext?.isMobile ?? false;
-            const iframeRect = pageViewContext.editorIframe?.getBoundingClientRect();
-            const spanRect = span.getBoundingClientRect();
-            let positionStyle = {
-                marginLeft: "0.25rem",
-                marginRight: "0.25rem",
-            };
-            if (iframeRect) {
-                if (isMobile) {
-                    const centerX = (spanRect.left + spanRect.right) / 2;
-                    const gap = 6;
-                    positionStyle = {
-                        ...positionStyle,
-                        left: centerX,
-                        top: spanRect.top - gap,
-                        transform: "translate(-50%, -100%)",
-                    };
-                }
-                else {
-                    const textLength = span.textContent?.length || 0;
-                    let left;
-                    let top;
-                    if (textLength > 0 && span.firstChild) {
-                        const range = doc.createRange();
-                        range.setStart(span.firstChild, Math.max(0, textLength - 1));
-                        range.setEnd(span.firstChild, textLength);
-                        const rangeRect = range.getBoundingClientRect();
-                        left = iframeRect.left + rangeRect.right;
-                        top = iframeRect.top + rangeRect.top;
-                    }
-                    else {
-                        left = iframeRect.left + spanRect.right;
-                        top = iframeRect.top + spanRect.top;
-                    }
-                    positionStyle = {
-                        ...positionStyle,
-                        left,
-                        top,
-                        transform: undefined,
-                    };
-                }
-            }
-            hintReactRootRef.current.render(_jsx(InlineCompletionHint, { hintText: hintLabel, isMobile: isMobile, onAccept: () => applyCompletionRef.current?.(), positionStyle: positionStyle }));
-        }
-        else {
-            span.textContent = "";
-            // Remove hint element if it exists
-            const hintElement = document.getElementById(`${cursorSpanId}-hint`);
-            if (hintElement) {
-                hintReactRootRef.current?.unmount();
-                hintReactRootRef.current = null;
-                hintElement.remove();
-            }
-        }
-    }, [pageViewContext.editorIframe, cursorSpanId, editContext?.isMobile]);
-    const clearCursorSpan = useCallback(() => {
-        const doc = getAccessibleIframeDocument(pageViewContext.editorIframe);
-        if (!doc)
-            return;
-        // Clear the completion text
-        updateCursorSpan("");
-    }, [pageViewContext.editorIframe, updateCursorSpan]);
-    // Handle keydown events for cursor movement (arrow keys, etc.)
-    useEffect(() => {
-        const keyHandler = (e) => {
-            if (e.key === "ArrowLeft" ||
-                e.key === "ArrowRight" ||
-                e.key === "ArrowUp" ||
-                e.key === "ArrowDown" ||
-                e.key === " " ||
-                e.key === "Tab" ||
-                e.key === "End" ||
-                e.key === "Backspace" ||
-                e.key === "Delete") {
-                setCurrentCompletion(null);
-                clearCursorSpan();
-                setTimeout(() => {
-                    if (!isUpdatingRef.current) {
-                        positionCursorSpan();
-                    }
-                }, 10);
-                if (e.key === "ArrowRight" || e.key === "Delete") {
-                    const cursorSpan = getAccessibleIframeDocument(pageViewContext.editorIframe)?.getElementById(cursorSpanId);
-                    if (cursorSpan) {
-                        const originalDisplay = cursorSpan.style.display;
-                        cursorSpan.style.display = "none";
-                        setTimeout(() => {
-                            if (cursorSpan.parentNode) {
-                                cursorSpan.style.display = originalDisplay;
-                            }
-                        }, 0);
-                    }
-                }
-            }
-        };
-        const doc = getAccessibleIframeDocument(pageViewContext.editorIframe);
-        if (!doc)
-            return;
-        doc.addEventListener("keydown", keyHandler);
-        return () => doc.removeEventListener("keydown", keyHandler);
-    }, [
-        clearCursorSpan,
-        cursorSpanId,
-        isUpdatingRef,
-        pageViewContext.editorIframe,
-        pageViewContext.page,
-        positionCursorSpan,
-    ]);
-    // Function to apply the completion (must be before handleInput)
-    const applyCompletion = useCallback(() => {
-        const iframeWindow = getAccessibleIframeWindow(pageViewContext.editorIframe);
-        const iframeDocument = getAccessibleIframeDocument(pageViewContext.editorIframe);
-        if (!iframeWindow ||
-            !iframeDocument ||
-            !fieldsContext?.inlineEditingFieldElement)
-            return;
-        const cursorSpan = iframeDocument.getElementById(cursorSpanId);
-        if (!cursorSpan)
-            return;
-        const completionToApply = cursorSpan.textContent || "";
-        if (!completionToApply)
-            return;
-        const element = fieldsContext.inlineEditingFieldElement;
-        const fieldId = element.getAttribute("data-fieldid");
-        const fieldName = element.getAttribute("data-fieldname");
-        const itemId = element.getAttribute("data-itemid");
-        const language = element.getAttribute("data-language");
-        const versionStr = element.getAttribute("data-version");
-        const isRichText = element.getAttribute("data-is-richtext") === "true";
-        const version = versionStr ? parseInt(versionStr, 10) : undefined;
-        if (!fieldId || !itemId || !language || !version)
-            return;
-        const selection = getAccessibleIframeSelection(pageViewContext.editorIframe);
-        if (!selection || selection.rangeCount === 0)
-            return;
-        const range = selection.getRangeAt(0);
-        const tempRange = document.createRange();
-        tempRange.selectNodeContents(element);
-        tempRange.setEnd(range.startContainer, range.startOffset);
-        const textUpToCursor = tempRange.toString();
-        const wordBoundaryRegex = /[\s.,;:!?"'()[\]{}<>/|=+\-*&^%$#@~`](?=[^\s.,;:!?"'()[\]{}<>/|=+\-*&^%$#@~`]*$)/;
-        const match = textUpToCursor.match(wordBoundaryRegex);
-        const lastWordBoundaryIndex = match && match.index !== undefined ? match.index + 1 : 0;
-        const currentPartialWord = textUpToCursor
-            .substring(lastWordBoundaryIndex)
-            .trim();
-        const isOverlapping = currentPartialWord.length > 0 &&
-            completionToApply
-                .toLowerCase()
-                .startsWith(currentPartialWord.toLowerCase());
-        if (isOverlapping) {
-            const wordRange = document.createRange();
-            const startContainer = range.startContainer;
-            const startOffset = range.startOffset - currentPartialWord.length;
-            if (startOffset >= 0 && startContainer.nodeType === Node.TEXT_NODE) {
-                wordRange.setStart(startContainer, startOffset);
-                wordRange.setEnd(range.startContainer, range.startOffset);
-                wordRange.deleteContents();
-            }
-            else {
-                if (textUpToCursor.length > 0 && !textUpToCursor.endsWith(" ")) {
-                    const spaceNode = document.createTextNode(" ");
-                    range.insertNode(spaceNode);
-                    range.setStartAfter(spaceNode);
-                    range.setEndAfter(spaceNode);
-                }
-            }
-        }
-        else {
-            if (textUpToCursor.length > 0 &&
-                !textUpToCursor.endsWith(" ") &&
-                !textUpToCursor.endsWith("\n") &&
-                !/[.!?\-—:;({[\s]$/.test(textUpToCursor)) {
-                const spaceNode = document.createTextNode(" ");
-                range.insertNode(spaceNode);
-                range.setStartAfter(spaceNode);
-                range.setEndAfter(spaceNode);
-            }
-        }
-        const textNode = document.createTextNode(completionToApply);
-        range.insertNode(textNode);
-        range.setStartAfter(textNode);
-        range.setEndAfter(textNode);
-        selection.removeAllRanges();
-        selection.addRange(range);
-        setCurrentCompletion(null);
-        clearCursorSpan();
-        setTimeout(() => {
-            let valueToSave;
-            if (isRichText) {
-                const clone = element.cloneNode(true);
-                const cursorElem = clone.querySelector(`#${cursorSpanId}`);
-                if (cursorElem)
-                    cursorElem.parentNode?.removeChild(cursorElem);
-                const ownerDoc = clone.ownerDocument || document;
-                const walker = ownerDoc.createTreeWalker(clone, NodeFilter.SHOW_TEXT);
-                const toClean = [];
-                while (walker.nextNode()) {
-                    const tn = walker.currentNode;
-                    if (tn.nodeValue && tn.nodeValue.includes("\u200B"))
-                        toClean.push(tn);
-                }
-                toClean.forEach((tn) => (tn.nodeValue = tn.nodeValue?.replaceAll("\u200B", "") || ""));
-                valueToSave = clone.innerHTML;
-            }
-            else {
-                valueToSave = (element.innerText || "").replaceAll("\u200B", "");
-            }
-            editContext?.operations.editField({
-                field: {
-                    fieldId,
-                    fieldName: fieldName ?? undefined,
-                    item: { id: itemId, language, version },
-                },
-                originatingSlotId: slotContext?.slotId,
-                refresh: "none",
-                value: valueToSave,
-            });
-        }, 0);
-    }, [
-        pageViewContext.editorIframe,
-        fieldsContext?.inlineEditingFieldElement,
-        cursorSpanId,
-        clearCursorSpan,
-        editContext?.operations,
-        slotContext?.slotId,
-    ]);
-    applyCompletionRef.current = applyCompletion;
-    // Manual completion trigger (non-debounced)
-    const getCompletionManual = useCallback(async () => {
-        if (!canUseAi)
-            return;
-        const el = fieldsContext?.inlineEditingFieldElement;
-        if (!el)
-            return;
-        const full = getContentUpToCursor(el) || "";
-        const sentence = full.split(/[.?!]\s*/).pop() || "";
-        const rawSuggestion = await getCompletion(el, true);
-        if (!rawSuggestion) {
-            setCurrentCompletion(null);
-            clearCursorSpan();
-            return;
-        }
-        const suggestion = rawSuggestion.startsWith(sentence)
-            ? rawSuggestion
-            : sentence + rawSuggestion;
-        setCurrentCompletion(suggestion);
-        updateCursorSpan(suggestion.substring(sentence.length));
-    }, [
-        fieldsContext?.inlineEditingFieldElement,
-        canUseAi,
-        getContentUpToCursor,
-        getCompletion,
-        clearCursorSpan,
-        updateCursorSpan,
-    ]);
-    // On every input: either reuse the existing suggestion or fire a new one
-    const handleInput = useCallback((e) => {
-        if (!canUseAi) {
-            setCurrentCompletion(null);
-            clearCursorSpan();
-            return;
-        }
-        const el = fieldsContext?.inlineEditingFieldElement;
-        if (!el)
-            return;
-        // Clear completion when Escape is pressed
-        if (e.key === "Escape") {
-            e.preventDefault();
-            e.stopPropagation();
-            setCurrentCompletion(null);
-            clearCursorSpan();
-            return;
-        }
-        // Request new completion when Ctrl+Space is pressed
-        if (e.key === " " && (e.ctrlKey || e.metaKey)) {
-            e.preventDefault();
-            e.stopPropagation();
-            setCurrentCompletion(null);
-            clearCursorSpan();
-            getCompletionManual();
-            return;
-        }
-        // Apply completion when Tab is pressed
-        if (e.key === "Tab") {
-            // Check if there's an actual completion in the cursor span
-            const cursorSpan = getAccessibleIframeDocument(pageViewContext.editorIframe)?.getElementById(cursorSpanId);
-            if (cursorSpan &&
-                cursorSpan.textContent &&
-                cursorSpan.textContent.trim() !== "") {
-                e.preventDefault();
-                e.stopPropagation();
-                applyCompletion();
-                return;
-            }
-        }
-        const full = getContentUpToCursor(el) || "";
-        const sentence = full.split(/[.?!]\s*/).pop() || "";
-        // If we already have a suggestion, check if the user is still typing along it
-        // Normalize spaces to handle both regular and non-breaking spaces
-        const normalizedSentence = sentence.replace(/\s/g, " ");
-        const normalizedCompletion = currentCompletion?.replace(/\s/g, " ");
-        if (normalizedCompletion &&
-            normalizedCompletion.startsWith(normalizedSentence)) {
-            // user is still matching the suggestion → update the remaining tail
-            const remaining = normalizedCompletion.slice(normalizedSentence.length);
-            updateCursorSpan(remaining);
-            return;
-        }
-        // else: user diverged → drop it
-        setCurrentCompletion(null);
-        clearCursorSpan();
-        // No active suggestion → fire new request once they've typed 2+ words
-        const words = sentence.trim().split(/\s+/).filter(Boolean);
-        // Check if cursor is at the end of the text
-        const isAtEnd = () => {
-            const el = fieldsContext?.inlineEditingFieldElement;
-            if (!el)
-                return false;
-            const selection = getAccessibleIframeSelection(pageViewContext.editorIframe);
-            if (!selection || selection.rangeCount === 0)
-                return false;
-            const range = selection.getRangeAt(0);
-            // Create a range for the whole editable element
-            const fullRange = document.createRange();
-            fullRange.selectNodeContents(el);
-            // Get the full text content
-            const fullText = el.textContent || "";
-            // Get text up to cursor
-            const tempRange = document.createRange();
-            tempRange.selectNodeContents(el);
-            tempRange.setEnd(range.startContainer, range.startOffset);
-            const textUpToCursor = tempRange.toString();
-            // Cursor is at the end if the text up to cursor equals the full text
-            // (accounting for whitespace differences)
-            return (textUpToCursor.trim() === fullText.trim() ||
-                (fullText.trim().startsWith(textUpToCursor.trim()) &&
-                    fullText.trim().length === textUpToCursor.trim().length));
-        };
-        if (words.length >= 2 && isAtEnd()) {
-            getCompletionDebounced();
-        }
-        else {
-            setCurrentCompletion(null);
-            clearCursorSpan();
-        }
-    }, [
-        fieldsContext?.inlineEditingFieldElement,
-        getContentUpToCursor,
-        currentCompletion,
-        canUseAi,
-        clearCursorSpan,
-        getCompletionManual,
-        pageViewContext.editorIframe,
-        cursorSpanId,
-        applyCompletion,
-        updateCursorSpan,
-        getCompletionDebounced,
-    ]);
-    // Wire up the input listener
-    useEffect(() => {
-        if (!canUseAi || !editContext?.enableCompletions)
-            return;
-        const el = fieldsContext?.inlineEditingFieldElement;
-        if (!el)
-            return;
-        el.addEventListener("keydown", handleInput);
-        return () => el.removeEventListener("keydown", handleInput);
-    }, [
-        fieldsContext?.inlineEditingFieldElement,
-        handleInput,
-        canUseAi,
-        editContext?.enableCompletions,
-    ]);
-    // Add mouse click handler to update cursor span position
-    useEffect(() => {
-        if (!canUseAi || !editContext?.enableCompletions)
-            return;
-        const el = fieldsContext?.inlineEditingFieldElement;
-        if (!el)
-            return;
-        const handleMouseUp = () => {
-            setTimeout(() => {
-                if (!isUpdatingRef.current) {
-                    positionCursorSpan();
-                    // Clear existing completion when cursor position changes via mouse
-                    setCurrentCompletion(null);
-                    clearCursorSpan();
-                }
-            }, 10);
-        };
-        el.addEventListener("mouseup", handleMouseUp);
-        return () => el.removeEventListener("mouseup", handleMouseUp);
-    }, [
-        fieldsContext?.inlineEditingFieldElement,
-        canUseAi,
-        editContext?.enableCompletions,
-        isUpdatingRef,
-        positionCursorSpan,
-        clearCursorSpan,
-    ]);
-    // Clean up abort controller on unmount
-    useEffect(() => {
-        return () => {
-            if (abortControllerRef.current) {
-                abortControllerRef.current.abort();
-                abortControllerRef.current = null;
-            }
-            if (loadingAnimationRef.current) {
-                cancelAnimationFrame(loadingAnimationRef.current);
-                loadingAnimationRef.current = null;
-            }
-        };
-    }, []);
-    // Exposed manual trigger (if needed)
-    return useMemo(() => () => {
-        setCurrentCompletion(null);
-        clearCursorSpan();
-        if (canUseAi) {
-            getCompletionManual();
-        }
-    }, [canUseAi, clearCursorSpan, getCompletionManual]);
-}
-//# sourceMappingURL=useInlineAICompletion.js.map