npm - docsprout - Versions diffs - 0.1.3 - Mend

docsprout 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (39) hide show

package/LICENSE +21 -0
package/README.md +224 -0
package/dist/index.cjs +9725 -0
package/dist/index.d.cts +1 -0
package/dist/index.d.ts +1 -0
package/dist/index.js +9730 -0
package/package.json +36 -0
package/templates/base/config.json +18 -0
package/templates/base/content/index.md +10 -0
package/templates/base/generated/pages.json +2 -0
package/templates/base/generated/search-index.json +2 -0
package/templates/base/sidebar.json +9 -0
package/templates/base/themes/default.json +8 -0
package/templates/web/app/(public)/docs/[[...slug]]/loading.tsx +9 -0
package/templates/web/app/(public)/docs/[[...slug]]/page.tsx +74 -0
package/templates/web/app/api/config/route.ts +47 -0
package/templates/web/app/api/publish/route.ts +82 -0
package/templates/web/app/api/search/route.ts +11 -0
package/templates/web/app/docs-admin/loading.tsx +9 -0
package/templates/web/app/docs-admin/page.tsx +237 -0
package/templates/web/app/globals.css +141 -0
package/templates/web/app/layout.tsx +46 -0
package/templates/web/app/page.tsx +17 -0
package/templates/web/components/markdown-content.tsx +100 -0
package/templates/web/components/providers.tsx +12 -0
package/templates/web/components/rich-editor.tsx +94 -0
package/templates/web/components/search-box.tsx +43 -0
package/templates/web/components/sidebar.tsx +36 -0
package/templates/web/components/toc.tsx +53 -0
package/templates/web/lib/content.ts +41 -0
package/templates/web/lib/db.ts +9 -0
package/templates/web/lib/types.ts +33 -0
package/templates/web/next-env.d.ts +5 -0
package/templates/web/next.config.mjs +16 -0
package/templates/web/package.json +40 -0
package/templates/web/postcss.config.cjs +8 -0
package/templates/web/prisma/schema.prisma +21 -0
package/templates/web/tailwind.config.cjs +10 -0
package/templates/web/tsconfig.json +20 -0

package/templates/web/app/globals.css ADDED Viewed

@@ -0,0 +1,141 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+:root {
+  --bg: #f8fafc;
+  --fg: #0f172a;
+  --glow-a: rgba(34, 197, 94, 0.18);
+  --glow-b: rgba(14, 165, 233, 0.14);
+  --link: #059669;
+}
+[data-docsprout-theme="default"] {
+  --glow-a: rgba(34, 197, 94, 0.18);
+  --glow-b: rgba(14, 165, 233, 0.14);
+  --link: #059669;
+}
+[data-docsprout-theme="modern"] {
+  --glow-a: rgba(99, 102, 241, 0.2);
+  --glow-b: rgba(6, 182, 212, 0.18);
+  --link: #4f46e5;
+}
+[data-docsprout-theme="minimal"] {
+  --glow-a: rgba(148, 163, 184, 0.12);
+  --glow-b: rgba(148, 163, 184, 0.1);
+  --link: #334155;
+}
+[data-docsprout-theme="classic"] {
+  --glow-a: rgba(217, 119, 6, 0.16);
+  --glow-b: rgba(220, 38, 38, 0.14);
+  --link: #b45309;
+}
+[data-docsprout-theme="ocean"] {
+  --glow-a: rgba(2, 132, 199, 0.2);
+  --glow-b: rgba(15, 118, 110, 0.18);
+  --link: #0369a1;
+}
+[data-docsprout-theme="forest"] {
+  --glow-a: rgba(21, 128, 61, 0.2);
+  --glow-b: rgba(132, 204, 22, 0.16);
+  --link: #166534;
+}
+[data-docsprout-theme="midnight"] {
+  --glow-a: rgba(30, 64, 175, 0.22);
+  --glow-b: rgba(88, 28, 135, 0.2);
+  --link: #1d4ed8;
+}
+.dark {
+  --bg: #020617;
+  --fg: #e2e8f0;
+}
+html,
+body {
+  overflow-x: clip;
+}
+body {
+  min-height: 100vh;
+  background:
+    radial-gradient(900px 500px at 0% -10%, var(--glow-a), transparent 60%),
+    radial-gradient(900px 500px at 100% -10%, var(--glow-b), transparent 60%),
+    var(--bg);
+  color: var(--fg);
+}
+.markdown-content {
+  @apply text-slate-700 dark:text-slate-300;
+}
+.markdown-content h1,
+.markdown-content h2,
+.markdown-content h3,
+.markdown-content h4 {
+  scroll-margin-top: 92px;
+}
+.markdown-content h1,
+.markdown-content h2,
+.markdown-content h3,
+.markdown-content h4 {
+  @apply mt-8 mb-3 font-semibold tracking-tight text-slate-950 dark:text-slate-100;
+}
+.markdown-content h1 { @apply text-3xl; }
+.markdown-content h2 { @apply text-2xl; }
+.markdown-content h3 { @apply text-xl; }
+.markdown-content p {
+  @apply my-4 leading-7;
+}
+.markdown-content a {
+  color: var(--link);
+  @apply underline underline-offset-4;
+}
+.markdown-content a:hover {
+  filter: brightness(1.1);
+}
+.markdown-content ul,
+.markdown-content ol {
+  @apply my-4 pl-6;
+}
+.markdown-content li {
+  @apply my-1;
+}
+.markdown-content blockquote {
+  @apply my-5 border-l-4 border-slate-300 pl-4 italic text-slate-600 dark:border-slate-700 dark:text-slate-400;
+}
+.markdown-content pre {
+  @apply my-5 overflow-x-auto rounded-xl border border-slate-200 bg-slate-950 p-4 text-slate-100 dark:border-slate-700;
+}
+.markdown-content :not(pre) > code {
+  @apply rounded bg-slate-200 px-1.5 py-0.5 text-sm text-slate-800 dark:bg-slate-800 dark:text-slate-100;
+}
+.table-wrap {
+  @apply my-5 w-full overflow-x-auto rounded-lg border border-slate-200 dark:border-slate-700;
+}
+.markdown-content table {
+  @apply min-w-full border-collapse text-sm;
+}
+.markdown-content th,
+.markdown-content td {
+  @apply whitespace-nowrap border-b border-slate-200 px-3 py-2 text-left dark:border-slate-700;
+}

package/templates/web/app/layout.tsx ADDED Viewed

@@ -0,0 +1,46 @@
+import "./globals.css";
+import type { ReactNode } from "react";
+import { Providers } from "../components/providers";
+import { readConfig } from "../lib/content";
+export async function generateMetadata() {
+  const config = await readConfig();
+  const project = config.projectName || "Project";
+  return {
+    title: `${project} - Docsprout`,
+    description: "Plug-and-play documentation"
+  };
+}
+export default async function RootLayout({ children }: { children: ReactNode }) {
+  const config = await readConfig();
+  const project = config.projectName || "docsprout";
+  const theme = config.theme || "default";
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body className="min-h-screen" suppressHydrationWarning data-docsprout-theme={theme}>
+        <Providers>
+          <div className="min-h-screen">
+            <header className="fixed inset-x-0 top-0 z-50 border-b border-slate-200/70 bg-white/75 backdrop-blur dark:border-slate-800/70 dark:bg-slate-950/80">
+              <div className="flex w-full items-center justify-between px-6 py-4">
+                <a href="/" className="text-lg font-semibold tracking-tight text-slate-900 dark:text-slate-100">{project}</a>
+                <nav className="flex items-center gap-5 text-sm text-slate-600 dark:text-slate-300">
+                  <a className="hover:text-slate-950 dark:hover:text-white" href="/docs">Docs</a>
+                  <a className="hover:text-slate-950 dark:hover:text-white" href="/docs-admin">Admin</a>
+                </nav>
+              </div>
+            </header>
+            <div className="pt-[72px]">{children}</div>
+            <footer className="mt-10 border-t border-slate-200/70 bg-white/60 dark:border-slate-800/70 dark:bg-slate-950/60">
+              <div className="flex w-full items-center justify-between px-6 py-4 text-sm text-slate-600 dark:text-slate-300">
+                <p>Built with docsprout</p>
+                <p className="text-xs uppercase tracking-[0.14em]">Modern Docs Platform</p>
+              </div>
+            </footer>
+          </div>
+        </Providers>
+      </body>
+    </html>
+  );
+}

package/templates/web/app/page.tsx ADDED Viewed

@@ -0,0 +1,17 @@
+import { readConfig } from "../lib/content";
+export default async function HomePage() {
+  const cfg = await readConfig();
+  return (
+    <main className="mx-auto flex min-h-screen max-w-5xl flex-col justify-center gap-4 p-6">
+      <h1 className="text-4xl font-bold">{cfg.projectName}</h1>
+      <p className="text-slate-600 dark:text-slate-300">Documentation and admin are ready.</p>
+      <div className="flex gap-3">
+        <a href="/docs/index" className="rounded bg-green-600 px-4 py-2 text-white">Open Docs</a>
+        <a href="/docs-admin" className="rounded border border-slate-400 px-4 py-2">Open Admin</a>
+      </div>
+    </main>
+  );
+}

package/templates/web/components/markdown-content.tsx ADDED Viewed

@@ -0,0 +1,100 @@
+"use client";
+import { useEffect, useMemo, useState } from "react";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+import rehypeSlug from "rehype-slug";
+import rehypeHighlight from "rehype-highlight";
+import mermaid from "mermaid";
+const MermaidBlock = ({ code }: { code: string }) => {
+  const [svg, setSvg] = useState<string>("");
+  useEffect(() => {
+    let mounted = true;
+    const id = `mermaid-${Math.random().toString(36).slice(2)}`;
+    mermaid.initialize({ startOnLoad: false, theme: "default", securityLevel: "loose" });
+    mermaid
+      .render(id, code)
+      .then((result) => {
+        if (mounted) setSvg(result.svg);
+      })
+      .catch((error) => {
+        if (mounted) setSvg(`<pre>Diagram error: ${String(error?.message ?? "invalid syntax")}</pre>`);
+      });
+    return () => {
+      mounted = false;
+    };
+  }, [code]);
+  return <div className="mermaid-wrap" dangerouslySetInnerHTML={{ __html: svg }} />;
+};
+const normalizeDiagramCode = (lang: string, raw: string) => {
+  const code = raw.trim();
+  const first = code.split("\n")[0]?.trim().toLowerCase() ?? "";
+  const token = lang.toLowerCase();
+  if (token === "mermaid") return code;
+  if (token === "flowchart" || token === "graph") {
+    return first.startsWith("flowchart") || first.startsWith("graph") ? code : `flowchart TD\n${code}`;
+  }
+  if (token === "sequence") {
+    return first.startsWith("sequencediagram") ? code : `sequenceDiagram\n${code}`;
+  }
+  if (token === "gantt") {
+    return first.startsWith("gantt") ? code : `gantt\n${code}`;
+  }
+  if (token === "state") {
+    return first.startsWith("statediagram") ? code : `stateDiagram-v2\n${code}`;
+  }
+  if (token === "er") {
+    return first.startsWith("erdiagram") ? code : `erDiagram\n${code}`;
+  }
+  if (
+    first.startsWith("graph") ||
+    first.startsWith("flowchart") ||
+    first.startsWith("sequencediagram") ||
+    first.startsWith("gantt") ||
+    first.startsWith("statediagram") ||
+    first.startsWith("erdiagram")
+  ) {
+    return code;
+  }
+  return null;
+};
+export const MarkdownContent = ({ content }: { content: string }) => {
+  const normalized = useMemo(() => content.replace(/\r\n/g, "\n"), [content]);
+  return (
+    <ReactMarkdown
+      remarkPlugins={[remarkGfm]}
+      rehypePlugins={[rehypeSlug, rehypeHighlight]}
+      components={{
+        table: ({ ...props }) => (
+          <div className="table-wrap">
+            <table {...props} />
+          </div>
+        ),
+        code({ className, children, inline }) {
+          const raw = String(children).replace(/\n$/, "");
+          const lang = className?.replace("language-", "") ?? "";
+          const diagram = !inline ? normalizeDiagramCode(lang, raw) : null;
+          if (diagram) {
+            return <MermaidBlock code={diagram} />;
+          }
+          return <code className={className}>{children}</code>;
+        }
+      }}
+    >
+      {normalized}
+    </ReactMarkdown>
+  );
+};

package/templates/web/components/providers.tsx ADDED Viewed

@@ -0,0 +1,12 @@
+"use client";
+import { ThemeProvider } from "next-themes";
+import { ReactNode } from "react";
+export const Providers = ({ children }: { children: ReactNode }) => (
+  <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+    {children}
+  </ThemeProvider>
+);

package/templates/web/components/rich-editor.tsx ADDED Viewed

@@ -0,0 +1,94 @@
+"use client";
+import { useMemo, useRef, useState } from "react";
+import { MarkdownContent } from "./markdown-content";
+type Mode = "write" | "preview";
+const wrapSelection = (value: string, start: number, end: number, before: string, after: string) => {
+  const selected = value.slice(start, end);
+  return `${value.slice(0, start)}${before}${selected}${after}${value.slice(end)}`;
+};
+const insertLine = (value: string, start: number, text: string) => {
+  return `${value.slice(0, start)}${text}${value.slice(start)}`;
+};
+export const RichEditor = ({ value, onChange }: { value: string; onChange: (value: string) => void }) => {
+  const [mode, setMode] = useState<Mode>("write");
+  const textareaRef = useRef<HTMLTextAreaElement | null>(null);
+  const apply = (handler: (value: string, start: number, end: number) => string) => {
+    const el = textareaRef.current;
+    if (!el) return;
+    const start = el.selectionStart;
+    const end = el.selectionEnd;
+    const next = handler(value, start, end);
+    onChange(next);
+    queueMicrotask(() => {
+      el.focus();
+      el.setSelectionRange(start, end);
+    });
+  };
+  const actions = useMemo(() => ([
+    { label: "H1", fn: () => apply((v, s) => insertLine(v, s, "# ")) },
+    { label: "H2", fn: () => apply((v, s) => insertLine(v, s, "## ")) },
+    { label: "H3", fn: () => apply((v, s) => insertLine(v, s, "### ")) },
+    { label: "Bold", fn: () => apply((v, s, e) => wrapSelection(v, s, e, "**", "**")) },
+    { label: "Italic", fn: () => apply((v, s, e) => wrapSelection(v, s, e, "*", "*")) },
+    { label: "Strike", fn: () => apply((v, s, e) => wrapSelection(v, s, e, "~~", "~~")) },
+    { label: "Quote", fn: () => apply((v, s) => insertLine(v, s, "> ")) },
+    { label: "Code", fn: () => apply((v, s, e) => wrapSelection(v, s, e, "```\n", "\n```")) },
+    { label: "Bullet", fn: () => apply((v, s) => insertLine(v, s, "- ")) },
+    { label: "Number", fn: () => apply((v, s) => insertLine(v, s, "1. ")) },
+    { label: "Task", fn: () => apply((v, s) => insertLine(v, s, "- [ ] ")) },
+    { label: "Link", fn: () => apply((v, s, e) => wrapSelection(v, s, e, "[", "](https://)")) },
+    { label: "Image", fn: () => apply((v, s) => insertLine(v, s, "![alt](https://)")) },
+    { label: "Table", fn: () => apply((v, s) => insertLine(v, s, "| Col A | Col B |\n| --- | --- |\n| Value | Value |\n")) },
+    { label: "Mermaid", fn: () => apply((v, s) => insertLine(v, s, "```mermaid\nflowchart LR\n  A[Start] --> B[Done]\n```\n")) }
+  ]), [value]);
+  return (
+    <div className="rounded-xl border border-slate-300 bg-white dark:border-slate-700 dark:bg-slate-900">
+      <div className="flex flex-wrap items-center gap-2 border-b border-slate-200 p-2 dark:border-slate-800">
+        <button
+          className={`rounded px-2 py-1 text-xs ${mode === "write" ? "bg-slate-900 text-white dark:bg-slate-100 dark:text-slate-900" : "border border-slate-300 dark:border-slate-700"}`}
+          onClick={() => setMode("write")}
+          type="button"
+        >
+          Write
+        </button>
+        <button
+          className={`rounded px-2 py-1 text-xs ${mode === "preview" ? "bg-slate-900 text-white dark:bg-slate-100 dark:text-slate-900" : "border border-slate-300 dark:border-slate-700"}`}
+          onClick={() => setMode("preview")}
+          type="button"
+        >
+          Preview
+        </button>
+        <div className="h-4 w-px bg-slate-300 dark:bg-slate-700" />
+        {actions.map((action) => (
+          <button key={action.label} type="button" onClick={action.fn} className="rounded border border-slate-300 px-2 py-1 text-xs hover:bg-slate-100 dark:border-slate-700 dark:hover:bg-slate-800">
+            {action.label}
+          </button>
+        ))}
+      </div>
+      {mode === "write" ? (
+        <textarea
+          ref={textareaRef}
+          value={value}
+          onChange={(e) => onChange(e.target.value)}
+          className="h-[calc(100%-44px)] min-h-[360px] w-full resize-none rounded-b-xl bg-transparent p-4 font-mono text-sm outline-none"
+          spellCheck={false}
+        />
+      ) : (
+        <div className="h-[calc(100%-44px)] min-h-[360px] overflow-y-auto p-4 markdown-content">
+          <MarkdownContent content={value} />
+        </div>
+      )}
+    </div>
+  );
+};

package/templates/web/components/search-box.tsx ADDED Viewed

@@ -0,0 +1,43 @@
+"use client";
+import { useMemo, useState } from "react";
+type SearchEntry = {
+  slug: string;
+  title: string;
+  excerpt: string;
+  tags: string[];
+};
+export const SearchBox = ({ entries }: { entries: SearchEntry[] }) => {
+  const [query, setQuery] = useState("");
+  const results = useMemo(() => {
+    if (!query.trim()) return [];
+    return entries.filter((entry) =>
+      `${entry.title} ${entry.excerpt} ${entry.tags.join(" ")}`.toLowerCase().includes(query.toLowerCase())
+    );
+  }, [entries, query]);
+  return (
+    <div className="relative">
+      <input
+        value={query}
+        onChange={(event) => setQuery(event.target.value)}
+        className="w-full rounded border border-slate-300 p-2 text-sm dark:border-slate-700 dark:bg-slate-950"
+        placeholder="Search docs..."
+      />
+      {results.length > 0 && (
+        <div className="absolute z-10 mt-2 max-h-64 w-full overflow-auto rounded border bg-white p-2 shadow dark:border-slate-700 dark:bg-slate-900">
+          {results.map((result) => (
+            <a key={result.slug} href={`/docs/${result.slug}`} className="block rounded p-2 hover:bg-slate-100 dark:hover:bg-slate-800">
+              <p className="text-sm font-semibold">{result.title}</p>
+              <p className="text-xs text-slate-500">{result.excerpt}</p>
+            </a>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+};

package/templates/web/components/sidebar.tsx ADDED Viewed

@@ -0,0 +1,36 @@
+"use client";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import type { SidebarItem } from "../lib/types";
+export const Sidebar = ({ items }: { items: SidebarItem[] }) => {
+  const pathname = usePathname();
+  return (
+    <aside className="w-full shrink-0 lg:w-72">
+      <div className="sticky top-20 rounded-2xl border border-slate-200 bg-white/80 p-4 shadow-sm backdrop-blur dark:border-slate-800 dark:bg-slate-950/70">
+        <h2 className="mb-3 text-xs font-semibold uppercase tracking-[0.14em] text-slate-500">Pages</h2>
+        <ul className="space-y-1">
+          {items.map((item) => {
+            const href = `/docs/${item.slug}`;
+            const active = pathname === href;
+            return (
+              <li key={item.slug}>
+                <Link
+                  href={href}
+                  className={`block rounded-lg px-3 py-2 text-sm transition ${active
+                    ? "bg-slate-900 text-white dark:bg-slate-100 dark:text-slate-900"
+                    : "text-slate-700 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-300 dark:hover:bg-slate-800 dark:hover:text-white"
+                    }`}
+                >
+                  {item.title}
+                </Link>
+              </li>
+            );
+          })}
+        </ul>
+      </div>
+    </aside>
+  );
+};

package/templates/web/components/toc.tsx ADDED Viewed

@@ -0,0 +1,53 @@
+"use client";
+import { useEffect, useState } from "react";
+type Heading = { text: string; id: string };
+export const Toc = ({ headings }: { headings: Heading[] }) => {
+  const [active, setActive] = useState<string>(headings[0]?.id ?? "");
+  useEffect(() => {
+    if (headings.length === 0) return;
+    const observer = new IntersectionObserver(
+      (entries) => {
+        const visible = entries
+          .filter((entry) => entry.isIntersecting)
+          .sort((a, b) => b.intersectionRatio - a.intersectionRatio);
+        if (visible[0]?.target?.id) {
+          setActive(visible[0].target.id);
+        }
+      },
+      { rootMargin: "-20% 0px -60% 0px", threshold: [0.1, 0.3, 0.6] }
+    );
+    headings.forEach((heading) => {
+      const el = document.getElementById(heading.id);
+      if (el) observer.observe(el);
+    });
+    return () => observer.disconnect();
+  }, [headings]);
+  return (
+    <div className="sticky top-20 rounded-2xl border border-slate-200 bg-white/80 p-4 text-sm shadow-sm backdrop-blur dark:border-slate-800 dark:bg-slate-950/70">
+      <h2 className="mb-3 text-xs font-semibold uppercase tracking-[0.14em] text-slate-500">On This Page</h2>
+      <ul className="space-y-2">
+        {headings.map((heading) => (
+          <li key={heading.id}>
+            <a
+              className={active === heading.id
+                ? "font-medium text-slate-950 dark:text-white"
+                : "text-slate-600 hover:text-slate-950 dark:text-slate-300 dark:hover:text-white"}
+              href={`#${heading.id}`}
+            >
+              {heading.text}
+            </a>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+};

package/templates/web/lib/content.ts ADDED Viewed

@@ -0,0 +1,41 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+import type { DocPage, DocsproutConfig, SidebarItem } from "./types";
+const resolveDocsRoot = async () => {
+  let current = process.cwd();
+  while (true) {
+    const candidate = path.join(current, "docsprout");
+    try {
+      await fs.access(candidate);
+      return current;
+    } catch {
+      const parent = path.dirname(current);
+      if (parent === current) return process.cwd();
+      current = parent;
+    }
+  }
+};
+const readJson = async <T>(parts: string[]): Promise<T> => {
+  const root = await resolveDocsRoot();
+  const file = path.join(root, ...parts);
+  const raw = await fs.readFile(file, "utf-8");
+  return JSON.parse(raw) as T;
+};
+export const readConfig = async (): Promise<DocsproutConfig> => readJson(["docsprout", "config.json"]);
+export const readPages = async (): Promise<DocPage[]> => readJson(["docsprout", "generated", "pages.json"]);
+export const readSidebar = async (): Promise<SidebarItem[]> => readJson(["docsprout", "sidebar.json"]);
+export const getPublishedPages = async () => {
+  const pages = await readPages();
+  return pages.filter((page) => page.status === "published");
+};
+export const getPageBySlug = async (slug: string) => {
+  const pages = await readPages();
+  return pages.find((p) => p.slug === slug && p.status === "published") ?? null;
+};

package/templates/web/lib/db.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import { PrismaClient } from "@prisma/client";
+const globalForPrisma = globalThis as unknown as { prisma?: PrismaClient };
+export const prisma = globalForPrisma.prisma ?? new PrismaClient();
+if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = prisma;

package/templates/web/lib/types.ts ADDED Viewed

@@ -0,0 +1,33 @@
+export type DocStatus = "draft" | "published";
+export interface DocsproutConfig {
+  projectName: string;
+  contentRoots: string[];
+  ignore: string[];
+  theme: string;
+  basePath: string;
+  adminPath: string;
+  outputDir: string;
+  includeDraftsInDev: boolean;
+}
+export interface DocPage {
+  id: string;
+  title: string;
+  slug: string;
+  sourcePath: string;
+  content: string;
+  excerpt?: string;
+  order?: number;
+  status: DocStatus;
+  tags: string[];
+  metadata: Record<string, unknown>;
+  updatedAt: string;
+}
+export interface SidebarItem {
+  title: string;
+  slug: string;
+  path: string;
+  children?: SidebarItem[];
+}

package/templates/web/next-env.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.

package/templates/web/next.config.mjs ADDED Viewed

@@ -0,0 +1,16 @@
+import createMDX from "@next/mdx";
+const withMDX = createMDX({
+  extension: /\.(md|mdx)$/
+});
+const nextConfig = {
+  pageExtensions: ["ts", "tsx", "md", "mdx"],
+  experimental: {
+    mdxRs: true
+  }
+};
+export default withMDX(nextConfig);