@takazudo/zudo-doc 5.9.0 → 5.10.0

package/dist/sidebar-tree-island/index.js

@@ -11,6 +11,13 @@ import { filterTree } from "../sidebar-filter/index.js";
 import { findActiveSlug, normalizePath } from "../sidebar-active-slug/index.js";
 import { CURRENT_PATH_DATASET_KEY, readCurrentPath } from "../current-path/index.js";
 import { ensureSidebarScrollPreserve } from "./sidebar-scroll-preserve.js";
+import {
+  formatYearMonthLabel,
+  getNoteTrayItems,
+  groupItems,
+  rankWidth
+} from "../note-tray-model/index.js";
+import { formatMonthDay } from "../format-date/index.js";
 ensureSidebarScrollPreserve();
 function ToggleChevron({ isExpanded, className }) {
   return /* @__PURE__ */ jsx(
@@ -147,6 +154,9 @@ function SidebarTree({ nodes, currentSlug, currentPath, rootMenuItems, backToMen
     () => localeLinks || themeDefaultMode ? /* @__PURE__ */ jsx(SidebarFooter, { links: localeLinks, themeDefaultMode }) : null,
     [localeLinks, themeDefaultMode]
   );
+  const noteTrayRoot = nodes.length === 1 && nodes[0]?.shape === "note-tray" ? nodes[0] : void 0;
+  const filteredNoteTrayRoot = noteTrayRoot ? filteredNodes.find((node) => node.slug === noteTrayRoot.slug) : void 0;
+  const locale = localeLinks?.find((link) => link.active)?.code ?? "en";
   if (showingRootMenu && rootMenuItems) {
     return /* @__PURE__ */ jsxs("nav", { children: [
       /* @__PURE__ */ jsxs(
@@ -199,7 +209,16 @@ function SidebarTree({ nodes, currentSlug, currentPath, rootMenuItems, backToMen
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsx(
+    noteTrayRoot ? filteredNoteTrayRoot && /* @__PURE__ */ jsx(
+      TrayList,
+      {
+        tray: filteredNoteTrayRoot,
+        itemCount: getNoteTrayItems(noteTrayRoot).length,
+        currentSlug: activeSlug,
+        forceOpen: !!query,
+        locale
+      }
+    ) : /* @__PURE__ */ jsx(
       NodeList,
       {
         nodes: filteredNodes,
@@ -212,6 +231,161 @@ function SidebarTree({ nodes, currentSlug, currentPath, rootMenuItems, backToMen
   ] });
 }
 SidebarTree.displayName = "SidebarTree";
+function TrayList({
+  tray,
+  itemCount,
+  currentSlug,
+  forceOpen,
+  locale
+}) {
+  const items = getNoteTrayItems(tray);
+  const sidebarStyle = tray.noteTraySidebar ?? "index";
+  const width = rankWidth(itemCount);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(LeafNode, { node: tray, currentSlug, depth: 0, isLast: items.length === 0 }),
+    sidebarStyle === "index" ? items.map((item, index) => /* @__PURE__ */ jsx(
+      TrayItem,
+      {
+        item,
+        currentSlug,
+        rankDigits: width,
+        isLast: index === items.length - 1
+      },
+      item.slug
+    )) : groupItems(items, sidebarStyle, tray.sortOrder ?? "asc").map((group, index, groups) => /* @__PURE__ */ jsx(
+      TrayGroupNode,
+      {
+        traySlug: tray.slug,
+        group,
+        grouping: sidebarStyle,
+        locale,
+        currentSlug,
+        forceOpen,
+        isLast: index === groups.length - 1
+      },
+      group.key
+    ))
+  ] });
+}
+function TrayItem({
+  item,
+  currentSlug,
+  rankDigits,
+  isLast,
+  showDate = false,
+  depth = 1
+}) {
+  if (!item.href) return null;
+  const isActive = item.slug === currentSlug;
+  const labelHtml = smartBreakToHtml(item.label);
+  const shortDate = item.date ? formatMonthDay(item.date) : void 0;
+  return /* @__PURE__ */ jsx("div", { className: isLast ? "pb-vsp-md" : "", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsx(ConnectorLines, { depth, isLast, topPad: "var(--spacing-vsp-2xs)" }),
+    /* @__PURE__ */ jsxs(
+      "a",
+      {
+        href: item.href,
+        "aria-current": isActive ? "page" : void 0,
+        "data-nav-active": isActive ? "" : void 0,
+        className: `flex items-start gap-hsp-xs py-vsp-2xs pr-[4px] text-small break-words ${isActive ? "bg-fg font-medium text-bg" : "text-muted hover:text-accent hover:underline focus:underline focus:text-accent"}`,
+        style: { paddingLeft: padLeft(depth, false) },
+        children: [
+          rankDigits !== void 0 && /* @__PURE__ */ jsx("span", { className: `shrink-0 tabular-nums${isActive ? "" : " text-muted"}`, children: item.rank === void 0 ? "" : String(item.rank).padStart(rankDigits, "0") }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1", dangerouslySetInnerHTML: { __html: labelHtml } }),
+          showDate && shortDate && /* @__PURE__ */ jsx("span", { className: `shrink-0 tabular-nums${isActive ? "" : " text-muted"}`, children: shortDate })
+        ]
+      }
+    )
+  ] }) });
+}
+function noteTrayGroupStorageKey(traySlug, groupKey) {
+  return `${traySlug}#${groupKey}`;
+}
+function TrayGroupNode({
+  traySlug,
+  group,
+  grouping,
+  locale,
+  currentSlug,
+  forceOpen,
+  isLast
+}) {
+  const containsCurrent = group.items.some((item) => item.slug === currentSlug);
+  const [open, setOpen] = useState(containsCurrent);
+  const storageKey = noteTrayGroupStorageKey(traySlug, group.key);
+  const label = grouping === "year" ? group.key : formatYearMonthLabel(group.key, locale);
+  useEffect(() => {
+    const stored = getOpenSet();
+    if (stored.has(storageKey) && !open) setOpen(true);
+  }, []);
+  useEffect(() => {
+    if (containsCurrent && !open) {
+      setOpen(true);
+      const stored = getOpenSet();
+      stored.add(storageKey);
+      saveOpenSet(stored);
+    }
+  }, [containsCurrent]);
+  useEffect(() => {
+    if (open) {
+      const stored = getOpenSet();
+      if (!stored.has(storageKey)) {
+        stored.add(storageKey);
+        saveOpenSet(stored);
+      }
+    }
+  }, [open, storageKey]);
+  const toggle = useCallback(() => {
+    setOpen((previous) => {
+      const next = !previous;
+      const stored = getOpenSet();
+      if (next) stored.add(storageKey);
+      else stored.delete(storageKey);
+      saveOpenSet(stored);
+      return next;
+    });
+  }, [storageKey]);
+  const isExpanded = forceOpen || open;
+  return /* @__PURE__ */ jsxs("div", { className: !isLast && isExpanded ? "relative" : "", children: [
+    !isLast && isExpanded && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "absolute border-l border-solid border-muted z-local-1",
+        style: { left: connectorLeft(1), top: 0, bottom: 0 }
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(ConnectorLines, { depth: 1, isLast, topPad: "var(--spacing-vsp-xs)" }),
+      /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: toggle,
+          className: "flex w-full items-center gap-hsp-md py-vsp-xs text-left text-small font-semibold text-fg hover:text-accent hover:underline focus:underline focus:text-accent break-words",
+          style: { paddingLeft: padLeft(1, true) },
+          "aria-expanded": isExpanded,
+          "aria-label": isExpanded ? `Collapse ${label}` : `Expand ${label}`,
+          "data-zd-sidebar-open-key": storageKey,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "aspect-square flex items-center justify-center w-[1.5rem] shrink-0 border border-muted", children: /* @__PURE__ */ jsx(ToggleChevron, { isExpanded, className: "text-muted" }) }),
+            /* @__PURE__ */ jsx("span", { children: label })
+          ]
+        }
+      )
+    ] }),
+    isExpanded && /* @__PURE__ */ jsx("div", { children: group.items.map((item, index) => /* @__PURE__ */ jsx(
+      TrayItem,
+      {
+        item,
+        currentSlug,
+        isLast: index === group.items.length - 1,
+        showDate: true,
+        depth: 2
+      },
+      item.slug
+    )) })
+  ] });
+}
 const NodeList = memo(function NodeList2({
   nodes,
   currentSlug,

package/dist/sidebar-utils/index.d.ts

@@ -40,6 +40,12 @@ export interface SidebarNavNode {
     children: SidebarNavNode[];
     sortOrder?: "asc" | "desc";
     collapsed?: boolean;
+    shape?: "note-tray";
+    noteTrayDated?: boolean;
+    noteTraySidebar?: "index" | "year" | "month";
+    date?: string;
+    updated?: string;
+    rank?: number;
 }
 /** Category metadata shape (mirrors host's CategoryMeta). */
 export interface SidebarCategoryMeta {

package/dist/site-schema/doc-route-entries.js

@@ -6,6 +6,7 @@ import {
   remapNavChildHrefs
 } from "../doc-route-paths/index.js";
 import { buildBreadcrumbs as buildBreadcrumbsImpl } from "./nav-tree.js";
+import { validateNoteTrays } from "./note-tray-validate.js";
 let nextFactoryId = 1;
 function createDocRouteEntries(ctx) {
   const factoryId = nextFactoryId++;
@@ -28,6 +29,7 @@ function createDocRouteEntries(ctx) {
     return memoizeDerived([source.docs], `docRouteEntries;${factoryId};${routeSig}`, () => {
       const { docs, navDocs, categoryMeta, localeSlugSet } = source;
       const tree = buildNavTree(navDocs, locale, categoryMeta);
+      validateNoteTrays(tree, docs);
       const breadcrumbTree = urlFor ? tree : buildNavTree(docs, locale, categoryMeta);
       const result = [];
       for (const entry of docs) {

package/dist/site-schema/index.d.ts

@@ -15,3 +15,4 @@ export type { NavScopeHeaderNavItem, NavScopeNode } from "../nav-scope/index.js"
 export { buildSidebarTree } from "../sidebar-tree/build-tree.js";
 export { extractHeadings } from "../extract-headings/index.js";
 export { createDocRouteEntries } from "./doc-route-entries.js";
+export { validateNoteTrays } from "./note-tray-validate.js";

package/dist/site-schema/index.js

@@ -23,6 +23,7 @@ import {
 import { buildSidebarTree } from "../sidebar-tree/build-tree.js";
 import { extractHeadings } from "../extract-headings/index.js";
 import { createDocRouteEntries } from "./doc-route-entries.js";
+import { validateNoteTrays } from "./note-tray-validate.js";
 export {
   buildBreadcrumbs,
   buildNavTree,
@@ -42,5 +43,6 @@ export {
   remapNavChildHrefs,
   resolveDocPrevNext,
   rewriteNavHref,
-  schemaVersion
+  schemaVersion,
+  validateNoteTrays
 };

package/dist/site-schema/nav-tree.js

@@ -12,7 +12,13 @@ function toNavNode(node) {
     href: node.href,
     hasPage: node.hasPage,
     children: node.children.map(toNavNode),
-    sortOrder: node.sortOrder ?? "asc"
+    sortOrder: node.sortOrder ?? "asc",
+    shape: node.shape,
+    noteTrayDated: node.noteTrayDated,
+    noteTraySidebar: node.noteTraySidebar,
+    date: node.date,
+    updated: node.updated,
+    rank: node.rank
   };
 }
 function findRootIndexDoc(docs) {
@@ -35,7 +41,13 @@ function toRootNavNode(doc, locale, buildHref, categoryMeta) {
     href: noPage ? void 0 : buildHref("", locale),
     hasPage: noPage !== true,
     children: [],
-    sortOrder
+    sortOrder,
+    shape: doc.data.category_shape,
+    noteTrayDated: doc.data.note_tray_dated,
+    noteTraySidebar: doc.data.note_tray_sidebar,
+    date: doc.data.date,
+    updated: doc.data.updated,
+    rank: 1
   };
 }
 function buildNavTree(docs, locale, categoryMeta, buildHref) {
@@ -60,6 +72,9 @@ function buildNavTree(docs, locale, categoryMeta, buildHref) {
       if (posCompare !== 0) return posCompare;
       return a.slug.localeCompare(b.slug);
     });
+    result.forEach((node, index) => {
+      node.rank = index + 1;
+    });
   }
   return result;
 }

package/dist/site-schema/note-tray-validate.d.ts

@@ -0,0 +1,7 @@
+import type { DocEntryLike, DocNavNode } from "./types.js";
+/**
+ * Validate note-tray declarations against both the visible nav tree and the
+ * effective merged collection. The latter is essential: unlisted children do
+ * not appear in `tree`, but still belong to a tray and must obey its contract.
+ */
+export declare function validateNoteTrays(tree: readonly DocNavNode[], docs: readonly DocEntryLike[]): void;

package/dist/site-schema/note-tray-validate.js

@@ -0,0 +1,94 @@
+import { parseIsoDate } from "../format-date/index.js";
+import { toRouteSlug } from "../slug/index.js";
+function entrySlug(entry) {
+  return entry.data.slug ?? toRouteSlug(entry.slug);
+}
+function findNode(tree, slug) {
+  for (const node of tree) {
+    if (node.slug === slug) return node;
+    const found = findNode(node.children, slug);
+    if (found) return found;
+  }
+  return void 0;
+}
+function isCategoryIndexEntry(entry) {
+  return entry.slug === "index" || entry.slug.endsWith("/index");
+}
+function validateNoteTrays(tree, docs) {
+  const violations = [];
+  const trays = docs.filter((doc) => doc.data.category_shape === "note-tray");
+  for (const tray of trays) {
+    const slug = entrySlug(tray);
+    const node = findNode(tree, slug);
+    if (!slug || slug.includes("/")) {
+      violations.push({
+        rule: "a",
+        slug: slug || "index",
+        detail: "category_shape is only allowed on top-level categories"
+      });
+    }
+    if (!isCategoryIndexEntry(tray)) {
+      violations.push({
+        rule: "a",
+        slug,
+        detail: "a note tray must be declared by a category index.mdx"
+      });
+    }
+    if (tray.data.category_no_page === true || tray.data.unlisted === true || tray.data.standalone === true || !node || node.hasPage === false) {
+      violations.push({
+        rule: "e",
+        slug,
+        detail: "a note-tray index must be a visible routed page"
+      });
+    }
+    if ((tray.data.note_tray_sidebar === "year" || tray.data.note_tray_sidebar === "month") && tray.data.note_tray_dated !== true) {
+      violations.push({
+        rule: "d",
+        slug,
+        detail: `${tray.data.note_tray_sidebar} grouping requires note_tray_dated: true`
+      });
+    }
+    const prefix = `${slug}/`;
+    const children = docs.filter((doc) => entrySlug(doc).startsWith(prefix));
+    for (const child of children) {
+      const childSlug = entrySlug(child);
+      const relative = childSlug.slice(prefix.length);
+      const childNode = findNode(tree, childSlug);
+      if (relative.includes("/") || isCategoryIndexEntry(child) || (childNode?.children.length ?? 0) > 0) {
+        violations.push({
+          rule: "b",
+          slug: childSlug,
+          detail: `note-tray children must be flat leaf files (tray: ${slug})`
+        });
+      }
+      if (tray.data.note_tray_dated === true && !child.data.date) {
+        violations.push({
+          rule: "c",
+          slug: childSlug,
+          detail: `dated note-tray children require date (tray: ${slug})`
+        });
+      }
+    }
+  }
+  for (const doc of docs) {
+    const slug = entrySlug(doc) || "index";
+    for (const field of ["date", "updated"]) {
+      const value = doc.data[field];
+      if (typeof value === "string" && !parseIsoDate(value)) {
+        violations.push({
+          rule: "f",
+          slug,
+          detail: `${field} is not a calendar-valid YYYY-MM-DD value: ${value}`
+        });
+      }
+    }
+  }
+  if (violations.length > 0) {
+    const lines = violations.sort((a, b) => a.slug.localeCompare(b.slug) || a.rule.localeCompare(b.rule)).map(({ rule, slug, detail }) => `- [${rule}] ${slug}: ${detail}`);
+    throw new Error(`Invalid note-tray configuration:
+${lines.join("\n")}`);
+  }
+}
+export {
+  validateNoteTrays
+};

package/dist/site-schema/types.d.ts

@@ -19,6 +19,12 @@ export interface DocNavNode {
     children: DocNavNode[];
     sortOrder?: "asc" | "desc";
     collapsed?: boolean;
+    shape?: "note-tray";
+    noteTrayDated?: boolean;
+    noteTraySidebar?: "index" | "year" | "month";
+    date?: string;
+    updated?: string;
+    rank?: number;
 }
 /** A category node with children but no page of its own — an auto-index. */
 export interface AutoIndexNode extends DocNavNode {
@@ -42,6 +48,11 @@ export interface DocPageFrontmatter {
     sidebar_label?: string;
     category_no_page?: boolean;
     category_sort_order?: "asc" | "desc";
+    category_shape?: "note-tray";
+    note_tray_dated?: boolean;
+    note_tray_sidebar?: "index" | "year" | "month";
+    date?: string;
+    updated?: string;
     pagination_prev?: string | null;
     pagination_next?: string | null;
     tags?: string[];

package/dist/site-tree-nav-island/index.d.ts

@@ -6,8 +6,12 @@ export interface SiteTreeNavProps {
     categoryIgnore?: string[];
     /** Root-category slugs that should start collapsed. */
     initiallyCollapsedCategorySlugs?: string[];
+    /** Locale used by dated note-tray rows. */
+    locale?: string;
+    /** Localized label shown before an item's updated date. */
+    updatedLabel?: string;
 }
-export declare function SiteTreeNav({ tree, ariaLabel, categoryOrder, categoryIgnore, initiallyCollapsedCategorySlugs, }: SiteTreeNavProps): import("preact").JSX.Element;
+export declare function SiteTreeNav({ tree, ariaLabel, categoryOrder, categoryIgnore, initiallyCollapsedCategorySlugs, locale, updatedLabel, }: SiteTreeNavProps): import("preact").JSX.Element;
 export declare namespace SiteTreeNav {
     var displayName: string;
 }

package/dist/site-tree-nav-island/index.js

@@ -1,8 +1,21 @@
 "use client";
 import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
 import { useState } from "preact/hooks";
-import { INDENT, connectorLeft, ConnectorLines, CategoryLinkIcon } from "../tree-nav-shared/index.js";
+import {
+  INDENT,
+  connectorLeft,
+  ConnectorLines,
+  CategoryLinkIcon
+} from "../tree-nav-shared/index.js";
 import { ChevronRight } from "../icons/index.js";
+import {
+  formatDate,
+  formatYearMonthLabel,
+  getNoteTrayItems,
+  groupItems,
+  rankWidth
+} from "../note-tray-model/index.js";
+import { formatMonthDay } from "../format-date/index.js";
 import { initialCategoryOpenState, toggleCategoryOpenState } from "./state.js";
 const SITE_BASE_PAD = "clamp(0.5rem, 0.8vw, 1rem)";
 function padLeft(depth) {
@@ -29,7 +42,9 @@ function SiteTreeNav({
   ariaLabel = "Site index",
   categoryOrder,
   categoryIgnore,
-  initiallyCollapsedCategorySlugs
+  initiallyCollapsedCategorySlugs,
+  locale = "en",
+  updatedLabel = "Updated"
 }) {
   let processedTree = tree;
   if (categoryIgnore) {
@@ -49,15 +64,22 @@ function SiteTreeNav({
       style: {
         gridTemplateColumns: "repeat(auto-fill, minmax(min(18rem, 100%), 1fr))"
       },
-      children: processedTree.map((node) => /* @__PURE__ */ jsx("div", { className: "min-w-0 border border-muted pl-hsp-sm py-vsp-2xs", children: node.children.length > 0 ? /* @__PURE__ */ jsx(
-        CategoryNode,
-        {
-          node,
-          depth: 0,
-          isLast: true,
-          initiallyCollapsed: initiallyCollapsed.has(node.slug)
+      children: processedTree.map((node) => {
+        if (node.shape === "note-tray" && getNoteTrayItems(node).length === 0) {
+          return null;
         }
-      ) : /* @__PURE__ */ jsx(LeafNode, { node, depth: 0, isLast: true }) }, node.slug))
+        return /* @__PURE__ */ jsx("div", { className: "min-w-0 border border-muted pl-hsp-sm py-vsp-2xs", children: node.children.length > 0 ? /* @__PURE__ */ jsx(
+          CategoryNode,
+          {
+            node,
+            depth: 0,
+            isLast: true,
+            initiallyCollapsed: initiallyCollapsed.has(node.slug),
+            locale,
+            updatedLabel
+          }
+        ) : /* @__PURE__ */ jsx(LeafNode, { node, depth: 0, isLast: true }) }, node.slug);
+      })
     }
   );
 }
@@ -88,7 +110,9 @@ function CategoryNode({
   node,
   depth,
   isLast,
-  initiallyCollapsed = false
+  initiallyCollapsed = false,
+  locale = "en",
+  updatedLabel = "Updated"
 }) {
   const [open, setOpen] = useState(() => initialCategoryOpenState(initiallyCollapsed));
   const toggle = () => setOpen(toggleCategoryOpenState);
@@ -155,9 +179,92 @@ function CategoryNode({
         }
       )
     ] }),
-    open && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(NodeList, { nodes: node.children, depth: depth + 1 }) })
+    open && /* @__PURE__ */ jsx("div", { children: node.shape === "note-tray" && depth === 0 ? /* @__PURE__ */ jsx(NoteTrayNodeList, { node, locale, updatedLabel }) : /* @__PURE__ */ jsx(NodeList, { nodes: node.children, depth: depth + 1 }) })
   ] });
 }
+function NoteTrayNodeList({
+  node,
+  locale,
+  updatedLabel
+}) {
+  const items = getNoteTrayItems(node);
+  const width = rankWidth(items);
+  const showDate = node.noteTrayDated === true;
+  const grouping = showDate && node.noteTraySidebar !== "index" ? node.noteTraySidebar : void 0;
+  if (grouping === "year" || grouping === "month") {
+    return /* @__PURE__ */ jsx("div", { className: "pl-hsp-md", children: groupItems(items, grouping, node.sortOrder ?? "asc").map((group) => /* @__PURE__ */ jsxs("div", { "data-note-tray-group": group.key, children: [
+      /* @__PURE__ */ jsx("div", { className: "pt-vsp-sm pb-vsp-2xs text-micro tracking-wide uppercase text-muted", children: grouping === "year" ? group.key : formatYearMonthLabel(group.key, locale) }),
+      group.items.map((item) => /* @__PURE__ */ jsx(
+        NoteTrayRow,
+        {
+          item,
+          locale,
+          updatedLabel,
+          rankWidth: width,
+          showDate,
+          groupedDate: true
+        },
+        item.slug
+      ))
+    ] }, group.key)) });
+  }
+  return /* @__PURE__ */ jsx("div", { className: "pl-hsp-md", children: items.map((item) => /* @__PURE__ */ jsx(
+    NoteTrayRow,
+    {
+      item,
+      locale,
+      updatedLabel,
+      rankWidth: width,
+      showDate,
+      groupedDate: false
+    },
+    item.slug
+  )) });
+}
+function NoteTrayRow({
+  item,
+  locale,
+  updatedLabel,
+  rankWidth: width,
+  showDate,
+  groupedDate
+}) {
+  if (!item.href) return null;
+  const dateLabel = showDate && item.date ? groupedDate ? formatMonthDay(item.date) : formatDate(item.date, locale) : void 0;
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href: item.href,
+      "data-note-tray-row": true,
+      className: "flex items-start gap-hsp-sm py-vsp-2xs text-small text-fg hover:text-accent hover:underline focus:underline",
+      children: [
+        dateLabel ? /* @__PURE__ */ jsx(
+          "time",
+          {
+            dateTime: item.date,
+            className: "shrink-0 font-mono tabular-nums text-caption text-muted",
+            children: dateLabel
+          }
+        ) : /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "shrink-0 font-mono tabular-nums text-caption text-muted",
+            style: { width: `${width}ch` },
+            children: item.rank === void 0 ? "" : String(item.rank).padStart(width, "0")
+          }
+        ),
+        /* @__PURE__ */ jsxs("span", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsx("span", { children: item.label }),
+          item.updated && /* @__PURE__ */ jsxs("span", { className: "block text-micro text-muted", children: [
+            updatedLabel,
+            " ",
+            formatDate(item.updated, locale)
+          ] })
+        ] })
+      ]
+    }
+  );
+}
 function LeafNode({
   node,
   depth,

package/dist/theme-packs/drift/pack.css

@@ -9,7 +9,7 @@
    same desaturated blue accent family, never harsh white. Chrome is
    ringed by glow rather than drawn by border: hairline rings +
    layered soft shadows on code, cards, and admonitions; fixed
-   radial light pools drift at opposite page corners; nav/TOC
+   radial light pools drift at opposite page corners; nested nav/TOC
    actives are pill-shaped and glowing. Syntax is a hushed pastel
    palette around the blue axis.
 
@@ -283,6 +283,11 @@ html[data-theme-pack="drift"] #desktop-sidebar a {
     background-color 0.2s,
     box-shadow 0.25s;
 }
+/* Non-pill current rows keep the stock full-width band. The explicit
+   data-nav-active marker below is reserved for Drift's nested glow pill. */
+html[data-theme-pack="drift"] #desktop-sidebar a[aria-current="page"]:not([data-nav-active]) {
+  border-radius: 0;
+}
 html[data-theme-pack="drift"] #desktop-sidebar a:hover {
   text-decoration: none;
   background: color-mix(in oklch, var(--zd-accent) 10%, transparent);

package/dist/theme-packs/hearth/pack.css

@@ -214,6 +214,11 @@ html[data-theme-pack="hearth"] #desktop-sidebar a {
     background-color 0.15s ease,
     color 0.15s ease;
 }
+/* Keep the structural current-row band square; data-nav-active is the
+   explicit hook for Hearth's nested brick cushion. */
+html[data-theme-pack="hearth"] #desktop-sidebar a[aria-current="page"]:not([data-nav-active]) {
+  border-radius: 0;
+}
 html[data-theme-pack="hearth"] #desktop-sidebar a:hover {
   color: var(--zd-accent);
   text-decoration: none;

package/dist/theme-packs/sakura/pack.css

@@ -250,6 +250,12 @@ html[data-theme-pack="sakura"] #desktop-sidebar a,
 html[data-theme-pack="sakura"] aside[data-zd-mobile-sidebar] a {
   border-radius: 9999px;
 }
+/* Non-pill current rows stay square in both sidebar surfaces; the
+   data-nav-active rule below owns Sakura's nested petal shape. */
+html[data-theme-pack="sakura"] #desktop-sidebar a[aria-current="page"]:not([data-nav-active]),
+html[data-theme-pack="sakura"] aside[data-zd-mobile-sidebar] a[aria-current="page"]:not([data-nav-active]) {
+  border-radius: 0;
+}
 html[data-theme-pack="sakura"] #desktop-sidebar a:not([data-nav-active]):hover,
 html[data-theme-pack="sakura"] aside[data-zd-mobile-sidebar] a:not([data-nav-active]):hover {
   text-decoration: none;