import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
import { useEditContext } from "../client/editContext";
import { findFieldElement } from "../utils";
export function LockedFieldIndicator({ iframe, }) {
    const editContext = useEditContext();
    if (!editContext)
        return;
    const sessionsWithFieldLock = editContext.activeSessions.filter((x) => x.fieldLock && x.sessionId !== editContext.sessionId);
    const effectiveIframe = iframe ?? editContext.getActiveSlotContext()?.primaryPageViewContext.editorIframe;
    return (_jsx(_Fragment, { children: sessionsWithFieldLock.map((session) => {
            if (!session.fieldLock)
                return;
            if (!effectiveIframe)
                return;
            const element = findFieldElement(effectiveIframe, session.fieldLock);
            if (!element)
                return;
            return (_jsx(FieldLock, { element: element, iframe: effectiveIframe, session: session }, session.sessionId));
        }) }));
}
function FieldLock({ element, iframe, session, }) {
    const rect = element.getBoundingClientRect();
    const editorRect = iframe.getBoundingClientRect();
    if (rect && editorRect) {
        return (_jsx("div", { className: "absolute rounded p-0.5 text-xs text-white opacity-90 hover:opacity-100", style: {
                left: rect.left + "px",
                top: rect.top + "px",
                background: session.color,
            }, children: session.user.name }));
    }
    return null;
}
//# sourceMappingURL=LockedFieldIndicator.js.map