@parhelia/core 0.3.12832 → 0.3.12833

package/dist/editor/page-editor-chrome/overlay/useSuggestionAnchorMeasurements.js

@@ -0,0 +1,241 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { usePageViewState, } from "../../page-viewer/pageViewContext";
+import { getSuggestedEditTextRangeKey, getSuggestionDisplayRanges, getSuggestionRangeData, } from "../../reviews/feedbackScrollTarget";
+import { getSuggestedEditItemLanguage, getSuggestedEditItemVersion, getSuggestionFieldIdentityKey, } from "../../reviews/suggestionDisplayValue";
+import { measureBridgeTextRangeRects } from "./geometry";
+import { anchorMeasurementsEqual, } from "./feedbackAnchorMeasurements";
+import { useBridgeTextRangeRequest, } from "./useBridgeTextRangeRequest";
+import { useOverlayMeasurement } from "./useOverlayMeasurement";
+export const SUGGESTION_BRIDGE_SOURCE = "suggestions";
+/** Suggestions that still need a decision and therefore mark the canvas. */
+export function getOpenSuggestions(suggestedEdits) {
+    return suggestedEdits.filter((suggestion) => suggestion.status !== "applied" && suggestion.status !== "rejected");
+}
+/**
+ * The single suggestion whose suggested text the canvas shows because its
+ * card is selected. A decided suggestion is never previewed (an applied one
+ * already is the field's text, a rejected one left the original), so
+ * selecting one leaves the field as it is and must not hide its open
+ * siblings on that field.
+ */
+export function getPreviewedSuggestionId({ suggestions, selectedSuggestedEditId, previewsAllSuggestions, showSelectedSuggestionOnPage, }) {
+    if (previewsAllSuggestions || showSelectedSuggestionOnPage === false) {
+        return undefined;
+    }
+    const selectedIsDecided = suggestions.some((suggestion) => suggestion.id === selectedSuggestedEditId &&
+        (suggestion.status === "applied" || suggestion.status === "rejected"));
+    return selectedIsDecided ? undefined : selectedSuggestedEditId;
+}
+/**
+ * Resolves each suggestion to the text ranges it changes (diffing its old
+ * and new value against the field's current value) and measures those ranges
+ * on the canvas. Callers pass the open suggestions for highlighting, or every
+ * listed suggestion when the measurements also position margin cards.
+ *
+ * Must run inside an `IframeOverlayProvider`.
+ */
+export function useSuggestionAnchorMeasurements(pageViewContext, editContext, suggestions, options = {}) {
+    const { request = true } = options;
+    const bridgeGeometry = usePageViewState(pageViewContext, (state) => state.bridgeGeometry);
+    const lastMeasurementsRef = useRef({});
+    const [rangeDataBySuggestionId, setRangeDataBySuggestionId] = useState({});
+    const [fieldValueByIdentity, setFieldValueByIdentity] = useState({});
+    const [fieldIdentityBySuggestionId, setFieldIdentityBySuggestionId] = useState({});
+    const previewsAllSuggestions = editContext?.mode === "suggestions";
+    const selectedSuggestedEditId = editContext?.selectedSuggestedEdit?.id;
+    // Outside suggestions mode the selected card previews its suggestion on the
+    // canvas exactly like suggestions mode does (while its "Show on page"
+    // toggle is on), so its ranges must target the suggested text rather than
+    // the original. With the toggle off the canvas keeps the original text and
+    // the ranges mark the text the suggestion removes.
+    const previewedSuggestionId = getPreviewedSuggestionId({
+        suggestions,
+        selectedSuggestedEditId,
+        previewsAllSuggestions,
+        showSelectedSuggestionOnPage: editContext?.showSelectedSuggestionOnPage,
+    });
+    // Decided suggestions are measured too (the comment margin anchors their
+    // cards) but never previewed: an applied one lives in the field as its new
+    // text, a rejected one left the original text in place.
+    const previewsSuggestedText = useCallback((suggestion) => {
+        if (suggestion.status === "applied")
+            return true;
+        if (suggestion.status === "rejected")
+            return false;
+        return previewsAllSuggestions || suggestion.id === previewedSuggestionId;
+    }, [previewsAllSuggestions, previewedSuggestionId]);
+    useEffect(() => {
+        if (!editContext) {
+            setRangeDataBySuggestionId({});
+            setFieldValueByIdentity({});
+            setFieldIdentityBySuggestionId({});
+            return;
+        }
+        let cancelled = false;
+        const resolveRanges = async () => {
+            const nextRangeData = {};
+            const nextFieldValues = {};
+            const nextFieldIdentities = {};
+            await Promise.all(suggestions.map(async (suggestion) => {
+                if (!suggestion.fieldId) {
+                    nextRangeData[suggestion.id] = {
+                        oldRanges: [],
+                        newRanges: [],
+                        oldAnchorOffsets: [],
+                        newAnchorOffsets: [],
+                        oldText: "",
+                        newText: "",
+                    };
+                    return;
+                }
+                const language = getSuggestedEditItemLanguage(suggestion);
+                const version = getSuggestedEditItemVersion(suggestion) ?? 0;
+                const field = await editContext.itemsRepository.getField({
+                    item: {
+                        id: suggestion.itemId,
+                        language,
+                        version,
+                    },
+                    fieldId: suggestion.fieldId,
+                });
+                const resolvedItem = field?.descriptor?.item ?? {
+                    id: suggestion.itemId,
+                    language,
+                    version,
+                };
+                const identityKey = getSuggestionFieldIdentityKey({
+                    itemId: resolvedItem.id,
+                    language: resolvedItem.language,
+                    version: resolvedItem.version,
+                    fieldId: suggestion.fieldId,
+                });
+                nextFieldIdentities[suggestion.id] = identityKey;
+                nextFieldValues[identityKey] = {
+                    rawValue: field?.rawValue ?? "",
+                    itemId: resolvedItem.id,
+                    language: resolvedItem.language,
+                    version: resolvedItem.version,
+                    fieldId: suggestion.fieldId,
+                };
+                nextRangeData[suggestion.id] = getSuggestionRangeData(suggestion.oldValue ?? field?.rawValue ?? "", suggestion.newValue ?? "");
+            }));
+            if (!cancelled) {
+                setRangeDataBySuggestionId(nextRangeData);
+                setFieldValueByIdentity(nextFieldValues);
+                setFieldIdentityBySuggestionId(nextFieldIdentities);
+            }
+        };
+        resolveRanges();
+        return () => {
+            cancelled = true;
+        };
+    }, [editContext, suggestions]);
+    // While a single selected suggestion is previewed, the canvas shows its
+    // suggested text; other pending suggestions on that same field still hold
+    // ranges into the original text and would land at the wrong offsets.
+    const hiddenSuggestionIds = useMemo(() => {
+        const hidden = new Set();
+        if (!previewedSuggestionId)
+            return hidden;
+        const previewedIdentity = fieldIdentityBySuggestionId[previewedSuggestionId];
+        if (!previewedIdentity)
+            return hidden;
+        for (const suggestion of suggestions) {
+            if (suggestion.id !== previewedSuggestionId &&
+                fieldIdentityBySuggestionId[suggestion.id] === previewedIdentity) {
+                hidden.add(suggestion.id);
+            }
+        }
+        return hidden;
+    }, [fieldIdentityBySuggestionId, previewedSuggestionId, suggestions]);
+    const bridgeTextRanges = useMemo(() => suggestions.flatMap((suggestion) => {
+        if (!suggestion.fieldId)
+            return [];
+        if (hiddenSuggestionIds.has(suggestion.id))
+            return [];
+        const rangeData = rangeDataBySuggestionId[suggestion.id];
+        if (!rangeData)
+            return [];
+        const ranges = getSuggestionDisplayRanges(rangeData, previewsSuggestedText(suggestion) ? "new" : "old");
+        const fieldIdentity = fieldIdentityBySuggestionId[suggestion.id];
+        const resolvedField = fieldIdentity
+            ? fieldValueByIdentity[fieldIdentity]
+            : undefined;
+        return ranges.map(([start, end]) => ({
+            key: getSuggestedEditTextRangeKey(suggestion),
+            fieldId: suggestion.fieldId,
+            item: {
+                id: resolvedField?.itemId ?? suggestion.itemId,
+                language: resolvedField?.language ??
+                    getSuggestedEditItemLanguage(suggestion),
+                version: resolvedField?.version ??
+                    getSuggestedEditItemVersion(suggestion) ??
+                    0,
+            },
+            start,
+            end,
+        }));
+    }), [
+        fieldIdentityBySuggestionId,
+        fieldValueByIdentity,
+        hiddenSuggestionIds,
+        previewsSuggestedText,
+        rangeDataBySuggestionId,
+        suggestions,
+    ]);
+    useBridgeTextRangeRequest(pageViewContext, SUGGESTION_BRIDGE_SOURCE, bridgeTextRanges, request);
+    const measurements = useOverlayMeasurement((metrics, reasons) => {
+        if (!bridgeGeometry)
+            return {};
+        const canReusePreviousMeasurement = !reasons.has("viewport") &&
+            !reasons.has("layout") &&
+            !reasons.has("text");
+        const nextMeasurements = {};
+        for (const suggestion of suggestions) {
+            if (!suggestion.fieldId)
+                continue;
+            if (hiddenSuggestionIds.has(suggestion.id))
+                continue;
+            const rangeData = rangeDataBySuggestionId[suggestion.id];
+            if (!rangeData)
+                continue;
+            const ranges = getSuggestionDisplayRanges(rangeData, previewsSuggestedText(suggestion) ? "new" : "old");
+            if (ranges.length === 0)
+                continue;
+            const rects = measureBridgeTextRangeRects(bridgeGeometry, getSuggestedEditTextRangeKey(suggestion), metrics);
+            if (rects.length === 0) {
+                const previousMeasurement = lastMeasurementsRef.current[suggestion.id];
+                if (canReusePreviousMeasurement &&
+                    previousMeasurement?.isTextRange &&
+                    previousMeasurement.rects.length) {
+                    nextMeasurements[suggestion.id] = previousMeasurement;
+                }
+                continue;
+            }
+            nextMeasurements[suggestion.id] = { rects, isTextRange: true };
+        }
+        return nextMeasurements;
+    }, [
+        bridgeGeometry,
+        hiddenSuggestionIds,
+        previewsSuggestedText,
+        suggestions,
+        rangeDataBySuggestionId,
+    ], {
+        initialValue: {},
+        equals: anchorMeasurementsEqual,
+        interests: ["viewport", "layout", "text", "adornment-data"],
+    });
+    useEffect(() => {
+        lastMeasurementsRef.current = measurements;
+    }, [measurements]);
+    return {
+        measurements,
+        hiddenSuggestionIds,
+        rangeDataBySuggestionId,
+        fieldValueByIdentity,
+        fieldIdentityBySuggestionId,
+        previewsSuggestedText,
+    };
+}
+//# sourceMappingURL=useSuggestionAnchorMeasurements.js.map

package/dist/editor/page-editor-chrome/overlay/useSuggestionAnchorMeasurements.js.map

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

package/dist/editor/page-viewer/CanvasOverviewRuler.d.ts

@@ -0,0 +1,11 @@
+export declare const CANVAS_OVERVIEW_RULER_TEST_ID = "canvas-overview-ruler";
+/**
+ * Paints the marks published by the canvas highlightings in one strip over
+ * the canvas's right edge (where the page's scrollbar is), the whole page
+ * scaled onto the strip's height. Shown whether or not the minimap is. Marks
+ * are buttons handing the click to their source; the strip between them lets
+ * the pointer through to the scrollbar.
+ */
+export declare function CanvasOverviewRuler({ height }: {
+    height: number | string;
+}): import("react").JSX.Element | null;

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

@@ -0,0 +1,65 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils";
+import { layoutOverviewRuler, OVERVIEW_RULER_MARK_HEIGHT, OVERVIEW_RULER_WIDTH, useOverviewRulerSnapshot, useOverviewRulerStore, } from "./overviewRuler";
+export const CANVAS_OVERVIEW_RULER_TEST_ID = "canvas-overview-ruler";
+// Same colours as the minimap dots (comments, suggestions), the canvas
+// highlights (agent changes), the spelling underline (faded, there are many)
+// and the validation severity badges.
+const toneClassNames = {
+    comment: "bg-highlight-100",
+    "comment-resolved": "bg-highlight-100/40",
+    suggestion: "bg-component-suggestions",
+    added: "bg-feedback-green",
+    removed: "bg-feedback-red",
+    spelling: "bg-feedback-red/50",
+    "validation-error": "bg-feedback-red",
+    "validation-warning": "bg-feedback-orange",
+    "validation-suggestion": "bg-feedback-blue",
+};
+const toneLabels = {
+    comment: ["Comment", "comments"],
+    "comment-resolved": ["Resolved comment", "resolved comments"],
+    suggestion: ["Suggestion", "suggestions"],
+    added: ["Agent change", "agent changes"],
+    removed: ["Text removed by the agent", "removals by the agent"],
+    spelling: ["Spelling mistake", "spelling mistakes"],
+    "validation-error": ["Validation error", "validation errors"],
+    "validation-warning": ["Validation warning", "validation warnings"],
+    "validation-suggestion": ["Validation suggestion", "validation suggestions"],
+};
+function getMarkLabel({ tone, mark }) {
+    const [one, many] = toneLabels[tone];
+    const count = mark.ids?.length ?? 0;
+    return count > 1 ? `${count} ${many}` : one;
+}
+/** The label, then what the mark is about (e.g. the validation messages). */
+function getMarkTitleLines(placed) {
+    const details = placed.mark.details ?? [];
+    return [getMarkLabel(placed), ...details];
+}
+/**
+ * Paints the marks published by the canvas highlightings in one strip over
+ * the canvas's right edge (where the page's scrollbar is), the whole page
+ * scaled onto the strip's height. Shown whether or not the minimap is. Marks
+ * are buttons handing the click to their source; the strip between them lets
+ * the pointer through to the scrollbar.
+ */
+export function CanvasOverviewRuler({ height }) {
+    const store = useOverviewRulerStore();
+    const snapshot = useOverviewRulerSnapshot();
+    const marks = layoutOverviewRuler(snapshot);
+    if (!store || !marks)
+        return null;
+    return (_jsx("div", { className: "pointer-events-none absolute top-0 right-0 z-20", "data-testid": CANVAS_OVERVIEW_RULER_TEST_ID, style: { width: OVERVIEW_RULER_WIDTH, height }, children: marks.map((placed, index) => {
+            const titleLines = getMarkTitleLines(placed);
+            return (_jsx("button", { type: "button", tabIndex: -1, "aria-label": titleLines.join(": "), title: titleLines.join("\n"), className: cn("pointer-events-auto absolute inset-x-0 cursor-pointer rounded-full p-0 transition-[filter,box-shadow]", "hover:shadow-[0_0_0_1px_white] hover:brightness-110", toneClassNames[placed.tone]), "data-testid": `${CANVAS_OVERVIEW_RULER_TEST_ID}-mark`, "data-tone": placed.tone, "data-source": placed.source, style: {
+                    // A line at the very bottom stays inside the ruler.
+                    top: `min(${placed.top * 100}%, calc(100% - ${OVERVIEW_RULER_MARK_HEIGHT}px))`,
+                    height: OVERVIEW_RULER_MARK_HEIGHT,
+                }, onClick: (event) => {
+                    event.stopPropagation();
+                    store.activate(placed.source, placed.mark);
+                } }, index));
+        }) }));
+}
+//# sourceMappingURL=CanvasOverviewRuler.js.map

package/dist/editor/page-viewer/CanvasOverviewRuler.js.map

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

package/dist/editor/page-viewer/DynamicRenderingsBar.d.ts

@@ -0,0 +1,23 @@
+import type { RenderingState } from "../services/renderingsService";
+type DynamicRenderingsBarProps = {
+    /** The page's dynamic renderings with their approval state. */
+    renderings?: readonly RenderingState[];
+    renderingsLoading?: boolean;
+    renderingsError?: string;
+    /** The user may open the review dialog (an administrator, or the sandbox's owner). */
+    canReview?: boolean;
+    /** The user may approve and revoke (an administrator, not a sandbox). */
+    canApprove?: boolean;
+    onReview?: (rendering: RenderingState) => void;
+    onRevoke?: (rendering: RenderingState) => void;
+};
+/**
+ * Sits above the preview canvas when the page has dynamic renderings. It
+ * lists them with their approval state (published pages show only approved
+ * ones) and says when client code does not run because it is not approved.
+ * Administrators, and on a sandbox page its owner, review a rendering's code
+ * and try its client code in the review dialog; administrators also approve
+ * and revoke. Nobody else gets a review.
+ */
+export declare function DynamicRenderingsBar({ renderings, renderingsLoading, renderingsError, canReview, canApprove, onReview, onRevoke, }: DynamicRenderingsBarProps): import("react").JSX.Element;
+export {};

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

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CodeXmlIcon, PaletteIcon } from "lucide-react";
+import { Badge } from "../../components/ui/badge";
+import { Button } from "../../components/ui/button";
+import { Spinner } from "../ui/Spinner";
+import { getClientCodeNotice, getRenderingApprovalStatus, getRenderingDisplayName, RENDERING_APPROVAL_BADGE_CLASSES, RENDERING_APPROVAL_DESCRIPTIONS, RENDERING_APPROVAL_LABELS, } from "./renderingApproval";
+/**
+ * Sits above the preview canvas when the page has dynamic renderings. It
+ * lists them with their approval state (published pages show only approved
+ * ones) and says when client code does not run because it is not approved.
+ * Administrators, and on a sandbox page its owner, review a rendering's code
+ * and try its client code in the review dialog; administrators also approve
+ * and revoke. Nobody else gets a review.
+ */
+export function DynamicRenderingsBar({ renderings = [], renderingsLoading = false, renderingsError, canReview = false, canApprove = false, onReview, onRevoke, }) {
+    const clientCodeNotice = getClientCodeNotice(renderings, canReview);
+    return (_jsxs("div", { role: "region", "aria-label": "Dynamic renderings", "data-testid": "dynamic-renderings-bar", 
+        // pl-14 clears the editor form toggle that floats over the canvas's top-left corner (PageViewer).
+        className: "text-neutral-grey-100 bg-feedback-blue-light border-border-default flex max-h-24 w-full shrink-0 items-start gap-2 overflow-y-auto border-b py-1.5 pr-3 pl-14 text-xs", children: [_jsx(CodeXmlIcon, { className: "text-feedback-blue mt-0.5 h-4 w-4 shrink-0", strokeWidth: 1.5, "aria-hidden": "true" }), _jsxs("div", { className: "flex min-h-5 min-w-0 flex-1 flex-wrap items-center gap-x-3 gap-y-1", children: [_jsx("span", { className: "font-medium", children: "Dynamic renderings" }), renderings.map((rendering) => {
+                        const approval = getRenderingApprovalStatus(rendering);
+                        const name = getRenderingDisplayName(rendering);
+                        const approvable = canApprove && !rendering.sandbox;
+                        return (_jsxs("span", { className: "inline-flex max-w-full min-w-0 items-center gap-1.5", "data-testid": "preview-rendering", "data-rendering-id": rendering.id, "data-approval": approval, children: [rendering.kind === "theme" && (_jsx(PaletteIcon, { className: "text-neutral-grey-50 h-3.5 w-3.5 shrink-0", strokeWidth: 1.5, "aria-hidden": "true" })), _jsx("span", { className: "max-w-48 truncate", title: rendering.path || name, children: name }), _jsx(Badge, { size: "sm", variant: "secondary", className: RENDERING_APPROVAL_BADGE_CLASSES[approval], title: RENDERING_APPROVAL_DESCRIPTIONS[approval], children: RENDERING_APPROVAL_LABELS[approval] }), canReview && (_jsx(Button, { variant: "link", size: "xxs", className: "h-auto p-0 text-xs", onClick: () => onReview?.(rendering), "data-testid": "preview-rendering-review", children: approvable && !rendering.approved
+                                        ? "Review and approve"
+                                        : "Review" })), approvable && rendering.approved && (_jsx(Button, { variant: "link", size: "xxs", className: "h-auto p-0 text-xs", onClick: () => onRevoke?.(rendering), "data-testid": "preview-rendering-revoke", children: "Revoke" }))] }, rendering.id));
+                    }), clientCodeNotice && (_jsx("span", { className: "text-neutral-grey-80", "data-testid": "preview-renderings-client-code-notice", children: clientCodeNotice })), renderingsLoading && renderings.length === 0 && (_jsx(Spinner, { size: "xs" })), renderingsError && (_jsxs("span", { className: "text-feedback-red truncate", title: renderingsError, "data-testid": "preview-renderings-error", children: ["Approval state unavailable: ", renderingsError] }))] })] }));
+}
+//# sourceMappingURL=DynamicRenderingsBar.js.map

package/dist/editor/page-viewer/DynamicRenderingsBar.js.map

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

package/dist/editor/page-viewer/DynamicRenderingsStrip.d.ts

@@ -0,0 +1,18 @@
+import type { PageVersion } from "../services/renderingsService";
+type DynamicRenderingsStripProps = {
+    page: PageVersion | undefined;
+    /** The page's dynamic renderings as read from the preview canvas. */
+    renderingIds: readonly string[];
+    /** The preview canvas URL, for trying client code in the review dialog. */
+    getCanvasUrl?: () => string | undefined;
+};
+/**
+ * The preview strip with its data: the approval state of the page's dynamic
+ * renderings (and theme) from the CM; the review dialog (code, and the page's
+ * client code in a sealed frame) for administrators and, on a sandbox page,
+ * its owner; approve and revoke for administrators. Everyone else sees client
+ * code run only once it is approved. The state is loaded again after every
+ * approval change.
+ */
+export declare function DynamicRenderingsStrip({ page, renderingIds, getCanvasUrl, }: DynamicRenderingsStripProps): import("react").JSX.Element;
+export {};

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

@@ -0,0 +1,29 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { DynamicRenderingsBar } from "./DynamicRenderingsBar";
+import { RenderingApprovalDialog, RevokeRenderingDialog, } from "./RenderingApprovalDialog";
+import { sortRenderingsForPage, useRenderingPageState, } from "./renderingApproval";
+/**
+ * The preview strip with its data: the approval state of the page's dynamic
+ * renderings (and theme) from the CM; the review dialog (code, and the page's
+ * client code in a sealed frame) for administrators and, on a sandbox page,
+ * its owner; approve and revoke for administrators. Everyone else sees client
+ * code run only once it is approved. The state is loaded again after every
+ * approval change.
+ */
+export function DynamicRenderingsStrip({ page, renderingIds, getCanvasUrl, }) {
+    const pageState = useRenderingPageState({
+        page,
+        renderingIds,
+        enabled: renderingIds.length > 0,
+    });
+    const [reviewing, setReviewing] = useState();
+    const [revoking, setRevoking] = useState();
+    const canReview = !!pageState.state?.canReview;
+    const canApprove = !!pageState.state?.canApprove;
+    const renderings = pageState.state
+        ? sortRenderingsForPage(pageState.state.renderings, renderingIds)
+        : undefined;
+    return (_jsxs(_Fragment, { children: [_jsx(DynamicRenderingsBar, { renderings: renderings, renderingsLoading: pageState.loading, renderingsError: pageState.error, canReview: canReview, canApprove: canApprove, onReview: setReviewing, onRevoke: setRevoking }), reviewing && canReview && (_jsx(RenderingApprovalDialog, { rendering: reviewing, canApprove: canApprove, page: page, getCanvasUrl: getCanvasUrl, onClose: () => setReviewing(undefined), onChanged: pageState.refresh })), revoking && (_jsx(RevokeRenderingDialog, { rendering: revoking, onClose: () => setRevoking(undefined), onChanged: pageState.refresh }))] }));
+}
+//# sourceMappingURL=DynamicRenderingsStrip.js.map

package/dist/editor/page-viewer/DynamicRenderingsStrip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicRenderingsStrip.js","sourceRoot":"","sources":["../../../src/editor/page-viewer/DynamicRenderingsStrip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAMjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EACL,uBAAuB,EACvB,qBAAqB,GACtB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,qBAAqB,EACrB,qBAAqB,GACtB,MAAM,qBAAqB,CAAC;AAU7B;;;;;;;GAOG;AACH,MAAM,UAAU,sBAAsB,CAAC,EACrC,IAAI,EACJ,YAAY,EACZ,YAAY,GACgB;IAC5B,MAAM,SAAS,GAAG,qBAAqB,CAAC;QACtC,IAAI;QACJ,YAAY;QACZ,OAAO,EAAE,YAAY,CAAC,MAAM,GAAG,CAAC;KACjC,CAAC,CAAC;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAkB,CAAC;IAC7D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,EAAkB,CAAC;IAC3D,MAAM,SAAS,GAAG,CAAC,CAAC,SAAS,CAAC,KAAK,EAAE,SAAS,CAAC;IAC/C,MAAM,UAAU,GAAG,CAAC,CAAC,SAAS,CAAC,KAAK,EAAE,UAAU,CAAC;IACjD,MAAM,UAAU,GAAG,SAAS,CAAC,KAAK;QAChC,CAAC,CAAC,qBAAqB,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,EAAE,YAAY,CAAC;QACjE,CAAC,CAAC,SAAS,CAAC;IAEd,OAAO,CACL,8BACE,KAAC,oBAAoB,IACnB,UAAU,EAAE,UAAU,EACtB,iBAAiB,EAAE,SAAS,CAAC,OAAO,EACpC,eAAe,EAAE,SAAS,CAAC,KAAK,EAChC,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,WAAW,GACrB,EACD,SAAS,IAAI,SAAS,IAAI,CACzB,KAAC,uBAAuB,IACtB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,EACtC,SAAS,EAAE,SAAS,CAAC,OAAO,GAC5B,CACH,EACA,QAAQ,IAAI,CACX,KAAC,qBAAqB,IACpB,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,SAAS,CAAC,EACrC,SAAS,EAAE,SAAS,CAAC,OAAO,GAC5B,CACH,IACA,CACJ,CAAC;AACJ,CAAC"}

package/dist/editor/page-viewer/FeedbackMargin.d.ts

@@ -0,0 +1,57 @@
+import { type FeedbackMarginSize } from "./feedbackMarginLayout";
+import { type PageViewContext } from "./pageViewContext";
+export { FEEDBACK_MARGIN_MIN_WIDTH, FEEDBACK_MARGIN_RAIL_WIDTH, FEEDBACK_MARGIN_WIDTH, } from "./FeedbackMarginController";
+export type FeedbackMarginProps = {
+    iframe: HTMLIFrameElement | null;
+    pageViewContext: PageViewContext;
+    /** Height of the canvas beside the column (fixed devices) or "100%". */
+    height: number | string;
+    /** What the pane leaves for the column (resolveFeedbackMarginSize). */
+    size: FeedbackMarginSize;
+    /** The widest the pane lets the user drag the column (getFeedbackMarginRoom). */
+    maxResizeWidth?: number;
+    invalidationKey: string;
+    deferredInvalidationMs: number;
+};
+/**
+ * Word-style comment margin beside the canvas: a column where every
+ * comment/suggestion card sits level with the text it is about. It carries no
+ * controls; adding, suggesting and filtering live in the toolbar.
+ *
+ * In a narrow pane the column narrows, then collapses into a rail of markers
+ * (the canvas keeps its width); the rail can be expanded into the full column
+ * floating over the canvas edge. Dragging the column's edge past its minimum
+ * collapses it into the same rail where the pane has room for it.
+ */
+export declare function FeedbackMargin({ iframe, pageViewContext, height, size, maxResizeWidth, invalidationKey, deferredInvalidationMs, }: FeedbackMarginProps): import("react").JSX.Element;
+export type FormFeedbackMarginProps = {
+    /** The element that scrolls the form and this column together. */
+    scroller: HTMLElement | null;
+    /** The form beside the column; anchors are its `[data-field-id]` fields. */
+    form: HTMLElement | null;
+};
+/**
+ * The same margin beside the item form (items without a canvas): it sits in
+ * the form's own scroll container, so the cards scroll natively with the
+ * fields they are anchored to.
+ */
+export declare function FormFeedbackMargin({ scroller, form, }: FormFeedbackMarginProps): import("react").JSX.Element;
+export declare function useElementWidth(element: HTMLElement | null): number;
+export declare function useElementHeight(element: HTMLElement | null): number;
+/**
+ * Suggestions mode changes what typing on the page does, so the margin says
+ * so where the suggestions appear. A notice card, not a header: the mode is
+ * switched from the toolbar.
+ */
+export declare const SuggestingNotice: import("react").ForwardRefExoticComponent<{
+    className?: string;
+    onStopSuggesting: () => void;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export declare function useRevealPinnedCard(listRef: React.RefObject<HTMLDivElement | null>, pinnedId: string | undefined, enabled: boolean): void;
+/**
+ * What the footer holds depends on the surface. Beside the canvas it is
+ * feedback on things the page does not render. In a form it is feedback on
+ * fields the form does not show (hidden sections, fields of another item);
+ * feedback on the item as a whole sits at the top of the form instead.
+ */
+export declare function getUnplacedLabel(count: number, layout: "overlay" | "flow"): string;