@ohhwells/bridge 0.1.52 → 0.1.53

package/dist/index.js

@@ -1,7 +1,7 @@
 "use client";
 
 // src/OhhwellsBridge.tsx
-import React10, { useCallback as useCallback5, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useRef as useRef7, useState as useState9 } from "react";
+import React10, { useCallback as useCallback5, useEffect as useEffect10, useLayoutEffect as useLayoutEffect3, useRef as useRef7, useState as useState9 } from "react";
 import { createRoot } from "react-dom/client";
 import { flushSync } from "react-dom";
 
@@ -16,6 +16,9 @@ function getStoredLinkHref(key) {
 function clearStoredLinkHref(key) {
   linkHrefStore.delete(key);
 }
+function listStoredLinkHrefs() {
+  return Array.from(linkHrefStore.entries());
+}
 function enforceLinkHrefs() {
   document.querySelectorAll("[data-ohw-href-key]").forEach((el) => {
     const key = el.getAttribute("data-ohw-href-key") ?? "";
@@ -50,8 +53,40 @@ function useLinkHrefGuardian(...deps) {
   }, deps);
 }
 
+// src/useSavedLinkNavigation.ts
+import { useEffect } from "react";
+import { useRouter } from "next/navigation";
+function isRouterHref(href) {
+  return href.startsWith("/") || href.startsWith("#");
+}
+function shouldLetBrowserHandle(e, anchor) {
+  return e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || anchor.hasAttribute("download") || anchor.target !== "" && anchor.target !== "_self";
+}
+function useSavedLinkNavigation(isEditMode) {
+  const router = useRouter();
+  useEffect(() => {
+    if (isEditMode) return;
+    const onClick = (e) => {
+      const anchor = e.target?.closest(
+        "a[data-ohw-href-key]"
+      );
+      if (!anchor || shouldLetBrowserHandle(e, anchor)) return;
+      const key = anchor.getAttribute("data-ohw-href-key");
+      if (!key || getStoredLinkHref(key) === void 0) return;
+      const href = anchor.getAttribute("href");
+      if (!href) return;
+      e.preventDefault();
+      e.stopPropagation();
+      if (isRouterHref(href)) router.push(href);
+      else window.location.assign(href);
+    };
+    document.addEventListener("click", onClick, true);
+    return () => document.removeEventListener("click", onClick, true);
+  }, [isEditMode, router]);
+}
+
 // src/ui/SchedulingWidget.tsx
-import { useCallback, useEffect, useId, useMemo, useRef, useState as useState2 } from "react";
+import { useCallback, useEffect as useEffect2, useId, useMemo, useRef, useState as useState2 } from "react";
 
 // src/ui/EmailCaptureModal.tsx
 import { useState } from "react";
@@ -366,7 +401,7 @@ function ScheduleView({ schedule, dates, selectedIdx, onSelectDate, onOpenModal
     setCanScrollLeft(el.scrollLeft > 0);
     setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);
   };
-  useEffect(() => {
+  useEffect2(() => {
     const el = scrollRef.current;
     if (!el) return;
     updateScrollState();
@@ -624,7 +659,7 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
     });
   }, []);
   const [selectedIdx, setSelectedIdx] = useState2(0);
-  useEffect(() => {
+  useEffect2(() => {
     if (!schedule?.classes) return;
     for (let i = 0; i < dates.length; i++) {
       if (schedule.classes.some((c) => classRunsOnDate(c, dates[i], schedule.type))) {
@@ -633,7 +668,7 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
       }
     }
   }, [schedule, dates]);
-  useEffect(() => {
+  useEffect2(() => {
     if (typeof window === "undefined") return;
     const onVisible = () => {
       if (!document.hidden) void refetchLiveSchedule();
@@ -645,7 +680,7 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
       document.removeEventListener("visibilitychange", onVisible);
     };
   }, [refetchLiveSchedule]);
-  useEffect(() => {
+  useEffect2(() => {
     if (typeof window === "undefined") return;
     const isInEditor = window.self !== window.top;
     setInEditor(isInEditor);
@@ -5240,7 +5275,43 @@ function CarouselOverlay({
 
 // src/OhhwellsBridge.tsx
 import { createPortal as createPortal2 } from "react-dom";
-import { usePathname as usePathname2, useRouter as useRouter2, useSearchParams } from "next/navigation";
+import { usePathname as usePathname2, useRouter as useRouter3, useSearchParams } from "next/navigation";
+
+// src/lib/cta-button.ts
+function isCtaButton(el) {
+  return Boolean(
+    el.closest('[data-ohw-role="navbar-button"], [data-ohw-role="button"]')
+  );
+}
+var CTA_BUTTON_SELECTOR = '[data-ohw-role="navbar-button"], [data-ohw-role="button"]';
+
+// src/lib/media-overlay-guards.ts
+var BRIDGE_CHROME_SELECTOR = [
+  "[data-ohw-toolbar]",
+  "[data-ohw-item-toolbar-anchor]",
+  "[data-ohw-drag-handle-container]",
+  '[data-slot="drag-handle"]',
+  "[data-ohw-more-menu]",
+  '[data-slot="dropdown-menu-content"]'
+].join(", ");
+function containsPoint(el, x, y) {
+  const r2 = el.getBoundingClientRect();
+  if (r2.width <= 0 || r2.height <= 0) return false;
+  return x >= r2.left && x <= r2.right && y >= r2.top && y <= r2.bottom;
+}
+function isPointOverBridgeChrome(x, y) {
+  for (const el of document.querySelectorAll(BRIDGE_CHROME_SELECTOR)) {
+    if (containsPoint(el, x, y)) return true;
+  }
+  return false;
+}
+function findCtaButtonAtPoint(x, y, media) {
+  const hits = Array.from(
+    document.querySelectorAll(CTA_BUTTON_SELECTOR)
+  ).filter((el) => containsPoint(el, x, y) && !(media && el.contains(media)));
+  if (hits.length === 0) return null;
+  return hits.reduce((best, el) => best.contains(el) ? el : best);
+}
 
 // src/lib/session-search.ts
 var STORAGE_KEY = "ohw-preserved-search";
@@ -5518,7 +5589,7 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
 }
 
 // src/ui/link-modal/LinkPopover.tsx
-import { useEffect as useEffect6 } from "react";
+import { useEffect as useEffect7 } from "react";
 
 // src/ui/dialog.tsx
 import * as React7 from "react";
@@ -5718,7 +5789,7 @@ function SectionTreeItem({
 }
 
 // src/ui/link-modal/UrlOrPageInput.tsx
-import { useEffect as useEffect3, useId as useId2, useRef as useRef4, useState as useState4 } from "react";
+import { useEffect as useEffect4, useId as useId2, useRef as useRef4, useState as useState4 } from "react";
 
 // src/ui/input.tsx
 import * as React8 from "react";
@@ -5790,7 +5861,7 @@ function UrlOrPageInput({
   const inputRef = useRef4(null);
   const rootRef = useRef4(null);
   const [isFocused, setIsFocused] = useState4(false);
-  useEffect3(() => {
+  useEffect4(() => {
     if (!dropdownOpen) return;
     const isOutside = (e) => {
       const root = rootRef.current;
@@ -5998,10 +6069,10 @@ function LinkEditorPanel({ state, onClose }) {
 }
 
 // src/ui/link-modal/SectionPickerOverlay.tsx
-import { useCallback as useCallback2, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef5, useState as useState5 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect5, useMemo as useMemo2, useRef as useRef5, useState as useState5 } from "react";
 import { createPortal } from "react-dom";
 import { ArrowLeft, Check } from "lucide-react";
-import { usePathname, useRouter } from "next/navigation";
+import { usePathname, useRouter as useRouter2 } from "next/navigation";
 import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
 var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
 function rectsEqual(a, b) {
@@ -6040,7 +6111,7 @@ function useSectionRects(sectionIdsKey, enabled) {
     () => sectionIdsKey ? sectionIdsKey.split("\0") : [],
     [sectionIdsKey]
   );
-  useEffect4(() => {
+  useEffect5(() => {
     if (!enabled || sectionIds.length === 0) {
       setRects((prev) => prev.size === 0 ? prev : /* @__PURE__ */ new Map());
       return;
@@ -6079,7 +6150,7 @@ function SectionPickerOverlay({
   onBack,
   onSelect
 }) {
-  const router = useRouter();
+  const router = useRouter2();
   const pathname = usePathname();
   const [selectedId, setSelectedId] = useState5(null);
   const [hoveredId, setHoveredId] = useState5(null);
@@ -6095,12 +6166,12 @@ function SectionPickerOverlay({
   );
   const normalizedTarget = normalizePath(pagePath);
   const isOnTargetPage = normalizePath(pathname) === normalizedTarget;
-  useEffect4(() => {
+  useEffect5(() => {
     if (isOnTargetPage) return;
     const search = readPreservedSearch();
     router.push(`${normalizedTarget}${search}`);
   }, [isOnTargetPage, normalizedTarget, router]);
-  useEffect4(() => {
+  useEffect5(() => {
     document.documentElement.setAttribute("data-ohw-section-picking", "");
     document.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
       el.removeAttribute("data-ohw-hovered");
@@ -6138,7 +6209,7 @@ function SectionPickerOverlay({
     },
     []
   );
-  useEffect4(() => {
+  useEffect5(() => {
     const applyClip = (iframeOffsetTop, visibleCanvasTop, canvasH) => {
       const top = Math.max(0, visibleCanvasTop - iframeOffsetTop);
       const bottom = Math.min(
@@ -6180,12 +6251,12 @@ function SectionPickerOverlay({
       window.removeEventListener("resize", onResize);
     };
   }, [applyHoverAt]);
-  useEffect4(() => {
+  useEffect5(() => {
     const ptr = pointerRef.current;
     if (!ptr) return;
     applyHoverAt(ptr.x, ptr.y, rects);
   }, [rects, applyHoverAt]);
-  useEffect4(() => {
+  useEffect5(() => {
     const rememberPointer = (clientX, clientY) => {
       pointerRef.current = { x: clientX, y: clientY };
       const top = iframeOffsetTopRef.current;
@@ -6217,7 +6288,7 @@ function SectionPickerOverlay({
     },
     [selectedId, onSelect]
   );
-  useEffect4(() => {
+  useEffect5(() => {
     const onKeyDown = (e) => {
       if (e.key === "Escape") {
         e.preventDefault();
@@ -6340,7 +6411,7 @@ function SectionPickerOverlay({
 }
 
 // src/ui/link-modal/useLinkModalState.ts
-import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo3, useState as useState6 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect6, useMemo as useMemo3, useState as useState6 } from "react";
 function useLinkModalState({
   open,
   mode,
@@ -6367,7 +6438,7 @@ function useLinkModalState({
     setDropdownOpen(false);
     setUrlError("");
   }, []);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!open) return;
     if (mode === "edit" && initialTarget) {
       const { pageRoute } = parseTarget(initialTarget);
@@ -6533,7 +6604,7 @@ function LinkPopover({
     onSubmit
   });
   const sectionPickerActive = state.showSectionPicker && Boolean(state.selectedPage);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!open) return;
     if (sectionPickerActive) {
       postToParent({ type: "ui:unlock" });
@@ -6861,12 +6932,9 @@ function getLinkHref(el) {
   }
   return el.getAttribute("href") ?? "";
 }
-function isNavbarButton(el) {
-  return el.hasAttribute("data-ohw-role") && el.getAttribute("data-ohw-role") === "navbar-button";
-}
 function isNavbarLinkItem(el) {
   if (!el.matches("[data-ohw-href-key]")) return false;
-  if (isNavbarButton(el)) return false;
+  if (isCtaButton(el)) return false;
   if (!el.querySelector('[data-ohw-editable="text"]')) return false;
   return Boolean(el.closest("nav, [data-ohw-nav-container], [data-ohw-nav-drawer]"));
 }
@@ -6947,7 +7015,7 @@ function buildNavLink(index, href, label, template) {
 }
 function insertNavLinkInContainer(container, anchor, afterHrefKey) {
   if (!afterHrefKey) {
-    const cta = container.querySelector('[data-ohw-role="navbar-button"]');
+    const cta = container.querySelector(CTA_BUTTON_SELECTOR);
     if (cta && cta.parentElement === container) {
       container.insertBefore(anchor, cta);
       return;
@@ -8828,7 +8896,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
 }
 
 // src/useNavItemDrag.ts
-import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef6, useState as useState7 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect8, useRef as useRef6, useState as useState7 } from "react";
 function useNavItemDrag({
   isEditMode,
   editContentRef,
@@ -8850,8 +8918,7 @@ function useNavItemDrag({
   setSiblingHintRects,
   setToolbarRect,
   getNavigationItemAnchor: getNavigationItemAnchor2,
-  isDragHandleDisabled: isDragHandleDisabled2,
-  isNavbarButton: isNavbarButton3
+  isDragHandleDisabled: isDragHandleDisabled2
 }) {
   const navDragRef = useRef6(null);
   const [navDropSlots, setNavDropSlots] = useState7([]);
@@ -8998,7 +9065,7 @@ function useNavItemDrag({
       if (footerDragRef.current) return false;
       const hrefKey = anchor.getAttribute("data-ohw-href-key");
       if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
-      if (isNavbarButton3(anchor) || isDragHandleDisabled2(anchor)) return false;
+      if (isCtaButton(anchor) || isDragHandleDisabled2(anchor)) return false;
       beginNavDrag({
         hrefKey,
         wasSelected,
@@ -9009,7 +9076,7 @@ function useNavItemDrag({
       });
       return true;
     },
-    [beginNavDrag, footerDragRef, isDragHandleDisabled2, isNavbarButton3]
+    [beginNavDrag, footerDragRef, isDragHandleDisabled2, isCtaButton]
   );
   const onNavDragOver = useCallback4(
     (e) => {
@@ -9023,7 +9090,7 @@ function useNavItemDrag({
     },
     []
   );
-  useEffect7(() => {
+  useEffect8(() => {
     if (!isEditMode) return;
     const THRESHOLD = 10;
     const resolveWasSelected = (el) => {
@@ -9045,7 +9112,7 @@ function useNavItemDrag({
       const anchor = getNavigationItemAnchor2(target);
       const hrefKey = anchor?.getAttribute("data-ohw-href-key") ?? null;
       if (!anchor || !isNavbarHrefKey(hrefKey)) return;
-      if (isNavbarButton3(anchor) || isDragHandleDisabled2(anchor)) return;
+      if (isCtaButton(anchor) || isDragHandleDisabled2(anchor)) return;
       navPointerDragRef.current = {
         el: anchor,
         startX: e.clientX,
@@ -9142,7 +9209,7 @@ function useNavItemDrag({
     getNavigationItemAnchor2,
     isDragHandleDisabled2,
     isEditMode,
-    isNavbarButton3,
+    isCtaButton,
     linkPopoverOpenRef,
     selectedElRef,
     setLinkPopover,
@@ -9152,7 +9219,7 @@ function useNavItemDrag({
     (selected, clientX, clientY, pointerId) => {
       const hrefKey = selected.getAttribute("data-ohw-href-key");
       if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
-      if (isNavbarButton3(selected) || isDragHandleDisabled2(selected)) return false;
+      if (isCtaButton(selected) || isDragHandleDisabled2(selected)) return false;
       navPointerDragRef.current = {
         el: selected,
         startX: clientX,
@@ -9163,7 +9230,7 @@ function useNavItemDrag({
       };
       return true;
     },
-    [isDragHandleDisabled2, isNavbarButton3]
+    [isDragHandleDisabled2, isCtaButton]
   );
   return {
     navDragRef,
@@ -9230,7 +9297,7 @@ function FooterContainerChrome({
 }
 
 // src/lib/carousel.ts
-import { useEffect as useEffect8, useState as useState8 } from "react";
+import { useEffect as useEffect9, useState as useState8 } from "react";
 var CAROUSEL_ATTR = "data-ohw-carousel";
 var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
 var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
@@ -9293,7 +9360,7 @@ function applyCarouselNode(key, val) {
 }
 function useOhwCarousel(key, initial) {
   const [images, setImages] = useState8(initial);
-  useEffect8(() => {
+  useEffect9(() => {
     const el = document.querySelector(
       `[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
     );
@@ -9358,6 +9425,9 @@ function collectEditableNodes(extraContent) {
     if (!key) return;
     nodes.push({ key, type: "link", text: getLinkHref3(el) });
   });
+  for (const [key, href] of listStoredLinkHrefs()) {
+    nodes.push({ key, type: "link", text: href });
+  }
   if (extraContent) {
     for (const key of [NAV_ORDER_KEY, FOOTER_ORDER_KEY, NAV_COUNT_KEY]) {
       const text = extraContent[key];
@@ -10086,9 +10156,6 @@ function getHrefKeyFromElement(el) {
   if (!key) return null;
   return { anchor, key };
 }
-function isNavbarButton2(el) {
-  return Boolean(el.closest('[data-ohw-role="navbar-button"]'));
-}
 function isNavDropdownPanelOpen(childrenRoot) {
   if (childrenRoot.closest("[data-ohw-nav-drawer]")) return true;
   const group = childrenRoot.closest("[data-ohw-nav-group]");
@@ -10141,7 +10208,7 @@ function listNavigationItems() {
   ).filter((el) => isNavigationItem2(el));
 }
 function getNavigationItemReorderState(anchor) {
-  if (isNavbarButton2(anchor)) return { key: null, disabled: false };
+  if (isCtaButton(anchor)) return { key: null, disabled: false };
   return getReorderHandleStateFromAnchor(anchor);
 }
 function getReorderHandleState(el) {
@@ -10243,7 +10310,7 @@ function findHoveredNavOrFooterContainer(x, y) {
 }
 function isPointOverNavItem(container, x, y) {
   return Array.from(container.querySelectorAll("[data-ohw-href-key]")).some((el) => {
-    if (!isNavigationItem2(el) || isNavbarButton2(el)) return false;
+    if (!isNavigationItem2(el) || isCtaButton(el)) return false;
     if (!isNavItemPointerTarget(el)) return false;
     const itemRect = el.getBoundingClientRect();
     return x >= itemRect.left && x <= itemRect.right && y >= itemRect.top && y <= itemRect.bottom;
@@ -10257,7 +10324,7 @@ function isPointOverFooterColumn(x, y) {
 }
 function resolveNavContainerSelectionTarget(target, clientX, clientY) {
   if (getNavigationItemAnchor(target)) return null;
-  if (target.closest('[data-ohw-role="navbar-button"]')) return null;
+  if (target.closest(CTA_BUTTON_SELECTOR)) return null;
   const plainLink = target.closest("a");
   if (plainLink && !plainLink.hasAttribute("data-ohw-href-key") && !plainLink.closest("[data-ohw-nav-container]")) {
     return null;
@@ -10899,11 +10966,11 @@ function resolveSubdomain(subdomainFromQuery) {
 }
 function OhhwellsBridge() {
   const pathname = usePathname2();
-  const router = useRouter2();
+  const router = useRouter3();
   const searchParams = useSearchParams();
   const isEditMode = isEditSessionActive();
   const [bridgeRoot, setBridgeRoot] = useState9(null);
-  useEffect9(() => {
+  useEffect10(() => {
     const figtreeFontId = "ohw-figtree-font";
     if (!document.getElementById(figtreeFontId)) {
       const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
@@ -10931,6 +10998,7 @@ function OhhwellsBridge() {
   const subdomainFromQuery = searchParams.get("subdomain");
   const subdomain = resolveSubdomain(subdomainFromQuery);
   useLinkHrefGuardian(pathname, subdomain, isEditMode);
+  useSavedLinkNavigation(isEditMode);
   const postToParent2 = useCallback5((data) => {
     if (typeof window !== "undefined" && window.parent !== window) {
       window.parent.postMessage(data, "*");
@@ -11063,8 +11131,7 @@ function OhhwellsBridge() {
     setSiblingHintRects,
     setToolbarRect,
     getNavigationItemAnchor,
-    isDragHandleDisabled,
-    isNavbarButton: isNavbarButton2
+    isDragHandleDisabled
   });
   const bumpLinkPopoverGrace = () => {
     linkPopoverGraceUntilRef.current = Date.now() + 350;
@@ -11090,7 +11157,7 @@ function OhhwellsBridge() {
   }, [isEditMode, pathname]);
   const runSectionsPrefetchRef = useRef7(runSectionsPrefetch);
   runSectionsPrefetchRef.current = runSectionsPrefetch;
-  useEffect9(() => {
+  useEffect10(() => {
     if (!linkPopover) {
       document.documentElement.removeAttribute("data-ohw-link-popover-open");
       return;
@@ -11118,7 +11185,7 @@ function OhhwellsBridge() {
       document.documentElement.removeAttribute("data-ohw-link-popover-open");
     };
   }, [linkPopover, postToParent2]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!isEditMode) return;
     const useFixtures = shouldUseDevFixtures();
     if (useFixtures) {
@@ -11142,14 +11209,14 @@ function OhhwellsBridge() {
     if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
     return () => window.removeEventListener("message", onSitePages);
   }, [isEditMode, postToParent2]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!isEditMode || shouldUseDevFixtures()) return;
     void loadAllSectionsManifest().then((manifest) => {
       if (Object.keys(manifest).length === 0) return;
       setSectionsByPath((prev) => ({ ...manifest, ...prev }));
     });
   }, [isEditMode]);
-  useEffect9(() => {
+  useEffect10(() => {
     const update = () => {
       const el = activeElRef.current ?? selectedElRef.current;
       if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
@@ -11322,7 +11389,7 @@ function OhhwellsBridge() {
     selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
     selectedFooterColAttrRef.current = null;
     markSelected(navAnchor);
-    setSelectedIsCta(isNavbarButton2(navAnchor));
+    setSelectedIsCta(isCtaButton(navAnchor));
     const isDropdownTrigger = !isNestedNavChild(navAnchor) && (navItemHasDropdownChildren(navAnchor) || navItemOwnsDropdownPanel(navAnchor));
     if (isNestedNavChild(navAnchor)) {
       setNavGroupForceOpen(navAnchor, true);
@@ -11842,7 +11909,7 @@ function OhhwellsBridge() {
     selectedHrefKeyRef.current = anchor.getAttribute("data-ohw-href-key");
     selectedFooterColAttrRef.current = null;
     markSelected(anchor);
-    setSelectedIsCta(isNavbarButton2(anchor));
+    setSelectedIsCta(isCtaButton(anchor));
     clearHrefKeyHover(anchor);
     const isDropdownTrigger = !isNestedNavChild(anchor) && (navItemHasDropdownChildren(anchor) || navItemOwnsDropdownPanel(anchor));
     if (isNestedNavChild(anchor)) {
@@ -12059,7 +12126,7 @@ function OhhwellsBridge() {
       cancelled = true;
     };
   }, [subdomain, isEditMode]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!subdomain || isEditMode) return;
     let debounceTimer = null;
     let observer = null;
@@ -12116,10 +12183,10 @@ function OhhwellsBridge() {
     const visible = Boolean(subdomain) && fetchState !== "done";
     el.style.display = visible ? "flex" : "none";
   }, [subdomain, fetchState]);
-  useEffect9(() => {
+  useEffect10(() => {
     postToParent2({ type: "ow:navigation", path: pathname });
   }, [pathname, postToParent2]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!isEditMode) return;
     if (linkPopoverSessionRef.current?.intent === "add-nav") return;
     if (document.querySelector("[data-ohw-section-picker]")) return;
@@ -12127,7 +12194,7 @@ function OhhwellsBridge() {
     deselectRef.current();
     deactivateRef.current();
   }, [pathname, isEditMode]);
-  useEffect9(() => {
+  useEffect10(() => {
     const contentForNav = () => {
       if (isEditMode) return editContentRef.current;
       if (!subdomain) return {};
@@ -12192,7 +12259,7 @@ function OhhwellsBridge() {
       observer?.disconnect();
     };
   }, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!isEditMode) return;
     const measure = () => {
       const h = document.body.scrollHeight;
@@ -12216,7 +12283,7 @@ function OhhwellsBridge() {
       window.removeEventListener("resize", handleResize);
     };
   }, [pathname, isEditMode, postToParent2]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!subdomainFromQuery || isEditMode) return;
     const handleClick = (e) => {
       const anchor = e.target.closest("a");
@@ -12232,7 +12299,7 @@ function OhhwellsBridge() {
     document.addEventListener("click", handleClick, true);
     return () => document.removeEventListener("click", handleClick, true);
   }, [subdomainFromQuery, isEditMode, router]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!isEditMode) {
       editStylesRef.current?.base.remove();
       editStylesRef.current?.forceHover.remove();
@@ -12818,7 +12885,7 @@ function OhhwellsBridge() {
         const navItemHit = Array.from(
           container.querySelectorAll("[data-ohw-href-key]")
         ).filter((el) => {
-          if (!isNavigationItem2(el) || isNavbarButton2(el)) return false;
+          if (!isNavigationItem2(el) || isCtaButton(el)) return false;
           if (!isNavItemPointerTarget(el)) return false;
           const itemRect = el.getBoundingClientRect();
           return x >= itemRect.left && x <= itemRect.right && y >= itemRect.top && y <= itemRect.bottom;
@@ -12960,6 +13027,22 @@ function OhhwellsBridge() {
           }
           return;
         }
+        if (!isDragOver && isPointOverBridgeChrome(x2, y2)) {
+          dismissImageHover();
+          return;
+        }
+        const ctaHit = isDragOver ? null : findCtaButtonAtPoint(x2, y2, imgEl);
+        if (ctaHit) {
+          dismissImageHover();
+          document.querySelectorAll("[data-ohw-hovered]").forEach((el) => el.removeAttribute("data-ohw-hovered"));
+          const selected = selectedElRef.current;
+          if (selected !== ctaHit && !selected?.contains(ctaHit)) {
+            clearHrefKeyHover(ctaHit);
+            hoveredItemElRef.current = ctaHit;
+            setHoveredItemRect(ctaHit.getBoundingClientRect());
+          }
+          return;
+        }
         const topEl = document.elementFromPoint(x2, y2);
         if (topEl?.closest('[data-ohw-toolbar], [data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"], [data-ohw-more-menu], [data-slot="dropdown-menu-content"], [data-slot="dropdown-menu-item"]')) {
           if (hoveredImageRef.current) {
@@ -13083,7 +13166,7 @@ function OhhwellsBridge() {
         const navLinkHit = Array.from(
           document.querySelectorAll("nav [data-ohw-href-key], footer [data-ohw-href-key]")
         ).find((el) => {
-          if (!isNavigationItem2(el) || isNavbarButton2(el)) return false;
+          if (!isNavigationItem2(el) || isCtaButton(el)) return false;
           if (!isNavItemPointerTarget(el)) return false;
           const er = el.getBoundingClientRect();
           return x2 >= er.left && x2 <= er.right && y2 >= er.top && y2 <= er.bottom;
@@ -13902,7 +13985,7 @@ function OhhwellsBridge() {
       if (navRoot && navContainer) {
         const rr = navRoot.getBoundingClientRect();
         if (clientX >= rr.left && clientX <= rr.right && clientY >= rr.top && clientY <= rr.bottom && !isPointOverNavItem(navContainer, clientX, clientY)) {
-          const book = navRoot.querySelector('[data-ohw-role="navbar-button"]');
+          const book = navRoot.querySelector(CTA_BUTTON_SELECTOR);
           if (book) {
             const br = book.getBoundingClientRect();
             if (clientX >= br.left && clientX <= br.right && clientY >= br.top && clientY <= br.bottom) {
@@ -13995,7 +14078,7 @@ function OhhwellsBridge() {
       if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
     };
   }, [isEditMode, refreshStateRules]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!isEditMode) return;
     const THRESHOLD = 10;
     const resolveWasSelected = (el) => {
@@ -14149,7 +14232,7 @@ function OhhwellsBridge() {
       unlockFooterDragInteraction();
     };
   }, [isEditMode]);
-  useEffect9(() => {
+  useEffect10(() => {
     const handler = (e) => {
       if (e.data?.type !== "ow:request-schedule-config") return;
       const insertAfterVal = e.data.insertAfter;
@@ -14165,7 +14248,7 @@ function OhhwellsBridge() {
     window.addEventListener("message", handler);
     return () => window.removeEventListener("message", handler);
   }, [processConfigRequest]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!isEditMode) return;
     document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
       el.removeAttribute("data-ohw-active-state");
@@ -14200,7 +14283,7 @@ function OhhwellsBridge() {
       clearTimeout(timer);
     };
   }, [pathname, isEditMode, refreshStateRules, postToParent2]);
-  useEffect9(() => {
+  useEffect10(() => {
     scrollToHashSectionWhenReady();
     const onHashChange = () => scrollToHashSectionWhenReady();
     window.addEventListener("hashchange", onHashChange);
@@ -14494,6 +14577,7 @@ function OhhwellsBridge() {
         return;
       }
       const { key } = session;
+      setStoredLinkHref(key, target);
       applyLinkByKey(key, target);
       editContentRef.current = { ...editContentRef.current, [key]: target };
       postToParent2({ type: "ow:change", nodes: [{ key, text: target }] });