@takazudo/zudo-doc 0.2.0-next.2 → 0.2.0-next.5

package/README.md

@@ -2,7 +2,7 @@
 
 Framework primitives that sit on top of zfb's engine — the framework layer that zfb deliberately doesn't ship (per ADR-003).
 
-This package is part of the **Astro→zfb migration** (super-epic [#473](https://github.com/zudolab/zudo-doc/issues/473)). It implements the [E5 epic](https://github.com/zudolab/zudo-doc/issues/474) and provides the missing-by-design framework concerns:
+This package provides the missing-by-design framework concerns:
 
 - **Sidebar tree builder** (`./sidebar-tree`) — turns collection entries + `_category_.json` into a sidebar `SidebarNode[]`.
 - **Theme controls** (`./theme`) — color scheme provider + design-token tweak panel (Preact island that wraps an iframe).
@@ -10,7 +10,7 @@ This package is part of the **Astro→zfb migration** (super-epic [#473](https:/
 - **Breadcrumb** (`./breadcrumb`) — JSX breadcrumb fed by the sidebar tree.
 - **DocLayout** (`./doclayout`) — composable layout shell with explicit `<Header>`, `<Sidebar>`, `<Main>`, `<Toc>`, `<Footer>` props; ships a `<DocLayoutWithDefaults>` wrapper that holds the 16 `create-zudo-doc` injection anchors.
 - **View Transitions** (`./transitions`) — native View Transitions API shim (Chrome/Edge/Safari 18+); persistent regions via `view-transition-name`. No-op fallback in Firefox.
-- **Head injection** (`./head`) — canonical, og:\*, twitter:\*, robots, preload hints, RSS link, sitemap link, theme-color — byte-equal to today's Astro output.
+- **Head injection** (`./head`) — canonical, og:\*, twitter:\*, robots, preload hints, RSS link, sitemap link, theme-color — byte-equal to today's legacy doc-layout output.
 - **SSR-skip wrappers** (`./ssr-skip`) — `<AiChatModalIsland>`, `<ImageEnlargeIsland>`, `<DesignTokenTweakPanelIsland>`, `<MockInitIsland>` — wrap zfb's `<Island ssrFallback>` with the right fallback markup so doc pages don't have to re-implement the SSR-skip pattern.
 
 ## Pre-publish dev workflow

package/dist/breadcrumb/breadcrumb.js

@@ -1,5 +1,6 @@
 import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
 import { findPath } from "./find-path.js";
+import { ChevronRight } from "../icons/index.js";
 function buildBreadcrumbItems(tree, currentId, homeHref) {
   const items = [{ label: "", href: homeHref }];
   const path = findPath(tree, currentId);
@@ -41,26 +42,7 @@ function isPathLike(text) {
   return false;
 }
 function ChevronIcon() {
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      class: "h-icon-xs w-icon-xs text-muted shrink-0",
-      fill: "none",
-      viewBox: "0 0 24 24",
-      stroke: "currentColor",
-      "stroke-width": "2",
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx(
-        "path",
-        {
-          "stroke-linecap": "round",
-          "stroke-linejoin": "round",
-          d: "M9 5l7 7-7 7"
-        }
-      )
-    }
-  );
+  return /* @__PURE__ */ jsx(ChevronRight, { className: "h-icon-xs w-icon-xs text-muted shrink-0" });
 }
 function HomeIcon() {
   return /* @__PURE__ */ jsx(

package/dist/code-syntax/mermaid-init-script.d.ts

@@ -16,7 +16,7 @@
  * tests can override the URL — e.g. self-hosted mirrors, version-
  * locked deployments — without re-templating the whole script.
  */
-declare const MERMAID_CDN_MODULE_URL = "https://esm.sh/mermaid@11.4.1";
+declare const MERMAID_CDN_MODULE_URL = "https://esm.sh/mermaid@11.15.0";
 /**
  * Build the inline init script with a caller-supplied module URL.
  *

package/dist/code-syntax/mermaid-init-script.js

@@ -1,5 +1,5 @@
 import { AFTER_NAVIGATE_EVENT } from "../transitions/page-events.js";
-const MERMAID_CDN_MODULE_URL = "https://esm.sh/mermaid@11.4.1";
+const MERMAID_CDN_MODULE_URL = "https://esm.sh/mermaid@11.15.0";
 function buildMermaidInitScript(cdnUrl) {
   const safeUrlLiteral = JSON.stringify(cdnUrl).replace(
     /<\/(script)/gi,

package/dist/content/content-blockquote.d.ts

@@ -1,11 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    children?: ComponentChildren;
-    className?: string;
-    [key: string]: any;
-};
-declare function ContentBlockquote({ children, className, ...rest }: Props): preact.JSX.Element;
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["blockquote"];
+declare function ContentBlockquote({ children, className, ...rest }: Props): JSX.Element;
 
 export { ContentBlockquote };

package/dist/content/content-code.d.ts

@@ -1,11 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    children?: ComponentChildren;
-    className?: string;
-    [key: string]: any;
-};
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["code"];
 /**
  * Override for inline `<code>` in MDX. Wraps text-only inline code with
  * <SmartBreak> so that path/URL-like strings (e.g. `src/foo/bar.ts`) can
@@ -21,6 +19,6 @@ type Props = {
  * `extractText` unwraps that so the heuristic works regardless of MDX's
  * internal wrapping.
  */
-declare function ContentCode({ children, className, ...rest }: Props): preact.JSX.Element;
+declare function ContentCode({ children, className, ...rest }: Props): JSX.Element;
 
 export { ContentCode };

package/dist/content/content-link.d.ts

@@ -1,12 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    href?: string;
-    className?: string;
-    children?: ComponentChildren;
-    [key: string]: any;
-};
-declare function ContentLink({ href, className, children, ...rest }: Props): preact.JSX.Element;
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["a"];
+declare function ContentLink({ href, className, children, ...rest }: Props): JSX.Element;
 
 export { ContentLink };

package/dist/content/content-link.js

@@ -2,7 +2,7 @@ import { jsx } from "preact/jsx-runtime";
 import { SmartBreak as SmartBreakBase } from "../toc/smart-break.js";
 const SmartBreak = SmartBreakBase;
 function ContentLink({ href, className, children, ...rest }) {
-  const classes = className ? className.split(" ") : [];
+  const classes = typeof className === "string" ? className.split(" ") : [];
   if (classes.includes("block") || classes.includes("hash-link")) {
     return /* @__PURE__ */ jsx("a", { href, className, ...rest, children });
   }

package/dist/content/content-ol.d.ts

@@ -1,11 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    children?: ComponentChildren;
-    className?: string;
-    [key: string]: any;
-};
-declare function ContentOl({ children, className, ...rest }: Props): preact.JSX.Element;
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["ol"];
+declare function ContentOl({ children, className, ...rest }: Props): JSX.Element;
 
 export { ContentOl };

package/dist/content/content-paragraph.d.ts

@@ -1,10 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    children?: ComponentChildren;
-    [key: string]: any;
-};
-declare function ContentParagraph({ children, ...rest }: Props): preact.JSX.Element;
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["p"];
+declare function ContentParagraph({ children, ...rest }: Props): JSX.Element;
 
 export { ContentParagraph };

package/dist/content/content-strong.d.ts

@@ -1,11 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    children?: ComponentChildren;
-    className?: string;
-    [key: string]: any;
-};
-declare function ContentStrong({ children, className, ...rest }: Props): preact.JSX.Element;
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["strong"];
+declare function ContentStrong({ children, className, ...rest }: Props): JSX.Element;
 
 export { ContentStrong };

package/dist/content/content-table.d.ts

@@ -1,11 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    children?: ComponentChildren;
-    className?: string;
-    [key: string]: any;
-};
-declare function ContentTable({ children, className, ...rest }: Props): preact.JSX.Element;
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["table"];
+declare function ContentTable({ children, className, ...rest }: Props): JSX.Element;
 
 export { ContentTable };

package/dist/content/content-ul.d.ts

@@ -1,11 +1,9 @@
-import * as preact from 'preact';
-import { ComponentChildren } from 'preact';
+import { JSX } from 'preact';
 
-type Props = {
-    children?: ComponentChildren;
-    className?: string;
-    [key: string]: any;
-};
-declare function ContentUl({ children, className, ...rest }: Props): preact.JSX.Element;
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+type Props = JSX.IntrinsicElements["ul"];
+declare function ContentUl({ children, className, ...rest }: Props): JSX.Element;
 
 export { ContentUl };

package/dist/content/heading-h2.d.ts

@@ -1,14 +1,9 @@
-import { ComponentChildren, JSX } from 'preact';
+import { JSX } from 'preact';
 
 /** @jsxRuntime automatic */
 /** @jsxImportSource preact */
 
-type Props = {
-    id?: string;
-    className?: string;
-    children?: ComponentChildren;
-    [key: string]: any;
-};
+type Props = JSX.IntrinsicElements["h2"];
 declare function HeadingH2({ id, children, className, ...rest }: Props): JSX.Element;
 
 export { HeadingH2 };

package/dist/content/heading-h3.d.ts

@@ -1,14 +1,9 @@
-import { ComponentChildren, JSX } from 'preact';
+import { JSX } from 'preact';
 
 /** @jsxRuntime automatic */
 /** @jsxImportSource preact */
 
-type Props = {
-    id?: string;
-    className?: string;
-    children?: ComponentChildren;
-    [key: string]: any;
-};
+type Props = JSX.IntrinsicElements["h3"];
 declare function HeadingH3({ id, children, className, ...rest }: Props): JSX.Element;
 
 export { HeadingH3 };

package/dist/content/heading-h4.d.ts

@@ -1,14 +1,9 @@
-import { ComponentChildren, JSX } from 'preact';
+import { JSX } from 'preact';
 
 /** @jsxRuntime automatic */
 /** @jsxImportSource preact */
 
-type Props = {
-    id?: string;
-    className?: string;
-    children?: ComponentChildren;
-    [key: string]: any;
-};
+type Props = JSX.IntrinsicElements["h4"];
 declare function HeadingH4({ id, children, className, ...rest }: Props): JSX.Element;
 
 export { HeadingH4 };

package/dist/header/header.js

@@ -5,6 +5,7 @@ import {
   pathForMatch
 } from "./nav-active.js";
 import { NAV_OVERFLOW_SCRIPT } from "./nav-overflow-script.js";
+import { GitHub as GitHubIcon } from "../icons/index.js";
 function Header(props) {
   const {
     lang,
@@ -207,80 +208,95 @@ function renderNavItem(item, activeNavPath, lang, currentVersion, urlHelpers, i1
     }
   );
 }
-function renderRightItem(item, index, ctx) {
-  if (item.type === "trigger" && item.trigger === "design-token-panel") {
-    const inlineOnclick = {
-      onclick: "window.dispatchEvent(new CustomEvent('toggle-design-token-panel'))"
-    };
-    return /* @__PURE__ */ jsx(
-      "button",
-      {
-        id: "design-token-trigger",
-        type: "button",
-        class: "flex items-center justify-center text-muted transition-colors hover:text-fg",
-        "aria-label": "Toggle design token panel",
-        ...inlineOnclick,
-        children: /* @__PURE__ */ jsxs(
-          "svg",
-          {
-            xmlns: "http://www.w3.org/2000/svg",
-            width: "20",
-            height: "20",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            "stroke-width": "2",
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round",
-            "aria-hidden": "true",
-            children: [
-              /* @__PURE__ */ jsx("circle", { cx: "13.5", cy: "6.5", r: "2.5" }),
-              /* @__PURE__ */ jsx("circle", { cx: "17.5", cy: "10.5", r: "2.5" }),
-              /* @__PURE__ */ jsx("circle", { cx: "8.5", cy: "7.5", r: "2.5" }),
-              /* @__PURE__ */ jsx("circle", { cx: "6.5", cy: "12.5", r: "2.5" }),
-              /* @__PURE__ */ jsx("path", { d: "M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z" })
-            ]
-          }
-        )
-      },
-      `right-${index}`
-    );
-  }
-  if (item.type === "trigger" && item.trigger === "ai-chat") {
-    const inlineOnclick = {
-      onclick: "window.dispatchEvent(new CustomEvent('toggle-ai-chat'))"
-    };
-    return /* @__PURE__ */ jsx(
-      "button",
-      {
-        id: "ai-chat-trigger",
-        type: "button",
-        class: "flex items-center justify-center text-muted transition-colors hover:text-fg",
-        "aria-label": "Open AI assistant",
-        ...inlineOnclick,
-        children: /* @__PURE__ */ jsxs(
-          "svg",
-          {
-            xmlns: "http://www.w3.org/2000/svg",
-            width: "20",
-            height: "20",
-            viewBox: "0 0 24 24",
-            fill: "currentColor",
-            "aria-hidden": "true",
-            children: [
-              /* @__PURE__ */ jsx("path", { d: "M9.5 2.5Q10.5 11.5 18 13Q10.5 14.5 9.5 23.5Q8.5 14.5 1 13Q8.5 11.5 9.5 2.5Z" }),
-              /* @__PURE__ */ jsx("path", { d: "M19 0.5Q19.5 4 23.5 5Q19.5 6 19 9.5Q18.5 6 14.5 5Q18.5 4 19 0.5Z" })
-            ]
-          }
-        )
-      },
-      `right-${index}`
-    );
-  }
-  if (item.type === "component" && item.component === "version-switcher") {
-    return /* @__PURE__ */ jsx("div", { class: "hidden lg:block", children: ctx.versionSwitcher }, `right-${index}`);
-  }
-  if (item.type === "component" && item.component === "github-link" && ctx.githubRepoUrl) {
+function TriggerButton({
+  index,
+  id,
+  ariaLabel,
+  event,
+  children
+}) {
+  const inlineOnclick = {
+    onclick: `window.dispatchEvent(new CustomEvent('${event}'))`
+  };
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      id,
+      type: "button",
+      class: "flex items-center justify-center text-muted transition-colors hover:text-fg",
+      "aria-label": ariaLabel,
+      ...inlineOnclick,
+      children
+    },
+    `right-${index}`
+  );
+}
+function SlotWrapper({
+  index,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx("div", { class: className, children }, `right-${index}`);
+}
+const RIGHT_ITEM_DISPATCH = {
+  "trigger:design-token-panel": (_item, index) => /* @__PURE__ */ jsx(
+    TriggerButton,
+    {
+      index,
+      id: "design-token-trigger",
+      ariaLabel: "Toggle design token panel",
+      event: "toggle-design-token-panel",
+      children: /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "20",
+          height: "20",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ jsx("circle", { cx: "13.5", cy: "6.5", r: "2.5" }),
+            /* @__PURE__ */ jsx("circle", { cx: "17.5", cy: "10.5", r: "2.5" }),
+            /* @__PURE__ */ jsx("circle", { cx: "8.5", cy: "7.5", r: "2.5" }),
+            /* @__PURE__ */ jsx("circle", { cx: "6.5", cy: "12.5", r: "2.5" }),
+            /* @__PURE__ */ jsx("path", { d: "M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z" })
+          ]
+        }
+      )
+    }
+  ),
+  "trigger:ai-chat": (_item, index) => /* @__PURE__ */ jsx(
+    TriggerButton,
+    {
+      index,
+      id: "ai-chat-trigger",
+      ariaLabel: "Open AI assistant",
+      event: "toggle-ai-chat",
+      children: /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "20",
+          height: "20",
+          viewBox: "0 0 24 24",
+          fill: "currentColor",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ jsx("path", { d: "M9.5 2.5Q10.5 11.5 18 13Q10.5 14.5 9.5 23.5Q8.5 14.5 1 13Q8.5 11.5 9.5 2.5Z" }),
+            /* @__PURE__ */ jsx("path", { d: "M19 0.5Q19.5 4 23.5 5Q19.5 6 19 9.5Q18.5 6 14.5 5Q18.5 4 19 0.5Z" })
+          ]
+        }
+      )
+    }
+  ),
+  "component:version-switcher": (_item, index, ctx) => /* @__PURE__ */ jsx(SlotWrapper, { index, className: "hidden lg:block", children: ctx.versionSwitcher }),
+  "component:github-link": (_item, index, ctx) => {
+    if (!ctx.githubRepoUrl) return null;
     return /* @__PURE__ */ jsxs(
       "a",
       {
@@ -292,35 +308,23 @@ function renderRightItem(item, index, ctx) {
         title: ctx.githubLabel,
         children: [
           /* @__PURE__ */ jsx("span", { class: "sr-only", children: ctx.githubLabel }),
-          /* @__PURE__ */ jsx(
-            "svg",
-            {
-              xmlns: "http://www.w3.org/2000/svg",
-              width: "20",
-              height: "20",
-              viewBox: "0 0 24 24",
-              fill: "currentColor",
-              "aria-hidden": "true",
-              children: /* @__PURE__ */ jsx("path", { d: "M12 .5C5.649.5.5 5.649.5 12a11.5 11.5 0 0 0 7.86 10.915c.575.106.785-.25.785-.556 0-.274-.01-1-.016-1.962-3.198.695-3.873-1.541-3.873-1.541-.523-1.327-1.277-1.68-1.277-1.68-1.044-.714.079-.699.079-.699 1.154.082 1.761 1.186 1.761 1.186 1.026 1.758 2.692 1.25 3.348.956.104-.743.401-1.25.73-1.537-2.553-.29-5.238-1.276-5.238-5.682 0-1.255.448-2.282 1.182-3.086-.119-.29-.512-1.458.111-3.04 0 0 .964-.309 3.159 1.18A10.98 10.98 0 0 1 12 6.036c.977.005 1.963.132 2.883.387 2.193-1.49 3.155-1.18 3.155-1.18.625 1.582.232 2.75.114 3.04.736.804 1.18 1.831 1.18 3.086 0 4.417-2.689 5.389-5.25 5.673.412.355.779 1.056.779 2.129 0 1.538-.014 2.778-.014 3.156 0 .31.207.668.79.555A11.502 11.502 0 0 0 23.5 12C23.5 5.649 18.351.5 12 .5Z" })
-            }
-          )
+          /* @__PURE__ */ jsx(GitHubIcon, {})
         ]
       },
       `right-${index}`
     );
-  }
-  if (item.type === "component" && item.component === "theme-toggle") {
+  },
+  "component:theme-toggle": (_item, index, ctx) => {
     if (!ctx.colorModeEnabled) return null;
-    return /* @__PURE__ */ jsx("div", { class: "hidden lg:flex items-center", children: ctx.themeToggle }, `right-${index}`);
-  }
-  if (item.type === "component" && item.component === "language-switcher") {
+    return /* @__PURE__ */ jsx(SlotWrapper, { index, className: "hidden lg:flex items-center", children: ctx.themeToggle });
+  },
+  "component:language-switcher": (_item, index, ctx) => {
     if (!(ctx.lang && ctx.hasLocales)) return null;
-    return /* @__PURE__ */ jsx("div", { class: "hidden lg:flex items-center", children: ctx.languageSwitcher }, `right-${index}`);
-  }
-  if (item.type === "component" && item.component === "search") {
-    return /* @__PURE__ */ jsx("div", { children: ctx.search }, `right-${index}`);
-  }
-  if (item.type === "link") {
+    return /* @__PURE__ */ jsx(SlotWrapper, { index, className: "hidden lg:flex items-center", children: ctx.languageSwitcher });
+  },
+  "component:search": (_item, index, ctx) => /* @__PURE__ */ jsx(SlotWrapper, { index, children: ctx.search }),
+  link: (item, index) => {
+    if (item.type !== "link") return null;
     const label = item.label ?? item.ariaLabel;
     const isExternal = /^https?:\/\//.test(item.href);
     return /* @__PURE__ */ jsx(
@@ -334,24 +338,14 @@ function renderRightItem(item, index, ctx) {
         title: label,
         children: item.icon === "github" ? /* @__PURE__ */ jsxs(Fragment, { children: [
           label && /* @__PURE__ */ jsx("span", { class: "sr-only", children: label }),
-          /* @__PURE__ */ jsx(
-            "svg",
-            {
-              xmlns: "http://www.w3.org/2000/svg",
-              width: "20",
-              height: "20",
-              viewBox: "0 0 24 24",
-              fill: "currentColor",
-              "aria-hidden": "true",
-              children: /* @__PURE__ */ jsx("path", { d: "M12 .5C5.649.5.5 5.649.5 12a11.5 11.5 0 0 0 7.86 10.915c.575.106.785-.25.785-.556 0-.274-.01-1-.016-1.962-3.198.695-3.873-1.541-3.873-1.541-.523-1.327-1.277-1.68-1.277-1.68-1.044-.714.079-.699.079-.699 1.154.082 1.761 1.186 1.761 1.186 1.026 1.758 2.692 1.25 3.348.956.104-.743.401-1.25.73-1.537-2.553-.29-5.238-1.276-5.238-5.682 0-1.255.448-2.282 1.182-3.086-.119-.29-.512-1.458.111-3.04 0 0 .964-.309 3.159 1.18A10.98 10.98 0 0 1 12 6.036c.977.005 1.963.132 2.883.387 2.193-1.49 3.155-1.18 3.155-1.18.625 1.582.232 2.75.114 3.04.736.804 1.18 1.831 1.18 3.086 0 4.417-2.689 5.389-5.25 5.673.412.355.779 1.056.779 2.129 0 1.538-.014 2.778-.014 3.156 0 .31.207.668.79.555A11.502 11.502 0 0 0 23.5 12C23.5 5.649 18.351.5 12 .5Z" })
-            }
-          )
+          /* @__PURE__ */ jsx(GitHubIcon, {})
         ] }) : label
       },
       `right-${index}`
     );
-  }
-  if (item.type === "html") {
+  },
+  html: (item, index) => {
+    if (item.type !== "html") return null;
     return /* @__PURE__ */ jsx(
       "span",
       {
@@ -360,7 +354,11 @@ function renderRightItem(item, index, ctx) {
       `right-${index}`
     );
   }
-  return null;
+};
+function renderRightItem(item, index, ctx) {
+  const key = item.type === "trigger" ? `trigger:${item.trigger}` : item.type === "component" ? `component:${item.component}` : item.type;
+  const handler = RIGHT_ITEM_DISPATCH[key];
+  return handler ? handler(item, index, ctx) : null;
 }
 export {
   Header

package/dist/header/right-items.d.ts

@@ -7,10 +7,7 @@ import { HeaderRightItem } from './types.js';
  * header-right-items.ts` pre-#1729). Each flag corresponds to a specific
  * `settings.*` switch the original implementation consulted directly:
  *
- *   - `designTokenPanel` — `settings.designTokenPanel || settings.colorTweakPanel`
- *   - `colorTweakPanel`  — retained for symmetry; treated as an OR with
- *     `designTokenPanel` so callers that still distinguish the deprecated
- *     alias get the same gate as the legacy helper.
+ *   - `designTokenPanel` — `settings.designTokenPanel`
  *   - `aiAssistant`      — `settings.aiAssistant`
  *   - `colorMode`        — `Boolean(settings.colorMode)`
  *   - `hasLocales`       — `Object.keys(settings.locales).length > 0`
@@ -19,7 +16,6 @@ import { HeaderRightItem } from './types.js';
  */
 interface HeaderRightItemFlags {
     designTokenPanel: boolean;
-    colorTweakPanel: boolean;
     aiAssistant: boolean;
     colorMode: boolean;
     hasLocales: boolean;

package/dist/header/right-items.js

@@ -2,7 +2,7 @@ function filterHeaderRightItems(items, flags) {
   return items.filter((item) => {
     if (item.type === "trigger") {
       if (item.trigger === "design-token-panel") {
-        return flags.designTokenPanel || flags.colorTweakPanel;
+        return flags.designTokenPanel;
       }
       if (item.trigger === "ai-chat") {
         return flags.aiAssistant;

package/dist/i18n-version/version-switcher.d.ts

@@ -40,14 +40,6 @@ interface VersionSwitcherProps {
      * unique.
      */
     idSuffix?: string;
-    /**
-     * @deprecated No longer wired — the component never emits an inline
-     * `<style>`. Visibility CSS lives in the consumer's global stylesheet
-     * (see `VERSION_SWITCHER_VISIBILITY_STYLE` for the canonical rule).
-     * Retained on the public interface for backwards compatibility; passing
-     * any value is a no-op.
-     */
-    disableInlineVisibilityStyle?: boolean;
 }
 /**
  * Canonical CSS rule that backs the responsive visibility of the

package/dist/icons/index.d.ts

@@ -0,0 +1,18 @@
+import { VNode } from 'preact';
+
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+interface IconProps {
+    /** CSS class string forwarded to the root `<svg>` element. */
+    className?: string;
+}
+declare function ChevronRight({ className }: IconProps): VNode;
+declare function ChevronLeft({ className }: IconProps): VNode;
+declare function Search({ className }: IconProps): VNode;
+declare function History({ className }: IconProps): VNode;
+declare function Close({ className }: IconProps): VNode;
+declare function ArrowLeft({ className }: IconProps): VNode;
+declare function GitHub({ className }: IconProps): VNode;
+
+export { ArrowLeft, ChevronLeft, ChevronRight, Close, GitHub, History, type IconProps, Search };

package/dist/icons/index.js

@@ -0,0 +1,124 @@
+import { jsx, jsxs } from "preact/jsx-runtime";
+function ChevronRight({ className }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      class: className || void 0,
+      fill: "none",
+      viewBox: "0 0 24 24",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M9 5l7 7-7 7" })
+    }
+  );
+}
+function ChevronLeft({ className }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      class: className || void 0,
+      fill: "none",
+      viewBox: "0 0 24 24",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M15 19l-7-7 7-7" })
+    }
+  );
+}
+function Search({ className }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      class: className || void 0,
+      fill: "none",
+      viewBox: "0 0 24 24",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" })
+    }
+  );
+}
+function History({ className }) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      class: className || void 0,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+        /* @__PURE__ */ jsx("polyline", { points: "12 6 12 12 16 14" })
+      ]
+    }
+  );
+}
+function Close({ className }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      class: className || void 0,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { d: "M18 6L6 18M6 6l12 12" })
+    }
+  );
+}
+function ArrowLeft({ className }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      class: className || void 0,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { d: "M19 12H5M12 19l-7-7 7-7" })
+    }
+  );
+}
+function GitHub({ className }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "20",
+      height: "20",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      class: className || void 0,
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { d: "M12 .5C5.649.5.5 5.649.5 12a11.5 11.5 0 0 0 7.86 10.915c.575.106.785-.25.785-.556 0-.274-.01-1-.016-1.962-3.198.695-3.873-1.541-3.873-1.541-.523-1.327-1.277-1.68-1.277-1.68-1.044-.714.079-.699.079-.699 1.154.082 1.761 1.186 1.761 1.186 1.026 1.758 2.692 1.25 3.348.956.104-.743.401-1.25.73-1.537-2.553-.29-5.238-1.276-5.238-5.682 0-1.255.448-2.282 1.182-3.086-.119-.29-.512-1.458.111-3.04 0 0 .964-.309 3.159 1.18A10.98 10.98 0 0 1 12 6.036c.977.005 1.963.132 2.883.387 2.193-1.49 3.155-1.18 3.155-1.18.625 1.582.232 2.75.114 3.04.736.804 1.18 1.831 1.18 3.086 0 4.417-2.689 5.389-5.25 5.673.412.355.779 1.056.779 2.129 0 1.538-.014 2.778-.014 3.156 0 .31.207.668.79.555A11.502 11.502 0 0 0 23.5 12C23.5 5.649 18.351.5 12 .5Z" })
+    }
+  );
+}
+export {
+  ArrowLeft,
+  ChevronLeft,
+  ChevronRight,
+  Close,
+  GitHub,
+  History,
+  Search
+};

package/dist/integrations/claude-resources/generate.js

@@ -76,31 +76,40 @@ function generateClaudemdDocs(config) {
   ensureDir(outputDir);
   const items = [];
   for (const filePath of files) {
-    const content = fs.readFileSync(filePath, "utf8");
     const relPath = path.relative(projectRoot, filePath);
     const displayPath = `/${relPath}`;
     const dirPart = path.dirname(relPath);
     const slug = dirPart === "." ? "root" : dirPart.replace(/\//g, "--");
     items.push({ displayPath, slug, relPath });
-    const pos = items.length + 1;
+  }
+  items.sort((a, b) => {
+    if (a.slug === "root") return -1;
+    if (b.slug === "root") return 1;
+    return a.displayPath.localeCompare(b.displayPath);
+  });
+  const emittedSlugs = /* @__PURE__ */ new Map();
+  items.forEach((item, index) => {
+    const previous = emittedSlugs.get(item.slug);
+    if (previous !== void 0) {
+      throw new Error(
+        `claude-resources: slug collision \u2014 "${item.slug}" is produced by both "${previous}" and "${item.relPath}". Rename one of the directories to resolve the conflict.`
+      );
+    }
+    emittedSlugs.set(item.slug, item.relPath);
+    const content = fs.readFileSync(path.join(projectRoot, item.relPath), "utf8");
     const mdx = `---
-title: "${escapeTitle(displayPath)}"
-description: "CLAUDE.md at ${escapeTitle(displayPath)}"
-sidebar_position: ${pos}
-sidebar_label: "${escapeTitle(relPath)}"
+title: "${escapeTitle(item.displayPath)}"
+description: "CLAUDE.md at ${escapeTitle(item.displayPath)}"
+sidebar_position: ${index + 1}
+sidebar_label: "${escapeTitle(item.relPath)}"
 generated: true
 ---
 
-**Path:** \`${relPath}\`
+**Path:** \`${item.relPath}\`
 
 ${escapeForMdx(content.trim())}
 `;
-    fs.writeFileSync(path.join(outputDir, `${slug}.mdx`), mdx);
-  }
-  items.sort((a, b) => {
-    if (a.slug === "root") return -1;
-    if (b.slug === "root") return 1;
-    return a.displayPath.localeCompare(b.displayPath);
+    fs.writeFileSync(path.join(outputDir, `${item.slug}.mdx`), mdx);
   });
   writeCategoryMeta(outputDir, "CLAUDE.md", 900, "Project-specific instructions");
   return items;

package/dist/integrations/doc-history/pre-build.js

@@ -2,9 +2,7 @@ import fs from "node:fs";
 import path from "node:path";
 import {
   collectContentFiles,
-  getFileCommits,
-  getFirstCommit,
-  getCommitInfo
+  getFileCommitsMeta
 } from "@takazudo/zudo-doc-history-server/git-history";
 const META_OUT_RELATIVE_DIR = ".zfb";
 const META_OUT_FILENAME = "doc-history-meta.json";
@@ -33,11 +31,10 @@ async function runDocHistoryMetaStep(options) {
   for (const [localeKey, contentDir] of dirEntries) {
     const files = collectContentFiles(contentDir);
     for (const { filePath, slug } of files) {
-      const commits = getFileCommits(filePath, 1);
-      if (commits.length === 0) continue;
-      const newestInfo = getCommitInfo(commits[0], filePath);
-      const firstHash = getFirstCommit(filePath);
-      const oldestInfo = firstHash && firstHash !== commits[0] ? getCommitInfo(firstHash, filePath) : newestInfo;
+      const allCommits = getFileCommitsMeta(filePath);
+      if (allCommits.length === 0) continue;
+      const newestInfo = allCommits[0];
+      const oldestInfo = allCommits[allCommits.length - 1] ?? newestInfo;
       const composedSlug = localeKey ? `${localeKey}/${slug}` : slug;
       meta[composedSlug] = {
         // Author comes from the FIRST (oldest) commit.

package/dist/integrations/llms-txt/load.js

@@ -17,7 +17,7 @@ function collectMdFiles(dir) {
         if (entry.name.startsWith("_")) continue;
         walk(fullPath, baseDir);
       } else if (/\.mdx?$/.test(entry.name) && !entry.name.startsWith("_")) {
-        const rel = relative(baseDir, fullPath).replace(/\.mdx?$/, "").replace(/\/index$/, "");
+        const rel = relative(baseDir, fullPath).replace(/\.mdx?$/, "").replace(/\/index$/, "").replace(/^index$/, "");
         results.push({ filePath: fullPath, slug: rel });
       }
     }

package/dist/integrations/search-index/content-files.js

@@ -19,7 +19,7 @@ function collectMdFiles(dir) {
         if (entry.name.startsWith("_")) continue;
         walk(fullPath, baseDir);
       } else if (/\.mdx?$/.test(entry.name) && !entry.name.startsWith("_")) {
-        const rel = relative(baseDir, fullPath).replace(/\.mdx?$/, "").replace(/\/index$/, "");
+        const rel = relative(baseDir, fullPath).replace(/\.mdx?$/, "").replace(/\/index$/, "").replace(/^index$/, "");
         results.push({ filePath: fullPath, slug: rel });
       }
     }

package/dist/nav-indexing/versions-page-content.js

@@ -1,4 +1,5 @@
 import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
+import { ChevronRight } from "../icons/index.js";
 function VersionsPageContent(props) {
   const { latestHref, versions, labels } = props;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -13,25 +14,7 @@ function VersionsPageContent(props) {
           class: "inline-flex items-center gap-hsp-xs text-small text-accent underline hover:text-accent-hover",
           children: [
             labels.latestLink,
-            /* @__PURE__ */ jsx(
-              "svg",
-              {
-                xmlns: "http://www.w3.org/2000/svg",
-                class: "h-[0.875rem] w-[0.875rem]",
-                fill: "none",
-                viewBox: "0 0 24 24",
-                stroke: "currentColor",
-                "stroke-width": "2",
-                children: /* @__PURE__ */ jsx(
-                  "path",
-                  {
-                    "stroke-linecap": "round",
-                    "stroke-linejoin": "round",
-                    d: "M9 5l7 7-7 7"
-                  }
-                )
-              }
-            )
+            /* @__PURE__ */ jsx(ChevronRight, { className: "h-[0.875rem] w-[0.875rem]" })
           ]
         }
       )

package/dist/theme/design-token-serde.js

@@ -1,4 +1,3 @@
-import {} from "@takazudo/zdtp";
 import {
   emptyOverrides
 } from "./design-token-types.js";

package/dist/theme/index.d.ts

@@ -1,6 +1,5 @@
 export { default as ThemeToggle } from './theme-toggle.js';
 export { default as ColorSchemeProvider, ColorSchemeProviderColorMode, ColorSchemeProviderProps } from './color-scheme-provider.js';
-export { default as DesignTokenTweakPanel, DesignTokenTweakPanelInner } from './design-token-tweak-panel.js';
 export { default as ColorTweakExportModal } from './color-tweak-export-modal.js';
 export { DESIGN_TOKEN_SCHEMA, DeserializeOptions, DeserializeResult, DesignTokenJson, DesignTokenJsonColor, DesignTokenJsonColorBase, DesignTokenJsonOverrides, DesignTokenManifest, DesignTokenSchemaError, SerializeOptions, deserialize, serialize } from './design-token-serde.js';
 export { ColorTweakState, TokenOverrides, TweakState, emptyOverrides } from './design-token-types.js';

package/dist/theme/index.js

@@ -1,10 +1,6 @@
 import { default as default2 } from "./theme-toggle.js";
 import { default as default3 } from "./color-scheme-provider.js";
-import {
-  default as default4,
-  DesignTokenTweakPanelInner
-} from "./design-token-tweak-panel.js";
-import { default as default5 } from "./color-tweak-export-modal.js";
+import { default as default4 } from "./color-tweak-export-modal.js";
 import {
   DESIGN_TOKEN_SCHEMA,
   DesignTokenSchemaError,
@@ -25,11 +21,9 @@ import {
 export {
   BRIDGE_SOURCE,
   default3 as ColorSchemeProvider,
-  default5 as ColorTweakExportModal,
+  default4 as ColorTweakExportModal,
   DESIGN_TOKEN_SCHEMA,
   DesignTokenSchemaError,
-  default4 as DesignTokenTweakPanel,
-  DesignTokenTweakPanelInner,
   default2 as ThemeToggle,
   deserialize,
   emptyOverrides,

package/dist/toc/index.d.ts

@@ -1,5 +1,5 @@
 export { Toc, TocProps } from './toc.js';
 export { MobileToc, MobileTocProps } from './mobile-toc.js';
 export { UseActiveHeadingResult, getActiveHeadingId, useActiveHeading } from './use-active-heading.js';
-export { HeadingItem, TocItem } from './types.js';
+export { HeadingItem } from './types.js';
 import 'preact';

package/dist/toc/smart-break.d.ts

@@ -22,6 +22,6 @@ declare function smartBreak(text: string): VNode | string;
  */
 declare function SmartBreak({ children }: {
     children?: unknown;
-}): any;
+}): VNode;
 
 export { SmartBreak, isPathLike, smartBreak };

package/dist/toc/types.d.ts

@@ -12,12 +12,5 @@ interface HeadingItem {
     readonly slug: string;
     readonly text: string;
 }
-/**
- * Alias kept for ergonomic imports — `TocItem` is the same shape the
- * TOC components consume after filtering by depth. Filtering does not
- * change the per-item shape, so the alias documents intent without
- * introducing a structural difference.
- */
-type TocItem = HeadingItem;
 
-export type { HeadingItem, TocItem };
+export type { HeadingItem };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@takazudo/zudo-doc",
-  "version": "0.2.0-next.2",
+  "version": "0.2.0-next.5",
   "type": "module",
   "description": "zudo-doc framework primitives layer that sits on top of zfb's engine — sidebar, theme, TOC, breadcrumb, layouts, head injection, View Transitions, SSR-skip wrappers (per ADR-003).",
   "license": "MIT",
@@ -146,6 +146,10 @@
     "./url-normalizer": {
       "types": "./dist/url-normalizer/index.d.ts",
       "default": "./dist/url-normalizer/index.js"
+    },
+    "./icons": {
+      "types": "./dist/icons/index.d.ts",
+      "default": "./dist/icons/index.js"
     }
   },
   "files": [
@@ -154,13 +158,17 @@
   ],
   "peerDependencies": {
     "preact": "^10.29.1",
-    "@takazudo/zfb": "^0.1.0-next.25",
-    "@takazudo/zfb-runtime": "^0.1.0-next.25",
-    "@takazudo/zudo-doc-history-server": "^0.2.0-next.2"
+    "@takazudo/zfb": "^0.1.0-next.31",
+    "@takazudo/zfb-runtime": "^0.1.0-next.31",
+    "@takazudo/zdtp": "^0.2.0-next.2",
+    "@takazudo/zudo-doc-history-server": "^0.2.0-next.5"
   },
   "peerDependenciesMeta": {
     "@takazudo/zudo-doc-history-server": {
       "optional": true
+    },
+    "@takazudo/zdtp": {
+      "optional": true
     }
   },
   "dependencies": {
@@ -174,8 +182,8 @@
     "tsup": "^8.0.0",
     "typescript": "^5.0.0",
     "vitest": "^3.0.0",
-    "@takazudo/zfb": "0.1.0-next.25",
-    "@takazudo/zfb-runtime": "0.1.0-next.25"
+    "@takazudo/zfb": "0.1.0-next.31",
+    "@takazudo/zfb-runtime": "0.1.0-next.31"
   },
   "scripts": {
     "build": "cross-env NODE_OPTIONS=--max-old-space-size=4096 tsup",

package/dist/theme/design-token-tweak-panel.d.ts

@@ -1,11 +0,0 @@
-import { JSX } from 'preact';
-
-/** @jsxRuntime automatic */
-/** @jsxImportSource preact */
-
-/** Stub — the real panel is bootstrapped by zdtp via design-token-panel-bootstrap.ts. */
-declare function DesignTokenTweakPanelInner(): JSX.Element | null;
-/** Stub — see DesignTokenTweakPanelInner. */
-declare function DesignTokenTweakPanel(): JSX.Element | null;
-
-export { DesignTokenTweakPanelInner, DesignTokenTweakPanel as default };

package/dist/theme/design-token-tweak-panel.js

@@ -1,10 +0,0 @@
-function DesignTokenTweakPanelInner() {
-  return null;
-}
-function DesignTokenTweakPanel() {
-  return null;
-}
-export {
-  DesignTokenTweakPanelInner,
-  DesignTokenTweakPanel as default
-};