react-docs-module 0.1.0

package/dist/ui/button.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const buttonVariants: (props?: ({
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+    size?: "default" | "icon" | "sm" | "lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };
+//# sourceMappingURL=button.d.ts.map

package/dist/ui/button.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { cn } from "../cn";
+const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/90",
+            destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+            outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            ghost: "hover:bg-accent hover:text-accent-foreground",
+            link: "text-primary underline-offset-4 hover:underline",
+        },
+        size: {
+            default: "h-10 px-4 py-2",
+            sm: "h-9 rounded-md px-3",
+            lg: "h-11 rounded-md px-8",
+            icon: "h-10 w-10",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+const Button = React.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return (_jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref: ref, ...props }));
+});
+Button.displayName = "Button";
+export { Button, buttonVariants };
+//# sourceMappingURL=button.js.map

package/dist/ui/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../ui/button.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAE1B,MAAM,cAAc,GAAG,GAAG,CACxB,0VAA0V,EAC1V;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,wDAAwD;YACjE,WAAW,EACT,oEAAoE;YACtE,OAAO,EACL,gFAAgF;YAClF,SAAS,EACP,8DAA8D;YAChE,KAAK,EAAE,8CAA8C;YACrD,IAAI,EAAE,iDAAiD;SACxD;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,gBAAgB;YACzB,EAAE,EAAE,qBAAqB;YACzB,EAAE,EAAE,sBAAsB;YAC1B,IAAI,EAAE,WAAW;SAClB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAA;AAQD,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAC7B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,GAAG,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC/D,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAA;IACtC,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC,EAC3D,GAAG,EAAE,GAAG,KACJ,KAAK,GACT,CACH,CAAA;AACH,CAAC,CACF,CAAA;AACD,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAA;AAE7B,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/dialog.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };
+//# sourceMappingURL=dialog.d.ts.map

package/dist/ui/dialog.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { cn } from "../cn";
+const Dialog = DialogPrimitive.Root;
+const DialogTrigger = DialogPrimitive.Trigger;
+const DialogPortal = DialogPrimitive.Portal;
+const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Overlay, { ref: ref, className: cn("fixed inset-0 z-50 bg-black/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props })));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+const DialogContent = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsx(DialogPrimitive.Content, { ref: ref, className: cn("fixed left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] gap-4 border border-gray-700 bg-gray-900 p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 rounded-lg", className), ...props, children: children })] })));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+const DialogHeader = ({ className, ...props }) => (_jsx("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props }));
+DialogHeader.displayName = "DialogHeader";
+const DialogFooter = ({ className, ...props }) => (_jsx("div", { className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className), ...props }));
+DialogFooter.displayName = "DialogFooter";
+const DialogTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Title, { ref: ref, className: cn("text-lg font-semibold leading-none", className), ...props })));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+const DialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Description, { ref: ref, className: cn("text-sm text-gray-400", className), ...props })));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+export { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };
+//# sourceMappingURL=dialog.js.map

package/dist/ui/dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../ui/dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,CAAC;AAEpC,MAAM,aAAa,GAAG,eAAe,CAAC,OAAO,CAAC;AAE9C,MAAM,YAAY,GAAG,eAAe,CAAC,MAAM,CAAC;AAE5C,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAGpC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,eAAe,CAAC,OAAO,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,yKAAyK,EACzK,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC,CAAC;AACH,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC,OAAO,CAAC,WAAW,CAAC;AAEhE,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAGpC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC5C,MAAC,YAAY,eACX,KAAC,aAAa,KAAG,EACjB,KAAC,eAAe,CAAC,OAAO,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,mUAAmU,EACnU,SAAS,CACV,KACG,KAAK,YAER,QAAQ,GACe,IACb,CAChB,CAAC,CAAC;AACH,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC,OAAO,CAAC,WAAW,CAAC;AAEhE,MAAM,YAAY,GAAG,CAAC,EACpB,SAAS,EACT,GAAG,KAAK,EAC6B,EAAE,EAAE,CAAC,CAC1C,cACE,SAAS,EAAE,EAAE,CACX,oDAAoD,EACpD,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;AAE1C,MAAM,YAAY,GAAG,CAAC,EACpB,SAAS,EACT,GAAG,KAAK,EAC6B,EAAE,EAAE,CAAC,CAC1C,cACE,SAAS,EAAE,EAAE,CACX,+DAA+D,EAC/D,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;AAE1C,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,eAAe,CAAC,KAAK,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,oCAAoC,EAAE,SAAS,CAAC,KAC1D,KAAK,GACT,CACH,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC;AAE5D,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAGxC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,eAAe,CAAC,WAAW,IAC1B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,KAC7C,KAAK,GACT,CACH,CAAC,CAAC;AACH,iBAAiB,CAAC,WAAW,GAAG,eAAe,CAAC,WAAW,CAAC,WAAW,CAAC;AAExE,OAAO,EACL,MAAM,EACN,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,GAClB,CAAC"}

package/dist/ui/input.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+declare const Input: React.ForwardRefExoticComponent<React.InputHTMLAttributes<HTMLInputElement> & React.RefAttributes<HTMLInputElement>>;
+export { Input };
+//# sourceMappingURL=input.d.ts.map

package/dist/ui/input.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../cn";
+const Input = React.forwardRef(({ className, type, ...props }, ref) => {
+    return (_jsx("input", { type: type, className: cn("flex h-10 w-full rounded-md border border-gray-700 bg-gray-800 px-3 py-2 text-sm text-gray-100 ring-offset-gray-900 placeholder:text-gray-400 focus:outline-none focus:ring-2 focus:ring-gray-700 focus:ring-offset-2", className), ref: ref, ...props }));
+});
+Input.displayName = "Input";
+export { Input };
+//# sourceMappingURL=input.js.map

package/dist/ui/input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","sourceRoot":"","sources":["../../ui/input.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAG5B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACvC,OAAO,CACL,gBACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,uNAAuN,EACvN,SAAS,CACV,EACD,GAAG,EAAE,GAAG,KACJ,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAE5B,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/util.d.ts

@@ -0,0 +1,59 @@
+import { ReactDocsConfig } from "./config";
+interface DocPage {
+    slug: string;
+    title: string;
+    icon?: string;
+    isExternal?: boolean;
+}
+interface DocSection {
+    group: string;
+    pages: DocPage[];
+}
+export interface DocsJsonConfig {
+    theme: string;
+    name: string;
+    description?: string;
+    navigation: {
+        groups?: {
+            group: string;
+            pages: string[];
+        }[];
+        anchors?: {
+            name: string;
+            icon: string;
+            url: string;
+        }[];
+        pages?: string[];
+    };
+    colors: {
+        primary: string;
+        light?: string;
+        dark?: string;
+    };
+    logo?: {
+        dark?: string;
+        light?: string;
+    };
+    favicon?: string;
+    navbar?: {
+        cta?: {
+            type: string;
+            url: string;
+        };
+    };
+    footer?: {
+        socials?: Record<string, string>;
+    };
+    feedback?: {
+        thumbsRating?: boolean;
+    };
+}
+export declare function getDocsSidebar(config: ReactDocsConfig): {
+    navigation: DocSection[];
+    config: DocsJsonConfig;
+};
+export declare function getAllDocSlugs(config: ReactDocsConfig): {
+    slug: string;
+}[];
+export {};
+//# sourceMappingURL=util.d.ts.map

package/dist/util.js

@@ -0,0 +1,96 @@
+import fs from "node:fs";
+import path from "node:path";
+import matter from "gray-matter";
+export function getDocsSidebar(config) {
+    const docsDirectory = path.join(process.cwd(), config.contentPath);
+    const docsJsonPath = path.join(process.cwd(), config.contentPath, "docs.json");
+    if (!fs.existsSync(docsJsonPath)) {
+        throw new Error(`docs.json configuration file not found at ${config.contentPath}/docs.json`);
+    }
+    const docsConfig = JSON.parse(fs.readFileSync(docsJsonPath, 'utf8'));
+    const navigation = [];
+    // Add anchors as the first section if they exist
+    if (docsConfig.navigation.anchors && docsConfig.navigation.anchors.length > 0) {
+        navigation.push({
+            group: "Links",
+            pages: docsConfig.navigation.anchors.map(anchor => ({
+                slug: anchor.url,
+                title: anchor.name,
+                icon: anchor.icon,
+                isExternal: true
+            }))
+        });
+    }
+    // Handle groups navigation
+    if (docsConfig.navigation.groups) {
+        docsConfig.navigation.groups.forEach(section => {
+            const pages = [];
+            section.pages.forEach(pagePath => {
+                const fullPath = path.join(docsDirectory, `${pagePath}.mdx`);
+                if (fs.existsSync(fullPath)) {
+                    const fileContents = fs.readFileSync(fullPath, 'utf8');
+                    const { data: frontmatter } = matter(fileContents);
+                    pages.push({
+                        slug: pagePath,
+                        title: frontmatter.title || pagePath.split('/').pop()?.replace(/-/g, ' ') || '',
+                    });
+                }
+            });
+            if (pages.length > 0) {
+                navigation.push({
+                    group: section.group,
+                    pages,
+                });
+            }
+        });
+    }
+    // Handle direct pages navigation (if no groups)
+    if (docsConfig.navigation.pages && !docsConfig.navigation.groups) {
+        const pages = [];
+        docsConfig.navigation.pages.forEach(pagePath => {
+            const fullPath = path.join(docsDirectory, `${pagePath}.mdx`);
+            if (fs.existsSync(fullPath)) {
+                const fileContents = fs.readFileSync(fullPath, 'utf8');
+                const { data: frontmatter } = matter(fileContents);
+                pages.push({
+                    slug: pagePath,
+                    title: frontmatter.title || pagePath.split('/').pop()?.replace(/-/g, ' ') || '',
+                });
+            }
+        });
+        if (pages.length > 0) {
+            navigation.push({
+                group: "Documentation",
+                pages,
+            });
+        }
+    }
+    return { navigation, config: docsConfig };
+}
+export function getAllDocSlugs(config) {
+    const docsDirectory = path.join(process.cwd(), config.contentPath);
+    const fileNames = fs.readdirSync(docsDirectory);
+    return fileNames
+        .filter((fileName) => fileName.endsWith(".mdx"))
+        .map((fileName) => ({
+        slug: fileName.replace(/\.mdx$/, ""),
+    }));
+}
+// Helper function to recursively read all MDX files from a directory
+function getAllDocs(dir) {
+    const files = fs.readdirSync(dir);
+    return files.flatMap(file => {
+        const filePath = path.join(dir, file);
+        const stats = fs.statSync(filePath);
+        if (stats.isDirectory()) {
+            return getAllDocs(filePath);
+        }
+        if (file.endsWith('.mdx')) {
+            const fileContents = fs.readFileSync(filePath, 'utf8');
+            const { content } = matter(fileContents);
+            return content;
+        }
+        return [];
+    });
+}
+//# sourceMappingURL=util.js.map

package/dist/util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.js","sourceRoot":"","sources":["../util.ts"],"names":[],"mappings":"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"}

package/doc-pagination.tsx

@@ -0,0 +1,67 @@
+import Link from "next/link";
+import { ReactDocsConfig } from "./config";
+
+interface Page {
+  title: string;
+  slug: string;
+}
+
+interface Props {
+  config: ReactDocsConfig;
+  prev?: Page;
+  next?: Page;
+}
+
+export function DocPagination({ config, prev, next }: Props) {
+  if (!prev && !next) return null;
+
+  return (
+    <div className="mt-16 flex items-center justify-between border-t border-gray-800 pt-8">
+      {prev ? (
+        <Link
+          href={`${config.basePath}/${prev.slug}`}
+          className="group flex items-center gap-3 text-gray-400 hover:text-white transition-colors"
+        >
+          <svg
+            width="16"
+            height="16"
+            viewBox="0 0 16 16"
+            fill="none"
+            stroke="currentColor"
+            strokeWidth="2"
+            className="transition-transform group-hover:-translate-x-1"
+          >
+            <path d="M10.5 3.5L5.5 8l5 4.5" />
+          </svg>
+          <div>
+            <div className="text-sm text-gray-500">Previous</div>
+            <div className="text-sm font-medium">{prev.title}</div>
+          </div>
+        </Link>
+      ) : <div />}
+
+      {next ? (
+        <Link
+          href={`${config.basePath}/${next.slug}`}
+          className="group flex items-center gap-3 text-right text-gray-400 hover:text-white transition-colors"
+        >
+          <div>
+            <div className="text-sm text-gray-500">Next</div>
+            <div className="text-sm font-medium">{next.title}</div>
+          </div>
+          <svg
+            width="16"
+            height="16"
+            viewBox="0 0 16 16"
+            fill="none"
+            stroke="currentColor"
+            strokeWidth="2"
+            className="transition-transform group-hover:translate-x-1"
+          >
+            <path d="M5.5 3.5l5 4.5-5 4.5" />
+          </svg>
+        </Link>
+      ) : <div />}
+    </div>
+  );
+} 

package/docs-index.tsx

@@ -0,0 +1,17 @@
+import { redirect } from 'next/navigation';
+import { getDocsSidebar } from './util';
+import { ReactDocsConfig } from './config';
+
+interface DocsIndexProps {
+  config: ReactDocsConfig;
+}
+
+export function DocsIndex({ config }: DocsIndexProps) {
+  const { navigation } = getDocsSidebar(config);
+
+  // Redirect to the first page in navigation
+  if (navigation[0]?.pages[0]?.slug) {
+    redirect(`${config.basePath}/${navigation[0].pages[0].slug}`);
+  }
+  return null;
+}

package/docs-page.tsx

@@ -0,0 +1,68 @@
+import { getDocsSidebar } from './util';
+import { ReactDocsConfig } from './config';
+import { getAllDocs, getDocBySlug } from './mdx';
+import { DocumentationLayout } from './documentation-layout';
+
+interface DocsPageProps {
+  config: ReactDocsConfig;
+  slug: string[];
+}
+
+export interface DocsMetadata {
+  title: string;
+}
+
+export async function generateDocsMetadata(docsConfig: ReactDocsConfig, slug: string[]): Promise<DocsMetadata> {
+  const { navigation } = getDocsSidebar(docsConfig);
+  const currentPath = slug.join("/");
+
+  // Find the current page in navigation
+  let pageTitle = "Documentation";
+  for (const section of navigation) {
+    const page = section.pages.find(p => p.slug === currentPath);
+    if (page) {
+      pageTitle = page.title;
+      break;
+    }
+  }
+
+  return {
+    title: pageTitle,
+  };
+}
+
+export async function generateDocsStaticParams(docsConfig: ReactDocsConfig) {
+  const docs = getAllDocs(docsConfig);
+
+  return docs.map((doc: any) => ({
+    slug: doc.slug.split('/')
+  }));
+}
+
+export async function DocsPage({ config, slug }: DocsPageProps) {
+  const { navigation } = getDocsSidebar(config);
+  const curSlug = slug.join("/");
+  const { content, frontmatter, headings } = await getDocBySlug(config, curSlug);
+  const currentPath = config.basePath + `/${curSlug}`;
+  console.log(currentPath);
+
+  if (!content) {
+    return null;
+  }
+
+  return (
+    <DocumentationLayout
+      config={config}
+      navigation={navigation}
+      currentPath={currentPath}
+      headings={headings}
+    >
+      <div className="prose prose-invert max-w-none">
+        <h1 id="title" className="text-3xl font-medium mb-8 mt-2">
+          {frontmatter.title}
+        </h1>
+        {content}
+      </div>
+    </DocumentationLayout>
+  );
+}

package/docs-sidebar.tsx

@@ -0,0 +1,165 @@
+"use client";
+import Link from "next/link";
+import { cn } from "./cn";
+import { useState } from "react";
+import { Menu, X } from "lucide-react";
+import { Button } from "./ui/button";
+import { SiDiscord, SiGithub } from "@icons-pack/react-simple-icons";
+import { ReactDocsConfig } from "./config";
+
+interface DocPage {
+  slug: string;
+  title: string;
+  icon?: string;
+  isExternal?: boolean;
+}
+
+interface Props {
+  config: ReactDocsConfig;
+  navigation: {
+    group: string;
+    pages: DocPage[];
+  }[];
+  currentPath: string;
+}
+
+const iconMap: Record<string, React.ComponentType<{ className?: string }>> = {
+  github: SiGithub,
+  discord: SiDiscord,
+};
+
+export function DocsSidebar({ config, navigation, currentPath }: Props) {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <>
+      {/* Mobile Menu Button */}
+      <Button
+        variant="ghost"
+        size="icon"
+        className="md:hidden h-8 w-8 p-0"
+        onClick={() => setIsOpen(!isOpen)}
+      >
+        {isOpen ? <X className="h-4 w-4" /> : <Menu className="h-4 w-4" />}
+      </Button>
+
+      {/* Mobile Navigation Portal */}
+      {isOpen && (
+        <>
+          {/* Overlay */}
+          <div
+            className="fixed inset-0 bg-black/50 z-50"
+            onClick={() => setIsOpen(false)}
+          />
+
+          {/* Sidebar */}
+          <div
+            className="
+              fixed inset-y-0 left-0 z-50
+              w-64 
+              bg-gray-900
+              overflow-y-auto
+              p-4
+            "
+          >
+            <nav>
+              {navigation.map((section) => (
+                <div key={section.group} className="mb-8">
+                  <h5 className="mb-2 text-sm font-semibold text-gray-400">
+                    {section.group}
+                  </h5>
+                  <ul className="space-y-1.5">
+                    {section.pages.map((page) => {
+                      const IconComponent = page.icon
+                        ? iconMap[page.icon]
+                        : null;
+                      return (
+                        <li key={page.slug}>
+                          {page.isExternal ? (
+                            <a
+                              href={page.slug}
+                              target="_blank"
+                              rel="noopener noreferrer"
+                              className="flex items-center gap-2 text-sm text-gray-400 hover:text-white hover:bg-gray-800 rounded-md p-1.5 transition-all"
+                            >
+                              {IconComponent && (
+                                <div className="p-1 border border-gray-700 rounded-md">
+                                  <IconComponent className="w-4 h-4" />
+                                </div>
+                              )}
+                              {page.title}
+                            </a>
+                          ) : (
+                            <Link
+                              href={config.basePath + `/${page.slug}`}
+                              className={cn(
+                                "block text-sm text-gray-400 hover:text-white hover:bg-gray-800 rounded-md p-1.5 transition-all",
+                                currentPath === config.basePath + `/${page.slug}` &&
+                                "text-white bg-gray-800"
+                              )}
+                              onClick={() => setIsOpen(false)}
+                            >
+                              {page.title}
+                            </Link>
+                          )}
+                        </li>
+                      );
+                    })}
+                  </ul>
+                </div>
+              ))}
+            </nav>
+          </div>
+        </>
+      )}
+
+      {/* Desktop Navigation */}
+      <div className="hidden md:block">
+        <nav>
+          {navigation.map((section) => (
+            <div key={section.group} className="mb-8">
+              <h5 className="mb-2 text-sm font-semibold text-gray-400">
+                {section.group}
+              </h5>
+              <ul className="space-y-1.5">
+                {section.pages.map((page) => {
+                  const IconComponent = page.icon ? iconMap[page.icon] : null;
+                  return (
+                    <li key={page.slug}>
+                      {page.isExternal ? (
+                        <a
+                          href={page.slug}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="flex items-center gap-2 text-sm text-gray-400 hover:text-white hover:bg-gray-800 rounded-md p-1.5 transition-all"
+                        >
+                          {IconComponent && (
+                            <div className="p-1 border border-gray-700 rounded-md">
+                              <IconComponent className="w-4 h-4" />
+                            </div>
+                          )}
+                          {page.title}
+                        </a>
+                      ) : (
+                        <Link
+                          href={`${config.basePath}/${page.slug}`}
+                          className={cn(
+                            "block text-sm text-gray-400 hover:text-white hover:bg-gray-800 rounded-md p-1.5 transition-all",
+                            currentPath === `${config.basePath}/${page.slug}` &&
+                            "text-white bg-gray-800"
+                          )}
+                        >
+                          {page.title}
+                        </Link>
+                      )}
+                    </li>
+                  );
+                })}
+              </ul>
+            </div>
+          ))}
+        </nav>
+      </div>
+    </>
+  );
+}