@ohhwells/bridge 0.1.38-next.69 → 0.1.38-next.71

package/dist/index.cjs

@@ -7593,7 +7593,7 @@ function isInferredFooterGroup(el) {
   return Array.from(el.querySelectorAll(":scope > [data-ohw-href-key]")).some(isNavigationItem);
 }
 function isNavigationContainer(el) {
-  return el.hasAttribute("data-ohw-nav-container") || isNavigationRoot(el) || isInferredFooterGroup(el);
+  return el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-footer-col") || isNavigationRoot(el) || isInferredFooterGroup(el);
 }
 function isPointOverNavigation(x, y) {
   const navRoot = document.querySelector("[data-ohw-nav-root]") ?? document.querySelector("nav");
@@ -8245,14 +8245,28 @@ function OhhwellsBridge() {
   const runSectionsPrefetchRef = (0, import_react9.useRef)(runSectionsPrefetch);
   runSectionsPrefetchRef.current = runSectionsPrefetch;
   (0, import_react9.useEffect)(() => {
-    if (!linkPopover) return;
+    if (!linkPopover) {
+      document.documentElement.removeAttribute("data-ohw-link-popover-open");
+      return;
+    }
+    document.documentElement.setAttribute("data-ohw-link-popover-open", "");
     if (hoveredImageRef.current) {
       hoveredImageRef.current = null;
       hoveredImageHasTextOverlapRef.current = false;
     }
     hoveredGapRef.current = null;
     setSectionGap(null);
+    hoveredItemElRef.current = null;
+    setHoveredItemRect(null);
+    hoveredNavContainerRef.current = null;
+    setHoveredNavContainerRect(null);
+    document.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
+      el.removeAttribute("data-ohw-hovered");
+    });
     postToParent2({ type: "ow:image-unhover" });
+    return () => {
+      document.documentElement.removeAttribute("data-ohw-link-popover-open");
+    };
   }, [linkPopover, postToParent2]);
   (0, import_react9.useEffect)(() => {
     if (!isEditMode) return;
@@ -8528,6 +8542,53 @@ function OhhwellsBridge() {
         movedColumnIndex = Math.max(0, Math.min(adjusted, nextOrder.length - 1));
       }
       clearFooterDragVisuals();
+      const applySelectionAfterDrop = () => {
+        if (!wasSelected) {
+          deselectRef.current();
+          return;
+        }
+        if (hrefKey) {
+          const link = document.querySelector(
+            `footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
+          );
+          if (link && isNavigationItem(link)) {
+            selectRef.current(link);
+            return;
+          }
+        }
+        if (movedColumnIndex !== null && nextOrder) {
+          const colKeys = nextOrder[movedColumnIndex] ?? [];
+          let column = null;
+          for (const key of colKeys) {
+            const link = document.querySelector(
+              `footer [data-ohw-href-key="${CSS.escape(key)}"]`
+            );
+            if (link) {
+              column = findFooterColumnForLink(link);
+              if (column) break;
+            }
+          }
+          if (!column) column = listFooterColumns()[movedColumnIndex] ?? null;
+          if (column && isNavigationContainer(column)) {
+            selectFrameRef.current(column);
+            return;
+          }
+        }
+        if (document.body.contains(draggedEl)) {
+          if (isNavigationItem(draggedEl)) {
+            selectRef.current(draggedEl);
+            return;
+          }
+          if (isNavigationContainer(draggedEl)) {
+            selectFrameRef.current(draggedEl);
+            return;
+          }
+        }
+        deselectRef.current();
+      };
+      if (!wasSelected) {
+        deselectRef.current();
+      }
       if (nextOrder) {
         const orderJson = JSON.stringify(nextOrder);
         editContentRef.current = {
@@ -8536,25 +8597,20 @@ function OhhwellsBridge() {
         };
         applyFooterOrder(nextOrder);
         document.querySelectorAll("footer [data-ohw-href-key]").forEach(disableNativeHrefDrag);
+        postToParentRef.current({
+          type: "ow:change",
+          nodes: [{ key: FOOTER_ORDER_KEY, text: orderJson }]
+        });
         requestAnimationFrame(() => {
           if (editContentRef.current[FOOTER_ORDER_KEY] === orderJson) {
             applyFooterOrder(nextOrder);
             document.querySelectorAll("footer [data-ohw-href-key]").forEach(disableNativeHrefDrag);
           }
+          requestAnimationFrame(applySelectionAfterDrop);
         });
-        postToParentRef.current({
-          type: "ow:change",
-          nodes: [{ key: FOOTER_ORDER_KEY, text: orderJson }]
-        });
-      }
-      const still = (hrefKey ? document.querySelector(`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`) : null) ?? (movedColumnIndex !== null ? listFooterColumns()[movedColumnIndex] ?? null : null) ?? (document.body.contains(draggedEl) ? draggedEl : null);
-      if (still && isNavigationItem(still)) {
-        selectRef.current(still);
-      } else if (still && isNavigationContainer(still)) {
-        selectFrameRef.current(still);
-      } else if (wasSelected) {
-        deselectRef.current();
+        return;
       }
+      applySelectionAfterDrop();
     },
     [clearFooterDragVisuals]
   );
@@ -9028,6 +9084,9 @@ function OhhwellsBridge() {
         outline-offset: 6px;
         border-radius: 8px;
       }
+      html[data-ohw-link-popover-open] footer [data-ohw-footer-col]:hover {
+        outline: none !important;
+      }
       html[data-ohw-footer-press-drag] footer,
       html[data-ohw-footer-press-drag] footer * {
         user-select: none !important;
@@ -9260,6 +9319,13 @@ function OhhwellsBridge() {
     const handleMouseOver = (e) => {
       if (document.documentElement.hasAttribute("data-ohw-section-picking")) return;
       const target = e.target;
+      if (linkPopoverOpenRef.current) {
+        hoveredItemElRef.current = null;
+        setHoveredItemRect(null);
+        hoveredNavContainerRef.current = null;
+        setHoveredNavContainerRect(null);
+        return;
+      }
       if (toolbarVariantRef.current !== "select-frame") {
         const navContainer = target.closest("[data-ohw-nav-container]");
         if (navContainer && !getNavigationItemAnchor(target)) {
@@ -10436,6 +10502,9 @@ function OhhwellsBridge() {
     };
     const onPointerDown = (e) => {
       if (e.button !== 0) return;
+      if (suppressNextClickRef.current && !footerDragRef.current && !footerPointerDragRef.current?.started) {
+        suppressNextClickRef.current = false;
+      }
       if (footerDragRef.current) return;
       const target = e.target;
       if (!target) return;
@@ -10822,7 +10891,7 @@ function OhhwellsBridge() {
       )),
       hoveredNavContainerRect && toolbarVariant !== "select-frame" && !linkPopover && !isItemDragging && !siblingHintRect && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
       toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
-      hoveredItemRect && !hoveredNavContainerRect && !siblingHintRect && siblingHintRects.length === 0 && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
+      hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !siblingHintRect && siblingHintRects.length === 0 && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
       toolbarRect && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: isItemDragging && draggedItemRect && footerDragRef.current?.wasSelected ? draggedItemRect : toolbarRect, elRef: glowElRef, state: isItemDragging ? "dragging" : resolveItemInteractionState(toolbarRect, parentScrollRef.current), showHandle: toolbarVariant === "link-action" && Boolean(reorderHrefKey) || toolbarVariant === "select-frame" && isFooterFrameSelection, dragDisabled: reorderDragDisabled, dragHandleLabel: reorderHrefKey ? `Reorder ${reorderHrefKey}` : "Reorder item", onDragHandleDragStart: handleItemDragStart, onDragHandleDragEnd: handleItemDragEnd, onItemPointerDown: handleItemChromePointerDown, onItemClick: handleItemChromeClick, toolbar: toolbarVariant === "link-action" && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemActionToolbar, { onEditLink: openLinkPopoverForSelected, addItemDisabled: true, editLinkDisabled: false, moreDisabled: true }) : void 0 }),
       toolbarRect && toolbarVariant === "rich-text" && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(EditGlowChrome, { rect: toolbarRect, elRef: glowElRef, reorderHrefKey, dragDisabled: reorderDragDisabled }),