@backmatter/next 0.0.15 → 0.0.17

package/dist/config.cjs

@@ -84,8 +84,10 @@ var import_node_path2 = __toESM(require("node:path"));
 var DEFAULT_DIRS = {
   models: "models",
   blocks: "blocks",
+  richtext: "richtext",
   mdx: "mdx",
-  layouts: "layouts"
+  layouts: "layouts",
+  objects: "objects"
 };
 
 // ../core/src/node/discover.ts
@@ -146,6 +148,9 @@ function listBlockFallbackFiles(root, blocksDir = "blocks") {
 function listLayoutFiles(root, layoutsDir = "layouts") {
   return listModelFiles(root, layoutsDir);
 }
+function listObjectFiles(root, objectsDir = "objects") {
+  return listModelFiles(root, objectsDir);
+}
 function listBlockFiles(root, blocksDir = "blocks") {
   const { files, skipped } = listPascalCaseFiles(root, blocksDir);
   return { blocks: files, skipped };
@@ -182,7 +187,7 @@ function detectSdk(root) {
 }
 function renderCachedCmsClient() {
   return [
-    "const raw = createBackmatter({ ...config, models });",
+    "const raw = createBackmatter({ ...config, models, sync: false });",
     "",
     "async function getDoc(locale: string, type: string, slug: string) {",
     '  "use cache";',
@@ -237,6 +242,8 @@ function renderModelsBarrel(input) {
 `;
 }
 function renderSyncBarrel(input) {
+  const objects = input.objects ?? [];
+  const richtext = input.richtext ?? [];
   const lines = [GENERATED_HEADER, `import { createBackmatter } from "${input.sdk}";`];
   if (input.configFile) {
     lines.push(`import config from "${importSpecifier(input.outDir, input.configFile)}";`);
@@ -249,14 +256,24 @@ function renderSyncBarrel(input) {
   for (const b of input.blocks) {
     lines.push(`import ${b.name} from "${importSpecifier(input.outDir, b.file)}";`);
   }
+  for (const b of richtext) {
+    lines.push(`import richtext${b.name} from "${importSpecifier(input.outDir, b.file)}";`);
+  }
+  for (const object of objects) {
+    lines.push(`import ${object.importName} from "${importSpecifier(input.outDir, object.file)}";`);
+  }
   lines.push("");
   lines.push(`export const models = [${input.models.map((m) => m.importName).join(", ")}] as const;`);
   lines.push("export type Models = typeof models;");
   lines.push("");
   lines.push(`export const blocks = [${input.blocks.map((b) => b.name).join(", ")}] as const;`);
   lines.push("");
+  lines.push(`export const richtext = [${richtext.map((b) => `richtext${b.name}`).join(", ")}] as const;`);
+  lines.push("");
+  lines.push(`export const objects = [${objects.map((o) => o.importName).join(", ")}] as const;`);
+  lines.push("");
   lines.push("/** Typed content client: cms.query.{type}, cms.getDoc, cms.listDocs. */");
-  lines.push("export const cms = createBackmatter({ ...config, models, blocks });");
+  lines.push("export const cms = createBackmatter({ ...config, models, blocks, richtext, objects, sync: true });");
   return `${lines.join(`
 `)}
 `;
@@ -274,6 +291,19 @@ function renderMdxBarrel(input) {
 `)}
 `;
 }
+function renderRichtextBarrel(input) {
+  const lines = [GENERATED_HEADER];
+  for (const b of input.richtext) {
+    lines.push(`import ${b.name} from "${importSpecifier(input.outDir, b.file)}";`);
+  }
+  lines.push("");
+  lines.push("/** In-content blocks: <Image /> in MDX resolves to richtext/Image.tsx. */");
+  const entries = input.richtext.map((b) => `${b.name}: ${b.name}.component`);
+  lines.push(`export const richtextComponents = ${entries.length ? `{ ${entries.join(", ")} }` : "{}"};`);
+  return `${lines.join(`
+`)}
+`;
+}
 function renderBlocksBarrel(input) {
   const lines = [GENERATED_HEADER, ""];
   lines.push('/** Composer loaders: JSON `{ type: "Hero" }` → dynamic import of blocks/Hero.tsx. */');
@@ -316,6 +346,7 @@ var REGISTRY_FILES = [
   "blocks.ts",
   "block-fallbacks.ts",
   "mdx.ts",
+  "richtext.ts",
   "layouts.ts",
   "sync.ts"
 ];
@@ -324,9 +355,11 @@ function generate(options) {
   const outDir = import_node_path2.default.resolve(root, options.outDir ?? DEFAULT_OUT_DIR);
   const models = listModelFiles(root, options.modelsDir ?? DEFAULT_DIRS.models);
   const { blocks, skipped: skippedBlocks } = listBlockFiles(root, options.blocksDir ?? DEFAULT_DIRS.blocks);
+  const { blocks: richtext, skipped: skippedRichtext } = listBlockFiles(root, options.richtextDir ?? DEFAULT_DIRS.richtext);
   const fallbacks = listBlockFallbackFiles(root, options.blocksDir ?? DEFAULT_DIRS.blocks);
   const { blocks: mdx, skipped: skippedMdx } = listMdxFiles(root, options.mdxDir ?? DEFAULT_DIRS.mdx);
   const layouts = listLayoutFiles(root, options.layoutsDir ?? DEFAULT_DIRS.layouts);
+  const objects = listObjectFiles(root, options.objectsDir ?? DEFAULT_DIRS.objects);
   const sdk = options.sdk ?? detectSdk(root);
   const configFile = findConfigFile(root);
   const write = options.write ?? true;
@@ -335,8 +368,9 @@ function generate(options) {
     "blocks.ts": renderBlocksBarrel({ outDir, blocks }),
     "block-fallbacks.ts": renderBlockFallbacksBarrel({ outDir, fallbacks }),
     "mdx.ts": renderMdxBarrel({ outDir, mdx }),
+    "richtext.ts": renderRichtextBarrel({ outDir, richtext }),
     "layouts.ts": renderLayoutsBarrel({ outDir, layouts }),
-    "sync.ts": renderSyncBarrel({ outDir, models, blocks, configFile, sdk })
+    "sync.ts": renderSyncBarrel({ outDir, models, blocks, richtext, objects, configFile, sdk })
   };
   const outputs = REGISTRY_FILES.map((name) => {
     const file = import_node_path2.default.join(outDir, name);
@@ -354,9 +388,11 @@ function generate(options) {
     changed: outputs.filter((o) => o.changed).map((o) => o.rel),
     models,
     blocks,
+    richtext,
     mdx,
     layouts,
-    skippedBlocks,
+    objects,
+    skippedBlocks: [...skippedBlocks, ...skippedRichtext],
     skippedMdx,
     configFile
   };
@@ -391,8 +427,10 @@ function resolveLoaderOptions(options = {}) {
     outDir: options.outDir ?? DEFAULT_OUT_DIR,
     modelsDir: options.modelsDir ?? DEFAULT_DIRS.models,
     blocksDir: options.blocksDir ?? DEFAULT_DIRS.blocks,
+    richtextDir: options.richtextDir ?? DEFAULT_DIRS.richtext,
     mdxDir: options.mdxDir ?? DEFAULT_DIRS.mdx,
     layoutsDir: options.layoutsDir ?? DEFAULT_DIRS.layouts,
+    objectsDir: options.objectsDir ?? DEFAULT_DIRS.objects,
     sdk: SDK
   };
 }
@@ -408,7 +446,7 @@ function registryMatchers(loaderOptions) {
   const escaped = rel.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
   return {
     glob: `**/${rel}/*.ts`,
-    test: new RegExp(`(^|[\\\\/])${escaped.replace(/\//g, "[\\\\/]")}[\\\\/](index|blocks|block-fallbacks|mdx|layouts|sync)\\.ts$`)
+    test: new RegExp(`(^|[\\\\/])${escaped.replace(/\//g, "[\\\\/]")}[\\\\/](index|blocks|block-fallbacks|mdx|richtext|layouts|sync)\\.ts$`)
   };
 }
 function withBackmatter(nextConfig = {}, options = {}) {

package/dist/loader.cjs

@@ -78,8 +78,10 @@ var import_node_path2 = __toESM(require("node:path"));
 var DEFAULT_DIRS = {
   models: "models",
   blocks: "blocks",
+  richtext: "richtext",
   mdx: "mdx",
-  layouts: "layouts"
+  layouts: "layouts",
+  objects: "objects"
 };
 
 // ../core/src/node/discover.ts
@@ -140,6 +142,9 @@ function listBlockFallbackFiles(root, blocksDir = "blocks") {
 function listLayoutFiles(root, layoutsDir = "layouts") {
   return listModelFiles(root, layoutsDir);
 }
+function listObjectFiles(root, objectsDir = "objects") {
+  return listModelFiles(root, objectsDir);
+}
 function listBlockFiles(root, blocksDir = "blocks") {
   const { files, skipped } = listPascalCaseFiles(root, blocksDir);
   return { blocks: files, skipped };
@@ -176,7 +181,7 @@ function detectSdk(root) {
 }
 function renderCachedCmsClient() {
   return [
-    "const raw = createBackmatter({ ...config, models });",
+    "const raw = createBackmatter({ ...config, models, sync: false });",
     "",
     "async function getDoc(locale: string, type: string, slug: string) {",
     '  "use cache";',
@@ -231,6 +236,8 @@ function renderModelsBarrel(input) {
 `;
 }
 function renderSyncBarrel(input) {
+  const objects = input.objects ?? [];
+  const richtext = input.richtext ?? [];
   const lines = [GENERATED_HEADER, `import { createBackmatter } from "${input.sdk}";`];
   if (input.configFile) {
     lines.push(`import config from "${importSpecifier(input.outDir, input.configFile)}";`);
@@ -243,14 +250,24 @@ function renderSyncBarrel(input) {
   for (const b of input.blocks) {
     lines.push(`import ${b.name} from "${importSpecifier(input.outDir, b.file)}";`);
   }
+  for (const b of richtext) {
+    lines.push(`import richtext${b.name} from "${importSpecifier(input.outDir, b.file)}";`);
+  }
+  for (const object of objects) {
+    lines.push(`import ${object.importName} from "${importSpecifier(input.outDir, object.file)}";`);
+  }
   lines.push("");
   lines.push(`export const models = [${input.models.map((m) => m.importName).join(", ")}] as const;`);
   lines.push("export type Models = typeof models;");
   lines.push("");
   lines.push(`export const blocks = [${input.blocks.map((b) => b.name).join(", ")}] as const;`);
   lines.push("");
+  lines.push(`export const richtext = [${richtext.map((b) => `richtext${b.name}`).join(", ")}] as const;`);
+  lines.push("");
+  lines.push(`export const objects = [${objects.map((o) => o.importName).join(", ")}] as const;`);
+  lines.push("");
   lines.push("/** Typed content client: cms.query.{type}, cms.getDoc, cms.listDocs. */");
-  lines.push("export const cms = createBackmatter({ ...config, models, blocks });");
+  lines.push("export const cms = createBackmatter({ ...config, models, blocks, richtext, objects, sync: true });");
   return `${lines.join(`
 `)}
 `;
@@ -268,6 +285,19 @@ function renderMdxBarrel(input) {
 `)}
 `;
 }
+function renderRichtextBarrel(input) {
+  const lines = [GENERATED_HEADER];
+  for (const b of input.richtext) {
+    lines.push(`import ${b.name} from "${importSpecifier(input.outDir, b.file)}";`);
+  }
+  lines.push("");
+  lines.push("/** In-content blocks: <Image /> in MDX resolves to richtext/Image.tsx. */");
+  const entries = input.richtext.map((b) => `${b.name}: ${b.name}.component`);
+  lines.push(`export const richtextComponents = ${entries.length ? `{ ${entries.join(", ")} }` : "{}"};`);
+  return `${lines.join(`
+`)}
+`;
+}
 function renderBlocksBarrel(input) {
   const lines = [GENERATED_HEADER, ""];
   lines.push('/** Composer loaders: JSON `{ type: "Hero" }` → dynamic import of blocks/Hero.tsx. */');
@@ -310,6 +340,7 @@ var REGISTRY_FILES = [
   "blocks.ts",
   "block-fallbacks.ts",
   "mdx.ts",
+  "richtext.ts",
   "layouts.ts",
   "sync.ts"
 ];
@@ -318,9 +349,11 @@ function generate(options) {
   const outDir = import_node_path2.default.resolve(root, options.outDir ?? DEFAULT_OUT_DIR);
   const models = listModelFiles(root, options.modelsDir ?? DEFAULT_DIRS.models);
   const { blocks, skipped: skippedBlocks } = listBlockFiles(root, options.blocksDir ?? DEFAULT_DIRS.blocks);
+  const { blocks: richtext, skipped: skippedRichtext } = listBlockFiles(root, options.richtextDir ?? DEFAULT_DIRS.richtext);
   const fallbacks = listBlockFallbackFiles(root, options.blocksDir ?? DEFAULT_DIRS.blocks);
   const { blocks: mdx, skipped: skippedMdx } = listMdxFiles(root, options.mdxDir ?? DEFAULT_DIRS.mdx);
   const layouts = listLayoutFiles(root, options.layoutsDir ?? DEFAULT_DIRS.layouts);
+  const objects = listObjectFiles(root, options.objectsDir ?? DEFAULT_DIRS.objects);
   const sdk = options.sdk ?? detectSdk(root);
   const configFile = findConfigFile(root);
   const write = options.write ?? true;
@@ -329,8 +362,9 @@ function generate(options) {
     "blocks.ts": renderBlocksBarrel({ outDir, blocks }),
     "block-fallbacks.ts": renderBlockFallbacksBarrel({ outDir, fallbacks }),
     "mdx.ts": renderMdxBarrel({ outDir, mdx }),
+    "richtext.ts": renderRichtextBarrel({ outDir, richtext }),
     "layouts.ts": renderLayoutsBarrel({ outDir, layouts }),
-    "sync.ts": renderSyncBarrel({ outDir, models, blocks, configFile, sdk })
+    "sync.ts": renderSyncBarrel({ outDir, models, blocks, richtext, objects, configFile, sdk })
   };
   const outputs = REGISTRY_FILES.map((name) => {
     const file = import_node_path2.default.join(outDir, name);
@@ -348,9 +382,11 @@ function generate(options) {
     changed: outputs.filter((o) => o.changed).map((o) => o.rel),
     models,
     blocks,
+    richtext,
     mdx,
     layouts,
-    skippedBlocks,
+    objects,
+    skippedBlocks: [...skippedBlocks, ...skippedRichtext],
     skippedMdx,
     configFile
   };
@@ -362,20 +398,26 @@ function backmatterLoader(source) {
   const root = import_node_path3.default.resolve(options.root);
   const modelsDir = import_node_path3.default.resolve(root, options.modelsDir);
   const blocksDir = import_node_path3.default.resolve(root, options.blocksDir);
+  const richtextDir = import_node_path3.default.resolve(root, options.richtextDir);
   const mdxDir = import_node_path3.default.resolve(root, options.mdxDir);
   const layoutsDir = import_node_path3.default.resolve(root, options.layoutsDir);
+  const objectsDir = import_node_path3.default.resolve(root, options.objectsDir);
   this.addContextDependency(modelsDir);
   this.addContextDependency(blocksDir);
+  this.addContextDependency(richtextDir);
   this.addContextDependency(mdxDir);
   this.addContextDependency(layoutsDir);
+  this.addContextDependency(objectsDir);
   this.cacheable?.(true);
   const result = generate({
     root,
     outDir: options.outDir,
     modelsDir: options.modelsDir,
     blocksDir: options.blocksDir,
+    richtextDir: options.richtextDir,
     mdxDir: options.mdxDir,
     layoutsDir: options.layoutsDir,
+    objectsDir: options.objectsDir,
     sdk: options.sdk
   });
   if (result.configFile)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backmatter/next",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "description": "Experimental Next.js adapter for Backmatter. APIs will break. Not ready for production.",
   "type": "module",
   "publishConfig": {
@@ -38,7 +38,7 @@
     "test": "bun test"
   },
   "dependencies": {
-    "@backmatter/core": "^0.0.14",
+    "@backmatter/core": "^0.0.16",
     "@mdx-js/mdx": "^3.1.1",
     "remark-gfm": "^4.0.1"
   },

package/src/config.ts

@@ -5,7 +5,7 @@
 //    resolve `import { cms } from ".backmatter"`.
 // 2. Registers `@backmatter/next/loader` for the registry files with Turbopack
 //    (Next 16 default) and webpack (`next build --webpack`). The loader declares
-//    `models/`, `blocks/`, and `mdx/` as context dependencies, so the bundler's
+//    `models/`, `blocks/`, `richtext/`, and `mdx/` as context dependencies, so the bundler's
 //    own file watcher keeps the registry fresh — no polling, no second watcher process.
 import { existsSync } from "node:fs";
 import path from "node:path";
@@ -24,8 +24,10 @@ export type WithBackmatterOptions = {
   outDir?: string;
   modelsDir?: string;
   blocksDir?: string;
+  richtextDir?: string;
   mdxDir?: string;
   layoutsDir?: string;
+  objectsDir?: string;
   /** Called after the boot-time generation. Default: log what changed. */
   onGenerate?: (result: GenerateResult) => void;
 };
@@ -80,8 +82,10 @@ export function resolveLoaderOptions(options: WithBackmatterOptions = {}): Backm
     outDir: options.outDir ?? DEFAULT_OUT_DIR,
     modelsDir: options.modelsDir ?? DEFAULT_DIRS.models,
     blocksDir: options.blocksDir ?? DEFAULT_DIRS.blocks,
+    richtextDir: options.richtextDir ?? DEFAULT_DIRS.richtext,
     mdxDir: options.mdxDir ?? DEFAULT_DIRS.mdx,
     layoutsDir: options.layoutsDir ?? DEFAULT_DIRS.layouts,
+    objectsDir: options.objectsDir ?? DEFAULT_DIRS.objects,
     sdk: SDK,
   };
 }
@@ -104,7 +108,7 @@ export function registryMatchers(loaderOptions: BackmatterLoaderOptions): { glob
   const escaped = rel.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
   return {
     glob: `**/${rel}/*.ts`,
-    test: new RegExp(`(^|[\\\\/])${escaped.replace(/\//g, "[\\\\/]")}[\\\\/](index|blocks|block-fallbacks|mdx|layouts|sync)\\.ts$`),
+    test: new RegExp(`(^|[\\\\/])${escaped.replace(/\//g, "[\\\\/]")}[\\\\/](index|blocks|block-fallbacks|mdx|richtext|layouts|sync)\\.ts$`),
   };
 }
 

package/src/loader.ts

@@ -1,10 +1,10 @@
 // packages/next/src/loader.ts
-// Bundler loader for `.backmatter/index.ts`, `.backmatter/blocks.ts`, `.backmatter/mdx.ts`,
-// and `.backmatter/layouts.ts`.
+// Bundler loader for `.backmatter/index.ts`, `.backmatter/blocks.ts`,
+// `.backmatter/mdx.ts`, `.backmatter/richtext.ts`, and `.backmatter/layouts.ts`.
 //
 // This is the Tailwind-JIT mechanism: instead of running our own watcher we
 // tell the bundler that these modules depend on the `models/`, `blocks/`,
-// `mdx/`, and `layouts/` directories. webpack and Turbopack already watch the filesystem;
+// `richtext/`, `mdx/`, and `layouts/` directories. webpack and Turbopack already watch the filesystem;
 // when a file is added, removed or renamed there they invalidate the module,
 // re-run this loader, and we regenerate the barrel from a fresh `readdir`.
 import path from "node:path";
@@ -15,8 +15,10 @@ export type BackmatterLoaderOptions = {
   outDir: string;
   modelsDir: string;
   blocksDir: string;
+  richtextDir: string;
   mdxDir: string;
   layoutsDir: string;
+  objectsDir: string;
   sdk: string;
 };
 
@@ -34,13 +36,17 @@ export default function backmatterLoader(this: BackmatterLoaderContext, source:
   const root = path.resolve(options.root);
   const modelsDir = path.resolve(root, options.modelsDir);
   const blocksDir = path.resolve(root, options.blocksDir);
+  const richtextDir = path.resolve(root, options.richtextDir);
   const mdxDir = path.resolve(root, options.mdxDir);
   const layoutsDir = path.resolve(root, options.layoutsDir);
+  const objectsDir = path.resolve(root, options.objectsDir);
 
   this.addContextDependency(modelsDir);
   this.addContextDependency(blocksDir);
+  this.addContextDependency(richtextDir);
   this.addContextDependency(mdxDir);
   this.addContextDependency(layoutsDir);
+  this.addContextDependency(objectsDir);
   this.cacheable?.(true);
 
   const result = generate({
@@ -48,8 +54,10 @@ export default function backmatterLoader(this: BackmatterLoaderContext, source:
     outDir: options.outDir,
     modelsDir: options.modelsDir,
     blocksDir: options.blocksDir,
+    richtextDir: options.richtextDir,
     mdxDir: options.mdxDir,
     layoutsDir: options.layoutsDir,
+    objectsDir: options.objectsDir,
     sdk: options.sdk,
   });
   if (result.configFile) this.addDependency(result.configFile);

package/src/routes.ts

@@ -4,7 +4,7 @@
 // `route` template (including `/` via indexSlug), loads it and renders MDX
 // or JSON pages. An optional catch-all is required so `/` is a CMS route.
 import { Fragment, Suspense, createElement, type ReactNode } from "react";
-import { matchRoute, modelFormat, PREVIEW_CHECKOUT_QUERY, PREVIEW_COOKIE, readPreviewCookie, routeSegments, type BackmatterDoc, type ModelDef } from "@backmatter/core";
+import { isRoutable, matchRoute, modelFormat, PREVIEW_CHECKOUT_QUERY, PREVIEW_COOKIE, readPreviewCookie, routeSegments, type BackmatterDoc, type ModelDef } from "@backmatter/core";
 import type { BackmatterClient } from "@backmatter/core/node/create-backmatter";
 import { fetchPreviewDoc } from "@backmatter/core/preview";
 import { renderDoc, type MdxComponents } from "./mdx-compile";
@@ -63,7 +63,7 @@ export type CatchAllRoute = {
   Page: (props: {
     params: Promise<CatchAllParams>;
     searchParams?: Promise<CatchAllSearchParams>;
-  }) => Promise<ReactNode>;
+  }) => ReactNode;
   CmsRoute: (props: {
     params: Promise<CatchAllParams> | CatchAllParams;
     searchParams?: Promise<CatchAllSearchParams> | CatchAllSearchParams;
@@ -162,7 +162,7 @@ export function createCatchAll<Models extends readonly ModelDef[]>(
     const params: CatchAllParams[] = [];
     for (const doc of docs) {
       const model = byType.get(doc.type);
-      if (!model) continue;
+      if (!model || !isRoutable(model)) continue;
       params.push({ [CATCH_ALL_PARAM]: routeSegments(model, doc.locale, doc.slug) });
     }
     return params;
@@ -248,7 +248,7 @@ export function createCatchAll<Models extends readonly ModelDef[]>(
     params: Promise<CatchAllParams> | CatchAllParams;
     searchParams?: Promise<CatchAllSearchParams> | CatchAllSearchParams;
   }) => {
-    const resolved = await cachedRouteParams(params);
+    const resolved = await params;
     const hit = resolve(resolved[CATCH_ALL_PARAM]);
     if (!hit) return failFor();
     const doc = await cms.getDoc(hit.locale, hit.type, hit.slug);
@@ -267,7 +267,7 @@ export function createCatchAll<Models extends readonly ModelDef[]>(
     params: Promise<CatchAllParams> | CatchAllParams;
     searchParams?: Promise<CatchAllSearchParams> | CatchAllSearchParams;
   }) => {
-    const resolved = await cachedRouteParams(params);
+    const resolved = await params;
     const hit = resolve(resolved[CATCH_ALL_PARAM]);
     if (!hit) return null;
     const preview = await resolvePreviewState(cms, options.preview, searchParams);
@@ -284,11 +284,15 @@ export function createCatchAll<Models extends readonly ModelDef[]>(
     );
   };
 
-  const Page: CatchAllRoute["Page"] = async (props) =>
+  const Page: CatchAllRoute["Page"] = (props) =>
     createElement(
       Fragment,
       null,
-      await PublishedRoute(props),
+      createElement(
+        Suspense,
+        { fallback: createElement("div", { "aria-busy": "true", style: { minHeight: "100vh" } }) },
+        createElement(PublishedRoute, props),
+      ),
       createElement(Suspense, { fallback: null }, createElement(PreviewBranch, props)),
     );