@riebeckite/honox 0.0.30 → 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
@@ -2069,27 +2069,41 @@ function isNotFoundError2(error) {
 }
 
 // src/client_module.ts
-import {
-  serializePublicClientConfig
-} from "@riebeckite/core";
+import { serializePublicClientConfig } from "@riebeckite/core";
 var clientModuleId = "virtual:riebeckite/client";
 var resolvedClientModuleId = `\0${clientModuleId}`;
 function riebeckiteClientModule(getConfig) {
+  let development = false;
   return {
     name: "riebeckite-client-module",
+    config(_config, environment) {
+      development = environment.command === "serve";
+    },
     resolveId(id) {
       if (id === clientModuleId) return resolvedClientModuleId;
       return null;
     },
     load(id) {
       if (id !== resolvedClientModuleId) return null;
-      return createClientModule(getConfig());
+      return createClientModule(getConfig(), development);
     }
   };
 }
-function createClientModule(config) {
+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";'
+    );
+    appInitializers.push("initDevelopmentInspector()");
+  }
   for (const [index, entry] of config.plugins.flatMap((plugin) => plugin.clientEntries ?? []).entries()) {
     const localName = `pluginClientInitializer${index}`;
     const importTarget = entry.exportName ? `{ ${entry.exportName} as ${localName} }` : localName;
@@ -2097,31 +2111,567 @@ function createClientModule(config) {
       `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) {
+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 mountPageClientInitializers(root) {
+${pageInitializers.map((initializer) => `  ${initializer};`).join("\n")}
+}
+
+export function initRiebeckiteClient() {
+  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 {
+  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 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",
+    enforce: "pre",
+    resolveId(id) {
+      return id === clientModuleId2 ? resolvedClientModuleId2 : null;
+    },
+    load(id) {
+      return id === resolvedClientModuleId2 ? inspectorClientModule() : null;
+    },
+    configureServer(server) {
+      const reportMiddleware = async (request, response) => {
+        if (!isLocalRequest(request.headers.host, server)) {
+          response.statusCode = 403;
+          response.end();
+          return;
+        }
+        try {
+          const application = getApplication();
+          const report = await inspectApplication(application, revision).report;
+          response.setHeader("content-type", "application/json; charset=utf-8");
+          response.setHeader("cache-control", "no-store");
+          response.end(
+            JSON.stringify({
+              ...report,
+              generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
+              currentPage: currentPageFromRequest(request.url),
+              theme: application.config.theme.name,
+              plugins: application.config.plugins.map((plugin) => plugin.name)
+            })
+          );
+        } catch {
+          response.statusCode = 500;
+          response.setHeader("content-type", "application/json; charset=utf-8");
+          response.end(JSON.stringify({ code: "INSPECTOR_REPORT_FAILED" }));
+        }
+      };
+      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;
+      server.hot.send({ type: "custom", event: "riebeckite:inspector" });
+    }
+  };
+}
+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 result = initialize();
-    if (result && typeof result.then === "function") {
-      result.catch((error) => reportPluginClientError(name, error));
+    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;
     }
-  } catch (error) {
-    reportPluginClientError(name, error);
   }
+  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 ?? reportPath, "http://localhost").searchParams.get(
+    "path"
+  );
+  return value?.startsWith("/") && !value.startsWith("//") ? value : "/";
+}
+function prioritizeMiddleware(server, middleware, path11) {
+  const stack = server.middlewares.stack;
+  const index = stack?.findIndex(
+    (layer) => layer.handle === middleware || layer.route === path11
+  ) ?? -1;
+  if (index > 0 && stack) stack.unshift(...stack.splice(index, 1));
+}
+function isLocalRequest(host, server) {
+  if (!host) return false;
+  const hostname = host.replace(/:\d+$/, "").toLowerCase();
+  if (hostname === "localhost" || hostname === "127.0.0.1" || hostname === "[::1]")
+    return true;
+  const address = server.httpServer?.address();
+  return typeof address === "object" && address?.address === hostname;
+}
+function inspectorClientModule() {
+  return `
+const reportEndpoint = ${JSON.stringify(reportPath)};
+const outputEndpoint = ${JSON.stringify(outputPath)};
+const panelId = "riebeckite-development-inspector";
 
-function reportPluginClientError(name, error) {
-  console.error("[riebeckite] Plugin client initializer failed: " + name, error);
+export function initDevelopmentInspector() {
+  let panel;
+  let launcher;
+  let controller;
+  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(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;
+      report.output = { status: "unavailable", reason: "output inspection failed" };
+      report.dependencies = { status: "unavailable", reason: "dependency inspection failed" };
+      render();
+    }
+  };
+  const open = () => {
+    if (!panel) {
+      panel = document.createElement("div");
+      panel.id = panelId;
+      panel.attachShadow({ mode: "open" });
+    }
+    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";
+  launcher.setAttribute("aria-label", "Open Riebeckite Development Inspector");
+  launcher.style.cssText = "position:fixed;right:16px;bottom:16px;z-index:2147483647;border:1px solid #434343;border-radius:4px;background:#171717;color:#fff;padding:8px 12px;font:600 12px system-ui;cursor:pointer";
+  launcher.addEventListener("click", open);
+  document.body.append(launcher);
+  window.addEventListener("keydown", (event) => {
+    const editable = event.target instanceof HTMLElement && (event.target.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(event.target.tagName));
+    if (event.key === "Escape" && panel?.isConnected) {
+      event.preventDefault();
+      close();
+    } else if (event.key.toLowerCase() === "r" && event.ctrlKey && event.altKey && !editable) {
+      event.preventDefault();
+      panel?.isConnected ? close() : open();
+    }
+  });
+  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">' + (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) => {
+      if (event.key === "Home") activeTab = 0;
+      else if (event.key === "End") activeTab = tabs.length - 1;
+      else if (event.key === "ArrowRight" || event.key === "ArrowDown") activeTab = (activeTab + 1) % tabs.length;
+      else if (event.key === "ArrowLeft" || event.key === "ArrowUp") activeTab = (activeTab + tabs.length - 1) % tabs.length;
+      else return;
+      event.preventDefault(); render(); root.querySelector('[data-tab="' + activeTab + '"]').focus();
+    });
+  }
+  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 dependencyReport(report.dependencies);
+    if (activeTab === 3) return '<ul>' + (report.plugins.map((plugin) => '<li>' + escapeHtml(plugin) + '</li>').join("") || "<li>No plugins configured.</li>") + '</ul>';
+    return outputReport(report.output);
+  }
 }
 
-export function initRiebeckiteClient() {
-${initializers.map((initializer) => `  ${initializer};`).join("\n")}
+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) + ' unavailable: ' + escapeHtml(capability) + '.</p>';
+}
+
+function renderFailure(root, message) {
+   root.innerHTML = '<style>' + styles + '</style><section role="dialog" aria-modal="false" aria-labelledby="rb-failure-title"><header><strong id="rb-failure-title">Riebeckite Inspector</strong><button type="button" data-close aria-label="Close inspector">Close</button></header><p class="failure" aria-live="polite">' + escapeHtml(message) + '</p></section>';
+}
+
+function location(diagnostic) {
+  const location = diagnostic.location;
+  return location?.file ? ' <small>(' + escapeHtml(location.file) + (location.line ? ':' + location.line : '') + ')</small>' : '';
+}
+
+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}.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}}';
 `;
 }
 
@@ -2134,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];
@@ -2196,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) {
@@ -2232,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;
@@ -2252,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));
@@ -2356,7 +2940,8 @@ function riebeckite(options = {}, onApplicationResolved) {
       appRoot: () => requireApplication(application).appRoot,
       contentRoot: () => requireApplication(application).contentRoot,
       exclude: () => getConfig().content.exclude ?? []
-    })
+    }),
+    riebeckiteDevelopmentInspector(() => requireApplication(application))
   ];
 }
 function requireApplication(application) {

package/dist/server.js

@@ -130,7 +130,7 @@ function mountRiebeckiteEndpoints(app, options) {
   for (const endpoint of endpoints) {
     const method = endpoint.method ?? "GET";
     const handler = async (context) => {
-      const manifest = await options.content.getManifest();
+      const manifest = endpoint.requiresManifest === false ? void 0 : await options.content.getManifest();
       const request = await toPluginEndpointRequest(context, method);
       const response = await endpoint.handler({
         config: options.config,

package/dist/src/client_module.d.ts

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

package/dist/src/development_inspector.d.ts

@@ -0,0 +1,3 @@
+import type { Plugin } from "vite";
+import type { ResolvedHonoxApplication } from "./vite_runner.js";
+export declare function riebeckiteDevelopmentInspector(getApplication: () => ResolvedHonoxApplication): Plugin;

package/dist/src/ui/primitives.d.ts

@@ -10,7 +10,6 @@ export type PrimitiveClassProps = {
     className?: string;
 };
 export type ArticleProps = PrimitiveProps & {
-    "data-slot"?: string;
     post?: PostContent;
     entry?: PublicContentEntry;
 };
@@ -26,7 +25,6 @@ export type ArticleHeaderProps = (PrimitiveClassProps & {
 });
 export type ArticleContentProps = PrimitiveClassProps & {
     children?: PrimitiveChildren;
-    "data-slot"?: string;
 };
 export type ArticleMetaProps = PrimitiveProps & {
     label?: string;

package/dist/src/ui/primitives.js

@@ -15,14 +15,7 @@ import {
 import { Fragment, jsx, jsxs } from "hono/jsx/jsx-runtime";
 import { createElement } from "hono/jsx";
 function Article(props) {
-  const article = /* @__PURE__ */ jsx(
-    "article",
-    {
-      class: joinClassNames("rb-article", props.class, props.className),
-      "data-slot": props["data-slot"] ?? "article",
-      children: props.children
-    }
-  );
+  const article = /* @__PURE__ */ jsx("article", { class: joinClassNames("rb-article", props.class, props.className), children: props.children });
   if (!props.post) return article;
   return /* @__PURE__ */ jsx(ArticleProvider, { entry: props.entry, post: props.post, children: article });
 }
@@ -68,8 +61,7 @@ function ArticleContent(props) {
     props.class,
     props.className
   );
-  const dataSlot = props["data-slot"] ?? "article-body";
-  return /* @__PURE__ */ jsx("div", { class: className, "data-slot": dataSlot, children: props.children });
+  return /* @__PURE__ */ jsx("div", { class: className, children: props.children });
 }
 function HtmlFragment(props) {
   return raw(props.html);
@@ -136,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.30",
+  "version": "0.0.32",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./dist/index.js",
@@ -44,13 +44,15 @@
     "hono": "^4.12.25",
     "honox": "0.1.56",
     "vite": "^8.0.9",
-    "@riebeckite/core": "0.0.30",
-    "@riebeckite/ui": "0.0.30",
-    "@riebeckite/plugin-color-mode": "0.0.30"
+    "@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.30"
+    "@riebeckite/test": "0.0.32"
   },
   "publishConfig": {
     "access": "public"