@parhelia/core 0.1.12895 → 0.1.12901

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

@@ -1,14 +1,18 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
 import { useEditContext } from "../client/editContext";
 import { useSlotContext } from "../views/editorSlotContext";
-import { getVisibleInsertOptions } from "../insertMenuItems";
 import { getAllPlaceholders } from "../componentTreeHelper";
-import { PlaceholderDropZone } from "./PlaceholderDropZone";
-import { measureBridgeComponentRect, measureBridgePlaceholderRect, rectEquals, } from "./overlay/geometry";
+import { PlaceholderDropZone, SMALL_DROPZONE_SCALE, } from "./PlaceholderDropZone";
 import { useOverlayMeasurement } from "./overlay/useOverlayMeasurement";
-export function PlaceholderDropZones({ size, pageViewContext, }) {
+import { computePlaceholderZones, layoutAwareIndex, placeholderZonesEqual, } from "./overlay/placeholderZones";
+import { getPlaceholderDropZoneColor } from "../componentFrameColors";
+import { usePinnedHoveredComponentId } from "./usePinnedHoveredComponentId";
+export function PlaceholderDropZones({ size, pageViewContext, scopeInsertModeToHoveredComponent = false, avoidOverlaps = true, activeTargetKey = null, }) {
     const [placeholders, setPlaceholders] = useState([]);
+    // Last good dot set captured during a drag, so a transient mid-drag
+    // measurement frame that drops gaps can't unmount/remount the dots.
+    const dragZonesSnapshotRef = useRef({ active: false, zones: [] });
     const editContext = useEditContext();
     const slotContext = useSlotContext();
     useEffect(() => {
@@ -16,86 +20,46 @@ export function PlaceholderDropZones({ size, pageViewContext, }) {
             return;
         setPlaceholders(getAllPlaceholders(pageViewContext.page));
     }, [pageViewContext?.page]);
+    const hoveredComponentId = usePinnedHoveredComponentId(pageViewContext);
     const zones = useOverlayMeasurement((metrics) => {
-        if (!slotContext?.isActive ||
-            !pageViewContext ||
-            (!editContext?.dragObject &&
-                !editContext?.selectedForInsertion &&
-                !editContext?.insertMode)) {
+        if (!slotContext?.isActive || !pageViewContext)
             return [];
-        }
-        const showAllDueToInsertMode = !!editContext?.insertMode &&
-            !editContext?.dragObject &&
-            !editContext?.selectedForInsertion;
-        const hasVisibleInsertOptions = (placeholder) => getVisibleInsertOptions(placeholder.insertOptions).length > 0;
-        const matchingPlaceholders = placeholders
-            .filter((x) => editContext?.showLayoutComponents === true ||
-            !isInsideLayoutComponent(x.parentComponent))
-            .filter((x) => {
-            const visibleInsertOptions = getVisibleInsertOptions(x.insertOptions);
-            return (x.editable &&
-                hasVisibleInsertOptions(x) &&
-                (showAllDueToInsertMode ||
-                    x.parentComponent?.id === editContext.selectedForInsertion ||
-                    visibleInsertOptions.find((y) => y.typeId === editContext.selectedForInsertion ||
-                        y.typeId === editContext.dragObject?.typeId ||
-                        y.typeId === editContext.dragObject?.templateId ||
-                        y.compatibleTypeIds?.find((z) => z == editContext.dragObject?.typeId) !== undefined ||
-                        y.typeId === editContext.dragObject?.templateId ||
-                        y.compatibleTypeIds?.find((z) => z == editContext.dragObject?.templateId) !== undefined)));
-        });
-        const measuredZones = [];
-        const scrollHeight = metrics.scrollHeight * metrics.visualScale;
-        const scrollWidth = metrics.scrollWidth * metrics.visualScale;
-        const bridgeGeometry = pageViewContext.bridgeGeometry;
-        if (bridgeGeometry) {
-            matchingPlaceholders.forEach((placeholder) => {
-                measuredZones.push(...measureBridgePlaceholderZones(placeholder, bridgeGeometry, metrics));
-            });
-        }
-        const zonesWithoutBeforeFirstLayout = measuredZones.filter((z) => {
-            const components = z.placeholder.components;
-            const firstLayoutIndex = components.findIndex((c) => !!c.layoutId);
-            if (firstLayoutIndex >= 0 && z.index <= firstLayoutIndex) {
-                return false;
-            }
-            return true;
+        const filteredZones = computePlaceholderZones({
+            placeholders,
+            geometry: pageViewContext.bridgeGeometry,
+            metrics,
+            dragObject: editContext?.dragObject,
+            selectedForInsertion: editContext?.selectedForInsertion,
+            insertMode: editContext?.insertMode,
+            showLayoutComponents: editContext?.showLayoutComponents,
+            hoveredComponentId,
+            scopeInsertModeToHoveredComponent,
         });
-        const filteredZones = editContext?.showLayoutComponents === false
-            ? zonesWithoutBeforeFirstLayout.filter((z) => {
-                const components = z.placeholder.components;
-                if (z.index >= 1 && z.index < components.length) {
-                    const prev = components[z.index - 1];
-                    const next = components[z.index];
-                    if (prev?.layoutId && next?.layoutId)
-                        return false;
-                }
-                return true;
-            })
-            : zonesWithoutBeforeFirstLayout;
-        const contentWidth = measuredZones.reduce((max, zone) => Math.max(max, zone.position.x + 20), scrollWidth);
-        const contentHeight = measuredZones.reduce((max, zone) => Math.max(max, zone.position.y + 20), scrollHeight);
-        const usedPositions = new Map();
-        const DROPZONE_SIZE = 32;
-        const OVERLAP_THRESHOLD = DROPZONE_SIZE;
-        return filteredZones.map((zone) => {
-            let x = Math.min(contentWidth - 20, Math.max(20, zone.position.x));
-            let y = Math.min(contentHeight - 20, Math.max(20, zone.position.y));
-            const posKey = `${Math.round(x / OVERLAP_THRESHOLD)}_${Math.round(y / OVERLAP_THRESHOLD)}`;
-            const overlapCount = usedPositions.get(posKey) || 0;
-            if (overlapCount > 0) {
-                x = x + overlapCount * (DROPZONE_SIZE + 8);
-                if (x > contentWidth - 20) {
-                    x = 20 + ((overlapCount - 1) % 5) * (DROPZONE_SIZE + 8);
-                    y = y + Math.floor((overlapCount - 1) / 5) * (DROPZONE_SIZE + 8);
-                }
+        // Dots get presentation-only overlap avoidance so multiple "+" buttons at
+        // the same spot don't stack. Overview surfaces (minimap) opt out, and
+        // during a drag the dots sit at TRUE gap positions so the active "+"
+        // lines up exactly with the insertion line.
+        const displayZones = avoidOverlaps && !editContext?.dragObject
+            ? applyDropZoneOverlapAvoidance(filteredZones, metrics, getDropZoneOverlapOptions(size))
+            : filteredZones;
+        // Keep the dot set stable during a drag. A mid-drag measurement frame can
+        // momentarily drop a gap (auto-scroll / reflow leaves a component rect
+        // unmeasured), which would unmount and remount that dot - a hard pop,
+        // since the dots have no fade. Retain the last good set on any frame that
+        // drops gaps; accept frames that carry the full set so positions keep
+        // tracking the page. The baseline resets when a new drag begins.
+        const snap = dragZonesSnapshotRef.current;
+        if (editContext?.dragObject) {
+            if (snap.active && displayZones.length < snap.zones.length) {
+                return snap.zones;
             }
-            usedPositions.set(posKey, overlapCount + 1);
-            return {
-                ...zone,
-                position: { x, y },
-            };
-        });
+            dragZonesSnapshotRef.current = { active: true, zones: displayZones };
+            return displayZones;
+        }
+        if (snap.active) {
+            dragZonesSnapshotRef.current = { active: false, zones: [] };
+        }
+        return displayZones;
     }, [
         slotContext?.isActive,
         pageViewContext,
@@ -104,141 +68,79 @@ export function PlaceholderDropZones({ size, pageViewContext, }) {
         editContext?.selectedForInsertion,
         editContext?.insertMode,
         editContext?.showLayoutComponents,
+        hoveredComponentId,
+        scopeInsertModeToHoveredComponent,
+        avoidOverlaps,
+        size,
         placeholders,
     ], {
         initialValue: [],
         equals: placeholderZonesEqual,
         interests: ["viewport", "layout", "adornment-data"],
     });
+    // The "+" dots show for no-drag insert mode / click-to-insert AND, as
+    // visual-only affordances during a drag (interactive=false below makes them
+    // pointer-events-none), so every valid gap stays marked while the continuous
+    // insertion line (DragInsertionOverlay) keeps sole ownership of the drop.
     if (!zones.length || !editContext)
         return null;
-    return zones.map((zone, index) => {
-        const components = zone.placeholder.components;
-        const prevComponent = zone.index >= 1 ? components[zone.index - 1] : null;
-        const nextComponent = zone.index < components.length ? components[zone.index] : null;
-        const isAdjacentToLayout = !!prevComponent?.layoutId || !!nextComponent?.layoutId;
-        const isInsideLayout = isInsideLayoutComponent(zone.placeholder.parentComponent);
-        const isLayoutZone = isInsideLayout || isAdjacentToLayout;
-        const adjustedIndex = zone.placeholder.components
-            .slice(0, zone.index)
-            .filter((c) => !c.layoutId).length;
-        return (_jsx(PlaceholderDropZone, { placeholder: zone.placeholder, spotPosition: {
-                x: zone.position.x,
-                y: zone.position.y,
-            }, index: adjustedIndex, size: size, spotPositionElement: zone.element, spotPositionAnchor: zone.anchor, parentName: zone.placeholder.parentComponent?.name, description: zone.description || undefined, isLayoutZone: isLayoutZone }, index));
-    });
+    const dragging = !!editContext.dragObject;
+    return (_jsx(_Fragment, { children: zones.map((zone) => {
+            const zoneKey = getPlaceholderZoneKey(zone);
+            const components = zone.placeholder.components;
+            const prevComponent = zone.index >= 1 ? components[zone.index - 1] : null;
+            const nextComponent = zone.index < components.length ? components[zone.index] : null;
+            const color = getPlaceholderDropZoneColor({
+                parentComponent: zone.placeholder.parentComponent,
+                prevComponent,
+                nextComponent,
+            });
+            const adjustedIndex = layoutAwareIndex(zone.placeholder.components, zone.index);
+            return (_jsx(PlaceholderDropZone, { placeholder: zone.placeholder, spotPosition: { x: zone.position.x, y: zone.position.y }, index: adjustedIndex, size: size, spotPositionElement: zone.element, spotPositionAnchor: zone.anchor, parentName: zone.placeholder.parentComponent?.name, description: zone.description || undefined, color: color, interactive: !dragging, isActiveTarget: !!activeTargetKey && zoneKey === activeTargetKey }, zoneKey));
+        }) }));
 }
-function placeholderZonesEqual(previous, next) {
-    if (previous.length !== next.length)
-        return false;
-    for (let i = 0; i < previous.length; i++) {
-        const previousZone = previous[i];
-        const nextZone = next[i];
-        if (previousZone.placeholder.key !== nextZone.placeholder.key ||
-            previousZone.index !== nextZone.index ||
-            (previousZone.element ?? null) !== (nextZone.element ?? null) ||
-            previousZone.anchor !== nextZone.anchor ||
-            previousZone.description !== nextZone.description ||
-            !rectEquals({ ...previousZone.position, width: 0, height: 0 }, { ...nextZone.position, width: 0, height: 0 })) {
-            return false;
-        }
-    }
-    return true;
+function getPlaceholderZoneKey(zone) {
+    return `${zone.placeholder.key}#${zone.index}`;
 }
-function getPositionFromRect(rect, orientation) {
-    const position = orientation === "horizontal"
-        ? {
-            x: rect.x + rect.width,
-            y: rect.y + rect.height / 2,
+export function applyDropZoneOverlapAvoidance(zones, metrics, options = getDropZoneOverlapOptions("large")) {
+    const scrollHeight = metrics.scrollHeight * metrics.visualScale;
+    const scrollWidth = metrics.scrollWidth * metrics.visualScale;
+    const { edgePadding, overlapThreshold, shiftStep } = options;
+    const contentWidth = zones.reduce((max, zone) => Math.max(max, zone.position.x + edgePadding), scrollWidth);
+    const contentHeight = zones.reduce((max, zone) => Math.max(max, zone.position.y + edgePadding), scrollHeight);
+    const usedPositions = new Map();
+    return zones.map((zone) => {
+        let x = clampToDropZoneBounds(zone.position.x, contentWidth, edgePadding);
+        let y = clampToDropZoneBounds(zone.position.y, contentHeight, edgePadding);
+        const posKey = `${Math.round(x / overlapThreshold)}_${Math.round(y / overlapThreshold)}`;
+        const overlapCount = usedPositions.get(posKey) || 0;
+        if (overlapCount > 0) {
+            x = x + overlapCount * shiftStep;
+            if (x > contentWidth - edgePadding) {
+                x = edgePadding + ((overlapCount - 1) % 5) * shiftStep;
+                y = y + Math.floor((overlapCount - 1) / 5) * shiftStep;
+            }
         }
-        : {
-            x: rect.x + rect.width / 2,
-            y: rect.y + rect.height,
+        usedPositions.set(posKey, overlapCount + 1);
+        return {
+            ...zone,
+            position: { x, y },
         };
-    return position;
-}
-function measureBridgePlaceholderZones(placeholder, geometry, metrics) {
-    const zones = [];
-    const placeholderMeasurement = measureBridgePlaceholderRect(geometry, placeholder.key, metrics);
-    const orientation = getBridgePlaceholderOrientation(placeholder, geometry, metrics, placeholderMeasurement?.target.orientation);
-    const firstComponent = placeholder.components[0];
-    const firstComponentMeasurement = firstComponent
-        ? measureBridgeComponentRect(geometry, firstComponent, metrics)
-        : null;
-    const parentMeasurement = placeholder.parentComponent
-        ? measureBridgeComponentRect(geometry, placeholder.parentComponent, metrics)
-        : null;
-    const referenceRect = placeholderMeasurement?.rect ??
-        firstComponentMeasurement?.rect ??
-        parentMeasurement?.rect;
-    if (!referenceRect)
-        return zones;
-    const isUsingParentBounds = !placeholderMeasurement?.rect &&
-        !firstComponentMeasurement?.rect &&
-        !!parentMeasurement?.rect;
-    const position = isUsingParentBounds || placeholder.components.length === 0
-        ? {
-            x: referenceRect.x + referenceRect.width / 2,
-            y: referenceRect.y + referenceRect.height / 2,
-        }
-        : getBeforePositionFromRect(referenceRect, orientation);
-    zones.push({
-        placeholder,
-        position,
-        index: 0,
-        element: null,
-        anchor: isUsingParentBounds || orientation !== "horizontal" ? "top" : "left",
-        description: placeholderMeasurement?.target.description,
-    });
-    placeholder.components.forEach((component, index) => {
-        const componentMeasurement = measureBridgeComponentRect(geometry, component, metrics);
-        if (!componentMeasurement?.rect)
-            return;
-        zones.push({
-            placeholder,
-            position: getPositionFromRect(componentMeasurement.rect, orientation),
-            index: index + 1,
-            element: null,
-            anchor: orientation === "horizontal" ? "right" : "bottom",
-            description: placeholderMeasurement?.target.description,
-        });
     });
-    return zones;
 }
-function getBeforePositionFromRect(rect, orientation) {
-    return orientation === "horizontal"
-        ? {
-            x: rect.x,
-            y: rect.y + rect.height / 2,
-        }
-        : {
-            x: rect.x + rect.width / 2,
-            y: rect.y,
-        };
-}
-function getBridgePlaceholderOrientation(placeholder, geometry, metrics, explicitOrientation) {
-    if (explicitOrientation === "horizontal" ||
-        explicitOrientation === "vertical") {
-        return explicitOrientation;
-    }
-    if (placeholder.components.length > 1) {
-        const first = measureBridgeComponentRect(geometry, placeholder.components[0], metrics);
-        const second = measureBridgeComponentRect(geometry, placeholder.components[1], metrics);
-        if (first?.rect && second?.rect) {
-            const horizontalDiff = Math.abs(second.rect.x - first.rect.x);
-            const verticalDiff = Math.abs(second.rect.y - first.rect.y);
-            return horizontalDiff > verticalDiff ? "horizontal" : "vertical";
-        }
-    }
-    return "vertical";
+function getDropZoneOverlapOptions(size) {
+    const visualSize = size === "small" ? 32 * SMALL_DROPZONE_SCALE : 32;
+    return {
+        edgePadding: Math.max(visualSize / 2 + 2, 6),
+        overlapThreshold: visualSize,
+        shiftStep: visualSize + (size === "small" ? 4 : 8),
+    };
 }
-function isInsideLayoutComponent(component) {
-    let current = component;
-    while (current) {
-        if (current.layoutId)
-            return true;
-        current = current.parentPlaceholder?.parentComponent;
-    }
-    return false;
+function clampToDropZoneBounds(value, contentSize, padding) {
+    const min = padding;
+    const max = contentSize - padding;
+    if (max < min)
+        return Math.max(0, contentSize / 2);
+    return Math.min(max, Math.max(min, value));
 }
 //# sourceMappingURL=PlaceholderDropZones.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PlaceholderDropZones.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/PlaceholderDropZones.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,EAAE,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AAE7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAG5D,OAAO,EACL,0BAA0B,EAC1B,4BAA4B,EAG5B,UAAU,GACX,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AAGxE,MAAM,UAAU,oBAAoB,CAAC,EACnC,IAAI,EACJ,eAAe,GAIhB;IACC,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAgB,EAAE,CAAC,CAAC;IACpE,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,eAAe,EAAE,IAAI;YAAE,OAAO;QACnC,eAAe,CAAC,kBAAkB,CAAC,eAAe,CAAC,IAAK,CAAC,CAAC,CAAC;IAC7D,CAAC,EAAE,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC,CAAC;IAE5B,MAAM,KAAK,GAAG,qBAAqB,CACjC,CAAC,OAAO,EAAE,EAAE;QACV,IACE,CAAC,WAAW,EAAE,QAAQ;YACtB,CAAC,eAAe;YAChB,CAAC,CAAC,WAAW,EAAE,UAAU;gBACvB,CAAC,WAAW,EAAE,oBAAoB;gBAClC,CAAC,WAAW,EAAE,UAAU,CAAC,EAC3B,CAAC;YACD,OAAO,EAAE,CAAC;QACZ,CAAC;QAED,MAAM,sBAAsB,GAC1B,CAAC,CAAC,WAAW,EAAE,UAAU;YACzB,CAAC,WAAW,EAAE,UAAU;YACxB,CAAC,WAAW,EAAE,oBAAoB,CAAC;QAErC,MAAM,uBAAuB,GAAG,CAAC,WAAwB,EAAE,EAAE,CAC3D,uBAAuB,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;QAEhE,MAAM,oBAAoB,GAAG,YAAY;aACtC,MAAM,CACL,CAAC,CAAC,EAAE,EAAE,CACJ,WAAW,EAAE,oBAAoB,KAAK,IAAI;YAC1C,CAAC,uBAAuB,CAAC,CAAC,CAAC,eAAe,CAAC,CAC9C;aACA,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;YACZ,MAAM,oBAAoB,GAAG,uBAAuB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;YACtE,OAAO,CACL,CAAC,CAAC,QAAQ;gBACV,uBAAuB,CAAC,CAAC,CAAC;gBAC1B,CAAC,sBAAsB;oBACrB,CAAC,CAAC,eAAe,EAAE,EAAE,KAAK,WAAW,CAAC,oBAAoB;oBAC1D,oBAAoB,CAAC,IAAI,CACvB,CAAC,CAAC,EAAE,EAAE,CACJ,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,oBAAoB;wBAC7C,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,UAAU,EAAE,MAAM;wBAC3C,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,UAAU,EAAE,UAAU;wBAC/C,CAAC,CAAC,iBAAiB,EAAE,IAAI,CACvB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,WAAW,CAAC,UAAU,EAAE,MAAM,CAC3C,KAAK,SAAS;wBACf,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,UAAU,EAAE,UAAU;wBAC/C,CAAC,CAAC,iBAAiB,EAAE,IAAI,CACvB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,WAAW,CAAC,UAAU,EAAE,UAAU,CAC/C,KAAK,SAAS,CAClB,CAAC,CACL,CAAC;QACJ,CAAC,CAAC,CAAC;QAEL,MAAM,aAAa,GAAsB,EAAE,CAAC;QAC5C,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,GAAG,OAAO,CAAC,WAAW,CAAC;QAChE,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;QAC9D,MAAM,cAAc,GAAG,eAAe,CAAC,cAAc,CAAC;QAEtD,IAAI,cAAc,EAAE,CAAC;YACnB,oBAAoB,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE;gBAC3C,aAAa,CAAC,IAAI,CAChB,GAAG,6BAA6B,CAC9B,WAAW,EACX,cAAc,EACd,OAAO,CACR,CACF,CAAC;YACJ,CAAC,CAAC,CAAC;QACL,CAAC;QAED,MAAM,6BAA6B,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;YAC/D,MAAM,UAAU,GAAG,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC;YAC5C,MAAM,gBAAgB,GAAG,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;YACnE,IAAI,gBAAgB,IAAI,CAAC,IAAI,CAAC,CAAC,KAAK,IAAI,gBAAgB,EAAE,CAAC;gBACzD,OAAO,KAAK,CAAC;YACf,CAAC;YACD,OAAO,IAAI,CAAC;QACd,CAAC,CAAC,CAAC;QAEH,MAAM,aAAa,GACjB,WAAW,EAAE,oBAAoB,KAAK,KAAK;YACzC,CAAC,CAAC,6BAA6B,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;gBACzC,MAAM,UAAU,GAAG,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC;gBAC5C,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,KAAK,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC;oBAChD,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;oBACrC,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;oBACjC,IAAI,IAAI,EAAE,QAAQ,IAAI,IAAI,EAAE,QAAQ;wBAAE,OAAO,KAAK,CAAC;gBACrD,CAAC;gBACD,OAAO,IAAI,CAAC;YACd,CAAC,CAAC;YACJ,CAAC,CAAC,6BAA6B,CAAC;QAEpC,MAAM,YAAY,GAAG,aAAa,CAAC,MAAM,CACvC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC,EAClD,WAAW,CACZ,CAAC;QACF,MAAM,aAAa,GAAG,aAAa,CAAC,MAAM,CACxC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC,EAClD,YAAY,CACb,CAAC;QACF,MAAM,aAAa,GAAwB,IAAI,GAAG,EAAE,CAAC;QACrD,MAAM,aAAa,GAAG,EAAE,CAAC;QACzB,MAAM,iBAAiB,GAAG,aAAa,CAAC;QAExC,OAAO,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;YAChC,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;YACnE,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;YAEpE,MAAM,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,iBAAiB,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,iBAAiB,CAAC,EAAE,CAAC;YAC3F,MAAM,YAAY,GAAG,aAAa,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;YAEpD,IAAI,YAAY,GAAG,CAAC,EAAE,CAAC;gBACrB,CAAC,GAAG,CAAC,GAAG,YAAY,GAAG,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC;gBAC3C,IAAI,CAAC,GAAG,YAAY,GAAG,EAAE,EAAE,CAAC;oBAC1B,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC;oBACxD,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC;gBACnE,CAAC;YACH,CAAC;YACD,aAAa,CAAC,GAAG,CAAC,MAAM,EAAE,YAAY,GAAG,CAAC,CAAC,CAAC;YAE5C,OAAO;gBACL,GAAG,IAAI;gBACP,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE;aACnB,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,EACD;QACE,WAAW,EAAE,QAAQ;QACrB,eAAe;QACf,eAAe,EAAE,cAAc;QAC/B,WAAW,EAAE,UAAU;QACvB,WAAW,EAAE,oBAAoB;QACjC,WAAW,EAAE,UAAU;QACvB,WAAW,EAAE,oBAAoB;QACjC,YAAY;KACb,EACD;QACE,YAAY,EAAE,EAAE;QAChB,MAAM,EAAE,qBAAqB;QAC7B,SAAS,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,gBAAgB,CAAC;KACpD,CACF,CAAC;IAEF,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAE/C,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;QAC/B,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC;QAC/C,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAC1E,MAAM,aAAa,GACjB,IAAI,CAAC,KAAK,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAEjE,MAAM,kBAAkB,GACtB,CAAC,CAAC,aAAa,EAAE,QAAQ,IAAI,CAAC,CAAC,aAAa,EAAE,QAAQ,CAAC;QACzD,MAAM,cAAc,GAAG,uBAAuB,CAC5C,IAAI,CAAC,WAAW,CAAC,eAAe,CACjC,CAAC;QAEF,MAAM,YAAY,GAAG,cAAc,IAAI,kBAAkB,CAAC;QAE1D,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU;aAC9C,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC;aACpB,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC;QAErC,OAAO,CACL,KAAC,mBAAmB,IAElB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,YAAY,EAAE;gBACZ,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;gBAClB,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;aACnB,EACD,KAAK,EAAE,aAAa,EACpB,IAAI,EAAE,IAAI,EACV,mBAAmB,EAAE,IAAI,CAAC,OAAO,EACjC,kBAAkB,EAAE,IAAI,CAAC,MAAM,EAC/B,UAAU,EAAE,IAAI,CAAC,WAAW,CAAC,eAAe,EAAE,IAAI,EAClD,WAAW,EAAE,IAAI,CAAC,WAAW,IAAI,SAAS,EAC1C,YAAY,EAAE,YAAY,IAZrB,KAAK,CAaV,CACH,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC;AAWD,SAAS,qBAAqB,CAC5B,QAA2B,EAC3B,IAAuB;IAEvB,IAAI,QAAQ,CAAC,MAAM,KAAK,IAAI,CAAC,MAAM;QAAE,OAAO,KAAK,CAAC;IAClD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACzC,MAAM,YAAY,GAAG,QAAQ,CAAC,CAAC,CAAE,CAAC;QAClC,MAAM,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAE,CAAC;QAC1B,IACE,YAAY,CAAC,WAAW,CAAC,GAAG,KAAK,QAAQ,CAAC,WAAW,CAAC,GAAG;YACzD,YAAY,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK;YACrC,CAAC,YAAY,CAAC,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,IAAI,IAAI,CAAC;YAC7D,YAAY,CAAC,MAAM,KAAK,QAAQ,CAAC,MAAM;YACvC,YAAY,CAAC,WAAW,KAAK,QAAQ,CAAC,WAAW;YACjD,CAAC,UAAU,CACT,EAAE,GAAG,YAAY,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EACjD,EAAE,GAAG,QAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAC9C,EACD,CAAC;YACD,OAAO,KAAK,CAAC;QACf,CAAC;IACH,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,SAAS,mBAAmB,CAC1B,IAA6D,EAC7D,WAA2B;IAE3B,MAAM,QAAQ,GACZ,WAAW,KAAK,YAAY;QAC1B,CAAC,CAAC;YACE,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK;YACtB,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;SAC5B;QACH,CAAC,CAAC;YACE,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;YAC1B,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM;SACxB,CAAC;IAER,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED,SAAS,6BAA6B,CACpC,WAAwB,EACxB,QAAgC,EAChC,OAAuB;IAEvB,MAAM,KAAK,GAAsB,EAAE,CAAC;IACpC,MAAM,sBAAsB,GAAG,4BAA4B,CACzD,QAAQ,EACR,WAAW,CAAC,GAAG,EACf,OAAO,CACR,CAAC;IACF,MAAM,WAAW,GAAG,+BAA+B,CACjD,WAAW,EACX,QAAQ,EACR,OAAO,EACP,sBAAsB,EAAE,MAAM,CAAC,WAAW,CAC3C,CAAC;IACF,MAAM,cAAc,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACjD,MAAM,yBAAyB,GAAG,cAAc;QAC9C,CAAC,CAAC,0BAA0B,CAAC,QAAQ,EAAE,cAAc,EAAE,OAAO,CAAC;QAC/D,CAAC,CAAC,IAAI,CAAC;IACT,MAAM,iBAAiB,GAAG,WAAW,CAAC,eAAe;QACnD,CAAC,CAAC,0BAA0B,CAAC,QAAQ,EAAE,WAAW,CAAC,eAAe,EAAE,OAAO,CAAC;QAC5E,CAAC,CAAC,IAAI,CAAC;IACT,MAAM,aAAa,GACjB,sBAAsB,EAAE,IAAI;QAC5B,yBAAyB,EAAE,IAAI;QAC/B,iBAAiB,EAAE,IAAI,CAAC;IAE1B,IAAI,CAAC,aAAa;QAAE,OAAO,KAAK,CAAC;IAEjC,MAAM,mBAAmB,GACvB,CAAC,sBAAsB,EAAE,IAAI;QAC7B,CAAC,yBAAyB,EAAE,IAAI;QAChC,CAAC,CAAC,iBAAiB,EAAE,IAAI,CAAC;IAE5B,MAAM,QAAQ,GACZ,mBAAmB,IAAI,WAAW,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC;QACxD,CAAC,CAAC;YACE,CAAC,EAAE,aAAa,CAAC,CAAC,GAAG,aAAa,CAAC,KAAK,GAAG,CAAC;YAC5C,CAAC,EAAE,aAAa,CAAC,CAAC,GAAG,aAAa,CAAC,MAAM,GAAG,CAAC;SAC9C;QACH,CAAC,CAAC,yBAAyB,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;IAE5D,KAAK,CAAC,IAAI,CAAC;QACT,WAAW;QACX,QAAQ;QACR,KAAK,EAAE,CAAC;QACR,OAAO,EAAE,IAAI;QACb,MAAM,EACJ,mBAAmB,IAAI,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM;QACtE,WAAW,EAAE,sBAAsB,EAAE,MAAM,CAAC,WAAW;KACxD,CAAC,CAAC;IAEH,WAAW,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE;QAClD,MAAM,oBAAoB,GAAG,0BAA0B,CACrD,QAAQ,EACR,SAAS,EACT,OAAO,CACR,CAAC;QACF,IAAI,CAAC,oBAAoB,EAAE,IAAI;YAAE,OAAO;QAExC,KAAK,CAAC,IAAI,CAAC;YACT,WAAW;YACX,QAAQ,EAAE,mBAAmB,CAAC,oBAAoB,CAAC,IAAI,EAAE,WAAW,CAAC;YACrE,KAAK,EAAE,KAAK,GAAG,CAAC;YAChB,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ;YACzD,WAAW,EAAE,sBAAsB,EAAE,MAAM,CAAC,WAAW;SACxD,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,OAAO,KAAK,CAAC;AACf,CAAC;AAED,SAAS,yBAAyB,CAChC,IAAiB,EACjB,WAAsC;IAEtC,OAAO,WAAW,KAAK,YAAY;QACjC,CAAC,CAAC;YACE,CAAC,EAAE,IAAI,CAAC,CAAC;YACT,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC;SAC5B;QACH,CAAC,CAAC;YACE,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;YAC1B,CAAC,EAAE,IAAI,CAAC,CAAC;SACV,CAAC;AACR,CAAC;AAED,SAAS,+BAA+B,CACtC,WAAwB,EACxB,QAAgC,EAChC,OAAuB,EACvB,mBAA4B;IAE5B,IACE,mBAAmB,KAAK,YAAY;QACpC,mBAAmB,KAAK,UAAU,EAClC,CAAC;QACD,OAAO,mBAAmB,CAAC;IAC7B,CAAC;IAED,IAAI,WAAW,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACtC,MAAM,KAAK,GAAG,0BAA0B,CACtC,QAAQ,EACR,WAAW,CAAC,UAAU,CAAC,CAAC,CAAE,EAC1B,OAAO,CACR,CAAC;QACF,MAAM,MAAM,GAAG,0BAA0B,CACvC,QAAQ,EACR,WAAW,CAAC,UAAU,CAAC,CAAC,CAAE,EAC1B,OAAO,CACR,CAAC;QAEF,IAAI,KAAK,EAAE,IAAI,IAAI,MAAM,EAAE,IAAI,EAAE,CAAC;YAChC,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC9D,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YAC5D,OAAO,cAAc,GAAG,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU,CAAC;QACnE,CAAC;IACH,CAAC;IAED,OAAO,UAAU,CAAC;AACpB,CAAC;AAED,SAAS,uBAAuB,CAAC,SAA4B;IAC3D,IAAI,OAAO,GAAiC,SAAS,CAAC;IACtD,OAAO,OAAO,EAAE,CAAC;QACf,IAAI,OAAO,CAAC,QAAQ;YAAE,OAAO,IAAI,CAAC;QAClC,OAAO,GAAG,OAAO,CAAC,iBAAiB,EAAE,eAAe,CAAC;IACvD,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC"}
+{"version":3,"file":"PlaceholderDropZones.js","sourceRoot":"","sources":["../../../src/editor/page-editor-chrome/PlaceholderDropZones.tsx"],"names":[],"mappings":"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"}

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

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { useEditContext, useFieldsEditContext } from "../client/editContext";
-import * as DiffLib from "diff";
 import { SuggestionDisplayPopover } from "../reviews/SuggestionDisplayPopover";
 import { measureBridgeTextRangeRects, rectListEquals, } from "./overlay/geometry";
 import { useOverlayMeasurement } from "./overlay/useOverlayMeasurement";
 import { dedupeFeedbackHighlightItems, FeedbackHighlightBadge, FeedbackHighlightBadgeTray, } from "./FeedbackHighlightBadge";
+import { getSuggestedEditScrollIntoViewTarget, getSuggestedEditTextRangeKey, getSuggestionRangeData, } from "../reviews/feedbackScrollTarget";
 const SUGGESTION_BRIDGE_SOURCE = "suggestions";
 function suggestionMeasurementsEqual(previous, next) {
     const previousKeys = Object.keys(previous);
@@ -61,48 +61,7 @@ export function SuggestionHighlightings({ pageViewContext, variant = "default",
                     },
                     fieldId: suggestion.fieldId,
                 });
-                const oldValue = toPlainSuggestionText(suggestion.oldValue ?? field?.rawValue ?? "");
-                const newValue = toPlainSuggestionText(suggestion.newValue ?? "");
-                if (oldValue === newValue) {
-                    nextRangeData[suggestion.id] = {
-                        oldRanges: [],
-                        newRanges: [],
-                        oldText: oldValue,
-                        newText: newValue,
-                    };
-                    return;
-                }
-                const diffResult = DiffLib.diffChars(oldValue, newValue);
-                const oldChangeRanges = [];
-                const newChangeRanges = [];
-                let positionInOld = 0;
-                let positionInNew = 0;
-                for (const part of diffResult) {
-                    if (part.removed) {
-                        oldChangeRanges.push([
-                            positionInOld,
-                            positionInOld + part.value.length,
-                        ]);
-                        positionInOld += part.value.length;
-                    }
-                    else if (part.added) {
-                        newChangeRanges.push([
-                            positionInNew,
-                            positionInNew + part.value.length,
-                        ]);
-                        positionInNew += part.value.length;
-                    }
-                    else {
-                        positionInOld += part.value.length;
-                        positionInNew += part.value.length;
-                    }
-                }
-                nextRangeData[suggestion.id] = {
-                    oldRanges: mergeRanges(oldChangeRanges),
-                    newRanges: mergeRanges(newChangeRanges),
-                    oldText: oldValue,
-                    newText: newValue,
-                };
+                nextRangeData[suggestion.id] = getSuggestionRangeData(suggestion.oldValue ?? field?.rawValue ?? "", suggestion.newValue ?? "");
             }));
             if (!cancelled) {
                 setRangeDataBySuggestionId(nextRangeData);
@@ -123,7 +82,7 @@ export function SuggestionHighlightings({ pageViewContext, variant = "default",
             ? rangeData.newRanges
             : rangeData.oldRanges;
         return ranges.map(([start, end]) => ({
-            key: getSuggestionTextRangeKey(suggestion),
+            key: getSuggestedEditTextRangeKey(suggestion),
             fieldId: suggestion.fieldId,
             item: {
                 id: suggestion.itemId,
@@ -207,7 +166,7 @@ export function SuggestionHighlightings({ pageViewContext, variant = "default",
                 continue;
             if (!rangeDataBySuggestionId[suggestion.id])
                 continue;
-            const rects = measureBridgeTextRangeRects(bridgeGeometry, getSuggestionTextRangeKey(suggestion), metrics);
+            const rects = measureBridgeTextRangeRects(bridgeGeometry, getSuggestedEditTextRangeKey(suggestion), metrics);
             if (rects.length === 0) {
                 const previousMeasurement = lastMeasurementsRef.current[suggestion.id];
                 if (canReusePreviousMeasurement &&
@@ -254,6 +213,9 @@ export function SuggestionHighlightings({ pageViewContext, variant = "default",
     }, [suggestions, measurements]);
     if (!editContext)
         return null;
+    const selectedCommentId = editContext.selectedComment?.id;
+    const selectedSuggestedEditId = editContext.selectedSuggestedEdit?.id;
+    const hasSelectedFeedback = !!selectedCommentId || !!selectedSuggestedEditId;
     return (_jsx(_Fragment, { children: overlayGroups.flatMap((group) => {
             const badgeSuggestions = dedupeFeedbackHighlightItems(group.suggestions);
             return group.rects.map((rect, index) => (_jsxs("div", { style: {
@@ -273,24 +235,43 @@ export function SuggestionHighlightings({ pageViewContext, variant = "default",
                                 : group.isTextRange
                                     ? -9
                                     : 8,
-                        }, children: badgeSuggestions.map((suggestion, badgeIndex) => (_jsx(SuggestionDisplayPopover, { suggestion: suggestion, onSuggestionUpdated: () => { }, children: _jsx(FeedbackHighlightBadge, { item: suggestion, variant: variant, minimapColorClassName: "bg-component-suggestions", zIndex: badgeSuggestions.length - badgeIndex + 100, testId: "suggestion-highlight-icon", ariaSubject: "suggestion", onClick: () => {
-                                    editContext.select([suggestion.itemId]);
-                                    modifiedFields?.setFocusedField({
-                                        item: {
-                                            id: suggestion.itemId,
-                                            language: suggestion.mainItemLanguage,
-                                            version: suggestion.mainItemVersion,
-                                        },
-                                        fieldId: suggestion.fieldId,
-                                    }, true);
-                                } }) }, suggestion.id))) })), _jsx("div", { "data-testid": "suggested-edit-highlight", className: group.isTextRange
-                            ? "bg-feedback-green/15 absolute inset-0 rounded-sm"
-                            : "bg-feedback-green/10 absolute inset-0 rounded-[3px]" })] }, `${group.key}-${index}`)));
+                        }, children: badgeSuggestions.map((suggestion, badgeIndex) => {
+                            const isSelected = suggestion.id === selectedSuggestedEditId;
+                            const isDimmed = hasSelectedFeedback && !isSelected;
+                            return (_jsx(SuggestionDisplayPopover, { suggestion: suggestion, onSuggestionUpdated: () => { }, children: _jsx(FeedbackHighlightBadge, { item: suggestion, isSelected: isSelected, isDimmed: isDimmed, variant: variant, minimapColorClassName: "bg-component-suggestions", zIndex: isSelected
+                                        ? badgeSuggestions.length + 101
+                                        : badgeSuggestions.length - badgeIndex + 100, testId: "suggestion-highlight-icon", ariaSubject: "suggestion", onClick: () => {
+                                        editContext.setSelectedComment(undefined);
+                                        editContext.setSelectedSuggestedEdit(suggestion);
+                                        editContext.setScrollIntoView(getSuggestedEditScrollIntoViewTarget(suggestion));
+                                        editContext.select([suggestion.itemId]);
+                                        modifiedFields?.setFocusedField({
+                                            item: {
+                                                id: suggestion.itemId,
+                                                language: suggestion.mainItemLanguage,
+                                                version: suggestion.mainItemVersion,
+                                            },
+                                            fieldId: suggestion.fieldId,
+                                        }, true);
+                                    } }) }, suggestion.id));
+                        }) })), (hasSelectedFeedback
+                        ? group.suggestions.map((suggestion) => [suggestion])
+                        : [group.suggestions]).map((suggestions, highlightIndex) => {
+                        const isSelected = suggestions.length === 1 &&
+                            suggestions[0]?.id === selectedSuggestedEditId;
+                        const isDimmed = hasSelectedFeedback && !isSelected;
+                        const highlightKey = suggestions
+                            .map((suggestion) => suggestion.id)
+                            .join("-");
+                        return (_jsx("div", { "data-testid": "suggested-edit-highlight", "data-feedback-selected": isSelected ? "true" : undefined, "data-feedback-dimmed": isDimmed ? "true" : undefined, className: group.isTextRange
+                                ? "absolute inset-0 rounded-sm"
+                                : "absolute inset-0 rounded-[3px]", style: {
+                                ...getSuggestionHighlightStyle(isSelected, isDimmed),
+                                zIndex: isSelected ? 2 : 0,
+                            } }, highlightKey || highlightIndex));
+                    })] }, `${group.key}-${index}`)));
         }) }));
 }
-function getSuggestionTextRangeKey(suggestion) {
-    return `suggestion:${suggestion.id}`;
-}
 function hasAnyExpectedBridgeTextRange(geometry, textRanges) {
     if (!geometry)
         return false;
@@ -305,13 +286,6 @@ function hasAllExpectedBridgeTextRanges(geometry, textRanges) {
         .map((target) => target.key));
     return textRanges.every((range) => availableKeys.has(range.key));
 }
-function toPlainSuggestionText(value) {
-    if (!value || !/[<&]/.test(value))
-        return value || "";
-    const template = document.createElement("template");
-    template.innerHTML = value;
-    return template.content.textContent || "";
-}
 function getSuggestionMeasurementKey(measurement) {
     const rectKey = measurement.rects
         .map((rect) => `${roundMeasurement(rect.x)}:${roundMeasurement(rect.y)}:${roundMeasurement(rect.width)}:${roundMeasurement(rect.height)}`)
@@ -321,25 +295,14 @@ function getSuggestionMeasurementKey(measurement) {
 function roundMeasurement(value) {
     return Math.round(value * 2) / 2;
 }
-function mergeRanges(changeRanges) {
-    const mergedRanges = [];
-    if (changeRanges.length === 0)
-        return mergedRanges;
-    changeRanges.sort((a, b) => a[0] - b[0]);
-    let currentRange = [...changeRanges[0]];
-    for (let i = 1; i < changeRanges.length; i++) {
-        const nextRange = changeRanges[i];
-        if (!nextRange)
-            continue;
-        if (nextRange[0] <= currentRange[1] + 3) {
-            currentRange[1] = Math.max(currentRange[1], nextRange[1]);
-        }
-        else {
-            mergedRanges.push([currentRange[0], currentRange[1]]);
-            currentRange = [...nextRange];
-        }
-    }
-    mergedRanges.push([currentRange[0], currentRange[1]]);
-    return mergedRanges;
+function getSuggestionHighlightStyle(isSelected, isDimmed) {
+    const fillStrength = isDimmed ? 6 : isSelected ? 28 : 15;
+    return {
+        background: `color-mix(in srgb, var(--color-feedback-green) ${fillStrength}%, transparent)`,
+        opacity: isDimmed ? 0.42 : 1,
+        boxShadow: isSelected
+            ? "0 1px 5px color-mix(in srgb, var(--color-feedback-green) 22%, transparent)"
+            : undefined,
+    };
 }
 //# sourceMappingURL=SuggestionHighlightings.js.map