@riebeckite/plugin-breadcrumbs 0.0.15 → 0.0.17

package/README.md

@@ -32,11 +32,12 @@ render it in the document `<head>` (the reference Riebeckite app renders
 `entry.headTags` in `_renderer.tsx`). Item URLs are made absolute against the
 configured site `baseUrl`.
 
-When the `seo` plugin is also enabled it emits a two-level BreadcrumbList
-(`Home / Note`) inside its own article JSON-LD. The two blocks coexist; to
-avoid duplicate BreadcrumbList entities a Site can drop the seo plugin's
-placeholder for article pages (shown in the reference app's content route) or
-disable `jsonLd` on this plugin (`jsonLd: false`).
+When the `seo` plugin is also enabled it would emit its own two-level
+BreadcrumbList (`Home / Note`) inside the article JSON-LD. Pass the page's
+`headTags` to the seo extension and it detects the BreadcrumbList this plugin
+contributed and omits its own placeholder, so the page carries a single
+BreadcrumbList entity without any Site-side coupling. Set `jsonLd: false` to
+stop this plugin from emitting one instead.
 
 ## Usage
 
@@ -58,7 +59,7 @@ export default defineConfig({
 | `className` | `string` | `"rb-breadcrumbs"` | Root CSS class |
 | `ariaLabel` | `string` | `"Breadcrumbs"` | Accessible nav name |
 | `separator` | `string` | `"/"` | Text between crumbs |
-| `jsonLd` | `boolean` | `true` | Emit/replace the BreadcrumbList script |
+| `jsonLd` | `boolean` | `true` | Emit the BreadcrumbList script |
 
 ```ts
 breadcrumbs({
@@ -103,7 +104,6 @@ import "@riebeckite/plugin-breadcrumbs/style.css";
 - `buildBreadcrumbItems({ manifest, entry, config, homeLabel })` — build the trail
 - `renderBreadcrumbNav(items, options)` — render the navigation HTML
 - `buildBreadcrumbJsonLd(config, items)` — build the JSON-LD object
-- `injectBreadcrumbNav(html, nav)` / `injectBreadcrumbJsonLd(html, schema)` — HTML injection helpers
 - Types: `BreadcrumbsOptions`, `ResolvedBreadcrumbsOptions`, `BreadcrumbItem`
 
 ## Limitations
@@ -115,4 +115,3 @@ import "@riebeckite/plugin-breadcrumbs/style.css";
 ## See also
 
 - [Plugin guide](../../../docs/en/docs/reference/plugin-api.md)
-

package/README_ja.md

@@ -32,11 +32,11 @@ JavaScript は不要です。
 `entry.headTags` を描画します）。アイテムの URL は設定の `baseUrl` に基づき
 絶対 URL に変換されます。
 
-`seo` プラグインも有効な場合、seo 側の記事 JSON-LD に 2 階層の
-BreadcrumbList（`ホーム / ノート`）が含まれます。この 2 つは共存するため、
-BreadcrumbList の重複を避けたい Site は記事ページで seo の暫定版を除去して
-ください（リファレンスアプリのコンテンツルートで実施例を確認できます）。
-無効にする場合は本プラグインの `jsonLd: false` も利用できます。
+`seo` プラグインも有効な場合、seo 側は独自の 2 階層の BreadcrumbList
+（`ホーム / ノート`）を記事 JSON-LD に含めようとします。ページの `headTags`
+を seo 拡張へ渡すと、本プラグインが提供した BreadcrumbList を検出して seo 側の
+暫定版を省略するため、Site 側で調整しなくても BreadcrumbList は 1 つだけに
+なります。本プラグインからの出力自体を止めたい場合は `jsonLd: false` を使います。
 
 ## 使い方
 
@@ -58,7 +58,7 @@ export default defineConfig({
 | `className` | `string` | `"rb-breadcrumbs"` | ルート要素の CSS クラス |
 | `ariaLabel` | `string` | `"Breadcrumbs"` | ナビゲーションのアクセシブル名 |
 | `separator` | `string` | `"/"` | パンくず間の文字 |
-| `jsonLd` | `boolean` | `true` | BreadcrumbList スクリプトを出力・置換する |
+| `jsonLd` | `boolean` | `true` | BreadcrumbList スクリプトを出力する |
 
 ```ts
 breadcrumbs({
@@ -103,7 +103,6 @@ import "@riebeckite/plugin-breadcrumbs/style.css";
 - `buildBreadcrumbItems({ manifest, entry, config, homeLabel })` — パンくず列を組み立てる
 - `renderBreadcrumbNav(items, options)` — ナビゲーション HTML を生成する
 - `buildBreadcrumbJsonLd(config, items)` — JSON-LD オブジェクトを生成する
-- `injectBreadcrumbNav(html, nav)` / `injectBreadcrumbJsonLd(html, schema)` — HTML 注入ヘルパー
 - 型: `BreadcrumbsOptions`, `ResolvedBreadcrumbsOptions`, `BreadcrumbItem`
 
 ## 制約
@@ -112,7 +111,6 @@ import "@riebeckite/plugin-breadcrumbs/style.css";
 - スラッグ階層のみを参照します。frontmatter の並び順や series プラグインの
   順序は意図的に考慮しません。
 
-## ????
-
-- [?????????](../../../docs/ja/docs/reference/plugin-api.md)
+## 関連リンク
 
+- [プラグイン API](../../../docs/ja/docs/reference/plugin-api.md)

package/dist/index.d.ts

@@ -1,15 +1,15 @@
 import type { BreadcrumbsOptions } from "./src/types.js";
 export { buildBreadcrumbItems } from "./src/breadcrumbs.js";
 export { resolveBreadcrumbsOptions } from "./src/options.js";
-export { BREADCRUMBS_ATTRIBUTE, buildBreadcrumbHeadTag, buildBreadcrumbJsonLd, hasBreadcrumbHeadTag, injectBreadcrumbNav, renderBreadcrumbNav, } from "./src/render.js";
+export { BREADCRUMBS_ATTRIBUTE, buildBreadcrumbHeadTag, buildBreadcrumbJsonLd, hasBreadcrumbHeadTag, renderBreadcrumbNav, } from "./src/render.js";
 export type { BreadcrumbItem, BreadcrumbsOptions, ResolvedBreadcrumbsOptions, } from "./src/types.js";
 export declare const BREADCRUMBS_PLUGIN_NAME = "breadcrumbs";
 /**
- * Slug-hierarchy breadcrumbs for Riebeckite notes.
+ * Public-location breadcrumbs for Riebeckite notes.
  *
- * For every published entry it derives a trail from the note's slug and
- * inserts a `<nav>` at the top of the manifest entry HTML, which is the final
- * rendering source. The hierarchical BreadcrumbList JSON-LD is contributed
+ * For every published entry it derives a trail from the note's canonical public location and
+ * contributes a `<nav>` to the article header. The hierarchical BreadcrumbList
+ * JSON-LD is contributed
  * through `entry.headTags` so the Site shell can render it in the document
  * `<head>`. No client runtime is required.
  */

package/dist/index.js

@@ -1,29 +1,45 @@
 // index.ts
 import {
+  appendContentBodySlot,
   createStyleAsset,
   definePlugin
 } from "@riebeckite/core";
 
 // src/breadcrumbs.ts
-import { resolveFolderLocation } from "@riebeckite/core";
+import { resolvePublicFolderLocation } from "@riebeckite/core";
 function buildBreadcrumbItems(args) {
   const { manifest, entry, config, homeLabel } = args;
-  const segments = entry.slug.split("/").filter(Boolean);
-  if (segments.length === 0) return [];
+  if (!entry.slug) return [];
+  const segments = publicPathSegments(entry.publicLocation.permalink);
   const items = [];
   const homeName = homeLabel || config.site.title;
-  if (homeName) items.push({ name: homeName, url: "/" });
+  if (homeName) pushBreadcrumbItem(items, { name: homeName, url: "/" });
+  if (segments.length === 0) return items;
   for (let index = 0; index < segments.length - 1; index++) {
-    const folderSlug = segments.slice(0, index + 1).join("/");
-    const location = resolveFolderLocation(manifest, folderSlug);
-    items.push({
+    const pathname = `/${segments.slice(0, index + 1).join("/")}`;
+    const location = resolvePublicFolderLocation(manifest, pathname);
+    pushBreadcrumbItem(items, {
       name: location.type === "content" ? location.entry.title : titleCaseSegment(segments[index]),
       ...location.type === "content" ? { url: location.entry.publicLocation.permalink } : location.type === "generated" ? { url: location.pathname } : {}
     });
   }
-  items.push({ name: entry.title, url: entry.publicLocation.permalink });
+  pushBreadcrumbItem(items, {
+    name: entry.title,
+    url: entry.publicLocation.permalink
+  });
   return items;
 }
+function pushBreadcrumbItem(items, item) {
+  const previous = items.at(-1);
+  if (previous?.name === item.name) {
+    items[items.length - 1] = item;
+    return;
+  }
+  items.push(item);
+}
+function publicPathSegments(permalink) {
+  return permalink.split("/").filter(Boolean);
+}
 function titleCaseSegment(segment) {
   return segment.length === 0 ? segment : segment.charAt(0).toUpperCase() + segment.slice(1);
 }
@@ -96,23 +112,22 @@ function buildBreadcrumbHeadTag(schema) {
 }
 function hasBreadcrumbHeadTag(headTags) {
   return headTags?.some(
-    (tag) => tag.tag === "script" && typeof tag.children === "string" && tag.children.includes('"@type":"BreadcrumbList"')
+    (tag) => tag.tag === "script" && typeof tag.children === "string" && hasBreadcrumbListJsonLd(tag.children)
   ) ?? false;
 }
-function injectBreadcrumbNav(html, nav) {
-  if (nav === "" || html.includes(BREADCRUMBS_ATTRIBUTE)) return html;
-  const article = /<article\b[^>]*>/i.exec(html);
-  if (article) {
-    const end = article.index + article[0].length;
-    return `${html.slice(0, end)}${nav}${html.slice(end)}`;
+function hasBreadcrumbListJsonLd(value) {
+  try {
+    return hasBreadcrumbListType(JSON.parse(value));
+  } catch {
+    return false;
   }
-  const body = /<body\b[^>]*>/i.exec(html);
-  if (body) {
-    const end = body.index + body[0].length;
-    return `${html.slice(0, end)}${nav}${html.slice(end)}`;
-  }
-  return `${nav}
-${html}`;
+}
+function hasBreadcrumbListType(value) {
+  if (Array.isArray(value)) return value.some(hasBreadcrumbListType);
+  if (!value || typeof value !== "object") return false;
+  const record = value;
+  if (record["@type"] === "BreadcrumbList") return true;
+  return hasBreadcrumbListType(record["@graph"]);
 }
 
 // index.ts
@@ -133,7 +148,6 @@ function breadcrumbs(options = {}) {
       const { config, manifest } = context;
       if (!config) return;
       for (const entry of manifest.publicEntries) {
-        if (entry.html.includes(BREADCRUMBS_ATTRIBUTE)) continue;
         const items = buildBreadcrumbItems({
           manifest,
           entry,
@@ -141,9 +155,10 @@ function breadcrumbs(options = {}) {
           homeLabel: resolved.homeLabel
         });
         if (items.length === 0) continue;
-        let html = entry.html;
         const nav = renderBreadcrumbNav(items, resolved);
-        html = injectBreadcrumbNav(html, nav);
+        if (!hasSlotFragment(entry.bodySlots?.["article.header"], nav)) {
+          appendContentBodySlot(entry, "article.header", nav);
+        }
         if (resolved.jsonLd) {
           const schema = buildBreadcrumbJsonLd(config, items);
           if (!hasBreadcrumbHeadTag(entry.headTags)) {
@@ -153,13 +168,19 @@ function breadcrumbs(options = {}) {
             ];
           }
         }
-        entry.html = html;
       }
     },
     assets: [createStyleAsset(BREADCRUMBS_PLUGIN_NAME)]
   });
 }
 var breadcrumbsPlugin = breadcrumbs;
+function hasSlotFragment(slot, fragment) {
+  return slot === fragment || slot?.startsWith(`${fragment}
+`) || slot?.endsWith(`
+${fragment}`) || slot?.includes(`
+${fragment}
+`) || false;
+}
 function validateBreadcrumbsOptions(options) {
   if (!options) return [];
   const issues = [];
@@ -187,7 +208,6 @@ export {
   buildBreadcrumbItems,
   buildBreadcrumbJsonLd,
   hasBreadcrumbHeadTag,
-  injectBreadcrumbNav,
   renderBreadcrumbNav,
   resolveBreadcrumbsOptions
 };

package/dist/src/render.d.ts

@@ -22,13 +22,3 @@ export declare function buildBreadcrumbHeadTag(schema: Record<string, unknown>):
  * repeated plugin passes do not emit duplicates.
  */
 export declare function hasBreadcrumbHeadTag(headTags: readonly PluginHeadTag[] | undefined): boolean;
-/**
- * Places the completed navigation at the top of the note.
- *
- * When the HTML is a full page (it contains an `<article>` or `<body>` tag)
- * the nav is inserted right after that opening tag. The manifest `html` we
- * operate on is normally a content fragment the Site wraps in its own
- * `<article>`, in which case the nav is simply prepended so it renders above
- * the note's title.
- */
-export declare function injectBreadcrumbNav(html: string, nav: string): string;

package/dist/src/types.d.ts

@@ -16,9 +16,7 @@ export type BreadcrumbsOptions = {
     /** Text placed between siblings (defaults to "/"). */
     separator?: string;
     /**
-     * Emit a BreadcrumbList JSON-LD script. When the seo plugin already
-     * rendered one, its list is replaced with the hierarchical trail
-     * (defaults to `true`).
+     * Emit a hierarchical BreadcrumbList JSON-LD script (defaults to `true`).
      */
     jsonLd?: boolean;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riebeckite/plugin-breadcrumbs",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./dist/index.js",
@@ -15,11 +15,11 @@
     "./style.css": "./style.css"
   },
   "dependencies": {
-    "@riebeckite/core": "0.0.15"
+    "@riebeckite/core": "0.0.17"
   },
   "devDependencies": {
     "tsx": "^4.22.4",
-    "@riebeckite/test": "0.0.15"
+    "@riebeckite/test": "0.0.17"
   },
   "publishConfig": {
     "access": "public"