@ohhwells/bridge 0.1.26 → 0.1.27-next.18

package/dist/index.js

@@ -1,7 +1,7 @@
 "use client";
 
 // src/OhhwellsBridge.tsx
-import React5, { useCallback as useCallback2, useEffect as useEffect4, useLayoutEffect, useRef as useRef3, useState as useState5 } from "react";
+import React5, { useCallback as useCallback2, useEffect as useEffect3, useLayoutEffect, useRef as useRef3, useState as useState5 } from "react";
 import { createRoot } from "react-dom/client";
 import { flushSync } from "react-dom";
 
@@ -4175,6 +4175,252 @@ function isEditSessionActive() {
   return new URLSearchParams(q).get("mode") === "edit";
 }
 
+// src/lib/sections.ts
+function titleCaseSectionId(id) {
+  return id.split("-").filter(Boolean).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
+}
+function parseSectionsFromRoot(root) {
+  const seen = /* @__PURE__ */ new Set();
+  const sections = [];
+  for (const el of root.querySelectorAll("[data-ohw-section]")) {
+    const id = el.getAttribute("data-ohw-section") ?? "";
+    if (!id || seen.has(id)) continue;
+    seen.add(id);
+    const label = el.getAttribute("data-ohw-section-label") ?? titleCaseSectionId(id);
+    sections.push({ id, label });
+  }
+  return sections;
+}
+function collectSectionsFromDom() {
+  if (typeof document === "undefined") return [];
+  return parseSectionsFromRoot(document);
+}
+function parseSectionsFromHtml(html) {
+  const doc = new DOMParser().parseFromString(html, "text/html");
+  return parseSectionsFromRoot(doc);
+}
+
+// src/ui/link-modal/linkModal.utils.ts
+function parseTarget(target) {
+  if (!target) return { pageRoute: "", sectionId: null };
+  const hashIndex = target.indexOf("#");
+  if (hashIndex === -1) return { pageRoute: target, sectionId: null };
+  return {
+    pageRoute: target.slice(0, hashIndex),
+    sectionId: target.slice(hashIndex + 1) || null
+  };
+}
+function normalizePath(path) {
+  const trimmed = path.trim();
+  if (!trimmed) return "/";
+  try {
+    if (/^https?:\/\//i.test(trimmed)) {
+      return new URL(trimmed).pathname || "/";
+    }
+  } catch {
+  }
+  const withSlash = trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
+  if (withSlash.length > 1 && withSlash.endsWith("/")) return withSlash.slice(0, -1);
+  return withSlash;
+}
+function findPageByPath(pages, path) {
+  const normalized = normalizePath(path);
+  return pages.find((p) => normalizePath(p.path) === normalized);
+}
+function inferPageTitleFromPath(path) {
+  const normalized = normalizePath(path);
+  if (normalized === "/") return "Home";
+  const segment = normalized.split("/").filter(Boolean).pop() ?? "";
+  if (!segment) return "Home";
+  return segment.split("-").filter(Boolean).map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
+}
+function isInternalPath(route) {
+  const trimmed = route.trim();
+  if (!trimmed) return false;
+  if (/^https?:\/\//i.test(trimmed)) return false;
+  if (trimmed.startsWith("/")) return true;
+  if (trimmed.includes(" ") || trimmed.includes(".")) return false;
+  return true;
+}
+function resolvePage(route, pages) {
+  const found = findPageByPath(pages, route);
+  if (found) return { path: found.path, title: found.title };
+  return { path: normalizePath(route), title: inferPageTitleFromPath(route) };
+}
+function getSectionsForPath(sectionsByPath, pageRoute) {
+  if (!sectionsByPath) return [];
+  const normalized = normalizePath(pageRoute);
+  return sectionsByPath[normalized] ?? sectionsByPath[pageRoute] ?? [];
+}
+function buildTarget(page, section) {
+  if (section) return `${page.path}#${section.id}`;
+  return page.path;
+}
+function isValidUrl(urlString) {
+  try {
+    const url = new URL(urlString);
+    if (url.protocol !== "http:" && url.protocol !== "https:") return false;
+    const hostname = url.hostname;
+    if (!hostname || hostname.length === 0) return false;
+    if (hostname.includes(" ")) return false;
+    return hostname.includes(".") || hostname === "localhost";
+  } catch {
+    return false;
+  }
+}
+function normalizeUrl(value) {
+  const trimmed = value.trim();
+  if (trimmed.startsWith("http://") || trimmed.startsWith("https://")) return trimmed;
+  return `https://${trimmed}`;
+}
+function validateUrlInput(value, pages, allPages) {
+  if (!value.trim()) return "";
+  const filtered = pages.filter((p) => p.title.toLowerCase().startsWith(value.toLowerCase()));
+  if (filtered.length > 0) return "";
+  const matchingPage = allPages.find((p) => p.title.toLowerCase() === value.toLowerCase());
+  if (matchingPage) return "";
+  if (!isValidUrl(normalizeUrl(value))) {
+    return "Please enter a valid URL (e.g., https://example.com)";
+  }
+  return "";
+}
+function getEditModeInitialState(target, pages, sections) {
+  const empty = {
+    searchValue: "",
+    selectedPage: null,
+    selectedSection: null,
+    step: "input"
+  };
+  if (!target) return empty;
+  if (isValidUrl(normalizeUrl(target))) {
+    return { searchValue: target, selectedPage: null, selectedSection: null, step: "input" };
+  }
+  const { pageRoute, sectionId } = parseTarget(target);
+  if (sectionId) {
+    if (isInternalPath(pageRoute)) {
+      const page = resolvePage(pageRoute, pages);
+      const sec = sections.find((s) => s.id === sectionId);
+      return {
+        searchValue: page.title,
+        selectedPage: page,
+        selectedSection: sec ? { id: sec.id, label: sec.label } : null,
+        step: "input"
+      };
+    }
+    return { searchValue: pageRoute || target, selectedPage: null, selectedSection: null, step: "input" };
+  }
+  if (isInternalPath(pageRoute)) {
+    const page = resolvePage(pageRoute, pages);
+    return {
+      searchValue: page.title,
+      selectedPage: page,
+      selectedSection: null,
+      step: "input"
+    };
+  }
+  return { searchValue: target, selectedPage: null, selectedSection: null, step: "input" };
+}
+function filterAvailablePages(pages, existingTargets) {
+  const taken = new Set(existingTargets);
+  return pages.filter((p) => !taken.has(p.path));
+}
+
+// src/lib/prefetch-sections.ts
+function buildPageFetchUrl(path) {
+  const normalized = normalizePath(path);
+  const search = readPreservedSearch();
+  return `${window.location.origin}${normalized}${search}`;
+}
+async function loadAllSectionsManifest() {
+  const manifest = await loadSectionsManifest();
+  return manifest ?? {};
+}
+async function loadSectionsManifest() {
+  try {
+    const res = await fetch(`${window.location.origin}/ohw-sections.json`, {
+      credentials: "same-origin",
+      cache: "no-store"
+    });
+    if (!res.ok) return null;
+    const data = await res.json();
+    return data && typeof data === "object" ? data : null;
+  } catch {
+    return null;
+  }
+}
+async function prefetchSectionsFromHtml(paths) {
+  const pairs = await Promise.all(
+    paths.map(async (path) => {
+      try {
+        const res = await fetch(buildPageFetchUrl(path), {
+          credentials: "same-origin",
+          cache: "no-store",
+          headers: { Accept: "text/html" }
+        });
+        if (!res.ok) return [path, []];
+        const html = await res.text();
+        return [path, parseSectionsFromHtml(html)];
+      } catch {
+        return [path, []];
+      }
+    })
+  );
+  const out = {};
+  for (const [path, sections] of pairs) {
+    if (sections.length > 0) out[path] = sections;
+  }
+  return out;
+}
+async function prefetchSectionsForPaths(paths) {
+  const unique = [...new Set(paths.map((p) => normalizePath(p)))];
+  const out = {};
+  const manifest = await loadSectionsManifest();
+  if (manifest) {
+    const keys = unique.length > 0 ? unique : Object.keys(manifest);
+    for (const path of keys) {
+      const sections = manifest[path];
+      if (sections?.length) out[path] = sections;
+    }
+  }
+  const missing = unique.filter((path) => !out[path]?.length);
+  if (missing.length > 0) {
+    Object.assign(out, await prefetchSectionsFromHtml(missing));
+  }
+  return out;
+}
+function mergePrefetchedSections(prev, fetched, livePath, liveSections) {
+  const next = { ...prev, ...fetched };
+  if (liveSections.length > 0) next[normalizePath(livePath)] = liveSections;
+  return next;
+}
+
+// src/lib/scroll-to-section.ts
+var MAX_ATTEMPTS = 12;
+var RETRY_MS = 100;
+function getHashSectionId() {
+  if (typeof window === "undefined") return null;
+  const id = window.location.hash.replace(/^#/, "").trim();
+  return id || null;
+}
+function scrollToOhwSection(sectionId, behavior = "smooth") {
+  if (!sectionId || typeof document === "undefined") return false;
+  const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
+  if (!el) return false;
+  el.scrollIntoView({ behavior, block: "start" });
+  return true;
+}
+function scrollToHashSectionWhenReady(behavior = "smooth") {
+  const id = getHashSectionId();
+  if (!id) return;
+  let attempt = 0;
+  const tick = () => {
+    if (scrollToOhwSection(id, behavior)) return;
+    attempt += 1;
+    if (attempt < MAX_ATTEMPTS) window.setTimeout(tick, RETRY_MS);
+  };
+  tick();
+}
+
 // src/ui/link-modal/calcPopoverPos.ts
 function calcPopoverPos(rect, parentScroll, approxW = 483, approxH = 320) {
   const GAP = 8;
@@ -4336,7 +4582,7 @@ function SectionPickerList({ sections, onSelect }) {
 }
 
 // src/ui/link-modal/UrlOrPageInput.tsx
-import { useEffect as useEffect2, useId, useRef as useRef2, useState as useState3 } from "react";
+import { useId, useRef as useRef2, useState as useState3 } from "react";
 
 // src/ui/input.tsx
 import * as React4 from "react";
@@ -4433,12 +4679,7 @@ function UrlOrPageInput({
 }) {
   const inputId = useId();
   const inputRef = useRef2(null);
-  const [isEditing, setIsEditing] = useState3(false);
   const [isFocused, setIsFocused] = useState3(false);
-  const showFilledDisplay = Boolean(selectedPage) && !isEditing && !readOnly;
-  useEffect2(() => {
-    if (selectedPage) setIsEditing(false);
-  }, [selectedPage]);
   const openDropdown = () => {
     if (readOnly || filteredPages.length === 0) return;
     onDropdownOpenChange(true);
@@ -4449,9 +4690,10 @@ function UrlOrPageInput({
     if (readOnly || filteredPages.length === 0) return;
     onDropdownOpenChange(!dropdownOpen);
   };
-  const enterEditMode = () => {
-    if (readOnly) return;
-    setIsEditing(true);
+  const clearSelection = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    onInputChange("");
     requestAnimationFrame(() => inputRef.current?.focus());
   };
   const fieldClassName = cn(
@@ -4461,62 +4703,41 @@ function UrlOrPageInput({
   return /* @__PURE__ */ jsxs6("div", { className: "flex w-full flex-col gap-2 p-0", children: [
     /* @__PURE__ */ jsx12(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
     /* @__PURE__ */ jsxs6(Popover, { open: dropdownOpen && !readOnly, onOpenChange: onDropdownOpenChange, children: [
-      /* @__PURE__ */ jsx12(PopoverTrigger, { asChild: true, children: showFilledDisplay ? /* @__PURE__ */ jsxs6(
-        "button",
-        {
-          type: "button",
-          "data-ohw-link-field": true,
-          className: cn(fieldClassName, "m-0 cursor-pointer border-solid text-left"),
-          onClick: openDropdown,
-          onFocus: () => setIsFocused(true),
-          onBlur: () => setIsFocused(false),
-          onKeyDown: (e) => {
-            if (e.key === "Backspace" || e.key === "Delete" || e.key.length === 1) {
-              enterEditMode();
-            }
-          },
-          children: [
-            /* @__PURE__ */ jsx12("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx12(IconFile, { className: "text-foreground", "aria-hidden": true }) }),
-            /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate text-sm font-normal text-foreground", children: selectedPage.title }),
-            /* @__PURE__ */ jsx12(FieldChevron, { onClick: toggleDropdown })
-          ]
-        }
-      ) : /* @__PURE__ */ jsxs6(
-        "div",
-        {
-          "data-ohw-link-field": true,
-          className: fieldClassName,
-          onMouseDown: (e) => {
-            if (readOnly) return;
-            if (e.target === e.currentTarget) enterEditMode();
-          },
-          children: [
-            selectedPage ? /* @__PURE__ */ jsx12("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx12(IconFile, { className: "text-foreground", "aria-hidden": true }) }) : null,
-            readOnly ? /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ jsx12(
-              Input,
-              {
-                ref: inputRef,
-                id: inputId,
-                value,
-                onChange: (e) => onInputChange(e.target.value),
-                onFocus: () => {
-                  setIsFocused(true);
-                  setIsEditing(true);
-                  openDropdown();
-                },
-                onBlur: () => setIsFocused(false),
-                placeholder,
-                className: cn(
-                  "min-w-0 flex-1 truncate border-0 bg-transparent p-0 text-sm font-normal leading-5 shadow-none outline-none ring-0",
-                  value ? "text-foreground" : "text-muted-foreground placeholder:text-muted-foreground"
-                )
-              }
-            ),
-            !readOnly ? /* @__PURE__ */ jsx12(FieldChevron, { onClick: toggleDropdown }) : null
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsx12(PopoverContent, { "data-ohw-link-popover-root": "", onOpenAutoFocus: (e) => e.preventDefault(), children: filteredPages.map((page) => /* @__PURE__ */ jsxs6(
+      /* @__PURE__ */ jsx12(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs6("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
+        selectedPage ? /* @__PURE__ */ jsx12("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx12(IconFile, { className: "text-foreground", "aria-hidden": true }) }) : null,
+        readOnly ? /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ jsx12(
+          Input,
+          {
+            ref: inputRef,
+            id: inputId,
+            value,
+            onChange: (e) => onInputChange(e.target.value),
+            onFocus: () => {
+              setIsFocused(true);
+              if (!selectedPage) openDropdown();
+            },
+            onBlur: () => setIsFocused(false),
+            placeholder,
+            className: cn(
+              "min-w-0 flex-1 truncate border-0 bg-transparent p-0 text-sm font-normal leading-5 shadow-none outline-none ring-0 caret-foreground",
+              value ? "text-foreground" : "text-muted-foreground placeholder:text-muted-foreground"
+            )
+          }
+        ),
+        selectedPage && !readOnly ? /* @__PURE__ */ jsx12(
+          "button",
+          {
+            type: "button",
+            className: "flex shrink-0 items-center justify-center rounded-sm p-0.5 text-muted-foreground outline-none hover:bg-muted/50 hover:text-foreground",
+            onMouseDown: clearSelection,
+            "aria-label": "Clear selected page",
+            tabIndex: -1,
+            children: /* @__PURE__ */ jsx12(IconX, { "aria-hidden": true })
+          }
+        ) : null,
+        !readOnly ? /* @__PURE__ */ jsx12(FieldChevron, { onClick: toggleDropdown }) : null
+      ] }) }),
+      filteredPages.length > 0 && /* @__PURE__ */ jsx12(PopoverContent, { "data-ohw-link-popover-root": "", onOpenAutoFocus: (e) => e.preventDefault(), children: filteredPages.map((page) => /* @__PURE__ */ jsxs6(
         "button",
         {
           type: "button",
@@ -4535,139 +4756,12 @@ function UrlOrPageInput({
 }
 
 // src/ui/link-modal/useLinkModalState.ts
-import { useCallback, useEffect as useEffect3, useMemo as useMemo2, useState as useState4 } from "react";
-
-// src/ui/link-modal/linkModal.utils.ts
-function parseTarget(target) {
-  if (!target) return { pageRoute: "", sectionId: null };
-  const hashIndex = target.indexOf("#");
-  if (hashIndex === -1) return { pageRoute: target, sectionId: null };
-  return {
-    pageRoute: target.slice(0, hashIndex),
-    sectionId: target.slice(hashIndex + 1) || null
-  };
-}
-function normalizePath(path) {
-  const trimmed = path.trim();
-  if (!trimmed) return "/";
-  try {
-    if (/^https?:\/\//i.test(trimmed)) {
-      return new URL(trimmed).pathname || "/";
-    }
-  } catch {
-  }
-  const withSlash = trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
-  if (withSlash.length > 1 && withSlash.endsWith("/")) return withSlash.slice(0, -1);
-  return withSlash;
-}
-function findPageByPath(pages, path) {
-  const normalized = normalizePath(path);
-  return pages.find((p) => normalizePath(p.path) === normalized);
-}
-function inferPageTitleFromPath(path) {
-  const normalized = normalizePath(path);
-  if (normalized === "/") return "Home";
-  const segment = normalized.split("/").filter(Boolean).pop() ?? "";
-  if (!segment) return "Home";
-  return segment.split("-").filter(Boolean).map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
-}
-function isInternalPath(route) {
-  const trimmed = route.trim();
-  if (!trimmed) return false;
-  if (/^https?:\/\//i.test(trimmed)) return false;
-  if (trimmed.startsWith("/")) return true;
-  if (trimmed.includes(" ") || trimmed.includes(".")) return false;
-  return true;
-}
-function resolvePage(route, pages) {
-  const found = findPageByPath(pages, route);
-  if (found) return { path: found.path, title: found.title };
-  return { path: normalizePath(route), title: inferPageTitleFromPath(route) };
-}
-function getSectionsForPath(sectionsByPath, pageRoute, fallback) {
-  if (!sectionsByPath) return fallback;
-  const normalized = normalizePath(pageRoute);
-  return sectionsByPath[normalized] ?? sectionsByPath[pageRoute] ?? fallback;
-}
-function buildTarget(page, section) {
-  if (section) return `${page.path}#${section.id}`;
-  return page.path;
-}
-function isValidUrl(urlString) {
-  try {
-    const url = new URL(urlString);
-    if (url.protocol !== "http:" && url.protocol !== "https:") return false;
-    const hostname = url.hostname;
-    if (!hostname || hostname.length === 0) return false;
-    if (hostname.includes(" ")) return false;
-    return hostname.includes(".") || hostname === "localhost";
-  } catch {
-    return false;
-  }
-}
-function normalizeUrl(value) {
-  const trimmed = value.trim();
-  if (trimmed.startsWith("http://") || trimmed.startsWith("https://")) return trimmed;
-  return `https://${trimmed}`;
-}
-function validateUrlInput(value, pages, allPages) {
-  if (!value.trim()) return "";
-  const filtered = pages.filter((p) => p.title.toLowerCase().startsWith(value.toLowerCase()));
-  if (filtered.length > 0) return "";
-  const matchingPage = allPages.find((p) => p.title.toLowerCase() === value.toLowerCase());
-  if (matchingPage) return "";
-  if (!isValidUrl(normalizeUrl(value))) {
-    return "Please enter a valid URL (e.g., https://example.com)";
-  }
-  return "";
-}
-function getEditModeInitialState(target, pages, sections) {
-  const empty = {
-    searchValue: "",
-    selectedPage: null,
-    selectedSection: null,
-    step: "input"
-  };
-  if (!target) return empty;
-  if (isValidUrl(normalizeUrl(target))) {
-    return { searchValue: target, selectedPage: null, selectedSection: null, step: "input" };
-  }
-  const { pageRoute, sectionId } = parseTarget(target);
-  if (sectionId) {
-    if (isInternalPath(pageRoute)) {
-      const page = resolvePage(pageRoute, pages);
-      const sec = sections.find((s) => s.id === sectionId);
-      return {
-        searchValue: page.title,
-        selectedPage: page,
-        selectedSection: sec ? { id: sec.id, label: sec.label } : null,
-        step: "input"
-      };
-    }
-    return { searchValue: pageRoute || target, selectedPage: null, selectedSection: null, step: "input" };
-  }
-  if (isInternalPath(pageRoute)) {
-    const page = resolvePage(pageRoute, pages);
-    return {
-      searchValue: page.title,
-      selectedPage: page,
-      selectedSection: null,
-      step: "input"
-    };
-  }
-  return { searchValue: target, selectedPage: null, selectedSection: null, step: "input" };
-}
-function filterAvailablePages(pages, existingTargets) {
-  const taken = new Set(existingTargets);
-  return pages.filter((p) => !taken.has(p.path));
-}
-
-// src/ui/link-modal/useLinkModalState.ts
+import { useCallback, useEffect as useEffect2, useMemo as useMemo2, useState as useState4 } from "react";
 function useLinkModalState({
   open,
   mode,
   pages,
-  sections,
+  sections: _sections,
   sectionsByPath,
   initialTarget,
   existingTargets,
@@ -4692,11 +4786,11 @@ function useLinkModalState({
     setDropdownOpen(false);
     setUrlError("");
   }, []);
-  useEffect3(() => {
+  useEffect2(() => {
     if (!open) return;
     if (mode === "edit" && initialTarget) {
       const { pageRoute } = parseTarget(initialTarget);
-      const targetSections = getSectionsForPath(sectionsByPath, pageRoute, sections);
+      const targetSections = getSectionsForPath(sectionsByPath, pageRoute);
       const init = getEditModeInitialState(initialTarget, pages, targetSections);
       setSearchValue(init.searchValue);
       setSelectedPage(init.selectedPage);
@@ -4707,21 +4801,19 @@ function useLinkModalState({
     }
     setDropdownOpen(false);
     setUrlError("");
-  }, [open, mode, initialTarget, pages, sections, sectionsByPath, reset]);
+  }, [open, mode, initialTarget, pages, sectionsByPath, reset]);
   const filteredPages = useMemo2(() => {
     if (!searchValue.trim()) return availablePages;
     return availablePages.filter((p) => p.title.toLowerCase().startsWith(searchValue.toLowerCase()));
   }, [availablePages, searchValue]);
   const activeSections = useMemo2(() => {
-    if (selectedPage && sectionsByPath) {
-      return getSectionsForPath(sectionsByPath, selectedPage.path, sections);
-    }
-    return sections;
-  }, [selectedPage, sectionsByPath, sections]);
+    if (!selectedPage) return [];
+    return getSectionsForPath(sectionsByPath, selectedPage.path);
+  }, [selectedPage, sectionsByPath]);
   const showBreadcrumb = step === "confirmed" && selectedPage && selectedSection;
   const showSectionPicker = step === "sectionPicker" && selectedPage;
   const showSectionRow = mode === "edit" && selectedPage && selectedSection && step === "input";
-  const showChooseSection = step === "input" && selectedPage && !selectedSection && !showSectionRow;
+  const showChooseSection = step === "input" && selectedPage && !selectedSection && !showSectionRow && activeSections.length > 0;
   const handleInputChange = (value) => {
     setSearchValue(value);
     setSelectedPage(null);
@@ -4985,11 +5077,13 @@ var DEV_SECTIONS_BY_PATH = {
   ],
   "/classes": [{ id: "class-library", label: "Class Library" }],
   "/pricing": [
+    { id: "page-header", label: "Page Header" },
+    { id: "free-class-cta", label: "Free Class" },
     { id: "benefits-marquee", label: "Benefits" },
     { id: "monthly-memberships", label: "Memberships" },
-    { id: "package-matcher", label: "Packages" },
     { id: "specialty-programs", label: "Specialty Programs" },
-    { id: "free-class-cta", label: "Free Class" }
+    { id: "package-matcher", label: "Packages" },
+    { id: "wordmark", label: "Wordmark" }
   ],
   "/studio": [
     { id: "studio-intro", label: "Studio Intro" },
@@ -5298,15 +5392,8 @@ function getHrefKeyFromElement(el) {
   if (!key) return null;
   return { anchor, key };
 }
-function titleCaseSectionId(id) {
-  return id.split("-").filter(Boolean).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
-}
 function collectSections() {
-  return Array.from(document.querySelectorAll("[data-ohw-section]")).map((el) => {
-    const id = el.getAttribute("data-ohw-section") ?? "";
-    const label = el.getAttribute("data-ohw-section-label") ?? titleCaseSectionId(id);
-    return { id, label };
-  });
+  return collectSectionsFromDom();
 }
 var FORCE_PSEUDO_STATES = [
   { pseudo: ":hover", state: "hover" },
@@ -5669,7 +5756,7 @@ function OhhwellsBridge() {
   const searchParams = useSearchParams();
   const isEditMode = isEditSessionActive();
   const [bridgeRoot, setBridgeRoot] = useState5(null);
-  useEffect4(() => {
+  useEffect3(() => {
     const figtreeFontId = "ohw-figtree-font";
     if (!document.getElementById(figtreeFontId)) {
       const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
@@ -5728,6 +5815,7 @@ function OhhwellsBridge() {
   const [linkPopover, setLinkPopover] = useState5(null);
   const [sitePages, setSitePages] = useState5([]);
   const [sectionsByPath, setSectionsByPath] = useState5({});
+  const sectionsPrefetchGenRef = useRef3(0);
   const setLinkPopoverRef = useRef3(setLinkPopover);
   const linkPopoverPanelRef = useRef3(null);
   const linkPopoverOpenRef = useRef3(false);
@@ -5736,7 +5824,28 @@ function OhhwellsBridge() {
   const bumpLinkPopoverGrace = () => {
     linkPopoverGraceUntilRef.current = Date.now() + 350;
   };
-  useEffect4(() => {
+  const runSectionsPrefetch = useCallback2((pages) => {
+    if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
+    const gen = ++sectionsPrefetchGenRef.current;
+    const paths = pages.map((p) => p.path);
+    void prefetchSectionsForPaths(paths).then((fetched) => {
+      if (gen !== sectionsPrefetchGenRef.current) return;
+      if (process.env.NODE_ENV === "development") {
+        console.info("[ohhwells-bridge] Sections prefetched for", Object.keys(fetched).join(", ") || "(none)");
+      }
+      setSectionsByPath(
+        (prev) => mergePrefetchedSections(
+          prev,
+          fetched,
+          typeof window !== "undefined" ? window.location.pathname : pathname,
+          collectSections()
+        )
+      );
+    });
+  }, [isEditMode, pathname]);
+  const runSectionsPrefetchRef = useRef3(runSectionsPrefetch);
+  runSectionsPrefetchRef.current = runSectionsPrefetch;
+  useEffect3(() => {
     if (!linkPopover) return;
     if (hoveredImageRef.current) {
       hoveredImageRef.current = null;
@@ -5744,7 +5853,7 @@ function OhhwellsBridge() {
     }
     postToParent({ type: "ow:image-unhover" });
   }, [linkPopover, postToParent]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (!isEditMode) return;
     const useFixtures = shouldUseDevFixtures();
     if (useFixtures) {
@@ -5757,19 +5866,26 @@ function OhhwellsBridge() {
     const onSitePages = (e) => {
       if (e.data?.type !== "ow:site-pages" || !Array.isArray(e.data.pages)) return;
       if (useFixtures) return;
-      setSitePages(
-        e.data.pages.map((p) => ({
-          path: p.path,
-          title: p.title
-        }))
-      );
+      const mapped = e.data.pages.map((p) => ({
+        path: p.path,
+        title: p.title
+      }));
+      setSitePages(mapped);
+      runSectionsPrefetchRef.current(mapped);
     };
     window.addEventListener("message", onSitePages);
     if (!useFixtures) postToParent({ type: "ow:request-site-pages" });
     return () => window.removeEventListener("message", onSitePages);
   }, [isEditMode, postToParent]);
   const [sectionGap, setSectionGap] = useState5(null);
-  useEffect4(() => {
+  useEffect3(() => {
+    if (!isEditMode || shouldUseDevFixtures()) return;
+    void loadAllSectionsManifest().then((manifest) => {
+      if (Object.keys(manifest).length === 0) return;
+      setSectionsByPath((prev) => ({ ...manifest, ...prev }));
+    });
+  }, [isEditMode]);
+  useEffect3(() => {
     const update = () => {
       const el = activeElRef.current;
       if (el) setToolbarRect(el.getBoundingClientRect());
@@ -5896,7 +6012,7 @@ function OhhwellsBridge() {
       cancelled = true;
     };
   }, [subdomain, isEditMode, pathname]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (!subdomain || isEditMode) return;
     let debounceTimer = null;
     const applyFromCache = () => {
@@ -5939,10 +6055,10 @@ function OhhwellsBridge() {
     const visible = Boolean(subdomain) && fetchState !== "done";
     el.style.display = visible ? "flex" : "none";
   }, [subdomain, fetchState]);
-  useEffect4(() => {
+  useEffect3(() => {
     postToParent({ type: "ow:navigation", path: pathname });
   }, [pathname, postToParent]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (!isEditMode) return;
     const measure = () => {
       const h = document.body.scrollHeight;
@@ -5966,7 +6082,7 @@ function OhhwellsBridge() {
       window.removeEventListener("resize", handleResize);
     };
   }, [pathname, isEditMode, postToParent]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (!subdomainFromQuery || isEditMode) return;
     const handleClick = (e) => {
       const anchor = e.target.closest("a");
@@ -5982,7 +6098,7 @@ function OhhwellsBridge() {
     document.addEventListener("click", handleClick, true);
     return () => document.removeEventListener("click", handleClick, true);
   }, [subdomainFromQuery, isEditMode, router]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (!isEditMode) {
       editStylesRef.current?.base.remove();
       editStylesRef.current?.forceHover.remove();
@@ -6840,7 +6956,7 @@ function OhhwellsBridge() {
       if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
     };
   }, [isEditMode, refreshStateRules]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (!isEditMode) return;
     document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
       el.removeAttribute("data-ohw-active-state");
@@ -6857,7 +6973,8 @@ function OhhwellsBridge() {
       refreshStateRules();
       const sections = collectSections();
       setSectionsByPath((prev) => {
-        const next = { ...prev, [pathname]: sections };
+        const pathKey = normalizePath(pathname);
+        const next = { ...prev, [pathKey]: sections };
         return shouldUseDevFixtures() ? { ...DEV_SECTIONS_BY_PATH, ...next } : next;
       });
       postToParent({ type: "ow:ready", version: "1", path: pathname, nodes: collectEditableNodes(), sections });
@@ -6868,6 +6985,12 @@ function OhhwellsBridge() {
       clearTimeout(timer);
     };
   }, [pathname, isEditMode, refreshStateRules, postToParent]);
+  useEffect3(() => {
+    scrollToHashSectionWhenReady();
+    const onHashChange = () => scrollToHashSectionWhenReady();
+    window.addEventListener("hashchange", onHashChange);
+    return () => window.removeEventListener("hashchange", onHashChange);
+  }, [pathname]);
   const handleCommand = useCallback2((cmd) => {
     document.execCommand(cmd, false);
     activeElRef.current?.focus();