@canopy-iiif/app 0.7.14 → 0.7.17

package/lib/build/iiif.js

@@ -22,7 +22,7 @@ const IIIF_CACHE_COLLECTIONS_DIR = path.join(IIIF_CACHE_DIR, "collections");
 const IIIF_CACHE_COLLECTION = path.join(IIIF_CACHE_DIR, "collection.json");
 // Primary global index location
 const IIIF_CACHE_INDEX = path.join(IIIF_CACHE_DIR, "index.json");
-// Legacy locations kept for backward compatibility (read + optional write)
+// Additional legacy locations kept for backward compatibility (read + optional write)
 const IIIF_CACHE_INDEX_LEGACY = path.join(
   IIIF_CACHE_DIR,
   "manifest-index.json"
@@ -150,7 +150,7 @@ async function loadManifestIndex() {
         return { byId, collection: idx.collection || null };
       }
     }
-    // Fallback: legacy in .cache/iiif
+    // Legacy index location retained for backward compatibility
     if (fs.existsSync(IIIF_CACHE_INDEX_LEGACY)) {
       const idx = await readJson(IIIF_CACHE_INDEX_LEGACY);
       if (idx && typeof idx === "object") {
@@ -167,7 +167,7 @@ async function loadManifestIndex() {
         return { byId, collection: idx.collection || null };
       }
     }
-    // Fallback: legacy in manifests subdir
+    // Legacy manifests index retained for backward compatibility
     if (fs.existsSync(IIIF_CACHE_INDEX_MANIFESTS)) {
       const idx = await readJson(IIIF_CACHE_INDEX_MANIFESTS);
       if (idx && typeof idx === "object") {
@@ -406,8 +406,9 @@ async function ensureFeaturedInCache(cfg) {
         }
       } catch (_) {}
     }
-  } catch (_) {
-    // ignore failures; fallback SSR will still render a minimal hero without content
+  } catch (err) {
+    const message = err && err.message ? err.message : err;
+    throw new Error(`[iiif] Failed to populate featured cache: ${message}`);
   }
 }
 
@@ -643,33 +644,20 @@ async function buildIiifCollectionPages(CONFIG) {
     1200;
 
   // Compile the works layout component once per run
+  const worksLayoutPath = path.join(CONTENT_DIR, "works", "_layout.mdx");
+  if (!fs.existsSync(worksLayoutPath)) {
+    throw new Error(
+      "IIIF build requires content/works/_layout.mdx. Create the layout instead of relying on generated output."
+    );
+  }
   let WorksLayoutComp = null;
   try {
-    const worksLayoutPath = path.join(CONTENT_DIR, "works", "_layout.mdx");
     WorksLayoutComp = await mdx.compileMdxToComponent(worksLayoutPath);
-  } catch (_) {
-    // Minimal fallback layout if missing or fails to compile
-    WorksLayoutComp = function FallbackWorksLayout({ manifest }) {
-      const title = firstLabelString(manifest && manifest.label);
-      return React.createElement(
-        "div",
-        { className: "content" },
-        React.createElement("h1", null, title || "Untitled"),
-        // Render viewer placeholder for hydration
-        React.createElement(
-          "div",
-          { "data-canopy-viewer": "1" },
-          React.createElement("script", {
-            type: "application/json",
-            dangerouslySetInnerHTML: {
-              __html: JSON.stringify({
-                iiifContent: manifest && (manifest.id || ""),
-              }),
-            },
-          })
-        )
-      );
-    };
+  } catch (err) {
+    const message = err && err.message ? err.message : err;
+    throw new Error(
+      `Failed to compile content/works/_layout.mdx: ${message}`
+    );
   }
 
   for (let ci = 0; ci < chunks; ci++) {
@@ -808,20 +796,8 @@ async function buildIiifCollectionPages(CONFIG) {
             href = withBase(href);
             return React.createElement("a", { href, ...rest }, props.children);
           };
-          // Map exported UI components into MDX, with sensible aliases/fallbacks
+          // Map exported UI components into MDX and add anchor helper
           const compMap = { ...components, a: Anchor };
-          if (!compMap.SearchPanel && compMap.CommandPalette) {
-            compMap.SearchPanel = compMap.CommandPalette;
-          }
-          if (!components.HelloWorld) {
-            components.HelloWorld = components.Fallback
-              ? (props) =>
-                  React.createElement(components.Fallback, {
-                    name: "HelloWorld",
-                    ...props,
-                  })
-              : () => null;
-          }
           let MDXProvider = null;
           try {
             const mod = await import("@mdx-js/react");
@@ -852,13 +828,6 @@ async function buildIiifCollectionPages(CONFIG) {
                   React.createElement(app.Head)
                 )
               : "";
-          const cssRel = path
-            .relative(
-              path.dirname(outPath),
-              path.join(OUT_DIR, "styles", "styles.css")
-            )
-            .split(path.sep)
-            .join("/");
           const needsHydrateViewer = body.includes("data-canopy-viewer");
           const needsRelated = body.includes("data-canopy-related-items");
           const needsHero = body.includes("data-canopy-hero");
@@ -966,7 +935,7 @@ async function buildIiifCollectionPages(CONFIG) {
           let html = htmlShell({
             title,
             body: pageBody,
-            cssHref: cssRel || "styles/styles.css",
+            cssHref: null,
             scriptHref: jsRel,
             headExtra: vendorTag + headExtra,
           });

package/lib/build/mdx.js

@@ -101,7 +101,7 @@ async function loadUiComponents() {
       }
     }
     if (!mod) {
-      // Try package subpath as a secondary resolution path (not a UI component fallback)
+      // Try package subpath as a secondary resolution path to avoid export-map issues
       try {
         mod = await import('@canopy-iiif/app/ui/server');
       } catch (e2) {
@@ -112,7 +112,7 @@ async function loadUiComponents() {
     }
     let comp = (mod && typeof mod === 'object') ? mod : {};
     // Hard-require core exports; do not inject fallbacks
-    const required = ['SearchPanel', 'CommandPalette', 'SearchResults', 'SearchSummary', 'SearchTabs', 'Viewer', 'Slider', 'RelatedItems'];
+    const required = ['SearchPanel', 'CommandPalette', 'SearchResults', 'SearchSummary', 'SearchTabs', 'Viewer', 'Slider', 'RelatedItems', 'Hero', 'FeaturedHero'];
     const missing = required.filter((k) => !comp || !comp[k]);
     if (missing.length) {
       throw new Error('[canopy][mdx] Missing UI exports: ' + missing.join(', '));
@@ -128,41 +128,6 @@ async function loadUiComponents() {
         Slider: !!comp.Slider,
       }); } catch(_){}
     }
-    // No stub injection beyond this point; UI package must supply these.
-    // Ensure a minimal SSR Hero exists
-    if (!comp.Hero) {
-      comp.Hero = function SimpleHero({ height = 360, item, className = '', style = {}, ...rest }){
-        const h = typeof height === 'number' ? `${height}px` : String(height || '').trim() || '360px';
-        const base = { position: 'relative', width: '100%', height: h, overflow: 'hidden', backgroundColor: 'var(--color-gray-muted)', ...style };
-        const title = (item && item.title) || '';
-        const href = (item && item.href) || '#';
-        const thumbnail = (item && item.thumbnail) || '';
-        return React.createElement('div', { className: ['canopy-hero', className].filter(Boolean).join(' '), style: base, ...rest },
-          thumbnail ? React.createElement('img', { src: thumbnail, alt: '', 'aria-hidden': 'true', style: { position:'absolute', inset:0, width:'100%', height:'100%', objectFit:'cover', objectPosition:'center', filter:'none' } }) : null,
-          React.createElement('div', { className:'canopy-hero-overlay', style: { position:'absolute', left:0, right:0, bottom:0, padding:'1rem', background:'linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.35) 55%, rgba(0,0,0,0.65) 100%)', color:'white' } },
-            React.createElement('h3', { style: { margin:0, fontSize:'1.5rem', fontWeight:600, lineHeight:1.2, textShadow:'0 1px 3px rgba(0,0,0,0.6)' } },
-              React.createElement('a', { href, style:{ color:'inherit', textDecoration:'none' }, className:'canopy-hero-link' }, title)
-            )
-          )
-        );
-      };
-    }
-    // Provide a minimal SSR FeaturedHero fallback if missing
-    if (!comp.FeaturedHero) {
-      try {
-        const helpers = require('../components/featured');
-        comp.FeaturedHero = function FeaturedHero(props) {
-          try {
-            const list = helpers && helpers.readFeaturedFromCacheSync ? helpers.readFeaturedFromCacheSync() : [];
-            if (!Array.isArray(list) || list.length === 0) return null;
-            const index = (props && typeof props.index === 'number') ? Math.max(0, Math.min(list.length - 1, Math.floor(props.index))) : null;
-            const pick = (index != null) ? index : ((props && (props.random === true || props.random === 'true')) ? Math.floor(Math.random() * list.length) : 0);
-            const item = list[pick] || list[0];
-            return React.createElement(comp.Hero, { ...props, item });
-          } catch (_) { return null; }
-        };
-      } catch (_) { /* ignore */ }
-    }
     UI_COMPONENTS = comp;
     UI_COMPONENTS_PATH = currentPath;
     UI_COMPONENTS_MTIME = currentMtime;
@@ -174,8 +139,11 @@ async function loadUiComponents() {
 }
 
 function extractTitle(mdxSource) {
-  const { content } = parseFrontmatter(String(mdxSource || ""));
-  const m = content.match(/^\s*#\s+(.+)\s*$/m);
+  const { data, content } = parseFrontmatter(String(mdxSource || ""));
+  if (data && typeof data.title === "string" && data.title.trim()) {
+    return data.title.trim();
+  }
+  const m = content.match(/^\s*#{1,6}\s+(.+?)\s*$/m);
   return m ? m[1].trim() : "Untitled";
 }
 
@@ -265,26 +233,9 @@ async function loadAppWrapper() {
     ok = false;
   }
   if (!ok) {
-    // If default export swallowed children, try to recover using __MDXLayout
-    if (!App && mod.__MDXLayout) {
-      App = mod.__MDXLayout;
-    }
-    // Fallback to pass-through wrapper to avoid blocking builds
-    if (!App) {
-      App = function PassThrough(props) {
-        return React.createElement(React.Fragment, null, props.children);
-      };
-    }
-    try {
-      require("./log").log(
-        "! Warning: content/_app.mdx did not clearly render {children}; proceeding with best-effort wrapper\n",
-        "yellow"
-      );
-    } catch (_) {
-      console.warn(
-        "Warning: content/_app.mdx did not clearly render {children}; proceeding."
-      );
-    }
+    throw new Error(
+      "content/_app.mdx must render {children}. Update the layout so downstream pages receive their content."
+    );
   }
   APP_WRAPPER = { App, Head };
   return APP_WRAPPER;
@@ -390,7 +341,7 @@ async function ensureClientRuntime() {
       esbuild = require("esbuild");
     } catch (_) {}
   }
-  if (!esbuild) return;
+  if (!esbuild) throw new Error('Viewer runtime bundling requires esbuild. Install dependencies before building.');
   ensureDirSync(OUT_DIR);
   const scriptsDir = path.join(OUT_DIR, 'scripts');
   ensureDirSync(scriptsDir);
@@ -509,6 +460,9 @@ async function ensureClientRuntime() {
 async function ensureFacetsRuntime() {
   let esbuild = null;
   try { esbuild = require("../../ui/node_modules/esbuild"); } catch (_) { try { esbuild = require("esbuild"); } catch (_) {} }
+  if (!esbuild) {
+    throw new Error('RelatedItems runtime bundling requires esbuild. Install dependencies before building.');
+  }
   ensureDirSync(OUT_DIR);
   const scriptsDir = path.join(OUT_DIR, 'scripts');
   ensureDirSync(scriptsDir);
@@ -589,18 +543,30 @@ async function ensureFacetsRuntime() {
     });
   `;
   const shim = { name: 'facets-vanilla', setup(){} };
-  if (esbuild) {
-    try {
-      await esbuild.build({ stdin: { contents: entry, resolveDir: process.cwd(), sourcefile: 'canopy-facets-entry.js', loader: 'js' }, outfile: outFile, platform: 'browser', format: 'iife', bundle: true, sourcemap: false, target: ['es2018'], logLevel: 'silent', minify: true, plugins: [shim] });
-    } catch(e){ try{ console.error('RelatedItems: bundle error:', e && e.message ? e.message : e); }catch(_){ }
-      // Fallback: write the entry script directly so the file exists
-      try { fs.writeFileSync(outFile, entry, 'utf8'); } catch(_){}
-      return; }
-    try { const { logLine } = require('./log'); let size=0; try{ const st = fs.statSync(outFile); size = st && st.size || 0; }catch(_){} const kb = size ? ` (${(size/1024).toFixed(1)} KB)` : ''; const rel = path.relative(process.cwd(), outFile).split(path.sep).join('/'); logLine(`✓ Wrote ${rel}${kb}`, 'cyan'); } catch(_){}
-  } else {
-    // No esbuild: write a non-bundled version (no imports used)
-    try { fs.writeFileSync(outFile, entry, 'utf8'); } catch(_){}
+  try {
+    await esbuild.build({
+      stdin: { contents: entry, resolveDir: process.cwd(), sourcefile: 'canopy-facets-entry.js', loader: 'js' },
+      outfile: outFile,
+      platform: 'browser',
+      format: 'iife',
+      bundle: true,
+      sourcemap: false,
+      target: ['es2018'],
+      logLevel: 'silent',
+      minify: true,
+      plugins: [shim]
+    });
+  } catch (e) {
+    const message = e && e.message ? e.message : e;
+    throw new Error(`RelatedItems runtime build failed: ${message}`);
   }
+  try {
+    const { logLine } = require('./log');
+    let size = 0; try { const st = fs.statSync(outFile); size = st && st.size || 0; } catch (_) {}
+    const kb = size ? ` (${(size/1024).toFixed(1)} KB)` : '';
+    const rel = path.relative(process.cwd(), outFile).split(path.sep).join('/');
+    logLine(`✓ Wrote ${rel}${kb}`, 'cyan');
+  } catch (_) {}
 }
 
 // Bundle a separate client runtime for the Clover Slider to keep payloads split.
@@ -611,7 +577,7 @@ async function ensureSliderRuntime() {
   } catch (_) {
     try { esbuild = require("esbuild"); } catch (_) {}
   }
-  if (!esbuild) return;
+  if (!esbuild) throw new Error('Slider runtime bundling requires esbuild. Install dependencies before building.');
   ensureDirSync(OUT_DIR);
   const scriptsDir = path.join(OUT_DIR, 'scripts');
   ensureDirSync(scriptsDir);
@@ -735,8 +701,8 @@ async function ensureSliderRuntime() {
       plugins: [plugin],
     });
   } catch (e) {
-    try { console.error('Slider: bundle error:', e && e.message ? e.message : e); } catch (_) {}
-    return;
+    const message = e && e.message ? e.message : e;
+    throw new Error(`Slider runtime build failed: ${message}`);
   }
   try {
     const { logLine } = require('./log');
@@ -757,7 +723,7 @@ async function ensureReactGlobals() {
       esbuild = require("esbuild");
     } catch (_) {}
   }
-  if (!esbuild) return;
+  if (!esbuild) throw new Error('React globals bundling requires esbuild. Install dependencies before building.');
   const { path } = require("../common");
   ensureDirSync(OUT_DIR);
   const scriptsDir = path.join(OUT_DIR, "scripts");
@@ -792,7 +758,7 @@ async function ensureReactGlobals() {
 async function ensureHeroRuntime() {
   let esbuild = null;
   try { esbuild = require("../../ui/node_modules/esbuild"); } catch (_) { try { esbuild = require("esbuild"); } catch (_) {} }
-  if (!esbuild) return;
+  if (!esbuild) throw new Error('Hero runtime bundling requires esbuild. Install dependencies before building.');
   const { path } = require("../common");
   ensureDirSync(OUT_DIR);
   const scriptsDir = path.join(OUT_DIR, 'scripts');

package/lib/build/pages.js

@@ -45,10 +45,6 @@ async function renderContentMdxToHtml(filePath, outPath, extraProps = {}) {
   const source = await fsp.readFile(filePath, 'utf8');
   const title = mdx.extractTitle(source);
   const { body, head } = await mdx.compileMdxFile(filePath, outPath, null, extraProps);
-  const cssRel = path
-    .relative(path.dirname(outPath), path.join(OUT_DIR, 'styles', 'styles.css'))
-    .split(path.sep)
-    .join('/');
   const needsHydrateViewer = body.includes('data-canopy-viewer');
   const needsHydrateSlider = body.includes('data-canopy-slider');
   const needsCommand = true; // command runtime is global
@@ -96,7 +92,7 @@ async function renderContentMdxToHtml(filePath, outPath, extraProps = {}) {
   if (sliderRel && jsRel !== sliderRel) extraScripts.push(`<script defer src="${sliderRel}"></script>`);
   if (commandRel && jsRel !== commandRel) extraScripts.push(`<script defer src="${commandRel}"></script>`);
   if (extraScripts.length) headExtra = extraScripts.join('') + headExtra;
-  const html = htmlShell({ title, body, cssHref: cssRel || 'styles.css', scriptHref: jsRel, headExtra: vendorTag + headExtra });
+  const html = htmlShell({ title, body, cssHref: null, scriptHref: jsRel, headExtra: vendorTag + headExtra });
   const { applyBaseToHtml } = require('../common');
   return applyBaseToHtml(html);
 }

package/lib/build/runtimes.js

@@ -1,12 +1,10 @@
-
 const { logLine } = require('./log');
-const { fs, fsp, path, OUT_DIR, ensureDirSync } = require('../common');
+const { fs, path, OUT_DIR, ensureDirSync } = require('../common');
 
 async function prepareAllRuntimes() {
   const mdx = require('./mdx');
   try { await mdx.ensureClientRuntime(); } catch (_) {}
   try { if (typeof mdx.ensureSliderRuntime === 'function') await mdx.ensureSliderRuntime(); } catch (_) {}
-  // Optional: Hero runtime is SSR-only by default; enable explicitly to avoid bundling Node deps in browser
   try {
     if (process.env.CANOPY_ENABLE_HERO_RUNTIME === '1' || process.env.CANOPY_ENABLE_HERO_RUNTIME === 'true') {
       if (typeof mdx.ensureHeroRuntime === 'function') await mdx.ensureHeroRuntime();
@@ -14,121 +12,60 @@ async function prepareAllRuntimes() {
   } catch (_) {}
   try { if (typeof mdx.ensureFacetsRuntime === 'function') await mdx.ensureFacetsRuntime(); } catch (_) {}
   try { if (typeof mdx.ensureReactGlobals === 'function') await mdx.ensureReactGlobals(); } catch (_) {}
-  try { await ensureCommandFallback(); } catch (_) {}
+  await prepareCommandRuntime();
   try { logLine('✓ Prepared client hydration runtimes', 'cyan', { dim: true }); } catch (_) {}
 }
 
-module.exports = { prepareAllRuntimes };
+async function resolveEsbuild() {
+  try { return require('../../ui/node_modules/esbuild'); } catch (_) {
+    try { return require('esbuild'); } catch (_) {
+      return null;
+    }
+  }
+}
 
-async function ensureCommandFallback() {
-  const cmdOut = path.join(OUT_DIR, 'scripts', 'canopy-command.js');
-  ensureDirSync(path.dirname(cmdOut));
-  const fallback = `
-      (function(){
-        function ready(fn){ if(document.readyState==='loading') document.addEventListener('DOMContentLoaded', fn, { once: true }); else fn(); }
-        function parseProps(el){ try{ const s = el.querySelector('script[type="application/json"]'); if(s) return JSON.parse(s.textContent||'{}'); }catch(_){ } return {}; }
-        function norm(s){ try{ return String(s||'').toLowerCase(); }catch(_){ return ''; } }
-        function withBase(href){
-          try{
-            var raw = href == null ? '' : String(href);
-            raw = raw.trim();
-            if(!raw) return raw;
-            var bp = (window && window.CANOPY_BASE_PATH) ? String(window.CANOPY_BASE_PATH) : '';
-            if(!bp){
-              if(/^[a-z][a-z0-9+.-]*:/i.test(raw) || raw.indexOf('//') === 0 || raw.charAt(0)==='#' || raw.charAt(0)==='?') return raw;
-              var cleaned = raw.replace(/^\\/+/, '');
-              while(cleaned.indexOf('./') === 0) cleaned = cleaned.slice(2);
-              while(cleaned.indexOf('../') === 0) cleaned = cleaned.slice(3);
-              if(!cleaned) return '/';
-              return '/' + cleaned;
-            }
-            if(/^https?:/i.test(raw)) return raw;
-            var clean = raw.replace(/^\\/+/, '');
-            return (bp.endsWith('/') ? bp.slice(0,-1) : bp) + '/' + clean;
-          } catch(_){ return href; }
-        }
-        function rootBase(){ try { var bp = (window && window.CANOPY_BASE_PATH) ? String(window.CANOPY_BASE_PATH) : ''; return bp && bp.endsWith('/') ? bp.slice(0,-1) : bp; } catch(_) { return ''; } }
-        function isOnSearchPage(){ try{ var base=rootBase(); var p=String(location.pathname||''); if(base && p.startsWith(base)) p=p.slice(base.length); if(p.endsWith('/')) p=p.slice(0,-1); return p==='/search'; }catch(_){ return false; } }
-        async function loadRecords(){ try{ var v=''; try{ var m = await fetch(rootBase() + '/api/index.json').then(function(r){return r&&r.ok?r.json():null;}).catch(function(){return null;}); v=(m&&m.version)||''; }catch(_){} var res = await fetch(rootBase() + '/api/search-index.json' + (v?('?v='+encodeURIComponent(v)):'')).catch(function(){return null;}); var j = res && res.ok ? await res.json().catch(function(){return[];}) : []; return Array.isArray(j) ? j : (j && j.records) || []; } catch(_){ return []; } }
-        ready(async function(){ var host=document.querySelector('[data-canopy-command]'); if(!host) return; var cfg=parseProps(host)||{}; var maxResults = Number(cfg.maxResults||8)||8; var groupOrder = Array.isArray(cfg.groupOrder)?cfg.groupOrder:['work','page']; var onSearchPage = isOnSearchPage();
-        var panel = (function(){ try{ return host.querySelector('[data-canopy-command-panel]') || null; }catch(_){ return null; } })();
-        if(!panel) return; // no SSR panel present; do nothing
-        try{ var rel=host.querySelector('.relative'); if(rel && !onSearchPage) rel.setAttribute('data-canopy-panel-auto','1'); }catch(_){}
-        if(onSearchPage){ panel.style.display='none'; }
-        var list=panel.querySelector('#cplist');
-        var input = (function(){ try{ return host.querySelector('[data-canopy-command-input]') || null; }catch(_){ return null; } })();
-        if(!input) return; // require SSR input; no dynamic creation
-        // Populate from ?q= URL param if present
-        try {
-          var sp = new URLSearchParams(location.search || '');
-          var qp = sp.get('q');
-          if (qp) input.value = qp;
-        } catch(_) {}
-        // Do not inject legacy trigger buttons or inputs
-        var records = await loadRecords(); function render(items){ list.innerHTML=''; if(!items.length){ panel.style.display='none'; return; } var groups=new Map(); items.forEach(function(r){ var t=String(r.type||'page'); if(!groups.has(t)) groups.set(t, []); groups.get(t).push(r); }); function gl(t){ if(t==='work') return 'Works'; if(t==='page') return 'Pages'; return t.charAt(0).toUpperCase()+t.slice(1);} var ordered=[].concat(groupOrder.filter(function(t){return groups.has(t);})).concat(Array.from(groups.keys()).filter(function(t){return groupOrder.indexOf(t)===-1;})); ordered.forEach(function(t){ var hdr=document.createElement('div'); hdr.textContent=gl(t); hdr.style.cssText='padding:6px 12px;font-weight:600;color:#374151'; list.appendChild(hdr); groups.get(t).forEach(function(r){ var it=document.createElement('div'); it.setAttribute('data-canopy-item',''); it.tabIndex=0; it.style.cssText='display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;outline:none;'; var thumb=(String(r.type||'')==='work' && r.thumbnail)?r.thumbnail:''; if(thumb){ var img=document.createElement('img'); img.src=thumb; img.alt=''; img.style.cssText='width:40px;height:40px;object-fit:cover;border-radius:4px'; it.appendChild(img);} var span=document.createElement('span'); span.textContent=r.title||r.href; it.appendChild(span); it.onmouseenter=function(){ it.style.background='#f8fafc'; }; it.onmouseleave=function(){ it.style.background='transparent'; }; it.onfocus=function(){ it.style.background='#eef2ff'; try{ it.scrollIntoView({ block: 'nearest' }); }catch(_){} }; it.onblur=function(){ it.style.background='transparent'; }; it.onclick=function(){ try{ window.location.href = withBase(String(r.href||'')); }catch(_){} panel.style.display='none'; }; list.appendChild(it); }); }); }
-        function getItems(){ try{ return Array.prototype.slice.call(list.querySelectorAll('[data-canopy-item]')); }catch(_){ return []; } }
-        function filterAndShow(q){ try{ var qq=norm(q); if(!qq){ try{ panel.style.display='block'; list.innerHTML=''; }catch(_){} return; } var out=[]; for(var i=0;i<records.length;i++){ var r=records[i]; var title=String((r&&r.title)||''); if(!title) continue; if(norm(title).indexOf(qq)!==-1) out.push(r); if(out.length>=maxResults) break; } render(out); }catch(_){} }
-        input.addEventListener('input', function(){ if(onSearchPage){ try{ var ev = new CustomEvent('canopy:search:setQuery', { detail: { query: (input.value||'') } }); window.dispatchEvent(ev); }catch(_){ } return; } filterAndShow(input.value||''); });
-        // Keyboard navigation: ArrowDown/ArrowUp to move through items; Enter to select
-        input.addEventListener('keydown', function(e){
-          if(e.key==='ArrowDown'){ e.preventDefault(); try{ var items=getItems(); if(items.length){ panel.style.display='block'; items[0].focus(); } }catch(_){} }
-          else if(e.key==='ArrowUp'){ e.preventDefault(); try{ var items2=getItems(); if(items2.length){ panel.style.display='block'; items2[items2.length-1].focus(); } }catch(_){} }
-        });
-        list.addEventListener('keydown', function(e){
-          var cur = e.target && e.target.closest && e.target.closest('[data-canopy-item]');
-          if(!cur) return;
-          if(e.key==='ArrowDown'){
-            e.preventDefault();
-            try{ var arr=getItems(); var i=arr.indexOf(cur); var nxt=arr[Math.min(arr.length-1, i+1)]||cur; nxt.focus(); }catch(_){}
-          } else if(e.key==='ArrowUp'){
-            e.preventDefault();
-            try{ var arr2=getItems(); var i2=arr2.indexOf(cur); if(i2<=0){ input && input.focus && input.focus(); } else { var prv=arr2[i2-1]; (prv||cur).focus(); } }catch(_){}
-          } else if(e.key==='Enter'){
-            e.preventDefault(); try{ cur.click(); }catch(_){}
-          } else if(e.key==='Escape'){
-            panel.style.display='none'; try{ input && input.focus && input.focus(); }catch(_){}
-          }
-        });
-        document.addEventListener('keydown', function(e){ if(e.key==='Escape'){ panel.style.display='none'; }});
-        document.addEventListener('mousedown', function(e){ try{ if(!panel.contains(e.target) && !host.contains(e.target)){ panel.style.display='none'; } }catch(_){} });
-        // Hotkey support (e.g., mod+k)
-        document.addEventListener('keydown', function(e){
-          try {
-            var want = String((cfg && cfg.hotkey) || '').toLowerCase();
-            if (!want) return;
-            var isMod = e.metaKey || e.ctrlKey;
-            if ((want === 'mod+k' || want === 'cmd+k' || want === 'ctrl+k') && isMod && (e.key === 'k' || e.key === 'K')) {
-              e.preventDefault();
-              if(onSearchPage){ try{ var ev2 = new CustomEvent('canopy:search:setQuery', { detail: { hotkey: true } }); window.dispatchEvent(ev2); }catch(_){ } return; }
-              panel.style.display='block';
-              (input && input.focus && input.focus());
-              filterAndShow(input && input.value || '');
-          }
-          } catch(_) { }
-        });
-        function openPanel(){ if(onSearchPage){ try{ var ev3 = new CustomEvent('canopy:search:setQuery', { detail: {} }); window.dispatchEvent(ev3); }catch(_){ } return; } panel.style.display='block'; (input && input.focus && input.focus()); filterAndShow(input && input.value || ''); }
-        host.addEventListener('click', function(e){ var trg=e.target && e.target.closest && e.target.closest('[data-canopy-command-trigger]'); if(trg){ e.preventDefault(); openPanel(); }});
-        try{ var teaser2 = host.querySelector('[data-canopy-command-input]'); if(teaser2){ teaser2.addEventListener('focus', function(){ openPanel(); }); } }catch(_){}
-      });
-    })();
-      `;
-  await fsp.writeFile(cmdOut, fallback, 'utf8');
-  try { logLine(`✓ Wrote ${path.relative(process.cwd(), cmdOut)} (fallback)`, 'cyan'); } catch (_) {}
+async function prepareCommandRuntime() {
+  const esbuild = await resolveEsbuild();
+  if (!esbuild) throw new Error('Command runtime bundling requires esbuild. Install dependencies before building.');
+  ensureDirSync(OUT_DIR);
+  const scriptsDir = path.join(OUT_DIR, 'scripts');
+  ensureDirSync(scriptsDir);
+  const entry = path.join(__dirname, '..', 'search', 'command-runtime.js');
+  const outFile = path.join(scriptsDir, 'canopy-command.js');
+  await esbuild.build({
+    entryPoints: [entry],
+    outfile: outFile,
+    platform: 'browser',
+    format: 'iife',
+    bundle: true,
+    sourcemap: false,
+    target: ['es2018'],
+    logLevel: 'silent',
+    minify: true,
+  });
+  try {
+    let size = 0;
+    try { const st = fs.statSync(outFile); size = st.size || 0; } catch (_) {}
+    const kb = size ? ` (${(size / 1024).toFixed(1)} KB)` : '';
+    const rel = path.relative(process.cwd(), outFile).split(path.sep).join('/');
+    logLine(`✓ Wrote ${rel}${kb}`, 'cyan');
+  } catch (_) {}
 }
 
 async function prepareSearchRuntime(timeoutMs = 10000, label = '') {
   const search = require('../search/search');
-  try { logLine(`• Writing search runtime${label ? ' ('+label+')' : ''}...`, 'blue', { bright: true }); } catch (_) {}
+  try { logLine(`• Writing search runtime${label ? ' (' + label + ')' : ''}...`, 'blue', { bright: true }); } catch (_) {}
+
   let timedOut = false;
   await Promise.race([
     search.ensureSearchRuntime(),
     new Promise((_, reject) => setTimeout(() => { timedOut = true; reject(new Error('timeout')); }, Number(timeoutMs)))
   ]).catch(() => {
-    try { console.warn(`Search: Bundling runtime timed out${label ? ' ('+label+')' : ''}, skipping`); } catch (_) {}
+    try { console.warn(`Search: Bundling runtime timed out${label ? ' (' + label + ')' : ''}, skipping`); } catch (_) {}
   });
   if (timedOut) {
-    try { logLine(`! Search runtime not bundled${label ? ' ('+label+')' : ''}\n`, 'yellow'); } catch (_) {}
+    try { logLine(`! Search runtime not bundled${label ? ' (' + label + ')' : ''}\n`, 'yellow'); } catch (_) {}
   }
 }
 
-module.exports = { prepareAllRuntimes, ensureCommandFallback, prepareSearchRuntime };
+module.exports = { prepareAllRuntimes, prepareCommandRuntime, prepareSearchRuntime };

package/lib/build/search.js

@@ -165,10 +165,6 @@ async function writeFacetsSearchApi() {
   await fsp.writeFile(dest, JSON.stringify(data, null, 2), 'utf8');
 }
 
-module.exports = { buildFacetsForWorks, writeFacetCollections, writeFacetsSearchApi };
-
-
-
 async function collectMdxPageRecords() {
   const { fs, fsp, path, CONTENT_DIR, rootRelativeHref } = require('../common');
   const mdx = require('./mdx');
@@ -183,7 +179,8 @@ async function collectMdxPageRecords() {
         const base = path.basename(p).toLowerCase();
         const src = await fsp.readFile(p, 'utf8');
         const fm = mdx.parseFrontmatter(src);
-        const title = mdx.extractTitle(src);
+        const titleRaw = mdx.extractTitle(src);
+        const title = typeof titleRaw === 'string' ? titleRaw.trim() : '';
         const rel = path.relative(CONTENT_DIR, p).replace(/\.mdx$/i, '.html');
         if (base !== 'sitemap.mdx') {
           const href = rootRelativeHref(rel.split(path.sep).join('/'));

package/lib/build/styles.js

@@ -70,21 +70,15 @@ async function ensureStyles() {
   }
 
   function resolveTailwindCli() {
-    try {
-      const cliJs = require.resolve("tailwindcss/lib/cli.js");
-      return { cmd: process.execPath, args: [cliJs] };
-    } catch (_) {}
-    try {
-      const localBin = path.join(
-        process.cwd(),
-        "node_modules",
-        ".bin",
-        process.platform === "win32" ? "tailwindcss.cmd" : "tailwindcss"
-      );
-      if (fs.existsSync(localBin)) return { cmd: localBin, args: [] };
-    } catch (_) {}
-    return null;
-  }
+  const localBin = path.join(
+    process.cwd(),
+    "node_modules",
+    ".bin",
+    process.platform === "win32" ? "tailwindcss.cmd" : "tailwindcss"
+  );
+  if (fs.existsSync(localBin)) return { cmd: localBin, args: [] };
+  return { cmd: 'tailwindcss', args: [] };
+}
   function buildTailwindCli({ input, output, config, minify = true }) {
     try {
       const cli = resolveTailwindCli();

package/lib/common.js

@@ -26,13 +26,13 @@ function readYamlConfigBaseUrl() {
 // Priority:
 // 1) CANOPY_BASE_URL env
 // 2) canopy.yml → site.baseUrl
-// 3) dev server default http://localhost:PORT (PORT env or 3000)
+// 3) dev server default http://localhost:PORT (PORT env or 5001)
 const BASE_ORIGIN = (() => {
   const env = String(process.env.CANOPY_BASE_URL || '').trim();
   if (env) return env.replace(/\/$/, '');
   const cfg = readYamlConfigBaseUrl();
   if (cfg) return cfg.replace(/\/$/, '');
-  const port = Number(process.env.PORT || 3000);
+  const port = Number(process.env.PORT || 5001);
   return `http://localhost:${port}`;
 })();
 
@@ -50,7 +50,8 @@ async function cleanDir(dir) {
 function htmlShell({ title, body, cssHref, scriptHref, headExtra }) {
   const scriptTag = scriptHref ? `<script defer src="${scriptHref}"></script>` : '';
   const extra = headExtra ? String(headExtra) : '';
-  return `<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>${title}</title>${extra}<link rel="stylesheet" href="${cssHref}">${scriptTag}</head><body>${body}</body></html>`;
+  const cssTag = cssHref ? `<link rel="stylesheet" href="${cssHref}">` : '';
+  return `<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>${title}</title>${extra}${cssTag}${scriptTag}</head><body>${body}</body></html>`;
 }
 
 function withBase(href) {
@@ -114,11 +115,18 @@ function absoluteUrl(p) {
 function applyBaseToHtml(html) {
   if (!BASE_PATH) return html;
   try {
-    let out = String(html || '');
-    // Avoid protocol-relative (//example.com) by using a negative lookahead
-    out = out.replace(/(href|src)=(\")\/(?!\/)/g, `$1=$2${BASE_PATH}/`);
-    out = out.replace(/(href|src)=(\')\/(?!\/)/g, `$1=$2${BASE_PATH}/`);
-    return out;
+    const out = String(html || '');
+    const normalizedBase = BASE_PATH.startsWith('/')
+      ? BASE_PATH.replace(/\/$/, '')
+      : `/${BASE_PATH.replace(/\/$/, '')}`;
+    if (!normalizedBase || normalizedBase === '/') return out;
+    const pattern = /(href|src)=(['"])(\/(?!\/)[^'"\s]*)\2/g;
+    return out.replace(pattern, (match, attr, quote, path) => {
+      if (path === normalizedBase || path.startsWith(`${normalizedBase}/`)) {
+        return match;
+      }
+      return `${attr}=${quote}${normalizedBase}${path}${quote}`;
+    });
   } catch (_) {
     return html;
   }