veslx 0.1.19 → 0.1.21

package/bin/lib/build.ts

@@ -4,6 +4,7 @@ import path from 'path'
 import fs from 'fs'
 import importConfig from "./import-config";
 import veslxPlugin from '../../plugin/src/plugin'
+import { log } from './log'
 
 /**
  * Recursively copy a directory
@@ -67,8 +68,6 @@ async function getDefaultConfig(cwd: string) {
 export default async function buildApp(dir?: string) {
   const cwd = process.cwd()
 
-  console.log(`Building veslx app in ${cwd}`);
-
   // Resolve content directory from CLI arg
   const contentDir = dir
     ? (path.isAbsolute(dir) ? dir : path.resolve(cwd, dir))
@@ -129,5 +128,5 @@ export default async function buildApp(dir?: string) {
   // Clean up temp build directory
   fs.rmSync(tempOutDir, { recursive: true })
 
-  console.log(`\nBuild complete: ${finalOutDir}`)
+  log.success(`dist/`)
 }

package/bin/lib/log.ts

@@ -0,0 +1,18 @@
+// Minimal CLI logger with subtle styling
+
+const dim = (s: string) => `\x1b[2m${s}\x1b[0m`;
+const cyan = (s: string) => `\x1b[36m${s}\x1b[0m`;
+const green = (s: string) => `\x1b[32m${s}\x1b[0m`;
+const red = (s: string) => `\x1b[31m${s}\x1b[0m`;
+
+export const log = {
+  info: (msg: string) => console.log(dim(`  ${msg}`)),
+  success: (msg: string) => console.log(`  ${green('✓')} ${msg}`),
+  error: (msg: string) => console.error(`  ${red('✗')} ${msg}`),
+  url: (url: string) => console.log(`  ${cyan(url)}`),
+  blank: () => console.log(),
+};
+
+export const banner = () => {
+  console.log(dim(`  veslx`));
+};

package/bin/lib/serve.ts

@@ -3,6 +3,7 @@ import { execSync } from 'child_process'
 import importConfig from "./import-config";
 import veslxPlugin from '../../plugin/src/plugin'
 import path from 'path'
+import { log } from './log'
 
 interface PackageJson {
   name?: string;
@@ -45,11 +46,9 @@ async function getDefaultConfig(cwd: string) {
   };
 }
 
-export default async function start(dir?: string) {
+export default async function serve(dir?: string) {
   const cwd = process.cwd()
 
-  console.log(`Starting veslx dev server in ${cwd}`);
-
   // Resolve content directory - CLI arg takes precedence
   const contentDir = dir
     ? (path.isAbsolute(dir) ? dir : path.resolve(cwd, dir))
@@ -88,6 +87,11 @@ export default async function start(dir?: string) {
   })
 
   await server.listen()
-  server.printUrls()
-  server.bindCLIShortcuts({ print: true })
+
+  const info = server.resolvedUrls
+  if (info?.local[0]) {
+    log.url(info.local[0])
+  }
+
+  server.bindCLIShortcuts({ print: false })
 }

package/bin/lib/start.ts

@@ -1,11 +1,12 @@
 import importConfig from "./import-config"
 import pm2 from "pm2";
+import { log } from './log'
 
 export default async function start() {
   const config = await importConfig(process.cwd());
 
   if (!config) {
-    console.error("Configuration file 'veslx.config.ts' not found in the current directory.");
+    log.error("veslx.yaml not found");
     return
   }
 
@@ -14,7 +15,7 @@ export default async function start() {
 
   pm2.connect((err) => {
     if (err) {
-      console.error('PM2 connect error:', err);
+      log.error('pm2 connection failed');
       return;
     }
 
@@ -26,15 +27,15 @@ export default async function start() {
       autorestart: true,
       watch: false,
       max_memory_restart: '200M'
-    }, (err, apps) => {
-      pm2.disconnect();   // Disconnects from PM2
+    }, (err) => {
+      pm2.disconnect();
 
       if (err) {
-        console.error('Failed to start daemon:', err);
+        log.error('daemon failed to start');
         return;
       }
 
-      console.log(`veslx daemon started in ${cwd}`);
+      log.success('daemon started');
     });
   })
 }

package/bin/lib/stop.ts

@@ -1,24 +1,25 @@
 import pm2 from "pm2";
+import { log } from './log'
 
-export default async function start() {
+export default async function stop() {
   const cwd = process.cwd();
   const name = `veslx-${cwd.replace(/\//g, '-').replace(/^-/, '')}`.toLowerCase();
 
   pm2.connect((err) => {
     if (err) {
-      console.error('PM2 connect error:', err);
+      log.error('pm2 connection failed');
       return;
     }
 
-    pm2.stop(name, (err, apps) => {
-      pm2.disconnect();   // Disconnects from PM2
+    pm2.stop(name, (err) => {
+      pm2.disconnect();
 
       if (err) {
-        console.error('Failed to stop daemon:', err);
+        log.error('daemon failed to stop');
         return;
       }
 
-      console.log(`veslx daemon stopped as "${name}" in ${cwd}`);
+      log.success('daemon stopped');
     });
   })
 }

package/bin/veslx.ts

@@ -7,14 +7,11 @@ import serve from "./lib/serve";
 import start from "./lib/start";
 import stop from "./lib/stop";
 import build from "./lib/build";
+import { banner } from "./lib/log";
 
 const cli = cac("veslx");
 
-console.log(`▗▖  ▗▖▗▄▄▄▖ ▗▄▄▖▗▖   ▗▖  ▗▖
-▐▌  ▐▌▐▌   ▐▌   ▐▌    ▝▚▞▘ 
-▐▌  ▐▌▐▛▀▀▘ ▝▀▚▖▐▌     ▐▌  
- ▝▚▞▘ ▐▙▄▄▖▗▄▄▞▘▐▙▄▄▖▗▞▘▝▚▖
-`);
+banner();
 
 cli
   .command("init", "Initialize a new veslx project")

package/dist/client/components/content-tabs.js

@@ -0,0 +1,50 @@
+import { jsx } from "react/jsx-runtime";
+import { Link } from "react-router-dom";
+import { cn } from "../lib/utils.js";
+const views = [
+  { key: "posts", label: "posts", path: "/posts" },
+  { key: "docs", label: "docs", path: "/docs" },
+  { key: "all", label: "all", path: "/all" }
+];
+function ContentTabs({ value, counts }) {
+  const hasOnlyPosts = counts.posts > 0 && counts.docs === 0;
+  const hasOnlyDocs = counts.docs > 0 && counts.posts === 0;
+  if (hasOnlyPosts || hasOnlyDocs) {
+    return null;
+  }
+  const isDisabled = (key) => {
+    if (key === "posts") return counts.posts === 0;
+    if (key === "docs") return counts.docs === 0;
+    return false;
+  };
+  return /* @__PURE__ */ jsx("nav", { className: "flex justify-end items-center gap-3 font-mono font-medium text-xs text-muted-foreground", children: views.map((view) => {
+    const disabled = isDisabled(view.key);
+    if (disabled) {
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "opacity-30 cursor-not-allowed",
+          children: view.label
+        },
+        view.key
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      Link,
+      {
+        to: view.path,
+        className: cn(
+          "transition-colors duration-150",
+          "hover:text-foreground hover:underline hover:underline-offset-4 hover:decoration-primary/60",
+          value === view.key ? "text-foreground underline-offset-4 decoration-primary/60" : ""
+        ),
+        children: view.label
+      },
+      view.key
+    );
+  }) });
+}
+export {
+  ContentTabs
+};
+//# sourceMappingURL=content-tabs.js.map

package/dist/client/components/content-tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content-tabs.js","sources":["../../../src/components/content-tabs.tsx"],"sourcesContent":["import { Link } from \"react-router-dom\";\nimport { cn } from \"@/lib/utils\";\nimport type { ContentView } from \"@/lib/content-classification\";\n\ninterface ContentTabsProps {\n  value: ContentView;\n  counts: { posts: number; docs: number; all: number };\n}\n\nconst views: { key: ContentView; label: string; path: string }[] = [\n  { key: \"posts\", label: \"posts\", path: \"/posts\" },\n  { key: \"docs\", label: \"docs\", path: \"/docs\" },\n  { key: \"all\", label: \"all\", path: \"/all\" },\n];\n\nexport function ContentTabs({ value, counts }: ContentTabsProps) {\n  const hasOnlyPosts = counts.posts > 0 && counts.docs === 0;\n  const hasOnlyDocs = counts.docs > 0 && counts.posts === 0;\n\n  if (hasOnlyPosts || hasOnlyDocs) {\n    return null;\n  }\n\n  const isDisabled = (key: ContentView) => {\n    if (key === \"posts\") return counts.posts === 0;\n    if (key === \"docs\") return counts.docs === 0;\n    return false;\n  };\n\n  return (\n    <nav className=\"flex justify-end items-center gap-3 font-mono font-medium text-xs text-muted-foreground\">\n      {views.map((view) => {\n        const disabled = isDisabled(view.key);\n\n        if (disabled) {\n          return (\n            <span\n              key={view.key}\n              className=\"opacity-30 cursor-not-allowed\"\n            >\n              {view.label}\n            </span>\n          );\n        }\n\n        return (\n          <Link\n            key={view.key}\n            to={view.path}\n            className={cn(\n              \"transition-colors duration-150\",\n              \"hover:text-foreground hover:underline hover:underline-offset-4 hover:decoration-primary/60\",\n              value === view.key\n                ? \"text-foreground underline-offset-4 decoration-primary/60\"\n                : \"\"\n            )}\n          >\n            {view.label}\n          </Link>\n        );\n      })}\n    </nav>\n  );\n}\n"],"names":[],"mappings":";;;AASA,MAAM,QAA6D;AAAA,EACjE,EAAE,KAAK,SAAS,OAAO,SAAS,MAAM,SAAA;AAAA,EACtC,EAAE,KAAK,QAAQ,OAAO,QAAQ,MAAM,QAAA;AAAA,EACpC,EAAE,KAAK,OAAO,OAAO,OAAO,MAAM,OAAA;AACpC;AAEO,SAAS,YAAY,EAAE,OAAO,UAA4B;AAC/D,QAAM,eAAe,OAAO,QAAQ,KAAK,OAAO,SAAS;AACzD,QAAM,cAAc,OAAO,OAAO,KAAK,OAAO,UAAU;AAExD,MAAI,gBAAgB,aAAa;AAC/B,WAAO;AAAA,EACT;AAEA,QAAM,aAAa,CAAC,QAAqB;AACvC,QAAI,QAAQ,QAAS,QAAO,OAAO,UAAU;AAC7C,QAAI,QAAQ,OAAQ,QAAO,OAAO,SAAS;AAC3C,WAAO;AAAA,EACT;AAEA,6BACG,OAAA,EAAI,WAAU,2FACZ,UAAA,MAAM,IAAI,CAAC,SAAS;AACnB,UAAM,WAAW,WAAW,KAAK,GAAG;AAEpC,QAAI,UAAU;AACZ,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,WAAU;AAAA,UAET,UAAA,KAAK;AAAA,QAAA;AAAA,QAHD,KAAK;AAAA,MAAA;AAAA,IAMhB;AAEA,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,IAAI,KAAK;AAAA,QACT,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA,UAAU,KAAK,MACX,6DACA;AAAA,QAAA;AAAA,QAGL,UAAA,KAAK;AAAA,MAAA;AAAA,MAVD,KAAK;AAAA,IAAA;AAAA,EAahB,CAAC,EAAA,CACH;AAEJ;"}

package/dist/client/components/post-list.js

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Link } from "react-router-dom";
 import { cn } from "../lib/utils.js";
-import { findMdxFiles, findReadme, findSlides } from "../plugin/src/client.js";
 import { formatDate } from "../lib/format-date.js";
 import { ArrowRight } from "lucide-react";
+import { directoryToPostEntries, filterVisiblePosts, filterByView, getFrontmatter } from "../lib/content-classification.js";
 function extractOrder(name) {
   const match = name.match(/^(\d+)-/);
   return match ? parseInt(match[1], 10) : null;
@@ -11,42 +11,16 @@ function extractOrder(name) {
 function stripNumericPrefix(name) {
   return name.replace(/^\d+-/, "").replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
 }
-function PostList({ directory }) {
-  const folders = directory.children.filter((c) => c.type === "directory");
-  const standaloneFiles = findMdxFiles(directory);
-  const folderPosts = folders.map((folder) => {
-    const readme = findReadme(folder);
-    const slides = findSlides(folder);
-    return {
-      type: "folder",
-      name: folder.name,
-      path: folder.path,
-      readme,
-      slides,
-      file: null
-    };
-  });
-  const filePosts = standaloneFiles.map((file) => ({
-    type: "file",
-    name: file.name.replace(/\.mdx?$/, ""),
-    path: file.path,
-    readme: null,
-    slides: null,
-    file
-  }));
-  let posts = [...folderPosts, ...filePosts];
+function PostList({ directory, view = "all" }) {
+  let posts = directoryToPostEntries(directory);
+  if (posts.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: "py-24 text-center", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground font-mono text-sm tracking-wide", children: "no entries" }) });
+  }
+  posts = filterVisiblePosts(posts);
+  posts = filterByView(posts, view);
   if (posts.length === 0) {
     return /* @__PURE__ */ jsx("div", { className: "py-24 text-center", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground font-mono text-sm tracking-wide", children: "no entries" }) });
   }
-  posts = posts.filter((post) => {
-    var _a, _b;
-    const frontmatter = ((_a = post.readme) == null ? void 0 : _a.frontmatter) || ((_b = post.file) == null ? void 0 : _b.frontmatter);
-    return (frontmatter == null ? void 0 : frontmatter.visibility) !== "hidden" && (frontmatter == null ? void 0 : frontmatter.draft) !== true;
-  });
-  const getFrontmatter = (post) => {
-    var _a, _b, _c;
-    return ((_a = post.readme) == null ? void 0 : _a.frontmatter) || ((_b = post.file) == null ? void 0 : _b.frontmatter) || ((_c = post.slides) == null ? void 0 : _c.frontmatter);
-  };
   const getPostDate = (post) => {
     const frontmatter = getFrontmatter(post);
     return (frontmatter == null ? void 0 : frontmatter.date) ? new Date(frontmatter.date) : null;

package/dist/client/components/post-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"post-list.js","sources":["../../../src/components/post-list.tsx"],"sourcesContent":["import { Link } from \"react-router-dom\";\nimport { cn } from \"@/lib/utils\";\nimport { DirectoryEntry, FileEntry } from \"../../plugin/src/lib\";\nimport { findReadme, findSlides, findMdxFiles } from \"../../plugin/src/client\";\nimport { formatDate } from \"@/lib/format-date\";\nimport { ArrowRight } from \"lucide-react\";\n\ntype PostEntry = {\n  type: 'folder' | 'file';\n  name: string;\n  path: string;\n  readme: FileEntry | null;\n  slides: FileEntry | null;\n  file: FileEntry | null; // For standalone MDX files\n};\n\n// Helper to extract numeric prefix from filename (e.g., \"01-intro\" → 1)\nfunction extractOrder(name: string): number | null {\n  const match = name.match(/^(\\d+)-/);\n  return match ? parseInt(match[1], 10) : null;\n}\n\n// Helper to strip numeric prefix for display (e.g., \"01-getting-started\" → \"Getting Started\")\nfunction stripNumericPrefix(name: string): string {\n  return name\n    .replace(/^\\d+-/, '')\n    .replace(/-/g, ' ')\n    .replace(/\\b\\w/g, c => c.toUpperCase());\n}\n\nexport default function PostList({ directory }: { directory: DirectoryEntry }) {\n  const folders = directory.children.filter((c): c is DirectoryEntry => c.type === \"directory\");\n  const standaloneFiles = findMdxFiles(directory);\n\n  // Convert folders to post entries\n  const folderPosts: PostEntry[] = folders.map((folder) => {\n    const readme = findReadme(folder);\n    const slides = findSlides(folder);\n    return {\n      type: 'folder' as const,\n      name: folder.name,\n      path: folder.path,\n      readme,\n      slides,\n      file: null,\n    };\n  });\n\n  // Convert standalone MDX files to post entries\n  const filePosts: PostEntry[] = standaloneFiles.map((file) => ({\n    type: 'file' as const,\n    name: file.name.replace(/\\.mdx?$/, ''),\n    path: file.path,\n    readme: null,\n    slides: null,\n    file,\n  }));\n\n  let posts: PostEntry[] = [...folderPosts, ...filePosts];\n\n  if (posts.length === 0) {\n    return (\n      <div className=\"py-24 text-center\">\n        <p className=\"text-muted-foreground font-mono text-sm tracking-wide\">no entries</p>\n      </div>\n    );\n  }\n\n  // Filter out hidden and draft posts\n  posts = posts.filter((post) => {\n    const frontmatter = post.readme?.frontmatter || post.file?.frontmatter;\n    return frontmatter?.visibility !== \"hidden\" && frontmatter?.draft !== true;\n  });\n\n  // Helper to get frontmatter from post\n  const getFrontmatter = (post: PostEntry) => {\n    return post.readme?.frontmatter || post.file?.frontmatter || post.slides?.frontmatter;\n  };\n\n  // Helper to get date from post\n  const getPostDate = (post: PostEntry): Date | null => {\n    const frontmatter = getFrontmatter(post);\n    return frontmatter?.date ? new Date(frontmatter.date as string) : null;\n  };\n\n  // Smart sorting: numeric prefix → date → alphabetical\n  posts = posts.sort((a, b) => {\n    const aOrder = extractOrder(a.name);\n    const bOrder = extractOrder(b.name);\n    const aDate = getPostDate(a);\n    const bDate = getPostDate(b);\n\n    // Both have numeric prefix → sort by number\n    if (aOrder !== null && bOrder !== null) {\n      return aOrder - bOrder;\n    }\n    // One has prefix, one doesn't → prefixed comes first\n    if (aOrder !== null) return -1;\n    if (bOrder !== null) return 1;\n\n    // Both have dates → sort by date (newest first)\n    if (aDate && bDate) {\n      return bDate.getTime() - aDate.getTime();\n    }\n    // One has date → dated comes first\n    if (aDate) return -1;\n    if (bDate) return 1;\n\n    // Neither → alphabetical by title\n    const aTitle = (getFrontmatter(a)?.title as string) || a.name;\n    const bTitle = (getFrontmatter(b)?.title as string) || b.name;\n    return aTitle.localeCompare(bTitle);\n  });\n\n  return (\n    <div className=\"space-y-1\">\n      {posts.map((post) => {\n        const frontmatter = getFrontmatter(post);\n\n        // Title: explicit frontmatter > stripped numeric prefix > raw name\n        const title = (frontmatter?.title as string) || stripNumericPrefix(post.name);\n        const description = frontmatter?.description as string | undefined;\n        const date = frontmatter?.date ? new Date(frontmatter.date as string) : null;\n\n        // Determine the link path\n        let linkPath: string;\n        if (post.file) {\n          // Standalone MDX file\n          linkPath = `/${post.file.path}`;\n        } else if (post.slides && !post.readme) {\n          // Folder with only slides\n          linkPath = `/${post.slides.path}`;\n        } else if (post.readme) {\n          // Folder with readme\n          linkPath = `/${post.readme.path}`;\n        } else {\n          // Fallback to folder path\n          linkPath = `/${post.path}`;\n        }\n\n        return (\n          <Link\n            key={post.path}\n            to={linkPath}\n            className={cn(\n              \"group block py-3 px-3 -mx-3 rounded-md\",\n              \"transition-colors duration-150\",\n            )}\n          >\n            <article className=\"flex items-start gap-4\">\n              {/* Date - left side, fixed width */}\n              <time\n                dateTime={date?.toISOString()}\n                className=\"font-mono text-xs text-muted-foreground tabular-nums w-20 flex-shrink-0 pt-0.5\"\n              >\n                {date ? formatDate(date) : <span className=\"text-muted-foreground/30\">—</span>}\n              </time>\n\n              {/* Main content */}\n              <div className=\"flex-1 min-w-0\">\n                <h3 className={cn(\n                  \"text-sm font-medium text-foreground\",\n                  \"group-hover:underline\",\n                  \"flex items-center gap-2\"\n                )}>\n                  <span>{title}</span>\n                  <ArrowRight className=\"h-3 w-3 opacity-0 -translate-x-1 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-200 text-primary\" />\n                </h3>\n\n                {description && (\n                  <p className=\"text-sm text-muted-foreground line-clamp-1 mt-0.5\">\n                    {description}\n                  </p>\n                )}\n              </div>\n            </article>\n          </Link>\n        );\n      })}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"post-list.js","sources":["../../../src/components/post-list.tsx"],"sourcesContent":["import { Link } from \"react-router-dom\";\nimport { cn } from \"@/lib/utils\";\nimport type { DirectoryEntry } from \"../../plugin/src/lib\";\nimport { formatDate } from \"@/lib/format-date\";\nimport { ArrowRight } from \"lucide-react\";\nimport {\n  type ContentView,\n  type PostEntry,\n  directoryToPostEntries,\n  filterVisiblePosts,\n  filterByView,\n  getFrontmatter,\n} from \"@/lib/content-classification\";\n\n// Helper to extract numeric prefix from filename (e.g., \"01-intro\" → 1)\nfunction extractOrder(name: string): number | null {\n  const match = name.match(/^(\\d+)-/);\n  return match ? parseInt(match[1], 10) : null;\n}\n\n// Helper to strip numeric prefix for display (e.g., \"01-getting-started\" → \"Getting Started\")\nfunction stripNumericPrefix(name: string): string {\n  return name\n    .replace(/^\\d+-/, '')\n    .replace(/-/g, ' ')\n    .replace(/\\b\\w/g, c => c.toUpperCase());\n}\n\ninterface PostListProps {\n  directory: DirectoryEntry;\n  view?: ContentView;\n}\n\nexport default function PostList({ directory, view = 'all' }: PostListProps) {\n  let posts = directoryToPostEntries(directory);\n\n  if (posts.length === 0) {\n    return (\n      <div className=\"py-24 text-center\">\n        <p className=\"text-muted-foreground font-mono text-sm tracking-wide\">no entries</p>\n      </div>\n    );\n  }\n\n  // Filter out hidden and draft posts\n  posts = filterVisiblePosts(posts);\n\n  // Apply view filter\n  posts = filterByView(posts, view);\n\n  if (posts.length === 0) {\n    return (\n      <div className=\"py-24 text-center\">\n        <p className=\"text-muted-foreground font-mono text-sm tracking-wide\">no entries</p>\n      </div>\n    );\n  }\n\n  // Helper to get date from post\n  const getPostDate = (post: PostEntry): Date | null => {\n    const frontmatter = getFrontmatter(post);\n    return frontmatter?.date ? new Date(frontmatter.date as string) : null;\n  };\n\n  // Smart sorting: numeric prefix → date → alphabetical\n  posts = posts.sort((a, b) => {\n    const aOrder = extractOrder(a.name);\n    const bOrder = extractOrder(b.name);\n    const aDate = getPostDate(a);\n    const bDate = getPostDate(b);\n\n    // Both have numeric prefix → sort by number\n    if (aOrder !== null && bOrder !== null) {\n      return aOrder - bOrder;\n    }\n    // One has prefix, one doesn't → prefixed comes first\n    if (aOrder !== null) return -1;\n    if (bOrder !== null) return 1;\n\n    // Both have dates → sort by date (newest first)\n    if (aDate && bDate) {\n      return bDate.getTime() - aDate.getTime();\n    }\n    // One has date → dated comes first\n    if (aDate) return -1;\n    if (bDate) return 1;\n\n    // Neither → alphabetical by title\n    const aTitle = (getFrontmatter(a)?.title as string) || a.name;\n    const bTitle = (getFrontmatter(b)?.title as string) || b.name;\n    return aTitle.localeCompare(bTitle);\n  });\n\n  return (\n    <div className=\"space-y-1\">\n      {posts.map((post) => {\n        const frontmatter = getFrontmatter(post);\n\n        // Title: explicit frontmatter > stripped numeric prefix > raw name\n        const title = (frontmatter?.title as string) || stripNumericPrefix(post.name);\n        const description = frontmatter?.description as string | undefined;\n        const date = frontmatter?.date ? new Date(frontmatter.date as string) : null;\n\n        // Determine the link path\n        let linkPath: string;\n        if (post.file) {\n          // Standalone MDX file\n          linkPath = `/${post.file.path}`;\n        } else if (post.slides && !post.readme) {\n          // Folder with only slides\n          linkPath = `/${post.slides.path}`;\n        } else if (post.readme) {\n          // Folder with readme\n          linkPath = `/${post.readme.path}`;\n        } else {\n          // Fallback to folder path\n          linkPath = `/${post.path}`;\n        }\n\n        return (\n          <Link\n            key={post.path}\n            to={linkPath}\n            className={cn(\n              \"group block py-3 px-3 -mx-3 rounded-md\",\n              \"transition-colors duration-150\",\n            )}\n          >\n            <article className=\"flex items-start gap-4\">\n              {/* Date - left side, fixed width */}\n              <time\n                dateTime={date?.toISOString()}\n                className=\"font-mono text-xs text-muted-foreground tabular-nums w-20 flex-shrink-0 pt-0.5\"\n              >\n                {date ? formatDate(date) : <span className=\"text-muted-foreground/30\">—</span>}\n              </time>\n\n              {/* Main content */}\n              <div className=\"flex-1 min-w-0\">\n                <h3 className={cn(\n                  \"text-sm font-medium text-foreground\",\n                  \"group-hover:underline\",\n                  \"flex items-center gap-2\"\n                )}>\n                  <span>{title}</span>\n                  <ArrowRight className=\"h-3 w-3 opacity-0 -translate-x-1 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-200 text-primary\" />\n                </h3>\n\n                {description && (\n                  <p className=\"text-sm text-muted-foreground line-clamp-1 mt-0.5\">\n                    {description}\n                  </p>\n                )}\n              </div>\n            </article>\n          </Link>\n        );\n      })}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/client/lib/content-classification.js

@@ -0,0 +1,59 @@
+import { findMdxFiles, findSlides, findReadme } from "../plugin/src/client.js";
+function getFrontmatter(post) {
+  var _a, _b, _c;
+  return ((_a = post.readme) == null ? void 0 : _a.frontmatter) || ((_b = post.file) == null ? void 0 : _b.frontmatter) || ((_c = post.slides) == null ? void 0 : _c.frontmatter);
+}
+function hasDate(post) {
+  const frontmatter = getFrontmatter(post);
+  return (frontmatter == null ? void 0 : frontmatter.date) !== void 0 && frontmatter.date !== null && frontmatter.date !== "";
+}
+function filterByView(posts, view) {
+  if (view === "all") return posts;
+  if (view === "posts") return posts.filter(hasDate);
+  if (view === "docs") return posts.filter((post) => !hasDate(post));
+  return posts;
+}
+function getViewCounts(posts) {
+  const dated = posts.filter(hasDate).length;
+  return {
+    posts: dated,
+    docs: posts.length - dated,
+    all: posts.length
+  };
+}
+function directoryToPostEntries(directory) {
+  const folders = directory.children.filter((c) => c.type === "directory");
+  const standaloneFiles = findMdxFiles(directory);
+  const folderPosts = folders.map((folder) => ({
+    type: "folder",
+    name: folder.name,
+    path: folder.path,
+    readme: findReadme(folder),
+    slides: findSlides(folder),
+    file: null
+  })).filter((post) => post.readme || post.slides);
+  const filePosts = standaloneFiles.map((file) => ({
+    type: "file",
+    name: file.name.replace(/\.mdx?$/, ""),
+    path: file.path,
+    readme: null,
+    slides: null,
+    file
+  }));
+  return [...folderPosts, ...filePosts];
+}
+function filterVisiblePosts(posts) {
+  return posts.filter((post) => {
+    const frontmatter = getFrontmatter(post);
+    return (frontmatter == null ? void 0 : frontmatter.visibility) !== "hidden" && (frontmatter == null ? void 0 : frontmatter.draft) !== true;
+  });
+}
+export {
+  directoryToPostEntries,
+  filterByView,
+  filterVisiblePosts,
+  getFrontmatter,
+  getViewCounts,
+  hasDate
+};
+//# sourceMappingURL=content-classification.js.map

package/dist/client/lib/content-classification.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content-classification.js","sources":["../../../src/lib/content-classification.ts"],"sourcesContent":["import type { ContentView } from \"../../plugin/src/types\";\nimport type { DirectoryEntry, FileEntry } from \"../../plugin/src/lib\";\nimport { findReadme, findSlides, findMdxFiles } from \"../../plugin/src/client\";\n\nexport type PostEntry = {\n  type: 'folder' | 'file';\n  name: string;\n  path: string;\n  readme: FileEntry | null;\n  slides: FileEntry | null;\n  file: FileEntry | null;\n};\n\nexport function getFrontmatter(post: PostEntry) {\n  return post.readme?.frontmatter || post.file?.frontmatter || post.slides?.frontmatter;\n}\n\nexport function hasDate(post: PostEntry): boolean {\n  const frontmatter = getFrontmatter(post);\n  return frontmatter?.date !== undefined && frontmatter.date !== null && frontmatter.date !== '';\n}\n\nexport function filterByView(posts: PostEntry[], view: ContentView): PostEntry[] {\n  if (view === 'all') return posts;\n  if (view === 'posts') return posts.filter(hasDate);\n  if (view === 'docs') return posts.filter(post => !hasDate(post));\n  return posts;\n}\n\nexport function getViewCounts(posts: PostEntry[]): { posts: number; docs: number; all: number } {\n  const dated = posts.filter(hasDate).length;\n  return {\n    posts: dated,\n    docs: posts.length - dated,\n    all: posts.length,\n  };\n}\n\nexport function directoryToPostEntries(directory: DirectoryEntry): PostEntry[] {\n  const folders = directory.children.filter((c): c is DirectoryEntry => c.type === \"directory\");\n  const standaloneFiles = findMdxFiles(directory);\n\n  const folderPosts: PostEntry[] = folders\n    .map((folder) => ({\n      type: 'folder' as const,\n      name: folder.name,\n      path: folder.path,\n      readme: findReadme(folder),\n      slides: findSlides(folder),\n      file: null,\n    }))\n    .filter((post) => post.readme || post.slides); // Only include folders with content\n\n  const filePosts: PostEntry[] = standaloneFiles.map((file) => ({\n    type: 'file' as const,\n    name: file.name.replace(/\\.mdx?$/, ''),\n    path: file.path,\n    readme: null,\n    slides: null,\n    file,\n  }));\n\n  return [...folderPosts, ...filePosts];\n}\n\nexport function filterVisiblePosts(posts: PostEntry[]): PostEntry[] {\n  return posts.filter((post) => {\n    const frontmatter = getFrontmatter(post);\n    return frontmatter?.visibility !== \"hidden\" && frontmatter?.draft !== true;\n  });\n}\n\nexport type { ContentView };\n"],"names":[],"mappings":";AAaO,SAAS,eAAe,MAAiB;;AAC9C,WAAO,UAAK,WAAL,mBAAa,kBAAe,UAAK,SAAL,mBAAW,kBAAe,UAAK,WAAL,mBAAa;AAC5E;AAEO,SAAS,QAAQ,MAA0B;AAChD,QAAM,cAAc,eAAe,IAAI;AACvC,UAAO,2CAAa,UAAS,UAAa,YAAY,SAAS,QAAQ,YAAY,SAAS;AAC9F;AAEO,SAAS,aAAa,OAAoB,MAAgC;AAC/E,MAAI,SAAS,MAAO,QAAO;AAC3B,MAAI,SAAS,QAAS,QAAO,MAAM,OAAO,OAAO;AACjD,MAAI,SAAS,OAAQ,QAAO,MAAM,OAAO,CAAA,SAAQ,CAAC,QAAQ,IAAI,CAAC;AAC/D,SAAO;AACT;AAEO,SAAS,cAAc,OAAkE;AAC9F,QAAM,QAAQ,MAAM,OAAO,OAAO,EAAE;AACpC,SAAO;AAAA,IACL,OAAO;AAAA,IACP,MAAM,MAAM,SAAS;AAAA,IACrB,KAAK,MAAM;AAAA,EAAA;AAEf;AAEO,SAAS,uBAAuB,WAAwC;AAC7E,QAAM,UAAU,UAAU,SAAS,OAAO,CAAC,MAA2B,EAAE,SAAS,WAAW;AAC5F,QAAM,kBAAkB,aAAa,SAAS;AAE9C,QAAM,cAA2B,QAC9B,IAAI,CAAC,YAAY;AAAA,IAChB,MAAM;AAAA,IACN,MAAM,OAAO;AAAA,IACb,MAAM,OAAO;AAAA,IACb,QAAQ,WAAW,MAAM;AAAA,IACzB,QAAQ,WAAW,MAAM;AAAA,IACzB,MAAM;AAAA,EAAA,EACN,EACD,OAAO,CAAC,SAAS,KAAK,UAAU,KAAK,MAAM;AAE9C,QAAM,YAAyB,gBAAgB,IAAI,CAAC,UAAU;AAAA,IAC5D,MAAM;AAAA,IACN,MAAM,KAAK,KAAK,QAAQ,WAAW,EAAE;AAAA,IACrC,MAAM,KAAK;AAAA,IACX,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,EAAA,EACA;AAEF,SAAO,CAAC,GAAG,aAAa,GAAG,SAAS;AACtC;AAEO,SAAS,mBAAmB,OAAiC;AAClE,SAAO,MAAM,OAAO,CAAC,SAAS;AAC5B,UAAM,cAAc,eAAe,IAAI;AACvC,YAAO,2CAAa,gBAAe,aAAY,2CAAa,WAAU;AAAA,EACxE,CAAC;AACH;"}

package/dist/client/pages/content-router.js

@@ -5,6 +5,15 @@ import { Post } from "./post.js";
 import { SlidesPage } from "./slides.js";
 function ContentRouter() {
   const { "*": path = "" } = useParams();
+  if (path === "posts") {
+    return /* @__PURE__ */ jsx(Home, { view: "posts" });
+  }
+  if (path === "docs") {
+    return /* @__PURE__ */ jsx(Home, { view: "docs" });
+  }
+  if (path === "all") {
+    return /* @__PURE__ */ jsx(Home, { view: "all" });
+  }
   if (path.endsWith(".slides.mdx") || path.endsWith("SLIDES.mdx")) {
     return /* @__PURE__ */ jsx(SlidesPage, {});
   }

package/dist/client/pages/content-router.js.map

@@ -1 +1 @@
-{"version":3,"file":"content-router.js","sources":["../../../src/pages/content-router.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\"\nimport { Home } from \"./home\"\nimport { Post } from \"./post\"\nimport { SlidesPage } from \"./slides\"\n\n/**\n * Routes to the appropriate page based on the URL path:\n * - *.slides.mdx or *SLIDES.mdx → SlidesPage\n * - *.mdx → Post\n * - everything else → Home (directory listing)\n */\nexport function ContentRouter() {\n  const { \"*\": path = \"\" } = useParams()\n\n  // Check if this is a slides file\n  if (path.endsWith('.slides.mdx') || path.endsWith('SLIDES.mdx')) {\n    return <SlidesPage />\n  }\n\n  // Check if this is any MDX file\n  if (path.endsWith('.mdx') || path.endsWith('.md')) {\n    return <Post />\n  }\n\n  // Otherwise show directory listing\n  return <Home />\n}\n"],"names":[],"mappings":";;;;;AAWO,SAAS,gBAAgB;AAC9B,QAAM,EAAE,KAAK,OAAO,GAAA,IAAO,UAAA;AAG3B,MAAI,KAAK,SAAS,aAAa,KAAK,KAAK,SAAS,YAAY,GAAG;AAC/D,+BAAQ,YAAA,EAAW;AAAA,EACrB;AAGA,MAAI,KAAK,SAAS,MAAM,KAAK,KAAK,SAAS,KAAK,GAAG;AACjD,+BAAQ,MAAA,EAAK;AAAA,EACf;AAGA,6BAAQ,MAAA,EAAK;AACf;"}
+{"version":3,"file":"content-router.js","sources":["../../../src/pages/content-router.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\"\nimport { Home } from \"./home\"\nimport { Post } from \"./post\"\nimport { SlidesPage } from \"./slides\"\n\n/**\n * Routes to the appropriate page based on the URL path:\n * - /posts → Home with posts view\n * - /docs → Home with docs view\n * - *.slides.mdx or *SLIDES.mdx → SlidesPage\n * - *.mdx → Post\n * - everything else → Home (directory listing)\n */\nexport function ContentRouter() {\n  const { \"*\": path = \"\" } = useParams()\n\n  // Check for content view routes\n  if (path === 'posts') {\n    return <Home view=\"posts\" />\n  }\n  if (path === 'docs') {\n    return <Home view=\"docs\" />\n  }\n  if (path === 'all') {\n    return <Home view=\"all\" />\n  }\n\n  // Check if this is a slides file\n  if (path.endsWith('.slides.mdx') || path.endsWith('SLIDES.mdx')) {\n    return <SlidesPage />\n  }\n\n  // Check if this is any MDX file\n  if (path.endsWith('.mdx') || path.endsWith('.md')) {\n    return <Post />\n  }\n\n  // Otherwise show directory listing\n  return <Home />\n}\n"],"names":[],"mappings":";;;;;AAaO,SAAS,gBAAgB;AAC9B,QAAM,EAAE,KAAK,OAAO,GAAA,IAAO,UAAA;AAG3B,MAAI,SAAS,SAAS;AACpB,WAAO,oBAAC,MAAA,EAAK,MAAK,QAAA,CAAQ;AAAA,EAC5B;AACA,MAAI,SAAS,QAAQ;AACnB,WAAO,oBAAC,MAAA,EAAK,MAAK,OAAA,CAAO;AAAA,EAC3B;AACA,MAAI,SAAS,OAAO;AAClB,WAAO,oBAAC,MAAA,EAAK,MAAK,MAAA,CAAM;AAAA,EAC1B;AAGA,MAAI,KAAK,SAAS,aAAa,KAAK,KAAK,SAAS,YAAY,GAAG;AAC/D,+BAAQ,YAAA,EAAW;AAAA,EACrB;AAGA,MAAI,KAAK,SAAS,MAAM,KAAK,KAAK,SAAS,KAAK,GAAG;AACjD,+BAAQ,MAAA,EAAK;AAAA,EACf;AAGA,6BAAQ,MAAA,EAAK;AACf;"}

package/dist/client/pages/home.js

@@ -5,11 +5,18 @@ import PostList from "../components/post-list.js";
 import { ErrorDisplay } from "../components/page-error.js";
 import { RunningBar } from "../components/running-bar.js";
 import { Header } from "../components/header.js";
+import { ContentTabs } from "../components/content-tabs.js";
+import { getViewCounts, filterVisiblePosts, directoryToPostEntries } from "../lib/content-classification.js";
 import siteConfig from "virtual:veslx-config";
-function Home() {
+function Home({ view }) {
   const { "*": path = "." } = useParams();
-  const { directory, error } = useDirectory(path);
   const config = siteConfig;
+  const isViewRoute = path === "posts" || path === "docs" || path === "all";
+  const directoryPath = isViewRoute ? "." : path;
+  const { directory, error } = useDirectory(directoryPath);
+  const activeView = view ?? config.defaultView;
+  const isRoot = path === "." || path === "" || isViewRoute;
+  const counts = directory ? getViewCounts(filterVisiblePosts(directoryToPostEntries(directory))) : { posts: 0, docs: 0, all: 0 };
   if (error) {
     return /* @__PURE__ */ jsx(ErrorDisplay, { error, path });
   }
@@ -17,13 +24,16 @@ function Home() {
     /* @__PURE__ */ jsx(RunningBar, {}),
     /* @__PURE__ */ jsx(Header, {}),
     /* @__PURE__ */ jsxs("main", { className: "flex-1 mx-auto w-full max-w-[var(--content-width)] px-[var(--page-padding)]", children: [
-      /* @__PURE__ */ jsx("title", { children: path === "." || path === "" ? config.name : `${config.name} - ${path}` }),
+      /* @__PURE__ */ jsx("title", { children: isRoot ? config.name : `${config.name} - ${path}` }),
       /* @__PURE__ */ jsxs("main", { className: "flex flex-col gap-8 mb-32 mt-32", children: [
-        (path === "." || path === "") && /* @__PURE__ */ jsxs("div", { className: "animate-fade-in", children: [
+        isRoot && /* @__PURE__ */ jsxs("div", { className: "animate-fade-in", children: [
           /* @__PURE__ */ jsx("h1", { className: "text-2xl md:text-3xl font-semibold tracking-tight text-foreground", children: config.name }),
           config.description && /* @__PURE__ */ jsx("p", { className: "mt-2 text-muted-foreground", children: config.description })
         ] }),
-        directory && /* @__PURE__ */ jsx("div", { className: "animate-fade-in", children: /* @__PURE__ */ jsx(PostList, { directory }) })
+        /* @__PURE__ */ jsxs("div", { className: "", children: [
+          isRoot && directory && /* @__PURE__ */ jsx("div", { className: "animate-fade-in", children: /* @__PURE__ */ jsx(ContentTabs, { value: activeView, counts }) }),
+          directory && /* @__PURE__ */ jsx("div", { className: "animate-fade-in", children: /* @__PURE__ */ jsx(PostList, { directory, view: isRoot ? activeView : "all" }) })
+        ] })
       ] })
     ] })
   ] });

package/dist/client/pages/home.js.map

@@ -1 +1 @@
-{"version":3,"file":"home.js","sources":["../../../src/pages/home.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\"\nimport { useDirectory } from \"../../plugin/src/client\";\nimport Loading from \"@/components/loading\";\nimport PostList from \"@/components/post-list\";\nimport { ErrorDisplay } from \"@/components/page-error\";\nimport { RunningBar } from \"@/components/running-bar\";\nimport { Header } from \"@/components/header\";\nimport siteConfig from \"virtual:veslx-config\";\n\nexport function Home() {\n  const { \"*\": path = \".\" } = useParams();\n  const { directory, loading, error } = useDirectory(path)\n  const config = siteConfig;\n\n  if (error) {\n    return <ErrorDisplay error={error} path={path} />;\n  }\n\n  if (loading) {\n    return (\n      <Loading />\n    )\n  }\n\n  return (\n    <div className=\"flex min-h-screen flex-col bg-background noise-overlay\">\n      <RunningBar />\n      <Header />\n      <main className=\"flex-1 mx-auto w-full max-w-[var(--content-width)] px-[var(--page-padding)]\">\n        <title>{(path === \".\" || path === \"\") ? config.name : `${config.name} - ${path}`}</title>\n        <main className=\"flex flex-col gap-8 mb-32 mt-32\">\n          {(path === \".\" || path === \"\") && (\n            <div className=\"animate-fade-in\">\n              <h1 className=\"text-2xl md:text-3xl font-semibold tracking-tight text-foreground\">\n                {config.name}\n              </h1>\n              {config.description && (\n                <p className=\"mt-2 text-muted-foreground\">\n                  {config.description}\n                </p>\n              )}\n            </div>\n          )}\n          {directory && (\n            <div className=\"animate-fade-in\">\n              <PostList directory={directory}/>\n            </div>\n          )}\n        </main>\n      </main>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;AASO,SAAS,OAAO;AACrB,QAAM,EAAE,KAAK,OAAO,IAAA,IAAQ,UAAA;AAC5B,QAAM,EAAE,WAAoB,UAAU,aAAa,IAAI;AACvD,QAAM,SAAS;AAEf,MAAI,OAAO;AACT,WAAO,oBAAC,cAAA,EAAa,OAAc,KAAA,CAAY;AAAA,EACjD;AAQA,SACE,qBAAC,OAAA,EAAI,WAAU,0DACb,UAAA;AAAA,IAAA,oBAAC,YAAA,EAAW;AAAA,wBACX,QAAA,EAAO;AAAA,IACR,qBAAC,QAAA,EAAK,WAAU,+EACd,UAAA;AAAA,MAAA,oBAAC,SAAA,EAAQ,UAAA,SAAS,OAAO,SAAS,KAAM,OAAO,OAAO,GAAG,OAAO,IAAI,MAAM,IAAI,IAAG;AAAA,MACjF,qBAAC,QAAA,EAAK,WAAU,mCACZ,UAAA;AAAA,SAAA,SAAS,OAAO,SAAS,OACzB,qBAAC,OAAA,EAAI,WAAU,mBACb,UAAA;AAAA,UAAA,oBAAC,MAAA,EAAG,WAAU,qEACX,UAAA,OAAO,MACV;AAAA,UACC,OAAO,eACN,oBAAC,OAAE,WAAU,8BACV,iBAAO,YAAA,CACV;AAAA,QAAA,GAEJ;AAAA,QAED,iCACE,OAAA,EAAI,WAAU,mBACb,UAAA,oBAAC,UAAA,EAAS,WAAqB,EAAA,CACjC;AAAA,MAAA,EAAA,CAEJ;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"home.js","sources":["../../../src/pages/home.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\"\nimport { useDirectory } from \"../../plugin/src/client\";\nimport Loading from \"@/components/loading\";\nimport PostList from \"@/components/post-list\";\nimport { ErrorDisplay } from \"@/components/page-error\";\nimport { RunningBar } from \"@/components/running-bar\";\nimport { Header } from \"@/components/header\";\nimport { ContentTabs } from \"@/components/content-tabs\";\nimport {\n  type ContentView,\n  directoryToPostEntries,\n  filterVisiblePosts,\n  getViewCounts,\n} from \"@/lib/content-classification\";\nimport siteConfig from \"virtual:veslx-config\";\n\ninterface HomeProps {\n  view?: ContentView;\n}\n\nexport function Home({ view }: HomeProps) {\n  const { \"*\": path = \".\" } = useParams();\n  const config = siteConfig;\n\n  // Normalize path - \"posts\", \"docs\", and \"all\" are view routes, not directories\n  const isViewRoute = path === \"posts\" || path === \"docs\" || path === \"all\";\n  const directoryPath = isViewRoute ? \".\" : path;\n\n  const { directory, loading, error } = useDirectory(directoryPath)\n\n  // Use prop view, fallback to config default\n  const activeView = view ?? config.defaultView;\n\n  const isRoot = path === \".\" || path === \"\" || isViewRoute;\n\n  // Calculate counts for tabs (only meaningful on root)\n  const counts = directory\n    ? getViewCounts(filterVisiblePosts(directoryToPostEntries(directory)))\n    : { posts: 0, docs: 0, all: 0 };\n\n  if (error) {\n    return <ErrorDisplay error={error} path={path} />;\n  }\n\n  if (loading) {\n    return (\n      <Loading />\n    )\n  }\n\n  return (\n    <div className=\"flex min-h-screen flex-col bg-background noise-overlay\">\n      <RunningBar />\n      <Header />\n      <main className=\"flex-1 mx-auto w-full max-w-[var(--content-width)] px-[var(--page-padding)]\">\n        <title>{isRoot ? config.name : `${config.name} - ${path}`}</title>\n        <main className=\"flex flex-col gap-8 mb-32 mt-32\">\n          {isRoot && (\n            <div className=\"animate-fade-in\">\n              <h1 className=\"text-2xl md:text-3xl font-semibold tracking-tight text-foreground\">\n                {config.name}\n              </h1>\n              {config.description && (\n                <p className=\"mt-2 text-muted-foreground\">\n                  {config.description}\n                </p>\n              )}\n            </div>\n          )}\n\n          <div className=\"\">\n            {isRoot && directory && (\n              <div className=\"animate-fade-in\">\n                <ContentTabs value={activeView} counts={counts} />\n              </div>\n            )}\n            {directory && (\n              <div className=\"animate-fade-in\">\n                <PostList directory={directory} view={isRoot ? activeView : 'all'} />\n              </div>\n            )}\n          </div>\n        </main>\n      </main>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;AAoBO,SAAS,KAAK,EAAE,QAAmB;AACxC,QAAM,EAAE,KAAK,OAAO,IAAA,IAAQ,UAAA;AAC5B,QAAM,SAAS;AAGf,QAAM,cAAc,SAAS,WAAW,SAAS,UAAU,SAAS;AACpE,QAAM,gBAAgB,cAAc,MAAM;AAE1C,QAAM,EAAE,WAAoB,UAAU,aAAa,aAAa;AAGhE,QAAM,aAAa,QAAQ,OAAO;AAElC,QAAM,SAAS,SAAS,OAAO,SAAS,MAAM;AAG9C,QAAM,SAAS,YACX,cAAc,mBAAmB,uBAAuB,SAAS,CAAC,CAAC,IACnE,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,EAAA;AAE9B,MAAI,OAAO;AACT,WAAO,oBAAC,cAAA,EAAa,OAAc,KAAA,CAAY;AAAA,EACjD;AAQA,SACE,qBAAC,OAAA,EAAI,WAAU,0DACb,UAAA;AAAA,IAAA,oBAAC,YAAA,EAAW;AAAA,wBACX,QAAA,EAAO;AAAA,IACR,qBAAC,QAAA,EAAK,WAAU,+EACd,UAAA;AAAA,MAAA,oBAAC,SAAA,EAAO,mBAAS,OAAO,OAAO,GAAG,OAAO,IAAI,MAAM,IAAI,GAAA,CAAG;AAAA,MAC1D,qBAAC,QAAA,EAAK,WAAU,mCACb,UAAA;AAAA,QAAA,UACC,qBAAC,OAAA,EAAI,WAAU,mBACb,UAAA;AAAA,UAAA,oBAAC,MAAA,EAAG,WAAU,qEACX,UAAA,OAAO,MACV;AAAA,UACC,OAAO,eACN,oBAAC,OAAE,WAAU,8BACV,iBAAO,YAAA,CACV;AAAA,QAAA,GAEJ;AAAA,QAGF,qBAAC,OAAA,EAAI,WAAU,IACZ,UAAA;AAAA,UAAA,UAAU,aACT,oBAAC,OAAA,EAAI,WAAU,mBACb,8BAAC,aAAA,EAAY,OAAO,YAAY,OAAA,CAAgB,EAAA,CAClD;AAAA,UAED,aACC,oBAAC,OAAA,EAAI,WAAU,mBACb,UAAA,oBAAC,UAAA,EAAS,WAAsB,MAAM,SAAS,aAAa,MAAA,CAAO,EAAA,CACrE;AAAA,QAAA,EAAA,CAEJ;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/client/pages/post.js

@@ -6,6 +6,7 @@ import { RunningBar } from "../components/running-bar.js";
 import { Header } from "../components/header.js";
 import { useMDXContent } from "../hooks/use-mdx-content.js";
 import { mdxComponents } from "../components/mdx-components.js";
+import { formatDate } from "../lib/format-date.js";
 function Post() {
   const { "*": rawPath = "." } = useParams();
   const mdxPath = rawPath;
@@ -31,7 +32,14 @@ function Post() {
         /* @__PURE__ */ jsx("span", { className: "uppercase tracking-widest", children: "simulation running" }),
         /* @__PURE__ */ jsx("span", { className: "text-primary-foreground/60", children: "Page will auto-refresh on completion" })
       ] }) }),
-      Content && /* @__PURE__ */ jsx("article", { className: "my-24 prose dark:prose-invert prose-headings:tracking-tight prose-p:leading-relaxed prose-a:text-primary prose-a:no-underline hover:prose-a:underline max-w-[var(--prose-width)] animate-fade-in", children: /* @__PURE__ */ jsx(Content, { components: mdxComponents }) })
+      Content && /* @__PURE__ */ jsxs("article", { className: "my-24 prose dark:prose-invert prose-headings:tracking-tight prose-p:leading-relaxed prose-a:text-primary prose-a:no-underline hover:prose-a:underline max-w-[var(--prose-width)] animate-fade-in", children: [
+        (frontmatter == null ? void 0 : frontmatter.title) && /* @__PURE__ */ jsxs("header", { className: "not-prose flex flex-col gap-2 mb-8 pt-4", children: [
+          /* @__PURE__ */ jsx("h1", { className: "text-2xl md:text-3xl font-semibold tracking-tight text-foreground mb-3", children: frontmatter.title }),
+          (frontmatter == null ? void 0 : frontmatter.date) && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-3 text-muted-foreground", children: /* @__PURE__ */ jsx("time", { className: "font-mono text-xs bg-muted px-2 py-0.5 rounded", children: formatDate(new Date(frontmatter.date)) }) }),
+          (frontmatter == null ? void 0 : frontmatter.description) && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap text-sm items-center gap-3 text-muted-foreground", children: frontmatter.description })
+        ] }),
+        /* @__PURE__ */ jsx(Content, { components: mdxComponents })
+      ] })
     ] })
   ] });
 }

package/dist/client/pages/post.js.map

@@ -1 +1 @@
-{"version":3,"file":"post.js","sources":["../../../src/pages/post.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\";\nimport { findSlides, isSimulationRunning, useDirectory } from \"../../plugin/src/client\";\nimport Loading from \"@/components/loading\";\nimport { FileEntry } from \"plugin/src/lib\";\nimport { RunningBar } from \"@/components/running-bar\";\nimport { Header } from \"@/components/header\";\nimport { useMDXContent } from \"@/hooks/use-mdx-content\";\nimport { mdxComponents } from \"@/components/mdx-components\";\n\nexport function Post() {\n  const { \"*\": rawPath = \".\" } = useParams();\n\n  // The path includes the .mdx extension from the route\n  const mdxPath = rawPath;\n\n  // Extract directory path for finding sibling files (slides, etc.)\n  const dirPath = mdxPath.replace(/\\/[^/]+\\.mdx$/, '') || '.';\n\n  const { directory, loading: dirLoading } = useDirectory(dirPath)\n  const { Content, frontmatter, loading: mdxLoading, error } = useMDXContent(mdxPath);\n  const isRunning = isSimulationRunning();\n\n  let slides: FileEntry | null = null;\n  if (directory) {\n    slides = findSlides(directory);\n  }\n\n  const loading = dirLoading || mdxLoading;\n\n  if (loading) return <Loading />\n\n  if (error) {\n    return (\n      <main className=\"min-h-screen bg-background container mx-auto max-w-4xl py-12\">\n        <p className=\"text-center text-red-600\">{error.message}</p>\n      </main>\n    )\n  }\n\n  return (\n    <div className=\"flex min-h-screen flex-col bg-background noise-overlay\">\n      <title>{frontmatter?.title}</title>\n      <RunningBar />\n      <Header />\n      <main className=\"flex-1 mx-auto w-full max-w-[var(--content-width)] px-[var(--page-padding)]\">\n        {isRunning && (\n          <div className=\"sticky top-0 z-50 px-[var(--page-padding)] py-2 bg-red-500 text-primary-foreground font-mono text-xs text-center tracking-wide\">\n            <span className=\"inline-flex items-center gap-3\">\n              <span className=\"h-1.5 w-1.5 rounded-full bg-current animate-pulse\" />\n              <span className=\"uppercase tracking-widest\">simulation running</span>\n              <span className=\"text-primary-foreground/60\">Page will auto-refresh on completion</span>\n            </span>\n          </div>\n        )}\n\n        {Content && (\n          <article className=\"my-24 prose dark:prose-invert prose-headings:tracking-tight prose-p:leading-relaxed prose-a:text-primary prose-a:no-underline hover:prose-a:underline max-w-[var(--prose-width)] animate-fade-in\">\n            <Content components={mdxComponents} />\n          </article>\n        )}\n      </main>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;AASO,SAAS,OAAO;AACrB,QAAM,EAAE,KAAK,UAAU,IAAA,IAAQ,UAAA;AAG/B,QAAM,UAAU;AAGhB,QAAM,UAAU,QAAQ,QAAQ,iBAAiB,EAAE,KAAK;AAExD,QAAM,EAAE,UAA+B,IAAI,aAAa,OAAO;AAC/D,QAAM,EAAE,SAAS,aAAa,SAAS,YAAY,MAAA,IAAU,cAAc,OAAO;AAClF,QAAM,YAAY,oBAAA;AAGlB,MAAI,WAAW;AACJ,eAAW,SAAS;AAAA,EAC/B;AAEA,QAAM,UAAwB;AAE9B,MAAI,QAAS,QAAO,oBAAC,SAAA,CAAA,CAAQ;AAE7B,MAAI,OAAO;AACT,WACE,oBAAC,QAAA,EAAK,WAAU,gEACd,UAAA,oBAAC,OAAE,WAAU,4BAA4B,UAAA,MAAM,QAAA,CAAQ,GACzD;AAAA,EAEJ;AAEA,SACE,qBAAC,OAAA,EAAI,WAAU,0DACb,UAAA;AAAA,IAAA,oBAAC,SAAA,EAAO,qDAAa,MAAA,CAAM;AAAA,wBAC1B,YAAA,EAAW;AAAA,wBACX,QAAA,EAAO;AAAA,IACR,qBAAC,QAAA,EAAK,WAAU,+EACb,UAAA;AAAA,MAAA,iCACE,OAAA,EAAI,WAAU,kIACb,UAAA,qBAAC,QAAA,EAAK,WAAU,kCACd,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,oDAAA,CAAoD;AAAA,QACpE,oBAAC,QAAA,EAAK,WAAU,6BAA4B,UAAA,sBAAkB;AAAA,QAC9D,oBAAC,QAAA,EAAK,WAAU,8BAA6B,UAAA,uCAAA,CAAoC;AAAA,MAAA,EAAA,CACnF,EAAA,CACF;AAAA,MAGD,+BACE,WAAA,EAAQ,WAAU,oMACjB,UAAA,oBAAC,SAAA,EAAQ,YAAY,cAAA,CAAe,EAAA,CACtC;AAAA,IAAA,EAAA,CAEJ;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"post.js","sources":["../../../src/pages/post.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\";\nimport { findSlides, isSimulationRunning, useDirectory } from \"../../plugin/src/client\";\nimport Loading from \"@/components/loading\";\nimport { FileEntry } from \"plugin/src/lib\";\nimport { RunningBar } from \"@/components/running-bar\";\nimport { Header } from \"@/components/header\";\nimport { useMDXContent } from \"@/hooks/use-mdx-content\";\nimport { mdxComponents } from \"@/components/mdx-components\";\nimport { formatDate } from \"@/lib/format-date\";\n\nexport function Post() {\n  const { \"*\": rawPath = \".\" } = useParams();\n\n  // The path includes the .mdx extension from the route\n  const mdxPath = rawPath;\n\n  // Extract directory path for finding sibling files (slides, etc.)\n  const dirPath = mdxPath.replace(/\\/[^/]+\\.mdx$/, '') || '.';\n\n  const { directory, loading: dirLoading } = useDirectory(dirPath)\n  const { Content, frontmatter, loading: mdxLoading, error } = useMDXContent(mdxPath);\n  const isRunning = isSimulationRunning();\n\n  let slides: FileEntry | null = null;\n  if (directory) {\n    slides = findSlides(directory);\n  }\n\n  const loading = dirLoading || mdxLoading;\n\n  if (loading) return <Loading />\n\n  if (error) {\n    return (\n      <main className=\"min-h-screen bg-background container mx-auto max-w-4xl py-12\">\n        <p className=\"text-center text-red-600\">{error.message}</p>\n      </main>\n    )\n  }\n\n  return (\n    <div className=\"flex min-h-screen flex-col bg-background noise-overlay\">\n      <title>{frontmatter?.title}</title>\n      <RunningBar />\n      <Header />\n      <main className=\"flex-1 mx-auto w-full max-w-[var(--content-width)] px-[var(--page-padding)]\">\n        {isRunning && (\n          <div className=\"sticky top-0 z-50 px-[var(--page-padding)] py-2 bg-red-500 text-primary-foreground font-mono text-xs text-center tracking-wide\">\n            <span className=\"inline-flex items-center gap-3\">\n              <span className=\"h-1.5 w-1.5 rounded-full bg-current animate-pulse\" />\n              <span className=\"uppercase tracking-widest\">simulation running</span>\n              <span className=\"text-primary-foreground/60\">Page will auto-refresh on completion</span>\n            </span>\n          </div>\n        )}\n\n        {Content && (\n          <article className=\"my-24 prose dark:prose-invert prose-headings:tracking-tight prose-p:leading-relaxed prose-a:text-primary prose-a:no-underline hover:prose-a:underline max-w-[var(--prose-width)] animate-fade-in\">\n            {/* Render frontmatter header */}\n            {frontmatter?.title && (\n              <header className=\"not-prose flex flex-col gap-2 mb-8 pt-4\">\n                <h1 className=\"text-2xl md:text-3xl font-semibold tracking-tight text-foreground mb-3\">\n                  {frontmatter.title}\n                </h1>\n                {frontmatter?.date && (\n                  <div className=\"flex flex-wrap items-center gap-3 text-muted-foreground\">\n                    <time className=\"font-mono text-xs bg-muted px-2 py-0.5 rounded\">\n                      {formatDate(new Date(frontmatter.date as string))}\n                    </time>\n                  </div>\n                )}\n                {frontmatter?.description && (\n                  <div className=\"flex flex-wrap text-sm items-center gap-3 text-muted-foreground\">\n                    {frontmatter.description}\n                  </div>\n                )}\n              </header>\n            )}\n            <Content components={mdxComponents} />\n          </article>\n        )}\n      </main>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;AAUO,SAAS,OAAO;AACrB,QAAM,EAAE,KAAK,UAAU,IAAA,IAAQ,UAAA;AAG/B,QAAM,UAAU;AAGhB,QAAM,UAAU,QAAQ,QAAQ,iBAAiB,EAAE,KAAK;AAExD,QAAM,EAAE,UAA+B,IAAI,aAAa,OAAO;AAC/D,QAAM,EAAE,SAAS,aAAa,SAAS,YAAY,MAAA,IAAU,cAAc,OAAO;AAClF,QAAM,YAAY,oBAAA;AAGlB,MAAI,WAAW;AACJ,eAAW,SAAS;AAAA,EAC/B;AAEA,QAAM,UAAwB;AAE9B,MAAI,QAAS,QAAO,oBAAC,SAAA,CAAA,CAAQ;AAE7B,MAAI,OAAO;AACT,WACE,oBAAC,QAAA,EAAK,WAAU,gEACd,UAAA,oBAAC,OAAE,WAAU,4BAA4B,UAAA,MAAM,QAAA,CAAQ,GACzD;AAAA,EAEJ;AAEA,SACE,qBAAC,OAAA,EAAI,WAAU,0DACb,UAAA;AAAA,IAAA,oBAAC,SAAA,EAAO,qDAAa,MAAA,CAAM;AAAA,wBAC1B,YAAA,EAAW;AAAA,wBACX,QAAA,EAAO;AAAA,IACR,qBAAC,QAAA,EAAK,WAAU,+EACb,UAAA;AAAA,MAAA,iCACE,OAAA,EAAI,WAAU,kIACb,UAAA,qBAAC,QAAA,EAAK,WAAU,kCACd,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,oDAAA,CAAoD;AAAA,QACpE,oBAAC,QAAA,EAAK,WAAU,6BAA4B,UAAA,sBAAkB;AAAA,QAC9D,oBAAC,QAAA,EAAK,WAAU,8BAA6B,UAAA,uCAAA,CAAoC;AAAA,MAAA,EAAA,CACnF,EAAA,CACF;AAAA,MAGD,WACC,qBAAC,WAAA,EAAQ,WAAU,oMAEhB,UAAA;AAAA,SAAA,2CAAa,UACZ,qBAAC,UAAA,EAAO,WAAU,2CAChB,UAAA;AAAA,UAAA,oBAAC,MAAA,EAAG,WAAU,0EACX,UAAA,YAAY,OACf;AAAA,WACC,2CAAa,SACZ,oBAAC,OAAA,EAAI,WAAU,2DACb,UAAA,oBAAC,QAAA,EAAK,WAAU,kDACb,qBAAW,IAAI,KAAK,YAAY,IAAc,CAAC,GAClD,GACF;AAAA,WAED,2CAAa,gBACZ,oBAAC,SAAI,WAAU,mEACZ,sBAAY,YAAA,CACf;AAAA,QAAA,GAEJ;AAAA,QAEF,oBAAC,SAAA,EAAQ,YAAY,cAAA,CAAe;AAAA,MAAA,EAAA,CACtC;AAAA,IAAA,EAAA,CAEJ;AAAA,EAAA,GACF;AAEJ;"}

package/dist/client/plugin/src/directory-tree.js

@@ -65,7 +65,14 @@ function buildDirectoryTree(globKeys, frontmatters) {
       (c) => c.type === "file" && c.name === filename
     );
     if (exists) continue;
-    const frontmatter = frontmatters == null ? void 0 : frontmatters[key];
+    let frontmatter = frontmatters == null ? void 0 : frontmatters[key];
+    if (!frontmatter) {
+      frontmatter = frontmatters == null ? void 0 : frontmatters[`@content/${relativePath}`];
+    }
+    if (!frontmatter) {
+      const keyWithoutSlash = key.startsWith("/") ? key.slice(1) : key;
+      frontmatter = frontmatters == null ? void 0 : frontmatters[keyWithoutSlash];
+    }
     const fileEntry = {
       type: "file",
       name: filename,

package/dist/client/plugin/src/directory-tree.js.map

@@ -1 +1 @@
-{"version":3,"file":"directory-tree.js","sources":["../../../../plugin/src/directory-tree.ts"],"sourcesContent":["import type { DirectoryEntry, FileEntry } from './lib';\n\n/**\n * Find the common directory prefix among all paths.\n * E.g., [\"/docs/a.mdx\", \"/docs/b/c.mdx\"] -> \"/docs\"\n * Only considers directory segments, not filenames.\n */\nfunction findCommonPrefix(paths: string[]): string {\n  if (paths.length === 0) return '';\n\n  // Extract directory parts only (exclude filename from each path)\n  const dirPaths = paths.map(p => {\n    const parts = p.split('/').filter(Boolean);\n    // Remove the last part (filename)\n    return parts.slice(0, -1);\n  });\n\n  if (dirPaths.length === 0 || dirPaths[0].length === 0) return '';\n\n  // Find how many directory segments are common to all paths\n  const firstDirParts = dirPaths[0];\n  let commonLength = 0;\n\n  for (let i = 0; i < firstDirParts.length; i++) {\n    const segment = firstDirParts[i];\n    const allMatch = dirPaths.every(parts => parts[i] === segment);\n    if (allMatch) {\n      commonLength = i + 1;\n    } else {\n      break;\n    }\n  }\n\n  if (commonLength > 0) {\n    return '/' + firstDirParts.slice(0, commonLength).join('/');\n  }\n  return '';\n}\n\n/**\n * Build a directory tree from glob keys.\n * Keys are paths like \"/docs/file.mdx\" (Vite-resolved from @content alias)\n * We auto-detect and strip the common prefix (content directory).\n * @param globKeys - Array of file paths from import.meta.glob\n * @param frontmatters - Optional map of paths to frontmatter objects\n */\nexport function buildDirectoryTree(\n  globKeys: string[],\n  frontmatters?: Record<string, FileEntry['frontmatter']>\n): DirectoryEntry {\n  const root: DirectoryEntry = {\n    type: 'directory',\n    name: '.',\n    path: '.',\n    children: []\n  };\n\n  if (globKeys.length === 0) return root;\n\n  // Auto-detect the content directory prefix\n  // Vite resolves @content to the actual path, so keys look like \"/docs/file.mdx\"\n  const commonPrefix = findCommonPrefix(globKeys);\n\n  for (const key of globKeys) {\n    // Strip the common prefix to get path relative to content root\n    let relativePath = key;\n    if (commonPrefix && key.startsWith(commonPrefix)) {\n      relativePath = key.slice(commonPrefix.length);\n    }\n    // Remove leading slash if present\n    if (relativePath.startsWith('/')) {\n      relativePath = relativePath.slice(1);\n    }\n\n    // Skip hidden files and directories\n    if (relativePath.split('/').some(part => part.startsWith('.'))) {\n      continue;\n    }\n\n    const parts = relativePath.split('/').filter(Boolean);\n    if (parts.length === 0) continue;\n\n    let current = root;\n\n    // Navigate/create directories for all but the last part\n    for (let i = 0; i < parts.length - 1; i++) {\n      const dirName = parts[i];\n      let dir = current.children.find(\n        c => c.type === 'directory' && c.name === dirName\n      ) as DirectoryEntry | undefined;\n\n      if (!dir) {\n        dir = {\n          type: 'directory',\n          name: dirName,\n          path: parts.slice(0, i + 1).join('/'),\n          children: []\n        };\n        current.children.push(dir);\n      }\n      current = dir;\n    }\n\n    // Add file entry (last part)\n    const filename = parts[parts.length - 1];\n\n    // Don't add duplicates\n    const exists = current.children.some(\n      c => c.type === 'file' && c.name === filename\n    );\n    if (exists) continue;\n\n    // Look up frontmatter using the original key (before prefix stripping)\n    const frontmatter = frontmatters?.[key];\n\n    const fileEntry: FileEntry = {\n      type: 'file',\n      name: filename,\n      path: relativePath,\n      size: 0, // Size not available from glob keys\n      frontmatter\n    };\n    current.children.push(fileEntry);\n  }\n\n  return root;\n}\n\n/**\n * Navigate to a path within the directory tree.\n * Returns the directory and optionally a file if the path points to one.\n */\nexport function navigateToPath(\n  root: DirectoryEntry,\n  path: string\n): { directory: DirectoryEntry; file: FileEntry | null } {\n  const parts = path === '.' || path === '' ? [] : path.split('/').filter(Boolean);\n\n  let currentDir = root;\n  let file: FileEntry | null = null;\n\n  for (let i = 0; i < parts.length; i++) {\n    const part = parts[i];\n    const isLastPart = i === parts.length - 1;\n\n    // Check if this part matches a file (only on last part)\n    if (isLastPart) {\n      const matchedFile = currentDir.children.find(\n        child => child.type === 'file' && child.name === part\n      ) as FileEntry | undefined;\n\n      if (matchedFile) {\n        file = matchedFile;\n        break;\n      }\n    }\n\n    // Otherwise, look for a directory\n    const nextDir = currentDir.children.find(\n      child => child.type === 'directory' && child.name === part\n    ) as DirectoryEntry | undefined;\n\n    if (!nextDir) {\n      throw new Error(`Path not found: ${path}`);\n    }\n\n    currentDir = nextDir;\n  }\n\n  return { directory: currentDir, file };\n}\n"],"names":[],"mappings":"AAOA,SAAS,iBAAiB,OAAyB;AACjD,MAAI,MAAM,WAAW,EAAG,QAAO;AAG/B,QAAM,WAAW,MAAM,IAAI,CAAA,MAAK;AAC9B,UAAM,QAAQ,EAAE,MAAM,GAAG,EAAE,OAAO,OAAO;AAEzC,WAAO,MAAM,MAAM,GAAG,EAAE;AAAA,EAC1B,CAAC;AAED,MAAI,SAAS,WAAW,KAAK,SAAS,CAAC,EAAE,WAAW,EAAG,QAAO;AAG9D,QAAM,gBAAgB,SAAS,CAAC;AAChC,MAAI,eAAe;AAEnB,WAAS,IAAI,GAAG,IAAI,cAAc,QAAQ,KAAK;AAC7C,UAAM,UAAU,cAAc,CAAC;AAC/B,UAAM,WAAW,SAAS,MAAM,WAAS,MAAM,CAAC,MAAM,OAAO;AAC7D,QAAI,UAAU;AACZ,qBAAe,IAAI;AAAA,IACrB,OAAO;AACL;AAAA,IACF;AAAA,EACF;AAEA,MAAI,eAAe,GAAG;AACpB,WAAO,MAAM,cAAc,MAAM,GAAG,YAAY,EAAE,KAAK,GAAG;AAAA,EAC5D;AACA,SAAO;AACT;AASO,SAAS,mBACd,UACA,cACgB;AAChB,QAAM,OAAuB;AAAA,IAC3B,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,UAAU,CAAA;AAAA,EAAC;AAGb,MAAI,SAAS,WAAW,EAAG,QAAO;AAIlC,QAAM,eAAe,iBAAiB,QAAQ;AAE9C,aAAW,OAAO,UAAU;AAE1B,QAAI,eAAe;AACnB,QAAI,gBAAgB,IAAI,WAAW,YAAY,GAAG;AAChD,qBAAe,IAAI,MAAM,aAAa,MAAM;AAAA,IAC9C;AAEA,QAAI,aAAa,WAAW,GAAG,GAAG;AAChC,qBAAe,aAAa,MAAM,CAAC;AAAA,IACrC;AAGA,QAAI,aAAa,MAAM,GAAG,EAAE,KAAK,UAAQ,KAAK,WAAW,GAAG,CAAC,GAAG;AAC9D;AAAA,IACF;AAEA,UAAM,QAAQ,aAAa,MAAM,GAAG,EAAE,OAAO,OAAO;AACpD,QAAI,MAAM,WAAW,EAAG;AAExB,QAAI,UAAU;AAGd,aAAS,IAAI,GAAG,IAAI,MAAM,SAAS,GAAG,KAAK;AACzC,YAAM,UAAU,MAAM,CAAC;AACvB,UAAI,MAAM,QAAQ,SAAS;AAAA,QACzB,CAAA,MAAK,EAAE,SAAS,eAAe,EAAE,SAAS;AAAA,MAAA;AAG5C,UAAI,CAAC,KAAK;AACR,cAAM;AAAA,UACJ,MAAM;AAAA,UACN,MAAM;AAAA,UACN,MAAM,MAAM,MAAM,GAAG,IAAI,CAAC,EAAE,KAAK,GAAG;AAAA,UACpC,UAAU,CAAA;AAAA,QAAC;AAEb,gBAAQ,SAAS,KAAK,GAAG;AAAA,MAC3B;AACA,gBAAU;AAAA,IACZ;AAGA,UAAM,WAAW,MAAM,MAAM,SAAS,CAAC;AAGvC,UAAM,SAAS,QAAQ,SAAS;AAAA,MAC9B,CAAA,MAAK,EAAE,SAAS,UAAU,EAAE,SAAS;AAAA,IAAA;AAEvC,QAAI,OAAQ;AAGZ,UAAM,cAAc,6CAAe;AAEnC,UAAM,YAAuB;AAAA,MAC3B,MAAM;AAAA,MACN,MAAM;AAAA,MACN,MAAM;AAAA,MACN,MAAM;AAAA;AAAA,MACN;AAAA,IAAA;AAEF,YAAQ,SAAS,KAAK,SAAS;AAAA,EACjC;AAEA,SAAO;AACT;AAMO,SAAS,eACd,MACA,MACuD;AACvD,QAAM,QAAQ,SAAS,OAAO,SAAS,KAAK,KAAK,KAAK,MAAM,GAAG,EAAE,OAAO,OAAO;AAE/E,MAAI,aAAa;AACjB,MAAI,OAAyB;AAE7B,WAAS,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;AACrC,UAAM,OAAO,MAAM,CAAC;AACpB,UAAM,aAAa,MAAM,MAAM,SAAS;AAGxC,QAAI,YAAY;AACd,YAAM,cAAc,WAAW,SAAS;AAAA,QACtC,CAAA,UAAS,MAAM,SAAS,UAAU,MAAM,SAAS;AAAA,MAAA;AAGnD,UAAI,aAAa;AACf,eAAO;AACP;AAAA,MACF;AAAA,IACF;AAGA,UAAM,UAAU,WAAW,SAAS;AAAA,MAClC,CAAA,UAAS,MAAM,SAAS,eAAe,MAAM,SAAS;AAAA,IAAA;AAGxD,QAAI,CAAC,SAAS;AACZ,YAAM,IAAI,MAAM,mBAAmB,IAAI,EAAE;AAAA,IAC3C;AAEA,iBAAa;AAAA,EACf;AAEA,SAAO,EAAE,WAAW,YAAY,KAAA;AAClC;"}
+{"version":3,"file":"directory-tree.js","sources":["../../../../plugin/src/directory-tree.ts"],"sourcesContent":["import type { DirectoryEntry, FileEntry } from './lib';\n\n/**\n * Find the common directory prefix among all paths.\n * E.g., [\"/docs/a.mdx\", \"/docs/b/c.mdx\"] -> \"/docs\"\n * Only considers directory segments, not filenames.\n */\nfunction findCommonPrefix(paths: string[]): string {\n  if (paths.length === 0) return '';\n\n  // Extract directory parts only (exclude filename from each path)\n  const dirPaths = paths.map(p => {\n    const parts = p.split('/').filter(Boolean);\n    // Remove the last part (filename)\n    return parts.slice(0, -1);\n  });\n\n  if (dirPaths.length === 0 || dirPaths[0].length === 0) return '';\n\n  // Find how many directory segments are common to all paths\n  const firstDirParts = dirPaths[0];\n  let commonLength = 0;\n\n  for (let i = 0; i < firstDirParts.length; i++) {\n    const segment = firstDirParts[i];\n    const allMatch = dirPaths.every(parts => parts[i] === segment);\n    if (allMatch) {\n      commonLength = i + 1;\n    } else {\n      break;\n    }\n  }\n\n  if (commonLength > 0) {\n    return '/' + firstDirParts.slice(0, commonLength).join('/');\n  }\n  return '';\n}\n\n/**\n * Build a directory tree from glob keys.\n * Keys are paths like \"/docs/file.mdx\" (Vite-resolved from @content alias)\n * We auto-detect and strip the common prefix (content directory).\n * @param globKeys - Array of file paths from import.meta.glob\n * @param frontmatters - Optional map of paths to frontmatter objects\n */\nexport function buildDirectoryTree(\n  globKeys: string[],\n  frontmatters?: Record<string, FileEntry['frontmatter']>\n): DirectoryEntry {\n  const root: DirectoryEntry = {\n    type: 'directory',\n    name: '.',\n    path: '.',\n    children: []\n  };\n\n  if (globKeys.length === 0) return root;\n\n  // Auto-detect the content directory prefix\n  // Vite resolves @content to the actual path, so keys look like \"/docs/file.mdx\"\n  const commonPrefix = findCommonPrefix(globKeys);\n\n  for (const key of globKeys) {\n    // Strip the common prefix to get path relative to content root\n    let relativePath = key;\n    if (commonPrefix && key.startsWith(commonPrefix)) {\n      relativePath = key.slice(commonPrefix.length);\n    }\n    // Remove leading slash if present\n    if (relativePath.startsWith('/')) {\n      relativePath = relativePath.slice(1);\n    }\n\n    // Skip hidden files and directories\n    if (relativePath.split('/').some(part => part.startsWith('.'))) {\n      continue;\n    }\n\n    const parts = relativePath.split('/').filter(Boolean);\n    if (parts.length === 0) continue;\n\n    let current = root;\n\n    // Navigate/create directories for all but the last part\n    for (let i = 0; i < parts.length - 1; i++) {\n      const dirName = parts[i];\n      let dir = current.children.find(\n        c => c.type === 'directory' && c.name === dirName\n      ) as DirectoryEntry | undefined;\n\n      if (!dir) {\n        dir = {\n          type: 'directory',\n          name: dirName,\n          path: parts.slice(0, i + 1).join('/'),\n          children: []\n        };\n        current.children.push(dir);\n      }\n      current = dir;\n    }\n\n    // Add file entry (last part)\n    const filename = parts[parts.length - 1];\n\n    // Don't add duplicates\n    const exists = current.children.some(\n      c => c.type === 'file' && c.name === filename\n    );\n    if (exists) continue;\n\n    // Look up frontmatter - try multiple key formats since Vite resolves paths differently\n    // Plugin stores keys as \"@content/path\", but glob keys may be resolved paths\n    let frontmatter = frontmatters?.[key];\n    if (!frontmatter) {\n      // Try with @content prefix using the relative path\n      frontmatter = frontmatters?.[`@content/${relativePath}`];\n    }\n    if (!frontmatter) {\n      // Try without leading slash\n      const keyWithoutSlash = key.startsWith('/') ? key.slice(1) : key;\n      frontmatter = frontmatters?.[keyWithoutSlash];\n    }\n\n    const fileEntry: FileEntry = {\n      type: 'file',\n      name: filename,\n      path: relativePath,\n      size: 0, // Size not available from glob keys\n      frontmatter\n    };\n    current.children.push(fileEntry);\n  }\n\n  return root;\n}\n\n/**\n * Navigate to a path within the directory tree.\n * Returns the directory and optionally a file if the path points to one.\n */\nexport function navigateToPath(\n  root: DirectoryEntry,\n  path: string\n): { directory: DirectoryEntry; file: FileEntry | null } {\n  const parts = path === '.' || path === '' ? [] : path.split('/').filter(Boolean);\n\n  let currentDir = root;\n  let file: FileEntry | null = null;\n\n  for (let i = 0; i < parts.length; i++) {\n    const part = parts[i];\n    const isLastPart = i === parts.length - 1;\n\n    // Check if this part matches a file (only on last part)\n    if (isLastPart) {\n      const matchedFile = currentDir.children.find(\n        child => child.type === 'file' && child.name === part\n      ) as FileEntry | undefined;\n\n      if (matchedFile) {\n        file = matchedFile;\n        break;\n      }\n    }\n\n    // Otherwise, look for a directory\n    const nextDir = currentDir.children.find(\n      child => child.type === 'directory' && child.name === part\n    ) as DirectoryEntry | undefined;\n\n    if (!nextDir) {\n      throw new Error(`Path not found: ${path}`);\n    }\n\n    currentDir = nextDir;\n  }\n\n  return { directory: currentDir, file };\n}\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "veslx",
-  "version": "0.1.19",
+  "version": "0.1.21",
   "type": "module",
   "repository": {
     "type": "git",
@@ -42,6 +42,7 @@
     "@radix-ui/react-separator": "^1.1.8",
     "@radix-ui/react-slider": "^1.3.6",
     "@radix-ui/react-slot": "^1.2.4",
+    "@radix-ui/react-tabs": "^1.1.2",
     "@radix-ui/react-tooltip": "^1.2.8",
     "@radix-ui/react-use-controllable-state": "^1.2.2",
     "@tailwindcss/postcss": "^4.1.17",
@@ -109,5 +110,8 @@
     "typescript-eslint": "^8.46.3",
     "vite-plugin-dts": "^4.5.4"
   },
-  "overrides": {}
+  "overrides": {
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0"
+  }
 }

package/plugin/src/directory-tree.ts

@@ -110,8 +110,18 @@ export function buildDirectoryTree(
     );
     if (exists) continue;
 
-    // Look up frontmatter using the original key (before prefix stripping)
-    const frontmatter = frontmatters?.[key];
+    // Look up frontmatter - try multiple key formats since Vite resolves paths differently
+    // Plugin stores keys as "@content/path", but glob keys may be resolved paths
+    let frontmatter = frontmatters?.[key];
+    if (!frontmatter) {
+      // Try with @content prefix using the relative path
+      frontmatter = frontmatters?.[`@content/${relativePath}`];
+    }
+    if (!frontmatter) {
+      // Try without leading slash
+      const keyWithoutSlash = key.startsWith('/') ? key.slice(1) : key;
+      frontmatter = frontmatters?.[keyWithoutSlash];
+    }
 
     const fileEntry: FileEntry = {
       type: 'file',

package/plugin/src/types.ts

@@ -1,7 +1,10 @@
+export type ContentView = 'posts' | 'docs' | 'all';
+
 export interface SiteConfig {
   name?: string;
   description?: string;
   github?: string;
+  defaultView?: ContentView;
 }
 
 export interface VeslxConfig {
@@ -13,10 +16,12 @@ export interface ResolvedSiteConfig {
   name: string;
   description: string;
   github: string;
+  defaultView: ContentView;
 }
 
 export const DEFAULT_SITE_CONFIG: ResolvedSiteConfig = {
   name: 'veslx',
   description: '',
   github: '',
+  defaultView: 'all',
 };

package/src/components/content-tabs.tsx

@@ -0,0 +1,64 @@
+import { Link } from "react-router-dom";
+import { cn } from "@/lib/utils";
+import type { ContentView } from "@/lib/content-classification";
+
+interface ContentTabsProps {
+  value: ContentView;
+  counts: { posts: number; docs: number; all: number };
+}
+
+const views: { key: ContentView; label: string; path: string }[] = [
+  { key: "posts", label: "posts", path: "/posts" },
+  { key: "docs", label: "docs", path: "/docs" },
+  { key: "all", label: "all", path: "/all" },
+];
+
+export function ContentTabs({ value, counts }: ContentTabsProps) {
+  const hasOnlyPosts = counts.posts > 0 && counts.docs === 0;
+  const hasOnlyDocs = counts.docs > 0 && counts.posts === 0;
+
+  if (hasOnlyPosts || hasOnlyDocs) {
+    return null;
+  }
+
+  const isDisabled = (key: ContentView) => {
+    if (key === "posts") return counts.posts === 0;
+    if (key === "docs") return counts.docs === 0;
+    return false;
+  };
+
+  return (
+    <nav className="flex justify-end items-center gap-3 font-mono font-medium text-xs text-muted-foreground">
+      {views.map((view) => {
+        const disabled = isDisabled(view.key);
+
+        if (disabled) {
+          return (
+            <span
+              key={view.key}
+              className="opacity-30 cursor-not-allowed"
+            >
+              {view.label}
+            </span>
+          );
+        }
+
+        return (
+          <Link
+            key={view.key}
+            to={view.path}
+            className={cn(
+              "transition-colors duration-150",
+              "hover:text-foreground hover:underline hover:underline-offset-4 hover:decoration-primary/60",
+              value === view.key
+                ? "text-foreground underline-offset-4 decoration-primary/60"
+                : ""
+            )}
+          >
+            {view.label}
+          </Link>
+        );
+      })}
+    </nav>
+  );
+}

package/src/components/post-list.tsx

@@ -1,18 +1,16 @@
 import { Link } from "react-router-dom";
 import { cn } from "@/lib/utils";
-import { DirectoryEntry, FileEntry } from "../../plugin/src/lib";
-import { findReadme, findSlides, findMdxFiles } from "../../plugin/src/client";
+import type { DirectoryEntry } from "../../plugin/src/lib";
 import { formatDate } from "@/lib/format-date";
 import { ArrowRight } from "lucide-react";
-
-type PostEntry = {
-  type: 'folder' | 'file';
-  name: string;
-  path: string;
-  readme: FileEntry | null;
-  slides: FileEntry | null;
-  file: FileEntry | null; // For standalone MDX files
-};
+import {
+  type ContentView,
+  type PostEntry,
+  directoryToPostEntries,
+  filterVisiblePosts,
+  filterByView,
+  getFrontmatter,
+} from "@/lib/content-classification";
 
 // Helper to extract numeric prefix from filename (e.g., "01-intro" → 1)
 function extractOrder(name: string): number | null {
@@ -28,35 +26,13 @@ function stripNumericPrefix(name: string): string {
     .replace(/\b\w/g, c => c.toUpperCase());
 }
 
-export default function PostList({ directory }: { directory: DirectoryEntry }) {
-  const folders = directory.children.filter((c): c is DirectoryEntry => c.type === "directory");
-  const standaloneFiles = findMdxFiles(directory);
-
-  // Convert folders to post entries
-  const folderPosts: PostEntry[] = folders.map((folder) => {
-    const readme = findReadme(folder);
-    const slides = findSlides(folder);
-    return {
-      type: 'folder' as const,
-      name: folder.name,
-      path: folder.path,
-      readme,
-      slides,
-      file: null,
-    };
-  });
-
-  // Convert standalone MDX files to post entries
-  const filePosts: PostEntry[] = standaloneFiles.map((file) => ({
-    type: 'file' as const,
-    name: file.name.replace(/\.mdx?$/, ''),
-    path: file.path,
-    readme: null,
-    slides: null,
-    file,
-  }));
+interface PostListProps {
+  directory: DirectoryEntry;
+  view?: ContentView;
+}
 
-  let posts: PostEntry[] = [...folderPosts, ...filePosts];
+export default function PostList({ directory, view = 'all' }: PostListProps) {
+  let posts = directoryToPostEntries(directory);
 
   if (posts.length === 0) {
     return (
@@ -67,15 +43,18 @@ export default function PostList({ directory }: { directory: DirectoryEntry }) {
   }
 
   // Filter out hidden and draft posts
-  posts = posts.filter((post) => {
-    const frontmatter = post.readme?.frontmatter || post.file?.frontmatter;
-    return frontmatter?.visibility !== "hidden" && frontmatter?.draft !== true;
-  });
+  posts = filterVisiblePosts(posts);
 
-  // Helper to get frontmatter from post
-  const getFrontmatter = (post: PostEntry) => {
-    return post.readme?.frontmatter || post.file?.frontmatter || post.slides?.frontmatter;
-  };
+  // Apply view filter
+  posts = filterByView(posts, view);
+
+  if (posts.length === 0) {
+    return (
+      <div className="py-24 text-center">
+        <p className="text-muted-foreground font-mono text-sm tracking-wide">no entries</p>
+      </div>
+    );
+  }
 
   // Helper to get date from post
   const getPostDate = (post: PostEntry): Date | null => {

package/src/components/ui/tabs.tsx

@@ -0,0 +1,53 @@
+import * as React from "react"
+import * as TabsPrimitive from "@radix-ui/react-tabs"
+
+import { cn } from "@/lib/utils"
+
+const Tabs = TabsPrimitive.Root
+
+const TabsList = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.List>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.List
+    ref={ref}
+    className={cn(
+      "inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
+      className
+    )}
+    {...props}
+  />
+))
+TabsList.displayName = TabsPrimitive.List.displayName
+
+const TabsTrigger = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Trigger
+    ref={ref}
+    className={cn(
+      "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
+      className
+    )}
+    {...props}
+  />
+))
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
+
+const TabsContent = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Content
+    ref={ref}
+    className={cn(
+      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      className
+    )}
+    {...props}
+  />
+))
+TabsContent.displayName = TabsPrimitive.Content.displayName
+
+export { Tabs, TabsList, TabsTrigger, TabsContent }

package/src/lib/content-classification.ts

@@ -0,0 +1,73 @@
+import type { ContentView } from "../../plugin/src/types";
+import type { DirectoryEntry, FileEntry } from "../../plugin/src/lib";
+import { findReadme, findSlides, findMdxFiles } from "../../plugin/src/client";
+
+export type PostEntry = {
+  type: 'folder' | 'file';
+  name: string;
+  path: string;
+  readme: FileEntry | null;
+  slides: FileEntry | null;
+  file: FileEntry | null;
+};
+
+export function getFrontmatter(post: PostEntry) {
+  return post.readme?.frontmatter || post.file?.frontmatter || post.slides?.frontmatter;
+}
+
+export function hasDate(post: PostEntry): boolean {
+  const frontmatter = getFrontmatter(post);
+  return frontmatter?.date !== undefined && frontmatter.date !== null && frontmatter.date !== '';
+}
+
+export function filterByView(posts: PostEntry[], view: ContentView): PostEntry[] {
+  if (view === 'all') return posts;
+  if (view === 'posts') return posts.filter(hasDate);
+  if (view === 'docs') return posts.filter(post => !hasDate(post));
+  return posts;
+}
+
+export function getViewCounts(posts: PostEntry[]): { posts: number; docs: number; all: number } {
+  const dated = posts.filter(hasDate).length;
+  return {
+    posts: dated,
+    docs: posts.length - dated,
+    all: posts.length,
+  };
+}
+
+export function directoryToPostEntries(directory: DirectoryEntry): PostEntry[] {
+  const folders = directory.children.filter((c): c is DirectoryEntry => c.type === "directory");
+  const standaloneFiles = findMdxFiles(directory);
+
+  const folderPosts: PostEntry[] = folders
+    .map((folder) => ({
+      type: 'folder' as const,
+      name: folder.name,
+      path: folder.path,
+      readme: findReadme(folder),
+      slides: findSlides(folder),
+      file: null,
+    }))
+    .filter((post) => post.readme || post.slides); // Only include folders with content
+
+  const filePosts: PostEntry[] = standaloneFiles.map((file) => ({
+    type: 'file' as const,
+    name: file.name.replace(/\.mdx?$/, ''),
+    path: file.path,
+    readme: null,
+    slides: null,
+    file,
+  }));
+
+  return [...folderPosts, ...filePosts];
+}
+
+export function filterVisiblePosts(posts: PostEntry[]): PostEntry[] {
+  return posts.filter((post) => {
+    const frontmatter = getFrontmatter(post);
+    return frontmatter?.visibility !== "hidden" && frontmatter?.draft !== true;
+  });
+}
+
+export type { ContentView };

package/src/pages/content-router.tsx

@@ -5,6 +5,8 @@ import { SlidesPage } from "./slides"
 
 /**
  * Routes to the appropriate page based on the URL path:
+ * - /posts → Home with posts view
+ * - /docs → Home with docs view
  * - *.slides.mdx or *SLIDES.mdx → SlidesPage
  * - *.mdx → Post
  * - everything else → Home (directory listing)
@@ -12,6 +14,17 @@ import { SlidesPage } from "./slides"
 export function ContentRouter() {
   const { "*": path = "" } = useParams()
 
+  // Check for content view routes
+  if (path === 'posts') {
+    return <Home view="posts" />
+  }
+  if (path === 'docs') {
+    return <Home view="docs" />
+  }
+  if (path === 'all') {
+    return <Home view="all" />
+  }
+
   // Check if this is a slides file
   if (path.endsWith('.slides.mdx') || path.endsWith('SLIDES.mdx')) {
     return <SlidesPage />

package/src/pages/home.tsx

@@ -5,13 +5,39 @@ import PostList from "@/components/post-list";
 import { ErrorDisplay } from "@/components/page-error";
 import { RunningBar } from "@/components/running-bar";
 import { Header } from "@/components/header";
+import { ContentTabs } from "@/components/content-tabs";
+import {
+  type ContentView,
+  directoryToPostEntries,
+  filterVisiblePosts,
+  getViewCounts,
+} from "@/lib/content-classification";
 import siteConfig from "virtual:veslx-config";
 
-export function Home() {
+interface HomeProps {
+  view?: ContentView;
+}
+
+export function Home({ view }: HomeProps) {
   const { "*": path = "." } = useParams();
-  const { directory, loading, error } = useDirectory(path)
   const config = siteConfig;
 
+  // Normalize path - "posts", "docs", and "all" are view routes, not directories
+  const isViewRoute = path === "posts" || path === "docs" || path === "all";
+  const directoryPath = isViewRoute ? "." : path;
+
+  const { directory, loading, error } = useDirectory(directoryPath)
+
+  // Use prop view, fallback to config default
+  const activeView = view ?? config.defaultView;
+
+  const isRoot = path === "." || path === "" || isViewRoute;
+
+  // Calculate counts for tabs (only meaningful on root)
+  const counts = directory
+    ? getViewCounts(filterVisiblePosts(directoryToPostEntries(directory)))
+    : { posts: 0, docs: 0, all: 0 };
+
   if (error) {
     return <ErrorDisplay error={error} path={path} />;
   }
@@ -27,9 +53,9 @@ export function Home() {
       <RunningBar />
       <Header />
       <main className="flex-1 mx-auto w-full max-w-[var(--content-width)] px-[var(--page-padding)]">
-        <title>{(path === "." || path === "") ? config.name : `${config.name} - ${path}`}</title>
+        <title>{isRoot ? config.name : `${config.name} - ${path}`}</title>
         <main className="flex flex-col gap-8 mb-32 mt-32">
-          {(path === "." || path === "") && (
+          {isRoot && (
             <div className="animate-fade-in">
               <h1 className="text-2xl md:text-3xl font-semibold tracking-tight text-foreground">
                 {config.name}
@@ -41,11 +67,19 @@ export function Home() {
               )}
             </div>
           )}
-          {directory && (
-            <div className="animate-fade-in">
-              <PostList directory={directory}/>
-            </div>
-          )}
+
+          <div className="">
+            {isRoot && directory && (
+              <div className="animate-fade-in">
+                <ContentTabs value={activeView} counts={counts} />
+              </div>
+            )}
+            {directory && (
+              <div className="animate-fade-in">
+                <PostList directory={directory} view={isRoot ? activeView : 'all'} />
+              </div>
+            )}
+          </div>
         </main>
       </main>
     </div>

package/src/pages/post.tsx

@@ -6,6 +6,7 @@ import { RunningBar } from "@/components/running-bar";
 import { Header } from "@/components/header";
 import { useMDXContent } from "@/hooks/use-mdx-content";
 import { mdxComponents } from "@/components/mdx-components";
+import { formatDate } from "@/lib/format-date";
 
 export function Post() {
   const { "*": rawPath = "." } = useParams();
@@ -55,6 +56,26 @@ export function Post() {
 
         {Content && (
           <article className="my-24 prose dark:prose-invert prose-headings:tracking-tight prose-p:leading-relaxed prose-a:text-primary prose-a:no-underline hover:prose-a:underline max-w-[var(--prose-width)] animate-fade-in">
+            {/* Render frontmatter header */}
+            {frontmatter?.title && (
+              <header className="not-prose flex flex-col gap-2 mb-8 pt-4">
+                <h1 className="text-2xl md:text-3xl font-semibold tracking-tight text-foreground mb-3">
+                  {frontmatter.title}
+                </h1>
+                {frontmatter?.date && (
+                  <div className="flex flex-wrap items-center gap-3 text-muted-foreground">
+                    <time className="font-mono text-xs bg-muted px-2 py-0.5 rounded">
+                      {formatDate(new Date(frontmatter.date as string))}
+                    </time>
+                  </div>
+                )}
+                {frontmatter?.description && (
+                  <div className="flex flex-wrap text-sm items-center gap-3 text-muted-foreground">
+                    {frontmatter.description}
+                  </div>
+                )}
+              </header>
+            )}
             <Content components={mdxComponents} />
           </article>
         )}

package/src/vite-env.d.ts

@@ -1,10 +1,13 @@
 /// <reference types="vite/client" />
 
 declare module 'virtual:veslx-config' {
+  type ContentView = 'posts' | 'docs' | 'all';
+
   interface SiteConfig {
     name: string;
     description: string;
     github: string;
+    defaultView: ContentView;
   }
   const config: SiteConfig;
   export default config;