@riebeckite/honox 0.0.31 → 0.0.32

package/dist/index.js

@@ -1167,7 +1167,7 @@ function isOutputCacheState(value) {
 }
 function isOutputInventory(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value) && Object.entries(value).every(
-    ([outputPath, checksum]) => isSafeLogicalOutputPath(outputPath) && isChecksum(checksum)
+    ([outputPath2, checksum]) => isSafeLogicalOutputPath(outputPath2) && isChecksum(checksum)
   );
 }
 function isOutputCacheEntries(value) {
@@ -1175,7 +1175,7 @@ function isOutputCacheEntries(value) {
     return false;
   }
   return Object.entries(value).every(
-    ([outputPath, entry]) => isSafeLogicalOutputPath(outputPath) && typeof entry === "object" && entry !== null && typeof entry.cachePath === "string" && entry.cachePath === outputCacheEntryName(outputPath) && isChecksum(entry.checksum)
+    ([outputPath2, entry]) => isSafeLogicalOutputPath(outputPath2) && typeof entry === "object" && entry !== null && typeof entry.cachePath === "string" && entry.cachePath === outputCacheEntryName(outputPath2) && isChecksum(entry.checksum)
   );
 }
 function outputCacheEntriesPath(outputCachePath) {
@@ -1184,31 +1184,31 @@ function outputCacheEntriesPath(outputCachePath) {
 async function saveOutputCacheEntries(directory, outputDirectory, outputs, finalOutputInventory, timingsMs) {
   await ensureOutputCacheEntriesDirectory(directory);
   const entries = {};
-  for (const outputPath of Object.keys(outputs).sort()) {
-    assertSafeLogicalOutputPath(outputPath);
-    const existing = outputs[outputPath];
+  for (const outputPath2 of Object.keys(outputs).sort()) {
+    assertSafeLogicalOutputPath(outputPath2);
+    const existing = outputs[outputPath2];
     if (existing.cachePath && existing.checksum) {
-      if (existing.cachePath !== outputCacheEntryName(outputPath) || !isChecksum(existing.checksum)) {
-        throw new Error(`Invalid SSG output cache entry: ${outputPath}`);
+      if (existing.cachePath !== outputCacheEntryName(outputPath2) || !isChecksum(existing.checksum)) {
+        throw new Error(`Invalid SSG output cache entry: ${outputPath2}`);
       }
-      entries[outputPath] = existing;
+      entries[outputPath2] = existing;
       continue;
     }
-    const source = resolveOutputCacheFile(outputDirectory, outputPath);
-    const cachePath = outputCacheEntryName(outputPath);
+    const source = resolveOutputCacheFile(outputDirectory, outputPath2);
+    const cachePath = outputCacheEntryName(outputPath2);
     const destination = join3(directory, cachePath);
     await waitForFaultInjection("entry-create-start");
     await replaceOutputCacheEntry(source, destination, timingsMs);
-    const checksum = finalOutputInventory?.[outputPath];
+    const checksum = finalOutputInventory?.[outputPath2];
     if (!checksum) {
       const cachedChecksum = await checksumFile(destination);
       if (!cachedChecksum) {
-        throw new Error(`Could not checksum cached output: ${outputPath}`);
+        throw new Error(`Could not checksum cached output: ${outputPath2}`);
       }
-      entries[outputPath] = { cachePath, checksum: cachedChecksum };
+      entries[outputPath2] = { cachePath, checksum: cachedChecksum };
       continue;
     }
-    entries[outputPath] = { cachePath, checksum };
+    entries[outputPath2] = { cachePath, checksum };
   }
   return entries;
 }
@@ -1216,8 +1216,8 @@ async function validateOutputCacheEntries(outputCachePath, entries, timingsMs) {
   try {
     const directory = outputCacheEntriesPath(outputCachePath);
     if (!await isSafeOutputCacheEntriesDirectory(directory)) return false;
-    for (const [outputPath, entry] of Object.entries(entries)) {
-      if (!isSafeLogicalOutputPath(outputPath) || entry.cachePath !== outputCacheEntryName(outputPath) || !isChecksum(entry.checksum)) {
+    for (const [outputPath2, entry] of Object.entries(entries)) {
+      if (!isSafeLogicalOutputPath(outputPath2) || entry.cachePath !== outputCacheEntryName(outputPath2) || !isChecksum(entry.checksum)) {
         return false;
       }
       const path11 = resolveOutputCacheFile(directory, entry.cachePath);
@@ -1358,8 +1358,8 @@ function assertSafeLogicalOutputPath(path11) {
     throw new Error(`Invalid SSG output path: ${path11}`);
   }
 }
-function outputCacheEntryName(outputPath) {
-  return createHash3("sha256").update(outputPath).digest("hex");
+function outputCacheEntryName(outputPath2) {
+  return createHash3("sha256").update(outputPath2).digest("hex");
 }
 function isChecksum(value) {
   return typeof value === "string" && /^[a-f0-9]{64}$/u.test(value);
@@ -1595,7 +1595,7 @@ function riebeckiteSsg(options = {}) {
         );
         viteClientAssetPaths = [
           .../* @__PURE__ */ new Set([...viteClientAssetPaths, ...Object.keys(bundle)])
-        ].filter((outputPath) => !siteOwnedOutputPaths.has(outputPath)).sort();
+        ].filter((outputPath2) => !siteOwnedOutputPaths.has(outputPath2)).sort();
         const siteOutputCollisions = findBuildOutputSiteCollisions(
           Object.keys(bundle),
           siteOwnedOutputPaths
@@ -2091,12 +2091,18 @@ function riebeckiteClientModule(getConfig) {
 }
 function createClientModule(config, development) {
   const imports = [];
-  const initializers = [];
+  const appInitializers = [];
+  const pageInitializers = [];
+  imports.push('import { ClientLifecycle } from "@riebeckite/core/client";');
+  if (config.spa !== void 0) {
+    imports.push('import { createClient } from "honox/client";');
+    imports.push('import { startSpaNavigation } from "@riebeckite/spa";');
+  }
   if (development) {
     imports.push(
       'import { initDevelopmentInspector } from "virtual:riebeckite/development-inspector";'
     );
-    initializers.push("initDevelopmentInspector()");
+    appInitializers.push("initDevelopmentInspector()");
   }
   for (const [index, entry] of config.plugins.flatMap((plugin) => plugin.clientEntries ?? []).entries()) {
     const localName = `pluginClientInitializer${index}`;
@@ -2105,41 +2111,123 @@ function createClientModule(config, development) {
       `import ${importTarget} from ${JSON.stringify(entry.moduleSpecifier)};`
     );
     const publicConfig = entry.publicConfig;
-    const initializer = publicConfig === void 0 ? `${localName}()` : `${localName}(${serializePublicClientConfig(publicConfig)})`;
+    const serializedConfig = publicConfig === void 0 ? "undefined" : serializePublicClientConfig(publicConfig);
+    const initializer = entry.initializerArguments === "context" ? `${localName}(context)` : entry.initializerArguments === "root" ? `${localName}(context.root)` : `${localName}(context.config)`;
+    const initializers = entry.scope === "app" ? appInitializers : pageInitializers;
     initializers.push(
-      `runPluginClientInitializer(${JSON.stringify(entry.moduleSpecifier)}, () => ${initializer})`
+      `mountPluginClientInitializer(${JSON.stringify(entry.scope ?? "page")}, ${JSON.stringify(entry.moduleSpecifier)}, root, ${serializedConfig}, (context) => ${initializer})`
     );
   }
   return `${imports.join("\n")}
 
-function runPluginClientInitializer(name, initialize) {
-  try {
-    const result = initialize();
-    if (result && typeof result.then === "function") {
-      result.catch((error) => reportPluginClientError(name, error));
-    }
-  } catch (error) {
-    reportPluginClientError(name, error);
-  }
+const lifecycle = new ClientLifecycle();
+let stopSpaNavigation;
+
+function mountPluginClientInitializer(scope, name, root, config, initialize) {
+  void lifecycle.mount({ scope, name, root, config, initialize });
+}
+
+function mountAppClientInitializers(root) {
+${appInitializers.map((initializer) => `  ${initializer};`).join("\n")}
 }
 
-function reportPluginClientError(name, error) {
-  console.error("[riebeckite] Plugin client initializer failed: " + name, error);
+function mountPageClientInitializers(root) {
+${pageInitializers.map((initializer) => `  ${initializer};`).join("\n")}
 }
 
 export function initRiebeckiteClient() {
-${initializers.map((initializer) => `  ${initializer};`).join("\n")}
+  mountAppClientInitializers(document);
+  mountPageClientInitializers(document.querySelector("#main-content") ?? document);
+${config.spa === void 0 ? "" : `  stopSpaNavigation ??= startSpaNavigation({
+    ...${serializePublicClientConfig(config.spa)},
+    onBeforePageCommit: () => lifecycle.unmount("page"),
+    onPageCommit: async ({ root, signal }) => {
+      if (signal.aborted) return;
+      await createClient();
+      if (signal.aborted || !root.isConnected) return;
+      mountPageClientInitializers(root);
+    },
+  });`}
+}
+
+export async function remountRiebeckitePage(root) {
+  await lifecycle.unmount("page");
+  mountPageClientInitializers(root);
+}
+
+export async function disposeRiebeckiteClient() {
+  stopSpaNavigation?.();
+  stopSpaNavigation = undefined;
+  await lifecycle.dispose();
 }
 `;
 }
 
 // src/development_inspector.ts
-import { collectDevelopmentDiagnostics } from "@riebeckite/diagnostics";
+import {
+  buildOutputPlan as buildOutputPlan2,
+  ContentManager,
+  FileSystemContentSource
+} from "@riebeckite/core";
+import {
+  collectDevelopmentDiagnostics,
+  diagnoseOutputPlan,
+  sortDevelopmentDiagnostics
+} from "@riebeckite/diagnostics";
 var clientModuleId2 = "virtual:riebeckite/development-inspector";
 var resolvedClientModuleId2 = `\0${clientModuleId2}`;
-var endpointPath = "/__riebeckite/inspector/report";
+var reportPath = "/__riebeckite/inspector/report";
+var outputPath = "/__riebeckite/inspector/output";
+var listedOutputLimit = 20;
 function riebeckiteDevelopmentInspector(getApplication) {
   let revision = 0;
+  let inspection = null;
+  const inspectApplication = (application, currentRevision) => {
+    if (inspection?.revision === currentRevision && inspection.application === application) {
+      return inspection;
+    }
+    if (inspection) {
+      const previous = inspection;
+      const disposePrevious = () => {
+        void previous.dispose().catch(() => {
+        });
+      };
+      void Promise.allSettled([previous.report, previous.output]).then(
+        disposePrevious
+      );
+      inspection = null;
+    }
+    const content = createInspectionContent(application);
+    let disposed = false;
+    const dispose = async () => {
+      if (disposed) return;
+      disposed = true;
+      await content.dispose();
+    };
+    const report = collectDevelopmentDiagnostics({
+      config: application.config,
+      content,
+      revision: currentRevision,
+      includeOutput: false
+    });
+    const output = report.then(
+      () => inspectContentOutputs(content),
+      () => inspectContentOutputs(content)
+    );
+    const entry = {
+      application,
+      revision: currentRevision,
+      report,
+      output,
+      dispose
+    };
+    inspection = entry;
+    void report.catch(() => {
+      if (inspection === entry) inspection = null;
+      void output.then(dispose, dispose);
+    });
+    return entry;
+  };
   return {
     name: "riebeckite-development-inspector",
     apply: "serve",
@@ -2151,7 +2239,7 @@ function riebeckiteDevelopmentInspector(getApplication) {
       return id === resolvedClientModuleId2 ? inspectorClientModule() : null;
     },
     configureServer(server) {
-      const middleware = async (request, response) => {
+      const reportMiddleware = async (request, response) => {
         if (!isLocalRequest(request.headers.host, server)) {
           response.statusCode = 403;
           response.end();
@@ -2159,25 +2247,16 @@ function riebeckiteDevelopmentInspector(getApplication) {
         }
         try {
           const application = getApplication();
-          const report = await collectDevelopmentDiagnostics({
-            config: application.config,
-            revision
-          });
+          const report = await inspectApplication(application, revision).report;
           response.setHeader("content-type", "application/json; charset=utf-8");
           response.setHeader("cache-control", "no-store");
-          const currentPage = currentPageFromRequest(request.url);
           response.end(
             JSON.stringify({
               ...report,
               generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
-              currentPage,
+              currentPage: currentPageFromRequest(request.url),
               theme: application.config.theme.name,
-              plugins: application.config.plugins.map((plugin) => plugin.name),
-              capabilities: {
-                dependencies: "unavailable",
-                output: "unavailable",
-                pageMetadata: "unavailable"
-              }
+              plugins: application.config.plugins.map((plugin) => plugin.name)
             })
           );
         } catch {
@@ -2186,8 +2265,39 @@ function riebeckiteDevelopmentInspector(getApplication) {
           response.end(JSON.stringify({ code: "INSPECTOR_REPORT_FAILED" }));
         }
       };
-      server.middlewares.use(endpointPath, middleware);
-      return () => prioritizeMiddleware(server, middleware);
+      const outputMiddleware = async (request, response) => {
+        if (!isLocalRequest(request.headers.host, server)) {
+          response.statusCode = 403;
+          response.end();
+          return;
+        }
+        try {
+          const application = getApplication();
+          const entry = inspectApplication(application, revision);
+          const result = await entry.output;
+          response.setHeader("content-type", "application/json; charset=utf-8");
+          response.setHeader("cache-control", "no-store");
+          response.end(
+            JSON.stringify({
+              version: 1,
+              revision: entry.revision,
+              generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
+              ...result,
+              diagnostics: sortDevelopmentDiagnostics(result.diagnostics)
+            })
+          );
+        } catch {
+          response.statusCode = 500;
+          response.setHeader("content-type", "application/json; charset=utf-8");
+          response.end(JSON.stringify({ code: "INSPECTOR_OUTPUT_FAILED" }));
+        }
+      };
+      server.middlewares.use(reportPath, reportMiddleware);
+      server.middlewares.use(outputPath, outputMiddleware);
+      return () => {
+        prioritizeMiddleware(server, outputMiddleware, outputPath);
+        prioritizeMiddleware(server, reportMiddleware, reportPath);
+      };
     },
     handleHotUpdate({ server }) {
       revision += 1;
@@ -2195,16 +2305,142 @@ function riebeckiteDevelopmentInspector(getApplication) {
     }
   };
 }
+function createInspectionContent(application) {
+  const { config, contentRoot } = application;
+  return new ContentManager(
+    config.content.source ?? new FileSystemContentSource(contentRoot, config.content.exclude),
+    config.content.exclude,
+    { config, commitBuildState: false }
+  );
+}
+async function inspectContentOutputs(content) {
+  try {
+    const changes = await content.getOutputChangeSet();
+    const plan = buildOutputPlan2({
+      inventory: [...changes.affected, ...changes.unchanged],
+      removed: changes.removed,
+      affectedPaths: new Set(changes.affected.map((output) => output.path)),
+      cacheAvailable: changes.unchanged.length > 0
+    });
+    return {
+      output: inspectOutput(changes, plan),
+      dependencies: inspectDependencies(changes),
+      diagnostics: diagnoseOutputPlan(plan)
+    };
+  } catch {
+    return {
+      output: {
+        status: "unavailable",
+        reason: "output inspection failed"
+      },
+      dependencies: {
+        status: "unavailable",
+        reason: "dependency inspection failed"
+      },
+      diagnostics: []
+    };
+  }
+}
+function inspectOutput(changes, plan) {
+  return {
+    status: "available",
+    candidateOutputCount: changes.candidateOutputCount,
+    affectedOutputCount: changes.affectedOutputCount,
+    unchangedOutputCount: changes.unchangedOutputCount,
+    removedOutputCount: changes.removedOutputCount,
+    fullRegenerationRequired: changes.fullRegenerationRequired,
+    conflicts: plan.conflicts.map((conflict) => ({
+      path: conflict.path,
+      owners: conflict.owners
+    })),
+    affected: changes.affected.slice(0, listedOutputLimit).map(listOutput),
+    hiddenAffectedCount: Math.max(
+      0,
+      changes.affected.length - listedOutputLimit
+    ),
+    removed: changes.removed.slice(0, listedOutputLimit).map(listOutput),
+    hiddenRemovedCount: Math.max(0, changes.removed.length - listedOutputLimit)
+  };
+}
+function inspectDependencies(changes) {
+  const outputs = [...changes.affected, ...changes.unchanged];
+  const kinds = /* @__PURE__ */ new Map();
+  const listed = [];
+  let dependencyCount = 0;
+  let dependentOutputCount = 0;
+  let unknownOutputCount = 0;
+  let hiddenOutputCount = 0;
+  for (const output of outputs) {
+    for (const dependency of output.dependencies) {
+      dependencyCount += 1;
+      kinds.set(dependency.type, (kinds.get(dependency.type) ?? 0) + 1);
+    }
+    if (output.dependencies.some(({ type }) => type === "unknown")) {
+      unknownOutputCount += 1;
+    }
+    if (output.dependencies.length === 0) continue;
+    dependentOutputCount += 1;
+    if (listed.length < listedOutputLimit) {
+      listed.push({
+        path: output.path,
+        dependencies: output.dependencies.map(dependencyLabel)
+      });
+    } else {
+      hiddenOutputCount += 1;
+    }
+  }
+  return {
+    status: "available",
+    outputCount: outputs.length,
+    dependentOutputCount,
+    dependencyCount,
+    unknownOutputCount,
+    kinds: [...kinds.entries()].sort(([left], [right]) => left.localeCompare(right)).map(([kind, count]) => ({ kind, count })),
+    outputs: listed,
+    hiddenOutputCount
+  };
+}
+function listOutput(output) {
+  return {
+    path: output.path,
+    kind: output.kind,
+    producer: output.producer
+  };
+}
+function dependencyLabel(dependency) {
+  switch (dependency.type) {
+    case "content":
+      return `content:${dependency.slug}`;
+    case "tag":
+      return `tag:${dependency.tag}`;
+    case "folder":
+      return `folder:${dependency.folder}`;
+    case "file":
+      return `file:${dependency.path}`;
+    case "public-location":
+      return `public-location:${dependency.pathname}`;
+    case "projection":
+      return `projection:${dependency.projection}`;
+    case "external":
+      return `external:${dependency.id}`;
+    case "content-query":
+      return `content-query:${dependency.properties.join(",")}${dependency.unknown ? "?" : ""}`;
+    case "global":
+      return "global";
+    case "unknown":
+      return "unknown";
+  }
+}
 function currentPageFromRequest(url) {
-  const value = new URL(url ?? endpointPath, "http://localhost").searchParams.get(
+  const value = new URL(url ?? reportPath, "http://localhost").searchParams.get(
     "path"
   );
-  return value && value.startsWith("/") && !value.startsWith("//") ? value : "/";
+  return value?.startsWith("/") && !value.startsWith("//") ? value : "/";
 }
-function prioritizeMiddleware(server, middleware) {
+function prioritizeMiddleware(server, middleware, path11) {
   const stack = server.middlewares.stack;
   const index = stack?.findIndex(
-    (layer) => layer.handle === middleware || layer.route === endpointPath
+    (layer) => layer.handle === middleware || layer.route === path11
   ) ?? -1;
   if (index > 0 && stack) stack.unshift(...stack.splice(index, 1));
 }
@@ -2218,7 +2454,8 @@ function isLocalRequest(host, server) {
 }
 function inspectorClientModule() {
   return `
-const endpoint = ${JSON.stringify(endpointPath)};
+const reportEndpoint = ${JSON.stringify(reportPath)};
+const outputEndpoint = ${JSON.stringify(outputPath)};
 const panelId = "riebeckite-development-inspector";
 
 export function initDevelopmentInspector() {
@@ -2228,23 +2465,57 @@ export function initDevelopmentInspector() {
   let generation = 0;
   let report;
   let activeTab = 0;
+  let refreshing = false;
+  let pendingRefresh = false;
+  let loadingTimer;
   const tabs = ["Overview", "Diagnostics", "Dependencies", "Plugins", "Output"];
   const refresh = async () => {
     if (!panel?.isConnected) return;
+    if (refreshing) {
+      pendingRefresh = true;
+      return;
+    }
+    refreshing = true;
     controller?.abort();
     controller = new AbortController();
     const current = ++generation;
     try {
-      const response = await fetch(endpoint + "?path=" + encodeURIComponent(location.pathname), { cache: "no-store", signal: controller.signal });
+      const response = await fetch(reportEndpoint + "?path=" + encodeURIComponent(location.pathname), { cache: "no-store", signal: controller.signal });
       if (!response.ok) throw new Error("Inspector report is unavailable.");
       const next = await response.json();
       if (current !== generation || !panel?.isConnected) return;
       report = next;
       render();
+      void loadOutput(current);
+    } catch (error) {
+      if (error.name === "AbortError" || current !== generation) return;
+      clearInterval(loadingTimer);
+      renderFailure(panel.shadowRoot, error instanceof Error ? error.message : String(error));
+      panel.shadowRoot.querySelector("[data-close]").addEventListener("click", close);
+    } finally {
+      refreshing = false;
+      if (pendingRefresh) {
+        pendingRefresh = false;
+        void refresh();
+      }
+    }
+  };
+  const loadOutput = async (current) => {
+    try {
+      const response = await fetch(outputEndpoint, { cache: "no-store", signal: controller.signal });
+      if (!response.ok) throw new Error("Inspector output is unavailable.");
+      const next = await response.json();
+      if (current !== generation || !panel?.isConnected) return;
+      report.output = next.output;
+      report.dependencies = next.dependencies;
+      report.diagnostics = report.diagnostics.concat(next.diagnostics);
+      report.summary = summarize(report.diagnostics);
+      render();
     } catch (error) {
       if (error.name === "AbortError" || current !== generation) return;
-       renderFailure(panel.shadowRoot, error instanceof Error ? error.message : String(error));
-       panel.shadowRoot.querySelector("[data-close]").addEventListener("click", close);
+      report.output = { status: "unavailable", reason: "output inspection failed" };
+      report.dependencies = { status: "unavailable", reason: "dependency inspection failed" };
+      render();
     }
   };
   const open = () => {
@@ -2252,16 +2523,30 @@ export function initDevelopmentInspector() {
       panel = document.createElement("div");
       panel.id = panelId;
       panel.attachShadow({ mode: "open" });
-      document.body.append(panel);
     }
-    refresh();
+    if (!panel.isConnected) document.body.append(panel);
+    showLoading();
+    void refresh();
   };
   const close = () => {
     generation += 1;
+    pendingRefresh = false;
     controller?.abort();
+    clearInterval(loadingTimer);
     panel?.remove();
     launcher?.focus();
   };
+  const showLoading = () => {
+    if (!panel) return;
+    clearInterval(loadingTimer);
+    panel.shadowRoot.innerHTML = '<style>' + styles + '</style><section role="dialog" aria-modal="false" aria-labelledby="rb-loading-title"><header><strong id="rb-loading-title">Riebeckite Inspector</strong><button type="button" data-close aria-label="Close inspector">Close</button></header><p class="status" aria-live="polite">Loading inspector report…</p></section>';
+    const status = panel.shadowRoot.querySelector(".status");
+    const started = Date.now();
+    loadingTimer = setInterval(() => {
+      if (status?.isConnected) status.textContent = 'Loading inspector report… ' + Math.round((Date.now() - started) / 1000) + 's';
+    }, 1000);
+    panel.shadowRoot.querySelector("[data-close]").addEventListener("click", close);
+  };
   launcher = document.createElement("button");
   launcher.type = "button";
   launcher.textContent = "Inspector";
@@ -2282,8 +2567,9 @@ export function initDevelopmentInspector() {
   import.meta.hot?.on("riebeckite:inspector", refresh);
 
   function render() {
+    clearInterval(loadingTimer);
     const root = panel.shadowRoot;
-    root.innerHTML = '<style>' + styles + '</style><section role="dialog" aria-modal="false" aria-labelledby="rb-title" tabindex="-1"><header><div><strong id="rb-title">Riebeckite Inspector</strong><p>Ctrl+Alt+R</p></div><button type="button" data-close aria-label="Close inspector">Close</button></header><div class="summary"><b>' + report.summary.errors + '</b> errors <b>' + report.summary.warnings + '</b> warnings <b>' + report.summary.info + '</b> info</div><div role="tablist" aria-label="Inspector sections">' + tabs.map((tab, index) => '<button id="rb-tab-' + index + '" role="tab" aria-controls="rb-panel-' + index + '" aria-selected="' + (index === activeTab) + '" tabindex="' + (index === activeTab ? 0 : -1) + '" data-tab="' + index + '">' + tab + '</button>').join("") + '</div><div id="rb-panel-' + activeTab + '" role="tabpanel" aria-labelledby="rb-tab-' + activeTab + '" tabindex="0">' + panelContent() + '</div><p class="status" aria-live="polite">Inspector report updated</p></section>';
+    root.innerHTML = '<style>' + styles + '</style><section role="dialog" aria-modal="false" aria-labelledby="rb-title" tabindex="-1"><header><div><strong id="rb-title">Riebeckite Inspector</strong><p>Ctrl+Alt+R</p></div><button type="button" data-close aria-label="Close inspector">Close</button></header><div class="summary"><b>' + report.summary.errors + '</b> errors <b>' + report.summary.warnings + '</b> warnings <b>' + report.summary.info + '</b> info</div><div role="tablist" aria-label="Inspector sections">' + tabs.map((tab, index) => '<button id="rb-tab-' + index + '" role="tab" aria-controls="rb-panel-' + index + '" aria-selected="' + (index === activeTab) + '" tabindex="' + (index === activeTab ? 0 : -1) + '" data-tab="' + index + '">' + tab + '</button>').join("") + '</div><div id="rb-panel-' + activeTab + '" role="tabpanel" aria-labelledby="rb-tab-' + activeTab + '" tabindex="0">' + panelContent() + '</div><p class="status" aria-live="polite">' + (report.output ? "Inspector report updated" : "Inspector report updated · loading output plan…") + '</p></section>';
     root.querySelector("[data-close]").addEventListener("click", close);
     root.querySelectorAll("[data-tab]").forEach((button) => button.addEventListener("click", () => { activeTab = Number(button.dataset.tab); render(); }));
     root.querySelector("[role=tablist]").addEventListener("keydown", (event) => {
@@ -2298,20 +2584,78 @@ export function initDevelopmentInspector() {
   function panelContent() {
     if (activeTab === 0) return '<dl><dt>Page</dt><dd>' + escapeHtml(report.currentPage) + '</dd><dt>Theme</dt><dd>' + escapeHtml(report.theme) + '</dd><dt>Revision</dt><dd>' + escapeHtml(report.revision) + '</dd></dl>';
     if (activeTab === 1) return diagnosticList(report.diagnostics);
-    if (activeTab === 2) return unavailable("Dependencies", report.capabilities.dependencies);
+    if (activeTab === 2) return dependencyReport(report.dependencies);
     if (activeTab === 3) return '<ul>' + (report.plugins.map((plugin) => '<li>' + escapeHtml(plugin) + '</li>').join("") || "<li>No plugins configured.</li>") + '</ul>';
-    return unavailable("Output", report.capabilities.output);
+    return outputReport(report.output);
   }
 }
 
+function summarize(diagnostics) {
+  return {
+    errors: diagnostics.filter((diagnostic) => diagnostic.severity === "error").length,
+    warnings: diagnostics.filter((diagnostic) => diagnostic.severity === "warning").length,
+    info: diagnostics.filter((diagnostic) => diagnostic.severity === "info").length,
+  };
+}
+
 function diagnosticList(diagnostics) {
   return '<ul>' + (diagnostics.map((diagnostic) =>
     '<li data-severity="' + escapeHtml(diagnostic.severity) + '"><b>' + escapeHtml(diagnostic.code) + '</b> ' + escapeHtml(diagnostic.message) + location(diagnostic) + '</li>'
   ).join("") || "<li>No diagnostic findings.</li>") + '</ul>';
 }
 
+function outputReport(output) {
+  if (!output) return '<p class="status" aria-live="polite">Loading output plan…</p>';
+  if (output.status !== "available") return unavailable("Output", output.reason);
+  return '<dl>' +
+    '<dt>Candidate</dt><dd>' + output.candidateOutputCount + '</dd>' +
+    '<dt>Affected</dt><dd>' + output.affectedOutputCount + '</dd>' +
+    '<dt>Unchanged</dt><dd>' + output.unchangedOutputCount + '</dd>' +
+    '<dt>Removed</dt><dd>' + output.removedOutputCount + '</dd>' +
+    '<dt>Full regeneration</dt><dd>' + (output.fullRegenerationRequired ? "required" : "not required") + '</dd>' +
+    '<dt>Owner conflicts</dt><dd>' + output.conflicts.length + '</dd>' +
+    '</dl>' +
+    listedOutputs("Affected outputs", output.affected, output.hiddenAffectedCount) +
+    listedOutputs("Removed outputs", output.removed, output.hiddenRemovedCount) +
+    conflictList(output.conflicts);
+}
+
+function listedOutputs(title, outputs, hiddenCount) {
+  if (outputs.length === 0) return "";
+  return '<h3>' + escapeHtml(title) + '</h3><ul>' + outputs.map((output) =>
+    '<li><code>' + escapeHtml(output.path) + '</code> <small>' + escapeHtml(output.kind) + ' · ' + escapeHtml(output.producer) + '</small></li>'
+  ).join("") + '</ul>' + (hiddenCount > 0 ? '<p class="more">' + hiddenCount + ' more not shown.</p>' : "");
+}
+
+function conflictList(conflicts) {
+  if (conflicts.length === 0) return "";
+  return '<h3>Owner conflicts</h3><ul>' + conflicts.map((conflict) =>
+    '<li><code>' + escapeHtml(conflict.path) + '</code> <small>' + escapeHtml(conflict.owners.join(", ")) + '</small></li>'
+  ).join("") + '</ul>';
+}
+
+function dependencyReport(dependencies) {
+  if (!dependencies) return '<p class="status" aria-live="polite">Loading dependencies…</p>';
+  if (dependencies.status !== "available") return unavailable("Dependencies", dependencies.reason);
+  return '<dl>' +
+    '<dt>Outputs</dt><dd>' + dependencies.outputCount + '</dd>' +
+    '<dt>With dependencies</dt><dd>' + dependencies.dependentOutputCount + '</dd>' +
+    '<dt>Dependencies</dt><dd>' + dependencies.dependencyCount + '</dd>' +
+    '<dt>Unknown outputs</dt><dd>' + dependencies.unknownOutputCount + '</dd>' +
+    '</dl>' +
+    (dependencies.kinds.length === 0 ? "<p>No output dependencies.</p>" :
+      '<h3>Kinds</h3><ul>' + dependencies.kinds.map((kind) =>
+        '<li>' + escapeHtml(kind.kind) + ' <small>' + kind.count + '</small></li>'
+      ).join("") + '</ul>') +
+    (dependencies.outputs.length === 0 ? "" :
+      '<h3>Outputs</h3><ul>' + dependencies.outputs.map((output) =>
+        '<li><code>' + escapeHtml(output.path) + '</code><br><small>' + escapeHtml(output.dependencies.join(", ")) + '</small></li>'
+      ).join("") + '</ul>') +
+    (dependencies.hiddenOutputCount > 0 ? '<p class="more">' + dependencies.hiddenOutputCount + ' more outputs not shown.</p>' : "");
+}
+
 function unavailable(subject, capability) {
-  return '<p class="partial">' + escapeHtml(subject) + ': ' + escapeHtml(capability) + ' in the development inspector.</p>';
+  return '<p class="partial">' + escapeHtml(subject) + ' unavailable: ' + escapeHtml(capability) + '.</p>';
 }
 
 function renderFailure(root, message) {
@@ -2327,7 +2671,7 @@ function escapeHtml(value) {
   return String(value).replace(/[&<>"]/g, (character) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" })[character]);
 }
 
-const styles = ':host{all:initial}section{position:fixed;right:16px;bottom:56px;z-index:2147483647;width:min(540px,calc(100vw - 32px));max-height:70vh;overflow:auto;background:#171717;color:#f4f4f4;border:1px solid #555;padding:16px;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:0 8px 24px #0006}header{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #555;padding-bottom:8px}header p,.status,small{color:#b8b8b8;margin:2px 0}.summary{margin:12px 0}button{border:1px solid #666;background:#242424;color:#fff;padding:6px 8px;cursor:pointer}button[aria-selected="true"]{border-color:#e2c57b;color:#ffe08a}.partial{color:#e2c57b}ul{margin:12px 0;padding-left:20px}li{margin:8px 0}li[data-severity="error"]{color:#ff9797}li[data-severity="warning"]{color:#ffe08a}dl{display:grid;grid-template-columns:max-content 1fr;gap:8px 16px}dt{color:#b8b8b8}.failure{color:#ff9797}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}@media(max-width:560px){section{right:8px;bottom:52px;width:calc(100vw - 32px);max-height:75vh}}';
+const styles = ':host{all:initial}section{position:fixed;right:16px;bottom:56px;z-index:2147483647;width:min(540px,calc(100vw - 32px));max-height:70vh;overflow:auto;background:#171717;color:#f4f4f4;border:1px solid #555;padding:16px;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:0 8px 24px #0006}header{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #555;padding-bottom:8px}header p,.status,small{color:#b8b8b8;margin:2px 0}.summary{margin:12px 0}button{border:1px solid #666;background:#242424;color:#fff;padding:6px 8px;cursor:pointer}button[aria-selected="true"]{border-color:#e2c57b;color:#ffe08a}.partial{color:#e2c57b}.more{color:#b8b8b8;margin:4px 0}h3{color:#b8b8b8;font-size:12px;margin:12px 0 4px;text-transform:uppercase}ul{margin:12px 0;padding-left:20px}li{margin:8px 0}li[data-severity="error"]{color:#ff9797}li[data-severity="warning"]{color:#ffe08a}dl{display:grid;grid-template-columns:max-content 1fr;gap:8px 16px}dt{color:#b8b8b8}.failure{color:#ff9797}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}@media(max-width:560px){section{right:8px;bottom:52px;width:calc(100vw - 32px);max-height:75vh}}';
 `;
 }
 
@@ -2340,6 +2684,14 @@ var viteConfigFileNames = [
   "vite.config.js",
   "vite.config.mjs"
 ];
+var ignoredApplicationRootDirectoryNames = /* @__PURE__ */ new Set([
+  ".git",
+  ".riebeckite",
+  "node_modules",
+  "test",
+  "tests",
+  "templates"
+]);
 async function resolveHonoxApplicationRoot(configRoot, startDirectory) {
   const roots = await findViteApplicationRoots(configRoot, startDirectory);
   if (roots.length === 1) return roots[0];
@@ -2402,12 +2754,24 @@ async function startHonoxDevServer(options) {
       });
     }
     await server.listen(options.server?.port);
-    options.onServerReady?.([
+    const urls = [
       ...server.resolvedUrls?.local ?? [],
       ...server.resolvedUrls?.network ?? []
-    ]);
-    server.printUrls();
-    await waitForShutdown(server);
+    ];
+    const shutdown = waitForShutdown(server);
+    try {
+      server.printUrls();
+      await options.onServerReady?.(urls);
+    } catch (error) {
+      shutdown.dispose();
+      if (shutdown.isClosing()) {
+        await shutdown.promise;
+        return;
+      }
+      await server.close();
+      throw error;
+    }
+    await shutdown.promise;
   });
 }
 async function buildHonoxApplication(options) {
@@ -2438,14 +2802,28 @@ async function withWorkingDirectory(root, task) {
 async function runTraced(tracer, name, buildTask) {
   return tracer ? await tracer.span(name, {}, buildTask) : await buildTask();
 }
-async function waitForShutdown(server) {
-  await new Promise((resolve3) => {
-    const close = () => {
-      void server.close().finally(resolve3);
-    };
-    process.once("SIGINT", close);
-    process.once("SIGTERM", close);
+function waitForShutdown(server) {
+  let resolve3 = () => {
+  };
+  let closing = false;
+  const close = () => {
+    if (closing) return;
+    closing = true;
+    void server.close().finally(resolve3);
+  };
+  const promise = new Promise((resolvePromise) => {
+    resolve3 = resolvePromise;
   });
+  process.once("SIGINT", close);
+  process.once("SIGTERM", close);
+  return {
+    promise,
+    isClosing: () => closing,
+    dispose: () => {
+      process.removeListener("SIGINT", close);
+      process.removeListener("SIGTERM", close);
+    }
+  };
 }
 async function findViteApplicationRoots(root, startDirectory) {
   const applicationRoot = startDirectory ? await findViteApplicationRootFrom(startDirectory, root) : void 0;
@@ -2458,7 +2836,7 @@ async function findViteApplicationRoots(root, startDirectory) {
     if (await hasViteConfig(directory)) applicationRoots.push(directory);
     const entries = await fs7.readdir(directory, { withFileTypes: true });
     for (const entry of entries) {
-      if (!entry.isDirectory() || entry.name === "node_modules" || entry.name === ".git" || entry.name === "tests") {
+      if (!entry.isDirectory() || ignoredApplicationRootDirectoryNames.has(entry.name)) {
         continue;
       }
       directories.push(path9.join(directory, entry.name));

package/dist/src/client_module.d.ts

@@ -1,3 +1,3 @@
 import type { ResolvedRiebeckiteConfig } from "@riebeckite/core";
 import type { Plugin } from "vite";
-export declare function riebeckiteClientModule(getConfig: () => Pick<ResolvedRiebeckiteConfig, "plugins">): Plugin;
+export declare function riebeckiteClientModule(getConfig: () => Pick<ResolvedRiebeckiteConfig, "plugins" | "spa">): Plugin;

package/dist/src/ui/primitives.js

@@ -128,20 +128,26 @@ function PluginHeadTags(props) {
 function renderPluginHeadTag(tag, index) {
   const key = `${tag.tag}-${index}`;
   if (tag.tag === "meta") {
-    return /* @__PURE__ */ createElement("meta", { ...tag.attrs, key });
+    return /* @__PURE__ */ createElement("meta", { ...tag.attrs, "data-riebeckite-head": "page", key });
   }
   if (tag.tag === "link") {
-    return /* @__PURE__ */ createElement("link", { ...tag.attrs, key });
+    return /* @__PURE__ */ createElement("link", { ...tag.attrs, "data-riebeckite-head": "page", key });
   }
   return /* @__PURE__ */ createElement(
     "script",
     {
       ...tag.attrs,
+      "data-riebeckite-head": isDataScript(tag) ? "page" : void 0,
       key,
       dangerouslySetInnerHTML: tag.children ? { __html: tag.children } : void 0
     }
   );
 }
+function isDataScript(tag) {
+  if (tag.tag !== "script") return false;
+  const type = tag.attrs?.type?.trim().toLowerCase();
+  return type === "application/ld+json" || type === "application/json";
+}
 function RiebeckiteHead(props) {
   const site = useSiteContext();
   const faviconHref = props.faviconHref === void 0 ? "/favicon.ico" : props.faviconHref;

package/dist/src/vite_runner.d.ts

@@ -8,7 +8,7 @@ export type HonoxApplicationOptions = {
         open?: boolean;
         port?: number;
     };
-    onServerReady?: (urls: readonly string[]) => void;
+    onServerReady?: (urls: readonly string[]) => void | Promise<void>;
     restartOnChange?: readonly string[];
 };
 export type ResolvedHonoxApplication = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riebeckite/honox",
-  "version": "0.0.31",
+  "version": "0.0.32",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./dist/index.js",
@@ -44,14 +44,15 @@
     "hono": "^4.12.25",
     "honox": "0.1.56",
     "vite": "^8.0.9",
-    "@riebeckite/core": "0.0.31",
-    "@riebeckite/diagnostics": "0.0.31",
-    "@riebeckite/plugin-color-mode": "0.0.31",
-    "@riebeckite/ui": "0.0.31"
+    "@riebeckite/core": "0.0.32",
+    "@riebeckite/diagnostics": "0.0.32",
+    "@riebeckite/plugin-color-mode": "0.0.32",
+    "@riebeckite/ui": "0.0.32",
+    "@riebeckite/spa": "0.0.32"
   },
   "devDependencies": {
     "tsx": "^4.22.4",
-    "@riebeckite/test": "0.0.31"
+    "@riebeckite/test": "0.0.32"
   },
   "publishConfig": {
     "access": "public"