@riebeckite/honox 0.0.32 → 0.0.33

package/dist/index.js

@@ -293,20 +293,17 @@ import {
 // src/content_assets.ts
 import fs5 from "node:fs/promises";
 import path7 from "node:path";
-import {
-  isIgnoredContentPath as isIgnoredContentPath2,
-  isImagePath as isImagePath2,
-  normalizeContentPath as normalizeContentPath2
-} from "@riebeckite/core";
+import { isImagePath as isImagePath2, normalizeContentPath as normalizeContentPath2 } from "@riebeckite/core";
+import { isIgnoredContentPath as isIgnoredContentPath2 } from "@riebeckite/node";
 
 // src/content_watch.ts
 import path6 from "node:path";
 import {
   isAttachmentPath,
-  isIgnoredContentPath,
   isImagePath,
   normalizeContentPath
 } from "@riebeckite/core";
+import { isIgnoredContentPath } from "@riebeckite/node";
 
 // src/runtime_modules.ts
 var riebeckiteConfigModuleId = "virtual:riebeckite/config";
@@ -355,11 +352,15 @@ export const config = resolveHonoxConfig(
 }
 function createContentModule() {
   return `import { ContentManager } from "@riebeckite/core";
+import { FileSystemContentSource } from "@riebeckite/node";
 import { config } from ${JSON.stringify(riebeckiteConfigModuleId)};
 
 export const content = new ContentManager(
-  config.content.directory,
-  config.content.exclude,
+  config.content.source ?? new FileSystemContentSource(
+    config.content.directory,
+    config.content.exclude,
+  ),
+  [],
   { config, plugins: config.plugins },
 );
 `;
@@ -996,7 +997,7 @@ async function writeSsgOutputMetrics(metrics) {
 }
 
 // src/ssg/output_cache.ts
-var faultInjectionCounts = /* @__PURE__ */ new Map();
+var outputCacheValidationConcurrency = 12;
 function decideOutputCacheRejection(decision) {
   if (!decision.changeSetPresent) return "change-set-unavailable";
   if (decision.changeSetRequiresFullRegeneration)
@@ -1112,7 +1113,6 @@ async function saveOutputCache(path11, state, outputDirectory, timingsMs) {
   const entriesPath = outputCacheEntriesPath(path11);
   const temporaryPath = `${path11}.${randomUUID2()}.tmp`;
   try {
-    await waitForFaultInjection("metadata-save-start");
     const outputs = await measure(
       timingsMs,
       "outputCacheEntriesWrite",
@@ -1140,7 +1140,6 @@ async function saveOutputCache(path11, state, outputDirectory, timingsMs) {
       "outputCacheRename",
       () => replaceFile(temporaryPath, path11)
     );
-    await waitForFaultInjection("metadata-committed");
     const checksum = createHash3("sha256").update(serialized).digest("hex");
     if (state.finalOutputInventory && state.configFile) {
       await saveFastPathCache(
@@ -1197,7 +1196,6 @@ async function saveOutputCacheEntries(directory, outputDirectory, outputs, final
     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?.[outputPath2];
     if (!checksum) {
@@ -1216,20 +1214,43 @@ async function validateOutputCacheEntries(outputCachePath, entries, timingsMs) {
   try {
     const directory = outputCacheEntriesPath(outputCachePath);
     if (!await isSafeOutputCacheEntriesDirectory(directory)) return false;
-    for (const [outputPath2, entry] of Object.entries(entries)) {
-      if (!isSafeLogicalOutputPath(outputPath2) || entry.cachePath !== outputCacheEntryName(outputPath2) || !isChecksum(entry.checksum)) {
-        return false;
+    const entriesToValidate = Object.entries(entries);
+    let nextEntryIndex = 0;
+    let valid = true;
+    const validateEntry = async () => {
+      while (valid) {
+        const next = entriesToValidate[nextEntryIndex++];
+        if (!next) return;
+        const [outputPath2, entry] = next;
+        if (!isSafeLogicalOutputPath(outputPath2) || entry.cachePath !== outputCacheEntryName(outputPath2) || !isChecksum(entry.checksum)) {
+          valid = false;
+          return;
+        }
+        const path11 = resolveOutputCacheFile(directory, entry.cachePath);
+        if (!await isRegularFile(path11)) {
+          valid = false;
+          return;
+        }
+        if (await measure(
+          timingsMs,
+          "outputCacheEntryChecksum",
+          () => checksumFile(path11)
+        ) !== entry.checksum)
+          valid = false;
       }
-      const path11 = resolveOutputCacheFile(directory, entry.cachePath);
-      if (!await isRegularFile(path11)) return false;
-      if (await measure(
-        timingsMs,
-        "outputCacheEntryChecksum",
-        () => checksumFile(path11)
-      ) !== entry.checksum)
-        return false;
-    }
-    return true;
+    };
+    await Promise.all(
+      Array.from(
+        {
+          length: Math.min(
+            outputCacheValidationConcurrency,
+            entriesToValidate.length
+          )
+        },
+        validateEntry
+      )
+    );
+    return valid;
   } catch {
     return false;
   }
@@ -1263,7 +1284,6 @@ async function saveFastPathCache(path11, state, timingsMs) {
   }
   const temporaryPath = `${path11}.${randomUUID2()}.tmp`;
   try {
-    await waitForFaultInjection("sidecar-save-start");
     await measure(
       timingsMs,
       "sidecarWrite",
@@ -1275,7 +1295,6 @@ async function saveFastPathCache(path11, state, timingsMs) {
       "sidecarRename",
       () => replaceFile(temporaryPath, path11)
     );
-    await waitForFaultInjection("sidecar-committed");
   } catch (error) {
     await rm2(temporaryPath, { force: true }).catch(() => void 0);
     throw error;
@@ -1407,19 +1426,16 @@ async function replaceOutputCacheEntry(source, destination, timingsMs) {
       "outputCacheEntryWrite",
       () => writeFile2(temporaryPath, new Uint8Array())
     );
-    await waitForFaultInjection("entry-body-write");
     await measure(
       timingsMs,
       "outputCacheEntryCopy",
       () => copyFile(source, temporaryPath)
     );
-    await waitForFaultInjection("entry-rename-before");
     await measure(
       timingsMs,
       "outputCacheEntryRename",
       () => replaceFile(temporaryPath, destination)
     );
-    await waitForFaultInjection("entry-committed");
   } catch (error) {
     await rm2(temporaryPath, { force: true }).catch(() => void 0);
     throw error;
@@ -1428,7 +1444,6 @@ async function replaceOutputCacheEntry(source, destination, timingsMs) {
 async function collectUnreferencedOutputCacheEntries(directory, outputs, timingsMs) {
   try {
     if (!await isSafeOutputCacheEntriesDirectory(directory)) return;
-    await waitForFaultInjection("gc-start");
     const referenced = new Set(
       Object.values(outputs).map((entry) => entry.cachePath)
     );
@@ -1443,7 +1458,6 @@ async function collectUnreferencedOutputCacheEntries(directory, outputs, timings
       }
       const path11 = join3(directory, entry.name);
       if (await isRegularFile(path11)) {
-        await waitForFaultInjection("gc-entry-delete");
         await measure(
           timingsMs,
           "outputCacheGcDelete",
@@ -1455,25 +1469,6 @@ async function collectUnreferencedOutputCacheEntries(directory, outputs, timings
     return;
   }
 }
-async function waitForFaultInjection(point) {
-  if (process.env.NODE_ENV !== "test" || process.env.RIEBECKITE_SSG_FAULT_INJECTION !== "1" || process.env.RIEBECKITE_SSG_FAULT_POINT !== point) {
-    return;
-  }
-  const occurrence = Number.parseInt(
-    process.env.RIEBECKITE_SSG_FAULT_OCCURRENCE ?? "1",
-    10
-  );
-  const count = (faultInjectionCounts.get(point) ?? 0) + 1;
-  faultInjectionCounts.set(point, count);
-  if (!Number.isSafeInteger(occurrence) || occurrence < 1 || count !== occurrence)
-    return;
-  const signalFile = process.env.RIEBECKITE_SSG_FAULT_SIGNAL_FILE;
-  if (!signalFile) return;
-  await writeFile2(signalFile, `${point}
-`, "utf8");
-  await new Promise(() => {
-  });
-}
 
 // src/ssg_plugin.ts
 var defaultEntry = "./src/index.tsx";
@@ -1543,8 +1538,17 @@ function riebeckiteSsg(options = {}) {
             ...config.resolve,
             builtins: [...config.resolve.builtins, /^node:/]
           },
-          plugins: [],
+          plugins: [
+            {
+              name: "riebeckite-ssg-package-resolution",
+              enforce: "post",
+              configResolved(runtimeConfig) {
+                runtimeConfig.resolve.alias = [];
+              }
+            }
+          ],
           build: { ssr: true },
+          oxc: { jsx: { runtime: "automatic", importSource: "hono/jsx" } },
           environments: {
             ssr: { resolve: { noExternal: [/^honox(?:\/.*)?$/] } }
           },
@@ -1924,14 +1928,12 @@ function riebeckiteSsg(options = {}) {
             "publicFingerprint",
             () => fingerprintDirectory(resolve2(publicDir))
           ) : void 0;
-          await waitForFaultInjection("build-state-before");
           await saveOutputCache(
             outputCache.path,
             outputCache.state,
             outputCache.outDir,
             outputCache.timingsMs
           );
-          await waitForFaultInjection("build-state-committed");
         } catch (error) {
           this.warn(
             `SSG output cache could not be saved; the next build regenerates every output. ${error instanceof Error ? error.message : String(error)}`
@@ -2107,15 +2109,24 @@ function createClientModule(config, development) {
   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;
-    imports.push(
-      `import ${importTarget} from ${JSON.stringify(entry.moduleSpecifier)};`
-    );
+    if (entry.presenceSelector === void 0) {
+      imports.push(
+        `import ${importTarget} from ${JSON.stringify(entry.moduleSpecifier)};`
+      );
+    }
     const publicConfig = entry.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;
+    if (entry.presenceSelector === void 0) {
+      initializers.push(
+        `mountPluginClientInitializer(${JSON.stringify(entry.scope ?? "page")}, ${JSON.stringify(entry.moduleSpecifier)}, root, ${serializedConfig}, (context) => ${initializer})`
+      );
+      continue;
+    }
+    const dynamicInitializer = entry.initializerArguments === "context" ? `initializer(context)` : entry.initializerArguments === "root" ? `initializer(context.root)` : `initializer(context.config)`;
     initializers.push(
-      `mountPluginClientInitializer(${JSON.stringify(entry.scope ?? "page")}, ${JSON.stringify(entry.moduleSpecifier)}, root, ${serializedConfig}, (context) => ${initializer})`
+      `mountConditionalPluginClientInitializer(${JSON.stringify(entry.scope ?? "page")}, ${JSON.stringify(entry.moduleSpecifier)}, root, ${serializedConfig}, ${JSON.stringify(entry.presenceSelector)}, async () => { const { ${entry.exportName ?? "default"}: initializer } = await import(${JSON.stringify(entry.moduleSpecifier)}); return (context) => ${dynamicInitializer}; })`
     );
   }
   return `${imports.join("\n")}
@@ -2127,6 +2138,14 @@ function mountPluginClientInitializer(scope, name, root, config, initialize) {
   void lifecycle.mount({ scope, name, root, config, initialize });
 }
 
+function mountConditionalPluginClientInitializer(scope, name, root, config, presenceSelector, load) {
+  if (!root.querySelector(presenceSelector)) return;
+  void load().then((initialize) => {
+    if ("isConnected" in root && !root.isConnected) return;
+    void lifecycle.mount({ scope, name, root, config, initialize });
+  }, (error) => console.error("[riebeckite] Client initializer module failed: " + name, error));
+}
+
 function mountAppClientInitializers(root) {
 ${appInitializers.map((initializer) => `  ${initializer};`).join("\n")}
 }
@@ -2166,14 +2185,14 @@ export async function disposeRiebeckiteClient() {
 // src/development_inspector.ts
 import {
   buildOutputPlan as buildOutputPlan2,
-  ContentManager,
-  FileSystemContentSource
+  ContentManager
 } from "@riebeckite/core";
 import {
   collectDevelopmentDiagnostics,
   diagnoseOutputPlan,
   sortDevelopmentDiagnostics
 } from "@riebeckite/diagnostics";
+import { FileSystemContentSource } from "@riebeckite/node";
 var clientModuleId2 = "virtual:riebeckite/development-inspector";
 var resolvedClientModuleId2 = `\0${clientModuleId2}`;
 var reportPath = "/__riebeckite/inspector/report";
@@ -2919,6 +2938,9 @@ function riebeckite(options = {}, onApplicationResolved) {
           define: {
             "process.env.RIEBECKITE_APP_ROOT": JSON.stringify(appRoot)
           },
+          oxc: {
+            jsx: { runtime: "automatic", importSource: "hono/jsx" }
+          },
           server: {
             watch: {
               ignored: ["**/.riebeckite/**"]

package/dist/server.js

@@ -35,6 +35,11 @@ async function resolveRiebeckiteContentRequest(c, content, parameter = "slug") {
   const requestedSlug = c.req.param(parameter);
   if (!requestedSlug) return { kind: "response", response: c.notFound() };
   if (contentExtensionPattern.test(requestedSlug)) {
+    const page = await content.resolvePage(c.req.path);
+    if (page) {
+      applyRiebeckiteRouteContext(c, { kind: "page", page });
+      return { kind: "page", page };
+    }
     return { kind: "response", response: c.notFound() };
   }
   return resolveRouteRequest(c, content);
@@ -250,6 +255,7 @@ import {
 } from "@riebeckite/ui";
 
 // src/ui/primitives.tsx
+import { escapeScriptJson, uniqueStrings } from "@riebeckite/core";
 import { ColorModeScript } from "@riebeckite/plugin-color-mode";
 import { raw } from "hono/html";
 import { Link, Script } from "honox/server";

package/dist/src/asset_entries.d.ts

@@ -1,7 +1,8 @@
 import { type ResolvedRiebeckiteConfig } from "@riebeckite/core";
-export type GeneratedAssetPaths = {
+type GeneratedAssetPaths = {
     frameworkStyles: string;
     pluginStyles: string;
     themeStyles: string;
 };
 export declare function writeRiebeckiteAssetEntries(config: ResolvedRiebeckiteConfig, paths: GeneratedAssetPaths): void;
+export {};

package/dist/src/content_assets.d.ts

@@ -1,5 +1,5 @@
 import type { Plugin } from "vite";
-export type RiebeckiteContentAssetsOptions = {
+type RiebeckiteContentAssetsOptions = {
     appRoot: () => string;
     contentRoot: () => string;
 };

package/dist/src/content_watch.d.ts

@@ -1,5 +1,5 @@
 import type { Plugin, ViteDevServer } from "vite";
-export type RiebeckiteContentWatchOptions = {
+type RiebeckiteContentWatchOptions = {
     appRoot: () => string;
     contentRoot: () => string;
     exclude: () => readonly string[];
@@ -9,3 +9,4 @@ export declare function isSiteAssetPath(logicalPath: string): boolean;
 export declare function isPathInsideDirectory(directory: string, file: string): boolean;
 export declare function toLogicalPath(directory: string, file: string): string;
 export declare function invalidateApplicationRuntime(server: Pick<ViteDevServer, "environments">, appRoot: string): number;
+export {};

package/dist/src/endpoints.d.ts

@@ -1,5 +1,5 @@
 import type { ContentManager, ResolvedRiebeckiteConfig } from "@riebeckite/core";
-export type RiebeckiteEndpointMountOptions = {
+type RiebeckiteEndpointMountOptions = {
     config: ResolvedRiebeckiteConfig;
     content: ContentManager;
 };

package/dist/src/ssg/output_cache.d.ts

@@ -1,5 +1,5 @@
 import type { NoChangeFastPathOutputMetrics, NoChangeFastPathResult, OutputCacheDecision, OutputCacheRejectionReason } from "./types.js";
-export type OutputCacheEntry = {
+type OutputCacheEntry = {
     cachePath: string;
     checksum: string;
 };
@@ -26,4 +26,4 @@ export declare function loadOutputCache(path: string, timingsMs?: Record<string,
 }) | undefined>;
 export declare function saveOutputCache(path: string, state: OutputCacheState, outputDirectory: string, timingsMs?: Record<string, number>): Promise<string>;
 export declare function decodeOutput(outputCachePath: string, entry: OutputCacheEntry): Promise<Uint8Array>;
-export declare function waitForFaultInjection(point: string): Promise<void>;
+export {};

package/dist/src/ssg/types.d.ts

@@ -5,13 +5,13 @@ export type GeneratedOutputAsset = {
     fileName: string;
     source: string | Uint8Array;
 };
-export type SsgGeneratedHtmlDiagnostic = {
+type SsgGeneratedHtmlDiagnostic = {
     severity: "info" | "warning" | "error";
     message: string;
     code?: string;
     filePath?: string;
 };
-export type SsgHtmlInspectorPlugin = {
+type SsgHtmlInspectorPlugin = {
     name?: string;
     inspectGeneratedHtml?: (page: {
         path: string;
@@ -125,3 +125,4 @@ export type NoChangeFastPathOutputMetrics = {
     outputFilesHashed: number;
     outputBytesHashed: number;
 };
+export {};

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

@@ -1,20 +1,20 @@
-import type { PluginHeadTag, PostContent, PublicContentEntry, ResolvedRiebeckiteConfig } from "@riebeckite/core";
-export type PrimitiveChildren = unknown;
-export type PrimitiveProps = {
+import type { PluginHeadTag, PostContent, PublicContentEntry, ResolvedRiebeckiteConfig, SeoMetadata } from "@riebeckite/core";
+type PrimitiveChildren = unknown;
+type PrimitiveProps = {
     children?: PrimitiveChildren;
     class?: string;
     className?: string;
 };
-export type PrimitiveClassProps = {
+type PrimitiveClassProps = {
     class?: string;
     className?: string;
 };
-export type ArticleProps = PrimitiveProps & {
+type ArticleProps = PrimitiveProps & {
     post?: PostContent;
     entry?: PublicContentEntry;
 };
-export type ArticleLayoutProps = PrimitiveProps;
-export type ArticleHeaderProps = (PrimitiveClassProps & {
+type ArticleLayoutProps = PrimitiveProps;
+type ArticleHeaderProps = (PrimitiveClassProps & {
     dangerouslySetInnerHTML: {
         __html: string;
     };
@@ -23,26 +23,26 @@ export type ArticleHeaderProps = (PrimitiveClassProps & {
     dangerouslySetInnerHTML?: never;
     children?: PrimitiveChildren;
 });
-export type ArticleContentProps = PrimitiveClassProps & {
+type ArticleContentProps = PrimitiveClassProps & {
     children?: PrimitiveChildren;
 };
-export type ArticleMetaProps = PrimitiveProps & {
+type ArticleMetaProps = PrimitiveProps & {
     label?: string;
 };
-export type SidebarProps = PrimitiveProps & {
+type SidebarProps = PrimitiveProps & {
     label?: string;
 };
-export type ArticleFooterProps = PrimitiveProps;
+type ArticleFooterProps = PrimitiveProps;
 export declare function Article(props: ArticleProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
 export declare function ArticleLayout(props: ArticleLayoutProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
 export declare function ArticleHeader(props: ArticleHeaderProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
 export declare function ArticleMeta(props: ArticleMetaProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
 export declare function ArticleContent(props: ArticleContentProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
-export type ArticleBodyProps = PrimitiveClassProps & {
+type ArticleBodyProps = PrimitiveClassProps & {
     html?: string;
 };
-export type HtmlFragmentSource = "markdown" | "plugin-page";
-export type HtmlFragmentProps = {
+type HtmlFragmentSource = "markdown" | "plugin-page";
+type HtmlFragmentProps = {
     html: string;
     source: HtmlFragmentSource;
 };
@@ -53,7 +53,7 @@ export declare function HtmlFragment(props: HtmlFragmentProps): import("hono/uti
  * Owns the `.rb-article-content` Stable Hook so Sites never hand-write it.
  */
 export declare function ArticleBody(props: ArticleBodyProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
-export type PageBodyProps = PrimitiveClassProps & {
+type PageBodyProps = PrimitiveClassProps & {
     html: string;
 };
 /**
@@ -65,7 +65,7 @@ export type PageBodyProps = PrimitiveClassProps & {
 export declare function PageBody(props: PageBodyProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
 export declare function ArticleFooter(props: ArticleFooterProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
 export declare function Sidebar(props: SidebarProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
-export type ThemeRootProps = {
+type ThemeRootProps = {
     theme?: ResolvedRiebeckiteConfig["theme"];
     lang?: string;
     children?: PrimitiveChildren;
@@ -84,7 +84,7 @@ export declare function themeRootAttributes(theme: ResolvedRiebeckiteConfig["the
  * `<head>` and `<body>` as children.
  */
 export declare function ThemeRoot(props: ThemeRootProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
-export type PluginHeadTagsProps = {
+type PluginHeadTagsProps = {
     tags?: readonly PluginHeadTag[];
 };
 /**
@@ -93,12 +93,14 @@ export type PluginHeadTagsProps = {
  * The Site owns placement; this primitive owns the conversion and ordering.
  */
 export declare function PluginHeadTags(props: PluginHeadTagsProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
-export type RiebeckiteHeadProps = {
+type RiebeckiteHeadProps = {
     title?: string;
     headTags?: readonly PluginHeadTag[];
     faviconHref?: string | null;
     colorModeScript?: boolean;
     stylesheets?: readonly string[];
+    themeStyle?: string;
+    themeStylesheets?: readonly string[];
     clientSrc?: string | null;
     prod?: boolean;
     children?: PrimitiveChildren;
@@ -111,3 +113,19 @@ export type RiebeckiteHeadProps = {
  * surrounding `<head>` so it can add its own elements next to this primitive.
  */
 export declare function RiebeckiteHead(props: RiebeckiteHeadProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
+type SeoHeadProps = {
+    seo: SeoMetadata;
+    siteTitle: string;
+    author?: string;
+    ogLocale?: string;
+    ogAlternates?: readonly string[];
+    twitterSite?: string;
+    feedLinks?: readonly {
+        href: string;
+        type: string;
+    }[];
+};
+export declare function SeoHead(props: SeoHeadProps): import("hono/jsx/jsx-dev-runtime").JSX.Element;
+export declare function getThemeStyle(tokens: ResolvedRiebeckiteConfig["theme"]["tokens"]): string;
+export declare function getThemeStylesheets(userCss: readonly string[]): string[];
+export {};

package/dist/src/ui/primitives.js

@@ -1,4 +1,5 @@
 // src/ui/primitives.tsx
+import { escapeScriptJson, uniqueStrings } from "@riebeckite/core";
 import { ColorModeScript } from "@riebeckite/plugin-color-mode";
 import { raw } from "hono/html";
 import { Link, Script } from "honox/server";
@@ -161,11 +162,228 @@ function RiebeckiteHead(props) {
     faviconHref ? /* @__PURE__ */ jsx("link", { rel: "icon", href: faviconHref }) : null,
     colorModeScript ? /* @__PURE__ */ jsx(ColorModeScript, {}) : null,
     stylesheets.map((href) => /* @__PURE__ */ jsx(Link, { href, rel: "stylesheet", prod: props.prod }, href)),
+    props.themeStyle ? /* @__PURE__ */ jsx("style", { dangerouslySetInnerHTML: { __html: props.themeStyle } }) : null,
+    props.themeStylesheets?.map((href) => /* @__PURE__ */ jsx(Link, { href, rel: "stylesheet", prod: props.prod }, href)),
     /* @__PURE__ */ jsx(PluginHeadTags, { tags: props.headTags ?? site?.headTags }),
     clientSrc ? /* @__PURE__ */ jsx(Script, { src: clientSrc, async: true, prod: props.prod }) : null,
     props.children
   ] });
 }
+function SeoHead(props) {
+  const { seo } = props;
+  const twitterCard = seo.imageUrl ? "summary_large_image" : "summary";
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "description",
+        content: seo.description,
+        "data-riebeckite-head": "page"
+      }
+    ),
+    props.author ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "author",
+        content: props.author,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    seo.noindex ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "robots",
+        content: "noindex, nofollow",
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    /* @__PURE__ */ jsx("title", { children: seo.title }),
+    seo.canonicalUrl ? /* @__PURE__ */ jsx(
+      "link",
+      {
+        rel: "canonical",
+        href: seo.canonicalUrl,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "og:title",
+        content: seo.title,
+        "data-riebeckite-head": "page"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "og:description",
+        content: seo.description,
+        "data-riebeckite-head": "page"
+      }
+    ),
+    /* @__PURE__ */ jsx("meta", { property: "og:type", content: seo.type, "data-riebeckite-head": "page" }),
+    seo.canonicalUrl ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "og:url",
+        content: seo.canonicalUrl,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "og:site_name",
+        content: props.siteTitle,
+        "data-riebeckite-head": "page"
+      }
+    ),
+    props.ogLocale ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "og:locale",
+        content: props.ogLocale,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    props.ogAlternates?.map((locale) => /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "og:locale:alternate",
+        content: locale,
+        "data-riebeckite-head": "page"
+      },
+      locale
+    )),
+    seo.imageUrl ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "og:image",
+        content: seo.imageUrl,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    seo.publishedTime ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "article:published_time",
+        content: seo.publishedTime,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    seo.modifiedTime ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "article:modified_time",
+        content: seo.modifiedTime,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    seo.tags.map((tag) => /* @__PURE__ */ jsx(
+      "meta",
+      {
+        property: "article:tag",
+        content: tag,
+        "data-riebeckite-head": "page"
+      },
+      tag
+    )),
+    /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "twitter:card",
+        content: twitterCard,
+        "data-riebeckite-head": "page"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "twitter:title",
+        content: seo.title,
+        "data-riebeckite-head": "page"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "twitter:description",
+        content: seo.description,
+        "data-riebeckite-head": "page"
+      }
+    ),
+    props.twitterSite ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "twitter:site",
+        content: props.twitterSite,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    seo.imageUrl ? /* @__PURE__ */ jsx(
+      "meta",
+      {
+        name: "twitter:image",
+        content: seo.imageUrl,
+        "data-riebeckite-head": "page"
+      }
+    ) : null,
+    props.feedLinks?.map((feed) => /* @__PURE__ */ jsx(
+      "link",
+      {
+        rel: "alternate",
+        type: feed.type,
+        href: feed.href,
+        "data-riebeckite-head": "global"
+      },
+      feed.href
+    )),
+    seo.jsonLd ? /* @__PURE__ */ jsx(
+      "script",
+      {
+        type: "application/ld+json",
+        "data-riebeckite-head": "page",
+        dangerouslySetInnerHTML: {
+          __html: escapeScriptJson(JSON.stringify(seo.jsonLd))
+        }
+      }
+    ) : null
+  ] });
+}
+function getThemeStyle(tokens) {
+  const variables = [
+    ["--rb-color-paper", tokens.color?.paper],
+    ["--rb-color-ink", tokens.color?.ink],
+    ["--rb-color-muted", tokens.color?.muted],
+    ["--rb-color-accent", tokens.color?.accent],
+    ["--rb-color-link", tokens.color?.link],
+    ["--rb-color-focus", tokens.color?.focus],
+    ["--rb-color-selected", tokens.color?.selected],
+    ["--rb-color-border", tokens.color?.border],
+    ["--rb-color-border-strong", tokens.color?.borderStrong],
+    ["--rb-color-surface", tokens.color?.surface],
+    ["--rb-color-surface-hover", tokens.color?.surfaceHover],
+    ["--rb-color-overlay", tokens.color?.overlay],
+    ["--rb-color-danger", tokens.color?.danger],
+    ["--rb-color-success", tokens.color?.success],
+    ["--rb-color-code-background", tokens.color?.codeBackground],
+    ["--rb-color-code-ink", tokens.color?.codeInk],
+    ["--rb-color-code-inline", tokens.color?.codeInline],
+    ["--rb-font-body", tokens.typography?.bodyFont],
+    ["--rb-font-heading", tokens.typography?.headingFont],
+    ["--rb-font-mono", tokens.typography?.monoFont],
+    ["--rb-layout-page-max", tokens.layout?.pageMaxWidth],
+    ["--rb-layout-article-max", tokens.layout?.articleMaxWidth],
+    ["--rb-layout-sidebar", tokens.layout?.sidebarWidth],
+    ["--rb-layout-gap", tokens.layout?.contentGap]
+  ];
+  const declarations = variables.filter((variable) => Boolean(variable[1])).map(([name, value]) => `${name}: ${value};`);
+  return declarations.length === 0 ? "" : `:root { ${declarations.join(" ")} }`;
+}
+function getThemeStylesheets(userCss) {
+  return uniqueStrings([...userCss]);
+}
 function joinClassNames(...classNames) {
   return classNames.filter(Boolean).join(" ");
 }
@@ -181,7 +399,10 @@ export {
   PageBody,
   PluginHeadTags,
   RiebeckiteHead,
+  SeoHead,
   Sidebar,
   ThemeRoot,
+  getThemeStyle,
+  getThemeStylesheets,
   themeRootAttributes
 };

package/dist/src/vite_runner.d.ts

@@ -1,6 +1,6 @@
 import type { ResolvedRiebeckiteConfig, Tracer } from "@riebeckite/core";
 import { type RiebeckiteConfigLoaderOptions } from "./config_loader.js";
-export type HonoxApplicationOptions = {
+type HonoxApplicationOptions = {
     root: string;
     tracer?: Tracer;
     server?: {
@@ -29,3 +29,4 @@ export declare class HonoxApplicationRootError extends Error {
 export declare function resolveHonoxApplication(options: ResolveHonoxApplicationOptions): Promise<ResolvedHonoxApplication>;
 export declare function startHonoxDevServer(options: HonoxApplicationOptions): Promise<void>;
 export declare function buildHonoxApplication(options: HonoxApplicationOptions): Promise<void>;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riebeckite/honox",
-  "version": "0.0.32",
+  "version": "0.0.33",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./dist/index.js",
@@ -40,19 +40,20 @@
   },
   "dependencies": {
     "@babel/parser": "^7.29.3",
+    "@riebeckite/core": "0.0.33",
+    "@riebeckite/diagnostics": "0.0.33",
+    "@riebeckite/node": "0.0.33",
+    "@riebeckite/plugin-color-mode": "0.0.33",
+    "@riebeckite/spa": "0.0.33",
+    "@riebeckite/ui": "0.0.33",
     "esbuild": "^0.28.2",
     "hono": "^4.12.25",
     "honox": "0.1.56",
-    "vite": "^8.0.9",
-    "@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"
+    "vite": "^8.3.5"
   },
   "devDependencies": {
-    "tsx": "^4.22.4",
-    "@riebeckite/test": "0.0.32"
+    "@riebeckite/test": "0.0.33",
+    "tsx": "^4.22.4"
   },
   "publishConfig": {
     "access": "public"

package/style.css

@@ -22,6 +22,21 @@
 
   .rb-article-body {
     min-width: 0;
+    padding-inline: var(--rb-space-2, 1rem);
+  }
+
+  .rb-article {
+    width: min(100%, var(--rb-layout-page-max, 80rem));
+    max-width: none;
+  }
+
+  :is(:root, .rb-theme-root)[data-article-layout="full-width"] .rb-article {
+    width: 100%;
+  }
+
+  :is(:root, .rb-theme-root)[data-article-layout="full-width"]
+    .rb-article-body {
+    max-width: none;
   }
 
   .rb-page-body {
@@ -80,3 +95,237 @@
     transform: translateY(0);
   }
 }
+@layer components {
+  .rb-article-header h1 {
+    word-break: auto-phrase;
+  }
+
+  .rb-article-content :where(h1, h2, h3, h4, h5, h6) {
+    font-weight: 600;
+    line-height: 1.3;
+    text-wrap: balance;
+    word-break: auto-phrase;
+  }
+
+  .rb-article-content :where(h1) {
+    margin-block: 0 1em;
+    font-size: 2.25em;
+  }
+
+  .rb-article-content :where(h2) {
+    margin-block: 2em 1em;
+    font-size: 1.5em;
+  }
+
+  .rb-article-content :where(h3) {
+    margin-block: 1.6em 0.6em;
+    font-size: 1.25em;
+  }
+
+  .rb-article-content :where(h4) {
+    margin-block: 1.5em 0.5em;
+    font-size: 1em;
+  }
+
+  .rb-article-content :where(p) {
+    margin-block: 1.25em;
+  }
+
+  .rb-article-content :where(a) {
+    color: inherit;
+    text-decoration: underline;
+    text-decoration-thickness: 1px;
+    text-underline-offset: 0.2em;
+  }
+
+  .rb-article-content :where(strong) {
+    font-weight: 600;
+  }
+
+  .rb-article-content :where(ul) {
+    list-style-type: disc;
+  }
+
+  .rb-article-content :where(ol) {
+    list-style-type: decimal;
+  }
+
+  .rb-article-content :where(ol[type="A"]) {
+    list-style-type: upper-alpha;
+  }
+
+  .rb-article-content :where(ol[type="a"]) {
+    list-style-type: lower-alpha;
+  }
+
+  .rb-article-content :where(ol[type="I"]) {
+    list-style-type: upper-roman;
+  }
+
+  .rb-article-content :where(ol[type="i"]) {
+    list-style-type: lower-roman;
+  }
+
+  .rb-article-content :where(ul, ol) {
+    margin-block: 1.25em;
+    padding-inline-start: 1.625em;
+  }
+
+  .rb-article-content :where(li) {
+    margin-block: 0.5em;
+  }
+
+  .rb-article-content :where(ul ul, ul ol, ol ul, ol ol) {
+    margin-block: 0.75em;
+  }
+
+  .rb-article-content :where(.task-list-item) {
+    list-style: none;
+  }
+
+  .rb-article-content :where(.task-list-item) > :where(input[type="checkbox"]) {
+    margin-inline-end: 0.5em;
+  }
+
+  .rb-article-content :where(blockquote) {
+    margin-block: 2em;
+    padding-inline-start: 1em;
+    border-inline-start: 2px solid var(--rb-color-border);
+  }
+
+  .rb-article-content :where(hr) {
+    margin-block: 3em;
+    border: 0;
+    border-block-start: 1px solid var(--rb-color-border);
+  }
+
+  .rb-article-content :where(:not(pre) > code) {
+    font-family: var(--rb-font-mono);
+    font-size: 0.875em;
+  }
+
+  .rb-article-content :where(pre):not(:where(.rr-code *)) {
+    margin-block: 1.5em;
+    padding: 0.75rem 1rem;
+    border-radius: 6px;
+    background: var(--rb-color-code-background);
+    color: var(--rb-color-ink);
+    font-family: var(--rb-font-mono);
+    font-size: 0.875em;
+    line-height: 1.7;
+    overflow-x: auto;
+  }
+
+  .rb-article-content :where(pre):not(:where(.rr-code *)) :where(code) {
+    background: none;
+    border: 0;
+    padding: 0;
+    font-size: inherit;
+  }
+
+  .rb-article-content :where(table) {
+    width: 100%;
+    max-width: 100%;
+    border-collapse: collapse;
+    table-layout: auto;
+  }
+
+  .rb-article-content :where(.rb-table-scroll) {
+    max-width: 100%;
+    margin-block: 1.5em;
+    overflow-x: auto;
+  }
+
+  .rb-article-content :where(figure) {
+    margin-block: 2em;
+  }
+
+  .rb-article-content :where(figure > *) {
+    margin-block: 0;
+  }
+
+  .rb-article-content :where(figcaption) {
+    color: var(--rb-color-muted);
+    font-size: 0.875em;
+    line-height: 1.43;
+  }
+
+  .rb-source-fallback {
+    inline-size: 100%;
+    margin-block: 0.75rem 0;
+    border-block-start: 1px solid var(--rb-color-border);
+    color: var(--rb-color-muted);
+    font-size: 0.8125rem;
+    text-align: start;
+  }
+
+  figure > .rb-source-fallback {
+    margin-block: 0;
+  }
+
+  .rb-source-fallback > summary {
+    padding: 0.5rem 0.75rem;
+    cursor: pointer;
+  }
+
+  .rb-source-fallback > pre {
+    overflow: auto;
+    margin: 0 0.75rem 0.75rem;
+    padding: 0.75rem;
+    border: 1px solid var(--rb-color-border);
+    border-radius: 6px;
+    background: var(--rb-color-code-background);
+    color: var(--rb-color-ink);
+    font-size: 0.8125rem;
+  }
+
+  .rb-article-content :where(dl) {
+    margin-block: 1.25em;
+  }
+
+  .rb-article-content :where(dt) {
+    margin-block-start: 1.25em;
+    font-weight: 600;
+  }
+
+  .rb-article-content :where(dd) {
+    margin-block-start: 0.5em;
+    padding-inline-start: 1.625em;
+  }
+
+  .rb-article-content :where(kbd) {
+    padding: 0.15em 0.4em;
+    border: 1px solid var(--rb-color-border);
+    border-radius: 4px;
+    background: var(--rb-color-surface);
+    color: inherit;
+    font-family: var(--rb-font-mono);
+    font-size: 0.875em;
+  }
+
+  .rb-article-content :where(img, picture, video) {
+    margin-block: 2em;
+  }
+
+  .rb-article-content :where(picture > img) {
+    margin-block: 0;
+  }
+
+  .rb-article-content > :where(:first-child) {
+    margin-block-start: 0;
+  }
+
+  .rb-article-content > :where(:last-child) {
+    margin-block-end: 0;
+  }
+
+  .rb-article-content :where(hr, h2, h3, h4) + * {
+    margin-block-start: 0;
+  }
+
+  @media (max-width: 48rem) {
+    .rb-article-content {
+      overflow-wrap: break-word;
+    }
+  }
+}