@canopy-iiif/app 1.9.21 → 1.10.1

package/ui/dist/server.mjs

@@ -656,6 +656,7 @@ async function mountImageStory(element, props = {}) {
 // ui/src/iiif/ImageStory.jsx
 var DEFAULT_IMAGE_STORY_HEIGHT = 600;
 var NUMERIC_HEIGHT_PATTERN = /^[+-]?(?:\d+|\d*\.\d+)$/;
+var SIZE_EPSILON = 1;
 function resolveContainerHeight(value) {
   if (typeof value === "number" && Number.isFinite(value)) {
     return `${value}px`;
@@ -706,6 +707,7 @@ var ImageStory = (props = {}) => {
     let mounted = false;
     let resizeObserver = null;
     let pollId = null;
+    let lastKnownSize = null;
     const payload = sanitizeImageStoryProps({
       iiifContent,
       disablePanAndZoom,
@@ -734,12 +736,39 @@ var ImageStory = (props = {}) => {
         pollId = null;
       }
     };
-    const hasUsableSize = () => {
-      if (!node) return false;
+    const measureSize = () => {
+      if (!node) return null;
       const rect = node.getBoundingClientRect();
-      const width = (rect == null ? void 0 : rect.width) || node.offsetWidth || node.clientWidth;
-      const height2 = (rect == null ? void 0 : rect.height) || node.offsetHeight || node.clientHeight;
-      return width > 2 && height2 > 2;
+      const width = (rect == null ? void 0 : rect.width) || node.offsetWidth || node.clientWidth || 0;
+      const height2 = (rect == null ? void 0 : rect.height) || node.offsetHeight || node.clientHeight || 0;
+      return { width, height: height2 };
+    };
+    const hasUsableSize = () => {
+      const size = measureSize();
+      if (!size) return false;
+      const usable = size.width > 2 && size.height > 2;
+      if (usable) {
+        lastKnownSize = size;
+      }
+      return usable;
+    };
+    const hasMeaningfulSizeChange = () => {
+      const size = measureSize();
+      if (!size) return false;
+      if (size.width <= 2 || size.height <= 2) {
+        return true;
+      }
+      if (!lastKnownSize) {
+        lastKnownSize = size;
+        return true;
+      }
+      const widthDelta = Math.abs(size.width - lastKnownSize.width);
+      const heightDelta = Math.abs(size.height - lastKnownSize.height);
+      if (widthDelta > SIZE_EPSILON || heightDelta > SIZE_EPSILON) {
+        lastKnownSize = size;
+        return true;
+      }
+      return false;
     };
     const mountViewer = () => {
       if (!node || mounted || cancelled) return false;
@@ -755,8 +784,9 @@ var ImageStory = (props = {}) => {
       });
       return true;
     };
-    if (!mountViewer()) {
-      if (typeof window !== "undefined" && typeof window.ResizeObserver === "function") {
+    const scheduleWatchers = () => {
+      if (mounted || cancelled) return;
+      if (!resizeObserver && typeof window !== "undefined" && typeof window.ResizeObserver === "function") {
         resizeObserver = new window.ResizeObserver(() => {
           if (mounted || cancelled) return;
           mountViewer();
@@ -775,12 +805,48 @@ var ImageStory = (props = {}) => {
           }
         }, 200);
       };
-      schedulePoll();
+      if (!pollId) {
+        schedulePoll();
+      }
+    };
+    const beginMounting = () => {
+      if (!mountViewer()) {
+        scheduleWatchers();
+      }
+    };
+    const remountViewer = () => {
+      if (cancelled) return;
+      if (mounted) {
+        mounted = false;
+        destroyCleanup();
+      }
+      beginMounting();
+    };
+    beginMounting();
+    const handleGalleryModalChange = (event) => {
+      if (!node || !event || typeof document === "undefined") return;
+      const detail = event.detail || {};
+      if (detail.state !== "open") return;
+      const modal = detail.modal || (detail.modalId ? document.getElementById(detail.modalId) : null);
+      if (!modal || !modal.contains(node)) return;
+      if (!mounted) return;
+      if (hasMeaningfulSizeChange()) {
+        remountViewer();
+      }
+    };
+    if (typeof window !== "undefined" && window.addEventListener) {
+      window.addEventListener("canopy:gallery:modal-change", handleGalleryModalChange);
     }
     return () => {
       cancelled = true;
       disconnectWatchers();
       destroyCleanup();
+      if (typeof window !== "undefined" && window.removeEventListener) {
+        window.removeEventListener(
+          "canopy:gallery:modal-change",
+          handleGalleryModalChange
+        );
+      }
     };
   }, [iiifContent, disablePanAndZoom, pointOfInterestSvgUrl, viewerOptions]);
   return /* @__PURE__ */ React6.createElement(
@@ -953,8 +1019,8 @@ function formatTemplate(template, replacements = {}) {
   });
 }
 function useLocaleMessages() {
-  const PageContext2 = getSafePageContext();
-  const context = PageContext2 ? React11.useContext(PageContext2) : null;
+  const PageContext3 = getSafePageContext();
+  const context = PageContext3 ? React11.useContext(PageContext3) : null;
   const siteMessages = context && context.site && context.site.localeMessages && typeof context.site.localeMessages === "object" ? context.site.localeMessages : null;
   return siteMessages || readRuntimeMessages();
 }
@@ -1130,8 +1196,8 @@ function Hero({
   const { getString } = useLocale();
   const normalizedVariant = normalizeVariant(variant);
   const isBreadcrumbVariant = normalizedVariant === "breadcrumb";
-  const PageContext2 = navigationHelpers && typeof navigationHelpers.getPageContext === "function" ? navigationHelpers.getPageContext() : null;
-  const pageContext = PageContext2 ? React12.useContext(PageContext2) : null;
+  const PageContext3 = navigationHelpers && typeof navigationHelpers.getPageContext === "function" ? navigationHelpers.getPageContext() : null;
+  const pageContext = PageContext3 ? React12.useContext(PageContext3) : null;
   let orderedSlides = [];
   if (!isBreadcrumbVariant) {
     const resolved = resolveFeaturedItem({ item, index, random });
@@ -1528,8 +1594,8 @@ function SubNavigation({
   heading,
   ariaLabel
 }) {
-  const PageContext2 = navigationHelpers2 && navigationHelpers2.getPageContext ? navigationHelpers2.getPageContext() : null;
-  const context = PageContext2 ? React14.useContext(PageContext2) : null;
+  const PageContext3 = navigationHelpers2 && navigationHelpers2.getPageContext ? navigationHelpers2.getPageContext() : null;
+  const context = PageContext3 ? React14.useContext(PageContext3) : null;
   const contextNavigation = context && context.navigation ? context.navigation : null;
   const contextPage = context && context.page ? context.page : null;
   const effectiveNavigation = navigationProp || contextNavigation;
@@ -1580,12 +1646,39 @@ function SubNavigation({
   );
 }
 
-// ui/src/layout/Layout.jsx
-import React16 from "react";
-import navigationHelpers3 from "@canopy-iiif/app/lib/components/navigation.js";
-
 // ui/src/layout/ContentNavigation.jsx
 import React15 from "react";
+
+// ui/src/layout/headingUtils.js
+function buildHeadingTree(headings) {
+  if (!Array.isArray(headings) || !headings.length) return [];
+  const root = [];
+  const stack = [];
+  headings.forEach((heading) => {
+    if (!heading || typeof heading !== "object") return;
+    const depth = typeof heading.depth === "number" ? heading.depth : heading.level;
+    if (typeof depth !== "number" || depth < 2) return;
+    const entry = {
+      id: heading.id || heading.slug || heading.title,
+      title: heading.title || heading.text || heading.id,
+      depth,
+      children: []
+    };
+    while (stack.length && stack[stack.length - 1].depth >= entry.depth) {
+      stack.pop();
+    }
+    if (!stack.length) {
+      root.push(entry);
+    } else {
+      stack[stack.length - 1].children.push(entry);
+    }
+    stack.push(entry);
+  });
+  return root;
+}
+
+// ui/src/layout/ContentNavigation.jsx
+var PageContext = typeof getSafePageContext === "function" ? getSafePageContext() : null;
 var SCROLL_OFFSET_REM = 1.618;
 var MAX_HEADING_DEPTH = 3;
 function resolveDepth(value, fallback = 1) {
@@ -1597,28 +1690,56 @@ function buildNodeKey(id, parentKey, index) {
   return `${parentKey || "section"}-${sanitized || index}`;
 }
 function ContentNavigation({
-  items = [],
+  items: itemsProp = [],
   className = "",
   style = {},
   heading,
   headingId,
   pageTitle,
-  ariaLabel
+  ariaLabel,
+  collapsible = false
 }) {
   const { getString, formatString } = useLocale();
+  const context = PageContext ? React15.useContext(PageContext) : null;
+  const contextHeadings = React15.useMemo(() => {
+    const headings = context && context.page ? context.page.headings : null;
+    return Array.isArray(headings) ? headings : [];
+  }, [context]);
+  const resolvedItems = React15.useMemo(() => {
+    if (itemsProp && itemsProp.length) return itemsProp;
+    return buildHeadingTree(contextHeadings);
+  }, [itemsProp, contextHeadings]);
+  const topHeading = React15.useMemo(() => {
+    return contextHeadings.find((entry) => {
+      const depth = entry && (entry.depth || entry.level);
+      return depth === 1;
+    }) || null;
+  }, [contextHeadings]);
+  const resolvedHeadingId = headingId || topHeading && topHeading.id || null;
+  const resolvedPageTitle = pageTitle || (context && context.page ? context.page.title : null) || null;
+  const inferredHeading = topHeading && (topHeading.title || topHeading.text) || null;
   const isBrowser = typeof window !== "undefined" && typeof document !== "undefined";
   const savedDepthsRef = React15.useRef(null);
-  const [isExpanded, setIsExpanded] = React15.useState(false);
+  const [internalExpanded, setInternalExpanded] = React15.useState(
+    collapsible ? false : true
+  );
+  React15.useEffect(() => {
+    setInternalExpanded(collapsible ? false : true);
+  }, [collapsible]);
   const handleToggle = React15.useCallback(() => {
-    setIsExpanded((prev) => !prev);
-  }, []);
-  if ((!items || !items.length) && !headingId) return null;
+    if (!collapsible) return;
+    setInternalExpanded((prev) => !prev);
+  }, [collapsible]);
+  const isExpanded = collapsible ? internalExpanded : true;
+  if ((!resolvedItems || !resolvedItems.length) && !resolvedHeadingId)
+    return null;
   const combinedClassName = [
     "canopy-sub-navigation canopy-content-navigation",
     isExpanded ? "canopy-content-navigation--expanded" : "canopy-content-navigation--collapsed",
+    !collapsible ? "canopy-content-navigation--static" : null,
     className
   ].filter(Boolean).join(" ");
-  const effectiveHeading = heading || pageTitle || null;
+  const effectiveHeading = heading || inferredHeading || resolvedPageTitle || null;
   const fallbackNavLabel = getString(
     "common.nouns.section_navigation",
     "Section navigation"
@@ -1666,8 +1787,8 @@ function ContentNavigation({
   const headingEntries = React15.useMemo(() => {
     const entries = [];
     const seen = /* @__PURE__ */ new Set();
-    if (headingId) {
-      const topId = String(headingId);
+    if (resolvedHeadingId) {
+      const topId = String(resolvedHeadingId);
       entries.push({ id: topId, depth: 1 });
       seen.add(topId);
     }
@@ -1687,10 +1808,10 @@ function ContentNavigation({
         if (node.children && node.children.length) pushNodes(node.children);
       });
     };
-    pushNodes(items);
+    pushNodes(resolvedItems);
     return entries;
-  }, [headingId, items, getSavedDepth]);
-  const fallbackId = headingEntries.length ? headingEntries[0].id : headingId || null;
+  }, [resolvedHeadingId, resolvedItems, getSavedDepth]);
+  const fallbackId = headingEntries.length ? headingEntries[0].id : resolvedHeadingId || null;
   const [activeId, setActiveId] = React15.useState(fallbackId);
   const activeIdRef = React15.useRef(activeId);
   React15.useEffect(() => {
@@ -1802,7 +1923,7 @@ function ContentNavigation({
         }
       }
       if (!Number.isFinite(top) || top < 0 || options.scrollToTop) top = 0;
-      const nextId = targetId && targetId !== "top" ? targetId : ((_a = headingEntries[0]) == null ? void 0 : _a.id) || headingId || null;
+      const nextId = targetId && targetId !== "top" ? targetId : ((_a = headingEntries[0]) == null ? void 0 : _a.id) || resolvedHeadingId || null;
       if (nextId) {
         activeIdRef.current = nextId;
         setActiveId(nextId);
@@ -1813,7 +1934,7 @@ function ContentNavigation({
         window.scrollTo(0, top);
       }
     },
-    [computeOffsetPx, headingEntries, headingId, isBrowser]
+    [computeOffsetPx, headingEntries, resolvedHeadingId, isBrowser]
   );
   const navTreeRoot = React15.useMemo(() => {
     function mapNodes(nodes2, parentKey = "section") {
@@ -1847,13 +1968,19 @@ function ContentNavigation({
         };
       }).filter(Boolean);
     }
-    const nodes = mapNodes(items, "section");
+    const nodes = mapNodes(resolvedItems, "section");
     return {
       slug: "content-nav-root",
-      title: effectiveHeading || pageTitle || onThisPageLabel,
+      title: effectiveHeading || resolvedPageTitle || onThisPageLabel,
       children: nodes
     };
-  }, [items, effectiveHeading, pageTitle, activeId, getSavedDepth]);
+  }, [
+    resolvedItems,
+    effectiveHeading,
+    resolvedPageTitle,
+    activeId,
+    getSavedDepth
+  ]);
   return /* @__PURE__ */ React15.createElement(
     "nav",
     {
@@ -1862,7 +1989,7 @@ function ContentNavigation({
       "aria-label": navLabel,
       "data-canopy-content-nav": "true"
     },
-    /* @__PURE__ */ React15.createElement(
+    collapsible ? /* @__PURE__ */ React15.createElement(
       "button",
       {
         type: "button",
@@ -1951,7 +2078,7 @@ function ContentNavigation({
         /* @__PURE__ */ React15.createElement("span", { className: "sr-only" }, toggleSrLabel)
       ),
       /* @__PURE__ */ React15.createElement("span", { className: "sr-only", "data-canopy-content-nav-toggle-sr": "true" }, toggleSrLabel)
-    ),
+    ) : null,
     /* @__PURE__ */ React15.createElement(
       NavigationTree,
       {
@@ -1964,42 +2091,8 @@ function ContentNavigation({
   );
 }
 
-// ui/src/layout/Layout.jsx
-function buildHeadingTree(headings) {
-  if (!Array.isArray(headings) || !headings.length) return [];
-  const root = [];
-  const stack = [];
-  headings.forEach((heading) => {
-    if (!heading || typeof heading !== "object") return;
-    const depth = typeof heading.depth === "number" ? heading.depth : heading.level;
-    if (typeof depth !== "number" || depth < 2) return;
-    const entry = {
-      id: heading.id || heading.slug || heading.title,
-      title: heading.title || heading.text || heading.id,
-      depth,
-      children: []
-    };
-    while (stack.length && stack[stack.length - 1].depth >= entry.depth) {
-      stack.pop();
-    }
-    if (!stack.length) {
-      root.push(entry);
-    } else {
-      stack[stack.length - 1].children.push(entry);
-    }
-    stack.push(entry);
-  });
-  return root;
-}
-function buildNavigationAside(sidebar, className) {
-  if (!sidebar) {
-    return /* @__PURE__ */ React16.createElement(SubNavigation, { className });
-  }
-  if (typeof sidebar === "function") {
-    return React16.createElement(sidebar);
-  }
-  return sidebar;
-}
+// ui/src/layout/ContentNavigationScript.jsx
+import React16 from "react";
 function ContentNavigationScript() {
   const code = `
 (function () {
@@ -2085,16 +2178,32 @@ function ContentNavigationScript() {
   function setupFloatingState(root) {
     if (!root || typeof IntersectionObserver !== 'function') return;
     if (root.__canopyContentNavFloating) return;
+    var nav = root.querySelector('[data-canopy-content-nav]');
+    if (!nav) return;
     var sentinel = root.querySelector('[data-canopy-content-nav-sentinel]');
+    if (!sentinel) {
+      sentinel = document.createElement('div');
+      sentinel.setAttribute('aria-hidden', 'true');
+      sentinel.setAttribute('data-canopy-content-nav-sentinel', 'true');
+      root.insertBefore(sentinel, nav);
+    }
     var placeholder = root.querySelector('[data-canopy-content-nav-placeholder]');
-    var nav = root.querySelector('[data-canopy-content-nav]');
-    if (!sentinel || !nav) return;
+    if (!placeholder) {
+      placeholder = document.createElement('div');
+      placeholder.setAttribute('aria-hidden', 'true');
+      placeholder.setAttribute('data-canopy-content-nav-placeholder', 'true');
+      if (nav.nextSibling) {
+        root.insertBefore(placeholder, nav.nextSibling);
+      } else {
+        root.appendChild(placeholder);
+      }
+    }
     root.__canopyContentNavFloating = true;
 
     function syncPosition() {
       try {
         var rect = root.getBoundingClientRect();
-        nav.style.setProperty('--canopy-content-nav-fixed-right', '1.618rem');
+        nav.style.setProperty('--canopy-content-nav-fixed-left', rect.left + 'px');
         nav.style.setProperty('--canopy-content-nav-fixed-width', rect.width + 'px');
         if (placeholder) placeholder.style.width = rect.width + 'px';
       } catch (_) {}
@@ -2266,10 +2375,44 @@ function ContentNavigationScript() {
   }
 
   ready(function () {
-    var roots = Array.prototype.slice.call(
-      document.querySelectorAll('[data-canopy-content-nav-root]')
+    var rootSet = new Set();
+    var navNodes = Array.prototype.slice.call(
+      document.querySelectorAll('[data-canopy-content-nav]')
     );
+    navNodes.forEach(function (nav) {
+      if (!nav || !nav.closest) return;
+      var root = nav.closest('[data-canopy-content-nav-root]');
+      if (!root) {
+        root = nav.parentElement || nav;
+        if (root && !root.hasAttribute('data-canopy-content-nav-root')) {
+          root.setAttribute('data-canopy-content-nav-root', 'true');
+        }
+      }
+      if (root) rootSet.add(root);
+    });
+
+    var roots = Array.from(rootSet);
     if (!roots.length) return;
+
+    var collapsibleRoots = [];
+    roots.forEach(function (root) {
+      var nav = root.querySelector('[data-canopy-content-nav]');
+      if (!nav) return;
+      var isStatic = nav.classList.contains('canopy-content-navigation--static');
+      if (isStatic) {
+        root.classList.remove('is-collapsed');
+        nav.classList.add('canopy-content-navigation--expanded');
+        nav.classList.remove('canopy-content-navigation--collapsed');
+        nav.setAttribute('data-expanded', 'true');
+      } else {
+        collapsibleRoots.push(root);
+      }
+      setupFloatingState(root);
+      setupActiveHeadingWatcher(root);
+    });
+
+    if (!collapsibleRoots.length) return;
+
     var stored = getStored();
     var collapsed = true;
     var isDesktop = false;
@@ -2289,7 +2432,7 @@ function ContentNavigationScript() {
 
     function sync(next) {
       collapsed = !!next;
-      roots.forEach(function (root) {
+      collapsibleRoots.forEach(function (root) {
         applyState(root, collapsed);
       });
       setStored(collapsed ? '1' : '0');
@@ -2297,7 +2440,7 @@ function ContentNavigationScript() {
 
     sync(collapsed);
 
-    roots.forEach(function (root) {
+    collapsibleRoots.forEach(function (root) {
       var toggle = root.querySelector('[data-canopy-content-nav-toggle]');
       if (!toggle) return;
       toggle.addEventListener('click', function (event) {
@@ -2305,16 +2448,23 @@ function ContentNavigationScript() {
         sync(!collapsed);
       });
     });
-
-    roots.forEach(function (root) {
-      setupFloatingState(root);
-      setupActiveHeadingWatcher(root);
-    });
   });
 })();
   `;
   return /* @__PURE__ */ React16.createElement("script", { dangerouslySetInnerHTML: { __html: code } });
 }
+
+// ui/src/layout/Layout.jsx
+import React17 from "react";
+function buildNavigationAside(sidebar, className) {
+  if (!sidebar) {
+    return /* @__PURE__ */ React17.createElement(SubNavigation, { className });
+  }
+  if (typeof sidebar === "function") {
+    return React17.createElement(sidebar);
+  }
+  return sidebar;
+}
 function Layout({
   children,
   sidebar,
@@ -2327,27 +2477,27 @@ function Layout({
   contentNavigationClassName = "",
   ...rest
 }) {
-  const PageContext2 = navigationHelpers3 && typeof navigationHelpers3.getPageContext === "function" ? navigationHelpers3.getPageContext() : null;
-  const context = PageContext2 ? React16.useContext(PageContext2) : null;
-  const pageHeadings = React16.useMemo(() => {
+  const PageContext3 = typeof getSafePageContext === "function" ? getSafePageContext() : null;
+  const context = PageContext3 ? React17.useContext(PageContext3) : null;
+  const pageHeadings = React17.useMemo(() => {
     const headings = context && context.page ? context.page.headings : null;
     return Array.isArray(headings) ? headings : [];
   }, [context]);
-  const contentHeading = React16.useMemo(() => {
+  const contentHeading = React17.useMemo(() => {
     const first = pageHeadings.find((heading) => {
       const depth = heading && (heading.depth || heading.level);
       return depth === 1;
     });
     return first && first.title ? first.title : null;
   }, [pageHeadings]);
-  const headingAnchorId = React16.useMemo(() => {
+  const headingAnchorId = React17.useMemo(() => {
     const first = pageHeadings.find((heading) => {
       const depth = heading && (heading.depth || heading.level);
       return depth === 1;
     });
     return first && first.id ? first.id : null;
   }, [pageHeadings]);
-  const headingTree = React16.useMemo(
+  const headingTree = React17.useMemo(
     () => buildHeadingTree(pageHeadings),
     [pageHeadings]
   );
@@ -2372,50 +2522,37 @@ function Layout({
     contentNavigationClassName
   ].filter(Boolean).join(" ");
   const sidebarNode = showLeftColumn ? buildNavigationAside(sidebar, sidebarClassName) : null;
-  return /* @__PURE__ */ React16.createElement("div", { className: containerClassName, ...rest }, showLeftColumn ? /* @__PURE__ */ React16.createElement("aside", { className: leftAsideClassName }, sidebarNode) : null, /* @__PURE__ */ React16.createElement("div", { className: contentClassNames }, children), hasContentNavigation ? /* @__PURE__ */ React16.createElement(React16.Fragment, null, /* @__PURE__ */ React16.createElement(
+  return /* @__PURE__ */ React17.createElement("div", { className: containerClassName, ...rest }, showLeftColumn ? /* @__PURE__ */ React17.createElement("aside", { className: leftAsideClassName }, sidebarNode) : null, /* @__PURE__ */ React17.createElement("div", { className: contentClassNames }, children), hasContentNavigation ? /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(
     "aside",
     {
       className: contentNavigationAsideClassName,
       "data-canopy-content-nav-root": "true"
     },
-    /* @__PURE__ */ React16.createElement(
-      "div",
-      {
-        "data-canopy-content-nav-sentinel": "true",
-        "aria-hidden": "true"
-      }
-    ),
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React17.createElement(
       ContentNavigation,
       {
         items: headingTree,
         heading: contentHeading || void 0,
         headingId: headingAnchorId || void 0,
-        pageTitle: context && context.page ? context.page.title : void 0
-      }
-    ),
-    /* @__PURE__ */ React16.createElement(
-      "div",
-      {
-        "data-canopy-content-nav-placeholder": "true",
-        "aria-hidden": "true"
+        pageTitle: context && context.page ? context.page.title : void 0,
+        collapsible: true
       }
     )
-  ), /* @__PURE__ */ React16.createElement(ContentNavigationScript, null)) : null);
+  ), /* @__PURE__ */ React17.createElement(ContentNavigationScript, null)) : null);
 }
 
 // ui/src/layout/CanopyHeader.jsx
-import React25 from "react";
+import React26 from "react";
 
 // ui/src/search/SearchPanel.jsx
-import React20 from "react";
+import React21 from "react";
 
 // ui/src/Icons.jsx
-import React17 from "react";
-var MagnifyingGlassIcon = (props) => /* @__PURE__ */ React17.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", "aria-hidden": "true", focusable: "false", ...props }, /* @__PURE__ */ React17.createElement("path", { d: "M456.69 421.39L362.6 327.3a173.81 173.81 0 0034.84-104.58C397.44 126.38 319.06 48 222.72 48S48 126.38 48 222.72s78.38 174.72 174.72 174.72A173.81 173.81 0 00327.3 362.6l94.09 94.09a25 25 0 0035.3-35.3zM97.92 222.72a124.8 124.8 0 11124.8 124.8 124.95 124.95 0 01-124.8-124.8z" }));
+import React18 from "react";
+var MagnifyingGlassIcon = (props) => /* @__PURE__ */ React18.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", "aria-hidden": "true", focusable: "false", ...props }, /* @__PURE__ */ React18.createElement("path", { d: "M456.69 421.39L362.6 327.3a173.81 173.81 0 0034.84-104.58C397.44 126.38 319.06 48 222.72 48S48 126.38 48 222.72s78.38 174.72 174.72 174.72A173.81 173.81 0 00327.3 362.6l94.09 94.09a25 25 0 0035.3-35.3zM97.92 222.72a124.8 124.8 0 11124.8 124.8 124.95 124.95 0 01-124.8-124.8z" }));
 
 // ui/src/search/SearchPanelForm.jsx
-import React18 from "react";
+import React19 from "react";
 function readBasePath2() {
   const normalize = (val) => {
     const raw = typeof val === "string" ? val.trim() : "";
@@ -2487,18 +2624,18 @@ function SearchPanelForm(props = {}) {
     { content: searchLabel }
   );
   const text = typeof label === "string" && label.trim() ? label.trim() : buttonText;
-  const action = React18.useMemo(
+  const action = React19.useMemo(
     () => resolveSearchPath(searchPath),
     [searchPath]
   );
-  const autoId = typeof React18.useId === "function" ? React18.useId() : void 0;
-  const [fallbackId] = React18.useState(
+  const autoId = typeof React19.useId === "function" ? React19.useId() : void 0;
+  const [fallbackId] = React19.useState(
     () => `canopy-search-form-${Math.random().toString(36).slice(2, 10)}`
   );
   const inputId = inputIdProp || autoId || fallbackId;
-  const inputRef = React18.useRef(null);
-  const [hasValue, setHasValue] = React18.useState(false);
-  const focusInput = React18.useCallback(() => {
+  const inputRef = React19.useRef(null);
+  const [hasValue, setHasValue] = React19.useState(false);
+  const focusInput = React19.useCallback(() => {
     const el = inputRef.current;
     if (!el) return;
     if (document.activeElement === el) return;
@@ -2511,7 +2648,7 @@ function SearchPanelForm(props = {}) {
       }
     }
   }, []);
-  const handlePointerDown = React18.useCallback(
+  const handlePointerDown = React19.useCallback(
     (event) => {
       const target = event.target;
       if (target && typeof target.closest === "function") {
@@ -2523,23 +2660,23 @@ function SearchPanelForm(props = {}) {
     },
     [focusInput]
   );
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     const el = inputRef.current;
     if (!el) return;
     if (el.value && el.value.trim()) {
       setHasValue(true);
     }
   }, []);
-  const handleInputChange = React18.useCallback((event) => {
+  const handleInputChange = React19.useCallback((event) => {
     var _a;
     const nextHasValue = Boolean(
       ((_a = event == null ? void 0 : event.target) == null ? void 0 : _a.value) && event.target.value.trim()
     );
     setHasValue(nextHasValue);
   }, []);
-  const handleClear = React18.useCallback((event) => {
+  const handleClear = React19.useCallback((event) => {
   }, []);
-  const handleClearKey = React18.useCallback(
+  const handleClearKey = React19.useCallback(
     (event) => {
       if (event.key === "Enter" || event.key === " ") {
         event.preventDefault();
@@ -2548,7 +2685,7 @@ function SearchPanelForm(props = {}) {
     },
     [handleClear]
   );
-  return /* @__PURE__ */ React18.createElement(
+  return /* @__PURE__ */ React19.createElement(
     "form",
     {
       action,
@@ -2560,7 +2697,7 @@ function SearchPanelForm(props = {}) {
       onPointerDown: handlePointerDown,
       "data-has-value": hasValue ? "1" : "0"
     },
-    /* @__PURE__ */ React18.createElement("label", { htmlFor: inputId, className: "canopy-search-form__label" }, /* @__PURE__ */ React18.createElement(MagnifyingGlassIcon, { className: "canopy-search-form__icon" }), /* @__PURE__ */ React18.createElement("span", { className: "sr-only" }, searchLabel), /* @__PURE__ */ React18.createElement(
+    /* @__PURE__ */ React19.createElement("label", { htmlFor: inputId, className: "canopy-search-form__label" }, /* @__PURE__ */ React19.createElement(MagnifyingGlassIcon, { className: "canopy-search-form__icon" }), /* @__PURE__ */ React19.createElement("span", { className: "sr-only" }, searchLabel), /* @__PURE__ */ React19.createElement(
       "input",
       {
         id: inputId,
@@ -2575,7 +2712,7 @@ function SearchPanelForm(props = {}) {
         onInput: handleInputChange
       }
     )),
-    hasValue ? /* @__PURE__ */ React18.createElement(
+    hasValue ? /* @__PURE__ */ React19.createElement(
       "button",
       {
         type: "button",
@@ -2588,7 +2725,7 @@ function SearchPanelForm(props = {}) {
       },
       "\xD7"
     ) : null,
-    /* @__PURE__ */ React18.createElement(
+    /* @__PURE__ */ React19.createElement(
       "button",
       {
         type: "submit",
@@ -2601,11 +2738,11 @@ function SearchPanelForm(props = {}) {
 }
 
 // ui/src/search/SearchPanelTeaserResults.jsx
-import React19 from "react";
+import React20 from "react";
 function SearchPanelTeaserResults(props = {}) {
   const { style, className } = props || {};
   const classes = ["canopy-search-teaser", "is-empty", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React19.createElement(
+  return /* @__PURE__ */ React20.createElement(
     "div",
     {
       "data-canopy-search-form-panel": true,
@@ -2613,7 +2750,7 @@ function SearchPanelTeaserResults(props = {}) {
       className: classes || void 0,
       style
     },
-    /* @__PURE__ */ React19.createElement("div", { id: "cplist", className: "canopy-search-teaser__list" })
+    /* @__PURE__ */ React20.createElement("div", { id: "cplist", className: "canopy-search-teaser__list" })
   );
 }
 
@@ -2637,25 +2774,25 @@ function SearchPanel(props = {}) {
   const text = typeof label === "string" && label.trim() ? label.trim() : resolvedButtonLabel;
   const resolvedSearchPath = resolveSearchPath(searchPath);
   const data = { placeholder, hotkey, maxResults, groupOrder, label: text, searchPath: resolvedSearchPath };
-  return /* @__PURE__ */ React20.createElement("div", { "data-canopy-search-form": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React20.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React20.createElement(SearchPanelForm, { placeholder, buttonLabel: resolvedButtonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React20.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React20.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
+  return /* @__PURE__ */ React21.createElement("div", { "data-canopy-search-form": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React21.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React21.createElement(SearchPanelForm, { placeholder, buttonLabel: resolvedButtonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React21.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React21.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
 }
 
 // ui/src/layout/CanopyBrand.jsx
-import React21 from "react";
-var PageContext = getSafePageContext();
+import React22 from "react";
+var PageContext2 = getSafePageContext();
 function CanopyBrand(props = {}) {
   const { labelId, label: labelProp, href = "/", className, Logo } = props || {};
-  const context = React21.useContext(PageContext);
+  const context = React22.useContext(PageContext2);
   const contextSiteTitle = context && context.site && typeof context.site.title === "string" ? context.site.title.trim() : "";
   const normalizedLabel = typeof labelProp === "string" && labelProp.trim() ? labelProp : "";
   const resolvedLabel = normalizedLabel || contextSiteTitle || "Site title";
   const spanProps = labelId ? { id: labelId } : {};
   const classes = ["canopy-logo", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React21.createElement("a", { href, className: classes }, typeof Logo === "function" ? /* @__PURE__ */ React21.createElement(Logo, null) : null, /* @__PURE__ */ React21.createElement("span", { ...spanProps }, resolvedLabel));
+  return /* @__PURE__ */ React22.createElement("a", { href, className: classes }, typeof Logo === "function" ? /* @__PURE__ */ React22.createElement(Logo, null) : null, /* @__PURE__ */ React22.createElement("span", { ...spanProps }, resolvedLabel));
 }
 
 // ui/src/layout/CanopyModal.jsx
-import React22 from "react";
+import React23 from "react";
 function CanopyModal(props = {}) {
   const {
     id,
@@ -2708,7 +2845,7 @@ function CanopyModal(props = {}) {
   if (padded) bodyClasses.push("canopy-modal__body--padded");
   if (bodyClassName) bodyClasses.push(bodyClassName);
   const bodyClassNameValue = bodyClasses.join(" ");
-  return /* @__PURE__ */ React22.createElement("div", { ...modalProps }, /* @__PURE__ */ React22.createElement("div", { className: "canopy-modal__panel" }, /* @__PURE__ */ React22.createElement("button", { ...closeButtonProps }, /* @__PURE__ */ React22.createElement(
+  return /* @__PURE__ */ React23.createElement("div", { ...modalProps }, /* @__PURE__ */ React23.createElement("div", { className: "canopy-modal__panel" }, /* @__PURE__ */ React23.createElement("button", { ...closeButtonProps }, /* @__PURE__ */ React23.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -2718,8 +2855,8 @@ function CanopyModal(props = {}) {
       strokeWidth: "1.5",
       className: "canopy-modal__close-icon"
     },
-    /* @__PURE__ */ React22.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 6l12 12M6 18L18 6" })
-  ), /* @__PURE__ */ React22.createElement("span", { className: "sr-only" }, resolvedCloseLabel)), /* @__PURE__ */ React22.createElement("div", { className: bodyClassNameValue }, label ? /* @__PURE__ */ React22.createElement("div", { className: "canopy-modal__brand" }, /* @__PURE__ */ React22.createElement(
+    /* @__PURE__ */ React23.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 6l12 12M6 18L18 6" })
+  ), /* @__PURE__ */ React23.createElement("span", { className: "sr-only" }, resolvedCloseLabel)), /* @__PURE__ */ React23.createElement("div", { className: bodyClassNameValue }, label ? /* @__PURE__ */ React23.createElement("div", { className: "canopy-modal__brand" }, /* @__PURE__ */ React23.createElement(
     CanopyBrand,
     {
       labelId: resolvedLabelId,
@@ -2732,10 +2869,10 @@ function CanopyModal(props = {}) {
 }
 
 // ui/src/layout/LanguageToggle.jsx
-import React24 from "react";
+import React25 from "react";
 
 // ui/src/layout/languageToggleShared.jsx
-import React23 from "react";
+import React24 from "react";
 function readBasePath3() {
   const normalize = (value) => {
     if (!value) return "";
@@ -2894,13 +3031,13 @@ function LanguageToggleControl({
   ].filter(Boolean).join(" ").trim();
   const ariaLabel = config.label || "Language";
   const resolvedControl = control === "list" ? "list" : "select";
-  const selectId = typeof React23.useId === "function" && resolvedControl === "select" ? React23.useId() : void 0;
+  const selectId = typeof React24.useId === "function" && resolvedControl === "select" ? React24.useId() : void 0;
   const links = Array.isArray(config.links) ? config.links : [];
   if (!links.length) return null;
   const activeLink = links.find((link) => link.isActive);
   const fallbackHref = links[0].href;
   const selectedHref = activeLink ? activeLink.href : fallbackHref;
-  const navigate = React23.useCallback((href) => {
+  const navigate = React24.useCallback((href) => {
     if (!href) return;
     try {
       if (typeof window !== "undefined" && window.location) {
@@ -2920,7 +3057,7 @@ function LanguageToggleControl({
     } catch (_) {
     }
   }, []);
-  const handleSelectChange = React23.useCallback(
+  const handleSelectChange = React24.useCallback(
     (event) => {
       if (!event || !event.target) return;
       const nextHref = event.target.value;
@@ -2929,15 +3066,15 @@ function LanguageToggleControl({
     },
     [navigate, selectedHref]
   );
-  const labelElement = showLabel && config.label ? resolvedControl === "select" ? /* @__PURE__ */ React23.createElement(
+  const labelElement = showLabel && config.label ? resolvedControl === "select" ? /* @__PURE__ */ React24.createElement(
     "label",
     {
       className: "canopy-language-toggle__label",
       htmlFor: selectId
     },
     config.label
-  ) : /* @__PURE__ */ React23.createElement("span", { className: "canopy-language-toggle__label" }, config.label) : null;
-  return /* @__PURE__ */ React23.createElement("div", { className: classes || void 0 }, labelElement, resolvedControl === "select" ? /* @__PURE__ */ React23.createElement("div", { className: "canopy-language-toggle__select" }, /* @__PURE__ */ React23.createElement(
+  ) : /* @__PURE__ */ React24.createElement("span", { className: "canopy-language-toggle__label" }, config.label) : null;
+  return /* @__PURE__ */ React24.createElement("div", { className: classes || void 0 }, labelElement, resolvedControl === "select" ? /* @__PURE__ */ React24.createElement("div", { className: "canopy-language-toggle__select" }, /* @__PURE__ */ React24.createElement(
     "select",
     {
       id: selectId,
@@ -2947,7 +3084,7 @@ function LanguageToggleControl({
       "aria-label": ariaLabel,
       "data-canopy-language-select": "true"
     },
-    links.map((link) => /* @__PURE__ */ React23.createElement(
+    links.map((link) => /* @__PURE__ */ React24.createElement(
       "option",
       {
         key: link.lang,
@@ -2957,7 +3094,7 @@ function LanguageToggleControl({
       },
       link.label
     ))
-  )) : /* @__PURE__ */ React23.createElement("nav", { className: "canopy-language-toggle__nav", "aria-label": ariaLabel }, /* @__PURE__ */ React23.createElement("ul", { className: "canopy-language-toggle__list", role: "list" }, links.map((link) => /* @__PURE__ */ React23.createElement("li", { key: link.lang }, /* @__PURE__ */ React23.createElement(
+  )) : /* @__PURE__ */ React24.createElement("nav", { className: "canopy-language-toggle__nav", "aria-label": ariaLabel }, /* @__PURE__ */ React24.createElement("ul", { className: "canopy-language-toggle__list", role: "list" }, links.map((link) => /* @__PURE__ */ React24.createElement("li", { key: link.lang }, /* @__PURE__ */ React24.createElement(
     "button",
     {
       type: "button",
@@ -2969,7 +3106,7 @@ function LanguageToggleControl({
       onClick: () => navigate(link.href)
     },
     link.label
-  ))))), /* @__PURE__ */ React23.createElement(LanguageToggleRuntime, null));
+  ))))), /* @__PURE__ */ React24.createElement(LanguageToggleRuntime, null));
 }
 function LanguageToggleRuntime() {
   const code = `
@@ -3029,7 +3166,7 @@ function LanguageToggleRuntime() {
   }
 })();
   `;
-  return /* @__PURE__ */ React23.createElement("script", { dangerouslySetInnerHTML: { __html: code } });
+  return /* @__PURE__ */ React24.createElement("script", { dangerouslySetInnerHTML: { __html: code } });
 }
 
 // ui/src/layout/LanguageToggle.jsx
@@ -3043,8 +3180,8 @@ function LanguageToggle({
   label,
   ariaLabel
 }) {
-  const PageContext2 = getSafePageContext();
-  const context = React24.useContext(PageContext2);
+  const PageContext3 = getSafePageContext();
+  const context = React25.useContext(PageContext3);
   const siteLanguageToggle = context && context.site && context.site.languageToggle || null;
   const pageData = page || (context && context.page ? context.page : null);
   const resolvedToggle = languageToggle === false ? null : languageToggle === true || typeof languageToggle === "undefined" ? siteLanguageToggle : languageToggle;
@@ -3053,7 +3190,7 @@ function LanguageToggle({
     resolvedToggle && typeof resolvedToggle.control === "string" ? resolvedToggle.control : null
   );
   const resolvedControl = normalizeControl(typeof control === "string" ? control : null) || toggleControl || "select";
-  const config = React24.useMemo(() => {
+  const config = React25.useMemo(() => {
     if (!resolvedToggle) return null;
     const base = buildLanguageToggleConfig(resolvedToggle, pageData);
     if (!base) return null;
@@ -3064,7 +3201,7 @@ function LanguageToggle({
     };
   }, [resolvedToggle, pageData, label, ariaLabel]);
   if (!config) return null;
-  return /* @__PURE__ */ React24.createElement(
+  return /* @__PURE__ */ React25.createElement(
     LanguageToggleControl,
     {
       config,
@@ -3366,7 +3503,7 @@ function HeaderScript() {
   });
 })();
   `;
-  return /* @__PURE__ */ React25.createElement(
+  return /* @__PURE__ */ React26.createElement(
     "script",
     {
       dangerouslySetInnerHTML: {
@@ -3442,8 +3579,8 @@ function CanopyHeader(props = {}) {
     logo: SiteLogo,
     languageToggle: languageToggleProp
   } = props;
-  const PageContext2 = getSafePageContext();
-  const context = React25.useContext(PageContext2);
+  const PageContext3 = getSafePageContext();
+  const context = React26.useContext(PageContext3);
   const { getString, formatString } = useLocale();
   const contextPrimaryNav = context && Array.isArray(context.primaryNavigation) ? context.primaryNavigation : [];
   const navLinks = navLinksProp && navLinksProp.length ? ensureArray(navLinksProp) : ensureArray(contextPrimaryNav);
@@ -3519,14 +3656,14 @@ function CanopyHeader(props = {}) {
     return !!(rootNode && Array.isArray(rootNode.children) && rootNode.children.length);
   };
   const hasIntegratedSectionNav = navLinks.some(shouldAttachSectionNav);
-  return /* @__PURE__ */ React25.createElement(React25.Fragment, null, /* @__PURE__ */ React25.createElement(
+  return /* @__PURE__ */ React26.createElement(React26.Fragment, null, /* @__PURE__ */ React26.createElement(
     "header",
     {
       className: "canopy-header",
       "data-mobile-nav": "closed",
       "data-mobile-search": "closed"
     },
-    /* @__PURE__ */ React25.createElement("div", { className: "canopy-header__brand" }, /* @__PURE__ */ React25.createElement(
+    /* @__PURE__ */ React26.createElement("div", { className: "canopy-header__brand" }, /* @__PURE__ */ React26.createElement(
       CanopyBrand,
       {
         label: resolvedTitle,
@@ -3535,7 +3672,7 @@ function CanopyHeader(props = {}) {
         Logo: SiteLogo
       }
     )),
-    /* @__PURE__ */ React25.createElement("div", { className: "canopy-header__desktop-search" }, /* @__PURE__ */ React25.createElement(
+    /* @__PURE__ */ React26.createElement("div", { className: "canopy-header__desktop-search" }, /* @__PURE__ */ React26.createElement(
       SearchPanel,
       {
         label: resolvedSearchLabel,
@@ -3544,13 +3681,13 @@ function CanopyHeader(props = {}) {
         searchPath: normalizedSearchRoute
       }
     )),
-    /* @__PURE__ */ React25.createElement(
+    /* @__PURE__ */ React26.createElement(
       "nav",
       {
         className: "canopy-nav-links canopy-header__desktop-nav",
         "aria-label": primaryNavigationLabel
       },
-      navLinks.map((link) => /* @__PURE__ */ React25.createElement(
+      navLinks.map((link) => /* @__PURE__ */ React26.createElement(
         "a",
         {
           key: link.href,
@@ -3560,7 +3697,7 @@ function CanopyHeader(props = {}) {
         link.label || link.href
       ))
     ),
-    /* @__PURE__ */ React25.createElement("div", { className: "canopy-header__actions" }, resolvedLanguageToggle ? /* @__PURE__ */ React25.createElement(
+    /* @__PURE__ */ React26.createElement("div", { className: "canopy-header__actions" }, resolvedLanguageToggle ? /* @__PURE__ */ React26.createElement(
       LanguageToggle,
       {
         languageToggle: resolvedLanguageToggle,
@@ -3568,7 +3705,7 @@ function CanopyHeader(props = {}) {
         variant: "desktop",
         className: "canopy-header__language-toggle canopy-header__language-toggle--desktop"
       }
-    ) : null, /* @__PURE__ */ React25.createElement(
+    ) : null, /* @__PURE__ */ React26.createElement(
       "button",
       {
         type: "button",
@@ -3578,7 +3715,7 @@ function CanopyHeader(props = {}) {
         "aria-expanded": "false",
         "data-canopy-header-toggle": "search"
       },
-      /* @__PURE__ */ React25.createElement(
+      /* @__PURE__ */ React26.createElement(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
@@ -3588,7 +3725,7 @@ function CanopyHeader(props = {}) {
           strokeWidth: "1.5",
           className: "canopy-header__search-icon"
         },
-        /* @__PURE__ */ React25.createElement(
+        /* @__PURE__ */ React26.createElement(
           "path",
           {
             strokeLinecap: "round",
@@ -3597,7 +3734,7 @@ function CanopyHeader(props = {}) {
           }
         )
       )
-    ), /* @__PURE__ */ React25.createElement(
+    ), /* @__PURE__ */ React26.createElement(
       "button",
       {
         type: "button",
@@ -3607,7 +3744,7 @@ function CanopyHeader(props = {}) {
         "aria-expanded": "false",
         "data-canopy-header-toggle": "nav"
       },
-      /* @__PURE__ */ React25.createElement(
+      /* @__PURE__ */ React26.createElement(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
@@ -3617,7 +3754,7 @@ function CanopyHeader(props = {}) {
           stroke: "currentColor",
           className: "canopy-header__menu-icon"
         },
-        /* @__PURE__ */ React25.createElement(
+        /* @__PURE__ */ React26.createElement(
           "path",
           {
             strokeLinecap: "round",
@@ -3627,7 +3764,7 @@ function CanopyHeader(props = {}) {
         )
       )
     ))
-  ), /* @__PURE__ */ React25.createElement(
+  ), /* @__PURE__ */ React26.createElement(
     CanopyModal,
     {
       id: "canopy-modal-nav",
@@ -3639,7 +3776,7 @@ function CanopyHeader(props = {}) {
       closeLabel: closeNavLabel,
       closeDataAttr: "nav"
     },
-    resolvedLanguageToggle ? /* @__PURE__ */ React25.createElement(
+    resolvedLanguageToggle ? /* @__PURE__ */ React26.createElement(
       LanguageToggle,
       {
         languageToggle: resolvedLanguageToggle,
@@ -3648,13 +3785,13 @@ function CanopyHeader(props = {}) {
         className: "canopy-header__language-toggle canopy-header__language-toggle--mobile"
       }
     ) : null,
-    /* @__PURE__ */ React25.createElement(
+    /* @__PURE__ */ React26.createElement(
       "nav",
       {
         className: "canopy-nav-links canopy-modal__nav",
         "aria-label": primaryNavigationLabel
       },
-      /* @__PURE__ */ React25.createElement("ul", { className: "canopy-modal__nav-list", role: "list" }, navLinks.map((link, index) => {
+      /* @__PURE__ */ React26.createElement("ul", { className: "canopy-modal__nav-list", role: "list" }, navLinks.map((link, index) => {
         const navData = getLinkNavigationData(
           link,
           navigationRoots,
@@ -3674,7 +3811,7 @@ function CanopyHeader(props = {}) {
           { content: toggleLabelTarget }
         );
         const defaultExpanded = hasChildren && !!navRoot.isExpanded;
-        return /* @__PURE__ */ React25.createElement(
+        return /* @__PURE__ */ React26.createElement(
           "li",
           {
             className: "canopy-modal__nav-item",
@@ -3683,7 +3820,7 @@ function CanopyHeader(props = {}) {
             "data-expanded": defaultExpanded ? "true" : "false",
             "data-default-expanded": defaultExpanded ? "true" : void 0
           },
-          /* @__PURE__ */ React25.createElement("div", { className: "canopy-modal__nav-row" }, /* @__PURE__ */ React25.createElement("a", { href: link.href }, link.label || link.href), hasChildren ? /* @__PURE__ */ React25.createElement(
+          /* @__PURE__ */ React26.createElement("div", { className: "canopy-modal__nav-row" }, /* @__PURE__ */ React26.createElement("a", { href: link.href }, link.label || link.href), hasChildren ? /* @__PURE__ */ React26.createElement(
             "button",
             {
               type: "button",
@@ -3693,7 +3830,7 @@ function CanopyHeader(props = {}) {
               "aria-label": toggleLabel,
               "data-canopy-nav-item-toggle": nestedId || void 0
             },
-            /* @__PURE__ */ React25.createElement(
+            /* @__PURE__ */ React26.createElement(
               "svg",
               {
                 xmlns: "http://www.w3.org/2000/svg",
@@ -3703,7 +3840,7 @@ function CanopyHeader(props = {}) {
                 strokeWidth: "1.5",
                 className: "canopy-modal__nav-toggle-icon"
               },
-              /* @__PURE__ */ React25.createElement(
+              /* @__PURE__ */ React26.createElement(
                 "path",
                 {
                   strokeLinecap: "round",
@@ -3712,9 +3849,9 @@ function CanopyHeader(props = {}) {
                 }
               )
             ),
-            /* @__PURE__ */ React25.createElement("span", { className: "sr-only" }, toggleLabel)
+            /* @__PURE__ */ React26.createElement("span", { className: "sr-only" }, toggleLabel)
           ) : null),
-          hasChildren ? /* @__PURE__ */ React25.createElement(
+          hasChildren ? /* @__PURE__ */ React26.createElement(
             NavigationTree,
             {
               root: navRoot,
@@ -3734,7 +3871,7 @@ function CanopyHeader(props = {}) {
         );
       }))
     ),
-    hasSectionNav && !hasIntegratedSectionNav ? /* @__PURE__ */ React25.createElement(
+    hasSectionNav && !hasIntegratedSectionNav ? /* @__PURE__ */ React26.createElement(
       NavigationTree,
       {
         root: sectionNavigation.root,
@@ -3744,7 +3881,7 @@ function CanopyHeader(props = {}) {
         parentKey: "fallback-nav"
       }
     ) : null
-  ), /* @__PURE__ */ React25.createElement(
+  ), /* @__PURE__ */ React26.createElement(
     CanopyModal,
     {
       id: "canopy-modal-search",
@@ -3757,7 +3894,7 @@ function CanopyHeader(props = {}) {
       closeDataAttr: "search",
       bodyClassName: "canopy-modal__body--search"
     },
-    /* @__PURE__ */ React25.createElement(
+    /* @__PURE__ */ React26.createElement(
       SearchPanel,
       {
         label: resolvedSearchLabel,
@@ -3766,18 +3903,18 @@ function CanopyHeader(props = {}) {
         searchPath: normalizedSearchRoute
       }
     )
-  ), /* @__PURE__ */ React25.createElement(HeaderScript, null));
+  ), /* @__PURE__ */ React26.createElement(HeaderScript, null));
 }
 
 // ui/src/layout/CanopyFooter.jsx
-import React26 from "react";
+import React27 from "react";
 function CanopyFooter({ className = "", children }) {
   const footerClassName = ["canopy-footer", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React26.createElement("footer", { className: footerClassName }, /* @__PURE__ */ React26.createElement("div", { className: "canopy-footer__inner" }, children));
+  return /* @__PURE__ */ React27.createElement("footer", { className: footerClassName }, /* @__PURE__ */ React27.createElement("div", { className: "canopy-footer__inner" }, children));
 }
 
 // ui/src/layout/TeaserCard.jsx
-import React27 from "react";
+import React28 from "react";
 function TeaserCard({
   href = "",
   title = "",
@@ -3798,7 +3935,7 @@ function TeaserCard({
   ].filter(Boolean).join(" ");
   const showThumb = type === "work" && thumbnail;
   const metaLine = (Array.isArray(metadata) && metadata.length ? metadata.filter(Boolean) : summary ? [summary] : []).filter(Boolean).slice(0, 2).join(" \u2022 ");
-  return /* @__PURE__ */ React27.createElement(
+  return /* @__PURE__ */ React28.createElement(
     Tag,
     {
       className: classes,
@@ -3806,7 +3943,7 @@ function TeaserCard({
       "data-canopy-item": href ? "" : void 0,
       ...rest
     },
-    showThumb ? /* @__PURE__ */ React27.createElement("div", { className: "canopy-search-teaser__thumb" }, /* @__PURE__ */ React27.createElement(
+    showThumb ? /* @__PURE__ */ React28.createElement("div", { className: "canopy-search-teaser__thumb" }, /* @__PURE__ */ React28.createElement(
       "img",
       {
         src: thumbnail,
@@ -3816,12 +3953,12 @@ function TeaserCard({
         className: "canopy-search-teaser__thumb-img"
       }
     )) : null,
-    /* @__PURE__ */ React27.createElement("div", { className: "canopy-search-teaser__text" }, /* @__PURE__ */ React27.createElement("span", { className: "canopy-search-teaser__title" }, title || href || "Untitled"), metaLine ? /* @__PURE__ */ React27.createElement("span", { className: "canopy-search-teaser__meta" }, metaLine) : null)
+    /* @__PURE__ */ React28.createElement("div", { className: "canopy-search-teaser__text" }, /* @__PURE__ */ React28.createElement("span", { className: "canopy-search-teaser__title" }, title || href || "Untitled"), metaLine ? /* @__PURE__ */ React28.createElement("span", { className: "canopy-search-teaser__meta" }, metaLine) : null)
   );
 }
 
 // ui/src/layout/GoogleAnalytics.jsx
-import React28 from "react";
+import React29 from "react";
 var GA_HOST = "https://www.googletagmanager.com/gtag/js";
 function GoogleAnalytics({ id }) {
   if (!id) return null;
@@ -3831,11 +3968,11 @@ function GoogleAnalytics({ id }) {
     gtag('js', new Date());
     gtag('config', '${id}');
   `;
-  return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement("script", { async: true, src: `${GA_HOST}?id=${encodeURIComponent(id)}` }), /* @__PURE__ */ React28.createElement("script", { dangerouslySetInnerHTML: { __html: inlineConfig } }));
+  return /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement("script", { async: true, src: `${GA_HOST}?id=${encodeURIComponent(id)}` }), /* @__PURE__ */ React29.createElement("script", { dangerouslySetInnerHTML: { __html: inlineConfig } }));
 }
 
 // ui/src/layout/Container.jsx
-import React29 from "react";
+import React30 from "react";
 function Container({
   className = "",
   variant = "content",
@@ -3844,7 +3981,7 @@ function Container({
 }) {
   const variantClass = variant === "wide" ? "max-w-wide" : "max-w-content";
   const classes = ["mx-auto", variantClass, "w-full", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React29.createElement(
+  return /* @__PURE__ */ React30.createElement(
     "div",
     {
       className: classes,
@@ -3856,7 +3993,7 @@ function Container({
 }
 
 // ui/src/layout/Card.jsx
-import React30, { useEffect as useEffect6, useRef as useRef2, useState as useState5 } from "react";
+import React31, { useEffect as useEffect6, useRef as useRef2, useState as useState5 } from "react";
 var DEFAULT_CARD_ASPECT_RATIO = 4 / 3;
 function Card({
   href,
@@ -3920,8 +4057,8 @@ function Card({
   const hasDimensions = Number.isFinite(w) && w > 0 && Number.isFinite(h) && h > 0;
   const ratio = hasAspectRatio ? Number(aspectRatio) : hasDimensions ? w / h : src ? DEFAULT_CARD_ASPECT_RATIO : void 0;
   const paddingPercent = ratio ? 100 / ratio : 100;
-  const caption = /* @__PURE__ */ React30.createElement("figcaption", null, title && /* @__PURE__ */ React30.createElement("span", null, title), subtitle && /* @__PURE__ */ React30.createElement("span", null, subtitle), children);
-  return /* @__PURE__ */ React30.createElement(
+  const caption = /* @__PURE__ */ React31.createElement("figcaption", null, title && /* @__PURE__ */ React31.createElement("span", null, title), subtitle && /* @__PURE__ */ React31.createElement("span", null, subtitle), children);
+  return /* @__PURE__ */ React31.createElement(
     "a",
     {
       href,
@@ -3933,13 +4070,13 @@ function Card({
       "data-image-loaded": imageLoaded ? "true" : "false",
       ...rest
     },
-    /* @__PURE__ */ React30.createElement("figure", null, src ? ratio ? /* @__PURE__ */ React30.createElement(
+    /* @__PURE__ */ React31.createElement("figure", null, src ? ratio ? /* @__PURE__ */ React31.createElement(
       "div",
       {
         className: "canopy-card-media",
         style: { "--canopy-card-padding": `${paddingPercent}%` }
       },
-      inView ? /* @__PURE__ */ React30.createElement(
+      inView ? /* @__PURE__ */ React31.createElement(
         "img",
         {
           src,
@@ -3950,7 +4087,7 @@ function Card({
           onError: () => setImageLoaded(true)
         }
       ) : null
-    ) : /* @__PURE__ */ React30.createElement(
+    ) : /* @__PURE__ */ React31.createElement(
       "img",
       {
         src,
@@ -3966,13 +4103,13 @@ function Card({
 }
 
 // ui/src/content/ReferencedItems.jsx
-import React31 from "react";
-import navigationHelpers4 from "@canopy-iiif/app/lib/components/navigation.js";
+import React32 from "react";
+import navigationHelpers3 from "@canopy-iiif/app/lib/components/navigation.js";
 function useReferencedItems(itemsProp) {
   if (Array.isArray(itemsProp)) return itemsProp;
-  const PageContext2 = navigationHelpers4 && typeof navigationHelpers4.getPageContext === "function" ? navigationHelpers4.getPageContext() : null;
-  if (!PageContext2) return [];
-  const context = React31.useContext(PageContext2);
+  const PageContext3 = navigationHelpers3 && typeof navigationHelpers3.getPageContext === "function" ? navigationHelpers3.getPageContext() : null;
+  if (!PageContext3) return [];
+  const context = React32.useContext(PageContext3);
   const items = context && context.page ? context.page.referencedItems : null;
   return Array.isArray(items) ? items : [];
 }
@@ -3992,13 +4129,13 @@ function ReferencedItems({
       "referenced-items--empty",
       className
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ React31.createElement("div", { className: emptyClass, ...rest }, typeof emptyLabel === "function" ? emptyLabel() : emptyLabel);
+    return /* @__PURE__ */ React32.createElement("div", { className: emptyClass, ...rest }, typeof emptyLabel === "function" ? emptyLabel() : emptyLabel);
   }
   const containerClassName = ["referenced-items", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React31.createElement("section", { className: containerClassName, ...rest }, children, /* @__PURE__ */ React31.createElement("div", { className: "referenced-items__grid", role: "list" }, items.map((item) => {
+  return /* @__PURE__ */ React32.createElement("section", { className: containerClassName, ...rest }, children, /* @__PURE__ */ React32.createElement("div", { className: "referenced-items__grid", role: "list" }, items.map((item) => {
     if (!item) return null;
     const key = item.href || item.slug || item.id;
-    return /* @__PURE__ */ React31.createElement("div", { className: "referenced-items__item", role: "listitem", key }, /* @__PURE__ */ React31.createElement(
+    return /* @__PURE__ */ React32.createElement("div", { className: "referenced-items__item", role: "listitem", key }, /* @__PURE__ */ React32.createElement(
       Card,
       {
         href: item.href,
@@ -4015,15 +4152,15 @@ function ReferencedItems({
 }
 
 // ui/src/content/References.jsx
-import React32 from "react";
-import navigationHelpers5 from "@canopy-iiif/app/lib/components/navigation.js";
+import React33 from "react";
+import navigationHelpers4 from "@canopy-iiif/app/lib/components/navigation.js";
 import referenced from "@canopy-iiif/app/lib/components/referenced.js";
 function getPageContext() {
-  if (!navigationHelpers5 || typeof navigationHelpers5.getPageContext !== "function") {
+  if (!navigationHelpers4 || typeof navigationHelpers4.getPageContext !== "function") {
     return null;
   }
   try {
-    return navigationHelpers5.getPageContext();
+    return navigationHelpers4.getPageContext();
   } catch (_) {
     return null;
   }
@@ -4047,8 +4184,8 @@ function References({
 }) {
   const { getString } = useLocale();
   const resolvedTitle = title != null ? title : getString("common.misc.referenced_by", "Referenced by");
-  const PageContext2 = getPageContext();
-  const context = PageContext2 ? React32.useContext(PageContext2) : null;
+  const PageContext3 = getPageContext();
+  const context = PageContext3 ? React33.useContext(PageContext3) : null;
   const contextPage = context && context.page ? context.page : null;
   const manifestId = id || contextPage && contextPage.manifestId || "";
   const contextReferences = !id && contextPage && Array.isArray(contextPage.referencedBy) ? contextPage.referencedBy : null;
@@ -4057,12 +4194,12 @@ function References({
   const entries = references && references.length ? references : null;
   if (!entries || !entries.length) return null;
   const containerClass = ["references", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React32.createElement("dl", { className: containerClass, ...rest }, /* @__PURE__ */ React32.createElement("div", { className: "references__group" }, /* @__PURE__ */ React32.createElement("dt", null, resolvedTitle), entries.map((entry) => /* @__PURE__ */ React32.createElement("dd", { key: entry.href, className: "references__item" }, /* @__PURE__ */ React32.createElement("a", { href: entry.href }, entry.title || entry.href)))));
+  return /* @__PURE__ */ React33.createElement("dl", { className: containerClass, ...rest }, /* @__PURE__ */ React33.createElement("div", { className: "references__group" }, /* @__PURE__ */ React33.createElement("dt", null, resolvedTitle), entries.map((entry) => /* @__PURE__ */ React33.createElement("dd", { key: entry.href, className: "references__item" }, /* @__PURE__ */ React33.createElement("a", { href: entry.href }, entry.title || entry.href)))));
 }
 
 // ui/src/content/Index.jsx
 var import_slugify = __toESM(require_slugify());
-import React33 from "react";
+import React34 from "react";
 import metadataIndexHelpers from "@canopy-iiif/app/lib/components/metadata-index.js";
 var metadataModule = metadataIndexHelpers && typeof metadataIndexHelpers === "object" ? metadataIndexHelpers : null;
 var SLUG_OPTIONS = { lower: true, strict: true, trim: true };
@@ -4225,7 +4362,7 @@ function Index({
   const entries = filterByLabel(data, label);
   if (!entries.length) return null;
   const containerClass = ["canopy-index", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React33.createElement("div", { className: containerClass, ...rest }, entries.map((entry) => /* @__PURE__ */ React33.createElement(
+  return /* @__PURE__ */ React34.createElement("div", { className: containerClass, ...rest }, entries.map((entry) => /* @__PURE__ */ React34.createElement(
     IndexGroup,
     {
       key: entry.slug || entry.label,
@@ -4236,7 +4373,7 @@ function Index({
       expandLabel,
       collapseLabel
     }
-  )), /* @__PURE__ */ React33.createElement(
+  )), /* @__PURE__ */ React34.createElement(
     "script",
     {
       "data-canopy-index-script": "",
@@ -4253,10 +4390,10 @@ function IndexGroup({ label, labelSlug, values, limit, expandLabel, collapseLabe
   const hiddenValues = hasOverflow ? values.slice(maxVisible) : [];
   const labelCollapsed = typeof expandLabel === "string" && expandLabel.trim() ? expandLabel.trim() : "Show more";
   const labelExpanded = typeof collapseLabel === "string" && collapseLabel.trim() ? collapseLabel.trim() : "Show less";
-  return /* @__PURE__ */ React33.createElement("dl", { className: "canopy-index__group", "data-canopy-index-group": "", "data-expanded": "0" }, /* @__PURE__ */ React33.createElement("dt", null, label), /* @__PURE__ */ React33.createElement("div", { className: "canopy-index__values" }, visibleValues.map((value) => {
+  return /* @__PURE__ */ React34.createElement("dl", { className: "canopy-index__group", "data-canopy-index-group": "", "data-expanded": "0" }, /* @__PURE__ */ React34.createElement("dt", null, label), /* @__PURE__ */ React34.createElement("div", { className: "canopy-index__values" }, visibleValues.map((value) => {
     const href = buildSearchHref(labelSlug, value.slug);
     const key = `${labelSlug || label}-${value.slug || value.value}`;
-    return /* @__PURE__ */ React33.createElement("dd", { key }, href ? /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React34.createElement("dd", { key }, href ? /* @__PURE__ */ React34.createElement(
       "a",
       {
         href,
@@ -4269,7 +4406,7 @@ function IndexGroup({ label, labelSlug, values, limit, expandLabel, collapseLabe
   }), hiddenValues.map((value) => {
     const href = buildSearchHref(labelSlug, value.slug);
     const key = `${labelSlug || label}-hidden-${value.slug || value.value}`;
-    return /* @__PURE__ */ React33.createElement("dd", { key, "data-canopy-index-hidden": "", hidden: true }, href ? /* @__PURE__ */ React33.createElement(
+    return /* @__PURE__ */ React34.createElement("dd", { key, "data-canopy-index-hidden": "", hidden: true }, href ? /* @__PURE__ */ React34.createElement(
       "a",
       {
         href,
@@ -4279,7 +4416,7 @@ function IndexGroup({ label, labelSlug, values, limit, expandLabel, collapseLabe
       },
       value.value
     ) : value.value);
-  })), hasOverflow && /* @__PURE__ */ React33.createElement("div", { className: "canopy-index__more-wrapper" }, /* @__PURE__ */ React33.createElement(
+  })), hasOverflow && /* @__PURE__ */ React34.createElement("div", { className: "canopy-index__more-wrapper" }, /* @__PURE__ */ React34.createElement(
     "button",
     {
       type: "button",
@@ -4293,7 +4430,7 @@ function IndexGroup({ label, labelSlug, values, limit, expandLabel, collapseLabe
 }
 
 // ui/src/content/Bibliography.jsx
-import React34 from "react";
+import React35 from "react";
 import bibliography from "@canopy-iiif/app/lib/components/bibliography.js";
 function resolveHeadingTag(tag, fallback) {
   if (typeof tag === "string" && tag.trim()) return tag;
@@ -4303,7 +4440,7 @@ function resolveHeadingTag(tag, fallback) {
 function NoteBody({ note }) {
   if (!note) return null;
   if (note.html) {
-    return /* @__PURE__ */ React34.createElement(
+    return /* @__PURE__ */ React35.createElement(
       "div",
       {
         className: "bibliography__note-body",
@@ -4312,7 +4449,7 @@ function NoteBody({ note }) {
     );
   }
   if (note.text) {
-    return /* @__PURE__ */ React34.createElement("div", { className: "bibliography__note-body" }, note.text);
+    return /* @__PURE__ */ React35.createElement("div", { className: "bibliography__note-body" }, note.text);
   }
   return null;
 }
@@ -4330,22 +4467,22 @@ function Bibliography({
   if (!entries.length) return null;
   const PageHeadingTag = resolveHeadingTag(pageHeadingTag, "h3");
   const rootClass = ["bibliography", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React34.createElement("section", { className: rootClass }, /* @__PURE__ */ React34.createElement("div", { className: "bibliography__pages" }, entries.map((entry) => {
+  return /* @__PURE__ */ React35.createElement("section", { className: rootClass }, /* @__PURE__ */ React35.createElement("div", { className: "bibliography__pages" }, entries.map((entry) => {
     const key = entry.href || entry.relativePath || entry.title;
     const pageTitle = entry.title || entry.href;
-    return /* @__PURE__ */ React34.createElement("article", { key, className: "bibliography__page" }, /* @__PURE__ */ React34.createElement("header", { className: "bibliography__page-header" }, pageTitle ? /* @__PURE__ */ React34.createElement(PageHeadingTag, { className: "bibliography__page-title" }, pageTitle) : null, entry.href ? /* @__PURE__ */ React34.createElement("a", { className: "bibliography__page-link", href: entry.href }, entry.href) : null), /* @__PURE__ */ React34.createElement("ol", { className: "bibliography__notes" }, (entry.footnotes || []).map((note, idx) => {
+    return /* @__PURE__ */ React35.createElement("article", { key, className: "bibliography__page" }, /* @__PURE__ */ React35.createElement("header", { className: "bibliography__page-header" }, pageTitle ? /* @__PURE__ */ React35.createElement(PageHeadingTag, { className: "bibliography__page-title" }, pageTitle) : null, entry.href ? /* @__PURE__ */ React35.createElement("a", { className: "bibliography__page-link", href: entry.href }, entry.href) : null), /* @__PURE__ */ React35.createElement("ol", { className: "bibliography__notes" }, (entry.footnotes || []).map((note, idx) => {
       const noteKey = `${key || "entry"}-${note.identifier || idx}`;
-      return /* @__PURE__ */ React34.createElement("li", { key: noteKey, className: "bibliography__note" }, note.identifier ? /* @__PURE__ */ React34.createElement("span", { className: "bibliography__note-label" }, note.identifier) : null, /* @__PURE__ */ React34.createElement(NoteBody, { note }));
+      return /* @__PURE__ */ React35.createElement("li", { key: noteKey, className: "bibliography__note" }, note.identifier ? /* @__PURE__ */ React35.createElement("span", { className: "bibliography__note-label" }, note.identifier) : null, /* @__PURE__ */ React35.createElement(NoteBody, { note }));
     })));
   })));
 }
 
 // ui/src/content/timeline/MdxTimeline.jsx
-import React38 from "react";
+import React39 from "react";
 import ReactDOMServer from "react-dom/server";
 
 // ui/src/content/timeline/Timeline.jsx
-import React36 from "react";
+import React37 from "react";
 
 // ui/src/content/timeline/date-utils.js
 var FALLBACK_LOCALE = (() => {
@@ -4506,7 +4643,7 @@ function clampProgress(value) {
 }
 
 // ui/src/layout/ReferencedManifestCard.jsx
-import React35 from "react";
+import React36 from "react";
 function normalizeMetadata(metadata, summary) {
   if (Array.isArray(metadata) && metadata.length) {
     return metadata.filter(Boolean);
@@ -4540,7 +4677,7 @@ function ReferencedManifestCard({
     "canopy-referenced-manifest-card",
     className
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React35.createElement(
+  return /* @__PURE__ */ React36.createElement(
     TeaserCard,
     {
       href: resolvedHref || void 0,
@@ -4722,14 +4859,14 @@ function TimelineConnector({ side, isActive, highlight }) {
     "canopy-timeline__connector-dot",
     highlight || isActive ? "is-active" : ""
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React36.createElement("span", { className: connectorClasses, "aria-hidden": "true" }, side === "left" ? /* @__PURE__ */ React36.createElement(React36.Fragment, null, /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__connector-line" }), /* @__PURE__ */ React36.createElement("span", { className: dotClasses })) : /* @__PURE__ */ React36.createElement(React36.Fragment, null, /* @__PURE__ */ React36.createElement("span", { className: dotClasses }), /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__connector-line" })));
+  return /* @__PURE__ */ React37.createElement("span", { className: connectorClasses, "aria-hidden": "true" }, side === "left" ? /* @__PURE__ */ React37.createElement(React37.Fragment, null, /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__connector-line" }), /* @__PURE__ */ React37.createElement("span", { className: dotClasses })) : /* @__PURE__ */ React37.createElement(React37.Fragment, null, /* @__PURE__ */ React37.createElement("span", { className: dotClasses }), /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__connector-line" })));
 }
 function renderResourceSection(point) {
   if (!point) return null;
   const manifestCards = Array.isArray(point.manifests) ? point.manifests.filter(Boolean) : [];
   const legacyResources = Array.isArray(point.resources) ? point.resources.filter(Boolean) : [];
   if (!manifestCards.length && !legacyResources.length) return null;
-  return /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__resources" }, /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__resources-list" }, manifestCards.map((manifest) => /* @__PURE__ */ React36.createElement("div", { key: manifest.id || manifest.href }, /* @__PURE__ */ React36.createElement(ReferencedManifestCard, { manifest }))), legacyResources.map((resource, idx) => /* @__PURE__ */ React36.createElement("div", { key: resource.id || resource.href || `legacy-${idx}` }, /* @__PURE__ */ React36.createElement(
+  return /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__resources" }, /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__resources-list" }, manifestCards.map((manifest) => /* @__PURE__ */ React37.createElement("div", { key: manifest.id || manifest.href }, /* @__PURE__ */ React37.createElement(ReferencedManifestCard, { manifest }))), legacyResources.map((resource, idx) => /* @__PURE__ */ React37.createElement("div", { key: resource.id || resource.href || `legacy-${idx}` }, /* @__PURE__ */ React37.createElement(
     TeaserCard,
     {
       href: resource.href,
@@ -4754,26 +4891,26 @@ function Timeline({
   ...rest
 }) {
   const payloadPoints = payload && Array.isArray(payload.points) ? payload.points : null;
-  const rawPoints = React36.useMemo(() => {
+  const rawPoints = React37.useMemo(() => {
     if (Array.isArray(pointsProp) && pointsProp.length) return pointsProp;
     if (payloadPoints && payloadPoints.length) return payloadPoints;
     return [];
   }, [pointsProp, payloadPoints]);
-  const sanitizedPoints = React36.useMemo(
+  const sanitizedPoints = React37.useMemo(
     () => sanitizePoints(rawPoints),
     [rawPoints]
   );
   const localeValue = payload && payload.locale ? payload.locale : localeProp;
-  const baseLocale = React36.useMemo(
+  const baseLocale = React37.useMemo(
     () => createLocale(localeValue),
     [localeValue]
   );
   const rangeInput = payload && payload.range ? payload.range : rangeProp || {};
-  const rangeOverrides = React36.useMemo(
+  const rangeOverrides = React37.useMemo(
     () => deriveRangeOverrides(sanitizedPoints, rangeInput),
     [sanitizedPoints, rangeInput]
   );
-  const effectiveRange = React36.useMemo(
+  const effectiveRange = React37.useMemo(
     () => normalizeRange({
       ...rangeOverrides,
       locale: baseLocale
@@ -4782,7 +4919,7 @@ function Timeline({
   );
   const spanStart = effectiveRange.startDate.getTime();
   const span = effectiveRange.span;
-  const pointsWithPosition = React36.useMemo(() => {
+  const pointsWithPosition = React37.useMemo(() => {
     if (!sanitizedPoints.length) return [];
     return sanitizedPoints.map((point, index) => {
       const timestamp = point.meta.timestamp;
@@ -4796,29 +4933,29 @@ function Timeline({
       };
     });
   }, [sanitizedPoints, spanStart, span]);
-  const [activeId, setActiveId] = React36.useState(
+  const [activeId, setActiveId] = React37.useState(
     () => getActivePointId(pointsWithPosition)
   );
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     setActiveId(getActivePointId(pointsWithPosition));
   }, [pointsWithPosition]);
   const thresholdValue = typeof thresholdProp === "number" ? thresholdProp : payload && payload.threshold != null ? payload.threshold : null;
   const stepsValue = typeof steps === "number" ? Number(steps) : payload && typeof payload.steps === "number" ? Number(payload.steps) : null;
-  const thresholdMs = React36.useMemo(
+  const thresholdMs = React37.useMemo(
     () => getThresholdMs(thresholdValue, effectiveRange.granularity),
     [thresholdValue, effectiveRange.granularity]
   );
-  const groupedEntries = React36.useMemo(
+  const groupedEntries = React37.useMemo(
     () => buildGroupedEntries(pointsWithPosition, thresholdMs, {
       granularity: effectiveRange.granularity,
       locale: baseLocale
     }),
     [pointsWithPosition, thresholdMs, effectiveRange.granularity, baseLocale]
   );
-  const [expandedGroupIds, setExpandedGroupIds] = React36.useState(
+  const [expandedGroupIds, setExpandedGroupIds] = React37.useState(
     () => /* @__PURE__ */ new Set()
   );
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     setExpandedGroupIds((prev) => {
       if (!prev || prev.size === 0) return prev;
       const validIds = new Set(
@@ -4833,7 +4970,7 @@ function Timeline({
       return changed ? next : prev;
     });
   }, [groupedEntries]);
-  const toggleGroup = React36.useCallback((groupId) => {
+  const toggleGroup = React37.useCallback((groupId) => {
     setExpandedGroupIds((prev) => {
       const next = new Set(prev || []);
       if (next.has(groupId)) next.delete(groupId);
@@ -4856,7 +4993,7 @@ function Timeline({
       point.id === activeId ? "is-active" : "",
       point.highlight ? "is-highlighted" : ""
     ].filter(Boolean).join(" ");
-    const connector = /* @__PURE__ */ React36.createElement(
+    const connector = /* @__PURE__ */ React37.createElement(
       TimelineConnector,
       {
         side: point.side,
@@ -4864,9 +5001,9 @@ function Timeline({
         highlight: point.highlight
       }
     );
-    const body = /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__point-body" }, /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__point-date" }, point.meta.label), /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__point-title" }, point.title), point.summary ? /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__point-summary" }, point.summary) : null);
+    const body = /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__point-body" }, /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__point-date" }, point.meta.label), /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__point-title" }, point.title), point.summary ? /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__point-summary" }, point.summary) : null);
     const resourceSection = renderResourceSection(point);
-    return /* @__PURE__ */ React36.createElement(
+    return /* @__PURE__ */ React37.createElement(
       "div",
       {
         key: point.id,
@@ -4874,7 +5011,7 @@ function Timeline({
         style: wrapperStyle,
         role: "listitem"
       },
-      point.side === "left" ? /* @__PURE__ */ React36.createElement(React36.Fragment, null, /* @__PURE__ */ React36.createElement("div", { className: cardClasses }, body, resourceSection), connector) : /* @__PURE__ */ React36.createElement(React36.Fragment, null, connector, /* @__PURE__ */ React36.createElement("div", { className: cardClasses }, body, resourceSection))
+      point.side === "left" ? /* @__PURE__ */ React37.createElement(React37.Fragment, null, /* @__PURE__ */ React37.createElement("div", { className: cardClasses }, body, resourceSection), connector) : /* @__PURE__ */ React37.createElement(React37.Fragment, null, connector, /* @__PURE__ */ React37.createElement("div", { className: cardClasses }, body, resourceSection))
     );
   }
   function renderGroupEntry(entry) {
@@ -4885,7 +5022,7 @@ function Timeline({
     const wrapperStyle = { top: `${entry.progress * 100}%` };
     const isExpanded = expandedGroupIds.has(entry.id);
     const hasActivePoint = entry.points.some((point) => point.id === activeId);
-    const connector = /* @__PURE__ */ React36.createElement(
+    const connector = /* @__PURE__ */ React37.createElement(
       TimelineConnector,
       {
         side: entry.side,
@@ -4899,7 +5036,7 @@ function Timeline({
       hasActivePoint ? "is-active" : ""
     ].filter(Boolean).join(" ");
     const countLabel = `${entry.count} event${entry.count > 1 ? "s" : ""}`;
-    const header = /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__group-header" }, /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__group-summary" }, /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__point-date" }, entry.label), /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__group-count" }, countLabel)), /* @__PURE__ */ React36.createElement(
+    const header = /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__group-header" }, /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__group-summary" }, /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__point-date" }, entry.label), /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__group-count" }, countLabel)), /* @__PURE__ */ React37.createElement(
       "button",
       {
         type: "button",
@@ -4909,7 +5046,7 @@ function Timeline({
       },
       isExpanded ? "Hide details" : "Show details"
     ));
-    const groupPoints = isExpanded ? /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__group-points" }, entry.points.map((point) => /* @__PURE__ */ React36.createElement(
+    const groupPoints = isExpanded ? /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__group-points" }, entry.points.map((point) => /* @__PURE__ */ React37.createElement(
       "button",
       {
         key: point.id,
@@ -4920,11 +5057,11 @@ function Timeline({
         ].filter(Boolean).join(" "),
         onClick: () => setActiveId(point.id)
       },
-      /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__point-date" }, point.meta.label),
-      /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__group-point-title" }, point.title)
+      /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__point-date" }, point.meta.label),
+      /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__group-point-title" }, point.title)
     ))) : null;
-    const groupCard = /* @__PURE__ */ React36.createElement("div", { className: groupClasses }, header, groupPoints);
-    return /* @__PURE__ */ React36.createElement(
+    const groupCard = /* @__PURE__ */ React37.createElement("div", { className: groupClasses }, header, groupPoints);
+    return /* @__PURE__ */ React37.createElement(
       "div",
       {
         key: entry.id,
@@ -4932,17 +5069,17 @@ function Timeline({
         style: wrapperStyle,
         role: "listitem"
       },
-      entry.side === "left" ? /* @__PURE__ */ React36.createElement(React36.Fragment, null, groupCard, connector) : /* @__PURE__ */ React36.createElement(React36.Fragment, null, connector, groupCard)
+      entry.side === "left" ? /* @__PURE__ */ React37.createElement(React37.Fragment, null, groupCard, connector) : /* @__PURE__ */ React37.createElement(React37.Fragment, null, connector, groupCard)
     );
   }
-  return /* @__PURE__ */ React36.createElement("section", { className: containerClasses, ...rest }, title ? /* @__PURE__ */ React36.createElement("h2", { className: "canopy-timeline__title" }, title) : null, description ? /* @__PURE__ */ React36.createElement("p", { className: "canopy-timeline__description" }, description) : null, rangeLabel ? /* @__PURE__ */ React36.createElement("p", { className: "canopy-timeline__range", "aria-live": "polite" }, rangeLabel) : null, /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__body" }, /* @__PURE__ */ React36.createElement(
+  return /* @__PURE__ */ React37.createElement("section", { className: containerClasses, ...rest }, title ? /* @__PURE__ */ React37.createElement("h2", { className: "canopy-timeline__title" }, title) : null, description ? /* @__PURE__ */ React37.createElement("p", { className: "canopy-timeline__description" }, description) : null, rangeLabel ? /* @__PURE__ */ React37.createElement("p", { className: "canopy-timeline__range", "aria-live": "polite" }, rangeLabel) : null, /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__body" }, /* @__PURE__ */ React37.createElement(
     "div",
     {
       className: "canopy-timeline__list",
       role: "list",
       style: { minHeight: trackHeight }
     },
-    /* @__PURE__ */ React36.createElement("div", { className: "canopy-timeline__spine", "aria-hidden": "true" }),
+    /* @__PURE__ */ React37.createElement("div", { className: "canopy-timeline__spine", "aria-hidden": "true" }),
     renderSteps(stepsValue, effectiveRange),
     groupedEntries.map((entry) => {
       if (entry.type === "group") return renderGroupEntry(entry);
@@ -4957,7 +5094,7 @@ function renderSteps(stepSize, range) {
   const markers = [];
   if (startYear < endYear) {
     markers.push(
-      /* @__PURE__ */ React36.createElement(
+      /* @__PURE__ */ React37.createElement(
         "span",
         {
           key: "timeline-step-start",
@@ -4965,12 +5102,12 @@ function renderSteps(stepSize, range) {
           style: { top: "0%" },
           "aria-hidden": "true"
         },
-        /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__step-line" }),
-        /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__step-label" }, startYear)
+        /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__step-line" }),
+        /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__step-label" }, startYear)
       )
     );
     markers.push(
-      /* @__PURE__ */ React36.createElement(
+      /* @__PURE__ */ React37.createElement(
         "span",
         {
           key: "timeline-step-end",
@@ -4978,8 +5115,8 @@ function renderSteps(stepSize, range) {
           style: { top: "100%" },
           "aria-hidden": "true"
         },
-        /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__step-line" }),
-        /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__step-label" }, endYear)
+        /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__step-line" }),
+        /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__step-label" }, endYear)
       )
     );
   }
@@ -4989,7 +5126,7 @@ function renderSteps(stepSize, range) {
     const progress = (timestamp - range.startDate.getTime()) / range.span;
     if (progress <= 0 || progress >= 1) continue;
     markers.push(
-      /* @__PURE__ */ React36.createElement(
+      /* @__PURE__ */ React37.createElement(
         "span",
         {
           key: `timeline-step-${year}`,
@@ -4997,8 +5134,8 @@ function renderSteps(stepSize, range) {
           style: { top: `calc(${progress * 100}% - 0.5px)` },
           "aria-hidden": "true"
         },
-        /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__step-line" }),
-        /* @__PURE__ */ React36.createElement("span", { className: "canopy-timeline__step-label" }, year)
+        /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__step-line" }),
+        /* @__PURE__ */ React37.createElement("span", { className: "canopy-timeline__step-label" }, year)
       )
     );
   }
@@ -5012,7 +5149,7 @@ function TimelinePoint() {
 TimelinePoint.displayName = "TimelinePoint";
 
 // ui/src/utils/manifestReferences.js
-import React37 from "react";
+import React38 from "react";
 var CONTEXT_KEY2 = typeof Symbol === "function" ? Symbol.for("__CANOPY_PAGE_CONTEXT__") : "__CANOPY_PAGE_CONTEXT__";
 function getGlobalRoot() {
   if (typeof globalThis !== "undefined") return globalThis;
@@ -5023,7 +5160,7 @@ function getGlobalRoot() {
 function getPageContext2() {
   const root = getGlobalRoot();
   if (root && root[CONTEXT_KEY2]) return root[CONTEXT_KEY2];
-  const ctx = React37.createContext({
+  const ctx = React38.createContext({
     navigation: null,
     page: null,
     site: null,
@@ -5047,7 +5184,7 @@ function normalizeManifestId(raw) {
     return String(raw || "").trim();
   }
 }
-var PageContextFallback = React37.createContext(null);
+var PageContextFallback = React38.createContext(null);
 var referencedModule = null;
 var REFERENCED_SPEC = "@canopy-iiif/app/lib/components/referenced.js";
 function getReferencedModule() {
@@ -5072,10 +5209,10 @@ function getReferencedModule() {
   return referencedModule;
 }
 function useReferencedManifestMap() {
-  const PageContext2 = getPageContext2() || PageContextFallback;
-  const pageContext = React37.useContext(PageContext2);
+  const PageContext3 = getPageContext2() || PageContextFallback;
+  const pageContext = React38.useContext(PageContext3);
   const referencedItems = pageContext && pageContext.page && Array.isArray(pageContext.page.referencedItems) ? pageContext.page.referencedItems : [];
-  return React37.useMemo(() => {
+  return React38.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     referencedItems.forEach((item) => {
       if (!item) return;
@@ -5186,7 +5323,7 @@ function normalizeResource(resource, index) {
 }
 function normalizePoint(child, index, options) {
   var _a, _b, _c, _d, _e, _f;
-  if (!React38.isValidElement(child)) return null;
+  if (!React39.isValidElement(child)) return null;
   if (child.type !== TimelinePoint && ((_a = child.type) == null ? void 0 : _a.displayName) !== "TimelinePoint")
     return null;
   const props = child.props || {};
@@ -5202,7 +5339,7 @@ function normalizePoint(child, index, options) {
   try {
     if (props.children) {
       detailsHtml = ReactDOMServer.renderToStaticMarkup(
-        React38.createElement(React38.Fragment, null, props.children)
+        React39.createElement(React39.Fragment, null, props.children)
       );
     }
   } catch (_) {
@@ -5251,7 +5388,7 @@ function MdxTimeline({ children, ...rest }) {
   const localeObj = createLocale(localeValue);
   const localeBase = typeof localeObj === "string" ? localeObj : localeObj.baseName || "en-US";
   const manifestMap = useReferencedManifestMap();
-  const childArray = React38.Children.toArray(children);
+  const childArray = React39.Children.toArray(children);
   const points = childArray.map(
     (child, index) => normalizePoint(child, index, {
       range: rest.range || {},
@@ -5267,7 +5404,7 @@ function MdxTimeline({ children, ...rest }) {
     steps: rest.steps != null ? rest.steps : null
   };
   const json = serializeForScript(serializeProps(rest, payload, localeBase));
-  return /* @__PURE__ */ React38.createElement("div", { "data-canopy-timeline": "1" }, /* @__PURE__ */ React38.createElement(Timeline, { ...rest, __canopyTimeline: payload }), /* @__PURE__ */ React38.createElement(
+  return /* @__PURE__ */ React39.createElement("div", { "data-canopy-timeline": "1" }, /* @__PURE__ */ React39.createElement(Timeline, { ...rest, __canopyTimeline: payload }), /* @__PURE__ */ React39.createElement(
     "script",
     {
       type: "application/json",
@@ -5277,7 +5414,7 @@ function MdxTimeline({ children, ...rest }) {
 }
 
 // ui/src/content/map/MdxMap.jsx
-import React39 from "react";
+import React40 from "react";
 import ReactDOMServer2 from "react-dom/server";
 
 // ui/src/content/map/MapPoint.jsx
@@ -5312,7 +5449,7 @@ function renderDetailsHtml(children) {
   if (!children) return "";
   try {
     return ReactDOMServer2.renderToStaticMarkup(
-      React39.createElement(React39.Fragment, null, children)
+      React40.createElement(React40.Fragment, null, children)
     );
   } catch (_) {
     return "";
@@ -5345,7 +5482,7 @@ function pickManifestSummary(manifest) {
 }
 function normalizeCustomPoint(child, index, manifestMap) {
   var _a;
-  if (!React39.isValidElement(child)) return null;
+  if (!React40.isValidElement(child)) return null;
   if (child.type !== MapPoint && ((_a = child.type) == null ? void 0 : _a.displayName) !== "MapPoint") return null;
   const coords = normalizeCoordinates(child.props || {});
   if (!coords) return null;
@@ -5408,7 +5545,7 @@ function normalizeCustomPoint(child, index, manifestMap) {
   };
 }
 function normalizeCustomPoints(children, manifestMap) {
-  return React39.Children.toArray(children).map((child, index) => normalizeCustomPoint(child, index, manifestMap)).filter(Boolean);
+  return React40.Children.toArray(children).map((child, index) => normalizeCustomPoint(child, index, manifestMap)).filter(Boolean);
 }
 function normalizeHeight(value) {
   if (value == null) return "600px";
@@ -5585,11 +5722,11 @@ function MdxMap({ children, ...rest }) {
   if (placeholderClass) placeholderProps.className = placeholderClass;
   if (rest.id) placeholderProps.id = rest.id;
   if (rest.style) placeholderProps.style = rest.style;
-  return /* @__PURE__ */ React39.createElement("div", { "data-canopy-map": "1" }, /* @__PURE__ */ React39.createElement("div", { ...placeholderProps, "aria-live": "polite" }, /* @__PURE__ */ React39.createElement("div", { className: "canopy-map__status" }, "Loading map\u2026")), /* @__PURE__ */ React39.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
+  return /* @__PURE__ */ React40.createElement("div", { "data-canopy-map": "1" }, /* @__PURE__ */ React40.createElement("div", { ...placeholderProps, "aria-live": "polite" }, /* @__PURE__ */ React40.createElement("div", { className: "canopy-map__status" }, "Loading map\u2026")), /* @__PURE__ */ React40.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
 }
 
 // ui/src/content/gallery/Gallery.jsx
-import React40 from "react";
+import React41 from "react";
 var INLINE_SCRIPT2 = `(() => {
   if (typeof window === 'undefined') return;
   if (window.__canopyGalleryBound) return;
@@ -5606,6 +5743,23 @@ var INLINE_SCRIPT2 = `(() => {
   const NAV_OPTION_SELECTOR = '[data-canopy-gallery-nav-option]';
   const NAV_ITEM_SELECTOR = '[data-canopy-gallery-nav-item]';
 
+  function emitModalState(modal, state) {
+    if (!modal || typeof window === 'undefined') return;
+    const detail = { modalId: modal.id || '', modal, state };
+    try {
+      const EventCtor = window.CustomEvent || CustomEvent;
+      if (typeof EventCtor === 'function') {
+        window.dispatchEvent(new EventCtor('canopy:gallery:modal-change', { detail }));
+        return;
+      }
+    } catch (_) {}
+    try {
+      const fallback = document.createEvent('CustomEvent');
+      fallback.initCustomEvent('canopy:gallery:modal-change', true, true, detail);
+      window.dispatchEvent(fallback);
+    } catch (_) {}
+  }
+
   function isVisible(node) {
     return !!(node && (node.offsetWidth || node.offsetHeight || node.getClientRects().length));
   }
@@ -5736,6 +5890,7 @@ var INLINE_SCRIPT2 = `(() => {
         lockScroll();
         document.addEventListener('keydown', handleKeydown, true);
       } else if (activeModal !== modal) {
+        emitModalState(activeModal, 'close');
         activeModal.removeAttribute('data-canopy-gallery-active');
       }
       activeModal = modal;
@@ -5744,6 +5899,7 @@ var INLINE_SCRIPT2 = `(() => {
       if (!focusActiveNav(modal)) {
         focusInitial(modal);
       }
+      emitModalState(modal, 'open');
       return;
     }
     if (!activeModal) return;
@@ -5777,6 +5933,7 @@ var INLINE_SCRIPT2 = `(() => {
         }
       });
     }
+    emitModalState(previous, 'close');
   }
 
   function modalFromHash() {
@@ -6100,7 +6257,7 @@ function shuffleItems(list) {
 function renderMetaList(meta, className) {
   const entries = ensureArray2(meta).filter((entry) => entry || entry === 0);
   if (!entries.length) return null;
-  return /* @__PURE__ */ React40.createElement("ul", { className, role: "list" }, entries.map((entry, index) => /* @__PURE__ */ React40.createElement("li", { key: `meta-${index}` }, entry)));
+  return /* @__PURE__ */ React41.createElement("ul", { className, role: "list" }, entries.map((entry, index) => /* @__PURE__ */ React41.createElement("li", { key: `meta-${index}` }, entry)));
 }
 function renderPreview(props = {}) {
   const source = typeof props.media === "string" && props.media || props.thumbnail || props.src || props.image && props.image.src || props.image;
@@ -6108,7 +6265,7 @@ function renderPreview(props = {}) {
     const alt = props.thumbnailAlt || props.imageAlt || props.alt || props.title || "";
     const width = props.thumbnailWidth || props.imageWidth || props.width;
     const height = props.thumbnailHeight || props.imageHeight || props.height;
-    return /* @__PURE__ */ React40.createElement(
+    return /* @__PURE__ */ React41.createElement(
       "img",
       {
         src: source,
@@ -6119,7 +6276,7 @@ function renderPreview(props = {}) {
       }
     );
   }
-  return /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__placeholder", "aria-hidden": "true" });
+  return /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__placeholder", "aria-hidden": "true" });
 }
 function renderFlexibleContent(content, options = {}) {
   var _a, _b;
@@ -6132,25 +6289,25 @@ function renderFlexibleContent(content, options = {}) {
   if (content == null || content === false) return null;
   const isPrimitive = typeof content === "string" || typeof content === "number" || typeof content === "bigint";
   if (isPrimitive) {
-    return /* @__PURE__ */ React40.createElement(InlineTag, { className, id }, content);
+    return /* @__PURE__ */ React41.createElement(InlineTag, { className, id }, content);
   }
-  if (React40.isValidElement(content)) {
-    if (content.type === React40.Fragment) {
-      return /* @__PURE__ */ React40.createElement(BlockTag, { className, id }, content);
+  if (React41.isValidElement(content)) {
+    if (content.type === React41.Fragment) {
+      return /* @__PURE__ */ React41.createElement(BlockTag, { className, id }, content);
     }
     const mergedClassName = [(_a = content.props) == null ? void 0 : _a.className, className].filter(Boolean).join(" ");
-    return React40.cloneElement(content, {
+    return React41.cloneElement(content, {
       ...content.props,
       className: mergedClassName || void 0,
       id: ((_b = content.props) == null ? void 0 : _b.id) || id
     });
   }
   const FallbackTag = BlockTag;
-  return /* @__PURE__ */ React40.createElement(FallbackTag, { className, id }, content);
+  return /* @__PURE__ */ React41.createElement(FallbackTag, { className, id }, content);
 }
 function normalizeItem(child, index, galleryId, manifestMap) {
   var _a;
-  if (!React40.isValidElement(child)) return null;
+  if (!React41.isValidElement(child)) return null;
   if (child.type !== GalleryItem && ((_a = child.type) == null ? void 0 : _a.displayName) !== "GalleryItem")
     return null;
   const props = child.props || {};
@@ -6225,7 +6382,7 @@ function buildCaptionContent(itemProps) {
   if (itemProps.caption) return itemProps.caption;
   const kicker = itemProps.kicker || itemProps.label || itemProps.eyebrow;
   const summary = itemProps.summary || itemProps.description;
-  return /* @__PURE__ */ React40.createElement(React40.Fragment, null, kicker ? /* @__PURE__ */ React40.createElement("span", { className: "canopy-gallery__kicker" }, kicker) : null, itemProps.title ? /* @__PURE__ */ React40.createElement("span", { className: "canopy-gallery__title-text" }, itemProps.title) : null, renderFlexibleContent(summary, {
+  return /* @__PURE__ */ React41.createElement(React41.Fragment, null, kicker ? /* @__PURE__ */ React41.createElement("span", { className: "canopy-gallery__kicker" }, kicker) : null, itemProps.title ? /* @__PURE__ */ React41.createElement("span", { className: "canopy-gallery__title-text" }, itemProps.title) : null, renderFlexibleContent(summary, {
     inlineTag: "span",
     blockTag: "div",
     className: "canopy-gallery__summary"
@@ -6235,6 +6392,7 @@ function buildCaptionContent(itemProps) {
   ));
 }
 function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
+  const { getString, formatString } = useLocale();
   const {
     props,
     modalId,
@@ -6247,7 +6405,13 @@ function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
   const kicker = props.kicker || props.label || props.eyebrow;
   const summary = props.popupDescription || props.modalDescription || props.description || props.summary || null;
   const modalTitle = props.popupTitle || props.modalTitle || props.title || `Item ${index + 1}`;
-  return /* @__PURE__ */ React40.createElement(
+  const closeButtonText = getString("common.actions.close", "Close");
+  const closeButtonLabel = formatString(
+    "common.phrases.close_content",
+    "Close {content}",
+    { content: modalTitle }
+  );
+  return /* @__PURE__ */ React41.createElement(
     "div",
     {
       id: modalId,
@@ -6260,22 +6424,23 @@ function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
       "data-canopy-gallery-modal": "true",
       "data-canopy-gallery-close": closeTargetId
     },
-    /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__modal-scrim" }, /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__modal-actions" }, /* @__PURE__ */ React40.createElement(
+    /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__modal-scrim" }, /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__modal-actions" }, /* @__PURE__ */ React41.createElement(
       GalleryThumbnailNav,
       {
         items: navItems,
         activeModalId: modalId,
         groupName: `${navGroupName || "canopy-gallery"}-${modalId}`
       }
-    ), /* @__PURE__ */ React40.createElement(
-      "a",
+    ), /* @__PURE__ */ React41.createElement(
+      Button,
       {
         className: "canopy-gallery__modal-close",
         href: `#${closeTargetId}`,
-        "aria-label": `Close popup for ${modalTitle}`
-      },
-      "X"
-    )), /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__modal-panel" }, /* @__PURE__ */ React40.createElement(
+        label: closeButtonText,
+        "aria-label": closeButtonLabel,
+        variant: "secondary"
+      }
+    )), /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__modal-panel" }, /* @__PURE__ */ React41.createElement(
       "button",
       {
         type: "button",
@@ -6283,7 +6448,7 @@ function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
         "aria-label": "Scroll left through gallery thumbnails",
         "data-canopy-gallery-nav-prev": "true"
       },
-      /* @__PURE__ */ React40.createElement(
+      /* @__PURE__ */ React41.createElement(
         "span",
         {
           className: "canopy-gallery__nav-button-icon",
@@ -6292,8 +6457,8 @@ function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
         },
         "<"
       ),
-      /* @__PURE__ */ React40.createElement("span", { className: "canopy-gallery__visually-hidden" }, "Previous item")
-    ), /* @__PURE__ */ React40.createElement(
+      /* @__PURE__ */ React41.createElement("span", { className: "canopy-gallery__visually-hidden" }, "Previous item")
+    ), /* @__PURE__ */ React41.createElement(
       "button",
       {
         type: "button",
@@ -6301,7 +6466,7 @@ function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
         "aria-label": "Scroll right through gallery thumbnails",
         "data-canopy-gallery-nav-next": "true"
       },
-      /* @__PURE__ */ React40.createElement(
+      /* @__PURE__ */ React41.createElement(
         "span",
         {
           className: "canopy-gallery__nav-button-icon",
@@ -6310,8 +6475,8 @@ function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
         },
         ">"
       ),
-      /* @__PURE__ */ React40.createElement("span", { className: "canopy-gallery__visually-hidden" }, "Next item")
-    ), /* @__PURE__ */ React40.createElement("header", { className: "canopy-gallery__modal-header" }, /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__modal-text" }, kicker ? /* @__PURE__ */ React40.createElement("p", { className: "canopy-gallery__modal-kicker" }, kicker) : null, /* @__PURE__ */ React40.createElement("h3", { id: modalTitleId, className: "canopy-gallery__modal-title" }, modalTitle), renderFlexibleContent(summary, {
+      /* @__PURE__ */ React41.createElement("span", { className: "canopy-gallery__visually-hidden" }, "Next item")
+    ), /* @__PURE__ */ React41.createElement("header", { className: "canopy-gallery__modal-header" }, /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__modal-text" }, kicker ? /* @__PURE__ */ React41.createElement("p", { className: "canopy-gallery__modal-kicker" }, kicker) : null, /* @__PURE__ */ React41.createElement("h3", { id: modalTitleId, className: "canopy-gallery__modal-title" }, modalTitle), renderFlexibleContent(summary, {
       inlineTag: "p",
       blockTag: "div",
       className: "canopy-gallery__modal-summary",
@@ -6319,20 +6484,20 @@ function GalleryModal({ item, closeTargetId, navItems, navGroupName }) {
     }), renderMetaList(
       props.meta,
       "canopy-gallery__meta canopy-gallery__meta--modal"
-    ), manifests && manifests.length ? manifests.map((manifest) => /* @__PURE__ */ React40.createElement("a", { key: manifest.id || manifest.href, href: manifest.href }, manifest.title || manifest.href)) : null)), /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__modal-body" }, props.children)))
+    ), manifests && manifests.length ? manifests.map((manifest) => /* @__PURE__ */ React41.createElement("a", { key: manifest.id || manifest.href, href: manifest.href }, manifest.title || manifest.href)) : null)), /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__modal-body" }, props.children)))
   );
 }
 function GalleryFigure({ item }) {
   const { props, modalId, triggerLabel } = item;
-  return /* @__PURE__ */ React40.createElement(
+  return /* @__PURE__ */ React41.createElement(
     "figure",
     {
       className: "canopy-gallery__item",
       "data-gallery-item-index": item.index
     },
-    /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__media" }, renderPreview(props)),
-    /* @__PURE__ */ React40.createElement("figcaption", { className: "canopy-gallery__caption" }, buildCaptionContent(props)),
-    /* @__PURE__ */ React40.createElement(
+    /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__media" }, renderPreview(props)),
+    /* @__PURE__ */ React41.createElement("figcaption", { className: "canopy-gallery__caption" }, buildCaptionContent(props)),
+    /* @__PURE__ */ React41.createElement(
       "a",
       {
         className: "canopy-gallery__trigger",
@@ -6342,27 +6507,27 @@ function GalleryFigure({ item }) {
         "aria-label": triggerLabel,
         "data-canopy-gallery-trigger": modalId
       },
-      /* @__PURE__ */ React40.createElement("span", { className: "canopy-gallery__trigger-label" }, triggerLabel)
+      /* @__PURE__ */ React41.createElement("span", { className: "canopy-gallery__trigger-label" }, triggerLabel)
     )
   );
 }
 function GalleryThumbnailNav({ items, activeModalId, groupName }) {
   if (!items || items.length < 2) return null;
   const radioGroup = groupName || "canopy-gallery-nav";
-  return /* @__PURE__ */ React40.createElement(
+  return /* @__PURE__ */ React41.createElement(
     "nav",
     {
       className: "canopy-gallery__nav",
       "aria-label": "Gallery navigation",
       "data-canopy-gallery-nav": "true"
     },
-    /* @__PURE__ */ React40.createElement(
+    /* @__PURE__ */ React41.createElement(
       "div",
       {
         className: "canopy-gallery__nav-viewport",
         "data-canopy-gallery-nav-viewport": "true"
       },
-      /* @__PURE__ */ React40.createElement(
+      /* @__PURE__ */ React41.createElement(
         "ul",
         {
           className: "canopy-gallery__nav-list",
@@ -6372,7 +6537,7 @@ function GalleryThumbnailNav({ items, activeModalId, groupName }) {
         items.map((item, index) => {
           const optionId = `${radioGroup}-${item.modalId || index}`;
           const isActive = item.modalId === activeModalId;
-          return /* @__PURE__ */ React40.createElement(
+          return /* @__PURE__ */ React41.createElement(
             "li",
             {
               key: `${item.key}-nav`,
@@ -6380,7 +6545,7 @@ function GalleryThumbnailNav({ items, activeModalId, groupName }) {
               "data-canopy-gallery-nav-item": "true",
               "data-canopy-gallery-nav-selected": isActive ? "1" : void 0
             },
-            /* @__PURE__ */ React40.createElement(
+            /* @__PURE__ */ React41.createElement(
               "input",
               {
                 type: "radio",
@@ -6396,15 +6561,15 @@ function GalleryThumbnailNav({ items, activeModalId, groupName }) {
                 "data-canopy-gallery-nav-selected": isActive ? "1" : void 0
               }
             ),
-            /* @__PURE__ */ React40.createElement(
+            /* @__PURE__ */ React41.createElement(
               "label",
               {
                 className: "canopy-gallery__nav-link",
                 htmlFor: optionId,
                 "data-canopy-gallery-nav-active": isActive ? "1" : void 0
               },
-              /* @__PURE__ */ React40.createElement("span", { className: "canopy-gallery__nav-thumb" }, renderPreview(item.props)),
-              /* @__PURE__ */ React40.createElement("span", { className: "canopy-gallery__nav-label" }, item.props.title || `Item ${item.index + 1}`)
+              /* @__PURE__ */ React41.createElement("span", { className: "canopy-gallery__nav-thumb" }, renderPreview(item.props)),
+              /* @__PURE__ */ React41.createElement("span", { className: "canopy-gallery__nav-label" }, item.props.title || `Item ${item.index + 1}`)
             )
           );
         })
@@ -6417,7 +6582,7 @@ function GalleryContent({ children, flex = false }) {
     "canopy-gallery-item__content",
     flex ? "canopy-gallery-item__content_flex" : null
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React40.createElement("div", { className: contentClassName }, children);
+  return /* @__PURE__ */ React41.createElement("div", { className: contentClassName }, children);
 }
 function GalleryItem() {
   return null;
@@ -6441,7 +6606,7 @@ function Gallery({
   const galleryId = id ? String(id) : nextGalleryInstanceId();
   const HeadingTag = "h3";
   const closeTargetId = `${galleryId}-close`;
-  const childArray = React40.Children.toArray(children);
+  const childArray = React41.Children.toArray(children);
   const items = childArray.map((child, index) => normalizeItem(child, index, galleryId, manifestMap)).filter(Boolean);
   if (!items.length) return null;
   const popupMode = normalizePopupSize(popupSize);
@@ -6453,7 +6618,7 @@ function Gallery({
     className
   ].filter(Boolean).join(" ");
   const navGroupName = `${galleryId}-nav`;
-  return /* @__PURE__ */ React40.createElement("section", { className: rootClassName, style, "data-canopy-gallery": "true" }, /* @__PURE__ */ React40.createElement(
+  return /* @__PURE__ */ React41.createElement("section", { className: rootClassName, style, "data-canopy-gallery": "true" }, /* @__PURE__ */ React41.createElement(
     "div",
     {
       id: closeTargetId,
@@ -6461,7 +6626,7 @@ function Gallery({
       "aria-hidden": "true",
       tabIndex: -1
     }
-  ), (title || description) && /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__header" }, title ? /* @__PURE__ */ React40.createElement(HeadingTag, { className: "canopy-gallery__heading" }, title) : null, description ? /* @__PURE__ */ React40.createElement("p", { className: "canopy-gallery__description" }, description) : null), /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__grid" }, orderedItems.map((item) => /* @__PURE__ */ React40.createElement(GalleryFigure, { key: item.key, item }))), /* @__PURE__ */ React40.createElement("div", { className: "canopy-gallery__modals" }, orderedItems.map((item) => /* @__PURE__ */ React40.createElement(
+  ), (title || description) && /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__header" }, title ? /* @__PURE__ */ React41.createElement(HeadingTag, { className: "canopy-gallery__heading" }, title) : null, description ? /* @__PURE__ */ React41.createElement("p", { className: "canopy-gallery__description" }, description) : null), /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__grid" }, orderedItems.map((item) => /* @__PURE__ */ React41.createElement(GalleryFigure, { key: item.key, item }))), /* @__PURE__ */ React41.createElement("div", { className: "canopy-gallery__modals" }, orderedItems.map((item) => /* @__PURE__ */ React41.createElement(
     GalleryModal,
     {
       key: `${item.modalId}-modal`,
@@ -6470,7 +6635,7 @@ function Gallery({
       navItems: orderedItems,
       navGroupName
     }
-  ))), /* @__PURE__ */ React40.createElement(
+  ))), /* @__PURE__ */ React41.createElement(
     "script",
     {
       "data-canopy-gallery-script": "true",
@@ -6482,7 +6647,7 @@ Gallery.Item = GalleryItem;
 Gallery.Content = GalleryContent;
 
 // ui/src/search/MdxSearchResults.jsx
-import React41 from "react";
+import React42 from "react";
 function MdxSearchResults(props) {
   let json = "{}";
   try {
@@ -6490,11 +6655,11 @@ function MdxSearchResults(props) {
   } catch (_) {
     json = "{}";
   }
-  return /* @__PURE__ */ React41.createElement("div", { "data-canopy-search-results": "1" }, /* @__PURE__ */ React41.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
+  return /* @__PURE__ */ React42.createElement("div", { "data-canopy-search-results": "1" }, /* @__PURE__ */ React42.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
 }
 
 // ui/src/search/SearchSummary.jsx
-import React42 from "react";
+import React43 from "react";
 function SearchSummary(props) {
   let json = "{}";
   try {
@@ -6502,11 +6667,11 @@ function SearchSummary(props) {
   } catch (_) {
     json = "{}";
   }
-  return /* @__PURE__ */ React42.createElement("div", { "data-canopy-search-summary": "1" }, /* @__PURE__ */ React42.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
+  return /* @__PURE__ */ React43.createElement("div", { "data-canopy-search-summary": "1" }, /* @__PURE__ */ React43.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
 }
 
 // ui/src/search/MdxSearchTabs.jsx
-import React43 from "react";
+import React44 from "react";
 function MdxSearchTabs(props) {
   let json = "{}";
   try {
@@ -6514,11 +6679,11 @@ function MdxSearchTabs(props) {
   } catch (_) {
     json = "{}";
   }
-  return /* @__PURE__ */ React43.createElement("div", { "data-canopy-search-tabs": "1" }, /* @__PURE__ */ React43.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
+  return /* @__PURE__ */ React44.createElement("div", { "data-canopy-search-tabs": "1" }, /* @__PURE__ */ React44.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
 }
 
 // ui/src/search/MdxSearch.jsx
-import React44 from "react";
+import React45 from "react";
 function MdxSearch(props = {}) {
   const {
     layout,
@@ -6536,11 +6701,11 @@ function MdxSearch(props = {}) {
     resultsPayload.layout = layout;
   }
   const classes = ["canopy-search", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React44.createElement("section", { className: classes, "data-canopy-search": "1" }, showTabs ? /* @__PURE__ */ React44.createElement(MdxSearchTabs, { ...tabsProps }) : null, showSummary ? /* @__PURE__ */ React44.createElement(SearchSummary, { ...summaryProps }) : null, showResults ? /* @__PURE__ */ React44.createElement(MdxSearchResults, { ...resultsPayload }) : null, children || null);
+  return /* @__PURE__ */ React45.createElement("section", { className: classes, "data-canopy-search": "1" }, showTabs ? /* @__PURE__ */ React45.createElement(MdxSearchTabs, { ...tabsProps }) : null, showSummary ? /* @__PURE__ */ React45.createElement(SearchSummary, { ...summaryProps }) : null, showResults ? /* @__PURE__ */ React45.createElement(MdxSearchResults, { ...resultsPayload }) : null, children || null);
 }
 
 // ui/src/search-form/MdxSearchFormModal.jsx
-import React45 from "react";
+import React46 from "react";
 function MdxSearchFormModal(props = {}) {
   const {
     placeholder: placeholderProp,
@@ -6559,12 +6724,12 @@ function MdxSearchFormModal(props = {}) {
   const text = typeof label === "string" && label.trim() ? label.trim() : resolvedButtonLabel;
   const resolvedSearchPath = resolveSearchPath(searchPath);
   const data = { placeholder, hotkey, maxResults, groupOrder, label: text, searchPath: resolvedSearchPath };
-  return /* @__PURE__ */ React45.createElement("div", { "data-canopy-search-form": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React45.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React45.createElement(SearchPanelForm, { placeholder, buttonLabel: resolvedButtonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React45.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React45.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
+  return /* @__PURE__ */ React46.createElement("div", { "data-canopy-search-form": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React46.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React46.createElement(SearchPanelForm, { placeholder, buttonLabel: resolvedButtonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React46.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React46.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
 }
 
 // ui/src/iiif/ManifestPrimitives.jsx
 var import_slugify2 = __toESM(require_slugify());
-import React46 from "react";
+import React47 from "react";
 import {
   Label as CloverLabel,
   Metadata as CloverMetadata,
@@ -6705,7 +6870,7 @@ function MetadataFacetLink(props) {
   const valueSlug = facetSlug ? toValueSlug(text) : "";
   const href = facetSlug && valueSlug ? buildFacetSearchHref(facetSlug, valueSlug) : "";
   if (!href) return text;
-  return /* @__PURE__ */ React46.createElement(
+  return /* @__PURE__ */ React47.createElement(
     "a",
     {
       href,
@@ -6731,7 +6896,7 @@ function buildFacetCustomValueContent(items, manifest) {
     seen.add(normalized);
     custom.push({
       matchingLabel: item.label,
-      Content: /* @__PURE__ */ React46.createElement(MetadataFacetLink, { facetSlug: facet.slug })
+      Content: /* @__PURE__ */ React47.createElement(MetadataFacetLink, { facetSlug: facet.slug })
     });
   }
   return custom;
@@ -6763,12 +6928,12 @@ function mergeCustomValueContent(userContent, autoContent) {
 function Label({ manifest, label, ...rest }) {
   const intl = label || manifest && manifest.label;
   if (!hasInternationalValue(intl)) return null;
-  return /* @__PURE__ */ React46.createElement(CloverLabel, { label: intl, ...rest });
+  return /* @__PURE__ */ React47.createElement(CloverLabel, { label: intl, ...rest });
 }
 function Summary({ manifest, summary, ...rest }) {
   const intl = summary || manifest && manifest.summary;
   if (!hasInternationalValue(intl)) return null;
-  return /* @__PURE__ */ React46.createElement(CloverSummary, { summary: intl, ...rest });
+  return /* @__PURE__ */ React47.createElement(CloverSummary, { summary: intl, ...rest });
 }
 function Metadata({ manifest, metadata, customValueContent, ...rest }) {
   const items = ensureMetadata(metadata || manifest && manifest.metadata);
@@ -6778,7 +6943,7 @@ function Metadata({ manifest, metadata, customValueContent, ...rest }) {
     customValueContent,
     autoCustomContent
   );
-  return /* @__PURE__ */ React46.createElement(
+  return /* @__PURE__ */ React47.createElement(
     CloverMetadata,
     {
       metadata: items,
@@ -6792,17 +6957,17 @@ function RequiredStatement({ manifest, requiredStatement, ...rest }) {
   if (!stmt || !hasInternationalValue(stmt.label) || !hasInternationalValue(stmt.value)) {
     return null;
   }
-  return /* @__PURE__ */ React46.createElement(CloverRequiredStatement, { requiredStatement: stmt, ...rest });
+  return /* @__PURE__ */ React47.createElement(CloverRequiredStatement, { requiredStatement: stmt, ...rest });
 }
 
 // ui/src/iiif/Properties/Id.jsx
-import React47 from "react";
+import React48 from "react";
 function Id({ title = "IIIF Manifest", id, ...props }) {
-  return /* @__PURE__ */ React47.createElement("dl", null, /* @__PURE__ */ React47.createElement("dt", null, title), /* @__PURE__ */ React47.createElement("dd", null, /* @__PURE__ */ React47.createElement("a", { href: id }, id)));
+  return /* @__PURE__ */ React48.createElement("dl", null, /* @__PURE__ */ React48.createElement("dt", null, title), /* @__PURE__ */ React48.createElement("dd", null, /* @__PURE__ */ React48.createElement("a", { href: id }, id)));
 }
 
 // ui/src/docs/CodeBlock.jsx
-import React48 from "react";
+import React49 from "react";
 function parseHighlightAttr(attr) {
   if (!attr) return /* @__PURE__ */ new Set();
   const cleaned = String(attr || "").trim();
@@ -6848,10 +7013,10 @@ var highlightBaseStyle = {
 };
 function DocsCodeBlock(props = {}) {
   const { children, ...rest } = props;
-  const childArray = React48.Children.toArray(children);
-  const codeElement = childArray.find((el) => React48.isValidElement(el));
+  const childArray = React49.Children.toArray(children);
+  const codeElement = childArray.find((el) => React49.isValidElement(el));
   if (!codeElement || !codeElement.props) {
-    return React48.createElement("pre", props);
+    return React49.createElement("pre", props);
   }
   const {
     className = "",
@@ -6866,9 +7031,9 @@ function DocsCodeBlock(props = {}) {
   const highlightSet = parseHighlightAttr(highlightAttr);
   const copyAttr = codeProps["data-copy"];
   const enableCopy = copyAttr !== void 0 ? copyAttr === true || copyAttr === "true" || copyAttr === "" : false;
-  const [copied, setCopied] = React48.useState(false);
-  const buttonRef = React48.useRef(null);
-  const handleCopy = React48.useCallback(async () => {
+  const [copied, setCopied] = React49.useState(false);
+  const buttonRef = React49.useRef(null);
+  const handleCopy = React49.useCallback(async () => {
     const text = trimmedCode;
     try {
       if (typeof navigator !== "undefined" && navigator.clipboard && navigator.clipboard.writeText) {
@@ -6890,12 +7055,12 @@ function DocsCodeBlock(props = {}) {
       setCopied(false);
     }
   }, [trimmedCode]);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (buttonRef.current) {
       buttonRef.current.setAttribute("data-docs-copy-hydrated", "true");
     }
   }, []);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!buttonRef.current) return;
     if (copied) buttonRef.current.setAttribute("data-docs-copy-active", "true");
     else buttonRef.current.removeAttribute("data-docs-copy-active");
@@ -6958,27 +7123,27 @@ function DocsCodeBlock(props = {}) {
     const highlight = highlightSet.has(lineNumber);
     const style = highlight ? { ...baseLineStyle, ...highlightBaseStyle } : baseLineStyle;
     const displayLine = line === "" ? " " : line;
-    return React48.createElement(
+    return React49.createElement(
       "span",
       {
         key: lineNumber,
         style,
         "data-docs-code-line": line
       },
-      React48.createElement("span", { style: lineContentStyle }, displayLine)
+      React49.createElement("span", { style: lineContentStyle }, displayLine)
     );
   });
-  return React48.createElement(
+  return React49.createElement(
     "div",
     {
       style: containerStyle,
       "data-docs-code-block": "true"
     },
-    showHeader ? React48.createElement(
+    showHeader ? React49.createElement(
       "div",
       { style: headerStyle },
-      React48.createElement("span", null, showFilename ? filename : null),
-      enableCopy ? React48.createElement(
+      React49.createElement("span", null, showFilename ? filename : null),
+      enableCopy ? React49.createElement(
         "button",
         {
           ref: buttonRef,
@@ -6989,8 +7154,8 @@ function DocsCodeBlock(props = {}) {
           "data-docs-copy-button": "true",
           style: buttonStyle
         },
-        React48.createElement("span", null, "Copy"),
-        React48.createElement(
+        React49.createElement("span", null, "Copy"),
+        React49.createElement(
           "span",
           {
             "aria-hidden": "true",
@@ -7000,7 +7165,7 @@ function DocsCodeBlock(props = {}) {
         )
       ) : null
     ) : null,
-    enableCopy ? React48.createElement("textarea", {
+    enableCopy ? React49.createElement("textarea", {
       "data-docs-copy-source": "true",
       tabIndex: -1,
       readOnly: true,
@@ -7015,29 +7180,29 @@ function DocsCodeBlock(props = {}) {
         pointerEvents: "none"
       }
     }) : null,
-    React48.createElement(
+    React49.createElement(
       "pre",
       { ...preRest, className: preClassName, style: mergedPreStyle },
-      React48.createElement("code", { style: codeStyle }, lineElements)
+      React49.createElement("code", { style: codeStyle }, lineElements)
     )
   );
 }
 
 // ui/src/docs/MarkdownTable.jsx
-import React49 from "react";
+import React50 from "react";
 function MarkdownTable({ className = "", ...rest }) {
   const merged = ["markdown-table", className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ React49.createElement("div", { className: "markdown-table__frame" }, /* @__PURE__ */ React49.createElement("table", { className: merged, ...rest }));
+  return /* @__PURE__ */ React50.createElement("div", { className: "markdown-table__frame" }, /* @__PURE__ */ React50.createElement("table", { className: merged, ...rest }));
 }
 
 // ui/src/docs/Diagram.jsx
-import React50 from "react";
+import React51 from "react";
 function CanopyDiagram() {
-  return /* @__PURE__ */ React50.createElement("div", { className: "canopy-diagram" }, /* @__PURE__ */ React50.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--collections" }, /* @__PURE__ */ React50.createElement("h3", null, "IIIF Providers"), /* @__PURE__ */ React50.createElement("span", { className: "canopy-diagram__section-summary" }, "Source collections contribute 45 manifests while 5 manifests are directly retrieved as-is via IIIF endpoints."), /* @__PURE__ */ React50.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Collection A"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "30 Manifests"), /* @__PURE__ */ React50.createElement("li", null, /* @__PURE__ */ React50.createElement("em", null, "Manuscripts")))), /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Collection B"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "15 Manifests"), /* @__PURE__ */ React50.createElement("li", null, /* @__PURE__ */ React50.createElement("em", null, "Portraits")))), /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Manifests (direct)"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "5 Manifests"), /* @__PURE__ */ React50.createElement("li", null, /* @__PURE__ */ React50.createElement("em", null, "Scrapbooks")))))), /* @__PURE__ */ React50.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React50.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React50.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React50.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--build" }, /* @__PURE__ */ React50.createElement("h3", null, "Canopy Build Process"), /* @__PURE__ */ React50.createElement("span", { className: "canopy-diagram__section-summary" }, "Canopy retrieves collections and syncs all manifests, page content, and annotations before bundling the site."), /* @__PURE__ */ React50.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Automated content"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "50 manifests \u2192 50 work pages"), /* @__PURE__ */ React50.createElement("li", null, "One page per manifest"), /* @__PURE__ */ React50.createElement("li", null, "Customize page layout"))), /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Contextual content"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "Markdown & MDX pages"), /* @__PURE__ */ React50.createElement("li", null, "Author narratives"), /* @__PURE__ */ React50.createElement("li", null, "Reference manifests inline"))), /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Search index"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "Combines works + pages"), /* @__PURE__ */ React50.createElement("li", null, "Customize result layout"), /* @__PURE__ */ React50.createElement("li", null, "Optional annotations"))))), /* @__PURE__ */ React50.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React50.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React50.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React50.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--output" }, /* @__PURE__ */ React50.createElement("h3", null, "Static Digital Project"), /* @__PURE__ */ React50.createElement("span", { className: "canopy-diagram__section-summary" }, "The output is a lightweight bundle of HTML, CSS, JS, and JSON assets that can deploy anywhere."), /* @__PURE__ */ React50.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Work pages"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "50 generated HTML pages"), /* @__PURE__ */ React50.createElement("li", null, "Each links back to source manifests"), /* @__PURE__ */ React50.createElement("li", null, "Styled with Canopy components"))), /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Custom pages"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "Markdown & MDX-authored content"), /* @__PURE__ */ React50.createElement("li", null, "Reusable layouts for narratives"), /* @__PURE__ */ React50.createElement("li", null, "Embed IIIF media & interstitials"))), /* @__PURE__ */ React50.createElement("article", null, /* @__PURE__ */ React50.createElement("h4", null, "Search bundle"), /* @__PURE__ */ React50.createElement("ul", null, /* @__PURE__ */ React50.createElement("li", null, "Static FlexSearch index"), /* @__PURE__ */ React50.createElement("li", null, "Works + pages share records"), /* @__PURE__ */ React50.createElement("li", null, "Optional annotation dataset"))))));
+  return /* @__PURE__ */ React51.createElement("div", { className: "canopy-diagram" }, /* @__PURE__ */ React51.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--collections" }, /* @__PURE__ */ React51.createElement("h3", null, "IIIF Providers"), /* @__PURE__ */ React51.createElement("span", { className: "canopy-diagram__section-summary" }, "Source collections contribute 45 manifests while 5 manifests are directly retrieved as-is via IIIF endpoints."), /* @__PURE__ */ React51.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Collection A"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "30 Manifests"), /* @__PURE__ */ React51.createElement("li", null, /* @__PURE__ */ React51.createElement("em", null, "Manuscripts")))), /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Collection B"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "15 Manifests"), /* @__PURE__ */ React51.createElement("li", null, /* @__PURE__ */ React51.createElement("em", null, "Portraits")))), /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Manifests (direct)"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "5 Manifests"), /* @__PURE__ */ React51.createElement("li", null, /* @__PURE__ */ React51.createElement("em", null, "Scrapbooks")))))), /* @__PURE__ */ React51.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React51.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React51.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React51.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--build" }, /* @__PURE__ */ React51.createElement("h3", null, "Canopy Build Process"), /* @__PURE__ */ React51.createElement("span", { className: "canopy-diagram__section-summary" }, "Canopy retrieves collections and syncs all manifests, page content, and annotations before bundling the site."), /* @__PURE__ */ React51.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Automated content"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "50 manifests \u2192 50 work pages"), /* @__PURE__ */ React51.createElement("li", null, "One page per manifest"), /* @__PURE__ */ React51.createElement("li", null, "Customize page layout"))), /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Contextual content"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "Markdown & MDX pages"), /* @__PURE__ */ React51.createElement("li", null, "Author narratives"), /* @__PURE__ */ React51.createElement("li", null, "Reference manifests inline"))), /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Search index"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "Combines works + pages"), /* @__PURE__ */ React51.createElement("li", null, "Customize result layout"), /* @__PURE__ */ React51.createElement("li", null, "Optional annotations"))))), /* @__PURE__ */ React51.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React51.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React51.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React51.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--output" }, /* @__PURE__ */ React51.createElement("h3", null, "Static Digital Project"), /* @__PURE__ */ React51.createElement("span", { className: "canopy-diagram__section-summary" }, "The output is a lightweight bundle of HTML, CSS, JS, and JSON assets that can deploy anywhere."), /* @__PURE__ */ React51.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Work pages"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "50 generated HTML pages"), /* @__PURE__ */ React51.createElement("li", null, "Each links back to source manifests"), /* @__PURE__ */ React51.createElement("li", null, "Styled with Canopy components"))), /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Custom pages"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "Markdown & MDX-authored content"), /* @__PURE__ */ React51.createElement("li", null, "Reusable layouts for narratives"), /* @__PURE__ */ React51.createElement("li", null, "Embed IIIF media & interstitials"))), /* @__PURE__ */ React51.createElement("article", null, /* @__PURE__ */ React51.createElement("h4", null, "Search bundle"), /* @__PURE__ */ React51.createElement("ul", null, /* @__PURE__ */ React51.createElement("li", null, "Static FlexSearch index"), /* @__PURE__ */ React51.createElement("li", null, "Works + pages share records"), /* @__PURE__ */ React51.createElement("li", null, "Optional annotation dataset"))))));
 }
 
 // ui/src/docs/ThemeShowcase.jsx
-import React51 from "react";
+import React52 from "react";
 
 // ../../node_modules/@radix-ui/colors/index.mjs
 var colors_exports = {};
@@ -10889,21 +11054,21 @@ var STEP_MAP = {
   800: 11,
   900: 12
 };
-var Section = ({ title, description, children }) => /* @__PURE__ */ React51.createElement("div", { className: "canopy-theme-showcase__section" }, /* @__PURE__ */ React51.createElement("h3", { className: "canopy-theme-showcase__section-title" }, title), description ? /* @__PURE__ */ React51.createElement("p", { className: "canopy-theme-showcase__section-description" }, description) : null, children);
-var ColorScaleRow = ({ label, prefix }) => /* @__PURE__ */ React51.createElement("div", { className: "canopy-theme-showcase__scale-row" }, /* @__PURE__ */ React51.createElement("div", { className: "canopy-theme-showcase__scale-label" }, /* @__PURE__ */ React51.createElement("strong", null, label)), /* @__PURE__ */ React51.createElement("div", { className: "canopy-theme-showcase__scale-track" }, COLOR_STOPS.map((stop) => /* @__PURE__ */ React51.createElement(
+var Section = ({ title, description, children }) => /* @__PURE__ */ React52.createElement("div", { className: "canopy-theme-showcase__section" }, /* @__PURE__ */ React52.createElement("h3", { className: "canopy-theme-showcase__section-title" }, title), description ? /* @__PURE__ */ React52.createElement("p", { className: "canopy-theme-showcase__section-description" }, description) : null, children);
+var ColorScaleRow = ({ label, prefix }) => /* @__PURE__ */ React52.createElement("div", { className: "canopy-theme-showcase__scale-row" }, /* @__PURE__ */ React52.createElement("div", { className: "canopy-theme-showcase__scale-label" }, /* @__PURE__ */ React52.createElement("strong", null, label)), /* @__PURE__ */ React52.createElement("div", { className: "canopy-theme-showcase__scale-track" }, COLOR_STOPS.map((stop) => /* @__PURE__ */ React52.createElement(
   "div",
   {
     key: `${label}-${stop}`,
     className: "canopy-theme-showcase__scale-stop"
   },
-  /* @__PURE__ */ React51.createElement(
+  /* @__PURE__ */ React52.createElement(
     "span",
     {
       className: "canopy-theme-showcase__scale-chip",
       style: { backgroundColor: `var(${prefix}-${stop})` }
     }
   ),
-  /* @__PURE__ */ React51.createElement("span", { className: "canopy-theme-showcase__scale-token" }, stop)
+  /* @__PURE__ */ React52.createElement("span", { className: "canopy-theme-showcase__scale-token" }, stop)
 ))));
 var AVAILABLE = new Set(
   Object.keys(colors_exports).filter(
@@ -10968,9 +11133,9 @@ var PREVIEW_DATA = buildPreviewData();
 function encodeJson(value) {
   return JSON.stringify(value).replace(/</g, "\\u003c");
 }
-var ColorsLabeled = ({ colors, type, getRadixSwatch }) => /* @__PURE__ */ React51.createElement("div", { className: "canopy-theme-showcase__swatch-grid" }, colors.map((name) => {
+var ColorsLabeled = ({ colors, type, getRadixSwatch }) => /* @__PURE__ */ React52.createElement("div", { className: "canopy-theme-showcase__swatch-grid" }, colors.map((name) => {
   const colorValue = getRadixSwatch(name);
-  return /* @__PURE__ */ React51.createElement(
+  return /* @__PURE__ */ React52.createElement(
     "button",
     {
       key: `${type}-${name}`,
@@ -10981,14 +11146,14 @@ var ColorsLabeled = ({ colors, type, getRadixSwatch }) => /* @__PURE__ */ React5
       "data-theme-swatch-value": name,
       "aria-pressed": "false"
     },
-    /* @__PURE__ */ React51.createElement(
+    /* @__PURE__ */ React52.createElement(
       "span",
       {
         className: "canopy-theme-showcase__swatch-chip",
         style: { background: colorValue || "var(--color-gray-200)" }
       }
     ),
-    /* @__PURE__ */ React51.createElement("span", { className: "canopy-theme-showcase__swatch-label" }, name)
+    /* @__PURE__ */ React52.createElement("span", { className: "canopy-theme-showcase__swatch-label" }, name)
   );
 }));
 function ThemeShowcase() {
@@ -11148,7 +11313,7 @@ function ThemeShowcase() {
     .canopy-theme-showcase__swatch-controls { display: none; }
     .canopy-theme-showcase__clear-button { display: none; }
   `;
-  return /* @__PURE__ */ React51.createElement("div", { className: "canopy-theme-showcase", "data-theme-showcase": true }, /* @__PURE__ */ React51.createElement("style", { dangerouslySetInnerHTML: { __html: styles } }), /* @__PURE__ */ React51.createElement(
+  return /* @__PURE__ */ React52.createElement("div", { className: "canopy-theme-showcase", "data-theme-showcase": true }, /* @__PURE__ */ React52.createElement("style", { dangerouslySetInnerHTML: { __html: styles } }), /* @__PURE__ */ React52.createElement(
     "div",
     {
       style: {
@@ -11159,18 +11324,18 @@ function ThemeShowcase() {
         marginBottom: "1rem"
       }
     },
-    /* @__PURE__ */ React51.createElement(
+    /* @__PURE__ */ React52.createElement(
       Section,
       {
         title: "Appearance",
         description: "Pick the base light or dark mode for the theme preview."
       },
-      /* @__PURE__ */ React51.createElement("div", { className: "canopy-theme-showcase__appearance-buttons" }, ["light", "dark"].map((mode) => {
+      /* @__PURE__ */ React52.createElement("div", { className: "canopy-theme-showcase__appearance-buttons" }, ["light", "dark"].map((mode) => {
         const label = `${mode.charAt(0).toUpperCase()}${mode.slice(1)}`;
         const baseClass = "canopy-theme-showcase__appearance-button";
         const isDefault = mode === DEFAULTS.appearance;
         const className = isDefault ? `${baseClass} is-active` : baseClass;
-        return /* @__PURE__ */ React51.createElement(
+        return /* @__PURE__ */ React52.createElement(
           "button",
           {
             key: mode,
@@ -11182,7 +11347,7 @@ function ThemeShowcase() {
         );
       }))
     ),
-    /* @__PURE__ */ React51.createElement(
+    /* @__PURE__ */ React52.createElement(
       "button",
       {
         type: "button",
@@ -11191,13 +11356,13 @@ function ThemeShowcase() {
       },
       "Reset"
     )
-  ), /* @__PURE__ */ React51.createElement(
+  ), /* @__PURE__ */ React52.createElement(
     Section,
     {
       title: "Color scales",
       description: "Accent and gray ramps from the active theme."
     },
-    /* @__PURE__ */ React51.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "1.5rem" } }, COLOR_SCALES.map((scale) => /* @__PURE__ */ React51.createElement(
+    /* @__PURE__ */ React52.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "1.5rem" } }, COLOR_SCALES.map((scale) => /* @__PURE__ */ React52.createElement(
       ColorScaleRow,
       {
         key: scale.label,
@@ -11205,13 +11370,13 @@ function ThemeShowcase() {
         prefix: scale.prefix
       }
     )))
-  ), /* @__PURE__ */ React51.createElement(
+  ), /* @__PURE__ */ React52.createElement(
     Section,
     {
       title: "Accent color palette options",
       description: "Click a swatch to temporarily override the accent palette."
     },
-    /* @__PURE__ */ React51.createElement(
+    /* @__PURE__ */ React52.createElement(
       ColorsLabeled,
       {
         colors: accentColors,
@@ -11219,13 +11384,13 @@ function ThemeShowcase() {
         getRadixSwatch
       }
     )
-  ), /* @__PURE__ */ React51.createElement(
+  ), /* @__PURE__ */ React52.createElement(
     Section,
     {
       title: "Gray color palette options",
       description: "Click a swatch to preview the neutral ramp for surfaces and text."
     },
-    /* @__PURE__ */ React51.createElement(
+    /* @__PURE__ */ React52.createElement(
       ColorsLabeled,
       {
         colors: grayColors,
@@ -11233,7 +11398,7 @@ function ThemeShowcase() {
         getRadixSwatch
       }
     )
-  ), /* @__PURE__ */ React51.createElement(
+  ), /* @__PURE__ */ React52.createElement(
     "script",
     {
       type: "application/json",
@@ -11253,6 +11418,8 @@ export {
   CanopyModal,
   Card,
   Container,
+  ContentNavigation,
+  ContentNavigationScript,
   DocsCodeBlock,
   MarkdownTable as DocsMarkdownTable,
   Gallery,