@canopy-iiif/app 0.10.23 → 0.10.26

package/ui/dist/server.mjs

@@ -105,7 +105,7 @@ var Slider = (props) => {
     } catch (_) {
       json = "{}";
     }
-    return /* @__PURE__ */ React3.createElement("div", { "data-canopy-slider": "1", className: "not-prose" }, /* @__PURE__ */ React3.createElement(
+    return /* @__PURE__ */ React3.createElement("div", { className: "canopy-slider", "data-canopy-slider": "1" }, /* @__PURE__ */ React3.createElement(
       "script",
       {
         type: "application/json",
@@ -113,7 +113,7 @@ var Slider = (props) => {
       }
     ));
   }
-  return /* @__PURE__ */ React3.createElement(CloverSlider, { ...props });
+  return /* @__PURE__ */ React3.createElement(CloverSlider, { ...props, className: "canopy-slider" });
 };
 
 // ui/src/iiif/Scroll.jsx
@@ -218,7 +218,13 @@ function MdxRelatedItems(props) {
   } catch (_) {
     json = "{}";
   }
-  return /* @__PURE__ */ React6.createElement("div", { "data-canopy-related-items": "1", className: "not-prose" }, /* @__PURE__ */ React6.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: json } }));
+  return /* @__PURE__ */ React6.createElement("div", { "data-canopy-related-items": "1" }, /* @__PURE__ */ React6.createElement(
+    "script",
+    {
+      type: "application/json",
+      dangerouslySetInnerHTML: { __html: json }
+    }
+  ));
 }
 
 // ui/src/interstitials/index.js
@@ -1587,12 +1593,50 @@ function HeaderScript() {
     }
   );
 }
+var CONTEXT_KEY = typeof Symbol === "function" ? Symbol.for("__CANOPY_PAGE_CONTEXT__") : "__CANOPY_PAGE_CONTEXT__";
+function getSharedRoot() {
+  if (typeof globalThis !== "undefined") return globalThis;
+  if (typeof window !== "undefined") return window;
+  if (typeof global !== "undefined") return global;
+  return null;
+}
+function getSafePageContext() {
+  const root = getSharedRoot();
+  if (root && root[CONTEXT_KEY]) return root[CONTEXT_KEY];
+  const ctx = React19.createContext({ navigation: null, page: null });
+  if (root) root[CONTEXT_KEY] = ctx;
+  return ctx;
+}
 function ensureArray(navLinks) {
   if (!Array.isArray(navLinks)) return [];
   return navLinks.filter(
     (link) => link && typeof link === "object" && typeof link.href === "string"
   );
 }
+function SectionNavList({ root }) {
+  if (!root || !Array.isArray(root.children) || !root.children.length) return null;
+  return /* @__PURE__ */ React19.createElement("ul", { className: "canopy-modal__section-list", role: "list" }, root.children.map((node) => /* @__PURE__ */ React19.createElement(SectionNavItem, { key: node.slug || node.href || node.title, node, depth: 0 })));
+}
+function SectionNavItem({ node, depth }) {
+  if (!node) return null;
+  const hasChildren = Array.isArray(node.children) && node.children.length > 0;
+  const Tag = node.href ? "a" : "span";
+  const classes = [
+    "canopy-modal__section-link",
+    `depth-${Math.min(5, Math.max(0, depth + 1))}`
+  ];
+  if (!node.href) classes.push("is-label");
+  if (node.isActive) classes.push("is-active");
+  return /* @__PURE__ */ React19.createElement("li", { className: "canopy-modal__section-item", "data-depth": depth }, /* @__PURE__ */ React19.createElement(
+    Tag,
+    {
+      className: classes.join(" "),
+      href: node.href || void 0,
+      "aria-current": node.isActive ? "page" : void 0
+    },
+    node.title || node.slug
+  ), hasChildren ? /* @__PURE__ */ React19.createElement("ul", { className: "canopy-modal__section-list canopy-modal__section-list--nested", role: "list" }, node.children.map((child) => /* @__PURE__ */ React19.createElement(SectionNavItem, { key: child.slug || child.href || child.title, node: child, depth: depth + 1 }))) : null);
+}
 function CanopyHeader(props = {}) {
   const {
     navigation: navLinksProp,
@@ -1604,6 +1648,13 @@ function CanopyHeader(props = {}) {
     logo: SiteLogo
   } = props;
   const navLinks = ensureArray(navLinksProp);
+  const PageContext = getSafePageContext();
+  const context = React19.useContext(PageContext);
+  const sectionNavigation = context && context.navigation && context.navigation.root ? context.navigation : null;
+  const sectionHeading = sectionNavigation && sectionNavigation.title || (sectionNavigation && sectionNavigation.root ? sectionNavigation.root.title : "");
+  const hasSectionNav = !!(sectionNavigation && sectionNavigation.root && Array.isArray(sectionNavigation.root.children) && sectionNavigation.root.children.length);
+  const sectionLabel = sectionHeading ? `More in ${sectionHeading}` : "More in this section";
+  const sectionAriaLabel = sectionHeading ? `${sectionHeading} section navigation` : "Section navigation";
   return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(
     "header",
     {
@@ -1714,7 +1765,16 @@ function CanopyHeader(props = {}) {
         "aria-label": "Primary navigation"
       },
       navLinks.map((link) => /* @__PURE__ */ React19.createElement("a", { key: link.href, href: link.href }, link.label || link.href))
-    )
+    ),
+    hasSectionNav ? /* @__PURE__ */ React19.createElement(
+      "nav",
+      {
+        className: "canopy-modal__section-nav",
+        "aria-label": sectionAriaLabel
+      },
+      /* @__PURE__ */ React19.createElement("div", { className: "canopy-modal__section-label" }, sectionLabel),
+      /* @__PURE__ */ React19.createElement(SectionNavList, { root: sectionNavigation.root })
+    ) : null
   ), /* @__PURE__ */ React19.createElement(
     CanopyModal,
     {
@@ -2241,10 +2301,17 @@ function MarkdownTable({ className = "", ...rest }) {
   const merged = ["markdown-table", className].filter(Boolean).join(" ");
   return /* @__PURE__ */ React31.createElement("div", { className: "markdown-table__frame" }, /* @__PURE__ */ React31.createElement("table", { className: merged, ...rest }));
 }
+
+// ui/src/docs/Diagram.jsx
+import React32 from "react";
+function CanopyDiagram() {
+  return /* @__PURE__ */ React32.createElement("div", { className: "canopy-diagram" }, /* @__PURE__ */ React32.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--collections" }, /* @__PURE__ */ React32.createElement("h3", null, "IIIF Collection(s)"), /* @__PURE__ */ React32.createElement("span", { className: "canopy-diagram__section-summary" }, "Source collections contribute 170 total manifests that Canopy retrieves as-is via IIIF endpoints."), /* @__PURE__ */ React32.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Collection A"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "70 Manifests"), /* @__PURE__ */ React32.createElement("li", null, "IIIF Images + A/V"), /* @__PURE__ */ React32.createElement("li", null, "Textual Annotations"))), /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Collection B"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "35 Manifests"), /* @__PURE__ */ React32.createElement("li", null, "IIIF Images + A/V"), /* @__PURE__ */ React32.createElement("li", null, "Textual Annotations"))))), /* @__PURE__ */ React32.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React32.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React32.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React32.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--build" }, /* @__PURE__ */ React32.createElement("h3", null, "Canopy Build Process"), /* @__PURE__ */ React32.createElement("span", { className: "canopy-diagram__section-summary" }, "Canopy syncs manifests, authored pages, and annotations before bundling data for the static site."), /* @__PURE__ */ React32.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Automated content"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "105 manifests \u2192 105 work pages"), /* @__PURE__ */ React32.createElement("li", null, "One page per manifest"), /* @__PURE__ */ React32.createElement("li", null, "Customize layout per work"))), /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Contextual content"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "Markdown & MDX pages"), /* @__PURE__ */ React32.createElement("li", null, "Author narratives & tours"), /* @__PURE__ */ React32.createElement("li", null, "Reference manifests inline"))), /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Search index"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "Combines works + pages"), /* @__PURE__ */ React32.createElement("li", null, "FlexSearch powered"), /* @__PURE__ */ React32.createElement("li", null, "Optional annotations"))))), /* @__PURE__ */ React32.createElement("div", { className: "canopy-diagram__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React32.createElement("span", { className: "canopy-diagram__arrow-line" }), /* @__PURE__ */ React32.createElement("span", { className: "canopy-diagram__arrow-head" })), /* @__PURE__ */ React32.createElement("section", { className: "canopy-diagram__section canopy-diagram__section--output" }, /* @__PURE__ */ React32.createElement("h3", null, "Static Digital Project"), /* @__PURE__ */ React32.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__ */ React32.createElement("div", { className: "canopy-diagram__grid" }, /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Work pages"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "105 generated HTML pages"), /* @__PURE__ */ React32.createElement("li", null, "Each links back to source manifests"), /* @__PURE__ */ React32.createElement("li", null, "Styled with Canopy components"))), /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Custom pages"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "Markdown & MDX-authored content"), /* @__PURE__ */ React32.createElement("li", null, "Reusable layouts for narratives"), /* @__PURE__ */ React32.createElement("li", null, "Embed IIIF media & interstitials"))), /* @__PURE__ */ React32.createElement("article", null, /* @__PURE__ */ React32.createElement("h4", null, "Search bundle"), /* @__PURE__ */ React32.createElement("ul", null, /* @__PURE__ */ React32.createElement("li", null, "Static FlexSearch index"), /* @__PURE__ */ React32.createElement("li", null, "Works + pages share records"), /* @__PURE__ */ React32.createElement("li", null, "Optional annotation dataset"))))));
+}
 export {
   Button,
   ButtonWrapper,
   CanopyBrand,
+  CanopyDiagram,
   CanopyFooter,
   CanopyHeader,
   CanopyModal,