@ohhwells/bridge 0.1.104 → 0.1.106

package/dist/index.cjs

@@ -10984,9 +10984,18 @@ function getNavbarDrawerContainer() {
 }
 function isNavbarListContainerVisible(el) {
   if (el.hasAttribute("hidden")) return false;
+  if (el.closest("[hidden]")) return false;
   if (el.getClientRects().length === 0) return false;
   const style = window.getComputedStyle(el);
-  return style.display !== "none" && style.visibility !== "hidden";
+  if (style.display === "none" || style.visibility === "hidden") return false;
+  let parent = el.parentElement;
+  while (parent && parent !== document.documentElement) {
+    if (parent.hasAttribute("hidden")) return false;
+    const ps = window.getComputedStyle(parent);
+    if (ps.display === "none" || ps.visibility === "hidden") return false;
+    parent = parent.parentElement;
+  }
+  return true;
 }
 function getActiveNavbarListContainer(draggedEl) {
   const desktop = getNavbarDesktopContainer();
@@ -10997,6 +11006,7 @@ function getActiveNavbarListContainer(draggedEl) {
   }
   if (desktop && isNavbarListContainerVisible(desktop)) return desktop;
   if (drawer && isNavbarListContainerVisible(drawer)) return drawer;
+  if (drawer && !drawer.closest("[hidden]")) return drawer;
   return desktop ?? drawer;
 }
 function listActiveNavbarItems(draggedEl) {
@@ -11009,6 +11019,12 @@ function listActiveNavbarItems(draggedEl) {
   return listNavbarItems();
 }
 function listNavbarItems() {
+  const active = getActiveNavbarListContainer();
+  if (active) {
+    return Array.from(active.querySelectorAll("[data-ohw-href-key]")).filter(
+      isNavbarLinkItem
+    );
+  }
   const desktop = getNavbarDesktopContainer();
   if (desktop) {
     return Array.from(desktop.querySelectorAll("[data-ohw-href-key]")).filter(isNavbarLinkItem);
@@ -11078,24 +11094,25 @@ function buildNavLink(index, href, label, template) {
   return anchor;
 }
 function insertNavLinkInContainer(container, anchor, afterHrefKey) {
+  const listParent = resolveNavbarReorderParent(container);
   if (!afterHrefKey) {
-    const cta = container.querySelector(CTA_BUTTON_SELECTOR);
-    if (cta && cta.parentElement === container) {
-      container.insertBefore(anchor, cta);
+    const cta = listParent.querySelector(CTA_BUTTON_SELECTOR);
+    if (cta && cta.parentElement === listParent) {
+      listParent.insertBefore(anchor, cta);
       return;
     }
-    container.appendChild(anchor);
+    listParent.appendChild(anchor);
     return;
   }
-  const afterEl = findCounterpartByHrefKey(afterHrefKey, container);
+  const afterEl = findCounterpartByHrefKey(afterHrefKey, listParent);
   if (afterEl) {
     const insertAfter = resolveNavRootUnit(afterEl);
-    if (insertAfter.parentElement === container || insertAfter.parentElement === afterEl.parentElement) {
+    if (insertAfter.parentElement === listParent || insertAfter.parentElement === afterEl.parentElement) {
       insertAfter.insertAdjacentElement("afterend", anchor);
       return;
     }
   }
-  container.appendChild(anchor);
+  listParent.appendChild(anchor);
 }
 function insertNavbarItemDom(index, href, label, afterAnchor) {
   const afterHrefKey = afterAnchor?.getAttribute("data-ohw-href-key") ?? null;
@@ -11151,15 +11168,25 @@ function getNavbarRootUnitsInContainer(container) {
   }
   return result;
 }
+function resolveNavbarReorderParent(container) {
+  if (getNavbarRootUnitsInContainer(container).length > 0) return container;
+  for (const child of Array.from(container.children)) {
+    if (!(child instanceof HTMLElement)) continue;
+    if (child.hasAttribute("data-ohw-nav-dropdown-template")) continue;
+    if (getNavbarRootUnitsInContainer(child).length > 0) return child;
+  }
+  return container;
+}
 function applyNavOrderToContainer(container, order) {
+  const listParent = resolveNavbarReorderParent(container);
   const desired = order.filter((key, i) => order.indexOf(key) === i);
-  const units = getNavbarRootUnitsInContainer(container);
+  const units = getNavbarRootUnitsInContainer(listParent);
   const current = units.map((u) => u.key);
   const extras = current.filter((key) => !desired.includes(key));
   const expected = [...desired.filter((key) => current.includes(key)), ...extras];
   if (navOrderKeysEqual(current, expected)) return;
   const lastUnit = units[units.length - 1]?.unit ?? null;
-  const anchor = lastUnit?.parentElement === container ? lastUnit.nextElementSibling : null;
+  const anchor = lastUnit?.parentElement === listParent ? lastUnit.nextElementSibling : null;
   const orderedUnits = [];
   const seen = /* @__PURE__ */ new Set();
   for (const hrefKey of desired) {
@@ -11174,9 +11201,9 @@ function applyNavOrderToContainer(container, order) {
   }
   for (const el of orderedUnits) {
     if (anchor) {
-      if (el.nextSibling !== anchor) container.insertBefore(el, anchor);
-    } else if (container.lastElementChild !== el) {
-      container.appendChild(el);
+      if (el.nextSibling !== anchor) listParent.insertBefore(el, anchor);
+    } else if (listParent.lastElementChild !== el) {
+      listParent.appendChild(el);
     }
   }
 }
@@ -12766,26 +12793,48 @@ function resolveFooterColumnForAdd(selected) {
   if (selected.hasAttribute("data-ohw-footer-col")) return selected;
   return selected.closest("[data-ohw-footer-col]") ?? (listFooterColumns().includes(selected) ? selected : null);
 }
-function buildFooterHeading(colIndex, text) {
-  const heading = document.createElement("p");
-  heading.setAttribute("data-ohw-editable", "text");
-  heading.setAttribute("data-ohw-key", `footer-${colIndex}-heading`);
-  heading.textContent = text;
-  heading.style.cssText = [
-    "color: var(--espresso, #3d312b)",
-    "font-size: 14px",
-    "font-weight: 800",
-    "opacity: 0.82",
-    "margin: 0 0 6px",
-    "padding: 0",
-    "line-height: 1.2"
-  ].join(";");
-  return heading;
-}
 var FOOTER_HEADING_CACHE_ATTR = "data-ohw-heading-cache";
+var FOOTER_HEADING_CLASS_CACHE_ATTR = "data-ohw-heading-class";
 function getFooterColumnHeadingEl(column) {
   return column.querySelector('[data-ohw-key^="footer-"][data-ohw-key$="-heading"]') ?? null;
 }
+function getFooterHeadingTemplate(excludeColumn) {
+  for (const col of listFooterColumns()) {
+    if (excludeColumn && col === excludeColumn) continue;
+    const heading = getFooterColumnHeadingEl(col);
+    if (heading) return heading;
+  }
+  return null;
+}
+function footerHeadingLooksLikeHtml(value) {
+  return /<[a-z][\s\S]*>/i.test(value);
+}
+function applyFooterHeadingContent(el, value) {
+  if (footerHeadingLooksLikeHtml(value)) {
+    if (el.innerHTML !== value) el.innerHTML = value;
+    return;
+  }
+  const plain = (el.textContent ?? "").trim();
+  if (plain !== value.trim() || footerHeadingLooksLikeHtml(el.innerHTML)) {
+    el.textContent = value;
+  }
+}
+function buildFooterHeading(colIndex, text, opts) {
+  const column = opts?.column ?? null;
+  const template = opts?.template ?? getFooterHeadingTemplate(column) ?? null;
+  const tagName = template?.tagName?.toLowerCase() || "p";
+  const heading = document.createElement(tagName);
+  heading.setAttribute("data-ohw-editable", "text");
+  heading.setAttribute("data-ohw-key", `footer-${colIndex}-heading`);
+  applyFooterHeadingContent(heading, text);
+  const cachedClass = column?.getAttribute(FOOTER_HEADING_CLASS_CACHE_ATTR);
+  if (template?.className) {
+    heading.className = template.className;
+  } else if (cachedClass) {
+    heading.className = cachedClass;
+  }
+  return heading;
+}
 function getFooterColumnHeadingKey(column) {
   const attr = column.getAttribute("data-ohw-footer-col");
   if (attr != null) {
@@ -12809,8 +12858,11 @@ function setFooterColumnHeadingVisible(column, visible) {
   if (!Number.isFinite(colIndex)) return null;
   const existing = getFooterColumnHeadingEl(column);
   if (!visible) {
-    const text2 = (existing?.textContent ?? "").trim() || column.getAttribute(FOOTER_HEADING_CACHE_ATTR) || DEFAULT_FOOTER_COLUMN_HEADING;
+    const text2 = (existing ? existing.innerHTML.trim() || (existing.textContent ?? "").trim() : "") || column.getAttribute(FOOTER_HEADING_CACHE_ATTR) || DEFAULT_FOOTER_COLUMN_HEADING;
     column.setAttribute(FOOTER_HEADING_CACHE_ATTR, text2);
+    if (existing?.className) {
+      column.setAttribute(FOOTER_HEADING_CLASS_CACHE_ATTR, existing.className);
+    }
     existing?.remove();
     return { headingKey, text: "", visible: false };
   }
@@ -12822,7 +12874,7 @@ function setFooterColumnHeadingVisible(column, visible) {
     };
   }
   const text = column.getAttribute(FOOTER_HEADING_CACHE_ATTR) || DEFAULT_FOOTER_COLUMN_HEADING;
-  const heading = buildFooterHeading(colIndex, text);
+  const heading = buildFooterHeading(colIndex, text, { column });
   const firstLink = listFooterLinksInColumn(column)[0];
   if (firstLink) column.insertBefore(heading, firstLink);
   else column.prepend(heading);
@@ -12846,21 +12898,24 @@ function reconcileFooterHeadingVisibility(content) {
     if (raw === "") {
       const existing2 = getFooterColumnHeadingEl(column);
       if (existing2) {
-        const cached = (existing2.textContent ?? "").trim();
+        const cached = existing2.innerHTML.trim() || (existing2.textContent ?? "").trim();
         if (cached) column.setAttribute(FOOTER_HEADING_CACHE_ATTR, cached);
+        if (existing2.className) {
+          column.setAttribute(FOOTER_HEADING_CLASS_CACHE_ATTR, existing2.className);
+        }
         existing2.remove();
       }
       continue;
     }
     const existing = getFooterColumnHeadingEl(column);
     if (existing) {
-      if (existing.textContent !== raw) existing.textContent = raw;
+      applyFooterHeadingContent(existing, raw);
       continue;
     }
     const colMatch = headingKey.match(FOOTER_HEADING_RE);
     const colIndex = colMatch ? parseInt(colMatch[1], 10) : NaN;
     if (!Number.isFinite(colIndex)) continue;
-    const heading = buildFooterHeading(colIndex, raw);
+    const heading = buildFooterHeading(colIndex, raw, { column });
     const firstLink = listFooterLinksInColumn(column)[0];
     if (firstLink) column.insertBefore(heading, firstLink);
     else column.prepend(heading);
@@ -12906,9 +12961,13 @@ function insertFooterColumnDom(colIndex, heading, items) {
     column.style.flexDirection = "column";
   }
   if (heading != null && heading !== "") {
-    column.appendChild(buildFooterHeading(colIndex, heading));
+    column.appendChild(buildFooterHeading(colIndex, heading, { column }));
   } else if (heading === "") {
     column.setAttribute(FOOTER_HEADING_CACHE_ATTR, DEFAULT_FOOTER_COLUMN_HEADING);
+    const classFromSibling = getFooterHeadingTemplate()?.className;
+    if (classFromSibling) {
+      column.setAttribute(FOOTER_HEADING_CLASS_CACHE_ATTR, classFromSibling);
+    }
   }
   let firstLink = null;
   items.forEach((item, itemIndex) => {
@@ -15752,6 +15811,66 @@ function unmountSchedulingWrapper(wrapper) {
 function schedulingSectionId(insertAfter) {
   return `scheduling-${insertAfter}`;
 }
+function duplicateSchedulingWidget(instanceId, scheduleId) {
+  const escaped = CSS.escape(instanceId);
+  const sourceEl = document.querySelector(
+    `[data-ohw-section-container="scheduling"][data-ohw-instance="${escaped}"]`
+  ) ?? document.querySelector(
+    `[data-ohw-section-container="scheduling"][data-ohw-section="${escaped}"]`
+  ) ?? document.querySelector(`[data-ohw-instance="${escaped}"]`) ?? document.querySelector(`[data-ohw-section="${escaped}"]`);
+  if (!sourceEl) return null;
+  const sourceWrapper = sourceEl.closest('[data-ohw-section-container="scheduling"]') ?? sourceEl;
+  let insertAfter = instanceId;
+  let sectionId = schedulingSectionId(insertAfter);
+  for (let n = 0; n < 20 && document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`); n++) {
+    insertAfter = `${instanceId}--${n + 1}`;
+    sectionId = schedulingSectionId(insertAfter);
+  }
+  if (document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`)) return null;
+  const container = document.createElement("div");
+  container.dataset.ohwSectionContainer = "scheduling";
+  container.dataset.ohwSection = sectionId;
+  container.dataset.ohwInstance = sectionId;
+  sourceWrapper.insertAdjacentElement("afterend", container);
+  try {
+    const root = (0, import_client2.createRoot)(container);
+    schedulingRoots.set(container, root);
+    (0, import_react_dom3.flushSync)(() => {
+      root.render(
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+          SchedulingWidget,
+          {
+            notifyOnConnect: false,
+            initialScheduleId: scheduleId ?? null,
+            insertAfter
+          }
+        )
+      );
+    });
+  } catch {
+    container.remove();
+    return null;
+  }
+  const tracker = getSectionsTracker();
+  let sections = [];
+  try {
+    sections = JSON.parse(tracker.textContent || "[]");
+  } catch {
+  }
+  const currentPath = window.location.pathname;
+  if (!sections.find(
+    (s) => s.type === "scheduling" && s.insertAfter === insertAfter && (!s.pagePath || s.pagePath === currentPath)
+  )) {
+    sections.push({
+      type: "scheduling",
+      insertAfter,
+      pagePath: currentPath,
+      ...scheduleId ? { scheduleId } : {}
+    });
+    tracker.textContent = JSON.stringify(sections);
+  }
+  return { sectionId, insertAfter };
+}
 var INSERT_BEFORE_MARKER = ":before:";
 function parseSchedulingInsertAfter(insertAfter) {
   const idx = insertAfter.indexOf(INSERT_BEFORE_MARKER);
@@ -19382,10 +19501,21 @@ function OhhwellsBridge() {
         gap: 6px;
       }
       /* Not the form: it is a layout container (flex/grid with gaps), and forcing block
-         crushed its fields together (OHH-490). */
-      [data-ohw-editable]:not([data-ohw-editable="form"]) {
+         crushed its fields together (OHH-490). Not media (image/bg-image/video/icon/map)
+         either: those can be their own flex containers centering fallback content (a
+         placeholder label, a mascot emoji) \u2014 forcing block broke that centering while the
+         image was unset (OHH-758-ish). */
+      [data-ohw-editable]:not([data-ohw-editable="form"]):not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="icon"]):not([data-ohw-editable="map"]) {
         display: block;
       }
+      /* The block-force above is an author rule, so it beats the browser's own
+         details-not-open child-display-none UA rule \u2014 origin always wins over specificity.
+         Left alone, a closed FAQ's answer became a real, hoverable box that overflowed past
+         the collapsed <details> into the gap before the next item. Restore the native
+         collapse for editable content once it isn't the summary. */
+      details:not([open]) > [data-ohw-editable]:not(summary) {
+        display: none !important;
+      }
       /* Body text (no item-action toolbar) \u2014 first click enters text edit \u2192 I-beam.
          Exclude select-first nav/footer labels so grab/default on [data-ohw-href-key] can win. */
       [data-ohw-editable]:not([contenteditable]):not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="link"]):not(:is([data-ohw-href-key] *)) {
@@ -19409,6 +19539,14 @@ function OhhwellsBridge() {
       [data-ohw-editable="video"], [data-ohw-editable="video"] *,
       [data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
       [data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
+      /* A text/plain editable nested inside a media editable (e.g. a placeholder's fallback
+         label inside its bg-image box) is its own click target, not the media picker \u2014 the
+         blanket media cursor rule above would otherwise show pointer where a click actually
+         opens text edit. */
+      [data-ohw-editable="bg-image"] [data-ohw-editable="text"],
+      [data-ohw-editable="bg-image"] [data-ohw-editable="text"] *,
+      [data-ohw-editable="image"] [data-ohw-editable="text"],
+      [data-ohw-editable="image"] [data-ohw-editable="text"] * { cursor: text !important; }
       /* A form field is a design surface in the editor: its input takes the pointer so the
          field can be picked and hovered from anywhere inside it (OHH-642). */
       [data-ohw-editable="form"] [data-ohw-form-field] input,
@@ -19995,6 +20133,8 @@ function OhhwellsBridge() {
         setFormHoverRect(null);
       }
       if (!editable) return;
+      const editableRect = editable.getBoundingClientRect();
+      if (editableRect.width <= 0 || editableRect.height <= 0) return;
       const selected = selectedElRef.current;
       if (selected && (selected === editable || selected.contains(editable))) return;
       if (!isMediaEditable(editable) && !editable.hasAttribute("contenteditable")) {
@@ -21377,9 +21517,62 @@ function OhhwellsBridge() {
       if (e.data?.type !== "ow:duplicate-section") return;
       const instanceId = typeof e.data.instanceId === "string" ? e.data.instanceId : "";
       if (!instanceId) return;
+      const currentPath = window.location.pathname;
+      if (instanceId.startsWith("scheduling-")) {
+        const sourceInsertAfter = instanceId.slice("scheduling-".length);
+        const tracker = getSectionsTracker();
+        let sections = [];
+        try {
+          sections = JSON.parse(tracker.textContent || "[]");
+        } catch {
+        }
+        const source = sections.find(
+          (s) => s.type === "scheduling" && s.insertAfter === sourceInsertAfter && (!s.pagePath || s.pagePath === currentPath)
+        );
+        const duplicated = duplicateSchedulingWidget(instanceId, source?.scheduleId ?? null);
+        if (!duplicated) return;
+        const currentEntries2 = getPageSectionOrderEntries(
+          editContentRef.current[SECTION_ORDER_KEY],
+          currentPath
+        );
+        const byId = new Map(currentEntries2.map((entry) => [entry.instanceId, entry]));
+        const entries2 = topLevelSections().map((el, order) => {
+          const id = instanceIdOf(el);
+          return {
+            instanceId: id,
+            type: el.getAttribute("data-ohw-section") ?? "",
+            order,
+            pagePath: currentPath,
+            ...byId.get(id)?.removed ? { removed: true } : {}
+          };
+        });
+        const orderJson2 = JSON.stringify(entries2);
+        const nodes2 = [
+          { key: "__ohw_sections", text: tracker.textContent ?? "[]" },
+          { key: SECTION_ORDER_KEY, text: orderJson2 }
+        ];
+        editContentRef.current = {
+          ...editContentRef.current,
+          ...Object.fromEntries(nodes2.map(({ key, text }) => [key, text]))
+        };
+        setAiSectionOrder(orderJson2, currentPath);
+        postToParentRef.current({ type: "ow:change", nodes: nodes2 });
+        window.dispatchEvent(new Event("resize"));
+        const duplicateHeight2 = document.body.scrollHeight;
+        if (duplicateHeight2 > 50) postToParentRef.current({ type: "ow:height", height: duplicateHeight2 });
+        const selectDuplicate = () => {
+          const clone2 = document.querySelector(
+            `[data-ohw-section-container="scheduling"][data-ohw-instance="${CSS.escape(duplicated.sectionId)}"]`
+          );
+          if (clone2) aiSectionApiRef.current?.selectFromElement(clone2);
+        };
+        selectDuplicate();
+        requestAnimationFrame(selectDuplicate);
+        return;
+      }
       const newId = newInstanceId();
-      const currentEntries = getPageSectionOrderEntries(editContentRef.current[SECTION_ORDER_KEY], window.location.pathname);
-      const result = duplicateSectionInstance(instanceId, newId, window.location.pathname, currentEntries);
+      const currentEntries = getPageSectionOrderEntries(editContentRef.current[SECTION_ORDER_KEY], currentPath);
+      const result = duplicateSectionInstance(instanceId, newId, currentPath, currentEntries);
       if (!result) return;
       const { entries, keyRekeys } = result;
       const orderJson = JSON.stringify(
@@ -22045,6 +22238,18 @@ function OhhwellsBridge() {
       hoveredNavContainerRef.current = null;
       setHoveredNavContainerRect(null);
     };
+    const handleDetailsToggle = (e) => {
+      if (e.target?.tagName !== "DETAILS") return;
+      document.querySelectorAll("[data-ohw-hovered]").forEach((hovered) => {
+        hovered.removeAttribute("data-ohw-hovered");
+      });
+      setHoveredTextRect(null);
+      hoveredItemElRef.current = null;
+      setHoveredItemRect(null);
+      hoveredNavContainerRef.current = null;
+      setHoveredNavContainerRect(null);
+    };
+    document.addEventListener("toggle", handleDetailsToggle, true);
     window.addEventListener("resize", handleViewportResize, { passive: true });
     document.addEventListener("click", handleClick, true);
     document.addEventListener("dblclick", handleDblClick, true);
@@ -22062,6 +22267,7 @@ function OhhwellsBridge() {
     document.addEventListener("selectionchange", handleSelectionChange);
     window.addEventListener("scroll", handleScroll, true);
     return () => {
+      document.removeEventListener("toggle", handleDetailsToggle, true);
       document.removeEventListener("click", handleClick, true);
       document.removeEventListener("dblclick", handleDblClick, true);
       document.removeEventListener("paste", handlePaste, true);
@@ -22315,7 +22521,7 @@ function OhhwellsBridge() {
       postToParent2({
         type: "ow:ready",
         version: "1",
-        bridgeVersion: "0.1.103",
+        bridgeVersion: "0.1.105",
         path: pathname,
         nodes: collectEditableNodes(editContentRef.current),
         sections