@alpaca-editor/core 1.0.0 → 1.0.3

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

@@ -0,0 +1,13 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { FieldActionIndicator } from "./FieldActionIndicator";
+import { useEditContext } from "../client/editContext";
+export function FieldActionsIndicators() {
+    const editContext = useEditContext();
+    if (!editContext)
+        return null;
+    const actions = editContext.activeFieldActions;
+    return (_jsx(_Fragment, { children: actions
+            .filter((x) => x.state === "running")
+            .map((action) => (_jsx(FieldActionIndicator, { action: action }, action.field.fieldId + action.field.item.id))) }));
+}
+//# sourceMappingURL=FieldActionIndicators.js.map

package/dist/editor/page-editor-chrome/FieldActionIndicators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldActionIndicators.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/FieldActionIndicators.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,MAAM,UAAU,sBAAsB;IACpC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAE9B,MAAM,OAAO,GAAG,WAAW,CAAC,kBAAkB,CAAC;IAE/C,OAAO,CACL,4BACG,OAAO;aACL,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,SAAS,CAAC;aACpC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACf,KAAC,oBAAoB,IACnB,MAAM,EAAE,MAAM,IACT,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAChD,CACH,CAAC,GACH,CACJ,CAAC;AACJ,CAAC"}

package/dist/editor/page-editor-chrome/FieldEditedIndicator.d.ts

@@ -0,0 +1,8 @@
+import { EditedField } from "../client/editContext";
+import { PageViewContext } from "../page-viewer/pageViewContext";
+export declare function FieldEditedIndicator({ field, scale, pageViewContext, scroll, }: {
+    field: EditedField;
+    scale?: number;
+    pageViewContext: PageViewContext;
+    scroll?: number;
+}): import("react/jsx-runtime").JSX.Element | null;

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

@@ -0,0 +1,25 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEditContext } from "../client/editContext";
+export function FieldEditedIndicator({ field, scale, pageViewContext, scroll, }) {
+    const editContext = useEditContext();
+    if (!editContext)
+        return null;
+    const fieldElements = pageViewContext.editorIframeRef.current?.contentWindow?.document.querySelectorAll(`[data-fieldid="${field.fieldId}"][data-itemid="${field.item.id}"][data-language="${field.item.language}"][data-version="${field.item.version}"]`);
+    if (!fieldElements)
+        return null;
+    return (_jsx(_Fragment, { children: [...fieldElements]
+            .filter((x) => x != editContext.inlineEditingFieldElement)
+            .map((element) => (_jsx(SingleFieldEditedIndicator, { element: element, scale: scale, scroll: scroll }, field.fieldId + field.item.id))) }));
+}
+function SingleFieldEditedIndicator({ element, scale, scroll, }) {
+    const rect = element.getBoundingClientRect();
+    const indicatorRect = rect;
+    return (_jsx("div", { className: `pointer-events-none absolute focus-shadow edited-field`, style: {
+            left: indicatorRect.x * (scale || 1),
+            top: (indicatorRect.y + (scroll || 0)) * (scale || 1),
+            width: indicatorRect.width * (scale || 1),
+            height: indicatorRect.height * (scale || 1),
+            zIndex: 800,
+        } }));
+}
+//# sourceMappingURL=FieldEditedIndicator.js.map

package/dist/editor/page-editor-chrome/FieldEditedIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldEditedIndicator.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/FieldEditedIndicator.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAe,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGpE,MAAM,UAAU,oBAAoB,CAAC,EACnC,KAAK,EACL,KAAK,EACL,eAAe,EACf,MAAM,GAMP;IACC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAE9B,MAAM,aAAa,GACjB,eAAe,CAAC,eAAe,CAAC,OAAO,EAAE,aAAa,EAAE,QAAQ,CAAC,gBAAgB,CAC/E,kBAAkB,KAAK,CAAC,OAAO,mBAAmB,KAAK,CAAC,IAAI,CAAC,EAAE,qBAAqB,KAAK,CAAC,IAAI,CAAC,QAAQ,oBAAoB,KAAK,CAAC,IAAI,CAAC,OAAO,IAAI,CAClJ,CAAC;IAEJ,IAAI,CAAC,aAAa;QAAE,OAAO,IAAI,CAAC;IAChC,OAAO,CACL,4BACG,CAAC,GAAG,aAAa,CAAC;aAChB,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,WAAW,CAAC,yBAAyB,CAAC;aACzD,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAChB,KAAC,0BAA0B,IACzB,OAAO,EAAE,OAAO,EAEhB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,IAFT,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,CAGlC,CACH,CAAC,GACH,CACJ,CAAC;AACJ,CAAC;AAED,SAAS,0BAA0B,CAAC,EAClC,OAAO,EACP,KAAK,EACL,MAAM,GAKP;IACC,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;IAE7C,MAAM,aAAa,GAAG,IAAI,CAAC;IAC3B,OAAO,CACL,cACE,SAAS,EAAE,wDAAwD,EACnE,KAAK,EAAE;YACL,IAAI,EAAE,aAAa,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,CAAC;YACpC,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,CAAC;YACrD,KAAK,EAAE,aAAa,CAAC,KAAK,GAAG,CAAC,KAAK,IAAI,CAAC,CAAC;YACzC,MAAM,EAAE,aAAa,CAAC,MAAM,GAAG,CAAC,KAAK,IAAI,CAAC,CAAC;YAC3C,MAAM,EAAE,GAAG;SACZ,GACD,CACH,CAAC;AACJ,CAAC"}

package/dist/editor/page-editor-chrome/FieldEditedIndicators.d.ts

@@ -0,0 +1,6 @@
+import { PageViewContext } from "../page-viewer/pageViewContext";
+export declare function FieldEditedIndicators({ scale, pageViewContext, scroll, }: {
+    scale?: number;
+    pageViewContext: PageViewContext;
+    scroll?: number;
+}): import("react/jsx-runtime").JSX.Element | null;

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

@@ -0,0 +1,13 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEditContext } from "../client/editContext";
+import { FieldEditedIndicator } from "./FieldEditedIndicator";
+export function FieldEditedIndicators({ scale, pageViewContext, scroll, }) {
+    const editContext = useEditContext();
+    if (!editContext)
+        return null;
+    const fields = editContext.lastEditedFields;
+    return (_jsx(_Fragment, { children: fields
+            .filter((x) => x.timestamp > Date.now() - 10000 && x.user.ai)
+            .map((field) => (_jsx(FieldEditedIndicator, { field: field, scale: scale, pageViewContext: pageViewContext, scroll: scroll }, field.fieldId + field.item.id + field.timestamp))) }));
+}
+//# sourceMappingURL=FieldEditedIndicators.js.map

package/dist/editor/page-editor-chrome/FieldEditedIndicators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldEditedIndicators.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/FieldEditedIndicators.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D,MAAM,UAAU,qBAAqB,CAAC,EACpC,KAAK,EACL,eAAe,EACf,MAAM,GAKP;IACC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAE9B,MAAM,MAAM,GAAG,WAAW,CAAC,gBAAgB,CAAC;IAE5C,OAAO,CACL,4BACG,MAAM;aACJ,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;aAC5D,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACd,KAAC,oBAAoB,IACnB,KAAK,EAAE,KAAK,EAEZ,KAAK,EAAE,KAAK,EACZ,eAAe,EAAE,eAAe,EAChC,MAAM,EAAE,MAAM,IAHT,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,GAAG,KAAK,CAAC,SAAS,CAIpD,CACH,CAAC,GACH,CACJ,CAAC;AACJ,CAAC"}

package/dist/editor/page-editor-chrome/FrameMenu.d.ts

@@ -0,0 +1,7 @@
+import { Component } from "../pageModel";
+import { PageViewContext } from "../page-viewer/pageViewContext";
+export declare function FrameMenu({ component, mode, pageViewContext, }: {
+    component: Component;
+    mode: "edit" | "compare" | "view";
+    pageViewContext: PageViewContext;
+}): import("react/jsx-runtime").JSX.Element | null;

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

@@ -0,0 +1,176 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { useEditContext } from "../client/editContext";
+import { findComponentRect } from "../utils";
+import { useThrottledCallback } from "use-debounce";
+export function FrameMenu({ component, mode, pageViewContext, }) {
+    const editContext = useEditContext();
+    const resizeObserverRef = useRef(null);
+    const mutationObserverRef = useRef(null);
+    const [componentRect, setComponentRect] = useState();
+    const updatePosition = () => {
+        if (!component || !editContext || !pageViewContext)
+            return;
+        const iframe = pageViewContext.editorIframeRef.current;
+        if (!iframe)
+            return;
+        const resetSelection = () => {
+            setComponentRect(undefined);
+        };
+        const componentRect = findComponentRect(iframe, component.id)?.rect;
+        if (!componentRect) {
+            resetSelection();
+            return;
+        }
+        setComponentRect(componentRect);
+    };
+    const updatePositionThrottled = useThrottledCallback(updatePosition, 30);
+    // Effect to handle changes in the observed element
+    useEffect(() => {
+        if (component) {
+            const iframe = pageViewContext.editorIframeRef.current;
+            if (!iframe)
+                return;
+            mutationObserverRef.current = new MutationObserver(() => {
+                updatePosition();
+            });
+            if (!iframe.contentDocument)
+                return;
+            mutationObserverRef.current.observe(iframe.contentDocument, {
+                childList: true, // observe direct children changes
+                subtree: true, // observe all descendants changes
+                characterData: true, // observe text changes
+                //attributes: true, // observe attribute changes (like style or class)
+            });
+            // Create a new ResizeObserver instance
+            resizeObserverRef.current = new ResizeObserver(() => {
+                updatePosition();
+            });
+            const scrollContainer = iframe.contentWindow?.document.scrollingElement ||
+                iframe.contentWindow?.document.body;
+            scrollContainer?.addEventListener("scroll", updatePositionThrottled);
+            iframe.contentWindow?.addEventListener("scroll", updatePositionThrottled);
+            const componentRect = findComponentRect(iframe, component.id);
+            if (!componentRect) {
+                updatePosition();
+                return;
+            }
+            componentRect.elements.forEach((componentElement) => {
+                resizeObserverRef.current.observe(componentElement);
+            });
+        }
+        return () => {
+            if (mutationObserverRef.current) {
+                mutationObserverRef.current.disconnect();
+                mutationObserverRef.current = null;
+            }
+            if (resizeObserverRef.current) {
+                resizeObserverRef.current.disconnect();
+                resizeObserverRef.current = null;
+            }
+        };
+    }, [component]);
+    useEffect(() => {
+        setTimeout(() => {
+            updatePosition();
+        }, 100);
+    }, [
+        pageViewContext?.scroll,
+        pageViewContext?.viewport,
+        pageViewContext?.device,
+        pageViewContext?.fullscreen,
+        pageViewContext?.zoom,
+    ]);
+    if (!component || !editContext)
+        return null;
+    const commands = editContext.getComponentCommands([component]);
+    const isDraggable = mode === "edit" &&
+        !component.layoutId &&
+        pageViewContext.page?.item.canWriteItem;
+    false;
+    const commandButtons = commands
+        .filter((x) => !editContext.isCommandDisabled({ command: x }) &&
+        x.visibilityScopes.indexOf("editFrame") >= 0)
+        .map((x) => ({
+        id: x.id + "_button",
+        icon: x.icon,
+        label: x.label,
+        onClick: (ev) => {
+            ev.stopPropagation();
+            ev.preventDefault();
+            editContext.executeCommand({
+                command: x,
+                event: ev,
+            });
+        },
+    }));
+    const customButtons = []; // TODO
+    let buttons = [...customButtons];
+    buttons = [...buttons, ...commandButtons];
+    function handleDragStart(event) {
+        if (!component?.datasourceItem)
+            return;
+        event.dataTransfer.setData("componentId", component.id);
+        setTimeout(() => {
+            if (!component?.datasourceItem)
+                return;
+            editContext.dragStart({
+                type: "component",
+                typeId: component.typeId,
+                templateId: component.datasourceItem?.templateId,
+                name: component.name,
+                component: {
+                    id: component.id,
+                    language: pageViewContext.page.item.language,
+                    version: pageViewContext.page.item.version,
+                },
+            });
+        }, 50);
+        event.stopPropagation();
+    }
+    function handleDragEnd() {
+        editContext.dragEnd();
+    }
+    const isShared = component.datasourceItem?.id !== component.id;
+    const isReadonly = mode === "compare" || mode === "view";
+    const isLayout = component.layoutId;
+    const color = isReadonly
+        ? "readonly"
+        : isShared
+            ? "shared"
+            : isLayout
+                ? "layout"
+                : "default";
+    const colorVariants = {
+        shared: "border-orange-400",
+        readonly: "border-purple-400",
+        layout: "border-purple-400",
+        default: "border-sky-400",
+    };
+    const bgColorVariants = {
+        shared: "bg-orange-400",
+        readonly: "bg-purple-400",
+        layout: "bg-purple-400",
+        default: "bg-sky-400",
+    };
+    if (!componentRect)
+        return null;
+    const isMultiSelected = editContext.selection.length > 1;
+    return (_jsx(_Fragment, { children: _jsx("div", { className: `pointer-events-none absolute inset-0 border-2 ${colorVariants[color]} tour-frame-menu opacity-50 hover:opacity-100`, style: {
+                left: componentRect.x,
+                top: componentRect.y,
+                width: componentRect.width,
+                height: componentRect.height,
+                zIndex: 8,
+            }, "data-testid": "frame-menu", children: !isMultiSelected && (_jsxs("div", { className: `editframe-menu pointer-events-auto absolute z-1000 flex items-center pr-4 text-base text-white ${bgColorVariants[color]} ` +
+                    (componentRect.y - 36 < 0 ? "rounded-bl-lg" : "rounded-t-lg"), style: {
+                    right: "-2px",
+                    top: componentRect.y - 36 < 0 ? "0" : undefined,
+                    bottom: componentRect.y - 36 >= 0
+                        ? componentRect.height - 2
+                        : undefined,
+                    zIndex: 800,
+                    height: "36px",
+                }, children: [_jsx("div", { draggable: isDraggable, onDragStart: handleDragStart, onDragEnd: handleDragEnd, className: `px-4 ${isDraggable ? "cursor-move" : "cursor-default"} `, children: component.name }), mode === "edit" && (_jsx("div", { className: "flex items-center gap-2", children: buttons.map((b, i) => (_jsx("div", { className: "cursor-pointer p-1", children: typeof b.icon === "string" ? (_jsx("i", { className: b.icon + " cursor-pointer", onClick: b.onClick, title: b.label })) : (b.icon) }, i))) }))] })) }) }));
+}
+//# sourceMappingURL=FrameMenu.js.map

package/dist/editor/page-editor-chrome/FrameMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FrameMenu.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/FrameMenu.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAc,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,EAAQ,iBAAiB,EAAE,MAAM,UAAU,CAAC;AACnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,UAAU,SAAS,CAAC,EACxB,SAAS,EACT,IAAI,EACJ,eAAe,GAKhB;IACC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,iBAAiB,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAC9D,MAAM,mBAAmB,GAAG,MAAM,CAA0B,IAAI,CAAC,CAAC;IAElE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAQ,CAAC;IAE3D,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,IAAI,CAAC,SAAS,IAAI,CAAC,WAAW,IAAI,CAAC,eAAe;YAAE,OAAO;QAE3D,MAAM,MAAM,GAAG,eAAe,CAAC,eAAe,CAAC,OAAO,CAAC;QAEvD,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,MAAM,cAAc,GAAG,GAAG,EAAE;YAC1B,gBAAgB,CAAC,SAAS,CAAC,CAAC;QAC9B,CAAC,CAAC;QAEF,MAAM,aAAa,GAAG,iBAAiB,CAAC,MAAM,EAAE,SAAS,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC;QAEpE,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,cAAc,EAAE,CAAC;YACjB,OAAO;QACT,CAAC;QAED,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,oBAAoB,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC;IAEzE,mDAAmD;IACnD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE,CAAC;YACd,MAAM,MAAM,GAAG,eAAgB,CAAC,eAAe,CAAC,OAAO,CAAC;YACxD,IAAI,CAAC,MAAM;gBAAE,OAAO;YAEpB,mBAAmB,CAAC,OAAO,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;gBACtD,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,MAAM,CAAC,eAAe;gBAAE,OAAO;YAEpC,mBAAmB,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE;gBAC1D,SAAS,EAAE,IAAI,EAAE,kCAAkC;gBACnD,OAAO,EAAE,IAAI,EAAE,kCAAkC;gBACjD,aAAa,EAAE,IAAI,EAAE,uBAAuB;gBAC5C,sEAAsE;aACvE,CAAC,CAAC;YACH,uCAAuC;YACvC,iBAAiB,CAAC,OAAO,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;gBAClD,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,CAAC;YAEH,MAAM,eAAe,GACnB,MAAM,CAAC,aAAa,EAAE,QAAQ,CAAC,gBAAgB;gBAC/C,MAAM,CAAC,aAAa,EAAE,QAAQ,CAAC,IAAI,CAAC;YAEtC,eAAe,EAAE,gBAAgB,CAAC,QAAQ,EAAE,uBAAuB,CAAC,CAAC;YACrE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,QAAQ,EAAE,uBAAuB,CAAC,CAAC;YAE1E,MAAM,aAAa,GAAG,iBAAiB,CAAC,MAAM,EAAE,SAAS,CAAC,EAAE,CAAC,CAAC;YAE9D,IAAI,CAAC,aAAa,EAAE,CAAC;gBACnB,cAAc,EAAE,CAAC;gBACjB,OAAO;YACT,CAAC;YAED,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,gBAAgB,EAAE,EAAE;gBAClD,iBAAiB,CAAC,OAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;YACvD,CAAC,CAAC,CAAC;QACL,CAAC;QAED,OAAO,GAAG,EAAE;YACV,IAAI,mBAAmB,CAAC,OAAO,EAAE,CAAC;gBAChC,mBAAmB,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;gBACzC,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC;YACrC,CAAC;YACD,IAAI,iBAAiB,CAAC,OAAO,EAAE,CAAC;gBAC9B,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;gBACvC,iBAAiB,CAAC,OAAO,GAAG,IAAI,CAAC;YACnC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,GAAG,EAAE;YACd,cAAc,EAAE,CAAC;QACnB,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC,EAAE;QACD,eAAe,EAAE,MAAM;QACvB,eAAe,EAAE,QAAQ;QACzB,eAAe,EAAE,MAAM;QACvB,eAAe,EAAE,UAAU;QAC3B,eAAe,EAAE,IAAI;KACtB,CAAC,CAAC;IAEH,IAAI,CAAC,SAAS,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAE5C,MAAM,QAAQ,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAC/D,MAAM,WAAW,GACf,IAAI,KAAK,MAAM;QACf,CAAC,SAAS,CAAC,QAAQ;QACnB,eAAe,CAAC,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC;IAC1C,KAAK,CAAC;IAEN,MAAM,cAAc,GAAG,QAAQ;SAC5B,MAAM,CACL,CAAC,CAAC,EAAE,EAAE,CACJ,CAAC,WAAW,CAAC,iBAAiB,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;QAC9C,CAAC,CAAC,gBAAgB,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAC/C;SACA,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QACX,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,SAAS;QACpB,IAAI,EAAE,CAAC,CAAC,IAAI;QACZ,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,OAAO,EAAE,CAAC,EAAO,EAAE,EAAE;YACnB,EAAE,CAAC,eAAe,EAAE,CAAC;YACrB,EAAE,CAAC,cAAc,EAAE,CAAC;YACpB,WAAW,CAAC,cAAc,CAAC;gBACzB,OAAO,EAAE,CAAC;gBACV,KAAK,EAAE,EAAE;aACV,CAAC,CAAC;QACL,CAAC;KACF,CAAC,CAAC,CAAC;IAEN,MAAM,aAAa,GAAiB,EAAE,CAAC,CAAC,OAAO;IAC/C,IAAI,OAAO,GAAG,CAAC,GAAG,aAAa,CAAC,CAAC;IAEjC,OAAO,GAAG,CAAC,GAAG,OAAO,EAAE,GAAG,cAAc,CAAC,CAAC;IAE1C,SAAS,eAAe,CAAC,KAAsC;QAC7D,IAAI,CAAC,SAAS,EAAE,cAAc;YAAE,OAAO;QACvC,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,EAAE,SAAS,CAAC,EAAE,CAAC,CAAC;QACxD,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,SAAS,EAAE,cAAc;gBAAE,OAAO;YACvC,WAAY,CAAC,SAAS,CAAC;gBACrB,IAAI,EAAE,WAAW;gBACjB,MAAM,EAAE,SAAS,CAAC,MAAM;gBACxB,UAAU,EAAE,SAAS,CAAC,cAAc,EAAE,UAAU;gBAChD,IAAI,EAAE,SAAS,CAAC,IAAI;gBACpB,SAAS,EAAE;oBACT,EAAE,EAAE,SAAS,CAAC,EAAE;oBAChB,QAAQ,EAAE,eAAe,CAAC,IAAK,CAAC,IAAI,CAAC,QAAQ;oBAC7C,OAAO,EAAE,eAAe,CAAC,IAAK,CAAC,IAAI,CAAC,OAAO;iBAC5C;aACF,CAAC,CAAC;QACL,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,KAAK,CAAC,eAAe,EAAE,CAAC;IAC1B,CAAC;IAED,SAAS,aAAa;QACpB,WAAY,CAAC,OAAO,EAAE,CAAC;IACzB,CAAC;IAED,MAAM,QAAQ,GAAG,SAAS,CAAC,cAAc,EAAE,EAAE,KAAK,SAAS,CAAC,EAAE,CAAC;IAC/D,MAAM,UAAU,GAAG,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,MAAM,CAAC;IACzD,MAAM,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAAC;IAEpC,MAAM,KAAK,GAAG,UAAU;QACtB,CAAC,CAAC,UAAU;QACZ,CAAC,CAAC,QAAQ;YACR,CAAC,CAAC,QAAQ;YACV,CAAC,CAAC,QAAQ;gBACR,CAAC,CAAC,QAAQ;gBACV,CAAC,CAAC,SAAS,CAAC;IAElB,MAAM,aAAa,GAAG;QACpB,MAAM,EAAE,mBAAmB;QAC3B,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE,mBAAmB;QAC3B,OAAO,EAAE,gBAAgB;KAC1B,CAAC;IAEF,MAAM,eAAe,GAAG;QACtB,MAAM,EAAE,eAAe;QACvB,QAAQ,EAAE,eAAe;QACzB,MAAM,EAAE,eAAe;QACvB,OAAO,EAAE,YAAY;KACtB,CAAC;IACF,IAAI,CAAC,aAAa;QAAE,OAAO,IAAI,CAAC;IAEhC,MAAM,eAAe,GAAG,WAAW,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC;IAEzD,OAAO,CACL,4BACE,cACE,SAAS,EAAE,iDAAiD,aAAa,CAAC,KAAK,CAAC,+CAA+C,EAC/H,KAAK,EAAE;gBACL,IAAI,EAAE,aAAa,CAAC,CAAC;gBACrB,GAAG,EAAE,aAAa,CAAC,CAAC;gBACpB,KAAK,EAAE,aAAa,CAAC,KAAK;gBAC1B,MAAM,EAAE,aAAa,CAAC,MAAM;gBAC5B,MAAM,EAAE,CAAC;aACV,iBACW,YAAY,YAEvB,CAAC,eAAe,IAAI,CACnB,eACE,SAAS,EACP,kGAAkG,eAAe,CAAC,KAAK,CAAC,GAAG;oBAC3H,CAAC,aAAa,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC,EAE/D,KAAK,EAAE;oBACL,KAAK,EAAE,MAAM;oBACb,GAAG,EAAE,aAAa,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS;oBAC/C,MAAM,EACJ,aAAa,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC;wBACvB,CAAC,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC;wBAC1B,CAAC,CAAC,SAAS;oBACf,MAAM,EAAE,GAAG;oBACX,MAAM,EAAE,MAAM;iBACf,aAED,cACE,SAAS,EAAE,WAAW,EACtB,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,aAAa,EACxB,SAAS,EAAE,QACT,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,gBAChC,GAAG,YAEF,SAAS,CAAC,IAAI,GACX,EACL,IAAI,KAAK,MAAM,IAAI,CAClB,cAAK,SAAS,EAAC,yBAAyB,YACrC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACrB,cAAK,SAAS,EAAC,oBAAoB,YAChC,OAAO,CAAC,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC5B,YACE,SAAS,EAAE,CAAC,CAAC,IAAI,GAAG,iBAAiB,EACrC,OAAO,EAAE,CAAC,CAAC,OAAO,EAClB,KAAK,EAAE,CAAC,CAAC,KAAK,GACd,CACH,CAAC,CAAC,CAAC,CACF,CAAC,CAAC,IAAI,CACP,IATsC,CAAC,CAUpC,CACP,CAAC,GACE,CACP,IACG,CACP,GACG,GACL,CACJ,CAAC;AACJ,CAAC"}

package/dist/editor/page-editor-chrome/FrameMenus.d.ts

@@ -0,0 +1,5 @@
+import { PageViewContext } from "../page-viewer/pageViewContext";
+export declare function FrameMenus({ mode, pageViewContext, }: {
+    mode: "edit" | "compare" | "view";
+    pageViewContext: PageViewContext;
+}): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,22 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { findComponent } from "../componentTreeHelper";
+import { useEditContext } from "../client/editContext";
+import { FrameMenu } from "./FrameMenu";
+export function FrameMenus({ mode, pageViewContext, }) {
+    const editContext = useEditContext();
+    const selection = editContext?.selection;
+    const [components, setComponents] = useState([]);
+    useEffect(() => {
+        if (!pageViewContext.page)
+            return;
+        const comps = selection
+            ? selection
+                .map((id) => findComponent(id, pageViewContext.page?.rootComponent.placeholders || []))
+                .filter((c) => c !== undefined)
+            : [];
+        setComponents(comps);
+    }, [selection, pageViewContext.page]);
+    return (_jsxs(_Fragment, { children: [components.map((c) => (_jsx(FrameMenu, { component: c, mode: mode, pageViewContext: pageViewContext }, c.id))), " "] }));
+}
+//# sourceMappingURL=FrameMenus.js.map

package/dist/editor/page-editor-chrome/FrameMenus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FrameMenus.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/FrameMenus.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,MAAM,UAAU,UAAU,CAAC,EACzB,IAAI,EACJ,eAAe,GAIhB;IACC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,WAAW,EAAE,SAAS,CAAC;IAEzC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAc,EAAE,CAAC,CAAC;IAE9D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,eAAe,CAAC,IAAI;YAAE,OAAO;QAElC,MAAM,KAAK,GAAgB,SAAS;YAClC,CAAC,CAAC,SAAS;iBACN,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CACV,aAAa,CACX,EAAE,EACF,eAAe,CAAC,IAAI,EAAE,aAAa,CAAC,YAAY,IAAI,EAAE,CACvD,CACF;iBACA,MAAM,CAAC,CAAC,CAAC,EAA8B,EAAE,CAAC,CAAC,KAAK,SAAS,CAAC;YAC/D,CAAC,CAAC,EAAE,CAAC;QAEP,aAAa,CAAC,KAAK,CAAC,CAAC;IACvB,CAAC,EAAE,CAAC,SAAS,EAAE,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;IAEtC,OAAO,CACL,8BACG,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACrB,KAAC,SAAS,IAER,SAAS,EAAE,CAAC,EACZ,IAAI,EAAE,IAAI,EACV,eAAe,EAAE,eAAe,IAH3B,CAAC,CAAC,EAAE,CAIT,CACH,CAAC,EAAE,GAAG,IACN,CACJ,CAAC;AACJ,CAAC"}

package/dist/editor/page-editor-chrome/InlineEditor.d.ts

@@ -0,0 +1,5 @@
+import { PageViewContext } from "../page-viewer/pageViewContext";
+export declare function InlineEditor({ pageViewContext, mode, }: {
+    pageViewContext: PageViewContext;
+    mode: "edit" | "view";
+}): null | undefined;

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

@@ -0,0 +1,99 @@
+import { useEffect, useRef } from "react";
+import { useEditContext, useModifiedFieldsContext, } from "../client/editContext";
+import { useThrottledCallback } from "use-debounce";
+import { getFieldDescriptorFromElement, hasFieldLock } from "../utils";
+export function InlineEditor({ pageViewContext, mode, }) {
+    const context = useEditContext();
+    const modifiedFieldsContext = useModifiedFieldsContext();
+    if (!context)
+        return;
+    const mutationObserverRef = useRef(null);
+    const debouncedSetFieldvalue = useThrottledCallback((value, fieldId, fieldName, itemId, language, version) => {
+        var modifiedFieldValue = modifiedFieldsContext?.modifiedFields.find((x) => x.fieldId === fieldId &&
+            x.item.id === itemId &&
+            x.item.language === language &&
+            x.item.version === version)?.value;
+        if (modifiedFieldValue === value)
+            return;
+        context.operations.editField({
+            field: {
+                fieldId,
+                fieldName: fieldName ?? undefined,
+                item: {
+                    id: itemId,
+                    language,
+                    version,
+                },
+            },
+            refresh: "none",
+            value: value,
+        });
+    }, context.configuration.debounceFieldEditsInterval);
+    useEffect(() => {
+        if (!context || mode === "view")
+            return;
+        const element = context.inlineEditingFieldElement;
+        const editableElements = pageViewContext.editorIframeRef.current?.contentWindow?.document.querySelectorAll('[contenteditable="true"]');
+        editableElements?.forEach((element) => {
+            if (element !== context.inlineEditingFieldElement)
+                element.setAttribute("contenteditable", "false");
+        });
+        if (element) {
+            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 versionText = element.getAttribute("data-version");
+            const version = versionText ? parseInt(versionText) : undefined;
+            const isRichText = element.getAttribute("data-is-richtext") === "true";
+            if (!fieldId || !itemId || !language || !version)
+                return;
+            const fieldDescriptor = getFieldDescriptorFromElement(element);
+            const hasFielLock = hasFieldLock(fieldDescriptor, context);
+            if (!hasFielLock)
+                return;
+            element.setAttribute("contenteditable", "true");
+            mutationObserverRef.current = new MutationObserver(() => {
+                debouncedSetFieldvalue(isRichText ? element.innerHTML : element.innerText, fieldId, fieldName, itemId, language, version);
+            });
+            element.focus();
+            mutationObserverRef.current.observe(element, {
+                childList: true, // observe direct children changes
+                subtree: true, // observe all descendants changes
+                characterData: true, // observe text changes
+                //attributes: true, // observe attribute changes (like style or class)
+            });
+        }
+        return () => {
+            if (mutationObserverRef.current) {
+                mutationObserverRef.current.disconnect();
+                mutationObserverRef.current = null;
+            }
+        };
+    }, [context?.inlineEditingFieldElement]);
+    useEffect(() => {
+        const updateFields = async () => {
+            modifiedFieldsContext?.modifiedFields.forEach((field) => {
+                const elements = pageViewContext.editorIframeRef.current.contentWindow?.document.querySelectorAll(`[data-fieldid="${field.fieldId}"][data-itemid="${field.item.id}"][data-language="${field.item.language}"][data-version="${field.item.version}"`);
+                elements?.forEach(async (element) => {
+                    if (element && element !== context?.inlineEditingFieldElement) {
+                        const realField = await context.itemsRepository.getField(field);
+                        const fieldType = realField?.type;
+                        if (fieldType === "rich text" ||
+                            fieldType === "single-line text" ||
+                            fieldType === "multi-line text") {
+                            element.innerHTML = field?.value ? field.value : "";
+                        }
+                    }
+                });
+            });
+        };
+        updateFields();
+    }, [
+        modifiedFieldsContext?.modifiedFields,
+        context?.itemsRepository.revision,
+        context?.inlineEditingFieldElement,
+    ]);
+    return null;
+}
+//# sourceMappingURL=InlineEditor.js.map

package/dist/editor/page-editor-chrome/InlineEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineEditor.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/InlineEditor.tsx"],"names":[],"mappings":"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"}

package/dist/editor/page-editor-chrome/LockedFieldIndicator.d.ts

@@ -0,0 +1 @@
+export declare function LockedFieldIndicator(): import("react/jsx-runtime").JSX.Element | undefined;

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

@@ -0,0 +1,33 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEditContext } from "../client/editContext";
+import { findFieldElement } from "../utils";
+export function LockedFieldIndicator() {
+    const editContext = useEditContext();
+    if (!editContext)
+        return;
+    const sessionsWithFieldLock = editContext.activeSessions.filter((x) => x.fieldLock && x.sessionId !== editContext.sessionId);
+    return (_jsx(_Fragment, { children: sessionsWithFieldLock.map((session) => {
+            if (!session.fieldLock)
+                return;
+            const iframe = editContext.pageView.editorIframeRef.current;
+            if (!iframe)
+                return;
+            const element = findFieldElement(iframe, session.fieldLock);
+            if (!element)
+                return;
+            return (_jsx(FieldLock, { element: element, iframe: iframe, 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  text-xs text-white p-0.5 rounded hover:opacity-100 opacity-90", style: {
+                left: rect.left + "px",
+                top: rect.top + "px",
+                background: session.color,
+            }, children: session.user.name }));
+    }
+    return null;
+}
+//# sourceMappingURL=LockedFieldIndicator.js.map

package/dist/editor/page-editor-chrome/LockedFieldIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LockedFieldIndicator.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/LockedFieldIndicator.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAG5C,MAAM,UAAU,oBAAoB;IAClC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,IAAI,CAAC,WAAW;QAAE,OAAO;IAEzB,MAAM,qBAAqB,GAAG,WAAW,CAAC,cAAc,CAAC,MAAM,CAC7D,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,CAAC,SAAS,KAAK,WAAW,CAAC,SAAS,CAC5D,CAAC;IAEF,OAAO,CACL,4BACG,qBAAqB,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;YACrC,IAAI,CAAC,OAAO,CAAC,SAAS;gBAAE,OAAO;YAC/B,MAAM,MAAM,GAAG,WAAW,CAAC,QAAQ,CAAC,eAAe,CAAC,OAAO,CAAC;YAC5D,IAAI,CAAC,MAAM;gBAAE,OAAO;YACpB,MAAM,OAAO,GAAG,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;YAC5D,IAAI,CAAC,OAAO;gBAAE,OAAO;YAErB,OAAO,CACL,KAAC,SAAS,IAER,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,IAHX,OAAO,CAAC,SAAS,CAItB,CACH,CAAC;QACJ,CAAC,CAAC,GACD,CACJ,CAAC;AACJ,CAAC;AACD,SAAS,SAAS,CAAC,EACjB,OAAO,EACP,MAAM,EACN,OAAO,GAKR;IACC,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;IAC7C,MAAM,UAAU,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;IAElD,IAAI,IAAI,IAAI,UAAU,EAAE,CAAC;QACvB,OAAO,CACL,cACE,SAAS,EAAC,yEAAyE,EACnF,KAAK,EAAE;gBACL,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI;gBACtB,GAAG,EAAE,IAAI,CAAC,GAAG,GAAG,IAAI;gBACpB,UAAU,EAAE,OAAO,CAAC,KAAK;aAC1B,YAEA,OAAO,CAAC,IAAI,CAAC,IAAI,GACd,CACP,CAAC;IACJ,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC"}

package/dist/editor/page-editor-chrome/NoLayout.d.ts

@@ -0,0 +1 @@
+export declare function NoLayout(): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,19 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { useEditContext } from "../client/editContext";
+export function NoLayout() {
+    const [lastPageItem, setLastPageItem] = useState(null);
+    const editContext = useEditContext();
+    useEffect(() => {
+        const updateLastPage = async () => {
+            if (!editContext?.pageView.pageItemDescriptor)
+                return;
+            const lastPage = await editContext.itemsRepository.getItem(editContext.pageView.pageItemDescriptor);
+            if (lastPage)
+                setLastPageItem(lastPage);
+        };
+        updateLastPage();
+    }, [editContext?.currentItemDescriptor]);
+    return (_jsxs("div", { className: "h-full w-full flex flex-col items-center justify-center text-sm", children: ["Item has no layout.", lastPageItem && (_jsxs("div", { className: "cursor-pointer hover:underline p-2", onClick: () => editContext?.loadItem(lastPageItem.descriptor), children: ["Load ", lastPageItem?.name, "?"] }))] }));
+}
+//# sourceMappingURL=NoLayout.js.map

package/dist/editor/page-editor-chrome/NoLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NoLayout.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/NoLayout.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG5C,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,MAAM,UAAU,QAAQ;IACtB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAkB,IAAI,CAAC,CAAC;IACxE,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,KAAK,IAAI,EAAE;YAChC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,kBAAkB;gBAAE,OAAO;YAEtD,MAAM,QAAQ,GAAG,MAAM,WAAW,CAAC,eAAe,CAAC,OAAO,CACxD,WAAW,CAAC,QAAQ,CAAC,kBAAkB,CACxC,CAAC;YAEF,IAAI,QAAQ;gBAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;QAC1C,CAAC,CAAC;QAEF,cAAc,EAAE,CAAC;IACnB,CAAC,EAAE,CAAC,WAAW,EAAE,qBAAqB,CAAC,CAAC,CAAC;IACzC,OAAO,CACL,eAAK,SAAS,EAAC,iEAAiE,oCAE7E,YAAY,IAAI,CACf,eACE,SAAS,EAAC,oCAAoC,EAC9C,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,YAAY,CAAC,UAAU,CAAC,sBAEvD,YAAY,EAAE,IAAI,SACpB,CACP,IACG,CACP,CAAC;AACJ,CAAC"}

package/dist/editor/page-editor-chrome/PageEditorChrome.d.ts

@@ -0,0 +1,6 @@
+import { PageViewContext } from "../page-viewer/pageViewContext";
+export declare function PageEditorChrome({ iframe, mode, pageViewContext, }: {
+    iframe: HTMLIFrameElement;
+    mode: "edit" | "compare" | "view";
+    pageViewContext: PageViewContext;
+}): import("react/jsx-runtime").JSX.Element | null;

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

@@ -0,0 +1,63 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEditContext } from "../client/editContext";
+import { InlineEditor } from "./InlineEditor";
+import { FieldActionsIndicators } from "./FieldActionIndicators";
+import { PlaceholderDropZones } from "./PlaceholderDropZones";
+import { PictureEditorOverlay } from "./PictureEditorOverlay";
+import { useEffect, useState } from "react";
+import { LockedFieldIndicator } from "./LockedFieldIndicator";
+import { FrameMenus } from "./FrameMenus";
+import { FieldEditedIndicators } from "./FieldEditedIndicators";
+import { CommentHighlightings } from "./CommentHighlightings";
+export function PageEditorChrome({ iframe, mode, pageViewContext, }) {
+    const editContext = useEditContext();
+    const [insertingStyle, setInsertingStyle] = useState();
+    if (!editContext?.pageView || !iframe?.contentDocument)
+        return null;
+    useEffect(() => {
+        if (!editContext.inserting)
+            setInsertingStyle(undefined);
+        let insertingPosition;
+        const insertingRect = editContext.inserting
+            ? editContext.inserting.positionElement.getBoundingClientRect()
+            : null;
+        if (insertingRect) {
+            if (editContext.inserting?.positionAnchor === "top")
+                insertingPosition = {
+                    y: insertingRect.y,
+                    x: insertingRect.x + insertingRect.width / 2,
+                };
+            if (editContext.inserting?.positionAnchor === "bottom")
+                insertingPosition = {
+                    y: insertingRect.y + insertingRect.height,
+                    x: insertingRect.x + insertingRect.width / 2,
+                };
+            if (editContext.inserting?.positionAnchor === "left")
+                insertingPosition = {
+                    y: insertingRect.y + insertingRect.height / 2,
+                    x: insertingRect.x,
+                };
+            if (editContext.inserting?.positionAnchor === "right")
+                insertingPosition = {
+                    y: insertingRect.y + insertingRect.height / 2,
+                    x: insertingRect.x + insertingRect.width,
+                };
+        }
+        const getInsertingStyle = () => {
+            if (!insertingPosition)
+                return;
+            const scale = pageViewContext.zoom;
+            const x = Math.min(pageViewContext.viewport.width - 20, Math.max(20, insertingPosition.x * (scale || 1)));
+            const y = Math.min(pageViewContext.viewport.height - 20, Math.max(20, insertingPosition.y * (scale || 1)));
+            return {
+                top: y - 16 + "px",
+                left: x - 16 + "px",
+                zIndex: 1000,
+            };
+        };
+        const insertingStyle = getInsertingStyle();
+        setInsertingStyle(insertingStyle);
+    }, [editContext.inserting, pageViewContext.viewport]);
+    return (_jsxs(_Fragment, { children: [_jsx(FrameMenus, { mode: mode, pageViewContext: pageViewContext }), _jsx(InlineEditor, { mode: mode === "edit" ? "edit" : "view", pageViewContext: pageViewContext }), _jsx(LockedFieldIndicator, {}), _jsx(FieldActionsIndicators, {}), editContext.showComments && (_jsx(CommentHighlightings, { iframe: pageViewContext?.editorIframeRef.current, scale: 1 })), _jsx(FieldEditedIndicators, { pageViewContext: pageViewContext }), mode === "edit" && (_jsxs(_Fragment, { children: [_jsx(PlaceholderDropZones, { iframe: pageViewContext?.editorIframeRef.current, size: "large" }), _jsx(PictureEditorOverlay, {}), insertingStyle && (_jsxs("div", { className: "absolute flex h-8 w-8", style: insertingStyle, children: [_jsx("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-sky-400 opacity-75" }), _jsx("span", { className: "relative inline-flex rounded-full h-8 w-8 bg-sky-500" })] }))] }))] }));
+}
+//# sourceMappingURL=PageEditorChrome.js.map

package/dist/editor/page-editor-chrome/PageEditorChrome.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageEditorChrome.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/PageEditorChrome.tsx"],"names":[],"mappings":"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"}

package/dist/editor/page-editor-chrome/PictureEditorOverlay.d.ts

@@ -0,0 +1 @@
+export declare function PictureEditorOverlay(): import("react/jsx-runtime").JSX.Element | null;